@charset "UTF-8";
/* ==========================================================================
   privacy.css — プライバシーポリシー（10 privacy.html） ページ固有スタイル（p-）
   参照カンプ：comps/pc/10_privacy_pc_01・10_privacy_pc_02（PC2枚のみ。SPカンプ無し）
   共通トークン＝base.css／共通c-・l-＝common.css。ここはページ固有のみ。
   ヒーロー大見出し＝common .c-heading--page／末尾CONTACT＝common .c-contact を使用。
   画像パス：page CSS は url(../../images/…)（2つ上）— CLAUDE.md §6.1
   ========================================================================== */

/* ページスコープ変数（他ページ確定で base.css へ昇格） */
.p-privacy {
  --pv-window-line: #888888; /* 相談窓口ボックスの枠色 */
}

/* --------------------------------------------------------------------------
   ページヒーロー（大見出し＋パンくず。写真無し）
   -------------------------------------------------------------------------- */
.p-privacy-hero { padding-block: var(--sp-6) var(--sp-5); }

.p-privacy-hero__head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

/* ヒーロー内パンくずは大見出し直下。共通c-breadcrumbの上下paddingを詰める */
.p-privacy-hero .c-breadcrumb { padding-block: var(--sp-3) 0; }

/* --------------------------------------------------------------------------
   本文ブロック（リード＋第1〜8条＋相談窓口）
   区切り線はコンテンツ幅いっぱい、本文テキストはやや内側の読みやすい列幅
   -------------------------------------------------------------------------- */
.p-privacy-body { padding-block: var(--sp-4) var(--sp-4); }

/* 全幅の細い区切り線（カンプ：ヒーロー下と相談窓口下） */
.p-privacy__rule {
  height: 0;
  border: 0;
  border-top: 1px solid var(--c-line);
}

.p-privacy__rule--bottom { margin-top: var(--sp-12); }

/* 本文の読み幅（カンプ：区切り線より内側に寄る） */
.p-privacy__inner {
  max-width: 900px;
  margin-inline: auto;
  padding-top: var(--sp-6);
}

.p-privacy__lead {
  line-height: 2;
}

/* 各条ブロック：条間はゆったり */
.p-privacy__articles {
  margin-top: var(--sp-8);
  display: flex;
  flex-direction: column;
  gap: var(--sp-6);
}

.p-privacy__heading {
  font-size: var(--fs-lg); /* 18px */
  font-weight: 700;
  line-height: 1.6;
}

.p-privacy__text {
  margin-top: var(--sp-3);
  line-height: 2;
}

/* 箇条書き（・）：第3条・第5条。ぶら下げインデントで折返しを揃える */
.p-privacy__list {
  margin-top: var(--sp-3);
}

.p-privacy__list > li {
  position: relative;
  padding-left: 1.6em; /* 「・」＋テキストの間隔を確保 */
  line-height: 1.9;
}

.p-privacy__list > li::before {
  content: "・";
  position: absolute;
  left: 0;
  width: 1em; /* 「・」の占有幅を固定し、テキストとの間を空ける */
  color: var(--c-text);
}

.p-privacy__list > li + li { margin-top: var(--sp-1); }

/* 番号付きリスト（1. 2.）：第4条。ネイティブのdecimalでぶら下げ。
   base.css の ol[class]{list-style:none;padding:0}（詳細度0,1,1）を上回るため型付きセレクタで指定 */
ol.p-privacy__olist {
  margin-top: var(--sp-3);
  padding-left: 1.8em;
  list-style: decimal;
}

ol.p-privacy__olist > li {
  line-height: 1.9;
  padding-left: .3em;
}

ol.p-privacy__olist > li + li { margin-top: var(--sp-2); }

/* --------------------------------------------------------------------------
   相談窓口ボックス（角丸・細罫線。中央寄せ見出し＋左寄せの情報）
   -------------------------------------------------------------------------- */
.p-privacy-window {
  margin-top: var(--sp-6); /* FN修正指示（2026-08-07）：本文との間隔を半分に（sp-12→sp-6） */
  padding: 25px 120px;
  border: 1px solid var(--pv-window-line);
  border-radius: 20px;
}

.p-privacy-window__title {
  text-align: center;
  font-size: var(--fs-lg); /* 18px */
  font-weight: 700;
  line-height: 1.5;
}

.p-privacy-window__body {
  margin-top: var(--sp-5);
  line-height: 1.9;
}

.p-privacy-window__body p + p { margin-top: var(--sp-1); } /* FN修正指示（2026-08-07）：行間が広く見えるため詰める（sp-2→sp-1） */

/* 制定日（FN修正指示 2026-08-07 で追加）：ボックス内側の文字左端に揃える＝padding-left をボックスの左パディングと同値に */
.p-privacy__date {
  margin-top: var(--sp-3);
  padding-left: 120px;
}

/* ==========================================================================
   SP（〜767px）：カンプ支給無し。TOP/features の縮退ルールで展開
   ========================================================================== */
@media (max-width: 767px) {

  .p-privacy-hero { padding-block: var(--sp-4) var(--sp-3); }

  .p-privacy-body { padding-block: var(--sp-2) var(--sp-2); }

  .p-privacy__inner { max-width: none; padding-top: var(--sp-5); }

  .p-privacy__rule--bottom { margin-top: var(--sp-8); }

  .p-privacy__articles { gap: var(--sp-5); }

  .p-privacy-window {
    margin-top: var(--sp-4); /* PCの半減（sp-12→sp-6）に合わせ SP も半分（sp-8→sp-4） */
    padding: var(--sp-5) var(--sp-4);
  }

  .p-privacy__date { padding-left: var(--sp-4); } /* SPのボックス左パディングに追従 */
}
