/* =========================================================
   LINE・Google 窓口設定の受付ページ（/・/shigyo/・/koumuten/・/jinzai/・/law/）の見た目
   ・案A′（2026-10-30 浜田さん選択）：地は白 #FFFFFF、段ごとにごく薄い灰 #F7F6F5 と交互。差し色は業種の色1色だけ
     士業 #1E3550・工務店 #4A3426・人材 #1F4E5F。切り替えは html（トップの札は札そのもの）の data-ind が --ac を1つ入れるだけ
     濃い面を明るくする所（ボタンのせり上がり・色が満ちる面）は --ac の上に白の薄い層を重ねる（色の変数を増やさない）
   ・文字＝濃い灰 #23262B。補足 #555A61（白 6.95:1・#F7F6F5 6.44:1）。業種の色は白の上で 9.1〜12.5:1
   ・書体＝見出しは明朝（しっぽり明朝 B1）・本文はゴシック（Noto Sans JP）・数字は Inter（先例と同じ組み）
   ・骨格＝先例の受付ページと同じ（PC は左に札・見出し・副文・料金の1行・入力欄、右にメニューの画像を印として）
   ・改行：文節の自動の折り（Chrome だけの仕組み）は使わない（iPhone で効かないため全廃の決まり）。
     見出しは句を手で組み（.hl）、本文は tools/build.mjs が句の切れ目に <wbr> を入れ、ここで keep-all にする
   ・使わない形：左の色の縦線・見出しの下の短い下線・薄い色の四角のアイコン・大きな角丸・影の強いカード・人物の絵
   ・角は 面4px・部品3px・札2px（弊社の基準）。区切りの線は1か所に1本
   ・動きは位置と形だけ（文字を薄くしない）。動きを減らす設定では止める
   ========================================================= */
:root {
  --ac: #1E3550;
  --bg: #FFFFFF;
  --bg-2: #F7F6F5;
  --tx: #23262B;
  --tx-2: #555A61;
  --line: #E3E1DE;        /* 段の中の区切りの線 */
  --field: #8A8F96;       /* 入力欄・選ぶボタンの枠（白の上 3.26:1） */
  --ph: #6B6F75;          /* 入力例の文字（白 5.05:1） */
  --err: #B42318;         /* 誤りの文と枠（白 6.57:1） */
  --err-bg: #FFF4F3;
  --lift: rgba(255, 255, 255, .16);   /* 業種の色の面を明るくする白の層 */
  --r-face: 4px; --r-part: 3px; --r-tag: 2px;
  --f-head: "Shippori Mincho B1", "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
  --f-body: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif;
  --f-num: "Inter", "Noto Sans JP", sans-serif;
}
[data-ind="shigyo"] { --ac: #1E3550; }
[data-ind="koumuten"] { --ac: #4A3426; }
[data-ind="jinzai"] { --ac: #1F4E5F; }

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; background: var(--bg); }
body {
  margin: 0; background: var(--bg); color: var(--tx);
  font-family: var(--f-body); font-size: 16px; line-height: 1.85; letter-spacing: .02em;
  -webkit-font-smoothing: antialiased;
  /* 句の切れ目（build.mjs が入れた <wbr>）でだけ折る。収まらない長さのときだけ字の途中で折る */
  word-break: keep-all; overflow-wrap: break-word; line-break: strict;
}
button, input, select { font: inherit; }
a { color: var(--ac); }
img { max-width: 100%; }
.kp { display: inline; }
.nw { white-space: nowrap; }  /* 金額（数字と円）を折らない */
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.wrap { max-width: 1200px; margin: 0 auto; padding: 0 40px; }

/* ---------- 上の帯（ロゴだけ・押す先は置かない＝先例と同じ） ---------- */
.top { padding: 26px 0 0; }
.top-logo { display: block; width: auto; height: 22px; }

/* =========================================================
   最初の画面（fv）：PC は左に札・見出し・副文・料金の1行・入力欄、右にメニューの画像（印）。
   スマホは 札→見出し→副文→料金の1行→入力欄の上の1行（無料）→メニューの画像（小さく）→入力欄
   （原稿 v3 の3章では画像が「無料」の1行の前。2026-10-31 浜田さん「案のとおり移す」で入れ替えた＝「無料」の1行が上から774px→548px で最初の画面に入る）
   ========================================================= */
.fv { padding: 40px 0 72px; }
.fv-in {
  display: grid; grid-template-columns: minmax(0, 600px) minmax(0, 1fr); column-gap: 64px;
  grid-template-areas: "tag vis" "h vis" "sub vis" "price vis" "lead vis" "form vis";
  grid-template-rows: auto auto auto auto auto 1fr;
}
.fv-tag { grid-area: tag; justify-self: start; margin: 0 0 18px; padding: 3px 11px 2px; border: 1px solid var(--ac); border-radius: var(--r-tag); color: var(--ac); font-size: 13.5px; font-weight: 700; letter-spacing: .06em; line-height: 1.7; }
.fv-h { grid-area: h; margin: 0; font-family: var(--f-head); font-weight: 700; font-size: 38px; line-height: 1.45; letter-spacing: .03em; color: var(--tx); }
.hl { display: inline-block; white-space: nowrap; vertical-align: top; clip-path: inset(-.25em -.8em -.3em -.8em); }
.hl-i { display: inline-block; }
.fv-sub { grid-area: sub; margin: 20px 0 0; font-size: 16px; line-height: 1.95; color: var(--tx); }
.fv-price { grid-area: price; margin: 18px 0 0; font-size: 17px; font-weight: 700; color: var(--ac); letter-spacing: .03em; }
.fv-price .num { font-family: var(--f-num); font-size: 26px; font-weight: 600; letter-spacing: .01em; }
.fv-vis { grid-area: vis; align-self: start; margin: 8px 0 0; }
.fv-vis img { display: block; width: 100%; height: auto; border-radius: var(--r-face); }
.fv-vis figcaption { margin-top: 8px; font-size: 13px; line-height: 1.7; color: var(--tx-2); }
.form-wrap { grid-area: form; }
/* 区切りの線と上の余白は、入力欄の枠から「無料」の1行へ移した（1行が枠の外に出たため・PC の見た目は前と同じ） */
.form-lead { grid-area: lead; margin: 30px 0 18px; padding-top: 26px; border-top: 1px solid var(--line); font-size: 16px; font-weight: 700; line-height: 1.8; color: var(--tx); text-wrap-style: balance; } /* 2行に分かれるとき「（無料）。」だけが残らないように（2026-10-30 士業の PC の撮影）。text-wrap の一括指定は使わない（nowrap を戻すため・web_ui §78） */

/* ---------- 入力 ---------- */
.lp-form { display: flex; flex-direction: column; gap: 20px; }
.fld { min-width: 0; margin: 0; padding: 0; border: 0; }
.fld-label { display: flex; align-items: center; gap: 8px; margin: 0 0 7px; padding: 0; font-size: 14.5px; font-weight: 700; color: var(--tx); letter-spacing: .04em; }
.tg { display: inline-block; font-size: 11px; font-weight: 700; line-height: 1.7; padding: 0 6px; border-radius: var(--r-tag); letter-spacing: .06em; }
.tg-req { background: var(--ac); color: #FFFFFF; }
.tg-opt { border: 1px solid var(--field); color: var(--tx-2); padding: 0 5px; }
.fld input {
  display: block; width: 100%; height: 52px; padding: 0 14px; margin: 0;
  border: 1px solid var(--field); border-radius: var(--r-part); background: #FFFFFF; color: var(--tx);
  font-size: 16px; font-weight: 500; letter-spacing: .02em;
  transition: border-color .15s cubic-bezier(.16, 1, .3, 1);
}
.fld input::placeholder { color: var(--ph); opacity: 1; font-weight: 400; }
.fld input:focus { outline: 2px solid var(--ac); outline-offset: 2px; border-color: var(--ac); }
.fld input.is-err { border: 2px solid var(--err); background: var(--err-bg); padding: 0 13px; }
.fld-hint { margin: 7px 0 0; font-size: 13.5px; line-height: 1.75; color: var(--tx-2); }
.fld-err { margin: 6px 0 0; font-size: 13.5px; font-weight: 700; color: var(--err); }
.fld-err[hidden], .form-msg[hidden] { display: none; }

/* 業務の別：並べたボタン（cv-ink の「色が満ちる」）。選ぶと業種の色が満ち、選んだままの間は満ちたまま（is-sel） */
.kind-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.kind-grid > .cv-ink:last-child:nth-child(odd) { grid-column: 1 / -1; }
.kind-grid .cv-ink { margin: 0; border: 1px solid var(--field); border-radius: var(--r-part); min-height: 52px; }
.kind-grid .cv-ink-layer { min-height: 50px; padding: 10px 14px; gap: 10px; }
.kind-grid .cv-ink-title { font-size: 15px; font-weight: 700; color: var(--ac); letter-spacing: .03em; line-height: 1.5; }
.kind-grid .cv-ink-over { background: linear-gradient(135deg, rgba(255, 255, 255, 0) 0%, var(--lift) 100%), var(--ac); }
.kind-grid .cv-ink-over .cv-ink-title { color: #FFFFFF; }
.kind-grid .cv-ink:focus-visible { outline: 2px solid var(--ac); outline-offset: 2px; }
.kind-grid .cv-ink.is-sel .cv-ink-over { clip-path: circle(var(--r, 600px) at var(--x, 50%) var(--y, 50%)); }
.kind-mark { flex: none; display: grid; place-items: center; width: 18px; height: 18px; margin-left: auto; color: var(--ac); }
.kind-mark svg { display: block; }
.cv-ink-over .kind-mark { color: #FFFFFF; }
.kind-grid .cv-ink:not(.is-sel) .kind-mark svg { visibility: hidden; }
.kind-grid.is-err .cv-ink { border: 2px solid var(--err); background: var(--err-bg); }

/* ボットの罠（人には見えない欄）。display:none だと読み飛ばすボットがあるので、画面の外へ出す */
.hp-trap { position: absolute !important; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }

.form-foot { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin-top: 4px; }
.form-msg { margin: 0; font-size: 14px; font-weight: 700; color: var(--err); }
.ts-box:empty { display: none; }
/* 送信ボタン（HP の動き #3・cv-motion の cv-btn）。球は付けない（案A′）。地は業種の色、乗せると白の層がせり上がる */
.lp-submit.cv-btn {
  --cv-btn-bg: var(--ac); --cv-btn-fg: #FFFFFF;
  --cv-btn-bg-hov: linear-gradient(var(--lift), var(--lift)), var(--ac); --cv-btn-fg-hov: #FFFFFF;
  --cv-btn-icon: 16px; --cv-btn-gap: 12px;
  min-width: 320px; min-height: 60px; padding: 0 30px; border-radius: var(--r-face);
  font-size: 17px; font-weight: 700; letter-spacing: .08em;
}
.lp-submit.cv-btn:focus-visible { outline: 2px solid var(--ac); outline-offset: 3px; }
.lp-submit[aria-busy="true"] { cursor: progress; }
.form-fine { margin: 2px 0 0; font-size: 13.5px; line-height: 1.8; color: var(--tx-2); }
.fine-link { color: inherit; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.fine-link:hover, .fine-link:focus-visible { color: var(--ac); }

/* ---------- 受付完了（fv の中身と入れ替える） ---------- */
.done { max-width: 760px; margin: 0 auto; padding: 48px 0 24px; text-align: center; }
.done[hidden] { display: none; }
.done-mark { display: grid; place-items: center; width: 64px; height: 64px; margin: 0 auto 26px; border-radius: 50%; background: var(--ac); color: #FFFFFF; }
.done-h { margin: 0; font-family: var(--f-head); font-weight: 700; font-size: 34px; line-height: 1.45; letter-spacing: .04em; outline: none; }
.done-p { margin: 18px 0 0; font-size: 16.5px; line-height: 1.95; color: var(--tx); }
.done-addr { display: block; margin: 6px 0 0; font-weight: 700; overflow-wrap: anywhere; }
body.is-done .fv-in { display: none; }

/* =========================================================
   下の段（設定の例・ご提供内容・ご利用の流れ・納品後の管理・料金・よくあるご質問）
   ========================================================= */
.sec { padding: 72px 0; }
.sec-alt { background: var(--bg-2); }
.sec-h { margin: 0 0 28px; font-family: var(--f-head); font-weight: 700; font-size: 28px; line-height: 1.5; letter-spacing: .05em; color: var(--tx); }
.sec-body { max-width: 760px; }
.sec p { margin: 0; }
.sec p + p { margin-top: 14px; }
.lst { margin: 14px 0 0; padding: 0; list-style: none; }
.lst li { position: relative; padding-left: 1.1em; }
.lst li + li { margin-top: 6px; }
.lst li::before { content: "・"; position: absolute; left: -.15em; top: 0; color: var(--tx-2); }
.note { margin-top: 18px !important; font-size: 14px; line-height: 1.8; color: var(--tx-2); }

/* 設定の例：メニューと流れ図の画像（読める大きさはこの段だけ） */
.ex-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 36px; align-items: start; margin-top: 32px; }
.ex-fig { margin: 0; }
.ex-fig img { display: block; width: 100%; height: auto; border-radius: var(--r-face); border: 1px solid var(--line); }
.ex-label { margin: 0 0 10px; font-size: 14px; font-weight: 700; line-height: 1.6; color: var(--ac); letter-spacing: .02em; }
.ex-fig figcaption { margin-top: 12px; font-size: 15px; line-height: 1.8; color: var(--tx); }

/* ご提供内容：番号は付けず、札と中身を横に並べる（3枚の同型カードにしない） */
.dlv-list { margin: 0; padding: 0; }
.dlv-row { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 24px; padding: 20px 0; border-top: 1px solid var(--line); }
.dlv-row:last-child { border-bottom: 1px solid var(--line); }
.dlv-row dt { margin: 0; }
.dlv-tag { display: inline-block; padding: 3px 10px 2px; border: 1px solid var(--ac); border-radius: var(--r-tag); color: var(--ac); font-size: 14px; font-weight: 700; letter-spacing: .04em; line-height: 1.7; }
.dlv-row dd { margin: 0; }
.dlv-after { margin-top: 22px !important; }

/* ご利用の流れ：番号（Inter の細字）と見出し・文 */
.flow-list { margin: 0; padding: 0; list-style: none; counter-reset: none; }
.flow-item { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 20px; padding: 22px 0; border-top: 1px solid var(--line); }
.flow-item:last-child { border-bottom: 1px solid var(--line); }
.flow-n { font-family: var(--f-num); font-weight: 300; font-size: 34px; line-height: 1.1; color: var(--ac); font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.flow-t { margin: 0 0 4px; font-size: 17px; font-weight: 700; line-height: 1.6; color: var(--tx); }
.flow-after { margin-top: 22px !important; }

/* 納品後の管理：責任の範囲の3行 */
.scope-h { margin: 30px 0 10px; font-size: 17px; font-weight: 700; color: var(--tx); letter-spacing: .04em; }

/* 料金 */
.price-tbl { width: 100%; max-width: 760px; border-collapse: collapse; }
.price-tbl th, .price-tbl td { padding: 16px 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; line-height: 1.75; }
.price-tbl thead th { padding: 0 0 10px; font-size: 13.5px; font-weight: 700; color: var(--tx-2); letter-spacing: .06em; border-bottom: 1px solid var(--tx-2); }
.price-tbl tbody th { width: 46%; padding-right: 24px; font-weight: 700; }
.price-tbl td .big { font-family: var(--f-num); font-size: 22px; font-weight: 600; color: var(--ac); letter-spacing: .01em; }
.price-tbl td .yen { font-weight: 700; color: var(--ac); }

/* よくあるご質問：問いと答えを並べる（開閉にしない＝全部見える） */
.faq-list { margin: 0; padding: 0; max-width: 860px; }
.faq-item { padding: 22px 0; border-top: 1px solid var(--line); }
.faq-item:last-child { border-bottom: 1px solid var(--line); }
.faq-q, .faq-a { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 8px; margin: 0; }
.faq-q { font-weight: 700; font-size: 16.5px; line-height: 1.75; }
.faq-a { margin-top: 10px; }
.faq-m { font-family: var(--f-num); font-weight: 600; font-size: 18px; line-height: 1.6; color: var(--ac); }
.faq-a .faq-m { color: var(--tx-2); }

/* =========================================================
   運営会社と足元（業種の色の面・暗い背景用のロゴ）
   ========================================================= */
.band { background: var(--ac); color: #FFFFFF; }
.maker { padding: 56px 0 30px; }
.maker-h { margin: 0 0 16px; font-size: 13.5px; font-weight: 700; letter-spacing: .1em; color: rgba(255, 255, 255, .86); }
.maker-row { display: flex; align-items: center; gap: 36px; }
.maker-logo { flex: none; display: block; width: 196px; height: auto; }
.maker-txt { min-width: 0; }
.maker-name { margin: 0; font-size: 15.5px; font-weight: 700; letter-spacing: .04em; }
.maker-p { margin: 4px 0 0; font-size: 14px; line-height: 1.8; color: rgba(255, 255, 255, .86); }
.maker-url { margin: 4px 0 0; font-size: 14px; }
.band a { color: #FFFFFF; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
/* 上下だけを決め、左右は同じ要素の .wrap に任せる（2026-10-31 CCO の指摘：padding の一括指定で .wrap の左右40pxが消え、足元だけ40px左にずれた。
   .wrap.foot にして、980px 以下の .wrap の一括指定にも上下を消されないようにする） */
.wrap.foot { padding-block: 30px 44px; }
.foot { border-top: 1px solid rgba(255, 255, 255, .24); display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 28px; font-size: 13.5px; color: rgba(255, 255, 255, .86); }
.foot p { margin: 0; }
.foot-links { display: flex; flex-wrap: wrap; gap: 6px 22px; }

/* トップと表記のページの足元（業種の色が1つに決まらないので、薄い灰の地） */
.foot-plain { background: var(--bg-2); }
.foot-plain .foot { border-top: 0; color: var(--tx-2); padding-top: 26px; }
.foot-plain a { color: var(--tx); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }

/* =========================================================
   トップ（/）：3業種への入口の札（cv-ink の「色が満ちる」・各業種の色）
   ========================================================= */
.home { padding: 64px 0 96px; }
.home-h { margin: 0 0 32px; font-family: var(--f-head); font-weight: 700; font-size: 30px; line-height: 1.5; letter-spacing: .05em; }
.home-list { display: flex; flex-direction: column; gap: 14px; max-width: 760px; }
.home-list .cv-ink { margin: 0; border: 1px solid var(--field); border-radius: var(--r-face); text-decoration: none; color: inherit; }
.home-list .cv-ink-layer { padding: 26px 26px; }
.home-list .cv-ink-title { font-size: 19px; color: var(--ac); }
.home-list .cv-ink-arrow { color: var(--ac); }
.home-list .cv-ink-over { background: linear-gradient(135deg, rgba(255, 255, 255, 0) 0%, var(--lift) 100%), var(--ac); }
.home-list .cv-ink-over .cv-ink-title, .home-list .cv-ink-over .cv-ink-arrow { color: #FFFFFF; }
.home-list .cv-ink:focus-visible { outline: 2px solid var(--ac); outline-offset: 3px; }

/* =========================================================
   特定商取引法に基づく表記（/law/）
   ========================================================= */
.law { padding: 56px 0 88px; }
.law-h { margin: 0 0 30px; font-family: var(--f-head); font-weight: 700; font-size: 30px; line-height: 1.5; letter-spacing: .05em; }
.law-tbl { width: 100%; max-width: 900px; border-collapse: collapse; border-top: 1px solid var(--tx-2); }
.law-tbl th, .law-tbl td { padding: 16px 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; line-height: 1.8; }
.law-tbl th { width: 30%; padding-right: 24px; font-weight: 700; font-size: 15px; }
.law-tbl td { font-size: 15.5px; }

/* =========================================================
   開いた瞬間の動き（位置だけ）。lp.js が html に is-anim を付けたときだけ動く
   ========================================================= */
html.is-anim .hl-i { animation: hl-rise 1.05s cubic-bezier(.16, 1, .3, 1) both; }
html.is-anim .hl:nth-child(1) .hl-i { animation-delay: .06s; }
html.is-anim .hl:nth-child(2) .hl-i { animation-delay: .18s; }
html.is-anim .hl:nth-child(3) .hl-i { animation-delay: .3s; }
@keyframes hl-rise { from { transform: translateY(1.9em); } to { transform: none; } }
html.is-anim .fv-sub, html.is-anim .fv-price { animation: lift .9s cubic-bezier(.16, 1, .3, 1) .42s both; }
html.is-anim .form-lead, html.is-anim .form-wrap { animation: lift .9s cubic-bezier(.16, 1, .3, 1) .54s both; }
@keyframes lift { from { transform: translateY(16px); } to { transform: none; } }
html.anim-done .hl-i, html.anim-done .fv-sub, html.anim-done .fv-price, html.anim-done .form-lead, html.anim-done .form-wrap { animation: none; }

/* =========================================================
   幅の狭い画面
   ========================================================= */
@media screen and (max-width: 1120px) {
  .fv-in { grid-template-columns: minmax(0, 560px) minmax(0, 1fr); column-gap: 44px; }
  .fv-h { font-size: 35px; }
}
@media screen and (max-width: 980px) {
  .wrap { padding: 0 24px; max-width: 720px; }
  .fv { padding: 32px 0 60px; }
  .fv-in { grid-template-columns: minmax(0, 1fr); grid-template-areas: "tag" "h" "sub" "price" "lead" "vis" "form"; grid-template-rows: none; }
  .fv-vis { justify-self: start; width: min(100%, 360px); margin: 0; }
  .form-wrap { margin-top: 26px; }
  .ex-grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .ex-flow { max-width: 460px; }
  .dlv-row { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .maker-row { flex-direction: column; align-items: flex-start; gap: 14px; }
  .maker-logo { width: 168px; }
  .sec { padding: 60px 0; }
}
@media screen and (max-width: 640px) {
  body { font-size: 15.5px; }
  .wrap { padding: 0 16px; }
  .top { padding-top: 18px; }
  .top-logo { height: 19px; }
  .fv { padding: 26px 0 52px; }
  .fv-tag { font-size: 12.5px; margin-bottom: 14px; }
  .fv-h { font-size: clamp(20px, 6.15vw, 30px); line-height: 1.5; }
  .fv-sub { font-size: 15.5px; margin-top: 16px; }
  .fv-price { font-size: 16px; }
  .fv-price .num { font-size: 23px; }
  .fv-vis { width: min(72%, 300px); }
  .form-wrap { margin-top: 22px; }
  .form-lead { font-size: 15.5px; margin-top: 24px; padding-top: 22px; }
  .kind-grid { grid-template-columns: minmax(0, 1fr); }
  .kind-grid > .cv-ink:last-child:nth-child(odd) { grid-column: auto; }
  .form-foot { align-items: stretch; }
  .lp-submit.cv-btn { width: 100%; min-width: 0; padding: 0 20px; }
  .done-h { font-size: 26px; }
  .done-p { font-size: 15.5px; }
  .sec { padding: 48px 0; }
  .sec-h { font-size: 23px; margin-bottom: 22px; }
  .flow-item { grid-template-columns: 50px minmax(0, 1fr); gap: 12px; }
  .flow-n { font-size: 28px; }
  .price-tbl tbody th, .price-tbl td { display: block; width: auto; padding-right: 0; }
  .price-tbl tbody th { padding-bottom: 2px; border-bottom: 0; }
  .price-tbl td { padding-top: 0; }
  .price-tbl thead { display: none; }
  .law-tbl th, .law-tbl td { display: block; width: auto; padding-right: 0; }
  .law-tbl th { padding-bottom: 2px; border-bottom: 0; }
  .law-tbl td { padding-top: 0; }
  .home { padding: 40px 0 64px; }
  .home-h, .law-h { font-size: 24px; }
  .home-list .cv-ink-layer { padding: 20px 18px; }
  .home-list .cv-ink-title { font-size: 17px; }
  .foot { flex-direction: column; gap: 6px; }
  .wrap.foot { padding-block-end: 36px; }
}

/* 動きを減らす設定：動かさない */
@media (prefers-reduced-motion: reduce) {
  html.is-anim .hl-i, html.is-anim .fv-sub, html.is-anim .fv-price, html.is-anim .form-lead, html.is-anim .form-wrap { animation: none; }
  .fld input { transition: none; }
}