

@import url(./common/_variable.css);

/* facilities */
/* ============================================ */



.block__sauna {
  background-image: url(../images/common/bg_dark.jpg);
  padding: 5.208vw 20px;
  @media (width < 896px) {
    padding: 20px 20px 30px;
  }
  .btn_detail {
    padding: 3.125vw 0 0;
    @media (width < 896px) {
      padding: 20px 0 0;
    }
  }
}
.hd_sec_sauna {
  text-align: center;
  font-size: clamp(1.8rem,1.25vw,2.4rem);
}
.block__sauna--column {
  max-width: 1520px;
  margin: auto;
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 4.166vw;
  padding: 3.125vw 0 0;
  @media (width < 480px) {
  }
  .box_img {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    @media (width < 480px) {
      aspect-ratio: 4 / 3;
    }
    img {
      object-fit: cover;
      width: 100%;
      height: 100%;
    }
  }
}


.block__btn {
  padding: 2vw 0 10.416vw;
}



.area__title-third--img {
  img {
    object-position: 90% 50%;
  }
}





.block__slide {
  position: relative;
}
.block__slide--bottom {
  position: absolute;
  bottom: 0px;
  width: 100%;
}
.inner_slide {
  background-color: var(--main_c);
  position: relative;
  width: 100%;
  height: 30vw;
}
.slide_kinpun {
  position: absolute;
  bottom: 0px;
  left: 0%;
  width:40vw; 
}

.slide_box {
  position: relative;
  width: 100%;
  padding: 10.416vw 0;
}

.splide {
  position: relative;
  .splide__track {
    .splide__list {
      .splide__slide {
        width: 100%;
        aspect-ratio: 3 / 2;
        overflow: hidden;
        img {
          object-fit: cover;
          width: 100%;
          height: 100%;
        }
      }
    }
  }
  .splide__pagination {
    position: absolute;
    bottom: -20px;
    left: 0px;
    width: 100%;
    li {
      padding: 0 4px;
      .splide__pagination__page {
        width: 10px;
        height: 10px;
        padding: 0px;
        border-radius: 100%;
        border: none;
        background-color: rgba(255, 255, 255, 0.7);
      }
      .is-active {
        background-color: var(--point_c);
      }
    }
  }
}