/* PureNext LP v2 — 3ブロック（S01〜S07） */
:root{
  --navy:#1d3853;
  --navy2:#24466b;
  --blue:#2f6fd6;
  --blue-strong:#1e6ade;
  --bg-blue:#eef4fb;
  --bg-blue2:#dfeaf6;
  --card-blue:#f0f6fc;
  /* rev22: 縦の余白の物差しは この4つだけ。これ以外の新しい縦余白は作らない。
     章 216 … 前の章の中身の下端 → 次の章の大見出しの文字ボックス上端
     見出し 112 … 大見出しの青バー下端 → その章の中身の上端（色帯の上端→帯の中の見出し文字も同値）
     導入 32 … 「ピュアネクストなら」「だから」など、次のブロックにくっつく見出し → そのブロック
     カード 24 … 同じ章の中で並ぶカード同士の間隔（縦も横も） */
  --sp-chapter:216px;
  --sp-head:112px;
  --sp-lead:32px;
  --sp-card:24px;
  /* rev22: 出水口の衛生ブロックの「お悩み吹き出し」だけで使っていた注意色。
     rev22-r2 で吹き出しを廃止したため、現在どこからも参照していない（定義だけ残す） */
  --caution:#e98a3c;
  --caution-bg:#fff8f1;
  --caution-line:#f0c9a8;
  --caution-text:#5a3418;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{background:#fff}
body{
  font-family:"Noto Sans JP",sans-serif;
  color:var(--navy);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.page{width:1024px;margin:0 auto;background:#fff;overflow:hidden}
img{display:block}
.blue{color:var(--blue)}
/* rev22-QA: FAQ の語中改行（初期／手数料・井／戸水・ボ／タン）を止める。PC でも効かせる */
.nobr{white-space:nowrap}

/* ---------- S01 hero ---------- */
.hero{position:relative;width:1024px;height:500px;overflow:hidden}
.hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero__inner{position:relative;z-index:1;padding:44px 0 0 40px}
.hero__badge{color:var(--blue);font-size:15px;font-weight:800;letter-spacing:.06em}
.hero__title{
  margin-top:14px;color:var(--navy);
  font-size:44px;font-weight:900;line-height:1.32;letter-spacing:.02em;
}
.hero__sub{margin-top:16px;font-size:21px;font-weight:800;letter-spacing:.04em}
.hero__chips{margin-top:26px;list-style:none;display:flex;gap:8px}
/* rev18(修正2): 背景写真が明るい室内で白いため、白いチップが背景に溶けていた。
   カードの周りに淡い枠線を足して分離させる。枠線の色 #dce8f5 と影は、このページが既に持っている
   同じ性質のカード（.support__step ＝ 淡い色の帯の上に置いた白い小カード）と同一の値。
   新しい色は作っていない。box-sizing:border-box なので 74×94 の大きさは変わらない。 */
.chip{
  width:74px;height:94px;background:#fff;border-radius:10px;
  border:1px solid #dce8f5;
  box-shadow:0 4px 14px rgba(29,56,83,.16);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
}
.chip img{width:38px;height:38px;object-fit:contain}
.chip span{font-size:11px;font-weight:700;color:var(--navy);text-align:center;line-height:1.3}

/* ---------- S02 lead ----------
   「だから」見出しと同じリズム: 上に大きく・下は詰めて、次のセクションへ
   つながって見える余白にする */
/* rev22: 上＝章の変わり目（ヒーロー写真の下端→見出しの文字上端 216）／
   下＝導入見出しなので バー下端→intro カード上端 32 */
.lead{padding:var(--sp-chapter) 0 var(--sp-lead);display:flex;flex-direction:column;align-items:center;gap:20px}
.lead__title{font-size:38px;font-weight:800;letter-spacing:.22em;text-indent:.22em;color:var(--navy)}
.lead__bar{width:64px;height:4px;border-radius:2px;background:var(--blue)}

/* ---------- S03 intro ---------- */
.intro{
  /* rev22: 下マージン 16 → カード間隔 24 */
  position:relative;height:1018px;overflow:hidden;margin:0 8px var(--sp-card);border-radius:24px;
  background:linear-gradient(180deg,#ffffff 0%,#fbfbfa 30%,#f3f2f1 78%,#f1f0ef 100%);
}
.intro__panel{
  position:absolute;right:-30px;bottom:-28px;width:620px;height:auto;
  pointer-events:none;
  /* 影は付けない。PNGの縁が110pxのアルファフェードなので drop-shadow を掛けると
     半透明画素の後ろに影が透けて本体の顔が灰色に曇る（rev4の失敗） */
}
/* 本体の「後ろ」に敷く落ち影。img より先に描かれるので写真の不透明部分には
   一切かからず、輪郭の外側（左の背景側と接地側）にだけ影が出る */
.intro::after{
  content:"";position:absolute;left:0;bottom:0;width:100%;height:130px;
  background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.92));
  pointer-events:none;
}
.intro__title{
  position:relative;z-index:1;
  padding:88px 0 0 56px;
  font-size:46px;font-weight:900;line-height:1.55;letter-spacing:.02em;color:var(--navy);
}
/* rev22-r15: 見出しの下の一言（メモリ機能の .memory__sub と同じ様式＝青・太字）。
   見出し2行の下端（88+46×1.55×2≒231px）と図の上端 320px の間に置く */
.intro__sub{position:relative;z-index:1;margin:13px 0 0 56px; /* 第三者検品: .memory__sub と同じインク間隔 31px に */font-size:20px;font-weight:800;color:var(--blue);letter-spacing:.02em}
.intro__figure{position:absolute;left:80px;top:320px;display:flex;gap:112px;z-index:1}
.figure-label{font-size:20px;font-weight:800;color:var(--blue);letter-spacing:.1em}
/* 温度バー */
.temp__body{position:relative;margin-top:26px;height:480px}
.temp__bar{
  width:28px;height:480px;border-radius:14px;
  background:linear-gradient(180deg,#e8443a 0%,#ef7b31 30%,#f0a75c 48%,#9db9d6 68%,#2f7fe0 100%);
}
.temp__stops{position:absolute;left:0;top:0;height:100%;width:200px;list-style:none}
.temp__stop{position:absolute;left:0;display:flex;align-items:center;gap:14px}
.temp__stop i{
  width:14px;height:14px;border-radius:50%;background:#fff;
  margin-left:7px;box-shadow:0 1px 3px rgba(0,0,0,.18);
  position:relative;
}
.temp__stop i::after{
  content:"";position:absolute;left:19px;top:6px;width:12px;height:2px;background:currentColor;
}
.temp__stop span{font-size:19px;font-weight:800;margin-left:14px}
.temp__stop--hot{top:22px;color:#e8443a}.temp__stop--hot span{color:#e8443a}
.temp__stop--sayu{top:130px;color:#ef7b31}.temp__stop--sayu span{color:#ef7b31}
.temp__stop--w40{top:238px;color:#f09c3f}.temp__stop--w40 span{color:#f09a2e}
.temp__stop--room{top:346px;color:#8b98a6}.temp__stop--room span{color:#7d8b99}
.temp__stop--cold{top:446px;color:#2f7fe0}.temp__stop--cold span{color:#2f7fe0}
/* 取水量ルーラー */
.amount__unit{margin-top:8px;font-size:13px;font-weight:700;color:var(--blue)}
.amount__ruler{
  position:relative;margin-top:14px;height:452px;width:150px;
  border-left:2px solid #9db6d2;
  background:repeating-linear-gradient(
    180deg,
    #9db6d2 0,#9db6d2 1px,transparent 1px,transparent 22.6px
  );
  background-size:12px 100%;
  background-repeat:no-repeat;
}
.amount__mark{position:absolute;left:0;width:100%;height:0}
.amount__mark::before{content:"";position:absolute;left:0;top:-1px;width:22px;height:2px;background:#7f9dbf}
.amount__mark em{
  position:absolute;left:36px;top:-11px;font-style:normal;
  font-size:17px;font-weight:800;color:var(--navy);
}

/* ---------- S04 memory（S05と同じカード様式に統一） ---------- */
/* rev22: 下パディング 16 → カード間隔 24 */
.memory-wrap{padding:0 8px var(--sp-card);background:#fff}
.memory{
  position:relative;height:480px;border-radius:24px;overflow:hidden;
  background:var(--card-blue);
  display:flex;
}
.memory__text{padding:64px 0 0 56px;width:42%}
.memory__iconwrap{
  width:66px;height:66px;border-radius:50%;background:#4a90e2;
  display:flex;align-items:center;justify-content:center;margin-bottom:26px;
}
.memory__icon{width:36px;height:36px;filter:brightness(0) invert(1)}
.memory__title{font-size:35px;font-weight:900;line-height:1.5;color:var(--navy)}
.memory__sub{margin-top:18px;font-size:20px;font-weight:800;color:var(--blue)}
.memory__body{margin-top:20px;font-size:16px;line-height:1.9;color:#55677a;font-weight:500}
.memory__photo{position:absolute;right:0;top:0;width:58%;height:100%}
.memory__photo img{width:100%;height:100%;object-fit:cover;object-position:40% 50%}

/* ---------- S05 uv card ---------- */
.uvcard-wrap{padding:0 8px 0;background:#fff}
.uvcard{
  position:relative;height:480px;border-radius:24px;overflow:hidden;
  background:var(--card-blue);
  display:flex;
}
.uvcard__text{padding:64px 0 0 56px;width:42%}
.uvcard__icon{width:66px;height:66px;margin-bottom:26px}
.uvcard__title{font-size:35px;font-weight:900;line-height:1.5;color:var(--navy)}
.uvcard__sub{margin-top:18px;font-size:20px;font-weight:800;color:var(--blue)}
.uvcard__body{margin-top:20px;font-size:16px;line-height:1.9;color:#55677a;font-weight:500}
.uvcard__photo{position:absolute;right:0;top:0;width:58%;height:100%}
.uvcard__photo img{width:100%;height:100%;object-fit:cover}

/* ---------- S06 because ---------- */
/* rev15: 「だから」の青バーと青い帯の始まりが 57px しかなく詰まって見えたため、
   帯の始まり・波・01〜05・下段をまとめて +56px 下げた（バー→帯 57 → 113px＝物差しA 110px） */
/* rev22: 余白の物差しに載せ替えた。
   uvcard の下端 →「だから」の文字上端 = 章 216（margin-top）／
   バー下端 → 青い帯の上端 = 導入 32（背景の切替位置 246 → 111px）／
   帯の上端 → 01 の文字 = 見出し 112（.because__list の margin-top で調整）。
   下段（今までかけていた手間・リビング写真）は中身を動かさず、上が 79px 詰まったぶんだけ
   まるごと引き上げた（top 635 → 556 / 高さ 1282 → 1203）。 */
.because{
  position:relative;height:1203px;margin-top:var(--sp-chapter);
  background:linear-gradient(180deg,#ffffff 0px,#ffffff 111px,#e3edf8 111px,#e0eaf5 55%,#e5ebf2 100%);
  overflow:hidden;
}
/* 水面ラインは 01〜02 の行を横切る装飾。01〜05 の並びとの位置関係（39px 上）を保つ */
.because__water{position:absolute;left:0;top:176px;pointer-events:none}
.because__lead{padding-top:0;text-align:center;font-size:38px;font-weight:800;color:var(--blue-strong);letter-spacing:.22em;text-indent:.22em}
.because__leadbar{display:block;margin:20px auto 0;width:64px;height:4px;border-radius:2px;background:var(--blue)}
/* rev22: 162 → 136（帯の上端→01 の文字＝見出し 112 になる値） */
.because__list{position:relative;list-style:none;height:330px;margin-top:136px}
.because__item{position:absolute;display:flex;align-items:center;gap:18px}
.because__item i{
  width:44px;height:44px;border-radius:50%;border:2px solid var(--blue);
  color:var(--blue);font-style:normal;font-weight:700;font-size:19px;
  display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.5);
  flex:none;
}
.because__item span{font-size:35px;font-weight:900;color:#16324f;letter-spacing:.02em}
.because__item--l1{left:88px;top:8px}
.because__item--r1{left:560px;top:36px}
.because__item--l2{left:88px;top:118px}
.because__item--r2{left:560px;top:146px}
.because__item--l3{left:88px;top:228px}
/* rev22: 上が 79px 詰まったぶん、下段をまるごと引き上げ（中身は 1px も動かしていない） */
.because__lower{position:absolute;left:0;top:556px;width:100%;height:647px}
.because__room{
  position:absolute;right:0;top:6px;width:470px;height:641px;object-fit:cover;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 140px);
  mask-image:linear-gradient(90deg,transparent 0,#000 140px);
}
.because__badge{
  position:absolute;right:64px;top:196px;width:128px;height:128px;border-radius:50%;
  background:#fff;box-shadow:0 6px 18px rgba(29,56,83,.14);
  display:flex;align-items:center;justify-content:center;text-align:center;
  font-size:16px;font-weight:800;line-height:1.5;color:var(--navy);
  z-index:2;
}
.because__title{
  position:absolute;left:64px;top:80px;
  font-size:41px;font-weight:900;line-height:1.55;color:#16324f;
}
/* rev22: 発注主指示「矢印がウォーターサーバーに刺さってしまってるのが嫌。刺さらないように
   しながら、買う〜温度を合わせるまでの5つのサイズとバランスを整えて」。
   ・5枚の高さが 138/112/114/96/128 とばらばらだったのをやめ、全部を同じ枠（幅92px・
     写真スロット 84×104px）に入れて、下端で揃える（object-position 50% 100%）。
     画像は contain なので縦横比は保ったまま・拡大はしない。
   ・間隔は カード 24px。合計幅 = 92×5 + 24×4 = 556px（左端 56 → 右端 612）。
   ・矢印は 左 40px → 右端 628px（幅588）。先端の三角は全幅の 8%。
     628px は リビング写真の左フェード帯（554〜694）の中で、本体の輪郭には届かない。 */
.because__items{position:absolute;left:56px;top:268px;display:flex;align-items:flex-end;gap:var(--sp-card)}
.because__arrow{
  position:absolute;left:-16px;bottom:48px;width:566px;height:158px; /* rev22-QA: 先端 x=606・本体左輪郭 646 から 40px */
  background:linear-gradient(90deg,rgba(255,255,255,.45),rgba(255,255,255,.80));
  clip-path:polygon(0 26%,92% 26%,92% 0,100% 50%,92% 100%,92% 74%,0 74%);
}
.because__items figure{position:relative;width:92px;text-align:center;z-index:1}
.because__items img{
  width:auto;max-width:84px;height:96px;margin:0 auto; /* rev22-QA: 5点とも同じ高さ 96px（幅は比率のまま） */
  object-fit:contain;object-position:50% 100%;
  filter:drop-shadow(0 8px 10px rgba(29,56,83,.14));
}
/* rev22: 「温度を合わせる」は 15px で 105px あり 92px の枠に入らない。枠のまま中央寄せにすると
   はみ出したぶんが右にだけ出て写真と中心がずれるので、左右へ 16px ずつ逃がして中心を保つ */
.because__items figcaption{margin:16px -16px 0;font-size:15px;font-weight:700;color:#16324f;white-space:nowrap}

/* ---------- S07 kodawari（タイトル・目次セクション） ---------- */
/* rev15: 青い帯の終わり → 「こだわりの機能」が 93px と狭かったので物差しA(110px)へ */
/* rev22: 上＝帯の下端→eyebrow の文字上端 216（章の変わり目）／
   下＝目次ピルの下端→機能01カードの上端 112（見出し→中身） */
.kodawari{
  position:relative;padding:var(--sp-chapter) 0 var(--sp-head);text-align:center;background:#fff;
}
.kodawari__eyebrow{
  font-size:17px;font-weight:700;letter-spacing:.34em;text-indent:.34em;color:var(--blue);
}
.kodawari__title{
  margin-top:22px;font-family:"Noto Serif JP",serif;
  font-size:42px;font-weight:600;line-height:1.5;letter-spacing:.08em;color:var(--navy2);
}
.kodawari__title .num{font-size:52px}
.kodawari__bar{display:inline-block;margin-top:26px;width:64px;height:4px;border-radius:2px;background:var(--blue)}
.kodawari__index{
  margin-top:44px;list-style:none;
  display:flex;justify-content:center;gap:20px;
}
.kodawari__index li{
  display:flex;align-items:center;gap:14px;
  padding:16px 30px;background:#fff;border:1.5px solid #dbe7f4;border-radius:999px;
  box-shadow:0 4px 14px rgba(29,56,83,.06);
}
.kodawari__index i{
  width:38px;height:38px;border-radius:50%;border:2px solid var(--blue);
  color:var(--blue);font-style:normal;font-weight:700;font-size:16px;
  display:flex;align-items:center;justify-content:center;flex:none;
}
.kodawari__index span{font-size:18px;font-weight:700;color:var(--navy);white-space:nowrap}


/* ========== fragment g1 ========== */
/* ===========================================================
   PureNext LP v2 — グループ1（S08〜S10 こだわりの機能 01/02/03）
   接頭辞: feat
   =========================================================== */

/* rev22: 発注主指示「1つ1つの枠が上下の線がぼやけてたりして、なんか綺麗にはまってるように
   見えない。あと間隔も空いてるのか空いてないのか分からない中途半端な感じ」。
   原因は ①左の帯が左右と下端をグラデーション＋マスクで白へ溶かしていた（＝境界がぼやける）
   ②01/02/03 の間の余白が 0px（＝空いているのか分からない）の2点。
   対処: 3つを memory / uvcard と同じ「左右8px・角丸24px の白いカード」にして、
   カード同士は カード間隔 24px で離す。左の帯は単色・マスク無しにして端をはっきり出す。 */
.feat{
  position:relative;
  width:1008px;margin:0 8px;
  overflow:hidden;
  background:#fff;
  border:1px solid #e2e9f4;border-radius:24px;
}
.feat + .feat{margin-top:var(--sp-card)}
.feat01{height:529px}
.feat02{height:411px}
.feat03{height:444px}
/* rev22-r11(2026-09-03): 発注主指摘「03 だけ真ん中の色が変わる」→ 帯をカード全幅に（写真が右を覆う） */
.feat03 .feat__panel{width:100%}

/* 左の薄水色の縦帯（rev22: グラデーションとマスクをやめて単色・高さ100%に） */
.feat__panel{
  position:absolute;left:0;top:0;
  width:359px;height:100%; /* rev22-QA: 01/02 は写真が x367 から帯を覆うので、03 も同じ x367 で帯を終える */
  background:#f4f7fd;
  pointer-events:none;
}

/* --- 左カードの中身（番号・下線・見出し・本文） ---
   rev22: カードが左右8px内側に入ったぶん、文字の絶対座標（左59/61/62px）を
   変更前と同じ位置に保つため器ごと -9px 動かす（枠線1px を含む） */
.feat__text{position:absolute;left:-9px;top:0;width:377px;height:100%;z-index:1}

.feat__num{
  position:absolute;left:59px;
  font-size:56px;font-weight:400;line-height:1;letter-spacing:.01em;
  color:#2f6fd6;
}
.feat__rule{
  position:absolute;left:62px;
  display:block;width:50px;height:3px;border-radius:2px;background:#2f6fd6;
}
.feat__head{
  position:absolute;left:61px;
  line-height:1;font-weight:900;color:#0d2c5e;white-space:nowrap;
}
.feat__body{
  position:absolute;left:61px;
  font-weight:500;color:#383838;
}
/* ロングコピー内のキーワード強調（紺色本文＋青アクセントのトーンに合わせる） */
.feat__em{font-style:normal;font-weight:800;color:var(--blue)}

/* 01 */
.feat01 .feat__num{top:30px}
.feat01 .feat__rule{top:114px}
.feat01 .feat__head{top:137px;font-size:32px;line-height:1.3;letter-spacing:.05em;white-space:normal}
.feat01 .feat__body{top:242px;font-size:24px;line-height:44px;letter-spacing:.023em} /* rev22-r15: 5行→6行になったので 48→44（242+44×6=506 ≦ 527） */

/* 02 */
.feat02 .feat__num{top:45px}
.feat02 .feat__rule{top:124px}
.feat02 .feat__head{top:164px;font-size:32px;letter-spacing:.02em}
.feat02 .feat__body{top:227px;font-size:23px;line-height:45.5px;letter-spacing:.03em}

/* 03 */
.feat03 .feat__num{top:40px}
.feat03 .feat__rule{top:113px}
.feat03 .feat__head{top:137px;font-size:35px;letter-spacing:.01em}
.feat03 .feat__body{top:185px;font-size:23px;line-height:39px;letter-spacing:.025em}

/* --- S08 写真（動画） ---
   高さはセクションと同じ 529px にする。524px のままだと下端に 5px の白帯が残り、
   映像の下辺（実測 228,233,238）と地の白（255）の段差が線に見えていた。
   1294x1048 を 647x529 に cover で収めるので、左右が 3px ずつ切れるだけ（外周は白に溶けている帯）。
   プレースホルダの地色も #eef1f5 から白へ。映像の外周を白へ溶かしてあるので、
   読み込み前後で地色が変わらない。 */
/* rev22: カード化で内側の高さが 529 → 527px（枠線1px×2）になったので高さを 100% に。
   1294x1048 を cover で収める切り取りが 2px 変わるだけで、見た目は変わらない */
.feat01__photo{
  position:absolute;right:0;top:0;
  width:647px;height:100%;object-fit:cover;object-position:50% 50%;
  background:#fff;
}

/* --- S09 写真2枚 --- */
/* rev22: left:376px（1024px 基準）→ カードの右端基準に置き換え。
   あわせて top:5px・高さ401px をやめてカードの上下いっぱいに。カードに枠線が付いたことで、
   写真の上下に残っていた 5px の白い帯が「はまっていない隙間」として見えるようになったため */
.feat02__photos{position:absolute;right:0;top:0;height:100%;display:flex}
.feat02__mug{width:316px;height:100%;object-fit:cover;object-position:50% 50%;background:#eef1f5}
.feat02__glass{width:332px;height:100%;object-fit:cover;object-position:50% 50%;background:#eef1f5}

/* --- S10 中央の図（熱水1回 ＋ 冷水1回 ＝ 40℃設定温度） --- */
/* rev22: 中の要素の絶対座標を1つも触らずに図全体の見た目の位置を保つため、器を -9px 動かす */
.feat03__diagram{position:absolute;left:-33px;top:0;width:717px;height:100%;z-index:1} /* rev22-r12: 発注主指摘「写真にくっつきすぎ」→ 文字と写真の間の中央（x 368〜679）へ 24px 左に */

.feat__drop{position:absolute;top:140px;width:73px;height:122px}
.feat__dropline{position:absolute;left:0;top:0;display:block}
.feat__dropline path{fill:none;stroke-width:2}
.feat__drop--hot{left:392px}
.feat__drop--cold{left:495px}
.feat__drop--hot .feat__dropline path{stroke:#e8543c}
.feat__drop--cold .feat__dropline path{stroke:#2f8fe0}

.feat__droptext{
  position:absolute;left:0;top:50px;width:73px;
  text-align:center;font-size:19px;font-weight:700;line-height:26px;letter-spacing:.02em;
}
.feat__drop--hot .feat__droptext{color:#e0432c}
.feat__drop--cold .feat__droptext{color:#1a76c8}

.feat__op{
  position:absolute;top:184px;width:40px;height:40px;
  display:flex;align-items:center;justify-content:center;
  color:#3d3d3d;font-weight:500;line-height:1;
}
.feat__op--plus{left:459px;font-size:29px}
.feat__op--eq{left:565px;top:183px;font-size:28px;transform:scaleY(1.3)}

.feat__circle{
  position:absolute;left:604px;top:148px;
  width:99px;height:113px;border:2px solid #2f8fe0;border-radius:50%;
}
.feat__circletemp{
  position:absolute;left:0;top:27px;width:99px;text-align:center;
  font-size:29px;font-weight:800;line-height:1;letter-spacing:-.085em;color:#1a76c8;
}
.feat__circlelabel{
  position:absolute;left:0;top:63px;width:99px;text-align:center;
  font-size:15px;font-weight:700;line-height:1;letter-spacing:.02em;color:#1a76c8;
}

/* --- S10 写真 --- */
/* rev22: top:5px → 0（カードの右上角から素直に断ち落とす） */
.feat03__photo{
  position:absolute;right:0;top:0;
  width:307px;height:100%;object-fit:cover;object-position:50% 50%; /* rev22-QA: 01/02 と同じくカード高さいっぱい */
  background:#eef1f5;
}

/* S10 下端の水平線は発注主指示（2026-08-21 R2-2）で削除 */


/* ========== fragment g2 ========== */
/* PureNext LP v2 — g2: S11 お客様の声 / S12 価格 / S13 PFOS / S14 浄水性能 / S15 中間CTA */

/* ============ S11 お客様の声 ============ */
/* rev15: 機能03 → 「お客様の声」。帯の上端から見出しまで 54px しかなく詰まっていたので
   見出し以下を +56px 下げた（帯上端→見出し 110px＝物差しA） */
/* rev22: 余白の物差しに載せ替えた。
   機能03カードの下端 → 帯の上端 = 見出し 112（白地）／帯の上端 → 見出しの文字 = 112 ／
   注記の下端 → 帯の下端 = 112。帯の上下の端は、製品詳細・よくあるご質問の帯と同じ
   「はっきりした境界」に統一した（従来は上46px・下17pxのぼかし）。 */
.voice{
  position:relative;width:1024px;height:1333px;overflow:hidden;
  background:linear-gradient(180deg,#ffffff 0px,#ffffff 112px,#f2f5fb 112px);
}
.voice__head{
  position:absolute;left:138px;top:232px;width:740px;height:40px;
  display:flex;align-items:center;justify-content:center;gap:25px;
}
.voice__rule{flex:1;height:2px;background:#4a7ac9}
.voice__title{
  font-size:38px;font-weight:700;line-height:40px;letter-spacing:.204em;
  color:#0f57cf;white-space:nowrap;
}
/* rev22: 見出しを 79px 下げたぶん、カルーセルと注記も同じだけ下げて中の関係を保つ */
.voice__stage{position:absolute;left:0;top:304px;width:1024px;height:752px;overflow:hidden}

/* 横スライドのトラック。カードは全て同寸（660×752）・写真も同比率（660×442） */
.voice__track{
  position:absolute;left:0;top:0;height:752px;
  display:flex;gap:24px;will-change:transform;
}
.voice__track.is-anim{transition:transform .5s cubic-bezier(.33,.1,.22,1)}
.voice__slide{
  position:relative;flex:0 0 660px;width:660px;height:752px;
  border-radius:20px;background:#fff;overflow:hidden;
  box-shadow:0 10px 26px rgba(29,56,83,.12);
}
.voice__photo{
  width:660px;height:442px;object-fit:cover;object-position:50% 42%;display:block;
}
.voice__quote{
  position:relative;height:310px;background:#fff;
  /* rev22: 差し替えた文言の最長行「自動調乳器が欲しいけど、高いんですよね。”」が実測 537.7px。
     103/30 のままだと 527px で入らず6行になり、6行は 310px の箱に収まらない（46px×6＝276＋
     上余白30＝306 で段落間が取れない）。文字の列を 544px に広げて5行で収めた
     （左 103→92px。開き引用符は x=34〜72.6px なので 19px 空いている） */
  padding:30px 24px 0 92px;
}
.voice__quote p{
  font-size:25px;line-height:46px;color:#101d38;font-weight:500;letter-spacing:.02em;white-space:nowrap;
}
.voice__quote p + p{margin-top:19px}
.voice__mark{
  position:absolute;font-family:"Noto Serif JP",serif;font-weight:700;
  font-size:76px;line-height:1;color:#1b4a91;pointer-events:none;
}
.voice__mark--open{left:34px;top:27px}
/* 閉じ引用符は最終段落の末尾にインラインで置く（本文の行数がスライドごとに違うため絶対配置だと本文途中に見えてしまう） */
.voice__mark--close{
  position:relative;display:inline;
  /* line-height:0 で行の高さを増やさずに文末へ添える。
     top は実測値（76px の ” のインク中心を 25px 本文のインク中心に合わせる補正） */
  line-height:0;top:40.5px;margin-left:4px;
}
/* 待機中（左右）のカードはうっすら白をかけて中央を主役にする */
.voice__slide::after{
  content:"";position:absolute;inset:0;border-radius:20px;pointer-events:none;
  background:rgba(246,249,253,.55);opacity:1;transition:opacity .5s ease;
}
.voice__slide.is-active::after{opacity:0}

/* 前へ・次へ（白丸ボタン） */
.voice__nav{
  position:absolute;top:318px;width:95px;height:95px;border-radius:50%;
  background:#fff;border:0;padding:0;cursor:pointer;touch-action:manipulation;
  box-shadow:0 6px 18px rgba(29,56,83,.18);
  display:flex;align-items:center;justify-content:center;z-index:3;
  transition:transform .15s ease,box-shadow .15s ease;
}
.voice__nav:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(29,56,83,.24)}
.voice__nav i{
  display:block;width:24px;height:24px;
  border-top:5px solid #16336f;border-right:5px solid #16336f;
}
.voice__nav--next{left:894px}
.voice__nav--next i{transform:rotate(45deg);margin-left:-9px}
.voice__nav--prev{left:35px}
.voice__nav--prev i{transform:rotate(-135deg);margin-right:-9px}

/* 下の青リンク2行 */
.voice__note{
  /* rev15(WD検品②): 声のカード下端から 22px しかなくカードに生えて見えたので 64px へ */
  position:absolute;left:-6px;top:1120px;width:1024px;text-align:center;
  font-size:20px;line-height:33px;letter-spacing:.07em;font-weight:500;color:#1d55bd;
}
.voice__note a{
  display:inline-block;color:#1d55bd;text-decoration:none;
  border-bottom:2px solid #1d55bd;padding:0 2px 2px;
}
.voice__chev{
  display:inline-block;width:8px;height:8px;margin:0 0 3px 4px;vertical-align:middle;
  border-top:2px solid #1d55bd;border-right:2px solid #1d55bd;transform:rotate(45deg);
}

/* ============ S12 価格 ============ */
/* rev16(修正1): 「安全で綺麗なお水が毎日飲める」を次の濃紺PFOSブロックの導入見出しにする。
   価格行→見出しの文字＝物差しA(110px)まで空け、青バー下端→濃紺帯の上端＝物差しC(122px)まで詰める。
   中央寄せ(justify-content:center)だと上下が連動して片側だけ動かせないので、
   上下を padding で明示する形に変えた。上端(価格行の位置)は R15 から動かしていない。 */
.price{
  width:1024px;background:#fff;
  display:flex;flex-direction:column;align-items:center;
  /* rev17: 下の PFOS/浄水性能の2ブロックを非表示にしたので、次に来るのが S16 の殺菌カードに
     変わった。物差しC（青バーの下端→次の中身＝122px）を保つため 73px → 22px。
     22 + .uvdeep__card の top:100px ＝ 122px。
     rev18: 順序入れ替えで、バーの次に来るものが「白いカード」から「薄水色の帯」に変わった。
     このページはバー付き見出しの直後に色帯が来る箇所を2つ持っており（製品詳細・よくあるご質問）、
     どちらも バー下端→帯の始まり＝物差しA 110px。ここも同じ 110px に合わせる（22px → 110px）。
     見出しの上（物差しD＝217px・R16で発注主承認済み）は触っていない。 */
  /* rev22: 上＝お客様の声の帯の下端→価格の数字の行 216（章の変わり目。245 は数字の行ボックスが
     文字より 29px 上から始まるぶんの補正込み）／下＝「安全で綺麗な〜」は衛生ブロックの導入見出しなので
     バー下端→淡色パネルの上端 32（発注主指示「次の青い背景のブロックにもう少し近づけて」） */
  padding:245px 0 var(--sp-lead);
}
/* rev22-r15: お客様の声 → 価格の間の一言。章の変わり目（216）はそのまま、この見出しが 216 の位置に入り、
   見出し→価格の数字は物差しB（112）。数字の行ボックスは文字より 29px 上から始まるので 112-29=83 */
.price{padding-top:var(--sp-chapter)}
.price__solve{margin:0 0 83px;font-size:34px;font-weight:800;letter-spacing:.06em;text-indent:.06em;color:var(--navy);text-align:center}
.price__row{
  position:relative;top:-3px;padding-left:22px;
  display:flex;align-items:baseline;justify-content:center;
  font-family:"Noto Serif JP",serif;color:#0d5fcd;
}
/* 価格の下の見出し（.lead__title / .lead__bar と同じ様式） rev14 */
.price__title{
  /* rev16: 価格行→見出しの文字を 76px から物差しD(217px＝章の変わり目)へ。
     A(110px)だと下の 122px と拮抗して見出しが価格の締めに見える、とWD検品で実測指摘があったため。
     このページの他のバー付き見出し（製品詳細 上214/下132・よくあるご質問 上251/下134・
     お申し込みの流れ 上223/下123）と同じ 上:下≒1.8:1 に揃う */
  /* rev22: 213 → 216（章の変わり目）。発注主指示「安全できれいなお水が毎日飲める、の文字は
     もう少し下に」は、下の 110 → 32 と合わせてこの見出しを次のブロック側へ寄せることで満たす */
  margin-top:var(--sp-chapter);
  font-size:38px;font-weight:800;letter-spacing:.22em;text-indent:.22em;color:var(--navy);
}
.price__bar{
  display:block;margin-top:20px;width:64px;height:4px;border-radius:2px;background:var(--blue);
}
.price__label{font-size:40px;font-weight:500;letter-spacing:.1em;margin-right:12px;position:relative;top:-8px}
.price__num{font-size:117px;font-weight:400;line-height:1;letter-spacing:.055em}
.price__yen{font-size:37px;font-weight:500;margin-left:4px}
.price__tax{font-size:21px;font-weight:400;margin-left:6px}
/* rev21: 税込金額は控えめに（発注主指示）。この行が入るぶん「安全で綺麗な〜」の見出しも
   約40px下がる＝「もう少しだけ下に下げて」も同時に満たす */
.price__taxnote{
  margin:10px 0 0;padding-left:22px;text-align:center;
  font-size:17px;font-weight:400;letter-spacing:.06em;color:#8494a8;
}

/* ============ S13 PFOS ============ */
.pfos{width:1024px;height:732px;background:#fff;padding-top:49px}
.pfos__band{position:relative;width:1024px;height:683px;overflow:hidden;background:#001a33}
.pfos__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pfos__band::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(0,20,40,.82) 0%,rgba(0,20,40,.55) 42%,rgba(0,20,40,.12) 78%,rgba(0,20,40,.05) 100%);
}
.pfos__inner{position:relative;z-index:1;padding:75px 0 0 68px}
.pfos__title{
  font-family:"Noto Serif JP",serif;font-weight:500;
  font-size:58px;line-height:83px;letter-spacing:.08em;color:#fff;
}
.pfos__body{
  margin-top:21px;
  font-size:25px;line-height:45px;letter-spacing:.092em;font-weight:400;color:rgba(255,255,255,.93);
}
.pfos__so{
  margin-top:77px;margin-left:-68px;width:1024px;padding-left:28px;text-align:center;
  font-family:"Noto Serif JP",serif;font-weight:500;
  font-size:48px;line-height:1.2;letter-spacing:0;color:#fff;
}

/* ============ S14 安心の浄水性能 ============ */
.filter{
  position:relative;width:1024px;height:830px;overflow:hidden;
  background:linear-gradient(90deg,#ffffff 0%,#ffffff 48%,#f2f8ff 100%);
}
.filter__photo{
  position:absolute;left:493px;top:11px;width:590px;height:674px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 96px),linear-gradient(180deg,transparent 0,#000 36px,#000 93%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 96px),linear-gradient(180deg,transparent 0,#000 36px,#000 93%,transparent 100%);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
.filter__inner{position:relative;z-index:1;padding:108px 0 0 57px}
.filter__title{
  font-size:51px;font-weight:900;letter-spacing:.131em;color:#1355d5;line-height:1;
}
.filter__list{list-style:none;margin-top:45px;padding-left:3px}
.filter__list li{display:flex;align-items:flex-start;gap:16px}
.filter__list li + li{margin-top:17px}
.filter__ltxt{
  font-size:25.5px;line-height:40px;font-weight:700;letter-spacing:0;color:#14243d;
}
.filter__check{
  flex:none;width:26px;height:26px;margin-top:7px;border-radius:50%;
  border:2px solid #2a63c5;position:relative;
}
.filter__check::after{
  content:"";position:absolute;left:6px;top:5px;width:7px;height:12px;
  border-right:2.4px solid #2a63c5;border-bottom:2.4px solid #2a63c5;transform:rotate(42deg);
}
.filter__box{
  position:absolute;left:57px;width:463px;
  display:flex;align-items:center;
  background:#fdfdff;border:1.5px solid #d8e6f4;border-radius:14px;
}
.filter__box--1{top:436px;height:103px;padding-left:35px}
.filter__box--2{top:568px;height:89px;padding-left:34px}
.filter__icon{width:58px;height:58px;object-fit:contain;flex:none}
.filter__icon--doc{width:66px;height:66px}
.filter__boxtxt{margin-left:38px}
.filter__box--2 .filter__boxtxt{margin-left:29px}
.filter__boxhead{font-size:21px;font-weight:700;letter-spacing:.02em;color:#1550cc;line-height:26px}
.filter__boxsub{margin-top:8px;font-size:19px;font-weight:500;letter-spacing:.02em;color:#23303f;line-height:26px}
.filter__box--2 .filter__boxhead{font-size:23px}
/* rev16(修正2): 注記「※試験・表記内容は最終確認中」は発注主確定により削除（.filter__note を撤去）。
   絶対配置だったため、削除しても .filter（高さ830px固定）の中の他要素は1pxも動かない */

/* S15 中間CTA帯は revision14 で発注主指示により削除（.midcta* を撤去） */


/* ========== fragment g3 ========== */
/* PureNext LP v2 — g3（S16 出水口までしっかり殺菌 / S17 タンク3カード /
   S18 スペック＆その他機能 / S19 ストリップ2〜4 / S20 サポート帯）
   接頭辞: .hygiene .tanks .spec .strips .support のみ。グローバル定義なし。（rev19 で .uvdeep* は .hygiene* へ統合） */

/* ============================================================
   S16 衛生ブロック .hygiene（導入見出し → 3カード → 理由3行 → 解決見出し → 本文 → UV写真）
   ============================================================ */
/* rev19: 発注主指示（2026-08-23）「『見落とされがちな、出水口の衛生。』と『出水口までしっかり殺菌』が
   別のブロックに見えてしまっているので、同じブロックに見えるように」「『出水口までしっかり殺菌』の
   文字はこんなに大きくなくてよい」を受け、rev18 の3セクション（.uvband 202px / .tanks 552px /
   .uvdeep 1464px）を、ひとつの淡色パネル .hygiene に統合した。

   ・淡色 #f7f9fc を 1〜6 の全体に敷き、その上に白いカードを載せる形にした。
     ページが既に持っている「淡色の帯の中に白いカードを置く」構成（お客様の声・製品詳細・FAQ）と同じ型で、
     白＋余白 → 色カードのリズムから外れない。
   ・上の余白 104px は rev18 の帯（上端→見出しの文字 104px）をそのまま引き継いだ。
     直前の .price は padding-bottom 110px（物差しA）のままなので、バー下端→パネル上端も不変。
   ・下の余白 66px ＋ .spec の padding-top 151px ＝ 章の変わり目＝物差しD 217px（rev18 と同値）。 */
.hygiene{
  position:relative;width:1024px;box-sizing:border-box;
  background:#f7f9fc;
  /* rev22: 上＝パネル上端→導入見出しの文字 112（116 は文字が箱より 4px 上から始まるぶん込み）／
     下＝最後の写真の下端→パネル下端 112（71 ＝ 112 − 解決カードの内側の余白40 − 枠線1） */
  padding:116px 0 71px;
}

/* rev19: このブロック内の行送り（line-height）は倍率ではなく px 固定にしてある。
   倍率のままだと .hygiene の高さが 2300.74px という端数になり、これより下の全セクションが
   0.74px ずれた位置に描かれる（＝ページ末尾まで文字のアンチエイリアスが変わり、
   変更前との画素照合ができなくなる）。35px / 40px / 42px は倍率計算値（34.8 / 39.9 / 42.24）に
   最も近い整数で、見た目の行間は変わらない。合計で .hygiene の高さがちょうど 2301px になる。 */

/* 1. 導入見出し「実は見落とされがちな出水口の衛生」
   rev18 の帯見出し（29px/800・左右罫線・x=57〜967）と同じ様式のまま、
   絶対配置をやめて流し込みに変えただけ。文言だけ差し替えている。 */
.hygiene__lead{
  margin:0;padding:0 57px;
  display:flex;align-items:center;
}
.hygiene__lead::before,
.hygiene__lead::after{
  content:"";flex:1 1 auto;height:2px;background:#c2d2e8;
}
.hygiene__lead span{
  flex:0 0 auto;padding:0 20px;white-space:nowrap;
  font-size:29px;font-weight:800;letter-spacing:.04em;line-height:35px;
  color:#16273e;
}

/* 3. 出水口まわりで起きていること（rev22-r2・案1「縦の番号リスト＋つなぎ線」）
   発注主指示により、rev22 の「お悩み吹き出し3つ・横並び」を廃止した。理由は2つ:
     ①文言を「ユーザーの声」に寄せたが、この事実は読み手が知らない＝こちらが教える内容だった
     ②真上に3枚のカードが並んでいるのに、その下も横並び3つでは同じ形が2段続き、
       「3カード＝場所の説明 → 3行＝そこで起きている事実」という段の違いが読めない
   → 3行を1枚の白カードに縦に積み、カードの下端から1本の青い縦線で
     「ピュアネクストなら」→解決カードへ落とす。横に散っていた視線が1本にまとまる。
   カードの幅910px・左右57px・枠 #e2e9f4・角丸16 は、真上の3カード（.tanks__card）と同じ値。 */
.hygiene__facts{
  position:relative;box-sizing:border-box;
  /* 上の3カード → このカードは 64px（＝導入32×2）。rev22 の吹き出しと同じ間隔を引き継いだ */
  margin:calc(var(--sp-lead) * 2) auto 0;width:910px;
  padding:28px 36px;
  background:#fff;border:1px solid #e2e9f4;border-radius:16px;
}
/* カードの下端中央から下ろすつなぎ線。長さ 32px（＝導入）で、その先が「ピュアネクストなら」ピル */
.hygiene__facts::after{
  content:"";position:absolute;left:50%;bottom:-32px;margin-left:-1px;
  width:2px;height:32px;background:var(--blue-strong);
}
.hygiene__factshead{
  /* line-height は px 固定（このブロックの高さを整数に保つため。上の rev19 の注記と同じ理由） */
  margin:0;font-size:16px;font-weight:800;line-height:22px;letter-spacing:.06em;
  color:var(--blue-strong);
}
.hygiene__factslist{margin:0;padding:0;list-style:none}
.hygiene__fact{
  display:flex;align-items:center;gap:18px;
  padding:16px 0;
}
.hygiene__fact + .hygiene__fact{border-top:1px solid #e6edf7}
/* 青の丸番号。番号の下に文を積まず、番号の右に置く（読む順が1本になる） */
.hygiene__factnum{
  flex:0 0 auto;width:36px;height:36px;border-radius:50%;
  background:var(--blue-strong);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;font-weight:800;line-height:1;letter-spacing:.02em;
}
.hygiene__facttext{
  margin:0;font-size:20px;font-weight:500;line-height:1.6;letter-spacing:.02em;
  color:#1e3450;
  /* PC は1行で収まるが、SP では2行に折れる。そのとき「細／菌」「繁殖し／やすい」のように
     語の途中で割れるので、文節で折る指定を入れる（非対応ブラウザでは従来どおりで崩れない） */
  word-break:auto-phrase;
}

/* 3b. 悩み → 解決 をつなぐラベル（rev22 / rev22-r2）
   つなぎ線の下端がそのままピルの上端になるので margin-top は 0 でよいが、
   線とピルが触れて見えないように 32px（導入）ぶん線を伸ばし、ピルは線の直後に置く */
.hygiene__so{margin:var(--sp-lead) 0 0;text-align:center;line-height:0}
.hygiene__sopill{
  display:inline-block;margin:0;
  padding:12px 34px;border-radius:999px;background:var(--blue-strong);
  color:#fff;font-size:20px;font-weight:800;line-height:1.4;
  letter-spacing:.12em;text-indent:.12em;
}
.hygiene__sochev{display:block;margin:12px auto 0;color:var(--blue-strong)}

/* 4〜6. 解決の白カード（見出し・青バー・本文・UV写真）
   rev18 の .uvdeep__card と同じ 幅910px・左右57px基準・角丸30px・枠線 #e6edf7・
   上から白へ落ちるグラデーションを引き継ぎ、高さ固定＋絶対配置をやめて流し込みにした。
   （写真は白背景の実写なので、淡色の地に直接置くと白い矩形が浮く。白カードの中に置くのが正しい） */
.hygiene__solve{
  /* rev22: 110 → 導入 32（シェブロンの下端→解決カードの上端） */
  position:relative;margin:var(--sp-lead) auto 0;width:910px;box-sizing:border-box;
  padding:53px 37px 40px;
  border:1px solid #e6edf7;border-radius:30px;
  background:linear-gradient(180deg,#ffffff 0%,#fcfcfd 55%,#fafbfc 100%);
}
/* rev19: 44px/900 は h1（.hero__title 44px）と同格で「こんなに大きくなくてよい」と指摘された。
   帯見出し 29px より一段上・h1 より明確に下の 32px/900 に落とし、ブロック内の中見出しにした。 */
.hygiene__solvetitle{
  margin:0;
  font-size:32px;font-weight:900;line-height:42px;letter-spacing:.025em;
  color:#16273e;
}
.hygiene__solvebar{
  display:block;margin-top:22px;width:79px;height:4px;border-radius:2px;
  background:#2f6fd6;
}
/* rev19: 本文は 32px から 25px へ。見出しを 32px に下げたため、32px のままだと
   見出しと本文が同じ大きさになって上下関係が読めなくなる。25px はこのページが既に持つ本文の号数。 */
.hygiene__solvebody{
  margin:20px 0 0;
  font-size:25px;font-weight:500;line-height:1.62;letter-spacing:.04em;
  color:#1d3350;
}
.hygiene__solvephoto{
  display:block;margin:24px auto 0;width:620px;height:950px;
  object-fit:contain;
}
/* rev22-r13(2026-09-03): 第三者機関の試験結果（99.9%）。発注主「しっかり目立つように。これを打ち出したい」 */
.hygiene__proof{
  margin:32px auto 0;width:836px;padding:30px 32px 26px;box-sizing:border-box;text-align:center;
  background:#eef5fd;border:1.5px solid #c9dcf3;border-radius:20px;
}
.hygiene__prooflead{margin:0;font-size:22px;font-weight:700;line-height:1.4;letter-spacing:.04em;color:#1d3350}
.hygiene__proofnum{margin:4px 0 0;font-size:28px;font-weight:900;line-height:1.2;color:#16273e;
  display:flex;align-items:baseline;justify-content:center;gap:4px;flex-wrap:wrap}
.hygiene__proofnum em{font-style:normal;font-size:84px;font-weight:900;line-height:1;letter-spacing:-.03em;color:#1e6ade}
.hygiene__proofpct{font-size:40px;font-weight:900;color:#1e6ade;margin-right:8px}
.hygiene__proofnote{margin:14px 0 0;font-size:13px;font-weight:500;line-height:1.6;color:#4a5f75}

/* ============================================================
   S17  タンク3カード   高さ 520px
   ============================================================ */
/* rev15: 3カードが帯の上端 14px に張り付いて「上下がギュッ」だったので +32px 下げた
   （帯見出し→カード上端 78 → 110px＝物差しA）。帯・セクションの高さも同じだけ伸ばす */
/* rev19: 独立セクションから .hygiene の中の一要素へ。背景（淡色→白のグラデ）は .hygiene が
   持つようになったので手放し、高さはカードそのものの 440px に、上の余白 110px（物差しA）は
   margin-top に移した。カードの左右位置・大きさ・中身は 1px も変えていない
   （カード top:46 → 0、シェブロン top:203 → 157 は、その 46px ぶんを差し引いただけ）。 */
.tanks{
  position:relative;width:1024px;height:440px;margin-top:110px;
  background:none;
}
.tanks__card{
  position:absolute;top:0;height:440px;
  box-sizing:border-box;
  padding-top:30px;text-align:center;
  background:#fff;border:1px solid #e2e9f4;border-radius:16px;
  box-shadow:0 4px 14px rgba(29,56,83,.05);
}
/* rev22-QA: 3枚を 287px 等幅・間隔24 にして、真下の吹き出し3列と中心を一致させる（旧 275/275/318） */
.tanks__card--1{left:57px;width:287px}
.tanks__card--2{left:368px;width:287px}
.tanks__card--3{
  left:679px;width:287px;
  background:#fff;border:2px solid #1d6fe0;
}
.tanks__card--3 .tanks__photo{height:168px;margin-top:10px}
.tanks__card--3 .tanks__text--strong{margin-top:6px}
.tanks__card--3 .tanks__name{padding-right:56px}
.tanks__name{
  margin:0;font-size:28px;font-weight:800;line-height:1.2;letter-spacing:.01em;
  color:#2f6fd6;
}
.tanks__photo{
  display:block;margin:16px auto 0;width:238px;height:206px;object-fit:contain;
}
.tanks__photo--wide{width:259px} /* rev22-QA: カード幅 287 に合わせる */
.tanks__text{
  margin:24px 0 0;font-size:21px;font-weight:500;line-height:1.52;letter-spacing:.015em;
  color:#1e3450;
}
.tanks__text--strong{margin-top:10px;font-weight:700;line-height:1.8}
.tanks__note{
  margin:4px 0 0;padding:0 6px;text-align:left;
  font-size:14.5px;font-weight:500;line-height:1.7;letter-spacing:0; /* rev22-QA: 幅287に収める */
  color:#4a5f75;white-space:nowrap;
}
/* 右上の「対策が必要」バッジ */
.tanks__badge{
  position:absolute;right:12px;top:-20px;width:80px;height:80px;
  border-radius:50%;background:#1e6ade;
  display:flex;align-items:center;justify-content:center;
  text-align:center;line-height:1.35;
  font-size:15px;font-weight:700;color:#fff;letter-spacing:.02em;
  z-index:2;
}
/* カード間のシェブロン */
.tanks__chev{
  position:absolute;top:157px;width:16px;height:16px;
  border-top:3px solid #a9b6c6;border-right:3px solid #a9b6c6;
  transform:rotate(45deg);
}
.tanks__chev--1{left:348px}
.tanks__chev--2{left:659px}

/* ============================================================
   S18  スペック＆その他機能   高さ 1180px
   ============================================================ */
/* rev14: 見出しを中央寄せにし、上下の余白を広げた（1180px → 1330px）
   内訳 padding-top 12→96 / 見出し→バー 12→16 / バー→製品帯 25→94 */
/* rev15: 3カード下端 → 見出しが 162px しかなく、ページが持っているセクション境界の
   リズム（物差しD 217px）に届いていなかったため padding-top を 96 → 151px（高さも +55px） */
.spec{
  /* rev22: 衛生パネルの下端→見出しの文字＝章 216（222 は文字が箱より 6px 上から始まるぶん込み） */
  position:relative;width:1024px;background:#fff;padding-top:222px;padding-bottom:0;
  box-sizing:border-box;
}
/* WD検品を受けて .lead__title と完全に同じ様式へ（38px/800/字間.22em/紺・バー64×4・間隔20px） */
.spec__title{
  margin:0;text-align:center;
  font-size:38px;font-weight:800;line-height:1.15;
  letter-spacing:.22em;text-indent:.22em;color:var(--navy);
}
.spec__bar{
  display:block;margin:20px auto 0;width:64px;height:4px;border-radius:2px;
  background:var(--blue);
}

/* --- 製品帯 --- */
.spec__band{
  /* rev22: バーの下端→製品帯の上端 94 → 見出し 112
     rev22-r2: 見本（ch09_pA）どおり「幅」を本体の下に置くため、本体の下端（y=784）から
     ラベル下端（y=860）までの 76px が要る。旧 803px では本体の下に 19px しか無かったので
     帯の高さを 880px にした（本体・上側の要素の座標は 1px も動かしていない）。 */
  position:relative;margin-top:var(--sp-head);width:1024px;height:880px;overflow:hidden;
  background:
    linear-gradient(115deg,rgba(255,255,255,0) 38%,rgba(255,255,255,.55) 47%,rgba(255,255,255,0) 56%),
    radial-gradient(90% 70% at 18% 8%,#fdfeff 0%,rgba(253,254,255,0) 62%),
    linear-gradient(180deg,#ffffff 0%,#f8f8f9 42%,#f1f2f4 78%,#f6f7f8 96%,#fafafb 100%);
}
.spec__unit{
  position:absolute;height:780px;width:auto;
}
.spec__unit--white{left:152px;top:13px}
.spec__unit--black{left:432px;top:11px}

/* ============================================================
   rev22-r2  寸法表記（見本: FC製品資料 ch09_pA.png の描き方）
   ・引き出し線 … 1px の破線（実線4px / すき間3px）。本体の輪郭から寸法線まで
   ・寸法線     … 軸 1.5px ＋ 両端に 8px の矢じり（T字端ではなく矢印）
   ・ラベル     … 18px/700・単位だけ 13px。色は LP の青 #1e6ade のまま（見本の茶色は使わない）
   4方向の配置も見本どおり: 高さ＝本体の左 / 幅＝本体の下 / 注水スペース＝本体の右 /
   奥行＝本体の右下角から右下へ 45°
   ------------------------------------------------------------
   実測の基準（1024px 時・製品帯の中の座標）:
     白モデルの不透明部分 x 273〜461 / y 68〜784
     黒モデルの不透明部分 x 554〜742 / y 66〜782
   ============================================================ */

/* 破線の引き出し線 */
.spec__ext{position:absolute;color:#1e6ade}
.spec__ext--h{
  height:1px;
  background:repeating-linear-gradient(to right,currentColor 0 4px,transparent 4px 7px);
}
.spec__ext--v{
  width:1px;
  background:repeating-linear-gradient(to bottom,currentColor 0 4px,transparent 4px 7px);
}

/* 両端に矢じりのある寸法線 */
.spec__arw{position:absolute;color:#1e6ade}
.spec__arw::before,
.spec__arw::after{content:"";position:absolute;width:0;height:0;border-style:solid}
/* 横向き（左右に矢じり） */
.spec__arw--h{height:1.5px;background:currentColor}
.spec__arw--h::before{
  left:0;top:-3.25px;border-width:4px 8px 4px 0;
  border-color:transparent currentColor transparent transparent;
}
.spec__arw--h::after{
  right:0;top:-3.25px;border-width:4px 0 4px 8px;
  border-color:transparent transparent transparent currentColor;
}
/* 縦向き（上下に矢じり） */
.spec__arw--v{width:1.5px;background:currentColor}
.spec__arw--v::before{
  top:0;left:-3.25px;border-width:0 4px 8px 4px;
  border-color:transparent transparent currentColor transparent;
}
.spec__arw--v::after{
  bottom:0;left:-3.25px;border-width:8px 4px 0 4px;
  border-color:currentColor transparent transparent transparent;
}

/* ラベル */
.spec__dimlabel{
  position:absolute;margin:0;white-space:nowrap;
  font-size:18px;font-weight:700;line-height:1.45;letter-spacing:.02em;color:#1e6ade;
}
.spec__dimlabel em{font-style:normal;font-size:13px}

/* 高さ1200mm（白モデルの左）: 上端 y=68・下端 y=784 から左へ破線、x=212 に垂直の両矢印 */
.spec__ext--htop{left:196px;top:68px;width:76px}
.spec__ext--hbot{left:196px;top:784px;width:76px}
.spec__arw--height{left:212px;top:68px;height:716px}
/* 矢印の中心 y=426。行の高さ 26.1px なので上端は 413 */
.spec__lbl--height{left:60px;top:413px;width:128px;text-align:right}

/* 幅280mm（白モデルの下）: 左右の輪郭 x=273 / x=461 から下へ破線、y=818 に水平の両矢印 */
.spec__ext--wl{left:273px;top:790px;height:48px}
.spec__ext--wr{left:461px;top:790px;height:48px}
.spec__arw--width{left:273px;top:818px;width:188px}
.spec__lbl--width{left:273px;top:834px;width:188px;text-align:center}

/* 注水スペース 高さ250mm（黒モデルの右）: 開口の上下 y=253 / y=416 から右へ破線 */
.spec__ext--ntop{left:746px;top:253px;width:48px}
.spec__ext--nbot{left:746px;top:416px;width:48px}
.spec__arw--noz{left:772px;top:253px;height:163px}
/* 矢印の中心 y=334.5。2行（52.2px）なので上端は 308 */
.spec__lbl--noz{left:804px;top:308px}

/* 奥行370mm（黒モデルの右下角から45°）: 右下角 y=782 と、その 52px 上 y=730 から右へ破線。
   その2本の破線の間を 45°の両矢印が結ぶ（軸の長さ 73.54 = 52 × √2） */
.spec__ext--dtop{left:746px;top:730px;width:70px}
.spec__ext--dbot{left:746px;top:782px;width:96px}
.spec__arw--depth{
  left:764px;top:730px;width:73.54px;
  transform:rotate(45deg);transform-origin:left center;
}
.spec__lbl--depth{left:824px;top:790px}

/* rev22: 「受け皿 奥行160mm」（.spec__dimt-line / .spec__dimt-label）は
   発注主指示「スペックのとこから、受け皿の奥行は削除」により削除した。
   代わりに「奥行16cm」は S19「2 受け皿を外せる」のタグ（.strips__tag）へ移してある。 */

/* --- 機能ストリップ 1 --- */
/* rev15(WD検品③): 「奥行370mm」の下端からストリップ1まで 50px しかなく駆け足だったので物差しA(110px)へ
   rev21: 発注主指示「本体画像から1までの変な空白を修正」。製品帯(.spec__band)自体の下側にも
   余白が焼き込まれているため、マージンを 85→36px に詰めた */
.spec__strip{
  position:relative;margin:36px 0 0 57px;width:907px;height:250px;
  background:#f6f7fb;border-radius:16px;overflow:hidden;
}
.spec__num{
  position:absolute;left:40px;top:43px;margin:0;z-index:3;
  font-size:56px;font-weight:500;line-height:1;color:#1e6ade;
}
.spec__numbar{
  position:absolute;left:40px;top:99px;width:29px;height:2px;background:#1e6ade;z-index:3;
}
.spec__label{
  position:absolute;left:40px;top:96px;margin:0;z-index:3;white-space:nowrap;
  font-size:25px;font-weight:700;line-height:1.4;letter-spacing:.01em;color:#16273e;
}
.spec__lead{
  position:absolute;left:315px;top:131px;width:285px;height:2px;background:#1e6ade;z-index:2;
  transform-origin:left center;transform:rotate(-14deg);
}
.spec__lead i{
  position:absolute;right:-5px;top:-5px;width:12px;height:12px;box-sizing:border-box;
  border-radius:50%;background:#fff;border:3px solid #1e6ade;
}
.spec__photo{
  position:absolute;right:0;top:0;width:620px;height:250px;object-fit:cover;display:block;z-index:1;
}

/* ============================================================
   S19  ストリップ2〜4   高さ 1005px
   ============================================================ */
/* rev22: ストリップ同士の間隔を 20/20/19 → カード 24 に統一。
   高さは 4 のカード下端ちょうどで終わらせ、追加機能との 24px は追加機能側の上余白で作る */
.strips{position:relative;width:1024px;height:904px;background:#fff}
.strips__card{
  position:absolute;left:57px;width:907px;
  background:#f6f7fb;border-radius:16px;overflow:hidden;
}
.strips__card--2{top:24px;height:248px}
.strips__card--3{top:296px;height:304px}
.strips__card--4{top:624px;height:280px}

.strips__num{
  position:absolute;left:40px;top:33px;margin:0;z-index:3;
  font-size:56px;font-weight:500;line-height:1;color:#1e6ade;
}
.strips__numbar{
  position:absolute;left:40px;top:92px;width:29px;height:2px;background:#1e6ade;z-index:3;
}
.strips__label{
  position:absolute;left:40px;top:112px;margin:0;z-index:3;white-space:nowrap;
  font-size:25px;font-weight:700;line-height:1.5;letter-spacing:.01em;color:#16273e;
}

/* rev22: 発注主指示「受け皿を外せる、のところに、『奥行16cm』というのをココに持ってきて」。
   ラベル（top:112px・25px/1.5 ＝ 下端 149.5px）の 14px 下に置く */
.strips__tag{
  position:absolute;left:40px;top:164px;z-index:3;margin:0;
  display:inline-flex;align-items:baseline;
  padding:5px 16px;border:1.5px solid #1e6ade;border-radius:999px;background:#fff;
  font-size:16px;font-weight:700;letter-spacing:.02em;color:#1e6ade;white-space:nowrap;
}
.strips__tag em{font-style:normal;font-size:20px;margin:0 2px}

.strips__lead{
  position:absolute;height:2px;background:#1e6ade;transform-origin:left center;z-index:2;
}
.strips__lead i{
  position:absolute;right:-5px;top:-5px;width:12px;height:12px;box-sizing:border-box;
  border-radius:50%;background:#fff;border:3px solid #1e6ade;
}
/* rev22-r3: 発注主指示「終点の白丸が横の壁に付いている。受け皿そのものの上に置く」。
   カード座標で受け皿（白い格子のトレイ）の輪郭を実測（1024px・2倍撮影）した結果、
   トレイ上端の弧は x=450→y137.5 / 460→130 / 470→129 / 480→121 / 500→108、
   中央の丸穴は左上が (533,145)、格子面の下端は x=500 で y≈166、
   左下の指の上端は (426,151.5)。終点の白丸を (500,141) に置くと
   上のトレイ輪郭まで 22.9px・丸穴まで 28.5px・格子面の下端まで 19px・指まで 11.8px 空く
   （いずれも白丸の半径6pxを引いた値）。旧終点 (447,96) は壁の上だった。 */
.strips__lead--2{left:228px;top:135px;width:273.05px;transform:rotate(1.053deg)}
/* rev22-r3: 発注主指示で説明文とともに復活（rev22 以前と同じ値） */
.strips__lead--3{left:318px;top:137px;width:125px;transform:rotate(-1.4deg)}
/* rev22-r2: 発注主指示「指してるのが鍋本体になってるから、受け皿の白い部分にポイントを
   おいて線を引いて」。終点をカード座標 (540,248)＝写真の中の受け皿の白い前面に移した
   （旧 (569,156) は鍋の胴に重なっていた）。始点 (228,175)・長さ 320.4px・角度 13.17°で、
   線と鍋（＋木の取っ手）の最短距離は実測 15.1px、白丸の縁からでも 10.0px 空く */
.strips__lead--4{left:228px;top:175px;width:320.4px;transform:rotate(13.17deg)}

.strips__photo{
  position:absolute;left:286px;top:0;width:620px;height:100%;object-fit:cover;display:block;z-index:1;
}
.strips__photo--half{width:262px}
.strips__photo--a{left:339px}
.strips__photo--b{left:615px}
/* rev22-r3: 写真の上の注記ピル（.strips__cap）は、説明文（.strips__label）が
   戻ったことで役目が重複するため削除した（発注主指示） */

/* ============================================================
   S19b 追加機能リスト（rev21 新設・発注主指示）
   スペック1〜4のカードと同じ幅907px・左57pxに揃えた、チェックつきの3行 */
/* rev22（パターンA: アイコンカード2枚）
   チェックの3行リストは、ストリップ1〜4（番号＋写真の大きなカード）の直後に置くと
   「おまけの箇条書き」に見えて読み飛ばされる。同じ列幅の中で2枚のカードに分け、
   アイコンで何の機能か一目で分かるようにした。上の 24px は ストリップ4 → 追加機能（カード間隔）。 */
.extras{width:1024px;padding:calc(var(--sp-card) * 2) 0 0; /* rev22-QA: 番号リスト4つと別の仲間＝間隔2倍 */background:#fff}
.extras__list{
  margin:0 0 0 57px;padding:0;width:907px;list-style:none;
  display:flex;align-items:stretch;gap:var(--sp-card);
}
.extras__item{
  flex:1 1 0;min-width:0;
  display:flex;align-items:center;gap:20px;
  padding:28px 32px;background:#f6f7fb;border-radius:16px;
}
.extras__ico{
  flex:0 0 auto;width:64px;height:64px;border-radius:50%;background:#1e6ade;color:#fff;
  display:flex;align-items:center;justify-content:center;
}
.extras__ico svg{display:block;width:32px;height:32px}
.extras__head{
  margin:0;font-size:23px;font-weight:700;line-height:1.45;letter-spacing:.01em;color:#16273e;
}
.extras__body{
  margin:8px 0 0;font-size:15px;font-weight:500;line-height:1.7;letter-spacing:.01em;color:#4a5f75;
  word-break:auto-phrase;
}

/* ============================================================
   S23b 先行予約の注意バナー（rev21 新設・発注主指示）
   ============================================================ */
/* rev22: 上＝製品詳細の帯の下端→バナー 112（見出し→中身）／
   下＝バナー下端→よくあるご質問の文字が 216 になるよう、8px ＋ .sechead--faq の 208px */
.notice{width:1024px;padding:var(--sp-head) 0 8px;background:#fff}
/* rev22-r6(2026-09-03): 発注主指示「もうちょっと目立つように」。淡い箱 → 青地・白文字に */
.notice__box{
  margin:0 auto;width:872px;padding:32px 20px 30px;text-align:center;
  background:#1e6ade;border:2px solid #134a9e;border-radius:16px;
  box-shadow:0 8px 24px rgba(30,106,222,.22);
}
.notice__head{
  margin:0;font-size:28px;font-weight:900;letter-spacing:.04em;color:#fff;
}
.notice__body{
  margin:10px 0 0;font-size:17px;font-weight:600;letter-spacing:.03em;color:rgba(255,255,255,.92);
}

/* ============================================================
   S20  サポート帯   高さ 409px
   ============================================================ */
/* rev14: 見出しを .lead 様式（中央・字間.22em・青バー64×4）で外に出し、
   背景を白にして直後のアプリ帯（#f5faff）と別のまとまりに見せる（268px → 498px）
   上の余白96px／ステップ下の余白96pxで、白のまとまりを上下対称にしている */
/* rev15: バー→ステップ 96 → 122px（物差しC）、ステップ下端→アプリ帯 96 → 110px（物差しA）。
   R14 の「白のまとまりで分離する」設計はそのまま */
/* rev20(2026-08-31): 発注主指示「お申込みの流れのところのカードをもう少しカード高さ出してほしい」。
   カード高さ 140→180px、それに合わせてセクション高さ 538→578px。中の余白も比例で広げた。
   rev21: 発注主指示「カードをもう少し大きく・文字とアイコンも大きく・位置を揃える・①②③は不要」。
   カード 290x180 → 300x224、アイコン 72x56→104x80、文字 20→25px。番号バッジは削除。 */
/* rev22: バー下端→カード上端 112・カード下端→アプリ帯 112 に合わせて高さを 622 → 739 */
.support{position:relative;width:1024px;height:739px;background:#fff}

.support__head{
  /* rev22: 追加機能の下端→見出しの文字＝章 216（221 は文字が箱より 5px 上から始まるぶん込み） */
  position:absolute;left:0;top:221px;width:1024px;
  display:flex;flex-direction:column;align-items:center;
}
.support__flowtitle{
  margin:0;text-align:center;
  font-size:38px;font-weight:800;line-height:1.2;letter-spacing:.22em;text-indent:.22em;
  color:var(--navy);
}
.support__flowbar{
  display:block;margin-top:20px;width:64px;height:4px;border-radius:2px;background:var(--blue);
}

.support__steps{position:absolute;left:32px;top:403px;width:960px;height:224px}
.support__step{
  position:absolute;top:0;width:300px;height:224px;background:#fff;border-radius:14px;
  border:1px solid #dce8f5;box-shadow:0 4px 14px rgba(29,56,83,.06);
}
.support__step:nth-of-type(1){left:0}
.support__step:nth-of-type(2){left:330px}
.support__step:nth-of-type(3){left:660px}
.support__steprow{
  display:flex;align-items:center;justify-content:center;padding-top:42px;
}
.support__stepicon{width:104px;height:80px;object-fit:contain;display:block}
.support__steplabel{
  margin:28px 0 0;text-align:center;
  font-size:25px;font-weight:700;letter-spacing:.02em;color:#16273e;
}
.support__chev{
  position:absolute;top:104px;width:16px;height:16px;
  border-top:3px solid #a9b6c6;border-right:3px solid #a9b6c6;
  transform:rotate(45deg);
}
.support__chev:nth-of-type(1){left:307px}
.support__chev:nth-of-type(2){left:637px}


/* ========== fragment g4 ========== */
/* PureNext LP v2 — G4ブロック（S21〜S25） */

/* ============================================================
   S21 アプリ（画面は発注主支給の実物PNGを組み込み）
   ============================================================ */
/* rev15: 帯の上端から見出しまで 54px しかなく上下ともギュッとしていたので、
   見出し・カード・スマホ・右カラムをまとめて +56px 下げた（帯上端→見出し 110px＝物差しA）。
   見出し下端 → カード縁は 48px のままで、見本Aの「ピュアネクストなら → introカード縁 57px」と同じ詰め方 */
/* rev20(2026-08-31): 発注主指示「アプリの画像もう少し小さくてOK、このブロック自体の高さ減らしたいから」。
   スマホ画面 278×603 → 221×480（約0.8倍）に縮小し、カード高さ 634→534、
   セクション高さ 935→835 と 100px 詰めた。左右はカード内で均等になる位置へ置き直している。
   rev21: 発注主指示②「背景の水色枠が途中で切れ、下の水色背景と白い角丸が合っていない」
   → 水色をカード下端(788px)ぴったりで切っていたため、角丸と影が水色の外に出ていた。
   水色の終わりをカード下端+24pxの812pxへ延長。 */
.app{
  /* rev22: 帯の上端→見出しの文字 112／見出しの下端→白カード 112／カード下端→帯の下端 112。
     帯はセクションの下端でちょうど終わる（高さ 835 → 922） */
  position:relative;width:1024px;height:922px;
  background:#f5faff;
}
.app em{font-style:normal}
.app__title{
  position:absolute;left:0;top:113px;width:100%;text-align:center;
  font-size:36px;font-weight:900;line-height:1.4;letter-spacing:.01em;color:#1d3853;
}
/* アプリの話題転換に合わせて「Pure Nextアプリ」だけ青文字＋薄青のマーカー下塗り */
.app__title-em{color:var(--blue);background:linear-gradient(transparent 62%,#cfe6ff 62%)}
.app__card{
  /* rev15(WD検品④): 見出し下端→カードが 66px で、バー付き見出し（111〜122px）より短かったので 116px へ */
  position:absolute;left:14px;top:276px;width:996px;height:534px;
  background:#fff;border-radius:20px;box-shadow:0 4px 18px rgba(29,56,83,.05);
}

/* ---- 右カラム 3つの便利 ----
   rev21: 発注主指示①「アプリ画像と右の説明文の上下位置が合っていない」
   → スマホ画像の縦スパン(274〜766px・中心520px)に説明文ブロックの中心を厳密一致させた。
   行高 82→110px（3行=330px、top=520-165=355） */
.app__list{position:absolute;left:600px;top:313px;width:346px;list-style:none}
.app__row{position:relative;height:110px;display:flex;align-items:center}
.app__row + .app__row{margin-top:64px}
.app__row:not(:last-child)::after{
  content:"";position:absolute;left:0;bottom:-30px;width:346px;height:1px;
  background:repeating-linear-gradient(90deg,#b8d3e7 0 4px,transparent 4px 9px);
}
.app__ico{
  flex:none;width:82px;height:82px;border-radius:50%;background:#e8f1fb;
  display:flex;align-items:center;justify-content:center;
}
.app__ico img{width:42px;height:42px;object-fit:contain}
.app__lead{margin-left:23px;font-size:17px;font-weight:700;line-height:26px;color:#1d3853}

/* ---- スマホ本体（黒フレーム）＋実物スクリーン ---- */
.app__phone{
  position:absolute;top:296px;width:233px;
  background:#1b1c1e;border-radius:31px;padding:6px;
  box-shadow:0 12px 26px rgba(20,30,45,.28);
}
.app__phone--home{left:70px}
.app__phone--filter{left:315px}
.app__screen{
  width:221px;height:480px;object-fit:cover;border-radius:25px;display:block;background:#fff;
}

/* ============================================================
   S22a / S23a  セクション見出し（rev15 新設）
   「製品詳細」「よくあるご質問」を、カードの中の小さな文字から
   .lead__title / .lead__bar と同じ様式の独立見出しへ取り出したもの。
   字送り・太さ・色・バー寸法は .lead と同値（38px / 800 / 字間.22em / 紺 / バー64×4）。
   上余白は物差しD（セクション境界 217px）、下余白はバー→次の色帯が物差しA（110px）になる値。
   ============================================================ */
.sechead{
  background:#fff;
  display:flex;flex-direction:column;align-items:center;gap:20px;
}
.sechead__title{
  font-size:38px;font-weight:800;letter-spacing:.22em;text-indent:.22em;color:var(--navy);
}
.sechead__bar{width:64px;height:4px;border-radius:2px;background:var(--blue)}
/* rev22: 上＝前の帯の下端→見出しの文字＝章 216／下＝バーの下端→次の色帯の上端＝見出し 112 */
.sechead--detail{padding:var(--sp-chapter) 0 46px}
.sechead--faq{padding:208px 0 42px}

/* ============================================================
   S22 製品詳細表
   ============================================================ */
/* rev20(2026-08-31): 発注主指示「製品詳細が表はみ出てるからちゃんと整理して、表に収めたり整理して。
   立幅小さすぎてミチミチになってる。表の1列の高さも増やして。あと注意事項の上に薄い青の線はいってる」
   原因: .detail と .detail__card が固定高（348px / 267px）だったため、記入した内容が伸びると
   表がカードの下へ突き抜け、カードの下辺（1px #e9eff6 の薄い青線）が注意事項の行の上を横切っていた。
   対処: 高さを内容に合わせる（height:auto ＋ padding）／行の高さを padding で確保／
   行間を 1.1 → 1.75 に広げて詰まりを解消。 */
.detail{
  width:1024px;padding:76px 0 64px;
  background:linear-gradient(180deg,#ffffff 0 66px,#f5f8fd 66px);
}
.detail__card{
  margin:0 auto;width:872px;padding:14px 0 16px;
  background:#fff;border:1px solid #e9eff6;border-radius:12px;
  box-shadow:0 2px 12px rgba(29,56,83,.04);
}
.detail__table{margin:0 auto;width:812px;border-collapse:collapse;table-layout:fixed}
.detail__table th,
.detail__table td{
  padding:13px 0;font-size:13.5px;line-height:1.75;
  text-align:left;vertical-align:middle;
}
.detail__table tr:not(:last-child) th,
.detail__table tr:not(:last-child) td{border-bottom:1px solid #d8e2ee}
.detail__table th{
  width:186px;padding-left:14px;font-weight:500;color:#1d3853;
  border-right:1px solid #dde6f0;vertical-align:top;
}
.detail__table td{padding-left:30px;padding-right:14px;font-weight:400;color:#333}

/* ============================================================
   S23 よくあるご質問
   ============================================================ */
.faq{
  width:1024px;padding:70px 0 44px;
  background:linear-gradient(180deg,#ffffff 0 70px,#f6f9fe 70px);
}
/* rev15: カード内の見出し「よくあるご質問」は .sechead--faq へ取り出したため削除。
   上 24px ／ 下 14px＋項目の下マージン10px = 24px でカードの内側を上下対称にした */
.faq__card{
  margin:0 12px;padding:24px 0 14px;
  background:#fafcff;border-radius:20px;
}
.faq__list{list-style:none}
.faq__item{
  margin:0 20px 10px;
  background:#fff;border:1px solid #edf2f7;border-radius:10px;
  box-shadow:0 1px 4px rgba(29,56,83,.05);
  overflow:hidden;
}
.faq__qbtn{
  position:relative;display:flex;align-items:center;width:100%;height:46px;
  background:none;border:0;padding:0;cursor:pointer;text-align:left;
  font-family:inherit;
  /* スマホでのダブルタップ拡大待ち（約300ms）を無効化して体感即時にする */
  touch-action:manipulation;-webkit-tap-highlight-color:transparent;
}
.faq__q{
  flex:none;margin-left:23px;width:21px;height:21px;border-radius:50%;
  background:#1f79d9;color:#fff;font-size:11px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
.faq__text{margin-left:28px;font-size:16px;font-weight:700;color:#1d3853}
.faq__chev{
  position:absolute;right:23px;width:22px;height:22px;color:#2f7fd6;
  transition:transform .12s ease;
}
.faq__qbtn[aria-expanded="true"] .faq__chev{transform:rotate(180deg)}
.faq__a{
  padding:0 60px 16px 72px;
  font-size:14.5px;font-weight:500;line-height:1.9;color:#3d5166;
}
.faq__a p+p{margin-top:6px}

/* ============================================================
   S25 フッター
   ============================================================ */
.footer{
  /* rev22: FAQ の帯の下端→フッターの帯の上端 48 → 見出し 112（高さも同じだけ伸ばす） */
  width:1024px;height:536px;padding-top:var(--sp-head);
  background:linear-gradient(180deg,#ffffff 0 112px,#f6f9fd 112px);
}
.footer__band{position:relative;width:1024px;height:320px;overflow:hidden}
.footer__bandimg{width:1024px;height:320px;object-fit:cover;object-position:50% 45%}
.footer__copy{position:absolute;left:58px;top:78px}
.footer__lead{font-size:29px;font-weight:800;line-height:46px;color:#1d3853;letter-spacing:.01em}
.footer__logo{
  display:block;margin-top:14px;width:240px;height:auto; /* rev22-r14: 文字ロゴ → カラーのロゴ画像 */
}
/* rev16(修正6): フッターのブランド表記は「Pure Ne<span>X</span>t」と span で X だけ大きくしていた。
   統一先が PureNext（x は小文字）になったため span ごと撤去（.footer__logo-x を削除） */
/* rev20(2026-08-31): 発注主指示「最後のフッターのメニューはやっぱり非表示にして」。
   削除ではなく非表示。戻すときは display:none の行を消せば元どおり表示される。 */
.footer__nav{display:none;margin-top:28px;justify-content:center;gap:38px}
.footer__nav a{font-size:16px;font-weight:400;line-height:24px;color:#1d3853;text-decoration:none}
.footer__copyright{margin-top:20px;text-align:center;font-size:14px;line-height:20px;color:#98a4b0}