@charset "utf-8";

/* ------------------------------------------------------------ 検索部分 */

#search_list p.empty { font-size: 20px; font-weight: bold; text-align: center; padding: 60px 0 0; }
#news p.empty { font-size: 16px; font-weight: bold; text-align: center; }

#search_list .rotate {
	position: relative;
	width: 96px;
	height: 96px;
	margin: 60px auto 0;
	animation: rotation 1s linear infinite;
	pointer-events: none;
}

@keyframes rotation {
	0% { transform: rotate(360deg); }
	100% { transform: rotate(0deg); }
}

#search_list .loader {
  width: 48px;
  height: 48px;
  display: block;
  margin: 20px auto;
  position: absolute;
  top: 0;
  right: 0;
  border: 3px solid #ae8400;
  border-radius: 50%;
  box-sizing: border-box;
  animation: animloader 1s linear infinite;
}
#search_list .loader::after {
  content: '';  
  box-sizing: border-box;
  width: 6px;
  height: 24px;
  background: #ae8400;
  transform: rotate(-45deg);
  position: absolute;
  bottom: -20px;
  left: 46px;
}

@keyframes animloader {
  0% 	{ transform: rotate(0deg); }
  100% 	{ transform: rotate(360deg); }
}


/* ------------------------------------------------------------ fv */
#fv { }

#fv .slider { z-index: 1;}
#fv .slide { position: relative; text-align: center;}
#fv .slide .bg { width: 100%; height: auto;}
#fv .slide .title { display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);}
#fv .slick-prev,
#fv .slick-next { width: 50px; height: 127px;}
#fv .slick-arrow:before{ content:""!important; width: 50px!important; height: 127px!important; position: absolute; top: 0; left: 0;}
#fv .slick-next:before{ background: url(../images/arrow_fv2.png) no-repeat!important; background-size: 100%!important;}
#fv .slick-prev:before{ background: url(../images/arrow_fv1.png) no-repeat!important; background-size: 100%!important;}
#fv .slide-dots { margin: 0; padding: 0; text-align: center; position: absolute; bottom: 40px; left: 50%; transform: translateX(-50%); 
-webkit-transform: translateX(-50%);}
#fv .slide-dots li { display: inline-block; margin: 0 10px;}
#fv .slide-dots li button { position: relative; text-indent: -9999px;}
#fv .slide-dots li button::before { position: absolute; content: ""; cursor: pointer; width: 20px; height: 20px; border: 2px solid #fff; border-radius: 50%; top: 0; left: 0;}
#fv .slide-dots li.slick-active button::before { background: #fff;}
#fv button { background: none; border: none; outline: none; padding: 0 7px;}

#fv h2{ position: absolute; top: 50%; left: 50%; translate: -50% -50%; width: 100%; font-size: 100px; text-align: center; text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5); color: #fff; line-height: 120%; }
#fv h2 strong{  font-weight: 700; }
/* #fv h2 span{ display: block; padding: 10px 0 0; font-size: 50px; font-family: 'Apple-Chancery'; } */
#fv h2 img{ width: 500px; height: auto; margin: 0 auto; }

#welcome { display: none; height: 100vh; position: fixed; top: 0; width: 100%; z-index: 999999; background: rgba(0,0,0,0.8);}
#welcome .close-btn{ text-align: right; text-decoration: none; font-size: 50px; color: #666; padding: 20px;}
#welcome .modal { position: absolute; width: 1100px; background: #fff; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);}

#welcome .modal .iframeWraper { position: relative; padding-bottom: 56.25%; overflow: hidden;}
#welcome .modal .iframeWraper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

/* ------------------------------------------------------------ economical */

#economical { padding: 50px 0; background: url(../images/bg_pattern.png) repeat left top; background-color: #e7c66f; background-size: 101px;}
#economical h3 { position: relative; text-align: center; font-size: 40px; margin: 0 0 45px; font-weight: 700;}
#economical h3:after,
#economical h3:before{ position: absolute; content: ""; bottom: 0; width: 2px; height: 40px; background: #000; }
#economical h3:after{ rotate: -45deg; left: calc(50% - 250px); }
#economical h3:before{ rotate: 45deg; left: calc(50% + 250px); }
#economical .flex { display: flex; justify-content: center; align-items: center;}
#economical .flex a { display: block; width: 500px; margin: 0 20px; }
#economical .flex a img { width: 100%; height: auto;}

/* ------------------------------------------------------------ about */

#about { overflow: hidden; background: url(../images/bg_abo_08.png) no-repeat center -110px / 1819px, url(../images/bg_abo_01.webp) no-repeat center top /cover;  padding: 109px 0;}
#about .bg { background: url(../images/bg_abo_07.png) no-repeat center 40px / 745px, url(../images/bg_abo_04.png) no-repeat center 702px / 1907px, url(../images/bg_abo_06.png) no-repeat 24% 1500px / 85px, url(../images/bg_abo_05.png) no-repeat 90% 1500px / 343px, ;}
#about h2 { margin: 0 auto 7px;}
#about .aoi { display: block; margin: 0 auto 24px;}


#about .about { z-index: 10; position: relative; width: 900px; margin: 0 auto; padding: 53px 50px 68px; background: url(../images/bg_prize_lt.png) no-repeat left top / 75px,url(../images/bg_prize_rt.png) no-repeat right top / 75px,url(../images/bg_prize_lb.png) no-repeat left bottom / 75px,url(../images/bg_prize_rb.png) no-repeat right bottom / 75px, url(../images/bg_grain.jpg) repeat-y center center / 100%; text-align: center;}

#about .about h3 { position: relative; font-size: 56px; font-weight: 700; letter-spacing: 0.02em; margin-bottom: 27px; font-feature-settings: "palt";}
#about .about h3:before { position: absolute; top: -30px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); content: ""; width: 100%; height: 127px; background: url(../images/abo_l.png) no-repeat left top / 153px,url(../images/abo_r.png) no-repeat right top / 147px;}
#about .about h3:after { display: block; content: ""; width: 100px; height: 4px; margin: 30px auto 0; background-color: #ae8400;} 
#about .about p { font-size: 22px; line-height: 2; text-align: start; font-feature-settings: "palt";}

#about .whitebox { position: relative; z-index: 10; padding: 0px 57px 14px;}
#about .whitebox h4 { font-size: 44px; font-weight: 700; letter-spacing: 0.02em; text-align: center; margin: -12px 0 40px;}
#about .whitebox .flex { display: flex; justify-content: space-between; flex-flow: wrap;}
#about .whitebox .flex div { width: 460px; margin-bottom: 30px;}
#about .whitebox .flex div img { margin-bottom: 24px; }
#about .whitebox .flex div h5 { font-size: 24px; font-weight: 700; color: #ae8400; margin-bottom: 12px;}
#about .whitebox .flex div p { font-size: 16px; line-height: 1.875; margin-bottom: 20px;}
#about .whitebox .flex div p a{ border-bottom: 1px solid #ae8400; }
#about .whitebox .flex div .forinfo { display: block; width: 330px; margin: auto auto 0; padding: 18px 0 20px 20px; background: url(../images/arrow_05.png) no-repeat 32% center / 11px; background-color: #ae8400; border-radius: 10px; font-size: 14px; font-weight: 400; color: #fff; text-align: center;}

.note-ttl{ width: 100%; margin-left: -10px; padding: 0 0 40px; text-align: center; }
.note-ttl .ciclettl{ position: relative; z-index: 10; font-size: 30px; font-family: a-otf-ud-shin-maru-go-pr6n, sans-serif; font-weight: 300; font-style: normal; }
.note-ttl img{ display: block; margin: 0 auto 10px; position: relative; z-index: 10; }
.note-ttl .ciclettl .topic { position: absolute; display: block; font-size: 12px; bottom: -1.5em; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); }

.map{ position: relative; margin-bottom: 80px; }
.mapimg{ position: relative; left: -23%; width: 140%; height: auto; margin: -21% auto 0; }
.map p{ position: absolute; z-index: 5; font-size: 27px; letter-spacing: 0.05em; font-family:  "ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","ＭＳ Ｐ明朝","MS PMincho","source-han-serif-cn-subset",serif; }
.map p.gold{ color: #ae8400; }
.map .map01{ bottom: 71%; left: calc(50% - 160px); }
.map .map02{ bottom: 64%; left: calc(50% + 0px); }
.map .map03{ bottom: 32%; left: calc(50% - 250px); }
.map .map04{ bottom: 26%; left: calc(50% - 240px); }
.map .map05{ bottom: 20%; left: calc(50% + 50px); }
.map .map06{ bottom: 11%; left: calc(50% - 100px); }
.map .map07{ bottom: 57%; left: calc(50% + 66px); }
.map .map08{ bottom: 40%; left: calc(50% - 280px); }
.map .map09{ bottom: 30%; left: calc(50% + 20px); }
.map .map10{ bottom: 19%; left: calc(50% - 240px);; }

.lang-ja .map p{ writing-mode: vertical-rl; font-size: 29px }
.lang-ja .map .map01{ bottom: 66%; left: calc(50% - 100px); }
.lang-ja .map .map02{ bottom: 59%; left: calc(50% - 10px); }
.lang-ja .map .map03{ bottom: 28%; left: calc(50% - 160px); }
.lang-ja .map .map04{ bottom: 19%; left: calc(50% - 80px); }
.lang-ja .map .map05{ bottom: 9%; left: calc(50% + 80px); }
.lang-ja .map .map06{ bottom: 0%; left: calc(50% - 30px); }
.lang-ja .map .map07{ bottom: 54%; left: calc(50% + 90px); }
.lang-ja .map .map08{ bottom: 40%; left: calc(50% - 140px); }
.lang-ja .map .map09{ bottom: 30%; left: calc(50% + 40px); }
.lang-ja .map .map10{ bottom: 15%; left: calc(50% - 140px); }


/* ------------------------------------------------------------ modelcourse */

#modelcourse { padding: 50px 0; background: url(../images/bg_modelcourse.jpg) center top / cover;}
#modelcourse .innerbox { width: 1050px; margin: 0 auto; }
#modelcourse .intro{ padding: 0 0 50px; text-align: center; }
#modelcourse .intro .curve{ padding-top: 70px; background: url(../images/spot_icn_01.svg) left 60px top/90px no-repeat, url(../images/spot_icn_02.svg) right 60px top/90px no-repeat; -webkit-text-stroke: 1px #fff; text-stroke: 1px #fff; font-size: 45px; color: #b78b18; font-family: "fot-tsukuardgothic-std", sans-serif; letter-spacing: -0.1em; font-weight: 800; text-shadow: 0px 4px 0px #846615; font-feature-settings: "palt"; }
#modelcourse .intro .sub-curve{ font-size: 40px; color: #f19639; font-family: "fot-tsukuardgothic-std", sans-serif; font-weight: 700; padding: 30px 0 0; }
#modelcourse .intro .descriotion { font-size: 16px; margin-top: 10px;}


#modelcourse .caption { font-size: 16px; margin-bottom: 5px;}
#modelcourse .box { width: 100%; border: 2px solid #f39800; background: #fff; margin-bottom: 20px;}
#modelcourse .box:last-child { margin-bottom: 0;}
#modelcourse .box .title { text-align: center; background: #f39800; padding: 20px 0;}
#modelcourse .box .title p { font-size: 30px; color: #fff; font-family: "fot-tsukuardgothic-std", sans-serif; font-weight: 700;}
#modelcourse .box .title p span { display: block; font-size: 20px; font-family: "fot-tsukuardgothic-std", sans-serif; font-weight: 700; margin-top: 5px;}
#modelcourse .box .schedule { width: 100%; padding: 0 10px;}
#modelcourse .box .schedule .course { /* padding: 20px 0 0; */ padding: 0; border-bottom: 1px solid #f39800;}
#modelcourse .box .schedule .course:last-child { border-bottom: 0px;}

#modelcourse .box .schedule .coursename { font-size: 30px; text-align: center; color: #f39800; font-family: "fot-tsukuardgothic-std", sans-serif; font-weight: 700; margin-bottom: 15px;}
#modelcourse .box .oneday { display: flex; align-items: baseline; flex-flow: wrap; padding: 15px 0 30px; position: relative;}
#modelcourse .box .oneday:after { content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); display: block; width: 95%; height: 2px; background-image: linear-gradient(to right, #f39800 2px, transparent 2px); background-size: 10px 2px; background-repeat: repeat-x;}
#modelcourse .box .oneday:last-child:after { display: none;}
#modelcourse .box .oneday .day { width: 70px; font-size: 20px; color: #fff; padding: 3px 0; background: #b98d18; border-radius: 20px; text-align: center; margin-right: 10px; font-family: "fot-tsukuardgothic-std", sans-serif; font-weight: 700; letter-spacing: -0.1em;}
#modelcourse .box .oneday .itinerary { display: flex; align-items: flex-start;}
#modelcourse .box .oneday .itinerary:nth-of-type(n+2) { padding-left: 80px;}
#modelcourse .box .oneday .itinerary p { position: relative; display: flex; align-items: baseline; font-size: 16px; font-family: "fot-tsukuardgothic-std", sans-serif; font-weight: 300; padding: 38px 2px 0;}
#modelcourse .box .oneday .itinerary p.goldtop { padding-top: 37px;}
#modelcourse .box .oneday .itinerary p.goldtop .time { top: 6px;}
#modelcourse .box .oneday .itinerary p.subtop { padding-top: 22px;}
#modelcourse .box .oneday .itinerary p.subtop .time { top: 29px;}
#modelcourse .box .oneday .itinerary p.ferrytop { padding-top: 14px;}
#modelcourse .box .oneday .itinerary p.ferrytop .time { top: 6px;}
#modelcourse .box .oneday .itinerary p.instatop { padding-top: 17px;}
#modelcourse .box .oneday .itinerary p.instatop .time { top: 29px;}
#modelcourse .box .oneday .itinerary p.goldtop.instatop { padding-top: 15px;}
#modelcourse .box .oneday .itinerary p.goldtop.instatop .time { top: 32px;}
#modelcourse .box .oneday .itinerary p.subtop.instatop { padding-top: 1px;}
#modelcourse .box .oneday .itinerary p.subtop.instatop .time { top: 45px;}

#modelcourse .box .oneday .itinerary p .mleft { display: inline; text-align: center;}
#modelcourse .box .oneday .itinerary p .mleft.inblock { display: inline-block; vertical-align: text-top;}
#modelcourse .box .oneday .itinerary p .mleft .spot { display: block; margin-bottom: 4px;}
#modelcourse .box .oneday .itinerary p .mleft .sub { display: block; font-size: 11px; margin-bottom: 4px;}
#modelcourse .box .oneday .itinerary p .ferry{ display: block; width: 40px; height: auto; margin: 0 auto 4px;}

#modelcourse .box .oneday .itinerary p .mleft .gold { color: #ffb700;}
#modelcourse .box .oneday .itinerary p .mleft .gold:before { content: ""; display: inline-block; width: 20px; height: 21px; background: url(../images/icn_tokugawa.svg) no-repeat center / 100%; vertical-align: -6px; margin-right: 3px;}
#modelcourse .box .oneday .itinerary p .mleft .modelimg { display: block; width: 100px; height: auto; margin: 5px auto 0;}

#modelcourse .box .oneday .itinerary p .mleft .instaspot { display: block; width: 100px; font-size: 12px; border: 1px solid #ca1e79; color: #ca1e79; line-height: 16px; margin: 0 auto 4px; text-align: center;}
#modelcourse .box .oneday .itinerary p .mleft .stay { display: block; font-size: 12px; margin: 4px 0 0;}
#modelcourse .box .oneday .itinerary .instatop .mleft { display: block;}
#modelcourse .box .oneday .itinerary p .mleft .instacap { display: flex; justify-content: center; align-items: flex-start;}
#modelcourse .box .oneday .itinerary p .mleft .instacap .group { margin-right: 5px;}
#modelcourse .box .oneday .itinerary p .mleft .instacap .cap { display: block;}

#modelcourse .box .oneday .itinerary p .mleft .double { display: block; text-align: left;}
#modelcourse .box .oneday .itinerary p .textbottom { display: block; font-size: 12px; text-align: center; padding-top: 5px; font-family: "fot-tsukuardgothic-std", sans-serif; font-weight: 300;}
#modelcourse .box .oneday .itinerary p .mleft .cap { display: block; font-size: 12px; text-align: left; padding-top: 10px; line-height: 110%;}

#modelcourse .box .oneday .itinerary p .time { position: relative; font-size: 11px; text-align: center; display: inline-block; width: 42px; top: 6px;}
#modelcourse .box .oneday .itinerary p .time:before { content: ""; position: relative; bottom: 2px; display: block; width: 34px; height: 2px; background: #c9caca; border-radius: 20px; margin: 0 5px;}
#modelcourse .box .oneday .itinerary p .time:after { content: ""; position: absolute; top: -4px; right: 2px; display: block; width: 6px; height: 6px; border-bottom: 2px solid #c9caca; border-right: 2px solid #c9caca; transform: rotate(-45deg);}
#modelcourse .box .oneday .itinerary p .time.solo:after { top: -14.5px;}
#modelcourse .box .oneday .itinerary p .time.solo:before { bottom: 12px;}




#modelcourse .box .oneday .itinerary p:after { }
#modelcourse .box .oneday .itinerary p:last-child:after { display: none;}

#modelcourse .box .accordion-header { position: relative;}
#modelcourse .box .accordion-header .plus { position: absolute; top: 50%; right: 20px; transform: translateY(-50%); -webkit-transform: translateY(-50%); width: 35px; }
#modelcourse .box .accordion-header .plus span { position: absolute; width: 100%; height: 5px; background: #fff; border-radius: 10px;}
#modelcourse .box .accordion-header .plus span:first-child { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); width: 100%; height: 5px; background: #fff; border-radius: 10px;}
#modelcourse .box .accordion-header .plus span:last-child { top: -2px; left: 0; transform: rotate(90deg); -webkit-transform: rotate(90deg); transition: 0.5s;}
#modelcourse .box .accordion-header.open .plus span:last-child { transform: rotate(180deg); -webkit-transform: rotate(180deg);}

#modelcourse .box .accordion-body { display: none;}
#modelcourse .box .accordion-body.open { display: block;}

/* ------------------------------------------------------------ photo */

#photo { background: url(../images/bg_pattern_03.jpg) repeat left top; background-size: 29px; padding-bottom: 90px;}
#photo .fv { width: 100%; height: auto; margin-bottom: 166px;}

#photo .about { position: relative; width: 100%; background: #fff; border: 4px solid rgb(22, 87, 141); border-radius: 10px; box-shadow: 5.142px 6.128px 0px 0px rgba(0, 0, 0, 0.2); padding: 57px 95px 63px; margin-bottom: 90px;}
#photo .about h3 { position: absolute; top: -100px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%);}
#photo .about img:nth-of-type(2) { margin-bottom: 16px;}
#photo .about p { font-size: 16px; margin-top: 23px;}

#photo .about h4{ position: relative; font-size: 40px; text-align: center; padding: 0 0 15px; color: #ea5420; }
#photo .about h4:before,
#photo .about h4:after{ position: absolute; content: ""; width: 90px; height: 2px; background: #ea5420; top: 25px; }
#photo .about h4:before{ left: 0; }
#photo .about h4:after{ right: 0; }

#photo .details { position: relative; width: 100%; background: #fff; border-radius: 10px; box-shadow: 5.142px 6.128px 0px 0px rgba(0, 0, 0, 0.2); padding: 65px 70px 50px; margin-bottom: 50px;}
#photo .details h4 { position: absolute; top: -35px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%);}
#photo .details table tr th,
#photo .details table tr td { padding-bottom: 30px;}
#photo .details table tr th { padding-right: 35px;}
#photo .details table tr th p { width: 200px; line-height: 40px; text-align: center; background: #ae8400; border-radius: 30px; font-size: 24px; color: #fff; letter-spacing: -0.04em; font-weight: 500;}
#photo .details table tr td { font-size: 18px; line-height: 160%;}
#photo .details table tr:last-child th,
#photo .details table tr:last-child td{ padding-bottom: 0;}

#photo .application { }
#photo .application h4 { text-align: center; margin-bottom: 50px;}
#photo .application .flex { display: flex; justify-content: space-between; margin-bottom: 40px;}
#photo .application .flex .item { position: relative; width: 260px; border: 1px solid #ae8400; background: #fff; border-radius: 25px; text-align: center; padding: 32px 0 0;}
#photo .application .flex .item .step { position: absolute; top: -30px; left: 20px; width: 63px;}
#photo .application .flex .item .main { font-size: 20px; line-height: 130%; color: #ae8400; font-weight: 500; font-feature-settings: "palt";}

#photo .application .flex .item .itemimg { }

#photo .application .flex .item:nth-of-type(1) { padding-bottom: 50px;}
#photo .application .flex .item:nth-of-type(1) .main { margin-bottom: 40px;}
#photo .application .flex .item:nth-of-type(2) { padding-bottom: 42px;}
#photo .application .flex .item:nth-of-type(2) .main { margin-bottom: 18px;}
#photo .application .flex .item:nth-of-type(2) .sub { font-size: 13px; margin-bottom: 12px;}
#photo .application .flex .item:nth-of-type(3) .main { margin-bottom: 29px;}
#photo .application .flex .item:nth-of-type(3) .sub { font-size: 12px; line-height: 150%; text-align: left; width: 82%; margin: 0 auto 22px;}
#photo .application .flex .item:nth-of-type(3) .itemimg { width: 209px; height: auto;}
#photo .application .flex .item:nth-of-type(4) { padding-bottom: 66px;}
#photo .application .flex .item:nth-of-type(4) .main { margin-bottom: 39px;}

#photo .application .other { }
#photo .application .other .con { margin-bottom: 20px;}
#photo .application .other .con:last-child { margin-bottom: 0;}
#photo .application .other h5 { font-size: 22px; padding-left: 11px; border-left: 4px solid #000; margin-bottom: 30px;}
#photo .application .other li { font-size: 18px; line-height: 160%;}
#photo .application .other li.etc { padding-top: 15px;}

/* ------------------------------------------------------------ event */
#event { background: url(../images/bg_ev_01.png) no-repeat 0% -150px / 542px, url(../images/bg_ev_02.png) no-repeat 100% -150px / 542px, url(../images/bg_ev_03.png) no-repeat center 910px / 1843px, url(../images/bg_ev_04.png) no-repeat center 2170px / 1994px, url(../images/bg_ev_05.png) no-repeat center bottom 863px / 1902px, url(../images/bg_ev_06.png) no-repeat left -130px bottom 147px / 325px; background-color: #fefcec;  padding: 0 0 90px; text-align: center;}
#event .aoi { display: block; margin: 0 auto 41px;}
#event h3 { font-size: 56px; font-weight: 700; letter-spacing: 0.02em; line-height: 1.35; margin-bottom: 75px;} 
#event h3 span { display: block; font-size: 32px; font-weight: 400; line-height: 1.3; margin-bottom: 24px;} 
#event .box { position: relative;  border-top: 1px dotted #ae8400; border-bottom: 1px dotted #ae8400; margin-bottom: 93px;}
#event .box h4 { position: absolute; top: -30px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); width: 340px; padding: 14px 0 16px; line-height: 1; background: #ae8400; border-radius: 30px; font-size: 30px; letter-spacing: -0.04em; color: #fff; font-weight: 500;}


#event .fv { height: 100%; background: url(../images/fv_bg.webp) no-repeat center center; background-size: cover; margin-bottom: 80px;}
#event .fv div { margin: -20px 0 0; background: url(../images/fv_1.png) no-repeat center bottom; background-size: cover; text-align: center;}
#event .fv div img { width: 60%; height: auto;  margin: 100px 0 120px;}
#event .fv h2{ padding: 80px 0 0; }
#event .fv h2 img{ margin: 0 auto; }


#event .term { padding: 64px 0 33px;}
#event .term .jin { width: 130px; padding: 11px 0 13px; background: #af120d; border-radius: 5px; font-size: 26px; color: #fff; margin: 0 auto 18px;}
#event .term .jin:nth-of-type(3) { background: #0e1661;}
#event .term .period { font-size: 32px; font-weight: 500; letter-spacing: 0.02em; margin-bottom: 28px;}
#event .term .period:nth-of-type(4) { margin-bottom: 0;}

#event .detail { padding: 60px 0 30px;}
#event .detail p { font-size: 20px; line-height: 1.667; letter-spacing: 0.02em; font-feature-settings: "palt";}

#event .benefit { padding: 60px 0 40px; margin-bottom: 40px; border-bottom: 0px;}
#event .benefit .prize { width: 100%; padding: 40px 35px;} 
#event .benefit .prize img { width: 100%; height: auto; margin-bottom: 0;}
#event .benefit img { width: 100%; height: auto; margin-bottom: 53px;}
#event .benefit img:last-child { margin-bottom: 0;}
#event .benefit .prize .award { width: 120px; padding: 28px 0 30px; border-radius: 45px;}
#event .benefit .prize .award p { font-size: 32px; color: #fff; letter-spacing: -0.04em;}
#event .benefit .prize .flex { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px dotted #000; padding-bottom: 20px;}
#event .benefit .prize .flex2 { display: flex; align-items: center; }
#event .benefit .prize .flex2 h5 { margin-left: 30px; text-align: left; font-feature-settings: "palt";}
#event .benefit .prize .flex h5 { font-size: 60px; font-weight: 700;}
#event .benefit .prize .flex h5 span { font-size: 30px; font-weight: 700;}
#event .benefit .prize .flex h5 span .price { font-size: 76px; font-family: din-2014, sans-serif; font-weight: 600; }
#event .benefit .prize .flex .person { width: 122px; border-radius: 10px; padding: 5px 0; background: #af120d; font-size: 20px; font-weight: 500; color: #fff;}
#event .benefit .prize .flex .person span { font-size: 40px; font-family: din-2014, sans-serif; font-weight: 600; margin-right: 2px; vertical-align: -2px;}
#event .benefit .prize .terms { position: relative; padding: 36px 50px 28px; background-color: #fff; border: 1px solid #000; border-radius: 10px;}
#event .benefit .prize .terms .circle { position: absolute; top: -20px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); width: 280px; background: #000; border-radius: 20px; padding: 9px 0 9px; font-size: 24px; color: #fff; line-height: 1; letter-spacing: -0.04em; }
#event .benefit .prize .terms p { font-size: 20px; }
#event .benefit .prize .terms p:nth-of-type(2) { text-align: start; line-height: 1.5;}
#event .benefit .prize .terms p .red { color: #af120d; font-weight: 700;}
#event .benefit .prize .terms p em { font-weight: 700;}

#event .benefit .gold { padding-bottom: 45px; margin-bottom: 40px; background: url(../images/bg_prize_01.jpg) no-repeat center center / 100%;}
#event .benefit .gold .flex { margin-bottom: 45px;}
#event .benefit .gold .flex h5 .person { display: inline-block; width: 122px; border-radius: 10px; padding: 5px 0; background: #af120d; font-size: 20px; font-weight: 500; color: #fff; text-align: center; vertical-align: 10px;}
#event .benefit .gold .flex h5 .person span { font-size: 40px; font-family: din-2014, sans-serif; font-weight: 600; margin-right: 2px; vertical-align: -2px;}

#event .benefit .gold .flex h5 .bottom { display: block; font-size: 18px; line-height: 1; margin-top: 12px;}
#event .benefit .gold .award { background-color: #ae8400;}

#event .benefit .gold .img { position: absolute; top: 20px; right: 14px; width: 174px; z-index: 5;}
#event .benefit .gold .img p { font-size: 12px; font-weight: 500; margin-top: -10px;}
#event .benefit .gold .terms { }
#event .benefit .gold .terms p:nth-of-type(2) { text-align: start;}

#event .benefit .silver { position: relative; padding-bottom: 50px; background: url(../images/bg_prize_02.jpg) no-repeat center center / 100%;}
#event .benefit .silver .flex { justify-content: space-between; margin-bottom: 50px;}
#event .benefit .silver .award { background-color: #898989;}
#event .benefit .silver .flex h5 { margin-left: 0;}
#event .benefit .silver .flex h5 span .price { vertical-align: -3px;}
#event .benefit .silver .terms { margin-bottom: 30px;}
#event .benefit .silver .caution { font-size: 20px; color: #af120d; font-weight: 500; text-align: left; padding-left: 1em;}
#event .benefit .silver img { position: absolute; bottom: 35px; right: 80px; width: 262px; z-index: 2;}


#event .partic { padding: 60px 0 0; margin-bottom: 0; border-bottom: 0px;}
#event .partic .step { width: 100%; padding: 38px 35px 40px; margin-bottom: 40px; background: #fff; box-shadow: 5.142px 6.128px 0px 0px rgba(0, 0, 0, 0.2); border-radius: 10px;}
#event .partic .step .flex1 { display: flex; justify-content: space-between; align-items: center;}
#event .partic .step .flex2 { display: flex; justify-content: flex-start; align-items: center;}
#event .partic .step .flex2 .round { width: 100px; padding: 20px 0 18px; background: #000; border-radius: 50%;}
#event .partic .step .flex2 .round p { font-size: 16px; letter-spacing: 0.02em; color: #fff;}
#event .partic .step .flex2 .round p span { display: block; font-size: 44px; font-family: din-2014, sans-serif; font-weight: 600; letter-spacing: 0.02em; color: #fff; margin-top: 2px;}
#event .partic .step .flex2 h5 { font-size: 30px; line-height: 1.333; font-weight: 700; text-align: left; letter-spacing: 0.04em; margin-left: 20px;}
#event .partic .step .flex1 img { }
#event .partic .step .beingelected { position: relative; padding: 18px 40px; border: 1px solid #ae8400; border-radius: 10px;}
#event .partic .step .txt { font-size: 16px; font-weight: 500; line-height: 1.6; text-align: center;}

#event .partic .step1 { }
#event .partic .step1 .flex2 { margin-bottom: 42px;}
#event .partic .step1 img { margin-bottom: 30px;}
#event .partic .step1 .beingelected { position: relative; padding: 18px 40px; margin-bottom: 40px; border: 1px solid #ae8400; border-radius: 10px;}
#event .partic .step1 .red { font-size: 20px; font-weight: 500; letter-spacing: 0.02em; line-height: 1.6; color: #af120d;}
#event .partic .step1 .wheretobuy { position: relative; padding: 19px 40px 10px; margin-bottom: 30px; border: 1px solid #000; border-radius: 10px;}
#event .partic .step1 .wheretobuy .circle { position: absolute; top: -20px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); width: 280px; background: #000; border-radius: 20px; padding: 9px 0 9px; font-size: 24px; color: #fff; line-height: 1; letter-spacing: -0.04em;}
#event .partic .step1 .wheretobuy ul { text-align: left;}
#event .partic .step1 .wheretobuy li { padding: 20px 0 20px; border-bottom: 1px dotted #000;}
#event .partic .step1 .wheretobuy li:last-child { border-bottom: 0px;}
#event .partic .step1 .wheretobuy li p { font-size: 16px; font-weight: 500; margin-bottom: 15px; line-height: 1;}
#event .partic .step1 .wheretobuy li p:last-child { font-size: 12px; font-weight: 400; line-height: 1.3; margin-bottom: 0;}
#event .partic .step1 .wheretobuy li:first-child p:last-child,
#event .partic .step1 .wheretobuy li:last-child p:last-child  { font-size: 16px; font-weight: 500; border-bottom: 0px;}
#event .partic .step1 a { display: block; width: 600px; margin: 0 auto; padding: 41px 0 39px 30px; background: url(../images/icn_02.svg) no-repeat 18% center / 38px, url(../images/arrow_04.png) no-repeat 95% center / 14px; background-color: #af120d; border-radius: 50px; font-size: 20px; font-weight: 700; letter-spacing: -0.04em; color: #fff;}

#event .partic .step2 { }
#event .partic .step2 .flex1 { margin-bottom: 30px;}
#event .partic .step2 p { }

#event .partic .step3 { }
#event .partic .step3 .flex1 { margin-bottom: 24px;}

#event .partic .step4 { margin-bottom: 50px;}
#event .partic .step4 .flex1 { margin-bottom: 47px;}
#event .partic .step4 .beingelected { position: relative; padding: 50px 40px 30px; margin-bottom: 30px; border: 1px solid #ae8400; border-radius: 10px;}
#event .partic .step4 .beingelected .circle { position: absolute; top: -20px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); width: 280px; background: #ae8400; border-radius: 20px; padding: 9px 0 9px; font-size: 24px; color: #fff; line-height: 1; letter-spacing: -0.04em;}
#event .partic .step4 .beingelected .txt { font-size: 16px; font-weight: 500; line-height: 1.6; text-align: center; }

#event .partic .stamp { display: block; width: 600px; margin: 0 auto 50px; padding: 41px 0 39px 50px; background: url(../images/icn_03.png) no-repeat 18% center / 38px, url(../images/arrow_04.png) no-repeat 95% center / 14px; background-color: #000; border-radius: 50px; font-size: 20px; font-weight: 700; letter-spacing: -0.04em; color: #fff;}

#event .partic .precautions { text-align: left;}
#event .partic .precautions h5 { font-size: 20px; font-weight: 500; margin-bottom: 30px;}
#event .partic .precautions h5:before { display: inline-block; content: ""; width: 4px; height: 22px; background: #000; margin-right: 9px; vertical-align: -3px;}
#event .partic .precautions p { font-size: 16px; line-height: 1.75; }


/* ------------------------------------------------------------ locationlist */

#locationlist { padding: 249px 0 133px; background: url(../images/bg_pattern.png) repeat left top; background-size: 101px;}
#locationlist .whitebox { padding: 30px 62px 14px;}
#locationlist .whitebox:before { background: url(../images/note_02.png) no-repeat center top; background-size: 100%;}
#locationlist .whitebox .spot { font-size: 24px; font-weight: 700; text-align: center; margin: 10px 0 40px;}
#locationlist .whitebox .spot span { display: block; font-size: 18px; margin-top: 10px;}
#locationlist .whitebox .territory { }
#locationlist .whitebox .territory h3 { width: 100%; padding: 25px 0; font-size: 40px; font-weight: 700; color: #ae8400; text-align: center; border-top: 2px solid #e5e5e5; border-bottom: 2px solid #e5e5e5; margin-bottom: 40px;}
#locationlist .whitebox .territory .flex { display: flex; justify-content: space-between; flex-wrap: wrap;}
#locationlist .whitebox .territory .flex .box { width: 460px; margin-bottom: 40px;}
#locationlist .whitebox .territory .flex .box:last-child { margin-bottom: 70px;}
#locationlist .whitebox .territory .flex .box img { margin-bottom: 27px;}
#locationlist .whitebox .territory .flex .box .name { font-size: 24px; font-weight: 700; color: #ae8400; margin-bottom: 20px; font-feature-settings: "palt";}
#locationlist .whitebox .territory .flex .box .detail { font-size: 16px; margin-bottom: 20px;}
#locationlist .whitebox .territory .flex .box .txt { font-size: 18px; margin-bottom: 40px; line-height: 1.6;}
#locationlist .whitebox .territory .flex .box .forinfo { display: block; width: 330px; margin: auto auto 0; padding: 18px 0 20px 20px; background: url(../images/arrow_05.png) no-repeat 32% center / 11px; background-color: #ae8400; border-radius: 10px; font-size: 14px; font-weight: 400; color: #fff; text-align: center;}

#locationlist .whitebox .other { width: 100%; padding: 34px; border: 1px solid #af120d; text-align: center; border-radius: 20px;}
#locationlist .whitebox .other p { font-size: 20px; color: #af120d; letter-spacing: 0.02em; line-height: 1.6; font-weight: 500;}

/* ------------------------------------------------------------ youtube */

#youtube { padding: 249px 0 133px; background: url(../images/bg_pattern.png) repeat left top;  background-size: 101px;}
#youtube h2 { margin-top: 100px;}
#youtube h2 img { margin: 0 auto;}
#youtube .whitebox { padding: 20px 60px 25px; text-align: center;}
#youtube .whitebox:before { background: url(../images/note_05.png) no-repeat center top; background-size: 100%;}
#youtube .whitebox h3 { font-size: 44px; letter-spacing: 0.02em; margin-bottom: 56px; letter-spacing: -2px;}
#youtube .whitebox h3 .wave { font-weight: 700; /* background: url(../images/wave_01.png) repeat-x left bottom;  */background-size: 23px; padding-bottom: 10px;}
#youtube .whitebox .youtube{width: 100%;  padding-top: 56%; margin: 0 0 26px; position: relative;}
#youtube .whitebox .youtube.soon{ padding-top: 0; }

#youtube .whitebox .youtube iframe{width: 100%; height: 100%;position: absolute;top: 0px;left: 0px;}
#youtube .whitebox p { font-size: 16px; }
#youtube .whitebox .flex .box:not(:nth-child(3),:nth-child(4)) p{margin-bottom: 60px;}
#youtube .whitebox .caution { width: 573px; padding: 16px 0 16px; font-size: 16px; font-weight: 700; color: #af120d; letter-spacing: 0.02em; border: 1px solid #af120d; margin: 0 auto 60px; border-radius: 25px;}

#youtube .whitebox .flex { display: flex; justify-content: space-between; flex-wrap: wrap;}
#youtube .whitebox .flex .box{width: 460px; display: flex;flex-direction: column; text-align: left;}
/* #youtube .whitebox .flex .box:not(:nth-child(3),:nth-child(4)) { margin-bottom: 40px; } */
#youtube .whitebox .flex .box h4 { font-size: 24px; font-weight: 700; color: #ae8400; letter-spacing: -0.04em; margin-bottom: 18px; display: flex; justify-content: space-between; align-items: flex-end;}
#youtube .whitebox .flex .box h4 span{font-size: 18px; }
#youtube .whitebox .flex .box p { font-size: 16px; line-height: 1.875;}
#youtube .whitebox .flex .box .forinfo { display: block; width: 330px; margin: auto auto 0; padding: 18px 0 20px 20px; background: url(../images/arrow_05.png) no-repeat 32% center / 11px; background-color: #ae8400; border-radius: 10px; font-size: 14px; font-weight: 400; color: #fff; text-align: center;}

/* ------------------------------------------------------------ campaign */

#campaign { padding: 249px 0 133px; background: url(../images/bg_pattern.png) repeat left top; background-color: #e7c66f; background-size: 101px;}
#campaign h2 { margin-top: 100px;}
#campaign h2 img { margin: 0 auto;}
#campaign .whitebox { padding: 20px 60px 25px; text-align: center;}
#campaign .whitebox:before { background: url(../images/note_03.png) no-repeat center top; background-size: 100%;}
#campaign .whitebox h3 { font-size: 44px; letter-spacing: 0.02em; margin-bottom: 56px;}
#campaign .whitebox h3 .wave { font-weight: 700; background: url(../images/wave_01.png) repeat-x left bottom; background-size: 23px; padding-bottom: 10px;}
#campaign .whitebox h3 .dot { font-weight: 700; padding-top: 0.2em; background-position: top left; background-repeat: repeat-x; background-size: 1em 0.3em; background-image: radial-gradient(0.1em 0.1em at center center,#000,#000 100%,transparent,transparent); position: relative;}
#campaign .whitebox p { font-size: 16px; margin-bottom: 60px;}
#campaign .whitebox .caution { width: 573px; padding: 16px 0 16px; font-size: 16px; font-weight: 700; color: #af120d; letter-spacing: 0.02em; border: 1px solid #af120d; margin: 0 auto 60px; border-radius: 25px;}

#campaign .whitebox .flex { display: flex; justify-content: space-between; flex-wrap: wrap;}
#campaign .whitebox .flex .box { width: 460px; display: flex;flex-direction: column; margin-bottom: 40px; text-align: left;}
#campaign .whitebox .flex .box img { margin-bottom: 26px;}
#campaign .whitebox .flex .box h4 { font-size: 24px; font-weight: 700; color: #ae8400; letter-spacing: -0.04em; margin-bottom: 18px;}
#campaign .whitebox .flex .box p { font-size: 16px; line-height: 1.875;}
#campaign .whitebox .flex .box .forinfo { display: block; width: 330px; margin: auto auto 0; padding: 18px 0 20px 20px; background: url(../images/arrow_05.png) no-repeat 32% center / 11px; background-color: #ae8400; border-radius: 10px; font-size: 14px; font-weight: 400; color: #fff; text-align: center;}

#campaign .whitebox .notice { width: 100%; font-size: 14px; margin-bottom: 50px; padding: 10px 0; border: 2px solid red; }

/* ------------------------------------------------------------ spot_nav */
#spot_nav { background: url(../images/bg_pattern.png) repeat left top; background-size: 101px; padding: 50px 5% 140px; text-align: center;}
#spot_nav .around { width: 100%; background: url(../images/pic_13.png) no-repeat center 83px / 183px, url(../images/bg_02.jpg) no-repeat left top / cover; padding: 195px 0 113px; /* margin-bottom: 250px; */}

#spot_nav .around h3 { font-size: 44px; letter-spacing: 0.02em; font-weight: 700; margin-bottom: 30px;}
#spot_nav .around h3 strong{ display: block; padding: 30px 0 0; font-size: 80px; font-weight: 800; -webkit-text-stroke: 1px #fff; text-stroke: 1px #fff; -webkit-text-stroke: 2px #000; text-stroke: 2px #000; color: #ffe45f; }

#spot_nav .around .sub { font-size: 16px; line-height: 1.875; margin-bottom: 54px;}
#spot_nav .around ul { display: flex; justify-content: space-between;}

#spot_nav .around li{ position: relative; }
#spot_nav .around li a{ display: block; }
#spot_nav .around li a:hover p{ opacity: 0.8; }
#spot_nav .around li p{ z-index: 20; position: absolute; bottom: -10px; left: 50%; translate: -50% 0; width: 90%; margin: 0 auto; padding: 5px; background: #a70909; border-radius: 10px; }
#spot_nav .around li p span{ padding: 5px; font-size: 17px; text-align: center; color: #fff; background: #a70909; border: 1px solid #fff; display: flex; justify-content: center; align-items: center; height: 100%; width: 100%; border-radius: 8px; }

.lang-ja #spot_nav .around li p{ left: 40px; top: -20px; width: 50px; height: 95px; }
.lang-ja #spot_nav .around li p span{ padding: 0; font-size: 26px; writing-mode: vertical-rl; }

#spot_nav #yamanosu { padding-top: 250px;}
#spot_nav .whitebox { padding: 22px 60px 60px; text-align: center;}
#spot_nav .whitebox:before { background: url(../images/note_04.png) no-repeat center top; background-size: 100%;}
#spot_nav .whitebox h3 { font-size: 44px; letter-spacing: 0.02em; margin-bottom: 30px;}
#spot_nav .whitebox h3 .dot { font-weight: 700; padding-top: 0.2em; background-position: top left; background-repeat: repeat-x; background-size: 1em 0.3em; background-image: radial-gradient( 0.1em 0.1em at center center,#000,#000 100%,transparent,transparent); position: relative;}
#spot_nav .whitebox p { font-size: 16px; margin-bottom: 61px;}
#spot_nav .whitebox .flex { display: flex; justify-content: space-between;}
#spot_nav .whitebox .flex div { width: 460px; text-align: left;}
#spot_nav .whitebox .flex div img { margin-bottom: 26px;}
#spot_nav .whitebox .flex div h4 { font-size: 24px; color: #ae8400; font-weight: 700; letter-spacing: -0.04em; margin-bottom: 17px;}
#spot_nav .whitebox .flex div p { font-size: 16px; line-height: 1.875; margin-bottom: 40px;}
#spot_nav .whitebox .flex div .forinfo { display: block; width: 330px; margin: 0 auto; padding: 18px 0 20px 20px; background: url(../images/arrow_05.png) no-repeat 32% center / 11px; background-color: #ae8400; border-radius: 10px; font-size: 14px; font-weight: 400; color: #fff; text-align: center;}


/* ------------------------------------------------------------ insta */
#insta { padding: 59px 0 0;}

#insta h3 { font-size: 44px; letter-spacing: 0.02em; font-weight: 700; text-align: center;}
#insta h3 img { display: block; margin: 0 auto 19px;}

/* ------------------------------------------------------------ news */
#news { background: #fffbe0; padding: 90px 0; }
#news h3 { text-align: center; font-size: 40px; padding: 0 0 45px;  font-weight: 700;}
#news .news_inner { width: 1005px; margin: 0 auto; }
#news .news_inner ul { margin-bottom: 50px;}
#news .news_inner ul li { background: #fff; margin: 0 auto 3px; }
#news .news_inner ul li .news_item { position: relative; display: flex; align-items: center; width: 100%; padding: 30px; margin-bottom: 2px; background: #fff; }

#news .news_inner ul li p.date { font-size: 16px; color: #7e7e7e; width: 140px; box-sizing: border-box; -webkit-box-sizing: border-box; }
#news .news_inner ul li .clickable_div { position: relative; width: 865px; box-sizing: border-box; -webkit-box-sizing: border-box; }
#news .news_inner ul li .news_item:before,
#news .news_inner ul li .news_item:after { position: absolute; right: 30px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); content: ""; width: 25px; height: 2px; background: #000;}
#news .news_inner ul li .news_item:after { transition: all 0.5s ease-out; transform: rotate(90deg);}
#news .news_inner ul li .clickable_div h4 { font-size: 18px; line-height: 1.6;}
#news .btns { display: block; width: 330px; margin: auto auto 0; padding: 18px 0 20px 20px; background: url(../images/arrow_05.png) no-repeat 25% center / 11px; background-color: #000; border-radius: 10px; font-size: 16px; font-weight: 400; color: #fff; text-align: center; }


/* ------------------------------------------------------------ sponsor */
#sponsor { padding: 100px 0 70px; text-align: center;}
#sponsor h3 { font-size: 40px; margin-bottom: 40px; font-weight: 700;}
#sponsor .flex { display: flex; justify-content: space-between; flex-wrap: wrap;}
#sponsor .flex .item { width: 260px; margin-bottom: 30px;}
#sponsor .flex .item div { content: ""; width: 100%; height: 64px; background: gray; margin-bottom: 19px;}
#sponsor .flex .item p { font-size: 16px;}


/* --------------------------------------------------------------------- spots */
#spots{ padding: 140px 0 0; }


/* --------------------------------------------------------------------- gokokuin */
#gokokuin{ position: relative; padding: 180px 0 215px; background: url(../images/gokokuin/bg.png) center/cover no-repeat; }
#gokokuin:before,
#gokokuin:after{ position: absolute; content: ""; left: 0; right: 0; width: 100%; height: 80px; background-position: center; background-repeat: repeat-x; }
#gokokuin:before{ top: 0; background-image: url(../images/gokokuin/bg_top.png); }
#gokokuin:after{ bottom: 0; background-image: url(../images/gokokuin/bg_bottom.png); }

#gokokuin .topttl{ padding: 0 0 55px; text-align: center; }
#gokokuin .topttl .flex{ display: flex; align-items: center; justify-content: center; margin: 0 0 30px; }
#gokokuin .topttl .sub{ margin-right: 15px; background: #fff; border: 2px solid #000; font-size: 18px; letter-spacing: 0.1em; line-height: 150%; text-align: center; font-weight: 500; padding: 10px; }

#gokokuin .topttl h4{ width: 708px; margin: 0 auto 20px; }
#gokokuin .topttl p{ font-size: 16px; line-height: 200%; }

.champaign .ttl{ margin: 0 0 130px; }
.champaign .ttl h4{ position: relative; margin: 0 0 10px; text-align: center; }
.champaign .ttl h4 img{ margin: 0 auto; }
.champaign .ttl h4:before,
.champaign .ttl h4:after{ position: absolute; content: ""; top: 50%; transform: translate(0,-50%); width: 30%; height: 10px; border-top: 2px solid #000; border-bottom: 2px solid #000; }
.champaign .ttl h4:before{ left: 0; }
.champaign .ttl h4:after{ right: 0; }
.champaign .ttl p{ margin: 0 0 25px; line-height: 200%; text-align: center; font-size: 16px; }

.champaign .ttl dl{ display: flex; align-items: center; justify-content: center; margin: 0 0 35px; }
.champaign .ttl dt{ margin-right: 10px; padding: 3px 10px 5px; font-size: 19px; letter-spacing: 0.02em; text-align: center; background: #fff; border: 2px solid #000; font-weight: 500; }
.champaign .ttl dd{ margin-right: 30px; font-size: 23px; font-weight: 500; }
.champaign .ttl .items{ display: flex; align-items: center; justify-content: space-between; }
.champaign .ttl .items.SP{ display: none; }

.champaign-box{ position: relative; padding: 80px 50px 60px; background: #fff; border: 1px solid #b5b5b5; border-radius: 10px; box-shadow: 5px 5px 0px -1px rgba(0, 0, 0, .2); }
.champaign-box .champ-ttl{ height: 120px; display: flex; align-items: center; position: absolute; top: -50px; left: 50%; transform: translate(-50%,0) skew(-10deg); }
.champaign-box .champ-ttl .number{ width: 130px; padding: 16px 10px; text-align: center; color: #fff; font-size: 74px; font-family: din-2014, sans-serif; font-weight: 600; background: #ae8401; }
.champaign-box .champ-ttl .number small{ display: block; font-size: 14px; }
.champaign-box .champ-ttl h5{ display: flex; align-items: center; width: 750px; height: 120px; padding: 15px 10px 15px 25px; font-size: 27px; letter-spacing: 0.1em; line-height: 150%; color: #fff; background: #000; font-weight: 600; }


.champaign-box .champ-flex{ margin-bottom: 40px; display: flex; align-items: center; justify-content: center; }
.champaign-box .dash{ display: inline; border-bottom: 3px dashed #000; padding: 0 0 7px; line-height: 230%; }
.champaign-box .color{ vertical-align: baseline; color: #b3312b; font-family: din-2014, sans-serif; font-weight: 800; }
.champaign-box h6{ margin: 0 25px; font-size: 36px; font-family: 'Noto-Sans-JP-Bold'; text-align: center; }
.champaign-box h6 small{ font-size: 83px; }
.champaign-box h6 strong{ font-size: 49px; }
.champaign-box h6 em{ display: block; margin: 20px 0 0; font-size: 20px; }
.champaign-box .detail{ padding: 0 0 60px; font-size: 18px; text-align: center; line-height: 200%; }

.champaign-box .content{ display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; }
.champaign-box .content li{ width: 430px; padding: 25px 25px 25px 40px; background: #f9f5ea; }
.champaign-box .content h7{ display: block; position: relative; margin: 0 0 25px; font-size: 30px; font-weight: 700; }
.champaign-box .content h7:before{ position: absolute; content: ""; top: 10px; left: -40px; width: 20px; height: 10px; background: #ae8401; }
.champaign-box .content p{ font-size: 18px; line-height: 180%; font-feature-settings: "palt"; }
.champaign-box .content p small { display: block; font-size: 14px; }
.champaign-box .content dl{ margin: 30px 0 0; }
.champaign-box .content dt{ display: inline-block; margin: 0 0 20px; padding: 15px; font-size: 20px; border-radius: 8px; background: #d3cdbd; font-weight: 700; }
.champaign-box .content dd a{ font-size: 20px; font-weight: 700; }

.champaign-box .content .flex{ display: flex; align-items: center; justify-content: space-between; }
.champaign-box .content figure{ margin: 0; }
.champaign-box .content figcaption{ padding: 0 0 15px; font-size: 20px; }

.champaign-box .content li:first-of-type{ order: 1; margin: 0 0 30px; }
.champaign-box .content li:nth-of-type(2){ order: 3; margin-top: -140px;  }
.champaign-box .content li:last-of-type{ order: 2; width: 535px; padding: 40px 25px 35px 40px; }

.champaign-box .largecontent { width: 100%; padding: 25px 40px 40px; margin-top: 30px; background: #f9f5ea; }
.champaign-box .largecontent h7{ display: block; position: relative; margin: 0 0 25px; font-size: 30px; font-weight: 700; line-height: 140%; }
.champaign-box .largecontent h7 span{ display: block; font-size: 14px; font-weight: 500; text-align: right; }
.champaign-box .largecontent h7:before{ position: absolute; content: ""; top: 10px; left: -40px; width: 20px; height: 10px; background: #ae8401; }
.champaign-box .largecontent dl{ display: flex; align-items: baseline; margin: 30px 0 0; }
.champaign-box .largecontent dl:last-of-type{ align-items: center; }
.champaign-box .largecontent dt{ display: inline-block; width: 80px; padding: 6px 0; font-size: 20px; color: #fff; border-radius: 5px; background: #000; font-weight: 700; text-align: center; }
.champaign-box .largecontent dd.dot{ display: inline-block; width: 38px; border-bottom: 1px dotted #000; margin: 0 13px; }
.champaign-box .largecontent dl:not(:last-of-type) dd.dot{ height: 0.5em; border-top: 1px dotted #000; border-bottom: 0px; }

.champaign-box .largecontent dd{ width: 765px; font-size: 20px; line-height: 180%; }
.champaign-box .largecontent dd a{ border-bottom: 1px solid #000; font-weight: 500; }
.champaign-box .largecontent dd a span { font-size: 16px; font-weight: 500; }

.champaign01{ margin: 0 0 140px; }

.champaign02{ margin: 0 0 70px; padding-top: 140px; }
.champaign02 .champ-ttl h5{ width: 930px; }
.champaign02 .champ-flex{ position: relative; justify-content: space-around; }
.champaign02 .champ-flex:before,
.champaign02 .champ-flex:after{ position: absolute; content: ""; width: 2px; height: 65px; background: #000; left: 50%; top: 30%; transform: translate(-50%,-50%); }
.champaign02 .champ-flex:before{ transform: rotate(45deg); }
.champaign02 .champ-flex:after{ transform: rotate(-45deg); }
.champaign02 .dash{ line-height: 130%; }
.champaign02 .btns{ display: block; width: 370px; margin: 0 auto 50px; }
.champaign02  .content li:last-of-type{ padding-bottom: 0; }


.lang-en .champaign02 .champ-flex::before,
.lang-en .champaign02 .champ-flex::after{ left: 59%; top: 2%; }


#gokokuin .contact{ margin: 0 auto; }
#gokokuin .contact p{ width: 70%; height: 90px; font-weight: 600; display: flex; align-items: center; justify-content: center; font-size: 24px; color: #fff; margin: 0 auto 15px; background: #b3312b; }
#gokokuin .contact dt{ padding: 0 0 15px; font-size: 36px; text-align: center; }
#gokokuin .contact dt small{ margin-left: 10px; font-size: 20px; }
#gokokuin .contact dd{ text-align: center; line-height: initial; }
#gokokuin .contact dd img{ width: 32px; height: auto; margin-right: 5px; }
#gokokuin .contact dd a{ font-size: 40px; font-weight: 700; font-family: din-2014, sans-serif; }


/* --------------------------------------------------------------------- sakin */
#sakin{ padding: 65px 0 130px; background: url(../images/sakin/bg_top.png) center top/100% no-repeat, url(../images/sakin/bg_bottom.png) center bottom/100% no-repeat; }
#sakin .bg{ background: url(../images/sakin/pic_01.png) calc(50% - 550px) 10px/290px no-repeat, url(../images/sakin/pic_02.png) calc(50% + 500px) top/260px no-repeat; padding: 100px 0 0; }
#sakin h3{ text-align: center; margin: 0 auto; padding: 0 0 30px; }
#sakin h3 img{ margin: 0 auto; }
#sakin .sub-ttl{ padding: 0 0 100px; font-size: 25px; text-align: center; color: #684a2c; font-family: "fot-tsukuardgothic-std", sans-serif; font-weight: 600; padding-top: 0;} 
#sakin .sub-ttl small{ font-size: 15px; }
#sakin .sub-ttl img{ width: 500px; vertical-align: sub; }
#sakin h4{ margin: 0 0 40px; padding: 16px 0; font-size: 36px; font-weight: 700; color: #313131; text-align: center; border-bottom: 1px solid #313131; border-top: 1px solid #313131; }

#sakin .sakin-box{ margin: 0 0 80px; }

#sakin .area ul{ display: flex; align-items: center; justify-content: space-between; }
#sakin .area li{ width: calc(100% / 3 - 3%); margin: 0 3% 0 0; }
#sakin .area li:last-of-type{ margin: 0; }
#sakin .area li .area{ margin: 0 0 20px; padding: 13px; font-size: 24px; text-align: center; background: #ffe45f; font-weight: 500; }
#sakin .area-btn a{ display: block; padding: 6px 0 13px; border-radius: 10px; background: url(../images/sakin/btn.png) center/cover no-repeat;; }
#sakin .area-btn a p{ font-size: 20px; text-align: center; color: #fff; line-height: 200%; font-weight: 500; filter: drop-shadow(3px 3px 0px rgba(0, 0, 0, 0.1)); }
#sakin .area-btn a small{ font-size: 16px; }
#sakin .area-btn a span{ display: block; font-size: 27px; font-family: ab-kirigirisu, sans-serif; font-weight: 400; font-style: normal; }


#sakin .qualification dt{ float: left; clear: both; width: 240px; margin: 0 25px 40px 0; padding: 19px 0; text-align: center; color: #fff; font-size: 24px; background: #5a3a19; font-weight: 500; }
#sakin .qualification dd{ margin: 0 0 40px; padding: 19px 0; font-size: 24px; font-weight: 500; }
#sakin .qualification dd:last-of-type{ margin: 0; }
#sakin .qualification dd.line{ padding: 7px 0; }
#sakin .qualification dd small{ display: block; padding: 10px 0 0; font-size: 15px; }


#sakin .schedule{ width: 1050px; margin: 0 auto; border: 2px solid #f39800; }
#sakin .schedule-header{ padding: 21px 0 24px; background: #f39800; }
#sakin .schedule-header p{ text-align: center; color: #fff; font-size: 40px; font-weight: 600; letter-spacing: 0.1em; font-family: "fot-tsukuardgothic-std", sans-serif; }

#sakin .schedule-body{ padding: 30px 22px 35px; }
#sakin .schedule-body li{ display: flex; align-items: center; padding: 29px 30px 29px 0; }
#sakin .schedule-body li:nth-of-type(2){ border-bottom: 2px dotted #f39800; border-top: 2px dotted #f39800; }
#sakin .schedule-body li:last-of-type{ padding-right: 130px; }

#sakin .schedule-body .type{ width: 100px; margin: 0 15px 0 0; padding: 9px 0; border-radius: 50px; font-size: 20px; color: #fff; text-align: center; font-weight: 600; font-family: "fot-tsukuardgothic-std", sans-serif; background: #f39800; }

#sakin .schedule-body dl{ width: 100%; }

#sakin .schedule-body dt{ float: left; clear: both; width: 110px; margin: 0 15px 0 0; padding: 5px 0; border-radius: 50px; font-size: 16px; font-weight: 600; font-family: "fot-tsukuardgothic-std", sans-serif; text-align: center; }
.sky{ background: #acdbed; }
.yellow{ background: #fedc6b; }
.pink{ background: #f1bccd; }

#sakin .schedule-body dd{ position: relative; display: flex; align-items: center; margin: 0 0 15px; padding: 4px 0 3px; }
#sakin .schedule-body dd p{ position: relative; font-size: 16px; font-weight: 400; font-family: "fot-tsukuardgothic-std", sans-serif; }
#sakin .schedule-body dd .line{ padding: 0 40px 0 0;  }
#sakin .schedule-body dd .line:after{ position: absolute; content: ""; top: 8px; right: 14px; width: 15px; height: 1px; background: #000; }
#sakin .schedule-body dd p img{ margin-left: 5px; vertical-align: bottom; }

#sakin .schedule-body dd small{ position: absolute; right: 0; font-size: 13px; font-weight: 400; font-family: "fot-tsukuardgothic-std", sans-serif; }

#sakin .schedule-body dd .comment{ position: absolute; top: -10px; left: 29%; width: 300px; }
#sakin .schedule-body dd .comment small{ display: block; width: 100%; padding: 9px 0 7px; font-size: 14px; text-align: center; border: 1px solid #000; border-radius: 50px; }

#sakin .schedule-body .universe:before{ position: absolute; content: ""; top: -31px; right: 7%; width: 1px; height: 79px; background: #000; }
#sakin .schedule-body dd.rest{ margin: 25px 0 0; }

#sakin .schedule-body dl.flex{ display: flex; align-items: center; }
#sakin .schedule-body dl.flex dd{ position: relative; margin: 0; padding: 0 50px 0 0; }
#sakin .schedule-body dl.flex dd:after{ position: absolute; content: ""; top: 8px; right: 14px; width: 25px; height: 1px; background: #000; }
#sakin .schedule-body dl.flex dd:last-of-type:after{ display: none; }

#sakin .schedule-body .line.adjust-after:after{ width: 60px; right: -34px; }
#sakin .schedule-body dd .line-l:after{ right: 3px; width: 29px; }
#sakin .schedule-body .adjust{ margin-left: 47px; }


#sakin .application .sub{ margin: 0 0 35px; text-align: center; font-size: 24px; font-weight: 600; }
#sakin .application .qr-area{ display: flex; align-items: flex-start; justify-content: center; }
#sakin .application figure{ width: 140px; margin: 0 30px; }
#sakin .application figcaption{ margin: 0 0 25px; padding: 7px 0; font-size: 20px; text-align: center; border-radius: 50px; }
#sakin .application img{ width: 140px; height: auto; }



.finised{ width: 800px; margin: 0 auto 60px; padding: 20px 0; background: gray; color: #fff; text-align: center; font-size: 40px; }
/*
.finised{ position: relative; }
.finised:after,
.finised:before{ position: absolute; width: 100%; left: 0; }
.finised:after{ top: 0; content: ""; height: 100%; background: rgba(0,0,0,0.7); }
.finised:before{ z-index: 1; top: 300px; content: "終了しました"; color: #fff; font-size: 60px; font-weight: 700; text-align: center; }
*/




/* ------------------------------------------------------------ cycling */
#cycling{ background: url(../images/cycling/bg.jpg) center bottom/cover no-repeat; overflow: hidden; }

#cycling .top{ position: relative; background: url(../images/cycling/bg_02.png) center bottom /cover, url(../images/cycling/bg_02_2.png) no-repeat center 41px/1800px; padding: 100px 0 180px; font-family: "fot-tsukuardgothic-std", sans-serif; text-align: center; color: #fff; }
#cycling .top-inner{  background: url(../images/cycling/img_01.png) calc(50% - 600px) center/310px no-repeat, url(../images/cycling/img_02.png) calc(50% + 600px) center/310px no-repeat; }
#cycling .top .sub-ttl{ filter: drop-shadow(3px 3px 0px #2a75a1); padding: 0 0 25px; background: url(../images/cycling/img_03.png) calc(50% - 270px) center/71px no-repeat, url(../images/cycling/img_04.png) calc(50% + 270px) center/71px no-repeat; }
#cycling .top .en img{ width: 57px; height: auto; margin-right: 15px; }
#cycling .top .en small{ letter-spacing: 0.18em; font-size: 17px; font-family: "Helvetica Neue" , Helvetica , Arial , sans-serif; font-weight: 700; }
#cycling .top .ja{ padding: 10px 0 0; font-size: 36px; font-weight: 700; }
#cycling .top .ttl{ width: 650px; margin: 0 auto; padding: 18px 0 19px; font-size: 60px; letter-spacing: 0.02em; border: 2px solid #fff; border-radius: 8px; font-family: 'Noto-Sans-JP-Bold'; background: rgb(43 125 166 / .43); }
#cycling .top .ttl span { filter: drop-shadow(5px 7px 0px #2a75a1); }

#cycling .contents{ position: relative; }


.cycling-box{ position: relative; padding: 0 0 100px; }
.cycling-box .flex{ display: flex; align-items: flex-start; justify-content: space-between; }
.cycling-box .text{ width: 360px; padding: 30px 0 0; }
.cycling-box .text .type{ display: inline-block; margin: 0 0 30px; padding: 8px 15px 9px; font-size: 16px; color: #fff; text-align: center; background: #000; border-radius: 0 50px 50px 0; }
.cycling-box .text .type02 { margin: 0 0; }

.cycling-box .text h4{ margin-bottom: 50px; font-size: 37px; line-height: 150%; font-family: 'Noto-Sans-JP-Bold';}
.cycling-box02 .text h4 { font-size: 46px; }

.cycling-box .total{ display: flex; align-items: center; padding: 0 0 15px; border-bottom: 4px dotted #000; }
.cycling-box .total img{ margin-right: 15px; margin-top: 15px; }
.cycling-box .total p{ display: flex; align-items: first baseline; font-size: 24px; font-weight: 700; }
.cycling-box .total p strong{ padding: 0 5px; font-size: 44px; font-weight: 700; }
.cycling-box .total p em{ padding: 5px 0 0; font-size: 34px; font-weight: 700; }

.cycling-box .description .txt{ padding: 30px 0 0; line-height: 200%; font-size: 16px; }
.cycling-box .item{ width: 60%; height: auto; margin-right: -5%; }

.cycling-box02 .text{ width: 100%; }
.cycling-box02 .text img{ width: 370px; height: auto; margin-left: 80px; }
.cycling-box02 .flex{ justify-content: flex-start; }


.lang-en .cycling-box .total{ display: block; }
.lang-en .cycling-box .total p{ font-size: 21px; }
.lang-en .cycling-box .total p strong{ font-size: 39px; }
.lang-en .cycling-box .total p em{ font-size: 29px; }

.lang-en .cycling-box02 .text h4{ font-size: 44px; }


.prefecture{ display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; position: relative; z-index: 2; }
.prefecture-box{ width: 47%; margin: 0 0 10px; }

.prefecture-box h4{ position: relative; padding-bottom: 20px; font-size: 28px; font-weight: 700; text-align: center; }
.prefecture-box h4:before,
.prefecture-box h4:after{ content: ""; position: absolute; width: 40%; height: 1px; background: #000; top: 50%; translate: 0 -50%; }
.prefecture-box h4:before{ left: 0; }
.prefecture-box h4:after{ right: 0; }
.prefecture-box h4 small{ display: block; padding: 0 0 10px; font-size: 14px; font-family: "Helvetica Neue" , Helvetica , Arial , sans-serif; }

.prefecture-box ul{ display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; }
.prefecture-box li{ position: relative; width: calc(100% / 2 - 2%); margin: 0 0 50px; }
.prefecture-box li img{ width: 100%; height: auto; }

.prefecture-box li figcaption{ position: absolute; left: 50%; bottom: -20px; translate: -50% 0; width: 90%; padding: 10px 0; font-size: 16px; text-align: center; background: #fff; border: 1px solid #000; font-weight: 500; }

figure{ margin: 0; }

#cycling .caution{ display: flex; align-items: center; padding: 0 0 50px; }
#cycling .caution .pic{ width: 160px; font-weight: 500; font-size: 20px; }
#cycling .caution .pic img{ width: 39px; margin-right: 20px; }
#cycling .caution .txt{ border-left: 2px dotted #7f807f; width: calc(100% - 180px); padding-left: 30px; font-size: 16px; line-height: 170%; }

#cycling .qr-cord{ display: flex; align-items: center; justify-content: space-between; }
#cycling .qr-cord01{ width: 370px; }
#cycling .qr-cord02{ width: 210px; }
#cycling .qr-cord03{ width: 480px; }

#cycling .qr-cord li{ }
#cycling .qr-cord h4{ padding: 10px 0; background: #d8c282; border-radius: 10px 10px 0 0; text-align: center; font-size: 16px; font-weight: 500; }

#cycling .qr-cord .w-box{ height: 180px; display: flex; justify-content: center; align-items: center; border-radius: 0 0 10px 10px; background: rgba(255,255,255,.8); }
#cycling .qr-cord figure{ width: 112px; margin: 0 20px; text-align: center; }
#cycling .qr-cord img{ width: 100%; height: auto; }
#cycling .qr-cord figcaption{ padding: 10px 0 0; font-size: 13px; }

#cycling .qr-cord03 .w-box { justify-content: flex-start; }
#cycling .qr-cord03 figure{ margin: 0 40px; }

#cycling .qr-cord03 p{ padding: 0 0 5px; font-size: 16px; line-height: 180%; }
#cycling .qr-cord03 a{ display: block; font-size: 16px; padding: 0 0 10px; }
#cycling .qr-cord03 a img{ width: 17px; height: auto; margin: 0 10px 0 0; }

#cycling .cycling-box02:before,
#cycling .cycling-box02:after { content: ''; position: absolute; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); display: block; z-index: 1; }
#cycling .cycling-box02:before { top: 210px; width: 1386px; height: 288px; background: url(../images/cycling/img_07.png) no-repeat 45px bottom / 106px, url(../images/cycling/img_08.png) no-repeat right top / 157px; }
#cycling .cycling-box02:after { bottom: 510px; width: 1406px; height: 233px; background: url(../images/cycling/img_09.png) no-repeat 30px top / 98px, url(../images/cycling/img_10.png) no-repeat right bottom / 120px; }


/* --------------------------------------------------------------------- mobile ------------------------------------------------------------ */

@media only screen and (max-width:640px){


/* ------------------------------------------------------------ fv */
/*
#fv { height: 100%; min-height: auto; background: url(../images/fv_bg_sp.webp) no-repeat center center; background-size: cover;}
#fv div { background: none; }
#fv div img { width: 100%; height: auto;  margin: 0;}
*/
#fv { width: 100%; aspect-ratio: 16 / 9;}

#fv .slide .title { display: block; width: 50%; }
#fv .slide { height: 100%;}

#fv .slick-prev,
#fv .slick-next { width: 13px; height: 51px;}
#fv .slick-arrow:before{  width: 13px!important; height: 51px!important;}
#fv .slide-dots {bottom: 10px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%);}
#fv .slide-dots li { display: inline-block; margin: 0 5px;}
#fv .slide-dots li button { position: relative; text-indent: -9999px;}
#fv .slide-dots li button::before { width: 10px; height: 10px; border: 2px solid #fff; border-radius: 50%; top: 0; left: 0;}
#fv .slide-dots li.slick-active button::before { background: #fff;}
#fv button { background: none; border: none; outline: none; padding: 0 5px;}

#fv h2{ font-size: 40px; text-align: center; text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5); }
/* #fv h2 span{ padding: 5px 0 0; font-size: 20px; } */
#fv h2 img{ width: 90%; }

#welcome { display: none; height: 100vh; position: fixed; top: 0; width: 100%; z-index: 999999; background: rgba(0,0,0,0.8);}
#welcome .close-btn{ text-align: right; text-decoration: none; font-size: 25px; color: #666; padding: 10px;}
#welcome .modal { width: 80%; }


/* ------------------------------------------------------------ gnav */
/*
#gnav { background: #ae8400; padding: 20px 0; }

#gnav ul { display: flex; justify-content: center; margin-bottom: 10px;}
#gnav ul:last-child { margin-bottom: 0;}
#gnav ul li { float: none; width: 30%; text-align: center; padding: 0;}
#gnav ul:last-child li { width: 25%; margin-bottom: 0;}
#gnav ul li a { display: block; font-size: 13px; color: #fff; background: url(../images/arrow_01.png) no-repeat center bottom; padding: 16px 0 21px; letter-spacing: 0.05em; }
#gnav ul:last-child li:nth-child(1) a,
#gnav ul:last-child li:nth-child(3) a,
#gnav ul:last-child li:nth-child(4) a { padding: 18px 0 29px;}
*/

/* ------------------------------------------------------------ economical */

#economical { padding: 50px 0; background-size: 50px;}
#economical h3 { font-size: 24px; margin: 0 0 20px;}
#economical h3:after,
#economical h3:before{ height: 30px; bottom: -5px; }
#economical h3:after{ left: 8%; }
#economical h3:before{ left: initial; right: 8%; }
#economical .flex { display: block;}
#economical .flex a { width: 100%; margin: 0 0 20px;}
#economical .flex a img { width: 100%; height: auto;}


/* ------------------------------------------------------------ about */

#about { overflow: hidden; background: url(../images/bg_abo_01.webp) no-repeat center top; background-size: cover; padding: 41px 0 62px;}
#about .bg { background: url(../images/bg_abo_03_sp.png) no-repeat left 460px / 123px, url(../images/bg_abo_06.png) no-repeat 10% 720px / 42px, url(../images/bg_abo_04_sp.png) no-repeat 95% 780px / 72px, url(../images/bg_abo_05_sp.png) no-repeat right 1030px / 171px;}
#about h2 { margin: 0 auto -2px;}
#about .aoi { width: 70px; margin: 0 auto 20px;}
#about .about { width: 325px; margin: 0 auto; padding: 32px 25px 33px; background: url(../images/pic_01_sp.jpg) no-repeat center / contain; background-size: 100%;}
#about .about h3 { font-size: 28px; margin-bottom: 20px;}
#about .about h3:before { display: none;}
#about .about h3:after { width: 50px; height: 2px; margin: 15px auto 0;} 
#about .about p { font-size: 14px; line-height: 1.786; }

#about .whitebox { padding: 30px 37.5px 10px;}
#about .whitebox h4 { font-size: 22px; line-height: 1.208; margin: 0 0 17px;}
#about .whitebox .flex { display: block; }
#about .whitebox .flex div { width: 100%;}
#about .whitebox .flex div:first-child { margin-bottom: 27px;}
#about .whitebox .flex div img { margin-bottom: 16px; }
#about .whitebox .flex div h5 { font-size: 18px; margin-bottom: 15px;}
#about .whitebox .flex div p { font-size: 13px; line-height: 1.769;}
#about .whitebox .flex div .forinfo { display: block; width: 100%; margin: 0 auto; padding: 14px 0 16px 12px; background: url(../images/arrow_05.png) no-repeat 32% center / 8px; background-color: #ae8400; border-radius: 10px; font-size: 12px;}

.note-ttl{ margin-left: 4.5px; padding: 0 0 20px; }
.note-ttl .ciclettl{ font-size: 17px; }
.note-ttl img{ width: 36px; height: auto; }
.note-ttl .ciclettl .topic { font-size: 10px; }

.map{ margin-top: 12%; }
.mapimg{ width: 100vw; max-width: initial; margin: 0 calc(50% - 50vw); left: 0; }
.map p{ font-size: 13px; }
.map .map01{ bottom: 88%; left: calc(50% - 110px); }
.map .map02{ bottom: 79%; }
.map .map03{ bottom: 40%; left: calc(50% - 150px); }
.map .map04{ bottom: 33%; left: calc(50% - 120px); }
.map .map05{ bottom: 15%; } 
.map .map07{ bottom: 68%; left: calc(50% + 30px); }
.map .map08{ bottom: 54%; left: calc(50% - 150px); }
.map .map09{ bottom: 37%; } 
.map .map10{ left: calc(50% - 140px); }
  
.lang-ja .map p{ font-size: 19px; }
.lang-ja .map .map01{ bottom: 80%; left: calc(50% - 40px); }
.lang-ja .map .map02{ bottom: 72%; left: calc(50% + 20px); }
.lang-ja .map .map03{ bottom: 33%; left: calc(50% - 70px); }
.lang-ja .map .map04{ bottom: 23%; left: calc(50% - 30px); }
.lang-ja .map .map05{ bottom: 11%; }
.lang-ja .map .map06{ bottom: -1%; left: calc(50% + 0px); }
.lang-ja .map .map07{ bottom: 67%; left: calc(50% + 80px); }
.lang-ja .map .map08{ bottom: 49%; left: calc(50% - 70px); }
.lang-ja .map .map10{ bottom: 17%; left: calc(50% - 60px); }




/* ------------------------------------------------------------ modelcourse */

#modelcourse { padding: 50px 0; }
#modelcourse .innerbox { width: 90%;}
#modelcourse .intro{ padding: 0 0 30px; text-align: center; }
#modelcourse .intro .curve{ padding: 30px 0 10px; background: url(../images/spot_icn_01.svg) left top/50px no-repeat, url(../images/spot_icn_02.svg) right top/50px no-repeat; font-size: 30px; color: #b78b18; text-shadow: 0px 2px 0px #846615; }
#modelcourse .intro .curve{ font-size: 30px; color: #b78b18; text-shadow: 0px 2px 0px #846615; }
#modelcourse .intro .sub-curve{ font-size: 20px; padding: 15px 0 0; }
#modelcourse .intro .descriotion { font-size: 13px; line-height: 160%; }

#modelcourse .caption { font-size: 12px; margin-bottom: 5px;}
#modelcourse .caption img { width: auto; height: 22px;}
#modelcourse .box { width: 100%; border: 1px solid #f39800; margin-bottom: 20px;}
#modelcourse .box .title { padding: 10px 0;}
#modelcourse .box .title p { font-size: 18px; line-height: 120%;}
#modelcourse .box .title p span { font-size: 14px; }
#modelcourse .box .schedule { padding: 0 5%;}
#modelcourse .box .schedule .course { padding: 20px 0 0;}

#modelcourse .box .schedule .coursename { font-size: 20px; margin-bottom: 15px;}
#modelcourse .box .oneday { display: block; padding: 15px 0 30px;}
#modelcourse .box .oneday:after { content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); display: block; width: 95%; height: 2px; background-image: linear-gradient(to right, #f39800 2px, transparent 2px); background-size: 10px 2px; background-repeat: repeat-x;}
#modelcourse .box .oneday .day { width: 100%; font-size: 16px; border-radius: 20px; margin: 0 0 10px; letter-spacing: -0.1em;}
#modelcourse .box .oneday .itinerary { display: block; text-align: center;}
#modelcourse .box .oneday .itinerary:nth-of-type(n+2) { padding-left: 0;}
#modelcourse .box .oneday .itinerary p { position: relative; display: block; font-size: 15px; font-family: "fot-tsukuardgothic-std", sans-serif; font-weight: 300; padding-top: 0;}

#modelcourse .box .oneday .itinerary p.goldtop,
#modelcourse .box .oneday .itinerary p.subtop,
#modelcourse .box .oneday .itinerary p.ferrytop,
#modelcourse .box .oneday .itinerary p.instatop,
#modelcourse .box .oneday .itinerary p.goldtop.instatop,
#modelcourse .box .oneday .itinerary p.subtop.instatop { padding-top: 0;}
#modelcourse .box .oneday .itinerary p.goldtop .time,
#modelcourse .box .oneday .itinerary p.subtop .time,
#modelcourse .box .oneday .itinerary p.ferrytop .time,
#modelcourse .box .oneday .itinerary p.instatop .time,
#modelcourse .box .oneday .itinerary p.goldtop.instatop .time,
#modelcourse .box .oneday .itinerary p.subtop.instatop .time { top: -25px;}



#modelcourse .box .oneday .itinerary p.ferry{ position: relative; }
#modelcourse .box .oneday .itinerary p.ferry:before{ width: 40px; height: 20px; top: 40px; right: 50%;}
/* #modelcourse .box .oneday .itinerary p.ferry:after { content: ""; position: relative; right: 7%; bottom: 0; display: inline-block; width: 1px; height: 30px; background: #c9caca; border-radius: 20px; margin: 5px 0px;} */
#modelcourse .box .oneday .itinerary p.ferry .spot { padding: 0; margin-bottom: 10px;}

#modelcourse .box .oneday .itinerary p .mleft { display: flex; justify-content: center; align-items: end; flex-flow: row-reverse; text-align: left; /* margin-left: 40%; */}

#modelcourse .box .oneday .itinerary p.imgtop .mleft { padding-right: 0%; text-align: center;}


#modelcourse .box .oneday .itinerary p .mleft.inblock { display: inline-block; vertical-align: text-top;}
#modelcourse .box .oneday .itinerary p .mleft .spot { display: block; width: auto; height: 20px; margin: 0 0 0 3px; padding-top: 3px;}
#modelcourse .box .oneday .itinerary p .textbottom { display: block; width: 40%; font-size: 15px; text-align: left; padding: 0; letter-spacing: -0.05em;}
#modelcourse .box .oneday .itinerary p .mleft .group { text-align: center;}

#modelcourse .box .oneday .itinerary p .mleft .gold:before { width: 16px; height: 17px; vertical-align: -3px; margin-right: 3px;}

#modelcourse .box .oneday .itinerary p .time { width: 50px; height: 40px; top: -25px; left: 8%;}
#modelcourse .box .oneday .itinerary p .time:before { right: 0%; bottom: -27px; width: 2px; height: 30px; margin: 5px 0px;}
#modelcourse .box .oneday .itinerary p.ferry .time { padding-left: 50px; width: 95px;}
#modelcourse .box .oneday .itinerary p.ferry .time:before { right: 61%;}
#modelcourse .box .oneday .itinerary p.ferry .time:after { right: 72%;}

#modelcourse .box .oneday .itinerary p .time.solo:before { bottom: -25px;}
#modelcourse .box .oneday .itinerary p .time:after { top: 55.5px; right: 46px; transform: rotate(45deg);}
#modelcourse .box .oneday .itinerary p .time.solo:after { top: 53px;}

#modelcourse .box .accordion-header { position: relative;}
#modelcourse .box .accordion-header .plus { right: 7px; width: 20px;}
#modelcourse .box .accordion-header .plus span { height: 4px; background: #fff; border-radius: 10px;}
#modelcourse .box .accordion-header .plus span:first-child { height: 4px; }
#modelcourse .box .accordion-header .plus span:last-child { top: -2px; left: 0;}
#modelcourse .box .accordion-header.open .plus span:last-child { transform: rotate(180deg); -webkit-transform: rotate(180deg);}

/* ------------------------------------------------------------ photo */

#photo { background: url(../images/bg_pattern_03.jpg) repeat left top; background-size: 29px; padding-bottom: 40px;}
#photo .fv { width: 100%; height: auto; margin-bottom: 179px;}

#photo .about { position: relative; width: 90%; background: #fff; border: 4px solid rgb(22, 87, 141); border-radius: 10px; box-shadow: 5.142px 6.128px 0px 0px rgba(0, 0, 0, 0.2); padding: 17vw 0 30px; margin: 0 auto 90px;}
#photo .about h3 { width: 95%; top: -125px;}
#photo .about img:nth-of-type(2) { margin-bottom: 16px;}
#photo .about .lineup { width: 85%; margin: 0 auto;}
#photo .about p { width: 85%; font-size: 11px; line-height: 190%; margin: 23px auto 0;}

#photo .about h4{ font-size: 20px; }
#photo .about h4:before,
#photo .about h4:after{ width: 25px; }
#photo .about h4:before{ left: 10px; }
#photo .about h4:after{ right: 10px; }

#photo .details { position: relative; width: 90%; background: #fff; border-radius: 10px; box-shadow: 5.142px 6.128px 0px 0px rgba(0, 0, 0, 0.2); padding: 36px 7.5% 35px; margin: 0 auto 50px;}
#photo .details h4 { width: 90%; top: -25px;}
#photo .details table tr { display: block;}
#photo .details table tr th,
#photo .details table tr td { display: block; width: 100%; padding-bottom: 20px;}
#photo .details table tr th { padding-right: 0; text-align: center;}
#photo .details table tr th p { width: 125px; line-height: 25px; font-size: 17px; letter-spacing: 0.1em; margin: 0 auto;}
#photo .details table tr td { font-size: 12px; line-height: 200%; padding-bottom: 30px;}
#photo .details table tr:last-child th{ padding-bottom: 20px;}
#photo .details table tr:last-child td{ padding-bottom: 0px;}

#photo .application { width: 90%; margin: 0 auto;}
#photo .application h4 { width: 90%; margin: 0 auto 50px;}
#photo .application .flex { display: block; margin-bottom: 0;}
#photo .application .flex .item { width: 100%; border-radius: 12px; padding: 25px 0 0; margin-bottom: 57px;}
#photo .application .flex .item .step { position: absolute; top: -30px; left: 10px; width: 75px;}
#photo .application .flex .item .main { font-size: 15px; line-height: 130%; color: #ae8400; font-weight: 500;}

#photo .application .flex .item .itemimg { }

#photo .application .flex .item:nth-of-type(1) { padding-bottom: 25px;}
#photo .application .flex .item:nth-of-type(1) .main { margin-bottom: 20px;}
#photo .application .flex .item:nth-of-type(1) .itemimg { width: 50px;}
#photo .application .flex .item:nth-of-type(2) { padding-bottom: 25px;}
#photo .application .flex .item:nth-of-type(2) .main { margin-bottom: 18px;}
#photo .application .flex .item:nth-of-type(2) .sub { font-size: 13px; margin-bottom: 10px;}
#photo .application .flex .item:nth-of-type(2) .itemimg { width: 50px;}
#photo .application .flex .item:nth-of-type(3) .main { margin-bottom: 20px;}
#photo .application .flex .item:nth-of-type(3) .sub { font-size: 11px; line-height: 190%; width: 82%; margin: 0 auto 20px;}
#photo .application .flex .item:nth-of-type(3) .itemimg { width: 275px;}
#photo .application .flex .item:nth-of-type(4) { padding-bottom: 25px;}
#photo .application .flex .item:nth-of-type(4) .main { margin-bottom: 20px;}

#photo .application .other { }
#photo .application .other h5 { font-size: 17px; padding-left: 6px; border-left: 2px solid #000; margin-bottom: 20px;}
#photo .application .other li { font-size: 12px; line-height: 200%;}

/* ------------------------------------------------------------ event */
#event { background: url(../images/bg_ev_01.png) no-repeat -20% -40px / 167px, url(../images/bg_ev_02.png) no-repeat 100% -40px / 167px, url(../images/bg_ev_06.png) no-repeat -30% 38% / 197px, url(../images/bg_ev_06.png) no-repeat 170% 98% / 197px; background-color: #fefcec;  padding: 0 0 50px; text-align: center;}
#event .fv { height: 100%; min-height: auto; background: url(../images/fv_bg_sp.webp) no-repeat center center; background-size: cover;}
#event .fv div { background: none; margin: 0; }
#event .fv div img { width: 100%; height: auto; margin: -20px 0 0;}
#event .fv h2{ padding: 50px 0 0; }

#event .aoi { width: 75px; margin: 0 auto 25px;}
#event h3 { font-size: 27px; line-height: 1.233; margin-bottom: 45px; font-feature-settings: "palt";} 
#event h3 span { font-size: 16px; margin-bottom: 21px;} 
#event .box { margin-bottom: 40px;}
#event .box h4 { top: -17.5px; width: 200px; padding: 9px 0 9px; border-radius: 35px; font-size: 18px;}

#event .term { padding: 35px 0 20px;}
#event .term .jin { width: 70px; padding: 6px 0 7px; border-radius: 5px; font-size: 13px; margin: 0 auto 10px;}
#event .term .period { font-size: 18px; margin-bottom: 15px; font-feature-settings: "palt"; line-height: 1.4;}

#event .detail { padding: 33px 0 20px;}
#event .detail p { font-size: 13px;}

#event .benefit { padding: 38px 0 0; margin-bottom: 52px;}
#event .benefit .prize { padding: 23px 25px 0;}
#event .benefit img {  margin-bottom: 35px;}

#event .benefit .prize .award { width: 120px; padding: 17px 0 19px; border-radius: 60px; margin: 0 auto 20px;}
#event .benefit .prize .award p { font-size: 24px; letter-spacing: -0.04em; writing-mode: inherit; padding-left: 0;}
#event .benefit .prize .flex { display: block; text-align: center; border-bottom: 0px; padding-bottom: 0px;}
#event .benefit .prize .flex .right { text-align: center; margin-left: 0;}
#event .benefit .prize .flex h5 { font-size: 40px; margin-bottom: 10px; text-align: center;}
#event .benefit .prize .flex h5 span { font-size: 30px; margin-left: 0; margin-top: 5px;}
#event .benefit .prize .flex h5 span .price { font-size: 55px; font-weight: 600; }
#event .benefit .prize .flex .person { width: 90px; border-radius: 10px; padding: 7px 0; margin: 0 auto; font-size: 15px;}
#event .benefit .prize .flex .person span { font-size: 25px; margin-right: 2px; vertical-align: -2px;}
#event .benefit .prize .terms { padding: 32px 27px 20px; border-radius: 10px;}
#event .benefit .prize .terms .circle { top: -15px; width: 200px; border-radius: 30px; padding: 8px 0 8px; font-size: 15px;}
#event .benefit .prize .terms p { font-size: 13px; line-height: 1.667; }

#event .benefit .gold { padding-bottom: 25px; margin-bottom: 40px; position: relative; background: url(../images/bg_prize_lt.png) no-repeat left top / 36px,url(../images/bg_prize_rt.png) no-repeat right top / 36px,url(../images/bg_prize_lb.png) no-repeat left bottom / 36px,url(../images/bg_prize_rb.png) no-repeat right bottom / 36px, url(../images/bg_prize_sp.jpg) no-repeat center center / 100%;}
#event .benefit .gold .flex { margin-bottom:  20px;}
#event .benefit .gold .flex h5 { font-size: 40px; text-align: center; margin-bottom: 15px;}
#event .benefit .gold .flex h5 span { font-size: 12px; line-height: 1; margin-top: 15px; display: block;}

#event .benefit .gold .flex3 { display: block; margin-bottom: 0; padding-bottom: 0; border-bottom: 0px;}
#event .benefit .gold .flex3 .img { width: 100%;}

#event .benefit .gold .img { top: -13%; right: 10px; width: 22%; display: none }
#event .benefit .gold .img_2{ width: 145px; height: auto; margin: 0 auto 35px;}
#event .benefit .gold .img_2 p { font-size: 12px; font-weight: 500; margin-top: 3px;}
#event .benefit .gold .flex3 .img p { font-size: 12px; font-weight: 500; margin-top: 14px;}
#event .benefit .gold .flex3 .terms { width: 100%;}
#event .benefit .gold .flex3 .terms p:nth-of-type(2) { text-align: start;}

#event .benefit .silver { position: relative; padding-bottom: 30px; background: url(../images/bg_prize_lt.png) no-repeat left top / 36px,url(../images/bg_prize_rt.png) no-repeat right top / 36px,url(../images/bg_prize_lb.png) no-repeat left bottom / 36px,url(../images/bg_prize_rb.png) no-repeat right bottom / 36px, url(../images/bg_prize_sp.jpg) no-repeat center center / 100%;}
#event .benefit .silver .flex { margin-bottom: 14px;}
#event .benefit .silver .flex h5 { padding-right: 0;}
#event .benefit .silver .flex h5 span .price { vertical-align: -1px;}
#event .benefit .silver .terms { margin-bottom: 20px;}
#event .benefit .silver .caution { font-size: 13px; padding-left: 27px;}
#event .benefit .silver img { position: static; margin: 0 auto 35px;}


#event .partic { padding: 38px 0 0; margin-bottom: 0; border-bottom: 0px;}
#event .partic .step { width: 100%; padding: 20px 25px 25px; margin-bottom: 25px; }
#event .partic .step .flex1 { display: block;}
#event .partic .step .flex2 { display: block;}
#event .partic .step .flex2 .round { width: 60px; padding: 12px 0 8px; margin: 0 auto 15px;}
#event .partic .step .flex2 .round p { font-size: 10px;}
#event .partic .step .flex2 .round p span { font-size: 28px; margin-top: 2px;}
#event .partic .step .flex2 h5 { font-size: 20px; line-height: 1.5; text-align: center; letter-spacing: 0; margin-left: 0;}
#event .partic .step .flex1 img { }
#event .partic .step .txt { font-size: 13px; line-height: 1.769; text-align: left;}

#event .partic .step1 { }
#event .partic .step1 .flex2 { margin-bottom: 20px;}
#event .partic .step1 img { margin-bottom: 15px;}
#event .partic .step1 .beingelected {  }
#event .partic .step1 .red { font-size: 13px;  text-align: left; line-height: 1.333;}
#event .partic .step1 .wheretobuy { padding: 28px 16px 10px; margin-bottom: 25px;}
#event .partic .step1 .wheretobuy .circle { top: -17.5px; width: 200px; padding: 9px 0 9px; border-radius: 35px; font-size: 18px;}
#event .partic .step1 .wheretobuy li { padding: 16px 0 13px;}
#event .partic .step1 .wheretobuy li p { font-size: 13px; margin-bottom: 10px;}
#event .partic .step1 .wheretobuy li p:last-child { font-size: 11px; line-height: 1.273; margin-bottom: 0;}
#event .partic .step1 .wheretobuy li:first-child p:last-child,
#event .partic .step1 .wheretobuy li:last-child p:last-child { font-size: 13px;}
#event .partic .step1 a { width: 100%; padding: 14px 0 14px 0; background: url(../images/icn_02.svg) no-repeat 14% center / 20px, url(../images/arrow_04.png) no-repeat 95% center / 7px; background-color: #af120d; border-radius: 60px; font-size: 14px; letter-spacing: 0; line-height: 1.286;}

#event .partic .step2 { }
#event .partic .step2 .flex1 { margin-bottom: 30px;}
#event .partic .step2 p { }
#event .partic .step2 img { width: 223px; margin: 0 auto;}
#event .partic .step2 .beingelected,
#event .partic .step3 .beingelected { margin-bottom: 15px;}

#event .partic .step3 { }
#event .partic .step3 .flex1 { margin-bottom: 30px;}
#event .partic .step3 img { width: 222px; margin: 0 auto;}

#event .partic .step4 { margin-bottom: 50px;}
#event .partic .step4 .flex1 { margin-bottom: 30px;}
#event .partic .step4 .flex2 { margin-bottom: 16px;}
#event .partic .step4 .beingelected { padding: 40px 0 20px; margin-bottom: 0;}
#event .partic .step4 .beingelected .circle { top: -17.5px; width: 200px; padding: 9px 0 9px; border-radius: 35px; font-size: 18px;}
#event .partic .step4 .beingelected .txt { font-size: 15px; line-height: 1.667;}

#event .partic .stamp {  width: 275px; padding: 14px 0 14px 0; margin: 0 auto 50px; background: url(../images/icn_03.png) no-repeat 9% center / 21px, url(../images/arrow_04.png) no-repeat 95% center / 7px; background-color: #000; border-radius: 60px; font-size: 14px; letter-spacing: 0; line-height: 1.286;}

#event .partic .precautions { }
#event .partic .precautions h5 { font-size: 16px; margin-bottom: 20px;}
#event .partic .precautions h5:before { width: 3px; height: 25px; margin-right: 10px; vertical-align: -3px;}
#event .partic .precautions p { font-size: 11px; line-height: 1.769; }
#event .partic .precautions p span { display: block; line-height: 1.769; padding-left: 1em;}

/* ------------------------------------------------------------ locationlist */

#locationlist { padding: 50px 0 40px; background-size: 50px;}
#locationlist .whitebox { padding: 15px 5% 5px;}
#locationlist .whitebox:before { background: url(../images/note_02_sp.png) no-repeat center top; background-size: 100%;}
#locationlist .whitebox .territory { }
#locationlist .whitebox .territory h3 { width: 100%; padding: 16px 0 15px; font-size: 22px; margin-bottom: 20px;}
#locationlist .whitebox .territory .flex { display: block;}
#locationlist .whitebox .territory .flex .box { width: 100%; margin-bottom: 25px;}
#locationlist .whitebox .territory .flex .box:last-child { margin-bottom: 35px;}
#locationlist .whitebox .territory .flex .box img { margin-bottom: 15px;}
#locationlist .whitebox .territory .flex .box .name { font-size: 18px; margin-bottom: 15px;}
#locationlist .whitebox .territory .flex .box .detail { font-size: 13px; margin-bottom: 15px;}
#locationlist .whitebox .territory .flex .box .txt { font-size: 14px; margin-bottom: 20px; line-height: 1.5;}
#locationlist .whitebox .territory .flex .box .forinfo { display: block; width: 100%; margin: 0 auto; padding: 14px 0 16px 12px; background: url(../images/arrow_05.png) no-repeat 32% center / 8px; background-color: #ae8400; border-radius: 10px; font-size: 12px;}

#locationlist .whitebox .other { width: 100%; padding: 20px 0;}
#locationlist .whitebox .other p { font-size: 14px; line-height: 1.6;}

/* ------------------------------------------------------------ youtube */
#youtube { padding: 50px 0 40px; background-size: 50px;}
#youtube .whitebox { padding: 20px 0 25px; text-align: center;}
#youtube .whitebox:before { background: url(../images/note_05_sp.png) no-repeat center top; background-size: 100%;}
#youtube .whitebox h3 { font-size: 28px;  margin-bottom: 38px;}
#youtube .whitebox h3 .wave { /* background: url(../images/wave_01.png) repeat-x left bottom; background-size: 12px;  */padding-bottom: 5px; font-feature-settings: "palt"; line-height: 1.8;}
#youtube .whitebox .youtube{width: 100%; height: auto; }
#youtube .whitebox .youtube iframe{width: 100%; height: 100%;}
#youtube .whitebox p { font-size: 13px; line-height: 1.667; margin-bottom: 15px !important;}
#youtube .whitebox .caution { width: 85%; line-height: 1.333; padding: 8px 0 9px; font-size: 13px; margin: 0 auto 40px; border-radius: 50px;}

#youtube .whitebox .flex { display: block;}
#youtube .whitebox .flex .box { width: 80%; display: block; margin: 0 auto;}
#youtube .whitebox .flex .box:not(:nth-child(4)) {  margin: 0 auto 40px;}
#youtube .whitebox .flex .box img { margin-bottom: 9px;}
#youtube .whitebox .flex .box h4 { font-size: 18px; line-height: 1.556; margin-bottom: 4px;}
#youtube .whitebox .flex .box h4 span{font-size: 14px; line-height: 150%;}
#youtube .whitebox .flex .box p { font-size: 13px; line-height: 1.769; margin-bottom: 21px !important;}
#youtube .whitebox .flex .box .forinfo { display: block; width: 100%; margin: 0 auto; padding: 14px 0 16px 12px; background: url(../images/arrow_05.png) no-repeat 32% center / 8px; background-color: #ae8400; border-radius: 10px; font-size: 12px;}

/* ------------------------------------------------------------ campaign */

#campaign { padding: 50px 0 40px; background-size: 50px;}
#campaign .whitebox { padding: 30px 0 25px; text-align: center;}
#campaign .whitebox:before { background: url(../images/note_03_sp.png) no-repeat center top; background-size: 100%;}
#campaign .whitebox h3 { font-size: 28px;  margin-bottom: 38px;}
#campaign .whitebox h3 .wave { background: url(../images/wave_01.png) repeat-x left bottom; background-size: 12px; padding-bottom: 5px; font-feature-settings: "palt"; line-height: 1.8;}
#campaign .whitebox h3 .dot { padding-top: 0.1em; background-position: top left; background-repeat: repeat-x; background-size: 1em 0.3em; background-image: radial-gradient(0.1em 0.1em at center center,#000,#000 100%,transparent,transparent); position: relative;}
#campaign .whitebox p { font-size: 13px; line-height: 1.667; margin-bottom: 15px;}
#campaign .whitebox .caution { width: 85%; line-height: 1.333; padding: 8px 0 9px; font-size: 13px; margin: 0 auto 40px; border-radius: 50px;}

#campaign .whitebox .flex { display: block;}
#campaign .whitebox .flex .box { width: 80%; display: block; margin: 0 auto 40px;}
#campaign .whitebox .flex .box img { margin-bottom: 9px;}
#campaign .whitebox .flex .box h4 { font-size: 18px; line-height: 1.556; margin-bottom: 4px;}
#campaign .whitebox .flex .box p { font-size: 13px; line-height: 1.769; margin-bottom: 21px;}
#campaign .whitebox .flex .box .forinfo { display: block; width: 100%; margin: 0 auto; padding: 14px 0 16px 12px; background: url(../images/arrow_05.png) no-repeat 32% center / 8px; background-color: #ae8400; border-radius: 10px; font-size: 12px;}

/* ------------------------------------------------------------ spot_nav */
#spot_nav { background-size: 50px; padding: 26px 5% 60px;}
#spot_nav .around { width: 100%; background: url(../images/pic_13.png) no-repeat center 23px / 91px, url(../images/bg_02.jpg) no-repeat left top / cover; padding: 80px 2% 54px;/*  margin-bottom: 35px; */}
#spot_nav .around h3 { line-height: 1.5; font-size: 22px; margin-bottom: 20px; font-feature-settings: "palt";}
#spot_nav .around h3 strong{ padding: 20px 0 0; font-size: 40px; -webkit-text-stroke: 1px #000; text-stroke: 1px #000; }

#spot_nav .around p { font-size: 13px; line-height: 1.667; margin-bottom: 28px; font-feature-settings: "palt";}
#spot_nav .around ul { display: flex; justify-content: space-between; flex-wrap: wrap;}
#spot_nav .around li { width: 47%;}
#spot_nav .around li:nth-child(n+3) { margin-top: 32px;}

#spot_nav .around li p{ border-radius: 7px; }
#spot_nav .around li p span{ font-size: 13px; border-radius: 5px; }

.lang-ja #spot_nav .around li p{ left: 20px; top: -10px; width: 40px; height: 70px; }
.lang-ja #spot_nav .around li p span{ font-size: 15px; }

#spot_nav #yamanosu { padding-top: 35px;}
#spot_nav .whitebox { padding: 22px 0 40px; text-align: center;}
#spot_nav .whitebox:before { background: url(../images/note_04_sp.png) no-repeat center top; background-size: 100%;}
#spot_nav .whitebox h3 { font-size: 28px; line-height: 1.5; margin-bottom: 20px;}
#spot_nav .whitebox h3 .dot { padding-top: 0.1em;}
#spot_nav .whitebox p { font-size: 13px; line-height: 1.667; margin-bottom: 25px;}
#spot_nav .whitebox .flex { display: block;}
#spot_nav .whitebox .flex div { width: 275px; text-align: left; margin: 0 auto 40px;}
#spot_nav .whitebox .flex div:last-child { margin-bottom: 0;}
#spot_nav .whitebox .flex div img { margin-bottom: 15px;}
#spot_nav .whitebox .flex div h4 { font-size: 18px; margin-bottom: 15px;}
#spot_nav .whitebox .flex div p { font-size: 13px; line-height: 1.769; margin-bottom: 25px;}
#spot_nav .whitebox .flex div .forinfo { display: block; width: 250px;  margin: 0 auto; padding: 14px 0 16px 12px; background: url(../images/arrow_05.png) no-repeat 30% center / 8px; background-color: #ae8400; border-radius: 10px; font-size: 12px;}

/* ------------------------------------------------------------ insta */
#insta { padding: 50px 0 0;}

#insta h3 { font-size: 28px; margin-bottom: 21px;}
#insta h3 img { width: 37px; margin: 0 auto 19px;}


/* ------------------------------------------------------------ news */
#news { padding: 40px 0; }
#news h3 { font-size: 24px; padding: 0 0 20px;}
#news .news_inner { width: 94%; margin: 0 auto; }
#news .news_inner ul li { background: #fff; margin: 0 auto 3%; }
#news .news_inner ul li .news_item { display: block; padding: 6% 12% 6% 6%; }
#news .news_inner ul li p.date { font-size: 12px; float: none; width: 100%; padding: 0; margin-bottom: 5px; }
#news .news_inner ul li .clickable_div { float: none; width: 100%; padding: 0; }
#news .news_inner ul li .news_item:before,
#news .news_inner ul li .news_item:after { right: 3%; width: 20px; height: 2px; background: #000;}
#news .news_inner ul li .clickable_div h4 { font-size: 14px; }
#news .news_inner ul li .clickable_div p { max-height: inherit; font-size: 12px; }
#news .news_inner ul li .clickable_div p a { font-size: 12px; text-decoration: underline; }
#news .news_inner ul li .youtube iframe { width: 100%; height: auto; aspect-ratio: 16/9;}
#news .btns { width: 80%; padding: 16px 0 18px 18px; background: url(../images/arrow_05.png) no-repeat 28% center / 8px; background-color: #000; font-size: 12px; }


/* ------------------------------------------------------------ sponsor */
#sponsor { padding: 50px 0 50px; text-align: center;}
#sponsor h3 { font-size: 24px; margin-bottom: 20px;}
#sponsor .flex { display: block;}
#sponsor .flex .item { width: 80%; margin: 0 auto 20px;}
#sponsor .flex .item:last-child { margin-bottom: 0;}
#sponsor .flex .item div { content: ""; width: 100%; height: 64px; background: gray; margin-bottom: 19px;}
#sponsor .flex .item p { font-size: 13px;}


/* --------------------------------------------------------------------- gokokuin */
#gokokuin{ padding: 70px 0; }
#gokokuin:before,
#gokokuin:after{ height: 40px; }
#gokokuin:before{ background-position: center bottom; }
#gokokuin:after{ background-position: center top; }

#gokokuin .topttl{ padding: 0 0 50px; }
#gokokuin .topttl .flex{ flex-direction: column; }
#gokokuin .topttl .sub{ margin: 0 0 23px; border-radius: 0; font-size: 15px; }
#gokokuin .topttl h3{ width: 250px; margin: 0 auto; }
#gokokuin .topttl h3 img{ width: 100%; height: auto; }
#gokokuin .topttl h4{ width: 250px; margin: 0 auto 35px; }
#gokokuin .topttl p{ font-size: 12px; }


.champaign .ttl{ margin: 0 0 80px; }
.champaign .ttl h4{ margin: 0 0 20px; }
.champaign .ttl h4 img{ width: 250px; margin: 0 auto; }
.champaign .ttl h4:before,
.champaign .ttl h4:after{ width: 10%; height: 8px; border-top: 1px solid #000; border-bottom: 1px solid #000; }
.champaign .ttl p{ margin: 0 0 15px; font-size: 12px; }

.champaign .ttl dl{ flex-wrap: wrap; justify-content: flex-start; margin: 0 10% 10px; }
.champaign .ttl dt{ width: 24%; margin: 10px 7px 10px 0; font-size: 13px; border: 1px solid #000; }
.champaign .ttl dd{ width: 72%; margin: 10px 0; font-size: 15px; line-height: 150%; }
.champaign .ttl .items.PC{ display: none; }
.champaign .ttl .items img{ width: calc(100% / 3 - 3%); }


.champaign-box{ padding: 80px 5% 20px; }
.champaign-box .dash{ padding: 0; }
.champaign-box .champ-ttl{ height: 85px; width: 95%; }
.champaign-box .champ-ttl .number{ width: 70px; height: 100%; padding: 16px 5px; font-size: 45px; }
.champaign-box .champ-ttl .number small{ font-size: 10px; }
.champaign-box .champ-ttl h5{ width: 100%; height: 85px; padding: 9px 10px 9px 15px; font-size: 15px; }

.lang-en .champaign-box .champ-ttl h5{ font-size: font-size: 12px; }

.champaign-box .champ-flex{ flex-wrap: wrap; }
.champaign-box .champ-flex img{ order: 2; width: 39%; margin: 0 15px; }
.champaign-box h6{ font-size: 20px; order: 1; width: 100%; margin: 0 0 20px; }
.champaign-box h6 small{ font-size: 41px; }
.champaign-box h6 strong{ font-size: 25px; }
.champaign-box h6 em{ font-size: 13px; }

.champaign-box .content li,
.champaign-box .content li:last-of-type{ width: 100%; padding: 20px 20px 20px 25px; }
.champaign-box .content h7{ margin: 0 0 15px; font-size: 15px; }
.champaign-box .content h7:before{ top: 6px; left: -25px; width: 11px; height: 6px; }
.champaign-box .content p{ font-size: 12px; }
.champaign-box .content p small { font-size: 12px; padding-top: 10px; }

.champaign-box .content li:first-of-type{ margin: 0 0 15px; }
.champaign-box .content li:nth-of-type(2){ order: 2; margin: 0 0 15px; }
.champaign-box .content li:last-of-type{ order: 3; }
.champaign-box .content dl{ margin: 10px 0; }
.champaign-box .content dt{ margin: 0 0 15px; padding: 8px 16px; font-size: 13px; border-radius: 4px; }
.champaign-box .content dd a{ font-size: 12px; }

.champaign-box .largecontent { padding: 20px 20px 20px 25px; margin-top: 15px; }
.champaign-box .largecontent h7{ margin: 0 0 15px; font-size: 15px; line-height: 160%; }
.champaign-box .largecontent h7:before{ top: 6px; left: -25px; width: 11px; height: 6px; }
.champaign-box .largecontent h7 span{ display: inline-block; font-size: 12px; padding-left: 2rem; }
.champaign-box .largecontent dl{ display: block; margin: 15px 0 0; }
.champaign-box .largecontent dt{ width: 51px; padding: 6px 0; font-size: 12px; }
.champaign-box .largecontent dd.dot{ display: none; }
.champaign-box .largecontent dd{ width: 100%; font-size: 12px; line-height: 250%; }
.champaign-box .largecontent dd a{ line-height: 250%;}
.champaign-box .largecontent dd a span { font-size: 10px; }

.champaign01{ margin: 0 0 90px; }
.champaign02{ margin: 0 0 40px; }
.champaign02 h6{ width: 200px; margin: 0 auto; font-size: 23px; }
.champaign02 .dash:first-of-type{ margin: 0 0 60px; }
.champaign02 .champ-flex::before,
.champaign02 .champ-flex::after{ width: 1px; height: 35px; top: 49%; }
.champaign02 .content li:last-of-type{ padding-bottom: 0; }


.lang-en .champaign02 .champ-flex::before,
.lang-en .champaign02 .champ-flex::after{ left: 50%; top: 49%; }


.champaign-box .detail{ padding: 0 0 40px; font-size: 12px; }
.champaign02 .btns{ width: 100%; margin: 0 auto 22px; }
.champaign-box .content figure{ width: 70px; }
.champaign-box .content figcaption{ padding: 0 0 10px; font-size: 12px; }
.champaign-box .content figure:last-of-type{ width: 110px; }

#gokokuin .contact{ width: 100%; }
#gokokuin .contact p{ width: 100%; margin: 0 0 15px; height: 50px; font-size: 12px; }
#gokokuin .contact dt{ font-size: 15px; text-align: left; }
#gokokuin .contact dt small{ margin-left: 0; font-size: 12px; padding: 10px 0 0 10px; }
#gokokuin .contact dd{ text-align: left; }
#gokokuin .contact dd a{ font-size: 23px; }
#gokokuin .contact dd img{ width: 21px; margin-right: 2px; }


/* --------------------------------------------------------------------- sakin */
#sakin{ padding: 10px 0 90px; background: url(../images/sakin/bg_top-sp.png) center top/100% no-repeat, url(../images/sakin/bg_bottom-sp.png) center bottom/100% no-repeat; }
#sakin .bg{ padding: 30px 0 0; background: url(../images/sakin/pic_01.png) 10px top/100px no-repeat, url(../images/sakin/pic_02.png) 98% 160px/100px no-repeat; }
#sakin h3{ width: 300px; }

#sakin .sub-ttl{ position: relative; padding: 0 0 50px; padding-top: 0px; font-size: 20px; line-height: 250%; font-weight: 500; }
#sakin .sub-ttl:after{ position: absolute; content: ""; width: 100%; height: 200px; left: 0; top: -65px; background: url(../images/sakin/item_04.png) center/100% no-repeat; }
#sakin .sub-ttl img{ width: 280px; display: block; margin: 0 auto; }


#sakin .sakin-box{ margin: 0 0 50px; }
#sakin h4{ margin: 0 0 20px; padding: 19px 0; font-size: 18px; }
#sakin .area ul{ flex-direction: column; }
#sakin .area li{ width: 100%; }
#sakin .area li:nth-of-type(2){ margin: 15px 0; padding: 15px 0; border-bottom: 1px solid #d8d8d8; border-top: 1px solid #d8d8d8; }
#sakin .area li .area{ margin: 0 0 15px; font-size: 14px; }
#sakin .area-btn a{ padding: 13px 0 10px; border-radius: 5px; background: url(../images/sakin/btn-sp.png) center/cover no-repeat; }
#sakin .area-btn a p{ font-size: 13px; letter-spacing: 0.1em; }
#sakin .area-btn a small{ font-size: 11px; padding-left: 5px; }
#sakin .area-btn a span{ display: inline; font-size: 19px; }

#sakin .qualification{ padding: 0 0 50px; }
#sakin .qualification dt{ float: none; width: 115px; margin: 0 0 15px; padding: 9px 0; font-size: 14px; }
#sakin .qualification dd{ margin: 0 0 25px; padding: 0; font-size: 15px; line-height: 170%; }
#sakin .qualification dd small{ font-size: 12px; line-height: 200%; }


#sakin .schedule{ width: 100%; border: 1px solid #f39800; }
#sakin .schedule-header{ padding: 7px 0 10px; background: #f19600; }
#sakin .schedule-header p{ font-size: 20px; }
#sakin .schedule-body{ padding: 20px 5% 25px; }
#sakin .schedule-body li{ display: block; padding: 0; }
#sakin .schedule-body li:nth-of-type(2){ margin: 25px 0; padding: 25px 0; }
#sakin .schedule-body li:last-of-type{ padding: 0; }
#sakin .schedule-body .type{ margin: 0 auto 20px; width: 90px; padding: 8px 0; font-size: 15px; }

#sakin .schedule-body dl{ display: flex; justify-content: space-between; text-align: center; }
#sakin .schedule-body dl div{ width: calc(100% / 3); }
#sakin .schedule-body dl div:nth-of-type(2){ width: 40%; }

#sakin .schedule-body dt{ float: none; width: 80px; margin: 0 auto 7px; padding: 4px 0; font-size: 13px; }
#sakin .schedule-body dd{ display: block; margin: 0 0 30px; padding: 0; }
#sakin .schedule-body dd:last-of-type{ margin: 0; }
#sakin .schedule-body dd .line{ padding: 0 0 35px; line-height: 170%; }
#sakin .schedule-body dd .line:after{ top: initial; right: initial; width: 1px; height: 15px; bottom: 12px; left: 50%;  }
#sakin .schedule-body dd .line-l::after{ width: 1px; height: 25px; bottom: 2px; }
#sakin .schedule-body dd p{ font-size: 13px; line-height: 170%; }
#sakin .schedule-body dd p img{ display: block; width: 25px; margin: 10px auto 0; }

#sakin .schedule-body dd .comment{ width: 100px; top: initial; left: initial; right: -61vw; bottom: -80px;  }
#sakin .schedule-body dd .comment small{ position: relative; line-height: 170%; background: #fff; font-size: 11px; border-radius: 10px; }
#sakin .schedule-body dd .comment small:before{ position: absolute; content: ""; width: 15px; height: 15px; background: #fff; border-left: 1px solid #000; border-top: 1px solid #000; rotate: -45deg; left: -8px; top: 29px; z-index: 1; }

#sakin .schedule-body .universe:before{ top: 89px; left: 50%; translate: -50% 0; width: 58vw; height: 1px; }
#sakin .schedule-body dd small.asta{ position: initial; width: 100vw; margin: 0 calc(50% - 50vw); font-size: 12px; padding: 15px 0 0; line-height: 170%; }

#sakin .schedule-body dl.flex{ display: block; }
#sakin .schedule-body dl.flex dd{ padding: 0 0 30px; }
#sakin .schedule-body dl.flex dd:last-of-type{ padding: 0; }
#sakin .schedule-body dl.flex dd::after{ top: 38px; right: initial; width: 1px; height: 30px; left: 50%; }

#sakin .schedule-body .adjust{ margin: 0; }
#sakin .schedule-body .line.adjust-after:after{ width: 1px; right: initial; }


#sakin .application .sub{ margin: 0 0 20px; font-size: 14px; }
#sakin .application .qr-area{ justify-content: space-between; }
#sakin .application figure{ width: 94px; margin: 0; }
#sakin .application figcaption{ margin: 0 0 13px; font-size: 12px; }


.finised{ width: 100%; font-size: 20px; }



/* ------------------------------------------------------------ cycling */
#cycling { background: url(../images/cycling/bg_sp.jpg) center bottom/cover no-repeat; }
#cycling .top{ padding: 50px 0 60px; background: url(../images/cycling/bg_02_sp.png) no-repeat center top / cover; }
#cycling .top .sub-ttl{ padding: 0 0 20px; background: url(../images/cycling/img_03.png)5% top/30px no-repeat, url(../images/cycling/img_04.png) right 5% top/30px no-repeat; }
#cycling .top .en img{ width: 31px; margin-right: 12px; }
#cycling .top .en small{ font-size: 10px; }
#cycling .top .ja{ font-size: 25px; }

#cycling .top .ttl{ width: 90%; padding: 13px 0 14px; font-size: 30px; border: 1px solid #fff; }
#cycling .top .ttl span { filter: drop-shadow(4px 4px 0px #2a75a1); }


.cycling-box{ padding: 0 0 50px; }
.cycling-box .flex{ display: block; }
.cycling-box .item{ width: 100%; }

.cycling-box .text{ position: relative; width: 100%; padding: 20px 0 20px; }
.cycling-box .text .type{ display: inline-block; margin: 0 0; padding: 11px 17px 12px 12px; font-size: 12px; text-align: left; }
.cycling-box .text .type01 { margin: 0 0; }
.cycling-box .text .type02 { margin: 0 0; }
.cycling-box .text h4{ margin-bottom: 15px; margin-top: 23px; font-size: 23px; }
.cycling-box02 .text h4{font-size: 25px; }

.cycling-box .total{ width: 69%; padding: 0 0 8px; border-bottom: 2px dotted #000; }
.cycling-box .total img{ margin-right: 10px; margin-top: 10px; width: 30px; height: auto; }
.cycling-box .total p{ font-size: 15px; padding-top: 2px; }
.cycling-box .total p strong{ font-size: 28px; padding: 0 2px; }
.cycling-box .total p em{ font-size: 18px; }

.cycling-box .description .txt{ padding: 25px 0 0; font-size: 12px; }
.cycling-box02 .text{ padding: 0 0; }
.cycling-box02 .text img{ position: absolute; top: 7%; right: -3%; width: 139px; }


.lang-en .cycling-box .total{ display: flex; width: 100%; }
.lang-en .cycling-box .total p{ font-size: 18px; }
.lang-en .cycling-box .total p strong{ font-size: 28px; }
.lang-en .cycling-box .total p em{ font-size: 18px; }

.lang-en .cycling-box02 .text h4{ font-size: 23px; }
.lang-en .cycling-box02 .text img{ top: -35%; }



.prefecture{ display: block; }
.prefecture-box{ width: 100%; margin: 0 0 10px; }
.prefecture-box h4{ font-size: 20px; }
.prefecture-box h4 small{ padding: 0 0 5px; font-size: 12px; }
.prefecture-box h4::before,
.prefecture-box h4::after{ width: 34%; }

.prefecture-box li{ margin: 0 0 35px; }
.prefecture-box li figcaption{ bottom: -16px; padding: 6px 0; font-size: 14px; }


#cycling .caution{ display: block; padding: 0 0 30px; }
#cycling .caution .pic{ font-size: 18px; padding: 0 0 10px; }
#cycling .caution .pic img{ width: 27px; margin-right: 12px; }
#cycling .caution .txt{ border-left: none; border-top: 2px dotted #7f807f; width: 100%; font-size: 13px; padding: 15px 0 0; }

#cycling .qr-cord{ flex-wrap: wrap; }
#cycling .qr-cord li{ padding: 0 0 20px; }
#cycling .qr-cord .w-box{ flex-wrap: wrap; height: 150px; }
#cycling .qr-cord figure{ width: 100%; margin: 0; }
#cycling .qr-cord a{ display: flex; justify-content: flex-start; align-items: center; text-align: left; line-height: 170%; }
#cycling .qr-cord img{ width: 32%; margin-right: 10px; margin-left: 5%; }

#cycling .qr-cord01{ width: 48%; }
#cycling .qr-cord02{ width: 48%; }
#cycling .qr-cord02 .w-box{ align-items: flex-start; padding-top: 15px; }
#cycling .qr-cord03{ width: 100%; }
#cycling .qr-cord03 .w-box{ display: flex; align-items: center; padding: 0 5%; }
#cycling .qr-cord03 figure{ width: 29%; margin-right: 25px; }
#cycling .qr-cord03 img{ width: 100%; height: auto; }
#cycling .qr-cord03 .contacts{ /* width: 55% */ }
#cycling .qr-cord03 p{ font-size: 12px; }
#cycling .qr-cord03 a{ font-size: 12px; text-align: left; }



}