@charset "UTF-8";

@media screen and (min-width: 768px) {
  .content {
    border-top: solid 1px #e9e9e9;
    margin-top: 75px;
  }
  /* .mv {
    position: relative;
    width: 1200px;
    height: 640px;
    margin: 0 auto;
    padding: 42px 0 100px;
    overflow: hidden;
  }
  .mv .swiper-container {
    height: 100%;
    overflow: visible;
  }
  .mv .swiper-slide {
    background: center/cover no-repeat;
  }
  .mv .swiper-slide[data-swiper-slide-index="0"] {
    background-image: url(../images/top/MV_01_pc.jpg);
  }
  .mv .swiper-slide[data-swiper-slide-index="1"] {
    background-image: url(../images/top/MV_02_pc.jpg);
  }
  .mv .swiper-slide[data-swiper-slide-index="2"] {
    background-image: url(../images/top/MV_03_pc.jpg);
  }
  .mv .swiper-slide[data-swiper-slide-index="3"] {
    background-image: url(../images/top/MV_04_pc.jpg);
  }
  .mv .swiper-slide[data-swiper-slide-index="4"] {
    background-image: url(../images/top/MV_05_pc.jpg);
  }
  .mv .swiper-slide[data-swiper-slide-index="5"] {
    background-image: url(../images/top/MV_06_pc.jpg);
  }
  .mv .swiper-pagination {
    top: 100%;
    bottom: auto;
    display: flex;
    justify-content: center;
    margin-top: 30px;
  }
  .mv .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background: #ccc;
    opacity: 1;
  }
  .mv
    .swiper-container-horizontal
    > .swiper-pagination-bullets
    .swiper-pagination-bullet {
    margin: 0 5px;
  }
  .mv .swiper-pagination-bullet-active {
    background: #015077;
  }
  .mv .catch {
    position: absolute;
    left: 30px;
    bottom: 129px;
    z-index: 1;
    filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.5));
  }
  .mv .bt-scroll {
    display: none;
  } */
}


.top-news{padding:100px 0; background-color:#f8f9fa;}
.top-news .wrap{position:relative;}
.top-news .wrap-btn{margin-bottom:100px;}
.top-news h2{margin-bottom:70px;}
.top-news ul li{float:left; width:357px; box-sizing:border-box; padding-top:13px; position:relative;}
.top-news ul li:first-child{padding-right:30px;}
.top-news ul li:last-child{padding-left:30px;}
.top-news ul li:nth-child(2){padding:13px 30px 0; width:386px;}
.top-news ul li:nth-child(2):before,
.top-news ul li:nth-child(2):after{content:""; display:block; width:1px; height:80px; background-color:#c5c5c5; position:absolute; top:0;}
.top-news ul li:nth-child(2):before{left:0;}
.top-news ul li:nth-child(2):after{right:0;}
.top-news ul li .info-cat{display:inline-block; min-width:100px; font-size:13px; line-height:21px; color:#fff; vertical-align:middle; text-align:center; margin-right:15px;}
.top-news ul li .date{padding-left:18px; display:inline-block; vertical-align:middle; border-left:#c5c5c5 solid 1px; font-size:13px; line-height:15px;}
.top-news ul li h3{font-size:15px; line-height:2; margin-top:13px;}
.top-news .link-list{position:absolute; right:0; top:50px;}
.top-news .link-list a{display:inline-block; padding-right:43px; font-size:15px; background:url(../images/top/ARROW_topnews.png) no-repeat right center;}

.top-news ul li .info-cat.cat-news{background-color:#003851;}
.top-news ul li .info-cat.cat-campaign{background-color:#b88a3d;}



.top-facility{padding:100px 0 85px;}
.top-facility h2{margin-bottom:80px;}



.top-enjoy{padding:110px 0;}
.top-enjoy h2{margin-bottom:80px;}
.top-enjoy .top-slide-block{margin-bottom:80px;}
.top-enjoy .top-slide-block .top-slide li img{width:100%;}
.top-enjoy .bx-wrapper{z-index: 99;}
.top-enjoy .bx-wrapper .bx-pager.bx-default-pager a{background-color:#cdd3dd; width:14px; height:14px; border-radius:7px; margin:0 8px;}
.top-enjoy .bx-wrapper .bx-pager.bx-default-pager a:hover,
.top-enjoy .bx-wrapper .bx-pager.bx-default-pager a.active{background:url(../images/common/BG_gradient.jpg) repeat center top; background-size:100% auto; background:-webkit-gradient(linear, left center, right center, from(#0e508d), to(#2c7061)); background: -moz-linear-gradient(left, #0e508d, #2c7061); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#EE0e508d', endColorstr='#EE2c7061');}
.top-enjoy .bx-wrapper .bx-controls-direction a{width:40px; height:74px; margin-top:-37px; background:no-repeat center;}
.top-enjoy .bx-wrapper .bx-controls-direction .bx-prev{background-image:url(../images/top/ARROW_slide_l.png); left:30px;}
.top-enjoy .bx-wrapper .bx-controls-direction .bx-next{background-image:url(../images/top/ARROW_slide_r.png); right:30px;}
.top-enjoy p{text-align:center; font-size:15px; line-height:2;}
.top-enjoy .season-list{margin:90px 0 80px;}
.top-enjoy .season-list li{float:left; width:254px; margin-right:28px; position:relative;}
.top-enjoy .season-list li.last{margin-right:0;}
.top-enjoy .season-list li a{display:block;}
.top-enjoy .season-list li .season-txt{position:absolute; left:12px; top:-27px;}
.top-enjoy .season-list li .arrow{position:absolute; right:0; bottom:0;}



.top-access{padding:110px 0; background:url(../images/top/BG_access.jpg) no-repeat center bottom; background-size:cover;}
.top-access h2{margin-bottom:65px;}
.top-access p{text-align:center; font-size:15px; line-height:50px;}
.top-access .map-box{position:relative; margin:60px 0 70px;}
.top-access .map-box .map-info{position:absolute; top:60px; right:60px; width:400px; height:300px; padding:40px 32px 0; box-sizing:border-box; background-color:rgba(255,255,255,.9);}
.top-access .map-box .map-info h3{font-size:16px; font-weight:500; line-height:1; margin-bottom:35px;}
.top-access .map-box .map-info dl{position:relative; padding-left:85px; margin-bottom:10px;}
.top-access .map-box .map-info dl dt{position:absolute; left:0; top:0; font-size:14px; line-height:23px;}
.top-access .map-box .map-info dl dd{font-size:14px; line-height:23px;}
.top-access .map-box .link-gmap{margin-top:25px;}
.top-access .map-box .link-gmap a{display:inline-block; font-size:14px; padding-right:44px; background:url(../images/top/ARROW_topnews.png) no-repeat right center;}
.top-access .bt-block{width:800px; margin:0 auto;}



.top-blog{box-sizing:border-box; position:relative; width:100%; overflow:hidden;}
.top-blog:after{position:absolute; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,.2); z-index:50;}
.top-blog .tb-txt{position:absolute; left:50%; top:0; bottom:0; margin:auto 0 auto -225px; width:450px; text-align:center; height:118px; z-index:10;}
.top-blog h2{text-align:center; font-size:24px; font-weight:500; color:#fff; margin-bottom:40px; line-height:1; letter-spacing:2px; left:2px; text-shadow:1px 1px 1px rgba(0,0,0,.5);}
.top-blog a{display:block; text-align:center; font-size:15px; color:#fff; line-height:50px; width:260px; margin:0 auto; border:#fff solid 1px; background-color:rgba(255,255,255,.05);}



@media screen and (max-width: 767px) {
  /* .mv {
    position: relative;
  }
  .mv::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    height: 224px;
    background: linear-gradient(
      to bottom,
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 1) 100%
    );
    opacity: 0.502;
  }
  .mv .swiper-container {
    height: 100%;
  }
  .mv .swiper-slide::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    display: none;
    width: 166.6666%;
    margin: 0 auto;
    background: center/cover no-repeat;
    animation: mv-slide-move calc((1500ms * 3) + (3500ms * 2)) linear forwards;  SP 本番用設定   
    animation-play-state: paused; */
    /*
      Swiperメモ

      Swiperでは現在のスライド+前後のスライドが同時に表示されるため
      1つのスライドの表示時間は以下の合計となる
      speed-delay-speed-delay-speed

      SP speed,delayの各時間はJSの設定と合わせること
      speed: 1500, // SP
      delay: 3500, // SP

      以下のようにanimation-durationを設定すること
      animation-duration: calc((swiper-speed-ms * 3) + (swiper-delay-ms * 2))
    */
  /* }
  .mv .swiper-slide.swiper-slide-prev::before,
  .mv .swiper-slide.swiper-slide-next::before,
  .mv .swiper-slide.swiper-slide-active::before,
  .mv .swiper-slide.swiper-slide-duplicate-prev::before,
  .mv .swiper-slide.swiper-slide-duplicate-next::before,
  .mv .swiper-slide.swiper-slide-duplicate-active::before {
    display: block;
    animation-play-state: running;
  }
  .mv .swiper-slide[data-swiper-slide-index="0"]::before {
    background-image: url(../images/top/sp/MV_01_sp.jpg);
  }
  .mv .swiper-slide[data-swiper-slide-index="1"]::before {
    background-image: url(../images/top/sp/MV_02_sp.jpg);
  }
  .mv .swiper-slide[data-swiper-slide-index="2"]::before {
    background-image: url(../images/top/sp/MV_03_sp.jpg);
  }
  .mv .swiper-slide[data-swiper-slide-index="3"]::before {
    background-image: url(../images/top/sp/MV_04_sp.jpg);
  }
  .mv .swiper-slide[data-swiper-slide-index="4"]::before {
    background-image: url(../images/top/sp/MV_05_sp.jpg);
  }
  .mv .swiper-slide[data-swiper-slide-index="5"]::before {
    background-image: url(../images/top/sp/MV_06_sp.jpg);
  }
  .mv .swiper-pagination {
    display: none;
  }
  .mv .catch {
    position: absolute;
    left: 0;
    bottom: 130px;
    z-index: 2;
    width: 100%;
    text-align: center;
  }
  .mv .goto {
    position: absolute;
    left: 50%;
    bottom: 67px;
    z-index: 2;
    margin-left: -18px;
  }
  .mv .goto::after {
    content: "";
    position: absolute;
    top: 23px;
    left: 17px;
    display: block;
    width: 2px;
    height: 5px;
    background-color: #fff;
    animation: mv-button-move 1200ms linear 500ms infinite;
  }
  @keyframes mv-slide-move {
    0% {
      transform: translateX(0);
    }
    100% {
      transform: translateX(-40%);
    }
  }
  @keyframes mv-button-move {
    0% {
      top: 20px;
      opacity: 0;
    }
    30% {
      opacity: 1;
    }
    70% {
      opacity: 1;
    }
    100% {
      top: 35px;
      opacity: 0;
    }
  } */



  .top-news{padding:50px 0 60px;}
  .top-news .wrap-btn{margin-bottom:50px;}
  .top-news h2{margin-bottom:25px;}
  .top-news ul{margin-bottom:40px;}
  .top-news ul li{float:none; width:100%; padding:15px 0 10px; border-bottom:#c5c5c5 solid 2px;}
  .top-news ul li:first-child{padding-right:0;}
  .top-news ul li:last-child{padding-left:0;}
  .top-news ul li:nth-child(2){padding:15px 0 10px; width:100%;}
  .top-news ul li:nth-child(2):before,
  .top-news ul li:nth-child(2):after{display:none;}
  .top-news ul li .info-cat{display:block; font-size:12px; line-height:20px; margin-right:0; float:left;}
  .top-news ul li .date{padding-left:0; display:block; border-left:none; font-size:14px; line-height:20px; float:right;}
  .top-news ul li h3{font-size:14px; margin-top:10px;}
  .top-news .link-list{position:static; top:0;}
  .top-news .link-list a{display:block; width:100%; padding:0; border-left:#0e508d solid 2px; border-right:#2c7061 solid 2px; box-sizing:border-box; position:relative; background:none;}
  .top-news .link-list a:before,
  .top-news .link-list a:after{content:""; display:block; width:100%; height:2px; position:absolute; left:0; background:-webkit-gradient(linear, left center, right center, from(#0e508d), to(#2c7061)); background: -moz-linear-gradient(left, #0e508d, #2c7061); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#FF0e508d', endColorstr='#FF2c7061');}
  .top-news .link-list a:before{top:0;}
  .top-news .link-list a:after{bottom:0;}
  .top-news .link-list a span{font-size:14px; line-height:55px; background:url(../images/common/sp/ARROW_01.png) no-repeat transparent; background-size:38px auto; background-position:right 15px center; text-align:center; box-sizing:border-box; display:block; color:#0d3c55;}



  .top-facility{padding:50px 0 0;}
  .top-facility h2{margin-bottom:40px;}



  .top-enjoy{padding:50px 0;}
  .top-enjoy h2{margin-bottom:40px;}
  .top-enjoy .top-slide-block{margin-bottom:40px;}
  .top-enjoy .bx-wrapper .bx-pager,
  .top-enjoy .bx-wrapper .bx-controls-auto{bottom:15px;}
  .top-enjoy .bx-wrapper .bx-pager.bx-default-pager a{width:12px; height:12px; border-radius:6px;}
  .top-enjoy .bx-wrapper .bx-controls-direction a{width:20px; height:37px; margin-top:-19px; background-size:20px auto;}
  .top-enjoy .bx-wrapper .bx-controls-direction .bx-prev{left:10px;}
  .top-enjoy .bx-wrapper .bx-controls-direction .bx-next{right:10px;}
  .top-enjoy p{font-size:14px; line-height:1.5;}
  .top-enjoy .season-list{margin:40px 0 0;}
  .top-enjoy .season-list li{width:47.5%; margin-right:0; margin-bottom:30px;}
  .top-enjoy .season-list li:nth-child(2n){margin-right:0; float:right;}
  .top-enjoy .season-list li a{display:block;}
  .top-enjoy .season-list li a > img{width:100%;}
  .top-enjoy .season-list li .season-txt{left:7px; top:-18px; width:32px;}
  .top-enjoy .season-list li .arrow{position:absolute; right:0; bottom:0; width:40px;}



  .top-access{padding:50px 0; background-image:url(../images/top/sp/BG_access.jpg);}
  .top-access h2{margin-bottom:40px;}
  .top-access p{font-size:14px; line-height:1.5;}
  .top-access .map-box{position:relative; margin:40px 0 30px;}
  .top-access .map-box .map-info{position:static; width:100%; height:auto; padding:0; background:none; margin-top:30px;}
  .top-access .map-box .map-info h3{margin-bottom:15px;}
  .top-access .map-box .map-info dl{padding-left:70px; margin-bottom:5px;}
  .top-access .map-box .map-info dl dt{font-size:12px; line-height:1.5;}
  .top-access .map-box .map-info dl dd{font-size:12px; line-height:1.5;}
  .top-access .map-box .link-gmap{margin-top:15px;}
  .top-access .map-box .link-gmap a{font-size:12px; padding-right:38px; background-image:url(../images/top/sp/ARROW_topnews.png); background-size:32px auto;}
  .top-access .bt-block{width:100%;}
  .top-access .bt-block li.left{float:none; margin-bottom:15px;}
  .top-access .bt-block li.right{float:none;}



  .top-blog{box-sizing:border-box; position:relative; width:100%; overflow:hidden;}
  .top-blog .tb-txt{ height:78px; width:310px; margin-left:-155px;}
  .top-blog h2{font-size:16px; margin-bottom:20px;}
  .top-blog a{font-size:14px; line-height:40px; width:185px;}
  .top-blog .slick-list{box-sizing:border-box; overflow:hidden; padding:0 100px !important;}
}

/* トップお知らせ */

.notice {
  position: absolute;
  left: 30px;
  top: 30px;
  z-index: 5;
}
.notice-inner {
  padding: 12px 15px;
  background: #FA6D85;
  border: 1px solid transparent;
  font-size: 16px;
  z-index: 5;
  transition: all 0.3s;
  padding-right: 30px;
}
.notice a {
  color: #FFF;
  /* text-decoration: underline; */
  display: block;
}
.notice a:hover {
  /* text-decoration: none; */
}
.notice::before {
  content: '';
	position: absolute;
	bottom: 10px;
	right: 10px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 12px 12px;
	border-color: transparent transparent #dfdfdf transparent;
  transition: all 0.3s;
}
.notice::after {
  content: '';
	position: absolute;
	bottom: -5px;
	right: -5px;
	width: 100%;
	height: 100%;
	background-color: #dfdfdf;
	z-index: -1;
}
.notice-inner:hover {
  border: 1px solid #fff;
  background-color: #f35771;
}
.notice:hover::before {
  border-color: transparent transparent #fff transparent;
}
@media screen and (max-width:767px) {
  .notice {
    top: 81px;
    left: 15px;
    /* width: calc(100% - 30px); */
    font-size: 12px;
  }
  .notice-inner {
    font-size: 14px;
    padding: 7px 10px;
    padding-right: 25px;
  }
  .notice::after {
    bottom: -3px;
    right: -3px;
  }
}


/*--------------------------------
	202308 トップMVスライド→動画埋め込みに変更
--------------------------------*/

/* MV動画 */

.mv-video-wrapper {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  position: relative;
  overflow: hidden;
}
.mv-video-wrapper video {
  width: 100%;
  vertical-align: bottom;
}
.mv-video-btn {
  font-family: 'Lato', sans-serif;
  letter-spacing: 0.18em;
  border: 1px solid #fff;
  color: #fff;
  padding: 5px 10px;
  padding-right: 25px;
  position: absolute;
  top: 45px;
  right: 5%;
  z-index: 101;
  transition: all 200ms;
}
.mv-video-btn:hover {
  opacity: 0.7;
}
.mv-video-btn::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 8px;
  transform: translateY(-50%);
  width: 5px;
  height: 8px;
  background: url(../images/common/sp/ARROW_02.png);
  background-size: cover;
}
.mv-copy {
  display: block;
  position: absolute;
  left: 5%;
  bottom: 87px;
  width: 410px;
  z-index: 2;
}
.mv-copy img {
  width: 100%;
}

/* modal-video */
.modal-video {
  background-color: rgb(255 255 255 / 90%);
}
.modal-video-body {
  padding: 15px;
  max-width: 1200px;
}
.modal-video-close-btn:before,
.modal-video-close-btn:after {
  background: #313131;
  height: 1px;
}
.modal-video-movie-wrap {
  animation-name: modal-open-anime;
  animation-timing-function: ease-out;
  animation-timing-function: cubic-bezier(0.49, -0.01, 0.58, 1);
  animation-duration: 200ms;
  animation-fill-mode: forwards;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
@keyframes modal-open-anime {
  0% {
    transform: scale(0.6);
  }
  100% {
    transform: scale(1);
  }
}
.modal-video-close .modal-video-movie-wrap {
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  transform: translate(0, 0);
}



/* スクロールボタン */
.mv-video-wrapper .goto {
  position: absolute;
  left: 50%;
  bottom: 87px;
  z-index: 2;
  margin-left: -18px;
  transition: all 200ms;
}
.mv-video-wrapper .goto::after {
  content: "";
  position: absolute;
  top: 25px;
  left: 19px;
  display: block;
  width: 2px;
  height: 6px;
  background-color: #fff;
  animation: mv-button-move-pc 1200ms linear 500ms infinite;
}
@keyframes mv-button-move-pc {
  0% {
    top: 22px;
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  100% {
    top: 35px;
    opacity: 0;
  }
}

@media (min-aspect-ratio: 16/9) {
  .mv-video-wrapper {
    height: 100vh;
    overflow: hidden;
    position: relative;
    overflow: hidden;
  }
  .mv-video-wrapper video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    min-width: 100%;
    min-height: 100%;
    width: auto;
  }
  .mv-video-wrapper .goto {
    bottom: 170px;
  }
  .mv-video-wrapper .mv-copy {
    bottom: 170px;
  }
}

@media screen and (max-width: 767px) {
  .mv-video-wrapper {
    height: 60vh;
    margin-top: 66px;
  }
  .mv-video-wrapper video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    min-width: 100%;
    min-height: 100%;
    width: auto;
    max-height: 100%;
  }
  .mv-video-wrapper .mv-copy {
    display: block;
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    width: 66.66vw;
  }
  .mv-video-wrapper .mv-video-btn {
    top: 25px;
  }

  /* スクロールボタン */
  .mv-video-wrapper .goto {
    position: absolute;
    left: 50%;
    bottom: 67px;
    z-index: 2;
    margin-left: -18px;
  }
  .mv-video-wrapper .goto::after {
    content: none;
  }

  @keyframes mv-button-move-sp {
    0% {
      top: 20px;
      opacity: 0;
    }
    30% {
      opacity: 1;
    }
    70% {
      opacity: 1;
    }
    100% {
      top: 35px;
      opacity: 0;
    }
  }
}

/*--------------------------------
	ピックアップ情報リンク
--------------------------------*/

.pickup {
  padding: 50px 0;
}
.pickup-item::before,
.pickup-item::after {
  content: '';
  display: block;
  width: 100%;
  height: 2px;
  background: linear-gradient(to right, #0e508d, #2c7061);
}
.pickup-item-inner {
  font-size: 16px;
  padding: 30px 100px 30px 50px;
  display: block;
  border-right: 2px solid #2c7061;
  border-left: 2px solid #0e508d;
  position: relative;
  background: url(../images/common/ARROW_01.png) no-repeat 1008px center #fff;
}

@media screen and (max-width: 767px) {
  .pickup {
    padding: 30px 0;
  }
  .pickup-item-inner {
    font-size: 13px;
    padding: 20px 45px 20px 20px;
    background: url(../images/common/sp/ARROW_01.png) no-repeat transparent;
    background-size: 24px auto;
    background-position: right 16px center;
  }
}