@charset "utf-8";
/* ===============================================
# set
=============================================== */
:root {
  --day1_main_color: #28bfee;/*濃い水色*/
  --day1_sub_color: #93dff6;/*薄い水色*/
  --day1_accent_color: #f5782b;/*濃いオレンジ*/
  
  --day2_main_color: #f5782b;/*濃いオレンジ*/
  --day2_sub_color: #f7a36b;/*薄いオレンジ*/
  --day2_accent_color: #28bfee;/*濃い水色*/
}

.page_day1 {
  --main_color: #28bfee;/*濃い水色*/
  --sub_color: #93dff6;/*薄い水色*/
  --accent_color: #f5782b;/*濃いオレンジ*/
}

.page_day2 {
  --main_color: #f5782b;/*濃いオレンジ*/
  --sub_color: #f7a36b;/*薄いオレンジ*/
  --accent_color: #28bfee;/*濃い水色*/
}



.splide__slide img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* ===============================================
# PCレイアウト
=============================================== */
@media print,screen and (min-width :835px){
  body::before{
    content: '';
    display: block;
    width: 100%;
    height: 100vh;
    position: fixed;
    z-index: -1;
    top: 0;
    left: 0;
  }
  .wrapper{
    position: relative;
    display:-webkit-box;
    display:flex; 
    z-index: 1;
  }
  .wrap_pc{
    width: 63%;
  }
  .wrap_pc .area_pc_left{
    position: fixed;
    top: 0;
    left: 0;
    width: calc(63% - 500px);
    height: 100vh;
    background: url("../img/bg01_day1_hd.png") repeat;
  }
  .area_pc_left .inner{
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    padding: 0 20px;
    width: 84%;
    max-width:500px;
    min-width: 380px;
  }  
  .wrap_pc .area_main{
    position: relative;
    width: 500px;
    margin: 0 0 0 auto;
    border-right: solid 7px #fff;
    border-left: solid 7px #fff;
    background: url("../img/bg01_day1_hd.png") repeat;
  }
  .wrap_bgimg{
    -webkit-box-flex: 1;
    flex: 1;
  }
  .wrap_bgimg{
    position: fixed;
    top: 0;
    right: 0;
    width: 37%;
    height: 100vh;
    z-index: 0;
  }
  /*----- day2 -----*/
  .page_day2 .wrap_pc .area_pc_left{
    background: url("../img/bg01_day2_hd.png") repeat;
  }

}
@media print,screen and (max-width :1600px) and (min-width :835px){
  .wrap_pc{
    width: 1000px;
  }
  .wrap_pc .area_pc_left{
    width: 500px;
  }  
  .area_pc_left .inner{
    top: 49%;
  }
}
@media print,screen and (max-width :1210px) and (min-width :835px){
  .wrap_pc{
    width: 100%;
    min-width: inherit;
  }
  .wrap_pc .area_main{
    width: 50%;
  }
  .wrap_pc .area_pc_left{
    width: 50%;
  }    
  .area_pc_left .inner{
  }
}

/* ===============================================
# hd_btn_nav
=============================================== */
.hd_btn_nav {
  position: sticky;
  top: 0;
  z-index: 1000;
}
.hd_btn_nav .btn {
  position: absolute;
  right: 5px;
  width: min(38.3vw, 144px);
  cursor: pointer;
}
.hd_btn_nav .btn::before {
  z-index: 0;
  content: "";
  display: block;
  position: absolute;
  top:0px;
  left: 2px;
  width: 100%;
  height: calc(100% + 2px);
  border-radius: 0 0 10px 10px;
  background: rgba(98,98,98,.2);
}

.hd_btn_nav .btn span {
  position: relative;
  top:0px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1rem 0.2em;
  border-radius: 0 0 10px 10px;
  background: var(--day2_main_color);
  font-size: 1.3rem;
  font-size: min(3.73vw,1.3rem);
  color: #fff;
}
.hd_btn_nav .btn span::before {
  content: "";
  display: block;
  width: 3.2rem;
  height: 1.75rem;
  margin-bottom: .3rem;
  background: url("../img/ico_binoculars.svg") no-repeat;
  background-size: contain;
}

/* ===============================================
# header
=============================================== */
header {
  position: absolute;
  top: 0;
  z-index: 100;
  width: 100%;
}
header .area_top {
  display: flex;
  align-items: center;
  width: 100%;
  height: 67px;
  background: url("../img/hd_bg01.svg") no-repeat bottom;
  background-size: 100% 67px;
  padding-left: 1.2rem;
  padding-right: .6rem;
}
header .logo {
  width: min(48vw, 180px);
  margin-bottom: 1rem;
}


@media print,screen and (max-width :370px){
}
@media print,screen and (min-width :835px){
  header .logo a{
  }
}


/* ===============================================
# hd_nav_body
=============================================== */
.hd_nav_body {
  overflow-x: hidden;
  overflow-y: auto;
  position: fixed;
  top: 0;
  width: 100%;
  max-height: 100dvh;
  padding-bottom: 3rem;
  background: #fbf9f2;
  z-index: -1;
  opacity: 0;
  pointer-events: none;
  transition: .3s ease;
}
.hd_nav_body.show {
  opacity: 1;
  z-index: 9999;
  pointer-events: auto;
}

.hd_nav_body header {
  position: sticky;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  pointer-events: none;
}
.hd_nav_body .hd_nav_body_ttl {
  position: relative;
  top:0px;
  display: flex;
  gap:.75em;
  align-items: center;
  padding: 0 2em 0 .75em;
  background: var(--day2_main_color);
  font-size: 1.8rem;
  color: #fff;
}
.hd_nav_body .hd_nav_body_ttl::before {
  content: "";
  display: block;
  width: 1.8em;
  height: 1em;
  background: url("../img/ico_binoculars.svg") no-repeat;
  background-size: contain;
}
.hd_nav_body .hd_nav_body_ttl.ribbon {
  position: relative;
  height: 2.88em;
  line-height: 2.88em;
  text-align: center;
  box-sizing: border-box;
  clip-path: polygon(0 0, 100% 0, calc(100% - 0.7em) 50%, 100% 100%, 0 100%);
}
.hd_nav_body .hd_nav_body_btn {
  position: relative;
  width: 6.1rem;
  height: 6.5rem;
  cursor: pointer;
}
.hd_nav_body .hd_nav_body_btn::before,
.hd_nav_body .hd_nav_body_btn::after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: calc(100% + 2px);
  border-radius: 0 0 0 10px;
}
.hd_nav_body .hd_nav_body_btn::before {
  z-index: 0;
  top: 2px;
  left: 2px;
  background: rgba(98,98,98,.2);
}
.hd_nav_body .hd_nav_body_btn::after {
  z-index: 1;
  top: 0px;
  left: 0px;
  background: #7cbe5a;
}
.hd_nav_body .hd_nav_body_btn .bar {
  z-index: 2;
  position: absolute;
  width: 100%;
  height: 100%;
}
.hd_nav_body .hd_nav_body_btn .bar::before,
.hd_nav_body .hd_nav_body_btn .bar::after{
  content: "";
  position: absolute;
  display: block;
  width: 3px;
  height: 38px;
  border-radius: 3px;
  background: #fff;
  transform-origin: center center;
  left: 50%;
  top: calc(50% - 19px);
}
.hd_nav_body .hd_nav_body_btn .bar::before {
  transform: rotate(45deg);
}
.hd_nav_body .hd_nav_body_btn .bar::after {
  transform: rotate(-45deg);
}
.hd_nav_body.show header .hd_nav_body_btn {
  pointer-events: auto !important;
}

@media print,screen and (min-width :835px){
  .hd_nav_body {
  width: 486px;
  }
}
@media print,screen and (max-width :1210px) and (min-width :835px){
  .hd_nav_body {
  width: calc(50% - 14px);
  }
}

/* ===============================================
# hd_nav_body .item_day
=============================================== */
.hd_nav_body .item_day {
  position: relative;
  background: #fff;
  max-width: 460px;
  margin: 1.7rem auto 0;
  padding: 0 18px 32px;
  border-radius: 10px;
  border: var(--day1_main_color) 2px solid;
}
.hd_nav_body .item_day .item_day_ttl {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 54%;
  height: 3.2em;
  margin-left: auto;
  margin-right: auto;
  border-radius: 0 0 25px 25px;
  background: var(--day1_main_color);
}
.hd_nav_body .item_day .item_day_ttl img {
  height: 1.6em;
}
.hd_nav_body .item_day .corner_dot {
  position: absolute;
  width: 9px;
  height: 9px;
  background-color: var(--day1_main_color);
  border-radius: 50%;
}
.hd_nav_body .item_day .corner_dot.tl {
  top: 10px;
  left: 10px;
}
.hd_nav_body .item_day .corner_dot.tr {
  top: 10px;
  right: 10px;
}
.hd_nav_body .item_day .corner_dot.bl {
  bottom: 10px;
  left: 10px;
}
.hd_nav_body .item_day .corner_dot.br {
  bottom: 10px;
  right: 10px;
}

.hd_nav_body .item_day .list_contents {
  justify-content: space-between;
  flex-wrap: wrap;
  column-gap: 18px;
  row-gap: 17px;
  margin-top: 17px;
}
.hd_nav_body .item_day .list_contents li {
  flex: 0 0 calc((100% - 18px) / 2);
}
.hd_nav_body .item_day .list_contents li.deco img {
  display: block;
  width: 82.5%;
  margin: auto;
}
.hd_nav_body .item_day .list_contents li a {
  align-items: center;
  flex-direction: column;
  row-gap: 11px;
  font-size: 1.2rem;
}
.hd_nav_body .item_day .list_contents li a .img{
  width: 100%;
  flex-shrink: 1;
}
.hd_nav_body .item_day .list_contents li a .img img{
  display: block;
  border-radius: 5px;
}
.hd_nav_body .item_day .list_contents li a .txt{
  line-height: 1.28;
  text-align: center;
}
/*----- day2 -----*/
.hd_nav_body .item_day.day2 {
  margin-top: 1.9rem;
  border: var(--day2_main_color) 2px solid;
}
.hd_nav_body .item_day.day2 .item_day_ttl {
  background: var(--day2_main_color);
}
.hd_nav_body .item_day.day2 .corner_dot {
  background-color: var(--day2_main_color);
}

/* ===============================================
# area_pc_left
=============================================== */
@media print,screen and (min-width :835px){
  .area_pc_left{
    position: relative;
  }
  .area_pc_left .inner{
    z-index: 2;
  }
  .area_pc_left .area_pc_left_ttl img{
    display: flex;
    height: min(170px,17vh);
    margin: auto;
  }
  .area_pc_left .date_label{
    margin-top: clamp(6px,0.8vh,1rem);
  }
  .area_pc_left .date_label img{
    display: flex;
    height: min(10vh,86px);
    margin: auto;
  }
  
  .area_pc_left .wrap_list_contents {
    position: relative;
    background: #fff;
    max-width: 480px;
    margin: clamp(8px,0.9vh,1.7rem) auto 0;
    padding: 30px 32px;
    padding: clamp(17px,3vh,30px) 30px;
    border-radius: 20px;
  } 
  .area_pc_left .wrap_list_contents .corner_dot {
    position: absolute;
    width: 9px;
    height: 9px;
    background-color: #04b4e4;
    border-radius: 50%;
  }
  .area_pc_left .wrap_list_contents .corner_dot.tl {
    top: 18px;
    left: 14px;
  }
  .area_pc_left .wrap_list_contents .corner_dot.tr {
    top: 18px;
    right: 14px;
  }
  .area_pc_left .wrap_list_contents .corner_dot.bl {
    bottom: 16px;
    left: 14px;
  }
  .area_pc_left .wrap_list_contents .corner_dot.br {
    bottom: 16px;
    right: 14px;
  }
  .area_pc_left .list_contents {
    justify-content: space-between;
    flex-wrap: wrap;
    column-gap: 10px;
    row-gap: 17px;
  }
  .area_pc_left .list_contents li {
    flex: 0 0 calc((100% - 20px) / 3);
  }
  .area_pc_left .list_contents li a {
    align-items: center;
    flex-direction: column;
    row-gap: clamp(7px,0.15vh,11px);
  }  
  .area_pc_left .list_contents li a .img{
    width: 100%;
    max-width: 120px;
    flex-shrink: 1;
  }  
  .area_pc_left .list_contents li a .img img{
    display: block;
    border-radius: 5px;
  }  
  .area_pc_left .list_contents li a .txt{
    line-height: 1.15;
    text-align: center;
    font-size: clamp(12px,1.2vw,14px);
  }
  .area_pc_left .wrap_list_contents .deco01{
    position: absolute;
    left: calc(35% + ((65% - 176px) / 2));
    bottom: 11.9rem;
    bottom: 10vh;
  }
  .area_pc_left .wrap_list_contents .deco01 img {
    display: block;
    margin: 0 auto;
  }
  .area_pc_left .wrap_list_contents .btn{
    display: flex;
    justify-content: center;
    align-items: center;
    width: min(273px,100%);
    margin: 3rem auto 0;
    padding: min(23px,2vh) 4.5rem;
    border-radius: 9999px;
    background: var(--accent_color) url("../img/arrow01_r.svg") no-repeat right 1.8rem center;
    line-height: 1;
    font-size: 2.4rem;
    color: #fff;
  }
  /*----- day2 -----*/
  .page_day2 .area_pc_left .wrap_list_contents .corner_dot {
    background-color: #f6782b;
  }
  .area_pc_left .wrap_list_contents .corner_dot.tl {
    top: 18px;
    left: 14px;
  }
  .area_pc_left .wrap_list_contents .corner_dot.tr {
    top: 18px;
    right: 14px;
  }
  .area_pc_left .wrap_list_contents .corner_dot.bl {
    bottom: 16px;
    left: 14px;
  }
  .area_pc_left .wrap_list_contents .corner_dot.br {
    bottom: 16px;
    right: 14px;
  }
  .area_pc_left .list_contents {
    justify-content: space-between;
    flex-wrap: wrap;
    column-gap: 10px;
    row-gap: clamp(9px,0.2vh,17px);
  }
}
@media (hover: hover) and (pointer: fine) {
}
@media print,screen and (max-width :1640px) and (min-width :1210px){
  .area_pc_left .list_contents li a .txt{
    font-size: 13px;
  }
}


@media print,screen and (max-height :765px),(max-width :1210px){
  .area_pc_left .inner{
    top: 50%;
  }
  .area_pc_left p.txt_main{
    width: 90%;
  }  
  .area_pc_left .list_btn li{
    width: 150px;
  }  
  .area_pc_left .txt_point{
    width: 75%;
    margin-top:5vh;
  }
  .area_pc_left .wrap_list_contents .deco01{
    left: auto;
    right: 4%;
    width: 50%;
    bottom: 10vh;
  }
}
@media print,screen and (max-height :640px){
  .area_pc_left .wrap_list_contents {
    width: 90%;
  }
  .area_pc_left .wrap_list_contents .deco01 img {
    height: 20vh;
    margin: 0 auto 3vh;
  }
}
@media print,screen and (max-height :450px){
  .area_pc_left .inner{
    margin-top: 100px;
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    -webkit-transform: translate(0,0);
    transform: translate(0,0);
  }
}

/* ===============================================
# sec_main
=============================================== */
.area_main .sec_main{
  background: url("../img/bg01_day1_hd.png") repeat;
  background-size: 30px;
}
.area_main .sec_main .ttl_main {
  position: relative;
}
.area_main .sec_main .ttl_main .ttl {
  width:  min(86%,calc(322px * 1.15));
  margin: 0 auto;
  padding: min(11.5%,43px) 0 0;
}
.area_main .sec_main .ttl_main .deco {
  position: absolute;
}
.area_main .sec_main .ttl_main .deco01 {
  top: max(-17.3vw,-65px);
  left: max(-3vw,-11px);
  width: min(28.5vw,107px);
}
.area_main .sec_main .ttl_main .deco02 {
  top: max(-30.6vw,-115px);
  right: max(-8vw,-30px);
  width: min(39.8vw,149px);
}
.area_main .sec_main .ttl_main .deco03 {
  bottom: 8%;
  left: 0;
  width: min(25.7vw,96px);
}
.area_main .sec_main .ttl_main .deco04 {
  bottom: 8%;
  right: max(-1vw,-7px);
  width: min(25vw,93px);
}
.area_main .sec_main .btn_scroll {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap : .5rem;
  align-items: center;
  margin-top: min(9.86vw,47px);
  padding-bottom: min(13vw,55px);
  letter-spacing: .15em;
  color: #fff;
  animation: scrollmove 1s ease-in-out infinite;
}
.area_main .sec_main .btn_scroll::after {
  content: "";
  width: 19px;
  height: 12px;
  background: url("../img/ico_scroll.svg") no-repeat;
  background-size: contain;
}

@media print,screen and (min-width :835px){
  .area_main .sec_main .ttl_main .ttl {
    width:  min(86%,calc(28vh * 2.49));
  }
  .area_main .sec_main .btn_scroll {
    margin-top: min(4vh,30px);
    padding-bottom: min(6vh,40px);
  }
}

@keyframes scrollmove{
  0%{transform:translateY(0);}
  50%{transform:translateY(10%);}
  100%{transform:translateY(0);}
 }
/* ===============================================
# slider_fv
=============================================== */
#slider_fv {
  margin-top: 50px;
  height: min(73vw,411px);
  overflow: hidden;
}

#slider_fv .splide__slide {
  height: min(73vw,411px) !important;
  display: flex;
  align-items: center;
}

#slider_fv .splide__slide img {
  height: 100%;
  width: auto;
  display: block;
  object-fit: cover;
}
@media print,screen and (min-width :835px){
  #slider_fv {
    height: calc(75vh - 200px);
  }
  #slider_fv .splide__slide {
    height: calc(75vh - 200px) !important;
  }
}

/* ===============================================
# sec_intro
=============================================== */
.area_main .sec_intro {
  position: relative;
  padding-top: min(10vw,37.5px);
  background: #f8f4e7;
}
.area_main .sec_intro::before {
  content: "";
  position: absolute;
  display: block;
  top: -2rem;
  width: 100%;
  height: 2.1rem;
  background: url("../img/intro_bg_up.svg") repeat-x left top;
  background-size: 375px;
}
.area_main .sec_intro_inner {
  width: min(84.8vw, 318px);
  margin: auto;
  padding: min(17%, 63px) min(10%, 37.5px) min(15%, 70px);
  background: url("../img/intro_bg01.png") no-repeat;
  background-size: 100%;
}
.area_main .sec_intro_inner .txt {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-weight: 700;
}
.area_main .sec_intro_inner .txt .line {
  position: relative;
  line-height: 1.8;
  padding-bottom: 0.3em;
      background-image: url("data:image/svg+xml,%3Csvg width='6' height='7' viewBox='0 0 6 7' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='4' height='1' fill='%23ccc'/%3E%3C/svg%3E");
      background-repeat: repeat-x;
      background-position: left bottom;
  z-index: 0;
}
.area_main .sec_intro_inner .txt .highlight {
  position: relative;
  display: inline-block;
  z-index: 1;
}

.area_main .sec_intro_inner .txt .highlight::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0.4em;
  height: 0.5em;
  background-color: #bddeac;
  z-index: -1;
  border-radius: 2px;
}
.area_main .sec_intro_inner .deco {
  position: absolute;
  right: 0;
  z-index: 1;
}
.area_main .sec_intro_inner .deco01 {
  top: max(-5.3vw,-21px);
  left: max(-0.1vw,-2px);
  width: min(12.3vw,46px);
}
.area_main .sec_intro_inner .deco02 {
  bottom: max(2.7vw,10px);
  bottom: -5%;
  left: 0;
  width: min(20vw,75px);
}
.area_main .sec_intro_inner .deco03 {
  bottom: min(calc(57.1vw - 30vw),calc(214px - 110px));
  right: max(1.3vw,6px);
  width: min(20.5vw,77px);
}

@media print,screen and (min-width :835px){
  .area_main .sec_intro_inner {
    width: 400px;
    padding: 68px 40px 60px;
  }
  .area_main .sec_intro_inner .deco03 {
    right: auto;
    left: calc(50% + 130px);
    bottom: 124px;
  }
}

/* ===============================================
# sec_route
=============================================== */
.area_main .sec_route {
  position: relative;
  padding-top: 4%;
  padding-bottom: min(calc(16.6vw + 40px),calc(62px + 40px));
  background: url("../img/bg_02.png") repeat;
  background-size: 15px;
}
.area_main .sec_route::before {
  content: "";
  position: absolute;
  display: block;
  top: 0;
  width: 100%;
  height: 4%;
  background: url("../img/intro_bg_btm.svg") no-repeat left bottom;
  background-size: 100% 100%;
}
.area_main .sec_route .ttl {
  width:  min(88.2%,330px);
  margin: 0 auto;
  padding: min(10.66vw,40px) 0 0;
}
.area_main .sec_route .box_txt {
  max-width: 358px;
  margin: 15px auto 0;
  padding: 24px min(2.6em,calc((100% - 22em) / 2));
  border-radius: 10px;
  background: #fff;
}
.area_main .sec_route .box_txt .txt {
  margin: 0 auto 30px;
  line-height: 2;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='32'%3E%3Cline x1='0' y1='32' x2='100%25' y2='32' stroke='%23a7a7a7' stroke-width='1' stroke-dasharray='3,2' /%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 100% 2em;
  background-position: left top;
  font-weight: 700;
}
.area_main .sec_route .box_txt .txt .highlight {
  background-image: linear-gradient(to bottom, transparent calc(100% - 0.5em), #93dff6 0);
  background-repeat: repeat-x;
  background-position: bottom 0.1em left;
  background-size: 100% 0.5em;
  padding-bottom: 0.1em;
  border-radius: 0;
  display: inline;
}
.area_main .sec_route .box_schedule {
  position: relative;
  padding: 1.3em 1.2em;
  border-radius: 10px;
  background: #fbf9f2;
  margin-top: max(calc(-3vw + 150px + 70px),calc(-12px + 150px + 70px));
}
.area_main .sec_route .box_schedule .schedule_label {
  position: absolute;
  top: max(-3vw,-12px);
  left: 0;
  width: min(22.6vw,85px);
}
.area_main .sec_route .box_schedule .schedule_txt {
  display: flex;
  justify-content: space-between;
  font-weight: 700;
}
@media print,screen and (min-width :835px){
  .area_main .sec_route .box_txt {
    font-size: 87%;
    padding: 24px 25px;
  }
  .area_main .sec_route .box_schedule .schedule_txt {
    font-size: 0.92em;
  }
}
/* ===============================================
# slider_route
=============================================== */
#slider_route {
  position: absolute;
  left: 0;
  width: 100%;
  height: 150px;
  overflow: hidden;
}

#slider_route .splide__slide {
  height: 150px !important;
  display: flex;
  align-items: center;
  overflow: hidden;
  border-radius: 10px;
}

#slider_route .splide__slide img {
  height: 100%;
  width: auto;
  display: block;
  object-fit: cover;
}

/* ===============================================
# sec_contetns
=============================================== */
.sec_contetns {
  position: relative;
/*
  scroll-margin-top: 80px;
  scroll-padding-top: 80px;
*/
}

/* ===============================================
# sec_contetns .day_tab
=============================================== */
.sec_contetns .day_tab{
  position: static;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  gap:10px;
  margin-top: max(-16.6vw,-62px);
  opacity: 1;
  transition: 0.5s ease;
  transform: translateY(0);
}
.sec_contetns .day_tab .tab_item{
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 47.4%;
  height: min(16.6vw,62px);
  padding-top: 12px;
  border-radius: 10px 10px 0 0;
  box-shadow: 5px 5px 0px 0px rgba(115, 115, 115, 0.2);
}
.sec_contetns .day_tab .tab_item.day1 {
  background: var(--day1_main_color);
}
.sec_contetns .day_tab .tab_item.day1.off {
  background: var(--day1_sub_color);
}
.sec_contetns .day_tab .tab_item.day2 {
  background: var(--day2_main_color);
}
.sec_contetns .day_tab .tab_item.day2.off {
  background: var(--day2_sub_color);
}
.sec_contetns .day_tab .tab_item img{
  width: 55px;
}
.sec_contetns .day_tab .tab_item::before{
  position: absolute;
  top: 0;
  content: "";
  display: block;
  width: 100%;
  height: 5px;
  background: #000;
}
.sec_contetns .day_tab .tab_item.day1::before{
  background: var(--day1_sub_color);
}
.sec_contetns .day_tab .tab_item.day1.off::before{
  background: var(--day1_main_color);
}
.sec_contetns .day_tab .tab_item.day2::before{
  background: var(--day2_sub_color);
}
.sec_contetns .day_tab .tab_item.day2.off::before{
  background: var(--day2_main_color);
}

/*----- js_fit_bottom -----*/
.sec_contetns .day_tab.js_fit_bottom {
  position: fixed;
  bottom: 0;
  z-index: 999;
  opacity: 1;
/*  transition: 0.5s ease;*/
}

.sec_contetns .day_tab.js_hide {
  transform: translateY(100%);
  opacity: 0;
  pointer-events: none;
/*  transition: translate 0.5s ease;*/
}

/* ===============================================
# sec_contetns .sec_contetns_inner
=============================================== */
.sec_contetns_inner {
  padding-top: 2.2em;
  padding-bottom: 3.35em;
  position: relative;
  background: url("../img/bg03_day1_hd.png") repeat;
  background-size: 7px;
}
/*----- day2 -----*/
.page_day2 .sec_contetns_inner{
  background: url("../img/bg03_day2_hd.png") repeat;
  background-size: 7px;
}

/* ===============================================
# sec_contetns .traffic
=============================================== */
.sec_contetns .traffic{
}
.sec_contetns .traffic .station{
  display: flex;
  gap:1em;
  align-items: center;
  width: max-content;
  margin: auto;
  padding: .4em 1.35em 0.4em 1.15em;
  border-radius: 10px;
  background: #fff;
  font-weight: 700;
  font-size: 1.5rem;
}
.sec_contetns .traffic .station .ico{
  width: 33px;
  height: 33px;
  border-radius: 9999px;
  background: var(--main_color);
}
.sec_contetns .traffic .station span{

}
.sec_contetns .traffic .way{
  display: flex;
  gap:1.1em;
  justify-content: center;
  align-items: center;
  height: 2.93em;
  font-weight: 700;
  font-size: 1.5rem;
}
.sec_contetns .traffic .way .ico {
  width: .63em;
}
.sec_contetns .traffic .way .ico,
.sec_contetns .traffic .way .ico img{
  height: 100%;
}
.sec_contetns .traffic .way span{
  width: 5.5em;
}
@media print,screen and (min-width :835px){
  .sec_contetns .traffic .station,
  .sec_contetns .traffic .way {
    font-size: calc(1.5rem * 1.32);
  }
}


/* ===============================================
# sec_contetns .area_item
=============================================== */
.sec_contetns .area_item{
  position: relative;
  padding-bottom: 2em;
  border-radius: 10px;
  background: #fff;
  scroll-margin-top: 80px;
}
.sec_contetns .area_item .time {
  width: 54.1%;
  height: 1.9em;
  margin: 0 auto .9em;
  border-radius: 0 0 25px 25px;
  background: var(--main_color);
  text-align: center;
  font-weight: 700;
  font-size: 1.7rem;
  color: #fff;
}
.sec_contetns .area_item_inner {
  overflow: hidden;
  width: 88.56%;
  max-height: calc(53vw + 215px);
  margin-left: auto;
  margin-right: auto;
  transition: max-height 1.5s ease-in;
}
.sec_contetns .area_item.open .area_item_inner {
  max-height: 9999px;
}
.sec_contetns .area_item .ttl{
  display: flex;
  gap:.8em;
  justify-content: center;
  align-items: center;
  height: 2.6em;
  border-top: var(--main_color) 2px solid;
  border-bottom: var(--main_color) 2px solid;
  line-height: 1.1;
  font-weight: 700;
  font-size: 2rem;
}
.sec_contetns .area_item .ttl .ico {
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  border-radius: 9999px;
  background: var(--accent_color);
}
.sec_contetns .area_item .tag{
  display: flex;
  gap:0 1.2em;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  font-weight: 700;
  font-size: 1.1rem;
}
.sec_contetns .area_item .tag li {
  display: flex;
  gap:.3em;
  padding-top: 9px;
}
.sec_contetns .area_item .tag .ico {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.5em;
  height: 1.5em;
  border-radius: 9999px;
  background: #7cbe5a;
  font-weight: 700;
  color: #fff;
}
.sec_contetns .area_item .splide {
  margin-top: 9px;
}
.sec_contetns .area_item .splide .splide__slide {
  text-align: center;
}
.sec_contetns .area_item .splide .splide__slide img {
  border-radius: 10px;
}

.sec_contetns .area_item .splide__pagination {
  position: absolute;
  gap:.5rem;
  right: .7rem;
  bottom:.7rem;
}
.sec_contetns .area_item .splide__pagination__page {
  width: .6em;
  height: .6em;
  border-radius: 9999px;
  border: #fff 1px solid;
  background: rgba(255,255,255,.5);
}
.sec_contetns .area_item .splide__pagination__page.is-active {
  background: rgba(255,255,255,1);
}
.sec_contetns .area_item .body{
  margin-top: 1em;
  line-height: 1.69;
  font-size: 1.3rem;
}
.sec_contetns .area_item .memo{
  display: flex;
  align-items: center;
  position: relative;
  min-height: 6em;
  margin-top: 30px;
  padding:1.3em 1.3em 1.3em 78px;
  border-radius: 10px;
  background: #def5fc;
  font-weight: 700;
  font-size: 1rem;
}
.sec_contetns .area_item .memo::after{
  position: absolute;
  bottom: -6px;
  left: 0;
  content: "";
  display: block;
  width: 73px;
  height: 87px;
  background: url("../img/deco_img03.png") no-repeat;
  background-size: contain;
}
.sec_contetns .area_item .detail{
  margin-top: 1.4em;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='1'%3E%3Cline x1='0' y1='1' x2='100%25' y2='1' stroke='%23a7a7a7' stroke-width='1' stroke-dasharray='3,2' /%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-size: 100% 1px;
  background-position: left top;
}
.sec_contetns .area_item .detail dt{
  padding-top: .4em;
  font-weight: 700;
  font-size: 1.2rem;
  color: var(--main_color);
}
.sec_contetns .area_item .detail dd{
  padding-bottom: .4em;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='1'%3E%3Cline x1='0' y1='1' x2='100%25' y2='1' stroke='%23a7a7a7' stroke-width='1' stroke-dasharray='3,2' /%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-size: 100% 1px;
  background-position: left bottom;
  font-size: 1.2rem;
}
.sec_contetns .area_item .detail dd a{
  text-decoration: underline;
  color: #8b8b8b;
}

.sec_contetns .area_item .corner_dot {
  position: absolute;
  width: 9px;
  height: 9px;
  background: var(--sub_color);
  border-radius: 50%;
  z-index: 2;
}
.sec_contetns .area_item .corner_dot.tl {
  top: 10px;
  left: 10px;
}
.sec_contetns .area_item .corner_dot.tr {
  top: 10px;
  right: 10px;
}
.sec_contetns .area_item .corner_dot.bl {
  bottom: 10px;
  left: 10px;
}
.sec_contetns .area_item .corner_dot.br {
  bottom: 10px;
  right: 10px;
}
.sec_contetns .area_item .hide_area {
  background: #fff;
  background: linear-gradient(0deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 100%);
  width: 100%;
  padding: 5em 0 2em;
  border-radius: 0 0 10px 10px;
  text-align: center;
  position: absolute;
  bottom: 0;
  z-index: 1;
}
.sec_contetns .area_item.open .hide_area {
  display: none;
}
.sec_contetns .area_item .hide_area .btn_more {
  display: inline-flex;
  gap:2.5em;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  padding: .5em 1em .5em 4em;
  border-radius: 9999px;
  background: var(--accent_color);
  font-weight: 700;
  font-size: 1.1rem;
  color: #fff;
  user-select: none;
  cursor: pointer;
}
.sec_contetns .area_item .hide_area .btn_more::after {
  content: "";
  display: block;
  width: 9px;
  height: 9px;
  background: url("../img/arrow01_dn.svg") no-repeat center center;
  background-size: contain;
}

/*----- day2 -----*/
.page_day2 .sec_contetns .area_item .memo{
  background: #fef6e6;
}

@media print,screen and (min-width :835px){
  .sec_contetns .area_item {
  }
  .sec_contetns .area_item .time {
    font-size: calc(1.7rem * 1.32);
  }
  .sec_contetns .area_item_inner {
      max-height: 530px;
  }
  .sec_contetns .area_item .ttl{
    font-size: calc(2rem * 1.32);
    font-size: min(2.5vw,calc(2rem * 1.32));
  }
  .sec_contetns .area_item .tag{
    font-size: calc(1.1rem * 1.32);
  }
  .sec_contetns .area_item .body{
    font-size: calc(1.3rem * 1.32);
  }
  .sec_contetns .area_item .memo{
    font-size: calc(1.1rem * 1.32);
  }
  .sec_contetns .area_item .detail dt{
    font-size: calc(1.2rem * 1.32);
  }
  .sec_contetns .area_item .detail dd{
    font-size: calc(1.2rem * 1.32);
  }
  .sec_contetns .area_item .hide_area .btn_more {
    font-size: calc(1.1rem * 1.32);
  }
}
@media print, screen and (max-width: 1210px) and (min-width: 835px){
  .sec_contetns .area_item_inner {
    max-height: clamp(300px, calc(180px + 35vw), 600px);
  }
}


/* ===============================================
# sec_contetns .item_staff 
=============================================== */
.sec_contetns .item_staff {
  max-height: calc(68vw + 285px);
  margin-top: 6rem;
}

.sec_contetns .item_staff.open {
  max-height: 9999px;
}
.sec_contetns .item_staff .staff_ttl {
  width: min(100%, 500px);
  margin: 0 auto 5px;
  padding-top: 17px;
}
@media print,screen and (min-width :835px){
  .sec_contetns .item_staff {
    max-height: 690px;
  }
}
@media print, screen and (max-width: 1210px) and (min-width: 835px){
  .sec_contetns .item_staff {
    max-height: clamp(460px, calc(280px + 36vw + 55px), 760px);
  }
}


/* ===============================================
# sec_map
=============================================== */
.sec_map {
  position: relative;
  background: #fff;
  padding: 3rem 0 5rem;
}
.sec_map .map_ttl {
  position: absolute;
  top: min(calc(-37.3% * 0.126),calc(-210px * 0.126));
  width: min(37.3%,210px);
  z-index: 2;
}
.sec_map .box_map {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1 / 0.53; 
}
.sec_map .box_map iframe {
  width: 100%;
  height: 100%;
  border-radius: 10px;
}

/* ===============================================
# sec_map .btn_around
=============================================== */
.sec_map .btn_around {
  padding: 2em 0 0;
  text-align: center;
}
.sec_map .btn_around a {
  position: relative;
  display: inline-flex;
  gap:3.5em;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  padding: .5em .5em .5em 5.5em;
  border-radius: 9999px;
  background: var(--accent_color);
  font-weight: 700;
  font-size: 1.7rem;
  color: #fff;
}
.sec_map .btn_around a::before {
  position: absolute;
  left: 22px;
  bottom: .6em;
  content: "";
  display: block;
  width: 2.18em;
  height: 3.12em;
  background: url("../img/deco_img01.svg") no-repeat center center;
  background-size: contain;
}
.sec_map .btn_around a::after {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  background: url("../img/arrow01_r.svg") no-repeat center center;
  background-size: contain;
}
@media print,screen and (min-width :835px){
  .sec_map .btn_around a {
    font-size: calc(1.7rem * 1.32);
  }
}




/* ===============================================
# footer
=============================================== */
footer{
  position: relative;
  padding-top: 7rem;
  padding-bottom: 2.5rem;
  background: #def5fc;
}
footer::before{
  position: absolute;
  top: -2rem;
  left: 0;
  content: "";
  display: block;
  width: 100%;
  height: calc(2rem + 1px);
  background: url("../img/ft_bg_up_day1.svg") repeat-x left top;
  background-size: 375px;
}
footer .link_main a{
  width: 265px;
  max-width: 100%;
  margin: 0 auto;
  padding: 15px 3px;
  display: block;
  background: #fff;
  border-radius: 5px;
  font-size: 13px;
  font-size: 1.3rem;
  line-height: 1;
  text-align: center;
}
footer .link_main a img{
  width: 219px;
  margin: 0 auto 10px;
}
footer .link_main a span{
  display: block;
}

footer address{
  margin-top: 17px;
  text-align: center;
  font-size: 13px;
  font-size: 1.3rem;  
  line-height: 1.692;
}
footer .sns_list ul{
  width: 196px;
  margin:20px auto 0;
	-webkit-box-pack: justify;
	justify-content: space-between;  
}
footer .sns_list li{
  width: 30px;
}
footer .copyright{
  margin-top: 20px;
  text-align: center;
  font-size: 12px;
  font-size: 1.2rem;    
}
/*----- day2 -----*/
.page_day2 footer{
  background: #fde4d5;
}
.page_day2 footer::before{
  background: url("../img/ft_bg_up_day2.svg") repeat-x left top;
  background-size: 375px;
}

@media print,screen and (min-width :835px){
  footer{
    padding-top: 40px;
    padding-bottom: 35px;
  }

  footer .link_main a{
    width: 354px;
    padding: 20px 3px;
    border-radius: 6px;
    font-size: 17px;
    font-size: 1.7rem;
  }
  footer .link_main a img{
    width: 292px;
    margin-bottom: 14px;
  }

  footer address{
    margin-top: 25px;
    font-size: 17px;
    font-size: 1.7rem;  
  }
  footer .sns_list ul{
    width: 260px;
    margin-top: 30px;
  }
  footer .sns_list li{
    width: 40px;
  }
  footer .copyright{
    margin-top: 25px;
    font-size: 14px;
    font-size: 1.4rem;
  }  
}

/* ===============================================
# wrap_bgimg
=============================================== */
.wrap_bgimg figure{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.wrap_bgimg figure img{
  width: 100%;
  height: 100%;  
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  object-fit: cover;
  opacity: 0;
  z-index: 0;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;  
}
.wrap_bgimg figure.active img{
  opacity: 1;
  z-index: 1;
}
@media print,screen and (max-width :1210px){
  .wrap_bgimg{
    display: none;
    content-visibility:hidden;
  }
}
