Z@charset "utf-8";

body{
	font-size: 16px;
	font-family:"メイリオ", "Yu Gothic", YuGothic, "游ゴシック体", "游ゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-family: 'Open Sans', sans-serif;	/*800*/
	font-family: 'Noto Sans JP', sans-serif; /*Light300 Bold700*/
	line-height: 1.7em;
}
@media screen and ( max-width:479px )
{
	body{
		font-size: 14px;
	}
}

/*=============　共通スタイル　=============*/


/*PC-SMP 表示・非表示*/
@media screen and ( max-width:540px )
{
	.spnone {display:none;}
}
@media screen and ( min-width:541px )
{
	.pcnone {display:none;}
}



/*=============　fullOverlay　=============*/

#fullOverlay{
	position: fixed;
	left: 0; top: 0;
	width: 100%; height: 100%;
	background: rgba(0, 0, 0, .6);
	z-index: 2147483647;
}
#fullOverlay .text{
	position: fixed;
	left: 50%; top: 50%;
	width: 80%; padding: 15%;
	transform: translate(-50%, -50%);
	color: rgba(250, 250, 250, 1);
	font-size: 24px; text-align: center; font-family: 'Open Sans', sans-serif;
	background: rgba(0, 0, 0, .6);
	line-height: 1.5em;
}

#fullOverlay h2{
	font-size:160%; font-weight: 800;
	margin-bottom: 15px;
}

/*=============　fullOverlay smp　=============*/

@media screen and ( max-width:820px )
{
	#fullOverlay h2{font-size:30px;}
}

@media screen and ( max-width:540px )
{
	#fullOverlay h2{font-size:18px;}
	#fullOverlay p{font-size:15px;}
	#fullOverlay .text{	padding: 40% 5%; line-height: 1.0em;}
	
}



/*=============　vision　=============*/

#vision { height: 100vh; width: 100%; background:#206973; display: flex; align-items: center;}
#vision h1{ text-align: center; width: 50%; margin: auto;}
#vision p{ margin-bottom: 20px; color: #D3C6AD; font-weight: 700; font-size: 1.5em;}
#vision h1 img{ width: 100%; height: auto; margin: auto;}
#vision h1 img.vision_icon{ width: 150px; height: auto; margin: 20px 0 0 10px;}


/*=============　vision smp　=============*/
@media screen and ( max-width:820px )
{
	#vision h1{ width: 90%;}
	#vision p{ line-height: 1.8em;}
}

@media screen and ( max-width:540px )
{
	#vision { height: 95vh;}
	#vision p{ font-size: 0.9em;}
}




/*=============　news　=============*/
#news { padding: 8vh 0; background: #D3C6AD; color: #206973;}
#news div.news_title {
	width: 820px; margin: auto; padding-bottom: 15px;
	text-align: left;  font-weight: 700; line-height: 2.5em; font-size: 1.1em;
	border-bottom: 4px solid #206973;}
#news div.news_title h2{
	margin-left: 10px; font-size: 2.5em; font-family: 'Open Sans', sans-serif; }

#news div.news_con{ width: 820px; margin: 15px auto auto auto; display: flex; justify-content: space-between; flex-wrap:wrap;}
#news div.news_con dl{ width: 400px; margin-top: 20px; display: flex;}
#news div.news_con dt{ font-weight: normal; font-size: 14px;}
#news div.news_con img{ width: 130px; margin-right: 15px;}



/*=============　news smp　=============*/
@media screen and ( max-width: 820px )
{
	#news div.news_title { width: 100%; text-align: left;}
	#news div.news_con dl{ width: 48%;}
	#news div.news_con{ width: 90%;}
}
@media screen and ( max-width: 540px )
{
	#news div.news_con dl{ width: 100%;}
	
}




/*=============　camp　=============*/
#camp { padding: 1vh 0 8vh 0; background: #206973; color: #D3C6AD;}
#camp div.camp_con{ width: 90%; margin: 15px auto auto auto; display: flex; justify-content: space-between; flex-wrap:wrap;}
#camp div.camp_con div{ width: 31%;}

#camp h2{ margin-top: 40px; margin-bottom: 20px; font-size: 2.5em; font-family: 'Open Sans', sans-serif; padding-bottom: 15px; border-bottom: 4px solid #D3C6AD; }
#camp li{ list-style-type: disc; margin: 0 0 0 20px; line-height: 2.0em;}
#camp li p{ font-weight: 700;}
#camp li span{ padding: 5px 7px; background: #D3C6AD; color: #206973; border-radius: 10px; font-size: 0.9em;}
#camp img{ width: 100%; margin-top: 10px;}
#camp img.img_top{ margin-top: 20px;}

@media screen and ( max-width: 820px )
{
	#camp div.camp_con div{ width: 100%;}
	#camp img{ width: 45%; margin-right: 10px;}
	
	div.item01 {order: 1;} 
	div.item02 {order: 2;} 
	div.item03 {order: 3;} 
	div.item04 {order: 4;} 	
	div.item05 {order: 5;} 	
	div.item06 {order: 6;} 	
}

@media screen and ( max-width: 540px )
{
	#camp img{ width: 100%; margin-right: 0;}
}




/*=============　lineup　=============*/
#lineup { padding: 8vh 0; background: #D3C6AD; color: #206973;}
#lineup div.lineup_title {
	width: 820px; margin: auto; padding-bottom: 15px;
	text-align: left;  font-weight: 700; line-height: 2.5em; font-size: 1.1em;
	border-bottom: 4px solid #206973;}
#lineup div.lineup_title h2{
	margin-left: 10px; font-size: 2.5em; font-family: 'Open Sans', sans-serif; }

#lineup div.lineup_title_sub { width: 820px; margin: 30px auto 0 auto; text-align: center; }
#lineup div.lineup_title_sub h3 { 
	font-weight: 700; font-size: 1.4em; margin-top: 30px;
	border: 1px solid #206973; padding: 20px 0;
}

#lineup div.lineup_title_con { 
	width: 820px; margin: 30px auto 0 auto;
	display: flex; justify-content: space-between; flex-wrap:wrap;
	text-align: center;}
#lineup div.lineup_title_con dl{ width: 32%; margin-top: 10px;}
#lineup div.lineup_title_con dt img{ width: 100%;}
#lineup div.lineup_title_con dd{ margin-top: 10px; font-weight: 700; font-size: 1.2em; line-height: 30px;} 
#lineup div.lineup_title_con dd img{ height: 30px; margin-left: 10px;} 

#lineup div.lineup_title_con_sub { width: 820px; margin: 50px auto 0 auto; text-align: center;}
#lineup div.lineup_title_con_sub ul { display: flex; justify-content: space-between; flex-wrap:wrap;  }
#lineup div.lineup_title_con_sub li {  font-weight: 700; font-size: 1.3em; line-height: 25px; width: 32%; margin-top: 40px;}
#lineup div.lineup_title_con_sub img { height: 25px; margin-left: 10px;}
#lineup div.lineup_title_con_sub a:hover { opacity: 0.8;}

#lineup div.lineup_logo { width: 820px; margin: 30px auto 0 auto; text-align: right;}
#lineup div.lineup_logo img{ width: 20%;}



@media screen and ( max-width:820px )
{
	#lineup div.lineup_title {  width: 100%; text-align: left}
	#lineup div.lineup_title_sub { width: 90%;}

	#lineup div.lineup_title_con { width: 90%; }

	#lineup div.lineup_title_con_sub { width: 90%; }
	
	#lineup div.lineup_logo { width: 90%;}
	#lineup div.lineup_logo img{ width: 30%;}
}

@media screen and ( max-width:540px ){
	#lineup div.lineup_title_con dl{ width: 100%;}
	#lineup div.lineup_title_con_sub li { width: 100%; margin-top: 40px; line-height: 20px;}
	#lineup div.lineup_title_con_sub img { height: 20px; margin-left: 10px;}
	#lineup div.lineup_logo img{ width: 35%;}
}



/*=============　about　=============*/
/*
#about {padding: 8vh 0; background: #ffffff; color: #206973;}
#about div.about_title {
	width: 330px; margin: auto;
	text-align: center;  font-weight: bold; line-height: 2.5em; font-size: 1.1em;
}
#about div.about_title h2{
	margin-top: 25px;
	font-size: 2.5em; font-family: 'Open Sans', sans-serif;
}
#about div.about_title img{ width: 100%;}

#about div.about_title_sub { width: 90%; margin: 30px auto 0 auto; text-align: center;}
#about div.about_title_sub h3 { font-weight: 700; font-size: 1.4em;}
#about div.about_title_sub p { margin-top: 20px;}

#about div.about_con { width: 100%; background: #f3efe4; padding: 30px; margin: 30px auto 0 auto; text-align: center;}
#about div.about_con img{ width: 30%; background: #f3efe4; text-align: center;}

#about div.about_date{ width: 400px; margin: 30px auto 0 auto;}

#about div.about_ft{ width: 600px; margin: 30px auto 0 auto;}
#about div.about_ft img{ width: 100%;}
#about div.about_ft p{ width: 400px; margin: 20px auto 0 auto; font-size: 0.9em;}
*/

/*=============　about smp　=============*/
/*
@media screen and ( max-width: 540px )
{
	#about div.about_title { width: 250px;}
	#about div.about_con img { width: 80%;}
	#about div.about_date{ width: 90%;}
	#about div.about_ft{ width: 90%;}
	#about div.about_ft p{ width: 90%;}
}
*/



/*=============　access　=============*/
#access {padding: 8vh 0; background: #206973; color: #D3C6AD;}
#access div.access_title {
	width: 820px; margin: auto; padding-bottom: 15px;
	text-align: left;  font-weight: bold; line-height: 2.5em; font-size: 1.1em;
	border-bottom: 4px solid #D3C6AD;}
#access div.access_title h2{
	margin-left: 10px; font-size: 2.5em; font-family: 'Open Sans', sans-serif;}
#access div.access_title h2 span{ font-size: 0.4em; font-weight: normal; font-family: 'Noto Sans JP', sans-serif;}
#access div.access_title img{ width: 100%;}

#access div.access_con {
	width: 820px; margin: 30px auto 0 auto;
	text-align: left; color: #D3C6AD;
}
#access div.access_con th{ width: 15%; padding: 5px 0;}
#access div.access_con td{ padding: 5px 0;}
#access div.access_con iframe{ width: 100%; height: 500px; margin-top: 30px;}

#access div.access_con h3{ margin-top: 30px; font-weight: 700;}
#access div.access_con li{ font-size: 0.9em;}


/*=============　access smp　=============*/

@media screen and ( max-width: 820px )
{
	#access div.access_title {width: 100%; text-align: left}
	#access div.access_con {width: 90%;}
	#access div.access_con iframe{ height: 400px;}
	#access div.access_con th{ width: 20%;}
}


/*=============　ticket　=============*/
#ticket {padding: 8vh 0; background: #D3C6AD; color: #206973;}
#ticket div.ticket_title {
	width: 820px; margin: auto; padding-bottom: 15px;
	text-align: left;  font-weight: bold; line-height: 2.5em; font-size: 1.1em; border-bottom: 4px solid #206973;
}
#ticket div.ticket_title h2{
	margin-left: 10px; font-size: 2.5em; font-family: 'Open Sans', sans-serif;}
#ticket div.ticket_title h2 span{ font-size: 0.4em; font-weight: normal; font-family: 'Noto Sans JP', sans-serif;}

#ticket div.ticket_con { width: 820px; margin: 30px auto 0 auto;}
#ticket div.ticket_con dt{ font-size: 1.1em;}
#ticket div.ticket_con dt span{ font-size: 0.8em;}
#ticket div.ticket_con dd{ margin:0 0 15px 10px;}
#ticket div.ticket_con dd{ margin:0 0 15px 10px;}
#ticket div.ticket_con a{ text-decoration-line: underline;}

#ticket div.ticket_ft { width: 820px; margin: 20px auto 0 auto;}
#ticket div.ticket_ft img{ width: 150px;}
#ticket div.ticket_ft a{ display: block; width:70%; padding: 20px; margin: 20px auto 0 auto; color: #D3C6AD; background: #206973; text-align: center; font-weight: 700;}
#ticket div.ticket_ft a:hover{ opacity: 0.8;}

/*=============　ticket smp　=============*/
@media screen and ( max-width: 820px )
{
	#ticket div.ticket_title {width: 100%;}
	#ticket div.ticket_con { width: 90%;}
	#ticket div.ticket_ft { width: 90%;}
}

@media screen and ( max-width: 540px )
{
	#ticket div.ticket_title h2{ line-height: 0.5em;}
	#ticket div.ticket_ft img{ width: 30%;}
	#ticket div.ticket_ft a{ width:90%;}
}



/*=============　guide　=============*/
#guide {padding: 8vh 0; background: #206973; color: #D3C6AD;}
#guide div.guide_title {
	width: 820px; margin: auto; padding-bottom: 15px;
	text-align: left;  font-weight: bold; line-height: 2.5em; font-size: 1.1em; border-bottom: 4px solid #D3C6AD;
}
#guide div.guide_title h2{
	margin-left: 10px; font-size: 2.5em; font-family: 'Open Sans', sans-serif;}
#guide div.guide_title h2 span{ font-size: 0.4em; font-weight: normal; font-family: 'Noto Sans JP', sans-serif;}

#guide div.guide_con { width: 820px; margin: 30px auto 0 auto;}
#guide div.guide_con ul{ margin-left: 25px; list-style-type: square;}

/*=============　guide smp　=============*/
@media screen and ( max-width: 820px )
{
	#guide div.guide_title {width: 100%;}
	#guide div.guide_con { width: 90%;}
}




/*=============　フッター　=============*/
footer { padding: 8vh 0; background: #D3C6AD; color: #206973; text-align: center;}
footer div.footer_icon { margin-top: 30px;}
footer div.footer_icon img{ height: 50px; margin: 0 20px;}
footer div.footer_icon a:hover{ opacity: 0.8;}
footer div.footer_logo { margin-top: 30px;}
footer div.footer_logo img{ width: 400px;}
footer div.footer_cr { margin-top: 30px;}
footer div.footer_cr img{ width: 150px;}

@media screen and ( max-width: 540px )
{
	footer div.footer_icon img{ height: 35px; margin: 0 15px;}
	footer div.footer_logo img{ width: 300px;}
	footer div.footer_cr img{ width: 100px;}
}




/*=============　アニメーション　=============*/


/* ----------メインビジュアル---------- */
/*==================================================
スタート時は要素自体を透過0にするためのopacity:0;を指定する
===================================*/

.box{
  opacity: 0;
}

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

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

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

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


/* ----------コンテンツ透明度が変化---------- */
/* 画面外 */
.fade-block {
  opacity: .1;
  transition: all 1s;
}
/* 画面に入った時の動き */
.fade-block.blockIn {
  opacity: 1;
}




/*=============　ページトップ　=============*/
#page_top{
  width: 60px;
  height: 60px;
  position: fixed;
  right: 0;
  bottom: 0;
  opacity: 0.6;
}
#page_top a{
  width: 60px;
  height: 60px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f139';
  font-size: 50px;
  color: #000;
}