/* Qloog ブログ記事 共通スタイル */
:root { --bg:#FBFAF7; --ink:#1A2E35; --ink-soft:#47555C; --brand:#16697A; --brand-deep:#0E3A46; --gold:#B8912F; --line:#E7E4DC; --tint:#EEF4F4; }
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Noto Sans JP',sans-serif; background:var(--bg); color:var(--ink); line-height:2; font-size:15.5px; }
nav { position:sticky; top:0; background:rgba(251,250,247,.95); border-bottom:1px solid var(--line); z-index:10; }
.nav-inner { max-width:760px; margin:0 auto; padding:14px 24px; display:flex; justify-content:space-between; align-items:center; }
.nav-inner img { height:28px; display:block; }
.nav-inner .cta { font-size:13px; font-weight:700; color:#fff; background:var(--gold); padding:9px 18px; border-radius:3px; text-decoration:none; }
main { max-width:760px; margin:0 auto; padding:20px 24px 80px; }
.breadcrumb { font-size:12px; color:#97A09B; margin:20px 0 28px; }
.breadcrumb a { color:var(--brand); text-decoration:none; }
.kw-tag { display:inline-block; font-family:'Outfit',sans-serif; font-size:11px; letter-spacing:.12em; color:var(--gold); border:1px solid var(--gold); padding:4px 12px; border-radius:100px; margin-bottom:18px; }
h1 { font-family:'Zen Kaku Gothic New',sans-serif; font-size:29px; font-weight:900; line-height:1.5; margin-bottom:16px; }
.meta { font-size:12px; color:#97A09B; margin-bottom:40px; padding-bottom:24px; border-bottom:1px solid var(--line); }
.lead { font-size:16px; color:var(--ink-soft); margin-bottom:40px; }
h2 { font-family:'Zen Kaku Gothic New',sans-serif; font-size:22px; font-weight:700; margin:48px 0 18px; padding-left:14px; border-left:4px solid var(--brand); line-height:1.5; }
h3 { font-family:'Zen Kaku Gothic New',sans-serif; font-size:17px; font-weight:700; margin:32px 0 12px; }
p { margin-bottom:18px; color:var(--ink); }
ul, ol { margin:0 0 20px 24px; }
li { margin-bottom:8px; }
strong { font-weight:700; color:var(--brand-deep); }
a { color:var(--brand); }
.note { background:var(--tint); border-radius:6px; padding:18px 22px; margin:24px 0; font-size:14px; }
.note b { display:block; margin-bottom:6px; }
table { width:100%; border-collapse:collapse; font-size:13.5px; margin:20px 0; }
th, td { border:1px solid var(--line); padding:11px 13px; text-align:left; vertical-align:top; }
th { background:#F3F1EA; font-weight:700; }
td { background:#fff; }
.cta-box { background:var(--brand-deep); color:#fff; border-radius:10px; padding:34px 30px; text-align:center; margin:48px 0 20px; }
.cta-box h3 { color:#fff; font-size:19px; margin:0 0 10px; }
.cta-box p { color:rgba(255,255,255,.82); font-size:14px; margin-bottom:22px; }
.cta-box a { display:inline-block; background:var(--gold); color:#fff; font-weight:700; text-decoration:none; padding:13px 30px; border-radius:4px; font-size:15px; }
.related { margin-top:56px; padding-top:32px; border-top:1px solid var(--line); }
.related h2 { border:none; padding:0; font-size:16px; margin-bottom:16px; }
.related a { display:block; padding:12px 0; border-bottom:1px dashed var(--line); text-decoration:none; color:var(--ink); font-size:14px; font-weight:500; }
footer { border-top:1px solid var(--line); padding:32px 24px; }
.footer-inner { max-width:760px; margin:0 auto; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:12px; color:#97A09B; }
.footer-inner a { color:#97A09B; text-decoration:none; margin-left:18px; }
