@charset "utf-8";
/* =========================================================
   特定商取引法に基づく表記 /law/  ページ固有CSS
   デザイン：デザインデータ/特定商取引法/特定商取引法.ai
             アートボード 1500.6 × 4577.2（pt=px・1:1）
   土台：assets/company.css（幅・色・見出し・本文・「楽に頼めて」・CTA余白）
   ※共通部品（header / sidebar / cta / footer / .cmp-closing / .cmp-photos2）は
     一切上書きしていない。ここは .law- から始まる独自クラスと、
     .cmp-〇〇.law-〇〇 の複合セレクタ（このページだけに効く）しか使わない。
   ========================================================= */

/* ---------- 本文カラムの上余白 ----------
   デザイン実測：ページタイトル帯の下端 y=626.3 → 表の1本目の罫線 y=754.5
   → 128.2px（会社概要は123.75px。ページごとに違うのでデザイン値を使う） */
.cmp-main.law-main{padding-top:128.2px;}

/* ---------- 「楽に頼めて」までの余白（調整なし・理由は下記） ----------
   このページは本文（表）が短く、右サイドバーのほうが下に出る。
   デザインも同じで、表の下端 y=2201.2 に対しサイドバーの下端は y=2220.8（19.6px下）。
   実装でも確定版サイドバーが本文より 19.8px 下に出るので、状況は一致している。

   デザイン：サイドバーの下端 2220.8 →「楽に頼めて」見出し 2412.3 ＝ 191.5px
   実装：.cmp-closing の margin-top:198.75px（確定版・変更禁止）
   → 7.3px 広い。確定版の値なので触らず、近似としてそのままにしている。 */

/* ---------- 表（14項目） ----------
   デザイン実測：罫線15本（表の上端1本＋14行の下線）
   ラベル x=276.3 / 15.0pt / HiraKakuPro-W6 / 本文 x=556.7 / 15.0pt / HiraKakuPro-W3
   → ラベル欄の幅 281.5px（表の左端 275.2 から本文の左端 556.7 まで）
   ※罫線の色は会社概要にそろえた（デザイン実測は15本とも #0054AC。
     ルール5章で「#0054AC は使わない」と確定しているため）*/
/* ★罫線は本文カラム（842px）いっぱいではなく、デザイン実測の 684.0px で止める。
   （和田さん指示 2026/08/28「本文の右の空白に線が走っているので消してほしい」）
   本文の折り返しを変えないよう、border ではなく疑似要素で線を引いている。
   デザインでは一部の本文がこの線より右にはみ出すが、それがデザインどおり。 */
.law-dl{
  margin:0;
  position:relative;   /* 上端の線は ::before（絶対配置）なので高さは取らない */
}
.law-dl::before{
  content:"";position:absolute;left:0;top:0;
  width:754px;height:1px;background:var(--rule-top);
}
.law-dl__row{
  display:flex;
  position:relative;
}
.law-dl__row::after{
  content:"";position:absolute;left:0;bottom:0;
  width:754px;height:1px;background:var(--rule);
}
.law-dl__t{
  flex:0 0 281.5px;
  font-size:15px;
  font-weight:700;
  color:var(--blue);
  line-height:27.1px;
}
.law-dl__d{
  flex:1 1 auto;
  min-width:0;
  font-size:15px;
  line-height:27.1px;   /* デザインの行ピッチ */
}
.law-dl__d p{margin:0;}

/* お支払方法の欄だけ行ピッチが狭い（デザイン実測 25.0px） */
.law-dl__d--narrow{line-height:25px;}

/* 「・」で始まる行は、中黒のぶんだけ左にぶら下げる（デザイン実測 3.8px） */
.law-b{margin-left:-3.8px;}
/* 折り返した2行目は中黒のぶんだけ下げる */
.law-ind{padding-left:15px;}

/* ---------- 行ごとの上下余白 ----------
   デザインの罫線の位置をそのまま再現するため、1行ずつ実測値で指定している。
   行の高さ ＝ 上余白 ＋ 行ピッチ×行数 ＋ 下余白
   （罫線は疑似要素で描いているので、下余白から引く必要はない。
   合計すると最後の罫線が y=2201.2 に一致する） */
.law-dl__row:nth-child(1){padding:15.4px 0 7.4px;}    /* 販売業者          49.9 */
.law-dl__row:nth-child(2){padding:21.5px 0 6.2px;}    /* 代表責任者        54.8 */
.law-dl__row:nth-child(3){padding:21.5px 0 9.2px;}    /* 所在地            57.8 */
.law-dl__row:nth-child(4){padding:21.5px 0 9.2px;}    /* 電話番号          57.8 */
.law-dl__row:nth-child(5){padding:21.5px 0 7.7px;}    /* 受付時間          56.3 */
.law-dl__row:nth-child(6){padding:21.5px 0 9.3px;}    /* 公開メールアドレス 57.9 */
.law-dl__row:nth-child(7){padding:21.5px 0 10.8px;}    /* ホームページURL   59.4 */
.law-dl__row:nth-child(8){padding:21.5px 0 16.2px;}   /* 販売価格         146.1 */
.law-dl__row:nth-child(9){padding:21.5px 0 11.7px;}   /* 商品引渡し時期   168.7 */
.law-dl__row:nth-child(10){padding:21.5px 0 17.9px;}  /* お支払方法        89.4 */
.law-dl__row:nth-child(11){padding:21.5px 0 18.8px;}  /* 商品代金以外     202.9 */
.law-dl__row:nth-child(12){padding:21.5px 0 25.3px;}  /* 返品・キャンセル 263.6 */
.law-dl__row:nth-child(13){padding:21.5px 0 10.8px;}   /* 返品期限          59.4 */
.law-dl__row:nth-child(14){padding:21.5px 0 19.9px;}  /* 返品時の送料     122.7 */

/* =========================================================
   スマホ（768px以下）
   ※このページはスマホ専用のデザインが無いため、会社概要と同じ作りにそろえた
   ========================================================= */
@media (max-width:768px){
  .cmp-main.law-main{padding-top:44px;}

  /* スマホでは線を画面幅いっぱいに戻す */
  .law-dl::before,
  .law-dl__row::after{width:100%;}

  .law-dl__row{display:block;}
  .law-dl__row:nth-child(1),
  .law-dl__row:nth-child(2),
  .law-dl__row:nth-child(3),
  .law-dl__row:nth-child(4),
  .law-dl__row:nth-child(5),
  .law-dl__row:nth-child(6),
  .law-dl__row:nth-child(7),
  .law-dl__row:nth-child(8),
  .law-dl__row:nth-child(9),
  .law-dl__row:nth-child(10),
  .law-dl__row:nth-child(11),
  .law-dl__row:nth-child(12),
  .law-dl__row:nth-child(13),
  .law-dl__row:nth-child(14){padding:16px 0 17px;}

  .law-dl__t{margin-bottom:6px;font-size:14px;line-height:1.6;}
  .law-dl__d{font-size:14px;line-height:2.05;}
  .law-dl__d--narrow{line-height:1.9;}
  .law-b{margin-left:0;}
  .law-ind{padding-left:14px;}
}

/* ★2026/09/03 修正：この754pxブロックがスマホ用メディアクエリの「外」に書かれていたため、
   スマホにも754pxが効いて、ページ全体が横に広がる崩れが起きていた（会社概要でクライアント指摘）。
   PC専用（min-width:769px）で包んで、スマホには効かないようにした。中身は1文字も変えていない。 */
@media (min-width:769px){
/* ★全ページ共通ルール（2026/08/28 和田さん確定）本文ブロックは754px。
   842px（本文カラムいっぱい）にしない。サイドバーに接触して見えるため。
   ※トップページと、サイドバーが無いページは対象外。 */
.law-dl,
.law-dl__row{width:754px;}
}
