@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/* ===== 幸せおうち体験談 追加スタイル（以下、子テーマ用） ===== */

/* ==========================================================================
   幸せおうち体験談  ―  Cocoon 子テーマ 追記スタイル
   --------------------------------------------------------------------------
   ▼貼り付け位置：子テーマ style.css の既存ヘッダーコメント（Theme Name 等が
     書かれた冒頭のコメントブロック）の【直下】に、この内容をすべて貼り付ける。
     ヘッダーコメントより上や、コメントの内側には貼らないこと。
   ▼注意：このファイル内にCSSコメントの入れ子（コメント内での閉じ記号）を作らない。
   ▼前提：Cocoon本体は無改変。スキンは「なし」、全ページ1カラム推奨（SETTINGS.md参照）。
   ▼セレクタは対象サイトの実DOM/実CSSとCocoonソースで確認済（推測なし）。
   ========================================================================== */

/* ====== 0. デザイントークン ============================================== */
:root{
  --oc-bg:#F6F1E7;            /* ページ地色 */
  --oc-surface:#FDFBF5;       /* カード/TOC/表などの面 */
  --oc-surface-alt:#F9F5EB;   /* 表ゼブラ */
  --oc-green:#2F5847;         /* 主役の濃緑 */
  --oc-green-soft:#A9BFAF;    /* 緑の細枠/下線/引用左線 */
  --oc-green-avatar:#DCE5DD;
  --oc-green-oncream:#C9D6CB; /* 緑帯上のサブ文字 */
  --oc-terra:#B96A4B;         /* アクセント（ホバー/CTA） */
  --oc-terra-dark:#96543B;    /* CTA 3D影 */
  --oc-terra-border:#D9B4A2;
  --oc-terra-avatar:#F0DBD1;
  --oc-terra-bubble:#FBF0EA;
  --oc-terra-bubble-border:#E5C8B9;
  --oc-ink:#3B362E;           /* 見出し文字 */
  --oc-text:#4A443A;          /* 本文文字 */
  --oc-muted:#6E675B;
  --oc-meta:#8B8272;          /* メタ/日付/パンくず */
  --oc-faint:#A29782;
  --oc-border:#E7DECC;        /* 主要ボーダー */
  --oc-border-2:#EDE5D3;      /* 表の行区切り */
  --oc-border-box:#DCD2BD;    /* TOC/表 外枠 */
  --oc-border-page:#D8CDB8;   /* ページ送り丸枠 */
  --oc-cream:#F3EDDF;         /* 濃色地の明文字 */
  --oc-footer-bg:#2E2A24;
  --oc-footer-text:#B9B1A2;
  --oc-footer-border:#443F36;

  --oc-shadow-card:0 6px 20px rgba(59,54,46,.10);
  --oc-shadow-table:0 0 0 1px var(--oc-border-box);

  --oc-font-head:'Zen Maru Gothic', sans-serif;
  --oc-font-body:'Noto Sans JP', sans-serif;

  /* 余白スケール（設計トークン。以後は変数参照） */
  --sp-1:4px; --sp-2:8px; --sp-3:16px; --sp-4:24px; --sp-5:32px; --sp-6:48px; --sp-7:64px;

  --oc-wrap:1060px;           /* サイトフレーム内幅（トップ一覧コンテナ） */
  --oc-read:760px;            /* 記事の読み幅 */
  --oc-radius:14px;           /* カード角丸 */
  --oc-gutter:32px;           /* フレーム左右padding(PC)。SPは各メディアクエリで20pxへ */
  --oc-read-pad:40px;         /* 記事本文コンテナの左右padding(PC) */
}

/* ====== 1. 全体ベース =================================================== */
body.body{
  background:var(--oc-bg);
  color:var(--oc-text);
  font-family:var(--oc-font-body);
  font-size:16px;
  line-height:1.9;
  -webkit-font-smoothing:antialiased;
}
/* Cocoonの白背景ラッパを地色に馴染ませる（面はカード側で付与） */
#container,#content,.content-in,#main.main,.main,.archive-page,
#list,.no-sidebar #main{
  background:transparent;
  box-shadow:none;
}
#main.main{ padding:0; border:none; }

/* サイト全体の中央寄せ幅：ヘッダー/ナビ/アピール/コンテンツ/フッターを揃える */
.wrap{
  max-width:var(--oc-wrap);
  margin-left:auto; margin-right:auto;
  padding-left:var(--oc-gutter);
  padding-right:var(--oc-gutter);
  box-sizing:border-box;
}

a{ color:var(--oc-text); text-decoration:none; transition:color .18s ease; }
a:hover{ color:var(--oc-terra); }

h1,h2,h3,h4,h5,.logo-header,.site-name-text{
  font-family:var(--oc-font-head); font-weight:700; color:var(--oc-ink);
}
.skip-link:focus{ background:var(--oc-green); color:var(--oc-cream); }

/* ====== 2. 1カラム化 / コンテンツレイアウト ============================= */
#content-in.content-in.wrap{ display:block; }
#main.main{ width:100%; float:none; max-width:none; margin:0; }
/* 全ページ1カラム化：サイドバー非表示＋メイン全幅（モックにサイドバー無し） */
#sidebar.sidebar{ display:none; }
/* ヘッダー(またはアピール帯)→本文コンテンツの上余白。全ページ共通のセクション間余白 */
.content-in.wrap{ max-width:var(--oc-wrap); padding-top:var(--sp-6); }
/* Cocoon既定の #content{margin-top} を殺し、上余白は content-in の padding-top だけに一本化 */
#content.content{ padding:0; margin-top:0; }
/* フッター直前の空走り余白を除去（末尾要素の下マージンを殺す） */
#main.main > *:last-child{ margin-bottom:0; }

/* ====== 3. ヘッダー + ロゴ + サイト説明 ================================= */
/* Cocoonでは #navi は #header の下の別ブロック。header-container-in をflex行にして
   ロゴ(＋説明)を左・ナビを右に置き、モックの1本バー型ヘッダーを再現。 */
#header-container.header-container{
  background:var(--oc-surface);
  border-bottom:1px solid var(--oc-border);
  box-shadow:none;
}
.header-container-in{
  max-width:var(--oc-wrap); margin:0 auto;
  padding:20px var(--oc-gutter);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 24px;
  background:transparent;
}
#header.header{ padding:0; margin:0; }
/* 内側の .wrap 中央寄せを解除して行の一要素にする */
.header-in.wrap{
  max-width:none; margin:0; padding:0; width:auto; min-height:0;
  display:flex; flex-direction:column; align-items:flex-start;
}
.logo-header, .logo.logo-header{ margin:0; line-height:1.25; order:0; }
.logo-header .site-name-text{
  font-family:var(--oc-font-head); font-weight:700;
  font-size:22px; color:var(--oc-green); letter-spacing:.04em;
}
.logo-header .site-name-text-link{ color:var(--oc-green); }
.logo-header .site-name-text-link:hover{ opacity:.85; }
/* サイトの説明文（キャッチフレーズ）＝ .tagline をロゴ下の小文字に */
.header-in .tagline{
  display:block; order:1;
  font-family:var(--oc-font-body); font-weight:400;
  font-size:11px; color:var(--oc-meta); letter-spacing:.14em;
  margin-top:2px; min-height:0;
}

/* ====== 4. グローバルナビ + モバイルドロワー =========================== */
#navi.navi{ background:transparent; border:none; box-shadow:none; width:auto; }
#navi .navi-in.wrap{ max-width:none; margin:0; padding:0; width:auto; }
#navi ul{ display:flex; flex-wrap:wrap; gap:6px 26px; justify-content:flex-end; }
#navi .menu-header > li.menu-item{ margin:0; }
#navi .menu-header > li.menu-item > a{
  display:inline-block; padding:4px 0;
  font-size:14px; font-weight:500; color:var(--oc-text);
  border-bottom:2px solid transparent; background:transparent;
}
#navi .menu-header > li.menu-item > a:hover{ color:var(--oc-terra); background:transparent; }
#navi .menu-header > li.current-menu-item > a,
#navi .menu-header > li.current_page_item > a{
  color:var(--oc-ink); border-bottom-color:var(--oc-green);
}
#navi .menu-header .sub-menu{
  background:var(--oc-surface); border:1px solid var(--oc-border);
  border-radius:10px; box-shadow:var(--oc-shadow-card); overflow:hidden;
}
#navi .menu-header .sub-menu li a{ color:var(--oc-text); }
#navi .menu-header .sub-menu li a:hover{ background:var(--oc-bg); color:var(--oc-terra); }
#navi .menu-header .item-description.sub-caption{ color:var(--oc-meta); }

/* ドロワー（ハンバーガー/サイドバー/検索）共通トーン */
.menu-drawer, .menu-content, #navi-menu-content, #sidebar-menu-content{
  background:var(--oc-surface); color:var(--oc-text);
}
.menu-drawer li a{ color:var(--oc-text); border-color:var(--oc-border); }
.menu-drawer li a:hover{ background:var(--oc-bg); color:var(--oc-terra); }
.menu-close-button, .menu-open{ color:var(--oc-green); }

/* ====== 5. アピールエリア（キャッチ帯／文言はサイト設定側で入力） ====== */
#appeal.appeal{
  background:var(--oc-green); color:var(--oc-cream);
  border:none; background-image:none;
}
/* Cocoonの .appeal-in(flex,min-height) と .appeal-content(白半透明ボックス/中央) を解除 */
#appeal .appeal-in{ display:block; min-height:0; }
#appeal .appeal-in.wrap{ max-width:var(--oc-wrap); margin:0 auto; padding:56px var(--oc-gutter); text-align:left; }
#appeal .appeal-content{ max-width:none; margin:0; padding:0; background:none; background-color:transparent; border-radius:0; box-shadow:none; text-align:left; }
#appeal .appeal-title{
  font-family:var(--oc-font-head); font-weight:700; color:var(--oc-cream);
  font-size:clamp(22px,3.4vw,32px); line-height:1.7; letter-spacing:.05em; margin:0;
}
#appeal .appeal-message{
  font-family:var(--oc-font-body); color:var(--oc-green-oncream);
  font-size:14px; line-height:2; letter-spacing:.06em;
  max-width:620px; margin:14px 0 0;
}
#appeal .appeal-button{
  display:inline-flex; align-items:center; justify-content:center;
  margin-top:22px; min-height:48px; padding:10px 34px;
  background:var(--oc-terra); color:var(--oc-surface); font-weight:700;
  border-radius:100px; letter-spacing:.06em; box-shadow:0 3px 0 var(--oc-terra-dark);
  transition:transform .15s ease, box-shadow .15s ease;
}
#appeal .appeal-button:hover{ color:var(--oc-surface); transform:translateY(2px); box-shadow:0 1px 0 var(--oc-terra-dark); }

/* ====== 6. 一覧カード（index / archive / search）+ グリッド ============ */
/* リスト枠を3列グリッドに（Cocoon既定 entry-card 型のまま） */
#list.list{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:28px;
  margin:0;
}
/* カード：縦積み・面・枠・角丸・ホバー浮き */
.entry-card-wrap.a-wrap,
.entry-card-wrap{
  display:flex; flex-direction:column; height:100%;
  background:var(--oc-surface);
  border:1px solid var(--oc-border);
  border-radius:var(--oc-radius);
  overflow:hidden; box-shadow:none;
  transition:box-shadow .2s ease, transform .2s ease;
}
.entry-card-wrap.a-wrap:hover,
.entry-card-wrap:hover{
  box-shadow:var(--oc-shadow-card); transform:translateY(-2px);
  background:var(--oc-surface);
}
.entry-card{ margin:0; padding:0; border:none; background:transparent; box-shadow:none; display:flex; flex-direction:column; height:100%; }
/* サムネ 16:9（Cocoon既定の float:left / width:320px を打ち消して縦積みに） */
.entry-card .card-thumb,
.entry-card-thumb.card-thumb{
  position:relative; float:none; width:100%; margin:0; aspect-ratio:16/9; overflow:hidden;
  background:var(--oc-border-2);
}
.entry-card .card-thumb-image{ width:100%; height:100%; object-fit:cover; }
/* アイキャッチ未設定（no-image）は地色トーンのハッチに */
.entry-card .no-image,
.card-thumb .no-image,
.no-image.card-thumb-image{
  object-fit:cover;
  background:repeating-linear-gradient(-45deg,#EDE5D3,#EDE5D3 10px,#E7DECC 10px,#E7DECC 20px);
}
/* カテゴリラベル（サムネ左上のピル） */
.cat-label{
  position:absolute; top:10px; left:10px; z-index:2;
  background:var(--oc-green); color:var(--oc-cream);
  font-family:var(--oc-font-head); font-weight:700; font-size:11px;
  letter-spacing:.08em; padding:3px 12px; border-radius:100px; border:none; line-height:1.6;
}
/* カード内容 */
.entry-card .card-content,
.entry-card-content.card-content{
  float:none; margin-left:0; width:auto;   /* Cocoon既定 margin-left:330px を打ち消す（内容が幅0に潰れる不具合対策） */
  padding:18px 20px 20px; display:flex; flex-direction:column; gap:10px; flex:1;
  background:transparent;
}
.entry-card .card-title,
.entry-card-title.card-title{
  font-family:var(--oc-font-head); font-weight:700; font-size:16.5px;
  line-height:1.65; color:var(--oc-ink); margin:0;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden;   /* 2行でクランプ→カード高さを揃える */
}
.entry-card .card-title a{ color:var(--oc-ink); }
.entry-card .card-title a:hover{ color:var(--oc-terra); }
.entry-card .card-snippet,
.entry-card-snippet.card-snippet{
  font-size:13px; line-height:1.9; color:var(--oc-muted); margin:0;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden;   /* 抜粋も2行でクランプ */
}
.entry-card .card-meta,
.entry-card-meta.card-meta{
  font-size:12px; color:var(--oc-meta); margin:0;
}
.entry-card .card-meta .post-date,
.entry-card .card-meta .post-update{ color:var(--oc-meta); }
.entry-card .card-meta .fa{ color:var(--oc-green-soft); margin-right:3px; }
.entry-card-info.e-card-info{ display:flex; flex-wrap:wrap; gap:4px 12px; }
.entry-card-categorys a{ color:var(--oc-green); }

/* セクション見出し（一覧上部・ウィジェットタイトル等） */
.main-caption, .widget-title, .archive-title, .category-page-content h1{ letter-spacing:.06em; }

/* 投稿なし */
.posts-not-found{
  background:var(--oc-surface); border:1px solid var(--oc-border);
  border-radius:var(--oc-radius); padding:40px 24px; text-align:center; color:var(--oc-muted);
  grid-column:1 / -1;
}
.posts-not-found h2{ font-size:18px; color:var(--oc-ink); margin:0 0 8px; letter-spacing:.08em; }
.posts-not-found p{ margin:0; font-size:14px; }

/* ====== 7. ページネーション ============================================ */
.pagination{ display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:10px; padding:40px 0 0; margin:0; }
.pagination .page-numbers{
  min-width:44px; height:44px; padding:0 8px; box-sizing:border-box;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--oc-border-page); border-radius:100px;
  background:var(--oc-surface); color:var(--oc-text); font-size:14px; font-weight:500;
  transition:border-color .18s ease, color .18s ease;
}
.pagination a.page-numbers:hover{ border-color:var(--oc-terra); color:var(--oc-terra); }
.pagination .page-numbers.current{
  background:var(--oc-green); border-color:var(--oc-green);
  color:var(--oc-cream); font-weight:700;
}
.pagination .page-numbers.dots{ border:none; background:transparent; color:var(--oc-meta); min-width:auto; }
.pagination .page-numbers.next, .pagination .page-numbers.prev{ padding:0 18px; }
.pagination-next{ text-align:center; padding-top:8px; }
.pagination-next-link.key-btn{
  display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 28px;
  background:var(--oc-surface); border:1px solid var(--oc-border-page); border-radius:100px;
  color:var(--oc-text); font-weight:500;
}
.pagination-next-link.key-btn:hover{ border-color:var(--oc-terra); color:var(--oc-terra); }

/* ====== 8. アーカイブ/検索 見出し + 検索フォーム ======================= */
#archive-title.archive-title,
.archive-title{
  font-family:var(--oc-font-head); font-weight:700; color:var(--oc-ink);
  font-size:clamp(21px,3vw,26px); line-height:1.5; letter-spacing:.04em;
  margin:8px 0 24px; padding:0 0 14px; border-bottom:1px solid var(--oc-border);
  display:flex; align-items:center; gap:10px;
}
.archive-title .fa{ color:var(--oc-green); font-size:.9em; }
.category-header .eye-catch-wrap, .tag-header .eye-catch-wrap{ border-radius:var(--oc-radius); overflow:hidden; margin-bottom:20px; }
.category-page-content.entry-content, .tag-page-content.entry-content{
  color:var(--oc-muted); font-size:14.5px; margin-bottom:8px;
}
/* 本文内・検索結果ページの検索フォーム */
.search-box.input-box{
  display:flex; align-items:stretch; gap:0; max-width:520px; margin:0 0 30px;
  border:1px solid var(--oc-border-box); border-radius:100px; overflow:hidden; background:var(--oc-surface);
}
.search-box .search-edit{
  flex:1; border:none; background:transparent; padding:13px 18px; font-size:14px; color:var(--oc-text); width:auto; min-height:44px; box-sizing:border-box;
}
.search-box .search-edit:focus{ outline:none; }
.search-box .search-submit{
  border:none; background:var(--oc-green); color:var(--oc-cream);
  padding:0 20px; min-height:44px; cursor:pointer; font-size:14px;
}
.search-box .search-submit:hover{ background:var(--oc-terra); }

/* ====== 9. パンくず ==================================================== */
#breadcrumb.breadcrumb, .breadcrumb{
  display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px;
  font-size:12px; color:var(--oc-meta); margin:0 0 26px; padding:0; background:transparent; border:none;
}
.breadcrumb .breadcrumb-home a, .breadcrumb .breadcrumb-item a{ color:var(--oc-meta); }
.breadcrumb .breadcrumb-home a:hover, .breadcrumb .breadcrumb-item a:hover{ color:var(--oc-terra); }
.breadcrumb .breadcrumb-caption{ color:inherit; }
.breadcrumb .breadcrumb-item:last-child .breadcrumb-caption{ color:var(--oc-muted); }
.breadcrumb .sp .fa{ color:var(--oc-faint); }
.breadcrumb .fa-home, .breadcrumb .fa-folder, .breadcrumb .fa-file-o{ color:var(--oc-green-soft); }

/* ====== 10. 単一記事：タイトル/メタ/アイキャッチ/リード ================ */
.single .article, .page .article{ max-width:var(--oc-read); margin-left:auto; margin-right:auto; padding-left:var(--oc-read-pad); padding-right:var(--oc-read-pad); box-sizing:border-box; }
.article, article.article{ background:transparent; border:none; box-shadow:none; padding:0; margin-top:0; }
.article-header.entry-header{ margin-bottom:30px; }
/* Cocoonの見出し順（タイトル→アイキャッチ→メタ）をモック寄り（タイトル→メタ→アイキャッチ）に整える */
.single .article-header, .page .article-header{ display:flex; flex-direction:column; }
.single .article-header .entry-title{ order:0; }
.single .article-header .date-tags{ order:1; }
.single .article-header .read-time{ order:2; }
.single .article-header .eye-catch-wrap{ order:3; }
.single .article-header .sns-share{ order:4; }
.entry-title{
  font-family:var(--oc-font-head); font-weight:700; color:var(--oc-ink);
  font-size:28px; line-height:1.45; letter-spacing:.03em; margin:0 0 16px;
}
.single .cat-label, .single .entry-category{ position:static; }
/* 記事メタ（公開日/更新日） */
.date-tags{
  display:flex; flex-wrap:wrap; align-items:center; gap:6px 18px;
  font-size:12.5px; color:var(--oc-meta);
  padding-bottom:26px; border-bottom:1px solid var(--oc-border); margin-bottom:30px;
}
.date-tags .fa{ color:var(--oc-green-soft); margin-right:4px; }
.date-tags a{ color:var(--oc-meta); }
.date-tags a:hover{ color:var(--oc-terra); }
.entry-category .cat-label, .date-tags .cat-label{
  position:static; display:inline-block; background:transparent; color:var(--oc-green);
  border:1px solid var(--oc-green-soft); border-radius:100px; padding:2px 10px; font-size:11px;
}
.read-time{ font-size:12px; color:var(--oc-meta); margin-top:10px; }
.read-time .fa{ color:var(--oc-green-soft); }
/* アイキャッチ */
.eye-catch-wrap{ margin:0 0 36px; }
.eye-catch-wrap .eye-catch{ margin:0; border-radius:var(--oc-radius); overflow:hidden; }
.eye-catch-image{ width:100%; height:auto; display:block; }
.eye-catch-caption{ font-size:12px; color:var(--oc-meta); margin-top:8px; }

/* ====== 11. 目次（TOC） =============================================== */
#toc.toc, .toc{
  background:var(--oc-surface); border:1px solid var(--oc-border-box);
  border-radius:var(--oc-radius); padding:24px 28px 26px; margin:0 0 44px; width:auto;
}
.toc .toc-title{
  font-family:var(--oc-font-head); font-weight:700; font-size:15px; color:var(--oc-green);
  letter-spacing:.1em; margin:0 0 14px; display:flex; align-items:center; gap:10px; cursor:pointer;
}
.toc .toc-title::before{ content:""; width:22px; height:2px; background:var(--oc-terra); border-radius:2px; }
.toc .toc-content ol, .toc .toc-list{ margin:0; padding:0 0 0 22px; }
.toc .toc-list{ display:flex; flex-direction:column; gap:9px; font-size:14px; line-height:1.7; }
.toc .toc-list ol{ margin:8px 0 0; padding:0 0 0 20px; gap:7px; font-size:13px; }
.toc .toc-list a{ color:var(--oc-text); }
.toc .toc-list a:hover{ color:var(--oc-terra); }
.toc .toc-list li li a{ color:var(--oc-muted); }
.toc .toc-list li li a:hover{ color:var(--oc-terra); }

/* ====== 12. 本文 .entry-content ======================================= */
.entry-content{ font-size:16px; line-height:1.85; color:var(--oc-text); }
.entry-content > *{ margin-top:0; margin-bottom:var(--sp-4); }
.entry-content > *:first-child{ margin-top:0; }   /* コンテナ先頭要素の二重余白防止 */
/* Cocoonのインラインcritical .entry-content>*{line-height:1.8} を上書き（同詳細度・後読みで勝つ） */
.entry-content p, .entry-content li{ line-height:1.85; }
/* h2＝緑帯 */
.entry-content h2{
  font-family:var(--oc-font-head); font-weight:700; font-size:24px; line-height:1.5;
  color:var(--oc-surface); background:var(--oc-green);
  border:none; border-radius:10px; padding:14px 22px; letter-spacing:.04em; margin:var(--sp-6) 0 var(--sp-3);
}
/* h3＝下線 */
.entry-content h3{
  font-family:var(--oc-font-head); font-weight:700; font-size:19px; line-height:1.5; color:var(--oc-ink);
  background:none; border:none; border-bottom:2px solid var(--oc-green-soft);
  padding:2px 0 10px; margin:var(--sp-5) 0 12px; letter-spacing:.04em;
}
.entry-content h4{
  font-family:var(--oc-font-head); font-weight:700; font-size:16px; color:var(--oc-ink);
  border:none; border-left:4px solid var(--oc-terra); padding:2px 0 2px 12px; margin:var(--sp-4) 0 12px;
}
.entry-content p{ margin:0 0 24px; }
.entry-content a{ color:var(--oc-terra); text-decoration:underline; text-underline-offset:2px; }
.entry-content a:hover{ color:var(--oc-terra-dark); }
.entry-content strong{ color:var(--oc-ink); font-weight:700; }
.entry-content ul, .entry-content ol{ margin:0 0 24px; padding-left:1.4em; }
.entry-content ul li, .entry-content ol li{ margin-bottom:8px; line-height:1.9; }
.entry-content ul li::marker{ color:var(--oc-terra); }
.entry-content ol li::marker{ color:var(--oc-green); font-weight:700; }
.entry-content img{ max-width:100%; height:auto; border-radius:10px; }

/* 表：横スクロール枠・緑ヘッダ・ゼブラ */
.entry-content .scrollable-table, .entry-content .table-wrap{ overflow-x:auto; margin:0 0 32px; }
.entry-content table{
  width:100%; border-collapse:collapse; font-size:14px; background:var(--oc-surface);
  border-radius:12px; overflow:hidden; box-shadow:var(--oc-shadow-table); border:none;
}
.entry-content table th{
  background:var(--oc-green); color:var(--oc-cream); text-align:left; font-weight:700;
  padding:12px 16px; letter-spacing:.06em; border:none;
}
.entry-content table td{ padding:12px 16px; border:none; border-bottom:1px solid var(--oc-border-2); }
.entry-content table tbody tr:nth-child(even) td{ background:var(--oc-surface-alt); }
.entry-content table tbody tr:last-child td{ border-bottom:none; }

/* 引用 */
.entry-content blockquote{
  background:var(--oc-surface); border:none; border-left:4px solid var(--oc-green-soft);
  border-radius:0 12px 12px 0; padding:20px 24px; margin:0 0 36px;
  font-size:14.5px; line-height:2; color:var(--oc-muted);
}
.entry-content blockquote cite{ display:block; margin-top:10px; font-style:normal; font-size:12px; color:var(--oc-meta); }

/* Cocoon 吹き出し（会話ふきだし） */
.speech-wrap{ margin:0 0 20px; display:flex; gap:14px; align-items:flex-start; border:none; background:transparent; }
.speech-wrap.sbs-flat-speech-line, .speech-wrap.sbp-l, .speech-wrap.sbp-r{ padding:0; }
.speech-wrap.sbp-r{ flex-direction:row-reverse; }
.speech-person{ flex:none; width:52px; text-align:center; }
.speech-icon img, .speech-person img{
  width:48px; height:48px; border-radius:100px; border:2px solid var(--oc-green-soft); background:var(--oc-green-avatar);
}
.speech-wrap.sbp-r .speech-icon img, .speech-wrap.sbp-r .speech-person img{ border-color:var(--oc-terra-border); background:var(--oc-terra-avatar); }
.speech-name{ font-size:10px; color:var(--oc-meta); margin-top:4px; }
.speech-balloon{
  position:relative; background:var(--oc-surface); border:1px solid var(--oc-border-box);
  border-radius:3px 14px 14px 14px; padding:14px 18px; font-size:14px; line-height:1.9; color:var(--oc-text);
}
.speech-wrap.sbp-r .speech-balloon{ background:var(--oc-terra-bubble); border-color:var(--oc-terra-bubble-border); border-radius:14px 3px 14px 14px; }
.speech-balloon::before, .speech-balloon::after{ display:none; }

/* 記事内ボタン（CocoonブロックボタンやCTA） */
.entry-content .wp-block-button__link,
.entry-content .btn-wrap > a,
.entry-content a.btn, .entry-content a.key-btn{
  display:inline-flex; align-items:center; justify-content:center; min-height:52px;
  padding:12px 40px; background:var(--oc-terra); color:var(--oc-surface); font-family:var(--oc-font-head);
  font-weight:700; border-radius:100px; letter-spacing:.06em; text-decoration:none;
  box-shadow:0 3px 0 var(--oc-terra-dark); transition:transform .15s ease, box-shadow .15s ease;
}
.entry-content .wp-block-button__link:hover,
.entry-content .btn-wrap > a:hover,
.entry-content a.btn:hover, .entry-content a.key-btn:hover{
  color:var(--oc-surface); transform:translateY(2px); box-shadow:0 1px 0 var(--oc-terra-dark);
}
.entry-content .wp-block-button{ text-align:center; }

/* ====== 13. SNSシェア / フォロー ====================================== */
.sns-share{ margin:32px 0; }
.sns-share-message{ font-size:12px; color:var(--oc-meta); letter-spacing:.08em; margin-bottom:10px; }
.sns-share-buttons.sns-buttons, .sns-follow-buttons.sns-buttons{ display:flex; flex-wrap:wrap; gap:10px; }
.sns-share .sns-button, .sns-follow .sns-button, .sns-buttons a{
  display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:0 16px;   /* タップ高44px（R7） */
  background:var(--oc-surface); border:1px solid var(--oc-border-box); border-radius:100px;
  color:var(--oc-text); font-size:12px; font-weight:500;
}
.sns-buttons a:hover{ border-color:var(--oc-terra); color:var(--oc-terra); }
.sns-buttons .social-icon{ color:var(--oc-green); }
.sns-buttons a:hover .social-icon{ color:var(--oc-terra); }
.sns-buttons .share-count{ color:var(--oc-meta); font-size:11px; }

/* ====== 14. 著者ボックス + バイライン ================================= */
.author-box{
  background:var(--oc-surface); border:1px solid var(--oc-border-box); border-radius:var(--oc-radius);
  padding:26px 28px; margin:40px auto 0; display:flex; gap:20px; align-items:flex-start; flex-wrap:wrap; box-shadow:none;
}
.author-box .author-thumb, .author-box .author-thumb img{
  flex:none; width:72px; height:72px; border-radius:100px; overflow:hidden; background:var(--oc-border-2);
}
.author-box .author-content{ flex:1; min-width:240px; }
.author-box .author-widget-name{ font-size:11px; color:var(--oc-meta); letter-spacing:.12em; margin-bottom:2px; }
.author-box .author-name{ font-family:var(--oc-font-head); font-weight:700; font-size:17px; color:var(--oc-ink); margin-bottom:10px; }
.author-box .author-name a{ color:var(--oc-ink); }
.author-box .author-description{ font-size:13.5px; line-height:1.9; color:var(--oc-muted); }
.author-box .author-description a, .author-box .sns-follow-buttons a{ color:var(--oc-terra); }
/* 記事フッターの著者バイライン（最小表示） */
.footer-meta .author-info{ font-size:13px; color:var(--oc-meta); }
.footer-meta .author-info .author-name{ color:var(--oc-text); }
.footer-meta .author-info .fa{ color:var(--oc-green-soft); }

/* ====== 15. 記事下部モジュール 総点検（v6）: 関連記事 + 共通整列 ========= */
/* 【共通整列】本文より下の全モジュールを本文カラム(760)に揃える。
   .under-entry-content は article の兄弟として全幅(≈996)に出るため、読み幅へ絞り
   中央寄せ＋本文と同じ左右padding(--oc-read-pad)。上paddingがモジュール間余白。 */
.under-entry-content{
  max-width:var(--oc-read); margin:0 auto; box-sizing:border-box;
  padding:28px var(--oc-read-pad) 0; border-top:1px solid var(--oc-border);   /* 上28+記事末尾余白≈58=モジュール間余白 */
}
/* 下部パンくず（sbp-main-bottom）も本文カラムに整列＋前後ナビからのモジュール間余白 */
#breadcrumb.sbp-main-bottom{
  max-width:var(--oc-read); margin:52px auto 0; box-sizing:border-box;
  padding-left:var(--oc-read-pad); padding-right:var(--oc-read-pad);
}
#related-entries.related-entries{ margin:0; padding:0; background:transparent; border:none; }
.related-entry-heading{
  font-family:var(--oc-font-head); font-weight:700; font-size:22px; color:var(--oc-ink);
  letter-spacing:.04em; margin:0 0 24px; display:flex; align-items:baseline; gap:12px;
}
.related-entry-heading .main-caption, .related-entry-heading .sub-caption{ font-size:inherit; color:inherit; letter-spacing:inherit; }

/* 【関連記事カード】Cocoon rect-entry-card は横型フロート。縦型2列グリッドへ統一。 */
.related-list{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:24px; margin:0; }
.related-entry-card-wrap.a-wrap{
  display:flex; flex-direction:column; height:100%; width:auto; padding:0;
  background:var(--oc-surface); border:1px solid var(--oc-border); border-radius:var(--oc-radius);
  overflow:hidden; box-shadow:none; transition:box-shadow .2s ease, transform .2s ease;
}
.related-entry-card-wrap.a-wrap:hover{ box-shadow:var(--oc-shadow-card); transform:translateY(-2px); }
.related-entry-card.e-card{ margin:0; padding:0; border:none; background:transparent; display:flex; flex-direction:column; height:100%; }
/* サムネ：Cocoon core の float:left / width:160px / margin を解除して幅100%・16:9 */
.related-entry-card .related-entry-card-thumb{
  float:none; width:100%; margin:0; aspect-ratio:16/9; overflow:hidden; background:var(--oc-border-2);
}
/* Cocoon SPの .rect-entry-card .a-wrap:not(...) .card-thumb{margin-bottom:22px}(詳細度0,4,0)をid詳細度で打ち消す */
#related-entries .related-entry-card-thumb{ margin:0; }
.related-entry-card .related-entry-card-thumb-image{ width:100%; height:100%; object-fit:cover; }
/* 内容：Cocoon core の margin-left:170px を解除（内容潰れ＝1文字縦落ちの主因）。
   padding上10=サムネ→タイトル間 / 左右下12=カード内余白。内容にフィットさせ空白肥大させない。 */
.related-entry-card .related-entry-card-content{
  margin:0; padding:10px 12px 12px; display:flex; flex-direction:column;
}
.related-entry-card .related-entry-card-title{
  font-family:var(--oc-font-head); font-weight:700; font-size:15px; line-height:1.5; color:var(--oc-ink); margin:0;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; overflow:hidden;
}
.related-entry-card .related-entry-card-title a{ color:var(--oc-ink); }
.related-entry-card .related-entry-card-title a:hover{ color:var(--oc-terra); }
/* 関連カードは「サムネ＋タイトル」のみ：抜粋・カテゴリバッジ・日付/メタは非表示 */
.related-entry-card .related-entry-card-snippet,
.related-entry-card .cat-label,
.related-entry-card .related-entry-card-meta,
.related-entry-card .e-card-meta{ display:none; }

/* ====== 16. 前後記事ナビ（2分割・v6） =============================== */
/* Cocoon core は flex-column(縦積み)。2分割グリッドへ。under-entry内なので幅は親(680)に従う。 */
#pager-post-navi.pager-post-navi{
  max-width:none; margin:52px 0 0; padding:0; border:none;   /* 上52=関連記事とのモジュール間余白 */
  display:grid; grid-template-columns:1fr 1fr; gap:16px;
}
.pager-post-navi .prev-post, .pager-post-navi .next-post{
  display:flex; align-items:center; gap:10px; min-height:44px; margin:0; box-shadow:none;
  background:var(--oc-surface); border:1px solid var(--oc-border); border-radius:var(--oc-radius);
  padding:12px; color:var(--oc-text); font-size:14px; line-height:1.2;
}
.pager-post-navi .prev-post:hover, .pager-post-navi .next-post:hover{ border-color:var(--oc-terra); color:var(--oc-terra); }
.pager-post-navi .next-post{ flex-direction:row-reverse; text-align:right; }
.pager-post-navi .prev-post-thumb, .pager-post-navi .next-post-thumb, .pager-post-navi .card-thumb{
  flex:none; width:96px; height:64px; min-width:96px; max-width:96px; margin:0; border-radius:8px; overflow:hidden;
}
.pager-post-navi figure img{ width:100%; height:100%; object-fit:cover; }
.pager-post-navi .iconfont{ display:none; }   /* 2分割カードでは矢印は省略（サムネ+タイトルで前後は自明） */
.pager-post-navi .prev-post-title, .pager-post-navi .next-post-title{
  font-family:var(--oc-font-body); font-size:14px; line-height:1.5; color:inherit; margin:0;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; overflow:hidden;
}

/* ====== 17. ブログカード（内部/外部リンクカード） ==================== */
.blogcard-wrap.a-wrap{
  display:block; margin:0 0 28px; background:var(--oc-surface);
  border:1px solid var(--oc-border); border-radius:var(--oc-radius); overflow:hidden;
  transition:box-shadow .2s ease, transform .2s ease; box-shadow:none;
}
.blogcard-wrap.a-wrap:hover{ box-shadow:var(--oc-shadow-card); transform:translateY(-2px); }
.blogcard{ display:flex; gap:16px; padding:16px; border:none; background:transparent; }
.blogcard-thumbnail{ flex:none; width:120px; aspect-ratio:16/9; border-radius:10px; overflow:hidden; margin:0; }
.blogcard-thumb-image{ width:100%; height:100%; object-fit:cover; }
.blogcard-content{ flex:1; min-width:0; }
.blogcard-title{ font-family:var(--oc-font-head); font-weight:700; font-size:15px; line-height:1.6; color:var(--oc-ink); margin:0 0 6px; }
.blogcard-snippet{ font-size:12.5px; line-height:1.8; color:var(--oc-muted); }
.blogcard-footer{ display:flex; align-items:center; gap:8px; margin-top:10px; font-size:11px; color:var(--oc-meta); }
.blogcard-label{ color:var(--oc-terra); }

/* ====== 18. コメント ================================================= */
#comment-area.comment-area{ max-width:var(--oc-read); margin:48px auto 0; }
.comment-title{ font-family:var(--oc-font-head); font-weight:700; font-size:20px; color:var(--oc-ink); letter-spacing:.06em; margin:0 0 20px; display:flex; align-items:baseline; gap:12px; }
.comment-title .sub-caption{ font-size:12px; color:var(--oc-meta); letter-spacing:.14em; }
.comment-list ol.commets-list, .commets-list, .comment-list ul{ list-style:none; margin:0; padding:0; }
.comment-box, .comment-body{ background:var(--oc-surface); border:1px solid var(--oc-border); border-radius:var(--oc-radius); padding:18px 20px; margin-bottom:16px; }
.comment-author .fn{ font-family:var(--oc-font-head); font-weight:700; color:var(--oc-ink); }
.comment-meta, .comment-metadata a{ font-size:12px; color:var(--oc-meta); }
.comment-reply-link, .comment-btn.key-btn, #comment-reply-btn{
  display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:8px 24px;
  background:var(--oc-green); color:var(--oc-cream); border:none; border-radius:100px; font-family:var(--oc-font-head);
  font-weight:700; letter-spacing:.06em; cursor:pointer;
}
.comment-reply-link:hover, .comment-btn.key-btn:hover, #comment-reply-btn:hover{ background:var(--oc-terra); color:var(--oc-cream); }
.comment-respond .comment-reply-title{ font-family:var(--oc-font-head); font-weight:700; color:var(--oc-ink); font-size:16px; margin-bottom:14px; }
.comment-form .form-submit .submit{
  background:var(--oc-terra); color:var(--oc-surface); border:none; border-radius:100px; min-height:48px; padding:10px 34px;
  font-family:var(--oc-font-head); font-weight:700; letter-spacing:.06em; box-shadow:0 3px 0 var(--oc-terra-dark); cursor:pointer;
}
.comment-form .form-submit .submit:hover{ transform:translateY(2px); box-shadow:0 1px 0 var(--oc-terra-dark); }

/* ====== 19. 汎用フォーム部品（お問い合わせプラグイン等） ============== */
.entry-content input[type=text], .entry-content input[type=email], .entry-content input[type=tel],
.entry-content input[type=url], .entry-content input[type=number], .entry-content input[type=search],
.entry-content input[type=date], .entry-content input[type=password],
.entry-content textarea, .entry-content select,
.comment-form input[type=text], .comment-form input[type=email], .comment-form input[type=url], .comment-form textarea{
  width:100%; box-sizing:border-box; background:var(--oc-surface);
  border:1px solid var(--oc-border-box); border-radius:10px; padding:12px 14px;
  font-family:var(--oc-font-body); font-size:15px; color:var(--oc-text); line-height:1.7;
}
.entry-content input:focus, .entry-content textarea:focus, .entry-content select:focus,
.comment-form input:focus, .comment-form textarea:focus{
  outline:none; border-color:var(--oc-green); box-shadow:0 0 0 3px rgba(47,88,71,.12);
}
.entry-content textarea{ min-height:140px; resize:vertical; }
.entry-content input[type=submit], .entry-content button[type=submit], .entry-content .wpcf7-submit{
  width:auto; background:var(--oc-terra); color:var(--oc-surface); border:none; border-radius:100px;
  min-height:52px; padding:12px 40px; font-family:var(--oc-font-head); font-weight:700; letter-spacing:.06em;
  box-shadow:0 3px 0 var(--oc-terra-dark); cursor:pointer;
}
.entry-content input[type=submit]:hover, .entry-content .wpcf7-submit:hover{ transform:translateY(2px); box-shadow:0 1px 0 var(--oc-terra-dark); }

/* ====== 20. サイドバーウィジェット（1カラムでも保険整形） ============ */
.widget.widget-sidebar{ background:var(--oc-surface); border:1px solid var(--oc-border); border-radius:var(--oc-radius); padding:20px 22px; margin-bottom:24px; }
.widget-sidebar .widget-title, .widget-sidebar .wp-block-heading{
  font-family:var(--oc-font-head); font-weight:700; font-size:15px; color:var(--oc-ink);
  letter-spacing:.06em; margin:0 0 14px; padding-bottom:10px; border-bottom:1px solid var(--oc-border);
}
.widget-sidebar a{ color:var(--oc-text); }
.widget-sidebar a:hover{ color:var(--oc-terra); }
.widget-sidebar li{ border-color:var(--oc-border-2); }
/* ブロック検索ウィジェット */
.wp-block-search__inside-wrapper{ border:1px solid var(--oc-border-box); border-radius:100px; overflow:hidden; background:var(--oc-surface); display:flex; }
.wp-block-search__input{ border:none; background:transparent; padding:13px 16px; font-size:14px; color:var(--oc-text); min-height:44px; box-sizing:border-box; }
.wp-block-search__button.wp-element-button{ background:var(--oc-green); color:var(--oc-cream); border:none; padding:0 18px; min-height:44px; }
.wp-block-search__button.wp-element-button:hover{ background:var(--oc-terra); }

/* ====== 21. フッター ================================================= */
#footer.footer{ background:var(--oc-footer-bg); color:var(--oc-footer-text); margin-top:var(--sp-7); border:none; }
#footer .footer-in.wrap{ padding-top:0; padding-bottom:0; }
/* Cocoonは footer-bottom-logo を position:absolute+float に、content を float:right にする。
   これらを解除して素直な左寄せの積み上げレイアウトにする（重なり防止）。 */
#footer .footer-bottom{ display:block; position:static; margin:0; padding:48px 0 32px; border:none; text-align:left; font-size:inherit; }
#footer .footer-bottom-logo{ position:static; float:none; bottom:auto; margin:0; text-align:left; }
#footer .footer-bottom-logo .logo-footer{ margin:0; }  /* Cocoonの margin:auto 中央寄せを解除 */
#footer .footer-bottom-logo, #footer .footer-bottom-logo *{ text-align:left; }  /* ロゴ小要素の中央寄せ継承を解除 */
#footer .footer-bottom-logo .logo-text{ padding:0; }
#footer .footer-bottom-logo .site-name-text{ font-family:var(--oc-font-head); font-weight:700; font-size:18px; color:var(--oc-cream); letter-spacing:.04em; }
#footer .footer-bottom-logo .site-name-text-link{ color:var(--oc-cream); }
#footer .footer-bottom-content{ float:none; text-align:left; margin:0; }
#navi-footer.navi-footer{ background:transparent; border:none; float:none; width:auto; margin:14px 0 0; }
#navi-footer .navi-footer-in > .menu-footer{ display:flex; flex-wrap:wrap; gap:6px 22px; justify-content:flex-start; padding:0; margin:0; }
#navi-footer .navi-footer-in > .menu-footer li{ width:auto; border:none; margin:0; }
#navi-footer .menu-footer li a{ color:var(--oc-footer-text); font-size:13px; padding:0; background:transparent; border:none; display:inline; width:auto; }
#navi-footer .menu-footer li a:hover{ color:var(--oc-cream); background:transparent; }
#footer .source-org.copyright{
  display:block; width:auto; border-top:1px solid var(--oc-footer-border); margin-top:20px;
  padding:14px 0 0; font-size:11px; letter-spacing:.08em; color:var(--oc-meta); text-align:left;
}
/* フッターウィジェット（設定時） */
.footer-widgets{ border-bottom:1px solid var(--oc-footer-border); padding:32px 0; }
.footer-widgets .widget-title, .footer-widgets .wp-block-heading{ color:var(--oc-cream); font-family:var(--oc-font-head); }
.footer-widgets a{ color:var(--oc-footer-text); }
.footer-widgets a:hover{ color:var(--oc-cream); }

/* ====== 22. トップへ戻る / モバイル固定ボタン / ドロワー ============== */
#go-to-top .go-to-top-button{
  background:var(--oc-green); color:var(--oc-cream); border:none; border-radius:100px;
  width:44px; height:44px; box-shadow:var(--oc-shadow-card);
}
#go-to-top .go-to-top-button:hover{ background:var(--oc-terra); color:var(--oc-cream); }
.mobile-footer-menu-buttons.mobile-menu-buttons{ background:var(--oc-surface); border-top:1px solid var(--oc-border); }
.mobile-menu-buttons .menu-button .menu-button-in{ color:var(--oc-text); min-height:44px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.mobile-menu-buttons .menu-button .menu-caption{ color:var(--oc-meta); font-size:10px; }
.mobile-menu-buttons .menu-button .menu-icon .fa{ color:var(--oc-green); }
.mobile-menu-buttons .menu-button:hover .menu-button-in, .mobile-menu-buttons .menu-open:hover{ color:var(--oc-terra); }
.search-menu-content .search-box.input-box{ margin:0; }

/* ====== 23. 404 ===================================================== */
.error404 .article.post{ max-width:var(--oc-read); margin:28px auto 0; text-align:center; background:transparent; }
.error404 .entry-title{ font-size:clamp(22px,4vw,30px); margin-bottom:20px; }
.error404 .not-found{ max-width:320px; height:auto; margin:0 auto 20px; display:block; }
.error404 .article.post p{ color:var(--oc-muted); }

/* ====== 24. 前面バンド 保険トーン（設定で表示された時のため） ========= */
#notice-area{ background:var(--oc-green); color:var(--oc-cream); border-radius:10px; }
.recommended, #content-top, #content-bottom{ background:transparent; }
.recommended-in .widget-title{ color:var(--oc-ink); font-family:var(--oc-font-head); }
#carousel{ background:transparent; }

/* ====== 25. レスポンシブ（ブレークポイント 480/834/1023 を維持） ======== */
/* タブレット（〜1023）：一覧は2列を維持しつつフレーム左右余白を少し詰める */
@media screen and (max-width:1023px){
  :root{ --oc-gutter:24px; }
  #list.list{ gap:24px; }
}
/* 中間（〜834）：ヘッダー折返し、アピール帯の余白調整 */
@media screen and (max-width:834px){
  .header-in.wrap{ padding-top:18px; padding-bottom:14px; }
  #navi ul{ justify-content:flex-start; }
  #appeal .appeal-in.wrap{ padding-top:44px; padding-bottom:44px; }
  #comment-area.comment-area, #pager-post-navi.pager-post-navi{ max-width:100%; }
}
/* スマホ（〜480）：一覧1列・見出し縮小・帯詰め・フッター縦 */
@media screen and (max-width:480px){
  /* SPの左右余白：フレーム20px。記事の読み余白はこの外枠20pxが担うため read-pad は0に（二重余白防止） */
  :root{ --oc-gutter:20px; --oc-read-pad:0px; }
  .content-in.wrap{ padding-top:var(--sp-5); }   /* ヘッダー/帯→本文の上余白 SP=32 */
  .header-container-in{ padding-top:12px; padding-bottom:12px; }  /* ヘッダー SP=12px 0 */
  #list.list{ grid-template-columns:1fr; gap:20px; }
  /* 下部モジュール SP：本文カラム(SPは外枠gutter20が余白を担う→read-pad0)。モジュール間余白≈40 */
  .under-entry-content{ padding-top:12px; }   /* 上12+記事末尾余白≈42 */
  #pager-post-navi.pager-post-navi{ margin-top:36px; }
  #breadcrumb.sbp-main-bottom{ margin-top:36px; }
  /* 関連記事 SP：2列 gap12・タイトル13px/lh1.45 */
  .related-list{ grid-template-columns:1fr 1fr; gap:12px; }
  .related-entry-card .related-entry-card-title{ font-size:13px; line-height:1.45; }
  .logo-header .site-name-text{ font-size:19px; }
  .entry-title{ font-size:22px; }
  .entry-content h2{ font-size:20px; padding:12px 16px; margin-top:40px; }
  .entry-content h3{ font-size:17px; }
  .toc, #toc.toc{ padding:20px 18px; }
  .author-box{ padding:20px; gap:14px; }
  #appeal .appeal-in.wrap{ padding-top:36px; padding-bottom:36px; }
  #footer.footer{ margin-top:var(--sp-6); }   /* SPのセクション間余白 上限48 */
  #footer .footer-bottom{ flex-direction:column; align-items:flex-start; padding:32px 0 24px; }
  #footer .footer-bottom-content{ align-items:flex-start; }
  #navi-footer .navi-footer-in ul.menu-footer{ justify-content:flex-start; }
  .blogcard{ flex-direction:column; }
  .blogcard-thumbnail{ width:100%; }
  /* 前後ナビ SP：2分割を維持。サムネ96pxは2カラムセル(≈140px)に収まらずタイトル幅が
     8em未満に潰れる(R3)ため、SPのみサムネ非表示にしてタイトルをセル全幅化・13px */
  .pager-post-navi .prev-post-thumb, .pager-post-navi .next-post-thumb, .pager-post-navi .card-thumb{ display:none; }
  .pager-post-navi .prev-post-title, .pager-post-navi .next-post-title{ font-size:13px; }
}

/* ====== 26. トップ ヒーロー v5（フロントのみ・分割パネル・写真裁ち落とし） ==== */
/* ヒーロー出力時は既存アピール帯を非表示（二重帯防止）。#appeal はフロントのみ描画される */
.front-top-page #appeal{ display:none; }
/* PC(1024+)：左テキスト45% / 右写真55%。画面幅いっぱい・高さ440・ヘッダー直下で余白0 */
.site-hero{
  display:flex; height:440px; overflow:hidden;
  background:#E8EBE4;
  background:color-mix(in srgb, var(--oc-green) 10%, var(--oc-surface));
}
/* 左パネル：緑ティント・上下中央。テキスト左端をカード一覧コンテナ左端に揃える */
.site-hero-text{
  flex:0 0 45%; min-width:0; box-sizing:border-box;
  display:flex; flex-direction:column; justify-content:center;
  padding-left:max(32px, calc((100vw - 1060px) / 2 + 32px));
  padding-right:32px;
}
.site-hero-catch{
  font-family:var(--oc-font-head); font-weight:700; color:var(--oc-green);
  font-size:30px; line-height:1.5; letter-spacing:.04em; margin:0;
}
.site-hero-accent{ display:block; width:48px; height:3px; background:var(--oc-terra); border-radius:2px; margin:16px 0; }
.site-hero-sub{
  font-family:var(--oc-font-body); color:var(--oc-text);
  font-size:16px; line-height:1.8; margin:0;
}
/* 右パネル：写真55%。上下・画面右端に完全接地（隙間0・角丸0・影0） */
.site-hero-photo{ flex:0 0 55%; min-width:0; height:100%; }
.site-hero-photo picture{ display:block; height:100%; }
.site-hero-photo img{
  width:100%; height:100%; object-fit:cover; object-position:50% 35%;
  display:block; margin:0; border-radius:0; box-shadow:none;
}
/* タブレット 834–1023：高さ400 */
@media screen and (max-width:1023px){
  .site-hero{ height:400px; }
}
/* SP 833以下：縦積み（テキスト緑ティント→写真100%裁ち落とし260px） */
@media screen and (max-width:833px){
  .site-hero{ flex-direction:column; height:auto; }
  .site-hero-text{ flex:0 0 auto; padding:32px 20px; }
  .site-hero-photo{ flex:0 0 auto; width:100%; height:260px; }
  .site-hero-photo img{ height:260px; object-position:50% 32%; }
  .site-hero-catch{ font-size:24px; }
  .site-hero-sub{ font-size:15px; }
  .site-hero-accent{ margin:14px 0; }
}