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

/************************************************************
** なんでも比較.com スタイル（2026-10-09 デジタル庁デザインシステム準拠へ改訂）
** 旧版はサーバー old/style_20261009-1.css
**
** 色・角丸の値はデジタル庁デザインシステムの公式トークン
**   https://github.com/digital-go-jp/tailwind-theme-plugin （examples-v4/src/tailwind-theme-plugin/v4.css）
** リンク・ボタン・表・見出し・カード・フォーカスの表現は公式コードスニペット（HTML版）に合わせる
**   https://github.com/digital-go-jp/design-system-example-components-html
**
** サイト固有の決め（ローカルデザインシステム）
**   キーカラー=青（Blue） / 角丸=8px（カード・ボタン・入力欄） / 余白=8・16・24・40・64px
**   本文16px（記事本文はデスクトップ17px）・行高1.7 / ブレークポイント=768px
************************************************************/

/* ===== 0. トークン ===== */
:root {
    --color-neutral-white: #ffffff;
    --color-neutral-black: #000000;
    --color-neutral-solid-gray-50: #f2f2f2;
    --color-neutral-solid-gray-100: #e6e6e6;
    --color-neutral-solid-gray-200: #cccccc;
    --color-neutral-solid-gray-420: #949494;
    --color-neutral-solid-gray-500: #7f7f7f;
    --color-neutral-solid-gray-536: #767676;
    --color-neutral-solid-gray-600: #666666;
    --color-neutral-solid-gray-700: #4d4d4d;
    --color-neutral-solid-gray-800: #333333;
    --color-neutral-solid-gray-900: #1a1a1a;

    --color-primitive-blue-50: #e8f1fe;
    --color-primitive-blue-100: #d9e6ff;
    --color-primitive-blue-200: #c5d7fb;
    --color-primitive-blue-300: #9db7f9;
    --color-primitive-blue-900: #0017c1;
    --color-primitive-blue-1000: #00118f;
    --color-primitive-blue-1200: #000060;
    --color-primitive-yellow-300: #ffd43d;
    --color-primitive-magenta-900: #8b008b;
    --color-primitive-orange-800: #c74700;
    --color-primitive-red-900: #ce0000;

    /* キーカラー（青） */
    --color-key-50: var(--color-primitive-blue-50);
    --color-key-100: var(--color-primitive-blue-100);
    --color-key-200: var(--color-primitive-blue-200);
    --color-key-300: var(--color-primitive-blue-300);
    --color-key-900: var(--color-primitive-blue-900);
    --color-key-1000: var(--color-primitive-blue-1000);
    --color-key-1200: var(--color-primitive-blue-1200);

    --font-family-sans: "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    --font-family-mono: "Noto Sans Mono", monospace;

    --nandemo-radius: 8px;
    --nandemo-focus-outline: 4px solid var(--color-neutral-black);
    --nandemo-focus-ring: 0 0 0 2px var(--color-primitive-yellow-300);

    /* Cocoon の変数を同じ値へ寄せる */
    --cocoon-default-font: var(--font-family-sans);
    --cocoon-text-color: var(--color-neutral-solid-gray-800);
    --cocoon-pallid-text-color: var(--color-neutral-solid-gray-536);
    --cocoon-x-pallid-text-color: var(--color-neutral-solid-gray-536);
    --cocoon-basic-border-color: var(--color-neutral-solid-gray-420);
    --cocoon-thin-color: var(--color-neutral-solid-gray-420);
    --cocoon-x-thin-color: var(--color-neutral-solid-gray-100);
    --cocoon-xx-thin-color: var(--color-neutral-solid-gray-50);
    --cocoon-xxx-thin-color: var(--color-neutral-solid-gray-50);
    --cocoon-current-background-color: var(--color-key-50);
    --cocoon-basic-border-radius: var(--nandemo-radius);
    --cocoon-badge-border-radius: 4px;
}

/* ===== 1. 全体 ===== */
body,
body.public-page {
    background-color: var(--color-neutral-white);
    color: var(--color-neutral-solid-gray-800);
    font-family: var(--font-family-sans);
    letter-spacing: 0.02em;
}
.body.fz-18px,
.body.fz-16px {
    font-size: 16px;
    line-height: 1.7;
}
pre, code, kbd, samp { font-family: var(--font-family-mono); }

/* リンク（下線＋青・訪問済み＝マゼンタ・押下中＝オレンジ） */
a {
    color: var(--color-key-1000);
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
.entry-content a:visited,
.nandemo-related-cluster a:visited,
.nandemo-author-box a:visited,
.nandemo-section a:not([class]):visited { color: var(--color-primitive-magenta-900); }
@media (hover: hover) {
    a:hover {
        color: var(--color-key-900);
        text-decoration-thickness: 3px;
    }
}
a:active { color: var(--color-primitive-orange-800); }

/* フォーカスインジケーター（黒＋黄の二重。変更しない） */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
label:focus-visible,
[tabindex]:focus-visible {
    outline: var(--nandemo-focus-outline) !important;
    outline-offset: 2px;
    border-radius: 4px;
    box-shadow: var(--nandemo-focus-ring) !important;
}
a:focus-visible { background-color: var(--color-primitive-yellow-300); }
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: var(--nandemo-focus-outline) !important;
    outline-offset: 2px;
    box-shadow: var(--nandemo-focus-ring) !important;
}

/* ===== 2. レイアウト ===== */
.main,
.sidebar {
    border: 0;
    border-radius: 0;
    background-color: var(--color-neutral-white);
}
.main { padding: 24px 24px 40px; }
.sidebar { padding: 24px 16px; }
.content { margin-top: 0; }

/* トップ・カテゴリ・シーン・デスクはサイドバーなしの全幅（最大1160px） */
body.home #main, body.home .main,
body.category #main, body.category .main,
body.tax-scene #main, body.tax-scene .main,
body.tax-desk #main, body.tax-desk .main {
    float: none !important;
    width: 100% !important;
    max-width: 1160px;
    margin-left: auto !important;
    margin-right: auto !important;
}
body.home #sidebar, body.home .sidebar,
body.category #sidebar, body.category .sidebar,
body.tax-scene #sidebar, body.tax-scene .sidebar,
body.tax-desk #sidebar, body.tax-desk .sidebar { display: none !important; }
body.home .content, body.category .content,
body.tax-scene .content, body.tax-desk .content { width: 100% !important; max-width: 100% !important; }

/* ===== 3. ヘッダー・水平メニュー ===== */
.header-container,
.header { background-color: var(--color-neutral-white); }
.header .header-in { min-height: 0; padding: 16px 0 8px; }
.tagline {
    margin: 0 16px 4px;
    color: var(--color-neutral-solid-gray-700);
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0.02em;
}
.site-name-text-link,
.site-name-text-link:visited {
    color: var(--color-neutral-solid-gray-900);
    font-weight: 700;
    text-decoration: none;
}
.site-name-text { font-size: 28px; line-height: 1.4; letter-spacing: 0.01em; }

.navi {
    background-color: var(--color-neutral-white);
    border-top: 1px solid var(--color-neutral-solid-gray-420);
    border-bottom: 1px solid var(--color-neutral-solid-gray-420);
}
.navi-in > ul li { width: auto; height: auto; }
.navi-in > ul > li > a {
    min-height: 56px;
    padding: 16px 20px;
    box-sizing: border-box;
    align-items: center;
    color: var(--color-neutral-solid-gray-900);
    font-weight: 700;
    font-size: 16px;
    line-height: 1.3;
    letter-spacing: 0;
    transition: none;
}
.navi-in a:hover { background-color: var(--color-neutral-solid-gray-50); color: var(--color-neutral-solid-gray-900); }
.navi-in > ul > li > a:hover::after {
    position: absolute; right: 0; bottom: 0; left: 0;
    border-bottom: 2px solid var(--color-neutral-black);
    content: "";
}
.navi-in > ul > li.current-menu-item > a,
.navi-in > ul > li.current-menu-ancestor > a { color: var(--color-key-1000); }
.navi-in > ul > li.current-menu-item > a::after,
.navi-in > ul > li.current-menu-ancestor > a::after {
    position: absolute; right: 0; bottom: 0; left: 0;
    border-bottom: 4px solid var(--color-key-900);
    content: "";
}
.navi-in > ul .sub-menu { border: 1px solid var(--color-neutral-solid-gray-420); background-color: var(--color-neutral-white); }

/* モバイルのヘッダーボタン（Cocoon のハンバーガーメニュー） */
.mobile-header-menu-buttons {
    background-color: var(--color-neutral-white);
    border-bottom: 1px solid var(--color-neutral-solid-gray-420);
    box-shadow: none;
}
.mobile-menu-buttons .menu-button { min-width: 56px; min-height: 56px; }
.mobile-menu-buttons .menu-button > a,
.mobile-menu-buttons .menu-button-in { color: var(--color-neutral-solid-gray-900); }
.mobile-menu-buttons .menu-caption { font-size: 14px; opacity: 1; line-height: 1.3; }
.navi-menu-content,
.sidebar-menu-content,
.search-menu-content { background-color: var(--color-neutral-white); }
.menu-drawer a,
.navi-menu-content a { color: var(--color-neutral-solid-gray-900); font-size: 16px; }
.menu-drawer { margin: 0; padding: 0; }
.menu-drawer li { margin: 0; padding: 0; border-bottom: 1px solid var(--color-neutral-solid-gray-420); }
.menu-drawer a {
    display: flex;
    align-items: center;
    min-height: 48px;
    padding: 8px 16px;
    box-sizing: border-box;
    font-weight: 700;
    text-decoration: none;
}
.menu-close-button { display: flex; align-items: center; justify-content: center; min-width: 48px; min-height: 48px; color: var(--color-neutral-solid-gray-900); }

/* ===== 4. パンくず ===== */
.breadcrumb {
    margin: 16px 0;
    color: var(--color-neutral-solid-gray-800);
    font-size: 16px;
    line-height: 1.7;
    letter-spacing: 0.02em;
}
.breadcrumb a,
.breadcrumb a:visited {
    color: var(--color-key-1000);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
.breadcrumb .fa-home,
.breadcrumb .fa-folder,
.breadcrumb .fa-file-o { display: none; }
.breadcrumb .sp { margin: 0 6px; color: var(--color-neutral-solid-gray-900); }

/* ===== 5. 見出し（ページ見出し・セクション見出し） ===== */
.entry-title,
.archive-title {
    margin: 8px 0 16px;
    color: var(--color-neutral-solid-gray-900);
    font-size: 32px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.01em;
}
.date-tags {
    margin: 0 0 16px;
    color: var(--color-neutral-solid-gray-700);
    font-size: 14px;
    line-height: 1.5;
    text-align: left;
}
.date-tags .fa { display: none; }
.date-tags .post-date,
.date-tags .post-update,
.date-tags time { font-size: 14px; }
.date-tags .post-date::before { content: "公開日 "; }
.date-tags .post-update::before { content: "更新日 "; }
.date-tags .post-update { margin-left: 16px; }

/* ===== 6. 記事本文 ===== */
.article .entry-content {
    margin: 24px 0 40px;
    color: var(--color-neutral-solid-gray-800);
    line-height: 1.7;
    overflow-wrap: anywhere;
}
.article .entry-content p { margin: 0 0 1.5em; }
.article .entry-content strong { color: var(--color-neutral-solid-gray-900); }

.article .entry-content h2 {
    margin: 64px 0 24px;
    padding: 0 0 8px;
    border: 0;
    border-bottom: 2px solid var(--color-key-900);
    border-radius: 0;
    background: none;
    color: var(--color-neutral-solid-gray-900);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.02em;
}
.article .entry-content h3 {
    position: relative;
    margin: 40px 0 16px;
    padding: 0 0 0 calc(1em / 3 + 0.5em);
    border: 0;
    border-radius: 0;
    background: none;
    color: var(--color-neutral-solid-gray-900);
    font-size: 20px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.02em;
}
.article .entry-content h3::before {
    position: absolute;
    top: 0.2em;
    bottom: 0.1em;
    left: 0;
    width: calc(1em / 3);
    background-color: var(--color-key-900);
    content: "";
}
/* ランキングの商品見出しは帯で目立たせる */
.article .entry-content h3.ranking-item {
    margin-top: 48px;
    padding: 12px 16px 12px calc(16px + 1em / 3 + 0.5em);
    border-radius: var(--nandemo-radius);
    background-color: var(--color-key-50);
}
.article .entry-content h3.ranking-item::before { top: 12px; bottom: 12px; left: 16px; }
.article .entry-content h4,
.article .entry-content h5,
.article .entry-content h6 {
    margin: 32px 0 12px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--color-neutral-solid-gray-900);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.6;
}
@media (forced-colors: active) {
    .article .entry-content h3::before { background-color: CanvasText; }
}

/* 箇条書き */
.article .entry-content ul,
.article .entry-content ol { margin: 0 0 1.5em; padding-left: 1.5em; }
.article .entry-content ul { list-style-type: disc; }
.article .entry-content ul ul { list-style-type: circle; margin-bottom: 0; }
.article .entry-content li { margin: 0.25em 0; }
.article .entry-content blockquote {
    margin: 0 0 1.5em;
    padding: 8px 0 8px 16px;
    border: 0;
    border-left: 4px solid var(--color-neutral-solid-gray-420);
    background: none;
    color: var(--color-neutral-solid-gray-800);
}
.article .entry-content blockquote::before,
.article .entry-content blockquote::after { display: none; }
.article .entry-content dl dt { font-weight: 700; color: var(--color-neutral-solid-gray-900); margin-top: 16px; }
.article .entry-content dl dd { margin: 4px 0 0; }
.article .entry-content img { max-width: 100%; height: auto; }
.eye-catch { margin-bottom: 16px; }
.eye-catch img { border-radius: var(--nandemo-radius); }

/* アイキャッチ上のカテゴリ表示 */
.eye-catch .cat-label,
.cat-label {
    border: 1px solid var(--color-neutral-solid-gray-700);
    border-radius: 4px;
    background-color: var(--color-neutral-white);
    color: var(--color-neutral-solid-gray-800);
    font-size: 14px;
    line-height: 1.3;
    padding: 3px 7px;
    opacity: 1;
}

/* 目次 */
.toc {
    display: block;
    width: auto;
    margin: 24px 0 40px;
    padding: 12px 24px 24px 20px;
    border: 1px solid var(--color-neutral-solid-gray-420);
    border-radius: var(--nandemo-radius);
    color: var(--color-neutral-solid-gray-800);
    font-size: 16px;
    line-height: 1.7;
}
.toc-title {
    display: block;
    margin: 0 0 8px;
    padding: 0;
    color: var(--color-neutral-solid-gray-900);
    font-size: 16px;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
}
.toc-title::after { font-size: 14px; font-weight: 400; }
.toc .toc-list { padding-left: 1.5em; }
.toc .toc-list ol,
.toc .toc-list ul { padding-left: 1.5em; }
/* 番号なしの目次（見出し側に番号がある固定ページと揃える）: 第1階層は太字・印なし、第2階層以下は黒丸 */
.toc.tnt-none .toc-list { padding-left: 0; list-style: none; }
.toc.tnt-none .toc-list > li { font-weight: 700; }
.toc.tnt-none .toc-list ul,
.toc.tnt-none .toc-list ol { padding-left: 1.5em; list-style: disc; font-weight: 400; }
.toc.tnt-none .toc-list ul ul,
.toc.tnt-none .toc-list ol ol { list-style: circle; }
.toc a,
.toc a:visited {
    color: var(--color-key-1000);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

/* 表（比較表を含む） */
.article .entry-content table,
.hikaku-table {
    width: 100%;
    margin: 24px 0 40px;
    border-collapse: collapse;
    color: var(--color-neutral-solid-gray-800);
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0.02em;
}
.article .entry-content th,
.article .entry-content td,
.hikaku-table th,
.hikaku-table td {
    padding: 12px 16px;
    border: 1px solid var(--color-neutral-solid-gray-500);
    background-color: var(--color-neutral-white);
    color: var(--color-neutral-solid-gray-800);
    text-align: left;
    vertical-align: top;
}
.article .entry-content thead th,
.hikaku-table thead th,
.hikaku-table th {
    background-color: var(--color-neutral-solid-gray-100);
    color: var(--color-neutral-solid-gray-900);
    font-weight: 700;
}
.article .entry-content thead tr:last-child th,
.hikaku-table thead tr:last-child th { border-bottom: 1px solid var(--color-neutral-black); }
.hikaku-table thead { background: none; color: inherit; }
.hikaku-table tbody tr:nth-child(even) td { background-color: var(--color-neutral-solid-gray-50); }
.hikaku-table tr:hover td { background-color: inherit; }
.hikaku-table tbody tr:nth-child(even):hover td { background-color: var(--color-neutral-solid-gray-50); }
/* 横に収まらない表は表の中で横スクロール（右端の影でスクロールできることを示す） */
.nandemo-table-scroll { position: relative; margin: 24px 0 40px; }
.nandemo-table-scroll > .nandemo-table-scroll-in { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.nandemo-table-scroll table,
.nandemo-table-scroll .hikaku-table { margin: 0; }
.nandemo-table-scroll.is-overflow::after {
    position: absolute; top: 0; right: 0; bottom: 0;
    width: 24px;
    background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.18));
    pointer-events: none;
    content: "";
}
.nandemo-table-scroll.is-end::after { display: none; }
.hikaku-table { display: table; overflow-x: visible; }
/* 列が多い表は1列あたり7文字ぶんを確保し、収まらなければ表の中で横スクロールさせる（文字が1字ずつ折り返すのを防ぐ） */
.nandemo-table-scroll table { min-width: calc(var(--nandemo-cols, 1) * 7em); }
.article .entry-content th,
.article .entry-content td,
.hikaku-table th,
.hikaku-table td { font-size: 16px; }

/* 購入ボタン（{{BUY}}展開ブロック） */
.buy-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 16px 0 24px;
}
.buy-links a,
.buy-links a:visited {
    display: inline-flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-width: 96px;
    min-height: 48px;
    padding: 8px 16px;
    border: 4px double transparent;
    border-radius: var(--nandemo-radius);
    background-color: var(--color-key-900);
    color: var(--color-neutral-white) !important;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.02em;
    text-align: center;
    text-decoration: none;
    transition: none;
}
.buy-links a[href*="amazon"],
.buy-links a[href*="amzn"] { background-color: var(--color-primitive-orange-800); }
.buy-links a[href*="rakuten"] { background-color: #bf0000; }
.buy-links a[href*="yahoo"] { background-color: var(--color-key-900); }
@media (hover: hover) {
    .buy-links a:hover {
        filter: brightness(0.85);
        text-decoration: underline;
        text-decoration-thickness: 1px;
        text-underline-offset: 3px;
    }
}
.buy-links a:focus-visible { background-color: var(--color-key-900); }
.nandemo-price,
.buy-links .nandemo-price {
    display: inline-block;
    flex: 0 0 auto;
    margin: 0 8px 0 0;
    color: var(--color-neutral-solid-gray-900);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;
    vertical-align: middle;
}
/* 表の中の購入ボタンは縦に積む */
.hikaku-table .buy-links,
.article .entry-content td .buy-links {
    flex-direction: column;
    align-items: stretch;
    margin: 0;
    min-width: 160px;
}
.hikaku-table .buy-links a { min-height: 44px; padding: 6px 12px; font-size: 14px; }

/* 広告表記・調査時点 */
.nandemo-pr-label {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    color: var(--color-neutral-solid-gray-800);
    font-size: 14px;
    line-height: 1.7;
}
.nandemo-updated {
    margin: 0 0 24px !important;
    color: var(--color-neutral-solid-gray-700);
    font-size: 14px;
    line-height: 1.7;
}

/* 記事上部のシーン・デスク */
.nandemo-desk-badge {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin: 0 0 16px !important;
    font-size: 14px;
    line-height: 1.5;
}
.nandemo-desk-badge a,
.nandemo-desk-badge a:visited { color: var(--color-key-1000); text-decoration: underline; }

/* 関連記事（同じカテゴリ） */
.nandemo-related-cluster {
    margin: 40px 0 24px;
    padding: 24px;
    border: 1px solid var(--color-neutral-solid-gray-420);
    border-radius: var(--nandemo-radius);
    background-color: var(--color-neutral-white);
}
.article .entry-content .nandemo-related-title,
.nandemo-related-title {
    margin: 0 0 8px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--color-neutral-solid-gray-900);
    font-size: 20px;
    line-height: 1.5;
}
.article .entry-content .nandemo-related-title::before { display: none; }
.nandemo-related-cluster ul { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.nandemo-related-cluster li {
    margin: 0 !important;
    padding: 12px 0;
    border-bottom: 1px solid var(--color-neutral-solid-gray-420);
}
.nandemo-related-cluster li:last-child { border-bottom: 0; padding-bottom: 0; }
.nandemo-related-cluster a {
    color: var(--color-key-1000);
    font-size: 16px;
    text-decoration: underline;
}
.nandemo-pillar-link a,
.nandemo-guide-link a { color: var(--color-key-1000) !important; font-weight: 700; }

/* サービス紹介ブロック */
.nandemo-service-cta {
    margin: 40px 0 24px;
    padding: 24px;
    border: 1px solid var(--color-neutral-solid-gray-420);
    border-radius: var(--nandemo-radius);
}
.article .entry-content .nandemo-service-cta h2 {
    margin: 0 0 8px;
    padding: 0;
    border: 0;
    font-size: 20px;
}
.nandemo-service-cta p { margin: 0 0 8px !important; }
.nandemo-service-cta ul { margin: 0 !important; }

/* 著者ボックス */
.nandemo-author-box {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    margin: 40px 0 24px;
    padding: 24px;
    border: 1px solid var(--color-neutral-solid-gray-420);
    border-radius: var(--nandemo-radius);
    background-color: var(--color-neutral-white);
}
.nandemo-author-body { flex: 1; min-width: 0; }
.nandemo-author-name {
    margin: 0 0 8px !important;
    color: var(--color-neutral-solid-gray-900);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;
}
.nandemo-author-role {
    display: block;
    color: var(--color-neutral-solid-gray-700);
    font-size: 14px;
    font-weight: 400;
}
.nandemo-author-bio {
    margin: 0 0 8px !important;
    color: var(--color-neutral-solid-gray-800);
    font-size: 16px;
    line-height: 1.7;
}
.nandemo-author-links {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 16px;
    margin: 0 !important;
    font-size: 16px;
    line-height: 1.7;
}
.nandemo-author-links a { margin: 0; color: var(--color-key-1000); text-decoration: underline; }

/* 旧記事の本文に直書きされた色（2026-10-09 時点で公開14本）をコントラスト基準に合う色へ置き換える。本文は書き換えない */
.entry-content [style*="color:#888"],
.entry-content [style*="color: #888"],
.entry-content [style*="color:#999"],
.entry-content [style*="color: #999"] { color: var(--color-neutral-solid-gray-600) !important; }
.entry-content [style*="background"][style*="#ff9900"],
.entry-content [style*="background"][style*="#FF9900"],
.entry-content [style*="background"][style*="#d97757"] { background-color: var(--color-primitive-orange-800) !important; color: var(--color-neutral-white) !important; }
.entry-content [style*="background"][style*="#ff0033"],
.entry-content [style*="background"][style*="#FF0033"],
.entry-content [style*="background"][style*="#4285f4"] { background-color: var(--color-key-900) !important; color: var(--color-neutral-white) !important; }
.entry-content [style*="background"][style*="#e74c3c"],
.entry-content [style*="background"][style*="#e63a2e"] { background-color: var(--color-primitive-red-900) !important; color: var(--color-neutral-white) !important; }
.entry-content [style*="background"][style*="#4caf50"],
.entry-content [style*="background"][style*="#10a37f"] { background-color: #197a4b !important; color: var(--color-neutral-white) !important; }

/* ===== 7. 記事下（シェア・関連記事・前後記事） ===== */
.sns-share-message,
.sns-follow-message { color: var(--color-neutral-solid-gray-800); font-size: 14px; }
.sns-buttons a .button-caption,
.sns-share-buttons a .button-caption,
.sns-share.ss-high-and-low-cl a .button-caption.button-caption,
.sns-share.ss-high-and-low-lc a .button-caption.button-caption { font-size: 14px; }
.entry-categories-tags .cat-link,
.entry-categories-tags .tag-link,
.entry-categories-tags .cat-link:visited,
.entry-categories-tags .tag-link:visited {
    display: inline-block;
    padding: 3px 7px;
    border: 1px solid var(--color-neutral-solid-gray-700);
    border-radius: 4px;
    background-color: var(--color-neutral-white);
    color: var(--color-neutral-solid-gray-800);
    font-size: 14px;
    line-height: 1.5;
    text-decoration: underline;
}
.entry-categories-tags .fa { display: none; }
.footer-meta,
.author-info,
.post-author,
.author-name { font-size: 14px; }
.related-entry-heading,
.comment-title {
    margin: 40px 0 16px;
    padding: 0 0 8px;
    border-bottom: 2px solid var(--color-key-900);
    color: var(--color-neutral-solid-gray-900);
    font-size: 24px;
    line-height: 1.5;
}

/* ===== 8. 記事一覧カード（Cocoon のエントリーカード） ===== */
.entry-card-wrap,
.related-entry-card-wrap {
    display: block;
    box-sizing: border-box;
    margin-bottom: 16px;
    padding: 16px;
    border: 1px solid var(--color-neutral-solid-gray-420);
    border-radius: var(--nandemo-radius);
    background-color: var(--color-neutral-white);
    color: var(--color-neutral-solid-gray-800);
    text-decoration: none;
}
@media (hover: hover) {
    .entry-card-wrap:hover,
    .related-entry-card-wrap:hover {
        border-color: var(--color-neutral-black);
        background-color: var(--color-neutral-white);
        box-shadow: none;
    }
    .entry-card-wrap:hover .entry-card-title,
    .related-entry-card-wrap:hover .related-entry-card-title { text-decoration-thickness: 3px; }
}
.entry-card-thumb img,
.related-entry-card-thumb img { border-radius: 4px; }
.entry-card-title,
.related-entry-card-title {
    color: var(--color-key-1000);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
.entry-card-snippet,
.related-entry-card-snippet {
    color: var(--color-neutral-solid-gray-800);
    font-size: 14px;
    line-height: 1.7;
}
.entry-card-meta,
.related-entry-card-meta,
.entry-card-meta .entry-date,
.entry-card-meta .post-date,
.entry-card-meta .post-update,
.related-entry-card-meta .entry-date { color: var(--color-neutral-solid-gray-700); font-size: 14px; }
.entry-card .cat-label,
.related-entry-card .cat-label,
.rect-mini-card .cat-label { font-size: 14px; padding: 2px 6px; }
/* 前後の記事 */
.pager-post-navi a,
.pager-post-navi a:visited {
    border: 1px solid var(--color-neutral-solid-gray-420);
    border-radius: var(--nandemo-radius);
    color: var(--color-key-1000);
    text-decoration: none;
}
.prev-post-title,
.next-post-title { font-size: 16px; line-height: 1.6; text-decoration: underline; text-underline-offset: 3px; }
.entry-card-meta .fa,
.related-entry-card-meta .fa { display: none; }

/* ページ送り */
.pagination { gap: 8px; }
.page-numbers {
    box-sizing: border-box;
    min-width: 48px;
    width: auto;
    height: 48px;
    margin: 0;
    padding: 0 8px;
    border: 1px solid var(--color-neutral-solid-gray-420);
    border-radius: var(--nandemo-radius);
    color: var(--color-key-1000);
    line-height: 46px;
    text-decoration: underline;
}
.pagination .current {
    border-color: var(--color-key-900);
    background-color: var(--color-key-900);
    color: var(--color-neutral-white);
    text-decoration: none;
}
.pagination-next-link {
    border: 1px solid var(--color-neutral-solid-gray-420);
    border-radius: var(--nandemo-radius);
    background-color: var(--color-neutral-white);
    color: var(--color-key-1000);
    font-size: 16px;
    text-decoration: underline;
}

/* ===== 9. サイドバー ===== */
.sidebar h2,
.sidebar h3,
.widget-sidebar-title {
    margin: 24px 0 8px;
    padding: 0 0 8px;
    border-bottom: 2px solid var(--color-key-900);
    border-radius: 0;
    background: none;
    color: var(--color-neutral-solid-gray-900);
    font-size: 18px;
    line-height: 1.5;
}
.sidebar ul { padding-left: 0; list-style: none; }
.sidebar li { padding: 8px 0; border-bottom: 1px solid var(--color-neutral-solid-gray-420); font-size: 16px; line-height: 1.6; }
#sidebar li a,
#sidebar .wp-block-latest-posts a {
    color: var(--color-key-1000);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
#sidebar li a:visited { color: var(--color-primitive-magenta-900); }
@media (hover: hover) {
    #sidebar li a:hover { color: var(--color-key-900); text-decoration-thickness: 3px; }
}
/* サイドバーの検索（WordPress の検索ブロック） */
.wp-block-search__label { margin: 0 0 8px; color: var(--color-neutral-solid-gray-900); font-size: 16px; font-weight: 700; line-height: 1.7; }
.wp-block-search__inside-wrapper { gap: 8px; }
.wp-block-search__input {
    box-sizing: border-box;
    height: 48px;
    padding: 12px 16px;
    border: 1px solid var(--color-neutral-solid-gray-600);
    border-radius: var(--nandemo-radius);
    background-color: var(--color-neutral-white);
    color: var(--color-neutral-solid-gray-900);
    font-size: 16px;
}
@media (hover: hover) {
    .wp-block-search__input:hover { border-color: var(--color-neutral-black); }
}
.wp-block-search__button,
.wp-block-search .wp-block-search__button {
    min-width: 80px;
    min-height: 48px;
    margin-left: 0;
    padding: 8px 16px;
    border: 4px double transparent;
    border-radius: var(--nandemo-radius);
    background-color: var(--color-key-900);
    color: var(--color-neutral-white);
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
}
@media (hover: hover) {
    .wp-block-search__button:hover { background-color: var(--color-key-1000); text-decoration: underline; text-underline-offset: 3px; }
}

/* 検索ボックス（サイドバー・モバイルメニュー・トップ共通） */
.search-box { position: relative; }
.search-edit,
.nandemo-search-input {
    box-sizing: border-box;
    width: 100%;
    height: 48px;
    padding: 12px 16px;
    border: 1px solid var(--color-neutral-solid-gray-600);
    border-radius: var(--nandemo-radius);
    background-color: var(--color-neutral-white);
    color: var(--color-neutral-solid-gray-900);
    font: inherit;
    font-size: 16px;
    line-height: 1;
}
@media (hover: hover) {
    .search-edit:hover,
    .nandemo-search-input:hover { border-color: var(--color-neutral-black); }
}
.search-submit { color: var(--color-neutral-solid-gray-900); min-width: 44px; min-height: 44px; top: calc(50% - 22px); }

/* ===== 10. フッター ===== */
.footer {
    margin-top: 40px;
    padding: 24px 0 16px;
    border-top: 1px solid var(--color-neutral-solid-gray-420);
    background-color: var(--color-neutral-white);
    color: var(--color-neutral-solid-gray-800);
}
.footer-bottom { font-size: 14px; color: var(--color-neutral-solid-gray-800); }
.footer-bottom-logo .site-name-text-link { color: var(--color-neutral-solid-gray-900); }
.navi-footer-in > .menu-footer { display: flex; flex-wrap: wrap; gap: 4px 8px; }
.navi-footer-in > .menu-footer li,
.navi-footer-in > .menu-footer li:last-child,
.navi-footer-in > .menu-footer li.menu-item { width: auto; flex: 0 1 auto; margin: 0; border: 0; }
.navi-footer-in > .menu-footer li.menu-item a { width: auto; padding: 8px 12px; }
.navi-footer-in a,
.navi-footer-in a:visited {
    padding: 8px 12px;
    color: var(--color-neutral-solid-gray-800);
    font-size: 16px;
    line-height: 1.3;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    transition: none;
}
@media (hover: hover) {
    .navi-footer-in a:hover { background: none; color: var(--color-neutral-solid-gray-800); text-decoration-thickness: 3px; }
}
.copyright { color: var(--color-neutral-solid-gray-700); font-size: 14px; }
.nandemo-associates-disclosure {
    padding: 8px 16px !important;
    color: var(--color-neutral-solid-gray-700) !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}
.go-to-top-button {
    width: 48px;
    height: 48px;
    border: 1px solid var(--color-neutral-solid-gray-420);
    border-radius: var(--nandemo-radius);
    background-color: var(--color-neutral-white);
    color: var(--color-neutral-solid-gray-900);
}

/* ===== 11. トップ・一覧ページの部品 ===== */
.nandemo-section { margin: 64px 0 0; }
.nandemo-section:first-child { margin-top: 0; }
.nandemo-section-title {
    margin: 0 0 24px;
    padding: 0 0 8px;
    border: 0;
    border-bottom: 2px solid var(--color-key-900);
    color: var(--color-neutral-solid-gray-900);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.02em;
}
.nandemo-section-count { margin-left: 8px; color: var(--color-neutral-solid-gray-700); font-size: 16px; font-weight: 400; }
.nandemo-section-lead { margin: -8px 0 24px; color: var(--color-neutral-solid-gray-800); font-size: 16px; line-height: 1.7; }

/* トップの導入 */
.nandemo-home-hero {
    margin: 8px 0 0;
    padding: 40px;
    border: 1px solid var(--color-neutral-solid-gray-420);
    border-radius: var(--nandemo-radius);
    background-color: var(--color-key-50);
}
.nandemo-home-hero h1 {
    margin: 0 0 8px;
    color: var(--color-neutral-solid-gray-900);
    font-size: 36px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.01em;
}
.nandemo-home-hero-lead {
    margin: 0 0 24px;
    color: var(--color-neutral-solid-gray-800);
    font-size: 18px;
    line-height: 1.6;
}
.nandemo-search { max-width: 640px; }
.nandemo-search-label {
    display: block;
    margin: 0 0 8px;
    color: var(--color-neutral-solid-gray-900);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.7;
}
.nandemo-search-row { display: flex; gap: 16px; }
.nandemo-search-input { flex: 1 1 auto; min-width: 0; }
.nandemo-button,
.nandemo-search-button {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-width: 96px;
    min-height: 48px;
    padding: 8px 16px;
    border: 4px double transparent;
    border-radius: var(--nandemo-radius);
    background-color: var(--color-key-900);
    color: var(--color-neutral-white);
    font: inherit;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.02em;
    cursor: pointer;
}
@media (hover: hover) {
    .nandemo-button:hover,
    .nandemo-search-button:hover {
        background-color: var(--color-key-1000);
        color: var(--color-neutral-white);
        text-decoration: underline;
        text-decoration-thickness: 1px;
        text-underline-offset: 3px;
    }
}
.nandemo-button:active,
.nandemo-search-button:active { background-color: var(--color-key-1200); }

/* シーンのカード（テキストのみ） */
.nandemo-scene-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.nandemo-scene-card,
.nandemo-scene-card:visited {
    display: flex;
    flex-direction: column;
    gap: 8px;
    box-sizing: border-box;
    height: 100%;
    padding: 16px 24px;
    border: 1px solid var(--color-neutral-solid-gray-420);
    border-radius: var(--nandemo-radius);
    background-color: var(--color-neutral-white);
    color: var(--color-neutral-solid-gray-800);
    text-decoration: none;
}
.nandemo-scene-card-name {
    margin: 0;
    color: var(--color-key-1000);
    font-size: 20px;
    font-weight: 700;
    line-height: 1.5;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
.nandemo-scene-card-desc { margin: 0; color: var(--color-neutral-solid-gray-800); font-size: 16px; line-height: 1.7; }
.nandemo-scene-card-count { margin: auto 0 0; color: var(--color-neutral-solid-gray-700); font-size: 14px; line-height: 1.5; }
@media (hover: hover) {
    .nandemo-scene-card:hover { border-color: var(--color-neutral-black); }
    .nandemo-scene-card:hover .nandemo-scene-card-name { color: var(--color-key-900); text-decoration-thickness: 3px; }
}
.nandemo-scene-card:focus-visible { background-color: var(--color-neutral-white); }

/* 記事のカード（画像＋タイトル） */
.nandemo-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px 16px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.nandemo-post-card,
.nandemo-post-card:visited {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    height: 100%;
    overflow: hidden;
    border: 1px solid var(--color-neutral-solid-gray-420);
    border-radius: var(--nandemo-radius);
    background-color: var(--color-neutral-white);
    color: var(--color-neutral-solid-gray-800);
    text-decoration: none;
}
.nandemo-post-card-image {
    aspect-ratio: 16 / 9;
    border-bottom: 1px solid var(--color-neutral-solid-gray-420);
    background-color: var(--color-neutral-solid-gray-50);
}
.nandemo-post-card-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.nandemo-post-card-body { display: flex; flex-direction: column; gap: 8px; padding: 16px; }
.nandemo-post-card-label { margin: 0; color: var(--color-neutral-solid-gray-700); font-size: 14px; line-height: 1.5; }
.nandemo-post-card-title {
    margin: 0;
    color: var(--color-key-1000);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.6;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
.nandemo-post-card-rank {
    display: inline-block;
    margin-right: 8px;
    padding: 2px 8px;
    border-radius: 4px;
    background-color: var(--color-key-900);
    color: var(--color-neutral-white);
    font-size: 14px;
    text-decoration: none;
}
@media (hover: hover) {
    .nandemo-post-card:hover { border-color: var(--color-neutral-black); }
    .nandemo-post-card:hover .nandemo-post-card-title { color: var(--color-key-900); text-decoration-thickness: 3px; }
}
.nandemo-post-card:focus-visible { background-color: var(--color-neutral-white); }
.nandemo-more-link { margin: 24px 0 0; font-size: 16px; }
.nandemo-more-link a { color: var(--color-key-1000); text-decoration: underline; }

/* カテゴリ・シーン・デスクでは Cocoon の一覧テンプレートが出す見出し（h1）を出さない＝ページの h1 を1つにする */
.nandemo-section > .archive-title,
.nandemo-section > .breadcrumb { display: none; }
@media screen and (max-width: 767px) {
    /* 一覧カードの小さなサムネイルにはカテゴリ名を重ねない（読めない幅になるため） */
    .entry-card .cat-label { display: none; }
}

/* カテゴリ・シーン・デスクの見出しブロック */
.nandemo-pillar-header { margin: 8px 0 40px; padding: 0; border: 0; background: none; }
.nandemo-pillar-title {
    margin: 0 0 16px;
    color: var(--color-neutral-solid-gray-900);
    font-size: 32px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.01em;
}
.nandemo-pillar-lead { margin: 0; color: var(--color-neutral-solid-gray-800); font-size: 16px; line-height: 1.7; max-width: 48em; }
.nandemo-pillar-meta { margin: 8px 0 0; color: var(--color-neutral-solid-gray-700); font-size: 14px; line-height: 1.5; }
.nandemo-pillar-criteria {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin: 0;
}
.nandemo-criteria-item {
    padding: 16px 24px;
    border: 1px solid var(--color-neutral-solid-gray-420);
    border-radius: var(--nandemo-radius);
    background-color: var(--color-neutral-white);
}
.nandemo-criteria-title { margin: 0 0 8px; color: var(--color-neutral-solid-gray-900); font-size: 18px; font-weight: 700; line-height: 1.5; }
.nandemo-criteria-desc { margin: 0; color: var(--color-neutral-solid-gray-800); font-size: 16px; line-height: 1.7; }
.nandemo-pillar-faq { margin: 0; padding: 0; background: none; }
.nandemo-pillar-faq dt {
    position: static;
    margin: 24px 0 8px;
    padding: 0;
    color: var(--color-neutral-solid-gray-900);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;
}
.nandemo-pillar-faq dt:first-child { margin-top: 0; }
.nandemo-pillar-faq dd { position: static; margin: 0; padding: 0 0 24px; border-bottom: 1px solid var(--color-neutral-solid-gray-420); color: var(--color-neutral-solid-gray-800); font-size: 16px; line-height: 1.7; }
.nandemo-pillar-faq dt::before,
.nandemo-pillar-faq dd::before { content: none; }

/* ===== 12. 固定ページ ===== */
.page .article .entry-content h2 { margin-top: 48px; }
.page .article .entry-content > :first-child { margin-top: 0; }

/* ===== 13. モバイル（768px 未満） ===== */
@media screen and (max-width: 767px) {
    .main { padding: 16px 16px 40px; }
    .site-name-text,
    #header .site-name-text { font-size: 22px; }
    .tagline { font-size: 14px; }
    .entry-title,
    .archive-title,
    .nandemo-pillar-title { font-size: 24px; padding: 0; }
    .article .entry-content h2 { margin-top: 48px; font-size: 22px; padding: 0 0 8px; }
    .article .entry-content h3 { font-size: 18px; padding: 0 0 0 calc(1em / 3 + 0.5em); }
    .article .entry-content h3.ranking-item { padding: 12px 16px 12px calc(16px + 1em / 3 + 0.5em); }
    .article .entry-content h4,
    .article .entry-content h5,
    .article .entry-content h6 { font-size: 17px; padding: 0; }
    .nandemo-author-box { flex-direction: column; padding: 16px; }
    .nandemo-related-cluster,
    .nandemo-service-cta { padding: 16px; }
    .nandemo-home-hero { padding: 24px 16px; }
    .nandemo-home-hero h1 { font-size: 28px; }
    .nandemo-home-hero-lead { font-size: 16px; }
    .nandemo-search-row { gap: 8px; }
    .nandemo-section { margin-top: 48px; }
    .nandemo-section-title { font-size: 22px; }
    .nandemo-scene-grid,
    .nandemo-card-grid,
    .nandemo-pillar-criteria { grid-template-columns: minmax(0, 1fr); }
    .nandemo-scene-card { padding: 16px; }
    .buy-links a { flex: 1 1 100%; }
    .buy-links .nandemo-price { flex: 1 1 100%; }
    .navi-footer-in > .menu-footer li.menu-item { width: auto; flex: 0 1 auto; margin: 0; }
}
/* Cocoon がモバイル表示に切り替わる幅（1023px 以下）では、上部のバー（メニュー・サイト名・検索）に役割をまとめ、
   重複するヘッダー（キャッチフレーズ・サイト名）と2列のメニューを出さない（メニューは「メニュー」ボタンから開く） */
@media screen and (max-width: 1023px) {
    /* 新着記事一覧（.blog）はロゴがページの h1 なのでヘッダーを残す */
    .mblt-header-mobile-buttons:not(.blog) #header,
    .mblt-header-mobile-buttons #navi { display: none; }
    .mobile-header-menu-buttons .logo-menu-button a,
    .mobile-header-menu-buttons .logo-menu-button a:visited { color: var(--color-neutral-solid-gray-900); font-weight: 700; text-decoration: none; }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
    .nandemo-scene-grid,
    .nandemo-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media screen and (min-width: 768px) {
    .article .entry-content { font-size: 17px; }
}