.nowrap {
    white-space: nowrap;
}
.content_padding div, .content_padding span, .content_padding li, .content_padding a {
    font-family: "Noto Sans TC";
}
.content_padding {
    padding: 16px 100px 80px 100px; 
    font-family: "Noto Sans TC";
    font-size: 24px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #D8D8D8;
}

.border_style {
    color:#172554;
    border-radius: 8px;
    border: 2px solid #DBEAFE;
    background: #FFF;
    padding:16px;
    margin: 0px 16px 16px 0px;
}
.border_style b {
    font-size:18px;
    margin-bottom:4px;
    display:inline-block;
}
.border_style ul {
    padding-left:25px;
    font-size:14px;
}
.border_style ul li{
    color:#172554;
    list-style:disc;
}

.table_title {
    color: #172554;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px; /* 140% */
    letter-spacing: 0.8px;
    margin: 24px 0px 16px;
}
.fee_table {
    font-size: 16px;
}
.fee_table th {
    font-family: "Noto Sans TC";
    background: #F5F9FF;
    border: 1px solid #DBEAFE;
    text-align: center;
    vertical-align:middle;
    color: #172554;
    padding: 4px;
    font-weight: 500;
    letter-spacing: 0.64px;
    line-height: 24px;
}
.fee_table tr, td {
    font-family: "Noto Sans TC";
    background-color: white;
    border: 1px solid #DBEAFE;
    text-align:center;
    padding: 8px;
    /* letter-spacing: 0.64px; */
    line-height: 24px;
}
.table_note_style{
    font-size: 12px;
    color: #6B7280;
    font-weight: 400;
    line-height: 16px; /* 133.333% */
    letter-spacing: 0.48px;
}
.fee_table tr td:first-child{
    color: #172554;
    background-color: #F5F9FF;
    font-weight: 500;
}
table a, .border_style a {
    color: #2563EB;
}
.tagStyle {
    font-size: 12px;
    color: red;
    border-radius: 4px;
    background: #FEF2F2;
    padding: 2px 4px;
    align-items: center;
    white-space: nowrap;
}
.red {
    color: red;
}
.bgc_lightblue {
    background-color:#F5F9FF;
    color: #172554;
}

.info_note_style {
    color: #1E3A8A;
    font-size: 14px;
    font-weight: 400;
    margin-top: 4px;
    width: 100%;
    display: flex;
    align-content: center;
    line-height: 20px; /* 142.857% */
    letter-spacing: 0.56px;
}
.table-sticky-inner {
    padding-bottom: 4px;
}

/* 更多收款服務 */
#more_service th:first-child {
    width: 232px;
}


@media (max-width: 500px) {
    .content_padding {
        padding: 24px 0px 80px 0px;
    }
    .table-sticky-wrapper {
        width: 100%;
        overflow-x: auto;
        position: relative;
    }

    .table-sticky-inner {
        min-width: 600px; /* 確保超出視窗寬度才能橫向滾動 */
        display: inline-block;
        width: 100%;
        /* padding-bottom: 16px; */
    }

    /* ------------- 信用卡 ------------- */
    #credit_fee .fee_table td:first-child,
    #credit_fee .fee_table th:first-child {
        position: sticky;
        left: 2px;
        background: #F5F9FF; /* 背景色避免滾動重疊 */
        z-index: 2;
        box-shadow:
            1px 0 0 #DBEAFE,    /* 右 */
            -1px 0 0 #DBEAFE,   /* 左 */
            0 1px 0 #DBEAFE,    /* 下 */
            0 -1px 0 #DBEAFE;   /* 上 */
    }
    #credit_fee .fee_table th:first-child {
        z-index: 3; /* header 在最上層 */
    }

    /* ------------- 非信用 ------------- */
    #uncredit_fee .fee_table td:first-child,
    #uncredit_fee .fee_table th:first-child {
        position: sticky;
        left: 2px;
        background: #F5F9FF;
        z-index: 2;
        box-shadow:
            1px 0 0 #DBEAFE,    /* 右 */
            -1px 0 0 #DBEAFE,   /* 左 */
            0 1px 0 #DBEAFE,    /* 下 */
            0 -1px 0 #DBEAFE;   /* 上 */
    }
    #uncredit_fee .fee_table td.stickyLeft,
    #uncredit_fee .fee_table th.stickyLeft {
        position: sticky;
        left: 116px;  /* 寬度根據實際調整 */
        background: #F5F9FF;
        z-index: 2;
        box-shadow:
            1px 0 0 #DBEAFE,    /* 右 */
            -1px 0 0 #DBEAFE,   /* 左 */
            0 1px 0 #DBEAFE,    /* 下 */
            0 -1px 0 #DBEAFE;   /* 上 */
    }
    #uncredit_fee .fee_table th:first-child,
    #uncredit_fee .fee_table th.stickyLeft {
        z-index: 3; /* header 在最上層 */
    }

    /* 更多收款服務 */
    #more_service th:first-child {
        width: 144px;
    }
    #more_service td:first-child {
        font-size: 15px;
    }

    /* ------------- 取貨付款 ------------- */
    #cash_delivery .fee_table td:first-child,
    #cash_delivery .fee_table th:first-child {
        position: sticky;
        left: 0px;
        background: #F5F9FF;
        z-index: 2;
        border: 1px solid #DBEAFE;
        transform: translateZ(0);
        box-shadow:
            1px 0 0 #DBEAFE,    /* 右 */
            -1px 0 0 #DBEAFE,   /* 左 */
            0 1px 0 #DBEAFE,    /* 下 */
            0 -1px 0 #DBEAFE;   /* 上 */
    }
    #cash_delivery .fee_table td.stickyLeft,
    #cash_delivery .fee_table th.stickyLeft {
        font-size: 15px;
        position: sticky;
        left: 116px;  /* 寬度根據實際調整 */
        background: #F5F9FF;
        z-index: 2;
        border: 1px solid #DBEAFE;
        transform: translateZ(0);
        box-shadow:
            1px 0 0 #DBEAFE,    /* 右 */
            -1px 0 0 #DBEAFE,   /* 左 */
            0 1px 0 #DBEAFE,    /* 下 */
            0 -1px 0 #DBEAFE;   /* 上 */
    }
    #cash_delivery .fee_table th:first-child,
    #cash_delivery .fee_table th.stickyLeft {
        z-index: 3; /* header 在最上層 */
    }

    /* ------------- 取貨不付款 ------------- */
    #no_cash_delivery .fee_table td:first-child,
    #no_cash_delivery .fee_table th:first-child {
        font-size: 15px;
    }
}