@charset "UTF-8";
:root{
  --color-red: #D6000F;
  --color-yellow: #FFF100;
  --color-orange: #F08500;
  --color-black: #231815;
  --color-text: #fff;
}
*{
  position: relative;
  box-sizing: border-box;
  line-height: 1;
  margin: 0;
  color: var(--color-text);
  font-weight: bold;
}
html{
  height: 100%;
}
body{
  background: var(--color-red);
  display: block;
  margin: 0;
  padding: 0;
  font-size: 1rem;
  font-family: 
  "Meiryo",
  "Helvetica Neue",
  Arial,
  "Hiragino Kaku Gothic ProN",
  "Hiragino Sans",
  sans-serif;
}
h1,h2,h3,h4,h5,h6{
  line-height: 1;
  font-weight: bold;
  padding: 0;
  margin: 0;
  font-size: 1rem;
}
h2 .img{
  max-width: 901px;
  margin: 70px auto 40px;
}
h2 .img.sp{
  max-width: 692px;
}

ul,li{
  list-style-type: none;
  padding: 0;
  margin: 0;
}
a{
  text-decoration: none;
}
img{
  width: 100%;
  vertical-align: bottom;
}
.text{
  margin-bottom: 40px;
}
.text p{
  font-size: 24px;
  text-align: center;
  line-height: 1.7;
}
.text .lead{
  font-size: 32px;
  margin-bottom: 10px;
}
.text .note{
  font-size: 16px;
  line-height: 1.5;
  margin-top: 8px;
}
.btn{
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--color-yellow);
  border: 5px solid var(--color-orange);
  border-radius: 50px;
  margin: 0 auto;
  width: 80%;
}
.btn.disabled{
  pointer-events: none;
  background-color: #9FA0A0;
  border: 5px solid #7B7A7B;
}
.main{
  padding-top: 145px;
  margin-bottom: 100px;
}
.inner{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}
.content{
  max-width: 916px;
  margin: 0 auto;
  padding: 0 8px;
}
.sp{
  display: none;
}
@media screen and (max-width:767px){
  h2 .img{
    margin: 40px auto 20px;
  }
  .text{
    max-width: 620px;
    margin: 0 auto;
    padding: 0 16px;
    margin-bottom: 16px;
  }
  .text p{
    text-align: left;
    font-size: 16px;
  }
  .text .lead{
    text-align: center;
    font-size: 20px;
  }
  .text .note{
    font-size: 10px;
    margin-top: 4px;
  }
  .btn{
    border-width: 3px;
    width: 90%;
  }
  .main{
    padding-top: 80px;
  }
  .content{
    padding: 0 16px;
  }
  .sp{
    display: block;
  }
  a.sp{
    display: inline-block;
  }
  .pc{
    display: none;
  }
}
/** header **********/
header{
  position: fixed;
  top: 0;
  left: 0;
  background: var(--color-red);
  width: 100%;
  height: 145px;
  z-index: 999;
  box-shadow: 0 0 8px 0 #231815;
}
header>div{
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1200px;
  height: 100%;
  margin: 0 auto;
  padding: 0 20px 0 10px;
}
h1 .img{
  width: 146px;
  height: 106px;
}
.menu{
  width: 100%;
  max-width: 1200px;
  height: 145px;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  transition: .3s;
}
.menu a{
  display: block;
  padding: 30px 0;
}
.menu a .img{
  margin: 0 auto;
  padding: 0 20px;
}
.menu #top .img{max-width: calc(98px + 40px);}
.menu #activity .img{max-width: calc(194px + 40px);}
.menu #reserve .img{max-width: calc(152px + 40px);}
.menu #enter .img{max-width: calc(223px + 40px);}
.menu #qa .img{max-width: calc(102px + 40px);}
#menu-btn{
  display: none;
  background-image: url(./img/SP_menu.jpg);
  background-color: #fff;
  width: 50px;
  height: 48px;
  transition: .3s;
}
@media screen and (max-width:767px){
  header{
    height: 80px;
  }
  h1 .img{
    width: calc(146px / 2);
    height: calc(106px / 2);
  }
  .menu{
    position: absolute;
    top: calc(-80px * 6 - 4px);
    left: 0;
    height: auto;
    flex-direction: column;
    align-items: center;
    padding-top: 80px;
    padding-bottom: 0;
    background: var(--color-red);
  }
  .menu.open{
    top: 0;
  }
  .menu a{
    display: flex;
    align-items: center;
    border-bottom: 1px solid #E4764F;
    width: 100%;
    height: 80px;
    padding: 0;
  }
  .menu a .img{
    position: absolute;
    top: 50%;
    left: calc((100vw - 194px) / 2);
    transform: translate(0 ,-50%);
    padding: 0;
  }
  .menu a:nth-child(1){
    border-top: 1px solid #E4764F;
  }
  .menu a.current, .menu a:hover{
    background: #BD0008;
  }
  #menu-btn{
    display: block;
  }
  #menu-btn.active{
    background-image: none;
  }
  #menu-btn.active::before,#menu-btn.active::after{
    position: absolute;
    content: '';
    width: 32px;
    height: 4px;
    background: var(--color-red);
  }
  #menu-btn.active::before{
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
  }
  #menu-btn.active::after{
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
  }
}
/** footer **********/
footer{
  margin-bottom: 100px;
  padding: 0 8px 60px;
}
footer>div{
  width: 100%;
  max-width: 1040px;
  margin: 0 auto;
}
footer .contact{
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  margin-bottom: 10px;
}
footer .copyright{
  max-width: 196px;
}
footer .contact .contact_address{
  border: 1px solid #fff;
  font-size: 20px;
  width: 190px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 10px;
  padding: 2px 24px 0;
}
footer .contact p{
  width: calc(100% - 190px - 10px);
  line-height: 1.4;
  padding-top: 4px;
}
footer .text{
  max-width: none;
  font-size: 12px;
  line-height: 1.4;
  margin-bottom: 0;
  display: inline;
}
footer .text03{
  display: block;
  text-indent: -30px;
  padding-left: 30px;
}
footer .bottom{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 8px;
}
footer .note{
  border: 1px solid #fff;
  font-size: 12px;
  line-height: 1.2;
  padding: 4px 8px 2px;
}
footer .pdf_link{
  font-size: 14px;
  text-decoration: underline;
  margin: 0 6px;
  line-height: 1.2;
}
@media screen and (max-width:767px){
  footer{
    padding: 0 16px 24px;
  }
  footer .contact{
    align-items: flex-start;
    margin-bottom: 8px;
  }
  footer .contact .contact_address{
    font-size: 14px;
    width: 120px;
    padding: 16px 4px 14px;
    margin-right: 8px;
  }
  footer .contact p{
    width: calc(100% - 84px - 8px);
    margin-top: 2px;
  }
  footer .contact_tel{
    display: block;
    padding-left: 6px;
  }
  footer .text{
    display: block;
    text-indent: -25px;
    padding-right: 0;
    padding-left: 25px;
  }
  footer .bottom{
    flex-direction: column;
    margin-top: 6px;
  }
  footer .note{
    width: 100%;
    font-size: 10px;
    margin-right: 0;
    margin-bottom: 10px;
  }
  footer .pdf_link{
    font-size: 12px;
    margin-bottom: 24px;
  }
}


/*
** TOP
*/
/** .intro **********/
.intro-img{
  width: 100%;
  max-width: 890px;
  height: 0;
  padding-top: 17.9%;
  background: url(./img/img01.png) no-repeat top center / contain;
  margin: 0 auto 56px;
}
.intro .text{
  margin: 50px auto 40px;
}
.intro .btn{
  max-width: 480px;
  height: 60px;
}
.intro .btn .img{
  width: 190px;
}
/** .summary **********/
.summary dl{
  margin: 0 auto;
  width: fit-content;
}
.summary dl>div{
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 24px;
}
.summary dt{
  width: 130px;
  font-size: 20px;
  text-align: center;
  color: var(--color-black);
  background-color: var(--color-yellow);
  border: 5px solid var(--color-orange);
  border-radius: 14px;
  padding: 10px 0 6px;
  margin-right: 24px;
}
.summary dd{
  width: calc(100% - 130px - 24px);
  max-width: 700px;
}
.summary dd p{
  font-size: 30px;
  line-height: 1.4;
  padding-top: 5px;
}
.summary dd .address{
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.summary dd .address span{
  font-size: 22px;
  margin-right: 24px;
}
.summary dd .address a{
  width: 140px;
  text-align: center;
  font-size: 18px;
  color: var(--color-black);
  background-color: var(--color-yellow);
  border: 2px solid var(--color-orange);
  padding: 10px 0 6px;
  margin-bottom: 4px;
}
.summary dd .note{
  display: inline-block;
  margin-top: 6px;
  font-size: 16px;
  text-indent: -16px;
  padding-left: 16px;
}
.summary dd .line{
  text-decoration: underline;
  color: var(--color-yellow);
}
.summary dd .time{
  padding-top: 16px;
  display: flex;
  flex-wrap: wrap;
}
.summary dd .time div{
  max-width: calc((100% - 40px) / 2);
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-left: 40px;
  margin-bottom: 16px;
}
.summary dd .time div:nth-child(2n+1){
  margin-left: 0;
}
.summary dd .time span{
  font-size: 18px;
  color: var(--color-black);
  background-color: var(--color-yellow);
  padding: 6px 10px 3px;
  margin-right: 10px;
}
.summary dd .time p{
  font-size: 26px;
  padding-top: 2px;
}
/** .activity **********/
#top .activity .content .img{
  max-width: 900px;
  margin: 0 auto;
}
@media screen and (max-width:767px){
  .intro .text p{
    text-align: center;
  }
  .intro-img{
    max-width: 323px;
    padding-top: calc(323px * .749);
    background: url(./img/SP_img.png) no-repeat top center / contain;
    margin-bottom: 24px;
  }
  .intro .btn{
    height: auto;
    padding: 6px 18%;
  }
  .summary dl>div{
    margin-bottom: 12px;
  }
  .summary dt{
    width: 74px;
    font-size: 12px;
    border-width: 2px;
    border-radius: 8px;
    padding: 6px 0 4px;
    margin-right: 12px;
  }
  .summary dd{
    width: calc(100% - 74px - 12px);
  }
  .summary dd p{
    font-size: 16px;
    padding-top: 2px;
  }
  .summary dd .address{
    flex-direction: column;
    align-items: flex-start;
  }
  .summary dd .address span{
    font-size: 12px;
    line-height: 1.7;
    margin-bottom: 4px;
  }
  .summary dd .address a{
    width: 100%;
    font-size: 12px;
    padding: 6px 0;
    margin-bottom: 0;
  }
  .summary dd .note{
    margin-top: 0;
    font-size: 10px;
    line-height: 1.2;
    text-indent: -10px;
    padding-left: 10px;
  }
  .summary dd .time{
    padding-top: 10px;
    max-width: 300px;
  }
  .summary dd .time div{
    width: calc((100% - 16px) / 2);
    margin-left: 16px;
    margin-bottom: 8px;
  }
  .summary dd .time div:nth-child(2n+1){
    margin-left: 0;
  }
  .summary dd .time span{
    font-size: 10px;
    padding: 4px 5px 2px;
    margin-right: 4px;
  }
  .summary dd .time p{
    font-size: 12px;
    padding-top: 0;
  }
  #top .activity .content{
    padding: 0 8px;
  }
}
@media screen and (max-width:424px){
  .intro .text p{
    font-size: 3.5vw;
  }
}


/*
** activity
*/
/** .activity **********/
.activity li{
  width: 100%;
  max-width: 900px;
  margin: 0 auto 60px;
  padding-top: 90px;
}
.activity li .job-bg{
  background:
  url(./img/bg03.png) no-repeat 0 100%,
  url(./img/bg02.png) repeat-y 0 0;
  background-size: 100% auto;
  padding: 24px 40px 40px;

}
.activity li::before{
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding-top: 10.288%;
}
.job01::before{background: url(./img/subimg_line01.png) no-repeat 0 0 / contain;}
.job02::before{background: url(./img/subimg_line02.png) no-repeat 0 0 / contain;}
.job03::before{background: url(./img/subimg_line03.png) no-repeat 0 0 / contain;}
.job04::before{background: url(./img/subimg_line04.png) no-repeat 0 0 / contain;}
.job05::before{background: url(./img/subimg_line05.png) no-repeat 0 0 / contain;}
.job06::before{background: url(./img/subimg_line06.png) no-repeat 0 0 / contain;}
.job07::before{background: url(./img/subimg_line07.png) no-repeat 0 0 / contain;}
.job-title{
  position: absolute;
  top: 0;
  left: 0;
}
.job01 .job-title{width: 28.889%; margin-left: 2.75%;}
.job02 .job-title{width: 16.667%; margin-left: 9%;}
.job03 .job-title{width: 36.667%; margin-left: 3%;}
.job04 .job-title{width: 15.112%; margin-left: 10%;}
.job05 .job-title{width: 31.111%; margin-left: 3.125%;}
.job06 .job-title{width: 15.556%; margin-left: 9%;}
.job07 .job-title{width: 20.444%; margin-left: 7.25%;}
.job01 .job-title,
.job03 .job-title,
.job04 .job-title{margin-top: 2.876%;}
.job02 .job-title,
.job05 .job-title,
.job06 .job-title,
.job07 .job-title{margin-top: 2.655%;}
.job-wrap{
  display: flex;
  justify-content: space-between;
}
.job{
  width: 100%;
  max-width: calc(100% - 44.12% - 5%);
  margin-right: 5%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.job p{
  color: var(--color-black);
  line-height: 1.5;
  margin-bottom: 12px;
}
.job .note{
  font-size: 14px;
  text-indent: -14px;
  padding-left: 14px;
}
.job .detail{
  display: flex;
  justify-content: space-between;
}
.job .detail div{
  border: 4px solid var(--color-orange);
  width: 32%;
  margin-left: 3%;
}
.job .detail div:nth-child(1){
  margin-left: 0;
}
.job .detail dt,
.job .detail dd{
  color: var(--color-black);
  font-size: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.job .detail dt{
  background: var(--color-yellow);
  border-bottom: 4px solid var(--color-orange);
  padding: 14px 0 12px;
}
.job .detail dd{
  background: #fff;
  height: 64px;
  padding-top: 4px;
}
.job .detail div:nth-child(3) dd{
  font-size: 16px;
}
.job01 .detail div:nth-child(3) dd{
  font-size: 14px;
}
.job-wrap .img{
  width: 100%;
  max-width: 372px;
  margin: 0 auto;
}
.bp{
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 32px;
}
.job07 .bp>div{
  display: flex;
  justify-content: center;
  align-items: center;
}
.bp p{
  color: var(--color-black);
  padding: 4px 6px 0 0;
}
.job07 .bp>div p{
  padding: 0 0 4px;
}
.bp .img{
  width: 100%;
}
.job01 .bp .img{max-width: 200px;}
.job03 .bp .img{max-width: 255px;}
.job03 .bp .img2{max-width: 280px;}
.job05 .bp .img{max-width: 400px;}
.job06 .bp .img{max-width: 280px;padding-bottom: 2.25%;}
@media screen and (max-width:919px){
  .activity li{
    padding-top: 10%;
  }
  .activity li .job-bg{
    padding: 2.62vw 4.367vw 4.367vw;
  }
  .job p{
    font-size: 1.75vw;
  }
  .job .detail div,
  .job .detail dt{
    border-width: 2px;
  }
  .job .detail dt,
  .job .detail dd{
    font-size: 2.2vw;
  }
  .job .detail dt{
    padding: 1.546vw 0 1.327vw;
  }
  .job .detail dd{
    height: 7.08vw;
  }
  .job .detail div:nth-child(3) dd{
    font-size: 1.75vw;
  }
  .job01 .detail div:nth-child(3) dd{
    font-size: 1.5vw;
  }
  .bp{
    padding-top: 3.54vw;
  }
  .bp p{
    font-size: 12px;
  }
  .bp .img{
    width: calc(100% - 126px);
  }
}
@media screen and (max-width:539px){
  .job06 .bp .img{padding-bottom: 3vw;}
  .job07 .bp{
    display: block;
  }
  .job07 .bp>p{
    text-align: center;
  }
}
/** .shop **********/
.shop .img-wrap{
  width: 100%;
  max-width: 904px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
}
.shop .img-wrap .img:nth-child(1){
  margin-right: 2%;
}
.shop .img-wrap .img{
  width: 48.23%;
  max-width: 436px;
}
@media screen and (max-width:767px){
}
@media screen and (max-width:539px){
  .job-wrap{
    flex-direction: column-reverse;
  }
  .job-wrap .img{
    margin-bottom: 5%;
  }
  .job{
    max-width: none;
  }
  .job p{
    font-size: 14px;
  }
  .job .detail dt,
  .job .detail dd{
    font-size: 3.5vw;
  }
  .job .detail dt{
    padding: 2.25vw 0 1.75vw;
  }
  .job .detail dd{
    height: 10vw;
  }
  .job01 .detail div:nth-child(3) dd{
    font-size: 2.5vw;
  }
  .job .detail div:nth-child(3) dd{
    font-size: 2.75vw;
  }
}


/*
** reserve
*/
/** .reserve **********/
.reserve .part{
  width: 100%;
  max-width: 896px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
.reserve .part div{
  padding: 4px;
  width: calc((100% - 24px * 3) / 4);
  margin-left: 24px;
}
.reserve .part div:nth-child(1){
  margin-left: 0;
}
.reserve .part dt,
.reserve .part dd{
  color: var(--color-black);
  font-size: 22px;
  text-align: center;
}
.reserve .part dt{
  padding: 10px 0 6px;
  margin-bottom: 4px;
}
.reserve .part dd{
  background: #fff;
  padding: 12px 0 6px;
}
.reserve .part dd p{
  color: var(--color-black);
}
.reserve .part dd .start{
  width: 130px;
  color: #fff;
  font-size: 16px;
  padding: 8px 0 4px;
  margin: 6px auto 0;
  border-radius: 14px;
  line-height: 1.2;
}
.reserve .part div:nth-child(1){background: #F6AB00;}
.reserve .part div:nth-child(1) dt{background: #FFF100;}
.reserve .part div:nth-child(1) dd .start{background: #F39A00;}
.reserve .part div:nth-child(2){background: #37AF52;}
.reserve .part div:nth-child(2) dt{background: #ABCD03;}
.reserve .part div:nth-child(2) dd .start{background: #009944;}
.reserve .part div:nth-child(3){background: #00ACEB;}
.reserve .part div:nth-child(3) dt{background: #5EC5F2;}
.reserve .part div:nth-child(3) dd .start{background: #00ACEB;}
.reserve .part div:nth-child(4){background: #E95D9D;}
.reserve .part div:nth-child(4) dt{background: #F5BBD4;}
.reserve .part div:nth-child(4) dd .start{background: #E95D9D;}
/** .schedule **********/
.schedule .note{
  font-size: 14px;
  text-align: left;
  display: flex;
  justify-content: center;
}
.schedule .table{
  width: 100%;
  max-width: 900px;
  margin: 0 auto 80px;
}
.schedule .reserve-link .yellow{
  color: var(--color-yellow);
  font-size: 36px;
  text-align: center;
  margin-bottom: 32px;
}
.schedule .reserve-link .text02{
  font-size: 20px;
}
.schedule .reserve-link .text02 span{
  display: none;
}
.schedule .reserve-link .text02 span.text02{
  display: inline;
}
.schedule .reserve-link .btn{
  height: 70px;
  max-width: 770px;
  padding: 0 32px;
}
.schedule .reserve-link .btn.disabled{
  pointer-events: none;
  background: #bbb;
  border-color: #888;
}
.schedule .reserve-link .btn .img{
  width: 306px;
}
.summary .reserve-link .btn{
  height: 70px;
  max-width: 480px;
  padding: 0 32px;
}
.summary .reserve-link .btn.disabled{
  pointer-events: none;
  background: #bbb;
  border-color: #888;
}
.summary .reserve-link .btn .img{
  width: 130px;
}
.cover_sp{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,.7) no-repeat url(./img/image_slide_hand.png) center center / 70% auto;
  display: none;
}
.addmission_fee img{
  max-width: 810px;
  margin: 0 auto;
  text-align: center;
  display: block;
  margin-top: 20px;
  margin-bottom:-50px;
}
@media screen and (max-width:767px){
  .reserve .part{
    flex-wrap: wrap;
  }
  .reserve .part div{
    padding: 3px;
    width: calc((100% - 8px) / 2);
    margin-left: 8px;
    margin-bottom: 8px;
  }
  .reserve .part div:nth-child(2n+1){
    margin-left: 0;
  }
  .reserve .part dt,
  .reserve .part dd{
    font-size: 18px;
  }
  .reserve .part dt{
    padding: 6px 0 2px;
    margin-bottom: 3px;
  }
  .reserve .part dd{
    padding: 8px 0 4px;
  }
  .reserve .part dd .start{
    width: 100px;
    font-size: 12px;
    padding: 4px 0 0;
    margin-top: 4px;
    border-radius: 12px;
    line-height: 1.2;
  }
  .schedule .note{
    font-size: 10px;
  }
  .schedule .table{
    margin-bottom: 36px;
    overflow: scroll;
  }
  .schedule .table .img{
    width: 900px;
  }
  .cover_sp{
    display: block;
    transition: .3s;
  }
  .cover_sp.none{
    display: none;
  }
  .schedule .reserve-link .yellow{
    font-size: 20px;
    margin-bottom: 12px;
  }
  .schedule .reserve-link .text02{
    font-size: 16px;
  }
  .schedule .reserve-link .btn{
    height: auto;
    padding: 4px 24%;
  }
  .summary .reserve-link .btn{
    height: auto;
    padding: 4px 24%;
  }
  .addmission_fee img{
    max-width: 80%;
    margin: 0 auto;
    text-align: center;
    display: block;
    margin-top: 10px;
    margin-bottom:-25px;
  }
}
@media screen and (max-width:399px){
  .schedule .reserve-link .text02 span{
    display: inline;
  }
  .schedule .reserve-link .text02 span.text02{
    display: none;
  }
  .addmission_fee img{
    max-width: 80%;
    margin: 0 auto;
    text-align: center;
    display: block;
    margin-top: 10px;
    margin-bottom:-15px;
  }
}
/*
** enter
*/
/** .enter-page **********/
.enter-page .enter-bg{
  max-width: 900px;
  background: #fff;
  border-radius: 30px;
  margin: 0 auto;
  padding: 0 8px;
}
.enter-page p{
  color: var(--color-black);
  font-size: 18px;
  line-height: 1.7;
  text-align: center;
}
.enter-page .note{
  font-size: 16px;
}
.enter-page .how_to{
  margin-bottom: 40px;
}
.enter-page .how_to h3{
  margin: 50px auto 16px;
}
.enter-page .how_to:nth-child(1)>div:nth-child(1),
.enter-page .how_to:nth-child(2)>div:nth-child(1){
  display: flex;
}
.enter-page .how_to:nth-child(1)>div:nth-child(1)>div:nth-child(1){
  width: 72%;
  z-index: 1;
}
.enter-page .how_to:nth-child(1)>div:nth-child(1)>div:nth-child(1) p{
  margin-bottom: 56px;
}
.enter-page .how_to:nth-child(1) h3{
  max-width: 600px;
}
.enter-page .how_to:nth-child(1) .img.bg{
  max-width: 336px;
  width: 38.009%;
  position: absolute;
  top: 8px;
  right: 16px;
}
.enter-page .how_to .attention{
  background: #373838;
  max-width: 800px;
  border-radius: 26px;
  margin: 0 auto;
  padding: 14px 0 24px;
}
.enter-page .how_to .attention p{
  color: var(--color-text);
  line-height: 1.5;
}
.enter-page .how_to .attention p span{
  font-size: 24px;
  margin: 0 4px;
}
.enter-page .how_to .attention .img{
  max-width: 340px;
  margin: 0 auto 16px;
}
.enter-page .how_to:nth-child(2) h3{
  max-width: 480px;
}
.enter-page .how_to:nth-child(2)>div:nth-child(1){
  justify-content: center;
}
.enter-page .how_to:nth-child(2)>div:nth-child(1)>.img{
  max-width: 340px;
  margin: -24px 0 0;
}
.enter-page .how_to:nth-child(3) h3{
  max-width: 816px;
}
.enter-page .how_to .map{
  max-width: 810px;
  margin: 36px auto 0;
}
.enter-page .how_to .note_wrap{
  padding: 75px 0;
}
.enter-page .note{
  text-align: left;
  text-indent: -16px;
  margin-bottom: 10px;
  padding-left: 16px;
  line-height: 1.4;
}
.enter-page .how_to .note_wrap .img{
  position: absolute;
  width: 46.914%;
  max-width: 380px;
  top: 30px;
  right: -30px;
}
.enter-page .cancel{
  padding-bottom: 50px;
}
.enter-page .cancel h3{
  max-width: 812px;
  margin: 0 auto 24px;
}
.enter-page .cancel h4{
  top: -43px;
  margin-bottom: calc(-43px + 8px);
}
.enter-page .cancel h4 .img{
  max-width: 816px;
  margin: 0 auto;
}
.enter-page .cancel>p{
  margin-bottom: 20px;
}
.enter-page .cancel .note{
  text-align: center;
  margin-bottom: 0;
}
.enter-page .cancel>.note{
  margin-bottom: 40px;
  padding: 0 14px 0 calc(16px + 14px);
}
.enter-page .cancel .detail{
  max-width: 716px;
  margin: 20px auto;
}
.enter-page .cancel>.detail{
  max-width: calc(716px + 14px * 2);
  margin: 20px auto 10px;
  padding: 0 14px;
}
.enter-page .cancel .one-activity{
  max-width: 816px;
  background: url(./img/activity_line03.png) no-repeat 0 100% / 100%;
  margin: 0 auto;
  padding: 43px 0 26px;
}
.enter-page .cancel .one-activity>div{
  background: url(./img/activity_line02.png) repeat-y 0 0 / 100%;
  padding-bottom: 10px;
}
@media screen and (max-width:915px){
  .enter-page .how_to:nth-child(1) .img.bg{
    top: 50%;
    transform: translate(0, -50%);
  }
  .enter-page .how_to .note_wrap .img{
    width: 39.301vw;
    top: 50%;
    right: 0;
    transform: translate(0, calc(-50% - 16px));
  }
  .enter-page .cancel .one-activity{
    padding: 5.27% 0 3%;
  }
}
@media screen and (max-width:849px){
  .enter-page .cancel h4{
    top: -4.125vw;
    margin: 0 -14px calc(-5vw + 8px);
  }
  .enter-page .cancel .one-activity>div{
    padding: 0 14px;
  }
}
@media screen and (max-width:767px){
  .enter-page .how_to:nth-child(1) h3,
  .enter-page .how_to:nth-child(2) h3,
  .enter-page .how_to:nth-child(3) h3{
    max-width: 675px;
  }
  .enter-page .table{
    overflow: scroll;
  }
  .enter-page .table .img{
    width: 810px;
  }
  .enter-page .how_to h3{
    margin: 24px auto 8px;
  }
  .enter-page p{
    font-size: 16px;
    text-align: left;
    padding: 0 8px;
  }
  .enter-page .note{
    text-indent: -14px;
    font-size: 14px;
  }
  .enter-page .how_to:nth-child(1)>div:nth-child(1),
  .enter-page .how_to:nth-child(2)>div:nth-child(1){
    flex-direction: column;
  }
  .enter-page .how_to:nth-child(1)>div:nth-child(1)>div:nth-child(1){
    width: 100%;
  }
  .enter-page .how_to:nth-child(1)>div:nth-child(1)>div:nth-child(1) p{
    margin-bottom: 28px;
  }
  .enter-page .how_to:nth-child(1) .img.bg{
    position: relative;
    top: 0;
    left: 50%;
    width: 80%;
    transform: translate(-50%, -28px);
  }
  .enter-page .how_to .attention .img{
    max-width: calc(340px + 16px);
    padding: 0 8px;
  }
  .enter-page .how_to .attention p{
    text-align: center;
  }
  .enter-page .how_to .attention p span{
    font-size: 20px;
  }
  .enter-page .how_to:nth-child(2)>div:nth-child(1)>div{
    order: 1;
  }
  .enter-page .how_to:nth-child(2)>div:nth-child(1)>.img{
    width: 80%;
    margin: 0 auto;
    order: 2;
  }
  .enter-page .how_to .note_wrap{
    padding: 0;
  }
  .enter-page .how_to .note_wrap .img{
    position: relative;
    width: 80%;
    top: 0;
    right: 0;
    transform: translate(0);
    margin: 20px auto;
  }
  .enter-page .cancel>p{
    margin-bottom: 15px;
  }
  .enter-page .cancel .note{
    text-align: left;
  }
  .enter-page .how_to .attention br.sp{
    display: none;
  }
  .enter-page .how_to .attention br.tc{
    display: block;
  }
}
@media screen and (max-width:539px){
  .enter-page .how_to .attention br.tc{
    display: none;
  }
  .enter-page .how_to .attention br.sp{
    display: block;
  }
}


/*
** .comingsoon
*/
.comingsoon_top{
  width: 80vw;
  max-width: 720px;
  margin: 0 auto;
  padding-top: 160px;
}
.comingsoon{
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 200px;
}
.comingsoon img{
  width: 100%;
  max-width: 301px;
}
@media screen and (max-width:767px){
  .comingsoon_top{
    padding-top: 25vh;
    padding-bottom: 20vh;
  }
  .comingsoon{
    min-height: 50vh;
  }
}
/*
** qa
*/
/** .qa **********/
.qa .bg{
  max-width: 900px;
  background: #fff;
  border-radius: 30px;
  margin: 0 auto;
  padding: 40px 40px 0;
}
.qa h3{
  font-size: 22px;
  text-align: center;
  border-width: 7px 0;
  border-style: solid;
  margin-bottom: 40px;
  padding: 10px 0 6px;
}
.qa dl{
  padding-bottom: 32px;
}
.qa dl dt,
.qa dl dd{
  font-size: 22px;
  padding-right: 16px;
  padding-left: 56px;
  color: var(--color-black);
  line-height: 1.4;
}
.qa dt{
  padding: 10px 0 6px;
}
.qa dd{
  margin-bottom: 16px;
  padding: 12px 0 8px;
}
.qa dt::before,
.qa dd::before{
  position: absolute;
  top: 0;
  left: 16px;
  width: 40px;
  height: 38px;
  font-size: 28px;
}
.qa dt::before{
  content: 'Q.';
  padding: 4px 0;
}
.qa dd::before{
  content: 'A.';
  padding: 6px 0;
}
.qa a{
  color: #00a0e9;
}
.qa .indent{
  display: inline-block;
  color: var(--color-black);
  text-indent: -22px;
  line-height: 1.4;
  padding-left: 22px;
}
.qa .boatrace h3{
  color: #00b8ee;
  border-color: #b2e0f8;
}
.qa .boatrace dt{
  background: #b2e0f8;
}
.qa .reserve h3{
  color: #5cb531;
  border-color: #bad98f;
}
.qa .reserve dt{
  background: #bad98f;
}
.qa .price h3{
  color: #ee87b4;
  border-color: #fadce9;
}
.qa .price dt{
  background: #fadce9;
}
.qa .event h3{
  color: #f39e59;
  border-color: #fbd8c5;
}
.qa .event dt{
  background: #fbd8c5;
}
@media screen and (max-width:767px){
  .qa .bg{
    border-radius: 10px;
    padding: 16px 16px 0;
  }
  .qa h3{
    border-width: 3px 0;
    font-size: 16px;
    margin-bottom: 16px;
    padding: 5px 0 4px;
  }
  .qa dl{
    padding-bottom: 16px;
  }
  .qa dl dt,
  .qa dl dd{
    font-size: 16px;
    padding-right: 8px;
    padding-left: 32px;
  }
  .qa dt{
    padding: 6px 0 4px;
  }
  .qa dd{
    margin-bottom: 8px;
    padding: 6px 0;
  }
  .qa dt::before,
  .qa dd::before{
    left: 8px;
    width: 20px;
    height: 28px;
    font-size: 18px;
  }
  .qa dt::before{
    padding: 2px 0;
  }
  .qa dd::before{
    padding: 5px 0 0;
  }
  .qa .indent{
    text-indent: -14px;
    padding-left: 14px;
  }
}