/* /committee/ 固有。接頭辞は cm-。 */

/* ★ このページだけ入口が薄い（4枚のうち唯一、惹句・申込ボタン・写真が無い）。
     そのままだと 1440×900 でも 1280×800 でも、1画面目が入口を通り越して
     次の節の本文を途中で切ってしまう（実測）。下に余白を足して、
     **1画面目は入口で完結し、次の節は見出しから始まる**形にそろえる。
     入口の上の余白は _emph.style（4枚共通）で足している。 */
#lead.ahead.lg{padding-bottom:88px}
@media(max-width:860px){ #lead.ahead.lg{padding-bottom:44px} }

/* 375px で h1 が「支部役員グループと代表／グループ」と語の途中で割れる。
   グラデ文字（em.g）を1かたまりにすると「支部役員グループと／代表グループ」に収まる（実測）。
   ★ .nw（inline-block）は使わない。em.g は background-clip:text なので
     包みを入れるとその語が透明になって消える → [[japanese-line-break-inline-block]]。 */
@media(max-width:520px){ #lead h1 em.g{white-space:nowrap} }

/* 開催サイクル。曜日と時間だけを、罫と余白で並べる（枠で囲まない） */
.cm-cyc{display:grid;grid-template-columns:repeat(2,1fr);gap:0 44px;margin:44px auto 0;
  max-width:44rem;position:relative;z-index:2}
.cm-cyc .i{border-top:2px solid var(--aq);padding:20px 0 22px}
.cm-cyc .i:nth-child(2){border-top-color:var(--pk)}
.cm-cyc .w{font-size:clamp(17px,2.1vw,21px);font-weight:600;letter-spacing:.05em;color:var(--ink)}
.cm-cyc .t{margin-top:10px;font-family:var(--en);font-size:clamp(19px,2.4vw,26px);font-weight:700;
  letter-spacing:.01em;color:var(--aq-t)}
.cm-cyc .i:nth-child(2) .t{color:var(--pk-t)}
/* 1つしか無いとき（局長会議）は横に伸ばさず、左半分に置く */
.cm-cyc .i:only-child{grid-column:1/2}

.cm-note{max-width:44rem;margin:18px auto 0;font-size:13px;color:var(--ink-2);letter-spacing:.04em}

@media(max-width:720px){
  .cm-cyc{grid-template-columns:1fr;gap:0}
  .cm-cyc .i:only-child{grid-column:auto}
}
/* ============================================================
   4枚（komon / reportroom / planningroom / committee）の共通上書き。
   組み立て時に各ページの <style> の末尾へ差し込んでいる。
   ============================================================ */

/* ★ 1画面目に余白を持たせる（2026-08-14 菅さん「上に詰まっていて縦幅の余白がない」）。
     mc.css の `.ahead{padding:calc(var(--hdh,71px) + 34px) 0 0}` だと、
     ヘッダーの下 34px でいきなりラベルが始まる。**入口は縦に呼吸させる。**
     ここを広げると写真の始まりも下がり、1画面目が「文とボタンで完結して、
     写真は次の画面の頭が少し覗く」形になる（1440×900 で実測して決めた）。 */
.ahead.lg{padding-top:calc(var(--hdh,71px) + 78px)}
.ahead.lg .lab{margin-bottom:6px}
.ahead.lg h1{margin-top:32px}
.ahead.lg .credoline{margin-top:34px}
.ahead.lg .lead{margin-top:34px;max-width:47rem}
/* ★ 入口のリードは 34rem（mc.css の既定）だと1行が短く、
     幅いっぱいまで詰める設定と噛み合って「マーチャ／ントクラブ」のように
     カタカナの途中で切れやすい。47rem にすると語が収まる（実測）。
     52rem まで広げると1行45字を超えて読みにくいので、47rem で止める。 */
.ahead.lg .acts{margin-top:42px}
.km-band, .rr-band, .pr-band{margin-top:84px}
@media(max-width:860px){
  .ahead.lg{padding-top:calc(var(--hdh,71px) + 44px)}
  .km-band, .rr-band, .pr-band{margin-top:52px}
}

/* ★ 節の見出しは中央寄せ（2026-08-14 菅さん「ヘッダー以外の見出しは中央寄せが良い」。
     まず /komon/ で見てもらい、4枚に広げる判断をいただいた）。
     中央になるのは .head-out の中＝ラベル（.lab）・見出し（.h2）・
     見出し直下の一行（.guide）だけ。
   ※ **入口（#lead）は左揃えのまま**（菅さん「入口の大見出しはこのまま」）。
     .sec を付けて縛るのはそのため。入口は .ahead で .sec ではない。
   ※ **中央にするのは見出しだけ。本文は左揃えのまま。**
     段落・箇条書き・カードに text-align:center を当てない
     → [[centered-headings-left-body-text]]（箱は中央・文字は左揃え）。
     読み物（.read）はもともと箱が中央にあるので、見出しを中央にすると軸がそろう。
   ※ .lab は inline-flex（頭に水色の罫が付く）なので、親の text-align だけで寄る。 */
body .sec .head-out{text-align:center}
/* ★ ただし見出しの下に**文章**が入っている節がある（/reportroom/ の #what と #value、
     /planningroom/ の2箇所）。4〜5行あるので、中央にすると行頭がそろわず読みづらい。
     **箱は中央のまま・文字は左揃え**に戻す（これが基準）
     → [[centered-headings-left-body-text]]
   ※ .guide（＜面接を通じて…＞のような1行の前振り）は見出しの一部なので中央のまま。 */
body .sec .head-out p:not(.guide){text-align:left;margin-left:auto;margin-right:auto}

/* ★ 強調は「太字と字間」だけ。色文字と下線はやめる（2026-08-14 菅さん指定）。
     mc.css の em.a（水色文字＋ピンク下線）/ em.p（ピンク文字＋水色下線）を打ち消す。
     墨は本文より一段濃くするに留める → [[typography-avoid-bold-pop]]
   ※ h1 のグラデ文字（em.g）は題字なので残す。
   ※ **4枚（komon / reportroom / planningroom / committee）にだけ当てている。**
     mc.css に入れて全ページへ広げるかは菅さんの判断。
   ※ mc.css に勝つため body を1つ足して詳細度を上げる
     → [[parent-theme-link-color-specificity]]

   ★ ただし**見出しには当てない**（2026-08-14 菅さん「見出しの色味が全部退化してしまっている」）。
     最初に節ごと（.sec / #lead）へ当てたら、h1・h2・h3 の強調まで墨一色になって
     ページから色が消えた。**菅さんの指示は「強調する"文章"」＝本文のこと。**
     見出し（h1 / .h2 / h3 / h4 / .credoline）は mc.css のまま
     ＝ em.a 水色文字＋ピンク下線 / em.p ピンク文字＋水色下線 / em.g グラデ。
     打ち消すのは **段落（.credoline を除く p）と箇条書き（li）の中だけ**。 */
body p:not(.credoline) em.a, body p:not(.credoline) em.p,
body li em.a, body li em.p{
  font-style:normal;
  font-weight:600;
  color:#111a22;
  letter-spacing:.06em;
  background:none;
  border-bottom:0;
  box-shadow:none;
  text-decoration:none;
  padding:0;
}

/* ★ 文章は「幅いっぱいまで詰めてから折り返す」（2026-08-14 菅さん「謎の折り返しをやめてほしい」）。
     mc.css は本文に text-wrap:pretty、締めの段落に balance を当てている。
     balance は**全部の行の長さを揃えようとする**ので、まだ幅が余っていても早く折り返す。
     これが「文の途中で不自然に切れている」ように見えていた正体。
     pretty も末尾行の調整のために手前の行を短くすることがある。
     → 段落は text-wrap:auto に戻し、幅で決まるところで折り返させる。
     ※ 見出し（h1/h2/h3）は短いので balance のままにしている。
     ※ 締めの段落は mc.css 側が `.read p.closer`（詳細度 0,2,1）で balance を当てているので、
     `body .closer`（0,1,1）では負ける。**`body .read p.closer` まで書いて勝たせること。**
     → [[parent-theme-link-color-specificity]]
     ※ **`word-break:auto-phrase` も一緒に外すこと。** これが最後まで残っていた原因で、
       auto-phrase は**文節の途中で折り返さない**ため、次の文節が入らないと
       そこで行を終える。実測で1行目の右に **105px（約6文字ぶん）** の空きが出ていた。
       `line-break:strict` は残すので、句読点や閉じ括弧が行頭に来ることはない。
     ※ **`.credoline` は対象外**（見出し扱い）。入口の惹句は文字が大きく、
       375px では2行に収めようとすると13pxまで下げることになり小さすぎる（実測）。
       3行になるのは許容し、代わりに**文節で折り返させる**ため mc.css のまま
       （balance ＋ auto-phrase）にしておく。そうしないと
       「本気で勝負していきたいと考えてい／る方は大歓迎です。」と語の途中で切れる。 */
body .sec p:not(.credoline), body .sec li, body .sec dd, body .sec figcaption,
body #lead p:not(.credoline), body .read p, body .read p.closer, body .closer,
body .lead, body .guide{
  text-wrap:auto;
  word-break:normal;
  line-break:strict;
}

/* 入口の惹句だけは**文節で折る**。除外（:not）に頼らず明示して当てる
   ＝ 継承任せにすると normal のままだった（実測）。
   375px の比較：
     normal      … 本気で勝負していきたいと考えてい／る方は大歓迎です。 ← 語の途中で切れる
     auto-phrase … 本気で勝負していきたいと／考えている方は大歓迎です。 ← これを採る
     keep-all    … 1行に収まるが箱からはみ出す（折る場所が無くなるため）ので使えない */
body .credoline{
  word-break:auto-phrase;
  text-wrap:balance;
}

/* ★ 締めの段落からピンクをやめる（菅さん「ピンクの部分の視認性が悪い。代案でカバーしてほしい」）。
     mc.css の .closer は ピンク文字＋700 で、白地だと読みづらい。
     色で立たせるのをやめ、**短い水色の罫・字の大きさ・余白**で「ここが締め」を示す。
     太さは600まで（700はポップに見える → [[typography-avoid-bold-pop]]）。 */
body .read p.closer, body .closer{
  color:var(--ink-b);
  font-weight:600;
  border-top:0;
  padding-top:30px;
  position:relative;
}
body .read p.closer::before, body .closer::before{
  content:"";
  position:absolute;
  left:0; top:0;
  width:56px; height:3px;
  background:var(--aq);
}