@charset "UTF-8";
/* 貧からふわっと */
.fadeDown{
animation-name:fadeDownAnime;
animation-duration:1.5s;
animation-fill-mode:forwards;
opacity:0;
}
@keyframes fadeDownAnime{
  from {
    opacity: 0;
	transform: translateY(-4rem);
  }
  to {
    opacity: 1;
	transform: translateY(0);
  }
}
/* 和からふわっと */
.fadeUp--01{
animation-name:fadeUpAnime--01;
animation-duration:2s;
animation-fill-mode:forwards;
opacity:0;
}
@keyframes fadeUpAnime--01{
  from {
    opacity: 0;
	transform: translateY(0.5rem);
  }
  to {
    opacity: 1;
	transform: translateY(0);
  }
}
.fadeUp--02{
animation-name:fadeUpAnime--02;
animation-duration:3s;
animation-fill-mode:forwards;
opacity:0;
	
}
@keyframes fadeUpAnime--02{
  from {
    opacity: 0;
	transform: translateY(2rem);
  }
  to {
    opacity: 1;
	transform: translateY(0);
  }
}

/* アニメ�`ションスタ�`トの�W决�r�gを�QめるCSS*/

.delay-time02{
animation-delay: 0.5s;
}

.delay-time04{
animation-delay: 1s;
}

/*==================================================
スタ�`ト�rは勣殆徭悶を邑�^0にするためのopacity:0;を峺協する
===================================*/

.box{
	opacity: 0;
}

/*==================================================
�咾�徭悶の峺協�砂饂悗蓮犬佞錣叩�
===================================*/
.fadeUp {
animation-name:fadeUpAnime;
animation-duration:2s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes fadeUpAnime{
  from {
    opacity: 0;
	transform: translateY(100px);
  }

  to {
    opacity: 1;
	transform: translateY(0);
  }
}

/* ハンバ�`ガ�`メニュ�`
 ====================================================*/
#g-nav{
    /*position:fixed;にし、z-indexの方�､魎鵑�くして念中へ*/
    position:fixed;
    z-index: 999;
    /*ナビのスタ�`ト了崔と侘彜*/
	bottom:-120%;
    left:50%;
	width:100%;
    height: 100vh;/*ナビの互さ*/
	background:#5babd5;
    /*�咾�*/
	transition: all 0.6s;
}
@media screen and (max-width: 767px) {
#g-nav{
    left:0;
}
#g-nav.panelactive #g-nav-list{
    width: 100% !important;
}
}

/*アクティブクラスがついたら了崔を0に*/
#g-nav.panelactive{
    bottom: 0;
}

/*ナビゲ�`ションの�kスクロ�`ル*/
#g-nav.panelactive #g-nav-list{
    /*ナビの方が��えた��栽�kスクロ�`ル*/
    position: fixed;
    z-index: 999; 
    width: 50%;
    height: 100vh;/*燕幣する互さ*/
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

/*ナビゲ�`ション*/
#g-nav ul {
    /*ナビゲ�`ション爺仇嶄刹�Bえ*/
    position: absolute;
    z-index: 999;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
	width: 80%;/*ハンバ�`ガ�`メニュ�`喘*/
	font-size: 0.20rem;
}

/*リストのレイアウト�O協*/
#g-nav li{
	list-style: none;
    text-align: left; 
	border-bottom: 1px solid #fff;
}

#g-nav li a{
	color: #fff;
	text-decoration: none;
	padding:10px;
	display: block;
	letter-spacing: 0.1em;
	font-weight: bold;
}

/*========= ボタンのためのCSS ===============*/
.openbtn{
	position: relative;
    z-index: 9999;/*ボタンを恷念中に*/
	cursor: pointer;
    width: 1rem;
    height:1rem;
}
.openbtn_pc.active{
	position: absolute;
    z-index: 9999;/*ボタンを恷念中に*/
	cursor: pointer;
    width: 1rem;
    height:1rem;
	right: 0.2rem;
    bottom: 0.1rem;
}
	
/*〜に�篁�*/	
.openbtn span{
    display: inline-block;
	transition: all .4s;
	position: absolute;
	left: 0.2rem;
	height: 0.02rem;
	border-radius: 2px;
	background-color: #fff;
	width: 60%;
  }
.openbtn span:nth-of-type(1) {top:40px;}
.openbtn span:nth-of-type(2) {top:50px;}
.openbtn span:nth-of-type(3) {top:60px;}
.openbtn.active span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    transform: translateY(6px) rotate(-45deg);
    width: 70%;
}
.openbtn.active span:nth-of-type(2) {
	opacity: 0;
}
.openbtn.active span:nth-of-type(3){
    top: 30px;
    left: 18px;
    transform: translateY(-6px) rotate(45deg);
    width: 70%;
}

@media screen and (max-width: 767px) {
.openbtn {
  width: 100%;
  height: 100%;
}
.openbtn_pc.active {
  width: 0.5rem;
height: 0.5rem;
right: 0.15rem;
bottom: auto;
top: 0.05rem;
}
.openbtn span:nth-of-type(1) {top:20px;}
.openbtn span:nth-of-type(2) {top:30px;}
.openbtn span:nth-of-type(3) {top:40px;}

.openbtn span {
  left: 0.15rem;
  height: 0.02rem;
}
.openbtn.active span:nth-of-type(1) {
  top: 18px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 80%;
}
.openbtn.active span:nth-of-type(3) {
  top: 30px;
  left: 18px;
  transform: translateY(-6px) rotate(45deg);
  width: 80%;
}
}


/* 畠慌宥　恣から嘘尚弼が
 ====================================================*/
.bgextend{
	animation-name:bgextendAnimeBase;
	animation-duration:1s;
	animation-fill-mode:forwards;
	position: relative;
	overflow: hidden;/*　はみ竃た弼勣殆を�Lす　*/
	opacity:0;
}

@keyframes bgextendAnimeBase{
  from {
    opacity:0;
  }

  to {
    opacity:1;  
}
}

/*嶄の勣殆*/
.bgappear{
	animation-name:bgextendAnimeSecond;
	animation-duration:1s;
	animation-delay: 0.6s;
	animation-fill-mode:forwards;
	opacity: 0;
}

@keyframes bgextendAnimeSecond{
	0% {
	opacity: 0;
	}
	100% {
	opacity: 1;
}
}

/*恣から嘔*/
.bgLRextend::before{
	animation-name:bgLRextendAnime;
	animation-duration:1s;
	animation-fill-mode:forwards;
    content: "";
    position: absolute;
	left:0rem;
	top:0;
    width: 100%;
    height: 100%;
    background-color: var(--dark);/*阜びる嘘尚弼の�O協*/
}
@keyframes bgLRextendAnime{
	0% {
		transform-origin:left;
		transform:scaleX(0);
	}
	50% {
		transform-origin:left;
		transform:scaleX(1);
	}
	50.001% {
		transform-origin:right;
	}
	100% {
		transform-origin:right;
		transform:scaleX(0);
	}
}

/* スクロ�`ルをしたら竃�Fする勣殆にはじめに邑�^0を峺協　*/
.bgappearTrigger,
.bgLRextendTrigger{
    opacity: 0;
}

/*========= ナビゲ�`ションドロップダウンのためのCSS ===============*/

/*==ナビゲ�`ション畠悶の�O協*/
#nav{
width: 1.95rem;/*#navの翌�箸�headerなどに罪嫌を峺協する��栽は��茅してください*/
}

#nav ul.header_nav_list{
	list-style: none;
}

/*和の�A�咾�ulや文咫の児泣にするためliにrelativeを峺協*/
#nav ul.header_nav_list li:last-child{
	border-bottom: transparent;
}
#nav ul.header_nav_list li,
#nav ul.header_nav_list li.border_on{
	position: relative;
	border-bottom: 0.01rem solid #fff;
}

/*ナビゲ�`ションのリンク�O協*/
#nav ul.header_nav_list li a{
	display: block;
	text-decoration: none;
	color: #fff;
	padding: 0.1rem;
	transition:all .3s;
}

#nav ul.header_nav_list li a:hover{
	background-color: #024391;
opacity: 1;
}

/*==文咫の�O協*/

/*2�A�喞燭魍屬�liの文咫の�O協*/
#nav ul.header_nav_list li:before{
	content:'';
	position: absolute;
	right: 0.1rem;
	top: 48%;
	width:6px;
	height:6px;
	border-top: 2px solid #fff;
    border-right:2px solid #fff;
    transform: rotate(45deg);
}

/*3�A�喞燭魍屬�liの文咫の�O協*/
#nav ul.header_nav_list ul li.has-child::before{
	content:'';
	position: absolute;
	right: 0.1rem;
	top: 49%;
	width:6px;
	height:6px;
    border-top: 2px solid #fff;
    border-right:2px solid #fff;
    transform: rotate(45deg);
}

/*== 2?3�A�喞燭旅架��O協 */

/*和の�A�咾魍屬辰討い�ulの峺協*/
#nav li.has-child ul{
    /*�~��塘崔で了崔を峺協*/
	position: absolute;
	left:100%;
	top: 0rem;
	z-index: 4;
    /*侘彜を峺協*/
	background: var(--light);
	width: 3.2rem;
    /*はじめは掲燕幣*/
	visibility: hidden;
	opacity: 0;
    /*アニメ�`ション�O協*/
	transition: all .3s;
}

#nav li.has-child ul.about{
	top: -0.2rem;
}
#nav li.has-child ul.academics--01{
	top: -0.5rem;
}
#nav ul.header_nav_list ul.about li,
#nav ul.header_nav_list ul.academics--01 li{
	line-height: 1.3;
}

/*hoverしたら燕幣*/
#nav li.has-child:hover > ul,
#nav li.has-child ul li:hover > ul,
#nav li.has-child:active > ul,
#nav li.has-child ul li:active > ul{
  visibility: visible;
  opacity: 1;
}

/*ナビゲ�`ションaタグの侘彜*/
#nav li.has-child ul li a{
	color: #fff;
	border-bottom:solid 1px rgba(255,255,255,0.6);
}

#nav li.has-child ul li:last-child a{
	border-bottom:none;
}

#nav li.has-child ul li a:hover,
#nav li.has-child ul li a:active{
	background:#399cd0;
}

/*==3�A�喞�*/

/*3�A�喞燭領志�*/
#nav li.has-child ul ul{
	top:0;
	left: 3.2rem;
	background:#66ADF5;
}

#nav li.has-child ul ul li a:hover,
#nav li.has-child ul ul li a:active{
	background:#448ED3;
}

/*==768px參和の侘彜*/

@media screen and (max-width:768px){
	#nav{
		background:#333;
		color: #fff;
	}
	
	#nav li.has-child ul,
	#nav li.has-child ul ul{
  	position: relative;
	left:0;
	top:0;
	width:100%;
	visibility:visible;/*JSで崙囮するため匯稀燕幣*/
	opacity:1;/*JSで崙囮するため匯稀燕幣*/
	display: none;/*JSのslidetoggleで燕幣させるため掲燕幣に*/
	transition:none;/*JSで崙囮するためCSSのアニメ�`ションを俳る*/
}

#nav ul li a{
	border-bottom:1px solid #ccc;
	color: #fff;
}

/*文咫の�鬚�*/
#nav ul li.has-child::before,
#nav ul ul li.has-child::before{
    transform: rotate(135deg);
	left:20px;
}
    
#nav ul li.has-child.active::before{
    transform: rotate(-45deg);
}
}


/*==================================================
ふわっ
===================================*/
/* fadeUp */

.fadeUp{
animation-name:fadeUpAnime;
animation-duration:1.5s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(50px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}


/* スクロ�`ルをしたら竃�Fする勣殆にはじめに邑�^0を峺協　*/
 
.fadeUpTrigger{
    opacity: 0;
}


/* Eventsペ�`ジのスライダ�`
 ====================================================*/
/*鮫�颪虜畄�を100%にしてレスポンシブ晒*/
.events_gallery img{
	width: 100%;
	height: auto;
	vertical-align: bottom;/*鮫�颪力造砲任�る噫易を��茅*/
}

/*メイン鮫�駭造睦牋廚鬚弔韻�*/
.gallery{
	margin:0 0 5px 0;
}

.gallery li{
list-style:none;
}
/*文咫の�O協*/

/*��る、肝へ文咫の了崔*/
.slick-prev, 
.slick-next {
    position: absolute;/*�~��塘崔にする*/
	z-index: 3;
    top: 42%;
    cursor: pointer;/*マウスカ�`ソルを峺マ�`クに*/
    outline: none;/*クリックをしたら竃てくる����を��す*/
    border-top: 2px solid #ccc;/*文咫の弼*/
    border-right: 2px solid #ccc;/*文咫の弼*/
    height: 25px;
    width: 25px;
}

.slick-prev {/*��る文咫の了崔と侘彜*/
    left:2.5%;
    transform: rotate(-135deg);
}

.slick-next {/*肝へ文咫の了崔と侘彜*/
    right:2.5%;
    transform: rotate(45deg);
}

/*�x�kするサムネイル鮫�颪淋O協*/

.choice-btn li{
	cursor: pointer;
	outline: none;
	background:#333;
list-style:none;
}

.choice-btn li img{
	opacity: 0.4;/*�x�kされていないものは邑�^40%*/
}

.choice-btn li.slick-current img{
	opacity: 1;/*�x�kされているものは邑�^しない*/
}



/* ハンバ�`ガ�`メニュ�`のアコ�`ディオン
 ====================================================*/
/* FAQタイプ
 ====================================================*/
.faq-wrap{
	margin: 0.3rem auto;
}
.faq-wrap h3{
	margin: 0.5rem auto 0.1rem;
}
.faq-ac > li {
  /* margin-bottomにすると�笋��咾�をするのでpaddingにする */
  /*padding-bottom: 6px; */
  list-style: none;
}
.faq-ac-label  {
  cursor: pointer;
  position: relative;
	padding: 10px;
	
}
.faq-ac-content {
  display: none;
}
.faq-ac span img{
	vertical-align:middle;
	margin-right: 0.2rem;
}

.faq-ac p{
	padding-left: 0.3rem;
	font-size: 0.20rem !important;
	font-weight: 700;
}
/* .ac-labelを�H勣殆としてアイコン了崔を�~���､盃原� */
.faq-icon-wrap {
  position: absolute;
  right: 5px;
  top: 50%;
  transform: translatey(-50%);
  width: 38px;
  height: 38px;
}
.faq-ac-label p{
	color: #fff;
}
.faq-ac-item{
	border: none;
}
.faq-ac-item--02 p{
	font-size: 0.16rem !important;
	font-weight: normal;
	padding: 0rem 0 0 0.3rem !important;
	line-height: 1.3;
	text-indent: -1em;
	margin-left: 1em;
}
.faq-ac-item--02 a{
	font-weight: normal !important;
	padding: 0.05rem 0.1rem 0.05rem 0 !important;
}
/* .icon-wrapの嶄でプラスを嶄刹に了崔させるために.iconを�H勣殆に�O協 */
.icon {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 100%;
}
/* プラスアイコン */
/* ２云の��を.icon-wrapの嶄刹に�K佩に嶷ねる */
.icon:before,
.icon:after {
  position: absolute;
  content: "";
  display: block;
  transition: all 0.4s;
  background: #fff;
  left: 50%;
  top: 50%;
  width: 50%;
  height: 2px;
  transform: translate(-50%, -50%);
}
/* そのうち1云を�kにする */
.icon:before {
  transform: translate(-50%, -50%) rotate(90deg);
}

/* プラスアイコンクリック瘁、マイナスにする */
.icon.open:before {
  transform: translate(-50%, -50%) rotate(0deg);
}


/* 嘔に�咾�文咫
 ====================================================*/
/* ボタン慌宥�O協 */
.btn06{
    /*文咫の児泣とするためrelativeを峺協*/
	position: relative;
    /*ボタンの侘彜*/
	text-decoration: none;
	display: inline-block;
	background:#fff;
	color: var(--dark);
    padding: 10px 40px 10px 30px;
	border-radius: 0.1rem;
    text-align: center;
    outline: none;
    /*アニメ�`ションの峺協*/
    transition: ease .2s;
}

.btn06:hover{
}


/* 文咫が嘔に卞�� */

.btnarrow1::after{
    content: '';
    /*�~��塘崔で文咫の了崔を�Qめる*/
	position: absolute;
    top:42%;
    right: 13px;
    /*文咫の侘彜*/
    width: 5px;
    height: 5px;
    border-top: 2px solid var(--dark);
border-right: 2px solid var(--dark);
    transform: rotate(45deg);
    /*アニメ�`ションの峺協*/
    transition: all .3s;
}

/*hoverした�Hの卞��*/
.btnarrow1:hover::after{
    right: 11px;
}