@charset "UTF-8";
/* 基本設定
---------------------------------------------------------------------------*/
/* responsive */
/* サイズ */
/* フォント */
/* regular: 400, medium: 500, semibold: 600, bold: 700 */
/* medium: 500, bold: 700, black: 900 */
/* regular: 400, medium: 500, semibold: 600, bold: 700 */
/* regular: 400 */
/* 色 */
/* objectfit */
/* ホバーアクション */
/* 縦書き */
/* 内径 */
main {
  overflow: hidden;
}

/* ------------------------------------------------------------------------*/
/* btn-block
---------------------------------------------------------------------------*/
.btn-block {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 280px;
  height: 56px;
  background-color: #1c2a6a;
  -webkit-transition: opacity 0.6s ease;
  transition: opacity 0.6s ease;
}
@media screen and (max-width: 1300px) {
  .btn-block {
    width: 21.5384615385vw;
    height: 4.3076923077vw;
  }
}
@media screen and (max-width: 480px) {
  .btn-block {
    width: 74.6666666667vw;
    height: 14.9333333333vw;
  }
}
@media (hover: hover) {
  .btn-block:hover {
    opacity: 0.7;
  }
}
.btn-block span {
  font-family: "Zen Old Mincho", serif;
  font-weight: 400;
  font-style: normal;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  font-size: 16px;
  line-height: 32px;
  letter-spacing: 1.28px;
  color: #ffffff;
  text-align: center;
}
@media screen and (max-width: 1300px) {
  .btn-block span {
    font-size: 1.2307692308vw;
    line-height: 2.4615384615vw;
    letter-spacing: 0.0984615385vw;
  }
}
@media screen and (max-width: 480px) {
  .btn-block span {
    font-size: 3.7333333333vw;
    line-height: 7.4666666667vw;
  }
}
.btn-block::after {
  position: absolute;
  content: "";
  right: 8px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 8px;
  height: 8px;
  background: url(../img/top/btn-arrow.png) no-repeat center/contain;
}
@media screen and (max-width: 1300px) {
  .btn-block::after {
    width: 0.6153846154vw;
    height: 0.6153846154vw;
    right: 0.6153846154vw;
  }
}
@media screen and (max-width: 480px) {
  .btn-block::after {
    width: 2.1333333333vw;
    height: 2.1333333333vw;
    right: 2.1333333333vw;
  }
}

/* ------------------------------------------------------------------------*/
/* mv
---------------------------------------------------------------------------*/
.mv {
  position: relative;
}
.mv-bg {
  width: 100%;
}
.mv-bg img {
  width: 100%;
  max-width: 200%;
}
@media screen and (max-width: 480px) {
  .mv-bg img {
    height: 100vh;
    height: 100svh;
  }
}
.mv-logo {
  position: absolute;
  left: 24px;
  top: 24px;
  width: 86px;
}
@media screen and (max-width: 1300px) {
  .mv-logo {
    left: 1.8461538462vw;
    top: 1.8461538462vw;
    width: 6.6153846154vw;
  }
}
@media screen and (max-width: 480px) {
  .mv-logo {
    left: 5.3333333333vw;
    top: 5.3333333333vw;
    width: 22.9333333333vw;
  }
}
.mv-booking-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 6px;
  position: fixed;
  right: 40px;
  top: 40px;
  width: 360px;
  height: 56px;
  background-color: #00a884;
  z-index: 1000;
}
@media screen and (max-width: 1300px) {
  .mv-booking-btn {
    gap: 0.4615384615vw;
    right: 3.0769230769vw;
    top: 3.0769230769vw;
    width: 27.6923076923vw;
    height: 4.3076923077vw;
  }
}
@media screen and (max-width: 480px) {
  .mv-booking-btn {
    width: 100%;
    height: 13.3333333333vw;
    right: 0;
    top: auto;
    bottom: 0;
    gap: 2.6666666667vw;
  }
}
.mv-booking-btn-icon {
  width: 24px;
}
@media screen and (max-width: 1300px) {
  .mv-booking-btn-icon {
    width: 1.8461538462vw;
  }
}
@media screen and (max-width: 480px) {
  .mv-booking-btn-icon {
    width: 6.4vw;
  }
}
.mv-booking-btn-text {
  font-family: "Zen Antique Soft", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 20px;
  line-height: 1.6;
  color: #ffffff;
}
@media screen and (max-width: 1300px) {
  .mv-booking-btn-text {
    font-size: 1.5384615385vw;
  }
}
@media screen and (max-width: 480px) {
  .mv-booking-btn-text {
    font-size: 5.3333333333vw;
  }
}
.mv-catch {
  position: absolute;
  right: 40px;
  bottom: 56px;
}
@media screen and (max-width: 1300px) {
  .mv-catch {
    right: 3.0769230769vw;
    bottom: 4.3076923077vw;
  }
}
@media screen and (max-width: 480px) {
  .mv-catch {
    bottom: 28.2666666667vw;
    right: 0;
    width: 100%;
  }
}
.mv-catch-line {
  font-family: "Zen Antique Soft", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 36px;
  line-height: 1.56;
  letter-spacing: 0.08em;
  color: #ffffff;
  text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.4);
}
@media screen and (max-width: 1300px) {
  .mv-catch-line {
    font-size: 2.7692307692vw;
  }
}
@media screen and (max-width: 480px) {
  .mv-catch-line {
    font-size: 9.6vw;
    padding-left: 5.3333333333vw;
  }
}
.mv-dots {
  position: absolute;
  left: 58px !important;
  bottom: 56px !important;
  z-index: 10;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 10px;
}
@media screen and (max-width: 1300px) {
  .mv-dots {
    left: 4.4615384615vw !important;
    bottom: 4.3076923077vw !important;
    gap: 0.7692307692vw;
  }
}
@media screen and (max-width: 480px) {
  .mv-dots {
    left: 5.3333333333vw !important;
    bottom: 14.9333333333vw !important;
    gap: 2.6666666667vw;
  }
}
.mv-dots .swiper-pagination-bullet {
  position: relative;
  width: 8px;
  height: 8px;
  margin: 0;
  background: var(--w);
  border-radius: 50%;
  cursor: pointer;
  -webkit-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;
          transition-timing-function: ease;
  opacity: 1;
}
@media screen and (max-width: 1300px) {
  .mv-dots .swiper-pagination-bullet {
    width: 0.6153846154vw;
    height: 0.6153846154vw;
  }
}
@media screen and (max-width: 480px) {
  .mv-dots .swiper-pagination-bullet {
    width: 2.1333333333vw;
    height: 2.1333333333vw;
  }
}
.mv-dots .swiper-pagination-bullet-active {
  background: var(--accent-01);
}
.mv-dots .swiper-pagination-bullet-active::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 24px;
  height: 24px;
  border: 1px solid var(--accent-01);
  border-radius: 50%;
  -webkit-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;
          transition-timing-function: ease;
}
@media screen and (max-width: 1300px) {
  .mv-dots .swiper-pagination-bullet-active::after {
    width: 1.8461538462vw;
    height: 1.8461538462vw;
  }
}
@media screen and (max-width: 480px) {
  .mv-dots .swiper-pagination-bullet-active::after {
    width: 6.4vw;
    height: 6.4vw;
  }
}
.mv {
  /* 20260907 スライダー化 */
}
.mv .mvsl {
  position: relative;
  z-index: -1;
}
.mv .mvsl .swiper-slide img {
  width: 100%;
  max-width: 200%;
  height: 100vh;
  height: 100svh;
}
/* ------------------------------------------------------------------------*/
/* concept
---------------------------------------------------------------------------*/
.concept {
  position: relative;
  padding-top: 116px;
  padding-bottom: 271px;
  overflow: hidden;
}
@media screen and (max-width: 1300px) {
  .concept {
    padding-top: 8.9230769231vw;
    padding-bottom: 20.8461538462vw;
  }
}
@media screen and (max-width: 480px) {
  .concept {
    padding-top: 21.3333333333vw;
    padding-bottom: 53.3333333333vw;
    overflow: visible;
  }
}
.concept::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1002px;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background: no-repeat center top/1440px auto;
  background-image: url(../img/top/concept-bg.png);
  background-color: var(--bg);
}
@media screen and (max-width: 1300px) {
  .concept::before {
    background: no-repeat center top/110.7692307692vw auto;
    background-image: url(../img/top/concept-bg.png);
  }
}
@media screen and (max-width: 480px) {
  .concept::before {
    background: no-repeat left top/260vw auto;
    background-image: url(../img/top/concept-bg.png);
  }
}
.concept-head {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 84px;
}
@media screen and (max-width: 1300px) {
  .concept-head {
    gap: 6.4615384615vw;
  }
}
@media screen and (max-width: 480px) {
  .concept-head {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 9.6vw;
  }
}
.concept-head-title {
  font-family: "Birthstone", cursive;
  font-weight: 400;
  font-style: normal;
  font-size: 96px;
  line-height: 1.1;
  color: #b5a169;
}
@media screen and (max-width: 1300px) {
  .concept-head-title {
    font-size: 7.3846153846vw;
  }
}
@media screen and (max-width: 480px) {
  .concept-head-title {
    font-size: 25.6vw;
  }
}
.concept-head-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 28px;
}
@media screen and (max-width: 1300px) {
  .concept-head-body {
    gap: 2.1538461538vw;
  }
}
@media screen and (max-width: 480px) {
  .concept-head-body {
    gap: 7.4666666667vw;
  }
}
.concept-head-catch {
  font-family: "Zen Antique Soft", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 36px;
  line-height: 1.56;
  letter-spacing: 0.08em;
  color: #593305;
}
@media screen and (max-width: 1300px) {
  .concept-head-catch {
    font-size: 2.7692307692vw;
  }
}
@media screen and (max-width: 480px) {
  .concept-head-catch {
    font-size: 9.6vw;
    text-align: center;
  }
}
.concept-head-text {
  font-size: 16px;
  line-height: 2;
  letter-spacing: 0.08em;
  color: #593305;
  width: 580px;
}
@media screen and (max-width: 1300px) {
  .concept-head-text {
    font-size: 1.2307692308vw;
    width: 44.6153846154vw;
  }
}
@media screen and (max-width: 480px) {
  .concept-head-text {
    font-size: 4.2666666667vw;
    width: 100%;
    padding: 0 5.3333333333vw;
  }
}
.concept-head-flower {
  position: absolute;
}
.concept-head-flower--left {
  width: 427px;
  right: calc(50% + 408px);
  top: -87px;
}
@media screen and (max-width: 1300px) {
  .concept-head-flower--left {
    width: 32.8461538462vw;
    right: calc(50% + 31.3846153846vw);
    top: -6.6923076923vw;
  }
}
@media screen and (max-width: 480px) {
  .concept-head-flower--left {
    width: 65.3333333333vw;
    right: auto;
    left: -18.9333333333vw;
    top: -45.8666666667vw;
  }
}
.concept-head-flower--right {
  width: 469px;
  left: calc(50% + 391px);
  top: -141px;
}
@media screen and (max-width: 1300px) {
  .concept-head-flower--right {
    width: 36.0769230769vw;
    left: calc(50% + 30.0769230769vw);
    top: -10.8461538462vw;
  }
}
@media screen and (max-width: 480px) {
  .concept-head-flower--right {
    width: 71.7333333333vw;
    top: -45.8666666667vw;
    right: -23.4666666667vw;
    left: auto;
  }
}
.concept-gallery {
  position: relative;
  overflow: hidden;
  padding-top: 48px;
  padding-bottom: 178px;
}
@media screen and (max-width: 1300px) {
  .concept-gallery {
    padding-top: 3.6923076923vw;
    padding-bottom: 13.6923076923vw;
  }
}
@media screen and (max-width: 480px) {
  .concept-gallery {
    padding-top: 5.8666666667vw;
    padding-bottom: 25.3333333333vw;
  }
}
.concept-gallery-swiper {
  overflow: visible;
}
.concept-gallery-slide {
  width: 440px;
  -webkit-transition: -webkit-transform 0.6s ease;
  transition: -webkit-transform 0.6s ease;
  transition: transform 0.6s ease;
  transition: transform 0.6s ease, -webkit-transform 0.6s ease;
}
@media screen and (max-width: 1300px) {
  .concept-gallery-slide {
    width: 33.8461538462vw;
  }
}
@media screen and (max-width: 480px) {
  .concept-gallery-slide {
    width: 88.8vw;
  }
}
.concept-gallery-slide.is-shifted {
  -webkit-transform: translateY(72px);
          transform: translateY(72px);
}
@media screen and (max-width: 1300px) {
  .concept-gallery-slide.is-shifted {
    -webkit-transform: translateY(5.5384615385vw);
            transform: translateY(5.5384615385vw);
  }
}
@media screen and (max-width: 480px) {
  .concept-gallery-slide.is-shifted {
    -webkit-transform: translateY(14.6666666667vw);
            transform: translateY(14.6666666667vw);
  }
}
.concept-gallery-slide-img {
  width: 400px;
  margin: 0 auto;
}
@media screen and (max-width: 1300px) {
  .concept-gallery-slide-img {
    width: 30.7692307692vw;
  }
}
@media screen and (max-width: 480px) {
  .concept-gallery-slide-img {
    width: 83.4666666667vw;
  }
  .concept-gallery-slide-img img {
    width: 100%;
    height: 83.4666666667vw;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center;
       object-position: center;
    font-family: "object-fit: cover; object-position: center;";
  }
}
.concept-gallery-flower {
  position: absolute;
  z-index: 10;
}
.concept-gallery-flower--leftbottom {
  width: 82px;
  top: 455px;
  right: calc(50% + 581px);
}
@media screen and (max-width: 1300px) {
  .concept-gallery-flower--leftbottom {
    width: 6.3076923077vw;
    top: 35vw;
    right: calc(50% + 44.6923076923vw);
  }
}
@media screen and (max-width: 480px) {
  .concept-gallery-flower--leftbottom {
    display: none;
  }
}
.concept-gallery-flower--centertop {
  width: 70px;
  top: 66px;
  right: calc(50% + 165px);
}
@media screen and (max-width: 1300px) {
  .concept-gallery-flower--centertop {
    width: 5.3846153846vw;
    top: 5.0769230769vw;
    right: calc(50% + 12.6923076923vw);
  }
}
@media screen and (max-width: 480px) {
  .concept-gallery-flower--centertop {
    width: 14.4vw;
    top: 9.6vw;
    right: auto;
    left: 5.3333333333vw;
  }
}
.concept-gallery-flower--centerbottom {
  width: 139px;
  top: 495px;
  left: calc(50% + 147px);
}
@media screen and (max-width: 1300px) {
  .concept-gallery-flower--centerbottom {
    width: 10.6923076923vw;
    top: 38.0769230769vw;
    left: calc(50% + 11.3076923077vw);
  }
}
@media screen and (max-width: 480px) {
  .concept-gallery-flower--centerbottom {
    width: 18.6666666667vw;
    top: 93.0666666667vw;
    left: auto;
    right: 2.6666666667vw;
  }
}
.concept-gallery-flower--righttop {
  width: 114px;
  top: 0;
  left: calc(50% + 185px);
}
@media screen and (max-width: 1300px) {
  .concept-gallery-flower--righttop {
    width: 8.7692307692vw;
    left: calc(50% + 14.2307692308vw);
  }
}
@media screen and (max-width: 480px) {
  .concept-gallery-flower--righttop {
    display: none;
  }
}
.concept-gallery-flower--rightbottom {
  width: 104px;
  top: 502px;
  left: calc(50% + 612px);
}
@media screen and (max-width: 1300px) {
  .concept-gallery-flower--rightbottom {
    width: 8vw;
    top: 38.6153846154vw;
    left: calc(50% + 47.0769230769vw);
  }
}
@media screen and (max-width: 480px) {
  .concept-gallery-flower--rightbottom {
    display: none;
  }
}
.concept-sunset {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: -1;
}
.concept-sunset img {
  width: 100%;
  max-width: 200%;
}

@media screen and (max-width: 480px) {
  .mv2concept-wrap {
    overflow: hidden;
  }
}
/* ------------------------------------------------------------------------*/
/* 共通
---------------------------------------------------------------------------*/
.hdl {
  position: relative;
  text-align: center;
  margin-bottom: 10px;
}
@media screen and (max-width: 1300px) {
  .hdl {
    margin-bottom: 0.7692307692vw;
  }
}
@media screen and (max-width: 480px) {
  .hdl {
    margin-bottom: 0;
  }
}
.hdl-title {
  font-family: "Birthstone", cursive;
  font-weight: 400;
  font-style: normal;
  font-size: 96px;
  line-height: 1.36;
  color: #b5a169;
}
@media screen and (max-width: 1300px) {
  .hdl-title {
    font-size: 7.3846153846vw;
  }
}
@media screen and (max-width: 480px) {
  .hdl-title {
    font-size: 25.6vw;
  }
}
.hdl-flower {
  position: absolute;
  width: 157px;
  top: 110px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 10;
}
@media screen and (max-width: 1300px) {
  .hdl-flower {
    width: 12.0769230769vw;
    top: 8.4615384615vw;
  }
}
@media screen and (max-width: 480px) {
  .hdl-flower {
    width: 41.8666666667vw;
    top: 27.4666666667vw;
  }
}

/* ------------------------------------------------------------------------*/
/* room
---------------------------------------------------------------------------*/
.room {
  padding-top: 58px;
  margin-bottom: 96px;
  background: no-repeat center top/100% auto;
  background-image: -webkit-image-set(url("../img/top/cnts-bg.avif") type("image/avif") 1x, url("../img/top/cnts-bg@2x.avif") type("image/avif") 2x, url("../img/top/cnts-bg.webp") type("image/webp") 1x, url("../img/top/cnts-bg@2x.webp") type("image/webp") 2x);
  background-image: image-set(url("../img/top/cnts-bg.avif") type("image/avif") 1x, url("../img/top/cnts-bg@2x.avif") type("image/avif") 2x, url("../img/top/cnts-bg.webp") type("image/webp") 1x, url("../img/top/cnts-bg@2x.webp") type("image/webp") 2x);
}
@media screen and (max-width: 1300px) {
  .room {
    padding-top: 4.4615384615vw;
    margin-bottom: 7.3846153846vw;
  }
}
@media screen and (max-width: 480px) {
  .room {
    padding-top: 17.0666666667vw;
    margin-bottom: 21.3333333333vw;
  }
}
.room-visual {
  position: relative;
}
.room-visual img {
  width: 100%;
  height: 420px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  font-family: "object-fit: cover; object-position: center;";
}
@media screen and (max-width: 1300px) {
  .room-visual img {
    height: 32.3076923077vw;
  }
}
@media screen and (max-width: 480px) {
  .room-visual img {
    height: 144vw;
  }
}
.room-visual-text {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  bottom: 40px;
  width: 100%;
  max-width: 1280px;
  text-align: center;
}
@media screen and (max-width: 1300px) {
  .room-visual-text {
    max-width: 98.4615384615vw;
    bottom: 3.0769230769vw;
  }
}
@media screen and (max-width: 480px) {
  .room-visual-text {
    width: 100%;
    max-width: 100vw;
    padding: 0 5.3333333333vw;
    bottom: 10.6666666667vw;
  }
}
.room-visual-text-line {
  font-size: 16px;
  line-height: 2;
  letter-spacing: 0.08em;
  color: #ffffff;
}
@media screen and (max-width: 1300px) {
  .room-visual-text-line {
    font-size: 1.2307692308vw;
  }
}
@media screen and (max-width: 480px) {
  .room-visual-text-line {
    font-size: 4.2666666667vw;
  }
}
.room-type {
  text-align: center;
  padding-top: 79px;
  padding-bottom: 96px;
  background-image: url(../img/top/room-type-bg.png);
  background-size: 100% auto;
  background-position: center bottom;
  background-repeat: no-repeat;
}
@media screen and (max-width: 1300px) {
  .room-type {
    padding-top: 6.0769230769vw;
    padding-bottom: 7.3846153846vw;
  }
}
@media screen and (max-width: 480px) {
  .room-type {
    padding-top: 17.0666666667vw;
    padding-bottom: 17.0666666667vw;
    background-size: cover;
    background-image: url(../img/top/room-type-bg-sp.png);
  }
}
.room-type-title {
  font-family: "Zen Antique Soft", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 20px;
  line-height: 32px;
  letter-spacing: 1.6px;
  color: #fdf9ed;
}
@media screen and (max-width: 1300px) {
  .room-type-title {
    font-size: 1.5384615385vw;
    line-height: 2.4615384615vw;
    letter-spacing: 0.1230769231vw;
  }
}
@media screen and (max-width: 480px) {
  .room-type-title {
    font-size: 5.3333333333vw;
    line-height: 8.5333333333vw;
    letter-spacing: 0.4266666667vw;
  }
}
.room-slider {
  position: relative;
  margin-top: 32px;
  overflow: visible;
}
@media screen and (max-width: 1300px) {
  .room-slider {
    margin-top: 2.4615384615vw;
  }
}
@media screen and (max-width: 480px) {
  .room-slider {
    margin-top: 8.5333333333vw;
  }
}
.room-slider .swiper-wrapper {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.room-slider .swiper-slide {
  width: auto;
  height: auto;
}
.room-slider-inner {
  display: inline-block;
  padding: 0 32px;
}
@media screen and (max-width: 1300px) {
  .room-slider-inner {
    padding: 0 2.4615384615vw;
  }
}
@media screen and (max-width: 480px) {
  .room-slider-inner {
    padding: 0 2.6666666667vw;
  }
}
@media (hover: hover) {
  .room-slider-inner:hover .hov {
    opacity: 1;
  }
}
.room-slider-image {
  position: relative;
}
.room-slider-image > img {
  display: block;
  width: 430px;
  height: auto;
  -webkit-transform: scale(1);
          transform: scale(1);
  opacity: 0.7;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
@media screen and (max-width: 1300px) {
  .room-slider-image > img {
    width: 33.0769230769vw;
  }
}
@media screen and (max-width: 480px) {
  .room-slider-image > img {
    width: 83.4666666667vw;
  }
}
.room-slider-image .hov {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  inset: 0;
  opacity: 0;
  background-color: rgba(239, 143, 9, 0.8);
  -webkit-transition: opacity 0.6s ease;
  transition: opacity 0.6s ease;
}
.room-slider-image .hov img {
  width: 144px;
}
@media screen and (max-width: 1300px) {
  .room-slider-image .hov img {
    width: 11.0769230769vw;
  }
}
@media screen and (max-width: 480px) {
  .room-slider-image .hov img {
    width: 38.4vw;
  }
}
.room-slider .swiper-slide-active .room-slider-image > img {
  position: relative;
  z-index: 2;
  -webkit-transform: scale(1.4884);
          transform: scale(1.4884);
  opacity: 1;
  -webkit-filter: drop-shadow(24px 24px 32px rgba(35, 56, 67, 0.45));
          filter: drop-shadow(24px 24px 32px rgba(35, 56, 67, 0.45));
}
@media screen and (max-width: 480px) {
  .room-slider .swiper-slide-active .room-slider-image > img {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
.room-slider .swiper-slide-active .hov {
  -webkit-transform: scale(1.4884);
          transform: scale(1.4884);
  z-index: 20;
}
@media screen and (max-width: 480px) {
  .room-slider .swiper-slide-active .hov {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
.room-slider .swiper-slide-active .hov img {
  -webkit-transform: scale(0.6719);
          transform: scale(0.6719);
}
@media screen and (max-width: 480px) {
  .room-slider .swiper-slide-active .hov img {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
.room-slider-flower {
  position: absolute;
  top: 50%;
  pointer-events: none;
  z-index: 3;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
@media screen and (max-width: 480px) {
  .room-slider-flower {
    display: none;
  }
}
.room-slider-flower--01 {
  left: calc(50% - 296px);
  top: calc(50% - 337px);
  width: 129px;
  height: 129px;
}
@media screen and (max-width: 1300px) {
  .room-slider-flower--01 {
    left: calc(50% - 22.7692307692vw);
    top: calc(50% - 25.9230769231vw);
    width: 9.9230769231vw;
    height: 9.9230769231vw;
  }
}
.room-slider-flower--02 {
  left: calc(50% + 285px);
  top: calc(50% + 100px);
  width: 134px;
  height: 134px;
}
@media screen and (max-width: 1300px) {
  .room-slider-flower--02 {
    left: calc(50% + 21.9230769231vw);
    top: calc(50% + 7.6923076923vw);
    width: 10.3076923077vw;
    height: 10.3076923077vw;
  }
}
.room-slide-label {
  position: relative;
  font-family: "Zen Antique Soft", serif;
  font-weight: 400;
  font-style: normal;
  margin-top: 24px;
  font-size: 20px;
  line-height: 1;
  letter-spacing: 1.6px;
  color: #fdf9ed;
  text-align: center;
  opacity: 0.7;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
  z-index: 10;
}
@media screen and (max-width: 1300px) {
  .room-slide-label {
    margin-top: 1.8461538462vw;
    font-size: 1.5384615385vw;
    line-height: 2.4615384615vw;
    letter-spacing: 0.1230769231vw;
  }
}
@media screen and (max-width: 480px) {
  .room-slide-label {
    margin-top: 4.2666666667vw;
    font-size: 4.2666666667vw;
    line-height: 7.4666666667vw;
    letter-spacing: 0.32vw;
  }
}
.swiper-slide-active .room-slide-label {
  opacity: 1;
  -webkit-transform: translateY(78px);
          transform: translateY(78px);
}
@media screen and (max-width: 1300px) {
  .swiper-slide-active .room-slide-label {
    -webkit-transform: translateY(6vw);
            transform: translateY(6vw);
  }
}
@media screen and (max-width: 480px) {
  .swiper-slide-active .room-slide-label {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
.room .swiper-button-prev,
.room .swiper-button-next {
  top: 29%;
  width: 65px;
  height: 111px;
  margin-top: 0;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.room .swiper-button-prev::after,
.room .swiper-button-next::after {
  display: none;
}
.room .swiper-button-prev,
.room .swiper-button-next {
  content: none;
}
@media screen and (max-width: 1300px) {
  .room .swiper-button-prev,
  .room .swiper-button-next {
    width: 5vw;
    height: 8.5384615385vw;
  }
}
@media screen and (max-width: 480px) {
  .room .swiper-button-prev,
  .room .swiper-button-next {
    width: 8.5333333333vw;
    height: 14.6666666667vw;
    top: 37%;
  }
}
.room .swiper-button-prev {
  left: calc(50% - 352px);
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background-image: url(../img/top/room-prev.png);
}
@media screen and (max-width: 1300px) {
  .room .swiper-button-prev {
    left: calc(50% - 27.0769230769vw);
  }
}
@media screen and (max-width: 480px) {
  .room .swiper-button-prev {
    left: 8px;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
}
.room .swiper-button-next {
  right: calc(50% - 352px);
  -webkit-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
  background-image: url(../img/top/room-next.png);
}
@media screen and (max-width: 1300px) {
  .room .swiper-button-next {
    right: calc(50% - 27.0769230769vw);
  }
}
@media screen and (max-width: 480px) {
  .room .swiper-button-next {
    right: 8px;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
}
.room-pagination {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 16px;
  margin-top: 150px;
}
@media screen and (max-width: 1300px) {
  .room-pagination {
    gap: 1.2307692308vw;
    margin-top: 11.5384615385vw;
  }
}
@media screen and (max-width: 480px) {
  .room-pagination {
    gap: 2.1333333333vw;
    margin-top: 4.2666666667vw;
  }
}
.room-pagination-bullet {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid #fdf9ed;
  font-family: "Cardo", serif;
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 0.6px;
  color: #fdf9ed;
  cursor: pointer;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
@media screen and (max-width: 1300px) {
  .room-pagination-bullet {
    width: 3.0769230769vw;
    height: 3.0769230769vw;
    font-size: 1.5384615385vw;
    letter-spacing: 0.0461538462vw;
  }
}
@media screen and (max-width: 480px) {
  .room-pagination-bullet {
    width: 7.4666666667vw;
    height: 7.4666666667vw;
    font-size: 3.7333333333vw;
  }
}
.room-pagination-bullet.is-active {
  border-color: #fdf9ed;
  background-color: #fdf9ed;
  color: #7ac2e5;
}
.room .btn-block {
  margin: 56px auto 0;
}
@media screen and (max-width: 1300px) {
  .room .btn-block {
    margin: 4.3076923077vw auto 0;
  }
}
@media screen and (max-width: 480px) {
  .room .btn-block {
    margin: 14.9333333333vw auto 0;
  }
}

/* ------------------------------------------------------------------------*/
/* cuisine
---------------------------------------------------------------------------*/
.cuisine {
  padding-bottom: 120px;
  background-image: url(../img/top/cuisine-bg.jpg);
  background-size: 100% auto;
  background-position: right bottom;
  background-repeat: no-repeat;
}
@media screen and (max-width: 1300px) {
  .cuisine {
    padding-bottom: 9.2307692308vw;
  }
}
.cuisine-visual img {
  width: 100%;
  height: 420px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  font-family: "object-fit: cover; object-position: center;";
}
@media screen and (max-width: 1300px) {
  .cuisine-visual img {
    height: 32.3076923077vw;
  }
}
@media screen and (max-width: 480px) {
  .cuisine-visual img {
    height: 74.6666666667vw;
  }
}
.cuisine-body {
  position: relative;
  max-width: 1280px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 44px;
  padding-bottom: 96px;
  gap: 56px;
}
@media screen and (max-width: 1300px) {
  .cuisine-body {
    width: 98.4615384615vw;
    gap: 4.3076923077vw;
    padding-top: 3.3846153846vw;
    padding-bottom: 7.3846153846vw;
  }
}
@media screen and (max-width: 480px) {
  .cuisine-body {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 14.9333333333vw;
    width: 100%;
    padding: 14.9333333333vw 5.3333333333vw 0;
  }
}
.cuisine-body::before {
  content: "";
  position: absolute;
  width: 100vw;
  height: 760px;
  background: no-repeat center top/100% auto;
  background-image: -webkit-image-set(url("../img/top/cnts-bg.avif") type("image/avif") 1x, url("../img/top/cnts-bg@2x.avif") type("image/avif") 2x, url("../img/top/cnts-bg.webp") type("image/webp") 1x, url("../img/top/cnts-bg@2x.webp") type("image/webp") 2x);
  background-image: image-set(url("../img/top/cnts-bg.avif") type("image/avif") 1x, url("../img/top/cnts-bg@2x.avif") type("image/avif") 2x, url("../img/top/cnts-bg.webp") type("image/webp") 1x, url("../img/top/cnts-bg@2x.webp") type("image/webp") 2x);
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  top: 0;
  z-index: -1;
}
@media screen and (max-width: 1300px) {
  .cuisine-body::before {
    height: 58.4615384615vw;
  }
}
@media screen and (max-width: 480px) {
  .cuisine-body::before {
    background: no-repeat center top/100% auto;
    background-image: -webkit-image-set(url("../img/top/cnts-bg-sp.avif") type("image/avif") 1x, url("../img/top/cnts-bg-sp@2x.avif") type("image/avif") 2x, url("../img/top/cnts-bg-sp.webp") type("image/webp") 1x, url("../img/top/cnts-bg-sp@2x.webp") type("image/webp") 2x);
    background-image: image-set(url("../img/top/cnts-bg-sp.avif") type("image/avif") 1x, url("../img/top/cnts-bg-sp@2x.avif") type("image/avif") 2x, url("../img/top/cnts-bg-sp.webp") type("image/webp") 1x, url("../img/top/cnts-bg-sp@2x.webp") type("image/webp") 2x);
    height: 202.6666666667vw;
  }
}
.cuisine-body-text {
  width: 440px;
  font-size: 16px;
  line-height: 2;
  letter-spacing: 0.08em;
  color: #593305;
  padding-top: 56px;
}
@media screen and (max-width: 1300px) {
  .cuisine-body-text {
    width: 33.8461538462vw;
    font-size: 1.2307692308vw;
    padding-top: 4.3076923077vw;
  }
}
@media screen and (max-width: 480px) {
  .cuisine-body-text {
    width: 100%;
    font-size: 4.2666666667vw;
    padding-top: 0;
  }
}
.cuisine-body-imgs {
  width: 784px;
}
@media screen and (max-width: 1300px) {
  .cuisine-body-imgs {
    width: 60.2307692308vw;
  }
}
@media screen and (max-width: 480px) {
  .cuisine-body-imgs {
    width: 100%;
  }
}
.cuisine-body-img {
  width: 824px;
  margin-left: 0;
  margin-right: -40px;
}
@media screen and (max-width: 1300px) {
  .cuisine-body-img {
    width: 63.3846153846vw;
    margin-right: -3.0769230769vw;
  }
}
@media screen and (max-width: 480px) {
  .cuisine-body-img {
    width: 100%;
    margin-right: 0;
  }
}
.cuisine-slider {
  margin-top: -160px;
}
@media screen and (max-width: 1300px) {
  .cuisine-slider {
    margin-top: -12.3076923077vw;
  }
}
@media screen and (max-width: 480px) {
  .cuisine-slider {
    margin-top: 4.2666666667vw;
  }
}
.cuisine-slider .swiper-slide {
  width: 432px;
  -webkit-transition: -webkit-transform 0.6s ease;
  transition: -webkit-transform 0.6s ease;
  transition: transform 0.6s ease;
  transition: transform 0.6s ease, -webkit-transform 0.6s ease;
}
@media screen and (max-width: 1300px) {
  .cuisine-slider .swiper-slide {
    width: 33.2307692308vw;
  }
}
@media screen and (max-width: 480px) {
  .cuisine-slider .swiper-slide {
    width: 88.8vw;
  }
}
.cuisine-slider .swiper-slide.is-shifted {
  -webkit-transform: translateY(40px);
          transform: translateY(40px);
}
@media screen and (max-width: 1300px) {
  .cuisine-slider .swiper-slide.is-shifted {
    -webkit-transform: translateY(3.0769230769vw);
            transform: translateY(3.0769230769vw);
  }
}
@media screen and (max-width: 480px) {
  .cuisine-slider .swiper-slide.is-shifted {
    -webkit-transform: translateY(-14.9333333333vw);
            transform: translateY(-14.9333333333vw);
  }
}
.cuisine-slider-img {
  width: 400px;
  margin: 0 auto;
}
@media screen and (max-width: 1300px) {
  .cuisine-slider-img {
    width: 30.7692307692vw;
  }
}
@media screen and (max-width: 480px) {
  .cuisine-slider-img {
    width: 83.4666666667vw;
  }
}
.cuisine .btn-block {
  margin: 96px auto 0;
}
@media screen and (max-width: 1300px) {
  .cuisine .btn-block {
    margin: 7.3846153846vw auto 0;
  }
}
@media screen and (max-width: 480px) {
  .cuisine .btn-block {
    margin: 14.9333333333vw auto 0;
  }
}

/* ------------------------------------------------------------------------*/
/* bath
---------------------------------------------------------------------------*/
.bath {
  padding-bottom: 120px;
  background-image: url(../img/top/bath-bg.jpg);
  background-size: 100% auto;
  background-position: center bottom;
  background-repeat: no-repeat;
  margin-bottom: 96px;
}
@media screen and (max-width: 1300px) {
  .bath {
    padding-bottom: 9.2307692308vw;
    margin-bottom: 7.3846153846vw;
  }
}
@media screen and (max-width: 480px) {
  .bath {
    padding-bottom: 21.3333333333vw;
    margin-bottom: 21.3333333333vw;
    background-image: url(../img/top/bath-bg-sp.jpg);
  }
}
.bath-visual {
  margin-bottom: 56px;
}
@media screen and (max-width: 1300px) {
  .bath-visual {
    margin-bottom: 4.3076923077vw;
  }
}
@media screen and (max-width: 480px) {
  .bath-visual {
    margin-bottom: 14.9333333333vw;
  }
}
.bath-visual img {
  width: 100%;
  height: 420px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  font-family: "object-fit: cover; object-position: center;";
}
@media screen and (max-width: 1300px) {
  .bath-visual img {
    height: 32.3076923077vw;
  }
}
@media screen and (max-width: 480px) {
  .bath-visual img {
    height: 74.6666666667vw;
  }
}
.bath-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  width: 1280px;
  margin: 0 auto 56px;
  gap: 56px;
}
@media screen and (max-width: 1300px) {
  .bath-body {
    width: 98.4615384615vw;
    gap: 4.3076923077vw;
    margin-bottom: 4.3076923077vw;
  }
}
@media screen and (max-width: 480px) {
  .bath-body {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 14.9333333333vw;
    margin-bottom: 42.6666666667vw;
    width: 100%;
    padding: 0 5.3333333333vw;
  }
}
.bath-text {
  width: 423px;
  padding-top: 136px;
}
@media screen and (max-width: 1300px) {
  .bath-text {
    width: 32.5384615385vw;
    padding-top: 10.4615384615vw;
  }
}
@media screen and (max-width: 480px) {
  .bath-text {
    width: 100%;
    padding-top: 0;
  }
}
.bath-text p {
  width: 463px;
  margin-left: 0;
  margin-right: -40px;
  font-size: 16px;
  line-height: 2;
  letter-spacing: 0.08em;
  color: #593305;
}
@media screen and (max-width: 1300px) {
  .bath-text p {
    width: 35.6153846154vw;
    margin-right: -3.0769230769vw;
    font-size: 1.2307692308vw;
  }
}
@media screen and (max-width: 480px) {
  .bath-text p {
    width: 100%;
    margin-right: 0;
    font-size: 4.2666666667vw;
  }
}
.bath-img {
  width: 800px;
}
@media screen and (max-width: 1300px) {
  .bath-img {
    width: 61.5384615385vw;
  }
}
@media screen and (max-width: 480px) {
  .bath-img {
    width: 100%;
  }
}
.bath-img > div {
  width: 880px;
  margin-left: -80px;
  margin-right: 0;
}
@media screen and (max-width: 1300px) {
  .bath-img > div {
    width: 67.6923076923vw;
    margin-left: -6.1538461538vw;
  }
}
@media screen and (max-width: 480px) {
  .bath-img > div {
    width: 100%;
    margin-left: 0;
  }
}
.bath-images {
  position: relative;
  width: 1280px;
  margin: 0 auto;
  height: 400px;
}
@media screen and (max-width: 1300px) {
  .bath-images {
    width: 98.4615384615vw;
    height: 30.7692307692vw;
  }
}
@media screen and (max-width: 480px) {
  .bath-images {
    width: 100%;
    height: auto;
  }
}
.bath-images li {
  position: absolute;
}
.bath-images li:nth-of-type(1) {
  width: 432px;
  top: -196px;
  right: -40px;
}
@media screen and (max-width: 1300px) {
  .bath-images li:nth-of-type(1) {
    width: 33.2307692308vw;
    top: -15.0769230769vw;
    right: -3.0769230769vw;
  }
}
@media screen and (max-width: 480px) {
  .bath-images li:nth-of-type(1) {
    width: 64vw;
    top: -38.4vw;
    right: 0;
  }
}
.bath-images li:nth-of-type(2) {
  width: 745px;
  top: 0;
  left: 86px;
}
@media screen and (max-width: 1300px) {
  .bath-images li:nth-of-type(2) {
    width: 57.3076923077vw;
    left: 6.6153846154vw;
  }
}
@media screen and (max-width: 480px) {
  .bath-images li:nth-of-type(2) {
    width: 64vw;
    left: 5.3333333333vw;
  }
}
.bath .btn-block {
  margin: 80px auto 0;
}
@media screen and (max-width: 1300px) {
  .bath .btn-block {
    margin: 6.1538461538vw auto 0;
  }
}
@media screen and (max-width: 480px) {
  .bath .btn-block {
    margin: 100.2666666667vw auto 0;
  }
}

/* ------------------------------------------------------------------------*/
/* facilities
---------------------------------------------------------------------------*/
.facilities {
  position: relative;
  padding-bottom: 120px;
}
@media screen and (max-width: 1300px) {
  .facilities {
    padding-bottom: 9.2307692308vw;
  }
}
@media screen and (max-width: 480px) {
  .facilities {
    padding-bottom: 21.3333333333vw;
  }
}
.facilities::before {
  position: absolute;
  content: "";
  width: 740px;
  height: 1010px;
  mix-blend-mode: color-burn;
  background-image: url(../img/top/facilities-bg.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  left: 0;
  bottom: -610px;
}
@media screen and (max-width: 1300px) {
  .facilities::before {
    width: 56.9230769231vw;
    height: 77.6923076923vw;
    bottom: -46.9230769231vw;
  }
}
@media screen and (max-width: 480px) {
  .facilities::before {
    width: 100vw;
    height: 141.3333333333vw;
    bottom: -42vw;
  }
}
.facilities-slider {
  position: relative;
  margin-top: 126px;
}
@media screen and (max-width: 1300px) {
  .facilities-slider {
    margin-top: 9.6923076923vw;
  }
}
@media screen and (max-width: 480px) {
  .facilities-slider {
    margin-top: 18.6666666667vw;
  }
}
.facilities-slider .swiper-slide {
  width: 496px;
}
@media screen and (max-width: 1300px) {
  .facilities-slider .swiper-slide {
    width: 38.1538461538vw;
  }
}
@media screen and (max-width: 480px) {
  .facilities-slider .swiper-slide {
    width: 88.8vw;
  }
}
.facilities-slider .swiper-slide p {
  font-size: 20px;
  line-height: 1;
  font-weight: 700;
  text-align: center;
  letter-spacing: 0.08em;
  color: #593305;
  margin-top: 24px;
}
@media screen and (max-width: 1300px) {
  .facilities-slider .swiper-slide p {
    margin-top: 1.8461538462vw;
    font-size: 1.5384615385vw;
  }
}
@media screen and (max-width: 480px) {
  .facilities-slider .swiper-slide p {
    margin-top: 6.4vw;
    font-size: 5.3333333333vw;
  }
}
.facilities-slider-link {
  display: block;
}
@media (hover: hover) {
  .facilities-slider-link:hover .hov {
    opacity: 1;
  }
}
.facilities-slider-img {
  position: relative;
  width: 432px;
  margin: 0 auto;
}
@media screen and (max-width: 1300px) {
  .facilities-slider-img {
    width: 33.2307692308vw;
  }
}
@media screen and (max-width: 480px) {
  .facilities-slider-img {
    width: 83.4666666667vw;
  }
}
.facilities-slider-img .hov {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  inset: 0;
  opacity: 0;
  background-color: rgba(89, 51, 5, 0.7);
  -webkit-transition: opacity 0.6s ease;
  transition: opacity 0.6s ease;
}
.facilities-slider-img .hov img {
  width: 144px;
}
@media screen and (max-width: 1300px) {
  .facilities-slider-img .hov img {
    width: 11.0769230769vw;
  }
}
@media screen and (max-width: 480px) {
  .facilities-slider-img .hov img {
    width: 38.4vw;
  }
}
.facilities-pagination {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 10px;
  left: auto !important;
  bottom: auto !important;
  margin-top: 64px;
}
@media screen and (max-width: 1300px) {
  .facilities-pagination {
    gap: 0.7692307692vw;
    margin-top: 4.9230769231vw;
  }
}
@media screen and (max-width: 480px) {
  .facilities-pagination {
    gap: 2.6666666667vw;
    margin-top: 14.9333333333vw;
  }
}
.facilities-pagination .swiper-pagination-bullet {
  position: relative;
  width: 8px;
  height: 8px;
  margin: 0;
  background: #1c2a6a;
  border-radius: 50%;
  cursor: pointer;
  -webkit-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;
          transition-timing-function: ease;
  opacity: 1;
}
@media screen and (max-width: 1300px) {
  .facilities-pagination .swiper-pagination-bullet {
    width: 0.6153846154vw;
    height: 0.6153846154vw;
  }
}
@media screen and (max-width: 480px) {
  .facilities-pagination .swiper-pagination-bullet {
    width: 2.1333333333vw;
    height: 2.1333333333vw;
  }
}
.facilities-pagination .swiper-pagination-bullet-active {
  background: var(--accent-01);
}
.facilities-pagination .swiper-pagination-bullet-active::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 24px;
  height: 24px;
  border: 1px solid var(--accent-01);
  border-radius: 50%;
  -webkit-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;
          transition-timing-function: ease;
}
@media screen and (max-width: 1300px) {
  .facilities-pagination .swiper-pagination-bullet-active::after {
    width: 1.8461538462vw;
    height: 1.8461538462vw;
  }
}
@media screen and (max-width: 480px) {
  .facilities-pagination .swiper-pagination-bullet-active::after {
    width: 6.4vw;
    height: 6.4vw;
  }
}
.facilities .swiper-button-prev,
.facilities .swiper-button-next {
  top: 173px;
  width: 65px;
  height: 111px;
  margin-top: 0;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.facilities .swiper-button-prev::after,
.facilities .swiper-button-next::after {
  content: none;
}
@media screen and (max-width: 1300px) {
  .facilities .swiper-button-prev,
  .facilities .swiper-button-next {
    width: 5vw;
    height: 8.5384615385vw;
  }
}
@media screen and (max-width: 480px) {
  .facilities .swiper-button-prev,
  .facilities .swiper-button-next {
    width: 8.5333333333vw;
    height: 14.6666666667vw;
  }
}
.facilities .swiper-button-prev {
  left: calc(50% - 630px);
  background-image: url(../img/top/room-prev.png);
}
@media screen and (max-width: 1300px) {
  .facilities .swiper-button-prev {
    left: calc(50% - 48.4615384615vw);
  }
}
@media screen and (max-width: 480px) {
  .facilities .swiper-button-prev {
    left: 8px;
  }
}
.facilities .swiper-button-next {
  right: calc(50% - 630px);
  background-image: url(../img/top/room-next.png);
}
@media screen and (max-width: 1300px) {
  .facilities .swiper-button-next {
    right: calc(50% - 48.4615384615vw);
  }
}
@media screen and (max-width: 480px) {
  .facilities .swiper-button-next {
    right: 8px;
  }
}
.facilities .btn-block {
  margin: 64px auto 0;
}
@media screen and (max-width: 1300px) {
  .facilities .btn-block {
    margin: 4.9230769231vw auto 0;
  }
}
@media screen and (max-width: 480px) {
  .facilities .btn-block {
    margin: 14.9333333333vw auto 0;
  }
}

/* ------------------------------------------------------------------------*/
/* access
---------------------------------------------------------------------------*/
.access {
  position: relative;
  /* 1300 */
  max-width: 1300px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1300px) {
  .access {
    width: 100vw;
  }
}
@media screen and (max-width: 480px) {
  .access {
    width: 94.6666666667vw;
  }
}
.access {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 56px;
  padding-bottom: 120px;
}
@media screen and (max-width: 1300px) {
  .access {
    gap: 4.3076923077vw;
    padding-bottom: 9.2307692308vw;
  }
}
@media screen and (max-width: 480px) {
  .access {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 10.6666666667vw;
    padding-bottom: 0;
  }
}
.access::before {
  content: "";
  position: absolute;
  width: 100vw;
  height: 760px;
  background: no-repeat center top/100% auto;
  background-image: -webkit-image-set(url("../img/top/cnts-bg.avif") type("image/avif") 1x, url("../img/top/cnts-bg@2x.avif") type("image/avif") 2x, url("../img/top/cnts-bg.webp") type("image/webp") 1x, url("../img/top/cnts-bg@2x.webp") type("image/webp") 2x);
  background-image: image-set(url("../img/top/cnts-bg.avif") type("image/avif") 1x, url("../img/top/cnts-bg@2x.avif") type("image/avif") 2x, url("../img/top/cnts-bg.webp") type("image/webp") 1x, url("../img/top/cnts-bg@2x.webp") type("image/webp") 2x);
  left: 50%;
  -webkit-transform: translate(-50%);
          transform: translate(-50%);
  top: 216px;
  z-index: -1;
}
@media screen and (max-width: 1300px) {
  .access::before {
    height: 58.4615384615vw;
    top: 16.6153846154vw;
  }
}
@media screen and (max-width: 480px) {
  .access::before {
    height: 202.6666666667vw;
    top: 34.6666666667vw;
    background: no-repeat center top/100% auto;
    background-image: -webkit-image-set(url("../img/top/cnts-bg-sp.avif") type("image/avif") 1x, url("../img/top/cnts-bg-sp@2x.avif") type("image/avif") 2x, url("../img/top/cnts-bg-sp.webp") type("image/webp") 1x, url("../img/top/cnts-bg-sp@2x.webp") type("image/webp") 2x);
    background-image: image-set(url("../img/top/cnts-bg-sp.avif") type("image/avif") 1x, url("../img/top/cnts-bg-sp@2x.avif") type("image/avif") 2x, url("../img/top/cnts-bg-sp.webp") type("image/webp") 1x, url("../img/top/cnts-bg-sp@2x.webp") type("image/webp") 2x);
  }
}
.access-body {
  width: 464px;
}
@media screen and (max-width: 1300px) {
  .access-body {
    width: 35.6923076923vw;
  }
}
@media screen and (max-width: 480px) {
  .access-body {
    width: 100%;
  }
}
.access-text {
  padding-top: 58px;
}
@media screen and (max-width: 1300px) {
  .access-text {
    padding-top: 4.4615384615vw;
  }
}
@media screen and (max-width: 480px) {
  .access-text {
    padding-top: 14.1333333333vw;
  }
}
.access-text-line {
  font-size: 16px;
  line-height: 2;
  letter-spacing: 0.08em;
  color: #593305;
}
@media screen and (max-width: 1300px) {
  .access-text-line {
    font-size: 1.2307692308vw;
  }
}
@media screen and (max-width: 480px) {
  .access-text-line {
    font-size: 4.2666666667vw;
  }
}
.access-map {
  width: 840px;
}
@media screen and (max-width: 1300px) {
  .access-map {
    width: 64.6153846154vw;
  }
}
@media screen and (max-width: 480px) {
  .access-map {
    width: 100%;
  }
}
.access-map iframe {
  display: block;
  width: calc(50vw + 160px);
  height: 480px;
}
@media screen and (max-width: 1300px) {
  .access-map iframe {
    width: 62.3076923077vw;
    height: 36.9230769231vw;
  }
}
@media screen and (max-width: 480px) {
  .access-map iframe {
    width: 100%;
    height: 74.6666666667vw;
  }
}
.access-btn {
  display: none;
}
@media screen and (max-width: 480px) {
  .access-btn {
    display: block;
    color: #fff;
    margin-top: 8.5333333333vw;
  }
}
.access-btn-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
  font-size: 5.3333333333vw;
  font-family: "Zen Antique Soft", serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.08em;
  background-color: #b5a169;
  width: 100%;
  height: 14.9333333333vw;
}
.access-btn-link::after {
  content: "";
  position: absolute;
  width: 2.1333333333vw;
  height: 2.1333333333vw;
  border-radius: 100vmax;
  background: #fdf9ed;
  right: 6.4vw;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.access .btn-block {
  margin: 56px 0 0;
}
@media screen and (max-width: 1300px) {
  .access .btn-block {
    margin: 4.3076923077vw 0 0;
  }
}
@media screen and (max-width: 480px) {
  .access .btn-block {
    margin: 14.9333333333vw 0 0;
  }
}

/* ------------------------------------------------------------------------*/
/* sightseeing
---------------------------------------------------------------------------*/
.sightseeing {
  padding-bottom: 96px;
  background-image: url(../img/top/sightseeing-bg.jpg);
  background-size: 740px auto;
  background-repeat: no-repeat;
  background-position: right bottom;
}
@media screen and (max-width: 1300px) {
  .sightseeing {
    padding-bottom: 7.3846153846vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing {
    padding-top: 21.3333333333vw;
    padding-bottom: 21.3333333333vw;
    background-position: right top;
    background-size: 100vw auto;
  }
}
.sightseeing-body {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  gap: 80px;
}
@media screen and (max-width: 1300px) {
  .sightseeing-body {
    max-width: 98.4615384615vw;
    gap: 6.1538461538vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing-body {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 100%;
    padding: 0 5.3333333333vw;
    gap: 14.9333333333vw;
  }
}
.sightseeing-images {
  position: relative;
  width: 777px;
}
@media screen and (max-width: 1300px) {
  .sightseeing-images {
    width: 59.7692307692vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing-images {
    width: 100%;
  }
}
.sightseeing-images > div {
  margin-right: 0;
  padding-bottom: 10px;
  width: calc(50vw + 137px);
  margin-left: calc(640px - 50vw);
  overflow: hidden;
}
@media screen and (max-width: 1300px) {
  .sightseeing-images > div {
    width: 60.5384615385vw;
    margin-left: -0.7692307692vw;
    padding-bottom: 0.7692307692vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing-images > div {
    width: 100%;
    margin-left: 0;
    padding-bottom: 0;
    overflow: visible;
  }
}
.sightseeing-text {
  width: 423px;
}
@media screen and (max-width: 1300px) {
  .sightseeing-text {
    width: 32.5384615385vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing-text {
    width: 100%;
  }
}
.sightseeing-text-line {
  margin-top: 120px;
  font-size: 16px;
  line-height: 2;
  letter-spacing: 0.08em;
  color: #593305;
}
@media screen and (max-width: 1300px) {
  .sightseeing-text-line {
    font-size: 1.2307692308vw;
    margin-top: 9.2307692308vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing-text-line {
    margin-top: 16vw;
    font-size: 4.2666666667vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing-text .btn-block {
    display: none;
  }
}
.sightseeing .btn-block {
  margin-top: 56px;
}
@media screen and (max-width: 1300px) {
  .sightseeing .btn-block {
    margin-top: 4.3076923077vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing .btn-block {
    margin: 14.9333333333vw auto 0;
  }
}
.sightseeing-slider .swiper-slide {
  width: 448px;
}
@media screen and (max-width: 1300px) {
  .sightseeing-slider .swiper-slide {
    width: 34.4615384615vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing-slider .swiper-slide {
    width: 88.8vw;
  }
}
.sightseeing-slider-wrap {
  display: block;
  position: relative;
  margin-left: auto;
  margin-right: 0;
  width: 424px;
}
@media screen and (max-width: 1300px) {
  .sightseeing-slider-wrap {
    width: 32.6153846154vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing-slider-wrap {
    width: 83.4666666667vw;
    margin: 0 auto;
  }
}
.sightseeing-slider-genre {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  left: 0;
  top: 24px;
  width: 150px;
  height: 32px;
  font-size: 16px;
  line-height: 100%;
  color: #ffffff;
}
@media screen and (max-width: 1300px) {
  .sightseeing-slider-genre {
    top: 1.8461538462vw;
    width: 11.5384615385vw;
    height: 2.4615384615vw;
    font-size: 1.2307692308vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing-slider-genre {
    top: 6.4vw;
    width: 40vw;
    height: 8.5333333333vw;
    font-size: 4.2666666667vw;
  }
}
.sightseeing-slider-genre.neary {
  background-color: #ef8f09;
}
.sightseeing-slider-genre.widearea {
  background-color: #b5a169;
}
.sightseeing-slider-name {
  position: absolute;
  font-size: 20px;
  letter-spacing: 0.08em;
  font-weight: 700;
  left: 1em;
  bottom: 0.8em;
  color: #ffffff;
}
@media screen and (max-width: 1300px) {
  .sightseeing-slider-name {
    font-size: 1.5384615385vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing-slider-name {
    font-size: 5.3333333333vw;
  }
}
.sightseeing-pagination {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  gap: 10px;
  left: auto !important;
  bottom: auto !important;
  margin-top: 32px;
  padding-right: 10px;
}
@media screen and (max-width: 1300px) {
  .sightseeing-pagination {
    gap: 0.7692307692vw;
    margin-top: 2.4615384615vw;
    padding-right: 0.7692307692vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing-pagination {
    margin-top: 8.5333333333vw;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding-right: 0;
    gap: 2.6666666667vw;
    margin-top: 12.8vw;
  }
}
.sightseeing-pagination .swiper-pagination-bullet {
  position: relative;
  width: 8px;
  height: 8px;
  margin: 0;
  background: #1c2a6a;
  border-radius: 50%;
  cursor: pointer;
  -webkit-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;
          transition-timing-function: ease;
  opacity: 1;
}
@media screen and (max-width: 1300px) {
  .sightseeing-pagination .swiper-pagination-bullet {
    width: 0.6153846154vw;
    height: 0.6153846154vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing-pagination .swiper-pagination-bullet {
    width: 2.1333333333vw;
    height: 2.1333333333vw;
  }
}
.sightseeing-pagination .swiper-pagination-bullet-active {
  background: var(--accent-01);
}
.sightseeing-pagination .swiper-pagination-bullet-active::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 24px;
  height: 24px;
  border: 1px solid var(--accent-01);
  border-radius: 50%;
  -webkit-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;
          transition-timing-function: ease;
}
@media screen and (max-width: 1300px) {
  .sightseeing-pagination .swiper-pagination-bullet-active::after {
    width: 1.8461538462vw;
    height: 1.8461538462vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing-pagination .swiper-pagination-bullet-active::after {
    width: 6.4vw;
    height: 6.4vw;
  }
}
.sightseeing .swiper-button-prev,
.sightseeing .swiper-button-next {
  top: 173px;
  width: 65px;
  height: 111px;
  margin-top: 0;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.sightseeing .swiper-button-prev::after,
.sightseeing .swiper-button-next::after {
  content: none;
}
@media screen and (max-width: 1300px) {
  .sightseeing .swiper-button-prev,
  .sightseeing .swiper-button-next {
    width: 5vw;
    height: 8.5384615385vw;
    top: 13.3076923077vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing .swiper-button-prev,
  .sightseeing .swiper-button-next {
    width: 8.5333333333vw;
    height: 14.6666666667vw;
    top: 36vw;
  }
}
.sightseeing .swiper-button-prev {
  left: -40px;
  background-image: url(../img/top/room-prev.png);
}
@media screen and (max-width: 1300px) {
  .sightseeing .swiper-button-prev {
    left: -3.0769230769vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing .swiper-button-prev {
    left: -2.1333333333vw;
  }
}
.sightseeing .swiper-button-next {
  right: -40px;
  background-image: url(../img/top/room-next.png);
}
@media screen and (max-width: 1300px) {
  .sightseeing .swiper-button-next {
    right: -3.0769230769vw;
  }
}
@media screen and (max-width: 480px) {
  .sightseeing .swiper-button-next {
    right: -2.1333333333vw;
  }
}

/* ------------------------------------------------------------------------*/
/* news
---------------------------------------------------------------------------*/
.top-news {
  padding: 120px 0;
}
@media screen and (max-width: 1300px) {
  .top-news {
    padding: 9.2307692308vw 0;
  }
}
@media screen and (max-width: 480px) {
  .top-news {
    padding: 21.3333333333vw 0;
  }
}
.top-news-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 1080px;
  margin: 0 auto;
  color: #593305;
}
@media screen and (max-width: 1300px) {
  .top-news-wrap {
    width: 83.0769230769vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-wrap {
    display: block;
    width: 89.3333333333vw;
  }
}
.top-news-hd {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 206px;
  margin-right: 50px;
  border-right: 1px solid #b5a169;
}
@media screen and (max-width: 1300px) {
  .top-news-hd {
    width: 15.8461538462vw;
    margin-right: 3.8461538462vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-hd {
    position: relative;
    width: 100%;
    margin-right: 0;
    padding-bottom: 7.2vw;
    border-right: none;
    border-bottom: 1px solid #b5a169;
  }
}
.top-news-en {
  font-family: "Cardo", serif;
  font-size: 32px;
  line-height: 1;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 1300px) {
  .top-news-en {
    font-size: 2.4615384615vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-en {
    font-size: 7.4666666667vw;
  }
}
.top-news-ja {
  margin-top: 12px;
  font-family: "Zen Old Mincho", serif;
  font-size: 14px;
  letter-spacing: 0.12em;
}
@media screen and (max-width: 1300px) {
  .top-news-ja {
    margin-top: 0.9230769231vw;
    font-size: 1.0769230769vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-ja {
    margin-top: 2.1333333333vw;
    font-size: 3.4666666667vw;
  }
}
.top-news-btn {
  width: 160px;
  margin-top: 76px;
}
@media screen and (max-width: 1300px) {
  .top-news-btn {
    width: 12.3076923077vw;
    margin-top: 5.8461538462vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-btn {
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    width: 37.8666666667vw;
    margin-top: 0;
  }
}
.top-news-btn a {
  width: 100%;
}
.top-news-bd {
  position: relative;
  width: 824px;
  height: 336px;
}
@media screen and (max-width: 1300px) {
  .top-news-bd {
    width: 63.3846153846vw;
    height: 25.8461538462vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-bd {
    width: 76.8vw;
    height: auto;
    margin: 8.5333333333vw auto 0;
  }
}
.top-news-sl {
  position: absolute;
  top: 0;
  left: 0;
  width: calc(50vw + 284px);
  height: 100%;
  overflow: hidden;
}
@media screen and (max-width: 1300px) {
  .top-news-sl {
    width: calc(50vw + 21.8461538462vw);
  }
}
@media screen and (max-width: 480px) {
  .top-news-sl {
    position: relative;
    width: 100%;
    height: auto;
    overflow: visible;
    padding-bottom: 15.4666666667vw;
  }
}
.top-news-sl .swiper-slide {
  width: 288px;
}
@media screen and (max-width: 1300px) {
  .top-news-sl .swiper-slide {
    width: 22.1538461538vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-sl .swiper-slide {
    width: 76.8vw;
  }
}
.top-news-sl .swiper-slide a {
  display: block;
  width: 248px;
}
@media screen and (max-width: 1300px) {
  .top-news-sl .swiper-slide a {
    width: 19.0769230769vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-sl .swiper-slide a {
    width: 66.1333333333vw;
    margin: 0 auto;
  }
}
.top-news-sl .swiper-slide a:hover .top-news-sl-ttl {
  color: #b5a169;
  text-decoration: underline;
}
.top-news-sl-img {
  margin-bottom: 20px;
}
@media screen and (max-width: 1300px) {
  .top-news-sl-img {
    margin-bottom: 1.5384615385vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-sl-img {
    margin-bottom: 5.0666666667vw;
  }
}
.top-news-sl-img img {
  display: block;
  width: 100%;
  height: 160px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media screen and (max-width: 1300px) {
  .top-news-sl-img img {
    height: 12.3076923077vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-sl-img img {
    height: 41.8666666667vw;
  }
}
.top-news-sl-tx {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.top-news-sl-date {
  font-family: "Cardo", serif;
  font-size: 13px;
  letter-spacing: 0.2em;
}
@media screen and (max-width: 1300px) {
  .top-news-sl-date {
    font-size: 1vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-sl-date {
    font-size: 3.4666666667vw;
  }
}
.top-news-sl-cat {
  min-width: 96px;
  height: 20px;
  padding: 0 8px;
  border-radius: 10px;
  background: #b5a169;
  text-align: center;
}
@media screen and (max-width: 1300px) {
  .top-news-sl-cat {
    min-width: 7.3846153846vw;
    height: 1.5384615385vw;
    padding: 0 0.6153846154vw;
    border-radius: 0.7692307692vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-sl-cat {
    min-width: 25.6vw;
    height: 5.3333333333vw;
    padding: 0 2.1333333333vw;
    border-radius: 2.6666666667vw;
  }
}
.top-news-sl-cat span {
  display: block;
  font-size: 12px;
  line-height: 20px;
  letter-spacing: 0.12em;
  color: #fff;
}
@media screen and (max-width: 1300px) {
  .top-news-sl-cat span {
    font-size: 0.9230769231vw;
    line-height: 1.5384615385vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-sl-cat span {
    font-size: 3.2vw;
    line-height: 5.3333333333vw;
  }
}
.top-news-sl-ttl {
  display: -webkit-box;
  width: 100%;
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.7;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
@media screen and (max-width: 1300px) {
  .top-news-sl-ttl {
    margin-top: 0.7692307692vw;
    font-size: 1.0769230769vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-sl-ttl {
    margin-top: 2.6666666667vw;
    font-size: 3.7333333333vw;
  }
}
.top-news-sl-ft {
  position: absolute;
  bottom: 0;
  left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (max-width: 480px) {
  .top-news-sl-ft {
    width: 100%;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
.top-news-arw {
  position: relative;
  width: 32px;
  height: 32px;
  cursor: pointer;
}
@media screen and (max-width: 1300px) {
  .top-news-arw {
    width: 2.4615384615vw;
    height: 2.4615384615vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-arw {
    width: 8.5333333333vw;
    height: 8.5333333333vw;
  }
}
.top-news-arw::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  border-top: 1px solid #b5a169;
  border-right: 1px solid #b5a169;
}
.top-news-arw-prev::after {
  -webkit-transform: translate(-30%, -50%) rotate(-135deg);
          transform: translate(-30%, -50%) rotate(-135deg);
}
.top-news-arw-next::after {
  -webkit-transform: translate(-70%, -50%) rotate(45deg);
          transform: translate(-70%, -50%) rotate(45deg);
}
.top-news-fraction {
  margin: 0 16px;
  font-family: "Cardo", serif;
  font-size: 14px;
  letter-spacing: 0.15em;
  text-align: center;
}
@media screen and (max-width: 1300px) {
  .top-news-fraction {
    margin: 0 1.2307692308vw;
    font-size: 1.0769230769vw;
  }
}
@media screen and (max-width: 480px) {
  .top-news-fraction {
    margin: 0 4.2666666667vw;
    font-size: 3.7333333333vw;
  }
}