/* ==========================================================================
   修正: PC版専用モーダル（サイズ固定・中央配置・親テーマ干渉リセット）
   ========================================================================= */
@media screen and (min-width: 769px) {
    /* 1. モーダル本体（白い箱） */
    .c-modal__inner {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        /* 中央に配置しつつ、少し小さめの状態からアニメーションさせる */
        transform: translate(-50%, -50%) scale(0.95) !important;
        
        width: 560px !important; 
        max-width: 90vw !important;
        height: auto !important;
        max-height: 85vh !important;
        
        background: #fff !important;
        border-radius: 20px !important;
        box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15) !important;
        overflow: hidden !important;
        display: flex !important;
        flex-direction: column !important;
    }

    /* オープンした時のアニメーション */
    .c-modal.-open .c-modal__inner {
        transform: translate(-50%, -50%) scale(1) !important;
    }

    /* 2. ヘッダー：閉じるボタンの基準点となるよう修正 */
    .c-modal__header {
        position: relative !important; /* ボタンを内側に配置するための基準 */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 20px !important;
        min-height: 64px !important;
        border-bottom: 1px solid #eee !important;
    }

    /* 3. タイトル */
    .c-modal__title {
        margin: 0 !important;
        font-size: 18px !important;
        font-weight: bold !important;
        color: #333 !important;
        text-align: center !important;
        width: auto !important;
    }

    /* 4. 閉じるボタン：親テーマの強力な設定（top:100%など）を完全に殺す */
    .c-modal__close {
        /* 配置リセット */
        position: absolute !important;
        top: 50% !important;           /* 100%から50%へ戻す */
        right: 20px !important;        /* 右端に固定 */
        left: auto !important;         /* 親のleft:0を解除 */
        transform: translateY(-50%) !important; /* 上下中央揃え */
        
        /* サイズ・領域リセット */
        width: 40px !important;        /* 100%を解除 */
        height: 40px !important;       /* 高さを固定 */
        margin: 0 !important;
        padding: 0 !important;
        
        /* 見た目リセット */
        display: flex !important;
        align-items: center;
        justify-content: center;
        background: none !important;
        border: none !important;
        font-size: 28px !important;
        line-height: 1 !important;
        color: #999 !important;
        text-shadow: none !important;
        cursor: pointer !important;
        z-index: 10 !important;
    }

    .c-modal__close:hover {
        color: #333 !important;
    }

    /* 5. ボディ（スクロールエリア） */
    .c-modal__body {
        padding: 30px !important;
        overflow-y: auto !important;
    }

    /* 6. フッターのボタンレイアウト */
    .c-modal__actions {
        display: flex !important;
        gap: 16px !important;
        justify-content: center !important;
    }

    .c-modal__actions .c-btn {
        height: 54px !important;
        border-radius: 27px !important;
        font-size: 16px !important;
        font-weight: bold !important;
    }

    .c-modal__actions .c-btn.-gray {
        flex: 1 !important;
        background: #f5f5f5 !important;
        border: none !important;
        color: #333 !important;
    }

    .c-modal__actions .c-btn.-orange {
        flex: 2 !important;
    }
}