@charset "UTF-8";
/* ==========================================================================
   MEDICARE TOP
   - 990px未満: SPレイアウト（390px基準） / 990px以上: PCレイアウト（1440px基準）
   - 数値は Figma（SP: sp_all_iPhone 13 / PC: pc_top_1440px）に合わせています
   ========================================================================== */

/* ---------- Tokens ---------- */
:root {
  --c-text: #3d2421;
  --c-beige: #e9ce98;
  --c-beige-60: rgba(233, 206, 152, 0.6);
  --c-beige-bg: rgba(233, 206, 152, 0.1);
  --c-copy: rgba(61, 36, 33, 0.6);

  --ff-sans: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", sans-serif;
  --ff-serif: "Zen Old Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --ff-script: "Ephesis", cursive;

  /* SP固定バー（Figma btn_cta_sp 28112:34 / 390×60。文言以外の見た目はここで調整） */
  --cta-h: 60px;
  --cta-bg: #2d2d2d;
  --cta-color: #fff;
  --cta-font-size: 18px;
  --cta-line-height: 32px;
  --cta-text-top: 15px;
  --cta-pad-l: 23px;
  --cta-btn-w-line: 90px;
  --cta-btn-w-tel: 87px;
  --cta-icon-top: 16px;
  --cta-divider-top: 14px;
  --cta-divider-h: 33px;
  --safe-b: env(safe-area-inset-bottom, 0px);

  /* SPのコンテンツ列（390pxで 左46 / 幅306 / 右38、タブレットでは最大600pxで中央寄せ） */
  --sp-gl: max(46px, calc((100% - 600px) / 2));
  --sp-cw: min(calc(100% - 84px), 600px);

  --header-h: 85px;

  /* ボタンの hover / キーボードフォーカス（Figma btn_brwn・btn_beige：マウスオーバー時 ディゾルブ・イーズアウト 300ms） */
  --btn-transition: 300ms ease-out;
  --btn-line-hover-bg: #3d2421;
  --btn-line-hover-color: #fff;
  --btn-fill-hover-bg: rgba(233, 206, 152, 0.6);
  --btn-fill-hover-color: rgba(61, 36, 33, 0.6);
}

/* ---------- Base ---------- */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  margin: 0;
  isolation: isolate; /* 泡の背景（z-index: -1）を body の背景より前・本文より後ろに描く */
  background: #fff;
  color: var(--c-text);
  font-family: var(--ff-sans);
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  overflow-x: hidden;
  overflow-x: clip;
}

h1, h2, h3, p, ul, figure, address {
  margin: 0;
  padding: 0;
}

ul {
  list-style: none;
}

address {
  font-style: normal;
}

img,
video {
  display: block;
  max-width: 100%;
}

/* <picture>（WebP の切り替え用）は枠を作らず、中の <img> がこれまでどおり配置される */
picture {
  display: contents;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  font: inherit;
  color: inherit;
}

:focus-visible {
  outline: 2px solid var(--c-text);
  outline-offset: 2px;
}

[hidden] {
  display: none !important;
}

.l-wrapper {
  overflow-x: hidden;
  overflow-x: clip;
}

[id] {
  scroll-margin-top: 0;
}

/* ---------- Utility ---------- */
@media (min-width: 990px) {
  .u-sp {
    display: none !important;
  }
}

@media (max-width: 989.98px) {
  .u-pc {
    display: none !important;
  }
}

/* ==========================================================================
   Components
   ========================================================================== */

/* ---------- クーポンの説明（クーポン画像の下：TOP・/coupon/ で共通） ----------
   上から「全コース 20%off クーポン」／「初回お試しキャンペーン・全てのコース・男女共に使用可能」／ご利用条件。
   区切りはベージュの線。余白・文字サイズは変数でページごとに調整（既定値は /coupon/：Figma 28266:216 / 28266:127） */
.c-coupon-info {
  --ci-img-gap: 15px;   /* 画像から */
  --ci-catch-pb: 10px;  /* 1段目の文字から線まで */
  --ci-ttl-mt: 17px;    /* 線から2段目 */
  --ci-sub-mt: 4px;     /* 2段目の上下の行の間 */
  --ci-ttl-pb: 19px;    /* 2段目の文字から線まで */
  --ci-note-mt: 14px;   /* 線から条件 */
  --ci-catch-fs: 14px;
  --ci-big-fs: 24px;
  margin-top: var(--ci-img-gap);
  font-weight: 500;
  text-align: center;
}

.c-coupon-info__catch {
  box-sizing: content-box;
  height: 30px; /* 1行（文字の大きさが混ざっても行の高さを変えない） */
  padding-bottom: var(--ci-catch-pb);
  border-bottom: 1px solid var(--c-beige);
  font-size: var(--ci-catch-fs);
  line-height: 30px;
}

.c-coupon-info__big {
  font-size: var(--ci-big-fs);
  line-height: 1; /* 大きい文字で行が高くならないように（行の高さは 30px のまま） */
}

.c-coupon-info__ttl {
  margin-top: var(--ci-ttl-mt);
  padding-bottom: var(--ci-ttl-pb);
  border-bottom: 1px solid var(--c-beige);
  font-size: 18px;
  line-height: 20px;
}

.c-coupon-info__sub {
  display: block;
  margin-top: var(--ci-sub-mt);
  font-size: 14px;
  line-height: 20px;
}

.c-coupon-info__note {
  margin-top: var(--ci-note-mt);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

/* ---------- Button ---------- */
.c-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 62px;
  padding: 0 13px;
  border-radius: 5px;
  font-size: 16px;
  line-height: 30px;
  text-align: center;
  transition: background-color var(--btn-transition), color var(--btn-transition);
}

.c-btn--line {
  width: 234px;
  border: 1px solid var(--c-text);
}

.c-btn--fill {
  width: 100%;
  max-width: 430px;
  background: var(--c-beige);
}

.c-btn--menu {
  width: 100%;
  height: 52px;
  padding: 0 8px;
}

/* hover はマウス等のある端末だけ（タップ後に色が残らないように）。
   キーボード操作時は :focus-visible で同じ見た目＋フォーカスリング（共通の :focus-visible の outline）を表示。
   色・背景のみ変化させ、寸法・配置は変えない */
@media (hover: hover) {
  .c-btn--line:hover {
    background-color: var(--btn-line-hover-bg);
    color: var(--btn-line-hover-color);
  }

  .c-btn--fill:hover {
    background-color: var(--btn-fill-hover-bg);
    color: var(--btn-fill-hover-color);
  }
}

.c-btn--line:focus-visible {
  background-color: var(--btn-line-hover-bg);
  color: var(--btn-line-hover-color);
}

.c-btn--fill:focus-visible {
  background-color: var(--btn-fill-hover-bg);
  color: var(--btn-fill-hover-color);
}

@media (min-width: 990px) {
  .c-btn--line {
    width: 430px;
  }

  .c-btn--fill {
    width: 430px;
  }

  .c-btn--menu {
    width: 100%;
    height: 60px;
  }
}

/* ---------- 泡の背景（js/bubble-background.js） ----------
   画面に固定し、本文の背面に描画。背景が不透明な箇所（メインビジュアル等）では隠れる */
.c-bubble-bg {
  position: fixed;
  inset: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

/* ---------- Video（ポスター → 再生開始後に動画へ切り替え） ----------
   表示枠の寸法は各セクション側で確保。ポスターと動画を同じ枠に重ね、
   JS が実際の再生開始（最初のフレーム描画）を確認してから .is-playing を付ける。
   再生できない場合はポスターがそのまま残る。 */
.c-video {
  position: relative;
  overflow: hidden;
  background: #fff;
}

.c-video__poster {
  position: absolute;
  inset: 0;
  width: 100%;
  max-width: none;
  height: 100%;
  object-fit: cover;
}

.c-video__video {
  position: absolute;
  opacity: 0;
}

.c-video.is-playing .c-video__video {
  opacity: 1;
}

/* ---------- 濃茶のラベル見出し（店舗「詳細情報」「アクセス」・ルネチェア「効果・特徴」） ---------- */
.c-label {
  width: 98px;
  background: var(--c-text);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
}

@media (min-width: 990px) {
  .c-label {
    width: 130px;
    font-size: 16px;
    line-height: 34px;
  }
}

/* ---------- Section title（英字 + 日本語ラベル） ---------- */
.c-sec-title {
  display: grid;
  width: 351px;
  font-weight: 400;
}

.c-sec-title__en,
.c-sec-title__ja {
  grid-area: 1 / 1;
}

.c-sec-title__en {
  color: var(--c-beige-60);
  font-family: var(--ff-script);
  font-size: 100px;
  font-weight: 400;
  line-height: 135px;
  white-space: nowrap;
}

.c-sec-title--solid .c-sec-title__en {
  color: var(--c-beige);
}

.c-sec-title__ja {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-self: end;
  align-self: start;
  margin-top: 90px;
  font-family: var(--ff-serif);
  font-size: 24px;
  font-weight: 400;
  line-height: 35px;
  white-space: nowrap;
}

.c-sec-title__ja::before,
.c-sec-title__ja::after {
  content: "";
  flex: none;
  width: 24px;
  height: 1px;
  background: var(--c-text);
}

.c-sec-title__ja::before {
  margin-right: 1px;
}

@media (max-width: 989.98px) {
  .c-sec-title--medium-sp .c-sec-title__ja {
    font-weight: 500;
  }
}

/* ==========================================================================
   Header（PC）
   ========================================================================== */
.l-header {
  display: none;
}

@media (min-width: 990px) {
  :root {
    /* PCのメインビジュアル高さ（.p-mv と共通） */
    --mv-h-pc: max(810px, 56.25vw);
    /* 予約ボタンの右余白・ボタン幅（ナビが予約ボタンに重ならないよう、バーの右側に確保） */
    --head-btns-right: clamp(20px, calc(61px - (1440px - 100vw) * 0.091), 61px);
    --head-btn-w: clamp(140px, calc(160px - (1440px - 100vw) * 0.045), 160px);
  }

  [id] {
    scroll-margin-top: var(--header-h);
  }

  .l-header {
    display: block;
    position: absolute;
    inset: 0 0 auto;
    z-index: 50;
    height: 0;
  }

  /* ナビ（ロゴ＋メニュー）のバー：Figma 2つ目の header（y=810 / 高さ85 / 背景 白50%） */
  .l-header__bar {
    position: absolute;
    top: var(--mv-h-pc);
    left: 0;
    right: 0;
    height: var(--header-h);
  }

  .l-header__bar.is-fixed {
    position: fixed;
    top: 0;
    background: rgba(255, 255, 255, 0.5);
  }

  .l-header__inner {
    display: flex;
    align-items: center;
    height: 100%;
    padding-left: clamp(20px, calc(71px - (1440px - 100vw) * 0.113), 71px);
    padding-right: calc(var(--head-btns-right) + var(--head-btn-w) * 2 + 9px + 16px);
  }

  .l-header__logo {
    flex: none;
    width: 120px;
  }

  .l-header__logo img {
    width: 120px;
    height: 52px;
    object-fit: cover;
  }

  .l-header__nav {
    margin-left: clamp(20px, calc(63px - (1440px - 100vw) * 0.096), 63px);
  }

  .l-header__nav-list {
    display: flex;
    gap: clamp(16px, calc(41px - (1440px - 100vw) * 0.056), 41px);
  }

  .l-header__nav-list a {
    display: block;
    color: #000;
    font-family: var(--ff-serif);
    font-size: 16px;
    font-weight: 600;
    line-height: 30px;
    white-space: nowrap;
  }

  /* 予約ボタン：初期表示から画面上部に固定（追従中のナビと同じ段・縦中央を揃える） */
  .l-header__btns {
    position: fixed;
    top: calc((var(--header-h) - 40px) / 2);
    right: var(--head-btns-right);
    z-index: 51;
    display: flex;
    gap: 9px;
  }
}

.c-head-btn {
  display: flex;
  align-items: center;
  width: var(--head-btn-w, 160px);
  height: 40px;
  padding-left: 18px;
  border: 1px solid var(--c-text);
  border-radius: 5px;
  background: #fff;
  font-size: 16px;
  line-height: 30px;
  white-space: nowrap;
}

.c-head-btn__icon {
  flex: none;
  width: 24px;
  height: 23px;
  object-fit: contain;
  transition: filter var(--btn-transition);
}

/* PCヘッダーの予約ボタン：btn_brwn と同じ hover（茶色背景・白文字・アイコンも白） */
.c-head-btn {
  transition: background-color var(--btn-transition), color var(--btn-transition);
}

@media (hover: hover) {
  .c-head-btn:hover {
    background-color: var(--btn-line-hover-bg);
    color: var(--btn-line-hover-color);
  }

  .c-head-btn:hover .c-head-btn__icon {
    filter: brightness(0) invert(1);
  }
}

.c-head-btn:focus-visible {
  background-color: var(--btn-line-hover-bg);
  color: var(--btn-line-hover-color);
}

.c-head-btn:focus-visible .c-head-btn__icon {
  filter: brightness(0) invert(1);
}

.c-head-btn--tel .c-head-btn__icon {
  width: 22px;
  height: 22px;
  margin: 0 1px 1px;
}

.c-head-btn__label {
  flex: 1;
  padding-right: 6px;
  text-align: center;
}

/* ==========================================================================
   SP メニューボタン / メニュー
   ========================================================================== */
.c-menu-btn {
  position: fixed;
  top: 14px;
  right: 18px;
  z-index: 70;
  width: 56px;
  height: 44px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}

/* 閉じた状態: 三本線（Figma hmbrg 40×11 / #E9CE98） */
.c-menu-btn__line {
  position: absolute;
  right: 9px;
  height: 2px;
  border-radius: 1px;
  background: var(--c-beige);
}

.c-menu-btn__line:nth-child(1) {
  top: 16px;
  width: 38px;
}

.c-menu-btn__line:nth-child(2) {
  top: 25px;
  width: 28px;
}

/* 開いた状態: ×（Figma 10012:518 / #3D2421） */
.c-menu-btn[aria-expanded="true"] .c-menu-btn__line {
  top: 25px;
  right: 9px;
  width: 34.5px;
  background: var(--c-text);
}

.c-menu-btn[aria-expanded="true"] .c-menu-btn__line:nth-child(1) {
  transform: translateY(0) rotate(45deg);
  top: 25px;
  right: 6px;
}

.c-menu-btn[aria-expanded="true"] .c-menu-btn__line:nth-child(2) {
  transform: rotate(-45deg);
  right: 6px;
}

@media (min-width: 990px) {
  .c-menu-btn {
    display: none;
  }
}

.p-spmenu {
  position: fixed;
  inset: 0;
  z-index: 60;
  overflow-y: auto;
  overscroll-behavior: contain;
  background-color: #fff;
  /* JPEG を先に指定し、image-set() 対応ブラウザでは WebP を優先（非対応なら前の JPEG のまま） */
  background-image: url("../assets/img/sp_menu_bg.jpg");
  background-image: image-set(
    url("../assets/img/sp_menu_bg.webp") type("image/webp"),
    url("../assets/img/sp_menu_bg.jpg") type("image/jpeg")
  );
  background-repeat: no-repeat;
  background-size: max(151.69%, 79.6dvh) auto;
  background-position: 25.2% 55.4%;
  /* 開閉のフェード（JS が .is-open を付け外し。閉じ終わったら hidden） */
  opacity: 0;
  transition: opacity 250ms ease;
}

.p-spmenu.is-open {
  opacity: 1;
}

/* 閉じるフェード中はクリックを受けない（JS で inert も付ける） */
.p-spmenu:not(.is-open) {
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .p-spmenu {
    transition: none;
  }
}

.p-spmenu__inner {
  min-height: 100%;
  padding: 26px 25px calc(var(--cta-h) + var(--safe-b) + 40px);
}

.p-spmenu__logo {
  display: block;
  width: 133.5px;
}

.p-spmenu__logo img {
  width: 133.5px;
  height: 56.9px;
  object-fit: cover;
}

.p-spmenu__list {
  margin: 66px 0 0 62px;
  font-family: var(--ff-serif);
  font-size: 18px;
  font-weight: 600;
  line-height: 32px;
}

.p-spmenu__list > li + li {
  margin-top: 41px;
}

.p-spmenu__list a {
  display: inline-block;
}

.p-spmenu__sub {
  margin: 18px 0 0 54px;
}

.p-spmenu__sub li + li {
  margin-top: 12px;
}

.p-spmenu__list > li:has(.p-spmenu__sub) + li {
  margin-top: 18px;
}

@media (min-width: 990px) {
  .p-spmenu {
    display: none !important;
  }
}

/* ==========================================================================
   SP 固定バー（TOP・メニュー表示中で共通）
   ========================================================================== */
.c-cta-bar {
  position: fixed;
  inset: auto 0 0;
  z-index: 65;
  display: flex;
  align-items: stretch;
  height: calc(var(--cta-h) + var(--safe-b));
  padding-bottom: var(--safe-b);
  overflow: hidden;
  background: var(--cta-bg);
  color: var(--cta-color);
}

/* 背景の蔦（cta_ivy.svg 60×113 を -90°回転＋上下反転し、左端に 113×60 で配置） */
.c-cta-bar::before {
  content: "";
  position: absolute;
  top: -26.5px;
  left: 26.5px;
  width: 60px;
  height: 113px;
  background: url("../assets/svg/cta_ivy.svg") no-repeat 0 0 / 100% 100%;
  rotate: -90deg;
  scale: 1 -1;
  pointer-events: none;
}

.c-cta-bar__text {
  position: relative;
  flex: 1;
  min-width: 0;
  padding: var(--cta-text-top) 0 0 var(--cta-pad-l);
  font-size: var(--cta-font-size);
  line-height: var(--cta-line-height);
  white-space: nowrap;
}

.c-cta-bar__btn {
  position: relative;
  flex: none;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  width: var(--cta-btn-w-line);
  padding-top: var(--cta-icon-top);
}

.c-cta-bar__btn--tel {
  width: var(--cta-btn-w-tel);
}

/* 区切り線（白 1px） */
.c-cta-bar__btn::before {
  content: "";
  position: absolute;
  top: var(--cta-divider-top);
  left: 0;
  width: 1px;
  height: var(--cta-divider-h);
  background: currentColor;
}

.c-cta-bar__btn--line img {
  width: 32px;
  height: 30px;
}

.c-cta-bar__btn--tel img {
  width: 28px;
  height: 28px;
}

@media (min-width: 990px) {
  .c-cta-bar {
    display: none;
  }
}

/* ==========================================================================
   Main Visual
   ========================================================================== */
/* SP: Figma main_area3（390×750）に合わせ、1画面目を「MV＋固定バー」で埋める。
   画面が低い端末ではFigmaの動画高さ692pxを下限にする */
.p-mv {
  --mv-h: max(692px, calc(100vh - var(--cta-h) - var(--safe-b)));
  --mv-video-ratio: 0.5625; /* 動画の 幅÷高さ（SP 1080×1920） */
  position: relative;
  display: grid;
  height: var(--mv-h);
  grid-template: 100% / 100%;
  overflow: hidden;
}

@supports (height: 100svh) {
  .p-mv {
    --mv-h: max(692px, calc(100svh - var(--cta-h) - var(--safe-b)));
  }
}

.p-mv__media,
.p-mv__stage {
  grid-area: 1 / 1;
}

.p-mv__media {
  min-height: 0;
}

.p-mv__video {
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 装飾・ロゴ・コピーを重ねるステージ（SP 390×692 基準） */
.p-mv__stage {
  position: relative;
  width: min(100%, 600px);
  height: 692px;
  margin: auto;
}

/* 動画の表示範囲と同じ枠：object-fit: cover と同じ計算（幅 = max(枠幅, 枠高×動画比)、動画と同じ縦横比、中央）。
   マスク・蔦・ロゴはこの枠に対する%で置くので、画面サイズが変わって動画が拡大されてもずれない。
   SP: Figma 390×692（動画は幅390で高さ693.33。上下0.67pxずつ切れるため y に +0.667 して換算） */
.p-mv__frame {
  position: absolute;
  top: 50%;
  left: 50%;
  width: max(100%, var(--mv-h) * var(--mv-video-ratio));
  aspect-ratio: 1080 / 1920;
  translate: -50% -50%;
}

.p-mv__mask {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.p-mv__ivy {
  position: absolute;
  width: 42.527%; /* 165.854 / 390 */
  max-width: none;
  height: auto;
}

.p-mv__ivy--01 {
  top: 23.606%;  /* (163 + 0.667) / 693.333 */
  left: 43.59%;  /* 170 / 390 */
}

.p-mv__ivy--02 {
  top: 65.577%;  /* (454 + 0.667) / 693.333 */
  left: 15.385%; /* 60 / 390 */
}

.p-mv__logo {
  position: absolute;
  top: 55.337%;  /* (383.007 + 0.667) / 693.333 */
  left: 28.974%; /* 113 / 390 */
  width: 42.821%; /* 167 / 390 */
}

.p-mv__logo img {
  width: 100%;
  height: auto;
}

.p-mv__catch {
  font-family: var(--ff-serif);
  font-weight: 400;
}

.p-mv__catch-s,
.p-mv__catch-l {
  position: absolute;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  white-space: nowrap;
}

.p-mv__catch-s {
  top: 60px;
  right: 32px;
  width: 17px;
  font-size: 12px;
  line-height: 17px;
  letter-spacing: 1px;
}

.p-mv__catch-l {
  top: 209px;
  right: 29px;
  width: 24px;
  font-size: 24px;
  line-height: 24px;
}

.p-mv__catch-l--sub {
  top: 468px;
  right: auto;
  left: 25px;
}

@media (min-width: 990px) {
  .p-mv {
    --mv-h: var(--mv-h-pc);
    --mv-video-ratio: 1.7778; /* PC 1920×1080 */
  }

  .p-mv__frame {
    aspect-ratio: 1920 / 1080;
  }

  .p-mv__stage {
    width: 830px;
    height: 810px;
  }

  /* PC: Figma 1440×810（動画と同じ16:9） */
  .p-mv__ivy {
    width: 21.976%; /* 316.453 / 1440 */
  }

  .p-mv__ivy--01 {
    top: 38.642%;  /* 313 / 810 */
    left: 21.181%; /* 305 / 1440 */
  }

  .p-mv__ivy--02 {
    top: 8.056%;   /* 65.25 / 810 */
    left: 56.875%; /* 819 / 1440 */
  }

  .p-mv__logo {
    top: 54.198%;  /* 439 / 810 */
    left: 43.611%; /* 628 / 1440 */
    width: 12.5%;  /* 180 / 1440 */
  }

  .p-mv__catch-s {
    top: 95px;
    right: auto;
    left: 435px;
    width: 20px;
    font-size: 18px;
    line-height: 20px;
    letter-spacing: 2px;
  }

  .p-mv__catch-l {
    top: 95px;
    right: auto;
    left: 395px;
    width: 36px;
    font-size: 28px;
    line-height: 36px;
    letter-spacing: 2px;
  }

  .p-mv__catch-l--sub {
    top: 539.6px;
  }
}

/* ==========================================================================
   SEV
   ========================================================================== */
.p-sev {
  position: relative;
  z-index: 1;
  padding-top: 23px;
}

.p-sev__inner {
  display: flex;
  flex-direction: column;
}

.p-sev__visual {
  margin-left: calc(var(--sp-gl) - 46px);
}

.p-sev__item {
  width: 266px;
  height: 142px;
  overflow: hidden;
}

.p-sev__item img {
  position: relative;
  left: -57px;
  width: 323px;
  max-width: none;
  height: 142.3px;
}

.p-sev__logo {
  width: 172px;
  height: 77px;
  margin-left: 36px;
  overflow: hidden;
}

.p-sev__logo img {
  width: 172px;
  max-width: none;
  height: 186.2px;
  margin-top: -92.6px;
}

.p-sev__body {
  width: min(calc(100% - 78px), 600px);
  margin: 20px 0 0 calc(var(--sp-gl) - 5px);
}

.p-sev__title {
  font-family: var(--ff-serif);
  font-size: 18px;
  font-weight: 600;
  line-height: 32px;
}

.p-sev__text {
  max-width: 306px;
  margin-top: 30px;
  text-align: justify;
}

.p-sev__btn {
  display: flex;
  justify-content: center;
  margin-top: 46px;
}

@media (min-width: 600px) {
  .p-sev__text {
    max-width: none;
  }
}

@media (min-width: 990px) {
  .p-sev {
    padding-top: 72px;
  }

  .p-sev__inner {
    display: grid;
    grid-template-columns: minmax(0, 516px) minmax(0, 484px);
    width: min(1000px, calc(100% - 40px));
    margin: 0 auto;
  }

  .p-sev__visual {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0;
  }

  .p-sev__item {
    width: 502.6px;
    max-width: 100%;
    height: 221px;
  }

  .p-sev__item img {
    left: -0.75px;
    width: 502px;
    height: 221.4px;
  }

  .p-sev__logo {
    width: 191.8px;
    height: 85.9px;
    margin: 0;
  }

  .p-sev__logo img {
    width: 208px;
    height: 225.2px;
    margin-top: -120.8px;
  }

  .p-sev__body {
    width: auto;
    margin: 160px 0 0;
  }

  .p-sev__title {
    font-size: 22px;
    line-height: 34px;
  }

  .p-sev__text {
    max-width: none;
    margin-top: 38px;
  }

  .p-sev__btn {
    grid-column: 1 / -1;
    margin-top: 72px;
  }
}

/* ==========================================================================
   Menu
   ========================================================================== */
.p-menu {
  position: relative;
  padding: 110px 0 56px;
}

.p-menu__ivy {
  position: absolute;
  z-index: 0;
  background-repeat: no-repeat;
  pointer-events: none;
}

/* 右上: ivy_beige10_right を 196×138 で切り抜き */
.p-menu__ivy--r {
  top: 37px;
  right: -1px;
  width: 196px;
  height: 138px;
  background-image: url("../assets/svg/ivy_beige_right.svg");
  background-size: 338.5px 245px;
  background-position: -0.25px -107px;
}

/* 左下: ivy_beige10_left を 148×128 で切り抜き、-90°回転 */
.p-menu__ivy--l {
  top: 336px;
  left: -10px;
  width: 148px;
  height: 128px;
  background-image: url("../assets/svg/ivy_beige_left.svg");
  background-size: 245px 338.5px;
  background-position: 0 -210.25px;
  transform: rotate(-90deg);
}

.p-menu__inner {
  position: relative;
  z-index: 1;
  width: min(calc(100% - 40px), 600px);
  margin: 0 auto;
  text-align: center;
}

.p-menu__title {
  color: var(--c-beige);
  font-family: var(--ff-script);
  font-size: 100px;
  font-weight: 400;
  line-height: 135px;
}

.p-menu__lead {
  line-height: 30px;
}

.p-menu__nav {
  display: grid;
  grid-template-columns: repeat(2, 142px);
  justify-content: center;
  gap: 21px;
  margin-top: 49px;
}

@media (min-width: 600px) {
  .p-menu__nav {
    grid-template-columns: repeat(2, 200px);
  }
}

@media (min-width: 990px) {
  .p-menu {
    padding: 147px 0;
  }

  .p-menu__ivy--r {
    top: -91px;
    right: 0;
    width: 547.4px;
    height: 396.3px;
    background-size: 100% 100%;
    background-position: 0 0;
  }

  .p-menu__ivy--l {
    top: 245px;
    left: 1px;
    width: 543px;
    height: 396.3px;
    background: none;
    transform: none;
  }

  .p-menu__ivy--l::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 396.3px;
    height: 543px;
    margin: -271.5px 0 0 -198.15px;
    background: url("../assets/svg/ivy_beige_left.svg") no-repeat 0 0 / 100% 100%;
    rotate: 90deg;
    scale: 1 -1;
  }

  .p-menu__inner {
    width: min(1000px, calc(100% - 40px));
  }

  .p-menu__lead {
    margin-top: 2px;
  }

  .p-menu__nav {
    grid-template-columns: repeat(4, minmax(0, 213.5px));
    gap: 13px;
    margin-top: 69px;
  }
}

/* ==========================================================================
   Courses（ボディ / フェイシャル / クーポン / オプション）
   ========================================================================== */
.p-courses {
  position: relative;
  padding-bottom: 81px;
}

.p-courses__deco {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

/* ベージュの背景パネル（右側角丸） */
.p-courses__panel {
  position: absolute;
  top: 59px;
  bottom: 0;
  left: 0;
  width: calc(var(--sp-gl) + var(--sp-cw) * 0.8693);
  border-radius: 0 20px 20px 0;
  background: var(--c-beige-bg);
}

.p-courses__ivy {
  position: absolute;
  max-width: none;
}

.p-courses__ivy--1,
.p-courses__ivy--3 {
  width: 601px;
  height: 435px;
  rotate: -69.59deg;
}

.p-courses__ivy--1 {
  top: calc(336.5px - 217.5px);
  left: calc(var(--sp-gl) - 46px + 42.6px - 300.5px);
}

.p-courses__ivy--2 {
  top: calc(1564px - 300.5px);
  left: calc(var(--sp-gl) - 46px + 180.5px - 217.5px);
  width: 435px;
  height: 601px;
  rotate: -9.14deg;
}

.p-courses__ivy--3 {
  top: calc(2367.5px - 217.5px);
  left: calc(var(--sp-gl) - 46px + 80.6px - 300.5px);
}

/* ---- コース（SP: グリッドで 余白 / 本文列 / 右余白 を定義） ---- */
.p-course {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: [full-start] var(--sp-gl) [content-start] var(--sp-cw) [content-end] 1fr [full-end];
}

.p-course--facial {
  margin-top: 70px;
}

.p-course__main {
  display: contents;
}

.p-course__title {
  grid-column: full-start / content-end;
  grid-row: 1;
  justify-self: end;
  width: calc(100% - (var(--sp-gl) - 46px));
  padding-left: 0;
}

.p-course__title .c-sec-title__ja {
  margin-right: 1px;
}

.p-course__movie {
  grid-column: content-start / full-end;
  grid-row: 2;
}

.p-course--body .p-course__movie {
  margin-top: 15px;
  aspect-ratio: 345 / 199;
  border-radius: 15px 0 0 15px;
}

.p-course--facial .p-course__movie {
  margin-top: 18px;
  margin-right: -22px;
  aspect-ratio: 366 / 198;
  border-radius: 15px;
}

/* 動画（ボディ用_Ver2 / フェイシャル用_Ver2）は 16:9 全面の映像。枠いっぱいに表示し、はみ出しは中央基準で切り取る。
   ポスター（*_v2_poster.jpg）は同じ 16:9 の先頭フレームなので、object-fit: cover で同じ見え方になる */
.p-course__movie .c-video__video {
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-course__text {
  grid-column: content-start / content-end;
  grid-row: 3;
  margin-top: 39px;
  text-align: justify;
}

.p-course--facial .p-course__text {
  margin-top: 45px;
}

.p-course__btns {
  grid-column: content-start / content-end;
  grid-row: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 27px;
  margin-top: 49px;
}

/* ---- クーポン（2026-10-21：画像の下に説明 .c-coupon-info。Figma SP 28266:683 / PC 28266:409） ---- */
.p-coupon {
  position: relative;
  z-index: 1;
  width: min(calc(100% - 82px), 460px);
  margin: 69px auto 0;
}

.p-coupon .c-coupon-info {
  --ci-catch-pb: 8px;
  --ci-ttl-mt: 16px;
  --ci-sub-mt: 3px;
  --ci-ttl-pb: 17px;
}

.p-coupon img {
  width: 100%;
  height: auto;
}

/* SP：Menu 欄の「クーポン」（#coupon）で移動した時、右上の固定メニューボタン（下端58px）に画像が隠れないよう、その下で止める */
@media (max-width: 989.98px) {
  .p-coupon {
    scroll-margin-top: 72px;
  }
}

/* クーポンページ（/coupon/）へのリンク。hover・フォーカスはボディコースのバナー（.p-lbanners）と同じ */
.p-coupon__link {
  display: block;
  transition: opacity var(--btn-transition);
}

@media (hover: hover) {
  .p-coupon__link:hover {
    opacity: 0.7;
  }
}

.p-coupon__link:focus-visible {
  opacity: 0.7;
}

/* ---- オプション ---- */
.p-option {
  position: relative;
  z-index: 1;
  width: var(--sp-cw);
  margin: 42px 0 0 var(--sp-gl);
}

.p-option__title {
  width: calc(100% + 45px);
  margin-left: -46px;
}

.p-option__img {
  width: calc(100% + 5px);
  margin-top: 36px;
  aspect-ratio: 311 / 206.5;
  overflow: hidden;
  border-radius: 15px;
}

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

.p-option__name {
  margin-top: 30.5px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--c-beige);
  font-size: 20px;
  font-weight: 500;
  line-height: 30px;
}

.p-option__chair .p-option__name {
  width: calc(100% + 5px);
}

.p-option__cap {
  margin-top: 24px;
  text-align: justify;
}

.p-option__btn {
  margin: 12px auto 0;
}

.p-option__others {
  margin-top: 49px;
}

.p-option__dots {
  width: 15px;
  height: 12px;
  margin: 0 auto;
}

.p-option__text {
  margin-top: 32px;
  text-align: justify;
}

.p-option__others .p-option__btn {
  margin-top: 39px;
}

@media (min-width: 990px) {
  .p-courses {
    padding-bottom: 128px;
  }

  .p-courses__panel {
    top: 148px;
    width: calc(50% + 280px);
  }

  .p-courses__ivy--1,
  .p-courses__ivy--3 {
    width: 788.2px;
    height: 570.5px;
  }

  .p-courses__ivy--1 {
    top: calc(616.8px - 285.25px);
    left: calc(50% - 720px + 667.8px - 394.1px);
  }

  .p-courses__ivy--2 {
    top: calc(1389.8px - 394.1px);
    left: calc(50% - 720px + 390.2px - 285.25px);
    width: 570.5px;
    height: 788.2px;
  }

  .p-courses__ivy--3 {
    top: calc(2163.1px - 285.25px);
    left: calc(50% - 720px + 567.8px - 394.1px);
  }

  .p-course {
    grid-template-columns: [title-start] 71px [text-start] 280px [text-end] minmax(24px, 49px) [movie-start] minmax(0, 600px) [movie-end];
    grid-template-rows: auto auto;
    width: min(1000px, calc(100% - 40px));
    margin: 0 auto;
  }

  .p-course--facial {
    margin-top: 84px;
  }

  .p-course__main {
    display: block;
    grid-column: title-start / text-end;
    grid-row: 1;
  }

  .p-course__title {
    justify-self: start;
    width: 351px;
    margin: 0;
  }

  .p-course__movie,
  .p-course--body .p-course__movie,
  .p-course--facial .p-course__movie {
    /* Figma pc_top_1440px movie_box（28121:421 / 28121:435）：600×380・角丸15px・上67px（ボディ・フェイシャル共通） */
    grid-column: movie-start / movie-end;
    grid-row: 1;
    align-self: start;
    margin: 67px 0 0;
    aspect-ratio: 600 / 380;
    border-radius: 15px;
  }

  .p-course__text,
  .p-course--facial .p-course__text {
    width: 280px;
    margin: 47px 0 0 71px;
  }

  .p-course__btns {
    grid-column: 1 / -1;
    grid-row: 2;
    gap: 35px;
    margin-top: 68px; /* ボタン上端 515 −（動画 67 + 380） */
  }

  .p-course--facial .p-course__btns {
    margin-top: 72px; /* ボタン上端 519 −（動画 67 + 380） */
  }

  .p-coupon {
    width: 600px;
    margin-top: 109px;
  }

  .p-coupon .c-coupon-info {
    --ci-img-gap: 24px;
    --ci-catch-pb: 13px;
    --ci-ttl-mt: 18px;
    --ci-catch-fs: 16px;
    --ci-big-fs: 28px;
    width: 430px;
    margin-inline: auto;
  }

  .p-option {
    width: min(1000px, calc(100% - 40px));
    margin: 23px auto 0;
  }

  .p-option__title {
    width: 351px;
    margin-left: 0;
  }

  .p-option__chair,
  .p-option__others {
    width: min(600px, 100%);
    margin-left: auto;
    margin-right: auto;
  }

  .p-option__img {
    width: 100%;
    margin-top: 43px;
    aspect-ratio: 600 / 401;
  }

  .p-option__name,
  .p-option__chair .p-option__name {
    width: 100%;
    margin-top: 41px;
  }

  .p-option__btn {
    margin-top: 75px;
  }

  .p-option__others {
    margin-top: 89px;
  }

  .p-option__text {
    margin-top: 58px;
  }

  .p-option__others .p-option__btn {
    margin-top: 58px;
  }
}

/* ==========================================================================
   Blog
   ========================================================================== */
.p-blog {
  position: relative;
  padding: 64px 0 105px;
}

.p-blog__ivy {
  position: absolute;
  z-index: 0;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}

.p-blog__ivy--l {
  top: calc(462.5px - 169px);
  left: calc(18.2px - 122.5px);
  width: 245px;
  height: 338px;
  background-image: url("../assets/svg/ivy_beige_left.svg");
  rotate: -49.93deg;
}

.p-blog__ivy--r {
  top: calc(203px - 122.5px);
  right: calc(390px - 421px - 169px);
  width: 338px;
  height: 245px;
  background-image: url("../assets/svg/ivy_beige_right.svg");
  rotate: 67.37deg;
}

.p-blog__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: [full-start] var(--sp-gl) [content-start] var(--sp-cw) [content-end] 1fr [full-end];
}

.p-blog__title {
  grid-column: full-start / content-end;
  justify-self: end;
  width: calc(100% - (var(--sp-gl) - 46px));
}

.p-blog__title .c-sec-title__ja {
  margin-right: 1px;
}

.p-blog__list {
  grid-column: content-start / content-end;
  margin: 46px 0 0 -8px;
}

.p-blog__item + .p-blog__item {
  margin-top: 24px;
}

.p-blog__link {
  display: grid;
  grid-template-columns: 89px minmax(0, 1fr);
  align-items: center;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--c-beige);
}

.p-blog__date {
  font-size: 13px;
  line-height: 30px;
}

.p-blog__ttl {
  overflow: hidden;
  font-size: 16px;
  line-height: 30px;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.p-blog__btn {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
  margin-top: 57px;
}

@media (min-width: 990px) {
  .p-blog {
    padding: 112px 0 106px;
  }

  .p-blog__ivy--l {
    top: calc(516px - 281.35px);
    left: calc(235.4px - 203.65px);
    width: 407.3px;
    height: 562.7px;
  }

  .p-blog__ivy--r {
    top: -59px;
    right: 0;
    width: 562.7px;
    height: 407.3px;
    rotate: none;
    scale: 1 -1;
  }

  .p-blog__inner {
    display: block;
    width: min(1000px, calc(100% - 40px));
    margin: 0 auto;
  }

  .p-blog__title {
    justify-self: start;
    width: 351px;
  }

  .p-blog__list {
    width: auto;
    margin: 72px 0 0 clamp(120px, 28.5%, 285px);
  }

  .p-blog__item + .p-blog__item {
    margin-top: 26.6px;
  }

  .p-blog__link {
    grid-template-columns: 118px minmax(0, 1fr);
    padding-bottom: 13.5px;
  }

  .p-blog__date {
    font-size: 14px;
  }

  .p-blog__btn {
    margin-top: 80.5px;
  }
}

/* ==========================================================================
   Footer
   ========================================================================== */
/* ---- 店舗情報 ----
   2026-10-21：フッター冒頭の Instagram バナー（.l-footer__insta）を削除。バナーとの間の余白（SP 80px / PC 77px）も削除 */

.p-shop__visual {
  position: relative;
  height: 254px;
  overflow: hidden;
}

.p-shop__visual::before {
  content: "";
  position: absolute;
  inset: 1px 0 0;
  /* 画像は変数で差し替え可能（--shop-bg＝JPEG/PNG、--shop-bg-set＝WebP を含む image-set）。
     変数経由の image-set() は非対応ブラウザで無効値になり前の指定に戻らないため、@supports で切り替える（下） */
  background-image: var(--shop-bg, url("../assets/img/bg_logo.jpg"));
  background-repeat: no-repeat;
  background-size: var(--shop-bg-size, 114.51% 117.65%);
  background-position: var(--shop-bg-pos, 50.5% 48.5%);
  opacity: 0.6;
}

@supports (background-image: image-set(url("x.webp") type("image/webp"))) {
  .p-shop__visual::before {
    background-image: var(--shop-bg-set, image-set(
      url("../assets/img/bg_logo.webp") type("image/webp"),
      url("../assets/img/bg_logo.jpg") type("image/jpeg")
    ));
  }
}

.p-shop__ivy {
  position: absolute;
  pointer-events: none; /* 装飾：リンク・ボタンの操作を妨げない */
  width: 167px;
  height: 116px;
  background-image: url("../assets/svg/ivy_03_wht.svg");
  background-repeat: no-repeat;
}

.p-shop__ivy--tl {
  top: 0;
  left: 0;
  background-size: 111.98% 117.7%;
  background-position: 0 1%;
  rotate: 180deg;
}

.p-shop__ivy--br {
  right: 0;
  bottom: 0;
  background-size: 111.69% 116.38%;
  background-position: 1.3% 0;
}

.p-shop__logo {
  position: absolute;
  top: 72px;
  left: calc(50% - 128px);
  width: 244px;
  height: 104px;
  object-fit: cover;
}

.p-shop__info {
  width: var(--sp-cw);
  margin: 29px 0 0 calc(var(--sp-gl) - 7px);
}

.p-shop__address {
  font-size: 16px;
  line-height: 24px;
}

.p-shop__tel {
  margin-top: 24px;
  line-height: 32px;
}

.p-shop__hours {
  margin-top: 24px;
}

.p-shop__hours-label {
  display: inline-block;
  line-height: 32px;
}

.p-shop__btn {
  margin: 20px auto 0;
}

/* ---- サイトマップ ---- */
.l-footer__bottom {
  margin-top: 80px;
  padding: 54px 0 calc(29px + var(--cta-h) + var(--safe-b));
  background: var(--c-beige-bg);
}

.l-footer__inner {
  width: min(calc(100% - 28px), 640px);
  margin: 0 auto;
}

.l-footer__sitemap {
  padding-left: 6px;
}

.l-footer__group + .l-footer__group {
  margin-top: 27px;
}

.l-footer__group-ttl {
  color: var(--c-beige);
  font-family: var(--ff-script);
  font-size: 40px;
  line-height: 28px;
}

.l-footer__group-list {
  margin: 10px 0 0 21px;
  font-size: 14px;
  line-height: 36px;
}

.l-footer__links {
  position: relative;
  margin-top: 38px;
  padding: 49px 0 47px 27px;
  border-top: 1px solid var(--c-beige);
  border-bottom: 1px solid var(--c-beige);
  font-size: 14px;
  line-height: 40px;
}

/* Instagram アイコン（Figma insta_icon 48×48：SP は右下＝枠の右から16px・下の線から15px、PC は行の右端から30px・上下中央）。
   hover・フォーカス時はアイコンの不透明度 0.6（Figma の hover：0.2秒 ease-out） */
.l-footer__sns {
  position: absolute;
  right: 16px;
  bottom: 15px;
  line-height: 0;
}

.l-footer__sns-link {
  display: block;
  width: 48px;
  height: 48px;
}

.l-footer__sns-link img {
  width: 48px;
  height: 48px;
  transition: opacity 200ms ease-out;
}

@media (hover: hover) {
  .l-footer__sns-link:hover img {
    opacity: 0.6;
  }
}

.l-footer__sns-link:focus-visible img {
  opacity: 0.6;
}

.l-footer__copy {
  margin-top: 15px;
  color: var(--c-copy);
  font-size: 13px;
  line-height: 24px;
  letter-spacing: 1.3px;
}

.l-footer__copy small {
  font-size: inherit;
}

@media (min-width: 990px) {
  .p-shop__visual {
    height: 559px;
  }

  .p-shop__visual::before {
    inset: 0;
    background-size: 126.44% 129.9%;
    background-position: 71.2% 21.7%;
  }

  .p-shop__ivy {
    width: 392px;
    height: 270px;
  }

  .p-shop__ivy--tl {
    background-size: 120.94% 118.32%;
    background-position: 0 39.6%;
  }

  .p-shop__ivy--br {
    bottom: -1px;
    background-size: 110.22% 116.02%;
    background-position: 0 0;
  }

  .p-shop__logo {
    top: 182px;
    left: calc(50% - 219px);
    width: 433px;
    height: 184px;
  }

  .p-shop__info {
    width: min(1000px, calc(100% - 40px));
    margin: 55px auto 0;
    padding-left: clamp(120px, 28.5%, 285px);
  }

  .p-shop__btn {
    margin: 32px 0 0;
  }

  .l-footer__bottom {
    margin-top: 77px;
    padding: 81px 0 83px;
  }

  .l-footer__inner {
    width: min(1000px, calc(100% - 40px));
  }

  .l-footer__sitemap {
    display: grid;
    grid-template-columns: minmax(0, 340px) minmax(0, 340px) minmax(0, 1fr);
    padding-left: 0;
  }

  .l-footer__group + .l-footer__group {
    margin-top: 0;
  }

  .l-footer__group-list {
    margin: 26.6px 0 0 42px;
  }

  .l-footer__links {
    display: flex;
    flex-wrap: wrap;
    column-gap: 42px;
    margin: 49px 0 0 4px;
    padding: 28px 0 28px 38px;
  }

  .l-footer__copy {
    margin: 30px 0 0 4px;
  }

  .l-footer__sns {
    top: 50%;
    right: 30px;
    bottom: auto;
    transform: translateY(-50%);
  }
}

[tabindex="-1"]:focus {
  outline: none;
}

/* ==========================================================================
   下層ページ共通（body.is-lower）
   ========================================================================== */

/* ---------- SP 下層ヘッダー（Figma sp_お問い合わせ header：390×78 / 白50% / ロゴ 115×49） ---------- */
.l-sp-header {
  display: none;
}

@media (max-width: 989.98px) {
  .is-lower .l-sp-header {
    position: fixed;
    inset: 0 0 auto;
    z-index: 55;
    display: flex;
    align-items: flex-start;
    height: 78px;
    padding: 15px 0 0 15px;
    background: rgba(255, 255, 255, 0.5);
  }

  .l-sp-header__logo {
    display: block;
    width: 115px;
  }

  .l-sp-header__logo img {
    width: 115px;
    height: 49px;
    object-fit: cover;
  }

  /* お問い合わせ等（白帯ヘッダーあり）ではハンバーガーの線が 5px 下（Figma hmbrg top 35）。
     コースページ（.is-course）は白帯なし・TOPと同じ位置（Figma hmbrg top 30） */
  .is-lower:not(.is-course) .c-menu-btn {
    top: 19px;
  }
}

/* ---------- PC 下層ヘッダー：最初からロゴ・ナビ・予約ボタンを上部に固定（白50%） ---------- */
@media (min-width: 990px) {
  .is-lower .l-header__bar {
    position: fixed;
    top: 0;
    background: rgba(255, 255, 255, 0.5);
  }
}

/* ---------- ページタイトル（Figma main_top_area：SP 390×176 / PC 1440×230） ---------- */
.c-page-title {
  position: relative;
  height: 176px;
  overflow: hidden;
  background: var(--c-beige);
}

.c-page-title__ivy {
  position: absolute;
  background-image: url("../assets/svg/ivy_03_wht.svg");
  background-repeat: no-repeat;
  opacity: 0.25;
  pointer-events: none;
}

/* 右上：ivy を 208×134 で切り抜き */
.c-page-title__ivy--r {
  top: 0;
  right: 0;
  width: 208px;
  height: 134px;
  background-size: 222.9px 159.3px;
  background-position: -0.3px -25.8px;
}

/* 左下：ivy を 95×58 で切り抜き、180°回転 */
.c-page-title__ivy--l {
  top: 118px;
  left: 0;
  width: 95px;
  height: 58px;
  background-size: 223.2px 161.8px;
  background-position: 0.3px -103.5px;
  rotate: 180deg;
}

.c-page-title__inner {
  position: relative;
  height: 100%;
  padding: 93px 0 0 25px;
}

.c-page-title__heading {
  font-weight: 400;
}

.c-page-title__en,
.c-page-title__ja {
  display: block;
}

.c-page-title__en {
  height: 23px;
  color: #fff;
  font-family: var(--ff-script);
  font-size: 22px;
  line-height: 1.3;
}

.c-page-title__ja {
  color: var(--c-text);
  font-family: var(--ff-serif);
  font-size: 24px;
  line-height: 34px;
}

@media (min-width: 990px) {
  .c-page-title {
    height: 230px;
  }

  .c-page-title__ivy--r {
    right: auto;
    left: calc(66.67% - 26px);
    width: 469px;
    height: 213px;
    background-size: 469.4px 337.9px;
    background-position: 0 -124.5px;
  }

  .c-page-title__ivy--l {
    top: 106px;
    left: 2px;
    width: 258px;
    height: 124px;
    background-size: 468.5px 339.1px;
    background-position: -0.3px -214.9px;
  }

  .c-page-title__inner {
    width: min(1000px, calc(100% - 40px));
    margin: 0 auto;
    padding: 122px 0 0;
  }

  .c-page-title__en {
    height: 30px;
    font-size: 26px;
  }

  .c-page-title__ja {
    font-size: 28px;
  }
}

/* ==========================================================================
   お問い合わせ（/contact）
   ========================================================================== */
.p-contact {
  display: flex;
  flex-direction: column;
  width: min(calc(100% - 90px), 300px);
  margin: 44px auto 0;
}

.p-contact--qa {
  margin-top: 85px;
  padding-bottom: 142px;
}

.p-contact__catch {
  padding-bottom: 22px;
  border-bottom: 1px solid var(--c-text);
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  letter-spacing: 0.9px;
}

.p-contact--qa .p-contact__catch {
  padding-bottom: 24px;
}

.p-contact__text {
  margin-top: 28px;
  line-height: 28px;
}

.p-contact--qa .p-contact__text {
  margin-top: 30px;
}

.p-contact__dots {
  width: 15px;
  height: 12px;
  margin: 39px auto 0;
}

.p-contact--qa .p-contact__dots {
  margin-top: 35px;
}

/* 店舗の電話番号バナー（Figma shop_ban：SP 300×70 / PC 390×84 / 角丸10） */
.p-contact__shop {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 70px;
  margin-top: 57px;
  padding: 0 10px 0 15px;
  border-radius: 10px;
  background: var(--c-beige);
  white-space: nowrap;
  transition: background-color var(--btn-transition), color var(--btn-transition);
}

.p-contact__shop-name {
  display: flex;
  flex-direction: column;
  min-width: 74px;
  font-size: 22px;
  line-height: 28px;
}

.p-contact__shop-brand {
  margin-bottom: 2px;
  font-size: 12px;
  line-height: 14px;
}

.p-contact__shop-tel {
  font-size: 22px;
  line-height: 28px;
  letter-spacing: 1.1px;
}

.p-contact__shop-tel-label {
  font-size: 14px;
  letter-spacing: 0;
}

/* btn_beige と同じ hover / キーボードフォーカス */
@media (hover: hover) {
  .p-contact__shop:hover {
    background-color: var(--btn-fill-hover-bg);
    color: var(--btn-fill-hover-color);
  }
}

.p-contact__shop:focus-visible {
  background-color: var(--btn-fill-hover-bg);
  color: var(--btn-fill-hover-color);
}

.p-contact__btn {
  margin-top: 41px;
}

@media (min-width: 990px) {
  .p-contact {
    width: min(700px, calc(100% - 40px));
    margin-top: 70px;
  }

  .p-contact--qa {
    margin-top: 114px;
    padding-bottom: 231px;
  }

  .p-contact__catch,
  .p-contact--qa .p-contact__catch {
    padding-bottom: 30px;
    font-size: 22px;
    letter-spacing: 1.1px;
  }

  .p-contact__text,
  .p-contact--qa .p-contact__text {
    margin-top: 36px;
  }

  .p-contact__dots {
    margin-top: 54px;
  }

  .p-contact--qa .p-contact__dots {
    margin-top: 51px;
  }

  .p-contact__shop {
    gap: 8px;
    width: 390px;
    height: 84px;
    margin: 56px auto 0;
    padding: 0 14px 0 19px;
  }

  .p-contact__shop-name {
    min-width: 104px;
    font-size: 32px;
  }

  .p-contact__shop-brand {
    margin-bottom: 5px;
    font-size: 14px;
  }

  .p-contact__shop-tel {
    font-size: 28px;
    letter-spacing: 1.4px;
  }

  .p-contact__btn {
    width: 390px;
    margin: 55px auto 0;
  }
}

/* ---------- SP 下層フッターの背景（店舗情報の画像） ----------
   Figma の下層SPフッターは別画像（浴室写真 fff4b・素材未支給）。支給までは TOP と同じ画像を仮で指定。
   差し替え時はここの4つの変数だけを変更する（TOP には影響しない） */
@media (max-width: 989.98px) {
  .is-lower .p-shop__visual {
    --shop-bg: url("../assets/img/bg_logo.jpg"); /* TODO: 下層用の画像に差し替え */
    --shop-bg-set: image-set(
      url("../assets/img/bg_logo.webp") type("image/webp"),
      url("../assets/img/bg_logo.jpg") type("image/jpeg")
    ); /* 差し替え時は WebP 版も合わせて変更（WebP がなければ JPEG/PNG だけを列挙） */
    --shop-bg-size: 114.51% 117.65%;
    --shop-bg-pos: 50.5% 48.5%;
  }
}

/* ==========================================================================
   コースページ共通（/body_course・/body_course/lymph_massage・/facial_course）
   body.is-lower.is-course
   SP: Figma sp_body_course / sp_body_lymph / sp_facial_course（390px基準）
   PC: Figma pc_body_course / pc_lymph_course / pc_facial_course（1440px基準・先方未チェックのため暫定）
   ========================================================================== */
.u-visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.is-course .l-main,
.is-option .l-main {
  position: relative;
}

/* Figma の約物（」、「 等）は詰めない表示のため、コースページでは約物の自動詰めを無効化 */
.is-course,
.is-option {
  text-spacing-trim: space-all;
}

/* PC用の共通コンテナ（SPでは全幅） */
@media (min-width: 990px) {
  .l-lcontainer {
    width: min(1000px, calc(100% - 40px));
    margin: 0 auto;
  }
}

/* ---------- ページ上部（タイトル＋動画＋ページ内ボタン / おすすめ） ---------- */
.p-lhero {
  --lh-ivy-top: 387px;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  padding-top: 73px;
}

.p-lhero--body {
  --lh-ivy-top: 362px;
}

/* SP：白帯なしでロゴだけをページ上部に置く（スクロールで流れる） */
.p-lhero__logo {
  position: absolute;
  top: 15px;
  left: 15px;
  z-index: 2;
  width: 115px;
}

.p-lhero__logo img {
  width: 115px;
  height: 49px;
  object-fit: cover;
}

.p-lhero__ivy {
  position: absolute;
  z-index: 0;
  background-repeat: no-repeat;
  pointer-events: none;
}

/* 右上：ivy_beige10_right を 217×163 で切り抜き */
.p-lhero__ivy--r {
  top: 0;
  right: 0;
  width: 217px;
  height: 163px;
  background-image: url("../assets/svg/ivy_beige_right.svg");
  background-size: 291.2px 210px;
  background-position: -0.2px -47px;
}

/* 左：ivy_beige10_left を 210×232 で切り抜き、-90°回転（回転後 232×210） */
.p-lhero__ivy--l {
  top: calc(var(--lh-ivy-top) - 11px);
  left: 11px;
  width: 210px;
  height: 232px;
  background-image: url("../assets/svg/ivy_beige_left.svg");
  background-size: 210px 290.9px;
  background-position: 0 -58.65px;
  rotate: -90deg;
}

.p-lhero__title {
  position: relative;
  z-index: 1;
  height: 167px;
}

/* コース・施術詳細・ルネチェア共通のページ見出し（基準：コースページ）。
   枠に収まらない長い見出しだけ、h1 の style で縮小率を指定する（指定がなければ 1＝コースページと同じ）
     --en-fit / --en-fit-pc：英字の縮小率（SP / PC）  --ja-fit / --ja-fit-pc：日本語の縮小率（SP / PC）
   英字は縮めてもベースラインの位置を保つ（Ephesis のアセント0.9・ディセント0.4 から行高を計算）ので、
   日本語との重なり方はコースページと同じになる */
.p-lhero__title .c-sec-title__en {
  color: rgba(233, 206, 152, 0.7);
  font-size: calc(100px * var(--en-fit, 1));
  line-height: calc(187px - 50px * var(--en-fit, 1)); /* 縮小率1で137px（Figma の文字位置に合わせた行高。枠の高さは167px） */
}

.p-lhero__title .c-sec-title__ja {
  font-size: calc(24px * var(--ja-fit, 1));
}

.p-lhero__movie {
  z-index: 1;
  justify-self: end;
  width: min(calc(100% - 40px), 640px);
  aspect-ratio: 349.47 / 256.34;
  border-radius: 15px 0 0 15px;
}

/* 動画（ボディ用_Ver2 / フェイシャル用_Ver2・16:9）は枠いっぱいに表示し、はみ出しは中央基準で切り取る */
.p-lhero__movie .c-video__video {
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ページ内リンク（グローバルナビとは別。行き先はこのページ内のセクション） */
.p-lhero__nav {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  margin-top: 72px;
}

.p-lhero__nav .c-btn {
  width: 310px;
  max-width: calc(100% - 40px);
  height: 48px;
}

/* こんな方におすすめ（動画の下に一部重なるベージュの囲み） */
.p-lhero__kakomi {
  position: relative;
  z-index: 0;
  width: min(324px, calc(100% - 40px));
  margin-top: -49px;
  padding: 80px 20px 46px 53px;
  border-radius: 0 15px 15px 0;
  background: var(--c-beige-bg);
}

.p-lhero__kakomi-ttl {
  font-size: 18px;
  font-weight: 400;
  line-height: 25px;
}

.p-lhero__kakomi-list {
  display: grid;
  gap: 20px;
  margin-top: 23px;
  line-height: 21.33px;
}

.p-lhero__kakomi-list li {
  position: relative;
  padding-left: 23px;
}

.p-lhero__kakomi-list li::before {
  content: "";
  position: absolute;
  top: 4px;
  left: 0;
  width: 15px;
  height: 12px;
  background: url("../assets/svg/4dots.svg") no-repeat 0 0 / 100% 100%;
}

@media (min-width: 990px) {
  .p-lhero {
    --lh-ivy-top: 486px;
    --lh-title-mt: 94px;
    --lh-nav-mt: 94px;
    /* 左列の最小幅 539px：左列の文字・ボタン（右端 518px）と写真・動画の間を、狭いPC幅でも21px以上確保。
       約1368px以上では 33.33% + 83px（Figma：1440pxで写真・動画の左端 563px）になる */
    grid-template-columns: [full-start] minmax(0, max(calc(33.33% + 83px), 539px)) [movie-start] minmax(0, 1fr) [full-end];
    grid-template-rows: auto 1fr;
    padding-top: 165px;
  }

  .p-lhero--body {
    --lh-ivy-top: 559px;
  }

  .p-lhero--lymph {
    --lh-title-mt: 79px;
    --lh-nav-mt: 81px;
  }

  .p-lhero__logo {
    display: none;
  }

  .p-lhero__ivy--r {
    left: 312px;
    right: auto;
    width: 559px;
    height: 244px;
    background-size: 560px 403.8px;
    background-position: -0.7px -159.4px;
  }

  .p-lhero__ivy--l {
    top: calc(var(--lh-ivy-top) - 35px);
    left: 35px;
    width: 404px;
    height: 474px;
    background-size: 404.4px 558.7px;
    background-position: 0 -84.66px;
  }

  .p-lhero__title {
    grid-column: 1;
    grid-row: 1;
    width: 447px;
    height: 181px;
    margin: var(--lh-title-mt) 0 0 71px;
  }

  .p-lhero__title .c-sec-title__en {
    font-size: calc(160px * var(--en-fit-pc, 1));
    line-height: calc(307px - 80px * var(--en-fit-pc, 1)); /* 縮小率1で227px */
  }

  .p-lhero__title .c-sec-title__ja {
    gap: 12px;
    margin-top: 161px;
    font-size: calc(24px * var(--ja-fit-pc, 1));
  }

  .p-lhero__title .c-sec-title__ja::before,
  .p-lhero__title .c-sec-title__ja::after {
    width: 28.3px;
  }

  .p-lhero__movie {
    grid-column: movie-start / full-end;
    grid-row: 1 / span 2;
    align-self: start;
    justify-self: stretch;
    width: auto;
    aspect-ratio: 877 / 550;
    border-radius: 30px 0 0 30px;
  }

  .p-lhero__nav {
    grid-column: 1;
    grid-row: 2;
    align-items: flex-start;
    gap: 21px;
    margin: var(--lh-nav-mt) 0 0 220px;
  }

  .p-lhero__nav .c-btn {
    width: 298px;
    max-width: none;
    height: 56px;
  }

  .p-lhero__kakomi {
    grid-column: full-start / full-end;
    grid-row: 2;
    justify-self: start;
    width: 660px;
    margin: 63px 0 0 220px;
    padding: 48px 40px 43px 47px;
    border-radius: 30px;
  }

  .p-lhero__kakomi-ttl {
    font-size: 20px;
  }

  .p-lhero__kakomi-list {
    gap: 23px;
    margin-top: 26px;
  }
}

/* ---------- 見出し（英字＋日本語）：Figma title（SP 40px / PC 62px） ---------- */
.c-ltitle {
  display: flex;
  flex-direction: column;
  margin-left: max(15px, calc((100% - 640px) / 2));
  font-weight: 400;
}

.c-ltitle__en {
  color: var(--c-beige);
  font-family: var(--ff-script);
  font-size: 40px;
  line-height: 44px;
  white-space: pre;
}

.c-ltitle__ja {
  font-family: var(--ff-serif);
  font-size: 18px;
  line-height: 20px;
}

/* 大きい見出し（ボディコース：Lymph / Massage を2行で） */
.c-ltitle--large .c-ltitle__en {
  font-size: 72px;
  line-height: 52px;
}

.c-ltitle--large .c-ltitle__en span {
  display: block;
}

.c-ltitle--large .c-ltitle__en span + span {
  padding-left: 62px;
}

.c-ltitle--large .c-ltitle__ja {
  margin: -11px 0 0 12px;
  font-size: 20px;
  font-weight: 500;
  line-height: 46px;
}

@media (min-width: 990px) {
  .c-ltitle {
    margin-left: 2px;
  }

  .c-ltitle__en {
    font-size: 62px;
    line-height: 64px;
  }

  .c-ltitle__ja {
    font-size: 22px;
    line-height: 28px;
  }

  .c-ltitle--large {
    margin-left: 11px;
  }

  .c-ltitle--large .c-ltitle__en {
    font-size: 72px;
    line-height: 52px;
  }

  .c-ltitle--large .c-ltitle__ja {
    font-size: 22px;
    font-weight: 400;
  }
}

/* ---------- 4点アイコン（区切り） ---------- */
.c-ldots {
  width: 15px;
  height: 12px;
  margin: 0 auto;
}

/* ---------- 料金（Figma price_box / price_btn_box） ---------- */
.c-price-list {
  --price-gap: 52px;
  display: flex;
  flex-direction: column;
  gap: var(--price-gap);
  width: min(calc(100% - 70px), 600px);
  margin: 0 auto;
}

.c-price-list--course {
  --price-gap: 73px;
}

.c-price-list--card {
  --price-gap: 95px;
}

.c-price__ttl {
  position: relative;
  padding-bottom: 17px;
  font-size: 20px;
  font-weight: 500;
  line-height: 28px;
}

/* 下線：黒1px ＋ 左端に濃茶 4px（幅は線全体の25.4%） */
.c-price__ttl::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 4px;
  background:
    linear-gradient(var(--c-text), var(--c-text)) 0 0 / 25.4% 4px no-repeat,
    linear-gradient(#000, #000) 0 3px / 100% 1px no-repeat;
}

.c-price__rows {
  --price-time-w: 113.6px;
  display: grid;
  gap: 16px;
  margin: 21px 0 0;
}

.c-price__row {
  display: grid;
  grid-template-columns: var(--price-time-w) minmax(0, 1fr);
  align-items: baseline;
  font-size: 20px;
  line-height: 28px;
  text-align: right;
  white-space: nowrap;
}

.c-price__row dt,
.c-price__row dd {
  margin: 0;
}

.c-price__row small {
  font-size: 12px;
  line-height: 1;
}

.c-price__img {
  margin-top: 24px;
}

.c-price__btn {
  width: 310px;
  max-width: 100%;
  height: 52px;
  margin: 34px auto 0;
}

/* 画像の切り抜き：Figma の表示範囲（%）を CSS 変数で指定。--w/--h/--l/--t（SP）・--pw/--ph/--pl/--pt（PC） */
.c-crop {
  position: relative;
  overflow: hidden;
  aspect-ratio: 320 / 200;
}

.c-crop img {
  position: absolute;
  top: var(--t, 0%);
  left: var(--l, 0%);
  width: var(--w, 100%);
  max-width: none;
  height: var(--h, 100%);
}

@media (min-width: 990px) {
  .c-price-list {
    --price-gap: 80px;
    width: 100%;
    margin: 0;
  }

  .c-price-list--card {
    --price-gap: 110px;
  }

  .c-price__ttl {
    padding-bottom: 17px;
  }

  .c-price__rows {
    --price-time-w: 297px;
    gap: 23px;
    margin-top: 18px;
    padding-right: 20px;
  }

  .c-price__img {
    margin-top: 28px;
  }

  .c-price__btn {
    width: 425px;
    margin-top: 40px;
  }

  .c-crop {
    aspect-ratio: 572 / 359;
    border-radius: 15px;
  }

  .c-crop img {
    top: var(--pt, var(--t, 0%));
    left: var(--pl, var(--l, 0%));
    width: var(--pw, var(--w, 100%));
    height: var(--ph, var(--h, 100%));
  }
}

/* ---------- セクション（リンパマッサージ / フェイシャルコース / オプション） ---------- */
.p-lsec {
  position: relative;
  padding: 38px 0 90px;
}

.p-lhero + .p-lsec {
  margin-top: 76px;
}

.p-lsec--band {
  background: var(--c-beige-bg);
}

.p-lsec__lead {
  width: min(calc(100% - 108px), 560px);
  margin: 45px auto 0;
}

.p-lsec__catch {
  font-family: var(--ff-serif);
  font-size: 22px;
  font-weight: 600;
  line-height: 30px;
}

.p-lsec__catch--sm {
  line-height: 32px;
}

.p-lsec__text {
  margin-top: 33px;
  text-align: justify;
}

.p-lsec__lead .c-ldots {
  margin-top: 34px;
}

.p-lsec__list {
  margin-top: 50px;
}

.p-lsec--option .p-lsec__list {
  margin-top: 61px;
}

/* 左側のまとまり（PC で追従）。SP では枠を持たせず、これまでどおりの並び */
.p-lsec__side {
  display: contents;
}

.p-lsec__note {
  width: min(calc(100% - 108px), 560px);
  margin: 40px auto 0;
}

.p-lsec__note p {
  margin-top: 32px;
  text-align: justify;
}

/* ---------- 続きを見る（料金一覧の4件目以降を開閉：リンパマッサージ・フェイシャル一覧のオプション。Figma 28280:148 / 28280:498） ----------
   開閉する項目（.c-more__body）は一覧と同じ間隔で縦に並べる。初期は hidden（閉じる）。開閉のアニメーションは JS（initMore）。
   間隔：最後の項目 → ボタン SP 40px / PC 65px、ボタン → 4点アイコン SP 52px / PC 77px */
.c-more__body {
  display: flex;
  flex-direction: column;
  gap: var(--price-gap);
}

.c-more {
  margin-top: calc(40px - var(--price-gap));
  text-align: center;
}

.c-more__btn {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  min-height: 37px;
  padding: 0;
  border: 0;
  background: none;
  color: #000;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  cursor: pointer;
  transition: opacity var(--btn-transition);
}

@media (hover: hover) {
  .c-more__btn:hover {
    opacity: 0.7;
  }
}

.c-more__icon {
  display: block;
  width: 36px;
  height: 22px;
  transition: transform 300ms ease-out;
}

.c-more__btn[aria-expanded="true"] .c-more__icon {
  transform: rotate(180deg);
}

.p-lsec--more .p-lsec__note {
  margin-top: 52px;
}

@media (prefers-reduced-motion: reduce) {
  .c-more__icon {
    transition: none;
  }
}

@media (min-width: 990px) {
  .p-lsec {
    padding: 60px 0 142px;
  }

  .p-lsec--option {
    padding: 84px 0 107px;
  }

  .p-lhero + .p-lsec {
    margin-top: 170px;
  }

  .p-lsec .l-lcontainer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 572px);
    column-gap: 40px;
    align-items: start;
  }

  /* 左側：見出し・キャッチ・リード・4点アイコンをひとまとめにし、ブロック（帯）の中で追従。
     止まる位置は Figma main_txt_box どおり、見出しの上端が画面上端から90px（固定ヘッダー85px＋5px）。
     画面の高さに収まらない時はキャッチ以下だけを追従（.is-sticky / .is-sticky-split は JS が判定） */
  .p-lsec__side {
    display: block;
    grid-column: 1;
    grid-row: 1 / span 2;
    align-self: start;
  }

  .p-lsec__side.is-sticky {
    position: sticky;
    top: calc(var(--header-h) + 5px);
  }

  /* 全体が画面に収まらない時：見出しは流し、キャッチ以下（.p-lsec__lead）だけを追従。
     まとまりをブロックの高さまで伸ばし、その中でキャッチ以下を追従させる（top は JS：90px か、下端基準の値） */
  .p-lsec__side.is-sticky-split {
    align-self: stretch;
  }

  .p-lsec__side.is-sticky-split .p-lsec__lead {
    position: sticky;
    top: var(--sticky-top, calc(var(--header-h) + 5px));
  }

  .p-lsec__lead {
    width: auto;
    max-width: 322px;
    margin: 69px 0 0;
    padding-left: 50px;
  }

  .p-lsec__catch {
    font-size: 24px;
    line-height: 38px;
  }

  .p-lsec__catch--sm {
    font-size: 22px;
    line-height: 32px;
  }

  .p-lsec__text {
    margin-top: 53px;
  }

  .p-lsec__catch--sm + .p-lsec__text {
    margin-top: 36px;
  }

  .p-lsec__lead .c-ldots {
    margin-top: 41px;
  }

  /* 右側：見出しの行（92px）の分を上の余白に含める（以前の 見出し下72px / オプション57px と同じ位置） */
  .p-lsec__list {
    grid-column: 2;
    grid-row: 1;
    margin-top: 164px;
  }

  .p-lsec--option .p-lsec__list {
    margin-top: 149px;
  }

  .p-lsec__note {
    grid-column: 2;
    grid-row: 2;
    width: auto;
    margin: 40px 0 0;
  }

  .c-more {
    margin-top: calc(65px - var(--price-gap));
  }

  .p-lsec--more .p-lsec__note {
    margin-top: 77px;
  }
}

/* ---------- ボディコース：バナー / リンパマッサージ紹介 ----------
   position: relative で、ページ上部の蔦（.p-lhero__ivy・z-index: 0）より手前に描く（PC で蔦がバナーに重なるため） */
.p-lbanners {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 21px;
  margin-top: 58px;
}

.p-lbanners a {
  display: block;
  width: min(calc(100% - 70px), 443px);
  transition: opacity var(--btn-transition);
}

.p-lbanners img {
  width: 100%;
  height: auto;
}

@media (hover: hover) {
  .p-lbanners a:hover {
    opacity: 0.7;
  }
}

.p-lbanners a:focus-visible {
  opacity: 0.7;
}

.p-lintro {
  margin: 103px 0 0; /* 下の余白なし：背景の帯を直下の店舗ブロックへ隙間なくつなげる（Q&A と同じ。2026-10-21） */
  padding-bottom: 68px;
  background: var(--c-beige-bg);
}

.p-lintro__title {
  position: relative;
  top: -43px;
  margin-bottom: -43px;
}

.p-lintro__body {
  width: min(calc(100% - 108px), 560px);
  margin: 36px auto 0;
}

.p-lintro__text {
  text-align: justify;
}

.p-lintro__catch {
  margin-top: 40px;
  font-family: var(--ff-serif);
  font-size: 22px;
  font-weight: 600;
  line-height: 30px;
}

.p-lintro__catch + .p-lintro__text {
  margin-top: 35px;
}

.p-lintro .c-ldots {
  margin-top: 35px;
}

@media (min-width: 990px) {
  .p-lbanners {
    flex-direction: row;
    justify-content: center;
    gap: 41px;
    margin-top: 115px;
  }

  .p-lbanners a {
    width: min(443px, calc((100% - 81px) / 2));
  }

  .p-lintro {
    margin: 149px 0 0;
    padding-bottom: 136px;
  }

  .p-lintro__body {
    width: min(600px, calc(100% - 40px));
    margin: 74px 0 0 max(20px, calc(50% - 290px));
  }

  .p-lintro__catch {
    margin-top: 48px;
  }

  .p-lintro__catch + .p-lintro__text {
    margin-top: 48px;
  }

  .p-lintro .c-ldots {
    margin-top: 44px;
  }
}

/* ---------- コースの流れ（スライダー） ----------
   JS有効時（.is-ready）：矢印・ページ送りで1枚ずつ切り替え（自動再生なし・ループなし・端の矢印は無効）。SPはスワイプ可。
   JS無効時：横スクロールで全カードを閲覧できる */
.p-flow {
  padding: 60px 0 82px;
}

.p-flow__stage {
  --flow-w: min(calc(100% - 108px), 480px);
  position: relative;
  width: var(--flow-w);
  margin: 53px auto 0;
}

.p-flow__viewport {
  overflow-x: auto;
  scroll-snap-type: x mandatory;
}

.p-flow__slider.is-ready .p-flow__viewport {
  overflow: hidden;
  touch-action: pan-y;
}

.p-flow__track {
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
}

.p-flow__slider.is-ready .p-flow__track {
  transition: transform 450ms ease;
}

.p-flow__card {
  position: relative;
  flex: 0 0 100%;
  min-width: 0;
  min-height: 500px;
  padding: 12px 0 44px;
  border-top: 1px solid rgba(61, 36, 33, 0.4);
  border-bottom: 1px solid rgba(61, 36, 33, 0.4);
  scroll-snap-align: start;
}

.p-flow__card::before {
  content: "";
  position: absolute;
  top: -2px;
  left: 0;
  width: 34px;
  height: 2px;
  background: var(--c-text);
}

.p-flow__num {
  font-size: 16px;
  line-height: 23px;
}

.p-flow__img {
  margin-top: 11px;
  aspect-ratio: 282 / 176;
}

.p-flow__ttl {
  margin-top: 26px;
  font-family: var(--ff-serif);
  font-size: 18px;
  font-weight: 600;
  line-height: 28px;
}

.p-flow__text {
  margin-top: 30px;
  font-size: 15px;
  line-height: 24px;
}

.p-flow__arrow {
  display: none;
}

/* 矢印：カード表示領域（写真・見出し・本文を含むカード全体。ドットは含まない）の上下中央（PC・SP共通） */
.p-flow__slider.is-ready .p-flow__arrow {
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  transition: opacity var(--btn-transition);
}

.p-flow__arrow img {
  width: 18px;
  height: 35px;
}

.p-flow__arrow--prev {
  left: -52px;
}

.p-flow__arrow--prev img {
  scale: -1 1;
}

.p-flow__arrow--next {
  right: -46px;
}

/* 進めない側の矢印は無効（Figma：1枚目の左矢印は不透明度0） */
.p-flow__slider.is-ready .p-flow__arrow:disabled {
  opacity: 0;
  cursor: default;
}

@media (hover: hover) {
  .p-flow__arrow:not(:disabled):hover {
    opacity: 0.5;
  }
}

.p-flow__dots {
  display: flex;
  justify-content: center;
  margin-top: 36px;
}

.p-flow__dot {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}

.p-flow__dot::before {
  content: "";
  width: 10px;
  height: 10px;
  background: rgba(61, 36, 33, 0.2);
  transition: background-color var(--btn-transition);
}

.p-flow__dot[aria-current="true"]::before {
  background: var(--c-text);
}

@media (hover: hover) {
  .p-flow__dot:not([aria-current="true"]):hover::before {
    background: rgba(61, 36, 33, 0.5);
  }
}

@media (prefers-reduced-motion: reduce) {
  .p-flow__slider.is-ready .p-flow__track {
    transition: none;
  }
}

@media (min-width: 990px) {
  .p-flow {
    padding: 92px 0 98px;
  }

  .p-flow__stage {
    --flow-w: min(900px, calc(100% - 100px));
    /* Figma：コンテナ右端に揃える。画面が狭い時は右矢印（右へ54px）が画面内に収まるよう右余白を確保 */
    margin: 77px max(0px, calc(54px - (100vw - 100%) / 2)) 0 auto;
  }

  .p-flow__card {
    display: grid;
    grid-template-columns: minmax(0, 420fr) minmax(0, 430fr);
    column-gap: 51px;
    align-items: start;
    min-height: 365px;
    padding: 12px 0 50px;
  }

  .p-flow__card::before {
    width: 40px;
  }

  .p-flow__num {
    grid-column: 1 / -1;
    font-size: 24px;
    line-height: 35px;
  }

  .p-flow__img {
    margin-top: 5px;
    aspect-ratio: 420 / 263;
  }

  .p-flow__body {
    padding-top: 40px;
  }

  .p-flow__ttl {
    margin-top: 0;
  }

  .p-flow__text {
    margin-top: 32px;
  }

  .p-flow__arrow--next {
    right: -54px;
  }

  .p-flow__dots {
    margin-top: 56px;
  }

  .p-flow__dot {
    width: 37.83px;
    height: 37.83px;
  }

  .p-flow__dot::before {
    width: 13.32px;
    height: 13.32px;
  }
}

/* ---------- その他のメニュー ---------- */
.p-lother {
  padding: 39px 0 120px;
}

.p-lother--band {
  margin-bottom: 0; /* 背景の帯を直下の店舗ブロックへ隙間なくつなげる（Q&A と同じ。2026-10-21） */
  padding: 55px 0 81px;
  background: var(--c-beige-bg);
}

.p-lother__btns {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 25px;
  margin-top: 41px;
}

.p-lother__btns .c-btn {
  width: 306px;
  max-width: calc(100% - 40px);
}

@media (min-width: 990px) {
  .p-lother {
    padding: 85px 0 120px;
  }

  .p-lother--band {
    margin-bottom: 0;
    padding: 74px 0 97px;
  }

  .p-lother__btns {
    margin-top: 65px;
  }

  .p-lother__btns .c-btn {
    width: 453px;
  }
}

/* ==========================================================================
   フェイシャル施術詳細（/facial_course/face_slim ほか6ページ）
   SP: Figma「sp_facial詳細」各ページ（390px基準）
   PC: Figma なし。上部＝ボディPC、キャッチ〜料金＝中央1列（本文幅600px）、コースの流れ＝リンパPCのスライダーを流用
   既存ページに影響しないよう、すべて --detail の修飾子・専用クラスで指定
   ========================================================================== */

/* ---------- 上部：見出し・写真・おすすめ ---------- */
/* 見出しはコースページと同じ .c-sec-title.p-lhero__title（2026-10-16 統一）。上部の余白もコースページと同じ */
.p-lhero--detail {
  --lh-ivy-top: 362px;
}

/* 小さい見出し（英字＋日本語）：店舗ページ（.p-lhero__dtitle--shop）でのみ使用 */
.p-lhero__dtitle {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  margin-left: 13px;
  font-weight: 400;
}

.p-lhero__dtitle-en {
  color: var(--c-beige);
  font-family: var(--ff-script);
  font-size: 26px;
  line-height: 28px;
  white-space: pre;
}

.p-lhero__dtitle-ja {
  font-family: var(--ff-serif);
  font-size: 28px;
  line-height: 34px;
}

/* メイン写真（Figma 337×247・左側角丸15）。切り抜きは --w/--h/--l/--t（SP）・--pw/--ph/--pl/--pt（PC） */
.p-lhero__photo {
  z-index: 1;
  justify-self: end;
  width: min(calc(100% - 53px), 640px);
  margin-top: 0; /* 見出しの枠（167px）のすぐ下。コースページの動画と同じ位置 */
  aspect-ratio: 337 / 247;
  border-radius: 15px 0 0 15px;
}

.p-lhero--detail .p-lhero__kakomi {
  margin-top: -40px;
  padding-bottom: 32px;
}

.p-lhero--detail .p-lhero__kakomi-list {
  gap: 6px;
  margin-top: 18px;
  line-height: 23px;
}

.p-lhero--detail .p-lhero__kakomi-list li::before {
  top: 5px;
}

.p-lhero__kakomi-note {
  margin: 17px 0 0 23px;
  font-size: 14px;
  line-height: 20px;
}

.p-lhero__kakomi sup,
.p-ldetail sup {
  font-size: 0.75em;
  line-height: 0;
  vertical-align: baseline;
}

/* ---------- キャッチ・本文・料金（中央1列） ----------
   position: relative で、ページ上部の蔦（.p-lhero__ivy・z-index: 0）より手前に描く（狭いPC幅で蔦がキャッチに重なるため） */
.p-ldetail {
  position: relative;
  margin-top: 40px;
}

.p-ldetail__catch {
  width: min(calc(100% - 60px), 600px);
  margin: 0 auto;
  font-family: var(--ff-serif);
  font-size: 20px;
  font-weight: 600;
  line-height: 32px;
}

.p-ldetail__catch small {
  font-size: 14px;
}

.p-ldetail__text,
.p-ldetail__price {
  width: min(calc(100% - 108px), 560px);
  margin-right: auto;
  margin-left: auto;
}

.p-ldetail__text {
  margin-top: 31px;
  text-align: justify;
}

.p-ldetail__text p + p {
  margin-top: 30px;
}

.p-ldetail__text .p-ldetail__note {
  margin-top: 20px;
  font-size: 14px;
  line-height: 20px;
}

/* 料金：上下の線（黒1px）＋上線の左に濃茶 50×4 */
.p-ldetail__price {
  position: relative;
  display: grid;
  grid-template-columns: 117px minmax(0, 1fr);
  align-items: baseline;
  height: 68px;
  margin-top: 48px;
  padding-top: 17px;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  font-size: 20px;
  line-height: 28px;
  text-align: right;
  white-space: nowrap;
}

.p-ldetail__price::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 0;
  width: 50px;
  height: 4px;
  background: var(--c-text);
}

.p-ldetail__price dt,
.p-ldetail__price dd {
  margin: 0;
}

.p-ldetail__price small {
  font-size: 12px;
  line-height: 1;
}

/* ---------- コースの流れ（ベージュの帯） ---------- */
/* 料金からの間隔は Figma のページごとの値（各HTMLの --flow-mt） */
.p-flow--detail {
  margin: var(--flow-mt, 80px) 0 0; /* 下の余白なし：背景の帯を直下の店舗ブロックへ隙間なくつなげる（2026-10-21） */
  padding: 42px 0 104px;
  background: var(--c-beige-bg);
}

.p-flow--detail .p-flow__stage {
  margin-top: 52px;
}

/* カードの下線は Figma どおりカード上端から447px */
.p-flow--detail .p-flow__card {
  min-height: 447px;
  padding-bottom: 16px; /* 長い本文のカードがあっても下線が下がりすぎないよう最小限に */
}

.p-flow__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  height: 29px;
  line-height: 29px;
}

.p-flow--detail .p-flow__num {
  line-height: 29px;
}

/* 所要時間（カード上部の右側） */
.p-flow__time {
  font-family: var(--ff-serif);
  font-size: 24px;
  line-height: 29px;
}

.p-flow__time small {
  font-size: 14px;
}

.p-flow--detail .p-flow__img {
  margin-top: 5px;
}

.p-flow--detail .p-flow__ttl {
  min-height: 63px;
}

.p-flow--detail .p-flow__text {
  margin-top: 10px;
}

/* 未支給の写真：枠だけ確保（素材の差し替え待ち） */
.c-crop.is-missing {
  background: rgba(61, 36, 33, 0.06);
}

/* SP の矢印の左右位置：Figma では左右の余白の中央 */
.p-flow--detail .p-flow__arrow--prev {
  left: -45px;
}

.p-flow--detail .p-flow__arrow--next {
  right: -53px;
}

@media (min-width: 990px) {
  .p-lhero--detail {
    --lh-ivy-top: 559px;
  }

  .p-lhero__dtitle {
    grid-column: 1;
    grid-row: 1;
    align-self: start;
    margin: 160px 0 0 71px;
  }

  .p-lhero__dtitle-en {
    font-size: 40px;
    line-height: 44px;
  }

  .p-lhero__dtitle-ja {
    font-size: 36px;
    line-height: 48px;
  }

  .p-lhero__photo {
    grid-column: movie-start / full-end;
    grid-row: 1 / span 2;
    align-self: start;
    justify-self: stretch;
    width: auto;
    margin-top: 0;
    aspect-ratio: 877 / 550;
    border-radius: 30px 0 0 30px;
  }

  .p-lhero--detail .p-lhero__kakomi {
    margin-top: 63px; /* 見出しの下から。ボディコースと同じ */
    padding-bottom: 43px;
  }

  .p-lhero--detail .p-lhero__kakomi-list {
    gap: 10px;
    margin-top: 24px;
  }

  .p-ldetail {
    margin-top: 110px;
  }

  .p-ldetail__catch,
  .p-ldetail__text,
  .p-ldetail__price {
    width: min(600px, calc(100% - 40px));
  }

  .p-ldetail__catch {
    font-size: 24px;
    line-height: 38px;
  }

  .p-ldetail__catch small {
    font-size: 16px;
  }

  .p-ldetail__text {
    margin-top: 40px;
  }

  .p-ldetail__price {
    grid-template-columns: 300px minmax(0, 1fr);
    margin-top: 56px;
    padding-right: 20px;
  }

  .p-flow--detail {
    margin: 120px 0 0;
    padding: 92px 0 98px;
  }

  .p-flow--detail .p-flow__stage {
    margin-top: 77px;
  }

  .p-flow--detail .p-flow__card {
    min-height: 365px;
    padding-bottom: 50px;
  }

  .p-flow__head {
    grid-column: 1 / -1;
    height: 35px;
    line-height: 35px;
  }

  .p-flow--detail .p-flow__num {
    line-height: 35px;
  }

  .p-flow__time {
    font-size: 28px;
    line-height: 35px;
  }

  .p-flow__time small {
    font-size: 16px;
  }

  .p-flow--detail .p-flow__ttl {
    min-height: 0;
  }

  .p-flow--detail .p-flow__text {
    margin-top: 32px;
  }

  /* PC の矢印の左右位置はリンパPCと同じ */
  .p-flow--detail .p-flow__arrow--prev {
    left: -52px;
  }

  .p-flow--detail .p-flow__arrow--next {
    right: -54px;
  }
}

/* ==========================================================================
   プライバシーポリシー（/privacy_policy）
   Figma: sp_プライバシーポリシー 28156:1197 / pc_プライバシーポリシー 28156:1274（先方チェック中）
   お問い合わせと同じ構成（白帯ヘッダー・ページタイトル・本文1列 SP 300px / PC 700px）
   ========================================================================== */
.p-privacy {
  width: min(calc(100% - 90px), 300px);
  margin: 44px auto 0;
  padding-bottom: 87px;
}

.p-privacy__lead {
  padding-bottom: 27px;
  border-bottom: 1px solid var(--c-text);
  font-size: 18px;
  line-height: 28px;
  letter-spacing: 0.9px;
}

.p-privacy__list {
  display: grid;
  gap: 28px;
  margin-top: 31px;
  line-height: 28px;
}

.p-privacy__ttl {
  font-size: 16px;
  font-weight: 700;
  line-height: 28px;
}

.p-privacy__dots {
  width: 15px;
  height: 12px;
  margin: 47px auto 0;
}

@media (min-width: 990px) {
  .p-privacy {
    width: min(700px, calc(100% - 40px));
    margin-top: 70px;
    padding-bottom: 100px;
  }

  .p-privacy__lead {
    padding-bottom: 35px;
    font-size: 22px;
    letter-spacing: 1.1px;
  }

  .p-privacy__list {
    gap: 52px;
  }

  .p-privacy__dots {
    margin-top: 52px;
  }
}

/* ==========================================================================
   クーポン・キャンペーン（/coupon/）
   Figma: sp_クーポン 28242:135 / pc_クーポン 28242:216（クライアントチェック用）
   お問い合わせ・プライバシーポリシーと同じ構成（白帯ヘッダー・ページタイトル）。本文1列 SP 320px / PC 700px（リードのみ PC 1000px）
   ========================================================================== */
/* 印刷用のクーポン画像（印刷時だけ表示：css/print-coupon.css） */
.p-cpage-print {
  display: none;
}

.p-cpage {
  padding: 43px 0 75px;
}

.p-cpage__lead,
.p-cpage__sec {
  width: min(calc(100% - 70px), 320px);
  margin: 0 auto;
}

.p-cpage__lead {
  font-size: 22px;
  font-weight: 500;
  line-height: 32px;
}

.p-cpage__sec {
  margin-top: 53px;
}

.p-cpage__sec + .p-cpage__sec {
  margin-top: 44px;
}

/* 見出し：下線つき */
.p-cpage__ttl {
  padding-bottom: 24px;
  border-bottom: 1px solid var(--c-text);
  font-size: 20px;
  font-weight: 500;
  line-height: 26px;
  letter-spacing: 0.05em;
}

.p-cpage__text {
  margin-top: 25px;
  line-height: 24px;
}

.p-cpage__text p + p {
  margin-top: 24px;
}

.p-cpage__img {
  margin-top: 33px;
}

.p-cpage__img img {
  width: 100%;
  max-width: 320px;
  height: auto;
  border-radius: 15px;
}

.p-cpage__dots {
  width: 15px;
  height: 12px;
  margin: 54px auto 0;
}

/* キャンペーン */
.p-cpage__item {
  margin-top: 28px;
  line-height: 24px;
}

.p-cpage__item-ttl {
  margin-top: 6px;
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
}

.p-cpage__term {
  margin-top: 12px;
}

.p-cpage__item-text {
  margin-top: 19px;
}

.p-cpage__item + .p-cpage__dots {
  margin-top: 57px;
}

@media (min-width: 990px) {
  .p-cpage {
    padding: 100px 0 79px;
  }

  .p-cpage__lead {
    width: min(1000px, calc(100% - 40px));
    font-size: 28px;
  }

  .p-cpage__sec {
    width: min(700px, calc(100% - 40px));
    margin-top: 97px;
  }

  .p-cpage__sec + .p-cpage__sec {
    margin-top: 26px;
  }

  .p-cpage__ttl {
    font-size: 22px;
  }

  /* 本文（320px）とクーポン画像（320px）を横並び */
  .p-cpage__coupon {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 40px;
    margin-top: 32px;
  }

  .p-cpage__text {
    flex: 0 1 320px;
    margin-top: 0;
  }

  .p-cpage__img {
    flex: 0 1 320px;
    margin-top: 0;
  }

  .p-cpage__dots {
    margin-top: 44px;
  }

  .p-cpage__term {
    margin-top: 10px;
  }

  .p-cpage__item-text {
    margin-top: 24px;
  }

  .p-cpage__item + .p-cpage__dots {
    margin-top: 70px;
  }
}

/* ==========================================================================
   採用情報（/recruit）・会社概要（/over_view）
   Figma: sp_採用情報 28197:66 / pc_採用情報 28197:183（先方チェック中）
          sp_会社概要 28198:369 / pc_会社概要 28198:479
   お問い合わせ・プライバシーポリシーと同じ構成（白帯ヘッダー・ページタイトル・本文1列 SP 300px / PC 700px）
   ========================================================================== */

/* ---------- 項目名＋内容の表（共通部品）
   SP：項目名の下に内容 / PC：項目名（幅 --dl-label-w）と内容を横並び
   列幅・余白はページごとに変数で設定する ---------- */
.c-datalist {
  --dl-label-w: 170px; /* PC の項目名の幅 */
  --dl-gap: 18px;      /* 下線から次の項目まで */
  --dl-pb: 22px;       /* 内容から下線まで */
  margin: 0;
}

.c-datalist__row {
  padding-bottom: var(--dl-pb);
  border-bottom: 1px solid var(--c-text);
}

.c-datalist__row + .c-datalist__row {
  margin-top: var(--dl-gap);
}

.c-datalist__label {
  color: rgba(61, 36, 33, 0.7);
  font-size: 16px;
  font-weight: 700;
  line-height: 28px;
  letter-spacing: 0.1em;
}

.c-datalist__value {
  margin: 1px 0 0;
  font-size: 16px;
  line-height: 28px;
}

/* 段落を並べる内容（会社概要の事業内容・店舗）：SP は行の高さ 20px・段落の間に空行 */
.c-datalist__value--paras {
  margin-top: 6px;
  line-height: 20px;
}

.c-datalist__value--paras p + p {
  margin-top: 20px;
}

.c-datalist__row:has(.c-datalist__value--paras) {
  padding-bottom: 24px;
}

/* 4点ドット（中央） */
.c-dots {
  width: 15px;
  height: 12px;
  margin-inline: auto;
}

@media (min-width: 990px) {
  .c-datalist__row {
    display: grid;
    grid-template-columns: var(--dl-label-w) minmax(0, 1fr);
    align-items: start;
  }

  .c-datalist__value,
  .c-datalist__value--paras {
    margin-top: 0;
  }

  .c-datalist__row:has(.c-datalist__value--paras) {
    padding-bottom: var(--dl-pb);
  }

  /* PC 文字サイズ 18px（会社概要）：項目名 18/28、内容 18/30 */
  .c-datalist--lg .c-datalist__label {
    font-size: 18px;
  }

  .c-datalist--lg .c-datalist__value {
    font-size: 18px;
    line-height: 30px;
  }

  /* PC は事業内容の空行なし、店舗の間は空行（30px） */
  .c-datalist__value--paras p + p {
    margin-top: 0;
  }

  .c-datalist--lg .c-datalist__value--groups p + p {
    margin-top: 30px;
  }
}

/* ---------- 採用情報 ---------- */
.p-recruit {
  width: min(calc(100% - 90px), 300px);
  margin: 44px auto 0;
  padding-bottom: 91px;
}

.p-recruit__catch {
  font-size: 20px;
  line-height: 26px;
  letter-spacing: 0.1em;
}

.p-recruit__intro {
  margin-top: 29px;
  line-height: 20px;
}

/* 写真（Figma SP 300×209 / PC 235×180・角丸15）
   切り抜きは Figma どおり中央を拡大（SP 1.1倍 / PC 1.07倍） */
.p-recruit__photo {
  aspect-ratio: 300 / 209;
  margin-top: 26px;
  overflow: hidden;
  border-radius: 15px;
  background: var(--c-beige-bg);
}

.p-recruit__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  scale: 1.1;
}

.p-recruit__points {
  display: grid;
  gap: 31px;
  margin-top: 42px;
  padding: 26px 28px 40px 26px;
  background: var(--c-beige-bg);
}

.p-recruit__point-ttl {
  padding-bottom: 21px;
  border-bottom: 1px solid var(--c-text);
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  letter-spacing: 0.05em;
}

.p-recruit__point-text {
  margin-top: 21px;
  line-height: 28px;
}

.p-recruit__dots {
  margin-top: 48px;
}

.p-recruit__data {
  margin-top: 39px;
}

.p-recruit__dots--end {
  margin-top: 45px;
}

.p-recruit__tel {
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (min-width: 990px) {
  .p-recruit {
    width: min(700px, calc(100% - 40px));
    margin-top: 74px;
    padding-bottom: 88px;
  }

  .p-recruit__lead {
    display: flex;
    justify-content: space-between;
    gap: 20px;
  }

  .p-recruit__lead-body {
    flex: 0 1 424px;
  }

  .p-recruit__intro {
    margin-top: 23px;
  }

  .p-recruit__photo {
    flex: 0 0 235px;
    aspect-ratio: 235 / 180;
    margin-top: 0;
  }

  .p-recruit__photo img {
    scale: 1.07;
  }

  .p-recruit__points {
    grid-template-columns: repeat(2, minmax(0, 300px));
    justify-content: start;
    gap: 42px;
    margin-top: 34px;
    padding: 26px 32px 23px 26px;
  }

  .p-recruit__point-ttl {
    font-weight: 500;
  }

  .p-recruit__dots {
    margin-top: 61px;
  }

  .p-recruit__data {
    --dl-gap: 23px;
    --dl-pb: 26px;
    margin-top: 50px;
  }

  .p-recruit__dots--end {
    margin-top: 62px;
  }

  .p-recruit__tel {
    transition: opacity var(--btn-transition);
  }

  .p-recruit__tel:hover {
    opacity: 0.6;
  }
}

/* 勤務時間：曜日と時間を2列で揃える（時間が複数行・SP の狭い幅でも曜日の列は固定） */
.p-recruit__hours {
  display: grid;
  gap: 4px;
  margin: 0;
}

.p-recruit__hours-row {
  display: grid;
  grid-template-columns: 5.5em minmax(0, 1fr);
  column-gap: 1em;
}

.p-recruit__hours dt,
.p-recruit__hours dd {
  margin: 0;
  font-weight: 400;
}

/* 「※2交代制」：SP は時間の下の行に、PC は時間の後ろに1文字分あけて置く */
.p-recruit__hours-note {
  display: block;
}

@media (min-width: 990px) {
  .p-recruit__hours-note {
    display: inline-block;
    margin-left: 1em;
  }
}

/* ---------- 会社概要 ---------- */
.p-overview {
  width: min(calc(100% - 90px), 300px);
  margin: 44px auto 0;
  padding-bottom: 70px;
}

.p-overview__data {
  --dl-label-w: 160px;
  --dl-gap: 15px;
  --dl-pb: 18px;
}

.p-overview__dots {
  margin-top: 50px;
}

@media (min-width: 990px) {
  .p-overview {
    width: min(700px, calc(100% - 40px));
    margin-top: 70px;
    padding-bottom: 38px;
  }

  .p-overview__data {
    --dl-gap: 23px;
    --dl-pb: 21px;
  }

  .p-overview__dots {
    margin-top: 66px;
  }
}

/* ==========================================================================
   メディケア探検隊（/medicare_report・/medicare_report/report01〜11）
   旧サイトの記事（.mainArea.rightBox の内容）を新サイトのデザインで掲載。Figma なし
   ページタイトルはお問い合わせ等と同じ共通タイトル帯（英字 Report）。本文は中央1列（SP 最大600px / PC 700px）
   旧サイトの見た目（左右交互の配置・見出し画像・クリック拡大）は引き継がない
   ========================================================================== */

/* ---------- 共通：見出し（日本語の左右に線）・記事一覧 ---------- */
.p-report-ttl {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-family: var(--ff-serif);
  font-size: 20px;
  font-weight: 400;
  line-height: 32px;
  text-align: center;
}

.p-report-ttl::before,
.p-report-ttl::after {
  content: "";
  flex: none;
  width: 24px;
  height: 1px;
  background: var(--c-text);
}

.p-report-sec {
  width: min(calc(100% - 60px), 600px);
  margin: 64px auto 0;
}

.p-report-list {
  margin-top: 24px;
  border-top: 1px solid var(--c-beige);
}

.p-report-list__link {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  align-items: baseline;
  padding: 12px 0 13px;
  border-bottom: 1px solid var(--c-beige);
  line-height: 26px;
  transition: opacity var(--btn-transition);
}

.p-report-list__vol {
  font-family: var(--ff-serif);
  font-size: 14px;
  white-space: nowrap;
}

.p-report-list__ttl {
  font-size: 15px;
}

.p-report-list__link[aria-current="page"] {
  background: var(--c-beige-bg);
}

.p-report-list__link[aria-current="page"] .p-report-list__ttl {
  font-weight: 700;
}

@media (hover: hover) {
  .p-report-list__link:hover,
  a.p-report-rec__item:hover {
    opacity: 0.6;
  }
}

/* おすすめリンパマッサージ（旧サイトのアイコン 74×74） */
.p-report-rec__list {
  display: flex;
  justify-content: center;
  gap: 32px;
  margin-top: 24px;
}

.p-report-rec__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  transition: opacity var(--btn-transition);
}

.p-report-rec__icon {
  width: 74px;
  height: 74px;
}

.p-report-rec__label {
  font-size: 14px;
  line-height: 22px;
}

a.p-report-rec__item .p-report-rec__label {
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (min-width: 990px) {
  .p-report-ttl {
    font-size: 24px;
    line-height: 36px;
  }

  .p-report-sec {
    width: min(700px, calc(100% - 40px));
    margin-top: 88px;
  }

  .p-report-list {
    margin-top: 32px;
  }

  .p-report-list__link {
    grid-template-columns: 84px minmax(0, 1fr);
    padding: 14px 8px 15px;
  }

  .p-report-list__vol {
    font-size: 15px;
  }

  .p-report-list__ttl {
    font-size: 16px;
  }

  .p-report-rec__list {
    gap: 64px;
    margin-top: 32px;
  }

  .p-report-rec__label {
    font-size: 15px;
  }
}

/* 記事ページのタイトル帯：一覧へ戻るリンク（日本語に下線） */
.c-page-title__link {
  display: block;
  width: fit-content;
  transition: opacity var(--btn-transition);
}

.c-page-title__link .c-page-title__ja {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 6px;
}

@media (hover: hover) {
  .c-page-title__link:hover {
    opacity: 0.6;
  }
}

/* ---------- 一覧（/medicare_report） ---------- */
.p-report-index {
  padding: 44px 0 100px;
}

.p-report-index__lead {
  width: min(calc(100% - 60px), 600px);
  margin: 0 auto;
  line-height: 30px;
}

.p-report-index .p-report-sec:first-of-type {
  margin-top: 48px;
}

@media (min-width: 990px) {
  .p-report-index {
    padding: 70px 0 120px;
  }

  .p-report-index__lead {
    width: min(700px, calc(100% - 40px));
    text-align: center;
  }

  .p-report-index .p-report-sec:first-of-type {
    margin-top: 64px;
  }
}

/* ---------- 記事（/medicare_report/reportNN） ---------- */
.p-report {
  width: min(calc(100% - 60px), 600px);
  margin: 44px auto 0;
}

.p-report__title {
  font-family: var(--ff-serif);
  font-size: 22px;
  font-weight: 500;
  line-height: 34px;
}

.p-report__vol {
  display: block;
  margin-bottom: 12px;
  font-family: var(--ff-sans);
}

.p-report__title-text {
  display: block;
}

/* 過去の記事である旨の注記（全記事共通） */
.p-report__past {
  margin-top: 16px;
  padding: 10px 14px;
  border: 1px solid var(--c-beige);
  background: var(--c-beige-bg);
  font-size: 13px;
  line-height: 21px;
}

/* 冒頭のイラスト・文字入り画像（原本 700px。拡大しない・切り抜かない） */
.p-report__main {
  width: 100%;
  max-width: 700px;
  height: auto;
  margin: 24px auto 0;
}

/* 本文ブロック：見出し（上線＋濃茶のアクセント）→ 文章 → 写真 */
.p-report__block {
  margin-top: 56px;
}

.p-report__h2 {
  position: relative;
  padding-top: 16px;
  border-top: 1px solid var(--c-text);
  font-family: var(--ff-serif);
  font-size: 19px;
  font-weight: 500;
  line-height: 30px;
}

.p-report__h2::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 0;
  width: 50px;
  height: 4px;
  background: var(--c-text);
}

.p-report__text {
  margin-top: 20px;
  text-align: justify;
}

.p-report__text p + p {
  margin-top: 16px;
}

/* 本文中の小見出し・注・強調・リンク・文字入りバナー（旧サイトの h3 / p.note / .pink / バナー画像） */
.p-report__h3 {
  margin-top: 28px;
  font-size: 16px;
  font-weight: 700;
  line-height: 28px;
}

.p-report__text .p-report__note {
  font-size: 13px;
  line-height: 21px;
}

.p-report__em,
.p-report__em-p {
  font-weight: 700;
}

.p-report a:not(.c-btn) {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.p-report__banner {
  width: 100%;
  max-width: 358px;
  height: auto;
}

/* 06号の閉店告知（旧サイトの記載） */
.p-report__notice {
  margin-top: 24px;
  padding: 14px 16px;
  border: 1px solid var(--c-text);
  font-weight: 700;
  line-height: 26px;
  text-align: center;
}

/* 料金表（04号）：表の部分だけ横スクロール */
.p-report__table {
  margin-top: 16px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.p-report__table table {
  width: 100%;
  min-width: 520px;
  border-collapse: collapse;
  font-size: 14px;
  line-height: 22px;
}

.p-report__table th,
.p-report__table td {
  padding: 8px 10px;
  border: 1px solid var(--c-beige);
  text-align: left;
  vertical-align: middle;
}

.p-report__table th {
  background: var(--c-beige-bg);
  font-weight: 700;
  white-space: nowrap;
}

.p-report__table .is-nowrap {
  white-space: nowrap;
}

.p-report__table .is-total td {
  background: var(--c-beige-bg);
  font-weight: 700;
}

/* 写真：ポップアップ用の大きい画像（旧サイト 500×333 等）を直接表示。元の寸法以上に拡大しない */
.p-report__photos {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  margin-top: 28px;
}

.p-report__photo {
  width: 100%;
  max-width: 500px;
  margin: 0;
}

.p-report__photo img {
  width: 100%;
  height: auto;
}

/* 縦長の写真（旧サイト 333×500）は元の幅まで */
.p-report__photo--portrait {
  max-width: 333px;
}

.p-report__photo figcaption {
  margin-top: 8px;
  font-size: 14px;
  line-height: 22px;
}

/* レポーターの感想（ベージュの囲み） */
.p-report__impre {
  margin-top: 64px;
  padding: 28px 22px 32px;
  background: var(--c-beige-bg);
  text-align: justify;
}

.p-report__impre-ttl {
  padding-bottom: 12px;
  border-bottom: 1px solid var(--c-beige);
  font-family: var(--ff-serif);
  font-size: 20px;
  font-weight: 500;
  line-height: 30px;
  text-align: center;
}

.p-report__impre-text {
  margin-top: 20px;
}

.p-report__impre-text p + p {
  margin-top: 16px;
}

/* 感想欄のイラスト（文字入り・原本 300px） */
.p-report__ill {
  max-width: 300px;
  margin: 24px auto 0;
}

.p-report__ill img {
  width: 100%;
  height: auto;
}

.p-report-back {
  padding-bottom: 100px;
}

.p-report-back__btn {
  display: flex;
  justify-content: center;
  margin-top: 48px;
}

@media (min-width: 990px) {
  .p-report {
    width: min(700px, calc(100% - 40px));
    margin-top: 70px;
  }

  .p-report__title {
    font-size: 26px;
    line-height: 40px;
  }

  .p-report__past {
    margin-top: 20px;
    font-size: 14px;
  }

  .p-report__main {
    margin-top: 32px;
  }

  .p-report__block {
    margin-top: 72px;
  }

  .p-report__h2 {
    font-size: 22px;
    line-height: 34px;
  }

  .p-report__text {
    margin-top: 24px;
  }

  /* PC：写真は2枚ずつ横に並べる（3枚目以降は折り返し）。1枚だけなら最大500px */
  .p-report__photos {
    flex-flow: row wrap;
    align-items: flex-start;
    justify-content: center;
    gap: 28px 20px;
    margin-top: 32px;
  }

  .p-report__photo {
    flex: 0 1 calc(50% - 10px);
    min-width: 0;
  }

  .p-report__photo:only-child {
    flex-basis: 100%;
  }

  .p-report__photo--portrait:only-child {
    flex-basis: auto;
    width: 333px;
  }

  .p-report__impre {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px; /* イラストは原本の幅のまま（文字を縮小しない） */
    column-gap: 28px;
    align-items: center;
    margin-top: 80px;
    padding: 36px 32px 40px;
  }

  .p-report__impre-ttl {
    grid-column: 1 / -1;
  }

  .p-report__ill {
    margin-top: 20px;
  }

  .p-report-back {
    padding-bottom: 120px;
  }
}

/* ==========================================================================
   はじめての方へ（/about）・Q&A（/q_and_a）・リンパの基礎知識（/lymph）
   Figma: sp_はじめての方へ 28198:1209 / pc 28198:1347、sp_Q&A 28203:75 / pc 28203:211、
          sp_リンパの基礎知識 28198:1025 / pc 28198:909
   見出しはコースページと同じ仕様（.c-sec-title.p-lhero__title）。Figma の薄緑の英字・番号は既存部品のベージュに統一
   SP ヘッダー：はじめての方へ・Q&A は白帯あり（お問い合わせと同じ）、リンパの基礎知識は白帯なし（コースページと同じ）
   ========================================================================== */

/* ---------- ページ上部（写真なし：はじめての方へ・Q&A） ----------
   蔦はコースページと同じ部品（.p-lhero__ivy）。左の蔦の位置は --lh-ivy-top（回転後の上端） */
.p-ghero {
  --lh-ivy-top: 91px;
  position: relative;
  padding-top: 73px;
}

/* 後続の本文を蔦より手前に描く */
.p-greet,
.p-commit,
.p-recommend,
.p-qa {
  position: relative;
}

.p-ghero__title {
  margin: 0;
}

@media (min-width: 990px) {
  .p-ghero {
    --lh-ivy-top: 0px;
    padding-top: 122px;
  }

  /* 右上の蔦は画面の右端（Figma 879,0 560×244）。コースページは写真の左（312px） */
  .p-ghero .p-lhero__ivy--r {
    right: 0;
    left: auto;
  }

  /* PC：見出しを中央に（英字・日本語とも中央） */
  .p-ghero__title {
    width: 416px;
    height: 181px;
    margin: 0 auto;
  }

  .p-ghero__title .c-sec-title__en {
    text-align: center;
  }

  .p-ghero__title .c-sec-title__ja {
    justify-self: center;
  }
}

/* ---------- 番号付きの項目（はじめての方へ「6つのこだわり」・リンパの基礎知識） ----------
   番号（Ephesis）は本文の左上に重ねる。項目の下に4点アイコン、次の項目はその直後から */
.p-gnum {
  --gn-pt: 57px;          /* 項目の上端（番号の上端）から見出しまで */
  --gn-no-left: -29px;    /* 本文の左端から番号の左端まで */
  --gn-no-size: 100px;
  --gn-ttl-pb: 17px;      /* 見出しの文字から下線まで */
  --gn-text-mt: 20px;     /* 下線から本文まで */
  width: min(calc(100% - 90px), 300px);
  margin: 0 auto;
  padding: 0;
  list-style: none;
}

.p-gnum__item {
  position: relative;
  padding-top: var(--gn-pt);
}

.p-gnum__no {
  position: absolute;
  top: 0;
  left: var(--gn-no-left);
  z-index: 0;
  color: var(--c-beige);
  font-family: var(--ff-script);
  font-size: var(--gn-no-size);
  line-height: 1.3;
  pointer-events: none;
}

.p-gnum__ttl,
.p-gnum__text {
  position: relative;
  z-index: 1;
}

.p-gnum__ttl {
  padding-bottom: var(--gn-ttl-pb);
  border-bottom: 1px solid var(--c-text);
  font-size: 20px;
  font-weight: 400;
  line-height: 28px;
  letter-spacing: 0.05em;
}

.p-gnum__text {
  margin-top: var(--gn-text-mt);
  line-height: 28px;
}

.p-gnum__dots {
  margin-top: 40px;
}

.p-gnum--lymph {
  --gn-ttl-pb: 26px;
  --gn-text-mt: 28px;
}

@media (min-width: 990px) {
  .p-gnum {
    --gn-pt: 51px;
    --gn-no-left: -170px;
    --gn-no-size: 114px;
    --gn-ttl-pb: 30px;
    --gn-text-mt: 30px;
    width: auto;
    margin: 0;
    padding-left: 170px;
  }

  .p-gnum__ttl {
    font-size: 22px;
  }

  .p-gnum--lymph {
    --gn-pt: 40px;
    --gn-no-size: 100px;
    --gn-ttl-pb: 26px;
    --gn-text-mt: 28px;
  }

  .p-gnum--lymph .p-gnum__dots {
    margin-top: 48px;
  }
}

/* ---------- コースバナー（はじめての方へ・リンパの基礎知識）：ボディコースの .p-lbanners の余白違い ---------- */
.p-lbanners--about {
  gap: 18px;
  margin-top: 42px;
}

.p-lbanners--basic {
  margin-top: 70px;
}

@media (min-width: 990px) {
  /* はじめての方へ：右寄せ・間隔24px（Figma） */
  .p-lbanners--about {
    justify-content: flex-end;
    gap: 24px;
    margin-top: 49px;
  }

  .p-lbanners--about a {
    width: min(443px, calc((100% - 24px) / 2));
  }

  .p-lbanners--basic {
    margin-top: 88px;
  }
}

/* ---------- はじめての方へ ---------- */
.p-greet {
  width: min(calc(100% - 90px), 300px);
  margin: 23px auto 0;
}

.p-greet__ttl {
  font-family: var(--ff-serif);
  font-size: 24px;
  font-weight: 600;
  line-height: 30px;
}

.p-greet__text {
  margin-top: 30px;
  line-height: 30px;
}

.p-greet__text p + p {
  margin-top: 30px;
}

/* ごあいさつの画像：表示枠は Figma（SP 330×276 / PC 320×267）。原本 252×230 を縦横比のまま枠内に収める（切り取り・引き伸ばしなし） */
.p-greet__img {
  width: min(330px, calc(100% + 30px));
  margin: 44px -15px 0;
  aspect-ratio: 330 / 276;
}

.p-greet__img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.p-greet__dots {
  margin-top: 68px;
}

.p-commit {
  margin-top: 68px;
  padding: 31px 0 65px;
  background: var(--c-beige-bg);
}

.p-commit__title .c-ltitle__en {
  white-space: normal; /* 長い英字は自然に改行 */
}

.p-commit .p-gnum {
  margin-top: 11px;
}

.p-recommend {
  margin: 55px 0 91px;
}

.p-recommend__title .c-ltitle__en {
  white-space: normal;
}

@media (min-width: 990px) {
  .p-greet {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    column-gap: 20px;
    width: min(1000px, calc(100% - 40px));
    margin-top: 101px;
  }

  .p-greet__ttl {
    grid-column: 1;
    font-size: 32px;
    line-height: 38px;
    letter-spacing: 0.1em;
  }

  .p-greet__text {
    grid-column: 1;
    max-width: 600px;
    margin: 29px 0 0 60px;
  }

  .p-greet__text p + p {
    margin-top: 44px;
  }

  .p-greet__img {
    grid-column: 2;
    grid-row: 1 / span 2;
    width: 320px;
    margin: 88px 0 0;
    aspect-ratio: 320 / 267;
  }

  .p-greet__dots {
    grid-column: 1 / -1;
    margin-top: 47px;
  }

  .p-commit {
    margin-top: 61px;
    padding: 35px 0 67px;
  }

  .p-commit__inner {
    display: grid;
    grid-template-columns: 320px minmax(0, 660px);
    justify-content: space-between;
    align-items: start;
    width: min(1000px, calc(100% - 40px));
    margin: 0 auto;
  }

  .p-commit__title {
    margin: 19px 0 0;
  }

  .p-commit .p-gnum {
    margin-top: 0;
  }

  .p-recommend {
    width: min(1000px, calc(100% - 40px));
    margin: 64px auto 108px;
  }

  .p-recommend__title {
    margin-left: 0;
  }
}

/* ---------- Q&A ---------- */
.p-qa-title {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-weight: 400;
}

.p-qa-title__en {
  font-family: var(--ff-script);
  font-size: 100px;
  line-height: 115px;
  white-space: nowrap;
}

.p-qa-title__q {
  color: var(--c-beige);
}

/* 「&」は小さい文字。行の高さは英字の行に合わせる（行が高くならないように） */
.p-qa-title__amp {
  margin-right: 0.15em;
  font-size: 60px;
  line-height: 0;
}

.p-qa-title__a {
  color: var(--c-text);
}

.p-qa-title__ja {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-top: 7px;
  font-family: var(--ff-serif);
  font-size: 20px;
  line-height: 26px;
  text-align: center;
}

.p-qa-title__ja::before,
.p-qa-title__ja::after {
  content: "";
  flex: none;
  width: 24px;
  height: 1px;
  background: var(--c-text);
}

.p-qa {
  margin-top: 54px;
  padding: 50px 0 72px;
  background: var(--c-beige-bg);
}

.p-qa__list {
  display: grid;
  gap: 38px;
  width: min(calc(100% - 30px), 600px);
  margin-left: max(0px, calc((100% - 630px) / 2));
}

.p-qa__q,
.p-qa__a {
  display: grid;
  align-items: start;
  min-height: 56px;
}

.p-qa__q {
  grid-template-columns: 80px minmax(0, 1fr);
  font-size: 16px;
  font-weight: 500;
}

.p-qa__a {
  grid-template-columns: 60px minmax(0, 1fr);
  margin-left: 40px;
}

.p-qa__mark {
  color: var(--c-beige);
  font-family: var(--ff-script);
  font-size: 42px;
  font-weight: 400;
  line-height: 56px;
}

.p-qa__mark--a {
  color: rgba(61, 36, 33, 0.4);
}

.p-qa__q-text {
  padding: 13px 0 15px;
  line-height: 26px;
  letter-spacing: 0.05em;
}

.p-qa__a-text {
  padding-top: 14px;
  line-height: 28px;
  letter-spacing: 0.05em;
}

@media (min-width: 990px) {
  .p-qa-title__en {
    font-size: 160px;
    line-height: 196px;
  }

  .p-qa-title__amp {
    font-size: 80px;
  }

  .p-qa-title__ja {
    gap: 10px;
    margin-top: -3px;
    font-size: 24px;
    line-height: 35px;
  }

  .p-qa {
    margin-top: 90px;
    padding: 56px 0 120px;
  }

  .p-qa__list {
    gap: 0;
    width: min(1000px, calc(100% - 40px));
    margin: 0 auto;
  }

  .p-qa__q {
    grid-template-columns: 190px minmax(0, 1fr);
    min-height: 107px;
    font-size: 18px;
  }

  .p-qa__a {
    grid-template-columns: 149px minmax(0, 1fr);
    min-height: 142px;
    margin-left: 340px;
    font-size: 18px;
  }

  .p-qa__mark {
    font-size: 100px;
    line-height: 142px;
  }

  /* 質問の行は Figma どおり 107px（番号の下の余白は回答の行に重ねる） */
  .p-qa__q .p-qa__mark {
    height: 107px;
  }

  .p-qa__q-text {
    padding: 51px 0 0;
    line-height: 28px;
  }

  .p-qa__a-text {
    padding-top: 51px;
  }
}

/* ---------- リンパの基礎知識 ---------- */
.p-lhero--basic {
  --lh-ivy-top: 362px;
}

/* 写真（Figma SP 349×256 / PC 877×550。角丸なし・枠いっぱいに表示） */
.p-lhero--basic .p-lhero__photo {
  width: min(calc(100% - 40px), 640px);
  aspect-ratio: 349 / 256;
  overflow: hidden;
  border-radius: 0;
}

.p-lhero--basic .p-lhero__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-basic {
  position: relative;
  margin-top: 81px;
  padding: 9px 0 46px;
  background: var(--c-beige-bg);
}

@media (min-width: 990px) {
  .p-lhero--basic {
    --lh-ivy-top: 397px;
  }

  .p-lhero--basic .p-lhero__photo {
    width: auto;
    aspect-ratio: 877 / 550;
  }

  .p-basic {
    margin-top: 108px;
    padding: 47px 0 100px;
  }

  .p-basic .p-gnum {
    width: min(1000px, calc(100% - 40px));
    margin: 0 auto;
    padding-left: 340px;
  }
}

.p-lbanners--basic {
  margin-bottom: 70px;
}

@media (min-width: 990px) {
  .p-lbanners--basic {
    margin-bottom: 95px;
  }
}

/* ==========================================================================
   SEVとは？（/about_sev）・ブライダルコース（/course/bridal）
   Figma: sp_sevとは 28211:97 / pc_sevとは 28211:168、sp_bridal 28216:285 / pc_bridal 28216:526
   見出しはコースページと同じ仕様（.c-sec-title.p-lhero__title）。薄緑の英字は既存部品のベージュ
   ========================================================================== */

/* 見出しの英字の一部だけ字間を広げる（「About SEV」の SEV。Figma の「S E V」の半角スペースの代わり） */
.p-lhero__title-wide {
  letter-spacing: 0.08em;
}

/* ---------- SEVとは？：上部 ---------- */
/* 写真（原本 312×207・透過あり）：縦横比を保って枠に収める。SP 312×207 / PC 567×354（Figma の枠） */
.p-lhero--sev .p-sev-main {
  width: min(312px, calc(100% - 40px));
  aspect-ratio: 312 / 207;
  border-radius: 0;
}

.p-sev-main img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media (min-width: 990px) {
  .p-lhero--sev .p-sev-main {
    justify-self: start;
    width: min(567px, calc(100% - 20px));
    margin: -19px 0 0 94px;
    aspect-ratio: 567 / 354;
    border-radius: 0;
  }
}

/* ---------- SEVとは？：本文ブロック ---------- */
.p-sev-block {
  --sev-w: min(calc(100% - 78px), 600px);
  position: relative;
  margin-top: 110px;
}

.p-sev-block--first {
  margin-top: 48px;
}

/* 小見出し：下にベージュの線（SP は本文の左15px手前から画面右端まで） */
.p-sev-block__ttl {
  margin-left: calc((100% - var(--sev-w)) / 2 - 15px);
  padding: 0 0 26px 1px;
  border-bottom: 1px solid var(--c-beige);
  color: var(--c-text);
  font-size: 26px;
  font-weight: 400;
  line-height: 34px;
}

.p-sev-block__body {
  width: var(--sev-w);
  margin: 41px auto 0;
}

.p-sev-block__catch {
  font-size: 20px;
  font-weight: 500;
  line-height: 28px;
}

.p-sev-block__text p {
  line-height: 30px;
  text-align: justify;
}

.p-sev-block__catch + p {
  margin-top: 44px;
}

.p-sev-block__imgs {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-top: 15px;
}

.p-sev-block__img {
  width: 100%;
  aspect-ratio: 312 / 197;
}

.p-sev-block__img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* 特許の画像：国旗・特許番号（ph03）と特許証（ph04）の2枚（2026-10-30 差し替え。どちらも 588×409）。枠は画像と同じ縦横比 */
.p-sev-block__imgs--patent {
  gap: 0;
}

.p-sev-block__img--patent-l {
  aspect-ratio: 312 / 217;
  border-radius: 0;
}

.p-sev-block__img--patent-r {
  width: calc(100% * 260 / 312);
  aspect-ratio: 588 / 409; /* 画像と同じ（2026-11-11：枠が写真用の 312/197 になり特許証が横に引き伸ばされていたため） */
  border-radius: 0;
}

/* 切り抜き（.c-crop）の位置・大きさを使う（上の object-fit: contain の指定を打ち消す）。縦横は同じ倍率 */
.p-sev-block__img--patent-l img,
.p-sev-block__img--patent-r img {
  top: var(--t, 0%);
  left: var(--l, 0%);
  width: var(--w, 100%);
  height: var(--h, 100%);
  object-fit: fill;
}

/* オフィシャルサイトへのリンク（枠全体・別タブ） */
.p-sevlink {
  position: relative;
  display: flex;
  flex-direction: column;
  width: min(calc(100% - 78px), 600px);
  margin: 78px auto 96px;
  transition: opacity var(--btn-transition);
}

.p-sevlink__lead {
  padding: 21px 20px 34px;
  background: rgba(233, 206, 152, 0.5);
  font-size: 20px;
  line-height: 28px;
}

/* 下の枠：上辺の中央に三角（Figma の Polygon。下向き） */
.p-sevlink__url {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 95px;
  padding: 0 6px;
  background: var(--c-beige);
  font-size: 24px;
  font-weight: 500;
  line-height: 28px;
  letter-spacing: 0.05em;
  overflow-wrap: anywhere;
}

.p-sevlink__url::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 50%;
  width: 36px;
  height: 5px;
  background: var(--c-beige);
  clip-path: polygon(0 0, 100% 0, 87.5% 100%, 12.5% 100%);
  translate: -50% 0;
}

.p-sevlink__icon {
  flex: none;
  width: 14px;
  height: 14px;
}

@media (hover: hover) {
  .p-sevlink:hover {
    opacity: 0.7;
  }
}

.p-sevlink:focus-visible {
  opacity: 0.7;
}

@media (min-width: 990px) {
  .p-sev-block {
    --sev-w: min(800px, calc(100% - 40px));
    margin-top: 83px;
  }

  .p-sev-block--first {
    margin-top: 39px;
  }

  .p-sev-block__ttl {
    width: var(--sev-w);
    margin: 0 auto;
    padding: 0 0 30px;
    line-height: 31px;
  }

  .p-sev-block__body {
    display: grid;
    grid-template-columns: minmax(0, 520px) 246px;
    justify-content: space-between;
    align-items: start;
    margin-top: 36px;
  }

  .p-sev-block__catch + p {
    margin-top: 25px;
  }

  .p-sev-block__text p {
    line-height: 26px;
  }

  .p-sev-block__text p + p {
    margin-top: 26px;
  }

  /* 2つ目のブロックの本文は Figma PC どおり 18px・左揃え */
  .p-sev-block__text--b p {
    font-size: 18px;
    text-align: left;
  }

  .p-sev-block__imgs {
    gap: 12px;
    margin-top: 0;
  }

  .p-sev-block__img {
    aspect-ratio: 246 / 155;
    border-radius: 0;
  }

  .p-sev-block__img--patent-l {
    aspect-ratio: 246 / 171;
  }

  .p-sev-block__img--patent-r {
    width: calc(100% * 205 / 246);
    aspect-ratio: 588 / 409;
  }

  .p-sevlink {
    flex-direction: row;
    align-items: stretch;
    width: min(800px, calc(100% - 40px));
    margin: 108px auto 144px;
  }

  .p-sevlink__lead {
    flex: none;
    display: flex;
    align-items: center;
    width: 312px;
    min-height: 96px;
    padding: 0 30px;
  }

  /* 右の枠は左の枠に14px重ねる。左辺に左向きの三角 */
  .p-sevlink__url {
    flex: 0 1 481px;
    justify-content: flex-start;
    margin-left: -14px;
    padding: 0 24px 0 59px;
    font-size: 32px;
  }

  .p-sevlink__url::before {
    top: 39px;
    left: -9px;
    width: 9px;
    height: 16px;
    clip-path: polygon(0 50%, 100% 0, 100% 100%);
    translate: none;
  }
}

/* ---------- ブライダルコース ---------- */
.is-bridal {
  text-spacing-trim: space-all;
}

.p-lhero--bridal {
  --lh-ivy-top: 362px;
}

/* 写真（Figma SP 336×256・左側角丸15 / PC 877×550・左側角丸30） */
.p-lhero--bridal .p-lhero__photo {
  aspect-ratio: 336 / 256;
}

.p-lhero--bridal .p-lhero__kakomi {
  margin-top: -49px;
  padding-bottom: 37px;
}

.p-bintro {
  position: relative;
  margin-top: 53px;
}

.p-bintro__catch {
  width: min(calc(100% - 60px), 600px);
  margin: 0 auto;
  font-family: var(--ff-serif);
  font-size: 20px;
  font-weight: 600;
  line-height: 32px;
}

.p-bintro__text {
  width: min(calc(100% - 108px), 560px);
  margin: 33px auto 0;
  line-height: 30px;
  text-align: justify;
}

.p-bintro__dots {
  margin-top: 46px;
}

/* 料金のご案内（ベージュの帯）：既存の料金部品 .c-price ＋ 内容の枠 */
.p-lsec--bridal {
  margin-top: 53px;
  padding: 30px 0 57px;
}

.p-lsec--bridal .p-lsec__list,
.p-lsec--bridal-flow .p-lsec__list {
  margin-top: 47px;
}

.c-price-list--bridal {
  --price-gap: 40px;
}

.p-bridal-menu {
  margin-top: 21px;
  padding: 18px 19px;
  background: rgba(61, 36, 33, 0.05);
  line-height: 24px;
  text-align: center;
}

/* コースの流れ（工程一覧） */
.p-lsec--bridal-flow {
  padding: 36px 0 85px;
}

.p-bflow {
  width: min(calc(100% - 70px), 600px);
  margin-right: auto;
  margin-left: auto;
}

.p-bflow__course + .p-bflow__course {
  margin-top: 40px;
}

.p-bflow__head {
  position: relative;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 11px;
  border-bottom: 1px solid var(--c-text);
}

/* 下線の左端に濃茶（SP 38×2 / PC 67×2） */
.p-bflow__head::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 38px;
  height: 2px;
  background: var(--c-text);
}

.p-bflow__ttl {
  font-size: 20px;
  font-weight: 500;
  line-height: 28px;
}

.p-bflow__total,
.p-bflow__time {
  font-family: var(--ff-serif);
  font-size: 24px;
  line-height: 24px;
  white-space: nowrap;
}

.p-bflow__total small,
.p-bflow__time small {
  font-size: 14px;
}

.p-bflow__cap {
  margin-top: 15px;
  line-height: 24px;
}

.p-bflow__steps {
  display: grid;
  gap: 10px;
  margin: 21px 0 0;
  padding: 0;
  list-style: none;
}

/* 工程：濃茶5%の枠。次の工程との間に下向きの三角（最後の工程はなし） */
.p-bflow__step {
  position: relative;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 0;
  min-height: 55px;
  padding: 8px 12px 8px 13px;
  background: rgba(61, 36, 33, 0.05);
}

.p-bflow__step:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  width: 18px;
  height: 10px;
  background: rgba(61, 36, 33, 0.05);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  translate: -50% 0;
}

.p-bflow__no {
  font-size: 16px;
  line-height: 24px;
}

.p-bflow__name {
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
}

.p-bflow__name small {
  font-size: 12px;
}

.p-bflow__time {
  padding-left: 8px;
}

.p-bflow__dots {
  margin-top: 41px;
}

.p-bflow__note {
  margin-top: 33px;
  padding: 0 7px 0 5px;
  line-height: 30px;
  text-align: justify;
}

@media (min-width: 990px) {
  .p-lhero--bridal {
    --lh-ivy-top: 309px;
  }

  .p-lhero--bridal .p-lhero__photo {
    aspect-ratio: 877 / 550;
  }

  .p-lhero--bridal .p-lhero__kakomi {
    margin-top: 159px;
    padding-bottom: 43px;
  }

  .p-bintro {
    margin-top: 104px;
  }

  .p-bintro__catch {
    width: min(800px, calc(100% - 40px));
    font-size: 26px;
    line-height: 36px;
  }

  .p-bintro__text {
    width: min(800px, calc(100% - 40px));
    margin-top: 40px;
    padding-left: 114px;
    font-size: 18px;
  }

  .p-bintro__dots {
    margin-top: 47px;
  }

  .p-lsec--bridal {
    margin-top: 77px;
    padding: 60px 0 110px;
  }

  .p-lsec--bridal .p-lsec__list,
  .p-lsec--bridal-flow .p-lsec__list {
    margin-top: 50px;
  }

  .c-price-list--bridal {
    --price-gap: 60px;
  }

  .p-bridal-menu {
    margin-top: 26px;
    padding: 19px 34px;
    font-size: 18px;
  }

  .p-lsec--bridal-flow {
    padding: 91px 0 166px;
  }

  .p-bflow {
    width: auto;
    margin: 0;
  }

  .p-lsec--bridal-flow .p-lsec__list {
    margin-top: 64px;
  }

  .p-bflow__course + .p-bflow__course {
    margin-top: 38px;
  }

  .p-bflow__head {
    padding-bottom: 14px;
  }

  .p-bflow__head::after {
    width: 67px;
  }

  .p-bflow__cap {
    margin-top: 16px;
  }

  .p-bflow__steps {
    gap: 11px;
    margin-top: 23px;
  }

  .p-bflow__step {
    grid-template-columns: 68px minmax(0, 1fr) auto;
    min-height: 59px;
    padding: 8px 22px 8px 23px;
  }

  .p-bflow__name {
    font-size: 18px;
  }

  .p-bflow__name small {
    font-size: 14px;
  }

  .p-bflow__dots {
    margin-top: 45px;
  }

  .p-bflow__note {
    margin-top: 48px;
    padding: 0;
  }
}

/* ==========================================================================
   スタッフブログ（/blog/・カテゴリ別一覧・記事詳細）
   Figma: sp_blog中身 28057:395 / pc_blog中身_1440px 28057:510（記事詳細のみ。一覧は同じ部品で構成）
   WordPress 組み込み時：一覧＝記事ループ、本文＝the_content()、サイドバー＝最新記事／wp_get_archives／wp_list_categories
   ========================================================================== */

/* ---------- 見出し（Blog／スタッフブログ）：はじめての方へと同じ部品（.p-ghero）。PC は左寄せ ---------- */
.p-ghero--blog {
  --lh-ivy-top: 100px;
}

@media (min-width: 990px) {
  .p-ghero--blog {
    --lh-ivy-top: 147px;
    padding-top: 130px;
  }

  .p-ghero--blog .p-lhero__ivy--r {
    left: 399px;
    right: auto;
    width: 629px;
    height: 275px;
    background-size: 630px 454.3px;
    background-position: -0.8px -179.3px;
  }

  .p-ghero--blog .p-ghero__title {
    width: 447px;
    margin: 0 0 0 max(20px, calc((100% - 1000px) / 2 - 76px));
  }

  .p-ghero--blog .p-ghero__title .c-sec-title__en {
    text-align: left;
  }

  .p-ghero--blog .p-ghero__title .c-sec-title__ja {
    justify-self: end;
  }
}

/* ---------- レイアウト（TOP のブログ欄 .p-blog とは別のクラス）：SP は本文 → サイドバー / PC は本文640px＋サイドバー320px ---------- */
.p-blogpage {
  position: relative;
  width: min(calc(100% - 40px), 600px);
  margin: 20px auto 140px;
}

.p-blogpage__main {
  min-width: 0;
}

@media (min-width: 990px) {
  .p-blogpage {
    display: grid;
    grid-template-columns: minmax(0, 640px) 320px;
    justify-content: space-between;
    align-items: start;
    width: min(1000px, calc(100% - 40px));
    margin: 89px auto 147px;
  }
}

/* ---------- カテゴリ別一覧の見出し ---------- */
.p-blog-heading {
  margin-bottom: 32px;
  font-family: var(--ff-serif);
  font-size: 22px;
  font-weight: 500;
  line-height: 32px;
}

.p-blog-heading__label {
  display: block;
  color: var(--c-copy);
  font-family: var(--ff-sans);
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
}

.p-blog-empty {
  padding: 40px 0;
  border-top: 5px solid var(--c-beige);
  border-bottom: 1px solid var(--c-beige);
  text-align: center;
}

/* ---------- 記事（一覧・詳細で共通） ---------- */
.p-blog-entry + .p-blog-entry {
  margin-top: 64px;
}

.p-blog-entry__head {
  border-top: 5px solid var(--c-beige);
}

.p-blog-entry__date {
  margin-top: 3px;
  line-height: 30px;
}

.p-blog-entry__title {
  margin-top: 8px;
  padding-bottom: 19px;
  border-bottom: 1px solid var(--c-beige);
  font-size: 22px;
  font-weight: 500;
  line-height: 28px;
  overflow-wrap: anywhere;
}

.p-blog-entry__title a {
  transition: opacity var(--btn-transition);
}

@media (hover: hover) {
  .p-blog-entry__title a:hover {
    opacity: 0.6;
  }
}

/* 前後の記事（ない側は出力しない。前＝左・次＝右） */
.p-blog-postnav {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-top: 29px;
  padding-bottom: 29px;
  border-bottom: 1px solid var(--c-beige);
  color: rgba(61, 36, 33, 0.5);
  font-size: 14px;
  line-height: 28px;
}

.p-blog-postnav__next {
  margin-left: auto;
}

@media (hover: hover) {
  .p-blog-postnav a:hover {
    color: var(--c-text);
  }
}

/* ページ送り（WordPress paginate_links() のクラス） */
.p-blog-pager {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 56px;
  font-size: 14px;
  line-height: 1;
}

.p-blog-pager .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 8px;
  border: 1px solid var(--c-beige);
  transition: background-color var(--btn-transition);
}

.p-blog-pager .current {
  background: var(--c-beige);
}

.p-blog-pager .dots {
  min-width: 0;
  border: 0;
}

@media (hover: hover) {
  .p-blog-pager a.page-numbers:hover {
    background: var(--c-beige-60);
  }
}

@media (min-width: 990px) {
  .p-blog-heading {
    font-size: 26px;
    line-height: 36px;
  }

  .p-blog-entry + .p-blog-entry {
    margin-top: 80px;
  }

  .p-blog-entry__date {
    margin-top: 3px;
  }

  .p-blog-entry__title {
    margin-top: 10px;
    padding-bottom: 11px;
    font-size: 28px;
    line-height: 34px;
  }

  .p-blog-pager {
    margin-top: 72px;
  }
}

/* ---------- 本文（the_content の出力）：このブロック内だけに効かせる ---------- */
.p-blog-content {
  display: flow-root; /* 回り込みの画像を記事の中に収める */
  margin-top: 30px;
  font-size: 16px;
  line-height: 28px;
  overflow-wrap: anywhere;
}

.p-blog-content > * + * {
  margin-top: 28px;
}

/* 空の段落（旧記事の間隔用）は高さを持たせない（文章は変更しない） */
.p-blog-content p:empty {
  display: none;
}

.p-blog-content a {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.p-blog-content img,
.p-blog-content video,
.p-blog-content iframe,
.p-blog-content embed,
.p-blog-content object {
  max-width: 100%;
  height: auto;
}

.p-blog-content img {
  display: inline-block;
  vertical-align: bottom;
}

.p-blog-content figure {
  margin-right: 0;
  margin-left: 0;
}

.p-blog-content figcaption,
.p-blog-content .wp-caption-text,
.p-blog-content .wp-element-caption {
  margin-top: 8px;
  color: var(--c-copy);
  font-size: 14px;
  line-height: 22px;
  text-align: center;
}

/* 旧エディタのキャプション（style="width: …px" の固定幅を本文幅までに） */
.p-blog-content .wp-caption {
  max-width: 100% !important;
}

.p-blog-content .aligncenter {
  display: block;
  margin-right: auto;
  margin-left: auto;
}

.p-blog-content .alignleft {
  float: left;
  max-width: 50%;
  margin: 4px 24px 16px 0;
}

.p-blog-content .alignright {
  float: right;
  max-width: 50%;
  margin: 4px 0 16px 24px;
}

.p-blog-content .wp-block-image .aligncenter {
  text-align: center;
}

/* ギャラリー（ブロックエディタ／旧ギャラリー） */
.p-blog-content .wp-block-gallery,
.p-blog-content .gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0;
  list-style: none;
}

.p-blog-content .wp-block-gallery > *,
.p-blog-content .gallery-item {
  flex: 1 1 calc(50% - 4px);
  min-width: 0;
  margin: 0;
}

.p-blog-content .wp-block-gallery img,
.p-blog-content .gallery-item img {
  width: 100%;
}

/* 埋め込み（動画・SNS）：本文幅に収める */
.p-blog-content .wp-block-embed iframe,
.p-blog-content > iframe {
  width: 100%;
  aspect-ratio: 16 / 9;
}

.p-blog-content h2,
.p-blog-content h3,
.p-blog-content h4 {
  font-weight: 500;
  line-height: 1.5;
}

.p-blog-content h2 {
  padding-bottom: 8px;
  border-bottom: 1px solid var(--c-beige);
  font-size: 20px;
}

.p-blog-content h3 {
  font-size: 18px;
}

.p-blog-content h4 {
  font-size: 16px;
}

.p-blog-content ul,
.p-blog-content ol {
  padding-left: 1.5em;
}

.p-blog-content ul {
  list-style: disc;
}

.p-blog-content ol {
  list-style: decimal;
}

.p-blog-content blockquote {
  margin: 0;
  padding: 4px 0 4px 16px;
  border-left: 4px solid var(--c-beige);
}

.p-blog-content table {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  border-collapse: collapse;
}

.p-blog-content th,
.p-blog-content td {
  padding: 8px 12px;
  border: 1px solid var(--c-beige);
}

@media (min-width: 990px) {
  .p-blog-content .wp-block-gallery > *,
  .p-blog-content .gallery-item {
    flex-basis: calc(33.333% - 6px);
  }
}

/* ---------- サイドバー：SP は2列（最新記事｜月別アーカイブ、その下にカテゴリー） / PC は縦に並べる ---------- */
.p-blog-side {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: auto 1fr; /* アーカイブ（右・2行分）が長くても、カテゴリーは最新記事のすぐ下 */
  grid-template-areas:
    "latest archive"
    "cat archive";
  align-items: start;
  gap: 39px 14px;
  margin-top: 83px;
}

.p-blog-side__box--latest {
  grid-area: latest;
}

.p-blog-side__box--archive {
  grid-area: archive;
}

.p-blog-side__box--cat {
  grid-area: cat;
}

.p-blog-side__ttl {
  padding: 6px 0 7px;
  border-top: 5px solid var(--c-beige);
  border-bottom: 1px solid var(--c-beige);
  font-size: 16px;
  font-weight: 500;
  line-height: 28px;
  text-align: center;
}

.p-blog-side__list {
  margin-top: 6px;
  font-size: 14px;
  line-height: 28px;
}

.p-blog-side__list li + li {
  margin-top: 3px;
}

/* SP：最新記事のタイトルは1行で省略 */
.p-blog-side__box--latest .p-blog-side__list a {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.p-blog-side__list a,
.p-blog-archive a {
  transition: opacity var(--btn-transition);
}

@media (hover: hover) {
  .p-blog-side__list a:hover,
  .p-blog-archive a:hover {
    opacity: 0.6;
  }
}

/* 月別アーカイブ：年ごとに開閉（<details>。キーボードでも操作可） */
.p-blog-archive {
  margin-top: 6px;
  font-size: 14px;
  line-height: 28px;
}

.p-blog-archive__summary {
  position: relative;
  display: block;
  padding: 3px 24px 3px 0;
  cursor: pointer;
  list-style: none;
}

.p-blog-archive__summary::-webkit-details-marker {
  display: none;
}

/* 開閉の印（＋／−） */
.p-blog-archive__summary::before,
.p-blog-archive__summary::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 4px;
  width: 11px;
  height: 1px;
  background: var(--c-text);
}

.p-blog-archive__summary::after {
  rotate: 90deg;
  transition: rotate var(--btn-transition);
}

.p-blog-archive__year[open] > .p-blog-archive__summary::after {
  rotate: 0deg;
}

.p-blog-archive__year + .p-blog-archive__year {
  border-top: 1px dashed var(--c-beige);
}

.p-blog-archive__months {
  padding: 0 0 6px 12px;
}

@media (min-width: 990px) {
  .p-blog-side {
    display: block;
    margin-top: 0;
  }

  .p-blog-side__box + .p-blog-side__box {
    margin-top: 67px;
  }

  .p-blog-side__ttl {
    padding: 11px 0 12px;
    font-size: 18px;
  }

  .p-blog-side__list,
  .p-blog-archive {
    margin-top: 9px;
    font-size: 16px;
  }

  .p-blog-side__list li + li {
    margin-top: 8px;
  }

  .p-blog-side__list a {
    display: block;
    padding: 5px 0;
  }

  .p-blog-side__box--latest .p-blog-side__list a {
    overflow: visible;
    white-space: normal;
  }

  .p-blog-archive__summary {
    padding: 5px 24px 5px 0;
  }
}

/* ==========================================================================
   店舗のご案内（/shop/meguro）
   Figma: sp_店舗のご案内 28161:1417 / pc_店舗のご案内 28161:1562
   上部（見出し・写真・紹介の囲み）は p-lhero を --shop で流用。ほかのページに影響しない専用クラスのみ
   ========================================================================== */

/* ---------- 上部 ---------- */
.p-lhero--shop {
  padding-top: 88px;
}

/* 蔦：コースページと同じ素材を Figma どおり少し小さく（右 205×154 / 左 回転後 219×199） */
.p-lhero--shop .p-lhero__ivy--r {
  right: -1px;
  width: 205px;
  height: 154px;
  background-size: 275.1px 198.4px;
  background-position: -0.2px -44.4px;
}

.p-lhero--shop .p-lhero__ivy--l {
  top: 273px;
  left: 9px;
  width: 199px;
  height: 219px;
  background-size: 199px 274.6px;
  background-position: 0 -55.4px;
}

.p-lhero__dtitle--shop {
  margin-left: 24px;
}

/* 英字の色は他ページの英字見出し（施術詳細の「Facial Massage」）と同じ #E9CE98・不透明度100%（.p-lhero__dtitle-en の指定のまま） */
.p-lhero__dtitle--shop .p-lhero__dtitle-en {
  height: 20px;
  font-size: 22px;
  line-height: 26px;
}

.p-lhero__dtitle--shop .p-lhero__dtitle-ja {
  font-size: 24px;
  line-height: 34px;
}

/* 店舗写真（Figma SP 332×234 左側角丸15 / PC 880×550 左側角丸30） */
.p-lhero--shop .p-lhero__photo {
  width: min(calc(100% - 58px), 640px);
  margin-top: 36px;
  aspect-ratio: 332 / 234;
}

/* 紹介の囲み（Figma SP 299×520 右側角丸15 / PC 660×374 角丸30） */
.p-lhero__kakomi--shop {
  width: min(299px, calc(100% - 40px));
  margin-top: -56px;
  padding: 86px 31px 47px 35px;
}

/* 店名：「メディケア」「目黒店」を同じ文字サイズで横1列（2026-10-20 先方修正）。
   SP は「目黒店」の 32px のままだと枠（内側 233px）からはみ出すため、枠の内側の幅に収まる大きさまで縮める
   （8文字・字間 0.1em ＝ 文字サイズ × 8.8。390px 幅で約26px） */
.p-shop-intro__name {
  display: block;
  font-size: min(32px, calc((min(299px, 100vw - 40px) - 66px) / 8.8));
  font-weight: 400;
  line-height: 49px;
  letter-spacing: 0.1em;
  white-space: nowrap;
}

.p-shop-intro__text {
  margin: 17px 0 0 23px;
  text-align: justify;
}

/* ---------- スライドショー（c-slideshow） ---------- */
.c-slideshow {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.c-slideshow__list {
  position: absolute;
  inset: 0;
}

.c-slideshow__item {
  position: absolute;
  inset: 0;
  opacity: 0;
}

.c-slideshow__item .c-crop {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  border-radius: 0;
}

.c-slideshow__item.is-prev {
  z-index: 1;
  opacity: 1;
}

.c-slideshow__item.is-active {
  z-index: 2;
  opacity: 1;
}

.c-slideshow.is-ready .c-slideshow__item {
  transition: opacity 1s ease;
}

.c-slideshow.is-ready .c-slideshow__item.is-prev {
  transition: none;
}

@media (prefers-reduced-motion: reduce) {
  .c-slideshow.is-ready .c-slideshow__item {
    transition: none;
  }
}

/* ---------- 店長からのご挨拶 ---------- */
.p-shop-greeting {
  width: min(calc(100% - 52px), 640px);
  margin: 56px auto 0;
}

.p-shop-greeting__ttl {
  font-family: var(--ff-serif);
  font-size: 24px;
  font-weight: 600;
  line-height: 30px;
}

.p-shop-greeting__text {
  margin: 35px 14px 0 24px;
}

.p-shop-greeting__dots {
  width: 15px;
  height: 12px;
  margin: 30px auto 0;
}

/* ---------- 詳細情報・アクセス ---------- */
.p-shop-info {
  width: min(calc(100% - 52px), 640px);
  margin: 42px auto 0;
}

.p-shop-info--access {
  margin-top: 70px;
}

.p-shop-info__list {
  display: grid;
  gap: 21px;
  margin: 28px 14px 0 24px;
}

.p-shop-info__row {
  padding-bottom: 24px;
  border-bottom: 1px solid var(--c-text);
  line-height: 28px;
}

.p-shop-info__row dt,
.p-shop-info__row h3 {
  color: rgba(61, 36, 33, 0.7);
  font-size: 16px;
  font-weight: 700;
  line-height: 28px;
  letter-spacing: 0.1em;
}

.p-shop-info__row dd {
  margin: 2px 0 0;
}

.p-shop-info__row--amenity {
  padding-bottom: 27px;
}

.p-shop-info__row--amenity dd {
  margin-top: 6px;
}

.p-shop-info--access .p-shop-info__list {
  gap: 28px;
}

.p-shop-info__row--route {
  padding-bottom: 28px;
}

.p-shop-info__row--route p:first-of-type {
  margin-top: 12px;
}

/* アメニティ：現行アイコン（41×59px）を Figma の表示サイズ（SP 40×60 / PC 52×78）に合わせて表示。
   高解像度版は <img> に srcset を足すだけで差し替え可能 */
.p-shop-amenity {
  display: grid;
  grid-template-columns: repeat(auto-fill, 40px);
  gap: 11px 12px;
}

.p-shop-amenity img {
  width: 40px;
  height: 60px;
  object-fit: contain;
}

/* ---------- 地図 ---------- */
.p-shop-map {
  margin: 70px 0 135px;
}

/* 表示枠を先に確保（SP：画面幅いっぱい・Figma 390×466 の比率） */
.p-shop-map__frame {
  position: relative;
  aspect-ratio: 390 / 466;
  overflow: hidden;
  background: #e5e3df;
}

.p-shop-map__canvas {
  position: absolute;
  inset: 0;
}

.p-shop-map__fallback {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
  font-size: 14px;
  line-height: 24px;
  text-align: center;
}

.p-shop-map__link {
  margin: 12px 16px 0;
  font-size: 14px;
  line-height: 24px;
  text-align: right;
}

.p-shop-map__link a {
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (hover: hover) {
  .p-shop-map__link a:hover {
    text-decoration: none;
  }
}

@media (min-width: 990px) {
  .p-lhero--shop {
    --lh-ivy-top: 651px;
    padding-top: 163px;
  }

  .p-lhero--shop .p-lhero__ivy--r {
    left: 312px;
    right: auto;
    width: 559px;
    height: 244px;
    background-size: 560px 403.8px;
    background-position: -0.7px -159.4px;
  }

  .p-lhero--shop .p-lhero__ivy--l {
    top: calc(var(--lh-ivy-top) - 35px);
    left: 35px;
    width: 404px;
    height: 474px;
    background-size: 404.4px 558.7px;
    background-position: 0 -84.66px;
  }

  .p-lhero__dtitle--shop {
    margin: 193px 0 0 220px;
  }

  .p-lhero__dtitle--shop .p-lhero__dtitle-en {
    height: 42px;
    font-size: 32px;
    line-height: 42px;
  }

  .p-lhero__dtitle--shop .p-lhero__dtitle-ja {
    font-size: 44px;
    line-height: 48px;
  }

  .p-lhero--shop .p-lhero__photo {
    width: auto;
    margin-top: 0;
    aspect-ratio: 880 / 550;
    max-height: 568px; /* 下の @supports に対応しないブラウザ用 */
  }

  /* 写真の表示枠：横幅は従来どおり（右列いっぱい）、高さは 880:550 の比率で最大568px。
     画面が広いと高さが伸びて紹介の囲みの文字に重なるため、568px で止める（2026-10-16）。
     右列の幅＝上部全体の幅 − 左列（max(33.33% + 83px, 539px)）。cqw は .p-lhero--shop の幅 */
  @supports (width: 1cqw) {
    .p-lhero--shop {
      container-type: inline-size;
    }

    .p-lhero--shop .p-lhero__photo {
      max-height: none;
      aspect-ratio: auto;
      height: min(568px, calc((100cqw - max(33.33cqw + 83px, 539px)) * 550 / 880));
    }
  }

  /* 全スライド共通：枠いっぱいに object-fit: cover・中央基準（上下を均等に切り取る。縦横比は維持） */
  .p-lhero--shop .c-slideshow__item .c-crop img {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .p-lhero__kakomi--shop {
    width: 660px;
    margin-top: 151px;
    padding: 53px 40px 72px 47px;
  }

  .p-shop-intro__name {
    font-size: 32px; /* デザイナー指示（2026-10-20）：36px だと画面幅によって写真の下に隠れるため */
  }

  .p-shop-intro__text {
    width: 480px;
    margin: 29px 0 0 43px;
    font-size: 18px;
    line-height: 32px;
  }

  /* ご挨拶：左に見出し、右に本文（コンテナ1000px内：左余白90 / 見出し224 / 間29 / 本文657） */
  .p-shop-greeting {
    display: grid;
    grid-template-columns: 224px minmax(0, 657px);
    column-gap: 29px;
    width: min(1000px, calc(100% - 40px));
    margin-top: 94px;
    padding-left: 90px;
  }

  .p-shop-greeting__text {
    margin: 0;
    font-size: 18px;
    line-height: 32px;
  }

  .p-shop-greeting__dots {
    grid-column: 1 / -1;
    margin: 41px 0 0 calc(44.1% - 90px);
  }

  .p-shop-info {
    width: min(1000px, calc(100% - 40px));
    margin-top: 56px;
  }

  .p-shop-info--access {
    margin-top: 84px;
  }

  .p-shop-info__list {
    gap: 32px;
    max-width: 800px;
    margin: 55px 0 0 90px;
  }

  .p-shop-info__row {
    display: grid;
    grid-template-columns: 136px minmax(0, 1fr);
    padding-bottom: 30px;
    font-size: 18px;
    line-height: 30px;
  }

  .p-shop-info__row dt,
  .p-shop-info__row h3 {
    font-size: 18px;
    line-height: 32px;
  }

  .p-shop-info__row dd {
    margin: 0;
  }

  .p-shop-info__row--amenity {
    padding-bottom: 39px;
  }

  .p-shop-info__row--amenity dd {
    margin: 0;
  }

  .p-shop-info--access .p-shop-info__list {
    gap: 40px;
  }

  /* アクセス：見出しは全幅、本文は右列 */
  .p-shop-info__row--route {
    padding-bottom: 40px;
  }

  .p-shop-info__row--route h3 {
    grid-column: 1 / -1;
  }

  .p-shop-info__row--route p {
    grid-column: 2;
  }

  .p-shop-info__row--route p:first-of-type {
    margin-top: 19px;
  }

  .p-shop-amenity {
    grid-template-columns: repeat(auto-fill, 52px);
    gap: 16px;
  }

  .p-shop-amenity img {
    width: 52px;
    height: 78px;
  }

  /* PC：最大幅1000px・Figma 1000×625 の比率 */
  .p-shop-map {
    width: min(1000px, calc(100% - 40px));
    margin: 84px auto 134px;
  }

  .p-shop-map__frame {
    aspect-ratio: 1000 / 625;
  }

  .p-shop-map__link {
    margin: 12px 0 0;
  }
}

/* ==========================================================================
   ルネチェア（/rena_chair）
   SP: Figma sp_ルネチェア 28127:3070（390px基準）
   PC: Figma なし。上部＝フェイシャル詳細と同じ（見出しはコースページの仕様）、
       キャッチ〜効果・特徴〜料金＝中央1列（p-ldetail と同じ本文幅600px）
   ========================================================================== */

/* ---------- 上部 ---------- */
/* 蔦：Figma どおり少し小さく（右 205×154 / 左 回転後 219×199） */
.p-lhero--rena .p-lhero__ivy--r {
  right: -1px;
  width: 205px;
  height: 154px;
  background-size: 275.1px 198.4px;
  background-position: -0.2px -44.4px;
}

.p-lhero--rena .p-lhero__ivy--l {
  top: 325px;
  left: 9px;
  width: 199px;
  height: 219px;
  background-size: 199px 274.6px;
  background-position: 0 -55.4px;
}

/* 写真（Figma 333×234・左側角丸15） */
.p-lhero--rena .p-lhero__photo {
  width: min(calc(100% - 58px), 640px);
  aspect-ratio: 333 / 234;
}

/* おすすめの囲み（Figma 299×406・右側角丸15。写真の下に56px重なる） */
.p-lhero__kakomi--rena {
  width: min(299px, calc(100% - 40px));
  margin-top: -56px;
  padding: 86px 31px 47px 35px;
}

/* ---------- キャッチ・本文 ---------- */
.p-ldetail--rena {
  margin-top: 42px;
}

.p-ldetail--rena .p-ldetail__catch {
  width: min(calc(100% - 70px), 600px);
  font-size: 22px;
  line-height: 30px;
}

.p-ldetail--rena .p-ldetail__text {
  margin-top: 36px;
}

.p-ldetail__dots {
  margin-top: 45px;
}

/* ---------- 効果・特徴／料金 ---------- */
.p-rena-effect {
  --rena-col: min(calc(100% - 70px), 600px);
  position: relative;
  isolation: isolate; /* パネル・蔦（z-index: -1）をこのセクションの中で本文の背面に描く */
  margin-top: 35px;
  padding-bottom: 56px;
  overflow: hidden;
  overflow: clip;
}

/* ベージュのパネル：本文の左端から48px右〜画面右端、左側角丸20（ラベルの12px下から） */
.p-rena-effect::before {
  content: "";
  position: absolute;
  top: 12px;
  bottom: 0;
  left: calc((100% - var(--rena-col)) / 2 + 48px);
  right: 0;
  z-index: -1;
  border-radius: 20px 0 0 20px;
  background: var(--c-beige-bg);
}

/* 白い蔦（TOP コース欄と同じ SVG を回転） */
.p-rena-effect__ivy {
  position: absolute;
  z-index: -1;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}

.p-rena-effect__ivy--1 {
  top: calc(319.5px - 217.5px);
  left: calc((100% - var(--rena-col)) / 2 - 35px + 172.5px - 300.5px);
  width: 601px;
  height: 435px;
  background-image: url("../assets/svg/ivy_03_wht.svg");
  rotate: -70deg;
}

.p-rena-effect__ivy--2 {
  top: calc(1029px - 300.5px);
  left: calc((100% - var(--rena-col)) / 2 - 35px + 210.5px - 217.5px);
  width: 435px;
  height: 601px;
  background-image: url("../assets/svg/ivy_02_wht.svg");
  rotate: -35deg;
}

.p-rena-effect__inner {
  position: relative;
  width: var(--rena-col);
  margin: 0 auto;
}

.p-rena-effect__list {
  display: grid;
  gap: 43px;
  margin: 43px 9px 0 0; /* Figma：線 311px・本文 306px */
}

.p-rena-effect__ttl {
  padding-bottom: 14px;
  border-bottom: 1px solid var(--c-text);
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
}

.p-rena-effect__text {
  margin: 14px 5px 0 0;
  text-align: justify;
}

/* 料金：見出し・下線は c-price と共通。行は「初回トライアル」のラベル＋時間（右揃え）／金額（右揃え） */
.p-rena-price {
  margin-top: 54px;
}

.p-rena-price__rows {
  display: grid;
  gap: 13px;
  margin: 19px 0 0;
}

.p-rena-price__row {
  display: grid;
  grid-template-columns: 153px minmax(0, 1fr);
  align-items: baseline;
  font-size: 20px;
  line-height: 28px;
  text-align: right;
  white-space: nowrap;
}

.p-rena-price__row dt,
.p-rena-price__row dd {
  margin: 0;
}

.p-rena-price__row small {
  font-size: 12px;
  line-height: 1;
}

.p-rena-price__label {
  margin-right: 0.25em;
  font-size: 16px;
}

.p-rena-price__img {
  margin-top: 21px;
}

/* ---------- オプションメニューへの誘導 ---------- */
.p-rena-others {
  width: min(calc(100% - 84px), 600px);
  margin: 55px auto 0;
  padding-bottom: 94px;
}

.p-rena-others__text {
  margin-top: 32px;
  text-align: justify;
}

.p-rena-others__btn {
  margin: 39px auto 0;
}

@media (min-width: 990px) {
  .p-lhero--rena {
    --lh-ivy-top: 559px;
  }

  .p-lhero--rena .p-lhero__ivy--r {
    left: 312px;
    right: auto;
    width: 559px;
    height: 244px;
    background-size: 560px 403.8px;
    background-position: -0.7px -159.4px;
  }

  .p-lhero--rena .p-lhero__ivy--l {
    top: calc(var(--lh-ivy-top) - 35px);
    left: 35px;
    width: 404px;
    height: 474px;
    background-size: 404.4px 558.7px;
    background-position: 0 -84.66px;
  }

  .p-lhero--rena .p-lhero__photo {
    width: auto;
    aspect-ratio: 877 / 550;
  }

  .p-lhero__kakomi--rena {
    width: 660px;
    margin-top: 63px; /* 見出しの下から。ボディコース・施術詳細と同じ */
    padding: 48px 40px 43px 47px;
  }

  .p-ldetail--rena {
    margin-top: 110px;
  }

  .p-ldetail--rena .p-ldetail__catch {
    width: min(600px, calc(100% - 40px));
    font-size: 24px;
    line-height: 38px;
  }

  .p-ldetail--rena .p-ldetail__text {
    margin-top: 40px;
  }

  .p-ldetail__dots {
    margin-top: 56px;
  }

  .p-rena-effect {
    --rena-col: min(600px, calc(100% - 40px));
    margin-top: 56px;
    padding-bottom: 80px;
  }

  .p-rena-effect__list {
    gap: 56px;
    margin: 55px 0 0;
  }

  .p-rena-effect__ttl {
    padding-bottom: 16px;
    font-size: 20px;
    line-height: 30px;
  }

  .p-rena-effect__text {
    margin: 20px 0 0;
  }

  .p-rena-price {
    margin-top: 80px;
  }

  .p-rena-price__rows {
    gap: 23px;
    margin-top: 18px;
    padding-right: 20px;
  }

  .p-rena-price__row {
    grid-template-columns: 300px minmax(0, 1fr);
  }

  .p-rena-price__img {
    margin-top: 28px;
    aspect-ratio: 320 / 200;
  }

  .p-rena-others {
    margin-top: 80px;
    padding-bottom: 120px;
  }

  .p-rena-others__text {
    margin-top: 40px;
  }

  .p-rena-others__btn {
    margin-top: 56px;
  }
}

/* ==========================================================================
   オプションメニュー（/option_menu）
   SP: Figma sp_option 28127:828（390px基準）。SP ヘッダーは Figma どおり白帯あり（お問い合わせと同じ）
   PC: Figma なし。リンパマッサージ PC を参考に、上部＝リンパと同じ、各ブロック＝リンパのオプション欄と同じ2列（見出しは追従）
   body.is-lower.is-option
   ========================================================================== */

/* ---------- 上部（見出し・ページ内リンクはリンパと同じ。動画の代わりに写真） ---------- */
.p-lhero--option .p-lhero__photo {
  width: min(calc(100% - 40px), 640px);
  aspect-ratio: 349.47 / 256.34;
}

/* ---------- オプション一覧（ベージュの帯に4ブロック） ---------- */
.p-optmenu {
  margin-top: 77px;
  padding: 34px 0 62px;
  background: var(--c-beige-bg);
}

.p-lsec.p-lsec--optmenu {
  padding: 54px 0 0;
}

.p-lsec.p-lsec--optmenu:first-child {
  padding-top: 0;
}

/* 小見出しの日本語：Figma の字詰め −5% */
.c-ltitle--tight .c-ltitle__ja {
  letter-spacing: -0.05em;
}

.p-lsec--optmenu .p-lsec__list {
  margin-top: 46px;
}

.p-lsec--optmenu .c-price-list {
  --price-gap: 40px;
}

.p-lsec--optmenu .c-price-list--machine {
  --price-gap: 45px;
}

.p-lsec--optmenu .c-price__img {
  margin-top: 20px;
}

.p-lsec--optmenu .p-lsec__note {
  margin-top: 53px;
}

.p-lsec--optmenu .p-lsec__note {
  width: min(calc(100% - 84px), 600px); /* Figma：注記の幅306px */
}

.p-lsec--optmenu .p-lsec__note p {
  margin-top: 52px;
}

/* 料金の見出しの補足（Figma：14px） */
.c-price__ttl-sub {
  font-size: 14px;
}

/* SP：白帯ヘッダー（78px・固定）の下に見出しが来るよう、ページ内リンクの移動先に余白（PC は共通の85px）。
   下層ページ共通（リンパ・フェイシャルのページ内ボタンも同じ） */
@media (max-width: 989.98px) {
  .is-lower [id] {
    scroll-margin-top: 78px;
  }

  /* 最初のブロックは上の余白がないため、帯の上余白（34px）分を足して他のブロックと同じ見え方に */
  .is-option #massage {
    scroll-margin-top: 112px;
  }
}

@media (min-width: 990px) {
  .is-option #massage {
    scroll-margin-top: calc(var(--header-h) + 84px);
  }
}

/* ---------- その他のメニュー ---------- */
.p-lother.p-lother--optmenu {
  padding: 55px 0 99px;
}

@media (min-width: 990px) {
  .p-lhero--option .p-lhero__photo {
    width: auto;
    aspect-ratio: 877 / 550;
  }

  .p-optmenu {
    margin-top: 170px;
    padding: 84px 0 107px;
  }

  .p-lsec.p-lsec--optmenu {
    padding: 100px 0 0;
  }

  .p-lsec--optmenu .p-lsec__list {
    margin-top: 149px; /* リンパのオプション欄と同じ（見出しの行92px＋57px） */
  }

  .p-lsec--optmenu .c-price-list,
  .p-lsec--optmenu .c-price-list--machine {
    --price-gap: 80px;
  }

  .p-lsec--optmenu .c-price__img {
    margin-top: 28px;
  }

  .p-lsec--optmenu .p-lsec__note {
    width: auto;
    margin-top: 56px;
  }

  .p-lsec--optmenu .p-lsec__note p {
    margin-top: 40px;
  }

  .p-lother.p-lother--optmenu {
    padding: 85px 0 120px;
  }
}