/**
 * テーブル表示設定 - フロントエンド用CSS
 */

/* デバイス別表示制御 */
@media (min-width: 768px) {

    /* PC表示時：スマホ専用テーブルを非表示 */
    table[data-device-visibility="sp"] {
        display: none !important;
    }
}

@media (max-width: 767px) {

    /* スマホ表示時：PC専用テーブルを非表示 */
    table[data-device-visibility="pc"] {
        display: none !important;
    }

    /* 横スクロール設定 */
    table[data-table-scroll-sp] {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    table[data-table-scroll-sp="500"] {
        width: 500px !important;
    }

    table[data-table-scroll-sp="600"] {
        width: 600px !important;
    }

    table[data-table-scroll-sp="700"] {
        width: 700px !important;
    }

    table[data-table-scroll-sp="800"] {
        width: 800px !important;
    }

    table[data-table-scroll-sp="900"] {
        width: 900px !important;
    }

    table[data-table-scroll-sp="1000"] {
        width: 1000px !important;
    }

    /* 先頭列固定 */
    table[data-table-fixed-start-column-sp] {
        position: relative;
        table-layout: fixed !important;
        height: auto !important;
        border-collapse: separate;
        border-spacing: 1px;
    }
    table[data-table-fixed-start-column-sp] th,
    table[data-table-fixed-start-column-sp] td{
        box-shadow: 0 0 0 1px currentColor;
        border: none;
    }

    table[data-table-fixed-start-column-sp] th:first-child,
    table[data-table-fixed-start-column-sp] td:first-child {
        position: sticky;
        left: 1px;
        background: #fff;
        z-index: 2;
    }

    /* 先頭列以外の列の幅を自動調整 */
    table[data-table-fixed-start-column-sp] th:not(:first-child),
    table[data-table-fixed-start-column-sp] td:not(:first-child) {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    table[data-table-fixed-start-column-sp="50"] th:first-child,
    table[data-table-fixed-start-column-sp="50"] td:first-child {
        width: 50px !important;
    }

    table[data-table-fixed-start-column-sp="60"] th:first-child,
    table[data-table-fixed-start-column-sp="60"] td:first-child {
        width: 60px !important;
    }

    table[data-table-fixed-start-column-sp="70"] th:first-child,
    table[data-table-fixed-start-column-sp="70"] td:first-child {
        width: 70px !important;
    }

    table[data-table-fixed-start-column-sp="80"] th:first-child,
    table[data-table-fixed-start-column-sp="80"] td:first-child {
        width: 80px !important;
    }

    table[data-table-fixed-start-column-sp="90"] th:first-child,
    table[data-table-fixed-start-column-sp="90"] td:first-child {
        width: 90px !important;
    }

    table[data-table-fixed-start-column-sp="100"] th:first-child,
    table[data-table-fixed-start-column-sp="100"] td:first-child {
        width: 100px !important;
    }

    table[data-table-fixed-start-column-sp="110"] th:first-child,
    table[data-table-fixed-start-column-sp="110"] td:first-child {
        width: 110px !important;
    }

    table[data-table-fixed-start-column-sp="120"] th:first-child,
    table[data-table-fixed-start-column-sp="120"] td:first-child {
        width: 120px !important;
    }

    table[data-table-fixed-start-column-sp="130"] th:first-child,
    table[data-table-fixed-start-column-sp="130"] td:first-child {
        width: 130px !important;
    }

    table[data-table-fixed-start-column-sp="140"] th:first-child,
    table[data-table-fixed-start-column-sp="140"] td:first-child {
        width: 140px !important;
    }

    table[data-table-fixed-start-column-sp="150"] th:first-child,
    table[data-table-fixed-start-column-sp="150"] td:first-child {
        width: 150px !important;
    }
}

/* テーブルコンテナ */
.table-responsive-container:has([data-table-scroll-sp]) {
    min-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}