@charset "UTF-8";
/* ==========================================================================
   共通スタイル
   出典: Figma TOP_デザイン案2_修正3（実測値は各コンポーネントのコメント参照）
   ========================================================================== */
/* --- ベース --- */
body {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: clamp(14px, 13.2571428571px + 0.1904761905vw, 16px);
  line-height: 1.7;
  letter-spacing: 0.03em;
  color: #333333;
}

/* SPの既定字間はFigma SP実測にあわせ0（SP全ノードの約9割がls=0・全数照合2026-08-28）。
   PC側は0.03em前提のデザインのためこのメディアクエリ外に出さないこと
   （$letter-spacing-base自体を0にするとPC全22ページが崩れる＝実測済み）。
   個別にletter-spacingを明示しているセレクタ（実測0.29px群など）は継承外＝影響なし */
@media (max-width: 768px) {
  body {
    letter-spacing: 0;
  }
}
a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
}

/* --- レイアウト --- */
.l-main {
  display: block;
  overflow-x: hidden; /* 泡の装飾で横スクロールが出ないように（clip非対応ブラウザ用） */
  overflow-x: clip; /* hiddenだとスクロールコンテナ化し子孫のposition:stickyが効かなくなるためclipを優先 */
}

.l-inner {
  width: min(100% - 40px, 1200px);
  margin-inline: auto;
}

/* ==========================================================================
   c-header  白ピル型バー
   🔒出典を最新世代へ更新（2026-08-10）= 下層 937:1725 header / 937:1726 Header Container
      （保存済み `_figma_json/cloth_pc_meta.xml` のAPI実数値。旧 652:2471 は世代が古く現存しない）
   実測(937:1725): バー X115 **Y19** W1210 H80 / #FFF + シャドウ
                   ロゴ (38,15) 369×55 ／ Menu Container (623,15) 560×50
                   ナビ4項目 x=0/94/156/252 w=64/32/66/64 → **gap30** ／ CTA (334,0) 180×50
                   ハンバーガー (532,15) 28×20 / 線 y=0,9,18（間隔9・線2px）
   バーの塗り = rgba(255,255,255,0.63)（937:1726・2026-08-17 MCP実取得で確認済み）
   ========================================================================== */
.c-header {
  position: absolute;
  top: 19px; /* 最新世代 937:1725 実測（旧世代652:2471は32px・2026-08-10に世代差を解消） */
  left: 0;
  z-index: 100;
  width: 100%;
}

.c-header__bar {
  display: flex;
  align-items: center;
  width: min(100% - 40px, 1210px);
  height: 80px;
  margin-inline: auto;
  padding: 0 23px 0 38px; /* 実測: ロゴ左38 / バーガー右23（2026-07-29 PNG実測） */
  background: rgba(255, 255, 255, 0.63);
  border-radius: 63px;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.06);
}

.c-header__logo {
  flex-shrink: 0;
  margin-top: 5px; /* 実測: ロゴはバー中心より2.5px下（y47） */
  line-height: 0;
}

.c-header__logo img {
  width: auto;
  height: 55px; /* 実測: TOP_デザイン案2_修正3のバー内ロゴ表示高（logo-header.png実寸368×55） */
}

.c-header__nav {
  margin-left: auto;
}

.c-header__nav-list {
  display: flex;
  align-items: center;
  gap: 30px; /* 最新世代 937:1729 のAPI実数値（4項目のx差が全て30）。
   2026-07-29にPNG目視で29へ補正していたが、API実数値が正＝30へ戻す */
  list-style: none;
}

.c-header__nav-item a {
  font-size: 16px;
  color: #333333;
  white-space: nowrap;
  transition: color 0.25s ease;
}

.c-header__nav-item a:hover {
  color: #005ca7;
}

.c-header__cta {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 180px; /* 実測 */
  height: 50px; /* 実測 */
  margin-left: 23px; /* 実測: ナビ右端→CTA左端 */
  background: #5fcafd; /* #5FCAFD 実測 */
  border-radius: 999px;
  color: #ffffff;
  font-size: 16px;
  font-weight: 500;
  transition: opacity 0.25s ease;
}

.c-header__cta:hover {
  opacity: 0.85;
}

/* ハンバーガー（デザイン上PCでも表示される） */
.c-header__burger {
  display: grid;
  align-content: space-between;
  flex-shrink: 0;
  width: 28px; /* 実測 */
  height: 20px; /* 実測 */
  margin-left: 19px; /* 実測: CTA右端→バーガー左端 */
  padding: 0;
  background: none;
  border: 0;
  cursor: pointer;
}

.c-header__burger-line {
  display: block;
  width: 100%;
  height: 2px;
  background: #333333;
  border-radius: 2px;
  transition: transform 0.3s ease, opacity 0.2s ease;
}

/* 🔴 2026-08-27 ユーザー指示: 開いている間は三本線のボタン自体を出さない。
   従来は三本線を×へ変形させていたが、ドロワー右上にも閉じる⊗があり**×が2つ見える**状態だった。
   ∴ 閉じる操作はドロワーの⊗（と画面外タップ）に一本化する。 */
.c-header__burger[aria-expanded=true] {
  visibility: hidden;
}

/* 🔒 承認済みデザイン（PC 972:1152 / SP 940:5384「ハンバーガーメニュー」380×605 r16）。
   フッターと同じリンク構成をアコーディオンで出す（6/17「footer同じ」・7/27「アコーディオンタイプ」） */
.c-header__drawer {
  width: min(100% - 40px, 1210px);
  margin: 12px auto 0;
}

.c-header__drawer-panel {
  position: relative;
  padding: 22px 25px 30px;
  border-radius: 16px; /* 実測 940:5384 */
  background: #ffffff;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.08);
}

.c-header__drawer-logo img {
  display: block;
  width: 142px; /* 実測 940:5426: 142×21 */
  height: auto;
}

/* 閉じる⊗（S-68 実測 SP 940:5411: 円33×33 #5FCAFD・×は23×11の浅い角度・白2px・端SQUARE。
   旧: ×が45°の正方形クロス＝デザインと別物） */
.c-header__drawer-close {
  position: absolute;
  top: 16px;
  right: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 33px;
  height: 33px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #5fcafd;
  cursor: pointer;
}

.c-header__drawer-close span {
  position: relative;
  display: block;
  width: 23px;
  height: 11px;
}

.c-header__drawer-close span::before,
.c-header__drawer-close span::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 25px; /* √(23²+11²)＝対角線長 */
  height: 2px;
  background: #ffffff;
  content: "";
}

.c-header__drawer-close span::before {
  transform: translate(-50%, -50%) rotate(25.6deg); /* atan(11/23) */
}

.c-header__drawer-close span::after {
  transform: translate(-50%, -50%) rotate(-25.6deg);
}

.c-header__drawer-groups {
  margin-top: 40px; /* 実測: ロゴ下端43 -> 見出し84 */
}

.c-header__drawer-group + .c-header__drawer-group {
  margin-top: 29px; /* 実測: ご利用案内(411) -> 会社情報(461) の間隔から本文ぶんを引いた値 */
}

/* 見出し（実測 940:5387/5394/5402: #005CA7・サービスのみ20px・他18px） */
.c-header__drawer-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  color: #005ca7;
  font-size: 18px;
  font-weight: 700;
  cursor: pointer;
  text-align: left;
}

.c-header__drawer-group:first-child .c-header__drawer-title {
  font-size: 20px; /* 実測 940:5387 */
}

/* ＋／− トグル（実測 940:5389: 20px円 #5FCAFD） */
.c-header__drawer-toggle {
  position: relative;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #5fcafd;
}

.c-header__drawer-toggle::before,
.c-header__drawer-toggle::after {
  position: absolute;
  top: 50%;
  left: 50%;
  background: #ffffff;
  content: "";
  transform: translate(-50%, -50%);
}

.c-header__drawer-toggle::before {
  width: 10px; /* 実測 940:5391: 横線10px */
  height: 2px;
}

/* 閉じている時だけ縦線を出して＋にする（実測 940:5399: 縦線10px） */
.c-header__drawer-toggle::after {
  width: 2px;
  height: 10px;
}

.c-header__drawer-title[aria-expanded=true] .c-header__drawer-toggle::after {
  display: none;
}

.c-header__drawer-list {
  margin-top: 19px; /* 実測: 見出し(84) -> 1件目(124) から行高ぶんを引いた値 */
  list-style: none;
}

.c-header__drawer-list li + li {
  margin-top: 10px; /* 実測: 33px間隔 − 行高23 */
}

.c-header__drawer-list a,
.c-header__drawer-list span[aria-disabled=true] {
  display: block;
  padding-left: 20px; /* 実測: 見出しx25 -> 子x45 */
  color: #333333;
  font-size: 16px; /* 実測 940:5415 */
}

.c-header__drawer-panel .c-btn-arrow {
  margin-top: 35px; /* 実測: 会社情報(482) -> ボタン(517) */
}

/* 🔒 監査#85: 会社情報・サイトポリシー・バナーは **PC専用**（SPのFigma 940:5384 には無い）。
   既定では出さず、下のPCブロックでだけ出す。 */
.c-header__drawer-company,
.c-header__drawer-policy,
.c-header__drawer-banners {
  display: none;
}

.c-header__drawer[hidden] {
  display: none;
}

/* タブレット帯: ナビはバーガーへ集約（バー内幅が不足するため） */
@media (max-width: 1200px) {
  .c-header__nav {
    display: none;
  }
  .c-header__cta {
    margin-left: auto;
  }
}
@media (max-width: 768px) {
  /* SP実測(TOP_SP): ピルバー無し・白地に直置き・ロゴ(15,9)h25・バーガー(右15,13)28×20 */
  /* 🔴 2026-08-27 ユーザー指示: SPでヘッダー（ハンバーガー）がスクロールに追従していなかった。
     原因は position:absolute＝流れ去る。fixed にして全ページ共通で追従させる。
     c-header.php は全22ページ共通パーツのため、この1箇所で全ページに効く。
     バーは白地に直置き＝スクロールで本文が透けるので、追従時のみ背景を敷く。 */
  .c-header {
    position: fixed;
    top: 0;
  }
  /* 🔴 2026-08-27 ユーザー指示: SPのドロワーは本文の流れに乗っていたため、
     開いたまま画面をスクロールすると**後ろのページが動き**、メニュー下部が画面外に消えていた。
     ∴ 画面いっぱいの固定オーバーレイにして、**メニュー自身がスクロール**するようにする。
     背景の暗幕を兼ね、暗幕（＝パネルの外）を押せば閉じる。 */
  .c-header__drawer {
    position: fixed;
    inset: 0;
    z-index: 90; /* ヘッダー(100)より下＝バーは出したまま */
    width: 100%;
    margin: 0;
    padding: 60px 20px 40px; /* 上はヘッダー48px＋余白 */
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background: rgba(0, 0, 0, 0.4);
    overscroll-behavior: contain; /* 端まで来ても後ろのページへスクロールを渡さない */
  }
  /* 本文側のスクロールを止める（JSが .is-drawer-open を付ける） */
  .is-drawer-open {
    overflow: hidden;
  }
  .c-header__bar {
    width: 100%;
    height: 48px;
    padding: 0 15px;
    /* 🔴 2026-08-28 S-98（ユーザー裁定A）: 既定は**背景なし**。
       Figma SP はヘッダーに背景板が無く、FV右上の小さな泡（y24〜42）が
       ハンバーガーの左隣に見えているのが正。不透明な白を常時敷くと7ページで泡が消える
       （会社概要/羽毛/ハウス/こだわり/お知らせ/料金/採用）。
       ∴ 背景はスクロール後（.is-scrolled）だけ出す＝下の本文が透ける問題も同時に解決。 */
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    transition: background-color 0.2s ease;
  }
  /* スクロール後だけ白背景を敷く（JS: initHeaderScrollBg が .is-scrolled を付与） */
  .c-header.is-scrolled .c-header__bar {
    background: #ffffff;
  }
  /* 動きを減らす設定では色の遷移も行わない */
}
@media (max-width: 768px) and (prefers-reduced-motion: reduce) {
  .c-header__bar {
    transition: none;
  }
}
@media (max-width: 768px) {
  .c-header__logo {
    margin-top: 0;
  }
  .c-header__logo img {
    height: 25px;
  }
}
@media (max-width: 768px) {
  /* SPはナビ・CTAを畳んでハンバーガーへ集約 */
  .c-header__nav,
  .c-header__cta {
    display: none;
  }
  .c-header__burger {
    margin-left: auto;
  }
  .c-header__drawer {
    width: calc(100% - 30px);
    background: #ffffff;
  }
}
/* ==========================================================================
   🔒 監査#85 PCのハンバーガー＝フッター型の全幅オーバーレイ
   出典: Figma `972:1152`「PCハンバーガーメニュー」1440×1036（実測 2026-08-23）
     ロゴ群 x161 y270 w304 ／ リンク3列 x572(144) / x789(144) / x1006(112) ／
     サイトポリシー x1168 y270 16px ／ バナー2枚 x290・x801 y675 478.9×163 ／
     閉じる⊗ x1332 y38 74.8px円
   実装はSPの380幅アコーディオンカードを流用していた（＝#85のズレ）。
   マークアップは共通のまま、PCだけグリッドで組み替える。
   ========================================================================== */
@media (min-width: 769px) {
  .c-header__drawer {
    position: fixed;
    inset: 0;
    z-index: 100;
    width: 100%;
    margin: 0;
    overflow-y: auto;
    background: #ffffff;
  }
  .c-header__drawer-panel {
    display: grid;
    /* 実測の列**開始位置**(161/572/789/1006/1168)をそのまま再現する。
       列幅ではなく「次の列までの距離」で置く＝ 572-161=411 / 789-572=217 / 1006-789=217 /
       1168-1006=162 / 残り。中身より広いので折り返さない。 */
    grid-template-columns: 411fr 217fr 217fr 162fr 272fr;
    align-content: start;
    width: min(100%, 1440px);
    min-height: 100%;
    margin-inline: auto;
    padding: 270px 0 0 161px;
    border-radius: 0;
    box-shadow: none;
  }
  /* ヘッダーの小ロゴはPCオーバーレイでは出さない（Figmaは footer_item 01 の大ロゴ） */
  .c-header__drawer-logo {
    display: none;
  }
  .c-header__drawer-company {
    display: block;
    grid-row: 1;
    grid-column: 1;
  }
  .c-header__drawer-company-logo {
    display: block;
    width: 304px; /* 実測 972:1215 */
    height: auto;
  }
  .c-header__drawer-brands {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-top: 14px; /* 実測: ロゴ下端315 -> ブランド329 */
    list-style: none;
  }
  .c-header__drawer-brands img {
    display: block;
    height: 47px; /* 実測 972:1216-1218 */
    width: auto;
  }
  .c-header__drawer-name {
    margin-top: 30px; /* 実測: ブランド下端376 -> 社名404 */
    color: #333333;
    font-size: 18px;
    font-weight: 700;
  }
  .c-header__drawer-address {
    margin-top: 12px;
    color: #333333;
    font-size: 14px;
    font-style: normal;
    line-height: 1.9;
  }
  .c-header__drawer-sns {
    margin-top: 16px;
    color: #333333;
    font-size: 13px;
  }
  /* リンク3列＝アコーディオンをやめて素の見出し＋リスト（Figmaは常時展開） */
  .c-header__drawer-groups {
    display: contents;
  }
  .c-header__drawer-group {
    grid-row: 1;
    margin-top: 0;
  }
  .c-header__drawer-group + .c-header__drawer-group {
    margin-top: 0;
  }
  .c-header__drawer-group:nth-child(1) {
    grid-column: 2;
  }
  .c-header__drawer-group:nth-child(2) {
    grid-column: 3;
  }
  .c-header__drawer-group:nth-child(3) {
    grid-column: 4;
  }
  .c-header__drawer-title,
  .c-header__drawer-group:first-child .c-header__drawer-title {
    font-size: 18px; /* 実測 972:1157「サービス」等 */
    cursor: default;
    pointer-events: none;
  }
  /* PCは開閉しない＝＋/−トグルは出さない */
  .c-header__drawer-toggle {
    display: none;
  }
  /* hidden 属性が付いていてもPCでは常に開く（Figmaは3列とも展開） */
  .c-header__drawer-list,
  .c-header__drawer-list[hidden] {
    display: block;
    margin-top: 20px;
  }
  /* Figmaは列幅(144)を超えても**1行で置く**（例 972:1167「法人向けクリーニングサービス」w252 h23）。
     改行が要る項目は本文側で <br> を明示している（972:1173「メンバーシステム/ご入会特典」）。 */
  .c-header__drawer-list a,
  .c-header__drawer-list span[aria-disabled=true] {
    padding-left: 0;
    font-size: 16px;
    white-space: nowrap;
  }
  .c-header__drawer-policy {
    display: block;
    grid-row: 1;
    grid-column: 5;
    color: #333333;
    font-size: 16px; /* 実測 972:1182 */
    text-align: left;
  }
  /* お問い合わせボタンはPCオーバーレイでは出さない（Figma 972:1152 に無い） */
  .c-header__drawer-panel .c-btn-arrow {
    display: none;
  }
  .c-header__drawer-banners {
    display: flex;
    grid-row: 2;
    grid-column: 1/-1;
    gap: 32px; /* 実測: 768.9 -> 801 */
    justify-content: center;
    margin-top: 80px; /* 実測: 列下端595 -> バナー675 */
    padding-bottom: 80px;
  }
  .c-header__drawer-banners .c-footer__banner {
    width: 478.9px; /* 実測 972:1198 / 972:1183 */
    max-width: 100%;
  }
  /* 閉じる⊗（Figma実測 972:1224 は 74.8px円・右上 x1332 y38）
     🔴 2026-08-28 ユーザー指示: PCの⊗が大きいため **74.8 → 56px（75%）** へ縮小。
     ×の内寸・線の太さ・角度も**同じ75%**で揃える（形が崩れないよう比率を保つ）。
     位置は右上の見え方を保つため、縮んだぶん top/right を寄せる。 */
  .c-header__drawer-close {
    position: fixed;
    top: 47px; /* 実測38 + 縮小ぶん(74.8-56)/2 ≒ 9 */
    right: 43px; /* 実測34 + 9 */
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #5fcafd;
  }
  /* S-68: ×はPC実測 972:1227/1228: 52×24・白4.5px・端SQUARE。上記の75%で縮小 */
  .c-header__drawer-close span {
    width: 39px; /* 52 × 0.75 */
    height: 18px; /* 24 × 0.75 */
  }
  .c-header__drawer-close span::before,
  .c-header__drawer-close span::after {
    width: 43px; /* √(39²+18²)＝対角線長 */
    height: 3.4px; /* 4.5 × 0.75 */
  }
  .c-header__drawer-close span::before {
    transform: translate(-50%, -50%) rotate(24.8deg); /* atan(24/52) */
  }
  .c-header__drawer-close span::after {
    transform: translate(-50%, -50%) rotate(-24.8deg);
  }
}
/* ==========================================================================
   c-sec-title  英字大見出し＋日本語サブ（頭文字のみアクセント色）
   ========================================================================== */
.c-sec-title {
  margin-bottom: 40px; /* 40px */
}

.c-sec-title--center {
  text-align: center;
}

.c-sec-title__en {
  display: block;
  color: #005ca7;
  font-family: "Buenard", serif;
  font-size: clamp(64px, 56.5714285714px + 1.9047619048vw, 84px); /* 実測: Pick Up見出し PC84px/SP64px（2026-07-29 PNG実測） */
  font-weight: 400; /* 実測: Buenard Regular */
  line-height: 1;
  letter-spacing: 0.02em; /* 実測: 幅272px合わせ */
}

.c-sec-title__en-first {
  color: #5fcafd;
}

.c-sec-title__ja {
  margin-top: 14px;
  color: #333333;
  font-size: clamp(19px, 17.8857142857px + 0.2857142857vw, 22px); /* 実測: サブタイトル PC22px/SP19px */
  font-weight: 500;
}

/* ==========================================================================
   c-btn-arrow  白ピル型 矢印ボタン
   アニメーション指示⑤: ホバーで円が右へスライド
   ========================================================================== */
.c-btn-arrow {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  min-width: 240px;
  padding: 18px 24px 18px 32px;
  background: #ffffff;
  border: 1px solid #5fcafd;
  border-radius: 999px;
  color: #005ca7;
  font-size: 16px;
  font-weight: 500;
  transition: background-color 0.3s ease, color 0.3s ease;
}

.c-btn-arrow__label {
  flex: 1;
}

.c-btn-arrow__icon {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  background: #5fcafd;
  border-radius: 50%;
  color: #ffffff;
  transition: transform 0.3s ease, background-color 0.3s ease, color 0.3s ease;
}

.c-btn-arrow:hover {
  background: #5fcafd;
  color: #ffffff;
}

/* 指示⑤: ホバーで円が右へスライド */
.c-btn-arrow:hover .c-btn-arrow__icon {
  transform: translateX(6px);
  background: #ffffff;
  color: #5fcafd;
}

/* 塗りボタン（modifier） */
.c-btn-arrow--fill {
  background: #5fcafd;
  color: #ffffff;
}

.c-btn-arrow--fill .c-btn-arrow__icon {
  background: #ffffff;
  color: #5fcafd;
}

/* アイコン左配置（Newsの一覧を見る等・実測: 円56px #E1F5FF/矢印紺） */
.c-btn-arrow--icon-left {
  flex-direction: row-reverse;
  padding: 4px 32px 4px 4px;
}

.c-btn-arrow--icon-left .c-btn-arrow__label {
  text-align: center;
}

.c-btn-arrow--icon-left .c-btn-arrow__icon {
  width: 56px;
  height: 56px;
  background: #e1f5ff;
  color: #005ca7;
}

.c-btn-arrow--icon-left:hover .c-btn-arrow__icon {
  background: #ffffff;
  color: #5fcafd;
}

/* 🔒 監査#6「SPでPCサイズのまま」＝ここまでの指定にSP値が無く、PC寸法が405幅にも当たっていた。
   実測＝`_figma_json/fv_probe/BTN_SP_MEASURE_20260823.md`（TOP_SP 913:3098）。
   標準SP（05campaign 913:3374 ほか）: 外枠h43・角丸30.01・枠#333 0.76・pad 3.24/46.4/3.24/4.32
   ・gap10.79・アイコン円36.5(角丸18.24 地#E1F5FF 矢印#5FCAFD)・ラベル16px #005CA7。
   幅はラベル長で伸びる（140〜223）＝**固定幅にしない**（min-width をSPで解除する）。
   ⚠️ SPフレームにはPCフレーム(913:3100・幅1440)が内包されており、その中の
      campaign_btn 250×66 を「SPの正」と読むと誤る（#16 と同じ罠）。 */
@media (max-width: 768px) {
  /* 🔴 2026-08-27 修正: 枠色を #333(黒) から $color-accent へ。
     旧値は BTN_SP_MEASURE_20260823.md の「枠#333 0.76」という記録に従ったものだが、
     **Figma正解画像を画素で実測すると枠は #87D6FD（=$color-accent #5fcafd のアンチエイリアス）**。
     記録側の誤り。PC(=$color-accent)ともこれで一致し、SPだけ黒枠という食い違いも解消する。 */
  .c-btn-arrow {
    min-width: 0;
    gap: 10.79px;
    padding: 3.24px 46.4px 3.24px 4.32px;
    border-color: #5fcafd;
    border-width: 0.76px;
  }
  .c-btn-arrow__icon {
    width: 36.5px;
    height: 36.5px;
  }
  .c-btn-arrow--icon-left {
    padding: 3.24px 46.4px 3.24px 4.32px;
  }
  .c-btn-arrow--icon-left .c-btn-arrow__icon {
    width: 36.5px;
    height: 36.5px;
  }
  /* 03service だけ Figma SP も 250×66（913:3496）＝PC寸法のままが正 */
  .c-btn-arrow--sp-lg,
  .c-btn-arrow--sp-lg.c-btn-arrow--icon-left {
    gap: 16px;
    padding: 4px 32px 4px 4px;
    border-width: 1px;
    border-color: #5fcafd;
  }
  .c-btn-arrow--sp-lg .c-btn-arrow__icon {
    width: 56px;
    height: 56px;
  }
  /* 02News（913:3525）だけ一回り大きい: h47.7・角丸33.33・枠#5FCAFD 0.84・アイコン40.5 */
  .c-btn-arrow--sp-news,
  .c-btn-arrow--sp-news.c-btn-arrow--icon-left {
    gap: 11.98px;
    padding: 3.59px 51.52px 3.59px 4.79px;
    border-color: #5fcafd;
    border-width: 0.84px;
  }
  .c-btn-arrow--sp-news .c-btn-arrow__icon {
    width: 40.5px;
    height: 40.5px;
  }
}
/* ==========================================================================
   c-page-title  下層ページタイトル帯
   出典: 衣類クリーニング PC 937:1715 / SP 913:8137（API実数値・2026-08-09）
   実装方式: p-top__fv と同じ「実測px座標のキャンバスを transform: scale で縮小」
   実測(PC): キャンバス1440×594 / タイトル(109,189) 64px / サブ(109,312) 24px w691
             ビジュアル(829,-40) 666×537 / 泡(1351,453) 104×106
   実測(SP): キャンバス390×248 / タイトル(22,69) 32px w256中央 / サブ(22,132) 16px w308
             ビジュアル(271,24) 179×164 / 泡(336,194) 23×24
   ========================================================================== */
.c-page-title {
  position: relative;
  /* --c-page-title-h-sp: タイトル2行ページ（こだわり=356/会員=274・Figma実測）がパーツ引数で上書き */
  height: calc(100vw * var(--c-page-title-h-sp, 248) / 390);
  overflow: hidden; /* 端の泡・ビジュアルのはみ出しをクリップ */
}

.c-page-title__canvas {
  position: absolute;
  top: 0;
  left: 50%;
  width: 390px;
  height: calc(var(--c-page-title-h-sp, 248) * 1px);
  transform: translateX(-50%) scale(calc(100vw / 390px));
  transform-origin: top center;
}

.c-page-title__visual,
.c-page-title__bubble {
  position: absolute;
  pointer-events: none;
}

/* 重なり順（Figma準拠）: 泡=背面 → 人物イラスト → テキスト(__text は z-index:2) */
.c-page-title__visual {
  z-index: 1;
}

.c-page-title__visual--pc {
  display: none;
}

.c-page-title__visual--sp {
  top: var(--c-page-title-visual-y-sp, 24px);
  left: var(--c-page-title-visual-x-sp, 271px);
  width: var(--c-page-title-visual-w-sp, 179px);
}

/* 泡クラスタ（監査#20・実測 _figma_json/fv_probe/FV_MEASURE_20260823.md）
   Figmaは「人物ノード単体＋泡4個が別要素」の構図。位置は全ページ共通で色だけページ別。
   人物より背面に置く（Figmaの重なり順）。SPに top（185×190）は無い。 */
/* 既定＝実測の最頻値。ページ別のズレはパーツ引数 bubble_pos_sp → カスタムプロパティで上書き */
.c-page-title__bubble--big {
  top: var(--c-page-title-bub-big-y-sp, 60px);
  left: var(--c-page-title-bub-big-x-sp, 322px);
  width: var(--c-page-title-bub-big-w-sp, 128px);
}

.c-page-title__bubble--top {
  display: none; /* SPのFigmaには存在しない */
}

/* PC/SPで色が違う泡は2枚出して出し分ける（デラックス/オプション/匠/特殊品の bottom） */
.c-page-title__bubble--pconly {
  display: none;
}

.c-page-title__bubble--small {
  top: var(--c-page-title-bub-small-y-sp, 24px);
  left: var(--c-page-title-bub-small-x-sp, 305px);
  width: var(--c-page-title-bub-small-w-sp, 18px);
}

.c-page-title__bubble--bottom {
  top: var(--c-page-title-bub-bottom-y-sp, 194px);
  left: var(--c-page-title-bub-bottom-x-sp, 318px);
  width: var(--c-page-title-bub-bottom-w-sp, 23px);
}

/* SP専用サブコピーがあるページは、SPでそちらだけを出す（改行位置がPCと違うため） */
.c-page-title__subtitle--pc {
  display: none;
}

.c-page-title__subtitle--sp {
  display: block;
}

.c-page-title__text {
  position: absolute;
  /* 既定69px＝サブコピーがあるページのFigma実測。
     🔴 2026-08-28 S-100: **サブコピーが無いページはFigmaが97px**（料金3タブ＝実測 y97）。
     文章が無いぶんタイトルが下がって帯の中央寄りに置かれる意匠。パーツ引数 text_y_sp で上書きする。 */
  top: var(--c-page-title-text-y-sp, 69px);
  left: 22px;
  z-index: 2;
}

.c-page-title__title {
  width: 256px;
  color: #005ca7;
  font-family: "Zen Old Mincho", serif;
  font-size: 32px; /* 実測。縮小はキャンバスscaleが担う */
  font-weight: 700;
  line-height: 1.45; /* 実測: Figma lh46.336/32=1.448。1行ページの従来描画(box46px)と同値 */
  /* 🔴 2026-08-29 ユーザー指摘: 左詰めが正。旧centerは8文字タイトルでは無害だが、
     4文字ページ（会社案内・採用情報・お知らせ・店舗一覧）はbox256内センタリング＝約64px右ずれだった。
     Figma実見: btob(2行CENTER指定)・member含め全ページのグリフは左詰め
     （CENTER/LEFTのプロパティ揺れはボックス設定の揺れで視覚に影響なし）。PCは従来からleft明示 */
  text-align: left;
  white-space: nowrap; /* 実測1行（SP幅256=8文字×32pxちょうどのため折返し防止。<br>改行ページは影響なし） */
}

.c-page-title__title-first {
  color: #5fcafd;
}

/* タイトル内の改行（title_lines）。--sp はSP限定改行＝PCでは連結して1行 */
.c-page-title__br--sp {
  display: inline;
}

.c-page-title__subtitle {
  /* 実測はページごとに違う（特殊品SP=340px）。既定308pxのままだと行数が増えて帯からはみ出す */
  width: var(--c-page-title-sub-w-sp, 308px);
  /* 実測: タイトル下端(69+46) → サブtop132。タイトル2行ページのみFigma実測30をパーツ引数で上書き */
  margin-top: var(--c-page-title-sub-gap-sp, 17px);
  color: #005ca7;
  /* 既定16px。匠・羽毛はFigma実測fs18＝パーツ引数 subtitle_size_sp で上書き */
  font-size: var(--c-page-title-sub-fs-sp, 16px);
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0;
}

/* 🔴 サブコピーが #333333 のページ（2026-08-28 実測・PC/SPとも一致）
   ＝kodawari / shiminuki / special / futon-reform。パーツ引数 subtitle_dark で付与。
   他5ページ（clothing/deluxe/option/housecleaning/btob）はFigmaも #005CA7 ＝既定のまま。 */
.c-page-title__subtitle--dark {
  color: #333333;
}

/* FV本文（サブコピー下の説明段落・匠 913:7775 実測: 16px lh27.2 w296 サブ下端194→本文208＝gap14）
   3点構成FVのページだけパーツ引数 body で渡す（同席指摘 匠①）。寸法差はカスタムプロパティで上書き */
.c-page-title__body {
  width: var(--c-page-title-body-w-sp, 296px);
  margin: var(--c-page-title-body-gap-sp, 14px) 0 0;
  color: #333333;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.7; /* 実測: 27.2/16 */
  letter-spacing: 0; /* Figma実測: ls0（既定字間0.48pxだと折返しが1字ズレる＝S-10と同型の罠） */
}

/* 英字大見出し変種（サービス一覧 937:1097系 / 店舗一覧 1048:1052系・Figma実測 2026-08-19）
   英字=Buenard 頭文字アクセント（c-sec-title と同規則）・日本語タイトルは小ラベル化・説明文は #333 */
.c-page-title__en {
  color: #005ca7;
  font-family: "Buenard", serif;
  font-size: 43px; /* 実測: SP43/PC86 */
  font-weight: 400;
  line-height: 1.3; /* 実測: box56/43=1.302（PC 112/86も同比） */
}

.c-page-title__en-first {
  color: #5fcafd;
}

.c-page-title--en .c-page-title__text {
  top: 62px; /* 実測: FVトップ24+英字y38 */
}

.c-page-title--en .c-page-title__title {
  width: auto;
  margin-top: 14px; /* 実測: 英字下端(62+56)→ラベルtop132 */
  color: #333333;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.45;
  text-align: left;
}

.c-page-title--en .c-page-title__subtitle {
  color: #333333;
}

@media (min-width: 769px) {
  .c-page-title {
    height: min(594px, 41.25vw);
  }
  .c-page-title__canvas {
    width: 1440px;
    height: 594px;
    transform: translateX(-50%) scale(min(1, calc(100vw / 1440px)));
  }
  .c-page-title__visual--pc {
    display: block;
    top: var(--c-page-title-visual-y-pc, -40px);
    left: var(--c-page-title-visual-x-pc, 829px);
    width: var(--c-page-title-visual-w-pc, 666px);
  }
  .c-page-title__visual--sp {
    display: none;
  }
  .c-page-title__subtitle--pc {
    display: block;
  }
  .c-page-title__subtitle--sp {
    display: none;
  }
  /* 泡クラスタ PC（既定＝実測の最頻値。ページ別は bubble_pos で上書き） */
  .c-page-title__bubble--big {
    top: var(--c-page-title-bub-big-y-pc, 190px);
    left: var(--c-page-title-bub-big-x-pc, 940px);
    width: var(--c-page-title-bub-big-w-pc, 305px);
  }
  .c-page-title__bubble--top {
    display: block;
    top: var(--c-page-title-bub-top-y-pc, -40px);
    left: var(--c-page-title-bub-top-x-pc, 1310px);
    width: var(--c-page-title-bub-top-w-pc, 185px);
  }
  .c-page-title__bubble--small {
    top: var(--c-page-title-bub-small-y-pc, 128px);
    left: var(--c-page-title-bub-small-x-pc, 1281px);
    width: var(--c-page-title-bub-small-w-pc, 42px);
  }
  .c-page-title__bubble--bottom {
    top: var(--c-page-title-bub-bottom-y-pc, 453px);
    left: var(--c-page-title-bub-bottom-x-pc, 1351px);
    width: var(--c-page-title-bub-bottom-w-pc, 104px);
  }
  .c-page-title__bubble--pconly {
    display: block;
  }
  .c-page-title__bubble--sponly {
    display: none;
  }
  .c-page-title__text {
    top: 189px;
    left: 109px;
  }
  .c-page-title__title {
    width: auto;
    /* ページ別サイズはパーツ引数 title_size_pc → カスタムプロパティで上書き
       （こだわり=48 / 会員サービス=86・Figma実測 2026-08-18） */
    font-size: var(--c-page-title-fs-pc, 64px);
    text-align: left;
  }
  .c-page-title__br--sp {
    display: none; /* SP限定改行はPCで連結 */
  }
  .c-page-title__subtitle {
    width: 691px;
    margin-top: 30px; /* 実測: サブtop312 −(タイトルtop189+ボックス93px) */
    /* ページ別サイズはパーツ引数 subtitle_size_pc（会社案内/会員=20・Figma実測 8/24スイープ） */
    font-size: var(--c-page-title-sub-fs-pc, 24px);
  }
  /* FV本文 PC（匠 937:535 実測: 20px lh34 w722・サブ下端353→本文401＝gap48） */
  .c-page-title__body {
    width: var(--c-page-title-body-w-pc, 722px);
    margin-top: var(--c-page-title-body-gap-pc, 48px);
    font-size: 20px;
  }
  /* 英字大見出し変種（PC実測: 英字top150・86px／ラベル24px gap28／説明 gap45・サービス一覧のみ20px） */
  .c-page-title--en .c-page-title__text {
    top: 150px;
  }
  .c-page-title__en {
    font-size: 86px;
  }
  .c-page-title--en .c-page-title__title {
    margin-top: 28px; /* 実測: 英字下端(150+112)→ラベルtop290 */
    font-size: 24px;
  }
  .c-page-title--en .c-page-title__subtitle {
    width: 560px;
    margin-top: 45px; /* 実測: ラベル下端(290+35)→説明top370 */
    font-size: var(--c-page-title-sub-fs-pc, 24px);
  }
}
/* ==========================================================================
   c-num-title  番号付きセクション見出し（水色番号＋明朝タイトル重ね）
   出典: 衣類クリーニング PC 937:1695/1701/1710 / SP 913:8158 ほか（API実数値）
   実測: 番号 Buenard #5FCAFD 70.68px(PC)/64px(SP)・タイトル Zen Old Mincho Bold
         #005CA7 32px(PC)/20px(SP)・タイトル字下げ99px(PC)/72px(SP)・上37px(SP)/36px(PC)
   ========================================================================== */
.c-num-title {
  position: relative;
  min-height: 83px; /* 実測: 番号64pxの行ボックス（絶対配置のためmin-heightで確保） */
  padding: 37px 0 0 72px;
}

.c-num-title__num {
  position: absolute;
  top: 0;
  left: 0;
  color: #5fcafd;
  font-family: "Buenard", serif;
  font-size: clamp(64px, 61.5177428571px + 0.6364761905vw, 70.683px);
  font-weight: 400; /* Figma=Medium(500)だがGoogle Fonts Buenardは400/700のみ＝c-sec-titleと同判断 */
  line-height: normal;
}

.c-num-title__title {
  color: #005ca7;
  font-family: "Zen Old Mincho", serif;
  font-size: clamp(20px, 15.5428571429px + 1.1428571429vw, 32px);
  font-weight: 700;
  line-height: normal;
}

@media (min-width: 769px) {
  .c-num-title {
    min-height: 92px; /* 実測: 番号70.68pxの行ボックス */
    padding: 36px 0 0 99px;
  }
  /* 衣類sec01実測: 番号top-13・タイトルtop23（他セクションより13px上） */
  .c-num-title--raised .c-num-title__num {
    top: -13px;
  }
  .c-num-title--raised {
    padding-top: 23px;
  }
}
/* ==========================================================================
   c-contact-band  お問い合わせ帯（水色帯＋白カード）
   出典: 衣類クリーニング PC 937:1661 / SP 913:8178（API実数値・SVG実測込み）
   実測(PC): 帯1440×337 #5FCAFD / カード1200×217 r24 top60 / 見出し列(99,19)w285
             縦線 #E1F5FF 3px (490,26)h164 / 文(610,40)w480 20px / ボタン(610,131)
   実測(SP): 帯390×429 / カード352×380 r16 top21 / 見出し(34.5,9) / 横線(95,163)w164
             文(18,193)w318 18px中央 / ボタン(35.4,285) / 泡(-20,-35)56px
   ========================================================================== */
/* 🔒 直前セクションとの余白（49件「◯◯とcontactの間を空けてください」＝5ページ）
   実測: 全ページ共通で **PC100px / SP50px**（deluxe/匠/羽毛/法人/こだわり/ハウス/オプション＝8ページで一致）。
   例外は各ページ側で上書きする（特殊品128 / 店舗一覧160 / 会員0 / 料金・サービス一覧＝個別） */
.c-contact-band {
  position: relative;
  height: 429px;
  margin-top: 50px;
  background: #5fcafd;
}

.c-contact-band__bubble {
  position: absolute;
  top: -35px;
  left: -20px;
  z-index: 2;
  width: 56px;
  pointer-events: none;
}

.c-contact-band__panel {
  position: absolute;
  top: 21px;
  left: 50%;
  width: 352px;
  height: 380px;
  transform: translateX(-50%);
  background: #ffffff;
  border-radius: 16px;
}

.c-contact-band__title {
  position: absolute;
  top: 9px;
  left: 34.5px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 285px;
  text-align: center;
}

.c-contact-band__en {
  color: #005ca7;
  font-family: "Buenard", serif;
  font-size: clamp(64px, 55.8285714286px + 2.0952380952vw, 86px);
  font-weight: 400; /* Figma=Medium(500)・Buenardは400/700のみ */
  line-height: normal;
}

.c-contact-band__en-first {
  color: #5fcafd;
}

.c-contact-band__ja {
  color: #005ca7;
  font-size: clamp(20px, 18.5142857143px + 0.380952381vw, 24px);
  font-weight: 500;
  line-height: normal;
}

.c-contact-band__divider {
  position: absolute;
  top: 163px;
  left: 95px;
  width: 164px;
  height: 3px;
  background: #e1f5ff;
}

.c-contact-band__text {
  position: absolute;
  top: 193px;
  left: 18px;
  width: 318px;
  font-size: clamp(18px, 17.2571428571px + 0.1904761905vw, 20px);
  font-weight: 500;
  line-height: 1.7;
  text-align: center;
}

.c-contact-band__br {
  display: none;
}

.c-contact-band__btn {
  position: absolute;
  top: 285px;
  left: 35.4px;
  display: inline-flex;
  align-items: center;
  gap: 26.4px;
  padding: 3.6px 51.5px 3.6px 4.8px;
  background: #ffffff;
  border: 0.85px solid #5fcafd;
  border-radius: 33.3px;
  color: #005ca7;
  font-size: clamp(16px, 15.2571428571px + 0.1904761905vw, 18px);
  font-weight: 500;
  line-height: 1.7;
  transition: background-color 0.3s ease, color 0.3s ease;
}

.c-contact-band__btn-icon {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 40.5px;
  height: 40.5px;
  background: #e1f5ff;
  border-radius: 50%;
  color: #5fcafd;
  transition: transform 0.3s ease;
}

/* アニメーション指示⑤準拠: ホバーで円が右へスライド（c-btn-arrowと同演出） */
.c-contact-band__btn:hover {
  background: #5fcafd;
  color: #ffffff;
}

.c-contact-band__btn:hover .c-contact-band__btn-icon {
  transform: translateX(6px);
}

@media (min-width: 769px) {
  .c-contact-band {
    height: 337px;
    margin-top: 100px;
  }
  .c-contact-band__bubble {
    top: -76px;
    left: -44px;
    width: 127px;
  }
  .c-contact-band__panel {
    top: 60px;
    width: 1200px;
    max-width: calc(100% - 40px);
    height: 217px;
    border-radius: 24px;
  }
  /* 内側の配置は panel幅1200px に対する比率で持つ。
     Figma実数値(937:1661)を1200で割った値そのもので、PC1440では従来と同じ座標に着地する。
     比率にする理由 = panel が max-width で縮む一方、子が固定pxだと親からはみ出すため
     （769-1439pxで本文がpanel外+320px・画面外300px＝2026-08-09 iPad810実測）。 */
  .c-contact-band__title {
    top: 19px;
    left: 8.25%; /* 99 / 1200 */
  }
  .c-contact-band__divider {
    top: 26px;
    left: 40.8333%; /* 490 / 1200 */
    width: 3px;
    height: 164px;
  }
  .c-contact-band__text {
    top: 40px;
    left: 50.8333%; /* 610 / 1200 */
    width: 40%; /* 480 / 1200・右余白110pxは左余白99pxとほぼ対称 */
    text-align: left;
  }
  .c-contact-band__br {
    display: inline;
  }
  .c-contact-band__btn {
    top: 131px;
    left: 50.8333%; /* 610 / 1200・本文と左端を揃える */
    gap: 25.7px;
    padding: 3.5px 50.3px 3.5px 4.7px;
    border-width: 0.82px;
    border-radius: 32.5px;
  }
  .c-contact-band__btn-icon {
    width: 39.5px;
    height: 39.5px;
  }
}
/* タブレット帯（769-1439px）= Figmaデザインが存在しない領域。
   panel が縮んだ時に本文・ボタンが収まりきらないため、この帯だけ詰め方を調整する。
   PC(1440以上)の見た目には影響しない。 */
@media (min-width: 769px) and (max-width: 1439px) {
  /* 強制改行はPC幅の480pxを前提にした位置＝狭い帯では不自然に折れるので解除し、
     panel幅に応じて自然に折り返させる */
  .c-contact-band__br {
    display: none;
  }
  /* 見出し列はPC固定幅285pxのままだと、比率で寄ってくる縦線に字面が重なる
     （810pxで"Contact"が線に13px被る＝2026-08-09 実測）。
     左半分に収まる幅へ制限し、英字も列幅に追従させる */
  .c-contact-band__title {
    width: 34%; /* 縦線(40.83%)の手前で必ず終わる */
  }
  .c-contact-band__en {
    font-size: clamp(40px, 7.2vw, 86px);
  }
  /* ボタンの左右パディングはPC実測値(50.3px)のままだと狭い帯で label が押し出される。
     アイコン径・境界半径は維持したまま余白だけ詰める */
  .c-contact-band__btn {
    padding-right: 24px;
    gap: 16px;
  }
}
/* ==========================================================================
   c-footer  Figma最新世代（PC=972:654 1320×513 / SP=913:8193 344×752）
   2026-08-17 MCP get_design_context 実取得値で作り替え（旧Pick Upカード型を廃止）
   PC: 左列304=ロゴ群+会社情報 / 右列=バナー2枚(478.9×163)+リンク3列+サイトポリシー
   SP: バナー縦積み→ロゴ→アコーディオン3群→会社情報→ポリシー→コピーライト
   ========================================================================== */
.c-footer {
  padding: 100px 0 38px; /* 実測: contact帯下端2860→フッター上端2960 / リンク列下端3473→ページ末3511 */
  background: #ffffff;
}

.c-footer__inner {
  display: grid;
  grid-template-columns: 304px 1fr; /* 実測: 左列304 / バナー左端345（差41がgap） */
  grid-template-rows: auto auto;
  column-gap: 41px;
  row-gap: 44px; /* 実測: バナー下端166→ナビ上端210 */
  width: min(100% - 40px, 1320px);
  margin-inline: auto;
}

.c-footer__company {
  grid-row: 1/3;
}

/* ロゴはTOPへのリンク。
   ⚠️ inline-block だと行ボックスの下端余白ぶん後続が下へずれる（PC回帰で全21ページ差分）。
   block にして幅を中身に合わせ、包む前と同じ寸法・位置を保つ。 */
.c-footer__logo-link {
  display: block;
  width: fit-content;
  text-decoration: none;
}

.c-footer__logo {
  display: block;
  width: auto;
  height: 45px; /* 実測 972:716: 304×45 */
}

/* ブランドロゴ3種は実測で横に重なり配置（x0/104/193・幅111/110/111） */
.c-footer__brands {
  position: relative;
  height: 51px; /* 実測: y57〜108 */
  margin-top: 12px; /* 実測: ロゴ下端45→ブランド行上端57 */
  list-style: none;
}

.c-footer__brand {
  position: absolute;
}

.c-footer__brand img {
  width: auto;
  height: 47px; /* 実測 */
}

.c-footer__brand--hamahaku {
  left: 0;
  top: 2px;
} /* 実測 y59 */
.c-footer__brand--jyabu {
  left: 104px;
  top: 4px;
} /* 実測 y61 */
.c-footer__brand--sweetla {
  left: 193px;
  top: 0;
} /* 実測 y57 */
.c-footer__info {
  margin-top: 26px; /* 実測: ブランド行下端108→テキスト群134 */
}

.c-footer__name {
  font-size: 18px;
  font-weight: 500; /* 実測 972:721: Zen Kaku Gothic New Medium */
  line-height: 1.7;
}

.c-footer__address {
  margin-top: 20px; /* 実測 */
  font-size: 16px;
  font-weight: 500; /* 実測 972:720: PCはMedium（SPはRegular＝下のSP分岐） */
  font-style: normal;
  line-height: 1.7;
}

.c-footer__sns {
  margin-top: 20px; /* 実測 */
  font-size: 14px;
  font-weight: 500;
  line-height: 1.7;
}

/* --- バナー2枚（グラデ＋写真マスク＋アークテキスト） --- */
.c-footer__banners {
  display: flex;
  flex-wrap: wrap; /* 右列が478px×2を置けない幅では縦積みに落とす（タイトル28pxの溢れ防止） */
  gap: 16px; /* 実測: バナー間 345+478.9→840 */
}

.c-footer__banner {
  position: relative;
  display: block;
  flex: 1 1 478px; /* 実測幅478.9。これ未満に縮ませず折り返す */
  overflow: hidden;
  aspect-ratio: 478.86/163.06; /* 実測 */
  border-radius: 14.6px; /* 実測 14.634 */
  transition: opacity 0.25s ease;
}

.c-footer__banner:hover {
  opacity: 0.9;
}

/* 洗濯代行バナー（フッター・PCドロワー共通）のComing Soonバッジ＝写真の左上に重ねる
   （タイトル行に入れると幅不足で見切れる／右上はタイトル・矢印と隣接して窮屈。PC/SPで同じ位置に揃える） */
.c-footer__banner .c-soon-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 1;
}

/* グラデーション（実測: 上#5FCAFD→下、終点はバナーごとに異なる） */
.c-footer__banner--laundry {
  background: linear-gradient(to bottom, #5fcafd, #b3e7ff);
}

.c-footer__banner--futon {
  background: linear-gradient(to bottom, #5fcafd, #a7e3ff);
}

/* 写真（左側・曲線マスクで切り抜き。倍率/オフセットはFigma実測値） */
.c-footer__banner-photo {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 46.31%; /* 実測 221.755/478.858 */
  height: 100%;
  overflow: hidden;
  mask-image: url("../img/common/footer-banner-mask.svg");
  mask-size: 100% 100%;
  -webkit-mask-image: url("../img/common/footer-banner-mask.svg");
  -webkit-mask-size: 100% 100%;
}

/* 写真本体（2026-08-17 実写真へ差し替え・透かしなしを目視確認済み）
   マスク窓より大きく配置する（Figma実測 inset -10.09/-10.08/-12.44/-25.07%） */
.c-footer__banner-photo img {
  position: absolute;
  top: -10.09%;
  left: -25.07%;
  /* ⚠️共通の `img { max-width:100% }` に負けるため解除（マスクの膨らみ側が埋まらなくなる） */
  max-width: none;
  width: 135.15%;
  height: 122.53%;
  object-fit: cover;
}

/* アークテキスト「service」＝Figma書き出しSVG（曲率がバナーごとに異なるためファイル別） */
.c-footer__banner-arc {
  position: absolute;
  display: block;
  background: no-repeat center/contain;
}

.c-footer__banner--laundry .c-footer__banner-arc {
  top: 3.37%; /* 実測: figma_ref_pc.png グリフ画素計測（中心221.5,24.5・箱25×38） */
  left: 43.65%;
  width: 5.22%;
  aspect-ratio: 25/38;
  background-image: url("../img/common/footer-arc-service.svg");
}

.c-footer__banner--futon .c-footer__banner-arc {
  top: 2.76%; /* 実測: 同計測（中心216.5,23.5・箱27×38） */
  left: 42.4%;
  width: 5.64%;
  aspect-ratio: 27/38;
  background-image: url("../img/common/footer-arc-service-futon.svg");
}

/* テキストブロック（タイトル＋星／区切り線／説明文） */
.c-footer__banner-body {
  position: absolute;
  top: 9.85%; /* 実測 16.06/163.06 */
  left: 52%; /* 実測: laundry 248.6(51.9%)/futon 251.1(52.4%)→中間値52% */
  display: flex;
  flex-direction: column;
  gap: 11.4px; /* 実測 11.382 */
  width: 42.78%; /* 実測 204.877/478.858 */
}

.c-footer__banner-title {
  display: inline-flex;
  align-items: center;
  gap: 12px; /* 実測: laundry 14.5/futon 10.5→中間値12 */
  color: #ffffff;
  font-size: 28.3px; /* 実測 28.298 */
  font-weight: 700;
  line-height: 1.5; /* 実測: 行箱42.28/28.3 */
  white-space: nowrap;
}

.c-footer__banner-star {
  width: 24.4px; /* 実測 24.39 */
  height: 24.4px;
}

.c-footer__banner-line {
  display: block;
  width: 100%;
  border-top: 1px solid #e1f5ff; /* 実測: #E1F5FF・太さ0.813→1px */
}

.c-footer__banner-text {
  color: #ffffff;
  font-size: 15.2px; /* 実測 15.238 */
  font-weight: 700;
  line-height: 1.5;
}

/* --- リンク3列＋サイトポリシー --- */
.c-footer__nav {
  display: grid;
  /* 実測: 列幅144/144/112・gap60/60/40 → トラック=幅+gap で列左端0/204/408/560を再現 */
  grid-template-columns: 204px 204px 152px 1fr;
}

.c-footer__nav-head {
  display: block;
  margin-bottom: 20px; /* 実測: 見出し下端29→リスト49 */
  padding: 0;
  background: none;
  border: none;
  color: #333333;
  font-family: "Zen Old Mincho", serif;
  font-size: 20px;
  font-weight: 500; /* 実測: Zen Old Mincho Medium */
  line-height: 1.45; /* 実測: 行箱29/20 */
  text-align: left;
  cursor: default;
  pointer-events: none; /* PCはアコーディオンにしない（SP分岐で解除） */
}

.c-footer__nav-toggle {
  display: none; /* ＋アイコンはSPのみ */
}

.c-footer__nav-list {
  list-style: none;
}

.c-footer__nav-list li {
  line-height: 1.44; /* 実測: 行箱23/16（liに置かないと親の1.7で行箱が27.2に膨らむ） */
}

.c-footer__nav-list li + li {
  margin-top: 10px; /* 実測: 項目間 */
}

.c-footer__nav-list a,
.c-footer__nav-list span[aria-disabled=true] {
  font-size: 16px;
  transition: color 0.25s ease;
  /* 実測: 「法人向けクリーニングサービス」(幅224)は列幅を超えて1行のまま＝自動折返しさせない。
     2行の項目はFigma同様 <br> で明示（メンバーシステム／ご入会特典） */
  white-space: nowrap;
}

.c-footer__nav-list a:hover {
  color: #005ca7;
}

.c-footer__policy {
  font-size: 14px; /* 実測 972:683 */
  transition: color 0.25s ease;
  white-space: nowrap;
}

.c-footer__policy:hover {
  color: #005ca7;
}

.c-footer__foot {
  display: none; /* プライバシーポリシー行はSPのみ（913:8252） */
}

/* --- タブレット帯（769〜1024px）: 左右2列が窮屈になるため1カラム化 --- */
@media (max-width: 1024px) {
  .c-footer__inner {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    row-gap: 40px;
  }
  .c-footer__company {
    grid-row: auto;
  }
}
/* --- SP（913:8193 実測） --- */
@media (max-width: 768px) {
  .c-footer {
    padding: 50px 0 121px; /* 実測: contact下端2932→フッター2982 / 内容下端3734→ページ末3855 */
  }
  /* SPは表示順が入れ替わる（バナー→ロゴ→ナビ→会社情報→ポリシー→コピーライト）ため
     company の箱を解いて子要素を直接並べ替える */
  .c-footer__inner {
    display: flex;
    flex-direction: column;
    row-gap: 0;
    width: calc(100% - 46px); /* 実測: バナー幅343.4/390 */
  }
  .c-footer__company {
    display: contents;
  }
  .c-footer__banners {
    order: 1;
    gap: 11px; /* 実測: バナー間117.88→128.96 */
  }
  .c-footer__banner {
    flex-basis: 100%;
    border-radius: 10.5px; /* 実測 10.494 */
  }
  /* SPは写真枠が狭いため、バッジも少しだけ内側へ寄せる */
  .c-footer__banner .c-soon-badge {
    top: 8px;
    left: 8px;
  }
  .c-footer__banner-body {
    gap: 8.2px; /* 実測 8.162 */
  }
  .c-footer__banner-title {
    font-size: 20px; /* 実測 913:8203 */
  }
  .c-footer__banner-star {
    width: 17.5px; /* 実測 17.49 */
    height: 17.5px;
  }
  .c-footer__banner-text {
    font-size: 11px; /* 実測 913:8208 */
  }
  /* SPのアークはPCと曲率が異なる書き出し（913:8209・両バナー同一曲率128.257） */
  .c-footer__banner--laundry .c-footer__banner-arc,
  .c-footer__banner--futon .c-footer__banner-arc {
    top: 9.41%; /* 実測: figma_ref_sp.png グリフ画素計測（中心159.5,25・箱17×28） */
    left: 43.97%;
    width: 4.95%;
    aspect-ratio: 17/28;
    background-image: url("../img/common/footer-arc-service-sp.svg");
  }
  /* ロゴをリンクで包んだため、flex子としての指定は<a>側へ。高さは<img>に残す */
  .c-footer__logo-link {
    order: 2;
    align-self: flex-start; /* flex列のstretchで横伸びさせない（アスペクト維持） */
    margin-top: 31px; /* 実測: バナー群下端247→ロゴ278 */
    margin-inline: 4px; /* 実測: コンテンツ群はバナーより4px内側（x27/バナーx23） */
  }
  .c-footer__logo {
    height: 24px; /* 実測 913:8226: 161×24 */
  }
  /* 🔴 2026-08-27 ユーザー指示: Figma SPには無いが、SPでもブランドロゴ3種を出す。
     PCの絶対配置(x0/104/193・幅111)は390幅に収まらないため、SPは等間隔の横並びにして縮める。
     ＝**Figmaからの意図的な逸脱**（デザイン不備の補完・ユーザー裁定） */
  /* 🔴 2026-08-27 ユーザー指示: 配置は**PCの実装をそのまま採用**する（当方で決め直さない）。
     PC実測(1455幅): ロゴ x68 幅304 ／ ブランド3種 x68・x172・x261（画像幅111/110/111・高47）
     ＝**大きいロゴの真下に、ロゴと同じ幅304pxの中で固まって並ぶ**。
     SPはロゴが 304→161px（縮尺 0.53）なので、同じ縮尺でブランド行も縮める。
     PCの絶対配置(left:0/104/193)をそのまま使い、容器側を scale で縮める＝比率が崩れない。 */
  .c-footer__brands {
    /* 親(.c-footer__company)が display:contents のため、この要素は
       フッターのflex列に直接並ぶ＝order指定が要る。ロゴ(order:2)の直後に置く */
    order: 3;
    position: relative;
    width: 304px; /* PCと同じ基準幅。scaleで見た目を縮める */
    height: 27.03px;
    margin-top: 8px; /* 実測: PCはロゴ下端397→ブランド上端409＝12px。縮尺ぶん詰める */
    margin-inline: 4px; /* ロゴと左端を揃える */
    transform: scale(0.53); /* SPロゴ 161/304 と同じ縮尺 */
    transform-origin: left top;
  }
  /* 🔴 2026-08-29 確定（ユーザー裁定・全21フレーム機械照合）: SPフッターのナビは
     **Figmaでページにより有無が分かれる**（在る=衣類/シミ抜き/オプション/法人の4フレームのみ・
     アコーディオン形 fs18・＋12×12。残り17フレームは無し）。意図の共通項なし＝Figma不整合。
     → デザインに在るページだけ出す（c-footer.php が `c-footer--sp-nav` を付与）。
     統一要否は瀬野尾さんへ一言確認中（NEXT.md 📮G）。
     ※旧・監査#16「SPにナビ無し」（913:3234根拠）と旧・8/28夜「全フレームに有り」（2フレーム外挿）は
       どちらも部分観測による誤り。本コメントの4/21が全数照合の確定値。 */
  .c-footer__nav {
    display: none; /* 既定＝Figmaにナビが無い17ページ */
  }
  .c-footer--sp-nav .c-footer__nav {
    display: block; /* Figmaにナビが在る4ページのみ（PCのgrid3列をSPでは縦積みに） */
    order: 3; /* brands(order:3)と同値＝DOM順でbrandsの後ろ */
    margin-top: 32px; /* 実測: ロゴ下端5115→サービス見出し5147 */
    margin-inline: 4px; /* コンテンツ群はバナーより4px内側（x27/バナーx23） */
  }
  .c-footer__nav-col + .c-footer__nav-col {
    margin-top: 32px; /* 実測: セクション間 */
  }
  /* 実測: 区切り線はサービス/ご利用案内の下のみ（会社情報の下は無し） */
  .c-footer__nav-col:nth-child(-n+2) {
    padding-bottom: 16px; /* 実測: 見出し下端→線 */
    border-bottom: 1px solid #cfcfcf;
  }
  .c-footer__nav-col--policy {
    display: none; /* PCのサイトポリシー列はSPでは末尾の__footに置き換わる */
  }
  .c-footer__nav-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 0;
    font-size: 18px;
    font-weight: 700; /* 実測 913:8229: Zen Old Mincho Bold */
    line-height: 1; /* 実測: 行箱18/18 */
    cursor: pointer;
    pointer-events: auto; /* PCで無効化したアコーディオン操作をSPで有効に */
  }
  /* ＋アイコン（実測 913:8230: 12×12・線2px #333）。開いたら縦棒を消して−にする */
  .c-footer__nav-toggle {
    position: relative;
    display: block;
    flex-shrink: 0;
    width: 12px;
    height: 12px;
  }
  .c-footer__nav-toggle::before,
  .c-footer__nav-toggle::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 2px;
    background: #333333;
    transform: translateY(-50%);
    transition: transform 0.3s ease, opacity 0.3s ease;
  }
  .c-footer__nav-toggle::after {
    transform: translateY(-50%) rotate(90deg);
  }
  .c-footer__nav-head[aria-expanded=true] .c-footer__nav-toggle::after {
    opacity: 0;
    transform: translateY(-50%) rotate(0deg);
  }
  /* リストは畳んでおき、JS（js-footer-acc）が .is-open を付けたら開く */
  .c-footer__nav-list {
    display: none;
    padding-top: 16px;
  }
  .c-footer__nav-col.is-open .c-footer__nav-list {
    display: block;
  }
  .c-footer__info {
    order: 4;
    margin-top: 53px; /* 実測: ナビ末端5297→会社名5350 */
    margin-inline: 4px;
  }
  /* （c-voice見出し円のSP値は本ファイル末尾のSPブロックにある＝基底定義§c-voiceが
     このブロックより後方にあり、ここに書くと基底に負ける・罠#1） */
  .c-footer__address {
    margin-top: 0; /* 実測: SPは社名行箱(lh1.7)と住所が隙間なく連続（913:8250/8251） */
    font-weight: 400; /* 実測 913:8251: SPはRegular */
  }
  .c-footer__foot {
    order: 5;
    display: block;
    margin-top: 21px; /* 実測: 会社情報下端676→リンク697 */
    margin-inline: 4px;
  }
  .c-footer__policy--sp {
    font-size: 12px; /* 実測 913:8254 */
  }
  .c-footer__sns {
    order: 6;
    margin-top: 24px; /* 実測: リンク下端714→コピーライト738 */
    margin-inline: 4px;
    color: #cfcfcf; /* 実測 913:8255: #CFCFCF */
    font-size: 12px;
    font-weight: 400;
    line-height: normal;
  }
}
/* ==========================================================================
   c-group-title  グループ見出し（泡＋見出し＋右へ伸びる罫線）
   出典: サービス一覧 PC 937:1088 / 937:1040 / 937:1013、SP 983:1584 ほか
   実測(PC): 泡42×42 / 見出し左端は泡左端+63 / 36px 700 #005CA7 / 罫線 #D9D9D9 1px
   実測(SP): 泡28×28 / 見出し左端は泡左端+38 / 24px 700 #005CA7
   色・フォントは 2026-08-17 複製ファイルから REST 実取得
   ========================================================================== */
.c-group-title {
  display: flex;
  align-items: center;
  gap: 10px; /* 実測(SP): 泡右端28.5 -> 見出し38.5 */
}

/* 監査#12: 単色の丸ではなくFigmaと同じ泡素材を置く（色はページ側の color 引数） */
.c-group-title__bubble {
  display: block;
  flex-shrink: 0;
  width: 28px; /* 実測(SP) */
  height: 28px;
  object-fit: contain;
}

.c-group-title__text {
  margin: 0;
  color: #005ca7; /* 実測 937:1090 / 983:1587: #005CA7 */
  font-size: clamp(24px, 19.5428571429px + 1.1428571429vw, 36px); /* 実測: SP24 / PC36 */
  font-weight: 700;
  line-height: 1.448; /* 実測: 52.128/36 */
  white-space: nowrap;
}

.c-group-title__line {
  flex: 1;
  height: 1px; /* 実測 937:1092 / 983:1635: sw1.0 */
  background: #d9d9d9; /* 実測: #D9D9D9 */
}

@media (min-width: 769px) {
  .c-group-title {
    gap: 21px; /* 実測(PC): 泡右端100 -> 見出し121 */
  }
  .c-group-title__bubble {
    width: 42px; /* 実測(PC) */
    height: 42px;
  }
}
/* ==========================================================================
   c-service-card  サービスカード（写真＋タイトル行＋説明文）
   出典: サービス一覧 PC 937:1046 ほか計10枚 / SP 983:1612 ほか
   実測(PC): カード幅579 / 写真579×388 r24 / タイトル24px 700 #005CA7 / 本文18-20px 500 #333
   実測(SP): カード幅346 / 写真346×232 r16 / タイトル20px 700 / 丸ボタン #5FCAFD
   ========================================================================== */
/* 🔒 §B-9 アニメ④「各サービスのホバー時の動きを追加していただきたいです」（49件）
   🔴**仕様の一次情報が無い**（Figmaのアニメ指示 522:778 にもコメントにも記載なし）。
   ∴ 承認済みのボタンホバー（522:863「円モチーフが右にスライドし、色が反転」）と**同じ文法**で、
   カードは控えめな持ち上げに留める＝作り込まない。📮先方へ一言添えて確認する。 */
.c-service-card {
  display: block;
  color: inherit;
  text-decoration: none;
  transition: transform 0.3s ease;
}

.c-service-card:hover {
  transform: translateY(-4px);
}

/* 写真はわずかに寄る（枠内でズーム） */
.c-service-card__img {
  transition: transform 0.4s ease;
}

.c-service-card:hover .c-service-card__img {
  transform: scale(1.04);
}

/* 円モチーフは右へスライドし色が反転（＝承認済みボタンと同じ挙動） */
.c-service-card:hover .c-service-card__btn {
  background: #ffffff;
  transform: translateX(4px);
}

.c-service-card:hover .c-service-card__btn::before {
  border-top-color: #5fcafd;
  border-right-color: #5fcafd;
}

@media (prefers-reduced-motion: reduce) {
  .c-service-card,
  .c-service-card__img,
  .c-service-card__btn {
    transition: none;
  }
  .c-service-card:hover,
  .c-service-card:hover .c-service-card__img,
  .c-service-card:hover .c-service-card__btn {
    transform: none;
  }
}
.c-service-card__media {
  /* 実測(SP): 346×232 = 写真の枠。写真未取得のためプレースホルダ背景で枠を示す */
  position: relative; /* Coming Soonバッジ（白洋舎様FB 8/29）の基準枠 */
  aspect-ratio: 346/232;
  width: 100%;
  border-radius: 16px; /* 実測(SP) 983:1613 */
  background: #d9d9d9;
  overflow: hidden;
}

/* Coming Soon バッジ（白洋舎様FB 8/29: 洗濯代行・ハウスクリーニングは公開前サービスの表記を出す） */
.c-soon-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 12px;
  border: 1px solid #005ca7;
  border-radius: 999px;
  background: #ffffff;
  color: #005ca7;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.6;
  white-space: nowrap;
}

.c-service-card__media .c-soon-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 1;
}

.c-service-card__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 写真未差し込みのカード（透かし等でプレースホルダ維持）は枠だけ見せる */
.c-service-card__media:empty {
  background: #d9d9d9;
}

/* 🔒 監査#13「Figmaは見出しテキスト直後に小さな矢印丸→実装はカード右端に離れて配置」
   原因＝`justify-content: space-between` でカード幅いっぱいに押し出していた。
   実測(PC 937:1048「card_cleaning_text」): 見出し x108 w192（右端300）→ 矢印 x317
   ＝**間隔17px で直後に置く**（カード幅579の右端ではない）。 */
.c-service-card__head {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px; /* 実測(SP 983:1616 等): 見出し右端182 -> 矢印x192。PCは下で17pxへ */
  min-height: 30px; /* 実測(SP): タイトル行の高さ */
  margin-top: 20px; /* 実測(SP): 写真下端232 -> タイトル行252 */
}

.c-service-card__title {
  color: #005ca7; /* 実測 937:1049 / 983:1615: #005CA7 */
  font-size: clamp(20px, 18.5142857143px + 0.380952381vw, 24px); /* 実測: SP20 / PC24 */
  font-weight: 700;
  line-height: 1.5; /* 実測: 30/20・36/24 */
}

/* 丸ボタン（実測 SP24×24 / PC31×31・矢印は疑似要素で描画） */
.c-service-card__btn {
  position: relative;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  border: 1px solid #5fcafd;
  border-radius: 50%;
  background: #5fcafd; /* 実測 937:1050 / 983:1616: #5FCAFD */
  transition: transform 0.3s ease, background-color 0.3s ease;
}

.c-service-card__btn::before {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 6px;
  height: 6px;
  border-top: 1.5px solid #ffffff;
  border-right: 1.5px solid #ffffff;
  transform: translate(-65%, -50%) rotate(45deg);
  content: "";
}

.c-service-card__text {
  margin: 20px 0 0; /* 実測(SP): タイトル行下端282 -> 本文302 */
  color: #333333; /* 実測: #333333 */
  font-size: 18px; /* 実測: SP18 / PC18〜20（カードにより差・18へ統一） */
  font-weight: 500;
  line-height: 1.7; /* 実測: 30.6/18 */
}

@media (min-width: 769px) {
  .c-service-card__media {
    aspect-ratio: 579/388; /* 実測(PC) */
    border-radius: 24px; /* 実測(PC) 937:1047 */
  }
  .c-service-card__head {
    gap: 17px; /* 実測(PC 937:1048): 見出し右端300 -> 矢印x317 */
    min-height: 36px;
    margin-top: 31px; /* 実測(PC): 写真下端388 -> タイトル行419 */
  }
  .c-service-card__btn {
    width: 31px; /* 実測(PC) */
    height: 31px;
  }
  .c-service-card__text {
    margin-top: 31px; /* 実測(PC): タイトル行下端455 -> 本文486 */
  }
}
/* ==========================================================================
   c-voice  お客様の声（デラックス 937:716 / シミ抜き匠 937:477 で同一構造＝共通化）
   ========================================================================== */
/* 🔒 49件「(SP)お客様の声：背景は全部水色ではなく囲い」（ボーテ・匠の2ページ）。
   実測(SP) 983:2951/2952・913:7836/7837 は**2枚重ね**:
     外枠 390幅 r16 #E1F5FF ／ 内側 366幅 r8 #FFFFFF（左右12pxずつ内側）
   ＝**12pxの水色の囲い**であって、セクション全面の水色ではない。
   従来はセクション全体に #F3FBFF を敷いていた＝指摘のとおり誤り */
.c-voice {
  margin-top: 90px; /* 実測(SP): price下端3014.5 -> voice y3104 */
  padding: 0;
  background: none;
}

.c-voice__inner {
  /* 実測(SP) 913:7836→7837: 白の内側インセット＝上17/左右12/下18（S-31で12均一から実測値へ） */
  padding: 17px 12px 18px;
  border-radius: 16px; /* 実測 983:2951 / 913:7836 */
  background: #e1f5ff; /* 実測: #E1F5FF（囲いの色） */
}

.c-voice__card {
  /* 実測(SP): 白上端2475→見出し2507＝上32／最終本文下端4232→白下端4266＝下34（左右10は従来値） */
  padding: 32px 10px 34px;
  border-radius: 8px; /* 実測 983:2952 / 913:7837 */
  background: #ffffff;
}

.c-voice__heading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px; /* 実測 937:722→723: 泡右端660.6 -> 見出し684.6 */
  margin: 0;
  color: #333333;
  font-size: clamp(24px, 21.0285714286px + 0.7619047619vw, 32px);
  font-weight: 700;
  line-height: 1.448;
}

.c-voice__bubble {
  width: 42px; /* 実測: 42×42 */
  height: 42px;
}

.c-voice__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  /* 実測(SP): 見出し下端2542 -> item01 y2572 ＝ 30（S-31で見出しをカード内へ移した後の再計算。
     旧65は見出しがカード外にあった時代の値） */
  margin-top: 30px;
}

.c-voice__item + .c-voice__item {
  /* 実測(SP): item01下端3642 -> item02 y3692.2 ＝ 区切線を挟む */
  margin-top: 50px;
  padding-top: 50px;
  border-top: 2px solid #e1f5ff; /* 実測 937:732: #E1F5FF sw2 */
}

.c-voice__avatar {
  position: relative;
  flex-shrink: 0;
  width: 154px; /* 実測 937:726: 154×154 */
  height: 154px;
}

.c-voice__avatar img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* アーク文字「point 0N」＝円周に沿うSVG textPath（TOP c-point-block と同方式・8/24同席確認③で
   旧「下部中央の簡易表現」から昇格）。viewBox200はアバター円154と同心＝比率配置で崩れない */
.c-voice__arc-svg {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 129.9%; /* 200/154 */
  height: 129.9%;
  overflow: visible;
  transform: translate(-50%, -50%);
  fill: #5fcafd; /* 実測 937:727: #5FCAFD */
  font-family: "Buenard", serif;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.08em;
}

/* 弧の色はtoneに連動しないページがある（匠 937:501/508 実測: 03=紺・04=水色＝toneと逆）
   ∴ アイテム別のモディファイアで指定（c-voice-list.php が arc_tone 省略時=tone で出力） */
.c-voice__arc-svg--accent {
  fill: #5fcafd; /* 実測 937:727: #5FCAFD */
}

.c-voice__arc-svg--main {
  fill: #005ca7; /* 実測 937:740: #005CA7 */
}

.c-voice__body {
  margin-top: 24px;
  text-align: center;
}

.c-voice__label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 211px; /* 実測 937:729: 211×36 */
  min-height: 36px;
  margin: 0;
  padding: 0 18px;
  border: 1px solid #5fcafd; /* 実測: stroke #5FCAFD r4 */
  border-radius: 4px;
  background: #ffffff;
  color: #5fcafd; /* 実測 937:730: #5FCAFD */
  font-size: 20px;
  font-weight: 500;
  line-height: 1.4;
}

.c-voice__item--main .c-voice__label {
  border-color: #005ca7;
  color: #005ca7; /* 実測 937:736: #005CA7 */
}

.c-voice__text {
  margin: 15px 0 0; /* 実測(SP): ラベル下端 -> 本文 */
  color: #333333;
  font-size: 20px; /* 実測: 20px 500 */
  font-weight: 500;
  line-height: 1.7; /* 実測: 34/20 */
  /* Figma実測: 匠937:490系・デラックス937:731系とも ls0。
     既定字間0.48pxが乗ると固定幅の折返しが1字ズレる（匠item03で実発生・同席指摘 匠②） */
  letter-spacing: 0;
}

@media (min-width: 769px) {
  .c-voice {
    /* 実測(PC): price下端2535 -> voice y2695 ＝ 160 / voice下端3894 -> contact 3994 ＝ 100 */
    margin-top: 160px;
    margin-bottom: 100px;
    padding: 0;
    background: none;
  }
  .c-voice__inner {
    /* 実測(PC): voice背景1200×1199 r24 / 内側の白カード963 r16。
       青枠→白カードの上下はページ実測が違う（deluxe=67/99・匠=72/67）＝引数で上書き */
    width: min(1200px, 100% - 80px);
    margin: 0 auto;
    padding: var(--c-voice-pad-top, 67px) 0 var(--c-voice-pad-bottom, 99px);
    border-radius: 24px;
    background: #f3fbff;
  }
  .c-voice__card {
    /* 白カード内の上下余白もページ実測（deluxe: 見出しまで50/最終アイテム下49・匠: 45/98） */
    width: min(963px, 100% - 40px);
    margin: 0 auto;
    padding: var(--c-voice-card-pad-top, 50px) 0 var(--c-voice-card-pad-bottom, 49px);
    border-radius: 16px;
    background: #ffffff;
  }
  .c-voice__item {
    /* 実測(PC): 白カード内 725幅。高さはアイテム別（弧が離れる型=271／密着型=221。
       匠は 01/04=271・02/03=221 とtoneに連動しない＝item_h で上書き） */
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5%;
    width: min(725px, 100% - 120px);
    min-height: var(--c-voice-item-h, 271px);
    margin: 25px auto 0;
    text-align: left;
  }
  .c-voice__item--main {
    flex-direction: row-reverse;
    min-height: var(--c-voice-item-h, 221px); /* 実測 937:733: item02 h221 */
  }
  .c-voice__item + .c-voice__item {
    margin-top: 50px; /* 実測: item01下端3154 -> item02 y3204.2 */
    padding-top: 50px;
  }
  /* 🔒 同席指摘 匠②（2026-08-25）: 本文はFigma実測で**全アイテムLEFT揃え**（匠 937:490/493/502/505・
     デラックス 937:731/737 とも textAlignHorizontal=LEFT。ラベルも列左端 x394）。
     旧 `.c-voice__item--main { text-align: right }` は根拠のない鏡映え実装＝削除 */
  .c-voice__body {
    flex: 0 1 var(--c-voice-body-w, 454px); /* 本文列幅はアイテムごとにFigma実測が違う（匠: 444/550/490/576） */
    min-width: 0;
    margin-top: 0;
    text-align: left;
  }
  .c-voice__item {
    /* Figma実測(PC): 弧余白58＋円154＋gap59＋本文454＝725（8/24同席確認③・旧gap36/本文535は誤り）
       匠は円位置・gapもアイテムごとに違う（item03=ml33/gap34 等）＝c-voice-list.php がアイテム別に上書き */
    gap: var(--c-voice-gap, 59px);
  }
  .c-voice__avatar {
    margin-left: var(--c-voice-avatar-ml, 58px); /* 弧テキストの領域（Group68実測: 円は群の+58,+58） */
  }
  .c-voice__item--main {
    gap: var(--c-voice-gap, 30px);
  }
  .c-voice__item--main .c-voice__avatar {
    margin-right: var(--c-voice-avatar-mr, 34px);
    margin-left: 0;
  }
}
@media (min-width: 1440px) {
  /* Figma厳密再現帯: 本文列を縮ませない（匠item02/04は列550/576で合計が枠725を超え、
     Figmaも本文が枠外左へはみ出す構図＝白カード963の内側に収まる）。
     769〜1439の比率帯では flex-shrink:1 のまま縮めて横スクロールを出さない */
  .c-voice__body {
    flex-shrink: 0;
  }
}
/* ==========================================================================
   c-preparing: 準備中プレースホルダ（テスト環境向けの暫定表示）
   🔒 暫定物＝全ページ実装で不要になる。本番公開前に本節ごと除去してよい。
   Figma由来のデザインは存在しない（体裁措置のため実装裁量）。
   ========================================================================== */
.c-preparing {
  max-width: 1200px;
  margin: 0 auto;
  padding: 120px 20px 140px;
  text-align: center;
}

.c-preparing__title {
  font-family: "Zen Old Mincho", serif;
  font-size: clamp(24px, 19.5428571429px + 1.1428571429vw, 36px);
  color: #005ca7;
}

.c-preparing__text {
  margin-top: 24px;
  color: #333333;
}

.c-preparing__home {
  display: inline-block;
  margin-top: 40px;
  padding: 14px 40px;
  border-radius: 999px;
  background-color: #5fcafd;
  color: #ffffff;
}

/* ==========================================================================
   c-price-table  料金表（共通パーツ・4ページで使用）
   出典（figma_spec.py 全プロパティ取得・2026-08-22）:
     デラックス PC 937:751 / SP 983:2982 ・ シミ抜き匠 PC 937:449 / SP 913:7801
     法人向け   PC 937:1880 / SP 913:8289 ・ 羽毛布団 PC 937:2506 / SP 983:2682（仕様型）
   実測: 行ピッチ43px / 見出し24px700・上下 #5FCAFD 1px / 本文20px500 #333
         縞=**偶数行** #F3FBFF / 行区切り #CFCFCF（**最終行の下にも引く**）/ 中央線=縦 #CFCFCF
   🔒 49件のうち「一行ごとに色が変わる」「最後の行にも表の線」「中央線がない」
      「文字揃え」「ラグジュアリー部分」を本パーツで解消する
   ========================================================================== */
.c-price-table {
  width: 100%;
}

/* バッジ（メンズ=紺 / レディース=ピンク）実測 937:802=140×41 / 937:779=180×41 r8 */
.c-price-table__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 140px;
  height: 41px;
  margin: 0 auto;
  padding: 5px 40px 7px;
  margin-bottom: 30px; /* Figma実測: バッジ下端→表の上罫線=30（8/24同席確認②） */
  border-radius: 8px;
  color: #ffffff;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.45;
  /* Figmaは 40+文字幅+40 のぴったり設計（937:802=140/937:779=180）。
     実フォントは実測より数px広くなるため、折返しを止めて1行を保つ */
  white-space: nowrap;
}

.c-price-table__badge--men {
  background-color: #005ca7;
}

.c-price-table__badge--ladies {
  width: 180px;
  background-color: #feb2c7;
}

/* SPの表内横スクロール（羽毛布団SP=「スクロールできます」の指摘に対応）
   fs16/lh1.45 = Figma SP実測（futon 913系＝唯一の定義箇所・全数照合2026-08-28）。
   PC側は下方 min-width:769px で display:none＝SP専用要素 */
.c-price-table__scroll-note {
  margin: 0 0 8px;
  color: #828282;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.45;
  text-align: right;
}

.c-price-table__scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.c-price-table__table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

/* 見出し行: 上下に #5FCAFD 1px（実測 937:804/805）
   実測の帯高 51px（59296->59347・罫線2本込み）= lh34.8 + 上下7.1 + 2 */
.c-price-table__table thead th {
  padding: 7.1px 0;
  border-top: 1px solid #5fcafd;
  border-bottom: 1px solid #5fcafd;
  font-size: clamp(20px, 18.5142857143px + 0.380952381vw, 24px);
  font-weight: 700;
  line-height: 1.45;
  text-align: left;
  vertical-align: middle;
}

.c-price-table__table--head-main thead th {
  color: #005ca7;
}

.c-price-table__table--head-accent thead th {
  color: #5fcafd;
}

/* データ行: 20px/500 #333・**全行の下**に #CFCFCF 1px（最終行を含む） */
/* データ行の帯高は実測43px（罫線1px込み）= lh29 + 上下6.5 + 1 */
.c-price-table__table tbody th,
.c-price-table__table tbody td {
  padding: 6.5px 0;
  border-bottom: 1px solid #cfcfcf;
  color: #333333;
  font-size: clamp(16px, 14.5142857143px + 0.380952381vw, 20px);
  font-weight: 500;
  line-height: 1.45;
  text-align: left;
  vertical-align: middle;
}

/* 縞: 偶数行に #F3FBFF（実測 h43・deluxe/btob/shiminuki とも偶数行） */
.c-price-table__table tbody tr:nth-child(even) th,
.c-price-table__table tbody tr:nth-child(even) td {
  background-color: #f3fbff;
}

/* 中央線（2列型）: アイテム列と料金列の境界に縦 #CFCFCF
   実測 937:783/806 = 見出し行上端〜最終行下端まで連続 */
.c-price-table__table--2col thead th:first-child,
.c-price-table__table--2col tbody th {
  border-right: 1px solid #cfcfcf;
}

/* 2列型の列幅（実測 deluxe 451: アイテム側224 / 料金側227 ＝ ほぼ半々） */
.c-price-table__table--2col .c-price-table__col--1 {
  width: 49.67%; /* 実測 deluxe/shiminuki: 224/451 */
}

/* 法人向けは列の分割位置が異なる（実測 307/543） */
.c-price-table--btob .c-price-table__table--2col .c-price-table__col--1 {
  width: 56.54%;
}

/* 🔒 文字揃え（49件の指摘）＝実測で確定した規則:
   ・1列目（アイテム名）＝左揃え・列頭から一定の字下げ
     実測の字下げ: deluxe 57px / shiminuki 30px / btob 52px（表ごとに異なる）
   ・2列目（料金）＝**列の中央**（全行の中心が列中心と±2px以内で一致）
   ・見出しセルは2列とも左揃え（料金見出しは中央から+19.5px＝中央ではない） */
.c-price-table__table--2col tbody .c-price-table__col--1 {
  padding-left: 12.64%; /* 実測 deluxe 57/451 */
  text-align: left;
}

/* 1列目の字下げは表ごとに異なる（実測: shiminuki 30/451・btob 52/543） */
.c-price-table--shiminuki .c-price-table__table--2col tbody .c-price-table__col--1 {
  padding-left: 6.65%;
}

.c-price-table--btob .c-price-table__table--2col tbody .c-price-table__col--1 {
  padding-left: 9.58%;
}

.c-price-table__table--2col tbody .c-price-table__col--2 {
  text-align: center;
}

.c-price-table__table--2col thead .c-price-table__col--1 {
  padding-left: 12.64%; /* 実測 deluxe/shiminuki 57/451 */
}

.c-price-table__table--2col thead .c-price-table__col--2 {
  padding-left: 13.53%; /* 実測 61/451 */
}

.c-price-table--btob .c-price-table__table--2col thead .c-price-table__col--1 {
  padding-left: 20.63%; /* 実測 112/543 */
}

.c-price-table--btob .c-price-table__table--2col thead .c-price-table__col--2 {
  padding-left: 10.87%; /* 実測 59/543 */
}

/* 仕様型（羽毛布団・4列）。S-38（8/25指摘⑤）: 列幅の正は**表幅926に対する縦罫実測**
   （937:2534/2535/2536 = x451/607/1023・表257〜1183）＝194/156/416/160。
   旧値は総幅917基準の誤算で第4列が7px狭く、「価格（税込）」が左罫線に密着していた */
.c-price-table__table--spec .c-price-table__col--1 {
  width: 20.95%; /* 194/926 */
}

.c-price-table__table--spec .c-price-table__col--2 {
  width: 16.85%; /* 156/926 */
}

.c-price-table__table--spec .c-price-table__col--3 {
  width: 44.92%; /* 416/926 */
}

.c-price-table__table--spec .c-price-table__col--4 {
  width: 17.28%; /* 160/926 */
}

/* 🔒 仕様型の文字揃え＝**各セルとも列の中央**（実測: 見出し3件が中央±3px・
   本文も列中心付近に並ぶ。ずれは文字の外接矩形幅の差によるもの）。
   ただし「仕様」列の本文だけは左揃え（3行の左端が x76155 で揃っている） */
.c-price-table__table--spec thead th,
.c-price-table__table--spec tbody th,
.c-price-table__table--spec tbody td {
  padding-left: 0;
  text-align: center;
}

.c-price-table__table--spec tbody .c-price-table__col--3 {
  padding-left: 3.82%; /* 実測 35/917 */
  text-align: left;
}

/* S-38: 「価格（税込）」見出しはFigmaでは列中心より+12.5px右（罫線→文字25px・937:2528実測）。
   中央揃え+左paddingで内容box中心を+12.5pxへ寄せて再現（データ行44,000円は列中央=変更なし） */
.c-price-table__table--spec thead .c-price-table__col--4 {
  padding-left: 2.7%; /* 25/926 */
}

/* 仕様型の縦罫（3本・全行を貫く）実測 937:2534/2535/2536 */
.c-price-table__table--spec thead th:not(:last-child),
.c-price-table__table--spec tbody td:not(:last-child),
.c-price-table__table--spec tbody th {
  border-right: 1px solid #cfcfcf;
}

/* 仕様型は縞なし（実測: RECTANGLEの塗りが存在しない） */
.c-price-table__table--spec tbody tr:nth-child(even) th,
.c-price-table__table--spec tbody tr:nth-child(even) td {
  background-color: transparent;
}

/* 行結合セル（ベーシック／ラグジュアリー）は上下中央に置く
   実測: セルA 61753..61894 に対しラベル y61810（中央）/ セルB 61894..62176 に y62009 */
.c-price-table__table--spec tbody th[rowspan] {
  font-size: clamp(16px, 14.5142857143px + 0.380952381vw, 20px);
  font-weight: 700;
  vertical-align: middle;
}

.c-price-table__table--spec tbody th {
  font-weight: 700;
}

/* 仕様型の本文は18px（実測 937:2511 ほか。行高31px = 18*1.722） */
.c-price-table__table--spec tbody td {
  font-size: clamp(14px, 12.5142857143px + 0.380952381vw, 18px);
  line-height: 1.722;
}

/* 仕様型は行の高さが一定（実測: 61753/61894/62035/62176 ＝ 各141px・罫線込み）
   ＝paddingで作るとdescの行数で高さが変わるため、行の高さ自体を固定する */
.c-price-table__table--spec tbody tr {
  height: 141px;
}

.c-price-table__table--spec tbody th,
.c-price-table__table--spec tbody td {
  padding-top: 0;
  padding-bottom: 0;
}

/* 仕様型はSPで列を潰さない＝表内横スクロールで守る（意図的パターン・KENPIN_SOP） */
.c-price-table__table--spec {
  min-width: 680px;
}

/* サイズ列・価格列は折り返さない（実測 937:2522「シングル」/ 937:2515 は1行） */
.c-price-table__table--spec .c-price-table__col--2,
.c-price-table__table--spec .c-price-table__col--4 {
  white-space: nowrap;
}

@media (min-width: 769px) {
  .c-price-table__scroll-note {
    display: none;
  }
  .c-price-table__scroll {
    overflow-x: visible;
  }
  /* デラックス レディース表: PCのみ見出しが #5FCAFD（実測 937:762 / SPは #005CA7 = 983:2990） */
  .c-price-table--pc-accent-head .c-price-table__table--head-main thead th {
    color: #5fcafd;
  }
  /* PCは横スクロール不要＝実幅で組む */
  .c-price-table__table--spec {
    min-width: 0;
  }
}
/* ==========================================================================
   u-visually-hidden: 視覚的には隠すがスクリーンリーダーには読ませる
   用途: リンクの文脈補足（例「MAP」だけでは何の地図か分からない箇所）
   ========================================================================== */
.u-visually-hidden {
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  white-space: nowrap;
}

/* PCデザインにだけ改行指定がある文言用（SPは自然折返し・Figma実測に基づく） */
.u-br-pc {
  display: none;
}

/* SPデザインにだけ改行指定がある文言用（匠FV本文 913:7775 のようにPC/SPで改行位置が違う文言） */
.u-br-sp {
  display: inline;
}

@media (min-width: 769px) {
  .u-br-pc {
    display: inline;
  }
  .u-br-sp {
    display: none;
  }
}
/* c-contact-band__ja: Figma SP実測 fs20/lh29（19ページ一様・全数照合2026-08-28）。
   従来はline-height未指定（normal）＝照合不能だったため明示値化 */
@media (max-width: 768px) {
  .c-contact-band__ja {
    line-height: 1.45;
  }
}
/* 基底定義より後方に置く必要があるSP上書き（罠#1: 同一詳細度は後方勝ち）。
   c-voice の基底(§c-voice)・c-page-title の基底より後ろ＝ファイル末尾に集約 */
@media (max-width: 768px) {
  /* c-voice 見出し円＝Figma SP実測 29×29・gap10（deluxe/shiminuki両フレームで確認・
     42/24はPC実測値の漏れ＝ユーザー指摘 匠②と同根） */
  .c-voice__heading {
    gap: 10px;
  }
  .c-voice__bubble {
    width: 29px;
    height: 29px;
  }
  /* 見出し→1件目の間隔（ユーザー実機指摘 匠⑥・2026-08-29）:
     基底の30pxは「アーク外形ボックス」基準の実測だった。見えている**円写真**基準では
     Figma=88.4px（shiminuki 2630.4-2542 / deluxe 3276.4-3188 で小数点まで一致＝設計値）。
     実装は円をitem上端に置きアークが上へはみ出す構造のため、+58pxして円位置をFigmaに合わせる。
     2件目以降は隣接セレクタ(+)の50/50が勝つ＝変わらない（Figmaのアーク箱サイズ不統一により
     item間はFigma側78.8〜108でばらつく→実装102統一が正・§0②型） */
  .c-voice__item {
    margin-top: 88px;
  }
  /* FVタイトル内の全角括弧の空き半分を詰める（Figmaは約物詰めで組まれている・匠①）。
     Webフォント(Google Fonts版Zen Old Mincho)は palt/halt 非搭載＝font-feature-settingsは
     無効を実測済み → c-page-title.php が「」を span ラップし、ここで数値詰めする。
     PCは承認済みデザインのためSP限定（PCではspanは無スタイル＝描画不変） */
  .c-page-title__kakko-open {
    margin-left: -0.5em; /* 「 の左半分の空き */
  }
  .c-page-title__kakko-close {
    margin-right: -0.5em; /* 」 の右半分の空き */
  }
}
