/* ブレストケア京都 共通スタイル（トップページ改訂案から作成） */
/* トップページ改訂案 第2版。配色はロゴ基調（docs/color-proposal.html）、構成は「共感 → 基本 → 商品 → 流れ → 作り手 → 事例 → 質問 → 相談」 */
:root{
  --paper:#FBF1F3; --paper-2:#F5E3E8; --card:#FFFFFF; --rose-l:#F8DDE5;
  --ink:#4A3A33; --ink-2:#786157; --line:#E3CDD3; --field:#A08A93;
  --brown:#7A5F52; --footer:#5E4A41;
  --accent:#E10567; --accent-d:#C8035B; --accent-p:#A80350;
  --deco:#F1919D; --ribbon:#F5AFBF;
  --note-bg:#FFF4D6; --note-ink:#6B4E0E; --note-line:#D9B45A;
  --serif:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;
  --sans:"Noto Sans JP","Hiragino Sans","Yu Gothic",Meiryo,sans-serif;
  --latin:"Cormorant Garamond",serif;
  --wrap:1120px; --r:14px;
  --tool:#5E4A41; --hdr-bg:rgba(251,241,243,.95); --fv-bg:rgba(251,241,243,.9);
  --ft-strong:#FFFFFF; --ft-ink:#F3E9E3; --ft-sub:#E2D3C9; --ft-line:#76615A; --ft-copy:#D3C3B9;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:72px;-webkit-text-size-adjust:100%}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:2;letter-spacing:.02em;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:var(--accent-d);text-underline-offset:5px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--accent-d);outline-offset:4px}
h1,h2,h3,h4{color:var(--brown);text-wrap:balance;letter-spacing:.04em}
h2{font-family:var(--serif);font-weight:600;font-size:clamp(26px,3.2vw,36px);line-height:1.65}
h3{font-size:19px;line-height:1.7}
p+p{margin-top:12px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.nw{display:inline-block}
.sec{padding:clamp(64px,8vw,104px) 0}
.sec.alt{background:var(--paper-2)}
.sec.white{background:var(--card)}
.sec-head{display:grid;gap:18px;max-width:760px;margin-bottom:44px}
.sec-head .lead{color:var(--ink-2)}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:.14em;color:var(--accent-d)}
.grid{display:grid;gap:24px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:54px;padding:12px 30px;border-radius:999px;font-weight:700;font-size:16px;text-decoration:none;border:2px solid transparent;text-align:center;line-height:1.5}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-d);text-decoration:none}
.btn-primary:active{background:var(--accent-p)}
.btn-ghost{background:var(--card);color:var(--brown);border-color:var(--brown)}
.btn-ghost:hover{background:var(--rose-l);text-decoration:none}
.tlink{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-weight:700;color:var(--brown);text-decoration:underline;text-decoration-color:var(--deco);text-underline-offset:7px}
.tlink:hover{color:var(--accent-d)}
.actions{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center;margin-top:32px}
.todo{background:var(--note-bg);color:var(--note-ink);padding:1px 6px;border-radius:4px;font-size:.92em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.ph{position:relative;border-radius:var(--r);overflow:hidden;background:linear-gradient(135deg,#F3E1E6,#F9EEF1 45%,#EED6DD);aspect-ratio:4/3}
.ph img{width:100%;height:100%;object-fit:cover}
.ph .tag{position:absolute;right:10px;top:10px;background:rgba(255,255,255,.9);color:var(--ink-2);font-size:11px;padding:2px 8px;border-radius:6px;line-height:1.6}
.ph.empty{display:grid;place-items:center;text-align:center;padding:20px;border:1.5px dashed var(--field);color:var(--ink-2);font-size:13px;line-height:1.8}
.ph.empty b{display:block;color:var(--brown);font-size:15px;margin-bottom:4px}

/* 見直しメモ */
.memo{margin-top:32px;background:var(--note-bg);color:var(--note-ink);border-left:3px solid var(--note-line);border-radius:6px;padding:14px 18px;font-size:13.5px;line-height:1.8}
.memo>b{display:block;margin-bottom:2px}
.memo ul{padding-left:1.2em}
body.hide-notes .memo{display:none}
.memo-toggle{position:fixed;left:16px;bottom:16px;z-index:60;background:var(--tool);color:#fff;border:0;border-radius:999px;padding:10px 18px;font:inherit;font-size:13px;font-weight:700;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.18)}

/* 共通ヘッダー（全ページと同じ） */
.hdr{position:sticky;top:-97px;z-index:50;background:var(--hdr-bg);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);line-height:1.6}
.hdr>.wrap{display:flex;align-items:center;gap:24px;height:96px}
.hdr .logo{display:block;flex-shrink:0}
.hdr .logo img{height:64px;width:auto;max-width:none}
.hdr-cta{display:flex;align-items:center;gap:16px;margin-left:auto}
.tel{text-decoration:none;text-align:right;line-height:1.25;color:inherit}
.tel b{display:block;font-family:var(--latin);font-size:26px;letter-spacing:.06em;color:var(--brown);font-weight:500}
.tel small{display:block;font-size:12px;color:var(--ink-2)}
.gbar{border-top:1px solid var(--line)}
.gbar .wrap{display:flex;align-items:center;gap:24px;height:52px}
.gnav{display:flex;gap:26px;font-size:15px}
.gnav a{display:inline-flex;align-items:center;gap:5px;color:var(--brown);font-weight:500;text-decoration:none;white-space:nowrap}
.gnav a:hover{color:var(--accent-d)}
.gnav a[aria-current="page"]{color:var(--accent-d);font-weight:700}
.gnav .ic-home{flex:none;margin-top:-2px}
.gbar .btn{margin-left:auto;min-height:0;padding:8px 22px;font-size:14px;white-space:nowrap}
.menu-btn{display:none;align-items:center;gap:8px;background:transparent;border:1.5px solid var(--line);border-radius:999px;padding:8px 14px;font-family:var(--sans);font-size:13px;font-weight:700;color:var(--ink);cursor:pointer;white-space:nowrap;flex-shrink:0}
.menu-btn span{width:16px;height:10px;border-top:2px solid var(--brown);border-bottom:2px solid var(--brown);position:relative}
.menu-btn span::after{content:"";position:absolute;left:0;right:0;top:2px;border-top:2px solid var(--brown)}
.spmenu{position:sticky;top:72px;z-index:49;background:var(--paper);border-bottom:1px solid var(--line);max-height:calc(100vh - 72px);overflow:auto;padding:16px 0 24px;box-shadow:0 12px 24px rgba(74,58,51,.08);line-height:1.6}
.spmenu[hidden]{display:none}
.sm-cta{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.sm-cta .btn{padding:12px 10px;min-height:0}
.sm-grp{border-top:1px solid var(--line);padding:12px 0}
.sm-grp h4{font-family:var(--serif);font-size:13px;color:var(--accent-d);font-weight:600;margin-bottom:4px;letter-spacing:.06em}
.sm-grp a{display:block;text-decoration:none;padding:8px 0;font-size:15px;color:var(--ink)}
.sm-grp a::before{content:"›";color:var(--accent-d);margin-right:8px}
@media (max-width:1180px){.gnav{gap:18px;font-size:14px}}
@media (max-width:1060px){.gnav{gap:13px;font-size:13.5px}.gbar .btn{padding:8px 16px}}
@media (max-width:960px){
  .hdr{top:0}
  .gbar{display:none}
  .hdr>.wrap{height:72px}
  .hdr .logo img{height:50px}
  .menu-btn{display:inline-flex}
}
@media (max-width:760px){.hdr-cta .tel{display:none}}
@media (max-width:600px){
  .hdr>.wrap{height:64px;gap:10px}
  .hdr .logo img{height:42px}
  .spmenu{top:64px;max-height:calc(100vh - 64px)}
  .menu-btn{padding:7px 11px}
}
@media (max-width:380px){.hdr .logo img{height:36px}}

/* お知らせ帯 */
.notice{background:var(--brown);color:#fff;line-height:1.7}
.notice .wrap{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:center;justify-content:space-between;padding-top:14px;padding-bottom:14px;font-size:14.5px}
.notice .lbl{display:inline-block;background:var(--ribbon);color:var(--ink);font-size:12px;font-weight:700;border-radius:999px;padding:1px 12px;margin-right:10px}
.notice a{color:#fff;font-weight:700}

/* 1 メインビジュアル */
.hero{padding:clamp(48px,7vw,96px) 0}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center}
.hero .kicker{font-size:14px;font-weight:700;letter-spacing:.08em;color:var(--accent-d);margin-bottom:22px}
.hero h1{font-family:var(--serif);font-weight:600;font-size:clamp(30px,4vw,48px);line-height:1.65}
.hero .body{margin-top:26px;max-width:34em;font-size:clamp(16px,1.4vw,17.5px)}
.hero .body span{display:block}
.hero .reassure{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px;list-style:none;font-size:13.5px;line-height:1.6}
.hero .reassure li{background:var(--card);border:1px solid var(--line);border-radius:999px;padding:6px 14px}
.hero .ph{aspect-ratio:4/5}

/* 2 どんな時間を（共感）＋ まず知っておきたいこと */
.wishes .layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,72px);align-items:start}
.wishes .intro{margin-top:22px;color:var(--ink-2)}
.wlist{list-style:none;border-top:1px solid var(--line)}
.wlist li{padding:22px 0;border-bottom:1px solid var(--line)}
.wlist .lbl{display:block;font-size:13px;font-weight:700;letter-spacing:.06em;color:var(--accent-d);margin-bottom:6px}
.wlist h3{font-size:18.5px;line-height:1.75}
.wlist p{margin-top:8px;font-size:15px;color:var(--ink-2)}
.wnote{margin-top:20px;font-size:14px;color:var(--ink-2)}
.basics{margin-top:64px}
.basics h3.ttl{font-family:var(--serif);font-weight:600;font-size:22px;margin-bottom:20px}
.qcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:26px;display:flex;flex-direction:column;gap:10px}
.qcard h4{font-size:18px}
.qcard p{font-size:15px}
.qcard .tlink{margin-top:auto;font-size:15px}

/* 3 商品と価格 */
.try{display:grid;grid-template-columns:280px minmax(0,1fr);background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;color:inherit}
.try .ph{border-radius:0;aspect-ratio:auto;min-height:200px}
.try .body{padding:26px 32px;display:flex;flex-direction:column;gap:6px;justify-content:center}
.try .step{font-size:12.5px;font-weight:700;letter-spacing:.12em;color:var(--accent-d)}
.try h3{font-size:20px}
.try p{font-size:15px;color:var(--ink-2)}
.try .go{font-weight:700;color:var(--brown);text-decoration:underline;text-decoration-color:var(--deco);text-underline-offset:6px;margin-top:4px}
.try:hover{border-color:var(--deco)}
.pgroup{display:grid;grid-template-columns:240px minmax(0,1fr);gap:28px;margin-top:48px;padding-top:40px;border-top:1px solid var(--line)}
.ghead{display:flex;flex-direction:column;gap:10px;align-self:start;position:sticky;top:76px}
.ghead .gno{font-family:var(--latin);font-size:36px;line-height:1;color:var(--deco)}
.ghead h3{font-family:var(--serif);font-weight:600;font-size:22px;line-height:1.55}
.ghead p{font-size:14.5px;color:var(--ink-2)}
.gitems{display:grid;gap:20px}
.pitem{display:grid;grid-template-columns:220px minmax(0,1fr);background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.pitem .ph{border-radius:0;aspect-ratio:auto;min-height:220px}
.pitem .ph.empty{border:0;border-right:1.5px dashed var(--field)}
.pitem .body{padding:24px 28px 26px;display:flex;flex-direction:column;gap:4px}
.pitem .use{font-size:13px;font-weight:700;color:var(--accent-d);letter-spacing:.06em}
.pitem h4{font-size:20px;line-height:1.6}
.pitem .txt{font-size:15px;color:var(--ink-2);margin-top:4px}
.price{font-family:var(--latin);font-size:34px;color:var(--accent);line-height:1.2;font-variant-numeric:tabular-nums;margin-top:8px}
.price small{font-family:var(--sans);font-size:13px;color:var(--accent-d);margin-left:4px}
.opts{list-style:none;margin:10px 0 4px;border-top:1px solid var(--line)}
.opts li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 16px;align-items:baseline;padding:10px 0;border-bottom:1px solid var(--line);font-size:14.5px;line-height:1.7}
.opts li b{font-variant-numeric:tabular-nums;white-space:nowrap}
.opts li small{grid-column:1;color:var(--ink-2);font-size:12.5px}
.pitem .tlink{margin-top:8px;font-size:15px;align-self:flex-start}
.pnotice{margin-top:32px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px 24px;font-size:14.5px;line-height:1.9}
.subsidy-call{margin-top:16px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px 20px;align-items:center;background:var(--rose-l);border-radius:12px;padding:18px 24px;font-size:15px;line-height:1.8}
.subsidy-call b{color:var(--brown)}
.choose{margin-top:40px;padding-top:36px;border-top:1px solid var(--line)}
.choose h3{font-family:var(--serif);font-weight:600;font-size:22px}
.choose p{margin-top:12px;max-width:44em}

/* 4 ご相談の流れ */
.flow{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;counter-reset:f}
.flow li{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px 18px;display:grid;gap:6px;align-content:start;line-height:1.8}
.flow li::before{counter-increment:f;content:"STEP " counter(f,decimal-leading-zero);font-size:12px;font-weight:700;letter-spacing:.1em;color:var(--accent-d)}
.flow b{color:var(--brown);font-size:16px}
.flow span{font-size:14px}
.check{margin-top:36px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.check h3{grid-column:1/-1;padding:18px 22px 0;font-size:16px}
.check dl{padding:16px 22px;border-top:1px solid var(--line);font-size:14.5px;line-height:1.8}
.check dl:not(:nth-child(3n+2)){border-left:1px solid var(--line)}
.check dt{font-weight:700;color:var(--brown);font-size:14px;margin-bottom:2px}
.check dd{margin:0}

/* 5 お話を伺うところから（作り手） */
.feat{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.feat div{padding-top:22px;border-top:2px solid var(--deco)}
.feat h3{font-size:19px;margin-bottom:10px}
.feat p{color:var(--ink-2);font-size:15.5px}
.staff{margin-top:48px;display:grid;grid-template-columns:240px minmax(0,1fr);gap:32px;align-items:center;background:var(--paper);border-radius:var(--r);padding:28px}
.staff .ph{aspect-ratio:1/1}
.warranty{margin-top:20px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.warranty article{background:var(--paper);border-radius:var(--r);padding:24px 26px;display:flex;flex-direction:column;gap:8px;font-size:15px}
.warranty .tlink{margin-top:auto;font-size:15px}

/* 6 製作事例 */
.case{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,64px);align-items:start}
.case .ph{aspect-ratio:4/5}
.case .cat{font-size:13px;font-weight:700;letter-spacing:.06em;color:var(--accent-d);margin-bottom:10px}
.case h3{font-family:var(--serif);font-weight:600;font-size:clamp(22px,2.5vw,28px);line-height:1.65}
.case .txt{margin-top:18px}
.case dl{margin-top:24px}
.case dl div{padding:16px 0;border-top:1px solid var(--line)}
.case dl div:last-child{border-bottom:1px solid var(--line)}
.case dt{font-weight:700;font-size:14px;color:var(--brown)}
.case dd{margin-top:4px;font-size:15px;color:var(--ink-2)}

/* 7 よくあるご質問 */
.faq-list{max-width:920px;border-top:1px solid var(--line)}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list summary{position:relative;display:flex;gap:14px;padding:22px 48px 22px 0;list-style:none;cursor:pointer;font-size:17px;font-weight:700;line-height:1.8;color:var(--brown)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary .q{flex:0 0 22px;font-family:var(--latin);font-size:22px;line-height:1.4;color:var(--accent-d)}
.faq-list summary::after{content:"";position:absolute;top:28px;right:10px;width:10px;height:10px;border-right:2px solid var(--accent-d);border-bottom:2px solid var(--accent-d);transform:rotate(45deg)}
.faq-list details[open] summary::after{top:33px;transform:rotate(225deg)}
.faq-list .ans{padding:0 40px 24px 36px;color:var(--ink-2)}

/* 8 ご家族・ご友人の方へ */
.family .box{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:44px;align-items:center}

/* 9 ご相談・ご予約 */
.contact .panel{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,64px);align-items:start}
.contact .points{margin-top:22px;padding-left:1.3em;color:var(--ink-2);font-size:15.5px;display:grid;gap:6px}
.contact .access{margin-top:32px;padding-top:24px;border-top:1px solid var(--line);font-size:15px}
.contact .access dl{display:grid;grid-template-columns:6.5em minmax(0,1fr);gap:6px 14px;margin-top:10px}
.contact .access dt{font-weight:700;color:var(--brown)}
.method{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:26px}
.method+.method{margin-top:18px}
.method h3{font-size:18px}
.method p{margin-top:10px;font-size:15px;color:var(--ink-2)}
.method .btns{display:grid;gap:12px;margin-top:18px}
.method .btn{width:100%}
.method .telno{display:inline-block;margin-top:8px;font-family:var(--latin);font-size:36px;color:var(--accent);letter-spacing:.04em;text-decoration:none;line-height:1.3}
.method .note{font-size:13px}

/* お知らせ・フッター */
.news{list-style:none;border-top:1px solid var(--line)}
.news li{display:grid;grid-template-columns:9em minmax(0,1fr);gap:16px;padding:16px 4px;border-bottom:1px solid var(--line);font-size:15px}
.news time{color:var(--ink-2)}
.school{margin-top:32px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 28px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:24px 28px}
.school p{font-size:14.5px}
.ftr{background:var(--footer);color:var(--ft-ink);padding:56px 0 120px;font-size:14px;line-height:1.9}
.ftr .wrap{display:grid;grid-template-columns:1.2fr 2fr;gap:40px}
.ftr .name{font-family:var(--serif);font-size:18px;color:var(--ft-strong);margin-bottom:10px}
.ftr .addr{color:var(--ft-sub)}
.ftr nav ul{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:8px 20px}
.ftr a{color:var(--ft-ink);text-decoration:none}
.ftr a:hover{text-decoration:underline}
.ftr .copy{grid-column:1/-1;border-top:1px solid var(--ft-line);padding-top:18px;color:var(--ft-copy);font-size:12px}
.spbar{display:none}

@media (max-width:960px){
  .hero .wrap,.wishes .layout,.case,.family .box,.contact .panel{grid-template-columns:1fr}
  .hero .ph{order:-1;aspect-ratio:16/10}
  .case .ph{aspect-ratio:16/10}
  .pgroup{grid-template-columns:1fr;gap:18px}
  .ghead{position:static}
  .flow{grid-template-columns:repeat(2,minmax(0,1fr))}
  .flow li:last-child{grid-column:1/-1}
  .check{grid-template-columns:1fr 1fr}
  .check dl{border-left:0!important}
  .check dl:nth-child(odd){border-left:1px solid var(--line)!important}
  .feat{grid-template-columns:1fr}
  .staff{grid-template-columns:180px minmax(0,1fr)}
}
@media (max-width:700px){
  body{font-size:15.5px;line-height:1.95}
  .wrap{padding:0 20px}
  .g2,.g3,.flow,.check,.warranty{grid-template-columns:1fr}
  .flow li:last-child{grid-column:auto}
  .check dl{border-left:0!important}
  .try,.pitem{grid-template-columns:1fr}
  .try .ph,.pitem .ph{min-height:0;aspect-ratio:16/10}
  .pitem .ph.empty{border-right:0;border-bottom:1.5px dashed var(--field)}
  .try .body,.pitem .body{padding:20px}
  .subsidy-call{grid-template-columns:1fr}
  .staff{grid-template-columns:1fr;padding:22px}
  .staff .ph{max-width:220px}
  .faq-list summary{font-size:16px;padding-right:34px}
  .faq-list .ans{padding:0 6px 22px 36px}
  .news li{grid-template-columns:1fr;gap:2px}
  .school{grid-template-columns:1fr}
  .ftr .wrap{grid-template-columns:1fr}
  .ftr nav ul{grid-template-columns:1fr 1fr}
  .actions .btn{width:100%}
  .spbar{position:fixed;left:0;right:0;bottom:0;z-index:55;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom);background:var(--card)}
  .spbar a{padding:14px 6px;text-align:center;font-weight:700;font-size:14px;text-decoration:none;color:var(--brown)}
  .spbar a:last-child{background:var(--accent);color:#fff}
  .memo-toggle{bottom:72px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ===== 下層ページ用の部品（トップページ改訂案と同じ見せ方） ===== */
.phead{background:var(--paper-2);padding:28px 0 clamp(48px,6vw,72px)}
.crumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:4px 10px;font-size:13px;color:var(--ink-2);line-height:1.6}
.crumb li+li::before{content:"›";margin-right:10px;color:var(--deco)}
.crumb a{color:var(--ink-2);text-decoration:none}
.crumb a:hover{color:var(--accent-d);text-decoration:underline}
.phead .grid2{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:48px;align-items:center;margin-top:28px}
.phead h1{font-family:var(--serif);font-weight:600;font-size:clamp(28px,3.1vw,38px);line-height:1.55;margin-top:14px}
.phead .lead{margin-top:20px;max-width:34em}
.phead .ph{aspect-ratio:3/2}
.toc{margin-top:-28px;position:relative;z-index:2}
.toc nav{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px 24px;display:flex;align-items:center;gap:12px 24px;flex-wrap:wrap;box-shadow:0 10px 30px rgba(122,95,82,.06);line-height:1.6}
.toc .t{font-weight:700;font-size:14px;color:var(--brown);white-space:nowrap}
.toc ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;counter-reset:t}
.toc li{counter-increment:t}
.toc a{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-size:14px;color:var(--brown);padding:6px 14px;border-radius:999px;background:var(--paper);border:1px solid var(--line)}
.toc a::before{content:counter(t,decimal-leading-zero);font-family:var(--latin);color:var(--accent-d);font-size:15px}
.toc a:hover{border-color:var(--deco);color:var(--accent-d)}

/* 2列：文章と写真 */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,64px);align-items:center}
.split.top{align-items:start}

/* 線で区切る一覧（数字つき） */
.nlist{list-style:none;border-top:1px solid var(--line);counter-reset:n}
.nlist>li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:4px 12px;padding:22px 0;border-bottom:1px solid var(--line);counter-increment:n}
.nlist>li::before{content:counter(n,decimal-leading-zero);grid-row:1/3;font-family:var(--latin);font-size:26px;line-height:1.2;color:var(--deco)}
.nlist h3{font-size:18px}
.nlist p{font-size:15px;color:var(--ink-2)}
.nlist .tlink{font-size:15px;margin-top:4px;justify-self:start}
.nlist>li>*{grid-column:2}

/* カード4つ */
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:24px;display:flex;flex-direction:column;gap:8px}
.card h3{font-size:18px}
.card p{font-size:15px;color:var(--ink-2)}
.card .tlink{margin-top:auto;font-size:15px}

/* 比較表 */
.cmp-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.cmp{width:100%;min-width:720px;border-collapse:collapse;font-size:14.5px;line-height:1.8}
.cmp th,.cmp td{padding:14px 16px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.cmp thead th{background:var(--paper-2);color:var(--brown);font-size:14.5px}
.cmp thead th small{display:block;font-weight:400;font-size:12px;color:var(--ink-2)}
.cmp tbody th{color:var(--brown);font-size:14px;white-space:nowrap;width:9em}
.cmp tr:last-child th,.cmp tr:last-child td{border-bottom:0}
.cmp .us{background:var(--rose-l)}
.cmp thead .us{background:var(--brown);color:#fff}
.cmp thead .us small{color:var(--ft-ink)}
.cmp .mark{font-weight:700;color:var(--accent-d)}
.small-note{margin-top:14px;font-size:13.5px;color:var(--ink-2)}

/* 選び方（行で選ぶ） */
.crows{display:grid;gap:10px;max-width:920px}
.crow{display:grid;grid-template-columns:minmax(0,1fr) 32px 15em;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px 22px;text-decoration:none;color:var(--ink);line-height:1.7}
.crow:hover{border-color:var(--deco)}
.crow .who b{color:var(--brown)}
.crow .arr{color:var(--accent-d);text-align:center}
.crow .what{font-weight:700;color:var(--brown)}

/* 価格表 */
.ptable-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.ptable{width:100%;min-width:560px;border-collapse:collapse;font-size:15px;line-height:1.8}
.ptable th,.ptable td{padding:12px 18px;border-bottom:1px solid var(--line);text-align:left}
.ptable thead th{background:var(--brown);color:#fff;font-size:14px}
.ptable .grp th{background:var(--paper-2);color:var(--brown);font-size:14.5px}
.ptable .grp a{color:var(--brown)}
.ptable td.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.ptable tr:last-child td{border-bottom:0}
.pnotes{margin-top:16px;padding-left:1.2em;font-size:14px;color:var(--ink-2);display:grid;gap:4px}

/* 写真つきのリンクカード */
.lcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);display:flex;flex-direction:column}
.lcard .ph{border-radius:0;aspect-ratio:3/2}
.lcard .body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:6px;flex:1}
.lcard h3{font-size:17px}
.lcard p{font-size:14.5px;color:var(--ink-2)}
.lcard .go{margin-top:auto;font-weight:700;font-size:14.5px;color:var(--brown);text-decoration:underline;text-decoration-color:var(--deco);text-underline-offset:6px}
.lcard:hover{border-color:var(--deco)}

/* ページ末のご相談 */
.cta{background:var(--brown);color:#fff;border-radius:20px;padding:clamp(28px,4vw,48px);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 40px;align-items:center;line-height:1.9}
.cta h2{color:#fff;font-size:clamp(22px,2.4vw,28px)}
.cta p{margin-top:10px;color:var(--ft-ink)}
.cta .acts{display:grid;gap:12px;justify-items:center}
.cta .btn-primary{min-width:240px}
.cta .telno{font-family:var(--latin);font-size:30px;color:#fff;text-decoration:none;letter-spacing:.04em;line-height:1.2}
.cta small{display:block;text-align:center;font-size:12px;color:var(--ft-sub)}

@media (max-width:960px){
  .phead .grid2,.split{grid-template-columns:1fr}
  .phead .ph{order:-1}
  .g4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cta{grid-template-columns:1fr}
  .cta .acts{justify-items:stretch}
}
@media (max-width:700px){
  .g4{grid-template-columns:1fr}
  .toc{margin-top:-20px}
  .toc nav{padding:16px}
  .crow{grid-template-columns:minmax(0,1fr) 24px;gap:4px 8px}
  .crow .what{grid-column:1/-1}
  .crow .arr{grid-row:1;grid-column:2}
}

.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 要点の数字（価格・保証・期間など） */
.facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;list-style:none}
.facts li{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 18px;line-height:1.5}
.facts span{display:block;font-size:12px;color:var(--ink-2)}
.facts b{font-family:var(--latin);font-size:26px;font-weight:500;color:var(--brown)}
.facts b small{font-family:var(--sans);font-size:13px;margin-left:2px}
.facts b.jp{font-family:var(--sans);font-size:17px;font-weight:700}
/* 写真つきカード（商品の種類など） */
.icard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column}
.icard .ph{border-radius:0;aspect-ratio:4/3}
.icard .body{padding:22px 24px 24px;display:flex;flex-direction:column;gap:6px;flex:1}
.icard .use{font-size:13px;font-weight:700;color:var(--accent-d);letter-spacing:.06em}
.icard h3{font-size:19px}
.icard p{font-size:15px;color:var(--ink-2)}
.icard .price{font-size:30px}
.icard .tlink{margin-top:auto;font-size:15px}
/* 時間つきの工程 */
.steps{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;counter-reset:s}
.steps li{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px 18px;line-height:1.7;counter-increment:s}
.steps li::before{content:"STEP " counter(s,decimal-leading-zero);display:block;font-size:12px;font-weight:700;letter-spacing:.1em;color:var(--accent-d)}
.steps b{display:block;color:var(--brown);font-size:16px}
.steps span{font-size:14px;color:var(--ink-2)}
.steps.s4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:960px){.steps,.steps.s4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.steps,.steps.s4{grid-template-columns:1fr}}

/* お客様の声 */
.vpolicy{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:32px}
.vpolicy li{background:var(--paper);border-radius:12px;padding:14px 18px;font-size:14px;color:var(--ink-2);line-height:1.8}
.vpolicy b{display:block;color:var(--brown);font-size:15px}
.filters{display:grid;gap:10px;padding:18px 0 22px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:28px}
.frow{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.fl{font-size:13px;font-weight:700;color:var(--brown);min-width:3em}
.fb{font:inherit;font-size:14px;line-height:1.5;padding:6px 14px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--brown);cursor:pointer}
.fb:hover{border-color:var(--deco)}
.fb.on{background:var(--brown);border-color:var(--brown);color:#fff}
.count{font-size:13.5px;color:var(--ink-2)}
.count span{font-family:var(--latin);font-size:20px;color:var(--accent-d)}
.vgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.vcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:26px;display:flex;flex-direction:column;gap:10px}
.vcard[hidden]{display:none}
.vcard .tags{display:flex;flex-wrap:wrap;gap:6px}
.vcard .tags span{font-size:12px;font-weight:700;color:var(--accent-d);background:var(--rose-l);border-radius:999px;padding:1px 10px}
.vcard h3{font-size:18px}
.vcard blockquote{margin:0;padding-left:16px;border-left:3px solid var(--deco);font-size:15.5px}
.vcard .who{margin-top:auto;font-size:13px;color:var(--ink-2)}
.vempty{padding:24px;text-align:center;color:var(--ink-2)}
@media (max-width:700px){.vpolicy,.vgrid{grid-template-columns:1fr}}

/* よくあるご質問：検索と分類 */
.fsearch{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px 24px;display:grid;gap:12px;box-shadow:0 10px 30px rgba(122,95,82,.06);line-height:1.6}
.fsearch .t{font-weight:700;font-size:14px;color:var(--brown)}
.sin{display:flex;align-items:center;gap:12px}
.sin input{flex:1;min-width:0;font:inherit;font-size:16px;padding:10px 16px;border:1.5px solid var(--field);border-radius:999px;background:var(--paper);color:var(--ink)}
.sin input:focus{outline:2px solid var(--accent-d);outline-offset:2px;border-color:var(--accent-d)}
.hit{font-size:13.5px;color:var(--ink-2);white-space:nowrap}
.hit b{font-family:var(--latin);font-size:20px;color:var(--accent-d)}
.catnav{display:flex;flex-wrap:wrap;gap:8px}
.catnav a{font-size:13.5px;text-decoration:none;color:var(--brown);padding:5px 12px;border-radius:999px;background:var(--paper);border:1px solid var(--line)}
.catnav a:hover{border-color:var(--deco);color:var(--accent-d)}
.fcat{display:grid;grid-template-columns:200px minmax(0,1fr);gap:24px;padding:28px 0;border-top:1px solid var(--line)}
.fcat:first-child{border-top:0;padding-top:0}
.fcat[hidden]{display:none}
.fcat-h{position:sticky;top:76px;align-self:start}
.fcat-h .eyebrow{font-size:15px}
.faq-list details[hidden]{display:none}
/* 地図 */
.map{border-radius:var(--r);overflow:hidden;border:1px solid var(--line);aspect-ratio:4/3;background:var(--paper-2)}
.map iframe{width:100%;height:100%;border:0;display:block}
@media (max-width:700px){.fcat{grid-template-columns:1fr;gap:10px}.fcat-h{position:static}}

/* フォーム */
.fbox{max-width:880px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:36px 40px;line-height:1.7}
.fbox .frow{display:grid;grid-template-columns:13em minmax(0,1fr);gap:8px 24px;padding:18px 0;border-bottom:1px solid var(--line)}
.fbox .frow:first-child{padding-top:0}
.fbox .frow>label,.fbox .frow>.lb{font-weight:700;color:var(--brown);font-size:15px;padding-top:10px}
.req,.opt{display:inline-block;margin-left:8px;font-size:11px;font-weight:700;border-radius:4px;padding:1px 6px;vertical-align:2px}
.req{background:var(--accent-d);color:#fff}
.opt{background:var(--paper-2);color:var(--ink-2)}
.fbox input[type=text],.fbox input[type=tel],.fbox input[type=email],.fbox input[type=date],.fbox select,.fbox textarea{width:100%;font:inherit;font-size:16px;padding:10px 14px;border:1.5px solid var(--field);border-radius:10px;background:#fff;color:var(--ink)}
.fbox textarea{min-height:140px;resize:vertical}
.fbox input:focus,.fbox select:focus,.fbox textarea:focus{outline:2px solid var(--accent-d);outline-offset:1px;border-color:var(--accent-d)}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.chk{display:flex;flex-wrap:wrap;gap:8px 18px;padding-top:8px}
.chk label{display:inline-flex;align-items:center;gap:6px;font-size:15px;cursor:pointer}
.chk input{width:18px;height:18px;accent-color:var(--accent-d)}
.dt{display:grid;grid-template-columns:8em minmax(0,1fr) minmax(0,1fr);gap:8px;align-items:center;margin-bottom:8px;font-size:14px}
.hint{margin-top:6px;font-size:13px;color:var(--ink-2)}
.agree{margin-top:24px;text-align:center}
.agree label{display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.agree input{width:18px;height:18px;accent-color:var(--accent-d)}
.fsubmit{margin-top:18px;text-align:center}
.fsubmit .btn{min-width:280px;border:0;cursor:pointer;font-family:inherit}
@media (max-width:700px){
  .fbox{padding:22px 18px}
  .fbox .frow{grid-template-columns:1fr;gap:6px}
  .fbox .frow>label,.fbox .frow>.lb{padding-top:0}
  .f2,.dt{grid-template-columns:1fr}
  .fsubmit .btn{min-width:0;width:100%}
}
.check.one{grid-template-columns:1fr}
.check.one dl{border-left:0!important}