動的CSS（ihinseiri 用）

/* ============================================================
 * ihinseiri.area-matching-navi.com 動的カスタム CSS v1
 *
 * 適用方法:
 *   WP 固定ページ「ihinseiri-dynamic-css」(ID:21) の本文に
 *   この CSS を貼り付ける（Claude が REST API で更新も可）。
 *
 * 役割:
 *   1. SWELL ヘッダーを v4 ihinseiri デザイン（墨茶 + 朱 + 個人感）に寄せる
 *   2. 子テーマ style.css に残る akiya 藍 #1E3A5F を ihinseiri 墨茶 #6B4226 で上書き
 *   3. SWELL のフッター・見出し色も ihinseiri テーマに統一
 *
 * セレクタの優先度:
 *   functions.php で wp_head 優先度 999 でフックされているため、
 *   SWELL のデフォルト CSS より後に読み込まれる。
 *   既存子テーマ style.css の !important も上書きするため、こちらも !important 付与。
 * ============================================================ */


/* ============================================
 * 1. ヘッダー: ロゴテキスト & 前置 dot（v4 デザイン）
 * ============================================ */
.l-header .c-headLogo a,
.l-fixHeader .c-headLogo a {
    color: #6B4226 !important;
    font-family: 'Noto Serif JP', 'Yu Mincho', serif !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em !important;
    display: inline-flex !important;
    align-items: center !important;
    text-decoration: none !important;
}
/* ロゴ前の朱印（落款印「家」）= ロゴ候補 v2-5 ロックアップ（2026-05-31） */
.l-header .c-headLogo a::before,
.l-fixHeader .c-headLogo a::before {
    content: '' !important;
    display: inline-block !important;
    width: 1.5em !important;
    height: 1.5em !important;
    margin-right: 0.42em !important;
    vertical-align: -0.36em !important;
    background-image: url('https://ihinseiri.area-matching-navi.com/wp-content/themes/swell_child/icons/favicon.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}


/* ============================================
 * 2. ヘッダーメニュー項目: 色 & hover
 * ============================================ */
.l-header__gnav .menu-item > a,
.l-fixHeader__gnav .menu-item > a {
    color: #3A2A1F !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    transition: color 0.2s !important;
}
.l-header__gnav .menu-item > a:hover,
.l-fixHeader__gnav .menu-item > a:hover {
    color: #6B4226 !important;
    opacity: 1 !important;
}


/* ============================================
 * 3. ヘッダー LINE ボタン: ihinseiri 色に合わせた追加調整
 *    (既存子テーマで緑化済み、ここでは hover 強化のみ)
 * ============================================ */
.l-header__gnav .menu-line-btn > a:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(6, 199, 85, 0.4) !important;
}


/* ============================================
 * 4. ヘッダー全体の色味調整（白背景 + 境界線）
 * ============================================ */
.l-header {
    background: #FFFFFF !important;
    border-bottom: 1px solid #E5DCCE !important;
}
.l-fixHeader {
    background: #FFFFFF !important;
    border-bottom: 1px solid #E5DCCE !important;
}


/* ============================================
 * 5. SWELL の見出し色を ihinseiri 墨茶に統一
 *    (子テーマ :root --color_htag #1E3A5F を上書き)
 * ============================================ */
:root {
    --color_htag: #6B4226 !important;
    --color_main: #6B4226 !important;
    --color_link: #8E4F35 !important;
}


/* ============================================
 * 6. フッター色を ihinseiri 用 footer-bg に統一
 *    (子テーマ style.css の #1E3A5F を上書き)
 * ============================================ */
.l-footer,
.l-footer__foot,
.l-footer__widgetArea {
    background: #2D1F14 !important;
    border-top: none !important;
}
.l-footer a:hover {
    color: #E2A488 !important;
}


/* ============================================
 * 7. SWELL CAPBOX タイトル色を墨茶に統一
 *    (子テーマ style.css の #1E3A5F を上書き)
 * ============================================ */
.post_content .swell-block-capbox.cap_good .cap_box_ttl {
    background-color: #6B4226 !important;
}
.post_content .swell-block-capbox.cap_good .cap_box_ttl > span,
.post_content .swell-block-capbox.cap_good .cap_box_ttl::before {
    color: #FFFFFF !important;
}


/* ============================================
 * 8. SWELL リンクボタン色 (post_content 内)
 * ============================================ */
.post_content a:not(.swl-button) {
    color: #8E4F35 !important;
}
.post_content a:not(.swl-button):hover {
    color: #6B4226 !important;
}


/* ============================================
 * 9. レスポンシブ: SP ヘッダーロゴの余白調整
 * ============================================ */
@media (max-width: 599px) {
    .l-header .c-headLogo a {
        font-size: 17px !important;
    }
    .l-header .c-headLogo a::before {
        width: 1.35em !important;
        height: 1.35em !important;
        margin-right: 0.36em !important;
    }
}