/* 講座の詳細の部品（共通）の見た目。LP 側の変数 --ink --mute --line --accent --accent2 を使う（無ければ既定）
   見本＝spec-code/25 lp-hoshinoresorts_11（① の要項と同じ見本）: 丸い札の項目名・細い区切り線。地は明るいまま（長い一覧を読む表なので）
   スマホ（幅 560px まで）は項目名の札の下に中身を置く（右の列が細く折れすぎるため・tetsu 10-18 の近接の直し）。広い所では左に項目名の列
   表の中は読みやすさのためゴシック（② は申し込むだけのページ＝分かりやすさが一番・tetsu 2026-10-19）。申し込みページもこの形にそろえる（繋ぐ4本の③） */
.ld{--_ink:var(--ink,#2B2724);--_mute:var(--mute,#6F6A66);--_line:var(--line,#E3DCEA);--_accent:var(--accent,#6B5B9E);--_accent2:var(--accent2,#4A3C7A);--_tint:#EEE9F4;--_gold:var(--gold,#B89B5E);
  margin:0;container-type:inline-size;font-family:"Zen Kaku Gothic New","Hiragino Sans","Yu Gothic",sans-serif}
.ld-row{display:block;padding:20px 0 18px;border-bottom:1px solid var(--_line)}
.ld-row:last-child{border-bottom:0}
.ld-row dt{display:inline-block;margin:0 0 10px;padding:3px 14px 4px;border-radius:999px;background:var(--_tint);font-size:12.5px;font-weight:500;line-height:1.5;letter-spacing:.12em;color:var(--_accent2)}
.ld-row dd{margin:0;font-size:15px;line-height:1.8;letter-spacing:.03em;color:var(--_ink);word-break:auto-phrase}
@container (min-width:560px){
  .ld-row{display:grid;grid-template-columns:11em 1fr;gap:0 20px;align-items:start}
  .ld-row dt{justify-self:start;margin:2px 0 0}
}
/* 日時と締切は一番大事な数字なので、表の中で一段大きく太く（書体はページの表のまま） */
.ld-date dd{font-size:17px;font-weight:500;line-height:1.6}
.ld-date .ld-sub{font-weight:400}
.ld-sub{display:block;font-size:13px;line-height:1.7;color:var(--_mute);margin-top:2px}
.ld-price strong{font-size:32px;font-weight:500;letter-spacing:.02em;line-height:1.2}
.ld-inst{font-size:13px;color:var(--_mute);margin-top:10px}
.ld-inst-list{list-style:none;margin:2px 0 0;padding:0}
.ld-inst-list li{font-size:14px;color:var(--_ink);line-height:1.8}
.ld-lead{margin:0 0 6px}
/* 一覧: 小さな丸の印で1つずつ。名前の下に中身を小さく */
.ld-list{list-style:none;margin:0;padding:0}
.ld-list li{position:relative;padding:5px 0 5px 15px}
.ld-list li::before{content:"";position:absolute;left:1px;top:15px;width:5px;height:5px;border-radius:50%;background:var(--_accent);opacity:.7}
.ld-name{display:block;font-size:15px;font-weight:500;line-height:1.7}
.ld-name em{font-style:normal;font-weight:400;font-size:13px;color:var(--_mute);margin-left:.6em}
.ld-note{display:block;font-size:13px;color:var(--_mute);line-height:1.65}
.ld-hint{margin:10px 0 0;font-size:13px;line-height:1.75;color:var(--_mute)}
.ld-photos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.ld-photos img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px;display:block}
.ld-link{display:inline-block;margin-top:8px;font-size:14px;color:var(--_accent);text-decoration:underline;text-underline-offset:3px}
.ld-foot{font-size:12.5px;color:var(--_mute);line-height:1.8;margin:14px 0 0}
.ld-fallback{font-size:15px;color:var(--_ink);line-height:1.9;margin:0}
.ld-fallback-link{margin:14px 0 0}
.ld-fallback-link a{display:inline-block;padding:10px 24px;border:1px solid var(--accent,#6B5B9E);border-radius:999px;color:var(--accent,#6B5B9E);text-decoration:none;font-size:14px;font-family:"Zen Kaku Gothic New","Hiragino Sans",sans-serif}
.ld-foot a{color:var(--_accent);text-decoration:underline;text-underline-offset:3px}
/* 料金の数字＝Jost（tetsu 2026-10-19「料金だけでよかったんだよ」・日時と締切は段の見た目に合わせる）。ページの head で Jost を読み込む。太さは周りに合わせる（目安 400〜500・300 は 6・8・9・0 が見分けにくいので使わない・読み込むのは 400 と 500 だけ）。ページの手書きの料金の数字も同じ印で包む */
.ld-num{font-family:"Jost","Zen Kaku Gothic New","Hiragino Sans",sans-serif;letter-spacing:.01em;font-feature-settings:"pnum";font-variant-numeric:proportional-nums}  /* 幅そろえの数字だと「11」の間が空く＝ふつうの数字の幅に */
/* 講座サイトの license・note から作る1行ずつの一覧（data-ld-lines・2026-10-19）。置き場はページの段の中なので、LP 側の変数を直接使う。印・大きさはページが上書きしてよい */
.ld-lines{list-style:none;margin:4px 0 0;padding:0}
.ld-lines li{position:relative;padding-left:1.1em;line-height:1.8}
.ld-lines li::before{content:"";position:absolute;left:.2em;top:.75em;width:.36em;height:.36em;border-radius:50%;background:var(--accent,#6B5B9E)}
.ld-lines-lead{margin:4px 0 0}
.ld-lines-link{margin:6px 0 0}
.ld-lines-link a{color:var(--accent,#6B5B9E);text-decoration:underline;text-underline-offset:3px}