/* 共通サイトクロームCSS（ヘッダー/フッター）。
   page-plan-kasou.php のメイン style からセレクタ抽出（:root, .site-, .header-, .nav-, .footer-, .container など）。
   フィーチャートグル時に旧ページへ enqueue して新ヘッダー/フッターを適用するためのもの。
   ※コメント内に閉じ記号（アスタリスト+スラッシュ）を書くとコメントが途中で閉じ :root が壊れるため、グロブ記号は使わない。 */

:root {
            --primary: #E06080;
            --primary-dark: #C0405F;
            --primary-pale: #FDE8EF;
            --teal: #4CBBCA;
            --green: #5CB85C;
            --orange: #F0A500;
            --purple: #9B59B6;
            --cta-red: #C62828;
            --bg: #FFF7F9;
            --white: #FFFFFF;
            --text: #2E2E2E;
            --mid: #555555;
            --border: #E8E8E8;
}

/* ── 旧ページ適用時の競合対策（common.css の body/header 既定が新クロームにブリードするため上書き） ── */
body.wagaya-new-chrome { margin-top: 0; }                 /* 旧固定ヘッダー用の上余白(10.4rem)を解除＝ヘッダー上の余白対策 */
.site-header { height: auto; padding: 0; position: sticky; top: 0; }  /* common.css header{height:10.4rem;padding;position:fixed} を打ち消す＝CTA文字が隠れる対策 */
/* CTAボタンの配色を明示（旧 a/ header 子要素ルールとの競合対策） */
/* CTAボタン配色：旧CSS競合・var()未解決の双方に強いリテラル色＋!important */
body.wagaya-new-chrome .header-cta--solid  { background: #E06080 !important; color: #fff !important; border: 2px solid #E06080 !important; }
body.wagaya-new-chrome .header-cta--outline { background: #fff !important; color: #4CBBCA !important; border: 2px solid #4CBBCA !important; }
body.wagaya-new-chrome .header-emergency    { background: #C62828 !important; color: #fff !important; }
body.wagaya-new-chrome .header-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 64px;
    gap: 20px;
    transition: height .2s ease;
    background: #fff;
}
body.wagaya-new-chrome .site-nav .container { background: #fff; }
/* 固定CTA（フローティングバナー）に本文が隠れないよう下部余白を確保 */
@media (max-width: 768px) {
    body.wagaya-new-chrome { margin-bottom: 0; padding-bottom: calc(184px + env(safe-area-inset-bottom)); }
}
/* PC: 固定CTA（.pc-fixed-cta）分の下端余白。これが無いと本文末尾・フッターがバナーに隠れる */
@media (min-width: 769px) {
    body.wagaya-new-chrome { padding-bottom: 96px; }
}

.member-sub-label {
            font-size: .8em;
            font-weight: inherit;
            white-space: nowrap;
}

.skip-link {
            position: absolute;
            top: -48px;
            left: 0;
            background: var(--primary);
            color: #fff;
            padding: 8px 16px;
            z-index: 9999;
            font-size: 16px;
            font-weight: 700;
            border-radius: 0 0 6px 0;
            transition: top .2s;
}

.skip-link:focus {
            top: 0;
}

.container {
            max-width: 1100px;
            margin: 0 auto;
            padding: 0 20px;
}

.container_family {
            max-width: 740px;
            margin: 0 auto;
            padding: 0 20px;
}

/* ══════════════════════════════════════
       ヘッダー上段：ロゴ＋電話CTA
       ※ 現行サイトのデザインを踏襲
    ══════════════════════════════════════ */
        .site-header {
            background: var(--white);
            box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
            position: sticky;
            top: 0;
            z-index: 200;
            transition: box-shadow .2s ease;
}

.header-top {
            display: flex;
            align-items: center;
            justify-content: space-between;
            height: 64px;
            gap: 20px;
            transition: height .2s ease;
}

/* スクロール時：ヘッダーをコンパクトに */
        .site-header.is-scrolled .header-top {
            height: 48px;
}

.site-header.is-scrolled .site-logo img {
            height: 32px;
            transition: height .2s ease;
}

.site-logo img {
            transition: height .2s ease;
}

.site-logo {
            display: flex;
            align-items: center;
            flex-shrink: 0;
}

.site-logo img {
            height: 48px;
            width: auto;
}

.logo-fallback {
            display: none;
            align-items: center;
            gap: 6px;
            font-size: 16px;
            font-weight: 700;
            line-height: 1.3;
}

.logo-fallback .small {
            font-size: 12px;
            color: var(--mid);
            font-weight: 400;
            display: block;
}

.header-right {
            display: flex;
            align-items: center;
            gap: 16px;
}

.header-tel-link {
            display: inline-flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 2px;
            padding: 6px 16px 7px;
            background: #fff;
            border: 2px solid var(--cta-red);
            border-radius: 6px;
            text-decoration: none;
            transition: background .2s, color .2s;
            box-shadow: 0 2px 6px rgba(192, 64, 95, .15);
}

.header-tel-link:hover {
            background: var(--cta-red);
}

.header-tel-link:hover .header-tel-num,
        .header-tel-link:hover .header-tel-note {
            color: #fff;
}

.header-tel-num {
            font-family: "Oswald", 'Noto Sans JP', sans-serif;
            font-size: 22px;
            font-weight: 900;
            color: var(--cta-red);
            letter-spacing: .04em;
            line-height: 1;
            display: flex;
            align-items: center;
            gap: 4px;
}

.header-tel-num::before {
            content: "📞";
            font-size: 16px;
            line-height: 1;
}

.header-tel-note {
            font-size: 12px;
            color: var(--mid);
            line-height: 1;
}

.header-emergency {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: var(--cta-red);
            color: #fff;
            font-size: 16px;
            font-weight: 700;
            padding: 10px 18px;
            border-radius: 6px;
            white-space: nowrap;
            box-shadow: 0 2px 6px rgba(192, 64, 95, .25);
            transition: background .2s;
}

.header-emergency:hover {
            background: #a01c1c;
            color: #fff;
}

.header-cta-stack {
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            gap: 4px;
            align-self: stretch;
}

.header-cta {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 12px;
            font-weight: 700;
            padding: 3px 12px;
            border-radius: 4px;
            white-space: nowrap;
            line-height: 1.2;
            text-decoration: none;
            transition: background .2s, color .2s, border-color .2s;
            flex: 1;
}

.header-cta--outline {
            background: #fff;
            color: var(--teal);
            border: 2px solid var(--teal);
}

.header-cta--outline:hover {
            background: var(--teal);
            color: #fff;
}

.header-cta--solid {
            background: var(--primary);
            color: #fff;
            border: 2px solid var(--primary);
            box-shadow: 0 2px 6px rgba(224, 96, 128, .25);
}

.header-cta--solid:hover {
            background: #c34b6f;
            border-color: #c34b6f;
            color: #fff;
}

@media(max-width:1180px) {
    .header-right {
                gap: 10px;
    }
    .header-cta {
                font-size: 13px;
                padding: 8px 10px;
    }
}

/* ══════════════════════════════════════
       ヘッダー下段：グローバルナビゲーション
       ※ 現行サイトのメニュー項目をそのまま使用
          → Chrome接続後に実際の項目を要確認
    ══════════════════════════════════════ */
        .site-nav {
            background: var(--white);
            border-top: 1px solid var(--border);
}

.nav-inner {
            display: flex;
            align-items: stretch;
            gap: 0;
}

/* 通常メニュー項目 */
        .nav-item {
            position: relative;
}

.nav-link {
            display: flex;
            align-items: center;
            gap: 4px;
            padding: 0 16px;
            height: 44px;
            font-size: 20px;
            font-weight: 500;
            color: var(--text);
            white-space: nowrap;
            border-bottom: 3px solid transparent;
            transition: color .2s, border-color .2s;
}

.nav-link:hover {
            color: var(--primary);
            border-bottom-color: var(--primary);
}

.nav-link.current {
            color: var(--primary);
            border-bottom-color: var(--primary);
}

/* ドロップダウン（プラン） */
        .nav-item:hover .nav-dropdown {
            display: block;
}

.nav-dropdown {
            display: none;
            position: absolute;
            top: 100%;
            left: 0;
            background: var(--white);
            min-width: 160px;
            box-shadow: 0 4px 16px rgba(0, 0, 0, .12);
            border-top: 3px solid var(--primary);
            border-radius: 0 0 6px 6px;
            z-index: 100;
}

.nav-dropdown a {
            display: block;
            padding: 11px 18px;
            font-size: 16px;
            color: var(--text);
            border-bottom: 1px solid var(--border);
            transition: background .15s, color .15s;
}

.nav-dropdown a:last-child {
            border-bottom: none;
}

.nav-dropdown a:hover {
            background: var(--primary-pale);
            color: var(--primary);
}

/* お急ぎの方ボタン（強調） */
        .nav-link.nav-emergency {
            background: var(--cta-red);
            color: #fff !important;
            margin: 8px 0 8px 8px;
            height: 32px;
            padding: 0 16px;
            border-radius: 6px;
            font-size: 16px;
            font-weight: 700;
            border-bottom: none !important;
}

.nav-link.nav-emergency:hover {
            background: #a01c1c;
}

/* ハンバーガー（SP） */
        .nav-hamburger {
            display: none;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 4px;
            padding: 8px;
            cursor: pointer;
            border: none;
            background: transparent;
}

.nav-hamburger-bars {
            display: flex;
            flex-direction: column;
            justify-content: center;
            gap: 5px;
}

.nav-hamburger-bars span {
            display: block;
            width: 22px;
            height: 2px;
            background: var(--text);
            border-radius: 2px;
            transition: .2s;
}

.nav-hamburger-label,
        .nav-hamburger-label-close {
            font-size: 10px;
            font-weight: 700;
            letter-spacing: .1em;
            color: var(--text);
            line-height: 1;
}

.nav-hamburger-label-close {
            display: none;
}

/* メニュー開閉時：3本線→×、MENU→CLOSE に切替 */
        .nav-hamburger.is-open .nav-hamburger-bars {
            position: relative;
            width: 22px;
            height: 22px;
}

.nav-hamburger.is-open .nav-hamburger-bars span {
            position: absolute;
            top: 50%;
            left: 0;
            margin: 0;
}

.nav-hamburger.is-open .nav-hamburger-bars span:nth-child(1) {
            transform: translateY(-50%) rotate(45deg);
}

.nav-hamburger.is-open .nav-hamburger-bars span:nth-child(2) {
            opacity: 0;
}

.nav-hamburger.is-open .nav-hamburger-bars span:nth-child(3) {
            transform: translateY(-50%) rotate(-45deg);
}

.nav-hamburger.is-open .nav-hamburger-label {
            display: none;
}

.nav-hamburger.is-open .nav-hamburger-label-close {
            display: block;
}

.nav-sp {
            display: none;
}

@media(max-width:768px) {
    /* スマホでは「無料会員登録」のみ表示し、長文の折り返し崩れを防ぐ */
            .emergency-strip-btn .member-sub-label {
                display: none;
    }
}

.cta-section>.container>.cta-inner>.cta-lead {
            font-size: 16px;
            color: rgba(255, 255, 255, .05);
            margin-bottom: 44px;
            line-height: 1.7;
}

/* ── フッター直上CTA ── */
        .footer-cta-section {
            background: #f5efe3;
            position: relative;
}

.footer-cta-banner {
            background: linear-gradient(135deg, #6e2638 0%, #8b2f47 100%);
            text-align: center;
            padding: 18px 24px;
}

.footer-cta-banner p {
            margin: 0;
            font-size: 22px;
            font-weight: 800;
            color: #fff;
            letter-spacing: .02em;
}

.footer-cta-banner strong {
            font-size: 1.25em;
            color: #ffd84d;
}

.footer-cta-banner sup {
            font-size: 12px;
            color: #ffd84d;
            margin-left: 2px;
}

.footer-cta-inner {
            display: flex;
            align-items: center;
            gap: 32px;
            padding: 36px 20px;
            position: relative;
}

.footer-cta-visual {
            flex: 0 0 220px;
            position: relative;
}

.footer-cta-photo {
            position: relative;
            width: 220px;
            height: 260px;
            overflow: hidden;
}

.footer-cta-photo img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: top center;
            display: block;
}

.footer-cta-bubble {
            position: absolute;
            top: 20px;
            left: -56px;
            background: #fbeb84;
            color: #5a3a00;
            width: 92px;
            height: 92px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
            font-size: 12px;
            font-weight: 800;
            line-height: 1.4;
            box-shadow: 0 4px 10px rgba(0, 0, 0, .15);
            z-index: 2;
}

.footer-cta-cards {
            flex: 1;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 24px;
            min-width: 0;
}

.footer-cta-card {
            background: #fff;
            border-radius: 6px;
            padding: 24px 24px;
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            box-shadow: 0 2px 10px rgba(0, 0, 0, .08);
}

.footer-cta-card-title {
            font-size: 22px;
            font-weight: 800;
            color: var(--text);
            margin: 0 0 6px;
            letter-spacing: .02em;
            border-bottom: 2px solid var(--primary);
            padding-bottom: 8px;
            display: inline-block;
}

.footer-cta-card-sub {
            font-size: 16px;
            color: var(--mid);
            margin: 0 0 12px;
}

.footer-cta-card-divider {
            display: none;
}

.footer-cta-card-lead,
        .footer-cta-card-promo {
            font-size: 16px;
            color: var(--text);
            margin: 0 0 10px;
}

.footer-cta-card-promo strong {
            color: var(--cta-red);
            font-weight: 800;
}

.footer-cta-tel {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            font-family: "Oswald", sans-serif;
            font-size: 32px;
            font-weight: 800;
            color: var(--cta-red);
            letter-spacing: .04em;
            margin-bottom: 12px;
}

.footer-cta-tel:hover {
            color: #a01c1c;
}

.footer-cta-tel-icon {
            font-size: 22px;
}

.footer-cta-tags {
            display: flex;
            gap: 10px;
            flex-wrap: wrap;
            justify-content: center;
}

.footer-cta-tags span {
            font-size: 16px;
            border: 1px solid var(--border);
            padding: 4px 12px;
            border-radius: 6px;
            color: var(--text);
}

.footer-cta-webbtn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 12px;
            width: 100%;
            padding: 14px 18px;
            background: linear-gradient(180deg, var(--primary) 0%, #a01c1c 100%);
            color: #fff;
            border-radius: 6px;
            font-weight: 800;
            box-shadow: 0 4px 12px rgba(192, 64, 95, .3);
            transition: transform .2s, box-shadow .2s;
            margin-bottom: 8px;
}

.footer-cta-webbtn:hover {
            transform: translateY(-2px);
            color: #fff;
}

.footer-cta-webbtn-icon {
            font-size: 22px;
}

.footer-cta-webbtn-text {
            display: flex;
            flex-direction: column;
            line-height: 1.2;
            align-items: flex-start;
}

.footer-cta-webbtn-label {
            font-size: 16px;
}

.footer-cta-webbtn-sub {
            font-size: 12px;
            opacity: .9;
            margin-top: 2px;
}

.footer-cta-note {
            font-size: 12px;
            color: var(--mid);
            margin: 0;
            line-height: 1.6;
}

@media(max-width:900px) {
    .footer-cta-inner {
                flex-direction: column;
                gap: 24px;
    }
    .footer-cta-visual {
                flex: 0 0 auto;
    }
    .footer-cta-cards {
                width: 100%;
                grid-template-columns: 1fr;
    }
}

@media(max-width:560px) {
    .footer-cta-banner p {
                font-size: 16px;
    }
    .footer-cta-photo {
                width: 160px;
                height: 200px;
    }
    .footer-cta-bubble {
                width: 80px;
                height: 80px;
                font-size: 12px;
                top: 8px;
                left: -52px;
    }
    .footer-cta-card-title {
                font-size: 20px;
    }
    .footer-cta-tel {
                font-size: 26px;
    }
}

/* ── フッター ── */
        .site-footer {
            background: #2C2C2C;
            color: #ccc;
            padding: 44px 0 24px;
}

.footer-top {
            display: flex;
            gap: 48px;
            margin-bottom: 36px;
}

.footer-brand {
            flex: 0 0 240px;
}

.footer-logo-text {
            font-size: 16px;
            font-weight: 700;
            color: #fff;
            margin-bottom: 10px;
}

.footer-corp-info {
            font-size: 16px;
            line-height: 1.8;
            color: #aaa;
}

.footer-nav {
            flex: 1;
            display: flex;
            gap: 32px;
}

.footer-col {
            flex: 1;
}

.footer-col-title {
            font-size: 16px;
            font-weight: 700;
            color: #fff;
            padding-bottom: 6px;
            margin-bottom: 12px;
            border-bottom: 1px solid #444;
}

.footer-col ul {
            list-style: none;
}

.footer-col ul li {
            margin-bottom: 6px;
}

.footer-col ul a {
            font-size: 16px;
            color: #aaa;
}

.footer-col ul a:hover {
            color: #fff;
}

.footer-bottom {
            border-top: 1px solid #444;
            padding-top: 16px;
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 16px;
            flex-wrap: wrap;
}

.footer-notice {
            font-size: 12px;
            color: #777;
            line-height: 1.7;
}

.footer-copy {
            font-size: 12px;
            color: #666;
            white-space: nowrap;
}

@media(max-width:960px) {
    /* SP：電話CTAを非表示 */
            .header-right {
                display: none;
    }
    /* SP：ナビをハンバーガーメニューに切り替え */
            .nav-inner {
                display: none;
    }
    /* SP: ハンバーガーは非表示（下部ボトムナビの「メニュー」で代用） */
            .nav-hamburger {
                display: none;
    }
    .site-nav {
                display: flex;
                align-items: center;
                justify-content: flex-end;
                padding: 0;
                border-top: none;
                height: 0px;
                position: relative;
    }
    .nav-sp {
                display: block;
                width: 100%;
                background: var(--white);
                box-shadow: 0 4px 12px rgba(0, 0, 0, .1);
                position: absolute;
                left: 0;
                top: 100%;
                z-index: 201;
                max-height: calc(100vh - 70px);
                overflow-y: auto;
                -webkit-overflow-scrolling: touch;
    }
    .nav-sp a {
                display: block;
                padding: 14px 20px;
                font-size: 20px;
                font-weight: 500;
                border-bottom: 1px solid var(--border);
                color: var(--text);
    }
    .nav-sp a:hover {
                background: var(--primary-pale);
                color: var(--primary);
    }
    /* SPナビ：グループ見出し */
            .nav-sp-heading {
                background: var(--primary-pale);
                color: var(--primary);
                font-size: 13px;
                font-weight: 800;
                letter-spacing: .08em;
                padding: 8px 20px;
                border-bottom: 1px solid var(--border);
    }
    .nav-sp-group {
                border-top: 4px solid var(--bg);
    }
    .nav-sp-group:first-of-type {
                border-top: none;
    }
    .nav-sp-group a {
                padding-left: 32px;
                font-size: 17px;
    }
    .nav-sp-group a::before {
                content: "›";
                color: var(--primary);
                font-weight: 700;
                margin-right: 10px;
                margin-left: -16px;
    }
    /* SPナビ：ゴージャスCTAボタン群（会員登録/セルフ見積/お問い合わせ） */
            /* SPメニューCTA：シンプルなテキスト＋アイコン */
            .nav-sp-ctas {
                padding: 0;
                display: block;
                background: #fff;
    }
    .nav-sp-ctas a.nav-sp-cta {
                display: flex !important;
                align-items: center;
                gap: 12px;
                padding: 14px 20px !important;
                border: none !important;
                border-bottom: 1px solid var(--border) !important;
                border-radius: 0 !important;
                box-shadow: none !important;
                background: #fff !important;
                color: var(--text) !important;
                font-weight: 700 !important;
                font-size: inherit !important;
                position: relative;
    }
    .nav-sp-ctas a.nav-sp-cta:active {
                background: #f6f6f6;
    }
    .nav-sp-ctas a.nav-sp-cta::before {
                content: none;
    }
    .nav-sp-cta-icon {
                flex: 0 0 auto;
                width: 28px;
                height: 28px;
                background: none;
                border-radius: 0;
                display: flex;
                align-items: center;
                justify-content: center;
                line-height: 1;
                color: var(--primary);
    }
    .nav-sp-cta-icon svg {
                width: 24px;
                height: 24px;
                display: block;
    }
    .nav-sp-cta-img {
                width: 26px;
                height: 26px;
                object-fit: contain;
                border-radius: 0;
                box-shadow: none;
    }
    .nav-sp-cta-body {
                flex: 1;
                display: flex;
                flex-direction: column;
                gap: 2px;
                min-width: 0;
    }
    .nav-sp-cta-badge {
                display: none;
    }
    .nav-sp-cta-title {
                font-size: 16px;
                font-weight: 700;
                line-height: 1.3;
                color: var(--text);
    }
    .nav-sp-cta-sub {
                font-size: 11px;
                font-weight: 500;
                line-height: 1.3;
                color: var(--mid);
    }
    .nav-sp-cta-arrow {
                flex: 0 0 auto;
                font-size: 15px;
                font-weight: 700;
                color: var(--mid);
                opacity: .8;
    }
    /* アイコンの色だけ用途別に */
            .nav-sp-cta--member .nav-sp-cta-icon { color: #C0405F; }
            .nav-sp-cta--sim .nav-sp-cta-icon { color: #2f96a4; }
            .nav-sp-cta--contact .nav-sp-cta-icon { color: #3d8b3d; }
    /* SPナビ：ゴージャスなプランカード */
            .nav-sp-group--plans {
                background: #f6f6f6;
                padding-bottom: 10px;
    }
    .nav-sp-group--plans a.nav-sp-plan {
                display: flex !important;
                align-items: stretch;
                margin: 8px 14px 0;
                padding: 0 !important;
                border: none !important;
                border-radius: 6px;
                overflow: hidden;
                box-shadow: 0 3px 8px rgba(0, 0, 0, .12);
                font-size: inherit !important;
    }
    .nav-sp-group--plans a.nav-sp-plan::before {
                content: none;
    }
    .nav-sp-plan-label {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                flex: 0 0 90px;
                padding: 8px 6px;
                background: #fff;
                font-size: 14px;
                font-weight: 800;
                line-height: 1.3;
                text-align: center;
    }
    .nav-sp-plan-price {
                flex: 1;
                display: flex;
                flex-direction: column;
                align-items: flex-end;
                justify-content: center;
                gap: 0;
                padding: 8px 14px;
                color: #fff;
                line-height: 1.2;
                white-space: nowrap;
    }
    .nav-sp-plan-reg {
                font-size: 11px;
                font-weight: 600;
                opacity: .85;
    }
    .nav-sp-plan-memlabel {
                font-size: 10px;
                font-weight: 700;
                opacity: .95;
                margin-top: 2px;
    }
    .nav-sp-plan-mem {
                display: flex;
                align-items: baseline;
                gap: 2px;
    }
    /* 料金の左隣に表示するプランごとのサムネイル */
            .nav-sp-plan-thumb {
                flex: 0 0 auto;
                width: 56px;
                height: 56px;
                object-fit: cover;
                border-radius: 6px;
                margin: 8px 0 8px 10px;
                box-shadow: 0 2px 6px rgba(0, 0, 0, .25);
                background: rgba(255, 255, 255, .15);
    }
    .nav-sp-plan-tax {
                font-size: 11px;
                font-weight: 700;
                opacity: .9;
    }
    .nav-sp-plan-num {
                font-family: 'Oswald', 'Noto Sans JP', sans-serif;
                font-size: 26px;
                font-weight: 800;
                letter-spacing: -.01em;
                line-height: 1;
    }
    .nav-sp-plan-yen {
                font-size: 12px;
                font-weight: 700;
    }
    /* 火葬式：ティール */
            .nav-sp-plan--kasou {
                background: linear-gradient(135deg, #4CBBCA 0%, #2f96a4 100%);
    }
    .nav-sp-plan--kasou .nav-sp-plan-label {
                color: #2f96a4;
    }
    /* 納棺式：グリーン */
            .nav-sp-plan--noukan {
                background: linear-gradient(135deg, #5CB85C 0%, #3d8b3d 100%);
    }
    .nav-sp-plan--noukan .nav-sp-plan-label {
                color: #3d8b3d;
    }
    /* 1日葬：オレンジ */
            .nav-sp-plan--ichinichi {
                background: linear-gradient(135deg, #F0A500 0%, #c98800 100%);
    }
    .nav-sp-plan--ichinichi .nav-sp-plan-label {
                color: #c98800;
    }
    /* 2日葬：パープル */
            .nav-sp-plan--futsuka {
                background: linear-gradient(135deg, #9B59B6 0%, #743f8b 100%);
    }
    .nav-sp-plan--futsuka .nav-sp-plan-label {
                color: #743f8b;
    }
    /* SPナビ：お急ぎの方へ（PCヘッダーと同じカラー） */
            .nav-sp-emergency {
                display: flex !important;
                align-items: center;
                gap: 10px;
                background: var(--cta-red) !important;
                color: #fff !important;
                font-weight: 800 !important;
                font-size: 18px !important;
                padding: 18px 20px !important;
                border-bottom: 4px solid var(--bg) !important;
                text-decoration: none;
    }
    .nav-sp-emergency:hover {
                background: #a91f1f !important;
                color: #fff !important;
    }
    .nav-sp-emergency::before {
                content: none;
    }
    .nav-sp-emergency-icon {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 28px;
                height: 28px;
                background: #fff;
                color: var(--cta-red);
                border-radius: 50%;
                font-size: 18px;
                font-weight: 900;
                flex-shrink: 0;
                line-height: 1;
    }
    .nav-sp-emergency-text {
                flex: 1;
                text-align: center;
    }
    .nav-sp-emergency-arrow {
                font-size: 20px;
                font-weight: 700;
                flex-shrink: 0;
    }
}

@media(max-width:768px) {
    .footer-top {
                flex-direction: column;
                gap: 24px;
    }
    .footer-brand {
                flex: none;
    }
    .header-tel-num {
                font-size: 20px;
    }
}

@media(max-width:560px) {
    .footer-nav {
                flex-wrap: wrap;
    }
}


/* ===== 固定CTA（フローティングバナー）: site-fixed-cta.php 用。page-plan-kasou.php から抽出 ===== */
/* .pc-fixed-cta / .sp-fixed-cta / .emergency-strip / .sp-bottom-nav */

/* PC固定CTA（emergency-strip と同じデザイン・下部固定） */
        .pc-fixed-cta {
            position: fixed;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 949;
            box-shadow: 0 -4px 14px rgba(0, 0, 0, .15);
}

/* SP/狭幅ではPC固定CTAを非表示（.sp-fixed-cta + .sp-bottom-nav が代替。重なり崩れ防止） */
@media (max-width: 768px) {
    .pc-fixed-cta { display: none; }
}

/* SP固定CTA（割引バナー + 電話/会員登録ボタン） */
        .sp-fixed-cta {
            display: none;
}

@media(max-width:768px) {
    .sp-fixed-cta {
                display: block;
                position: fixed;
                left: 0;
                right: 0;
                bottom: calc(60px + env(safe-area-inset-bottom));
                z-index: 951;
                background: #fff;
                box-shadow: 0 -4px 14px rgba(0, 0, 0, .08);
    }
    .sp-fixed-cta-banner {
                background: linear-gradient(180deg, #c0405f 0%, #8b2c44 100%);
                color: #fff;
                text-align: center;
                font-size: 12px;
                font-weight: 700;
                padding: 8px 12px;
                line-height: 1.4;
    }
    .sp-fixed-cta-banner strong {
                font-size: 15px;
                font-weight: 900;
                margin: 0 4px;
                color: #ffd84d;
    }
    .sp-fixed-cta-banner sup {
                font-size: 9px;
                margin-left: 1px;
    }
    .sp-fixed-cta-actions {
                display: flex;
                align-items: stretch;
                gap: 6px;
                padding: 8px 10px;
                background: #fff7f9;
    }
    .sp-fixed-cta-staff {
                flex: 0 0 56px;
                position: relative;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                font-size: 9px;
                font-weight: 700;
                color: var(--text);
                line-height: 1.2;
                text-align: center;
    }
    .sp-fixed-cta-staff img {
                width: 44px;
                height: 44px;
                border-radius: 50%;
                object-fit: cover;
                border: 2px solid #fff;
                box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
                margin-bottom: 2px;
    }
    .sp-fixed-cta-staff.is-empty img {
                display: none;
    }
    .sp-fixed-cta-staff-label {
                font-size: 9px;
    }
    .sp-fixed-cta-btn {
                flex: 1 1 0;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 6px;
                padding: 12px 6px;
                border-radius: 6px;
                color: #fff;
                font-size: 14px;
                font-weight: 800;
                text-decoration: none;
                box-shadow: 0 3px 8px rgba(0, 0, 0, .15);
                min-height: 44px;
    }
    .sp-fixed-cta-btn svg {
                width: 18px;
                height: 18px;
                flex-shrink: 0;
    }
    /* 電話：白背景＋赤枠 */
            .sp-fixed-cta-btn--phone {
                background: #fff;
                color: var(--cta-red) !important;
                border: 2px solid var(--cta-red);
                box-shadow: 0 3px 8px rgba(198, 40, 40, .2);
    }
    /* 電話ボタンアイコン：MVと同じリンギング+パルスアニメ */
            .sp-fixed-cta-btn-iconwrap {
                position: relative;
                width: 22px;
                height: 22px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                flex-shrink: 0;
    }
    .sp-fixed-cta-btn-icon-ring {
                width: 22px;
                height: 22px;
                color: var(--cta-red);
                animation: emergency-ring 1.6s ease-in-out infinite;
    }
    .sp-fixed-cta-btn-pulse {
                position: absolute;
                inset: -2px;
                border-radius: 50%;
                background: rgba(198, 40, 40, .25);
                animation: emergency-pulse 1.6s ease-out infinite;
                pointer-events: none;
    }
    /* 会員登録：ピンク系。旧common.cssの a/ボタン規則に負けて色落ちするためリテラル色＋!important（電話ボタンと同じ強さに合わせる） */
            .sp-fixed-cta-btn--member {
                background: linear-gradient(180deg, #E06080 0%, #C0405F 100%) !important;
                color: #fff !important;
                border: 0;
    }
    .sp-fixed-cta-btn--member svg { color: #fff !important; }
}

/* SP固定ボトムナビ */
        .sp-bottom-nav {
            display: none;
}

/* プラン選択シート（SP下部ナビ「プラン」で上に開く／/plan/ ページが無いため） */
.sp-plan-sheet {
    display: none;
    position: fixed;
    left: 0; right: 0;
    bottom: calc(60px + env(safe-area-inset-bottom));
    z-index: 1000;
    background: #f6f6f6;
    box-shadow: 0 -6px 20px rgba(0,0,0,.18);
    padding-bottom: calc(8px + env(safe-area-inset-bottom));
    max-height: 64vh;
    overflow-y: auto;
}
.sp-plan-sheet.is-open { display: block; }
.sp-plan-sheet-close {
    position: absolute;
    top: 5px; right: 8px;
    z-index: 2;
    width: 30px; height: 30px;
    display: flex; align-items: center; justify-content: center;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 50%;
    font-size: 20px; line-height: 1;
    color: var(--mid);
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(0,0,0,.15);
}

@media(max-width:768px) {
    .sp-bottom-nav {
                display: flex;
                position: fixed;
                left: 0;
                right: 0;
                bottom: 0;
                z-index: 950;
                background: #fff;
                border-top: 1px solid var(--border);
                box-shadow: 0 -4px 14px rgba(0, 0, 0, .08);
                padding-bottom: env(safe-area-inset-bottom);
    }
    .sp-bottom-nav-item {
                flex: 1 1 0;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                gap: 2px;
                padding: 8px 2px 6px;
                background: #fff;
                color: var(--text);
                text-decoration: none;
                border: none;
                cursor: pointer;
                font-family: inherit;
                min-height: 60px;
                transition: background .15s;
    }
    .sp-bottom-nav-item:active {
                background: #f6f6f6;
    }
    .sp-bottom-nav-icon {
                width: 22px;
                height: 22px;
                display: block;
    }
    .sp-bottom-nav-label {
                font-size: 10px;
                font-weight: 700;
                letter-spacing: .04em;
                line-height: 1.2;
    }
    .sp-bottom-nav-item--urgent {
                background: var(--cta-red);
                color: #fff;
    }
    .sp-bottom-nav-item--urgent:active {
                background: #a91f1f;
    }
}

/* 緊急電話ストリップ */
        .emergency-strip {
            background: #c0405f;
            color: #fff;
            position: relative;
            overflow: hidden;
}

.emergency-strip-inner {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
            padding: 14px 24px;
            flex-wrap: wrap;
            position: relative;
            z-index: 1;
            max-width: 1100px;
            margin: 0 auto;
}

.emergency-strip-phone {
            display: inline-flex;
            align-items: center;
            gap: 14px;
            color: #fff;
            transition: opacity .2s;
}

.emergency-strip-phone:hover {
            color: #fff;
            opacity: .95;
}

/* 電話アイコン（パルスアニメーション） */
        .emergency-strip-icon-wrap {
            position: relative;
            width: 44px;
            height: 44px;
            border-radius: 50%;
            background: rgba(255, 255, 255, .18);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
}

.emergency-strip-icon-svg {
            width: 22px;
            height: 22px;
            color: #fff;
            animation: emergency-ring 1.6s ease-in-out infinite;
}

.emergency-strip-pulse {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border-radius: 50%;
            background: rgba(255, 255, 255, .35);
            animation: emergency-pulse 1.6s ease-out infinite;
}

/* テキストエリア */
        .emergency-strip-text-area {
            display: flex;
            flex-direction: column;
            gap: 2px;
            align-items: flex-start;
}

.emergency-strip-text {
            font-size: 14px;
            font-weight: 800;
            letter-spacing: .04em;
            opacity: .95;
}

.emergency-strip-tel-row {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            white-space: nowrap;
}

.emergency-strip-tel-pill {
            display: inline-block;
            background: #ffd84d;
            color: #5a3a00;
            font-size: 11px;
            font-weight: 900;
            padding: 2px 8px;
            border-radius: 4px;
            letter-spacing: .04em;
            white-space: nowrap;
}

.emergency-strip-tel-cta {
            display: none;
}

.emergency-strip-tel {
            font-family: "Oswald", sans-serif;
            font-size: 28px;
            font-weight: 800;
            letter-spacing: .04em;
            color: #fff;
            line-height: 1;
            text-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}

.emergency-strip-tel-notes {
            display: inline-flex;
            flex-direction: column;
            gap: 2px;
            margin-left: 4px;
}

.emergency-strip-tel-note {
            font-size: 11px;
            font-weight: 700;
            color: #fff;
            line-height: 1.2;
            letter-spacing: .02em;
            white-space: nowrap;
            opacity: .95;
}

.emergency-strip-tel-note::before {
            content: "✓";
            color: #ffd84d;
            margin-right: 3px;
            font-weight: 900;
}

/* アクションボタン群 */
        .emergency-strip-actions {
            display: inline-flex;
            gap: 8px;
            flex-wrap: wrap;
}

.emergency-strip-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 13px;
            font-weight: 800;
            padding: 9px 18px;
            border-radius: 50px;
            letter-spacing: .04em;
            transition: all .2s;
            white-space: nowrap;
            border: 2px solid;
}

.emergency-strip-btn:hover {
            transform: translateY(-1px);
            box-shadow: 0 4px 10px rgba(0, 0, 0, .25);
}

/* 無料会員（ファミリー会員）：ピンク（メインCTA） */
        .emergency-strip-btn--member {
            background: var(--primary);
            border-color: #fff;
            color: #fff;
            position: relative;
            margin-top: 10px;
}

.emergency-strip-btn--member:hover {
            background: #fff;
            color: var(--primary);
}

/* セルフ見積：ティール */
        .emergency-strip-btn--sim {
            background: var(--teal);
            border-color: #fff;
            color: #fff;
            position: relative;
            margin-top: 10px;
}

.emergency-strip-btn--sim:hover {
            background: #fff;
            color: var(--teal);
}

/* お問い合わせ：白アウトライン */
        .emergency-strip-btn--contact {
            background: rgba(255, 255, 255, .15);
            border-color: rgba(255, 255, 255, .6);
            color: #fff;
}

.emergency-strip-btn--contact:hover {
            background: #fff;
            color: var(--primary);
}

.emergency-strip-btn-badge {
            position: absolute;
            top: -10px;
            left: 50%;
            transform: translateX(-50%);
            background: #ffd84d;
            color: #5a3a00;
            font-size: 10px;
            font-weight: 900;
            padding: 2px 10px;
            border-radius: 50px;
            letter-spacing: .04em;
            white-space: nowrap;
            box-shadow: 0 2px 4px rgba(0, 0, 0, .15);
}

@media(max-width:768px) {
    .emergency-strip-inner {
                gap: 10px;
                padding: 12px 14px;
                justify-content: center;
    }
    .emergency-strip-phone {
                gap: 10px;
    }
    .emergency-strip-icon-wrap {
                width: 36px;
                height: 36px;
    }
    .emergency-strip-icon-svg {
                width: 18px;
                height: 18px;
    }
    .emergency-strip-text {
                font-size: 12px;
    }
    .emergency-strip-tel {
                font-size: 22px;
    }
    .emergency-strip-tel-num {
                display: none;
    }
    .emergency-strip-tel-cta {
                display: inline;
                font-family: 'Noto Sans JP', sans-serif;
                font-size: 18px;
                font-weight: 800;
    }
    .emergency-strip-actions {
                width: 100%;
                justify-content: center;
                gap: 6px;
    }
    .emergency-strip-btn {
                font-size: 13px;
                padding: 12px 14px;
                min-height: 44px;
    }
    /* スマホでは「無料会員登録」のみ表示し、長文の折り返し崩れを防ぐ */
            .emergency-strip-btn .member-sub-label {
                display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .emergency-strip-icon-svg,
            .emergency-strip-pulse {
                animation: none;
    }
}

/* ?hf=new：エリア／斎場ページの旧プラン見出し（section.plan 内の .secTit）を非表示にし、
   新プランセクション（.wgnp-section）の場所名つき見出しへ統合する。
   :has() で新セクションが実際に出力されている場合のみ隠すため、プラン未登録などで新セクションが
   出ないときは旧見出しが残る（フェイルセーフ）。:has() 非対応ブラウザでもセレクタが無視されるだけで崩れない。 */
body.wagaya-new-chrome section.plan:has(.wgnp-section) > .wi1100 > h2.secTit {
    display: none !important;
}

/* ?hf=new：本文（固定ページ/投稿のエディタ＝DB）に直書きされた「電話相談で50,000円割引」CTAを非表示。
   テーマ内には存在せず the_content で出力される本文のため、CSSで隠す。
   目印は ebis計測つき電話ボタン（a.ebis_button_trigger[href^="tel:"]）。テンプレート側のoisogi/CTAや
   ヘッダー/フッター/固定CTAには ebis 属性付きの電話リンクが無いため影響しない（page-oisogi.php 等の専用ページも安全）。
   ・section.oisogi 版：見出し（.purLabel「神奈川・西東京…」）と本文ごとセクション全体を非表示。
   ・.textBox 単体版：セクション無しで本文に textBox だけ貼られている場合のフォールバック。 */
body.wagaya-new-chrome section.oisogi:has(a.ebis_button_trigger[href^="tel:"]),
body.wagaya-new-chrome .textBox:has(a.ebis_button_trigger[href^="tel:"]) {
    display: none !important;
}

/* 本番公開：「選ばれる理由」(/reason/) はヘッダー/フッターのナビに表示する
   （旧: プレビュー時に非表示化していたルールは撤去）。
   「代行散骨」(/sankotsu-toppage/) のみ新デザインの導線から外す方針でフッター非表示を継続。 */
body.wagaya-new-chrome .site-footer .footer-col li:has(> a[href="/sankotsu-toppage/"]) {
    display: none !important;
}

/* ?hf=new：コラム記事（single-column.php）本文中の「生前相談で 割引適応！」CTAをプレビュー時のみ非表示。
   記事上部の section.oisogi.oisogi02 と本文下部の section.oisogi の2か所が対象。
   いずれもテンプレ直書きで plain な tel: リンク（ebis計測なし）のため、上の ebis ルールでは拾えなかった。
   .lower_column はコラム記事ページ専用ラッパー。専用の page-oisogi.php（.lower_oisogi）等は別ラッパーのため影響しない。 */
body.wagaya-new-chrome .lower_column section.oisogi {
    display: none !important;
}

/* ?hf=new：代行散骨／海洋散骨の旧プロモCTAをプレビュー時のみ非表示。いずれも /sankotsu-toppage/ への誘導で、
   新デザインでは代行散骨を導線から外す方針のため一括で隠す（ヘッダー/フッターのナビリンクは上のルールで対応済み）。
   ・.sankotsuBan「代行委託散骨 33,000円」… single-column.php・page-fukushisou-lp.php に直書き
     （inc/daikou_sankotsu.php 版は既にPHP側で ?hf=new 時 return し非出力）。
   ・.wagayaPln「火葬式×海洋散骨 わが家の家族葬プラン」… 本文（エディタ＝DB）直書き分。
     inc/plan.php・plan2.php の .wagayaPln.pc はプレビュー時 plan-new.php へ早期returnするため元々出力されない。
   body.wagaya-new-chrome 限定＝本番・旧クロームには影響しない。 */
body.wagaya-new-chrome .sankotsuBan,
body.wagaya-new-chrome .wagayaPln {
    display: none !important;
}



/* ===== 共通：対応エリア／マップ（template-parts/area-map.php 用） ===== */
.saijyo-head-row { display: flex; align-items: center; gap: 32px; margin-bottom: 32px; flex-wrap: wrap; }
.saijyo-head-text { flex: 1; min-width: 220px; }
.saijyo-title { font-size: 22px; font-weight: 900; color: var(--primary); margin: 0 0 14px; line-height: 1.4; }
.saijyo-desc { font-size: 18px; line-height: 1.8; color: var(--text); margin: 0; }
.saijyo-map { flex: 0 0 320px; }
.saijyo-map-img { width: 100%; height: auto; display: block; }
.saijyo-area { max-width: 900px; margin: 0 auto; }
.saijyo-pref-block { margin-bottom: 24px; }
.saijyo-pref-block:last-child { margin-bottom: 0; }
.saijyo-pref-header { background: var(--primary); color: #fff; font-size: 16px; font-weight: 700; padding: 8px 16px; border-radius: 6px 6px 0 0; margin-bottom: 0; }
.saijyo-city-grid { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid #ddd; border-top: none; }
.saijyo-city { display: flex; align-items: center; justify-content: space-between; padding: 11px 16px; font-size: 16px; color: var(--text); text-decoration: none; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; transition: background .15s, color .15s; }
.saijyo-city:nth-child(4n) { border-right: none; }
.saijyo-city:hover { background: var(--primary-pale); color: var(--primary); }
.saijyo-city span { color: var(--primary); font-weight: 700; font-size: 16px; }
.saijyo-area-note { text-align: center; font-size: 12px; color: var(--mid); margin: 14px 0 0; }
@media (max-width: 640px) {
    .saijyo-head-row { gap: 18px; margin-bottom: 24px; }
    .saijyo-title { font-size: 19px; }
    .saijyo-desc { font-size: 15px; }
    .saijyo-map { flex-basis: 100%; max-width: 280px; margin: 0 auto; }
    .saijyo-city-grid { grid-template-columns: repeat(2, 1fr); }
    .saijyo-city:nth-child(4n) { border-right: 1px solid #ddd; }
    .saijyo-city:nth-child(2n) { border-right: none; }
}