﻿@charset "UTF-8";

/* --- 1. ベース・全体設定 --- */
:root {
    --primary-color: #793cdc;
    --accent-orange: #F08300;
    --text-main: #333333;
    --bg-light: #f8f9fc;
    --border-color: #e2e8f0;
    --navy-base: #002360;
}

body, .textWrap {
    font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    color: var(--text-main);
    line-height: 1.8;
}

.textWrap {
    max-width: 960px;
    margin: 0 auto;
}

.textWrap p {
    margin-bottom: 32px;
    font-size: 17px;
    line-height: 2.05 !important;
    letter-spacing: .02em;
    color: #333 !important;
}

.textWrap p:last-child {
    margin-bottom: 0;
}

/* --- 2. サブタイトル（元の24pxを正確に維持） --- */
.subTitle {
    max-width: 900px;
    margin: 50px auto 30px !important;
    padding: 26px 30px !important;
    font-size: 24px !important; /* 元のサイズ（24px）に固定 */
    font-weight: bold !important;
    color: var(--navy-base) !important;
    line-height: 1.45 !important;
    border-radius: 14px !important;
    border-left: 8px solid var(--navy-base) !important;
    background: linear-gradient(to right, #f4f7fb, #eef3f9) !important;
    box-shadow: 0 4px 20px rgba(0,0,0,.04);
}

/* --- 3. 見出し（H2 / H3） --- */
h2, .textWrap h2 {
    font-size: 30px !important;
    line-height: 1.45 !important;
    margin: 85px 0 35px !important;
    padding: 0 0 0 18px !important;
    background: none !important;
    color: var(--navy-base) !important;
    border-left: 6px solid var(--navy-base) !important;
    border-radius: 0 !important;
    font-weight: 800 !important;
    letter-spacing: .02em;
    box-shadow: none !important;
}

h3, .textWrap h3 {
    font-size: 22px !important;
    line-height: 1.5 !important;
    margin: 55px 0 24px !important;
    padding: 0 0 10px 14px !important;
    border-left: 5px solid var(--navy-base) !important;
    border-bottom: 1px solid #dbe4f0 !important;
    background: none !important;
    font-weight: 700 !important;
    color: var(--navy-base) !important;
}

/* --- 4. 目次（ep-box / toc-list） --- */
.ep-box {
    background: #f8fafc !important;
    border: 1px solid #e5eaf3 !important;
    border-radius: 18px !important;
    padding: 25px !important;
    margin: 40px 0;
    box-shadow: 0 3px 15px rgba(0,0,0,.03);
}

.toc-list {
    counter-reset: toc-number;
    list-style: none;
    padding: 0;
    margin: 0;
}

.toc-list li {
    counter-increment: toc-number;
    border-bottom: 1px solid #e5e7eb;
}

.toc-list li:last-child {
    border-bottom: none;
}

.toc-list a {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 0;
    color: var(--navy-base) !important;
    text-decoration: none !important;
    font-weight: 500;
    font-size: 16px !important;
    line-height: 1.5 !important;
    transition: .2s;
}

.toc-list a::before {
    content: counter(toc-number, decimal-leading-zero);
    font-size: 14px;
    font-weight: 700;
    color: #94a3b8;
    min-width: 24px;
}

.toc-list a:hover {
    opacity: .7;
    padding-left: 4px;
}

/* --- 5. ボックスデザイン（メリット・デメリット・重要ポイント） --- */
.merit-box, .demerit-box {
    margin: 45px 0 !important;
    padding: 30px !important;
    border-radius: 16px !important;
    line-height: 1.95 !important;
    font-size: 16px;
    color: #222222 !important;
    border: none !important;
    box-shadow: 0 4px 18px rgba(0,0,0,.04);
}

.merit-box {
    background: #f3fbf5 !important;
}

.demerit-box {
    background: #fff5f5 !important;
}

.box-title {
    display: block;
    font-size: 20px !important;
    font-weight: bold !important;
    margin-bottom: 18px !important;
}

.merit-box .box-title { color: #1b5e20 !important; }
.demerit-box .box-title { color: #991b1b !important; }

.important-point {
    background: #fff8e8;
    border-left: 5px solid #f0a500;
    padding: 20px 24px;
    border-radius: 12px;
    margin: 40px 0;
    line-height: 1.95;
    font-size: 16px;
    color: #333;
    box-shadow: 0 3px 12px rgba(0,0,0,.04);
}

.point-title {
    font-size: 18px;
    font-weight: 700;
    color: #222;
    margin: 15px 0 0px !important;
    line-height: 1.3 !important;
}

.point-title + p {
    margin-top: 4px !important;
    margin-bottom: 8px !important;
}

.merit-box p, 
.demerit-box p, 
.important-point p {
    margin-bottom: 8px !important;
    line-height: 1.7 !important;
}

.merit-box p:last-child, 
.demerit-box p:last-child, 
.important-point p:last-child {
    margin-bottom: 0 !important;
}

/* --- 6. 商品カード --- */
.item-box {
    display: flex;
    flex-wrap: wrap;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 40px;
    box-shadow: none;
    transition: none;
}

.item-img {
    width: 35%;
    line-height: 0;
}

.item-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 0;
}

.item-card {
    width: 65%;
    padding: 30px !important;
}

.item-text {
    font-size: 16px !important;
    line-height: 1.95 !important;
    color: #333 !important;
    margin-bottom: 20px;
}

.item-text p {
    margin: 0 0 6px !important;
    line-height: 1.7 !important;
}

.item-text p:last-child {
    margin-bottom: 0 !important;
}

.item-title h4.item-product-name {
    font-size: 20px !important;
    font-weight: 700 !important;
    margin: 0 0 12px !important;
    line-height: 1.5 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
}

.item-product-name a {
    color: var(--navy-base) !important;
    text-decoration: none !important;
    transition: .2s;
}

.item-product-name a:hover {
    text-decoration: underline !important;
    opacity: .75;
}

.bottom02 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 34px !important;
    border-radius: 999px !important;
    background: var(--accent-orange) !important;
    color: #fff !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    border: none !important;
    box-shadow: 0 8px 20px rgba(240,131,0,.25) !important;
    transition: all .25s ease !important;
}

.bottom02:hover {
    transform: translateY(-2px);
    opacity: .92;
    box-shadow: 0 12px 25px rgba(240,131,0,.32) !important;
}

.bottom02.btn-outlet-red {
    background: #c0392b !important;
    color: #ffffff !important;
    box-shadow: 0 8px 20px rgba(240,131,0,.25) !important;
}

.bottom02.btn-outlet-red:hover {
    background: #a93226 !important;
    transform: translateY(-2px);
    opacity: .92;
    box-shadow: 0 12px 25px rgba(240,131,0,.32) !important;
}

.bottom-box {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
}

.bottom02.btn-st,
.bottom02.btn-al {
    min-width: 200px;
    justify-content: center;
    font-weight: 700;
    transition: all .25s ease;
}

.bottom02.btn-st {
    background: #ffffff !important;
    color: #222222 !important;
    border: 1px solid #222222 !important;
    box-shadow: 0 6px 16px rgba(0,0,0,.06), 0 2px 4px rgba(0,0,0,.04) !important;
}

.bottom02.btn-st:hover {
    background: #222222 !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    opacity: 1 !important;
    box-shadow: 0 10px 22px rgba(0,0,0,.14), 0 4px 8px rgba(0,0,0,.08) !important;
}

.bottom02.btn-al {
    background: linear-gradient(180deg, #aeb8c2 0%, #8f9ba8 100%) !important;
    color: #ffffff !important;
    border: 1px solid #8f9ba8 !important;
    box-shadow: 0 6px 16px rgba(120,130,145,.24), 0 2px 4px rgba(120,130,145,.14) !important;
}

.bottom02.btn-al:hover {
    color: #ffffff !important;
    transform: translateY(-2px);
    opacity: .96 !important;
    box-shadow: 0 12px 28px rgba(71, 85, 105, .28), 0 4px 10px rgba(71, 85, 105, .18) !important;
}

.tag-outlet {
    background-color: #c0392b;
    color: #ffffff;
    font-size: 14px;
    padding: 0px 5px;
    vertical-align: middle;
    border-radius: 3px;
    display: inline-block;
    font-weight: bold;
    line-height: 1.3;
}

/* --- 7. CTA / お問い合わせセクション --- */
.cta-container {
    max-width: 800px;
    margin: 80px auto !important;
    text-align: center;
}

.cta-buttons {
    display: flex;
    gap: 20px;
    justify-content: center;
    margin-top: 20px;
}

.cta-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    font-weight: bold;
    transition: all 0.2s;
    cursor: pointer;
    flex: 1;
    padding: 15px 20px;
    border-radius: 16px !important;
    min-height: 76px !important;
    font-size: 18px !important;
    box-shadow: 0 6px 20px rgba(0,0,0,.08) !important;
}

.btn-mail {
    background: #2e7d32 !important;
    color: #fff !important;
}

.btn-mail:hover {
    background: #256629 !important;
    transform: translateY(-2px);
    opacity: 1 !important;
}

.btn-tel {
    background: var(--accent-orange) !important;
    color: #fff !important;
}

.btn-tel:hover {
    background: #e67a00 !important;
    transform: translateY(2px);
    opacity: 1 !important;
}

/* --- 8. ご相談窓口（Ezup Guide） --- */
.ezup-guide-section {
    width: 100%;
    max-width: 900px;
    margin: 60px auto;
}

.ezup-guide-container {
    display: flex;
    gap: 20px;
    justify-content: space-between;
}

.ezup-guide-card {
    flex: 1;
    background: #fff;
    border: 1px solid #e5e7eb !important;
    border-radius: 14px !important;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 2px 10px rgba(0,0,0,.04) !important;
}

.ezup-guide-card h3.ezup-guide-title-special {
    border: none !important;
    background: none !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 20px !important;
    line-height: 1.4 !important;
    font-weight: bold !important;
    box-shadow: none !important;
}

.ezup-guide-heading-box {
    padding: 20px;
    text-align: center;
    min-height: 110px !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bg-green-light { background-color: #f0fdf4 !important; }
.bg-orange-light { background-color: #fff7ed !important; }

.ezup-guide-text {
    padding: 20px;
    font-size: 15px;
    color: #444;
    flex-grow: 1;
    line-height: 1.95 !important;
}

.ezup-guide-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    font-weight: bold;
    transition: all 0.2s;
    cursor: pointer;
    margin: 0 20px 25px;
    padding: 12px;
    border-radius: 8px;
    text-align: center;
}

.btn-green {
    background: #2e7d32 !important;
    color: #fff !important;
}

.btn-green:hover {
    background: #256629 !important;
    transform: translateY(-2px);
    opacity: 1 !important;
}

.btn-orange {
    background: #f97316 !important;
    color: #fff !important;
}

.btn-orange:hover {
    background: #ea6b00 !important;
    transform: translateY(2px);
    opacity: 1 !important;
}

/* --- 9. 動画セクション --- */
.movie-intro {
    margin: 50px 0 25px;
    text-align: center;
}

.movie-intro-title {
    display: inline-block;
    font-size: 24px;
    font-weight: 700;
    color: var(--navy-base);
    margin-bottom: 15px;
    padding-bottom: 8px;
    border-bottom: 3px solid var(--navy-base);
}

.movie-wrap {
    text-align: center;
}

.movie-wrap iframe {
    width: 100%;
    max-width: 760px;
    border-radius: 0;
    box-shadow: none;
}

/* --- 10. 共通テキストリンク・装飾 --- */
.text-link {
    color: var(--navy-base);
    text-decoration: underline;
    text-underline-offset: 3px;
    font-weight: 500;
    transition: .2s;
}

.text-link:hover {
    opacity: .7;
}

.text-center { text-align: center; }

/* --- 11. SNSアイコンエリア（JS生成タグ対応版） --- */
.sns-container {
    width: 100%;
    max-width: 900px;
    margin: 40px auto !important;
    clear: both !important;
    display: block !important;
}

.sns-container ul {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 15px !important;
}

.sns-container li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.sns-container img {
    display: block !important;
    width: 40px !important;
    height: auto !important;
    border-radius: 6px !important;
    transition: all .2s !important;
}

.sns-container a:hover img {
    transform: translateY(-2px) scale(1.08) !important;
}

/* --- 12. ページトップへ戻るボタン --- */
.back-to-top {
    position: fixed !important;
    left: calc(50% + 480px) !important;
    bottom: 30px !important;
    width: 54px !important;
    height: 54px !important;
    background-color: var(--navy-base) !important;
    color: #fff !important;
    border-radius: 999px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    font-size: 24px !important;
    z-index: 99999 !important;
    opacity: 0.8 !important;
    text-decoration: none !important;
    box-shadow: 0 6px 20px rgba(0,0,0,.18);
    transition: .2s;
}

.back-to-top::before { content: "▲"; }

.back-to-top:hover {
    transform: translateY(-3px);
    opacity: 1 !important;
}

/* --- 13. スマートフォン対応（レスポンシブ共通設定） --- */
@media (max-width: 768px) {
    .textWrap {
        padding: 0 14px;
    }

    .textWrap p {
        font-size: 16px !important;
        line-height: 2 !important;
    }

    h2, .textWrap h2 {
        font-size: 24px !important;
        margin: 65px 0 28px !important;
        line-height: 1.5 !important;
    }

    h3, .textWrap h3 {
        font-size: 20px !important;
        margin: 45px 0 20px !important;
    }

    .subTitle {
        font-size: 22px !important;
        padding: 20px !important;
        margin: 30px 15px 20px !important;
    }

    .item-box, .cta-buttons, .ezup-guide-container {
        flex-direction: column !important;
    }

    .item-img, .item-card, .cta-btn, .ezup-guide-card {
        width: 100% !important;
        margin-bottom: 15px;
    }

    .bottom-box {
        display: flex !important;
        flex-direction: column !important; /* スマホでは縦並びにする */
        gap: 12px !important;
    }
    .bottom02 {
        width: 100% !important; /* 横幅いっぱい */
        box-sizing: border-box !important;
        padding: 14px 20px !important;
    }

    .item-card {
        padding: 22px !important;
    }

    .merit-box, .demerit-box, .important-point {
        padding: 22px !important;
    }

    .cta-btn {
        font-size: 17px !important;
    }

    .sns-container ul {
        justify-content: center !important;
    }

    .back-to-top {
        left: 15px !important;
        bottom: 110px !important;
        width: 48px !important;
        height: 48px !important;
    }
} /* ★バグ修正：スマホ用メディアクエリをここで正しく独立して閉じました */

/* --- 14. 危険性エリア --- */
.danger-abel {
    display: inline-block;
    margin-bottom: 14px;
    padding: 8px 14px;
    background: #fff4e5;
    color: #c2410c;
    font-size: 14px;
    font-weight: 700;
    border-radius: 999px;
    line-height: 1.5;
}

/* --- 15. テント重り比較表（通常仕様ベース） --- */
/* ★重要：18番以降にも同じクラス名があるため、影響が出ないようバグの原因となる入れ子を排除しました */
.ezup-table-container {
    max-width: 650px !important; /* 基本の表はスリム化を維持 */
    margin: 45px auto !important;
    overflow-x: auto;
    box-shadow: 0 4px 18px rgba(0,0,0,.04);
    border-radius: 16px;
    border: 1px solid var(--border-color);
    background: #ffffff;
    -webkit-overflow-scrolling: touch; 
}

.ezup-comparison-table {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
    background-color: #ffffff;
    font-size: 16px;
    line-height: 1.8;
    table-layout: fixed; 
}

.ezup-comparison-table th, 
.ezup-comparison-table td {
    padding: 20px 24px;
    border-bottom: 1px solid var(--border-color);
    vertical-align: middle;
}

.ezup-comparison-table th {
    background-color: var(--navy-base) !important;
    color: #ffffff !important;
    font-weight: bold;
}

.ezup-comparison-table th:nth-child(1),
.ezup-comparison-table td:nth-child(1) {
    width: 140px !important;
    background-color: var(--bg-light);
    font-weight: bold;
    color: #222222;
    white-space: nowrap;
}

.ezup-comparison-table th:nth-child(2),
.ezup-comparison-table td:nth-child(2),
.ezup-comparison-table th:nth-child(3),
.ezup-comparison-table td:nth-child(3) {
    width: calc((100% - 140px) / 2) !important; 
}

.ezup-comparison-table thead th:nth-child(1) {
    background-color: var(--navy-base) !important;
    color: #ffffff !important;
}

.ezup-comparison-table tr:last-child td {
    border-bottom: none;
}

.ezup-text-merit {
    color: #1b5e20;
    font-weight: bold;
    display: inline-block;
    margin-bottom: 8px;
    font-size: 18px;
}

.ezup-text-demerit {
    color: #991b1b;
    font-weight: bold;
    display: inline-block;
    margin-bottom: 8px;
    font-size: 18px;
}

.ezup-bullet-list {
    margin: 0;
    padding-left: 20px;
    list-style-type: disc;
}

.ezup-bullet-list li {
    margin-bottom: 6px;
    font-size: 15px;
    color: #333;
}

.ezup-bullet-list li:last-child {
    margin-bottom: 0;
}

/* --- 15-sp. スマホ対応（通常仕様用レスポンシブ） --- */
@media (max-width: 768px) {
    .ezup-table-container {
        margin: 35px 0 !important;
        border-radius: 12px;
    }    

    .ezup-comparison-table {
        font-size: 14px;
        width: 680px !important;
    }
    
    .ezup-comparison-table th:nth-child(1),
    .ezup-comparison-table td:nth-child(1) {
        width: 100px !important;
    }
    
    .ezup-comparison-table th:nth-child(2),
    .ezup-comparison-table td:nth-child(2),
    .ezup-comparison-table th:nth-child(3),
    .ezup-comparison-table td:nth-child(3) {
        width: 290px !important; 
    }

    .ezup-comparison-table th, 
    .ezup-comparison-table td {
        padding: 14px 12px;
    }
    
    .ezup-bullet-list li {
        font-size: 13px;
    }
}

/* ========================================================
   16. 使用環境・材質セクション：PC用レイアウト
========================================================= */
.env-pc-container {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.env-pc-table {
    display: table !important;
    width: 100% !important;
    margin-top: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 25px !important;
    border-bottom: 1px dashed #eee !important;
    padding-bottom: 25px !important;
    box-sizing: border-box !important;
}

.env-pc-table-last {
    margin-bottom: 0 !important;
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

/* 左側：画像セル */
.env-pc-cell-img {
    display: table-cell !important;
    width: 300px !important;
    max-width: 300px !important;
    vertical-align: top !important;
    float: none !important; 
    padding: 0 !important;
}

/* 右側：テキストセル */
.env-pc-cell-text {
    display: table-cell !important;
    vertical-align: middle !important;
    padding-left: 25px !important;
    text-align: left !important;
    float: none !important;
}

/* ========================================================
   17. 使用環境・材質セクション：スマートフォン用設定（横幅767px以下）
========================================================= */
@media screen and (max-width: 767px) {
    .env-pc-table {
        display: block !important; /* テーブル組みを解除して完全縦並びに */
        margin-bottom: 30px !important;
        padding-bottom: 30px !important;
        width: 100% !important;
    }
    .env-pc-cell-img {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-bottom: 15px !important;
    }
    .env-pc-cell-text {
        display: block !important;
        width: 100% !important;
        padding-left: 0 !important;
    }
    .env-pc-cell-text .env-title-label {
        font-size: 17px !important;
        display: block !important;
        text-align: center !important;
    }
}

/* ========================================================
   18. テント仕様・比較表（共通ベース）
========================================================= */
.ezup-comparison-table thead tr {
    border-bottom: 1px solid var(--border-color) !important;
}

.ezup-comparison-table thead td.cell-border-right {
    font-weight: bold !important;
    text-align: center !important;
    color: #333333 !important;
}

.ezup-comparison-table tbody tr {
    border-bottom: 1px dashed #999999 !important;
}

/* 各ヘッダーの個別スタイル設定 */
.ezup-comparison-table th.table-header-gradient {
    background: linear-gradient(180deg, #e52d6a 0%, #b30d43 100%) !important;
    color: #ffffff !important;
    padding: 12px !important;
    font-weight: bold !important;
    border-right: 1px solid #dddddd !important;
}

.ezup-comparison-table th.table-header-steel {
    background-color: #f2f2f2 !important;
    color: #333333 !important;
    padding: 12px !important;
    font-weight: bold !important;
    font-size: 16px !important;
    border-bottom: 1px solid #dddddd !important;
    border-right: 1px solid #dddddd !important;
}

.ezup-comparison-table th.table-header-alum {
    background-color: #666666 !important;
    color: #ffffff !important;
    padding: 12px !important;
    font-weight: bold !important;
    font-size: 16px !important;
}

/* 左端カラム（行見出し）共通のグラデーション */
.ezup-comparison-table td.row-header-gradient {
    background: linear-gradient(180deg, #e52d6a 0%, #b30d43 100%) !important;
    font-weight: bold !important;
    border-right: 1px solid #dddddd !important;
}

/* データセル共通の背景色 */
.ezup-comparison-table td.cell-bg-white {
    background-color: #ffffff !important;
}

.ezup-comparison-table td.cell-border-right {
    border-right: 1px solid #dddddd !important;
}

/* ========================================================
   19. 1つ目の表（デラックス重量表）専用設定
========================================================= */
.ezup-comparison-table td.dx-size-label {
    color: #ffffff !important;
    padding: 15px 8px !important;
    font-size: 16px !important;
}

.ezup-comparison-table td.dx-weight-data {
    padding: 12px 8px !important;
    line-height: 1.4 !important;
}

.ezup-comparison-table td.dx-weight-data strong {
    font-size: 18px !important;
}

.ezup-comparison-table td.dx-weight-data span {
    font-size: 13px !important;
    color: #555555 !important;
}

/* ========================================================
   20. 2つ目の表（特徴比較表）専用設定
========================================================= */
.ezup-comparison-table td.feat-item-label {
    color: #ffff00 !important;
    padding: 15px 8px !important;
    font-size: 16px !important;
}

.ezup-comparison-table td.feat-text-large {
    padding: 15px !important;
    font-weight: bold !important;
    font-size: 18px !important;
}

.ezup-comparison-table td.feat-text-detail {
    padding: 12px 8px !important;
    line-height: 1.5 !important;
}

.ezup-comparison-table td.feat-text-detail span {
    font-size: 13px !important;
    color: #555555 !important;
    font-weight: bold !important;
}

/* 記事内で使い回せるH3見出しのデザイン */
h3.ezup-section-h3 {
    font-size: 20px !important;
    font-weight: bold !important;
    color: #333333 !important;
    padding-left: 12px !important;
    border-left: 5px solid #e52d6a !important;
    margin: 40px 0 20px 0 !important;
    line-height: 1.4 !important;
}

/* ========================================================
   21. ラベル風タイトル共通デザイン
========================================================= */
h4.card-title-label,
.card-title-label {
    margin: 0 0 12px 0 !important;
    font-size: 20px !important;
    color: #1b365d !important;
    font-weight: bold !important;
    line-height: 1.4 !important;
    background: #f0f4f8 !important;
    padding: 6px 12px !important;
    display: inline-block !important;
    border-radius: 4px !important;
    border: none !important;
    text-align: left !important;
}

/* 使用環境セクションの外枠 */
.env-pc-container {
    padding: 20px !important;
    background: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 4px !important;
    margin-bottom: 30px !important;
}

.env-pc-cell-img img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    border-radius: 4px !important;
}

.env-pc-cell-text div {
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #555555 !important;
}

/* ========================================================
   22. ご予算で選ぶセクション：単一カード内複数ラベル設定
========================================================= */
.env-pc-cell-text h4.card-title-label-secondary {
    margin: 20px 0 12px 0 !important;
}

/* ========================================================
   23. ウエイト比較表専用（この表だけPC幅いっぱいに広げる）
========================================================= */
/* PC表示のとき、後半の「スリム化（max-width: 650px）」の制限を解除して960pxいっぱいまで広げる */
.ezup-weight-table {
    max-width: 100% !important;
    margin: 45px auto !important;
}

/* この表だけは文字量が多いので横幅の固定（table-layout: fixed）を解除 */
.ezup-weight-table .ezup-comparison-table {
    table-layout: auto !important; 
}

/* ヘッダーとセル内のテキスト配置を最適化 */
.ezup-weight-table .ezup-comparison-table th {
    text-align: center !important; /* 見出しは中央 */
}

.ezup-weight-table .ezup-comparison-table td {
    text-align: left !important; /* メリット・デメリットの文章は左寄せ */
}

/* 各列の横幅バランスを文字数に応じて最適化 */
.ezup-weight-table .ezup-comparison-table th:nth-child(1),
.ezup-weight-table .ezup-comparison-table td:nth-child(1) {
    width: 140px !important;
    white-space: nowrap;
    background-color: var(--bg-light);
    color: #222222;
}

.ezup-weight-table .ezup-comparison-table th:nth-child(2),
.ezup-weight-table .ezup-comparison-table td:nth-child(2),
.ezup-weight-table .ezup-comparison-table th:nth-child(3),
.ezup-weight-table .ezup-comparison-table td:nth-child(3) {
    width: auto !important; /* 文字数に合わせて自動で最適な幅に調整 */
}

/* スマホ表示（768px以下）のときは、使いやすい横スクロール仕様を維持 */
@media (max-width: 768px) {
    .ezup-weight-table .ezup-comparison-table {
        width: 680px !important;
        table-layout: fixed !important;
    }
    .ezup-weight-table .ezup-comparison-table th:nth-child(1),
    .ezup-weight-table .ezup-comparison-table td:nth-child(1) {
        width: 100px !important;
    }
    .ezup-weight-table .ezup-comparison-table th:nth-child(2),
    .ezup-weight-table .ezup-comparison-table td:nth-child(2),
    .ezup-weight-table .ezup-comparison-table th:nth-child(3),
    .ezup-weight-table .ezup-comparison-table td:nth-child(3) {
        width: 290px !important; 
    }
}