@charset "utf-8";

@media screen and (min-width:1000px){
  header .btn-reserve a{display:none;}
}

/* -------------------------------------------------- */
/* #block-mv */
/* -------------------------------------------------- */
#block-mv{width:100%;height:100dvh;min-height:600px;position:relative;display:flex;align-items:flex-end;color:#fff;clip-path:inset(0);}
#block-mv a{color:#fff;}
#block-mv *{letter-spacing:0;}
#block-mv .back{width:100%;height:100vh;position:fixed;top:0;left:0;z-index:0;background:url(/img/top/mv.jpg) no-repeat center center;background-size:cover;opacity:0;transform:scale(1.05);filter:blur(10px);}
#block-mv .back::before{content:"";display:block;width:100%;height:385px;position:absolute;top:0;left:0;background: linear-gradient(180deg,rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0) 100%);opacity:0.2;z-index:1;}
#block-mv .inner{position:relative;z-index:2;display:flex;align-items:flex-end;justify-content:space-between;gap:20px;width:100%;padding:40px;opacity:0;transform:translateY(-20px);}
#block-mv .banner > li + li{margin-top:20px;}
#block-mv .tel a{font-size:3.6rem;line-height:1;}
#block-mv .tel a small{font-size:3.2rem;}
#block-mv .tel p{font-size:1.2rem;line-height:1.8;}
#block-mv .nav{position:absolute;z-index:3;top:45px;right:155px;font-weight:500;font-size:2rem;opacity:0;transform:translateY(-20px);}
#block-mv .nav ul{display:flex;flex-direction:row-reverse;gap:5px;}
#block-mv .nav ul > li > a{letter-spacing:0.15em;line-height:1;display:inline-block;padding:0 17px;writing-mode: vertical-rl;text-orientation: mixed;position:relative;}
#block-mv .nav ul > li > a::before{content:"";display:block;width:1px;height:0;background:#fff;position:absolute;left:100%;top:0;transition:.3s;}
#block-mv .nav ul > li > a:hover::before{height:100%;}
#block-mv .nav ul > li.reserve > a{padding:15px 12px;background:#fff;color:#000;font-size:1.8rem;font-weight:600;margin-left:18px;border:1px solid transparent;}
#block-mv .nav ul > li.reserve > a::before{display:none;}
#block-mv .nav ul > li.reserve > a:hover{background:#000;color:#fff;}

#block-mv.animated .back{filter:none;opacity:1;transform:none;transition:2s;}
#block-mv.animated .nav{opacity:1;transform:none;transition:1s 1s;}
#block-mv.animated .inner{opacity:1;transform:none;transition:1s 1.5s;}

@media screen and (max-width:999px){
  #block-mv .nav{display:none;}
  #block-mv .tel a{font-size:3rem;}
  #block-mv .tel a small{font-size:2.4rem;}
}
@media screen and (max-width:767px){
  #block-mv{min-height:500px;}
  #block-mv .inner{padding:6%;}
  #block-mv .banner{width:45%;}
  #block-mv .tel a{font-size:2.4rem;}
  #block-mv .tel a small{display:block;font-size:1.4rem;margin-bottom:5px;}
  #block-mv .tel p{line-height:1.5;font-size:1.1rem;}
}

/* -------------------------------------------------- */
/* #block-banner */
/* -------------------------------------------------- */
#block-banner .container{padding-top:20px;padding-bottom:20px;}

/* -------------------------------------------------- */
/* .block-top */
/* -------------------------------------------------- */
.block-top{width:calc(100% - 40px);margin:auto;color:#fff;margin-top:20px;position:relative;background:#1d1d1d;overflow:hidden;}
.block-top::before{content:"";display:block;width:100%;height:100%;position:absolute;top:0;left:0;z-index:0;background:no-repeat center center #1d1d1d;background-size:cover;opacity:0;transform:scale(1.05);}
.block-top.animated::before{opacity:1;transform:none;transition:2s;}
.block-top .block01{position:relative;z-index:1;}
.block-top .block01 .btn{margin-top:40px;}
.block-top .block01.right{margin-left:auto;margin-right:0;width:fit-content;}
.block-top .block02{margin:80px auto 0;padding:0 30px 60px;position:relative;z-index:1;}

.block-top .list01{display:flex;justify-content:flex-end;gap:20px;max-width:1340px;margin:auto;}
.block-top .list01 > li a{position:relative;border:1px solid #fff;display:block;}
.block-top .list01 > li a span{min-width:240px;padding:8px 60px 8px 20px;display:inline-block;background:#fff;position:absolute;right:0;bottom:0;line-height:1.5;font-weight:600;letter-spacing:0;transition:.25s ease;}
.block-top .list01 > li a span::after{content:"";display:block;width:22px;height:5px;background:url(/img/arrow01.svg) no-repeat center center / 100% auto;position:absolute;right:20px;top:50%;margin-top:-2px;transition:.25s ease;}
.block-top .list01 > li a:hover span::after{right:10px;}
.block-top .list02{display:flex;flex-wrap:wrap;gap:20px;max-width:1340px;margin:auto;}
.block-top .list02 > li{width:calc((100% - 20px) / 2);}
.block-top .list02 > li.small{width:calc((100% - 40px) / 3);}
.block-top .list02 > li a{position:relative;border:1px solid #fff;display:block;}
.block-top .list02 > li a img{width:100%;}
.block-top .list02 > li a span{min-width:240px;padding:8px 50px 8px 20px;display:inline-block;background:#fff;position:absolute;right:0;bottom:0;line-height:1.5;font-weight:600;letter-spacing:0;transition:.25s ease;}
.block-top .list02 > li a span::after{content:"";display:block;width:22px;height:5px;background:url(/img/arrow01.svg) no-repeat center center / 100% auto;position:absolute;right:20px;top:50%;margin-top:-2px;transition:.25s ease;}
.block-top .list02 > li a:hover span::after{right:10px;}

@media screen and (max-width:999px){
  .block-top{width:calc(100% - 20px);margin-top:10px;}
  .block-top .list02 > li.small a span{min-width:1px;}
}
@media screen and (max-width:767px){
  .block-top .block01.right{margin:0;}
  .block-top .block01 .btn{margin-top:30px;}
  .block-top .block02{margin-top:40px;padding:0 6% 40px;}

  .block-top .list01{display:block;margin:auto;}
  .block-top .list01 > li + li{margin-top:10px;}
  .block-top .list01 > li a{width:100%;height:0;padding-bottom:55%;padding-bottom:clamp(10px, 55%, 250px);}
  .block-top .list01 > li img{width:100%;height:100%;position:absolute;top:0;left:0;object-fit:cover;}
  .block-top .list01 > li a span{min-width:160px;padding:5px 40px 5px 15px;}
  .block-top .list01 > li a span::after{width:18px;right:15px;}
  .block-top .list02{margin:auto;gap:10px;}
  .block-top .list02 > li{width:100%;}
  .block-top .list02 > li a{width:100%;height:0;padding-bottom:55%;padding-bottom:clamp(10px, 55%, 250px);}
  .block-top .list02 > li img{width:100%;height:100%;position:absolute;top:0;left:0;object-fit:cover;}
  .block-top .list02 > li a span{min-width:160px;padding:5px 40px 5px 15px;}
  .block-top .list02 > li a span::after{width:18px;right:15px;}
  .block-top .list02 > li.small{width:calc((100% - 10px) / 2);}
  .block-top .list02 > li.small a{padding-bottom:clamp(10px, 80%, 250px);}
  .block-top .list02 > li.small a span{font-size:1.2rem;min-width:1px;line-height:1.3;padding:5px 12px;}
  .block-top .list02 > li.small a span::after{display:none;}
}

/* -------------------------------------------------- */
/* #block-activity */
/* -------------------------------------------------- */
#block-activity::before{background-image:url(/img/top/activity_back.jpg);}

/* -------------------------------------------------- */
/* #block-plan */
/* -------------------------------------------------- */
#block-plan{padding:0 30px 60px;}
#block-plan::before{background-image:url(/img/top/plan_back.jpg);}
#block-plan .list-plan{/*display:flex;gap:20px;*/max-width:1360px;margin:60px auto 0;}
#block-plan .list-plan .slick-track{display:flex!important;}
#block-plan .list-plan .item{/*width:calc((100% - 60px) / 4);max-width:320px;*/margin:0 10px;float:none!important;height:auto!important;}
#block-plan .list-plan .item > a{display:block;width:100%;height:100%;position:relative;background:#fff;}
#block-plan .list-plan .item > a::before{content:"MORE";display:block;position:absolute;right:0;bottom:0;color:#fff;font-size:1.3rem;line-height:1;letter-spacing:0;padding:9px 68px 9px 20px;background:url(/img/arrow02.svg) no-repeat right 12px center #000;background-size:22px auto;border:1px solid #000;transition:.25s ease;}
#block-plan .list-plan .item > a:hover::before{background-color:#fff;background-image:url(/img/arrow01.svg);background-position:right 5px center;color:#000;}
#block-plan .list-plan .item .img{width:100%;height:0;padding-bottom:75%;position:relative;}
#block-plan .list-plan .item .img img{display:block;width:100%;height:100%;position:absolute;top:0;left:0;object-fit:cover;}
#block-plan .list-plan .item .info{padding:20px 25px 50px;}
#block-plan .list-plan .item .info p{line-height:1.5;font-size:1.5rem;font-weight:500;letter-spacing:0;}
#block-plan .list-plan .item .info .date{font-size:1.2rem;color:#666;margin-top:10px;}

@media screen and (max-width:999px){
  #block-plan{padding:0 0 40px;}
  #block-plan .list-plan .item{width:300px;height:auto;padding:0 10px;}
  #block-plan .slick-arrow{position:absolute;top:50%;z-index:1;width:40px;height:40px;background:url(/img/arrow03.svg) no-repeat center center #000;background-size:5px auto;font-size:0;margin-top:-20px;}
  #block-plan .slick-prev{left:0;transform:scale(-1,1);}
  #block-plan .slick-next{right:0;}
  #block-plan .slick-track{display:flex;} 
}
@media screen and (max-width:767px){
  #block-plan .list-plan{margin-top:0;}
  #block-plan .list-plan .item{width:250px;padding:0 5px;}
  #block-plan .list-plan .item .info{padding:15px 20px 45px;}
  #block-plan .list-plan .item .info p{font-size:1.3rem;}
  #block-plan .list-plan .item .info .date{margin-top:5px;}
  #block-plan .list-plan .item > a::before{font-size:1.1rem;background-size:18px auto;padding:7px 45px 7px 15px;}
}

/* -------------------------------------------------- */
/* #block-room */
/* -------------------------------------------------- */
#block-room::before{background-image:url(/img/top/room_back.jpg);height:800px;}

@media screen and (max-width:767px){
  #block-room::before{height:500px;}
}

/* -------------------------------------------------- */
/* #block-hotspring */
/* -------------------------------------------------- */
#block-hotspring::before{background-image:url(/img/top/hotspring_back.jpg);}

/* -------------------------------------------------- */
/* #block-cuisine */
/* -------------------------------------------------- */
#block-cuisine::before{background-image:url(/img/top/cuisine_back.jpg);}
#block-cuisine .block01{width:60%;padding-bottom:125px;}
#block-cuisine .cuisine-img{width:calc(50% + 50px);display:flex;flex-wrap:wrap;gap:15px;justify-content:flex-end;position:absolute;right:-50px;bottom:60px;text-align:right;}
#block-cuisine .cuisine-img01{width:78%;}
#block-cuisine .cuisine-img02{display:inline-block;width:calc((100% - 100px) / 2);}
#block-cuisine .cuisine-img03{display:inline-block;width:calc((100% - 100px) / 2);margin-right:60px;}

@media screen and (max-width:999px){
  #block-cuisine .block01{width:100%;}
  #block-cuisine .cuisine-img{width:calc(55% + 30px);right:-30px;bottom:40px;} 
}
@media screen and (max-width:767px){
  #block-cuisine .block01{padding-bottom:0;}
  #block-cuisine .block02{padding-left:0;padding-right:0;}
  #block-cuisine .cuisine-img{position:static;width:100%;gap:10px;max-width:500px;margin:auto;}
  #block-cuisine .cuisine-img01{width:100%;}
  #block-cuisine .cuisine-img02,
  #block-cuisine .cuisine-img03{width:calc((100% - 10px) / 2);margin:0;}
}

/* -------------------------------------------------- */
/* #block-link */
/* -------------------------------------------------- */
#block-link{padding:20px 20px 0;}
#block-link .list{display:flex;flex-wrap:wrap;gap:20px;}
#block-link .list > li{width:calc((100% - 20px) / 2);}
#block-link .list > li a{position:relative;display:block;}
#block-link .list > li a img{width:100%;}
#block-link .list > li a span{min-width:240px;padding:8px 60px 8px 20px;display:inline-block;background:#fff;position:absolute;right:0;bottom:0;line-height:1.5;font-weight:600;letter-spacing:0;transition:.25s ease;}
#block-link .list > li a span::after{content:"";display:block;width:22px;height:5px;background:url(/img/arrow01.svg) no-repeat center center / 100% auto;position:absolute;right:20px;top:50%;margin-top:-2px;transition:.25s ease;}
#block-link .list > li a:hover span::after{right:10px;}

@media screen and (max-width:999px){
  #block-link{padding:10px 10px 0;}
  #block-link .list{gap:10px;}
  #block-link .list > li{width:calc((100% - 10px) / 2);}
}
@media screen and (max-width:767px){
  #block-link .list{display:block;}
  #block-link .list > li{width:100%;}
  #block-link .list > li + li{margin-top:10px;} 
}

/* -------------------------------------------------- */
/* #block-access */
/* -------------------------------------------------- */
#block-access .container{padding-top:80px;}
#block-access .inner{position:relative;padding-bottom:50px;}
#block-access .inner .map{width:85%;height:600px;position:relative;}
#block-access .inner .map iframe{position:absolute;top:0;left:0;width:100%;height:100%;}
#block-access .inner .info{width:45%;padding:50px 70px;background:#f3f3f3;position:absolute;right:0;bottom:0;}
#block-access .inner .info .logo{margin-bottom:20px;}
#block-access .inner .info p{line-height:2;letter-spacing:0;}
#block-access .inner .info .ttl{font-size:2rem;font-weight:500;letter-spacing:0;margin:25px 0 10px;;line-height:1.5;}
#block-access .inner .info .list{display:flex;gap:20px;flex-wrap:wrap;}
#block-access .inner .info .list > li a{display:inline-block;padding:8px 10px;background:#fff;border:1px solid #000;min-width:145px;letter-spacing:0;line-height:1.5;white-space:nowrap;text-align:center;opacity:1!important;}
#block-access .inner .info .list > li a:hover{background:#000;color:#fff;}
#block-access .inner .info .list > li a small{font-size:1.2rem;}
#block-access .inner .info .btn{margin-top:20px;}

@media screen and (max-width:999px){
  #block-access .inner .map{width:75%;}
  #block-access .inner .info{padding:40px;} 
  #block-access .inner .info .list{gap:10px;}
}
@media screen and (max-width:767px){
  #block-access .container{padding-top:60px;}
  #block-access .inner{padding-bottom:0;}
  #block-access .inner .map{width:100%;height:clamp(1px,100vw,400px);}
  #block-access .inner .info{width:100%;position:static;padding:25px;}
  #block-access .inner .info .logo{margin-bottom:5px;max-width:70%;width:250px;}
  #block-access .inner .info p{font-size:1.3rem;line-height:1.8;}
  #block-access .inner .info .ttl{font-size:1.6rem;margin-top:15px;margin-bottom:5px;}
  #block-access .inner .info .list{gap:5px;}
  #block-access .inner .info .list > li a{min-width:1px;font-size:1.3rem;padding:5px 8px;}
}

/* -------------------------------------------------- */
/* #block-news */
/* -------------------------------------------------- */
#block-news{margin:20px 0 100px;position:relative;overflow:hidden;}
#block-news::before{content:"";display:block;width:40%;height:90%;background:#f3f3f3;position:absolute;top:0;left:0;z-index:0;}
#block-news .inner{display:flex;gap:80px;}
#block-news .inner .common-ttl01{margin-top:50px;}
#block-news .inner .right{margin-top:200px;}
#block-news .inner .list > li{position:relative;}
#block-news .inner .list > li::before{content:"";display:block;width:150vw;height:1px;background:#000;position:absolute;left:0;bottom:0;}
#block-news .inner .list > li a{padding:20px 0;display:flex;line-height:1.8;gap:50px;}
#block-news .inner .list > li a span{letter-spacing:0;}

@media screen and (max-width:999px){
  #block-news .inner{gap:40px;}
}
@media screen and (max-width:767px){
  #block-news{margin-top:60px;margin-bottom:60px;overflow:visible;}
  #block-news::before{top:-30px;}
  #block-news .inner{display:block;}
  #block-news .inner .left{display:flex;align-items:center;justify-content:space-between;}
  #block-news .inner .common-btn01{min-width:1px;}
  #block-news .inner .common-ttl01{margin-top:0;margin-bottom:0;}
  #block-news .inner .right{margin-top:20px;}
  #block-news .inner .list > li::before{width:100%;}
  #block-news .inner .list > li a{gap:20px;padding:15px 0;font-size:1.3rem;}
}
