@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.8.0
*/

/* ====================================
   統一カラーパレット
   ==================================== */
:root {
  --c-blue-main: #34568b;
  --c-blue-mid:  #5b7bb8;
  --c-blue-soft: #8fa9d1;
  --c-blue-pale: #eef3f9;
  --c-orange:    #e89c4c;
  --c-orange-d:  #c97d2e;
  --c-orange-p:  #fdf5ea;
  --c-text:      #2c3e50;
  --c-text-mute: #7a8899;
  --c-line:      #e5e9f0;
}

/* ====================================
   ヘッダー：洗練版
   ==================================== */
#header, .header-container {
  background: linear-gradient(135deg, #34568b 0%, #4d6ea8 60%, #5b7bb8 100%) !important;
  position: relative !important;
  border-bottom: 3px solid #e89c4c !important;
}
#header::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -3px;
  height: 3px;
  background: linear-gradient(90deg, transparent, #e89c4c, transparent);
}
#header-in.header-in.wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px 16px !important;
  gap: 6px !important;
}
#header .tagline {
  order: 2 !important;
  font-size: 0.78em !important;
  color: rgba(255,255,255,0.85) !important;
  letter-spacing: 2px !important;
  font-weight: 400 !important;
  margin: 0 !important;
  text-align: center !important;
  position: relative !important;
  padding: 6px 14px !important;
}
#header .tagline::before,
#header .tagline::after {
  content: "—" !important;
  color: rgba(255,255,255,0.5) !important;
  margin: 0 8px !important;
}
#header .logo,
#header .logo-header {
  order: 1 !important;
  text-align: center !important;
  margin: 0 !important;
}
#header .site-name-text-link,
#header a.site-name {
  text-decoration: none !important;
}
#header .site-name-text {
  color: #ffffff !important;
  font-size: 1.8em !important;
  font-weight: 900 !important;
  letter-spacing: 1px !important;
  text-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
  display: inline-block !important;
  position: relative !important;
}
@media screen and (max-width: 600px) {
  #header .site-name-text { font-size: 1.4em !important; }
  #header .tagline { font-size: 0.7em !important; letter-spacing: 1px !important; }
  #header-in.header-in.wrap { padding: 18px 12px !important; }
}

/* ====================================
   グローバルナビ
   ==================================== */
#navi, .navi-in {
  background: #2d4a78 !important;
}
#navi .navi-in > .menu-header > .menu-item > a {
  color: #ffffff !important;
  font-weight: 500 !important;
  letter-spacing: 0.5px !important;
  transition: background 0.2s !important;
}
#navi .navi-in > .menu-header > .menu-item > a:hover {
  background: rgba(255,255,255,0.12) !important;
  color: #ffffff !important;
}

/* ====================================
   記事中の汎用
   ==================================== */
.article a:not(.btn):not(.sns-button):not([style]) { color: #34568b; }
.article a:not(.btn):not(.sns-button):not([style]):hover { color: #5b7bb8; }
.btn, .more-button { background: #34568b !important; color: #fff !important; }
.btn:hover, .more-button:hover { background: #5b7bb8 !important; }
.article h2 { border-color: #5b7bb8 !important; }

/* ====================================
   トップページ：SNS・タイトル・目次・アイキャッチ非表示
   ==================================== */
body.home .sns-share.ss-top,
body.front-top-page .sns-share.ss-top,
body.page-id-1217 .sns-share.ss-top,
body.page-id-1217 .sns-share.ss-bottom,
body.home .entry-title,
body.page-id-1217 .entry-title,
body.page-id-1217 .article-header,
body.page-id-1217 .date-tags,
body.page-id-1217 .post-update-date,
body.home .toc, body.page-id-1217 .toc,
body.page-id-1217 .ez-toc-container,
body.home .eye-catch-wrap, body.page-id-1217 .eye-catch-wrap {
  display: none !important;
}

/* ====================================
   サイドバー プロフィールウィジェット
   ==================================== */
#sidebar .widget_author_box,
#sidebar aside.widget_author_box {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  margin-bottom: 24px !important;
}
#sidebar .author-box {
  background: #ffffff !important;
  border: 1px solid #e5e9f0 !important;
  border-top: 3px solid #e89c4c !important;
  border-radius: 12px !important;
  padding: 22px 18px !important;
  box-shadow: 0 2px 10px rgba(52,86,139,0.06) !important;
}
#sidebar .author-box img.avatar {
  width: 80px !important; height: 80px !important;
  border-radius: 50% !important;
  border: 2px solid #fdf5ea !important;
  margin: 0 auto 10px !important;
  display: block !important;
}
#sidebar .author-box .author-name,
#sidebar .author-box .author-display-name {
  text-align: center !important;
  font-size: 1.05em !important;
  font-weight: bold !important;
  color: #2c3e50 !important;
  margin: 0 0 8px !important;
  display: block !important;
}
#sidebar .author-box .author-description,
#sidebar .author-box p {
  font-size: 0.82em !important;
  color: #555 !important;
  line-height: 1.7 !important;
  text-align: center !important;
  margin: 8px 0 0 !important;
}
#sidebar .author-box a {
  color: #34568b !important;
  font-weight: bold !important;
  text-decoration: none !important;
  border-bottom: 1px solid #d8e2ee !important;
}
#sidebar .author-box .sns-follow-buttons {
  text-align: center !important;
  margin-top: 12px !important;
}
#sidebar .author-box .sns-follow-buttons a {
  background: #eef3f9 !important;
  color: #34568b !important;
  border-radius: 50% !important;
  width: 32px !important; height: 32px !important;
  display: inline-flex !important;
  align-items: center !important; justify-content: center !important;
  margin: 0 4px !important;
  border-bottom: none !important;
}

/* ====================================
   サイドバー カテゴリー：タグ風ピル
   ==================================== */
#sidebar .widget_categories {
  background: #fff !important;
  border: 1px solid #e5e9f0 !important;
  border-top: 3px solid #34568b !important;
  border-radius: 12px !important;
  padding: 18px 16px !important;
  margin-bottom: 24px !important;
  box-shadow: 0 2px 10px rgba(52,86,139,0.06) !important;
}
#sidebar .widget_categories .widget-sidebar-title,
#sidebar .widget_categories h3 {
  font-size: 0.78em !important;
  font-weight: bold !important;
  color: #34568b !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  border: none !important;
  letter-spacing: 2.5px !important;
  text-align: center !important;
  text-transform: uppercase !important;
}
#sidebar .widget_categories .widget-sidebar-title::before,
#sidebar .widget_categories .widget-sidebar-title::after {
  content: "—" !important;
  color: #8fa9d1 !important;
  margin: 0 8px !important;
}
#sidebar .widget_categories ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}
#sidebar .widget_categories li {
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
#sidebar .widget_categories li a {
  display: inline-block !important;
  padding: 6px 12px !important;
  background: #eef3f9 !important;
  color: #34568b !important;
  text-decoration: none !important;
  font-size: 0.78em !important;
  font-weight: 600 !important;
  border-radius: 14px !important;
  border: 1px solid #d8e2ee !important;
  transition: all 0.2s !important;
  line-height: 1.4 !important;
}
#sidebar .widget_categories li a:hover {
  background: #34568b !important;
  color: #fff !important;
  border-color: #34568b !important;
  transform: translateY(-1px) !important;
}
#sidebar .widget_categories li a::before { content: none !important; }
/* カテゴリー数表示 */
#sidebar .widget_categories li a span,
#sidebar .widget_categories li .post-count {
  background: rgba(255,255,255,0.7) !important;
  color: #5b7bb8 !important;
  font-size: 0.9em !important;
  margin-left: 4px !important;
  padding: 0 4px !important;
  border-radius: 8px !important;
}

/* ====================================
   サイドバー その他ウィジェット統一スタイル
   ==================================== */
#sidebar .widget_popular_entries,
#sidebar .widget_new_entries,
#sidebar .widget_search {
  background: #fff !important;
  border: 1px solid #e5e9f0 !important;
  border-radius: 12px !important;
  padding: 16px !important;
  margin-bottom: 20px !important;
  box-shadow: 0 1px 6px rgba(52,86,139,0.04) !important;
}
#sidebar .widget_popular_entries .widget-sidebar-title,
#sidebar .widget_new_entries .widget-sidebar-title {
  font-size: 0.78em !important;
  color: #34568b !important;
  letter-spacing: 2px !important;
  border: none !important;
  border-bottom: 1px solid #eef3f9 !important;
  padding: 0 0 8px !important;
  margin: 0 0 10px !important;
  text-transform: uppercase !important;
  font-weight: bold !important;
}


/* ====================================
   サイドバープロフィール下のSNSアイコン非表示
   （home/feedly/rssは未連携のため）
   ==================================== */
#sidebar .author-box .sns-follow-buttons,
#sidebar .author-box .author-follows {
  display: none !important;
}

/* ====================================
   微調整：カード共通ホバー効果でアクティブ感UP
   ==================================== */
.home a[href^="/"], .home a[href*="ai-torisetu.com"] {
  transition: transform 0.18s, box-shadow 0.18s !important;
}
.home a[href^="/"]:hover, .home a[href*="ai-torisetu.com"]:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 14px rgba(52,86,139,0.12) !important;
}

/* お問い合わせCTAは違うエフェクト */
.home .article a[href="/contact/"]:hover,
.home .article a[href^="mailto:"]:hover {
  transform: none !important;
  box-shadow: none !important;
}


/* ====================================
   モバイル：サイドバーデザインを継承
   親テーマの mobile media query を上書き
   ==================================== */
@media screen and (max-width: 1023px) {
  /* プロフィール */
  #sidebar .widget_author_box,
  #sidebar aside.widget_author_box {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    margin-bottom: 24px !important;
  }
  #sidebar .author-box {
    background: #ffffff !important;
    border: 1px solid #e5e9f0 !important;
    border-top: 3px solid #e89c4c !important;
    border-radius: 12px !important;
    padding: 22px 18px !important;
    box-shadow: 0 2px 10px rgba(52,86,139,0.06) !important;
  }
  #sidebar .author-box img.avatar {
    width: 80px !important; height: 80px !important;
    border-radius: 50% !important;
    border: 2px solid #fdf5ea !important;
    margin: 0 auto 10px !important;
    display: block !important;
  }
  #sidebar .author-box .author-name,
  #sidebar .author-box .author-display-name {
    text-align: center !important;
    font-size: 1.05em !important;
    font-weight: bold !important;
    color: #2c3e50 !important;
    margin: 0 0 8px !important;
    display: block !important;
  }
  #sidebar .author-box .author-description,
  #sidebar .author-box p {
    font-size: 0.82em !important;
    color: #555 !important;
    line-height: 1.7 !important;
    text-align: center !important;
    margin: 8px 0 0 !important;
  }
  #sidebar .author-box a {
    color: #34568b !important;
    font-weight: bold !important;
    text-decoration: none !important;
    border-bottom: 1px solid #d8e2ee !important;
  }
  #sidebar .author-box .sns-follow-buttons,
  #sidebar .author-box .author-follows {
    display: none !important;
  }

  /* カテゴリー（タグ風） */
  #sidebar .widget_categories {
    background: #fff !important;
    border: 1px solid #e5e9f0 !important;
    border-top: 3px solid #34568b !important;
    border-radius: 12px !important;
    padding: 18px 16px !important;
    margin-bottom: 24px !important;
    box-shadow: 0 2px 10px rgba(52,86,139,0.06) !important;
  }
  #sidebar .widget_categories .widget-sidebar-title {
    font-size: 0.78em !important;
    font-weight: bold !important;
    color: #34568b !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    border: none !important;
    letter-spacing: 2.5px !important;
    text-align: center !important;
    text-transform: uppercase !important;
  }
  #sidebar .widget_categories ul {
    list-style: none !important;
    margin: 0 !important; padding: 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
  }
  #sidebar .widget_categories li {
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  #sidebar .widget_categories li a {
    display: inline-block !important;
    padding: 6px 12px !important;
    background: #eef3f9 !important;
    color: #34568b !important;
    text-decoration: none !important;
    font-size: 0.78em !important;
    font-weight: 600 !important;
    border-radius: 14px !important;
    border: 1px solid #d8e2ee !important;
  }
  #sidebar .widget_categories li a::before { content: none !important; }

  /* 他ウィジェット */
  #sidebar .widget_popular_entries,
  #sidebar .widget_new_entries,
  #sidebar .widget_search {
    background: #fff !important;
    border: 1px solid #e5e9f0 !important;
    border-radius: 12px !important;
    padding: 16px !important;
    margin-bottom: 20px !important;
    box-shadow: 0 1px 6px rgba(52,86,139,0.04) !important;
  }
}


/* ====================================
   サイドバーカテゴリー ホバー：シンプル化
   親の transform/shadow 効果を完全打ち消し
   ==================================== */
#sidebar .widget_categories li a,
#sidebar .widget_categories li a:hover {
  transform: none !important;
  box-shadow: none !important;
  transition: background 0.2s, color 0.2s !important;
}
#sidebar .widget_categories li a:hover {
  background: #34568b !important;
  color: #fff !important;
  border-color: #34568b !important;
}
@media screen and (max-width: 1023px) {
  #sidebar .widget_categories li a,
  #sidebar .widget_categories li a:hover {
    transform: none !important;
    box-shadow: none !important;
  }
  #sidebar .widget_categories li a:hover {
    background: #34568b !important;
    color: #fff !important;
  }
}


/* 内側 .list-item-caption の白背景を消す（ホバー時の違和感解消）*/
#sidebar .widget_categories li a span,
#sidebar .widget_categories li a .list-item-caption {
  background: transparent !important;
  color: inherit !important;
  padding: 0 !important;
  border-radius: 0 !important;
  margin: 0 !important;
}
@media screen and (max-width: 1023px) {
  #sidebar .widget_categories li a span,
  #sidebar .widget_categories li a .list-item-caption {
    background: transparent !important;
    color: inherit !important;
    padding: 0 !important;
  }
}


/* ====================================
   サイドバー：追加ウィジェットのスタイル
   ==================================== */
#sidebar .widget_custom_html {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin-bottom: 24px !important;
}

/* タグクラウド：ピル型に統一 */
#sidebar .widget_tag_cloud {
  background: #fff !important;
  border: 1px solid #e5e9f0 !important;
  border-top: 3px solid #4ba89b !important;
  border-radius: 12px !important;
  padding: 18px 16px !important;
  margin-bottom: 24px !important;
  box-shadow: 0 2px 10px rgba(52,86,139,0.06) !important;
}
#sidebar .widget_tag_cloud .widget-sidebar-title {
  font-size: 0.78em !important;
  font-weight: bold !important;
  color: #4ba89b !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  border: none !important;
  letter-spacing: 2.5px !important;
  text-align: center !important;
  text-transform: uppercase !important;
}
#sidebar .widget_tag_cloud .tagcloud {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}
#sidebar .widget_tag_cloud .tagcloud a {
  display: inline-block !important;
  font-size: 0.72em !important;
  background: #e8f4f2 !important;
  color: #2d8a7c !important;
  padding: 5px 11px !important;
  border-radius: 14px !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  border: 1px solid #c8e2dc !important;
  transform: none !important;
  box-shadow: none !important;
  transition: background 0.2s, color 0.2s !important;
}
#sidebar .widget_tag_cloud .tagcloud a:hover {
  background: #4ba89b !important;
  color: #fff !important;
  border-color: #4ba89b !important;
}

@media screen and (max-width: 1023px) {
  #sidebar .widget_custom_html {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin-bottom: 24px !important;
  }
  #sidebar .widget_tag_cloud {
    background: #fff !important;
    border: 1px solid #e5e9f0 !important;
    border-top: 3px solid #4ba89b !important;
    border-radius: 12px !important;
    padding: 18px 16px !important;
    margin-bottom: 24px !important;
  }
  #sidebar .widget_tag_cloud .tagcloud a {
    background: #e8f4f2 !important;
    color: #2d8a7c !important;
    border: 1px solid #c8e2dc !important;
    padding: 5px 11px !important;
    border-radius: 14px !important;
  }
}


/* タグクラウド：上位10個のみ表示 */
#sidebar .widget_tag_cloud .tagcloud a:nth-of-type(n+11) {
  display: none !important;
}
@media screen and (max-width: 1023px) {
  #sidebar .widget_tag_cloud .tagcloud a:nth-of-type(n+11) {
    display: none !important;
  }
}


/* プロフィールページの目次非表示 */
body.page-id-46 .toc,
body.page-id-46 #toc,
body.page-id-46 .ez-toc-container,
body.page-id-46 .entry-title,
body.page-id-46 .article-header {
  display: none !important;
}

/* プロフィールページ下部のSNSシェア非表示 */
body.page-id-46 .sns-share,
body.page-id-46 .sns-share.ss-bottom,
body.page-id-46 .sns-share.ss-top {
  display: none !important;
}

/* === 記事ページ（single-post）のみサイドバー非表示＆本文をフル幅化 === */
@media screen and (min-width: 1024px) {
  body.single-post #sidebar {
    display: none !important;
  }
  body.single-post .main,
  body.single-post #main {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
  }
  body.single-post .content-in {
    max-width: 1100px !important;
    margin: 0 auto !important;
  }
  body.single-post .article-inner {
    max-width: 100% !important;
  }
  /* 本文内テーブルを横スクロール対応 */
  body.single-post .entry-content table {
    display: block !important;
    overflow-x: auto !important;
    width: 100% !important;
    -webkit-overflow-scrolling: touch !important;
  }
  body.single-post .entry-content table thead th {
    white-space: nowrap !important;
  }
}

/* === E-E-A-T強化：日付・著者情報を目立たせる === */
body.single-post .post-date,
body.single-post .post-update {
  font-size: 0.9em !important;
  color: #5b7bb8 !important;
  font-weight: 600 !important;
}
body.single-post .post-meta .post-update::before {
  content: "✏️ ";
}
body.single-post .post-meta .post-date::before {
  content: "📅 ";
}

/* 記事末尾のインライン著者ボックス */
.inline-author-box {
  display: flex;
  align-items: center;
  gap: 16px;
  background: linear-gradient(135deg, #eef3f9 0%, #f7f9fc 100%);
  border-left: 4px solid #5b7bb8;
  border-radius: 10px;
  padding: 20px 22px;
  margin: 32px 0 24px;
}
.inline-author-box img {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  flex-shrink: 0;
  border: 2px solid #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}
.inline-author-box .iab-text {
  flex: 1;
  font-size: 0.92em;
  line-height: 1.7;
}
.inline-author-box .iab-name {
  font-weight: bold;
  color: #34568b;
  font-size: 1.05em;
  margin: 0 0 4px;
}
.inline-author-box .iab-bio {
  margin: 0 0 8px;
  color: #444;
}
.inline-author-box .iab-link {
  color: #e89c4c;
  font-weight: bold;
  text-decoration: none;
  font-size: 0.9em;
}
@media (max-width: 768px) {
  .inline-author-box { flex-direction: column; text-align: center; }
}


/* ============================================================
   === AIブログラボ完全模倣 CSS（SWELL風・2026-05-25 リビルド）===
   ============================================================ */

/* ---- 1. ベースタイポグラフィ ---- */
.entry-content,
.article,
article {
  font-family: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif !important;
  font-size: 16px !important;
  line-height: 1.9 !important;
  color: #333 !important;
  letter-spacing: 0.02em !important;
}
.entry-content p,
.article p,
article p {
  margin: 0 0 1.6em !important;
  line-height: 1.9 !important;
  color: #333 !important;
}

/* ---- 2. 見出し（SWELL風シンプル）---- */
.entry-content h2,
.article h2,
article h2 {
  position: relative !important;
  margin: 3em 0 1.2em !important;
  padding: 0.6em 0.8em 0.6em 1.2em !important;
  font-size: 1.5em !important;
  font-weight: bold !important;
  color: #2a2a2a !important;
  border: none !important;
  background: linear-gradient(to right, #eef3f9 0%, transparent 100%) !important;
  border-left: 6px solid #5b7bb8 !important;
  line-height: 1.5 !important;
}
.entry-content h3,
.article h3 {
  position: relative !important;
  margin: 2.2em 0 1em !important;
  padding: 0 0 0.5em 0 !important;
  font-size: 1.2em !important;
  font-weight: bold !important;
  color: #2a2a2a !important;
  border: none !important;
  border-bottom: 2px solid #5b7bb8 !important;
  background: none !important;
  line-height: 1.5 !important;
}
.entry-content h4 {
  margin: 1.6em 0 0.8em !important;
  font-size: 1.05em !important;
  font-weight: bold !important;
  padding-left: 12px !important;
  border-left: 4px solid #ccc !important;
}

/* ---- 3. 太字（黄色マーカー）---- */
.entry-content strong,
.article strong {
  background: linear-gradient(transparent 65%, #ffeb99 65%) !important;
  font-weight: bold !important;
  padding: 0 2px !important;
  color: #2a2a2a !important;
}

/* ---- 4. 目次（SWELL風1列クリーン）---- */
.toc, #toc {
  max-width: 720px !important;
  margin: 32px auto !important;
  background: #f9fafb !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 6px !important;
  padding: 24px 28px !important;
}
.toc-title, .toc .toc-title {
  font-size: 1em !important;
  font-weight: bold !important;
  color: #4b5563 !important;
  text-align: center !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: none !important;
  letter-spacing: 0.1em !important;
}
.toc-title::before { content: "≡  " !important; color: #9ca3af !important; }
.toc ol, .toc ul, .toc-content ol, .toc-content ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  counter-reset: toc-h2 !important;
}
.toc > ol > li, .toc > ul > li, .toc-content > ol > li, .toc-content > ul > li {
  counter-increment: toc-h2 !important;
  position: relative !important;
  padding: 8px 0 8px 38px !important;
  font-size: 0.98em !important;
  font-weight: 500 !important;
  color: #374151 !important;
}
.toc > ol > li::before, .toc > ul > li::before,
.toc-content > ol > li::before, .toc-content > ul > li::before {
  content: counter(toc-h2) !important;
  position: absolute !important;
  left: 0 !important; top: 8px !important;
  width: 26px !important; height: 26px !important;
  background: #5b7bb8 !important;
  color: #fff !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0.78em !important;
  font-weight: bold !important;
}
.toc > ol > li > ol, .toc > ul > li > ul,
.toc-content > ol > li > ol, .toc-content > ul > li > ul {
  margin: 4px 0 4px 0 !important;
  padding: 0 !important;
  counter-reset: toc-h3 !important;
}
.toc > ol > li > ol > li, .toc > ul > li > ul > li,
.toc-content > ol > li > ol > li, .toc-content > ul > li > ul > li {
  counter-increment: toc-h3 !important;
  position: relative !important;
  padding: 4px 0 4px 24px !important;
  font-size: 0.9em !important;
  font-weight: 400 !important;
  color: #6b7280 !important;
}
.toc > ol > li > ol > li::before, .toc > ul > li > ul > li::before,
.toc-content > ol > li > ol > li::before, .toc-content > ul > li > ul > li::before {
  content: counter(toc-h3) !important;
  position: absolute !important;
  left: 0 !important; top: 4px !important;
  background: transparent !important;
  color: #9ca3af !important;
  font-size: 0.85em !important;
  width: auto !important; height: auto !important;
  border-radius: 0 !important;
  font-weight: normal !important;
}
/* h4以降の深いネストは目次から非表示 */
.toc-content ol ol ol,
.toc-content ol ol ul,
.toc-content ol ul ol,
.toc-content ol ul ul,
.toc-content ul ol ol,
.toc-content ul ol ul,
.toc-content ul ul ol,
.toc-content ul ul ul {
  display: none !important;
}

/* === プロンプト例ボックス === */
.prompt-example-box {
  background: #f7faff;
  border-left: 4px solid #5b7bb8;
  border-radius: 8px;
  padding: 16px 20px;
  margin: 24px 0;
}
.prompt-example-label {
  font-weight: 700;
  color: #5b7bb8;
  margin-bottom: 10px;
  font-size: 0.95em;
  letter-spacing: 0.02em;
}
.prompt-example-text {
  white-space: pre-wrap;
  font-size: 0.95em;
  line-height: 1.9;
  color: #374151;
}

/* === 日本語行頭禁則強化（「。」「、」が行頭に来ないように） === */
.entry-content p,
.entry-content li,
.cb p,
.intro-takeaway p,
.intro-takeaway li,
.prompt-example-text,
.fd-bubble p {
  line-break: strict !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
}
.toc a, .toc-content a {
  color: inherit !important;
  text-decoration: none !important;
}
.toc a:hover, .toc-content a:hover {
  color: #5b7bb8 !important;
  text-decoration: underline !important;
}

/* ---- 5. 装飾ボックス（SWELL「キャプションボックス」風）---- */
.cb {
  position: relative !important;
  margin: 28px 0 !important;
  padding: 22px 18px 14px 18px !important;
  background: #fff !important;
  border: 2px solid #e5e7eb !important;
  border-radius: 6px !important;
  line-height: 1.85 !important;
  font-size: 0.96em !important;
  color: #333 !important;
}
/* cb内本文の改行バランス改善（重要ワードが独立行にならないように） */
.cb p {
  text-wrap: pretty !important;
}
/* cb内のbody strong（label以外）はマーカー控えめ・行内に馴染ませる */
.cb p strong:not(:first-child) {
  background: linear-gradient(transparent 75%, #fff59d 75%) !important;
  font-weight: 600 !important;
}
.cb::before {
  content: "" !important;
  position: absolute !important;
  top: -14px !important;
  left: 16px !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 14px !important;
  color: #fff !important;
  font-weight: bold !important;
  background: #999 !important;
  border: 2px solid #fff !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08) !important;
}
.cb p { margin: 0 0 0.8em !important; line-height: 1.85 !important; }
.cb p:last-child { margin-bottom: 0 !important; }
.cb p strong:first-child {
  display: block !important;
  background: transparent !important;
  font-weight: bold !important;
  color: #2a2a2a !important;
  padding: 0 !important;
  margin: 0 0 4px !important;
  font-size: 1.02em !important;
}

/* ボックスタイプ別の色 */
.cb-tip { border-color: #5b7bb8 !important; background: #f3f7fc !important; }
.cb-tip::before { content: "!" !important; background: #5b7bb8 !important; font-size: 18px !important; }
.cb-tip p strong:first-child { color: #34568b !important; }

.cb-warning { border-color: #f4c542 !important; background: #fffdf0 !important; }
.cb-warning::before { content: "!" !important; background: #f4c542 !important; font-size: 18px !important; }
.cb-warning p strong:first-child { color: #b8860b !important; }

.cb-good { border-color: #4ba8d6 !important; background: #f3faff !important; }
.cb-good::before { content: "✓" !important; background: #4ba8d6 !important; }
.cb-good p strong:first-child { color: #2e8bb8 !important; }

.cb-bad { border-color: #e57373 !important; background: #fff5f5 !important; }
.cb-bad::before { content: "×" !important; background: #e57373 !important; font-size: 16px !important; }
.cb-bad p strong:first-child { color: #c54f4f !important; }

.cb-check { border-color: #4caf82 !important; background: #f3fdf7 !important; }
.cb-check::before { content: "✓" !important; background: #4caf82 !important; }
.cb-check p strong:first-child { color: #2e7d5b !important; }

.cb-memo { border-color: #5b7bb8 !important; background: #f3f7fc !important; }
.cb-memo::before { content: "✎" !important; background: #5b7bb8 !important; font-size: 15px !important; }
.cb-memo p strong:first-child { color: #34568b !important; }

.cb-qa { border-color: #8b6aaf !important; background: #faf5ff !important; }
.cb-qa::before { content: "?" !important; background: #8b6aaf !important; font-size: 16px !important; }
.cb-qa p strong:first-child { color: #6b4f8f !important; }

/* ---- 6. あわせて読みたいカード（SWELL風）---- */
.related-card-wrapper {
  margin: 36px 0 !important;
  padding: 0 !important;
}
.related-card-wrapper .rc-label {
  display: block !important;
  font-size: 0.78em !important;
  font-weight: bold !important;
  color: #888 !important;
  margin-bottom: 8px !important;
  padding: 0 0 0 0 !important;
  letter-spacing: 0.1em !important;
  position: relative !important;
}
.related-card-wrapper .rc-label::before {
  content: "✓ " !important;
  color: #5b7bb8 !important;
  margin-right: 4px !important;
}
.related-card-wrapper .rc-cards {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 6px !important;
  padding: 14px !important;
  background: #fff !important;
}
.related-card {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 8px !important;
  text-decoration: none !important;
  border-radius: 4px !important;
  transition: background 0.2s !important;
}
.related-card:hover {
  background: #f9fafb !important;
}
.related-card .rc-thumb {
  flex-shrink: 0 !important;
  width: 100px !important;
  height: 64px !important;
  border-radius: 4px !important;
  object-fit: cover !important;
  background: #f3f4f6 !important;
}
.related-card .rc-title {
  font-size: 0.92em !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  color: #1f2937 !important;
  text-decoration: none !important;
}
.related-card:hover .rc-title { color: #5b7bb8 !important; }
@media (max-width: 600px) {
  .related-card .rc-thumb { width: 76px !important; height: 50px !important; }
  .related-card .rc-title { font-size: 0.85em !important; }
}

/* ---- 7. 吹き出し（SWELL風）---- */
.fukidashi {
  display: flex !important;
  align-items: flex-start !important;
  gap: 14px !important;
  margin: 32px 0 !important;
}
.fukidashi.right { flex-direction: row-reverse !important; }
.fukidashi .fd-icon {
  flex-shrink: 0 !important;
  width: 64px !important;
  text-align: center !important;
}
.fukidashi .fd-icon img {
  width: 64px !important;
  height: 64px !important;
  border-radius: 50% !important;
  border: 2px solid #f3f4f6 !important;
}
.fukidashi .fd-name {
  font-size: 0.7em !important;
  color: #6b7280 !important;
  margin-top: 4px !important;
  font-weight: bold !important;
}
.fukidashi .fd-bubble {
  position: relative !important;
  flex: 1 !important;
  background: #f3f4f6 !important;
  border-radius: 12px !important;
  padding: 14px 18px !important;
  line-height: 1.75 !important;
}
.fukidashi .fd-bubble::before {
  content: "" !important;
  position: absolute !important;
  left: -10px !important;
  top: 18px !important;
  width: 0 !important; height: 0 !important;
  border-top: 8px solid transparent !important;
  border-bottom: 8px solid transparent !important;
  border-right: 10px solid #f3f4f6 !important;
}
.fukidashi.right .fd-bubble::before {
  left: auto !important;
  right: -10px !important;
  border-right: none !important;
  border-left: 10px solid #f3f4f6 !important;
}
.fukidashi .fd-bubble p { margin: 0 !important; }

/* ---- 8. CTAボタン（SWELL風シンプル）---- */
.cta-button-center {
  text-align: center !important;
  margin: 40px 0 !important;
}
.cta-button-center a {
  display: inline-block !important;
  padding: 16px 40px !important;
  background: #5b7bb8 !important;
  color: #fff !important;
  font-weight: bold !important;
  text-decoration: none !important;
  border-radius: 4px !important;
  font-size: 1em !important;
  box-shadow: 0 4px 0 #34568b !important;
  transition: all 0.15s !important;
}
.cta-button-center a::after {
  content: " ▶" !important;
  margin-left: 8px !important;
  font-size: 0.85em !important;
}
.cta-button-center a:hover {
  transform: translateY(2px) !important;
  box-shadow: 0 2px 0 #34568b !important;
}

/* ---- 9. 本文中画像 ---- */
.entry-content figure,
.article figure {
  max-width: 580px !important;
  margin: 28px auto !important;
  text-align: center !important;
}
.entry-content figure img,
.article figure img {
  max-width: 100% !important;
  height: auto !important;
  border-radius: 6px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
}

/* ---- 10. ul/ol リスト（SWELL風）---- */
.entry-content ul,
.entry-content ol,
.article ul,
.article ol {
  margin: 1.4em 0 !important;
  padding-left: 1.8em !important;
  line-height: 1.95 !important;
}
.entry-content li,
.article li {
  margin-bottom: 0.5em !important;
}
.entry-content ul li::marker { color: #5b7bb8 !important; }
.entry-content ol li::marker { color: #5b7bb8 !important; font-weight: bold !important; }

/* ---- 11. 著者カード（既存維持） ---- */
#author-card-puicho {
  /* CSS変更なし・既存スタイル維持 */
}


/* === 箇条書きスタイル v2（SWELL風） === */

/* ul（順序なし）：青チェック付き */
.entry-content ul,
.article ul,
article ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 1.6em 0 !important;
}
.entry-content ul li,
.article ul li,
article ul li {
  position: relative !important;
  padding: 10px 12px 10px 38px !important;
  margin: 0 !important;
  line-height: 1.8 !important;
  border-bottom: 1px dashed #e5e7eb !important;
  transition: background 0.15s !important;
}
.entry-content ul li:last-child,
.article ul li:last-child {
  border-bottom: none !important;
}
.entry-content ul li:hover,
.article ul li:hover {
  background: #f7faff !important;
}
.entry-content ul li::before,
.article ul li::before {
  content: "" !important;
  position: absolute !important;
  left: 12px !important;
  top: 18px !important;
  width: 14px !important;
  height: 14px !important;
  border: 2px solid #5b7bb8 !important;
  border-radius: 50% !important;
  background: #fff !important;
  box-sizing: border-box !important;
}
.entry-content ul li::after,
.article ul li::after {
  content: "" !important;
  position: absolute !important;
  left: 16px !important;
  top: 22px !important;
  width: 6px !important;
  height: 6px !important;
  background: #5b7bb8 !important;
  border-radius: 50% !important;
}

/* ol（順序付き）：青数字バッジ */
.entry-content ol,
.article ol,
article ol {
  list-style: none !important;
  padding: 0 !important;
  margin: 1.6em 0 !important;
  counter-reset: my-ol !important;
}
.entry-content ol li,
.article ol li,
article ol li {
  position: relative !important;
  padding: 10px 12px 10px 44px !important;
  margin: 0 !important;
  line-height: 1.8 !important;
  border-bottom: 1px dashed #e5e7eb !important;
  counter-increment: my-ol !important;
}
.entry-content ol li:last-child,
.article ol li:last-child {
  border-bottom: none !important;
}
.entry-content ol li::before,
.article ol li::before {
  content: counter(my-ol) !important;
  position: absolute !important;
  left: 10px !important;
  top: 11px !important;
  width: 24px !important;
  height: 24px !important;
  background: #5b7bb8 !important;
  color: #fff !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0.78em !important;
  font-weight: bold !important;
}

/* ネストした ul/ol は装飾を控えめに */
.entry-content ul ul,
.entry-content ol ol,
.entry-content ul ol,
.entry-content ol ul {
  margin: 8px 0 0 !important;
  padding-left: 8px !important;
}
.entry-content ul ul li,
.entry-content ol ul li {
  border-bottom: none !important;
  padding: 4px 12px 4px 28px !important;
}
.entry-content ul ul li::before {
  left: 8px !important;
  top: 12px !important;
  width: 8px !important;
  height: 8px !important;
  border-width: 1px !important;
}
.entry-content ul ul li::after {
  display: none !important;
}

/* 装飾ボックス内のリストはシンプルなまま */
.cb ul,
.cb ol {
  margin: 8px 0 !important;
}
.cb ul li,
.cb ol li {
  border-bottom: none !important;
  padding: 3px 0 3px 22px !important;
}
.cb ul li::before {
  left: 4px !important;
  top: 9px !important;
  width: 10px !important;
  height: 10px !important;
}
.cb ul li::after {
  left: 7px !important;
  top: 12px !important;
  width: 4px !important;
  height: 4px !important;
}
.cb ol li::before {
  left: 0 !important;
  top: 4px !important;
  width: 18px !important;
  height: 18px !important;
  font-size: 0.7em !important;
}
.cb ol li {
  padding-left: 26px !important;
}


/* === 箇条書き微調整 v3 === */

/* ① ホバー色変更を解除 */
.entry-content ul li:hover,
.article ul li:hover {
  background: transparent !important;
}

/* ② 点線下線を削除（強弱は太字に任せる） */
.entry-content ul li,
.article ul li,
.entry-content ol li,
.article ol li {
  border-bottom: none !important;
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}

/* ③ 矢印含む li の整列：display:grid で左/右に分ける */
.entry-content ul li.li-aligned,
.article ul li.li-aligned {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  padding-left: 38px !important;
}
.entry-content ul li.li-aligned .li-left {
  text-align: left !important;
}
.entry-content ul li.li-aligned .li-arrow {
  color: #5b7bb8 !important;
  font-weight: bold !important;
  font-size: 1.05em !important;
}
.entry-content ul li.li-aligned .li-right {
  text-align: left !important;
  font-weight: bold !important;
  color: #2a2a2a !important;
}


/* === 微調整 v4 === */

/* ① 「この記事でわかること」ボックス：絵文字なし・洗練デザイン */
.intro-takeaway {
  background: #fff !important;
  border: 1px solid #d4dfee !important;
  border-left: 5px solid #5b7bb8 !important;
  padding: 22px 26px !important;
  margin: 28px 0 !important;
  border-radius: 4px !important;
}
.intro-takeaway-title {
  font-size: 1.05em !important;
  font-weight: bold !important;
  color: #34568b !important;
  margin: 0 0 14px !important;
  padding: 0 0 10px 0 !important;
  border-bottom: 2px dotted #d4dfee !important;
  letter-spacing: 0.05em !important;
}
.intro-takeaway ul {
  margin: 0 !important;
}
.intro-takeaway ul li {
  border-bottom: none !important;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

/* ② リスト：丸と文の縦中央揃え */
.entry-content ul li,
.article ul li,
article ul li {
  display: flex !important;
  align-items: flex-start !important;
  padding-left: 36px !important;
}
.entry-content ul li::before,
.article ul li::before {
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin-top: -1px !important;
}
.entry-content ul li::after,
.article ul li::after {
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin-top: -1px !important;
}
/* li-aligned はflex解除＋gridで */
.entry-content ul li.li-aligned,
.article ul li.li-aligned {
  display: grid !important;
}

/* ③ 矢印もっと近づける（左右の余白を最小限に） */
.entry-content ul li.li-aligned,
.article ul li.li-aligned {
  grid-template-columns: max-content auto max-content !important;
  justify-content: start !important;
  gap: 14px !important;
}
.entry-content ul li.li-aligned .li-left {
  white-space: nowrap !important;
}
.entry-content ul li.li-aligned .li-right {
  white-space: nowrap !important;
}

/* ④ 装飾ボックスの文章先頭の不要文字（として、〇〇、〇〇は等）も除去するCSS不可。スクリプト側で対応 */