@charset "UTF-8";
/* PCナビ ここから*/
@media screen and (min-width:768px){
  .drop {
    position: relative;
  }
  .drop > li.drop_single {
    /* height: 30px;
    line-height: 30px; */
  }
  .drop > li.drop_single a {
    display: block;
  }
  ul.drop_second-level {
    visibility: hidden;
    opacity: 0;
    z-index: 1;
    right: 0 !important;
    background: #fff;
    padding: 5px 10px 10px 15px;
    width: 155%;
    left: -2%;
    border: 1px solid #333;
    top:28px;
  }
  .drop > li:hover {
    -webkit-transition: all .5s;
    transition: all .5s;
  }
  .drop_second-level li {
    margin-right: 0!important;
    width: 16rem;
  }
  /* 下矢印 */
  .init-bottom{
    position: relative;
  }
  #nav_wrapper nav ul .init-bottom:after {
    content: '';
    display: inline-block;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #333;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    background: none !important;
    left: 12.5rem;
    bottom: 10px;
    transform: scale(1, 1);
    position: absolute;
  }
  #nav_wrapper nav ul .init-bottom:after:hover {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
  }
  .drop {
    *zoom: 1;
  }
  .drop > li.drop_single {
    position: relative;
  }
  li.drop_single ul.drop_second-level {
    position: absolute;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
  }
  li.drop_single:hover ul.drop_second-level {
    visibility: visible;
    opacity: 1;
  }
}
/* PCナビ ここまで*/
header{
  /* height: 11vh; */
}
@media screen and (min-width:768px){
  header{
    height: 150px;
  }
}

main{
  margin-top: 3vh;
}
main .inner{
  position: relative;
}
@media screen and (min-width:768px){
  main{
    margin-top: 0;
  }
}
@media screen and (min-width:768px){
  main .inner{
    padding: 0 40px;
    height:  calc(100vh - 270px);
  }
}

h3{
  position: absolute;
  z-index: 10;
  font-family: "游ゴシック", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "<S Pゴシック", "MS PGothic", sans-serif !important;
  color: #fff;
  font-size: 1.9rem;
  writing-mode: vertical-rl;
  margin: auto;
  top: 15%;
  left: 0;
  right: 0;
  text-align: center;
  /* transform: translate(-43.8vw,0); */
  letter-spacing: 13px;
  line-height: 1.3;
  width: 100px;
  display: flex;
  align-items: center;
}
@media screen and (min-width:768px){
  h3{
    top: 0;
    bottom: 0;
    justify-content: center;
  }
}

/* メイン画像スライド ここから*/
.swiper-container{
  overflow: hidden;
  background-color: #333;
  margin: 0 auto 0px;
  /* height: 100vh; */
}
@keyframes zoom {
0% {
  transform: scale(1);
}
100% {
  transform: scale(1.1);
}
}
@media screen and (min-width:768px){
  .swiper-container{
    width: 100%;
    height:  calc(100vh - 270px);
    margin: 0 auto 120px;
  }
  .swiper-slide a:hover{
    opacity: 1;
    cursor: pointer;
  }
}

.swiper-slide-active .slide-img,
.swiper-slide-duplicate-active .slide-img,
.swiper-slide-prev .slide-img{
/* animation: zoom 30s linear 0s 1; */
animation-name:zoom;
animation-duration:12s;
animation-timing-function:ease-in;
}
.slide-text{
position: absolute;
top: 50%;
left: 50%;
font-size: 46px;
font-family: serif;
font-weight: bold;
text-shadow: 2px 2px 8px #333;
color: #fff;
transform: translate(-50%,-50%);
}
@media screen and (max-width:767px){
  .slide-img img{
    object-fit: cover;
    /* height: 100vw; */
    width: 100vw;
    }
}
@media screen and (min-width:768px){
  .slide-img img{
  object-fit: cover;
  height: 75vh;
  width: 100vw;
  }
}
/* メイン画像スライド ここまで*/


.fuwafuwa {
  z-index: 2;
  position: absolute;
  bottom: 10.2vh;
  left: 0;
  right: 0;
  margin: auto;
  /* animation: fuwafuwa 3s infinite ease-in-out .8s alternate; */
  display: inline-block;
  /* transition: 1.5s ease-in-out; */
  width: 70px;
  height: 70px;
  text-align: center;
  display: none;
}
  @keyframes fuwafuwa {
  0% {
    transform:translate(0, 0);
  }
  33% {
    transform:translate(0, -10px) ;
  }
  66% {
    transform:translate(0, -10px) ;
  }
  100% {
    transform:translate(0, 0) ;
  }
}
@media screen and (min-width:768px){
  .fuwafuwa {
    bottom: -85px;
    display: block;
  }
}
.fuwafuwa a{
  color: #6F9AAD;
}
.fuwafuwa span{
  position: relative;
  display: inline-block;
  text-align: center;
  color: #6F9AAD;
  font-weight: bold;
  font-size: 1.4rem;
}
.fuwafuwa span:after{
  content: '';
  width: 16px;
  height: 16px;
  border: 0;
  border-top: solid 2px #6F9AAD;
  border-right: solid 2px #6F9AAD;
  position: absolute;
  top: 23px;
  left: 0;
  right: 0;
  margin: auto;
  transform: rotate(135deg);
}
@media screen and (min-width:768px){
  .fuwafuwa span{
    text-align: center;
    font-size: 14px;
    width: auto;
  }
  .fuwafuwa span:after{
  top: 28px;
  width: 15px;
  height: 15px;
  }
}

.inner_cap{
  padding-top: 8vh;
}
#about.inner_cap{
  padding-top: 20vh;
}
@media screen and (min-width:768px){
  .inner_cap{
    padding-top: 0px;
  }
  #about.inner_cap{
    padding-top: 100px;
    margin-top: 100px;
  }
}
.inner_cap h2{
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  white-space: nowrap;
  margin: -5vw 0 0 7vw;
  letter-spacing: 10px;
  line-height: 2;
  color: #333;
  font-feature-settings: normal;
  font-weight: bold;
  font-size: 2rem;
  font-family: "游ゴシック", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "<S Pゴシック", "MS PGothic", sans-serif !important;
}
.inner_cap span{
  font-size: 1.2rem;
  color: #6F9AAD;
  font-family: 'Hind Siliguri', sans-serif !important;
  margin-left: 12vw;
  margin-top: 6px;
}
.inner_cap .text{
  font-size: 1.3rem;
  width: 80vw;
  margin: 40px auto 100px;
}
@media screen and (min-width:768px){
  .inner_cap{
    padding-top: 80px;
    display: flex;
    width: 55vw;
    margin: auto;
    align-items: center;
    justify-content: space-around;
    padding-bottom: 100px;
  }
  .inner_cap div{
    position: relative;
  }
  .inner_cap h2{
    line-height: 1.5;
    font-size: 2rem;
    margin: 0;
  }
  .inner_cap span{
    position: absolute;
    bottom: -25px;
    left: 0;
    right: 0;
    text-align: center;
    margin: auto;
  }
  .inner_cap .text{
    font-size: 1.4rem;
    width: auto;
    margin: 0;
  }
}
@media screen and (min-width:1200px){
  .inner_cap{
    width: 45vw;
  }
}
@media screen and (min-width:1400px){
  .inner_cap{
    width: 40vw;
  }
}
@media screen and (min-width:1600px){
  .inner_cap{
    width: 35vw;
  }
}


/* h2{
  position: absolute;
  letter-spacing: 5px;
  line-height: 3;
  font-size: 1.7rem;
  color: #fff;
  text-shadow: 1px 1px 1px #333;
  text-align: left;
  z-index: 2;
  font-family:"游ゴシック", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "<S Pゴシック", "MS PGothic", sans-serif !important;
} */

@media screen and (max-width: 767px) {
  h2{
    top: 55vh;
    left: 6vw;
  }
}
/* @media screen and (min-width:768px){
  .inner_cap{
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
@media screen and (min-width:900px){
  .inner_cap{
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
@media screen and (min-width:1100px){
  .inner_cap{
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
@media screen and (min-width:1300px){
  .inner_cap{
    display: flex;
    justify-content: center;
    align-items: center;
  }
} */
/* .top_logo{
  position: absolute;
  z-index: 2;
  width: 160px;
  top: 21vh;
  left: 6vw;
}
@media screen and (min-width:768px){
  .top_logo{
    width: 130px;
    top: 48vh;
    left: 11vw;
  }
}
@media screen and (min-width:900px){
  .top_logo{
    width: 160px;
    top: 48vh;
    left: 11vw;
  }
}
@media screen and (min-width:1100px){
  .top_logo{
    width: 160px;
    top: 48vh;
    left: 22vw;
  }
}
@media screen and (min-width:1300px){
  .top_logo{
    width: 180px;
    top: 46vh;
    left: 22vw;
  }
} */

h4{
  font-size: 2rem;
  text-align: center;
  font-family:"游ゴシック", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "<S Pゴシック", "MS PGothic", sans-serif !important;
  margin-bottom: 25px;
}
h4 span{
  font-size: 1.2rem;
  display: block;
  text-align: center;
  color: #6F9AAD;
  font-family: 'Hind Siliguri', sans-serif !important;
  font-weight: normal;
}
.text_experiential{
  font-size: 1.3rem;
}

#news{
  margin: auto;
  width: 75vw;
  padding-top: 80px;
  padding-bottom: 100px;
}
@media screen and (min-width:768px){
  #news{
    padding-top: 80px;
    padding-bottom: 120px;
    width: 70%;
  }
}
#news.inner{
  margin-bottom: 200px;
}
#news h4{
  margin-bottom: 20px;
}
#news dl{
  display: flex;
  border-bottom: 1px dotted#6F9AAD;
  padding-top: 20px;
  padding-bottom: 20px;
}
#news dl a{
  display: flex;
  width: 100%;
}
#news dl a:hover{
  text-decoration: none;
}
#news dl dt{
  color: #6F9AAD;
  font-size: 1.3rem;
  margin-right: 1.5em;
  font-family: 'Hind Siliguri', sans-serif !important;
}
@media screen and (min-width:768px){
  #news dl dt{
    margin-top: 1px;
  }
}
#news dl dd{
  font-size: 1.3rem;
  margin-right: 1.5em;
}
#news dl a{
  position: relative;
}
#news dl a:hover{
  opacity: .5;
}
#news dl a:after{
  content: '';
  position: absolute;
  top: 35%;
  right: 10px;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-left-color: #333;
}
@media screen and (min-width:768px){
  #news dl a:after{
    top: 30%;
  }
}
#news .btn{
  margin: 0 auto;
  text-align: center;
}
#news .btn a{
  color: #fff;
  display: inline-block;
  text-align: center;
  font-size: 1.3rem;
  margin: 50px 0;
  position: relative;
  background: #6F9AAD;
  height: 40px;
  line-height: 40px;
  width: 60vw;
  position: relative;
}
@media screen and (min-width:768px){
  #news .btn a{
    width: 30%;
  }
}
#news .btn a:after{
  content: '';
  position: absolute;
  top: 38%;
  right: 12px;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-left-color: #fff;
}


#area{
  width: 90vw;
  margin: auto;
  padding-top: 100px;
}
@media screen and (min-width:768px){
  #area{
    width: 70%;
  }
}
@media screen and (min-width:768px){
  #area > div{
    display: flex;
  }
}
#area .map{
  width: 80vw;
  margin: auto;
}
@media screen and (min-width:768px){
  #area > div > div{
    margin-left: 14%;
  }
}
#area .headline{
  font-size: 1.7rem;
  /* font-family:"游ゴシック", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "<S Pゴシック", "MS PGothic", sans-serif !important; */
  margin: 20px auto 25px;
}
#area .text{
  font-size: 1.3rem;
}

#event{
  background: #F2F2F2;
  padding: 50px 0 100px;
  margin: 50px auto 0;
}
@media screen and (min-width:768px){
  #event{
    margin: 80px auto 0;
    padding: 75px 0 80px;
  }
}


#landscape{
  margin-left: 10vw;
}
@media screen and (min-width:768px){
  #landscape{
    margin: auto;
    width: 70%;
    }
}
#landscape .slick-list{
  margin: auto;
  padding-left: 0 !important;
}

#landscape .slick-slide{
  margin-left: 3vw !important;
  margin-right: 3vw !important;
  float: left;
  height: 100%;
  min-height: 1px;
  border: 1px solid #707070;
  border-radius: 8px;
  overflow: hidden;
  padding-bottom: 20px;
  background: #fff;
}
@media screen and (min-width:768px){
  #landscape .slick-slide{
    margin-left: 10px !important;
    margin-right: 10px !important;
    float: left;
    height: 20vw;
    min-height: 480px;
  }
}
@media screen and (min-width:1200px){
  #landscape .slick-slide{
    height: 32vw;
  }
}
@media screen and (min-width:768px){
  #landscape .slick-slide p{
    overflow: hidden;
  }
  #landscape .slick-slide p img{
    transition:1s all;
  }
}
#landscape .slick-track{
  padding-bottom: 1px;
}
#landscape .slick-prev,#landscape .slick-next  {
z-index: 2;
/* width: 3.6vw;
height: 3.6vw; */
display: block !important;
background: transparent;
bottom: -30px;
padding: 0;
}
#landscape .slick-prev{
  content: '';
  width: 10px;
  height: 10px;
  border: 0;
  border-bottom: solid 2px #333;
  border-left: solid 2px #333;
  position: absolute;
  left: 18vw;
  margin-top: -4px;
  transform: rotate(45deg);
}
@media screen and (min-width:768px){
  #landscape .slick-prev{
    left: 40%;
  }
}
#landscape .slick-next {
  content: '';
  width: 10px;
  height: 10px;
  border: 0;
  border-top: solid 2px #333;
  border-right: solid 2px #333;
  position: absolute;
  right: 27vw;
  margin-top: -4px;
  transform: rotate(45deg);
}
@media screen and (min-width:768px){
  #landscape .slick-next{
    right: 40%;
  }
}
#landscape .slick-prev:before, .slick-next:before {
transform: scale(.3);
display: inline-block;
}
#landscape .slick-prev:hover,.slick-next:hover{
opacity: .8;
}
#landscape .slick-dots{
display: flex;
bottom: -28px;
justify-content: center;
position: absolute;
width: 80vw;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
display: none;
}
@media screen and (min-width:768px){
  #landscape .slick-dots{
    width: 100%;
    bottom: -30px;
  }
}
#landscape .slick-dots li{
position: relative;
display: inline-block;
width: 4px;
height: 4px;
margin: 0 10px;
padding: 0;
z-index: 2;
cursor: pointer;
}
#landscape .slick-dots li button{
font-size: 0;
line-height: 0;
display: block;
width: 8px;
height: 8px;
border-radius: 50%;
padding: 4px;
cursor: pointer;
color: transparent;
border: 0;
outline: none;
background: #B5B5B5;
z-index: 1;
}
#landscape .slick-dots li button:before{
font-family: 'slick';
font-size: 6px;
line-height: 8px;
position: absolute;
top: 0;
left: 0;
width: 8px;
height: 8px;
content: '';
text-align: center;
opacity: .25;
color: rgb(161, 150, 150);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
#landscape .slick-dots li.slick-active button:before{
opacity:1;
font-size: 1rem;
background: #6F9AAD;
border-radius: 50%;
}
#landscape h5{
  text-align: center;
  margin: 20px auto 18px;
  font-size: 1.6rem;
  padding: 0 5vw;
  /* font-family:"游ゴシック", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "<S Pゴシック", "MS PGothic", sans-serif !important; */
}
@media screen and (min-width:768px){
  #landscape h5{
    padding: 0 1.5em;
    font-size: 15px;
  }
}
#landscape span{
  padding: 0 5vw;
  font-size: 1.2rem;
  display: inline-block;
}
@media screen and (min-width:768px){
  #landscape span{
    padding: 0 1.5em;
    font-size: 13px;
  }
}

 /* 動画ここから */
 .food_hotel{
  position: relative;
  padding: 140px 0 0px;
}
@media screen and (min-width:768px){
  .food_hotel{
    padding: 0 0 20px;
  }
}
#hotel{
  padding-bottom: 80px;
}
@media screen and (min-width:768px){
  #hotel{
    padding-bottom: 100px;
  }
}
.food_hotel a:hover{
  text-decoration: none;
  opacity: .8;
}
.food_hotel .soon:hover{
  opacity: 1 !important;
}
.food_hotel .soon img:hover{
  opacity: 1 !important;
}
.food_hotel .section-lineup{
  overflow: hidden;
}
.food_hotel .section-lineup .inner{
  margin: 0 auto;
}
.food_hotel .slick-slide{
  float: none;
  margin-left: 4vw !important;
  margin-right: 4vw !important;
  line-height: 0 !important;
}
@media screen and (min-width:768px){
  .food_hotel .slick-slide a{
    overflow: hidden;
    display: block;
  }
  .food_hotel .slick-slide a img{
    transition:1s all;
  }
  .food_hotel .slick-slide a img:hover{
    transform:scale(1.1,1.1);
    transition:1s all;
  }
}

.food_hotel .slick-track{
  display: flex !important;
  justify-content: space-between;
}
.food_hotel .section-lineup .lineup{
  position: relative;
}
.food_hotel .lineup-carousel li{
  text-align: center;
  margin-right: 24px;
}
.food_hotel .lineup-carousel img{
  display: block;
  width:100%;
}
.food_hotel .section-lineup .slick-list{
  overflow: hidden;
  padding-right: 10vw;
  padding-left: 10vw;
}
@media screen and (min-width:768px){
  .food_hotel .section-lineup .slick-list{
  padding-right: 20vw;
  padding-left: 20vw;
  }
}
.food_hotel .section-lineup .slick-arrow {
  display: inline-flex;
  width:7vw;
  height:7vw;
  align-items: center;
  justify-content: center;
}
@media screen and (min-width:768px){
  .food_hotel .section-lineup .slick-arrow {
    width: 3.6vw;
    height: 3.6vw;
  }
}
.food_hotel .section-lineup .slick-next,.food_hotel .section-lineup .slick-prev{
position: absolute;
top: 46%;
cursor: pointer;
color: transparent;
border: none;
outline: none;
}
.food_hotel .section-lineup .slick-next-food {
    z-index: 2;
    display: block !important;
    background: transparent;
    bottom: -30px;
    padding: 0;
    position: absolute;
    content: '';
    width: 12px;
    height: 12px;
    border: 0;
    border-top: solid 2px #333;
    border-right: solid 2px #333;
    position: absolute;
    right: 9.5vw;
    margin-top: -4px;
    transform: rotate(45deg);
  
}
@media screen and (min-width:768px){
  .food_hotel .section-lineup .slick-next-food {
    right: 19.5vw;
    width: 20px;
    height: 20px;
  }
}
.food_hotel .section-lineup .slick-prev-food {
    z-index: 2;
    display: block !important;
    background: transparent;
    bottom: -30px;
    padding: 0;
    content: '';
    width: 12px;
    height: 12px;
    border: 0;
    border-bottom: solid 2px #333;
    border-left: solid 2px #333;
    position: absolute;
    left: 9.5vw;
    margin-top: -4px;
    transform: rotate(45deg);
}
@media screen and (min-width:768px){
  .food_hotel .section-lineup .slick-prev-food {
    left: 19.5vw;
    width: 20px;
    height: 20px;
  }
}
.food_hotel .section-lineup .slick-next-food, .food_hotel .section-lineup .slick-prev-food{
  top: 20vw;
}
@media screen and (min-width:768px){
  .food_hotel .section-lineup .slick-next-food, .food_hotel .section-lineup .slick-prev-food{
    top: 14vw;
  }
}
.food_hotel .section-lineup .slick-next-food:hover, .food_hotel .section-lineup .slick-prev-food:hover{
  cursor: pointer;
}
.food_hotel .text{
  text-align: center;
  font-size: 1.3rem;
  width: 80vw;
  margin: 0 auto 32px;
}
@media screen and (min-width:768px){
  .food_hotel .text{
    width: 85%;
  }
}
.food_hotel .name{
  text-align: center;
  font-size: 1.5rem;
  font-weight: bold;
  margin: 12px auto 3px;
  /* font-family: 游ゴシック, YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important; */
}
@media screen and (min-width:768px){
  .food_hotel .name{
    margin-top: 16px;
  }
}
.food_hotel .cap{
  text-align: center;
  font-size: 1.2rem;
  margin: 0 auto 5px;
}
@media screen and (min-width:768px){
  .food_hotel .cap{
    font-size: 13px;
  }
}
.food_hotel.line .slick-track{
  margin-left: 0;
}
/* 動画ここまで */