@charset "UTF-8";
/*
 * ratelevent.jp の投稿ページ（お知らせ／レポート）を
 * トップページ（静的HTML）の意匠に合わせる ── 2026-08
 *
 * SWELL 既定のままだと 游ゴシック＋オレンジ塗りのH2で、トップの
 * Zen Maru Gothic ＋ 緑＋ライムの破線 とまったく別サイトに見えていた。
 *
 * 配信: https://ratelevent.jp/assets/article-ratel.css
 *       （deploy_assets.py でアップロード／読み込みは article_ratel_loader.php）
 * 適用: 投稿の個別ページのみ（#body_wrap.single-post）。固定ページ・LPには影響しない。
 *
 * 色はトップページ css/style.css の :root と同じ値を再定義している。
 * 片方だけ変えると乖離するので、変えるときは両方直すこと。
 */

:root{
  --re-ink:#2b3a1a;
  --re-ink-soft:#5f6c4f;
  --re-green:#7FB53F;
  --re-green-d:#5F9E2E;
  --re-coral:#FF6B5B;
  --re-coral-d:#E85544;
  --re-lime:#C7E06B;
  --re-cream:#FFF6E4;
  --re-paper:#F6FBEE;
  --re-shadow:0 10px 30px rgba(43,58,26,.14);
  --re-font:"Zen Maru Gothic","Hiragino Maru Gothic ProN","ヒラギノ丸ゴ ProN W4",sans-serif;
}

/* ---- 土台 ---- */
.single-post{ background:var(--re-paper); }
.single-post .l-mainContent__inner,
.single-post .post_content,
.single-post .c-postTitle,
.single-post .p-toc{ font-family:var(--re-font); }

/* ---- 記事タイトル ---- */
.single-post .c-postTitle{
  font-weight:900;
  color:var(--re-green-d);
  line-height:1.5;
}

/* ---- 本文 ---- */
.single-post .post_content{
  font-size:16.5px;
  line-height:1.95;
  color:var(--re-ink);
}
.single-post .post_content p{ margin-bottom:1.6em; }
/* 強調はコーラル。※このあとの開催概要ボックスだけ緑で上書きする */
.single-post .post_content strong{ color:var(--re-coral-d); font-weight:900; }

/* ---- H2：SWELLのオレンジ塗りをやめ、ライムの破線に置き換える ----
   ::before/::after を消しているのは、SWELLのスタイル次第で
   見出しに装飾アイコンや疑似要素の帯が乗るため。 */
.single-post .post_content h2.wp-block-heading{
  background:none !important;
  color:var(--re-green-d);
  font-weight:900;
  font-size:clamp(20px,3.4vw,26px);
  line-height:1.5;
  padding:0 0 14px;
  margin:56px 0 24px;
  border:none;
  border-bottom:3px dashed var(--re-lime);
  border-radius:0;
}
.single-post .post_content h2.wp-block-heading::before,
.single-post .post_content h2.wp-block-heading::after{ content:none !important; }

/* ---- 開催概要ボックス（記事内で唯一の ul）----
   ビルダー(create_event_post.py)の event_summary_block が出すリスト。
   他のリストを本文に入れたらセレクタを見直すこと。 */
.single-post .post_content ul.wp-block-list{
  background:var(--re-cream);
  border-radius:22px;
  box-shadow:var(--re-shadow);
  padding:22px 28px;
  margin:0 0 34px;
  list-style:none;
}
.single-post .post_content ul.wp-block-list li{
  margin:0;
  padding:11px 0;
  border-bottom:2px dashed var(--re-lime);
}
.single-post .post_content ul.wp-block-list li:last-child{ border-bottom:none; }
.single-post .post_content ul.wp-block-list strong{ color:var(--re-green-d); }

/* ---- ギャラリー ---- */
.single-post .post_content .wp-block-gallery figure.wp-block-image{
  border-radius:18px;
  overflow:hidden;
  box-shadow:var(--re-shadow);
}
.single-post .post_content .wp-block-gallery figure.wp-block-image img{
  border-radius:18px;
}

/* ---- CTAボタン ---- */
.single-post .post_content .wp-block-button__link{
  background:var(--re-coral) !important;
  color:#fff !important;
  font-weight:900;
  border-radius:999px;
  padding:16px 34px;
  border:none;
  box-shadow:0 8px 20px rgba(255,107,91,.35);
  transition:background .2s, transform .2s;
}
.single-post .post_content .wp-block-button__link:hover{
  background:var(--re-coral-d) !important;
  transform:translateY(-2px);
}

/* ---- 目次 ----
   SWELL が `#main_content .p-toc` とID込みで書いているため、
   クラスだけのセレクタでは詳細度で負ける。#main_content を噛ませて上回る。 */
.single-post #main_content .p-toc{
  background:#fff;
  border:none;
  border-radius:22px;
  box-shadow:var(--re-shadow);
  padding:20px 24px;
}
.single-post #main_content .p-toc__ttl{ color:var(--re-green-d); font-weight:900; }
.single-post #main_content .p-toc a{ color:var(--re-ink); }
.single-post #main_content .p-toc a:hover{ color:var(--re-coral-d); }

/* ---- スマホ（メディアクエリは既定より後ろに置く）---- */
@media (max-width:600px){
  .single-post .post_content{ font-size:16px; line-height:1.9; }
  .single-post .post_content h2.wp-block-heading{ margin:44px 0 20px; }
  .single-post .post_content ul.wp-block-list{ padding:18px 20px; border-radius:18px; }
  .single-post .post_content .wp-block-button__link{ padding:14px 26px; }
}