@charset "utf-8";

/*----------------------------
common
----------------------------*/
html {
  /* scroll-behavior: smooth; */
  overflow-x: hidden;
}

body {
  counter-reset: number 0;
  color: #000;
  position: relative;
  background-color: #F4F4F4;
  /* overflow-x: hidden; */
  scroll-snap-type: y mandatory;
}

main {
  padding-bottom: clamp(100px, 75.728px + 6.472vw, 200px);
}

.no-scroll {
  overflow: hidden;
}

a {
  color: #000;
  text-decoration: none;
  transition: ease-in .2s;

  &:hover {
    transition: ease-in .2s;
  }
}

picture {
  display: block;

  img {
    width: 100%;
  }
}

/* .container {
  width: calc(1536px + 4%);
  margin: auto;
  padding: 0 2%;

  @media (max-width: 1600px) {
    width: 100%;
    padding: 0 10%;
  }

  @media (max-width: 767px) {
    width: 100%;
    padding: 0 5%;
  }
}

.container_m {
  width: calc(1200px + 4%);
  margin: auto;
  padding: 0 2%;

  @media (max-width: 1300px) {
    width: 100%;
    padding: 0 5%;
  }
}

.container_s {
  width: calc(980px + 4%);
  margin: auto;
  padding: 0 2%;

  @media (max-width: 1100px) {
    width: 100%;
    padding: 0 10%;
  }

  @media (max-width: 767px) {
    padding: 0 5%;
  }
} */
.container_m {
  max-width: 1200px;
  width: 84%;
  margin: auto;
}

.container_s {
  max-width: 960px;
  width: 84%;
  margin: auto;
}

.pc {
  display: block;

  @media (max-width: 767px) {
    display: none;
  }
}

.sp {
  display: none;

  @media (max-width: 767px) {
    display: block;
  }
}

.swiper_area {
  position: relative;
}

.swiper {
  ul {
    list-style: none;
    margin: 0;
    padding: 0;
  }
}

img {
  max-width: 100%;
}

/*----------------------------
animation
----------------------------*/
/*--- タイトルフェードup ---*/
.fadeup_mask {
  overflow: hidden;

  .mask_inner {
    display: block;
    transform: translateY(100%);
    opacity: 0;
    transition: transform 1s, opacity 1s;
    transition-timing-function: cubic-bezier(.165, .84, .44, 1);

    &.scroll-in {
      transform: translateY(0);
      opacity: 1;
    }
  }
}

/*--- 画像パララックス ---*/
.prlx_target {
  overflow: hidden;
  position: relative;
  z-index: 0;

  .prlx_img {
    width: 77%;
    transform-origin: left center;
    position: relative;
    z-index: 0;
  }
}

/*--- 画像出現エフェクト ---*/
.img_effect {
  position: relative;
  overflow: hidden;
  display: inline-block;

  img {
    display: block;
    opacity: 0;
    transition: opacity 0ms 450ms;
  }

  &::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #2E434A;
    transform: translateX(-100%);
    z-index: 2;
  }

  &.is-animated {
    img {
      opacity: 1;
      transition: opacity 0.3s 1s;
    }

    &::after {
      animation: mask-left 1.2s cubic-bezier(0.8, 0, 0.170, 1) forwards;
    }
  }
}

@keyframes mask-left {
  0% {
    transform: translateX(-101%);
  }

  40%,
  60% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(101%);
  }
}

/*--- セクションフェードイン ---*/
.fadein {
  opacity: 0;
  transform: translateY(50px);
  transition: all 0.8s ease;

  &.visible {
    opacity: 1;
    transform: translateY(0);
  }
}

/*----------------------------
パンくず
----------------------------*/
.breadcrumb {
  max-width: 1200px;
  width: 84%;
  margin: clamp(20px, 10.291px + 2.589vw, 60px) auto clamp(50px, 37.864px + 3.236vw, 100px);

  .breadcrumb_list {
    font-size: clamp(0.625rem, 0.537rem + 0.38vw, 0.875rem);
    display: flex;
    align-items: center;
    margin: auto;
    padding: 0;
    flex-wrap: wrap;
    list-style: none;

    .breadcrumb_item {
      display: flex;
      align-items: center;

      &>a,
      &>span {
        color: #7B6023;
      }

      &+.breadcrumb_item {
        &::before {
          content: "";
          width: 6px;
          height: 6px;
          border: 0;
          border-top: solid 1px #7B6023;
          border-right: solid 1px #7B6023;
          transform: rotate(45deg);
          margin: 0 10px;
        }
      }
    }
  }
}

/*----------------------------
デザインテンプレート
----------------------------*/
/*--- レイアウトA ---*/
.layout_a {
  .header_img {
    position: relative;

    &>.ttl {
      position: absolute;
      top: 45%;
      left: 50%;
      transform: translate(-50%, 50%);
      max-width: 1200px;
      width: 84%;
      color: #fff;
      margin: 0;
      padding-left: 50px;
      font-weight: 500;
      font-size: clamp(22px, 17.631px + 1.165vw, 40px);
      letter-spacing: 0.1em;

      @media (max-width: 1000px) {
        padding-left: 30px;
      }
    }

    .nav_container {
      position: absolute;
      top: 0;
      left: 0;
    }
  }

  /* main {
    background: url("../img/page-title__layout-a_obj.svg") top left / 33.02vw no-repeat;

    @media (max-width: 767px) {
      background-size: 62.13vw;
    }
  } */
  .breadcrumb {
    margin: 0 auto clamp(80px, 60.583px + 5.178vw, 160px);
  }

  .page_ttl {
    font-weight: 500;
    font-size: clamp(22px, 17.631px + 1.165vw, 40px);
    max-width: 1200px;
    width: 84%;
    margin: clamp(60px, 38.155px + 5.825vw, 150px) auto clamp(20px, 10.291px + 2.589vw, 60px);
  }

  /* サイドバーありのとき */
  /* .main_aside_wrapper {
    position: relative;

    main {
      background: none;

      &::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
        background: url("../img/page-title__layout-a_obj.svg") top left / contain no-repeat;
        width: 33.02vw;
        height: 23.91vw;
        display: block;
      }

      @media (max-width: 767px) {
        &::before {
          top: 8vw;
          width: 62.13vw;
          height: 45.07vw;
        }
      }
    }
  } */
  /* ハンバーガーメニューが開いているとき */
  header.active {
    &+.page_title {
      .nav_container {
        display: none;
      }
    }
  }
}

/*--- レイアウトB ---*/
.layout_b {
  .page_title {
    background: url("../img/page-title__layout-a_obj.svg") top left / 33.02vw no-repeat;
    padding-top: clamp(160px, 130.874px + 7.767vw, 280px);
    margin-bottom: clamp(80px, 63.010px + 4.531vw, 150px);

    @media (max-width: 767px) {
      background-size: 230px;
    }

    &>.ttl {
      font-weight: 500;
      font-size: clamp(22px, 17.631px + 1.165vw, 40px);
      letter-spacing: 0.1em;
      max-width: 1200px;
      width: 84%;
      margin: 0 auto clamp(20px, 10.291px + 2.589vw, 60px);
    }

    /* .img {
      max-width: calc(100% - ((100% - 1200px) / 2));
      width: 95%;
      margin-left: auto;
      aspect-ratio: 1560 / 380;

      @media (max-width: 767px) {
        width: 86%;
        aspect-ratio: 325 / 120;
      }
    } */
  }

  /* サイドバーありのとき */
  .main_aside_wrapper {
    &::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      z-index: 1;
      background: url("../img/page-title__layout-a_obj.svg") top left / contain no-repeat;
      width: 33.02vw;
      height: 23.91vw;
      display: block;
    }

    @media (max-width: 767px) {
      &::before {
        top: 8vw;
        width: 62.13vw;
        height: 45.07vw;
      }
    }

    .page_title {
      background: none;
    }
  }
}

/*--- レイアウトC ---*/
.layout_c {
  main {
    background: url("../img/page-title__layout-a_obj.svg") top left / 33.02vw no-repeat;
    padding-top: clamp(140px, 93.883px + 12.298vw, 330px);

    @media (max-width: 767px) {
      background-size: 62.13vw;
    }
  }
}

/*--- レイアウトD ---*/
.layout_d {
  .header_img {
    margin-top: 80px;

    @media (max-width: 767px) {
      margin-top: 54px;
    }
  }

  .page_ttl {
    font-weight: 500;
    font-size: clamp(22px, 17.631px + 1.165vw, 40px);
    max-width: 1200px;
    width: 84%;
    margin: clamp(60px, 38.155px + 5.825vw, 150px) auto 0;
  }
}

/*--- レイアウトE ---*/
.layout_e {
  .page_title {
    background: url("../img/page-title__layout-a_obj.svg") top left / 33.02vw no-repeat;
    padding-top: clamp(160px, 130.874px + 7.767vw, 280px);
    margin-bottom: clamp(80px, 63.010px + 4.531vw, 150px);

    @media (max-width: 767px) {
      background-size: 230px;
    }

    &>.ttl {
      font-weight: 500;
      font-size: clamp(22px, 17.631px + 1.165vw, 40px);
      letter-spacing: 0.1em;
      max-width: 1200px;
      width: 84%;
      margin: 0 auto clamp(20px, 10.291px + 2.589vw, 60px);
    }

    /* .img {
      max-width: calc(100% - ((100% - 1200px) / 2));
      width: 95%;
      margin-left: auto;
      aspect-ratio: 1560 / 380;

      @media (max-width: 767px) {
        width: 86%;
        aspect-ratio: 325 / 120;
      }
    } */
  }

  /* サイドバーありのとき */
  .main_aside_wrapper {
    &::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      z-index: 1;
      background: url("../img/page-title__layout-a_obj.svg") top left / contain no-repeat;
      width: 33.02vw;
      height: 23.91vw;
      display: block;
    }

    @media (max-width: 767px) {
      &::before {
        top: 8vw;
        width: 62.13vw;
        height: 45.07vw;
      }
    }

    .page_title {
      background: none;
    }
  }
}

/*----------------------------
サイドバーがあるページ
----------------------------*/
.main_aside_wrapper {
  display: flex;

  /* オーバーレイ */
  .modal_overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease;
    z-index: 998;

    &.active {
      opacity: 1;
      visibility: visible;
    }
  }

  /* SP用indexボタン */
  .btn_index {
    display: none;
    flex-direction: column;
    gap: 2px;
    justify-content: center;
    align-items: center;
    font-family: var(--font-noto-sans);
    font-size: 9px;
    position: fixed;
    right: 0;
    bottom: 52px;
    z-index: 998;
    background-color: rgba(255, 255, 255, 0.8);
    width: 46px;
    height: 46px;
    border: none;

    @media (max-width: 1000px) {
      display: flex;
    }

    &::before {
      content: "";
      background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17.451' height='12' viewBox='0 0 17.451 12'%3E%3Cg id='グループ_1327' data-name='グループ 1327' transform='translate(-331.5 -718)'%3E%3Cpath id='線_346' data-name='線 346' d='M2.287,1H0V-1H2.287Z' transform='translate(331.5 719)' fill='%232e434a'/%3E%3Cpath id='線_351' data-name='線 351' d='M13.451,1H0V-1H13.451Z' transform='translate(335.5 719)' fill='%232e434a'/%3E%3Cpath id='線_347' data-name='線 347' d='M2.287,1H0V-1H2.287Z' transform='translate(331.5 724)' fill='%232e434a'/%3E%3Cpath id='線_350' data-name='線 350' d='M13.451,1H0V-1H13.451Z' transform='translate(335.5 724)' fill='%232e434a'/%3E%3Cpath id='線_348' data-name='線 348' d='M2.287,1H0V-1H2.287Z' transform='translate(331.5 729)' fill='%232e434a'/%3E%3Cpath id='線_349' data-name='線 349' d='M13.451,1H0V-1H13.451Z' transform='translate(335.5 729)' fill='%232e434a'/%3E%3C/g%3E%3C/svg%3E%0A") center center / contain no-repeat;
      width: 18px;
      height: 12px;
      display: block;
    }
  }

  main {
    flex: 1;

    @media (max-width: 1000px) {
      width: 100%;
    }
  }

  /* サイドバー */
  aside {
    width: 270px;
    background-color: #EFEFEF;
    position: sticky;
    top: 0;
    height: 100svh;
    padding: 60px 40px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;

    @media (max-width: 1000px) {
      position: fixed;
      top: inherit;
      left: 8%;
      bottom: 0;
      width: 84%;
      max-height: 65vh;
      height: fit-content;
      padding: 40px 30px;
      z-index: 999;
      opacity: 0;
      transform: translateY(30px);
      pointer-events: none;
      transition: opacity 0.3s ease, transform 0.3s ease;

      &.active {
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto;
      }
    }

    /* 閉じるボタン */
    .aside_close {
      display: none;
      border: none;
      position: absolute;
      top: 15px;
      right: 15px;
      background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16.828' height='16.828' viewBox='0 0 16.828 16.828'%3E%3Cg id='グループ_884' data-name='グループ 884' transform='translate(-1353.086 -251.086)'%3E%3Cline id='線_269' data-name='線 269' x2='14' y2='14' transform='translate(1354.5 252.5)' fill='none' stroke='%23a28c5b' stroke-linecap='round' stroke-width='2'/%3E%3Cline id='線_270' data-name='線 270' x1='14' y2='14' transform='translate(1354.5 252.5)' fill='none' stroke='%23a28c5b' stroke-linecap='round' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E%0A") center center / contain no-repeat;
      width: 14px;
      height: 14px;

      @media (max-width: 1000px) {
        display: block;
      }
    }

    .aside_ttl {
      font-size: 14px;
      color: #7B6023;
      margin: 0 0 15px;

      @media (max-width: 1000px) {
        font-size: 18px;
        text-align: center;
        margin-bottom: 35px;
      }
    }

    .aside_list {
      list-style: none;
      margin: 0;
      padding: 0;

      @media (max-width: 1000px) {
        overflow-y: scroll;
      }

      .aside_item {
        padding-left: 15px;
        position: relative;

        @media (max-width: 1000px) {
          padding-left: 0;
        }

        &::before {
          content: "";
          position: absolute;
          top: 8px;
          left: 0;
          width: 8px;
          height: 8px;
          display: inline-block;
          background-color: #A28C5B;
          border-radius: 50%;
          opacity: 0;
          transition: opacity 0.2s ease-in;
        }

        a {
          font-size: clamp(14px, 13.515px + 0.129vw, 16px);
          display: block;

          @media (max-width: 1000px) {
            padding: 15px 0;
            border-bottom: 1px #DCD7C9 solid;
          }

          small {
            display: inline-block;
          }
        }

        &+.aside_item {
          margin-top: 10px;

          @media (max-width: 1000px) {
            margin-top: 0;
          }
        }

        &.current {
          &::before {
            opacity: 1;

            @media (max-width: 1000px) {
              display: none;
            }
          }
        }
      }
    }
  }
}

/*----------------------------
btn
----------------------------*/
.btn_more {
  a {
    font-size: clamp(16px, 13.816px + 0.583vw, 25px);
    background-color: #2E434A;
    color: #fff;
    display: block;
    margin: auto;
    padding: 12px 60px;
    width: fit-content;
    position: relative;

    @media (max-width: 767px) {
      padding: 10px 25px;
    }

    &::after {
      content: "";
      position: absolute;
      top: 50%;
      right: 20px;
      transform: translateY(-50%);
      background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12.865' height='12.869' viewBox='0 0 12.865 12.869'%3E%3Cg id='グループ_844' data-name='グループ 844' transform='translate(-1098.521 -1365.5)'%3E%3Cpath id='パス_202' data-name='パス 202' d='M18718.025-8545.984l12-12' transform='translate(-17619.15 9924)' fill='none' stroke='%23fff' stroke-width='1'/%3E%3Cpath id='パス_203' data-name='パス 203' d='M18737.934-8587h10v10' transform='translate(-17637.047 9953)' fill='none' stroke='%23fff' stroke-width='1'/%3E%3C/g%3E%3C/svg%3E%0A") center center / contain no-repeat;
      display: block;
      width: 12px;
      height: 12px;
      transition: ease-in .2s;
    }

    @media (max-width: 767px) {
      &::after {
        width: 9px;
        height: 9px;
        right: 15px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9.854' height='9.855' viewBox='0 0 9.854 9.855'%3E%3Cg id='グループ_1075' data-name='グループ 1075' transform='translate(0.354 0.501)'%3E%3Cpath id='パス_202' data-name='パス 202' d='M18718.025-8548.982l9-9' transform='translate(-18718.025 8557.984)' fill='none' stroke='%23fff' stroke-width='1'/%3E%3Cpath id='パス_203' data-name='パス 203' d='M18737.934-8587h8.271v8.271' transform='translate(-18737.205 8587)' fill='none' stroke='%23fff' stroke-width='1'/%3E%3C/g%3E%3C/svg%3E%0A");
      }
    }

    &:hover {
      background-color: #366372;

      &::after {
        right: 15px;
      }
    }
  }
}

.btn_more2 {
  background: linear-gradient(0deg, rgba(227, 216, 185, 1) 0%, rgba(175, 155, 118, 1) 100%);
  padding: 3px;

  a {
    font-size: clamp(14px, 12.544px + 0.388vw, 20px);
    background-color: #2E434A;
    color: #fff;
    display: block;
    padding: 10px 60px;
    width: 100%;
    position: relative;
    text-align: center;

    @media (max-width: 767px) {
      padding: 10px 40px;
    }

    &::after {
      content: "";
      position: absolute;
      top: 50%;
      right: 13px;
      transform: translateY(-50%);
      background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12.865' height='12.869' viewBox='0 0 12.865 12.869'%3E%3Cg id='グループ_844' data-name='グループ 844' transform='translate(-1098.521 -1365.5)'%3E%3Cpath id='パス_202' data-name='パス 202' d='M18718.025-8545.984l12-12' transform='translate(-17619.15 9924)' fill='none' stroke='%23fff' stroke-width='1'/%3E%3Cpath id='パス_203' data-name='パス 203' d='M18737.934-8587h10v10' transform='translate(-17637.047 9953)' fill='none' stroke='%23fff' stroke-width='1'/%3E%3C/g%3E%3C/svg%3E%0A") center center / contain no-repeat;
      display: block;
      width: clamp(8px, 6.786px + 0.324vw, 13px);
      height: clamp(8px, 6.786px + 0.324vw, 13px);
      transition: ease-in .2s;
    }

    &:hover {
      background-color: #366372;
    }
  }
}

/*----------------------------
list
----------------------------*/
.list_diamond {
  list-style: none;
  margin: 0;
  padding: 0;

  &>li {
    position: relative;
    font-size: clamp(14px, 13.029px + 0.259vw, 18px);
    padding-left: 25px;

    @media (max-width: 767px) {
      padding-left: 15px;
    }

    &::before {
      content: "◆";
      font-size: 14px;
      color: #A28C5B;
      position: absolute;
      left: 0;
      top: 1px;
    }

    @media (max-width: 767px) {
      &::before {
        font-size: 9px;
        top: 4px;
      }
    }

    &+li {
      margin-top: 10px;
    }
  }
}

.list_check {
  list-style: none;
  margin: 0;
  padding: 0;

  &>li {
    position: relative;
    font-size: clamp(14px, 13.029px + 0.259vw, 18px);
    padding-left: 25px;

    &::before {
      content: "";
      position: absolute;
      top: 4px;
      left: 0;
      background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19.262' height='17' viewBox='0 0 19.262 17'%3E%3Cg id='グループ_967' data-name='グループ 967' transform='translate(-515.269 -8038.898)'%3E%3Cpath id='パス_219' data-name='パス 219' d='M7843.793-1885.6h-14.024v16h16v-8.633' transform='translate(-7314 9925)' fill='none' stroke='%237b6023' stroke-width='1'/%3E%3Cpath id='パス_220' data-name='パス 220' d='M7833.652-1877.6l3.338,4.135,11.182-11.494' transform='translate(-7314 9925)' fill='none' stroke='%237b6023' stroke-width='1'/%3E%3C/g%3E%3C/svg%3E%0A") center center / contain no-repeat;
      width: 19px;
      height: 16px;
      display: inline-block;
    }

    @media (max-width: 767px) {
      &::before {
        top: 3px;
        width: 15px;
        height: 13px;
      }
    }

    &+li {
      margin-top: 15px;
    }
  }
}

/*----------------------------
table
----------------------------*/
.table_style1 {
  width: 100%;

  @media (max-width: 767px) {
    border: 1px #A28C5B solid;
  }

  tr {
    border: 1px #A28C5B solid;

    @media (max-width: 767px) {
      border: none;
    }

    th {
      background-color: #EDECE8;
      font-weight: normal;
      font-size: clamp(14px, 13.029px + 0.259vw, 18px);
      padding: clamp(15px, 13.786px + 0.324vw, 20px) clamp(20px, 17.573px + 0.647vw, 30px);

      @media (max-width: 767px) {
        width: 100%;
        display: block;
      }
    }

    td {
      font-size: clamp(14px, 13.029px + 0.259vw, 18px);
      padding: clamp(15px, 13.786px + 0.324vw, 20px) clamp(20px, 17.573px + 0.647vw, 30px);

      @media (max-width: 767px) {
        width: 100%;
        display: block;
      }

      &:last-child {
        text-align: right;
      }
    }
  }
}

.table_style2 {
  width: 100%;

  @media (max-width: 767px) {
    border: 1px #A28C5B solid;
  }

  tr {
    border: 1px #A28C5B solid;

    @media (max-width: 767px) {
      border: none;
    }

    th {
      background-color: #EDECE8;
      font-weight: normal;
      font-size: clamp(14px, 13.029px + 0.259vw, 18px);
      padding: clamp(15px, 13.786px + 0.324vw, 20px) clamp(20px, 17.573px + 0.647vw, 30px);

      @media (max-width: 767px) {
        width: 100%;
        display: block;
      }
    }

    td {
      font-size: clamp(14px, 13.029px + 0.259vw, 18px);
      padding: clamp(15px, 13.786px + 0.324vw, 20px) clamp(20px, 17.573px + 0.647vw, 30px);

      @media (max-width: 767px) {
        width: 100%;
        display: block;
      }
    }
  }
}

/*----------------------------
ページネーション
----------------------------*/
.navigation.pagination {
  text-align: center;
  margin-top: clamp(2.5rem, 2.06rem + 1.88vw, 3.75rem);

  * {
    font-family: var(--font-en);
    font-weight: 500;
  }

  a {
    color: #9D7947;
  }

  .page-numbers {
    padding: 0.5em;
    min-width: 2em;
    font-size: clamp(0.938rem, 0.827rem + 0.47vw, 1.25rem);
  }

  .current {
    display: inline-block;
    background-color: #9D7947;
    line-height: 1;
    border-radius: 100px;
    color: #fff;
  }

  .prev {
    color: #9D7947;
    display: inline-flex;
    align-items: center;
    gap: 0.2em;

    &::before {
      content: "";
      width: clamp(0.438rem, 0.393rem + 0.19vw, 0.563rem);
      height: clamp(0.438rem, 0.393rem + 0.19vw, 0.563rem);
      border: 0;
      border-top: solid 1px #9D7947;
      border-right: solid 1px #9D7947;
      transform: rotate(-135deg);
    }
  }

  .next {
    color: #9D7947;
    display: inline-flex;
    align-items: center;
    gap: 0.2em;

    &::after {
      content: "";
      width: clamp(0.438rem, 0.393rem + 0.19vw, 0.563rem);
      height: clamp(0.438rem, 0.393rem + 0.19vw, 0.563rem);
      border: 0;
      border-top: solid 1px #9D7947;
      border-right: solid 1px #9D7947;
      transform: rotate(45deg);
    }
  }
}

/*----------------------------
header
----------------------------*/
.nav_container {
  width: 100%;
  height: 115px;
  display: flex;
  align-items: center;
  z-index: 102;
  /* 20px-40px:375px-1920px */
  padding: 0 clamp(1.25rem, 0.947rem + 1.29vw, 2.5rem);

  @media (max-width: 767px) {
    height: 54px;
  }

  .logo {
    margin: 0 clamp(30px, -3.333px + 2.778vw, 50px) 0 0;
    flex-shrink: 0;

    a {
      display: flex;
      gap: 15px;

      img {
        height: clamp(31px, 28.816px + 0.583vw, 40px);
      }

      .site_ttl {
        font-weight: 500;
        font-size: clamp(11px, 10.515px + 0.129vw, 13px);
        color: #fff;
        margin: 0;
      }
    }
  }

  /* グローバルナビ */
  .g_nav {
    @media (max-width: 1300px) {
      display: none;
    }

    .g_nav_list {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: clamp(20px, 3.333px + 1.389vw, 30px);

      .g_nav_item {
        position: relative;

        &>a,
        &>span {
          font-size: clamp(0.875rem, 0.247rem + 0.84vw, 1rem);
          text-align: center;
          color: #fff;
          position: relative;
          height: 80px;
          display: flex;
          align-items: center;

          &::after {
            content: "";
            position: absolute;
            left: 0;
            width: 100%;
            height: 1px;
            border-top: 1px #D6BE89 solid;
            bottom: 25px;
            transform: scale(0, 1);
            transform-origin: left top;
            transition: transform 0.3s;
          }

          &:hover {
            color: #D6BE89;

            &::after {
              transform: scale(1, 1);
            }
          }
        }

        .dropdown {
          display: block;
          opacity: 0;
          visibility: hidden;
          transform: translateY(-10px);
          position: absolute;
          top: 100%;
          left: 0;
          background: #2E434A;
          margin: 0;
          padding: 20px 30px;
          min-width: 660px;
          width: fit-content;
          z-index: 10;
          transition:
            opacity 0.3s ease,
            transform 0.3s ease,
            visibility 0s linear 0.3s;
          pointer-events: none;
          will-change: opacity, transform;

          .dropdown_header {
            display: flex;
            align-items: center;
            gap: 30px;
            margin-bottom: 20px;

            .img {
              width: 160px;
              aspect-ratio: 2 / 1;

              img {
                object-fit: cover;
                width: 100%;
                height: 100%;
              }
            }

            .ttl {
              margin: 0;

              &>a,
              &>span {
                font-weight: 500;
                font-size: 18px;
                color: #fff;
              }

              &>a {
                display: block;
                width: 100%;
                position: relative;
                padding-right: 30px;

                &::after {
                  content: "";
                  position: absolute;
                  top: 50%;
                  right: 0;
                  transform: translateY(-50%);
                  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='14' height='14' viewBox='0 0 14 14'%3E%3Cdefs%3E%3ClinearGradient id='linear-gradient' x1='0.5' x2='0.5' y2='1' gradientUnits='objectBoundingBox'%3E%3Cstop offset='0' stop-color='%23af9b76'/%3E%3Cstop offset='1' stop-color='%23e3d8b9'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg id='グループ_219' data-name='グループ 219' transform='translate(-0.057)'%3E%3Ccircle id='楕円形_15' data-name='楕円形 15' cx='7' cy='7' r='7' transform='translate(0.057)' fill='url(%23linear-gradient)'/%3E%3Cpath id='パス_1' data-name='パス 1' d='M0,0,3.818,3.319,0,7' transform='matrix(1, 0.017, -0.017, 1, 5.501, 3.673)' fill='none' stroke='%232e434a' stroke-width='1'/%3E%3C/g%3E%3C/svg%3E%0A") center center / contain no-repeat;
                  width: 14px;
                  height: 14px;
                  display: inline-block;
                  transition: ease-in .2s;
                }

                &:hover {
                  opacity: 0.7;

                  &::after {
                    right: -3px;
                  }
                }
              }
            }
          }

          .dropdown_list {
            display: flex;
            flex-wrap: wrap;
            gap: 20px 30px;

            .dropdown_item {
              width: calc((100% - 60px) / 3);
              display: flex;

              &>a {
                display: flex;
                align-items: center;
                font-size: 16px;
                color: #fff;
                border-bottom: 1px #AF9B76 solid;
                width: 100%;
                padding-right: 20px;
                padding-bottom: 5px;
                position: relative;

                &::after {
                  content: "";
                  position: absolute;
                  top: 50%;
                  right: 0;
                  transform: translateY(-50%);
                  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='14' height='14' viewBox='0 0 14 14'%3E%3Cdefs%3E%3ClinearGradient id='linear-gradient' x1='0.5' x2='0.5' y2='1' gradientUnits='objectBoundingBox'%3E%3Cstop offset='0' stop-color='%23af9b76'/%3E%3Cstop offset='1' stop-color='%23e3d8b9'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg id='グループ_219' data-name='グループ 219' transform='translate(-0.057)'%3E%3Ccircle id='楕円形_15' data-name='楕円形 15' cx='7' cy='7' r='7' transform='translate(0.057)' fill='url(%23linear-gradient)'/%3E%3Cpath id='パス_1' data-name='パス 1' d='M0,0,3.818,3.319,0,7' transform='matrix(1, 0.017, -0.017, 1, 5.501, 3.673)' fill='none' stroke='%232e434a' stroke-width='1'/%3E%3C/g%3E%3C/svg%3E%0A") center center / contain no-repeat;
                  width: 14px;
                  height: 14px;
                  display: inline-block;
                  transition: ease-in .2s;
                }

                &:hover {
                  opacity: 0.7;

                  &::after {
                    right: -3px;
                  }
                }
              }
            }
          }
        }

        /* ホバーで開く */
        &.has-dropdown:hover .dropdown,
        &.has-dropdown.open .dropdown {
          opacity: 1;
          visibility: visible;
          transform: translateY(0);
          transition-delay: 0s;
          pointer-events: auto;
        }
      }

      /* N2 CLINICとはのドロップダウン */
      .g_nav_item:nth-child(1) {
        .dropdown {
          min-width: 450px;

          .dropdown_list {
            .dropdown_item {
              width: calc((100% - 30px) / 2);
            }
          }
        }
      }
    }
  }

  /* ご予約・お問い合わせ/ハンバーガー */
  .g_ham_area {
    display: flex;
    align-items: center;
    gap: clamp(20px, 3.333px + 1.389vw, 30px);
    margin-left: auto;

    /* switch */
    .lang_dropdown {
      position: relative;
      display: inline-block;
      cursor: pointer;
      font-size: 14px;

      .lang_ttl {
        margin: 0;
        display: flex;
        align-items: center;
        gap: 10px;
        color: #fff;
        font-size: clamp(13px, 12.757px + 0.065vw, 14px);
        padding: 10px 0;

        &::after {
          content: "";
          width: 6px;
          height: 6px;
          border: 0;
          border-bottom: solid 1px #fff;
          border-right: solid 1px #fff;
          transform: rotate(45deg);
          transition: transform 0.3s ease;
          flex-shrink: 0;
        }
      }

      .bogo-language-switcher {
        opacity: 0;
        visibility: hidden;
        transform: translateY(-5px);
        transition: all 0.3s ease;
        position: absolute;
        top: 100%;
        left: 0;
        width: max-content;
        z-index: 10;
        padding: 7px 0;

        &>li {
          list-style: none;

          .bogo-language-name {
            a {
              display: flex;
              align-items: center;
              gap: 5px;
              padding: 6px 10px;
              text-decoration: none;
              color: #fff;
              font-size: 14px;

              &::before {
                content: "";
                background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='7' viewBox='0 0 6 7'%3E%3Cpath id='多角形_3' data-name='多角形 3' d='M3.5,0,7,6H0Z' transform='translate(6) rotate(90)' fill='%23af9b76'/%3E%3C/svg%3E%0A") center center / contain no-repeat;
                width: 7px;
                height: 7px;
                display: inline-block;
                flex-shrink: 0;
              }

              &:hover {
                opacity: 0.5;
              }
            }

            &:not(:has(a)) {
              display: none;
            }
          }
        }

        .current {
          display: none;
        }
      }

      &:hover {
        .lang_ttl {
          &::after {
            transform: rotate(-135deg);
          }
        }

        .bogo-language-switcher {
          opacity: 1;
          visibility: visible;
          transform: translateY(0);
        }
      }
    }

    /* ご予約・お問い合わせ */
    .btn_contact {
      @media (max-width: 767px) {
        display: none;
      }

      a {
        min-width: 200px;
        height: 47px;
        padding: 0 10px;
        font-size: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(46deg, rgba(162, 134, 83, 1) 0%, rgba(239, 222, 193, 1) 50%, rgba(162, 134, 83, 1) 100%);
        color: #000;
        transition: filter 0.2s ease-in;

        &:hover {
          filter: brightness(1.15);
        }
      }
    }
  }

  /* ハンバーガー */
  .btn_hamburger {
    width: 30px;
    display: none;

    @media (max-width: 1300px) {
      display: block;
    }

    .hamburger_lines {
      position: relative;
      width: 100%;
      margin: auto;
      height: 8px;
      -webkit-transition-duration: 300ms;
      transition-duration: 300ms;

      .line {
        position: absolute;
        right: 0;
        left: 0;
        display: block;
        width: 84%;
        height: 1px;
        margin: auto;
        -webkit-transition-duration: 300ms;
        transition-duration: 300ms;
        background-color: #A28C5B;
      }

      .line:nth-child(1) {
        top: 0;
      }

      .line:nth-child(2) {
        bottom: 0;
      }
    }
  }

  /* 追従ナビ */
  &.visible {
    position: fixed;
    background-color: rgba(244, 244, 244, 0.9);
    height: 80px;

    @media (max-width: 767px) {
      height: 54px;
    }

    .logo {
      display: block;

      .site_ttl {
        color: #000;
      }
    }

    .g_nav {
      display: block;

      @media (max-width: 1300px) {
        display: none;
      }

      .g_nav_list {
        .g_nav_item {

          &>a,
          &>span {
            color: #000;

            &::after {
              border-top-color: #2E434A;
            }

            &:hover {
              color: #2E434A;
            }
          }
        }
      }
    }

    .g_ham_area {
      .lang_dropdown {
        .lang_ttl {
          color: #2C3639;

          &::after {
            border-bottom-color: #000;
            border-right-color: #000;
          }
        }

        .bogo-language-switcher {
          background-color: rgba(244, 244, 244, 0.9);

          &>li {
            a {
              color: #000;
            }
          }
        }
      }
    }
  }
}

header {
  ul {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .nav_container {
    position: absolute;
    top: 0;
    transform: translateY(-100%);
    transition: transform 0.3s ease;
    z-index: 900;
  }

  /* ハンバーガーメニューが開いているとき */
  &.active {
    .nav_container {
      position: fixed;

      .g_nav {
        display: none;
      }

      @media (max-width: 767px) {
        .btn_contact {
          display: none;
        }
      }

      @media (max-width: 767px) {
        .logo {
          display: flex;
        }
      }

      .g_ham_area {
        margin-left: auto;
      }
    }

    .ham_con {
      display: flex;

      &::-webkit-scrollbar {
        display: none;
      }
    }
  }
}

/*----------------------------
ハンバーガー中身
----------------------------*/
.ham_con {
  display: none;
  flex-direction: column;
  align-items: center;
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #F4F4F4;
  transition: ease-in .2s;
  z-index: 101;
  overflow-y: scroll;
  overscroll-behavior: none;
  padding-bottom: 60px;

  @media (max-width: 767px) {
    padding-bottom: 0;
  }

  .ham_con_inner {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    max-width: 700px;
    width: 84%;
    margin: auto;
    padding-top: 60px;

    @media (max-width: 767px) {
      width: 300px;
      padding-bottom: 70px;
    }

    .h_nav {
      width: 100%;
      display: flex;
      flex-wrap: wrap;
      gap: 0 60px;
      margin-bottom: 40px;

      @media (max-width: 767px) {
        flex-direction: column;
        gap: 0;
      }

      .h_nav_list {
        width: calc((100% - 120px) / 3);

        @media (max-width: 767px) {
          width: 100%;
        }

        .h_nav_item {

          a,
          span {
            font-family: var(--font-min);
            font-weight: 500;
            font-size: 16px;
            border-bottom: 1px #E0DEDA solid;
            padding: 20px 0;
            position: relative;
            display: block;

            @media (max-width: 767px) {
              padding: 20px 10px;
            }
          }

          a::after {
            content: "";
            position: absolute;
            top: 50%;
            right: 10px;
            display: block;
            width: 8px;
            height: 8px;
            border: 0;
            border-top: solid 2px #C6C1B5;
            border-left: solid 2px #C6C1B5;
            transform: translateY(-50%) rotate(135deg);
            transition: ease-in .2s;
          }

          a:hover {
            opacity: 0.7;
          }

          &.accordion {
            &>ul {
              @media (max-width: 767px) {
                display: none;
              }
            }

            &>span {
              position: relative;

              @media (max-width: 767px) {
                &::after {
                  content: "";
                  position: absolute;
                  top: 50%;
                  right: 0;
                  transform: translateY(-50%);
                  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' viewBox='0 0 25 25'%3E%3Cg id='グループ_1080' data-name='グループ 1080' transform='translate(-342 -279.176)'%3E%3Ccircle id='楕円形_49' data-name='楕円形 49' cx='12.5' cy='12.5' r='12.5' transform='translate(342 279.176)' fill='%23fff' opacity='0.3'/%3E%3Cg id='グループ_381' data-name='グループ 381' transform='translate(23.5 -90.824)'%3E%3Cline id='線_124' data-name='線 124' x2='13' transform='translate(324.5 382.5)' fill='none' stroke='%23c6c1b5' stroke-width='2'/%3E%3Cline id='線_125' data-name='線 125' x2='13' transform='translate(331 376) rotate(90)' fill='none' stroke='%23c6c1b5' stroke-width='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A") center/contain no-repeat;
                  width: 25px;
                  height: 25px;
                  display: inline-block;
                  opacity: 1;
                  transition: opacity .1s ease;
                  pointer-events: none;
                }

                &::before {
                  content: "";
                  position: absolute;
                  top: 50%;
                  right: 0;
                  transform: translateY(-50%);
                  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' viewBox='0 0 25 25'%3E%3Cg id='グループ_1080' data-name='グループ 1080' transform='translate(-312 -289.676)'%3E%3Ccircle id='楕円形_39' data-name='楕円形 39' cx='12.5' cy='12.5' r='12.5' transform='translate(312 289.676)' fill='%23fff' opacity='0.3'/%3E%3Cg id='グループ_381' data-name='グループ 381' transform='translate(-6.5 -80.324)'%3E%3Cline id='線_124' data-name='線 124' x2='13' transform='translate(324.5 382.5)' fill='none' stroke='%23c6c1b5' stroke-width='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A") center/contain no-repeat;
                  width: 25px;
                  height: 25px;
                  display: inline-block;
                  opacity: 0;
                  transition: opacity .1s ease;
                  pointer-events: none;
                }
              }

              &.open {
                &::after {
                  opacity: 0;
                }

                &::before {
                  opacity: 1;
                }
              }
            }

            .h_nav_item {
              a {
                padding-left: 20px;

                &::before {
                  content: "";
                  position: absolute;
                  top: 50%;
                  left: 0;
                  transform: translateY(-50%);
                  width: 6px;
                  height: 1px;
                  border-bottom: 1px #A28C5B solid;
                  display: inline-block;
                }
              }
            }
          }
        }
      }
    }

    .address_area {
      align-self: flex-start;
      /* display: flex;
      justify-content: center; */
      width: 100%;

      /* @media (max-width: 767px) {
        flex-direction: column;
      } */
      .address {
        font-size: 14px;
        margin: 0;
        text-align: center;

        @media (max-width: 767px) {
          text-align: left;
        }

        .mail_adress {
          width: 200px;
          margin-bottom: 3px;
        }
      }

      .banner_area {
        max-width: 517px;
        width: 90%;
        margin: 30px auto 0;
        display: flex;
        gap: 17px;

        @media (max-width: 767px) {
          flex-direction: column;
          width: 250px;
        }

        .banner_item {
          width: calc((100% - 17px) / 2);

          @media (max-width: 767px) {
            width: 100%;
          }

          a {
            &:hover {
              opacity: 0.7;
            }
          }
        }
      }

      .sns_area {
        margin-left: auto;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;

        @media (max-width: 767px) {
          margin-left: inherit;
          margin-top: 20px;
        }

        .link {
          margin: 0;
          margin-top: 12px;

          a {
            text-decoration: underline;

            &:hover {
              text-decoration: none;
            }
          }
        }
      }
    }
  }

  .common_contact {
    max-width: 700px;
    width: 100%;
    display: flex;
    flex-direction: row-reverse;

    @media (min-width: 768px) {
      margin-top: clamp(30px, 22.718px + 1.942vw, 60px);
    }

    .common_contact_bg {
      width: 100%;
      height: 136px;

      @media (min-width: 768px) {
        width: 50%;
        height: auto;
      }

      img {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    }

    .common_contact_inner {
      @media (min-width: 768px) {
        position: static;
        transform: none;
        display: block;
        transform: none;
        width: 50%;
      }

      .contact_box {
        height: 116px;
        gap: 9px;
        margin: -100px auto 0;
        aspect-ratio: inherit;

        @media (min-width: 768px) {
          width: 100%;
          height: 100%;
          margin: 0;
        }

        .ttl {
          font-size: 22px;
        }

        .btn {
          a {
            padding: 9px;
            min-width: 240px;
            font-size: 14px;
          }
        }
      }
    }
  }
}

/*----------------------------
footer
----------------------------*/
footer {
  background-color: #2E434A;
  padding-top: 60px;
  padding-bottom: 60px;

  .footer_inner {
    max-width: 1200px;
    width: 90%;
    margin: auto;
    display: flex;
    gap: 20px;

    @media (max-width: 1000px) {
      flex-direction: column;
      width: 84%;
    }

    * {
      color: #fff;
    }

    .footer_info {
      display: grid;
      grid-template-columns: 80px 1fr;
      gap: 30px;
      max-width: 520px;
      width: 68%;

      @media (max-width: 767px) {
        display: flex;
        flex-direction: column;
        gap: 0;
        width: 100%;
      }

      .footer_logo {
        width: clamp(60px, 55.146px + 1.294vw, 80px);
        margin-right: 40px;
        flex-shrink: 0;

        @media (max-width: 1000px) {
          margin-bottom: 40px;
          margin-right: 0;
        }

        img {
          width: 100%;
        }
      }

      .footer_access {
        flex-shrink: 0;

        .access {
          font-size: 14px;
          margin: 0;

          .mail_adress {
            width: 200px;
            margin-bottom: 5px;
          }
        }

        .sns_area {
          margin-top: 20px;

          @media (max-width: 1000px) {
            margin-top: 30px;
          }

          a {
            &:hover {
              opacity: 0.8;
            }
          }
        }
      }

      .banner_area {
        grid-column: 1 / 3;
        grid-row: 2;
        display: flex;
        gap: 20px;

        @media (max-width: 767px) {
          display: flex;
          flex-direction: column;
          gap: 10px;
          margin-top: 30px;
          width: 250px;
          margin: 30px auto 0;
        }

        .banner_item {
          width: calc((100% - 20px) / 2);

          @media (max-width: 767px) {
            width: 100%;
          }

          a {
            &:hover {
              opacity: 0.7;
            }
          }
        }
      }
    }

    .footer_nav {
      display: flex;
      column-gap: 50px;
      row-gap: 40px;
      flex-wrap: wrap;
      justify-content: flex-end;

      @media (max-width: 1000px) {
        margin-top: 60px;
        justify-content: flex-start;
      }

      @media (max-width: 767px) {
        flex-direction: column;
      }

      .f_nav_list {
        list-style: none;
        margin: 0;
        padding: 0;
        max-width: 140px;

        .f_nav_item {
          a {
            display: inline-block;
            font-size: 14px;
            line-height: 1.5;

            &:hover {
              color: #D6BE89;
            }
          }

          &.sub {
            a {
              position: relative;
              padding-left: 12px;

              &::before {
                content: "";
                position: absolute;
                top: 10px;
                left: 0;
                display: inline-block;
                width: 6px;
                height: 1px;
                border-bottom: 1px #fff solid;
              }
            }
          }

          &+.f_nav_item {
            margin-top: 12px;

            @media (max-width: 1000px) {
              margin-top: 20px;
            }
          }
        }
      }

      .copyright_area {
        width: 100%;
        display: flex;
        justify-content: flex-end;
        gap: clamp(20px, 15.146px + 1.294vw, 40px);

        @media (max-width: 767px) {
          flex-direction: column;
          /* align-items: flex-end; */
          width: 110%;
          margin-left: -5%;
        }

        a {
          text-decoration: underline;
          font-size: clamp(12px, 11.515px + 0.129vw, 14px);

          &:hover {
            text-decoration: none;
          }
        }

        .copyright {
          margin: 0;
          font-size: clamp(12px, 11.515px + 0.129vw, 14px);

          @media (max-width: 767px) {
            text-align: center;
          }
        }
      }
    }
  }
}

/*----------------------------
固定ボタン
----------------------------*/
.fixed_btn_contact {
  display: none;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;

  @media (max-width: 767px) {
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 10;
    width: 100%;
  }

  &.is-visible {
    opacity: 1;
    transform: translateY(0);
  }

  a {
    background: linear-gradient(90deg, rgba(36, 59, 67, 1) 0%, rgba(38, 82, 96, 1) 100%);
    color: #fff;
    display: block;
    padding: 14px;
    text-align: center;
  }
}

/*----------------------------
top
----------------------------*/
/*--- ヘッダー ---*/
.home {
  .mv_wrap {
    .nav_container {
      .logo {
        display: none;
      }

      .g_nav {
        display: none;
      }

      .g_ham_area {
        .btn_contact {
          a {
            min-width: 240px;
            height: 50px;
            font-size: 18px;
          }
        }
      }
    }
  }
}

/*--- ファーストビュー ---*/
.mv_wrap {
  .nav_container {
    position: absolute;
    top: 0;
    z-index: 1;
  }

  /*--- mv ---*/
  .top_mv {
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;

    @media (max-width: 767px) {
      height: 70vh;
    }

    video {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }

  /*--- キャッチフレーズ ---*/
  .top_catchphrase {
    position: relative;
    z-index: 2;
    padding-top: clamp(150px, 113.592px + 9.709vw, 300px);
    /* padding-bottom: clamp(200px, 175.728px + 6.472vw, 300px); */
    /* padding-bottom: clamp(100px, 75.728px + 6.472vw, 200px); */
    padding-bottom: 100px;
    background: url("../img/catchphrase_obj01.svg") top -5.21vw left -7.81vw / 46.15vw no-repeat,
      url("../img/catchphrase_obj02.svg") bottom 0 right -7.81vw / 49.53vw no-repeat,
      #F4F4F4;

    @media (max-width: 767px) {
      padding-bottom: clamp(100px, 75.728px + 6.472vw, 200px);
      background: url("../img/catchphrase_obj01.svg") top -5.33vw left -37.33vw / 99.2vw no-repeat,
        url("../img/catchphrase_obj02.svg") bottom 0 right -18.67vw / 93.33vw no-repeat,
        #F4F4F4;
    }

    .large {
      font-size: clamp(22px, 15.204px + 1.812vw, 50px);
      text-align: center;
      line-height: 1.8;
      margin: 0;
      margin-bottom: clamp(30px, 22.718px + 1.942vw, 60px);
    }

    .txt {
      font-size: clamp(14px, 13.029px + 0.259vw, 18px);
      text-align: center;
      line-height: 1.8;
      margin: 0;
    }
  }
}

/*--- features ---*/
.top_features {
  position: relative;
  width: 100%;

  .features_inner {
    position: sticky;
    top: 0;
    height: 100vh;
    width: 100%;
    overflow: hidden;

    .features_item {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      display: flex;
      opacity: 0;
      transition: opacity 0.7s ease-out;

      @media (max-width: 767px) {
        flex-direction: column;
      }

      .content_left {
        max-width: 768px;
        width: 40%;
        margin-left: auto;
        margin-right: 5%;
        padding-top: 25svh;

        @media (max-width: 1500px) {
          padding-top: 20svh;
        }

        @media (max-width: 767px) {
          width: 84%;
          margin: 0 auto 40px;
          padding-top: 70px;
        }

        .page_num {
          margin: 0 0 clamp(40px, 35.146px + 1.294vw, 60px);

          .num_area {
            font-family: var(--font-en);
            font-size: clamp(18px, 9.000px + 2.4vw, 24px);
            color: #7B6023;
            margin: 0;
            overflow: hidden;
            display: flex;
            align-items: baseline;

            .num {
              font-family: var(--font-en);
              font-size: clamp(40px, 10.000px + 8vw, 60px);
              line-height: 1;
              margin-right: 10px;
              display: block;
            }

            /* forward 入場／退場 */
            .num.enter-up {
              animation: slideInUp 0.5s ease-out forwards;
            }

            .num.exit-up {
              animation: slideOutUp 0.5s ease-out forwards;
            }

            /* backward 入場／退場 */
            .num.enter-down {
              animation: slideInDown 0.5s ease-out forwards;
            }

            .num.exit-down {
              animation: slideOutDown 0.5s ease-out forwards;
            }
          }

          .num_sub_txt {
            font-family: var(--font-en);
            font-size: clamp(14px, 8.000px + 1.6vw, 18px);
            color: #7B6023;
            margin: 0;
          }
        }

        .ttl {
          /* font-size: clamp(22px, -20.000px + 11.2vw, 50px); */
          font-size: clamp(30px, 16.696px + 1.735vw, 50px);
          margin: 0 0 clamp(30px, 25.146px + 1.294vw, 50px);

          @media (max-width: 767px) {
            font-size: clamp(22px, -20.000px + 11.2vw, 50px);
          }
        }

        .txt {
          font-size: clamp(14px, 8.000px + 1.6vw, 18px);
          margin: 0;
          line-height: 1.8;
        }
      }

      .content_right {
        width: 50%;
        align-self: center;

        @media (max-width: 767px) {
          width: 92%;
          align-self: flex-end;
        }
      }
    }
  }
}

/* 上方向に出し入れ */
@keyframes slideInUp {
  from {
    transform: translateY(100%);
  }

  to {
    transform: translateY(0);
  }
}

@keyframes slideOutUp {
  from {
    transform: translateY(0);
  }

  to {
    transform: translateY(-100%);
  }
}

/* 下方向に出し入れ */
@keyframes slideInDown {
  from {
    transform: translateY(-100%);
  }

  to {
    transform: translateY(0);
  }
}

@keyframes slideOutDown {
  from {
    transform: translateY(0);
  }

  to {
    transform: translateY(100%);
  }
}

/*--- loop slider ---*/
.sec_loop_slider {
  overflow: hidden;
  position: relative;
  padding-bottom: 50px;
  margin-top: 8vh;
  margin-bottom: clamp(60px, 1.748px + 15.534vw, 300px);

  @media (max-width: 767px) {
    padding-top: 40px;
    padding-bottom: 140px;
    margin-top: 0;
  }

  &::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    background: url("../img/loop_slider_bg.png") center bottom / contain no-repeat;
    width: 100%;
    height: 100px;
    mix-blend-mode: color-dodge;
  }

  @media (max-width: 767px) {
    &::before {
      top: 0;
      bottom: inherit;
      left: 0;
      background: url("../img/loop_slider_bg_sp1.png") left top / contain no-repeat;
      width: 74.93vw;
    }

    &::after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      display: block;
      background: url("../img/loop_slider_bg_sp2.png") left bottom / contain no-repeat;
      width: 95.47vw;
      height: 200px;
      mix-blend-mode: color-dodge;
      z-index: -1;
    }
  }

  .loop_slider {
    display: flex;
    width: max-content;
    animation: scrollLoop 80s linear infinite;

    .loop_item {
      flex-shrink: 0;
      margin-right: 1.56vw;
      width: 25vw;

      @media (max-width: 767px) {
        width: 69.33vw;
        margin-right: 2.67vw;
      }

      &:nth-child(even) {
        margin-top: 60px;

        @media (max-width: 767px) {
          margin-top: 20px;
        }
      }
    }
  }
}

@keyframes scrollLoop {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

/*--- service ---*/
.top_services {
  .top_services_inner {
    max-width: 1536px;
    width: 84%;
    margin: auto;
  }
}

.services_list {
  .services_item {
    width: 95%;

    @media (max-width: 1300px) {
      width: 100%;
    }

    a {
      position: relative;
      display: flex;

      @media (max-width: 767px) {
        flex-direction: column;
      }

      .img_area {
        display: flex;
        width: 65vw;
        position: relative;
        align-items: flex-start;
        /* grid-column: 1;
        grid-row: 1 / 3; */
        padding-bottom: 50px;

        @media (max-width: 1300px) {
          width: 50vw;
        }

        @media (max-width: 767px) {
          flex-direction: row-reverse;
          width: 94.33%;
          padding-bottom: 0;
        }

        .copy {
          margin: 0;

          span {
            position: relative;
            z-index: 2;
            margin: 0 0.78vw 0 0;
            /* width: 3.13vw; */
            display: block;
            font-weight: 400;
            font-family: var(--font-en);
            font-size: clamp(12px, 4.667px + 0.955vw, 23px);
            color: #7B6023;
            /* font-size: 1.2vw; */
            line-height: 1;
            writing-mode: tb;
            white-space: nowrap;

            /* @media (max-width: 1300px) {
              font-size: 2.93vw;
            } */
            @media (max-width: 767px) {
              font-size: clamp(11px, 2.390px + 2.296vw, 20px);
              margin: 0 0 0 0.78vw;
            }
          }
        }

        .img {
          width: 100%;
          position: relative;
          z-index: 2;
          aspect-ratio: 800 / 350;
          overflow: hidden;

          @media (max-width: 1300px) {
            aspect-ratio: 800 / 400;
          }

          @media (max-width: 767px) {
            aspect-ratio: 300 / 191;
          }

          img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform .6s ease;
          }
        }
      }

      .btn {
        position: absolute;
        /* bottom: 0; */
        top: 13.2vw;
        left: 60px;
        z-index: 3;

        @media (max-width: 1300px) {
          top: 17.2vw;
        }

        @media (max-width: 767px) {
          top: 31vw;
          left: inherit;
          right: 5.33vw;
          bottom: inherit;
        }

        span {
          position: relative;
          width: 10.42vw;
          height: 10.42vw;
          background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='200.818' height='200.818' viewBox='0 0 200.818 200.818'%3E%3Cdefs%3E%3ClinearGradient id='linear-gradient' x1='0.5' x2='0.5' y2='1' gradientUnits='objectBoundingBox'%3E%3Cstop offset='0' stop-color='%23af9b76'/%3E%3Cstop offset='1' stop-color='%23e3d8b9'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg id='グループ_254' data-name='グループ 254' transform='translate(-255 -5001.585)'%3E%3Crect id='長方形_198' data-name='長方形 198' width='142' height='142' transform='translate(255 5101.995) rotate(-45)' fill='url(%23linear-gradient)'/%3E%3Crect id='長方形_197' data-name='長方形 197' width='136' height='136' transform='translate(355.166 5006) rotate(45)'/%3E%3C/g%3E%3C/svg%3E%0A") center center / cover no-repeat;
          display: flex;
          justify-content: center;
          align-items: center;
          color: #fff;
          font-family: var(--font-en);
          font-size: 1.3vw;
          text-align: center;
          line-height: 1.3;

          @media (max-width: 767px) {
            width: 24vw;
            height: 24vw;
            font-size: 2.93vw;
          }

          &::after {
            content: "";
            position: absolute;
            left: 50%;
            bottom: 2.5vw;
            transform: translateX(-50%);
            background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21.373' height='7.883' viewBox='0 0 21.373 7.883'%3E%3Cpath id='パス_77' data-name='パス 77' d='M-1117.507-12916.388h20l-8.334-7' transform='translate(1117.507 12923.771)' fill='none' stroke='%23fff' stroke-width='1'/%3E%3C/svg%3E%0A") center center / contain no-repeat;
            display: inline-block;
            width: 1.3vw;
            height: 0.46vw;
          }

          @media (max-width: 767px) {
            &::after {
              bottom: 5.6vw;
              width: 3vw;
              height: 1vw;
              background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10.399' height='4.042' viewBox='0 0 10.399 4.042'%3E%3Cpath id='パス_77' data-name='パス 77' d='M-1117.507-12920.229h9.026l-3.761-3.159' transform='translate(1117.507 12923.771)' fill='none' stroke='%23fff' stroke-width='1'/%3E%3C/svg%3E%0A");
            }
          }
        }
      }

      .contents_area {
        position: relative;
        width: 45.57vw;
        z-index: 3;
        background-color: rgba(255, 255, 255, 0.6);
        backdrop-filter: blur(20px) brightness(120%);
        -webkit-backdrop-filter: blur(20px) brightness(120%);
        margin-top: 5.21vw;
        margin-left: -6.25vw;
        padding: 4.17vw 5.21vw;

        @media (max-width: 767px) {
          width: 91.04%;
          margin-top: -5.33vw;
          margin-left: auto;
          padding: 8vw;
        }

        .ttl {
          font-size: clamp(22px, 17.631px + 1.165vw, 40px);
          margin: 0 0 1.56vw;

          @media (max-width: 767px) {
            margin-bottom: 20px;
          }
        }

        .txt {
          font-size: clamp(14px, 13.515px + 0.129vw, 16px);
          line-height: 2;
          margin: 0;
        }
      }

      &:hover {
        .img {
          img {
            transform: scale(1.05);
          }
        }
      }
    }
  }

  .services_item:nth-child(even) {
    margin-left: auto;

    a {
      flex-direction: row-reverse;

      @media (max-width: 767px) {
        flex-direction: column;
      }

      .img_area {
        flex-direction: row-reverse;

        @media (max-width: 767px) {
          flex-direction: row;
          margin-left: auto;
        }

        .copy {
          span {
            margin: 0 0 0 0.78vw;

            @media (max-width: 767px) {
              margin: 0 0.78vw 0 0;
            }
          }
        }
      }

      .btn {
        left: inherit;
        right: 60px;

        @media (max-width: 767px) {
          right: 5.33vw;
        }
      }

      .contents_area {
        margin-left: inherit;
        margin-right: -6.25vw;

        @media (max-width: 767px) {
          margin-right: auto;
        }
      }
    }
  }

  .services_item+.services_item {
    margin-top: 6.77vw;

    @media (max-width: 767px) {
      margin-top: 26.67vw;
    }
  }
}

/*--- flow ---*/
.top_flow {
  padding-top: clamp(150px, 137.864px + 3.236vw, 200px);

  .sec_ttl {
    font-weight: 500;
    font-size: clamp(22px, 15.204px + 1.812vw, 50px);
    text-align: center;
    letter-spacing: 0.1em;
  }

  .lead {
    font-size: clamp(14px, 13.029px + 0.259vw, 18px);
    text-align: center;
    line-height: 2;
    margin: 0 0 clamp(80px, 75.146px + 1.294vw, 100px);
  }

  .timeline-container {
    position: relative;
    display: flex;
    justify-content: space-between;
    padding: 0 5%;

    /* 画像エリア */
    .timeline-left {
      position: relative;
      width: 43%;

      @media (max-width: 767px) {
        display: none;
      }

      .image-wrapper {
        position: sticky;
        top: 25%;
        aspect-ratio: 600 / 350;

        img {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          opacity: 0;
          transition: opacity .5s ease;
          will-change: opacity;
        }

        img.active {
          opacity: 1;
        }
      }
    }

    /* テキストスライド */
    .timeline-right {
      width: 50%;

      @media (max-width: 767px) {
        width: 100%;
      }

      .text-block {
        position: relative;
        margin-bottom: 40vh;
        padding-top: 20px;
        padding-left: 80px;

        @media (max-width: 767px) {
          margin-bottom: 80px;
        }

        .num {
          position: absolute;
          left: -40px;
          top: 0;
          width: 80px;
          height: 80px;
          border-radius: 50%;
          background: linear-gradient(0deg, rgba(227, 216, 185, 1) 0%, rgba(175, 155, 118, 1) 100%);
          font-size: 30px;
          padding: 3px;
          text-align: center;
          z-index: 2;

          @media (max-width: 767px) {
            left: 0;
            width: 54px;
            height: 54px;
            font-size: 22px;
          }

          span {
            display: block;
            background-color: #fff;
            border-radius: 50%;
            height: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
            transition: background-color .3s, color .3s;
          }
        }

        .num.current {
          span {
            color: #fff;
            background-color: #2E434A;
          }
        }

        .ttl {
          font-weight: 500;
          font-size: clamp(20px, 17.573px + 0.647vw, 30px);
          margin: 0 0 30px;
          letter-spacing: 0.1em;

          &::after {
            content: "";
            display: block;
            width: clamp(40px, 35.146px + 1.294vw, 60px);
            height: 1px;
            border-top: 1px #A28C5B solid;
            margin-top: 20px;
          }
        }

        .txt {
          font-size: clamp(14px, 13.029px + 0.259vw, 18px);
          line-height: 2;
          margin: 0;
        }

        .sp_img {
          display: none;

          @media (max-width: 767px) {
            display: block;
            margin-top: 30px;
          }
        }

        &:first-child {
          margin-top: 20vh;

          @media (max-width: 767px) {
            margin-top: 0
          }
        }

        &:last-child {
          margin-bottom: 20vh;

          @media (max-width: 767px) {
            margin-bottom: 0
          }
        }
      }
    }

    /* タイムラインバー */
    .timeline-bar {
      position: absolute;
      left: 50%;
      width: 1px;
      background: #C6C1B5;

      @media (max-width: 767px) {
        left: calc(5% + 26px);
      }

      .timeline-progress {
        width: 100%;
        height: 0;
        background: #7B6023;
        transition: height .1s ease;
      }
    }
  }
}

/*--- access ---*/
.top_access {
  padding-top: clamp(100px, 75.728px + 6.472vw, 200px);

  .sec_ttl {
    font-weight: 500;
    font-size: clamp(22px, 15.204px + 1.812vw, 50px);
    text-align: center;
    letter-spacing: 0.1em;
    margin: 0 0 clamp(40px, 35.146px + 1.294vw, 60px);

    .ja {
      color: #7B6023;
      font-size: clamp(14px, 11.330px + 0.712vw, 25px);
      margin: clamp(0px, -2.427px + 0.647vw, 10px) 0 0;
      letter-spacing: 0;
    }

    .en {
      font-family: var(--font-en);
    }
  }

  .map_illust {
    max-width: 800px;
    width: 100%;
    margin: 0 auto;
  }

  .btn_access {
    display: flex;
    justify-content: center;
    margin-top: clamp(20px, 15.146px + 1.294vw, 40px);
  }

  .access_area {
    margin: 0 0 clamp(20px, 15.146px + 1.294vw, 40px);

    .access {
      margin: 0;
      line-height: 1.8;
      font-size: clamp(13px, 11.786px + 0.324vw, 18px);
      text-align: center;

      @media (max-width: 767px) {
        margin-top: 0;
      }
    }
  }
}

.btn_access {
  a {
    position: relative;
    padding: 10px 20px 10px 0;
    border-bottom: 1px #000 solid;
    font-size: clamp(13px, 11.786px + 0.324vw, 18px);

    @media (max-width: 767px) {
      padding-bottom: 5px;
    }

    &::after {
      content: "";
      position: absolute;
      top: 50%;
      right: 0;
      transform: translateY(-50%);
      background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12.865' height='12.869' viewBox='0 0 12.865 12.869'%3E%3Cg id='グループ_1075' data-name='グループ 1075' transform='translate(-1098.521 -1365.5)'%3E%3Cpath id='パス_202' data-name='パス 202' d='M18718.025-8545.984l12-12' transform='translate(-17619.15 9924)' fill='none' stroke='%23000' stroke-width='1'/%3E%3Cpath id='パス_203' data-name='パス 203' d='M18737.934-8587h10v10' transform='translate(-17637.047 9953)' fill='none' stroke='%23000' stroke-width='1'/%3E%3C/g%3E%3C/svg%3E%0A") center center / contain no-repeat;
      width: clamp(9px, 8.272px + 0.194vw, 12px);
      height: clamp(9px, 8.272px + 0.194vw, 12px);
      display: inline-block;
      transition: ease-in .2s;
    }

    &:hover {
      &::after {
        right: -5px;
      }
    }
  }
}

/*--- contact ---*/
.common_contact {
  position: relative;
  z-index: 0 !important;

  .common_contact_bg {
    height: 31.25vw;

    @media (max-width: 767px) {
      height: 340px;
    }
  }

  .common_contact_inner {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    max-width: 1536px;
    width: 84%;
    height: 100%;
    display: flex;
    align-items: center;

    @media (max-width: 767px) {
      width: 100%;
    }

    .contact_box {
      background-color: rgba(255, 255, 255, 0.6);
      backdrop-filter: blur(20px) brightness(120%);
      -webkit-backdrop-filter: blur(20px) brightness(120%);
      max-width: 600px;
      width: 50%;
      aspect-ratio: 600 / 280;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 20px;

      @media (max-width: 767px) {
        max-width: 400px;
        width: 80%;
        height: 150px;
        margin: auto auto 40px;
        gap: 10px;
      }

      .ttl {
        font-family: var(--font-en);
        font-size: clamp(22px, 15.204px + 1.812vw, 50px);
        text-align: center;
        margin: 0;
      }

      .btn {
        background: linear-gradient(0deg, rgba(227, 216, 185, 1) 0%, rgba(175, 155, 118, 1) 100%);
        padding: 3px;

        a {
          display: block;
          max-width: 340px;
          width: 100%;
          text-align: center;
          background-color: #2E434A;
          font-size: clamp(14px, 12.544px + 0.388vw, 20px);
          color: #fff;
          padding: 12px 30px;

          @media (max-width: 767px) {
            min-width: 240px;
          }

          &:hover {
            background-color: #366372;
          }
        }
      }
    }
  }
}

.under_sec_ttl {
  margin: 0 0 clamp(40px, 30.291px + 2.589vw, 80px);
  text-align: center;

  .ttl_inner {
    font-weight: 500;
    font-size: clamp(22px, 16.667px + 0.694vw, 30px);
    line-height: 1.8;
    margin: 0;
  }

  &::after {
    content: "";
    width: clamp(40px, 35.146px + 1.294vw, 60px);
    height: 1px;
    border-top: 1px #7B6023 solid;
    display: block;
    margin: clamp(20px, 15.146px + 1.294vw, 40px) auto 0;
  }
}

.under_sec_ttl2 {
  margin: 0 0 clamp(40px, 30.291px + 2.589vw, 80px);
  text-align: center;
  font-weight: 500;
  font-size: clamp(22px, 17.631px + 1.165vw, 40px);
  letter-spacing: 0.1em;
}

/*----------------------------
アクセス
----------------------------*/
.page-access {
  .under_sec_ttl {
    .ttl_inner {
      font-size: clamp(22px, 17.631px + 1.165vw, 40px);
      letter-spacing: 0.1em;
    }
  }

  .access_address {
    margin-bottom: clamp(100px, 87.864px + 3.236vw, 150px);

    .hotel_img {
      max-width: 800px;
      width: 80%;
      margin: 0 auto clamp(20px, 15.146px + 1.294vw, 40px);
    }

    .address_area {
      margin-bottom: clamp(60px, 55.146px + 1.294vw, 80px);

      .address {
        font-size: clamp(14px, 11.330px + 0.712vw, 25px);
        text-align: center;
        margin: 0 0 clamp(20px, 15.146px + 1.294vw, 40px);
      }

      .btn_more {
        a {
          @media (max-width: 767px) {
            width: 200px;
          }
        }
      }
    }

    .map_area {
      .map_illust {
        max-width: 800px;
        width: 100%;
        margin: 0 auto;
      }

      .btn_access {
        margin-top: clamp(20px, 15.146px + 1.294vw, 40px);
        display: flex;
        justify-content: center;
      }
    }
  }

  /* 館内マップ */
  .facility_map {
    .map {
      img {
        @media (max-width: 767px) {
          max-width: 700px;
        }
      }
    }
  }
}

.heading_style1 {
  text-align: center;
  margin-bottom: clamp(40px, 30.291px + 2.589vw, 80px);

  .en {
    font-family: var(--font-en);
    font-size: clamp(30px, 22.718px + 1.942vw, 60px);
    letter-spacing: 0.1em;
    margin: 0;
  }

  .ja {
    font-weight: 500;
    font-size: clamp(14px, 11.330px + 0.712vw, 25px);
    color: #7B6023;
    letter-spacing: 0.1em;
    margin: 0;
  }
}

.txt {
  font-size: clamp(14px, 13.029px + 0.259vw, 18px);
  line-height: 1.8;
  margin: 0;
}

.heading_style2 {
  text-align: center;
  margin: 0 0 clamp(30px, 22.718px + 1.942vw, 60px);
  font-weight: 500;
  font-size: clamp(22px, 17.631px + 1.165vw, 40px);
  letter-spacing: 0.1em;

  &::after {
    content: "";
    display: block;
    width: 1px;
    height: clamp(35px, 26.505px + 2.265vw, 70px);
    border-left: 1px #A28C5B solid;
    margin: clamp(30px, 22.718px + 1.942vw, 60px) auto 0;
  }
}

/* 目次セクション */
.menu_index {
  display: flex;
  flex-wrap: wrap;
  gap: 1.56vw 2.08vw;

  @media (max-width: 767px) {
    flex-direction: column;
    gap: 20px;
  }

  .index_box {
    width: calc((100% - 2.08vw) / 2);
    display: flex;

    @media (max-width: 767px) {
      width: 100%;
    }

    a {
      position: relative;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      column-gap: 5px;
      width: 100%;
      background-color: #EDECE8;
      padding: clamp(15px, 11.359px + 0.971vw, 30px) clamp(45px, 34.078px + 2.913vw, 90px) clamp(15px, 11.359px + 0.971vw, 30px) clamp(20px, 15.146px + 1.294vw, 40px);
      border: 1px #A28C5B solid;
      font-size: clamp(18px, 16.301px + 0.453vw, 25px);

      small {
        display: inline-block;
        font-size: clamp(14px, 13.029px + 0.259vw, 18px);
      }

      &::after {
        content: "";
        position: absolute;
        top: 50%;
        right: clamp(15px, 11.359px + 0.971vw, 30px);
        transform: translateY(-50%);
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='31.365' height='16.104' viewBox='0 0 31.365 16.104'%3E%3Cpath id='パス_96' data-name='パス 96' d='M-5332.718,15293.313l14.822,14,15.178-14' transform='translate(5333.404 -15292.578)' fill='none' stroke='%23a28c5b' stroke-width='2'/%3E%3C/svg%3E%0A") center center / contain no-repeat;
        width: clamp(15px, 11.359px + 0.971vw, 30px);
        height: clamp(7px, 5.301px + 0.453vw, 14px);
        display: inline-block;
        transition: top 0.2s ease-in;
      }

      &:hover {
        opacity: 0.7;

        &::after {
          top: 55%;
        }
      }
    }
  }

  /* .index_box {
    width: calc((100% - 3.13vw) / 2);

    @media (max-width: 767px) {
      width: 100%;
    }

    a {
      display: block;
      position: relative;

      .menu_name {
        font-size: clamp(18px, 15.087px + 0.777vw, 30px);
      }

      .img {
        aspect-ratio: 570 / 250;
        overflow: hidden;

        img {
          width: 100%;
          height: 100%;
          object-fit: cover;
          transition: transform .6s ease;
        }
      }

      .btn {
        position: absolute;
        top: clamp(50px, -183.957px + 23.372vw, 190px);
        right: 1.04vw;
        z-index: 3;

        @media (max-width: 1000px) {
          top: 10vw;
        }

        @media (max-width: 767px) {
          top: 28vw;
          left: inherit;
          right: 2.67vw;
          bottom: inherit;
        }

        span {
          position: relative;
          width: 120px;
          height: 120px;
          background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='200.818' height='200.818' viewBox='0 0 200.818 200.818'%3E%3Cdefs%3E%3ClinearGradient id='linear-gradient' x1='0.5' x2='0.5' y2='1' gradientUnits='objectBoundingBox'%3E%3Cstop offset='0' stop-color='%23af9b76'/%3E%3Cstop offset='1' stop-color='%23e3d8b9'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg id='グループ_254' data-name='グループ 254' transform='translate(-255 -5001.585)'%3E%3Crect id='長方形_198' data-name='長方形 198' width='142' height='142' transform='translate(255 5101.995) rotate(-45)' fill='url(%23linear-gradient)'/%3E%3Crect id='長方形_197' data-name='長方形 197' width='136' height='136' transform='translate(355.166 5006) rotate(45)'/%3E%3C/g%3E%3C/svg%3E%0A") center center / cover no-repeat;
          display: flex;
          justify-content: center;
          align-items: center;
          color: #fff;
          font-family: var(--font-en);
          font-size: 15px;
          text-align: center;
          line-height: 1.3;

          @media (max-width: 767px) {
            width: 18.67vw;
            height: 18.67vw;
            font-size: 2.67vw;
          }

          &::after {
            content: "";
            position: absolute;
            left: 50%;
            bottom: 30px;
            transform: translateX(-50%);
            background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13.484' height='5.121' viewBox='0 0 13.484 5.121'%3E%3Cpath id='パス_77' data-name='パス 77' d='M-1117.507-12919.148h12.111l-5.047-4.238' transform='translate(1117.507 12923.77)' fill='none' stroke='%23fff' stroke-width='1'/%3E%3C/svg%3E%0A") center center / contain no-repeat;
            display: inline-block;
            width: 12px;
            height: 5px;
          }

          @media (max-width: 767px) {
            &::after {
              bottom: 4.6vw;
              width: 1.87vw;
              height: 0.8vw;
              background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8.344' height='3.322' viewBox='0 0 8.344 3.322'%3E%3Cpath id='パス_77' data-name='パス 77' d='M-1117.507-12920.947h6.971l-2.905-2.439' transform='translate(1117.507 12923.77)' fill='none' stroke='%23fff' stroke-width='1'/%3E%3C/svg%3E%0A");
            }
          }
        }
      }

      .box_name {
        margin: 0;
        background-color: #fff;
        font-size: clamp(18px, 15.087px + 0.777vw, 30px);
        padding: clamp(15px, 8.932px + 1.618vw, 40px) clamp(20px, 15.146px + 1.294vw, 40px);
      }

      &:hover {
        .img {
          img {
            transform: scale(1.05);
          }
        }
      }
    }
  } */
}

/* メニュー説明 */
.description_wrap {
  .sec_menu_description {
    padding: clamp(80px, 50.874px + 7.767vw, 200px) 0;

    .menu_img {
      max-width: 960px;
      width: 100%;
      margin: 0 auto clamp(40px, 35.146px + 1.294vw, 60px);
    }

    .contents_block {
      .ttl {
        position: relative;
        font-weight: 500;
        font-size: clamp(18px, 15.087px + 0.777vw, 30px);
        text-align: center;
        border-top: 1px #A28C5B solid;
        border-bottom: 1px #A28C5B solid;
        padding: 15px;
        margin: 0 0 clamp(30px, 27.573px + 0.647vw, 40px);

        &::before {
          content: "";
          position: absolute;
          top: 4px;
          left: 0;
          border-top: 1px #A28C5B solid;
          width: 100%;
          height: 1px;
        }

        &::after {
          content: "";
          position: absolute;
          bottom: 4px;
          left: 0;
          border-bottom: 1px #A28C5B solid;
          width: 100%;
          height: 1px;
        }

        small {
          display: inline-block;
          font-size: clamp(14px, 11.330px + 0.712vw, 25px);
          margin: auto;
        }
      }

      .ttl {

        &+.split_box,
        &+.price_group {
          margin-top: 0;
        }
      }

      .btn {
        max-width: 400px;
        width: 84%;
        margin: 40px auto 0;

        &+.notes {
          margin: 10px 0 0;
          text-align: center;
        }
      }

      &+.contents_block {
        margin-top: clamp(60px, 50.291px + 2.589vw, 100px);
      }

      small {
        display: block;
        font-size: clamp(12px, 11.029px + 0.259vw, 16px);
        margin-top: clamp(20px, 17.573px + 0.647vw, 30px);
      }

      /* 使用上の注意 */
      .split_box {
        background-color: #fff;
        padding: clamp(30px, 27.573px + 0.647vw, 40px) clamp(20px, 15.146px + 1.294vw, 40px);
        margin-top: clamp(40px, 35.146px + 1.294vw, 60px);

        .split_ttl {
          color: #7B6023;
          font-weight: 500;
          font-size: clamp(18px, 16.301px + 0.453vw, 25px);
          text-align: center;
          margin: 0 0 clamp(20px, 17.573px + 0.647vw, 30px);
        }
      }

      /* 効果・特徴 */
      .contents_split {
        display: flex;
        gap: 40px;
        margin-top: clamp(40px, 35.146px + 1.294vw, 60px);

        @media (max-width: 767px) {
          flex-direction: column;
          gap: 20px;
        }

        .split_box {
          width: calc((100% - 40px) / 2);
          margin-top: 0;

          @media (max-width: 767px) {
            width: 100%;
          }
        }
      }

      .price_group {
        margin-top: clamp(40px, 35.146px + 1.294vw, 60px);
      }
    }

    &:nth-child(even) {
      background-color: #F9F9F9;
    }
  }
}

.price_group {
  .price_box {
    border: 1px #A28C5B solid;
    background-color: #F9F9F9;

    .price_ttl {
      font-size: clamp(16px, 14.544px + 0.388vw, 22px);
      margin: 0;
      padding: clamp(20px, 17.573px + 0.647vw, 30px);
      background-color: #EDECE8;
    }

    .price_item {
      display: flex;

      @media (max-width: 767px) {
        flex-direction: column;
      }

      .price_description {
        font-size: clamp(14px, 13.029px + 0.259vw, 18px);
        color: #7B6023;
        margin: 0;
        padding: clamp(20px, 17.573px + 0.647vw, 30px);

        @media (max-width: 767px) {
          padding-bottom: 0;
        }
      }

      .amount_area {
        flex-shrink: 0;
        width: 340px;
        margin-left: auto;
        padding: clamp(20px, 17.573px + 0.647vw, 30px);

        @media (max-width: 767px) {
          width: 100%;
        }

        .price_amount {
          margin: 0;
          display: flex;
          justify-content: flex-end;
          font-size: clamp(14px, 13.029px + 0.259vw, 18px);

          &:has(span) {
            display: flex;
            justify-content: space-between;

            span {
              width: 50%;
              font-size: clamp(14px, 13.029px + 0.259vw, 18px);
              text-align: right;

              @media (max-width: 767px) {
                width: 68%;
              }
            }
          }

          &+.price_amount {
            margin-top: 10px;

            @media (max-width: 767px) {
              margin-top: 15px;
            }
          }
        }
      }

      &+.price_item {
        position: relative;

        &::before {
          content: "";
          position: absolute;
          top: 0;
          left: 3%;
          display: block;
          width: 94%;
          height: 1px;
          border-top: 1px #A28C5B dotted;
        }
      }
    }

    &+.price_box {
      margin-top: clamp(20px, 17.573px + 0.647vw, 30px);
    }
  }

  .price_notes {
    margin: 20px 0 0;
    font-size: clamp(12px, 11.029px + 0.259vw, 16px);

    &+.price_box {
      margin-top: clamp(20px, 17.573px + 0.647vw, 30px);
    }
  }

  &+.price_group {
    margin-top: clamp(60px, 50.291px + 2.589vw, 100px);
  }
}

/*----------------------------
ホテル連携プラン
----------------------------*/
.page-plan {
  .intro_index {
    .plan_index {
      display: flex;
      flex-wrap: wrap;
      gap: 3.13vw;

      @media (max-width: 767px) {
        gap: 30px;
      }

      .index_box {
        width: calc((100% - 6.26vw) / 3);
        display: flex;

        @media (max-width: 767px) {
          width: 300px;
          margin: auto;
        }

        a {
          display: flex;
          flex-direction: column;

          .img {
            aspect-ratio: 360 / 188;
            overflow: hidden;

            img {
              width: 100%;
              height: 100%;
              object-fit: cover;
            }
          }

          .plan_name {
            position: relative;
            display: flex;
            align-items: center;
            flex-grow: 1;
            flex-wrap: wrap;
            gap: 0 10px;
            font-size: clamp(18px, 16.301px + 0.453vw, 25px);
            background-color: #2E434A;
            color: #fff;
            margin: 0;
            padding: clamp(10px, 7.573px + 0.647vw, 20px) clamp(40px, 35.146px + 1.294vw, 60px) clamp(10px, 7.573px + 0.647vw, 20px) clamp(30px, 27.573px + 0.647vw, 40px);

            &::after {
              content: "";
              position: absolute;
              top: 50%;
              right: 20px;
              width: clamp(10px, 9.029px + 0.259vw, 14px);
              height: clamp(10px, 9.029px + 0.259vw, 14px);
              border: 0;
              border-bottom: solid 1px #fff;
              border-right: solid 1px #fff;
              transform: translateY(-50%) rotate(45deg);
              transition: transform 0.3s ease;
              flex-shrink: 0;
              margin-left: auto;
            }

            span {
              display: inline-block;
            }
          }

          &:hover {
            opacity: 0.8;
          }
        }
      }
    }
  }

  /* プラン詳細 */
  .sec_plan_detail {
    margin-top: clamp(80px, 63.010px + 4.531vw, 150px);

    /* セクションヘッダー */
    .section_heading {
      background: url("../img/plan/section-heading_bg.webp") center center / cover no-repeat;
      display: flex;
      max-width: calc(100% - ((100% - 1200px) / 2));
      width: 95%;
      margin-left: auto;
      margin-bottom: clamp(40px, 25.437px + 3.883vw, 100px);

      @media (max-width: 767px) {
        width: 100%;
        flex-direction: column;
      }

      .contents_area {
        padding: clamp(40px, 15.728px + 6.472vw, 140px) 3.13vw clamp(40px, 15.728px + 6.472vw, 140px) clamp(40px, 15.728px + 6.472vw, 140px);

        @media (max-width: 767px) {
          padding-right: clamp(40px, 15.728px + 6.472vw, 140px);
          padding-bottom: 30px;
        }

        .en {
          font-family: var(--font-en);
          font-size: clamp(12px, 10.544px + 0.388vw, 18px);
          color: #A28C5B;
          margin: 0 0 clamp(10px, 7.573px + 0.647vw, 20px);
        }

        .ja {
          font-weight: 500;
          font-size: clamp(22px, 15.204px + 1.812vw, 50px);
          letter-spacing: 0.1em;
          margin: 0 0 clamp(20px, 15.146px + 1.294vw, 40px);
          padding-bottom: clamp(20px, 17.573px + 0.647vw, 30px);
          border-bottom: 1px #A28C5B solid;

          span {
            display: inline-block;
            margin-right: 10px;
          }
        }
      }

      .img {
        width: 44%;
        margin-left: auto;
        flex-shrink: 0;

        @media (max-width: 767px) {
          width: 100%;
        }

        img {
          width: 100%;
          height: 100%;
          object-fit: cover;
        }
      }
    }

    .plan_box {
      background-color: #F9F9F9;
      max-width: 1200px;
      width: 84%;
      margin: auto;
      padding-bottom: clamp(30px, 17.864px + 3.236vw, 80px);

      .box_ttl {
        background: url("../img/plan/box_ttl_bg.webp") center center / cover no-repeat;
        color: #fff;
        position: relative;
        margin: 0 0 clamp(30px, 17.864px + 3.236vw, 80px);
        padding: clamp(15px, 6.505px + 2.265vw, 50px) 0;
        font-weight: 500;
        font-size: clamp(18px, 12.660px + 1.424vw, 40px);
        text-align: center;

        &::before {
          content: "";
          position: absolute;
          top: 10px;
          left: 0;
          width: 100%;
          height: 1px;
          border-top: 1px #D3CFC7 solid;
        }

        @media (max-width: 767px) {
          &::before {
            top: 4px;
          }
        }

        &::after {
          content: "";
          position: absolute;
          bottom: 10px;
          left: 0;
          width: 100%;
          height: 1px;
          border-bottom: 1px #D3CFC7 solid;
        }

        @media (max-width: 767px) {
          &::after {
            bottom: 4px;
          }
        }
      }

      .lead_area {
        margin-bottom: clamp(30px, 17.864px + 3.236vw, 80px);

        .table_style1 {
          margin-top: clamp(30px, 22.718px + 1.942vw, 60px);

          tr {
            td {
              &:last-child {
                text-align: left;
              }
            }
          }
        }

        .notes_area {
          margin-top: clamp(20px, 17.573px + 0.647vw, 30px);

          .notes {
            margin: 0;
          }
        }
      }

      .plan_block {
        .block_ttl {
          font-weight: 500;
          font-size: clamp(16px, 13.816px + 0.583vw, 25px);
          margin: 0 0 clamp(15px, 8.932px + 1.618vw, 40px);

          .category {
            display: inline-block;
            background-color: #A28C5B;
            font-size: clamp(14px, 11.330px + 0.712vw, 25px);
            color: #fff;
            margin-right: 20px;
            padding: 4px 20px;

            @media (max-width: 767px) {
              display: block;
              width: fit-content;
              padding: 3px 10px;
              margin-right: 0;
              margin-bottom: 10px;
            }
          }
        }

        .block_img {
          margin-bottom: clamp(30px, 27.573px + 0.647vw, 40px);
        }

        .notes_area {
          display: flex;
          justify-content: space-between;
          gap: 20px;
          margin-top: clamp(10px, 7.573px + 0.647vw, 20px);

          @media (max-width: 767px) {
            flex-direction: column;
          }

          .notes {
            margin: 0;
            font-size: clamp(12px, 11.029px + 0.259vw, 16px);
          }

          .btn_more {
            flex-shrink: 0;

            a {
              padding-left: 50px;

              @media (max-width: 767px) {
                width: 200px;
                padding: 8px 40px;
                text-align: center;
              }
            }
          }
        }

        &+.plan_block {
          margin-top: 60px;
        }
      }

      .schedule_block {
        margin-top: clamp(60px, 50.291px + 2.589vw, 100px);

        .schedule_list {
          position: relative;
          list-style: none;
          margin: 0;
          padding: 0;

          &::before {
            content: "";
            position: absolute;
            top: 0;
            left: 62px;
            width: 6px;
            height: 100%;
            background-color: #DCD7C9;
          }

          @media (max-width: 767px) {
            &::before {
              left: 20px;
              width: 4px;
            }
          }

          .schedule_item {
            display: flex;
            gap: clamp(20px, 17.573px + 0.647vw, 30px);

            @media (max-width: 767px) {
              flex-direction: column;
            }

            .img {
              position: relative;
              width: 130px;
              /* aspect-ratio: 300 / 170; */
              flex-shrink: 0;

              @media (max-width: 767px) {
                width: 110px;
              }

              img {
                display: none;
                width: 100%;
                height: 100%;
                object-fit: cover;
              }

              .time {
                position: absolute;
                top: 0;
                left: 0;
                display: inline-block;
                background-color: #A28C5B;
                color: #fff;
                font-size: clamp(16px, 15.029px + 0.259vw, 20px);
                padding: 4px;
                text-align: center;
                width: 100%;
              }
            }

            .contents_area {
              display: flex;
              flex-direction: column;
              gap: 20px;
              justify-content: center;

              @media (max-width: 767px) {
                padding-left: 50px;
                padding-top: 30px;
              }

              .ttl {
                margin: 0;
                font-weight: 500;
                font-size: clamp(18px, 16.301px + 0.453vw, 25px);
                color: #7B6023;
              }
            }

            &+.schedule_item {
              margin-top: 40px;
            }
          }
        }

        .notes {
          font-size: clamp(12px, 11.029px + 0.259vw, 16px);
          margin: 30px 0 0;

          @media (max-width: 767px) {
            margin-top: 40px;
          }
        }
      }

      /* 朝食スタイル */
      .breakfast_style {
        display: grid;
        grid-template-columns: 1fr 27%;
        grid-template-rows: auto 1fr;
        column-gap: 30px;

        @media (max-width: 767px) {
          display: flex;
          flex-direction: column;
        }

        .ttl {
          grid-column: 1;
          grid-row: 1;
          display: flex;
          align-items: baseline;
          font-weight: 500;
          font-size: clamp(18px, 16.301px + 0.453vw, 25px);
          color: #7B6023;
          margin: 0 0 clamp(15px, 13.786px + 0.324vw, 20px);
          padding-bottom: 10px;
          border-bottom: 1px #A28C5B solid;

          @media (max-width: 767px) {
            flex-direction: column;
            position: relative;
            padding-left: 25px;
            padding-bottom: 15px;
          }

          .num {
            display: inline-block;
            font-family: var(--font-en);
            font-size: clamp(25px, 22.573px + 0.647vw, 35px);
            margin-right: 5px;
            line-height: 1;

            @media (max-width: 767px) {
              position: absolute;
              top: 3px;
              left: 0;
            }
          }

          .time {
            font-weight: normal;
            font-size: clamp(14px, 13.029px + 0.259vw, 18px);
            background-color: #EDECE8;
            padding: 1px 10px 3px;
            margin-left: auto;

            @media (max-width: 767px) {
              display: block;
              width: fit-content;
              margin-left: 0;
              margin-top: 10px;
            }
          }
        }

        .txt {
          grid-column: 1;
          grid-row: 2;

          small {
            font-size: clamp(12px, 11.029px + 0.259vw, 16px);
            line-height: 1.5;
            display: block;
            margin-top: 10px;
          }
        }

        .img {
          grid-column: 2;
          grid-row: 1 / 3;

          @media (max-width: 767px) {
            width: 260px;
            margin: 20px auto 0;
          }
        }

        &+.breakfast_style {
          margin-top: clamp(40px, 35.146px + 1.294vw, 60px);
        }
      }
    }

    .plan_box:has(.plan_options) {
      padding-bottom: 0;
    }

    .plan_options {
      background-color: #EDECE8;
      margin-top: clamp(40px, 25.437px + 3.883vw, 100px);
      padding: clamp(20px, 15.146px + 1.294vw, 40px) 0;

      .list_diamond {
        &>li {
          small {
            font-size: clamp(12px, 11.029px + 0.259vw, 16px);

            @media (max-width: 767px) {
              display: block;
            }
          }
        }
      }
    }

    &+.plan_box {
      margin-top: clamp(80px, 75.146px + 1.294vw, 100px);
    }

    /* プランの詳細・予約はこちら */
    .plan_reservation {
      display: flex;
      max-width: 1200px;
      width: 84%;
      margin: clamp(60px, 50.291px + 2.589vw, 100px) auto 0;

      .contents_area {
        background-color: #2E434A;
        width: 56%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        @media (max-width: 767px) {
          width: 74%;
        }

        .ttl {
          font-size: clamp(16px, 12.602px + 0.906vw, 30px);
          color: #fff;
          margin: 0 0 clamp(10px, 3.932px + 1.618vw, 35px);
        }

        .btn {
          max-width: 345px;
          width: 70%;

          @media (max-width: 767px) {
            width: auto;
          }

          a {
            position: relative;
            display: block;
            border: 1px #fff solid;
            padding: 12px 30px;
            font-size: clamp(14px, 12.544px + 0.388vw, 20px);
            color: #fff;
            text-align: center;

            @media (max-width: 767px) {
              padding: 5px 30px 5px 13px;
            }

            &::after {
              content: "";
              position: absolute;
              top: 50%;
              right: 20px;
              transform: translateY(-50%);
              background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12.865' height='12.869' viewBox='0 0 12.865 12.869'%3E%3Cg id='グループ_844' data-name='グループ 844' transform='translate(-1098.521 -1365.5)'%3E%3Cpath id='パス_202' data-name='パス 202' d='M18718.025-8545.984l12-12' transform='translate(-17619.15 9924)' fill='none' stroke='%23fff' stroke-width='1'/%3E%3Cpath id='パス_203' data-name='パス 203' d='M18737.934-8587h10v10' transform='translate(-17637.047 9953)' fill='none' stroke='%23fff' stroke-width='1'/%3E%3C/g%3E%3C/svg%3E%0A") center center / contain no-repeat;
              width: clamp(10px, 9.272px + 0.194vw, 13px);
              height: clamp(10px, 9.272px + 0.194vw, 13px);
              display: inline-block;
              transition: right 0.2s ease-in;

              @media (max-width: 767px) {
                right: 9px;
              }
            }

            &:hover {
              background-color: #366372;

              &::after {
                right: 15px;

                @media (max-width: 767px) {
                  right: 9px;
                }
              }
            }
          }
        }
      }

      .img {
        width: 44%;

        @media (max-width: 767px) {
          width: 26%;
        }
      }
    }

    /* まとめセクション */
    .more_plans {
      text-align: center;
      margin-top: clamp(60px, 50.291px + 2.589vw, 100px);
    }
  }
}

/*----------------------------
その他の治療
----------------------------*/
.page-other-treatment {
  main {
    background: none;
    padding-bottom: 0;
  }

  .lead_area {
    margin-bottom: clamp(80px, 50.874px + 7.767vw, 200px);
  }
}

/*----------------------------
美容医療
----------------------------*/
.page-aesthetic-medicine {
  main {
    padding-bottom: 0;
  }

  .lead_area {
    margin-bottom: clamp(80px, 50.874px + 7.767vw, 200px);

    .txt {
      small {
        font-size: clamp(12px, 11.515px + 0.129vw, 14px);
        display: block;
        margin-top: 30px;
      }
    }
  }

  .intro_index {
    .menu_index {
      &+.txt {
        margin-top: clamp(60px, 50.291px + 2.589vw, 100px);
        margin-bottom: clamp(30px, 27.573px + 0.647vw, 40px);
        text-align: center;
      }
    }

    .btn_more2 {
      max-width: 400px;
      width: 90%;
      margin: auto;
    }
  }

  .sec_menu_description {
    .contents_card {
      flex-direction: column;

      .card {
        width: 100%;
      }
    }
  }
}

/*----------------------------
美容点滴
----------------------------*/
.page-beauty-drip {
  main {
    padding-bottom: 0;
  }

  .description_wrap {
    &:first-child {
      padding-top: 0;
    }

    &:nth-of-type(even) {
      background-color: #F4F4F4;
    }
  }
}

/*----------------------------
共通
----------------------------*/
.description_wrap {
  .sec_menu_description {
    .lead {
      text-align: center;
      margin-bottom: clamp(40px, 25.437px + 3.883vw, 100px);

      @media (max-width: 767px) {
        text-align: left;
      }
    }

    /* &+.sec_menu_description {
      margin-top: clamp(100px, 75.728px + 6.472vw, 200px);
    } */
  }
}

.contents_card {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 3.13vw;

  @media (max-width: 767px) {
    gap: 20px;
  }

  .card {
    display: flex;
    flex-direction: column;
    gap: clamp(20px, 17.573px + 0.647vw, 30px);
    width: calc((100% - 3.13vw) / 2);
    background-color: #fff;
    outline: 1px #DCD7C9 solid;
    outline-offset: -6px;
    padding: clamp(30px, 25.146px + 1.294vw, 50px);

    @media (max-width: 767px) {
      outline-offset: -4px;
      width: 100%;
    }

    .ttl {
      font-weight: 500;
      font-size: clamp(18px, 15.087px + 0.777vw, 30px);
      text-align: center;
      margin: 0;

      &::after {
        content: "";
        width: clamp(40px, 35.146px + 1.294vw, 60px);
        height: 1px;
        border-top: 1px #A28C5B solid;
        display: block;
        margin: clamp(15px, 13.786px + 0.324vw, 20px) auto 0;
      }

      small {
        display: block;
        font-size: clamp(14px, 12.058px + 0.518vw, 22px);
      }
    }

    .img {
      max-width: 600px;
      width: 100%;
      margin: 0 auto clamp(20px, 15.146px + 1.294vw, 40px);
    }

    .txt {
      small {
        font-size: 14px;
        line-height: 1.5;
        display: block;
        margin-top: clamp(15px, 13.786px + 0.324vw, 20px);
      }
    }

    .btn_more2 {
      margin: auto auto 0;
      max-width: 300px;
    }
  }
}

/*----------------------------
旅行医学
----------------------------*/
.page-travel-medicine {
  main {
    padding-bottom: 0;
  }

  .intro_index {
    margin-top: clamp(100px, 75.728px + 6.472vw, 200px);
  }

  .vaccine_table_wrap {
    .scroll_table {
      margin-top: clamp(40px, 35.146px + 1.294vw, 60px);

      .vaccine_table {
        border-collapse: collapse;
        min-width: 700px;
        width: 100%;

        thead {
          tr {
            th {
              background-color: #A28C5B;
              color: #fff;
              font-weight: 500;
              font-size: clamp(14px, 13.029px + 0.259vw, 18px);
              padding: 20px 15px;
              border-right: 1px #fff solid;

              @media (max-width: 767px) {
                padding: 10px 15px;
              }

              &:last-child {
                border-right: none;
              }

              &:first-child {
                @media (max-width: 767px) {
                  width: 150px;
                }
              }
            }

            .sticky-col {
              background-color: #A28C5B;
            }
          }
        }

        tbody {
          &:nth-of-type(odd) {
            background-color: #F4F4F4;

            .sticky-col {
              background-color: #F4F4F4;
            }
          }

          &:nth-of-type(even) {
            background-color: #EDECE8;

            .sticky-col {
              background-color: #EDECE8;
            }
          }

          tr {

            th,
            td {
              border: 1px solid #A28C5B;
              /* background-color: #F4F4F4; */
              font-weight: 500;
              font-size: clamp(14px, 13.029px + 0.259vw, 18px);
              word-break: break-word;
              padding: 20px 15px;

              @media (max-width: 767px) {
                padding: 10px 15px;
              }
            }
          }
        }

        .sticky-col {
          position: sticky;
          left: 0;
          z-index: 3;
        }
      }

      .scroll-hint-icon-wrap {
        z-index: 4;
      }
    }

    .notes {
      font-size: clamp(12px, 11.029px + 0.259vw, 16px);
      margin: 20px 0 0;
    }
  }

  .description_wrap {
    .sec_menu_description {
      .contents_block {
        .price_group {
          &>.ttl {
            margin-top: clamp(60px, 50.291px + 2.589vw, 100px);
          }
        }
      }
    }
  }
}

/*----------------------------
先制医療検査
----------------------------*/
.page-preemptive {
  main {
    padding-bottom: 0;
  }

  .intro_index {
    margin-top: clamp(100px, 75.728px + 6.472vw, 200px);
  }

  .sec_preemptive_detail {
    .lead {
      text-align: center;
      margin-bottom: clamp(40px, 25.437px + 3.883vw, 100px);

      @media (max-width: 767px) {
        text-align: left;
      }
    }
  }

  .sec_ingredients_drip {
    margin-top: clamp(100px, 75.728px + 6.472vw, 200px);
  }
}

/*----------------------------
オンライン診療
----------------------------*/
.page-online {
  .sec_intro {
    .online_icon_list {
      margin-top: clamp(40px, 35.146px + 1.294vw, 60px);

      .row {
        width: 100%;
        margin: 0 auto;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;

        .online_icon_item {
          width: calc(100% / 3);

          .img {
            background-color: #F0EFED;
            border: 1px #A28C5B solid;
            border-radius: 15px;
            display: flex;
            align-items: center;
            justify-content: center;
            max-width: 230px;
            width: 80%;
            margin: auto;
            aspect-ratio: 1;

            @media (max-width: 767px) {
              border-radius: 10px;
            }

            img {
              max-width: 180px;
              width: 80%;
            }
          }

          .label {
            font-weight: 500;
            font-size: clamp(13px, 10.087px + 0.777vw, 25px);
            color: #7B6023;
            text-align: center;
            margin: clamp(10px, 7.573px + 0.647vw, 20px) 0 0;
          }
        }

        &+.row {
          margin-top: 3.13vw;
        }

        &:first-child {
          @media (max-width: 767px) {
            gap: 10px;
          }
        }
      }
    }
  }

  .sec_online_flow {
    margin-top: clamp(100px, 75.728px + 6.472vw, 200px);

    .swiper_online_flow {
      position: relative;

      .swiper-wrapper {
        .swiper-slide {
          display: flex;
          gap: 3.13vw;

          @media (max-width: 767px) {
            flex-direction: column;
          }

          .contents_area {
            .step_num {
              font-family: var(--font-en);
              font-weight: 500;
              font-size: clamp(20px, 15.146px + 1.294vw, 40px);
              color: #7B6023;
              margin: 0;

              .num {
                font-family: var(--font-en);
                font-weight: 500;
                font-size: clamp(40px, 35.146px + 1.294vw, 60px);
                margin-left: 10px;
              }
            }

            .ttl {
              font-weight: 500;
              font-size: clamp(22px, 20.058px + 0.518vw, 30px);
              margin: 0 0 clamp(20px, 15.146px + 1.294vw, 40px);
            }

            .txt_area {
              .download_area {
                margin-top: clamp(20px, 15.146px + 1.294vw, 40px);
                display: flex;
                gap: clamp(15px, 13.786px + 0.324vw, 20px);

                a {
                  display: inline-block;
                  max-width: 200px;
                  width: 50%;

                  &:hover {
                    opacity: 0.7;
                  }
                }
              }
            }
          }

          .img {
            max-width: 400px;
            width: 40%;
            flex-shrink: 0;
            margin-left: auto;

            @media (max-width: 767px) {
              width: 75%;
              margin: 30px auto 0;
            }

            img {
              border-radius: 10px;
            }
          }
        }
      }
    }

    .navigation_wrap {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 50%;

      @media (max-width: 767px) {
        width: 100%;
        position: relative;
      }
    }
  }
}

.sec_faq {
  margin-top: clamp(100px, 75.728px + 6.472vw, 200px);

  .faq_list {
    list-style: none;
    margin: 0;
    padding: 0;

    .faq_item {
      .faq_q {
        position: relative;
        background-color: #2E434A;
        color: #fff;
        font-size: clamp(16px, 13.816px + 0.583vw, 25px);
        margin: 0;
        padding: clamp(20px, 17.573px + 0.647vw, 30px) clamp(45px, 36.505px + 2.265vw, 80px) clamp(20px, 17.573px + 0.647vw, 30px) clamp(55px, 50.146px + 1.294vw, 75px);

        &::before {
          content: "Q.";
          position: absolute;
          top: clamp(17px, 13.845px + 0.841vw, 30px);
          left: clamp(15px, 11.359px + 0.971vw, 30px);
          font-family: var(--font-en);
          font-size: 30px;
          line-height: 1;
          color: #A28C5B;
        }

        &::after {
          content: "";
          position: absolute;
          top: 50%;
          right: clamp(15px, 11.359px + 0.971vw, 30px);
          width: clamp(10px, 7.573px + 0.647vw, 20px);
          height: clamp(10px, 7.573px + 0.647vw, 20px);
          border: 0;
          border-bottom: solid 1px #fff;
          border-right: solid 1px #fff;
          transform: translateY(-50%) rotate(45deg);
          transition: transform 0.3s ease;
        }

        &.show {
          &::after {
            transform: translateY(-50%) rotate(-135deg);
          }
        }
      }

      .faq_a {
        display: none;
        background-color: #fff;
        margin-top: 10px;
        padding: clamp(20px, 17.573px + 0.647vw, 30px) clamp(20px, 15.146px + 1.294vw, 40px);
      }

      &+.faq_item {
        margin-top: clamp(30px, 22.718px + 1.942vw, 60px);
      }
    }
  }
}

.swiper_navigation_area {
  position: relative;
  height: 60px;
  width: 300px;
  margin-left: auto;
  margin-top: 30px;
  width: 100%;

  .swiper-button-prev,
  .swiper-button-next {
    position: absolute;
    background-color: #A28C5B;
    border: 1px #A28C5B solid;
    width: clamp(40px, 37.573px + 0.647vw, 50px);
    height: clamp(40px, 37.573px + 0.647vw, 50px);
    border-radius: 100px;
    top: 50%;

    &::after {
      color: #fff;
      font-size: clamp(18px, 17.515px + 0.129vw, 20px);
      font-weight: 500;
    }

    &.swiper-button-disabled {
      opacity: 1;
      background-color: transparent;

      &::after {
        color: #A28C5B;
      }
    }
  }

  .swiper-button-prev {
    left: inherit;
    right: 60px;
  }

  .swiper-button-next {
    right: 0;
    left: inherit;
  }

  .swiper-pagination {
    display: flex;
    top: 50%;
    transform: translateY(-50%);
    z-index: 0;

    .swiper-pagination-bullet {
      opacity: 1;
      background: #D9D9D9;
      width: 12px;
      height: 12px;
      margin: 0 7px;
    }

    .swiper-pagination-bullet-active {
      background: #A28C5B;
    }
  }
}

/*----------------------------
プライバシーポリシー
----------------------------*/
.page-privacypolicy {
  .sec_privacypolicy {
    .ttl {
      font-size: clamp(16px, 13.816px + 0.583vw, 25px);
      color: #7B6023;
      border-bottom: 1px #7B6023 solid;
      margin: 0 0 clamp(15px, 11.359px + 0.971vw, 30px);
      padding-bottom: clamp(6px, 5.029px + 0.259vw, 10px);
    }

    .txt {
      margin-bottom: clamp(40px, 30.291px + 2.589vw, 80px);

      &:last-child {
        margin-bottom: 0;
      }
    }
  }
}

/*----------------------------
各種保険制度
----------------------------*/
.page-insurance-systems {
  .sec_insurance {
    .ttl {
      font-size: clamp(16px, 13.816px + 0.583vw, 25px);
      color: #7B6023;
      border-bottom: 1px #7B6023 solid;
      margin: 0 0 clamp(15px, 11.359px + 0.971vw, 30px);
      padding-bottom: clamp(6px, 5.029px + 0.259vw, 10px);
    }

    .txt {
      margin-bottom: clamp(40px, 30.291px + 2.589vw, 80px);

      &:last-child {
        margin-bottom: 0;
      }
    }
  }
}

/*----------------------------
クリニックのご案内
----------------------------*/
.page-clinic {
  .sec_about_index {
    overflow: hidden;

    .about_index {
      display: flex;
      align-items: center;
      gap: 5.73vw;

      @media (max-width: 767px) {
        flex-direction: column-reverse;
        gap: 50px;
      }

      .img {
        max-width: 680px;
        width: 55%;

        @media (max-width: 767px) {
          width: 100%;
        }
      }

      .index_list {
        list-style: none;
        margin: 0;
        padding: 0;
        width: 290px;

        @media (max-width: 767px) {
          width: 300px;
        }

        .index_item {
          width: 100%;

          a {
            position: relative;
            display: block;
            border-bottom: 1px #A28C5B solid;
            font-size: clamp(16px, 13.816px + 0.583vw, 25px);
            padding: clamp(20px, 17.573px + 0.647vw, 30px) 20px clamp(20px, 17.573px + 0.647vw, 30px) 10px;
            overflow: hidden;

            span {
              position: relative;
              z-index: 1;
            }

            &::before {
              content: "";
              position: absolute;
              top: 0;
              left: 0;
              width: 0;
              height: 100%;
              background-color: #EDECE8;
              z-index: 0;
              transition: width 0.4s ease-in-out;
            }

            &::after {
              content: "";
              position: absolute;
              right: 10px;
              top: 50%;
              width: 8px;
              height: 8px;
              border: 0;
              border-top: solid 2px #A28C5B;
              border-right: solid 2px #A28C5B;
              transform: translateY(-50%) rotate(45deg);
              transition: right 0.2s ease-in;
            }

            &:hover {
              &::before {
                width: 100%;
              }

              &::after {
                right: 5px;
              }
            }
          }

          &+.index_item {
            margin-top: clamp(0px, -7.282px + 1.942vw, 30px);
          }
        }
      }
    }

    .loop_obj {
      overflow: hidden;
      width: 100vw;
      height: 5.47vw;

      @media (max-width: 767px) {
        width: 300vw;
        height: 20vw;
      }
    }

    .loop_track {
      display: flex;
      animation: img-scroll 20s linear infinite;
      will-change: transform;
      backface-visibility: hidden;
    }

    .loop_track img {
      display: block;
      width: 100vw;
      height: 100%;
      object-fit: cover;
      margin-right: 20px;

      @media (max-width: 767px) {
        width: 300vw;
      }
    }
  }

  .sec_medical_hours {
    margin-top: clamp(20px, 0.583px + 5.178vw, 100px);
    margin-bottom: clamp(100px, 75.728px + 6.472vw, 200px);

    .time_txt {
      font-weight: 500;
      font-size: clamp(16px, 13.816px + 0.583vw, 25px);
      color: #7B6023;
      margin: 0 0 clamp(15px, 11.359px + 0.971vw, 30px);
      letter-spacing: 0.1em;
    }

    .medical_hours_table {
      width: 100%;
      border: 1px #A28C5B solid;

      thead {
        tr {
          background-color: #EDECE8;
          display: flex;
          padding: clamp(15px, 11.359px + 0.971vw, 30px) clamp(0px, -24.272px + 6.472vw, 100px);

          td {
            width: calc(100% / 8);
            font-weight: 500;
            font-size: clamp(16px, 13.816px + 0.583vw, 25px);
            color: #7B6023;
            text-align: center;
          }
        }
      }

      tbody {
        tr {
          background-color: #F9F9F9;
          display: flex;
          padding: clamp(15px, 11.359px + 0.971vw, 30px) clamp(0px, -24.272px + 6.472vw, 100px);

          td {
            width: calc(100% / 8);
            font-weight: 500;
            font-size: clamp(16px, 13.816px + 0.583vw, 25px);
            color: #7B6023;
            text-align: center;
          }
        }
      }
    }
  }

  .sec_guide {
    margin-top: clamp(100px, 75.728px + 6.472vw, 200px);

    .guide_video {
      video {
        width: 100%;
      }
    }
  }
}

@keyframes img-scroll {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    transform: translate3d(-100vw, 0, 0);
  }
}

@media (max-width: 767px) {
  @keyframes img-scroll {
    from {
      transform: translate3d(0, 0, 0);
    }

    to {
      transform: translate3d(-300vw, 0, 0);
    }
  }
}

/*----------------------------
スタッフ紹介
----------------------------*/
.page-staff {
  .sec_staff {
    position: relative;
    z-index: 10;

    .staff_item {
      .section_heading {
        position: relative;
        background: url("../img/staff/staff_headin_bg.webp") center center / cover no-repeat;
        max-width: calc(100% - ((100% - 1200px) / 2));
        width: 92%;
        height: 19.27vw;
        display: flex;
        align-items: center;
        margin-left: auto;
        padding-left: 6.25vw;

        @media (max-width: 767px) {
          width: 100%;
          height: 150px;
          padding-right: 0;
          padding-left: 8vw;
        }

        .name_area {
          display: flex;
          align-items: flex-end;
          flex-wrap: wrap;
          gap: 10px 30px;
          margin-right: auto;

          @media (max-width: 767px) {
            flex-direction: column;
            align-items: flex-start;
            gap: 10px;
          }

          .sub_title {
            width: 100%;
            font-size: clamp(14px, 3.333px + 1.389vw, 30px);
            color: #fff;
            margin: 0;
          }

          .name {
            font-size: clamp(22px, 15.204px + 1.812vw, 50px);
            color: #fff;
            margin: 0;

            .position {
              font-size: clamp(16px, 11.388px + 1.23vw, 35px);
              padding-left: 10px;
            }
          }

          .name_en {
            font-size: clamp(12px, 10.058px + 0.518vw, 20px);
            color: #D6BE89;
            margin: 0 0 10px;

            @media (max-width: 767px) {
              margin-bottom: 0;
            }
          }
        }

        .img {
          position: absolute;
          right: clamp(0px, -186.667px + 24.306vw, 280px);
          bottom: 0;
          width: 26.04vw;

          @media (max-width: 767px) {
            max-width: 250px;
            width: 48vw;
          }
        }
      }

      .message {
        margin-top: clamp(40px, 35.146px + 1.294vw, 60px);
      }

      .career_area {
        display: flex;
        gap: 60px;
        margin-top: clamp(40px, 35.146px + 1.294vw, 60px);

        @media (max-width: 767px) {
          flex-direction: column;
        }

        .scroll_area {
          flex: 1;
          height: fit-content;
        }

        .modal_btn_area {
          width: 290px;
          flex-shrink: 0;
          display: flex;
          flex-direction: column;
          gap: 40px;

          @media (max-width: 767px) {
            width: 100%;
            flex-direction: row;
            gap: 20px 30px;
            flex-wrap: wrap;
          }

          .modal_btn {
            position: relative;
            font-size: clamp(18px, 16.301px + 0.453vw, 25px);
            padding-right: 35px;
            border-bottom: 1px #A28C5B solid;
            padding-bottom: clamp(10px, 7.573px + 0.647vw, 20px);
            cursor: pointer;

            @media (max-width: 767px) {
              width: calc((100% - 30px) / 2);
              padding-right: 30px;
            }

            &::after {
              content: "";
              position: absolute;
              top: 5px;
              right: 0;
              background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' viewBox='0 0 25 25'%3E%3Cg id='グループ_406' data-name='グループ 406' transform='translate(-1470.75 -1300.813)'%3E%3Ccircle id='楕円形_39' data-name='楕円形 39' cx='12.5' cy='12.5' r='12.5' transform='translate(1470.75 1300.813)' fill='%23af9b76'/%3E%3Cg id='グループ_395' data-name='グループ 395' transform='translate(353.75 -454.188)'%3E%3Cline id='線_170' data-name='線 170' x2='12' transform='translate(1123.5 1767.5)' fill='none' stroke='%23fff' stroke-width='2'/%3E%3Cline id='線_171' data-name='線 171' x2='12' transform='translate(1129.5 1761.5) rotate(90)' fill='none' stroke='%23fff' stroke-width='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A") center center / contain no-repeat;
              width: 25px;
              height: 25px;
              display: inline-block;
            }

            @media (max-width: 767px) {
              &::after {
                width: 17px;
                height: 17px;
              }
            }
          }
        }
      }

      &:nth-child(even) {
        .section_heading {
          background-image: url("../img/staff/staff_headin_bg_even.webp");
          /* flex-direction: row-reverse; */
          margin-left: inherit;
          margin-right: auto;
          padding-left: 43.75vw;
          padding-right: 6.25vw;

          @media (max-width: 767px) {
            padding-left: 50vw;
            padding-right: 8vw;
          }

          .img {
            right: inherit;
            left: clamp(0px, -186.667px + 24.306vw, 280px);
          }
        }
      }

      &+.staff_item {
        margin-top: clamp(100px, 41.748px + 15.534vw, 340px);
      }

      /* 野村悠スタイル */
      &.staff_yuu_nomura {
        /* .career_area {
          .modal_btn_area {
            flex-direction: row;
            width: 700px;
            margin-left: auto;

            @media (max-width: 767px) {
              width: 100%;
            }

            .modal_btn {
              width: calc((100% - 80px) / 3);

              @media (max-width: 767px) {
                width: calc(50% - 15px);
              }
            }
          }
        } */
      }

      /* 鍋島陽一スタイル */
      &.staff_yoichi_nabeshima {
        .section_heading {
          .name_area {
            .name_en {
              width: 100%;
              margin-top: 5px;
              margin-bottom: 0;
            }
          }
        }
      }
    }
  }
}

.scroll_area {
  background-color: #EBEBEB;
  padding: clamp(20px, 15.146px + 1.294vw, 40px) clamp(20px, 17.573px + 0.647vw, 30px) clamp(20px, 15.146px + 1.294vw, 40px) clamp(20px, 10.291px + 2.589vw, 60px);

  .scroll {
    overflow-y: scroll;
    height: 220px;
    padding-right: 20px;

    &::-webkit-scrollbar {
      width: 4px;
      background-color: transparent;
    }

    &::-webkit-scrollbar-thumb {
      background: #AF9B76;
      width: 4px;
      border-radius: 10px;
    }

    &::-webkit-scrollbar-track {
      background-color: #DFDEDB;
    }
  }

  .career_list {
    display: flex;
    flex-wrap: wrap;
    margin: 0;

    dt {
      color: #7B6023;
      font-size: clamp(14px, 13.029px + 0.259vw, 18px);
      width: 60px;
      margin: 15px 0 0;

      &:first-of-type {
        margin-top: 0;
      }
    }

    dd {
      font-size: clamp(14px, 13.029px + 0.259vw, 18px);
      width: calc(100% - 60px);
      margin: 15px 0 0;

      &:first-of-type {
        margin-top: 0;
      }
    }
  }
}

.modal {
  position: fixed;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 9999;
  transition:
    opacity .28s ease,
    visibility .28s step-end;
}

/* 開いたらアニメ開始 */
.modal.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition:
    opacity .28s ease,
    visibility .28s step-start;
}

/* オーバーレイ：フェード */
.modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .3);
  opacity: 0;
  transition: opacity .28s ease;
  will-change: opacity;
}

.modal.is-open .modal__overlay {
  opacity: 1;
}

.modal__panel {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, calc(-50% + 16px)) scale(.98);
  opacity: 0;
  max-width: 960px;
  width: 90%;
  background: #F9F9F9;
  padding: clamp(40px, 35.146px + 1.294vw, 60px) 0 clamp(40px, 27.864px + 3.236vw, 90px);
  transition:
    transform .36s cubic-bezier(.22, .61, .36, 1),
    opacity .28s ease,
    filter .36s ease;
  will-change: transform, opacity, filter;

  .modal__title {
    font-weight: 500;
    font-size: clamp(22px, 21.272px + 0.194vw, 25px);
    text-align: center;
    color: #7B6023;
    margin: 0 0 clamp(30px, 27.573px + 0.647vw, 40px);
  }

  .modal__sub-title {
    font-size: clamp(14px, 13.029px + 0.259vw, 18px);
    color: #000;
    text-align: center;
    margin: 10px auto 0;
    width: fit-content;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    &::before,
    &::after {
      content: "";
      width: 10px;
      height: 1px;
      border-bottom: 1px #000 solid;
      display: inline-block;
    }
  }

  .modal__body {
    padding: 0 2.6vw 0 7.5vw;

    .scroll_area {
      padding: 0;
      background-color: transparent;

      .scroll {
        height: 23.54vw;

        @media (max-width: 767px) {
          height: 50vh;
        }
      }
    }

    .introduce_list {
      list-style: none;
      margin: 0;
      padding: 0;

      .introduce_item {
        .pdf_ttl {
          display: flex;
          align-items: center;
          gap: 10px;
          margin: 0;

          &::before {
            content: "";
            background: url("../img/icon_pdf_brown.svg") center center / contain no-repeat;
            width: 22px;
            height: 24px;
            display: inline-block;
          }

          a {
            font-size: clamp(16px, 13.333px + 0.347vw, 20px);
            color: #7B6023;
            border-bottom: 1px #7B6023 solid;

            &:hover {
              border-bottom-color: transparent;
            }
          }
        }

        .sub_ttl {
          font-size: clamp(12px, 10.667px + 0.174vw, 14px);
          margin: 10px 0 0 30px;
        }

        &+.introduce_item {
          margin-top: clamp(30px, 27.573px + 0.647vw, 40px);
        }
      }
    }
  }
}

.modal.is-open .modal__panel {
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
  transition-delay: .02s;
}

.modal__close {
  position: absolute;
  right: clamp(15px, 11.359px + 0.971vw, 30px);
  top: clamp(15px, 11.359px + 0.971vw, 30px);
  border: 0;
  background: none;
  font-size: clamp(25px, 21.359px + 0.971vw, 40px);
  cursor: pointer;
  color: #A28C5B;
  padding: 0;
}

/*----------------------------
ご挨拶
----------------------------*/
.page-greeting {
  main {
    background: url("../img/greeting/philosophy_bg.webp") center bottom clamp(100px, 75.728px + 6.472vw, 200px) / contain no-repeat;

    @media (max-width: 767px) {
      background-size: 766px;
    }
  }

  .sec_message {
    .txt {
      &+.txt {
        margin-top: 25px;
      }
    }

    .name_area {
      text-align: right;
      margin-top: clamp(40px, 37.573px + 0.647vw, 50px);

      .signature {
        width: clamp(150px, 118.447px + 8.414vw, 280px);
        margin-top: clamp(10px, 7.573px + 0.647vw, 20px);
      }

      .signature_en {
        width: clamp(200px, 170.874px + 7.767vw, 320px);
        margin-top: clamp(15px, 13.786px + 0.324vw, 20px);
      }
    }
  }

  .sec_philosophy {
    margin-top: clamp(100px, 75.728px + 6.472vw, 200px);

    .philosophy_triangle_img {
      max-width: 570px;
      width: 90%;
      margin: 0 auto clamp(40px, 30.291px + 2.589vw, 80px);
    }

    .btn_more2 {
      width: clamp(300px, 275.728px + 6.472vw, 400px);
      margin: auto;

      &+.notes {
        margin: 10px 0 0;
        font-size: clamp(12px, 11.515px + 0.129vw, 14px);
        text-align: center;
      }
    }
  }
}

/*----------------------------
再生医療等
----------------------------*/
.page-regenerative-medicine {
  main {
    padding-bottom: 0;
  }

  .sec_our_plan {
    background: url("../img/regenerative-medicine/our-plan_bg.webp") center center / cover no-repeat;
    margin-top: clamp(80px, 63.010px + 4.531vw, 150px);
    padding-top: clamp(80px, 63.010px + 4.531vw, 150px);
    padding-bottom: clamp(80px, 63.010px + 4.531vw, 150px);

    .our_plan_inner {
      display: flex;
      gap: clamp(30px, 22.718px + 1.942vw, 60px);

      @media (max-width: 767px) {
        flex-direction: column;
      }

      .img {
        max-width: 455px;
        width: 40%;
        flex-shrink: 0;

        @media (max-width: 767px) {
          width: 70%;
          margin: auto;
        }
      }

      .contents_area {
        .plan_doc {
          margin-top: clamp(30px, 27.573px + 0.647vw, 40px);

          .ttl {
            position: relative;
            font-weight: 500;
            font-size: clamp(14px, 13.029px + 0.259vw, 18px);
            color: #7B6023;
            margin: 0 0 clamp(10px, 8.786px + 0.324vw, 15px);
            padding-left: clamp(15px, 13.786px + 0.324vw, 20px);

            &::before {
              content: "";
              position: absolute;
              top: 5px;
              left: 0;
              background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='16' viewBox='0 0 14 16'%3E%3Cpath id='多角形_5' data-name='多角形 5' d='M7,0l7,16H0Z' transform='translate(14 16) rotate(180)' fill='%237b6023'/%3E%3C/svg%3E%0A") center center / contain no-repeat;
              width: clamp(10px, 9.029px + 0.259vw, 14px);
              height: clamp(11px, 9.786px + 0.324vw, 16px);
              display: inline-block;
            }
          }

          .doc_list {
            list-style: none;
            margin: 0;
            padding: 0;
            display: flex;
            gap: 15px;

            @media (max-width: 767px) {
              gap: 7px
            }

            .doc_item {
              width: calc((100% - 45px) / 4);

              @media (max-width: 767px) {
                width: calc((100% - 21px) / 4);
              }

              .label {
                display: block;
                text-align: center;
                font-size: clamp(5px, 3.786px + 0.324vw, 10px);
                margin-top: clamp(5px, 3.786px + 0.324vw, 10px);
                color: #7B6023;
              }
            }
          }
        }
      }
    }
  }

  .sec_menu {
    max-width: 1536px;
    width: 84%;
    margin: auto;
    margin-top: clamp(80px, 50.874px + 7.767vw, 200px);
  }
}

/*----------------------------
連携医療施設
----------------------------*/
.page-alignment-facility {
  .sec_alignment_facility {
    .alignment_facility_list {
      list-style: none;
      margin: 0;
      padding: 0;

      .alignment_facility_item {
        display: flex;
        gap: clamp(20px, 15.146px + 1.294vw, 40px);

        @media (max-width: 767px) {
          flex-direction: column;
        }

        .img {
          max-width: 500px;
          width: 40%;
          flex-shrink: 0;

          @media (max-width: 767px) {
            width: 70%;
            margin: auto;
          }
        }

        .contents_area {
          width: 100%;

          .ttl {
            font-weight: 500;
            font-size: clamp(18px, 15.087px + 0.777vw, 30px);
            color: #7B6023;
            margin: 0 0 clamp(20px, 17.573px + 0.647vw, 30px);
            padding-bottom: clamp(10px, 7.573px + 0.647vw, 20px);
            border-bottom: 1px #7B6023 solid;
          }

          .lead {
            font-size: clamp(16px, 14.544px + 0.388vw, 22px);
            margin: 0 0 clamp(20px, 17.573px + 0.647vw, 30px);
          }

          .facility_info {
            background-color: #F9F9F9;
            padding: 20px clamp(20px, 17.573px + 0.647vw, 30px);

            .txt {
              a {
                display: inline-block;
              }

              &+.txt {
                margin-top: 10px;
              }
            }
          }
        }

        &+.alignment_facility_item {
          margin-top: clamp(60px, 50.291px + 2.589vw, 100px);
        }
      }
    }
  }
}

/* 進捗バー */
.form-stepbar {
  max-width: 500px;
  width: 70%;
  margin: 0 auto clamp(70px, 65.146px + 1.294vw, 90px);

  .form-stepbar__list {
    position: relative;
    display: flex;
    justify-content: space-between;
    list-style: none;
    margin: 0;
    padding: 0;

    .form-stepbar__item {
      display: flex;
      align-items: center;

      .num_wrap {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 15px;
        position: relative;

        @media (max-width: 767px) {
          gap: 5px;
        }

        .num {
          color: #C6C1B5;
          font-family: var(--font-en);
          font-weight: 500;
          font-size: clamp(25px, 21.359px + 0.971vw, 40px);
          border-radius: 100px;
          display: flex;
          align-items: center;
          justify-content: center;
        }

        .circle {
          display: block;
          position: relative;
          width: 26px;
          height: 26px;
          border-radius: 50px;

          @media (max-width: 767px) {
            width: 20px;
            height: 20px;
          }

          .circle_inner {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            display: block;
            background-color: #C6C1B5;
            width: 16px;
            height: 16px;
            border-radius: 50px;

            @media (max-width: 767px) {
              width: 12px;
              height: 12px;
            }
          }
        }
      }

      &.past {
        .num_wrap {
          .circle {
            border: 1px #C6C1B5 solid;
            background-color: #F4F4F4;
          }
        }
      }

      &.current {
        .num_wrap {
          .num {
            border-color: #856855;
            color: #A28C5B;
          }

          .circle {
            border: 1px #A28C5B solid;
            background-color: #F4F4F4;

            .circle_inner {
              background-color: #A28C5B;
            }
          }
        }
      }
    }

    &::before {
      content: "";
      position: absolute;
      bottom: 12px;
      left: 50%;
      transform: translateX(-50%);
      width: calc((100% - 30px));
      height: 1px;
      border-bottom: 2px #DCD7C9 solid;
    }

    @media (max-width: 767px) {
      &::before {
        bottom: 9px;
        width: calc((100% - 30px));
      }
    }
  }
}

/*----------------------------
お問い合わせ
----------------------------*/
.page-contact,
.page-contact-confirm {
  .sec_lead {
    margin-bottom: clamp(40px, 35.146px + 1.294vw, 60px);
  }

  .contact_replies {
    margin-bottom: clamp(60px, 50.291px + 2.589vw, 100px);

    .contact_replies_inner {
      background-color: #F9F9F9;
      padding: clamp(40px, 35.146px + 1.294vw, 60px) clamp(20px, 10.291px + 2.589vw, 60px);

      .ttl {
        font-weight: 500;
        font-size: clamp(18px, 16.301px + 0.453vw, 25px);
        color: #7B6023;
        text-align: center;
        margin: 0 0 clamp(30px, 27.573px + 0.647vw, 40px);
      }

      .txt {
        &+.txt {
          margin-top: 30px;
        }

        .color_red {
          color: #AA4500;
        }
      }
    }
  }

  /* フォーム */
  .contact_form {
    margin: 0;

    dt {
      margin: 0 0 clamp(15px, 11.359px + 0.971vw, 30px);

      p {
        font-size: clamp(16px, 13.816px + 0.583vw, 25px);
        margin: 0;

        small {
          font-size: clamp(12px, 11.515px + 0.129vw, 14px);
        }

        .required {
          font-size: clamp(12px, 10.544px + 0.388vw, 18px);
          color: #AA4500;
          margin-left: 10px;
        }
      }
    }

    dd {
      margin: 0;

      p {
        margin: 0;

        input[type="text"],
        input[type="date"],
        textarea {
          width: 100%;
          padding: 20px;
          font-size: clamp(16px, 15.029px + 0.259vw, 20px);
          border: none;
          border-radius: 10px;

          &:focus-visible {
            outline: none;
          }

          &::placeholder {
            color: #C6C1B5;
          }
        }

        .wpcf7-not-valid-tip {
          margin-top: 10px;
        }
      }

      &+dt {
        margin-top: clamp(30px, 22.718px + 1.942vw, 60px);
      }
    }
  }

  .privacypolicy_checkbox {
    margin-top: clamp(30px, 22.718px + 1.942vw, 60px);

    p {
      margin: 0;
      text-align: center;
    }
  }

  .submit_area {
    margin-top: clamp(30px, 22.718px + 1.942vw, 60px);

    .btn_submit {
      p {
        text-align: center;

        input[type=submit] {
          border: none;
          width: clamp(200px, 175.728px + 6.472vw, 300px);
          background: #2E434A;
          padding: 12px;
          font-size: clamp(16px, 13.816px + 0.583vw, 25px);
          color: #fff;
          cursor: pointer;
          transition: background 0.2s ease-in;

          @media (max-width: 767px) {
            padding: 10px;
          }

          &:hover {
            background: #366372;
          }
        }

        .wpcf7-spinner {
          display: none;
        }
      }
    }

    .btn_previous {
      margin-top: clamp(30px, 27.573px + 0.647vw, 40px);

      p {
        margin: 0;
        text-align: center;

        input {
          font-size: clamp(14px, 13.029px + 0.259vw, 18px);
          color: #2E434A;
          background: none;
          border: none;
          border-bottom: 1px #2E434A solid;
          padding: 0;
          cursor: pointer;
        }
      }
    }
  }
}

/*----------------------------
お問い合わせ入力内容確認
----------------------------*/
.page-contact-confirm {
  .form_area {
    .form-stepbar {
      margin-bottom: 60px;
    }

    .txt {
      text-align: center;
      margin-bottom: 60px;
    }

    /* フォーム */
    .contact_form {
      margin: 0;

      dt {
        p {
          color: #7B6023;
        }
      }

      dd {
        border-bottom: 1px #C6C1B5 solid;
        padding-bottom: clamp(20px, 15.146px + 1.294vw, 40px);

        p {
          font-size: clamp(16px, 15.029px + 0.259vw, 20px);
        }
      }
    }
  }
}

.page-thanks {
  .sec_thanks {
    .txt {
      text-align: center;
      margin-bottom: clamp(40px, 30.291px + 2.589vw, 80px);

      @media (max-width: 767px) {
        text-align: left;
      }
    }

    .btn_more {
      a {
        width: clamp(200px, 175.728px + 6.472vw, 300px);
        text-align: center;
        padding: clamp(10px, 9.515px + 0.129vw, 12px);

        &::after {
          display: none;
        }
      }
    }
  }
}

/*----------------------------
料金表
----------------------------*/
.post-type-archive-price {
  main {
    padding-bottom: 0;
  }

  .sec_lead {
    margin-bottom: clamp(100px, 75.728px + 6.472vw, 200px);
  }

  .intro_index {
    .intro_index_ttl {
      font-weight: 500;
      font-size: clamp(18px, 15.087px + 0.777vw, 30px);
      color: #7B6023;
      text-align: center;
      margin: 0 0 clamp(40px, 35.146px + 1.294vw, 60px);
    }
  }

  .sec_price_wrap {
    .sec_price {
      padding: clamp(80px, 50.874px + 7.767vw, 200px) 0;

      .price_group_ttl {
        position: relative;
        font-weight: 500;
        font-size: clamp(18px, 15.087px + 0.777vw, 30px);
        text-align: center;
        border-top: 1px #A28C5B solid;
        border-bottom: 1px #A28C5B solid;
        padding: 15px;
        margin: 0 0 clamp(30px, 27.573px + 0.647vw, 40px);

        &::before {
          content: "";
          position: absolute;
          top: 4px;
          left: 0;
          border-top: 1px #A28C5B solid;
          width: 100%;
          height: 1px;
        }

        &::after {
          content: "";
          position: absolute;
          bottom: 4px;
          left: 0;
          border-bottom: 1px #A28C5B solid;
          width: 100%;
          height: 1px;
        }

        small {
          display: inline-block;
          font-size: clamp(14px, 11.330px + 0.712vw, 25px);
          margin: auto;
        }
      }

      &:nth-child(even) {
        background-color: #F9F9F9;
      }
    }
  }
}

/*----------------------------
幹細胞点滴治療
----------------------------*/
.ttl_double_line {
  position: relative;
  font-weight: 500;
  font-size: clamp(18px, 15.087px + 0.777vw, 30px);
  text-align: center;
  border-top: 1px #A28C5B solid;
  border-bottom: 1px #A28C5B solid;
  padding: 15px;
  margin: 0 0 clamp(30px, 27.573px + 0.647vw, 40px);

  &::before {
    content: "";
    position: absolute;
    top: 4px;
    left: 0;
    border-top: 1px #A28C5B solid;
    width: 100%;
    height: 1px;
  }

  &::after {
    content: "";
    position: absolute;
    bottom: 4px;
    left: 0;
    border-bottom: 1px #A28C5B solid;
    width: 100%;
    height: 1px;
  }

  small {
    display: inline-block;
    font-size: clamp(14px, 11.330px + 0.712vw, 25px);
    margin: auto;
  }
}

/*----------------------------
診療メニュー詳細
----------------------------*/
.layout_e {
  main {
    padding-bottom: 0;
  }

  .sec_lead {
    padding-bottom: clamp(80px, 63.010px + 4.531vw, 150px);

    .lead {
      .lead_txt {
        font-size: clamp(16px, 14.544px + 0.388vw, 22px);
        line-height: 1.8;
        margin: 0;
      }
    }

    .first_img {
      max-width: 1200px;
      width: 84%;
      margin: 0 auto clamp(40px, 25.437px + 3.883vw, 100px);
    }
  }

  .description_wrap {
    background-color: #F9F9F9;

    .sec_description {
      padding-top: clamp(80px, 63.010px + 4.531vw, 150px);
      padding-bottom: clamp(100px, 75.728px + 6.472vw, 200px);

      .sec_description_ttl {
        font-weight: 500;
        font-size: clamp(22px, 17.631px + 1.165vw, 40px);
        letter-spacing: 0.1em;
        text-align: center;
        margin: 0 0 clamp(40px, 30.291px + 2.589vw, 80px);
      }

      .sec_description_img {
        max-width: 1200px;
        width: 84%;
        margin: clamp(40px, 35.146px + 1.294vw, 60px) auto 0;
        text-align: center;
      }

      .description_child {
        margin-top: clamp(80px, 63.010px + 4.531vw, 150px);

        .description_child_txt {
          &:has(.right_img) {
            display: flex;
            gap: 40px;

            @media (max-width: 767px) {
              flex-direction: column;
            }

            .right_img {
              width: 215px;
              flex-shrink: 0;
            }
          }

          &+.description_child_img {
            margin-top: clamp(40px, 35.146px + 1.294vw, 60px);
          }
        }

        .description_child_img {
          max-width: 800px;
          width: 100%;
          margin: auto;
          text-align: center;

          .img_caption {
            font-weight: 500;
            font-size: clamp(14px, 12.544px + 0.388vw, 20px);
            color: #7B6023;
            text-align: center;
            margin: 0 0 clamp(15px, 13.786px + 0.324vw, 20px);
          }

          .img_notes {
            font-size: clamp(10px, 9.515px + 0.129vw, 12px);
            text-align: right;
            margin: clamp(15px, 13.786px + 0.324vw, 20px) 0 0;
          }
        }
      }

      &+.sec_description {
        padding-top: 0;
      }
    }
  }

  .sec_faq {
    .under_sec_ttl {
      .ttl_inner {
        font-size: clamp(22px, 17.631px + 1.165vw, 40px);
      }
    }
  }

  .top_flow {
    padding-top: clamp(100px, 87.864px + 3.236vw, 150px);

    .under_sec_ttl {
      .ttl_inner {
        font-size: clamp(22px, 17.631px + 1.165vw, 40px);
      }
    }
  }

  .sec_price {
    padding-top: clamp(100px, 87.864px + 3.236vw, 150px);
    padding-bottom: clamp(100px, 87.864px + 3.236vw, 150px);

    .under_sec_ttl {
      .ttl_inner {
        font-size: clamp(22px, 17.631px + 1.165vw, 40px);
      }
    }
  }

  .sec_frequency {
    padding-top: clamp(100px, 75.728px + 6.472vw, 200px);

    .sec_frequency_inner {
      background-color: #F9F9F9;
      padding: clamp(40px, 30.291px + 2.589vw, 80px) clamp(20px, -4.272px + 6.472vw, 120px);

      .frequency_ttl {
        font-weight: 500;
        font-size: clamp(22px, 20.058px + 0.518vw, 30px);
        color: #7B6023;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: clamp(15px, 11.359px + 0.971vw, 30px);
        margin: 0 0 clamp(30px, 22.718px + 1.942vw, 60px);

        &::before,
        &::after {
          content: "";
          width: clamp(20px, 12.718px + 1.942vw, 50px);
          height: 1px;
          border-top: 1px #7B6023 solid;
          display: inline-block;
        }
      }
    }
  }

  .sec_precautions {
    padding-top: clamp(100px, 75.728px + 6.472vw, 200px);
    padding-bottom: clamp(100px, 87.864px + 3.236vw, 150px);
    background-color: #F9F9F9;

    .sec_description_ttl {
      font-weight: 500;
      font-size: clamp(22px, 17.631px + 1.165vw, 40px);
      text-align: center;
      margin: 0 0 clamp(40px, 35.146px + 1.294vw, 60px);

      .ttl_sub {
        font-weight: 500;
        font-size: clamp(14px, 13.029px + 0.259vw, 18px);
        margin-top: 10px;
        color: #7B6023;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;

        @media (max-width: 767px) {
          margin-top: 15px;
        }

        &::before,
        &::after {
          content: "";
          width: 10px;
          height: 1px;
          border-top: 1px #7B6023 solid;
          display: inline-block;
        }
      }
    }

    .table_style2 {
      tbody {
        tr {
          th {
            font-weight: 500;
            font-size: clamp(16px, 14.544px + 0.388vw, 22px);
          }
        }
      }
    }
  }

  .sec_guideline {
    padding-top: clamp(100px, 75.728px + 6.472vw, 200px);
    padding-bottom: clamp(100px, 75.728px + 6.472vw, 200px);
  }
}

.sec_guideline {
  .table_style2 {
    tbody {
      tr {

        th,
        td {
          font-size: clamp(13px, 12.272px + 0.194vw, 16px);
        }

        th {
          width: 230px;

          @media (max-width: 767px) {
            width: 100%;
          }
        }
      }
    }
  }
}