@charset "UTF-8";

/* ============================================================
   規約・プライバシーポリシー（2026-09-24 新規）

   完成像：WORKS/jpg_svg/完成像/pc_policy_terms-of-use.jpg
           WORKS/jpg_svg/完成像/pc_policy_privacy-policy.jpg
           WORKS/jpg_svg/完成像/sp_policy_terms-of-use.jpg

   完成像から測った値（CSS換算）
     PC : 本文の幅 700px（左端 370 / 右端 1070）／ページタイトル インク上端 206
          「概要」16px・下は1pxの下線（文字幅ぶん）／区切り線 1px・幅700
          本文 12px・行送り22px ／ 小見出し 13.5px ／ 末尾 11px
     SP : 本文の左右 5.33%（左端 20）／本文 12px・行送り22px
          ページタイトルの上からの位置は カスタマーサポートと同じ（依頼者指定）
   ============================================================ */

/* 共通の global.css はHTML側で読み込んでいる（他ページと同じ） */

/* 初期化。他ページの support.css の先頭と同じもの。
   これが無いと body の既定の余白8pxが残り、フッターが左右に8pxずれる */
html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6,
pre, form, fieldset, input, textarea, p, table, th, td, button {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
}

img {
    border: 0;
    max-width: 100%;
    height: auto;
}

main#contents {
    color: #151515;
    padding-top: 200px;
    padding-bottom: 140px;   /* 末尾テキストからフッターまで（2026-09-24 依頼者指定） */
}

#policy {
    /* 本文の幅は他ページ（.boxw700）と同じ700px */
    width: 700px;
    margin: 0 auto;
    /* 完成像は約物（句読点・括弧）が詰まる組み方。これが無いと1行に収まる行が折り返す */
    font-feature-settings: "palt";
}

.policy__title {
    font-size: 17.6px;
    line-height: 26.4px;
    /* 太さは指定しない。他ページの見出しと同じ既定（300）に揃える（2026-09-24 依頼者指定）
       本文の読みやすさを優先し、ページタイトルだけレギュラーに戻す */
    text-align: center;
    margin: 0;
}

.policy__body {
    margin-top: 69.5px;   /* 完成像：タイトルのインク下端 222.5 →「概要」のインク上端 296.5 */
}

/* ── 概要 ───────────────────────────── */
.policy__summary-ttl {
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: var(--bd-w-ja) !important;   /* 中太（2026-09-24 依頼者指定）
                                               global.css の body * { font-weight:300 !important } に勝たせるため !important */
    letter-spacing: .08em;
    margin: 0;
    padding-bottom: 8px;
    border-bottom: 1px solid #151515;
}

.policy__summary .policy__list {
    margin-top: 18px;
}

/* ── 区切り線（概要の下） ───────────────── */
.policy__rule {
    border: 0;
    border-top: 1px solid #c9c9c9;
    /* 罫線の上下のあき。PC・SPで同じ値にする（2026-09-28 依頼者指定）
       完成像 sp_policy_terms-of-use.jpg の実測：概要の最終行 → 罫線 60.5px ／ 罫線 → 見出し 60.5px
       変更前：PC 54.5px（画面58.1px）／ SP 36px（画面40.3px＝20px足りなかった） */
    margin: 56px 0 0;
    padding: 0;
}

/* ── 番号つきの各項 ─────────────────── */
.policy__sections {
    list-style: none;
    counter-reset: policy;
    /* 罫線の下のあき。PC・SPで同じ値（2026-09-28 依頼者指定）
       変更前：PC 55.5px（画面61.9px）／ SP 36px（画面41.7px）
       54px で画面60.0px。罫線の上（60.0px）とそろう */
    margin: 54px 0 0;
    padding: 0;
}

.policy__item {
    counter-increment: policy;
    position: relative;
    /* 項番を見出しの行に入れる（2026-09-28 別パターン）。
       見出しも本文も同じ左端にそろえ、字下げをしない。
       ひとつ前の案（項番だけ左に出し、見出しと本文を58px下げる）は
       テスト環境版/バックアップ/20260928_項番は左・本文はインデントあり に控えてある。 */
    padding-left: 0;
    /* 項どうしのあき。PC・SPで同じ値にする（2026-09-28 依頼者指定）
       ふつうSPは文字が小さいので余白も詰めるが、このページはPCとSPで文字サイズが同じなため。
       完成像 sp_policy_terms-of-use.jpg の実測：見出しのインク上端まで61px。
       行ボックスの上下の余白が 4.5+3.5=8px あるので 61-8 = 53px。
       変更前：PC 49.5px ／ SP 34px（SPは画面で42pxしかなく、19px足りなかった） */
    margin-top: 53px;
}

.policy__item:first-child {
    margin-top: 0;
}

/* 項番は見出しの行の先頭に置く（2026-09-28 別パターン）

   ★ 項番と見出しのあきは CSS で指定する（テキストのスペースは使わない）
     ・項番は counter() で自動採番しており、原稿（HTML）には項番の文字が無い。
       テキストでスペースを入れるには項番を手打ちすることになり、
       項を足したり消したりするたびに、以降の番号を全部振り直すことになる
     ・HTMLは半角スペースを続けて書いても1つに詰める。  を並べる必要があり、
       原稿を差し替えるときに消えやすい
     ・em で指定しておけば、あとで文字サイズを変えても、あきの比率が保たれる

   あきは 1em＝13.5px。完成像の実測は13.3px（半角スペース3つ分は11.4px）。 */
.policy__head::before {
    /* 規約は「項」。プライバシーポリシーは #policy に policy--jo を付けて「条」にする */
    content: "第" counter(policy) "項";
    margin-right: 1em;
    white-space: nowrap;   /* 「第11項」を途中で折り返さない */
}

/* プライバシーポリシーは「条」で数える（原稿の呼び方に合わせる） */
#policy.policy--jo .policy__head::before {
    content: "第" counter(policy) "条";
}

.policy__head {
    font-size: 13.5px;
    line-height: 20px;
    font-weight: var(--bd-w-ja) !important;   /* 中太（2026-09-24 依頼者指定）
                                               global.css の body * { font-weight:300 !important } に勝たせるため !important */
    margin: 0;
}

/* ── 本文 ───────────────────────────── */
#policy p {
    font-size: 12px;
    /* 行送り（2026-09-28 依頼者指定：20px）
       22px（完成像の実測値）→ 21px（商品詳細ページと同じ）→ 20px
       ポリシー2ページだけの値で、商品詳細・カスタマーサポートは21pxのまま */
    line-height: 20px;
    margin: 14px 0 0;
}

/* 段落と段落のあき（本文の中で情報を分けているところ）
   2026-09-28 依頼者指定：あきの種類を1つにそろえる。
   箇条書きの前後と同じ 7px（インクとインクのあいだ17px）にする。
   22px → 11px → 5px → 7px と調整してきた。
   空行は <br> を並べずに <p> を分けて作っているので、ここ1か所で全部決まる。
   原稿を差し替えても影響しない。 */
#policy p + p {
    margin-top: 7px;
}

/* 箇条書きの前後のあき（2026-09-28 依頼者指定：半分に詰める）
   14px → 7px → 5px → 7px と調整した（インクとインクのあいだ 24px → 17px）。
   見出しの直後の本文は 14px のままにするため、条の中の箇条書きだけに当てる。 */
.policy__item .policy__list {
    margin-top: 7px;
}

/* #policy を付けないと、上にある #policy p { margin: 14px 0 0 } に詳細度で負ける */
#policy .policy__item .policy__list + p {
    margin-top: 7px;
}

/* ただし見出しのすぐ下だけは別。段落が来るとき（14px）と同じにそろえる。
   規約 第1項のように見出しの直後が箇条書きの項で、ここだけ7pxになっていた
   （2026-09-28 最終チェックで見つけた） */
#policy .policy__head + .policy__list {
    margin-top: 14px;
}

.policy__list {
    list-style: none;
    margin: 14px 0 0;
    padding: 0;
}

.policy__list > li {
    font-size: 12px;
    line-height: 20px;   /* 本文と同じ（2026-09-28 依頼者指定） */
    /* 丸の左端は動かさず、丸と文字のあいだを2px広げる（2026-09-28 依頼者指定）
       変更前 7.5px（完成像：丸の左端370／文字の左端377.5） */
    padding-left: 9.5px;
    text-indent: -9.5px;
}

.policy__list > li::before {
    content: "\2022";   /* 小さい丸（完成像は中点ではなく丸） */
    display: inline-block;
    width: 9.5px;   /* 変更前 7.5px（2026-09-28 依頼者指定：2px広げる） */
    text-indent: 0;
}

.policy__list > li + li {
    margin-top: 0;
}

/* ── (a)(b)… の記号がつく箇条書き（規約 第7項）─────────
   折り返した2行目を本文の位置にそろえる（2026-09-28 依頼者指定）。
   記号は文字ごとに幅が違う（(a) 14.95px ／ (i) は細い）ので、
   span を固定幅にして本文の開始位置をそろえる。
   18px は完成像の実測（記号の左端 391 → 本文 408＝17px）に合わせた値。 */
.policy__list--alpha > li {
    padding-left: 18px;
    text-indent: -18px;
}

.policy__list--alpha > li::before {
    content: none;   /* 「•」は出さない。記号は本文側に持つ */
}

.policy__list--alpha .policy__mark {
    display: inline-block;
    width: 18px;
    text-indent: 0;
}

/* ── 末尾（更新日など） ─────────────────── */
.policy__note {
    font-size: 11px !important;
    line-height: 18px;
    margin-top: 56px !important;
}

/* ============================================================
   SP（859px以下）
   ============================================================ */
@media screen and (max-width: 859px) {

    main#contents {
        /* カスタマーサポートと同じ位置にページタイトルを置く（依頼者指定） */
        padding-top: 86.25px;
        padding-bottom: 50px;
    }

    #policy {
        width: auto;
        margin: 0;
        padding: 0 5.33%;
    }

    .policy__body {
        margin-top: 46px;
    }

    .policy__summary .policy__list,
    .policy__list {
        margin-top: 18px;
    }

    /* 本文の中のあきは1種類にそろえる（2026-09-28 依頼者指定）
       箇条書きの前後：18px → 9px → 7px ／ 段落と段落：22px → 11px → 7px → 9px */
    #policy .policy__item .policy__list,
    #policy .policy__item .policy__list + p,
    #policy p + p {
        margin-top: 9px;
    }

    /* 見出しのすぐ下だけは、段落が来るときと同じ14pxにそろえる */
    #policy .policy__head + .policy__list {
        margin-top: 14px;
    }

    /* 罫線の上下のあきは PC と同じ。SP だけの指定は置かない
       （2026-09-28 依頼者指定：PCとSPで文字サイズが同じため） */

    /* 項どうしのあきは PC と同じ 53px。SP だけの指定は置かない
       （2026-09-28 依頼者指定：PCとSPで文字サイズが同じため）
       ここで上書きすると、またPCとSPがばらばらになる */

    .policy__note {
        margin-top: 44px !important;
    }
}


/* 見出しの太さ（2026-09-24 依頼者指定：ミディアム）
   global.css に body * { font-weight:300 !important } があり、
   さらにJSが和文要素に .is-ja を付けて body .is-ja { font-weight:300 !important } も効く。
   それに勝つため、id を含む詳細度で書く。 */
#policy .policy__summary-ttl,
#policy .policy__head,
#policy .policy__head::before {
    font-weight: var(--bd-w-ja) !important;   /* 和文の中太＝500（Zen Kaku Gothic New に600が無いため） */
}