/* ==========================================================================
   legal_page.css — /terms_and_conditions (利用規約) と /policy (プライバシーポリシー)
   Loaded AFTER new_preuploader.css; the pages share the /workspace header and
   theme tokens by putting both classes on body
   (class="new_preuploader legal_page"), like /notation_for_law
   (notation_for_law.css). Every rule here is scoped under
   body.new_preuploader.legal_page so specificity beats both single.css and the
   shared file regardless of load order.
   Light theme: black text on the page gradient (same as /notation_for_law).
   Dark theme (body.theme-dark): the --np tokens from new_preuploader.css.
   CSP: style-src 'self' — keep all styles in this file, no inline styles.
   ========================================================================== */

body.new_preuploader.legal_page {
    --lp-text: #000000;
    --lp-muted: #303030;
    --lp-rule: rgba(0, 0, 0, 0.35);
    --lp-link: #2012d7;
    color: var(--lp-text);
    line-height: 1.7;
}
body.new_preuploader.legal_page.theme-dark {
    --lp-text: var(--np-text);
    --lp-muted: var(--np-text-dim);
    --lp-rule: var(--np-border-color);
    --lp-link: var(--np-accent);
}

/* ルート要素の背景 (single.css の --main-background を np トークンに置換) */
body.new_preuploader.legal_page .legal_page_root {
    /* 背景は new_preuploader.css の body::before (固定レイヤー) が描く */
    background-image: none;
}
@media (max-width: 680px) and (orientation: portrait) {
    body.new_preuploader.legal_page:not(.theme-dark) {
        --np-page-bg: linear-gradient(#1764ff, #99c2bc);
    }
}

/* 本文の列 (/notation_for_law の .container と同じ幅) */
body.new_preuploader.legal_page .legal_container {
    max-width: 930px;
    margin: 0 auto;
    padding: 0 4rem 4rem;
    /* 長いメールアドレス・URL で横にはみ出さない */
    overflow-wrap: anywhere;
}
body.new_preuploader.legal_page .legal_updated {
    margin: 0.5rem 0 1rem;
    text-align: right;
    font-size: 0.9rem;
    color: var(--lp-muted);
}
body.new_preuploader.legal_page .legal_container p {
    margin: 0.6rem 0;
}
body.new_preuploader.legal_page .legal_container h2 {
    margin: 2rem 0 0.6rem;
    padding-bottom: 0.25rem;
    border-bottom: 1px solid var(--lp-rule);
    font-size: 1.1rem;
    font-weight: 700;
}

/* 条の項 (1. 2. …) */
body.new_preuploader.legal_page ol.legal_list {
    margin: 0.4rem 0;
    padding-left: 1.8rem;
}
body.new_preuploader.legal_page ol.legal_list > li {
    margin: 0.4rem 0;
    padding-left: 0.2rem;
}
/* 項の中の号 ((1) (2) …) */
body.new_preuploader.legal_page ol.legal_sublist {
    list-style: none;
    counter-reset: legal-sub;
    margin: 0.3rem 0;
    padding-left: 2.4rem;
}
body.new_preuploader.legal_page ol.legal_sublist > li {
    position: relative;
    counter-increment: legal-sub;
    margin: 0.25rem 0;
}
body.new_preuploader.legal_page ol.legal_sublist > li::before {
    content: "(" counter(legal-sub) ")";
    position: absolute;
    left: -2.4rem;
    width: 2rem;
    text-align: right;
}

body.new_preuploader.legal_page .legal_container a {
    color: var(--lp-link);
    text-decoration: none;
}
body.new_preuploader.legal_page .legal_container a:hover {
    text-decoration: underline;
}

@media (max-width: 680px) {
    body.new_preuploader.legal_page .legal_container {
        padding: 0 1rem 3rem;
    }
    body.new_preuploader.legal_page ol.legal_list {
        padding-left: 1.5rem;
    }
    body.new_preuploader.legal_page ol.legal_sublist {
        padding-left: 2.1rem;
    }
    body.new_preuploader.legal_page ol.legal_sublist > li::before {
        left: -2.1rem;
        width: 1.8rem;
    }
}