/* そだちノート 共通の色調（2026-10-13）
   LP トップ（2026-10-12 デザイナー案の上書き）と同じ値・同じ見た目に、LP 以外のページを揃えるための共通ファイル。
   各ページの <head> の末尾で読み込む（既存のページ内 CSS は消さず、あとから上書きする）。
   値を変えるときはここだけを直す。LP トップ（public/index.html）は自前の上書きブロックを持つため、このファイルは読み込まない。 */

:root{
  --cream:#F7F2E8; --card:#FFFFFF; --line:#E6DECF;
  --green:#22335C; --green2:#2F4B86; --greenD:#16264A; --greenL:#E7EBF5;
  --apricot:#D9774A; --apricotL:#F6E3D8; --mark:#F0DFA8;
  --ink:#22335C; --sub:#6B7693;
  --nink:#22335C; --nink2:#48577C; --nsub:#6B7693; --nred:#D9774A; --nredL:#F6E3D8;
  --nyel:#F0DFA8; --nyelL:#FAF2D9; --nline:#E6DECF; --npaper:#F7F2E8;
}
body{background:var(--cream);color:var(--ink)}

/* 紙のざらつき（全面・外部画像なし） */
body::after{content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.5;
 background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/><feColorMatrix type='saturate' values='0'/></filter><rect width='160' height='160' filter='url(%23n)' opacity='0.05'/></svg>");
 mix-blend-mode:multiply}

/* ヘッダー */
.site-header{background:rgba(251,248,241,.94);border-bottom:1px solid var(--line)}
.nav a,.hd-nav a{color:var(--nink2)}
.nav a:hover,.hd-nav a:hover{background:#F1EADD}
.btn-main,.hd-btn-main{background:var(--apricot);color:#fff;border:0;box-shadow:0 3px 0 #B55E37}
.btn-main:hover,.hd-btn-main:hover{background:#C96B41}
/* 副ボタン＝白い面＋手描きの下線（枠なし）。LP は <svg class="ul2"> で描いているが、他ページはマークアップを変えず、背景画像で同じ線を引く */
.btn-ghost,.hd-btn-ghost{
  background:#fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 10' preserveAspectRatio='none'><path d='M2 6.5 C 46 2.5, 92 9, 134 4.5 S 184 3.5, 198 6' stroke='%23D9774A' stroke-width='4' stroke-linecap='round' fill='none' opacity='.6'/></svg>") no-repeat left 14px bottom 6px / calc(100% - 28px) 7px;
  color:var(--nink);border:0 !important;position:relative;box-shadow:0 1px 3px rgba(34,51,92,.08);padding-bottom:15px}
.btn-ghost:hover,.hd-btn-ghost:hover{background-color:#fff}
.site-header .btn-main,.site-header .hd-btn-main{padding:9px 18px;font-size:13.5px;border-radius:12px}
.site-header .btn-ghost,.site-header .hd-btn-ghost{padding:9px 16px 11px;font-size:13.5px;border-radius:12px;
  background-position:left 11px bottom 5px;background-size:calc(100% - 22px) 6px}

/* 見出し・帯・カード */
/* （見出しの色は、本文色 var(--ink)＝紺の継承に任せる。h2/h3 に色を直接指定すると、紺の帯の中の白い見出しまで紺になるため） */
.band{background:#FBF8F1}
.band:nth-of-type(even){background:var(--cream)}
.kicker{color:var(--apricot)}
.mark{background:var(--mark)}
.hl{color:var(--apricot)}
.pain,.f,.vblock,.modcard,.supcard,.origin,.vcard,.trust div,.ncard,details,.plan,.compare{
 background:#fff;border-color:var(--line)}
.chip,.c{border-color:var(--line)}
/* （LP の .ai/.badge/.tag の塗りは、他ページでは別の意味（ストアのバッジ・見出し上の小ラベル）に使われているため、共通にはしない） */
.ph,.ph-light,.ph-fill{color:inherit}
a{color:var(--green2)}
.sec-cta .btn-main{box-shadow:0 3px 0 #B55E37}

/* ヘッダー（ロゴ＋ディスクリプタ・ナビは中央寄り・ナビは小さく詰める） */
.site-header .hd-inner{gap:16px}
.brand,.hd-brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand .bname,.hd-brand .bname{font-family:"Zen Maru Gothic","Noto Sans JP",sans-serif;font-weight:700;
 font-size:20px;color:var(--nink);letter-spacing:.01em}
.brand .bdesc,.hd-brand .bdesc{font-size:11.5px;color:var(--nsub);font-weight:400;line-height:1.4;white-space:nowrap}
.site-header .nav,.site-header .hd-nav{margin-left:auto}
.site-header .nav a i,.site-header .hd-nav a i{display:none}
.site-header .nav a,.site-header .hd-nav a{font-size:13px;padding:6px 7px;letter-spacing:0}
.site-header .nav,.site-header .hd-nav{gap:0}
@media(max-width:1400px){.brand .bdesc,.hd-brand .bdesc{display:none}}
.hd-hamburger{border-color:var(--line)}
.hd-mini,.hd-btn-main .hd-lbl{font-weight:700}

/* フッター */
footer a,.site-footer .ft-nav a{color:var(--green2)}
.site-footer .ft-brand b{color:var(--nink)}
.site-footer{background:#FBF8F1;border-top-color:var(--line)}

/* ───── 規約・ポリシーなど（body class="tone-legal"）：ミント色の地・緑の文字を、LP と同じ紙色・紺の文字に ───── */
body.tone-legal{background:var(--cream);color:var(--ink)}
body.tone-legal h1,body.tone-legal h2,body.tone-legal h3{color:var(--nink)}
body.tone-legal h2{border-bottom-color:var(--line)}
body.tone-legal .subtitle{color:var(--sub)}
body.tone-legal th,body.tone-legal td{border-color:var(--line)}
body.tone-legal th{background:#F1EADD}
body.tone-legal td.label{background:#FBF8F1}
body.tone-legal .notice{background:#FBF1E6;border-left-color:var(--apricot)}
body.tone-legal .footer-note{background:#FBF8F1;color:var(--sub)}
body.tone-legal main a{color:var(--green2)}
body.tone-legal .hd-nav a,body.tone-legal .hd-dl{color:var(--nink2)}

/* アカウント削除ページ（delete-account）固有の緑 */
body.tone-legal .lead{color:var(--sub)}
body.tone-legal .card{border-color:var(--line);box-shadow:0 3px 14px rgba(34,51,92,.06)}
body.tone-legal .card h2,body.tone-legal .data-info h2{color:var(--nink)}
body.tone-legal .card h2 i{color:var(--green2)}
body.tone-legal .card p,body.tone-legal .step-list li,body.tone-legal .contact-card p,body.tone-legal .data-info table{color:var(--nink2)}
body.tone-legal .step-list li::before{background:var(--green2)}
body.tone-legal .highlight{background:var(--greenL);color:var(--green2)}
body.tone-legal .contact-card{background:#FBF8F1;border-color:var(--line)}
body.tone-legal .contact-card a{color:var(--green2)}
body.tone-legal .note{color:var(--sub)}
body.tone-legal .data-info{background:#FBF8F1;border-color:var(--line)}
body.tone-legal .data-info td{border-bottom-color:var(--line)}
body.tone-legal .data-info td:first-child{color:var(--nink)}
body.tone-legal footer{color:var(--sub);border-top-color:var(--line)}
body.tone-legal footer a{color:var(--green2)}

/* マークアップの style 属性に直接書かれた緑（本文は変えず、見た目だけ揃える） */
body.tone-legal [style*="#6B7A6B"],body.tone-legal [style*="#7A9A7E"]{color:var(--sub) !important}
body.tone-legal [style*="color:#2D6A4F"],body.tone-legal [style*="color:#2F6B4F"]{color:var(--green2) !important}

/* 保護者向けページ（for-parents）の無料枠の縁取り */
.duo .c.free{border-color:#D5DBEB}

/* ページ最下部の CTA 帯（LP の .final と同じ紺）・導入サポートの点・資料ページの目次の見出し */
.final{background:#22335C}
.dot[style*="#2F6B4F"]{background:var(--green) !important}
.toc .l{color:var(--sub)}

/* ブログ記事の末尾の CTA 帯 */
.article-cta{background:#22335C !important}
.article-cta .btn-ghost{border:1.5px solid rgba(255,255,255,.5) !important;box-shadow:none}
