/* 親しみ・シンプル・見やすい（2026-10-18 第3版）。各ページのstyleの後に読み込んで上書きする */
:root{
  --bg:#fdfbf7;--soft:#f6f0e8;--surface:#ffffff;
  --text:#4a3f36;--ink:#3a2f27;--muted:#7d7067;
  --accent:#d08a62;--accent-d:#b9734f;--accent-l:#fbe9dd;--accent-xl:#fdf4ee;
  --line:#e8dfd4;--mark:#fbe3d3;
  --main:#3a2f27;--main-d:#2e251f;--main-l:#f6f0e8;--gold:var(--accent);--gold-l:var(--accent-l);
  --f-maru:'Zen Maru Gothic','Hiragino Maru Gothic ProN','Noto Sans JP',sans-serif;
  --f-gothic:'Noto Sans JP','游ゴシック体','Yu Gothic','Hiragino Sans',Meiryo,sans-serif;
  --f-serif:var(--f-maru);--f-en:var(--f-maru);
  --radius:18px;
}
body{background:var(--bg);color:var(--text);font-family:var(--f-gothic);font-size:17px;line-height:1.95;letter-spacing:.03em;font-weight:400}
h1,h2,h3,h4{font-family:var(--f-maru);font-weight:500;color:var(--ink);letter-spacing:.04em;line-height:1.65}

/* ヘッダー */
.header{background:rgba(253,251,247,.94);border-bottom:1px solid var(--line)}
.header-inner{padding:16px 28px}
.logo{display:flex;flex-direction:column;line-height:1.2;color:var(--ink);text-decoration:none}
.logo-en{font-family:var(--f-maru);font-weight:700;font-size:24px;letter-spacing:.06em}
.logo-en i{font-style:normal;color:var(--accent)}
.logo-jp{font-size:11.5px;letter-spacing:.08em;color:var(--muted);margin-top:4px}
.nav a{font-size:15px;letter-spacing:.04em;color:var(--text)}
.nav a:hover{color:var(--accent-d)}
.head-cta{background:var(--accent);color:#fff;border:none;border-radius:999px;font-family:var(--f-maru);font-weight:500;font-size:14px;letter-spacing:.06em;padding:12px 24px}
.head-cta:hover{background:var(--accent-d);color:#fff}
.draft{border:1px dashed var(--accent);background:var(--accent-xl);color:var(--text);border-radius:12px;font-size:13.5px}
.draft b{color:var(--accent-d)}

/* ボタン */
.btn{background:var(--accent);color:#fff;border:none;border-radius:999px;font-family:var(--f-maru);font-weight:500;font-size:16px;letter-spacing:.06em;min-height:58px;padding:0 36px;box-shadow:0 8px 20px -12px rgba(208,138,98,.8)}
.btn:hover{background:var(--accent-d);color:#fff}
.btn.ghost{background:#fff;color:var(--accent-d);border:1.5px solid var(--accent);box-shadow:none}
.btn.ghost:hover{background:var(--accent-l);color:var(--accent-d);border-color:var(--accent)}
.btn.gold{background:#fff;color:var(--accent-d);border:none}
.btn.gold:hover{background:var(--accent-l);color:var(--accent-d)}

/* 見出し */
section{padding-block:88px}
.sec-ttl{margin-bottom:44px}
.sec-ttl .en,.page-head .en,.contact .en{font-family:var(--f-maru);font-style:normal;font-size:13px;letter-spacing:.2em;color:var(--accent);display:block;margin-bottom:8px;text-transform:uppercase}
.sec-ttl h2,.page-head h1{font-size:clamp(22px,2.6vw,30px);letter-spacing:.04em;line-height:1.7;font-weight:500}
.sec-ttl h2::after{width:40px;height:4px;border-radius:4px;background:var(--accent-l);margin-top:18px}
.sec-ttl h2 em{font-style:normal;background:linear-gradient(transparent 62%,var(--mark) 62%);padding:0 2px}
.sec-ttl p{font-size:16px;color:var(--muted);max-width:40em}

/* 写真 */
.photo{border-radius:var(--radius)}
.photo img{transition:transform 1s ease}
.pitem:hover .photo img,.fcard:hover .photo img,.case-item:hover .photo img{transform:scale(1.03)}

/* ヒーロー（明るい2カラム） */
.hero{padding-block:56px 64px;background:var(--soft)}
.hero-grid{max-width:1200px;margin-inline:auto;padding-inline:28px;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.hero .kicker{display:inline-block;font-family:var(--f-maru);font-size:14px;letter-spacing:.08em;color:var(--accent-d);background:#fff;border-radius:999px;padding:6px 16px;margin-bottom:18px}
.hero h1{font-size:clamp(27px,3.4vw,40px);line-height:1.7;letter-spacing:.04em;font-weight:700}
.hero h1 .l2{display:block;margin-top:6px;font-size:.8em;font-weight:500}
.hero h1 em{font-style:normal;background:linear-gradient(transparent 60%,var(--mark) 60%);padding:0 2px}
.hero .lead{margin-top:18px;font-size:16.5px;max-width:34em}
.hero .hero-ph{aspect-ratio:4/3;border-radius:28px;overflow:hidden;background:#eee}
.hero .btn{margin-top:28px}
.axes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:26px;max-width:560px}
.axes div{background:#fff;border:none;border-radius:14px;padding:16px 8px;text-align:center}
.axes b{font-family:var(--f-maru);font-weight:700;font-size:17px;letter-spacing:.06em;color:var(--ink)}
.axes small{font-size:13px;color:var(--muted);margin-top:4px}
@media(max-width:900px){.hero{padding-block:36px 44px}.hero-grid{grid-template-columns:1fr;gap:26px}.hero .hero-ph{max-width:520px}}
@media(max-width:520px){.axes{grid-template-columns:1fr}.axes div{display:flex;gap:10px;justify-content:center;align-items:baseline;padding:12px}}

/* 相談の帯 */
.cta-band{background:var(--bg);padding-block:56px}
.cta-band h2{font-size:clamp(19px,2.2vw,25px);letter-spacing:.03em;line-height:1.8;font-weight:500}
.cta-band h2 b{font-weight:500;background:none}
.cta-band .btn{margin-top:22px}

/* お悩みカード */
.wcard{background:var(--surface);border:none;border-radius:var(--radius);padding:34px 24px 30px;box-shadow:0 10px 30px -22px rgba(74,63,54,.35)}
.wcard .round{width:110px;box-shadow:0 0 0 5px var(--accent-xl)}
.wcard .ico-c{width:70px;height:70px;border:none;background:var(--accent-xl)}
.wcard .ico{color:var(--accent-d)}
.wcard h3{font-size:18px;font-weight:700}
.wcard p{font-size:15px;color:var(--text);margin-top:8px}

/* 解決（明るいベージュ） */
.solve{background:var(--accent-xl);color:var(--text);padding-block:88px}
.solve h2{color:var(--ink);font-size:clamp(22px,2.6vw,30px);letter-spacing:.04em;font-weight:500}
.solve h2 em{color:var(--accent-d);font-size:1em}
.solve .sub{color:var(--muted);font-size:16px}
.pfig{gap:16px}
.pf{background:#fff;border:none;border-radius:var(--radius);padding:30px 18px 26px;box-shadow:0 10px 30px -22px rgba(74,63,54,.35)}
.pf .pn{background:var(--accent);border:none;color:#fff;font-family:var(--f-maru);font-weight:700;font-size:16px;width:36px;height:36px}
.pf b{color:var(--ink);font-size:20px;letter-spacing:.1em;font-weight:700}
.pf small{color:var(--text);font-size:14px}
.pf::after{border-color:var(--accent)}

/* できること */
.cando{gap:18px}
.cd{background:#fff;border:none;border-radius:var(--radius);padding:30px 18px 26px;box-shadow:0 10px 30px -22px rgba(74,63,54,.35)}
.cd .cc{background:var(--accent-xl);border:none}
.cd .ico{color:var(--accent-d)}
.cd h3{font-size:18px;font-weight:700;letter-spacing:.04em}
.cd p{font-size:14.5px;color:var(--text)}

/* 事例リスト */
.plist{border-top:none;gap:16px}
.pitem{background:#fff;border:none;border-radius:var(--radius);padding:18px;gap:22px;box-shadow:0 10px 30px -22px rgba(74,63,54,.35)}
.pitem .ph{border-radius:14px}
.pitem .cat,.case-item .tag,.detail .tag{color:var(--accent-d);background:var(--accent-xl);border:none;border-radius:999px;padding:4px 14px;font-size:12px;letter-spacing:.08em}
.pitem h3{font-family:var(--f-maru);font-weight:700;font-size:18px}
.pitem .meta{font-size:14px;color:var(--muted)}
.pitem time,.case-item .date,.detail .date{font-family:var(--f-gothic);font-size:13.5px;color:var(--muted)}
.pitem:hover h3{color:var(--accent-d)}

/* 流れ */
.fcard{background:#fff;border:none;border-radius:var(--radius);box-shadow:0 10px 30px -22px rgba(74,63,54,.35)}
.fcard .ph{border-radius:var(--radius) var(--radius) 0 0}
.fcard .n{font-family:var(--f-maru);font-style:normal;font-size:13px;letter-spacing:.14em;color:var(--accent-d);border:none;padding:0}
.fcard h3{font-size:18px;font-weight:700}
.fcard p{font-size:14.5px;color:var(--text)}

/* メッセージ・プロフィール */
.prof{background:#fff;border:none;border-radius:24px;padding:44px 48px;box-shadow:0 10px 30px -22px rgba(74,63,54,.35)}
.prof .round{box-shadow:0 0 0 6px var(--accent-xl)}
.prof h3{font-size:24px;font-weight:700;letter-spacing:.1em}
.prof .kana{color:var(--accent-d);font-size:14px}
.prof p{font-size:16px}

/* お問い合わせ */
.contact{background:var(--accent-xl);color:var(--text);padding-block:88px}
.contact h2{color:var(--ink);font-size:clamp(22px,2.6vw,30px);font-weight:500;letter-spacing:.06em}
.contact p{color:var(--text);font-size:16.5px}
.contact .btn{background:var(--accent);color:#fff;border:none}
.contact .btn:hover{background:var(--accent-d);color:#fff}

footer{background:var(--soft);color:var(--text);border-top:1px solid var(--line)}
.foot-name{font-family:var(--f-maru);font-weight:700;font-size:20px;letter-spacing:.06em;color:var(--ink)}
.foot-sub{font-size:13.5px;color:var(--muted)}
.copy{font-family:var(--f-gothic);font-size:12px;color:var(--muted)}

/* 事例ページ */
.page-head{background:var(--soft);padding-block:56px 48px}
.page-head p{color:var(--muted);font-size:16px}
.crumb{font-size:14px}
.crumb a{color:var(--accent-d)}
.case-list{border-top:none;gap:16px}
.case-item{background:#fff;border:none;border-radius:var(--radius);padding:18px;box-shadow:0 10px 30px -22px rgba(74,63,54,.35)}
.case-item .ph{border-radius:14px}
.case-item h2{font-family:var(--f-maru);font-weight:700;font-size:19px}
.case-item .meta{font-size:14px;color:var(--muted)}
.detail .hero-ph{border-radius:24px}
.detail h1{font-weight:700;font-size:clamp(21px,2.6vw,28px)}
.detail h2{font-weight:700;font-size:22px;border-left:4px solid var(--accent);border-radius:2px}
.detail h3{font-family:var(--f-maru);font-weight:700;font-size:18px}
.detail .summary{background:var(--accent-xl);border:none;border-radius:var(--radius);font-size:16.5px}
.ctable{background:#fff;border:1px solid var(--line);border-radius:var(--radius);font-size:16px}
.detail p,.detail li{font-size:16.5px}
.detail li::before{background:var(--accent)}
.detail .result{background:var(--ink);color:#fff;border-radius:var(--radius);font-size:17px}
.detail .result b{color:var(--accent-l);font-size:20px}
.detail .todo{border-color:var(--accent);background:var(--accent-xl);border-radius:12px;font-size:14px;color:var(--text)}

@media(max-width:900px){section{padding-block:64px}.prof{padding:28px 22px}}
@media(max-width:520px){body{font-size:16px}.header-inner{padding:12px 16px}.logo-en{font-size:20px}.logo-jp{font-size:10px}.hero h1{font-size:25px}.btn{font-size:15px}}
.hero h1 em{white-space:nowrap}
@media(min-width:901px){.hero h1 .l2{white-space:nowrap;font-size:.74em}}
@media(max-width:520px){.hero h1{font-size:24px;letter-spacing:.02em}}
