@charset "UTF-8";
/* =========================================================
   /ohanashikai/YYYYMM/ お話会ページ（アーカイブ）共通テンプレート
   ========================================================= */

.page-title--archive { font-size: clamp(1.25rem, 2.8vw, 1.75rem); }
.page-title-tag {
  display: inline-block; margin-bottom: .6rem; padding: .1em .9em;
  border: 1px solid rgba(255,255,255,.5); font-family: var(--sans); font-size: .7rem; font-weight: 700; letter-spacing: .2em;
}

/* ---------- メインビジュアル＋開催情報 ---------- */
.archive-hero { display: grid; grid-template-columns: 1.15fr 1fr; gap: 2.4rem; align-items: center; text-align: left; }
@media (max-width: 860px) { .archive-hero { grid-template-columns: 1fr; gap: 1.6rem; } }
.archive-hero-img img { width: 100%; display: block; aspect-ratio: 960 / 790; object-fit: cover; }
@media (max-width: 760px) { .archive-hero-img img { aspect-ratio: 4 / 5; } }
.archive-catch { margin: 0 0 1.2rem; font-family: var(--serif); font-weight: 700; font-size: 1.1rem; line-height: 1.8; color: var(--black); }
.archive-meta { margin: 0 0 1.6rem; border-top: 1px solid var(--line); font-size: .85rem; }
.archive-meta div { display: grid; grid-template-columns: 6em 1fr; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid var(--line); }
.archive-meta dt { color: var(--ink-soft); }
.archive-meta dd { margin: 0; }

/* ---------- 価格ボックス（通常価格＋サロン会員は見放題） ---------- */
.buy-box { background: var(--paper); border: 1px solid var(--line); border-top: 4px solid var(--black); padding: 1.6rem 1.6rem 1.4rem; text-align: center; }
.buy-box-label { margin: 0; font-size: .75rem; color: var(--ink-soft); }
.buy-box-price { margin: 0 0 1rem; font-family: var(--serif); font-weight: 700; font-size: 2.1rem; color: var(--black); line-height: 1.3; }
.buy-box-price small { font-family: var(--sans); font-size: .7rem; font-weight: 500; margin-left: .3em; color: var(--ink-soft); }
.buy-box .btn { display: block; }
.buy-box-member {
  margin: 1.2rem 0 0; padding: 1rem; background: var(--pink-mist);
  font-size: .85rem;
}
.buy-box-member strong { display: block; font-family: var(--serif); font-size: 1.05rem; color: var(--berry); }
.buy-box-member .link-arrow { margin-top: .4rem; font-size: .82rem; }
.buy-box--wide { max-width: 640px; margin: 0 auto; }

/* ---------- 本文（元LPの文章。短い行で区切ってセンター寄せ） ---------- */
.story { max-width: 720px; margin: 0 auto; }
.story p { margin: 0 0 1.4em; }
.story .story-em { font-family: var(--serif); font-weight: 700; font-size: 1.1rem; color: var(--black); }

/* お話しした内容 */
.topic-list { max-width: 860px; margin: 0 auto; display: grid; gap: 1.2rem; counter-reset: topic; text-align: left; }
.topic { position: relative; background: var(--paper); padding: 1.6rem 1.8rem 1.4rem 4.6rem; box-shadow: 0 2px 10px rgba(0,0,0,.04); }
.topic::before {
  counter-increment: topic; content: counter(topic, decimal-leading-zero);
  position: absolute; left: 1.4rem; top: 1.4rem;
  font-family: var(--serif); font-size: 1.6rem; font-weight: 700; color: var(--magenta); line-height: 1;
}
.topic h3 { margin: 0 0 .6rem; font-family: var(--serif); font-size: 1.1rem; line-height: 1.6; color: var(--black); }
.topic p { margin: 0 0 .8em; font-size: .88rem; }
.topic p:last-child { margin: 0; }
@media (max-width: 760px) { .topic { padding: 3.4rem 1.2rem 1.2rem; } .topic::before { left: 1.2rem; top: 1.1rem; } }

/* こんな方へ */
.for-list { max-width: 760px; margin: 0 auto; display: grid; gap: .6rem; text-align: left; }
.for-list li { position: relative; padding: .8rem 1rem .8rem 2.6rem; background: var(--paper); border: 1px solid var(--line); font-size: .88rem; }
.for-list li::before { content: "✓"; position: absolute; left: 1rem; top: .8rem; color: var(--magenta); font-weight: 700; }

/* 関連アーカイブ */
.related-more { margin-top: 2rem; }
.page-title-archive { display: block; margin-top: .3rem; font-size: .7em; color: var(--orchid); letter-spacing: .1em; }

/* ---------- サイト共通デザイン版（tools/common-archive.js）で使う追加 ---------- */
/* 画像内に文字が入っているバナーは切り抜かず、そのままの比率で見せる */
.archive-hero-img--natural img { aspect-ratio: auto !important; object-fit: contain; }
.buy-box-note { margin: 1rem 0 0; font-size: .75rem; color: var(--ink-soft); }
/* 2つの生き方などの対比 */
.choice-list { max-width: 720px; margin: 0 auto 1.6rem; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.choice { margin: 0; padding: 1.1rem 1rem; background: var(--paper); border: 1px solid var(--line); border-top: 3px solid var(--magenta); font-family: var(--serif); font-weight: 700; color: var(--black); }
@media (max-width: 560px) { .choice-list { grid-template-columns: 1fr; } }
.story--after { margin-top: 1.8rem; }