/* ===================================================================
   特別プログラムセクション - PC版横並び・全体サイズダウン
   ================================================================ */

/* デフォルト (モバイル): 縦並び */
.special-programs-grid {
    display: block;
}

/* PC版: 特別プログラムヘッダーのサイズダウン */
@media screen and (min-width: 769px) {
    /* 特別プログラムのヘッダーセクション */
    section[style*="padding: 60px 0 0 0"] h2 {
        font-size: 2rem !important; /* 2.5rem → 2rem (約20%削減) */
        margin-bottom: 12px !important;
    }
    
    section[style*="padding: 60px 0 0 0"] p {
        font-size: 1rem !important; /* 1.125rem → 1rem */
        line-height: 1.6 !important;
    }
    
    section[style*="padding: 60px 0 0 0"] {
        padding: 40px 0 0 0 !important; /* 60px → 40px */
    }
    
    /* 特別プログラムカードを2カラムグリッドレイアウトに */
    .special-programs-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }
    
    /* 各カードのサイズダウン */
    .special-service-section {
        padding-top: 0 !important;
    }
    
    .special-service-card {
        position: relative !important; /* バッジの位置調整のため */
        padding: 25px !important; /* 通常のパディング */
        height: 100%; /* カードの高さを揃える */
        display: flex;
        flex-direction: column;
        overflow: visible !important; /* バッジが見切れないように */
    }
    
    .special-service-content {
        display: flex;
        flex-direction: column;
        flex: 1;
    }
    
    .special-service-left {
        flex: 1;
    }
    
    .special-badge {
        position: absolute !important;
        top: 15px !important; /* カードの上端の内側 */
        left: 15px !important; /* カードの左端の内側 */
        font-size: 0.75rem !important;
        padding: 6px 16px !important;
        margin-bottom: 0 !important;
        background: linear-gradient(135deg, #ff3333 0%, #ff5555 100%) !important;
        color: white !important;
        border-radius: 25px !important;
        box-shadow: 0 3px 10px rgba(255, 51, 51, 0.4) !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        z-index: 10 !important;
        white-space: nowrap !important;
        font-weight: 600 !important;
    }
    
    .special-badge .badge-icon {
        font-size: 1rem !important;
    }
    
    .special-badge .badge-text {
        font-weight: 600 !important;
        letter-spacing: 0.03em !important;
    }
    
    .special-service-title {
        font-size: 1.4rem !important; /* サイズダウン */
        margin-top: 35px !important; /* バッジとの間隔を確保 */
        margin-bottom: 12px !important;
        line-height: 1.3 !important;
    }
    
    .special-service-title .subtitle {
        font-size: 0.813rem !important;
        display: block;
        margin-top: 5px;
    }
    
    .special-service-description {
        font-size: 0.875rem !important; /* サイズダウン */
        line-height: 1.6 !important;
        margin-bottom: 15px !important;
    }
    
    .special-service-features {
        margin: 15px 0 !important;
        gap: 10px !important;
        display: flex !important;
        flex-wrap: wrap !important;
    }
    
    .feature-item {
        font-size: 0.75rem !important;
        padding: 6px 10px !important;
    }
    
    .feature-item i {
        font-size: 0.875rem !important;
        margin-right: 5px;
    }
    
    .price-box {
        padding: 15px !important;
        margin: 15px 0 !important;
    }
    
    .price-label {
        font-size: 0.75rem !important;
    }
    
    .price {
        font-size: 1.75rem !important; /* サイズダウン */
    }
    
    .price .tax {
        font-size: 0.75rem !important;
    }
    
    .price-note {
        font-size: 0.75rem !important;
    }
    
    .limit-badge {
        font-size: 0.75rem !important;
        padding: 4px 12px !important;
    }
    
    .special-cta-button {
        font-size: 0.938rem !important;
        padding: 12px 24px !important;
    }
}

/* スマホ版: 特別プログラム全体をサイズダウン */
@media screen and (max-width: 768px) {
    /* 特別プログラムのヘッダーセクション */
    section[style*="padding: 60px 0 0 0"] {
        padding: 30px 0 0 0 !important; /* 60px → 30px */
    }
    
    section[style*="padding: 60px 0 0 0"] h2 {
        font-size: 1.75rem !important; /* 2.5rem → 1.75rem (30%削減) */
        margin-bottom: 10px !important;
    }
    
    section[style*="padding: 60px 0 0 0"] p {
        font-size: 0.875rem !important; /* 1.125rem → 0.875rem */
        line-height: 1.5 !important;
    }
    
    /* 特別プログラムカード */
    .special-service-section {
        padding-top: 20px !important; /* 50px → 20px */
    }
    
    .special-service-card {
        position: relative !important;
        padding: 20px !important; /* 通常のパディング */
        overflow: visible !important;
    }
    
    .special-badge {
        position: absolute !important;
        top: 12px !important; /* カードの上端の内側 */
        left: 12px !important; /* カードの左端の内側 */
        font-size: 0.688rem !important;
        padding: 5px 14px !important;
        margin-bottom: 0 !important;
        background: linear-gradient(135deg, #ff3333 0%, #ff5555 100%) !important;
        color: white !important;
        border-radius: 25px !important;
        box-shadow: 0 3px 10px rgba(255, 51, 51, 0.4) !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 5px !important;
        z-index: 10 !important;
        white-space: nowrap !important;
        font-weight: 600 !important;
    }
    
    .special-badge .badge-icon {
        font-size: 0.875rem !important;
    }
    
    .special-badge .badge-text {
        font-weight: 600 !important;
        letter-spacing: 0.03em !important;
    }
    
    .special-service-title {
        font-size: 1.25rem !important; /* サイズダウン */
        margin-top: 30px !important; /* バッジとの間隔を確保 */
        margin-bottom: 10px !important;
    }
    
    .special-service-title .subtitle {
        font-size: 0.75rem !important;
    }
    
    .special-service-description {
        font-size: 0.813rem !important; /* サイズダウン */
        line-height: 1.5 !important;
        margin-bottom: 12px !important;
    }
    
    .special-service-features {
        margin: 12px 0 !important;
        gap: 8px !important;
    }
    
    .feature-item {
        font-size: 0.75rem !important;
        padding: 6px 10px !important;
    }
    
    .feature-item i {
        font-size: 0.875rem !important;
    }
    
    .price-box {
        padding: 12px !important;
        margin-bottom: 12px !important;
    }
    
    .price-label {
        font-size: 0.688rem !important;
    }
    
    .price {
        font-size: 1.5rem !important; /* サイズダウン */
    }
    
    .price-note {
        font-size: 0.688rem !important;
    }
    
    .limit-badge {
        font-size: 0.688rem !important;
        padding: 3px 10px !important;
    }
    
    .special-cta-button {
        font-size: 0.875rem !important;
        padding: 10px 20px !important;
    }
}