/* 
===============================
  共通
===============================
*/
* {
  box-sizing: border-box;
}

ul,
li {
  list-style: none;
  padding: 0;
  margin: 0;
}
a:hover {
  opacity: 1;
}
.pankuzu {
  width: calc(100vw * 1080 / 1440);
  margin: 0 auto calc(100vw * 50 / 1440);
  padding: calc(100vw * 20 / 1440) 0 0;
  color: #211d1a !important;
}
.pankuzu * {
  font-family: var(--font-heisei-mincho-std) !important;
}
.pankuzu li {
  font-size: calc(100vw * 13 / 1440);
  display: inline-block;
}
.pankuzu li:not(:last-of-type):after {
  content: "/";
}

.u-sr-only {
  position: absolute;
  width: calc(100vw * 1 / 1440);
  height: calc(100vw * 1 / 1440);
  padding: 0;
  margin: calc(100vw * -1 / 1440);
  overflow: hidden;
  white-space: nowrap;
  border: 0;
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
}

.white-wrapper {
  background: #fff;
}

main {
  margin-bottom: 0 !important;
}

footer {
  padding-top: 0 !important;
}

@media (min-width: 1921px) {
  .main-wrapper {
    padding-bottom: 0 !important;
  }
}

@media screen and (max-width: 767px) {
  .pankuzu {
    width: 100%;
    margin: 0 auto;
    padding-inline: calc(100vw * 15 / 375);
    padding-top: calc(100vw * 24 / 375);
  }
  .pankuzu li {
    font-size: calc(100vw * 9 / 375);
  }
  .main-wrapper {
    gap: 0 !important;
    padding-bottom: 0 !important;
  }
}

/*
===============================
  症例一覧CSS
===============================
*/

/* 検索セクション */
.case-search__section {
  margin-top: calc(100vw * 75 / 1440);
}

.case-search__section-inner {
  max-width: calc(100vw * 1022 / 1440) !important;
  padding-inline: calc(100vw * 15 / 1440);
  margin-inline: auto;
  box-sizing: content-box;
}

.case-search__title-en {
  font-family: var(--font-athena) !important;
  font-weight: 300;
  font-size: calc(100vw * 28 / 1440);
  color: #211d1a4d;
  text-shadow: calc(100vw * 2 / 1440) calc(100vw * 2 / 1440)
      calc(100vw * 7 / 1440) #00000040,
    calc(100vw * -2 / 1440) calc(100vw * -2 / 1440) calc(100vw * 4 / 1440)
      #ffffff;
}

.case-search__title-ja {
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 300;
  font-size: calc(100vw * 35 / 1440);
  color: #211d1acc;
  text-shadow: calc(100vw * -2 / 1440) calc(100vw * -2 / 1440)
      calc(100vw * 5 / 1440) #ffffff00,
    calc(100vw * 1 / 1440) calc(100vw * 1 / 1440) calc(100vw * 5 / 1440)
      #000000a6;
  position: relative;
  margin-top: calc(100vw * 40 / 1440);
  margin-left: calc(100vw * 10 / 1440);
}

.case-search__title-ja::before {
  content: "";
  position: absolute;
  bottom: calc(100vw * -12 / 1440);
  left: 0;
  width: 100%;
  height: calc(100vw * 30 / 1440);
  z-index: -1;
  border-radius: calc(100vw * 5 / 1440);
  background: radial-gradient(
    98.95% 579.96% at 0% 0%,
    rgba(171, 171, 171, 0) 0%,
    rgba(135, 119, 106, 0.14) 100%
  );
}

.case-search__title-ja::after {
  content: "";
  position: absolute;
  bottom: calc(100vw * -12 / 1440);
  left: 0;
  width: 100%;
  height: calc(100vw * 30 / 1440);
  z-index: -1;
  border-radius: calc(100vw * 5 / 1440);
  background: linear-gradient(90deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
}

.case-search {
  max-width: calc(100vw * 1000 / 1440) !important;
  margin-inline: auto;
  background: #ffffff;
  box-shadow: calc(100vw * 15 / 1440) calc(100vw * 15 / 1440)
      calc(100vw * 20 / 1440) 0px #fcfcfccc inset,
    calc(100vw * -15 / 1440) calc(100vw * -15 / 1440) calc(100vw * 30 / 1440)
      0px #f0f0f0cc inset,
    calc(100vw * -15 / 1440) calc(100vw * -15 / 1440) calc(100vw * 20 / 1440)
      0px #f1f0f0cc,
    calc(100vw * 20 / 1440) calc(100vw * 20 / 1440) calc(100vw * 15 / 1440) 0px
      #d5d4d466;
  border-radius: calc(100vw * 30 / 1440);
  padding-top: calc(100vw * 40 / 1440);
  padding-bottom: calc(100vw * 35 / 1440);
  padding-inline: calc(100vw * 82 / 1440);
  margin-top: calc(100vw * 60 / 1440);
}

/* 行レイアウト */
.case-search__row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: calc(100vw * 30 / 1440);
}
.case-search__row + .case-search__row {
  grid-template-columns: 1fr 1fr;
  gap: calc(100vw * 24 / 1440) calc(100vw * 60 / 1440);
  margin-top: calc(100vw * 20 / 1440);
}

/* -----------------------------------------
   検索テキスト
----------------------------------------- */
.case-search__input {
  height: calc(100vw * 52 / 1440);
  padding-inline: calc(100vw * 18 / 1440);
  background: #f6f6f6;
  outline: none;
  width: 100%;
  border: none;
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 18 / 1440);
  color: #211d1a;
  margin-top: calc(100vw * 20 / 1440);
}
.case-search__input::-webkit-input-placeholder {
  color: #d3d3d2;
}
.case-search__input::-moz-placeholder {
  color: #d3d3d2;
}
.case-search__input:-ms-input-placeholder {
  color: #d3d3d2;
}
.case-search__input::-ms-input-placeholder {
  color: #d3d3d2;
}
.case-search__input::placeholder {
  color: #d3d3d2;
}
.case-search__input:focus {
  border-color: #87776a;
}

/* -----------------------------------------
   性別フィールドセット
   ----------------------------------------- */
.case-search__gender {
  padding: 0;
  margin: 0;
  border: 0;
  text-align: center;
}

.case-search__gender-legend {
  min-width: calc(100vw * 210 / 1440);
  padding: calc(100vw * 15 / 1440);
  border-radius: calc(100vw * 5 / 1440);
  color: #211d1a;
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 18 / 1440);
  letter-spacing: 0.06em;
  background: radial-gradient(
    98.95% 579.96% at 0% 0%,
    rgba(171, 171, 171, 0.5) 0%,
    rgba(135, 119, 106, 0.5) 100%
  );
  text-align: center;
  margin-bottom: calc(100vw * 18 / 1440);
}

.case-search__gender-label {
  display: inline-flex;
  align-items: center;
  gap: calc(100vw * 8 / 1440);
  color: #211d1a;
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 18 / 1440);
  margin-inline: calc(100vw * 20 / 1440);
  cursor: pointer;
}

.case-search__gender input[type="radio"] {
  /* デフォルトの見た目をリセット */
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: calc(100vw * 20 / 1440);
  height: calc(100vw * 20 / 1440);
  border: calc(100vw * 1 / 1440) solid #211d1a80;
  border-radius: 50%;
  display: inline-block;
  position: relative;
  cursor: pointer;
  transition: all 0.2s ease;
}
/* 選択時の中身（擬似要素で丸を描く） */
.case-search__gender input[type="radio"]:checked::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(100vw * 8 / 1440);
  height: calc(100vw * 8 / 1440);
  background: radial-gradient(
    98.95% 579.96% at 0% 0%,
    rgba(171, 171, 171, 0.5) 0%,
    rgba(135, 119, 106, 0.5) 100%
  );
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

/* -----------------------------------------
   セレクト（担当医 / カテゴリ）
   ----------------------------------------- */
.case-search__select-wrap {
  position: relative;
}
.case-search__select-wrap::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: calc(100vw * 28 / 1440);
  width: calc(100vw * 14 / 1440);
  height: calc(100vw * 10 / 1440);
  background: #fff;
  -webkit-clip-path: polygon(50% 100%, 0 0, 100% 0);
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  pointer-events: none;
}
.case-search__select {
  -moz-appearance: none;
  appearance: none;
  -webkit-appearance: none;
  height: calc(100vw * 52 / 1440);
  width: 100%;
  padding: calc(100vw * 15 / 1440);
  border-radius: calc(100vw * 5 / 1440);
  border: 0;
  color: #211d1a;
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 18 / 1440);
  letter-spacing: 0.06em;
  background: radial-gradient(
    98.95% 579.96% at 0% 0%,
    rgba(171, 171, 171, 0.5) 0%,
    rgba(135, 119, 106, 0.5) 100%
  );
  text-align: center;
  cursor: pointer;
}
.case-search__select option {
  color: #333; /* ドロップ時の項目色 */
}

/* -----------------------------------------
   検索ボタン
   ----------------------------------------- */
.case-search__actions {
  display: flex;
  justify-content: center;
  margin-top: calc(100vw * 24 / 1440);
}
.case-search__button {
  min-width: calc(100vw * 120 / 1440);
  height: calc(100vw * 52 / 1440);
  padding: calc(100vw * 16 / 1440);
  border-radius: calc(100vw * 10 / 1440);
  background: radial-gradient(
    98.95% 579.96% at 0% 0%,
    rgba(171, 171, 171, 0.1) 0%,
    rgba(135, 119, 106, 0.1) 100%
  );
  text-align: center;
  cursor: pointer;
  border: none;
  outline: none;
  position: relative;
  overflow: hidden;
}
.case-search__button-text {
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 18 / 1440);
  letter-spacing: 0.06em;
  color: #211d1a;
  position: relative;
}
.case-search__button::before {
  content: "";
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background-image: radial-gradient(
    69.06% 69.06% at 40.17% 35.17%,
    rgba(255, 249, 246, 0.85) 0%,
    rgba(244, 212, 192, 0.85) 68.5%,
    rgba(244, 182, 155, 0.85) 93.5%
  );
  transition: opacity 0.5s;
  opacity: 0;
  z-index: 0;
}
@media (any-hover: hover) {
  .case-search__button:hover::before {
    opacity: 1;
  }
}
/* （任意）iOSなどでセレクトのネイティブ矢印が出る環境の調整 */
.case-search select::-ms-expand {
  display: none;
}

/* -----------------------------------------
   レスポンシブ
   ----------------------------------------- */
@media screen and (max-width: 767px) {
  /* 検索セクション */
  .case-search__section {
    margin-top: calc(100vw * 60 / 375);
  }

  .case-search__section-inner {
    max-width: calc(100vw * 1022 / 375) !important;
    padding-inline: calc(100vw * 15 / 375);
  }

  .case-search__title-en {
    font-size: calc(100vw * 28 / 375);
    text-shadow: calc(100vw * 2 / 375) calc(100vw * 2 / 375)
        calc(100vw * 7 / 375) #00000040,
      calc(100vw * -2 / 375) calc(100vw * -2 / 375) calc(100vw * 4 / 375)
        #ffffff;
  }

  .case-search__title-ja {
    font-size: calc(100vw * 19 / 375);
    text-shadow: calc(100vw * -2 / 375) calc(100vw * -2 / 375)
        calc(100vw * 5 / 375) #ffffff00,
      calc(100vw * 1 / 375) calc(100vw * 1 / 375) calc(100vw * 5 / 375)
        #000000a6;
    margin-top: calc(100vw * 8 / 375);
    margin-left: 0;
    padding: calc(100vw * 8 / 375) calc(100vw * 4 / 375);
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }

  .case-search__title-ja::before {
    top: 0;
    bottom: auto;
    height: 100%;
    border-radius: calc(100vw * 5 / 375);
  }

  .case-search__title-ja::after {
    top: 0;
    bottom: auto;
    height: 100%;
    border-radius: calc(100vw * 5 / 375);
  }

  .case-search {
    max-width: calc(100vw * 1000 / 375) !important;
    box-shadow: calc(100vw * 15 / 375) calc(100vw * 15 / 375)
        calc(100vw * 20 / 375) 0px #fcfcfccc inset,
      calc(100vw * -15 / 375) calc(100vw * -15 / 375) calc(100vw * 30 / 375) 0px
        #f0f0f0cc inset,
      calc(100vw * -15 / 375) calc(100vw * -15 / 375) calc(100vw * 20 / 375) 0px
        #f1f0f0cc,
      calc(100vw * 20 / 375) calc(100vw * 20 / 375) calc(100vw * 15 / 375) 0px
        #d5d4d466;
    border-radius: calc(100vw * 30 / 375);
    padding-top: calc(100vw * 14 / 375);
    padding-bottom: calc(100vw * 40 / 375);
    padding-inline: calc(100vw * 16 / 375);
    margin-top: calc(100vw * 24 / 375);
  }

  /* 行レイアウト */
  .case-search__row {
    grid-template-columns: 1fr;
    gap: calc(100vw * 12 / 375);
  }
  .case-search__row + .case-search__row {
    grid-template-columns: 1fr;
    gap: calc(100vw * 14 / 375);
    margin-top: calc(100vw * 20 / 375);
  }
  .case-search__row-empty {
    display: none;
  }

  /* -----------------------------------------
   検索テキスト
----------------------------------------- */
  .case-search__input {
    height: calc(100vw * 52 / 375);
    padding-inline: calc(100vw * 18 / 375);
    font-size: calc(100vw * 16 / 375);
    margin-top: calc(100vw * 20 / 375);
  }

  /* -----------------------------------------
   性別フィールドセット
   ----------------------------------------- */
  .case-search__gender-legend {
    min-width: 100%;
    padding: calc(100vw * 10 / 375);
    border-radius: calc(100vw * 5 / 375);
    font-size: calc(100vw * 15 / 375);
    margin-bottom: calc(100vw * 12 / 375);
  }

  .case-search__gender-label {
    gap: calc(100vw * 8 / 375);
    font-size: calc(100vw * 14 / 375);
    margin-inline: calc(100vw * 40 / 375);
  }

  .case-search__gender input[type="radio"] {
    width: calc(100vw * 16 / 375);
    height: calc(100vw * 16 / 375);
    border: calc(100vw * 1 / 375) solid #211d1a80;
  }
  /* 選択時の中身（擬似要素で丸を描く） */
  .case-search__gender input[type="radio"]:checked::before {
    width: calc(100vw * 8 / 375);
    height: calc(100vw * 8 / 375);
  }

  /* -----------------------------------------
   セレクト（担当医 / カテゴリ）
   ----------------------------------------- */
  .case-search__select-wrap::after {
    right: calc(100vw * 16 / 375);
    width: calc(100vw * 14 / 375);
    height: calc(100vw * 10 / 375);
  }
  .case-search__select {
    height: calc(100vw * 40 / 375);
    width: 100%;
    padding: calc(100vw * 8 / 375);
    border-radius: calc(100vw * 5 / 375);
    font-size: calc(100vw * 15 / 375);
    -moz-text-align-last: center;
    text-align-last: center; /* Safariで必須 */
  }

  /* -----------------------------------------
   検索ボタン
   ----------------------------------------- */
  .case-search__actions {
    margin-top: calc(100vw * 32 / 375);
  }
  .case-search__button {
    min-width: calc(100vw * 120 / 375);
    height: calc(100vw * 52 / 375);
    padding: calc(100vw * 16 / 375);
    border-radius: calc(100vw * 10 / 375);
  }
  .case-search__button-text {
    font-size: calc(100vw * 18 / 375);
  }
}

/*
===============================
  症例一覧セクション
===============================
*/
.case-archive__section {
  background: #fff;
  margin-top: calc(100vw * 122 / 1440);
  padding-block: calc(100vw * 100 / 1440);
}
.case-archive__list {
  margin-inline: auto;
  max-width: calc(100vw * 844 / 1440) !important;
  padding-inline: calc(100vw * 20 / 1440);
  box-sizing: content-box;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(100vw * 32 / 1440) calc(100vw * 45 / 1440);
}

.case-item a {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.case-item__img {
  width: 100%;
  aspect-ratio: 1;
  box-shadow: calc(100vw * 2 / 1440) calc(100vw * 2 / 1440)
    calc(100vw * 7 / 1440) 0px #00000040;
  border-radius: calc(100vw * 20 / 1440);
  overflow: hidden;
  position: relative;
}

.case-item__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.case-item__img-label {
  position: absolute;
  bottom: 0;
  right: 0;
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 12 / 1440);
  letter-spacing: 0.05em;
  color: #211d1a;
  text-align: center;
  padding-block: calc(100vw * 8 / 1440);
  padding-inline: calc(100vw * 16 / 1440);
  background: #ffffffb2;
  border-radius: calc(100vw * 20 / 1440) 0 0 0;
}

.case-item__body {
  position: relative;
  margin-top: calc(100vw * 20 / 1440);
  padding-top: calc(100vw * 4 / 1440);
  padding-bottom: calc(100vw * 30 / 1440);
  padding-left: calc(100vw * 16 / 1440);
  flex: 1;
  display: flex;
  flex-direction: column;
}

.case-item__body::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100vw * 1 / 1440);
  height: 100%;
  background: linear-gradient(to bottom, #666666 0%, rgba(0, 0, 0, 0) 100%);
  box-shadow: 0px 0px calc(100vw * 10 / 1440) 0px #0000001a;
}

.case-item__doctor,
.case-item__category {
  display: inline;
}

.case-item__doctor li,
.case-item__category li:not(:has(a)),
.case-item__category li a {
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 12 / 1440);
  color: #211d1a;
  min-width: calc(100vw * 100 / 1440);
  text-align: center;
  padding-inline: calc(100vw * 16 / 1440);
  position: relative;
  border-radius: 5px;
  padding-block: calc(100vw * 6 / 1440) calc(100vw * 4 / 1440);
  display: inline-block;
  margin-right: calc(100vw * 10 / 1440);
  margin-bottom: calc(100vw * 10 / 1440);
}

.case-item__category li a {
  background: #f5f1ed;
  transition: 0.5s;
}

@media (any-hover: hover) {
  .case-item__category li a:hover {
    background: #ffe8d0;
  }
}

.case-item__doctor li span,
.case-item__category li:not(:has(a)) span {
  position: relative;
  z-index: 3;
}

.case-item__doctor li::before {
  content: "";
  position: absolute;
  top: 1px;
  left: 1px;
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  border-radius: 3px;
  background: #fff;
  z-index: 2;
}

.case-item__doctor li::after {
  content: "";
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: 5px;
  background: linear-gradient(
    90deg,
    rgba(33, 29, 26, 0.8) 0%,
    rgba(33, 29, 26, 0.3) 50%,
    rgba(33, 29, 26, 0.8) 100%
  );
  z-index: 1;
}

.case-item__category li:not(:has(a)) {
  background: #f5f1ed;
}

.case-item__title {
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 20 / 1440);
  color: #211d1a;
  margin-top: calc(100vw * 10 / 1440);
  transition: opacity 0.5s;
}

.case-item__subcategory {
  display: grid;
  gap: calc(100vw * 4 / 1440);
  margin-top: calc(100vw * 10 / 1440);
}

.case-item__subcategory li {
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 14 / 1440);
  color: #211d1a;
  transition: opacity 0.5s;
}

.case-archive__no-results {
  text-align: center;
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 18 / 1440);
  letter-spacing: 0.06em;
  color: #211d1a;
}

@media (any-hover: hover) {
  .case-item a:hover .case-item__img img {
    transform: scale(1.1);
  }
  .case-item a:hover .case-item__title {
    opacity: 0.5;
  }
  .case-item a:hover .case-item__subcategory li {
    opacity: 0.5;
  }
}

/* レスポンシブ */
@media screen and (max-width: 767px) {
  .case-archive__section {
    margin-top: calc(100vw * 80 / 375);
    padding-block: calc(100vw * 70 / 375);
  }
  .case-archive__list {
    max-width: calc(100vw * 844 / 375) !important;
    padding-inline: calc(100vw * 20 / 375);
    grid-template-columns: repeat(1, 1fr);
    gap: calc(100vw * 32 / 375) calc(100vw * 45 / 375);
  }

  .case-item__images {
    gap: calc(100vw * 24 / 375);
  }

  .case-item__img {
    box-shadow: calc(100vw * 2 / 375) calc(100vw * 2 / 375)
      calc(100vw * 7 / 375) 0px #00000040;
    border-radius: calc(100vw * 20 / 375);
  }

  .case-item__img-label {
    font-size: calc(100vw * 10 / 375);
    padding-block: calc(100vw * 5 / 375) calc(100vw * 4 / 375);
    padding-inline: calc(100vw * 14 / 375);
    border-radius: calc(100vw * 20 / 375) 0 0 0;
  }

  .case-item__body {
    margin-top: calc(100vw * 16 / 375);
    padding-top: calc(100vw * 6 / 375);
    padding-bottom: calc(100vw * 20 / 375);
    padding-left: calc(100vw * 12 / 375);
  }

  .case-item__body::before {
    width: calc(100vw * 1 / 375);
    box-shadow: 0px 0px calc(100vw * 10 / 375) 0px #0000001a;
  }

  .case-item__doctor li,
  .case-item__category li:not(:has(a)),
  .case-item__category li a {
    font-size: calc(100vw * 12 / 375);
    min-width: calc(100vw * 100 / 375);
    padding-inline: calc(100vw * 16 / 375);
    border-radius: 5px;
    padding-block: calc(100vw * 6 / 375) calc(100vw * 4 / 375);
    margin-right: calc(100vw * 10 / 375);
    margin-bottom: calc(100vw * 10 / 375);
  }

  .case-item__title {
    font-size: calc(100vw * 16 / 375);
    margin-top: calc(100vw * 6 / 375);
  }

  .case-item__subcategory {
    gap: calc(100vw * 4 / 375);
    margin-top: calc(100vw * 10 / 375);
  }

  .case-item__subcategory li {
    font-size: calc(100vw * 12 / 375);
  }

  .case-archive__no-results {
    font-size: calc(100vw * 16 / 375);
  }
}

/*
===============================
  ページネーション
===============================
*/
.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(100vw * 16 / 1440);
  font-family: var(--font-athena) !important;
  font-weight: 300;
  font-size: calc(100vw * 18 / 1440);
  color: #211d1a;
  margin-block: calc(100vw * 50 / 1440);
}

.pagination-arrow {
  background: url(../../img/pagination-arrow.svg) no-repeat center center /
    contain;
  width: calc(100vw * 23 / 1440);
  height: calc(100vw * 13 / 1440);
  display: inline-block;
}

.page-numbers {
  opacity: 0.3;
}

.page-numbers.current,
.page-numbers.prev,
.page-numbers.next {
  opacity: 1;
}

.prev.page-numbers .pagination-arrow {
  transform: rotate(180deg);
}

@media screen and (max-width: 767px) {
  .pagination {
    gap: calc(100vw * 16 / 375);
    font-size: calc(100vw * 18 / 375);
    margin-block: calc(100vw * 32 / 375);
  }

  .pagination-arrow {
    width: calc(100vw * 18 / 375);
    height: calc(100vw * 10 / 375);
  }
}

/* 
===============================
  症例詳細CSS
===============================
*/
.case-single {
  max-width: calc(100vw * 1000 / 1440) !important;
  padding-inline: calc(100vw * 16 / 1440);
  margin-inline: auto;
  box-sizing: content-box;
  margin-top: calc(100vw * 125 / 1440);
}

.case-single__title {
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 30 / 1440);
  color: #211d1a;
  line-height: 1.4;
  border-bottom: 1px solid #211d1a;
  text-align: center;
}

.case-single .case-item__images {
  max-width: calc(100vw * 730 / 1440) !important;
  margin-inline: auto;
  gap: calc(100vw * 30 / 1440) calc(100vw * 40 / 1440);
  margin-top: calc(100vw * 60 / 1440);
}

.case-single .case-item__img {
  height: calc(100vw * 460 / 1440);
}

.case-single .case-item__img-label {
  font-size: calc(100vw * 14 / 1440);
  padding-block: calc(100vw * 8 / 1440) calc(100vw * 7 / 1440);
  padding-inline: calc(100vw * 25 / 1440);
}

.case-single .case-item__category {
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(100vw * 40 / 1440);
}

.case-single__description {
  margin-top: calc(100vw * 4 / 1440);
}

.case-single__description * {
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 14 / 1440);
  line-height: 1.5;
  letter-spacing: 0.05em;
  color: #211d1a;
}

.case-single__spec {
  margin-top: calc(100vw * 52 / 1440);
}

.case-spec-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #f5f1ed;
}

.case-spec-table__th {
  border-bottom: 1px solid #fff;
  width: calc(100vw * 198 / 1440);
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 18 / 1440);
  line-height: 1.5;
  letter-spacing: 0.09em;
  background: #f5f1ed;
  color: #211d1a;
  text-align: center;
  padding-block: calc(100vw * 12 / 1440);
  padding-inline: calc(100vw * 10 / 1440);
}

.case-spec-table tr:last-of-type .case-spec-table__th {
  border-bottom: 1px solid #f5f1ed;
}

.case-spec-table__td {
  border: 1px solid #f5f1ed;
  padding-block: calc(100vw * 12 / 1440);
  padding-inline: calc(100vw * 48 / 1440);
}

.case-spec-table__td,
.case-spec-table__td * {
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 16 / 1440);
  line-height: 1.5;
  letter-spacing: 0.05em;
  color: #211d1a;
}

.case-price__line-inner {
  display: grid;
  gap: calc(100vw * 4 / 1440);
}

.case-price__total {
  margin-top: calc(100vw * 30 / 1440);
}

.case-single__number {
  text-align: right;
  font-weight: 400;
  font-size: calc(100vw * 14 / 1440);
  color: #211d1a;
  margin-top: calc(100vw * 8 / 1440);
}

.case-single__more {
  padding-block: calc(100vw * 42 / 1440);
}

.case-single__more a {
  width: 100%;
  display: block;
  position: relative;
  padding-block: calc(100vw * 16 / 1440);
  padding-inline: calc(100vw * 16 / 1440);
  border-bottom: 1px solid #211d1acc;
  text-align: center;
}

.case-single__more-link-text {
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 400;
  font-size: calc(100vw * 17 / 1440);
  color: #211d1a;
  position: relative;
  z-index: 2;
}

.case-single__more a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(
    100% 100% at 0% 0%,
    rgba(255, 255, 255, 0.2) 0%,
    rgba(135, 119, 106, 0.2) 100%
  );
  z-index: 1;
  transition: opacity 0.5s;
}

.case-single__more a::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: radial-gradient(
    69.06% 69.06% at 40.17% 35.17%,
    rgba(255, 249, 246, 0.85) 0%,
    rgba(244, 212, 192, 0.85) 68.5%,
    rgba(244, 182, 155, 0.85) 93.5%
  );
  z-index: 1;
  opacity: 0;
  transition: opacity 0.5s;
}

/* 関連スライダー */
.case-related {
  margin-top: calc(100vw * 30 / 1440);
  padding-bottom: calc(100vw * 80 / 1440);
}

.case-related__swiper {
  padding-bottom: calc(100vw * 40 / 1440);
}

.case-related__swiper.is-noSwiper .swiper-wrapper {
  justify-content: center;
  gap: calc(100vw * 24 / 1440);
}

.case-related__item {
  width: calc(100vw * 220 / 1440) !important;
}

.case-related__item .case-item__img {
  border-radius: calc(100vw * 5 / 1440);
}

.case-related__name {
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 300;
  font-size: calc(100vw * 16 / 1440);
  line-height: 1.4;
  color: #211d1a;
  margin-top: calc(100vw * 16 / 1440);
  transition: opacity 0.5s;
}

.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets
  .swiper-pagination-bullet {
  width: calc(100vw * 8 / 1440) !important;
  height: calc(100vw * 8 / 1440) !important;
  margin: 0 calc(100vw * 8 / 1440) !important;
}

.swiper-pagination-bullet {
  background: #f5f1ed;
  opacity: 1;
}

.swiper-pagination-bullet-active {
  background: linear-gradient(
    147.72deg,
    rgba(171, 171, 171, 0.8) 7.13%,
    rgba(135, 119, 106, 0.8) 92.87%
  );
  opacity: 1;
}

.reservation-section {
  padding-top: calc(100vw * 70 / 1440);
  padding-bottom: calc(100vw * 40 / 1440);
}

.reservation-section__title-en {
  font-family: var(--font-athena) !important;
  font-weight: 300;
  font-size: calc(100vw * 28 / 1440);
  color: #211d1a4d;
  text-shadow: calc(100vw * 2 / 1440) calc(100vw * 2 / 1440)
      calc(100vw * 7 / 1440) #00000040,
    calc(100vw * -2 / 1440) calc(100vw * -2 / 1440) calc(100vw * 4 / 1440)
      #ffffff;
  text-align: center;
}

.reservation-section__title-ja {
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 300;
  font-size: calc(100vw * 35 / 1440);
  color: #211d1a;
  text-shadow: calc(100vw * -2 / 1440) calc(100vw * -2 / 1440)
      calc(100vw * 5 / 1440) #ffffff00,
    calc(100vw * 1 / 1440) calc(100vw * 1 / 1440) calc(100vw * 5 / 1440)
      #000000a6;
  margin-top: calc(100vw * 40 / 1440);
  text-align: center;
}

.reservation-section__description {
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 16 / 1440);
  line-height: 1.4;
  color: #211d1a;
  text-align: center;
  margin-top: calc(100vw * 42 / 1440);
}

.reservation-section__btn {
  margin-top: calc(100vw * 30 / 1440);
  width: calc(100vw * 445 / 1440);
  margin-inline: auto;
}

.reservation-section__btn a {
  transition: opacity 0.5s;
}

.case-side-effects__line-inner {
  display: grid;
  gap: 0.5lh;
}

.case-side-effects__name,
.case-side-effects__text {
  display: block;
}

@media (any-hover: hover) {
  .case-single__more a:hover::before {
    opacity: 0;
  }
  .case-single__more a:hover::after {
    opacity: 1;
  }

  .case-related__item a:hover .case-item__img img {
    transform: scale(1.1);
  }

  .case-related__item a:hover .case-related__name {
    opacity: 0.5;
  }

  .reservation-section__btn a:hover {
    opacity: 0.6;
  }
}

@media screen and (max-width: 767px) {
  .case-single {
    padding-inline: calc(100vw * 16 / 375);
    margin-top: calc(100vw * 48 / 375);
    max-width: 100% !important;
  }

  .case-single__title {
    font-size: calc(100vw * 20 / 375);
    padding-bottom: calc(100vw * 4 / 375);
  }

  .case-single .case-item__images {
    max-width: 96% !important;
    margin-inline: auto;
    gap: calc(100vw * 15 / 375) calc(100vw * 24 / 375);
    margin-top: calc(100vw * 24 / 375);
  }

  .case-single .case-item__img {
    height: calc(100vw * 204 / 375);
  }

  .case-single .case-item__img-label {
    font-size: calc(100vw * 12 / 375);
    padding-block: calc(100vw * 5 / 375) calc(100vw * 4 / 375);
    padding-inline: calc(100vw * 14 / 375);
  }

  .case-single .case-item__category {
    margin-top: calc(100vw * 30 / 375);
  }

  .case-single .case-item__category li:not(:has(a)),
  .case-single .case-item__category li a {
    font-size: calc(100vw * 12 / 375);
    padding-inline: calc(100vw * 10 / 375);
    min-width: calc(100vw * 70 / 375);
  }

  .case-single__description {
    margin-top: calc(100vw * 10 / 375);
  }

  .case-single__description * {
    font-size: calc(100vw * 13 / 375);
  }

  .case-single__spec {
    margin-top: calc(100vw * 24 / 375);
  }

  .case-spec-table__th {
    width: 100%;
    font-size: calc(100vw * 15 / 375);
    padding-block: calc(100vw * 8 / 375);
    padding-inline: calc(100vw * 15 / 375);
    display: block;
    border: none;
  }

  .case-spec-table__td {
    padding-block: calc(100vw * 10 / 375);
    padding-inline: calc(100vw * 15 / 375);
    display: block;
    border: none;
  }

  .case-spec-table__td,
  .case-spec-table__td * {
    font-size: calc(100vw * 13 / 375);
  }

  .case-price__line-inner {
    gap: calc(100vw * 4 / 375);
  }

  .case-price__total {
    margin-top: calc(100vw * 12 / 375);
  }

  .case-single__number {
    font-size: calc(100vw * 13 / 375);
    margin-top: calc(100vw * 5 / 375);
  }

  .case-single__more {
    padding-block: calc(100vw * 58 / 375);
  }

  .case-single__more a {
    padding-block: calc(100vw * 8 / 375);
    padding-inline: calc(100vw * 16 / 375);
  }

  .case-single__more-link-text {
    font-size: calc(100vw * 14 / 375);
  }

  .case-related {
    margin-top: calc(100vw * 14 / 375);
    padding-bottom: calc(100vw * 50 / 375);
  }

  .case-related__item {
    width: calc(100vw * 220 / 375) !important;
  }

  .case-related__item .case-item__images {
    gap: calc(100vw * 6 / 375);
  }

  .case-related__item .case-item__img {
    border-radius: calc(100vw * 5 / 375);
  }

  .case-related__name {
    font-size: calc(100vw * 12 / 375);
    margin-top: calc(100vw * 14 / 375);
  }

  .case-related__swiper {
    padding-bottom: calc(100vw * 35 / 375);
  }

  .case-related__swiper.is-noSwiper .swiper-wrapper {
    gap: calc(100vw * 16 / 375);
  }

  .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
  .swiper-pagination-horizontal.swiper-pagination-bullets
    .swiper-pagination-bullet {
    margin: 0 calc(100vw * 6 / 375) !important;
    width: calc(100vw * 6 / 375) !important;
    height: calc(100vw * 6 / 375) !important;
  }

  .reservation-section {
    padding-top: calc(100vw * 38 / 375);
    padding-bottom: calc(100vw * 45 / 375);
  }

  .reservation-section__title-en {
    font-size: calc(100vw * 15 / 375);
    text-shadow: calc(100vw * 2 / 375) calc(100vw * 2 / 375)
        calc(100vw * 7 / 375) #00000040,
      calc(100vw * -2 / 375) calc(100vw * -2 / 375) calc(100vw * 4 / 375)
        #ffffff;
  }

  .reservation-section__title-ja {
    font-size: calc(100vw * 18 / 375);
    text-shadow: calc(100vw * -2 / 375) calc(100vw * -2 / 375)
        calc(100vw * 5 / 375) #ffffff00,
      calc(100vw * 1 / 375) calc(100vw * 1 / 375) calc(100vw * 5 / 375)
        #000000a6;
    margin-top: calc(100vw * 8 / 375);
  }

  .reservation-section__description {
    font-size: calc(100vw * 14 / 375);
    margin-top: calc(100vw * 30 / 375);
  }

  .reservation-section__btn {
    margin-top: calc(100vw * 22 / 375);
    width: calc(100vw * 335 / 375);
  }
}

/*
===============================
  画像群ブロックCSS
===============================
*/
/* 画像群ブロック */
.case-single__images {
  margin-top: calc(100vw * 60 / 1440);
}

/* メイン画像 */
.case-single__img {
  margin-inline: auto;
  max-width: calc(100vw * 550 / 1440) !important;
  position: relative;
}

.case-single__img a {
  display: block;
  overflow: hidden;
  border-radius: calc(100vw * 20 / 1440);
  aspect-ratio: 1 / 1;
}

.case-single__img img {
  -o-object-fit: cover;
  object-fit: cover;
  display: block;
  height: 100%;
  transition: transform 0.5s ease;
}

@media (any-hover: hover) {
  .case-single__img a:hover img {
    transform: scale(1.1);
  }
}

.case-single__img-label {
  position: absolute;
  bottom: 0;
  right: 0;
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 16 / 1440);
  letter-spacing: 0.05em;
  color: #211d1a;
  text-align: center;
  padding-block: calc(100vw * 8 / 1440);
  padding-inline: calc(100vw * 24 / 1440);
  background: #ffffffb2;
  border-radius: calc(100vw * 20 / 1440) 0 0 0;
}

/* サムネイル群（2枚目以降） */
.case-single__thumbs {
  display: flex;
  flex-wrap: wrap;
  gap: calc(100vw * 32 / 1440);
  justify-content: center;
  margin-top: calc(100vw * 32 / 1440);
}

.case-single__thumb a {
  display: block;
  border-radius: calc(100vw * 16 / 1440);
  overflow: hidden;
  aspect-ratio: 1 / 1;
  position: relative;
}

.case-single__thumb-figure {
  width: 100%;
  height: 100%;
}

.case-single__thumb img {
  width: calc(100vw * 300 / 1440);
  -o-object-fit: cover;
  object-fit: cover;
  height: 100%;
  transition: transform 0.5s ease;
}

.case-single__thumb-caption {
  position: absolute;
  bottom: 0;
  right: 0;
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 12 / 1440);
  letter-spacing: 0.05em;
  color: #211d1a;
  text-align: center;
  padding-block: calc(100vw * 8 / 1440);
  padding-inline: calc(100vw * 16 / 1440);
  background: #ffffffb2;
  border-radius: calc(100vw * 16 / 1440) 0 0 0;
}

@media (any-hover: hover) {
  .case-single__thumb a:hover img {
    transform: scale(1.1);
  }
}

/* ===== ポップアップ（モーダル）周り ===== */
.case-popup-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.2s ease, visibility 0.2s ease;
}

.case-popup-overlay.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.case-popup-content {
  position: relative;
  width: calc(100vw * 900 / 1440);
  border-radius: calc(100vw * 20 / 1440);
}

.case-popup-close {
  position: absolute;
  top: calc(100vw * 24 / 1440);
  right: calc(100vw * 24 / 1440);
  z-index: 2;
  border: none;
  border-radius: 50%;
  color: #fff;
  cursor: pointer;
  font-weight: 400;
  font-size: calc(100vw * 40 / 1440);
}

/* スライダー内の画像とキャプション */
.case-popup-figure {
  width: 100%;
  height: 85vh;
  aspect-ratio: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.case-popup-figure img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
  object-fit: contain;
  max-height: 75vh;
}
.case-popup-caption {
  font-family: var(--font-heisei-mincho-std) !important;
  font-weight: 600;
  font-size: calc(100vw * 24 / 1440);
  letter-spacing: 0.05em;
  color: #fff;
  text-align: center;
  margin-top: calc(100vw * 24 / 1440);
}

.case-popup-swiper .swiper-button-prev,
.case-popup-swiper .swiper-button-next {
  color: #211d1a;
  width: calc(100vw * 64 / 1440);
  height: calc(100vw * 64 / 1440);
  border-radius: 50%;
  background: #ffffffb2;
  top: 46%;
}

.case-popup-swiper .swiper-button-next:after,
.case-popup-swiper .swiper-button-prev:after {
  font-size: calc(100vw * 44 / 1440);
}

.case-popup-swiper .swiper-button-next:after {
  position: relative;
  left: calc(100vw * 2 / 1440);
}

.case-popup-swiper .swiper-button-prev:after {
  position: relative;
  right: calc(100vw * 2 / 1440);
}

/* モーダル開時はスクロール固定 */
body.is-popup-open {
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  /* 画像群ブロック */
  .case-single__images {
    margin-top: calc(100vw * 24 / 375);
  }

  /* メイン画像 */
  .case-single__img {
    width: 75%;
    max-width: calc(100vw * 550 / 375) !important;
  }

  .case-single__img a {
    border-radius: calc(100vw * 20 / 375);
  }

  .case-single__img-label {
    font-size: calc(100vw * 10 / 375);
    padding-block: calc(100vw * 8 / 375);
    padding-inline: calc(100vw * 24 / 375);
    border-radius: calc(100vw * 20 / 375) 0 0 0;
  }

  /* サムネイル群（2枚目以降） */
  .case-single__thumbs {
    gap: calc(100vw * 24 / 375);
    margin-top: calc(100vw * 24 / 375);
  }

  .case-single__thumb a {
    border-radius: calc(100vw * 16 / 375);
  }

  .case-single__thumb img {
    width: calc(100vw * 150 / 375);
  }

  .case-single__thumb-caption {
    font-size: calc(100vw * 10 / 375);
    padding-block: calc(100vw * 4 / 375);
    padding-inline: calc(100vw * 8 / 375);
    border-radius: calc(100vw * 16 / 375) 0 0 0;
  }

  /* ===== ポップアップ（モーダル）周り ===== */
  .case-popup-content {
    width: 90%;
    border-radius: calc(100vw * 20 / 375);
  }

  .case-popup-close {
    top: calc(100vw * 24 / 375);
    right: calc(100vw * 24 / 375);
    font-size: calc(100vw * 30 / 375);
  }

  /* スライダー内の画像とキャプション */
  .case-popup-caption {
    font-size: calc(100vw * 16 / 375);
    margin-top: calc(100vw * 16 / 375);
  }

  .case-popup-swiper .swiper-button-prev,
  .case-popup-swiper .swiper-button-next {
    width: calc(100vw * 40 / 375);
    height: calc(100vw * 40 / 375);
  }

  .case-popup-swiper .swiper-button-next:after,
  .case-popup-swiper .swiper-button-prev:after {
    font-size: calc(100vw * 28 / 375);
  }

  .case-popup-swiper .swiper-button-next:after {
    left: calc(100vw * 2 / 375);
  }

  .case-popup-swiper .swiper-button-prev:after {
    position: relative;
    right: calc(100vw * 2 / 375);
  }
}

.case-price__price-link {
  text-align: right;
  text-decoration: underline;
  display: block;
  transition: opacity 0.5s;
}
@media (any-hover: hover) {
  .case-price__price-link:hover {
    opacity: 0.7;
  }
}
