@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* ==========================================================================
   カラー変数（トンマナ確定版 v2）
   ========================================================================== */
:root {
    --stp-text: #2E3B40;      /* 本文・見出し */
    --stp-primary: #6B9AC4;   /* メインカラー */
    --stp-link: #3B82C4;      /* リンク */
    --stp-accent: #F2766B;    /* CTA・ボタン専用 */
    --stp-marker: #F2E6A7;    /* マーカー */
    --stp-sub-bg: #F6F9FC;    /* セクション・ボックス背景 */
    --stp-base: #FDFDFD;      /* ページ背景 */
    --stp-border: #E3E9F0;    /* 罫線・枠 */
    --stp-radius: 10px;       /* 角丸の基準（8〜12px） */
}

/* ==========================================================================
   目次ボックス
   ========================================================================== */
.p-toc {
    background: var(--stp-sub-bg);
    border: 1px solid var(--stp-border);
    border-radius: var(--stp-radius);
}
.p-toc__ttl {
    color: var(--stp-text);
}
/* 目次の番号・カウンター */
.p-toc ol > li::before,
.p-toc ol > li > a::before {
    color: var(--stp-primary);
}
.p-toc a {
    color: var(--stp-text);
}
.p-toc a:hover {
    color: var(--stp-link);
}

/* ==========================================================================
   Pochipp（商品リンクボックス）
   ※ストアボタンの色は購買認知のためデフォルト維持
   ========================================================================== */
.pochipp-box {
    border: 1px solid var(--stp-border);
    border-radius: 12px;
}
.pochipp-box__title,
.pochipp-box__title a {
    color: var(--stp-text);
}

/* ==========================================================================
   角丸の統一（8〜12px）
   ========================================================================== */
.wp-block-image img,
.p-postList__thumb,
.c-postThumb__figure,
.wp-block-table table,
.swell-block-box,
.p-articleThumb img,
.c-shareBtns__btn,
.wp-block-swell-blocks-fullWide img {
    border-radius: var(--stp-radius);
}

/* ボタンは少し強めの角丸 */
.swell-block-button__link,
.c-btn {
    border-radius: 12px;
}

/* ==========================================================================
   罫線・区切り（細く・淡く）
   ========================================================================== */
.wp-block-separator,
hr {
    border-color: var(--stp-border);
}

/* ==========================================================================
   本文リストの行間
   ※SWELL標準は li 同士が詰まって見えるため、項目間の余白と行間を広げる
   　（ナビ・関連記事など本文外のリストには効かせない）
   ========================================================================== */
.post_content .wp-block-list > li {
    margin-bottom: 0.6em;
    line-height: 1.8;
}
.post_content .wp-block-list > li:last-child {
    margin-bottom: 0;
}

/* アイコン付きスタイル（チェックリスト等）は字面が詰まりやすいので少し広めに */
.post_content .wp-block-list.is-style-check_list > li,
.post_content .wp-block-list.is-style-good_list > li,
.post_content .wp-block-list.is-style-bad_list > li {
    margin-bottom: 0.8em;
}

/* 入れ子リストは親項目との距離を詰めて階層を分かりやすく */
.post_content .wp-block-list > li > .wp-block-list {
    margin-top: 0.6em;
}

/* ==========================================================================
   広告枠の CLS 対策（レイアウトシフト防止）
   ========================================================================== */
.adsbygoogle {
    display: block;
    min-height: 100px;
}
/* 追尾サイドバーの広告枠 */
#fix_sidebar .adsbygoogle,
.w-fixSide .adsbygoogle {
    min-height: 250px;
}