/* =========================================================
   ACTIVE 2 テーマ — 詳細ページ(告知/レポート)追加スタイル
   ベースは styles.css（同フォルダ）を共有。ここは詳細ページ用の追加のみ。
   案Jからの改訂: 時刻・日付のOswald化 / 赤オフセット枠のz-index修正 /
                  絵文字廃止(💡→POINTラベル) / SP余白調整
   共通の詳細クラス: .dt-head / .dt-article / .info-table / .timetable
                     / .apply-box / .photo-grid / .voice / .check-list
   ========================================================= */

/* パンくず */
.dt-breadcrumb{font-size:12px;color:var(--ink-2);font-weight:700;letter-spacing:.04em;padding-top:26px}
.dt-breadcrumb a{color:var(--ink-2)}
.dt-breadcrumb a:hover{color:var(--red)}
.dt-breadcrumb .sep{margin:0 8px;color:var(--mute)}

/* ページヘッド */
.dt-head{background:#fff;border-bottom:1px solid var(--line);padding-bottom:34px}
.dt-head .meta-row{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 14px}
.dt-head h1{font-size:clamp(24px,4.2vw,42px);font-weight:900;line-height:1.4;letter-spacing:.01em}
.dt-head .dt-dateline{margin-top:16px;font-size:14px;font-weight:700;color:var(--red);letter-spacing:.04em}
.dt-head .dt-dateline .en{font-size:15px;letter-spacing:.08em}
.dt-head .dt-dateline a{color:var(--ink);border-bottom:2px solid var(--yellow)}

/* メインビジュアル */
.dt-hero{position:relative;margin:34px auto 0;max-width:1180px;width:86%}
.dt-hero::before{content:"";position:absolute;inset:14px -14px -14px 14px;border:2px solid var(--red)}
.dt-hero .frame{position:relative;z-index:1;overflow:hidden;aspect-ratio:16/9}
.dt-hero .frame img{width:100%;height:100%;object-fit:cover}

/* 本文カラム */
.dt-article{padding:clamp(40px,6vw,72px) 0 clamp(56px,8vw,96px)}
.dt-inner{width:88%;max-width:760px;margin:0 auto}
.dt-inner > p{font-size:15.5px;color:var(--ink-2);margin-bottom:18px;line-height:2}
.dt-inner > p strong{color:var(--ink);font-weight:700;border-bottom:2px solid var(--yellow)}
.dt-inner h2{font-size:clamp(20px,3vw,26px);font-weight:900;margin:48px 0 18px;padding-left:16px;position:relative;line-height:1.5}
.dt-inner h2::before{content:"";position:absolute;left:0;top:.18em;bottom:.18em;width:5px;background:var(--red)}
.dt-inner h3{font-size:18px;font-weight:900;margin:32px 0 12px}
.dt-inner a.inline{color:var(--red);font-weight:700;border-bottom:1px solid var(--red)}

/* こんな人におすすめ */
.check-list{list-style:none;margin:8px 0;padding:0;display:flex;flex-direction:column;gap:12px}
.check-list li{position:relative;padding:14px 18px 14px 48px;background:var(--cream);font-weight:700;font-size:15px}
.check-list li::before{content:"";position:absolute;left:18px;top:50%;transform:translateY(-50%);width:22px;height:22px;border-radius:50%;background:var(--red) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="3.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12.5l4.6 4.5L19 7.5"/></svg>') center/13px no-repeat}

/* 開催概要テーブル */
.info-table{width:100%;border-collapse:collapse;margin:10px 0;font-size:14.5px}
.info-table th,.info-table td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:top}
.info-table th{width:120px;background:var(--cream);font-weight:900;color:var(--ink);white-space:nowrap}
.info-table td{color:var(--ink-2)}
.info-table td strong{color:var(--ink);font-weight:700}

/* タイムテーブル */
.timetable{list-style:none;margin:10px 0;padding:0}
.timetable li{display:flex;gap:18px;padding:14px 0;border-bottom:1px dashed var(--line)}
.timetable .t{flex:none;width:64px;font-family:var(--font-en);font-weight:600;font-size:16px;color:var(--red);letter-spacing:.06em;line-height:1.75}
.timetable span:last-child{color:var(--ink-2);font-size:14.5px}

/* 申込ボックス */
.apply-box{background:var(--ink);color:#fff;padding:clamp(28px,5vw,44px);text-align:center;margin-top:48px}
.apply-box h2{font-size:clamp(20px,3vw,26px);font-weight:900;margin-bottom:8px;padding:0;color:#fff}
.apply-box h2::before{display:none}
.apply-box p.note{font-size:12.5px;color:rgba(255,255,255,.7);margin-top:14px;line-height:1.7}
.apply-box .btn{margin-top:8px;max-width:100%;white-space:normal}

.dt-foot-note{margin-top:40px;font-size:13px;color:var(--mute);line-height:1.8}

/* レポート: 写真グリッド */
.photo-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:28px 0}
.photo-grid figure{margin:0;overflow:hidden;aspect-ratio:4/3;position:relative}
.photo-grid img{width:100%;height:100%;object-fit:cover}
.photo-grid figcaption{position:absolute;left:0;bottom:0;background:rgba(22,22,22,.78);color:#fff;font-size:11px;font-weight:700;padding:5px 10px}

/* レポート: 参加者の声 */
.voice{background:var(--cream);border-left:5px solid var(--red);padding:22px 24px;margin:22px 0;font-weight:700;font-size:16px;line-height:1.8}
.voice .who{display:block;margin-top:10px;font-size:12.5px;font-weight:700;color:var(--ink-2)}

/* 次回イベント/関連 */
.dt-related{background:var(--cream);padding:clamp(28px,5vw,44px);text-align:center;margin-top:48px}
.dt-related .sub{font-size:12px;color:var(--purple);margin-bottom:8px;display:block}
.dt-related h2{font-size:clamp(19px,2.6vw,24px);font-weight:900;margin-bottom:18px;padding:0}
.dt-related h2::before{display:none}
.dt-related .btn{max-width:100%;white-space:normal}

/* 提案用補足ノート（実サイトには出さない想定） */
.proposal-note{margin-top:40px;background:#fff8e6;border:1px dashed var(--yellow);padding:18px 20px;font-size:13px;color:var(--ink-2);line-height:1.8}
.proposal-note strong{color:var(--ink)}
.proposal-note .pt{display:inline-block;font-family:var(--font-en);font-weight:600;font-size:11px;letter-spacing:.12em;text-transform:uppercase;background:var(--yellow);color:var(--ink);padding:2px 8px;margin-right:8px}

@media(max-width:600px){
  .photo-grid{grid-template-columns:1fr}
  .info-table th{width:92px;padding:12px 12px}
  .info-table td{padding:12px 12px}
  .timetable li{gap:12px}
}