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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}

/************************************
** お金そだて🌱 表の見やすさ強化（2026-05-17更新）
************************************/
.table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 1.5em 0;
    border: 1px solid #d0d0d0;
    border-radius: 6px;
    background: #fff;
    /* iOS Safariでのスクロール体感を改善 */
    scroll-snap-type: x mandatory;
}
/* スマホで横スクロール可能であることをユーザーに気づかせるグラデーション */
.table-wrap::after {
    content: "";
}
.table-wrap table {
    margin: 0 !important;
    border-collapse: collapse;
    width: 100%;
    min-width: 720px;  /* これ以下の幅では横スクロールが発生 */
    font-size: 0.92em;
    background: #fff;
}
.table-wrap table th,
.table-wrap table td {
    padding: 12px 14px;
    border: 1px solid #e0e0e0;
    text-align: left;
    vertical-align: middle;  /* 縦中央揃え */
    word-break: normal;       /* 単語の途中での改行を防ぐ */
    overflow-wrap: anywhere;  /* 必要な場合のみ折り返し */
    line-height: 1.55;
}
.table-wrap table th {
    background: #f0f4f7;
    font-weight: bold;
    white-space: nowrap;  /* ヘッダーは改行しない */
}
/* 表内の<br>に余白を持たせて読みやすく */
.table-wrap table br {
    display: block;
    content: "";
    margin-top: 2px;
}
/* 強調セル（カード名・サービス名等）は折り返さない */
.table-wrap table td strong {
    white-space: nowrap;
    display: inline-block;
}

/* タブレット（768px〜1023px） */
@media screen and (max-width: 1023px) {
    .table-wrap table {
        font-size: 0.88em;
        min-width: 680px;
    }
    .table-wrap table th,
    .table-wrap table td {
        padding: 10px 12px;
    }
}

/* スマホ（767px以下）：横スクロールを基本とする */
@media screen and (max-width: 767px) {
    .table-wrap {
        margin: 1.2em -8px;  /* 端ギリギリまで使う */
        border-radius: 4px;
        position: relative;
    }
    .table-wrap table {
        font-size: 0.85em;
        min-width: 620px;
    }
    .table-wrap table th,
    .table-wrap table td {
        padding: 8px 10px;
    }
    /* スクロール可能であることを示すヒント（右端にうっすら影） */
    .table-wrap {
        background-image: linear-gradient(to right, transparent calc(100% - 24px), rgba(0,0,0,0.05) 100%);
        background-size: 100% 100%;
        background-repeat: no-repeat;
        background-attachment: local;
    }
}

/* 小型スマホ（374px以下） */
@media screen and (max-width: 374px) {
    .table-wrap table {
        font-size: 0.8em;
        min-width: 560px;
    }
}

/************************************
** お金そだて🌱 表のコントラスト強化（2026-05-17）
** 編集画面・公開画面どちらでも文字色を強制
************************************/
.table-wrap table th {
    background: #2E8B57 !important;  /* サイトのキーカラー：緑系 */
    color: #ffffff !important;        /* 白文字でコントラスト最大 */
    font-weight: 700 !important;
    border-color: #1e5e3a !important;
    text-shadow: 0 1px 0 rgba(0,0,0,0.15);
}

.table-wrap table td {
    color: #2c3e50 !important;        /* 濃いダークブルーグレー */
    background: #ffffff;
}

/* zebra（縞模様）を分かりやすく */
.table-wrap table tr:nth-child(even) td {
    background: #f5faf7 !important;   /* 薄いミントグリーン */
}

/* 強調セル内の<strong>：黄色マーカー＋濃い文字 */
.table-wrap table td strong {
    color: #1a3a52 !important;
    background: linear-gradient(transparent 60%, #ffe066 60%) !important;
    font-weight: 700 !important;
    padding: 0 2px;
}

/* ホバーで行をハイライト（PCで読みやすく） */
@media (hover: hover) {
    .table-wrap table tr:hover td {
        background: #e8f4ed !important;
    }
}

/************************************
** ホームページ専用：不要要素を非表示
************************************/
/* 固定ページID:96（ホーム）のタイトル・日付・SNSシェアを非表示 */
.page-id-96 .entry-title,
.page-id-96 .article-header,
.page-id-96 .date-tags,
.page-id-96 .post-date,
.page-id-96 .entry-meta,
.page-id-96 .sns-share,
.page-id-96 .sns-follow,
.page-id-96 .pager-post-navi,
.page-id-96 .breadcrumb {
    display: none !important;
}
/* 固定ページの本文上部のマージンを詰める */
.page-id-96 .article {
    padding-top: 0;
}
.page-id-96 .entry-content {
    margin-top: 0;
}

/* ホームページ：Cocoonの自動目次・関連要素も非表示 */
.page-id-96 .toc,
.page-id-96 #toc,
.page-id-96 .ez-toc-v2_0_77,
.page-id-96 .ez-toc-container,
.page-id-96 #ez-toc-container {
    display: none !important;
}

/************************************
** ヘッダー装飾強化（お金そだて🌱）
************************************/
/* ヘッダー全体：薄いグリーン背景でブランド統一感 */
#header {
    background: linear-gradient(180deg, #ffffff 0%, #f5faf7 100%) !important;
    border-bottom: 1px solid #c8e6c9 !important;
}

/* サイト名：緑＋微妙なシャドウで存在感UP */
.site-name-text,
.site-name {
    color: #2e8b57 !important;
    font-weight: bold !important;
    letter-spacing: 0.5px;
}

/* タグライン：丸い緑バッジ風に */
.tagline {
    color: #33691e !important;
    font-size: 0.78em !important;
    background: rgba(46, 139, 87, 0.1);
    padding: 3px 14px;
    border-radius: 14px;
    display: inline-block;
    margin-top: 8px !important;
    border: 1px solid rgba(46, 139, 87, 0.18);
    font-weight: bold;
}

/* プロモバーがモバイルで折り返ししても見やすく */
@media screen and (max-width: 767px) {
    .puicho-promo-bar {
        font-size: 0.78em !important;
        padding: 8px 10px !important;
    }
}

/* 運営者ページ（ID:25）：タイトル・目次・SNSシェアを非表示 */
.page-id-25 .entry-title,
.page-id-25 .article-header,
.page-id-25 .date-tags,
.page-id-25 .entry-meta,
.page-id-25 .sns-share,
.page-id-25 .sns-follow,
.page-id-25 .toc,
.page-id-25 #toc,
.page-id-25 .ez-toc-v2_0_77,
.page-id-25 .ez-toc-container {
    display: none !important;
}

/************************************
** 運営者ページ：レスポンシブフォント調整
************************************/
/* タブレット以下 */
@media screen and (max-width: 1023px) {
    .page-id-25 .article p,
    .page-id-25 .article li {
        font-size: 0.94em !important;
    }
}

/* スマホ */
@media screen and (max-width: 767px) {
    .page-id-25 .article p,
    .page-id-25 .article li {
        font-size: 0.9em !important;
        line-height: 1.75 !important;
    }
    /* プロフィールカード grid を2列に固定（スマホで縦並び1列にならないように調整） */
    .page-id-25 [style*="grid-template-columns:repeat(auto-fit"] {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }
    /* セクションheader調整 */
    .page-id-25 [style*="font-size:1.3em"][style*="font-weight:bold"] {
        font-size: 1.15em !important;
    }
    /* ヒーロー内テキスト調整 */
    .page-id-25 [style*="font-size:1.55em"] {
        font-size: 1.35em !important;
    }
}

/* 小型スマホ（375px以下）：1列に */
@media screen and (max-width: 414px) {
    .page-id-25 [style*="grid-template-columns:repeat(auto-fit"] {
        grid-template-columns: 1fr !important;
    }
}

/* ========== お金そだて🌱 キャラクター吹き出し（2026-05-25 追加） ========== */
.bubble-rabbit, .bubble-pui {
  display: flex !important;
  align-items: flex-start;
  gap: 10px;
  margin: 24px 0;
}
.bubble-pui { flex-direction: row-reverse; }
.bubble-rabbit .avatar,
.bubble-pui .avatar {
  flex-shrink: 0;
  width: 80px !important;
  max-width: 80px;
}
.bubble-rabbit .avatar img,
.bubble-pui .avatar img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.bubble-rabbit .text,
.bubble-pui .text {
  flex: 1;
  padding: 14px 18px;
  border-radius: 14px;
  border: 2px solid;
  margin: 0;
}
.bubble-rabbit .text { background: #fff9c4; border-color: #fdd835; }
.bubble-pui .text { background: #e8f5e9; border-color: #a5d6a7; }
.bubble-rabbit .text p,
.bubble-pui .text p {
  margin: 0 !important;
  color: #333;
  line-height: 1.85;
}
/* プロフィール末尾枠の画像も80pxに */
.profile-bottom .avatar {
  flex-shrink: 0;
  width: 80px !important;
  max-width: 80px;
}
.profile-bottom .avatar img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
}
@media (max-width: 480px) {
  .bubble-rabbit .avatar,
  .bubble-pui .avatar,
  .profile-bottom .avatar { width: 60px !important; max-width: 60px; }
}

/* お金そだて🌱 著者プロフィール枠 */
.profile-bottom {
  background: #f1f8e9;
  border: 2px solid #a5d6a7;
  border-radius: 10px;
  padding: 24px 28px;
  margin: 48px 0 16px;
  display: block !important;
}
.profile-bottom .head {
  display: flex !important;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
}
.profile-bottom .info .name {
  margin: 0 !important;
  font-weight: bold;
  color: #2e7d32;
  font-size: 1.1em;
}
.profile-bottom .info .role {
  margin: 2px 0 0 !important;
  font-size: 0.85em;
  color: #666;
}
.profile-bottom .bio {
  margin: 0 0 12px !important;
  font-size: 0.95em;
  line-height: 1.85;
}
.profile-bottom .tags {
  margin: 0 !important;
  font-size: 0.88em;
  color: #666;
}



/* ========== お金そだて🌱 目次（改良版・2026-05-25 v2） ========== */
.toc {
  background: #f1f8e9 !important;
  border: 2px solid #a5d6a7 !important;
  border-radius: 10px !important;
  padding: 24px 28px !important;
  margin: 32px auto !important;
  max-width: 100%; width: 100%;
  box-shadow: 0 2px 6px rgba(46,139,87,0.08);
}
.toc-title {
  background: none !important;
  border: none !important;
  color: #1e3a2e !important;
  font-weight: bold !important;
  font-size: 1.15em !important;
  text-align: center !important;
  margin: 0 0 16px !important;
  padding: 0 0 12px !important;
  border-bottom: 2px dashed #a5d6a7 !important;
}

/* ====== リスト全リセット ====== */
.toc ol, .toc ul,
.toc-list, .toc-list ol, .toc-list ul,
.toc-content ol, .toc-content ul {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}
.toc > div > ol,
.toc > ol,
.toc > ul,
.toc-content > ol,
.toc-list { counter-reset: tocnum !important; }

/* ====== h2レベル: 緑丸数字 ====== */
.toc > div > ol > li,
.toc > ol > li,
.toc > ul > li,
.toc-content > ol > li,
.toc-list > li {
  counter-increment: tocnum;
  list-style: none !important;
  margin: 12px 0 !important;
  padding: 4px 0 4px 40px !important;
  position: relative;
  min-height: 28px;
  line-height: 1.6;
}
.toc > div > ol > li::before,
.toc > ol > li::before,
.toc > ul > li::before,
.toc-content > ol > li::before,
.toc-list > li::before {
  content: counter(tocnum) !important;
  position: absolute;
  left: 0;
  top: 4px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 28px !important;
  height: 28px !important;
  background: #2e8b57 !important;
  color: #fff !important;
  border-radius: 50% !important;
  font-size: 0.85em;
  font-weight: bold;
  line-height: 1;
}

/* ====== h3レベル: 階層バレット ====== */
.toc li li {
  counter-increment: none !important;
  list-style: none !important;
  margin: 6px 0 !important;
  padding: 2px 0 2px 22px !important;
  font-size: 0.92em;
  color: #555;
  position: relative;
  line-height: 1.5;
  min-height: auto !important;
}
.toc li li::before {
  content: "└" !important;
  position: absolute;
  left: 4px;
  top: 2px;
  color: #2e8b57 !important;
  font-weight: bold;
  width: auto !important;
  height: auto !important;
  background: none !important;
  border-radius: 0 !important;
  display: inline !important;
  font-size: 1em !important;
}

/* ====== リンク ====== */
.toc a {
  color: #2e7d32 !important;
  text-decoration: none !important;
  vertical-align: middle;
  border-bottom: none !important;
}
.toc a:hover {
  color: #1b5e20 !important;
  text-decoration: underline !important;
}

/* スマホ */
@media (max-width: 600px) {
  .toc { padding: 18px 20px !important; }
  .toc > ol > li::before,
  .toc-list > li::before,
  .toc-content > ol > li::before { width: 24px !important; height: 24px !important; font-size: 0.78em; top: 5px; }
  .toc > ol > li,
  .toc-list > li,
  .toc-content > ol > li { padding-left: 34px !important; }
}
/* ========== 目次リストを中央寄せ（2026-05-25 v3 追加） ========== */
.toc > ol,
.toc > ul,
.toc-content > ol,
.toc-content > ul,
.toc-list {
  display: table !important;
  margin: 0 auto !important;
  text-align: left;
}

/* ========== ぷいちょのリアル（旧ぷいちょの本音）ボックス・2026-05-25 v4 ========== */
.honne {
  background: #fff8e1 !important;
  border-left: 5px solid #ffb300 !important;
  padding: 18px 22px !important;
  margin: 32px 0 !important;
  border-radius: 6px !important;
}
.honne .title {
  margin: 0 0 10px !important;
  font-weight: bold !important;
  color: #e65100 !important;
}
.honne p {
  margin: 0 !important;
  line-height: 1.9 !important;
}

/* ========== まとめセクションをボックスに ========== */
.summary-box {
  background: #f1f8e9 !important;
  border: 2px dashed #a5d6a7 !important;
  border-radius: 10px !important;
  padding: 24px 28px !important;
  margin: 40px 0 32px !important;
}
.summary-box > h2:first-child {
  margin-top: 0 !important;
  background: none !important;
  border-left: none !important;
  padding: 0 0 12px !important;
  border-bottom: 2px solid #2e8b57 !important;
}

/* ========== プロフィール末尾の画像を丸枠アイコンに ========== */
.profile-bottom .head .avatar {
  flex-shrink: 0;
  width: 80px !important;
  height: 80px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  border: 3px solid #a5d6a7;
  background: #fff;
}
.profile-bottom .head .avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center top !important;
  display: block !important;
  border-radius: 0 !important;
  margin: 0 !important;
}

/* ========== PR表記ボックス・先に結論ボックス・赤数字 ========== */
.pr-notice {
  background: #fff5e6 !important;
  border-left: 4px solid #ff9800 !important;
  padding: 14px 18px !important;
  margin-bottom: 36px !important;
  font-size: 0.88em !important;
  color: #666 !important;
  line-height: 1.7 !important;
  border-radius: 4px;
  display: block !important;
}



.red-num {
  color: #d32f2f !important;
  font-weight: bold !important;
}

/* ========== 先に結論ボックス（緑系・サイトテーマに統一） ========== */
.conclusion-box {
  background: linear-gradient(135deg, #f1f8e9 0%, #ffffff 100%) !important;
  border: 2px solid #a5d6a7 !important;
  border-left: 6px solid #2e8b57 !important;
  border-radius: 10px !important;
  padding: 24px 28px !important;
  margin: 36px 0 !important;
  box-shadow: 0 2px 8px rgba(46,139,87,0.1);
}
.conclusion-box .title {
  margin: 0 0 16px !important;
  font-weight: bold !important;
  color: #1b5e20 !important;
  font-size: 1.2em !important;
  padding-bottom: 10px !important;
  border-bottom: 2px dashed #a5d6a7 !important;
}
.conclusion-box p.item {
  margin: 12px 0 !important;
  line-height: 1.9 !important;
  color: #333 !important;
}

/* ========== 結論ボックス内は色を抑えて統一感（深緑1色に） ========== */
.conclusion-box strong,
.conclusion-box .red-num,
.conclusion-box span[style*="color:#d32f2f"],
.conclusion-box strong[style*="color:#d32f2f"],
.conclusion-box strong[style*="background"] {
  color: #1b5e20 !important;
  background: none !important;
  font-weight: bold !important;
}

/* ✅絵文字を独自のチェックマーカーに置き換え */
.conclusion-box p.item {
  position: relative;
  padding-left: 28px !important;
  margin: 14px 0 !important;
}
.conclusion-box p.item::before {
  content: "✓" !important;
  position: absolute;
  left: 0;
  top: 2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  background: #2e8b57;
  color: #fff !important;
  border-radius: 50%;
  font-size: 0.78em;
  font-weight: bold;
  line-height: 1;
}
/* 元の絵文字を非表示 */
.conclusion-box p.item {
  text-indent: 0;
}

/* ========== 結論ボックス v3: オレンジ太字＋チェック垂直中央 ========== */
.conclusion-box strong,
.conclusion-box .red-num,
.conclusion-box span[style*="color:#d32f2f"],
.conclusion-box strong[style*="color:#d32f2f"],
.conclusion-box strong[style*="background"] {
  color: #ef6c00 !important;
  background: none !important;
  font-weight: bold !important;
}
/* チェックマークを文字に合わせて垂直中央寄せ */
.conclusion-box p.item::before {
  top: 0.4em !important;
}

/* ========== v5: チェックマーク中央寄せ・表見出し色統一・プロフィール装飾削除・アイコン頭頂部 ========== */

/* 1. チェックマーク中央寄せ修正 */
.conclusion-box p.item::before {
  content: "✓" !important;
  position: absolute !important;
  left: 0 !important;
  top: 4px !important;
  display: inline-block !important;
  width: 22px !important;
  height: 22px !important;
  line-height: 22px !important;
  text-align: center !important;
  background: #2e8b57 !important;
  color: #fff !important;
  border-radius: 50% !important;
  font-size: 13px !important;
  font-weight: bold !important;
  padding: 0 !important;
  vertical-align: middle !important;
}

/* 3. 表ヘッダー（th）の装飾を全部無効化、文字色は白で統一 */
.table-wrap th,
table th,
.toc + * table th {
  background: #2e8b57 !important;
  color: #fff !important;
  font-weight: bold !important;
}
.table-wrap th *,
table th * {
  color: #fff !important;
  background: none !important;
  text-decoration: none !important;
  border-bottom: none !important;
  font-weight: bold !important;
}
.table-wrap th strong,
.table-wrap th .red-num,
.table-wrap th span,
table th strong,
table th .red-num,
table th span {
  background: none !important;
  color: #fff !important;
}

/* 6. プロフィールアイコン頭頂部を見せるトリミング */
.profile-bottom .head .avatar img {
  object-position: 50% 0% !important;
}

/* 7. プロフィール内は装飾なし */
.profile-bottom strong,
.profile-bottom .red-num,
.profile-bottom span[style*="color"],
.profile-bottom span[style*="background"],
.profile-bottom .bio strong,
.profile-bottom u {
  color: inherit !important;
  background: none !important;
  font-weight: normal !important;
  text-decoration: none !important;
  border-bottom: none !important;
}

/* 5. summary-box は使わなくなったがレガシー対応で透明化 */
.summary-box {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
}

/* ========== v6 最終: チェックマーク確実中央寄せ ========== */
.conclusion-box p.item::before {
  content: "✓" !important;
  position: absolute !important;
  left: 0 !important;
  top: 6px !important;
  display: block !important;
  width: 24px !important;
  height: 24px !important;
  line-height: 24px !important;
  text-align: center !important;
  background: #2e8b57 !important;
  color: #fff !important;
  border-radius: 50% !important;
  font-size: 14px !important;
  font-weight: bold !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  font-family: -apple-system, "Hiragino Sans", sans-serif !important;
  vertical-align: middle !important;
}

/* ========== v6: プロフィールアイコン頭頂部を確実に ========== */
.profile-bottom .head .avatar {
  width: 80px !important;
  height: 80px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  border: 3px solid #a5d6a7;
  background: #fff;
  flex-shrink: 0;
}
.profile-bottom .head .avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: 50% 5% !important;
  display: block !important;
}

/* ========== v6: プロフィール内文字色も統一（CSS強制） ========== */
.profile-bottom p,
.profile-bottom .bio,
.profile-bottom .tags {
  color: #333 !important;
}
.profile-bottom strong,
.profile-bottom span,
.profile-bottom .red-num,
.profile-bottom u {
  color: #333 !important;
  background: none !important;
  font-weight: normal !important;
  text-decoration: none !important;
  border-bottom: none !important;
}

/* ========== プロフィール レイアウト整え v7 ========== */
.profile-bottom {
  background: #f1f8e9 !important;
  border: 2px solid #a5d6a7 !important;
  border-radius: 12px !important;
  padding: 28px 32px !important;
  margin: 56px 0 16px !important;
  display: block !important;
  box-shadow: 0 2px 8px rgba(46,139,87,0.06);
}
.profile-bottom .head {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  margin: 0 0 18px !important;
  padding-bottom: 16px !important;
  border-bottom: 1px dashed #a5d6a7 !important;
}
.profile-bottom .head > div:not(.avatar) {
  flex: 1 !important;
  min-width: 0 !important;
}
.profile-bottom .name {
  margin: 0 0 6px !important;
  font-weight: bold !important;
  color: #1b5e20 !important;
  font-size: 1.25em !important;
  line-height: 1.3 !important;
}
.profile-bottom .role {
  margin: 0 !important;
  font-size: 0.88em !important;
  color: #666 !important;
  line-height: 1.3 !important;
}
.profile-bottom > p {
  margin: 0 0 14px !important;
  font-size: 0.95em !important;
  line-height: 1.95 !important;
  color: #333 !important;
}
.profile-bottom .tags {
  margin: 18px 0 0 !important;
  padding-top: 14px !important;
  border-top: 1px dashed #a5d6a7 !important;
  font-size: 0.85em !important;
  color: #555 !important;
  text-align: center !important;
  line-height: 1.6 !important;
}
@media (max-width: 480px) {
  .profile-bottom {
    padding: 20px !important;
    margin: 40px 0 16px !important;
  }
  .profile-bottom .head { gap: 14px !important; }
  .profile-bottom .head .avatar {
    width: 64px !important;
    height: 64px !important;
  }
  .profile-bottom .name { font-size: 1.1em !important; }
  .profile-bottom .tags {
    font-size: 0.78em !important;
    text-align: left !important;
  }
}

/* ========== v8: 本文の色情報を控えめに（見やすさ優先） ========== */

/* 黄色マーカーを「下線」に変更 - 目に優しく強調感は残す */
.entry-content strong[style*="background:linear-gradient"],
.entry-content strong[style*="#fff59d"],
.article strong[style*="background:linear-gradient"],
.article strong[style*="#fff59d"] {
  background: none !important;
  color: #1e3a2e !important;
  font-weight: bold !important;
  border-bottom: 2px solid #ffc107 !important;
  padding-bottom: 1px !important;
}

/* 赤字数字を少し落ち着いた赤に・サイズも他テキストに揃える */
.entry-content .red-num,
.article .red-num,
.entry-content strong[style*="color:#d32f2f"],
.article strong[style*="color:#d32f2f"] {
  color: #c62828 !important;
}

/* ✅ 絵文字に少し余裕を持たせて読みやすく */
.entry-content p,
.article p {
  margin-bottom: 14px !important;
  margin-top: 14px !important;
}

/* 結論ボックスとプロフィールは個別CSSで上書き済みなので除外 */
.conclusion-box strong,
.profile-bottom strong {
  background: none !important;
  border-bottom: none !important;
  padding-bottom: 0 !important;
}
.conclusion-box .red-num,
.profile-bottom .red-num {
  color: inherit !important;
}

/* ========== v9: 下線削除＋段落間隔広く ========== */

/* 黄色下線を完全に削除 → 純粋な太字だけに */
.entry-content strong[style*="background:linear-gradient"],
.entry-content strong[style*="#fff59d"],
.article strong[style*="background:linear-gradient"],
.article strong[style*="#fff59d"] {
  background: none !important;
  color: #1e3a2e !important;
  font-weight: bold !important;
  border-bottom: none !important;
  padding-bottom: 0 !important;
  text-decoration: none !important;
}

/* 本文の段落間隔を広く（読みやすさUP） */
.entry-content > p,
.article > p,
.entry-content .post-content > p {
  margin-top: 22px !important;
  margin-bottom: 22px !important;
  line-height: 2.0 !important;
}

/* ボックス内（結論・プロフィール・honne）は除外 */
.conclusion-box p,
.profile-bottom p,
.honne p,
.bubble-rabbit p,
.bubble-pui p {
  margin-top: inherit;
  margin-bottom: inherit;
}

/* ========== v10: 表のレイアウト調整・改行制御 ========== */
.table-wrap {
  overflow-x: auto !important;
  margin: 24px 0 !important;
}
.table-wrap table {
  width: 100% !important;
  table-layout: auto !important;
  min-width: 600px;
  border-collapse: collapse !important;
}
.table-wrap td,
.table-wrap th {
  padding: 14px 16px !important;
  word-break: keep-all !important;
  overflow-wrap: break-word !important;
  vertical-align: middle !important;
  line-height: 1.6 !important;
}
/* 「年0.162%」のような数値+単位は改行禁止 */
.table-wrap td .nowrap,
.table-wrap th .nowrap {
  white-space: nowrap !important;
  display: inline-block;
}
/* スマホ：横スクロール可能に */
@media (max-width: 600px) {
  .table-wrap table { min-width: 480px; }
  .table-wrap td, .table-wrap th { padding: 10px 12px !important; font-size: 0.9em !important; }
}

/* ========== v11: 表は固定幅・横スクロールなし・改行制御 ========== */
.table-wrap {
  overflow-x: visible !important;
  margin: 28px 0 !important;
}
.table-wrap table {
  width: 100% !important;
  table-layout: auto !important;
  min-width: auto !important;
  border-collapse: collapse !important;
}
.table-wrap td,
.table-wrap th {
  padding: 12px 14px !important;
  word-break: keep-all !important;
  overflow-wrap: break-word !important;
  vertical-align: middle !important;
  line-height: 1.7 !important;
  font-size: 0.92em !important;
}
/* 数値が入る短いセル（信託報酬・年間上限・累計元本・評価額・損益など）は改行禁止 */
.table-wrap td:not(:first-child),
.table-wrap th:not(:first-child) {
  white-space: nowrap !important;
}
/* 1列目（商品名・枠の名前など長め）は通常折り返し */
.table-wrap td:first-child,
.table-wrap th:first-child {
  white-space: normal !important;
  word-break: break-all !important;
}
/* 最終列（ひとこと・コメント）は折り返しOK */
.table-wrap td:last-child,
.table-wrap th:last-child {
  white-space: normal !important;
  word-break: keep-all !important;
}

/* スマホ：フォント小さく＋横スクロール */
@media (max-width: 600px) {
  .table-wrap { overflow-x: auto !important; }
  .table-wrap td, .table-wrap th { padding: 9px 10px !important; font-size: 0.85em !important; }
}


/* ========== v14: 視覚要素（数値カード・設定ボックス・用語解説） ========== */
.stat-cards {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 14px !important;
  margin: 28px 0 !important;
}
.stat-card {
  background: #f1f8e9 !important;
  border: 2px solid #a5d6a7 !important;
  border-radius: 10px !important;
  padding: 18px 12px !important;
  text-align: center !important;
}
.stat-card.highlight {
  background: linear-gradient(135deg, #fff3e0 0%, #ffe0b2 100%) !important;
  border-color: #ef6c00 !important;
}
.stat-card .stat-label {
  font-size: 0.85em;
  color: #666;
  margin: 0 0 8px !important;
  font-weight: bold;
}
.stat-card .stat-value {
  font-size: 1.5em !important;
  font-weight: bold !important;
  color: #2e7d32 !important;
  margin: 0 !important;
  line-height: 1.2;
}
.stat-card.highlight .stat-value { color: #ef6c00 !important; }
.stat-card .stat-note {
  font-size: 0.78em;
  color: #888;
  margin: 6px 0 0 !important;
}
@media (max-width: 600px) {
  .stat-cards { grid-template-columns: 1fr !important; }
}

/* 設定ボックス */
.settings-box {
  background: #fafafa !important;
  border-left: 4px solid #2e8b57 !important;
  padding: 16px 20px !important;
  margin: 24px 0 !important;
  border-radius: 6px !important;
}
.settings-box .title {
  margin: 0 0 12px !important;
  font-weight: bold !important;
  color: #1b5e20 !important;
  font-size: 0.95em !important;
}
.settings-box .row {
  display: flex !important;
  padding: 6px 0 !important;
  border-bottom: 1px dotted #e0e0e0 !important;
  font-size: 0.92em !important;
  line-height: 1.6 !important;
}
.settings-box .row:last-child { border-bottom: none !important; }
.settings-box .row .label {
  flex-shrink: 0;
  width: 110px;
  font-weight: bold;
  color: #2e7d32;
}
.settings-box .row .value {
  flex: 1;
}

/* 用語解説ボックス */
.term-box {
  background: #e8f4fd !important;
  border: 1px solid #90caf9 !important;
  border-left: 4px solid #1976d2 !important;
  border-radius: 8px !important;
  padding: 14px 18px !important;
  margin: 20px 0 !important;
}
.term-box .title {
  margin: 0 0 8px !important;
  font-weight: bold !important;
  color: #0d47a1 !important;
  font-size: 0.95em !important;
}
.term-box p {
  margin: 6px 0 !important;
  font-size: 0.92em !important;
  line-height: 1.8 !important;
}

/* ========== v15: 設定ボックス・数値カード 折り返し改善 ========== */

/* settings-box: ラベル幅を可変にして変な改行を防ぐ */
.settings-box .row {
  display: flex !important;
  flex-wrap: wrap !important;
  padding: 8px 0 !important;
  border-bottom: 1px dotted #e0e0e0 !important;
  font-size: 0.92em !important;
  line-height: 1.7 !important;
  gap: 4px 16px !important;
  align-items: baseline;
}
.settings-box .row .label {
  flex: 0 0 auto !important;
  min-width: 120px !important;
  max-width: 240px !important;
  font-weight: bold !important;
  color: #2e7d32 !important;
  white-space: normal !important;
  word-break: keep-all !important;
}
.settings-box .row .value {
  flex: 1 1 200px !important;
  word-break: keep-all !important;
}
@media (max-width: 600px) {
  .settings-box .row {
    flex-direction: column !important;
    gap: 2px !important;
    padding: 10px 0 !important;
  }
  .settings-box .row .label,
  .settings-box .row .value {
    max-width: 100% !important;
    min-width: 0 !important;
  }
  .settings-box .row .label { font-size: 0.92em; }
}

/* stat-card: ラベル・値の改行制御 */
.stat-card .stat-label {
  font-size: 0.82em !important;
  color: #666 !important;
  margin: 0 0 10px !important;
  font-weight: bold !important;
  line-height: 1.4 !important;
  word-break: keep-all !important;
  min-height: 2.5em;
  display: flex;
  align-items: center;
  justify-content: center;
}
.stat-card .stat-value {
  font-size: 1.4em !important;
  font-weight: bold !important;
  color: #2e7d32 !important;
  margin: 0 !important;
  line-height: 1.25 !important;
  word-break: keep-all !important;
}
.stat-card.highlight .stat-value { color: #ef6c00 !important; }
.stat-card .stat-note {
  font-size: 0.76em !important;
  color: #888 !important;
  margin: 8px 0 0 !important;
  line-height: 1.4 !important;
  word-break: keep-all !important;
}
@media (max-width: 600px) {
  .stat-card .stat-label { min-height: auto; font-size: 0.85em !important; }
  .stat-card .stat-value { font-size: 1.3em !important; }
}

/* ========== v16: 設定ボックス ラベル幅をさらに拡大 ========== */
.settings-box .row .label {
  flex: 0 0 auto !important;
  min-width: 180px !important;
  max-width: none !important;
  white-space: nowrap !important;
}
@media (max-width: 600px) {
  .settings-box .row .label {
    white-space: normal !important;
    min-width: 0 !important;
  }
}

/* ========== v17: サイドバー強制表示（前回非表示CSS残存対策） ========== */
body.single .sidebar,
body.single #sidebar,
body.single .sidebar-wrap,
body.single .sidebar-scroll,
body.single .sidebar-menu-button {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}
body.single #sidebar { width: 300px !important; }

/* ========== v18: サイドバー完全強制表示（最後の砦） ========== */
#sidebar,
.sidebar,
.sidebar-wrap,
#sidebar-scroll,
.sidebar-scroll {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: static !important;
  transform: none !important;
  left: auto !important;
  right: auto !important;
}
#sidebar { width: 300px !important; float: right !important; }
@media (max-width: 1023px) {
  #sidebar { width: 100% !important; float: none !important; }
}

/* ========== v19: 判断チェックリスト（YES/NO両方表示） ========== */
.check-list { margin: 28px 0 !important; }
.check-item {
  background: #fafafa !important;
  border: 1px solid #e0e0e0 !important;
  border-left: 5px solid #2e8b57 !important;
  padding: 16px 20px !important;
  margin: 0 0 14px !important;
  border-radius: 8px !important;
  display: block !important;
}
.check-item .q {
  font-weight: bold !important;
  color: #1b5e20 !important;
  margin: 0 0 12px !important;
  font-size: 1.0em !important;
  line-height: 1.5 !important;
}
.check-item .yes {
  background: #e8f5e9 !important;
  border-left: 3px solid #2e8b57 !important;
  padding: 8px 12px !important;
  margin: 6px 0 !important;
  border-radius: 4px !important;
  color: #1b5e20 !important;
  font-size: 0.93em !important;
  line-height: 1.6 !important;
}
.check-item .no {
  background: #ffebee !important;
  border-left: 3px solid #c62828 !important;
  padding: 8px 12px !important;
  margin: 6px 0 !important;
  border-radius: 4px !important;
  color: #b71c1c !important;
  font-size: 0.93em !important;
  line-height: 1.6 !important;
}

/* ========== v20: チェックリストYES/NO先頭にバッジ装飾 ========== */
.check-item .yes::before {
  content: 'YES';
  display: inline-block;
  background: #2e8b57;
  color: #fff !important;
  font-weight: bold;
  padding: 2px 8px;
  border-radius: 3px;
  font-size: 0.85em;
  margin-right: 8px;
  vertical-align: middle;
}
.check-item .no::before {
  content: 'NO';
  display: inline-block;
  background: #c62828;
  color: #fff !important;
  font-weight: bold;
  padding: 2px 8px;
  border-radius: 3px;
  font-size: 0.85em;
  margin-right: 8px;
  vertical-align: middle;
}

/* ========== v21: プロフィール枠 統一感UP（最終版） ========== */
.profile-bottom {
  background: #f1f8e9 !important;
  border: 2px solid #a5d6a7 !important;
  border-radius: 12px !important;
  padding: 28px 32px !important;
  margin: 56px 0 16px !important;
  display: block !important;
  box-shadow: 0 2px 8px rgba(46,139,87,0.08) !important;
}
.profile-bottom .head {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  margin: 0 0 20px !important;
  padding-bottom: 18px !important;
  border-bottom: 1px solid #c5e1a5 !important;
  background: none !important;
}
.profile-bottom .head > div:not(.avatar) {
  flex: 1 !important;
}
.profile-bottom .head .avatar {
  width: 80px !important;
  height: 80px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  border: 3px solid #a5d6a7 !important;
  background: #fff !important;
  flex-shrink: 0 !important;
  padding: 0 !important;
}
.profile-bottom .head .avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: 50% 0% !important;
  display: block !important;
  border-radius: 0 !important;
  margin: 0 !important;
}
.profile-bottom .name {
  margin: 0 0 6px !important;
  font-weight: bold !important;
  color: #1b5e20 !important;
  font-size: 1.25em !important;
  line-height: 1.3 !important;
  background: none !important;
  padding: 0 !important;
  border: none !important;
}
.profile-bottom .role {
  margin: 0 !important;
  font-size: 0.88em !important;
  color: #5d4037 !important;
  line-height: 1.3 !important;
  background: none !important;
  padding: 0 !important;
  border: none !important;
}
.profile-bottom > p {
  margin: 0 0 14px !important;
  font-size: 0.95em !important;
  line-height: 1.95 !important;
  color: #333 !important;
  background: none !important;
}
.profile-bottom > p strong,
.profile-bottom > p span,
.profile-bottom > p .red-num {
  color: #333 !important;
  background: none !important;
  font-weight: normal !important;
  text-decoration: none !important;
}
.profile-bottom .tags {
  margin: 18px 0 0 !important;
  padding-top: 14px !important;
  border-top: 1px solid #c5e1a5 !important;
  font-size: 0.85em !important;
  color: #5d4037 !important;
  text-align: center !important;
  line-height: 1.6 !important;
  background: none !important;
}
@media (max-width: 600px) {
  .profile-bottom { padding: 20px !important; }
  .profile-bottom .head .avatar { width: 64px !important; height: 64px !important; }
  .profile-bottom .name { font-size: 1.1em !important; }
}

/* ========== v22: プロフィール .head 背景強制透明（Cocoon衝突対策） ========== */
.profile-bottom .head,
.profile-bottom .head > div,
.profile-bottom .head .name,
.profile-bottom .head .role,
.profile-bottom .head * {
  background: transparent !important;
  background-color: transparent !important;
}
.profile-bottom .head .avatar {
  background: #fff !important;
}

/* ========== v23: プロフィール class名 .head → .prof-head（Cocoon衝突回避） ========== */
.profile-bottom .prof-head {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  margin: 0 0 20px !important;
  padding-bottom: 18px !important;
  border-bottom: 1px solid #c5e1a5 !important;
  background: transparent !important;
}
.profile-bottom .prof-head > div:not(.avatar) {
  flex: 1 !important;
  background: transparent !important;
}
.profile-bottom .prof-head .avatar {
  width: 80px !important;
  height: 80px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  border: 3px solid #a5d6a7 !important;
  background: #fff !important;
  flex-shrink: 0 !important;
}
.profile-bottom .prof-head .avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: 50% 0% !important;
  display: block !important;
}
@media (max-width: 600px) {
  .profile-bottom .prof-head .avatar { width: 64px !important; height: 64px !important; }
}