@charset "UTF-8";

/* --- 1. PC・タブレット（769px以上） --- */
@media screen and (min-width: 769px) {
    #index-list td {
        text-align: left !important;
    }
}

/* --- 2. スマホ（768px以下） --- */
@media screen and (max-width: 768px) {
    
    #index-list, #index-list tbody, #index-list tr {
        display: block !important;
        width: 100% !important;
    }

    #index-list tr:first-child { display: none !important; }

    #index-list tr {
        margin-bottom: 15px !important;
        border: none !important; 
        display: flex !important;
        flex-direction: column !important;
        background: none !important;
    }

    #index-list td {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
        text-align: center !important; 
    }

    /* --- 3. ボタン部分（透過黒背景・枠線なし） --- */
    .col-rec, 
    .col-title, 
    table#index-list:not(.live-list) .col-release {
        background-color: rgba(51, 51, 51, 0.8) !important;
        color: #ffffff !important;
        padding: 12px 15px !important;
        order: 1 !important;
        display: block !important;
        cursor: pointer;
        border: none !important; 
        border-bottom: 2px solid #fff !important; 
        border-radius: 4px;
        margin-bottom: 0 !important;
    }

    .col-rec a, .col-title a, table#index-list:not(.live-list) .col-release a {
        color: #ffffff !important;
        text-decoration: underline !important;
        display: block !important;
        text-align: center !important;
    }

    /* --- 4. アコーディオン中身 --- */
    #index-list tr:not(.is-open) .col-sub, 
    #index-list tr:not(.is-open) .col-note,
    table#index-list.live-list tr:not(.is-open) .col-release {
        display: none !important;
    }

    #index-list tr.is-open .col-sub, 
    #index-list tr.is-open .col-note,
    table#index-list.live-list tr.is-open .col-release {
        display: block !important;
        background-color: #f9f9f9 !important;
        color: #4D4D4D !important;
        padding: 12px 15px !important;
        border-top: 1px dashed #ccc !important;
        order: 2 !important;
        text-align: left !important; 
    }

    #index-list tr.is-open .col-sub a,
    #index-list tr.is-open .col-note a,
    table#index-list.live-list tr.is-open .col-release a {
        color: #4D4D4D !important;
        text-align: left !important;
        display: inline !important;
    }

    /* --- 5. ラベルの設定（「リリース」に変更済み） --- */
    .col-rec::before     { content: "収録年："; }
    .col-release::before { content: "リリース："; } /* ← ここを変更しました */
    .col-title::before   { content: "原題："; }
    .col-sub::before     { content: "邦題："; }
    .col-note::before    { content: "備考："; }
}