/* エコハウス裾野店｜お役立ちコラム 共通スタイル
   LP本体（../index.html）とパレット・書体を揃えてあります。ここを単独で変えないこと。 */
:root{
  --cream:#F7F2E8; --sand:#E7DCC8; --card:#FFFFFF;
  --ink:#2C2723; --muted:#7B7269; --border:#E0D6C4;
  --accent:#D2542A; --accent-d:#A83E1B; --amber:#F2C14E; --line:#06C755;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Noto Sans JP",sans-serif;color:var(--ink);background:#fff;
  line-height:2;font-size:16px;-webkit-font-smoothing:antialiased;padding-bottom:64px}
h1,h2,h3{font-family:"Noto Serif JP",serif;font-weight:700;line-height:1.5;letter-spacing:.02em}
.wrap{max-width:760px;margin:0 auto;padding:0 20px}
a{color:var(--accent-d)}
img{max-width:100%;height:auto;display:block}

.mock-note{background:#2C2723;color:#F0E3CB;font-size:12.5px;text-align:center;padding:8px 14px}
.mock-note b{color:var(--amber)}
.todo{background:#FFF6E4;border-bottom:2px dashed #D9A441;padding:0 4px;border-radius:3px;color:#8a5a09;font-weight:700}
.todo::before{content:"要確認 ";font-size:10px;background:#D9A441;color:#fff;padding:1px 5px;border-radius:6px;margin-right:5px;vertical-align:2px}

header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.97);border-bottom:1px solid var(--border)}
.hd{max-width:1040px;margin:0 auto;padding:0 20px;display:flex;align-items:center;justify-content:space-between;height:66px;gap:12px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}
.brand .logo{width:38px;height:38px;border-radius:9px;background:var(--accent);display:grid;place-items:center;
  color:#fff;font-family:"Noto Serif JP",serif;font-weight:700;font-size:19px}
.brand b{font-family:"Noto Serif JP",serif;font-size:16px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;cursor:pointer;
  font-weight:700;text-decoration:none;border-radius:10px;padding:11px 18px;font-size:14.5px;transition:.15s;white-space:nowrap}
.btn-line{background:var(--line);color:#fff}
.btn-ghost{background:#fff;color:var(--accent-d);border:1.5px solid var(--accent)}
.btn-lg{padding:15px 26px;font-size:16px}

.crumb{background:var(--cream);border-bottom:1px solid var(--border);font-size:12.5px;color:var(--muted)}
.crumb .wrap{padding:10px 20px;max-width:1040px}
.crumb a{color:var(--muted);text-decoration:none}
.crumb a:hover{text-decoration:underline}

article{padding:44px 0 10px}
article .eyebrow{color:var(--accent);font-weight:700;font-size:12px;letter-spacing:.16em;margin-bottom:12px}
article h1{font-size:clamp(1.45rem,3.6vw,2.05rem);margin-bottom:26px}
article h2{font-size:1.14rem;margin:34px 0 12px;padding-left:13px;border-left:4px solid var(--accent)}
article p{margin-bottom:20px}
article ul{margin:0 0 20px 0;list-style:none}
article ul li{padding-left:16px;position:relative;margin-bottom:4px}
article ul li::before{content:"";position:absolute;left:2px;top:1em;width:6px;height:1px;background:var(--accent)}
article ol{margin:0 0 20px 1.4em}
article ol li{margin-bottom:4px}
article strong{font-weight:700}

table{width:100%;border-collapse:collapse;margin:0 0 20px;font-size:14.5px}
th,td{border:1px solid var(--border);padding:10px 12px;text-align:left}
th{background:var(--sand);font-weight:700}
td.num{text-align:right;font-variant-numeric:tabular-nums}
tr.total td{background:var(--cream);font-weight:700}

blockquote{background:var(--cream);border-left:4px solid var(--amber);border-radius:0 8px 8px 0;
  padding:16px 18px;margin:0 0 20px;font-size:14.5px;color:#5B534B}
blockquote p{margin:0}

.shopcard{background:var(--cream);border:1px solid var(--border);border-radius:12px;padding:22px;margin:36px 0 0;font-size:14.5px}
.shopcard b{font-family:"Noto Serif JP";display:block;margin-bottom:8px;font-size:1.02rem}
.shopcard p{margin:0;line-height:1.9}

.endcta{background:var(--accent);margin-top:44px}
.endcta .wrap{padding:34px 20px;text-align:center}
.endcta h2{color:#fff;font-size:clamp(1.15rem,2.8vw,1.5rem);border:none;padding:0;margin:0}
.endcta p{color:#FCE9DF;font-size:14.5px;margin:8px 0 18px}
.endcta .row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

.more{padding:40px 0}
.more h2{font-size:1.1rem;margin-bottom:16px;border:none;padding:0}
.more ul{list-style:none}
.more li{border-bottom:1px solid var(--border)}
.more li a{display:block;padding:14px 2px;text-decoration:none;color:var(--ink);font-size:14.5px}
.more li a:hover{color:var(--accent-d)}
.more small{color:var(--accent);font-weight:700;margin-right:8px}

footer{background:#2C2723;color:#C9BFB2;font-size:13.5px}
footer .wrap{padding:32px 20px;max-width:1040px}
footer a{color:var(--amber);text-decoration:none}
footer .copy{margin-top:18px;padding-top:14px;border-top:1px solid rgba(255,255,255,.12);font-size:12px;color:#8E8377}

.fixbar{position:fixed;left:0;right:0;bottom:0;z-index:80;display:flex;background:#fff;
  border-top:1px solid var(--border);box-shadow:0 -4px 16px rgba(0,0,0,.08)}
.fixbar a{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;padding:14px 6px;
  font-weight:700;font-size:14.5px;text-decoration:none}
.fixbar .l{background:var(--line);color:#fff}
.fixbar .t{background:var(--amber);color:#3B2A12}