/* ================================================================
   テーマ別プログラムの規約系ページ（/program/kiyaku・/program/tokushoho）専用CSS
   program.css → program-index.css の後に読む。どちらも1バイトも変更しない。
   接頭辞は pl-（program legal）。色とヘッダー・フッターは program-index.css の hub- を借りる。
   ---------------------------------------------------------------- */

/* ---- ベース ----
   program-index.css のベース指定は .program-lp--index に閉じているため、
   同じ4項目をこのページの body クラスにも与える（本文の組版が一覧TOPと揃う） */
.program-lp--legal *::before,
.program-lp--legal *::after { box-sizing: border-box; }
body.program-lp--legal {
    font-size: 16px;
    line-height: 1.9;
    letter-spacing: 0;
    overflow-wrap: normal;
    font-feature-settings: "palt";
}
/* program.css の .program-lp h1〜h3（font-weight 600 / line-height 1.55・詳細度 0,1,1）を戻す。
   これも 0,1,1 なので、個別の見出し指定は h2.pl-h2 のように要素名付きで書いて勝たせる */
.program-lp--legal h1,
.program-lp--legal h2 { margin: 0; font-weight: 600; line-height: inherit; }

/* ---- ページ全体 ---- */
.pl-wrap { padding-block: 48px 72px; }
h1.pl-title {
    font-family: var(--lp-serif);
    font-size: clamp(22px, 4.2vw, 30px);
    line-height: 1.5;
    font-weight: 500;
    padding-bottom: 20px;
    margin-bottom: 32px;
    border-bottom: 1px solid var(--lp-line);
}

/* ---- 本文 ---- */
.pl-doc { max-width: 800px; font-size: 15px; }
.pl-lead { margin-bottom: 36px; color: var(--lp-ink); }
h2.pl-h2 {
    font-size: 17px;
    font-weight: 700;
    line-height: 1.6;
    margin: 36px 0 12px;
    padding-left: 12px;
    border-left: 3px solid var(--lp-sage);
}
.pl-doc p { margin-bottom: 12px; }
.pl-doc p:last-child { margin-bottom: 0; }

/* 条文の項（1. 2. 3.）と号（(1) (2) (3)）。
   program.css の .program-lp ul, .program-lp ol { list-style: none }（詳細度 0,1,1）に
   クラス単体（0,1,0）では負けて番号が消えるため、番号を戻す指定は要素名付きで書く */
.pl-ol,
.pl-go { margin: 0 0 12px; padding-left: 2.2em; }
.program-lp--legal ol.pl-ol { list-style: decimal outside; }
.pl-go { counter-reset: pl-go; }
.pl-go > li { counter-increment: pl-go; position: relative; }
.pl-go > li::before {
    content: "(" counter(pl-go) ")";
    position: absolute;
    left: -2.2em;
    width: 2.2em;
}
.pl-ol > li,
.pl-go > li { margin-bottom: 6px; }

/* ---- 特商法の項目表 ---- */
.pl-dl { margin-bottom: 32px; border-top: 1px solid var(--lp-line); }
.pl-dl dt {
    font-weight: 700;
    font-size: 14px;
    padding: 16px 0 4px;
    color: var(--lp-sage-deep);
}
.pl-dl dd { padding: 0 0 16px; border-bottom: 1px solid var(--lp-line); }
.pl-dd-sub { margin-top: 10px; font-weight: 700; }
.pl-list { margin: 4px 0 8px; padding-left: 1.1em; }
.program-lp--legal ul.pl-list { list-style: disc outside; }
.pl-list > li { margin-bottom: 4px; }

/* ---- 補足・日付・戻り導線 ---- */
.pl-note { font-size: 13px; color: var(--lp-ink-soft); }
.pl-note--block { display: block; margin-top: 24px; }
.pl-date { margin-top: 40px; font-size: 14px; color: var(--lp-ink-soft); }
.pl-back { margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--lp-line); font-size: 14px; }

/* リンクは program.css の .program-lp a（color: inherit / text-decoration: none・詳細度 0,1,1）に
   勝たせる必要があるため、要素名付き（0,2,1）で状態ごとに指定する */
.program-lp--legal a.pl-link,
.program-lp--legal a.pl-link:link,
.program-lp--legal a.pl-link:visited {
    color: var(--lp-sage-deep);
    text-decoration: underline;
    text-underline-offset: 2px;
}
.program-lp--legal a.pl-link:hover,
.program-lp--legal a.pl-link:focus,
.program-lp--legal a.pl-link:active { color: var(--lp-ink); }

@media (max-width: 640px) {
    .pl-wrap { padding-block: 32px 56px; }
    h1.pl-title { margin-bottom: 24px; }
    .pl-doc { font-size: 14.5px; }
    h2.pl-h2 { margin-top: 28px; }
    .pl-ol,
    .pl-go { padding-left: 1.8em; }
    .pl-go > li::before { left: -1.8em; width: 1.8em; }
}

/* パンくずの左端を本文（.hub-inner）に揃える。
   .hub-inner は width:min(--hub-w, 100% - 48px) で左右が 24px ずつ空くため、同じ計算にする */
.program-lp--legal .lp-crumb { max-width: none; width: min(var(--hub-w), 100% - 48px); padding-left: 0; padding-right: 0; }