@charset "UTF-8";

.home #fv {
  position: relative;
  z-index: 2;
  overflow: hidden;
}
.home #fv .wrap {
  height: 100svh;
  /* width: 100vw; */
  position: relative;
  /* padding: 0 40px; */
  display: flex;
  align-items: center;
  justify-content: center;
}
.home #fv .inner {
  width: 100%;
  height: 100%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.home #fv .logo {
  width: 280px;
  height: 22px;
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  z-index: 1;
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-delay: 4s;
  transition-property: opacity;
}
.home #fv .logo:before,
.home #fv .logo:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #fff;
}
.home #fv .logo:before {
  transform-origin: right;
  transition-duration: 1s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-delay: 1s;
  transition-property: transform;
}
.home #fv .logo:after {
  transform: scaleX(0);
  transform-origin: left;
  transition-duration: 1s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-delay: 3s;
  transition-property: transform;
}
.home #fv .logo svg {
  width: 100%;
}
.home #fv .kv {
  /* background-image: url(../img/kv_pc.png); */
  background-size: cover;
  background-position: center;
  /* position: absolute; */
  width: 100%;
  height: 100%;
  z-index: 0;
  overflow: hidden;
  background-position: bottom;
  transform: scale(1.05);
  transition: 2s;
  /* transition-delay: .5s; */
  filter: blur(10px);
  opacity: 0;
  line-height: 0;
}
.home #fv .kv img {
  width: 100%;
  height: auto;
}
.home #fv .kv img.sp {
  display: none;
}
.home #fv .kv .swiper-wrapper:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: #000;
  opacity: 0;
  z-index: 2;
}
.home #fv .fv_logo {
  position: absolute;
  z-index: 1;
  min-width: 340px;
  width: 30vw;
  left: 60px;
  opacity: 0;
  transition: opacity 2s;
  transition-delay: 1s;
  bottom: 40px;
}
.onload #fv .fv_logo {
  opacity: 1;
}
.home #fv .fv_logo img {
  width: 100%;
}
.home #fv .kv {
  /* width: 100%; */
  /* height: 100%; */
  /* transform: scale(1.05); */
  /* transition: 2s; */
  /* transition-delay: .5s; */
  /* filter: blur(10px); */
  /* opacity: 0; */
}
.onload #fv .kv {
  transform: scale(1);
  filter: blur(0px);
  opacity: 1;
}
.home #fv .swiper {
  width: 100%;
  height: 100%;
}
.home #fv .swiper .swiper-slide {
  width: 100%;
  height: 100%;
}
.home #fv .swiper-slide .thumb_wrap {
  height: 100%;
  width: 100%;
}
.home #fv .swiper-slide .thumb_wrap .thumb {
  height: 100%;
  width: 100%;
  background-position: center;
  background-size: cover;
}
.home #fv .swiper-slide .thumb_wrap .thumb.sp {
  display: none;
}
.home #fv .kv .iframe_wrap:before{
  content:"";
  position: absolute;
  width: 100%;
  height: 100%;
}
.home #fv .kv .iframe_wrap{width: 100%;height: 100%;overflow: hidden;}
.home #fv .kv iframe{
  z-index: -1;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(1.2);
  width: 178vh;
  height: 56vw;
  min-height: 100%;
  min-width: 100%;
}
.home #concept {
  /* max-width: 720px; */
  /* margin: auto; */
  /* position: sticky; */
  /* padding: 0px 80px; */
}
.home #concept .wrap {
}
.home #concept .read {
  margin-bottom: 60px;
}
.home #concept .read .en {
  /* margin-bottom: 30px; */
  /* letter-spacing: 0.02em; */
  line-height: 1.5;
  margin-bottom: 40px;
  font-size: 34px;
  font-weight: 100;
  /* color: #fff; */
}
.home #concept .read .jp {
  font-weight: normal;
  letter-spacing: 0.05em;
  font-size: 22px;
  /* color: #fff; */
}
.home #concept .read .jp br {
  display: none;
}
.home #concept .text {
  display: flex;
}
.home #concept .text .group {
  /* width: 50%; */
}
.home #concept .text .group.en {
  padding-left: 40px;
  display: none;
}
.home #concept .text .group p {
  margin-bottom: 20px;
  line-height: 2;
  /* font-size: 14px; */
  /* color: #fff; */
}
.home #concept .text .group p:last-child {
  margin-bottom: 0;
}
.home #concept .text .group p br {
  /* display: none; */
}
.home #concept .text .group.en p {
  font-weight: 100;
  font-size: 10px;
}
.home #rooms {
}
.home #rooms .sec_head {
  /* border-top: unset; */
}
.home #rooms .wrap {
  /* padding: 0; */
  /* margin-top: -92px; */
  /* padding: 0 20px; */
  /* margin-bottom: 100px; */
  padding-left: 20px;
  padding-right: 20px;
}
.home #rooms .flex_wrap {
  display: flex;
  align-items: flex-end;
  position: relative;
}
.home #rooms .left {
  /* width: 40%; */
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 0;
  left: 80px;
  margin: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.home #rooms .sec_tit {
  margin-bottom: 20px;
  color: #fff;
}
.home #rooms .common_btn{
  display: flex;
  align-items: center;
}
.home #rooms .common_btn p {
  border-color: #fff;
  color: #fff;
}
.home #rooms .common_btn .arrow-right {
  color: #fff;
}
.home #rooms .common_btn .arrow-right::before {
  border-color: #fff;
}
.home #rooms .right {
  width: 100%;
  border-radius: 4px;
  overflow: hidden;
}
.home #rooms .right .thumb_wrap {
      aspect-ratio: 16 / 9;
  position: relative;
  /* filter: grayscale(1); */
  position: relative;
}
.home #rooms .right .thumb_wrap::before {
}
.home #rooms .right .thumb_wrap .thumb {
  position: absolute;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
}
.home #rooms .right .thumb_wrap .thumb:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #000;
  opacity: 0.3;
  transition:opacity .5s;
}
.home #rooms .right.hover .thumb_wrap .thumb:after {
    opacity: 0;
}
.home #access {
}
.home #access .iframe_wrap {
  position: relative;
  padding-bottom: 50%;
  margin-bottom: 20px;
  border-radius: 4px;
  overflow: hidden;
}
.home #access .iframe_wrap iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  filter: grayscale(1);
}
.home #access p {
  font-size: 14px;
  text-align: center;
}

.home #facility {
}
.home #facility .flex_wrap {
  display: flex;
  align-items: center;
}
.home #facility .flex_wrap .left {
  border-radius: 4px;
  width: 50%;
  /* padding-right: 20%; */
  position: relative;
  border-radius: 4px;
  overflow: hidden;
}
.home #facility .flex_wrap .sec_tit {
  margin-bottom: 30px;
}
.home #facility .flex_wrap .left .link_area {
}
.home #facility .flex_wrap .left .link_area .link {
}
.home #facility .flex_wrap .link_area .link a {
  padding: 30px 0;
  display: block;
  border-top: solid 1px #ebebeb;
  transition: 0.3s;
}
.home #facility .flex_wrap .link_area .link a:hover {
 color: #2a514d;
    opacity: 0.5;
}

.home #facility .flex_wrap .link_area .link:last-child a {
  border-bottom: solid 1px #ebebeb;
}
.home #facility .flex_wrap .right {
  width: 50%;
  padding-left: 12%;
  padding-right: 5%;
}
.home #facility .sp{
  display:none
}
.home #facility .flex_wrap .thumb_wrap {
  aspect-ratio: 1 / 1;
  position: relative;
}
.home #facility .flex_wrap .thumb_wrap #link_img {
  width: 100%;
  height: 100%;
}
.home #facility .flex_wrap .thumb_wrap .thumb {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-position: center;
  background-size: cover;
  opacity: 0;
  transition: opacity 1s;
}
.home #facility .flex_wrap .thumb_wrap .all-day-dining_on {
}
.home #facility .flex_wrap .thumb_wrap .all-day-dining_on .all-day-dining_img {
  opacity: 1;
}
.home #facility .flex_wrap .thumb_wrap .sauna_on .sauna_img {
  opacity: 1;
}
.home #facility .flex_wrap .thumb_wrap .coin-landry_on .coin-landry_img {
  opacity: 1;
}
.home #facility .flex_wrap .thumb_wrap .vendeing-machine_on .vendeing-machine_img {
  opacity: 1;
}
.home #facility .sp-slider{width: 0;height: 0;}
.home #goods {
}

.home #goods .left {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 20px;
}
.home #goods .thumb_wrap {
  width: calc(50% - 4px);
  position: relative;
  padding-bottom: 20%;
  margin-bottom: 8px;
  border-radius: 4px;
  overflow: hidden;
}
.home #goods .thumb_wrap .thumb {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-position: center;
  background-size: cover;
}
.home #goods .sec_tit {
  /* margin-bottom: 20px; */
}

.home #venue {
}
.home #venue .flex_wrap {
  display: flex;
  align-items: center;
}
.home #venue .flex_wrap .left {
  width: 50%;
  /* padding-right: 20%; */
  position: relative;
  border-radius: 4px;
  overflow: hidden;
}
.home #venue .flex_wrap .sec_tit {
  margin-bottom: 30px;
}
.home #venue .flex_wrap .left .link_area {
}
.home #venue .flex_wrap .left .link_area .link {
}
.home #venue .flex_wrap .link_area .link a {
  padding: 30px 0;
  display: block;
  border-top: solid 1px #ebebeb;
}
.home #venue .flex_wrap .link_area .link:last-child a {
  border-bottom: solid 1px #ebebeb;
}
.home #venue .flex_wrap .right {
  width: 50%;
  padding-left: 12%;
  padding-right: 5%;
}
.home #venue .flex_wrap .thumb_wrap {
  aspect-ratio: 1 / 1;
  position: relative;
  /* border-radius: 4px; */
  overflow: hidden;
}
.home #venue .flex_wrap .thumb_wrap .thumb {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-position: center;
  background-size: cover;
}
.home #venue .flex_wrap .text_area p {
  line-height: 1.8;
  margin-bottom: 10px;
}
.home #venue .flex_wrap .text_area p:last-child {
    margin-bottom: 0;
}
.home #information {
}

.home #information .sec_tit {
  margin-bottom: 30px;
}
.home #information ul {
}
.home #information ul li {
}
.home #information ul li a {
  display: flex;
  padding: 40px 0;
  border-top: solid 1px #ebebeb;
  /* border-bottom: solid 1px #ebebeb; */
  transition: 0.5s;
}

.home #information ul li a:hover {color: #2a514d;opacity: 0.5;}
.home #information ul li:last-child a{border-bottom: solid 1px #ebebeb;}
.home #information ul li .date {
  width: 20%;
}
.home #information ul li .week {
  width: 20%;
  text-transform: uppercase;
}
.home #information ul li .tit {
  width: 60%;
  overflow: hidden; /* 溢れた部分を隠す */
  text-overflow: ellipsis; /* 溢れた部分を「...」にする */
  white-space: nowrap; /* 1行で表示 */
}
/* ==================================================================
opanimation
================================================================== */

#fv .layer .layer_img::before {
  transition-duration: 2s;
  transition-timing-function: cubic-bezier(0.4, 0, 0, 0.98);
  transition-property: transform;
}

#fv .layer .layer_img:nth-child(1)::before {
  transition-delay: 3.4s;
}
#fv .layer .layer_img:nth-child(2)::before {
  transition-delay: 3.5s;
}
#fv .layer .layer_img:nth-child(3)::before {
  transition-delay: 3.6s;
}
#fv .layer .layer_img:nth-child(4)::before {
  transition-delay: 3.7s;
}
#fv .layer .layer_img:nth-child(5)::before {
  transition-delay: 3.8s;
}
#fv .layer .layer_img:nth-child(6)::before {
  transition-delay: 3.9s;
}
#fv .layer .layer_img:nth-child(7)::before {
  transition-delay: 4s;
}
#fv .layer .layer_img:nth-child(8)::before {
  transition-delay: 4.1s;
}
@keyframes bg-loop {
  0% {
    background-position-x: calc(0px);
  }
  100% {
    background-position-x: calc(100vw - 40px);
  }
}
#fv .logo {
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-delay: 3.9s;
  transition-property: opacity;
}
#fv .inner {
  /* transition: 2s; */
  /* transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1); */
  /* transition-delay: 4.5s; */
}
#fv .layer {
}

#fv .layer .group {
  transition: 2s;
  transition-property: height;
  transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1);
  transition-delay: 4.5s;
}

.home header {
  /* opacity: 0; */
  /* transition: 1s ease 5s; */
  /* transform: translate(0%, -30%); */
}
.home #fix .logo {
  transform: translate(0%, 30%);
  transition: 1s ease 5s;
  opacity: 0;
}
.home #fix .book-now {
  /* transform: translate(0%, 30%); */
  /* transition: 1s ease 5s; */
  /* opacity: 0; */
}
.onload #fv .inner {
}
.onload #fv .logo:before {
  transform: scaleX(0);
}
.onload #fv .logo:after {
  transform: scaleX(1);
}
.onload #fv .layer .layer_img::before {
  transform: scaleX(0);
}
.onload #fv .logo {
  opacity: 0;
}
.onload header {
  /* opacity: 1; */
  /* transform: translate(0%, 0%); */
}
.onload #fix .logo {
  opacity: 1;
  transform: translate(0%, 0%);
}
.onload #fix .book-now {
  /* opacity: 1; */
  /* transform: translate(0%, 0%); */
}
