@charset "utf-8";
/* CSS Document */
.rwd_table .tr_head {
    /*height: 60px;*/
    color: #fff;
    background-color: #c87b63;
}

table.rwd_table {
    position: relative;
    border: 1px solid #ccc;
    border-collapse: collapse;
    margin: 0;
    padding: 0;
    width: 100%;
    table-layout: fixed;
    font-family: 'Noto Sans TC', "微軟正黑體", "Microsoft JhengHei UI", sans-serif;
    font-size: 1.4rem;
    margin-bottom: 20px;
}

    table.rwd_table.order_form {
        width: 200%;
        font-size: 1.2rem;
    }

thead {
    position: sticky;
    top: 59px;
    left: 0px;
    z-index: 9999;
}

table.rwd_table caption {
    font-size: 1rem;
    margin: .5em 0 .75em;
}

table.rwd_table tr {
    background-color: #f8f8f8;
    border: 0px solid #ddd;
    padding: .35em;
}

    table.rwd_table tr:nth-child(even) {
        background-color: #eee;
    }

table.rwd_table th, table.rwd_table td {
    padding: .625em;
    text-align: left;
}

table.rwd_table td {
    word-break: break-all;
    border-right: 1px solid #ddd;
}

    table.rwd_table td:nth-last-child(1) {
        border-right: 0px solid #ddd;
    }

table.rwd_table th {
    font-size: 1.2rem;
    font-weight: 400;
    border-right: 0px solid #fff;
}

    table.rwd_table th:nth-last-child(1) {
        border-right: 0px solid #fff;
    }

@media screen and (max-width: 1024px) {
    table.rwd_table {
        border: 0;
        width: 100%;
    }

        table.rwd_table.order_form {
            width: 100%;
        }

        table.rwd_table caption {
            font-size: 1rem;
        }

        table.rwd_table thead {
            border: none;
            clip: rect(0 0 0 0);
            height: 1px;
            margin: -1px;
            overflow: hidden;
            padding: 0;
            position: absolute;
            width: 1px;
        }

            table.rwd_table thead.shipment_set {
                position: static;
            }

        table.rwd_table tr {
            border-bottom: 1px solid #ddd;
            display: block;
            margin-bottom: .625em;
            -webkit-border-radius: 12px;
            -moz-border-radius: 12px;
            border-radius: 12px;
            border: 1px solid #ddd;
        }

        table.rwd_table thead.shipment_set tr {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 90px;
            height: auto;
        }

            table.rwd_table thead.shipment_set tr th {
                display: none;
            }

                table.rwd_table thead.shipment_set tr th.shipment_show {
                    display: block;
                }

        table.rwd_table td {
            border-bottom: 1px solid #ddd;
            border-right: 0px solid #ddd;
            display: block;
            text-align: left;
            overflow: hidden;
        }

            table.rwd_table td::before {
                /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
                content: attr(data-label);
                float: left;
                font-weight: bold;
                text-transform: uppercase;
                color: #749a7e;
                padding-left: 5px;
                padding-bottom: 2px;
                padding-right: 5px;
                margin-right: 5px;
            }

            table.rwd_table td.btn_wrap::before {
                display: none;
            }

            table.rwd_table td:last-child {
                border-bottom: 0;
            }
}
