/* ==========================================================================
   萱島くすのき整体院 common.css（Figma HkvKhn0tCN81aZWkdxWAG7 準拠）

   ■ 単位: すべて Figma px × var(--p)  例) font-size: calc(40 * var(--p));
       ≥1280px: 1px / 768–1279px: 100vw/1280 / ≤767px: 100vw/402（SP値は402幅基準）

   ■ トークン（:root）
     色   --c-green #539D56 / --c-green-dark #307645 / --c-green-deep #085333
          --c-green-light #A7DDAA / --c-green-bright #6CCB70（ナビ開状態）/ --c-sage #CEDAC4 / --c-pale-1 #F4F9F0 / --c-pale-2 #EAEFE6
          --c-pale-3 #CDDAC3 / --c-text #373737 / --c-gray #7C7777 / --c-gray-light #B1ABAB
          --c-orange #E89534（CTA）/ --c-accent #FF6C00（強調文字）/ --c-red #E00101
          --c-line #0CC755 / --c-gold #D4A041 / --c-gold-dark #91671A / --c-marker rgba(253,255,146,.64)
          --c-bg-1 #F5F5F5 / --c-bg-2 #F7F7F7 / --c-bg-3 #FAFBFA / --c-white #FFF
     書体 --ff-maru（Zen Maru Gothic, body既定）/ --ff-sen（"Sen","Zen Maru Gothic": 数字・英字。和文は Zen Maru Gothic で表示）
          --ff-noto（旧: Noto Sans JP → Zen Maru Gothic に統一）/ --ff-mincho（Shippori Mincho）
     アニメ --t: 180ms ease（hover の transition に使う）

   ■ 共通クラス
     .l-inner          1280基準の中央コンテナ（width 1280*p, position:relative）。中の要素は Figma x 座標で余白を取る
     .u-pc / .u-sp     PC(≥768)のみ表示 / SP(≤767)のみ表示（<br class="u-sp"> 等にも可）
     .u-vh             視覚的に隠す（スクリーンリーダー用テキスト）
     .skip-link        本文へスキップ（skeleton で使用済み）
     .c-eyebrow        セクション英字ラベル（Sen Medium 14px, lh normal, 色は親から継承。SP 12px）
                       例: <p class="c-eyebrow">FROW</p> 位置・色はセクション側で指定
     .c-btn-outline    枠線矢印ボタン（透明bg / 2px #539D56 / radius30 / 高さ46 / Zen Maru Bold 15 緑 / 右矢印）
                       <a class="c-btn-outline" href="/voice/">お客様の声をもっと見る<img class="c-btn-outline__icon" src="/assets/img/top/00-arrow-right.svg" width="15" height="15" alt=""></a>
                       幅は既定 min-width 220（左右 padding 18）。Figma で幅が違うボタンはセクション側で width を指定。hover=緑塗り白文字
     .c-cta3           予約CTA 3連（PC: WEB予約 325 / 電話 414 / LINE予約 326 × 高さ86・角丸20・文字40、gap20、幅1105 中央寄せ）
                       SP: WEB / LINE / 電話 の順に 108×58・文字24・gap6（SP FV と同形）。マークアップは下記をコピー:
       <ul class="c-cta3">
         <li><a class="c-cta3__btn c-cta3__btn--web" href="/contact/">WEB<span class="u-pc">予約</span></a></li>
         <li><a class="c-cta3__btn c-cta3__btn--tel" href="tel:0728132361" aria-label="電話する 072-813-2361"><span class="u-pc">072-813-2361</span><span class="u-sp">電話</span></a></li>
         <li><a class="c-cta3__btn c-cta3__btn--line" href="https://line.me/R/ti/p/%40amf7466k" target="_blank" rel="noopener">LINE<span class="u-pc">予約</span></a></li>
       </ul>
                       ※位置（上下余白）はセクション側で margin 指定。.c-cta3 自体は中央寄せ済み
     .l-header / .l-spmenu / .l-footer   サイト共通ヘッダー・SPメニュー・フッター（skeleton.html）

   ■ JS（common.js）
     SPメニュー: .l-header__toggle（aria-controls="sp-menu"）で #sp-menu（暗幕＋右ドロワー）を開く。
       [data-spmenu-close]（暗幕・×）/ Esc / リンククリックで閉じる。スクロールロック・フォーカストラップ
       [data-spmenu-group] の ▼ ボタンでサブ項目を開閉（初期=開）
     PCドロップダウン: [data-dropdown]（.l-header__dd）。:hover / キーボードフォーカスで開く（CSS）。
       JS: aria-expanded 同期、▼ボタンのクリック開閉、タッチ端末は1回目のタップで開き2回目で遷移、Esc/外側タップで閉じる
     アコーディオン: [data-accordion] > button[data-accordion-trigger] + [data-accordion-panel]、アイコン [data-accordion-icon]
       初期は閉（panel に hidden を付けておく。JS で ＋/− と aria-expanded を切替）
       <div data-accordion><button type="button" data-accordion-trigger aria-expanded="false">Q…<span data-accordion-icon aria-hidden="true">＋</span></button>
         <div data-accordion-panel hidden>A…</div></div>
   ========================================================================== */

:root {
  --c-green: #539D56;
  --c-green-dark: #307645;
  --c-green-deep: #085333;
  --c-green-light: #A7DDAA;
  --c-green-bright: #6CCB70;
  --c-sage: #CEDAC4;
  --c-pale-1: #F4F9F0;
  --c-pale-2: #EAEFE6;
  --c-pale-3: #CDDAC3;
  --c-text: #373737;
  --c-gray: #7C7777;
  --c-gray-light: #B1ABAB;
  --c-orange: #E89534;
  --c-accent: #FF6C00;
  --c-red: #E00101;
  --c-line: #0CC755;
  --c-gold: #D4A041;
  --c-gold-dark: #91671A;
  --c-marker: rgba(253, 255, 146, 0.64);
  --c-bg-1: #F5F5F5;
  --c-bg-2: #F7F7F7;
  --c-bg-3: #FAFBFA;
  --c-white: #FFFFFF;

  --ff-maru: "Zen Maru Gothic", sans-serif;
  --ff-sen: "Sen", "Zen Maru Gothic", sans-serif;
  --ff-noto: "Zen Maru Gothic", sans-serif; /* フォント指定（全体=Zen Maru Gothic）により Noto Sans JP は不使用 */
  --ff-mincho: "Shippori Mincho", serif;

  --t: 180ms ease;
  --p: 1px;
}
@media (max-width: 1279px) { :root { --p: calc(100vw / 1280); } }
@media (max-width: 767px)  { :root { --p: calc(100vw / 402); } }

/* ---------- reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, figure, blockquote { margin: 0; padding: 0; }
ul, ol { list-style: none; }
img, svg, picture, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; }
button:not(:disabled) { cursor: pointer; }
table { border-collapse: collapse; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }

body {
  font-family: var(--ff-maru);
  color: var(--c-text);
  background: var(--c-white);
  line-height: normal;
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
}
html.is-scroll-locked, html.is-scroll-locked body { overflow: hidden; }

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

/* ---------- layout / utility ---------- */
.l-inner { position: relative; width: calc(1280 * var(--p)); margin-inline: auto; }
@media (max-width: 767px) { .l-inner { width: calc(402 * var(--p)); } }

@media (min-width: 768px) { .u-sp { display: none !important; } }
@media (max-width: 767px) { .u-pc { display: none !important; } }
.u-vh {
  position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.skip-link {
  position: absolute; left: 8px; top: -100px; z-index: 1000;
  padding: 8px 16px; background: var(--c-green); color: #fff; font-weight: 700; border-radius: 4px;
}
.skip-link:focus { top: 8px; }

/* ---------- c-eyebrow: 英字ラベル ---------- */
.c-eyebrow {
  font-family: var(--ff-sen);
  font-weight: 500;
  font-size: calc(14 * var(--p));
  line-height: normal;
}
@media (max-width: 767px) { .c-eyebrow { font-size: calc(12 * var(--p)); } }

/* ---------- c-btn-outline: 枠線矢印ボタン ---------- */
.c-btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: calc(5 * var(--p));
  min-width: calc(220 * var(--p));
  height: calc(46 * var(--p));
  padding-inline: calc(18 * var(--p));
  border: calc(2 * var(--p)) solid var(--c-green);
  border-radius: calc(30 * var(--p));
  background: transparent;
  color: var(--c-green);
  font-family: var(--ff-maru);
  font-weight: 700;
  font-size: calc(15 * var(--p));
  line-height: calc(28 * var(--p));
  white-space: nowrap;
  transition: background-color var(--t), color var(--t);
}
.c-btn-outline__icon {
  width: calc(15 * var(--p));
  height: calc(15 * var(--p));
  flex: none;
  transition: transform var(--t), filter var(--t);
}
.c-btn-outline:hover { background: var(--c-green); color: #fff; }
.c-btn-outline:hover .c-btn-outline__icon { filter: brightness(0) invert(1); transform: translateX(calc(3 * var(--p))); }
@media (max-width: 767px) {
  .c-btn-outline { font-size: calc(13 * var(--p)); max-width: 100%; }
}

/* ---------- c-cta3: 予約ボタン3連 ---------- */
.c-cta3 {
  display: flex;
  justify-content: center;
  gap: calc(20 * var(--p));
}
.c-cta3 > li { display: block; }
.c-cta3__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(86 * var(--p));
  border-radius: calc(20 * var(--p));
  font-family: var(--ff-maru);
  font-weight: 700;
  font-size: calc(40 * var(--p));
  line-height: normal;
  color: #fff;
  white-space: nowrap;
  transition: background-color var(--t), color var(--t), opacity var(--t), transform var(--t);
}
.c-cta3__btn--web { width: calc(325 * var(--p)); background: #fff; border: calc(3 * var(--p)) solid var(--c-orange); color: var(--c-orange); }
.c-cta3__btn--tel { width: calc(414 * var(--p)); background: var(--c-orange); font-family: var(--ff-sen); font-weight: 600; }
.c-cta3__btn--line { width: calc(326 * var(--p)); background: var(--c-line); }
.c-cta3__btn--web:hover { background: var(--c-orange); color: #fff; }
.c-cta3__btn--tel:hover, .c-cta3__btn--line:hover { opacity: .8; }
@media (max-width: 767px) {
  .c-cta3 { gap: calc(6 * var(--p)); }
  .c-cta3 > li:nth-child(2) { order: 3; }
  .c-cta3__btn { width: calc(108 * var(--p)) !important; height: calc(58 * var(--p)); font-size: calc(24 * var(--p)); }
}

/* ==========================================================================
   Header (Figma 6:52 / SP 89:38)  ナビ: TDNw6sQDuwOSZlZOVOpVJH（PC ドロップダウン 18:75 / SP メニュー 233:43）
   ========================================================================== */
.l-header { position: relative; z-index: 100; background: #fff; }
.l-header__inner {
  z-index: 101;
  display: flex;
  align-items: flex-start;
  height: calc(99 * var(--p));
  padding-left: calc(54 * var(--p));
}
.l-header__logo { display: block; width: calc(276 * var(--p)); padding-top: calc(26 * var(--p)); transition: opacity var(--t); }
.l-header__logo:hover { opacity: .7; }
.l-header__tagline { display: block; font-size: calc(10 * var(--p)); color: #000; line-height: normal; white-space: nowrap; }
.l-header__name {
  display: block; margin-top: calc(3.5 * var(--p)); margin-left: calc(2 * var(--p));
  font-size: calc(24 * var(--p)); font-weight: 700; color: var(--c-green); line-height: normal; white-space: nowrap;
}
.l-header__nav { margin-left: calc(117 * var(--p)); padding-top: calc(40.5 * var(--p)); }
.l-header__nav > ul { display: flex; gap: calc(31 * var(--p)); }
.l-header__nav > ul > li > a {
  display: flex; align-items: flex-start;
  font-size: calc(15 * var(--p)); font-weight: 700; color: var(--c-green); line-height: normal; white-space: nowrap;
  transition: opacity var(--t), color var(--t);
}
.l-header__nav > ul > li > a:hover { opacity: .6; }
.l-header__nav-arrow {
  position: absolute; inset: 0;
  width: calc(6.41667 * var(--p)); height: calc(10.1249 * var(--p));
  transition: opacity var(--t);
}
.l-header__nav-arrow--active { opacity: 0; }

/* PC ドロップダウン「初めての方へ」（開 = 文字 #6CCB70 + 下線 + 灰色ボックス） */
.l-header__dd { position: relative; display: flex; align-items: flex-start; }
.l-header__nav > ul > li > .l-header__dd-label { padding-left: calc(5 * var(--p)); }
.l-header__dd-toggle {
  position: relative; flex: none;
  width: calc(6.41667 * var(--p)); height: calc(10.1249 * var(--p));
  margin: calc(7 * var(--p)) calc(-2.4 * var(--p)) 0 calc(3 * var(--p));
}
.l-header__dd-toggle::before { content: ""; position: absolute; inset: calc(-12 * var(--p)) calc(-8 * var(--p)); }
.l-header__dd-panel {
  position: absolute; left: 0; top: calc(26.5 * var(--p)); z-index: 1;
  width: calc(104 * var(--p));
  border-top: 1px solid var(--c-green-bright);
  background: var(--c-bg-1);
  opacity: 0; visibility: hidden;
  transition: opacity var(--t), visibility var(--t);
}
.l-header__dd-panel::before { content: ""; position: absolute; left: 0; right: 0; bottom: 100%; height: calc(14 * var(--p)); }
.l-header__dd-panel a {
  display: block; height: calc(40 * var(--p));
  padding: calc(8 * var(--p)) 0 0 calc(11 * var(--p));
  font-size: calc(13 * var(--p)); font-weight: 700; color: var(--c-green); line-height: normal; white-space: nowrap;
  transition: opacity var(--t);
}
.l-header__dd-panel a:hover { opacity: .6; }
.l-header__dd:hover > .l-header__dd-label,
.l-header__dd.is-open > .l-header__dd-label,
.l-header__dd:not(.is-dismissed):has(:focus-visible) > .l-header__dd-label { color: var(--c-green-bright); opacity: 1; }
.l-header__dd:hover .l-header__nav-arrow--active,
.l-header__dd.is-open .l-header__nav-arrow--active,
.l-header__dd:not(.is-dismissed):has(:focus-visible) .l-header__nav-arrow--active { opacity: 1; }
.l-header__dd:hover .l-header__dd-panel,
.l-header__dd.is-open .l-header__dd-panel,
.l-header__dd:not(.is-dismissed):has(:focus-visible) .l-header__dd-panel { opacity: 1; visibility: visible; }
@supports not selector(:has(a)) {
  .l-header__dd:focus-within > .l-header__dd-label { color: var(--c-green-bright); }
  .l-header__dd:focus-within .l-header__nav-arrow--active { opacity: 1; }
  .l-header__dd:focus-within .l-header__dd-panel { opacity: 1; visibility: visible; }
}

.l-header__cta { display: flex; gap: calc(5 * var(--p)); margin-left: calc(42 * var(--p)); padding-top: calc(34 * var(--p)); }
.l-header__cta a {
  display: flex; align-items: center; justify-content: center;
  height: calc(38 * var(--p)); border-radius: calc(20 * var(--p));
  font-size: calc(16 * var(--p)); font-weight: 700; line-height: normal; color: #fff; white-space: nowrap;
  transition: background-color var(--t), color var(--t), opacity var(--t);
}
.l-header__cta-tel { width: calc(132 * var(--p)); background: var(--c-orange); font-family: var(--ff-sen); font-weight: 600 !important; }
.l-header__cta-web { width: calc(117 * var(--p)); background: #fff; border: calc(3 * var(--p)) solid var(--c-orange); color: var(--c-orange) !important; }
.l-header__cta-line { width: calc(121 * var(--p)); background: var(--c-line); }
.l-header__cta-tel:hover, .l-header__cta-line:hover { opacity: .8; }
.l-header__cta-web:hover { background: var(--c-orange); color: #fff !important; }
.l-header__toggle { display: none; }

@media (max-width: 767px) {
  .l-header__inner { height: calc(69 * var(--p)); padding-left: calc(33 * var(--p)); justify-content: space-between; }
  .l-header__logo { width: auto; padding-top: calc(17 * var(--p)); }
  .l-header__name { margin: calc(0.5 * var(--p)) 0 0; font-size: calc(15 * var(--p)); }
  .l-header__nav, .l-header__cta { display: none; }
  .l-header__toggle {
    display: grid; place-items: center;
    width: calc(48 * var(--p)); height: calc(48 * var(--p));
    margin: calc(8 * var(--p)) calc(21 * var(--p)) 0 0;
  }
  .l-header__toggle img { width: calc(24 * var(--p)); height: calc(24 * var(--p)); }
}

/* SP メニュー（Figma 233:43）: 暗幕 + 右からのドロワー 261/402 */
.l-spmenu { position: fixed; inset: 0; z-index: 200; }
.l-spmenu[hidden] { display: none; }
.l-spmenu__overlay { position: absolute; inset: 0; background: rgba(55, 55, 55, .76); animation: spmenu-fade 200ms ease; }
.l-spmenu__drawer {
  position: absolute; top: 0; right: 0; bottom: 0;
  width: calc(261 * var(--p));
  padding: calc(91 * var(--p)) 0 calc(48 * var(--p)) calc(43 * var(--p));
  background: #fff;
  overflow-y: auto; overscroll-behavior: contain; outline: none;
  animation: spmenu-slide 220ms ease;
}
@keyframes spmenu-fade { from { opacity: 0; } }
@keyframes spmenu-slide { from { transform: translateX(100%); } }
@media (prefers-reduced-motion: reduce) { .l-spmenu__overlay, .l-spmenu__drawer { animation: none; } }
.l-spmenu__close {
  position: absolute; top: calc(9 * var(--p)); right: calc(19 * var(--p));
  display: grid; place-items: center;
  width: calc(48 * var(--p)); height: calc(48 * var(--p));
  transition: opacity var(--t);
}
.l-spmenu__close img { width: calc(18.18 * var(--p)); height: calc(18.18 * var(--p)); }
.l-spmenu__close:hover { opacity: .6; }
.l-spmenu__nav a {
  display: block;
  font-size: calc(18 * var(--p)); font-weight: 700; color: var(--c-green); line-height: normal; white-space: nowrap;
  transition: opacity var(--t), color var(--t);
}
.l-spmenu__nav a:hover { opacity: .6; }
.l-spmenu__nav > ul > li:not(.l-spmenu__group) > a { height: calc(40 * var(--p)); padding-left: calc(3 * var(--p)); }
.l-spmenu__group { margin-bottom: calc(18 * var(--p)); }
.l-spmenu__group-head {
  position: relative;
  width: calc(128 * var(--p)); height: calc(29 * var(--p));
  border-bottom: 1px solid transparent;
  transition: border-color var(--t);
}
.l-spmenu__group-head > a { display: inline-block; padding-left: calc(3 * var(--p)); }
.l-spmenu__group-toggle {
  position: absolute; left: calc(122 * var(--p)); top: calc(8 * var(--p));
  width: calc(6.41667 * var(--p)); height: calc(10.1249 * var(--p));
  transform: rotate(-90deg);
  transition: transform var(--t);
}
.l-spmenu__group-toggle::before { content: ""; position: absolute; inset: calc(-17 * var(--p)); }
.l-spmenu__arrow {
  position: absolute; inset: 0;
  width: calc(6.41667 * var(--p)); height: calc(10.1249 * var(--p));
  transition: opacity var(--t);
}
.l-spmenu__arrow--active { opacity: 0; }
.l-spmenu__group.is-open .l-spmenu__group-head { border-bottom-color: var(--c-green-bright); }
.l-spmenu__group.is-open .l-spmenu__group-head > a { color: var(--c-green-bright); }
.l-spmenu__group.is-open .l-spmenu__group-toggle { transform: none; }
.l-spmenu__group.is-open .l-spmenu__arrow--active { opacity: 1; }
.l-spmenu__sub { width: calc(128 * var(--p)); background: var(--c-bg-1); }
.l-spmenu__sub[hidden] { display: none; }
.l-spmenu__sub a { height: calc(35 * var(--p)); padding: calc(5 * var(--p)) 0 0 calc(10 * var(--p)); font-size: calc(15 * var(--p)); }
.l-spmenu__cta {
  display: flex; flex-direction: column; align-items: flex-end; gap: calc(17 * var(--p));
  width: calc(136 * var(--p)); margin-top: calc(63 * var(--p));
}
.l-spmenu__btn {
  display: flex; align-items: center; justify-content: center;
  height: calc(58 * var(--p)); border-radius: calc(20 * var(--p));
  font-weight: 700; font-size: calc(24 * var(--p)); line-height: normal; color: #fff; white-space: nowrap;
  transition: background-color var(--t), color var(--t), opacity var(--t);
}
.l-spmenu__btn--web { width: calc(133 * var(--p)); background: #fff; border: calc(3 * var(--p)) solid var(--c-orange); color: var(--c-orange); }
.l-spmenu__btn--line { width: calc(131 * var(--p)); background: var(--c-line); }
.l-spmenu__btn--tel { width: calc(127 * var(--p)); height: calc(60 * var(--p)); background: var(--c-orange); font-family: var(--ff-sen); font-weight: 600; }
.l-spmenu__btn--web:hover { background: var(--c-orange); color: #fff; }
.l-spmenu__btn--line:hover, .l-spmenu__btn--tel:hover { opacity: .8; }
@media (min-width: 768px) { .l-spmenu { display: none !important; } }

/* ==========================================================================
   Footer (Figma 84:231)
   ========================================================================== */
.l-footer { background: var(--c-green); color: #fff; }
.l-footer__inner { padding: calc(48 * var(--p)) calc(85 * var(--p)) calc(25 * var(--p)); }
.l-footer__top { display: flex; align-items: flex-start; }
.l-footer__brand { width: calc(526 * var(--p)); flex: none; }
.l-footer__tagline { display: block; font-size: calc(10 * var(--p)); line-height: normal; white-space: nowrap; }
.l-footer__name { display: block; margin-top: calc(-2.5 * var(--p)); font-size: calc(24 * var(--p)); font-weight: 700; line-height: normal; white-space: nowrap; }
.l-footer__logo { display: block; width: max-content; transition: opacity var(--t); }
.l-footer__logo:hover { opacity: .7; }
.l-footer__info {
  height: calc(184 * var(--p));
  margin-top: calc(41 * var(--p));
  padding: calc(22 * var(--p)) 0 0 calc(31 * var(--p));
  border: 1px solid #fff;
  font-size: calc(15 * var(--p));
  line-height: normal;
}
.l-footer__row { display: flex; }
.l-footer__row + .l-footer__row { margin-top: calc(30.3 * var(--p)); }
.l-footer__row:nth-child(3) { margin-top: calc(38.3 * var(--p)); }
.l-footer__row dt { width: calc(88 * var(--p)); flex: none; font-weight: 700; }
.l-footer__row dd { font-weight: 400; white-space: nowrap; }
.l-footer__row--addr dd { margin-top: calc(-2 * var(--p)); margin-left: calc(-3 * var(--p)); }
.l-footer__row--tel dd { margin-left: calc(1 * var(--p)); }
.l-footer__row--hours dd { margin-top: calc(-1 * var(--p)); }
.l-footer__tel { text-decoration: underline; text-underline-position: from-font; transition: opacity var(--t); }
.l-footer__tel:hover { opacity: .7; }
.l-footer__nav { font-size: calc(15 * var(--p)); line-height: normal; white-space: nowrap; }
.l-footer__nav--1 { margin-left: calc(110 * var(--p)); padding-top: calc(12 * var(--p)); width: calc(258 * var(--p)); }
.l-footer__nav--2 { padding-top: calc(15 * var(--p)); }
.l-footer__nav-title { font-weight: 700; }
.l-footer__nav ul { margin-top: calc(14 * var(--p)); margin-left: calc(1 * var(--p)); }
.l-footer__nav--2 ul { margin-left: calc(2 * var(--p)); }
.l-footer__nav li + li { margin-top: calc(13 * var(--p)); }
.l-footer__nav a { transition: opacity var(--t); }
.l-footer__nav a:hover { opacity: .7; text-decoration: underline; }
.l-footer__copy {
  margin-top: calc(36 * var(--p));
  text-align: center; font-size: calc(15 * var(--p)); font-weight: 700; line-height: normal;
}
.l-footer__copy a { text-decoration: underline; text-underline-position: from-font; text-decoration-skip-ink: none; transition: opacity var(--t); }
.l-footer__copy a:hover { opacity: .7; }

@media (max-width: 767px) {
  .l-footer__inner { padding: calc(40 * var(--p)) calc(33 * var(--p)) calc(24 * var(--p)); }
  .l-footer__top { flex-wrap: wrap; }
  .l-footer__brand { width: 100%; }
  .l-footer__name { margin-top: 0; font-size: calc(20 * var(--p)); }
  .l-footer__info { height: auto; margin-top: calc(24 * var(--p)); padding: calc(20 * var(--p)) calc(18 * var(--p)); font-size: calc(13 * var(--p)); }
  .l-footer__row { flex-direction: column; }
  .l-footer__row + .l-footer__row, .l-footer__row:nth-child(3) { margin-top: calc(14 * var(--p)); }
  .l-footer__row dt { width: auto; margin-bottom: calc(2 * var(--p)); }
  .l-footer__row dd { margin: 0 !important; white-space: normal; }
  .l-footer__nav { width: 50% !important; margin: calc(28 * var(--p)) 0 0 !important; padding: 0 !important; font-size: calc(13 * var(--p)); white-space: normal; }
  .l-footer__nav--1 { width: 58% !important; }
  .l-footer__nav--2 { width: 42% !important; }
  .l-footer__nav ul { margin-top: calc(12 * var(--p)); }
  .l-footer__nav li + li { margin-top: calc(10 * var(--p)); }
  .l-footer__copy { margin-top: calc(32 * var(--p)); font-size: calc(11 * var(--p)); }
  .l-footer__copy a { display: inline-block; margin-bottom: calc(6 * var(--p)); font-size: calc(12 * var(--p)); }
}
.l-footer__copy small { font-size: inherit; }

/* ---------- l-fixcta: SP 画面下部に固定する予約ボタン3つ（SP FV の CTA と同形）----------
   ページ内の .c-cta3（FV・最終CTA など）が画面に見えている間は重複を避けて隠す（common.js） */
.l-fixcta { display: none; }
@media (max-width: 767px) {
  body { padding-bottom: calc(74 * var(--p) + env(safe-area-inset-bottom)); }
  .l-fixcta {
    display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 150;
    padding: calc(8 * var(--p)) 0 calc(8 * var(--p) + env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, .96); box-shadow: 0 calc(-4 * var(--p)) calc(12 * var(--p)) rgba(0, 0, 0, .1);
    transition: transform var(--t), visibility var(--t);
  }
  .l-fixcta.is-hidden { transform: translateY(110%); visibility: hidden; }
}
@media (max-width: 767px) and (prefers-reduced-motion: reduce) { .l-fixcta { transition: none; } }