/* ========== Extra Extra Large ≥1400px ========== */
@media (max-width: 1400px) {}

/* ========== Extra Large ≥1200px ========== */
@media (max-width: 1200px) {}

/* ========== Large ≥992px ========== */
@media (max-width: 992px) {
    .contentMainLayout {
        width: 600px;
        height: 100dvh;
        padding: 50px 30px;
        margin: auto;
    }

    .contentLayout {
        width: 100%;
        height: 100%;

        overflow: auto;
    }

    .bannerMonster {
        width: 200px;
        min-width: 200px;
        height: 130px;
    }

    .btnTab {
        width: 140px;
        height: 60px;
        padding: 10px 5px;
        font-size: 12px;
        line-height: 15px;
    }

    .btnTabNote {
        top: -15px;
        right: -13px;
        width: 30px;
        height: 30px;
        font-size: 7px;
        line-height: 10px;
    }

    .h2,
    h2 {
        font-size: 18px;
    }

    .h6,
    h6 {
        font-size: 16px;
    }

    p {
        font-size: 13px;
        line-height: 16px;
    }

    .mainLayout {
        padding-bottom: 0px;
    }
}

/* ========== Medium ≥768px ========== */
@media (max-width: 768px) {

    .tabTableMainLayout,
    .tableContentLayoutSecond {
        width: 768px;
    }

    .tableScroll {
        overflow: auto;
    }

    .tabContentLayout {
        padding: 40px 20px;
    }

    .tableSecondTitle {
        width: 130px;
        min-width: 130px;
    }


}

/* ========== Small ≥576px ========== */
@media (max-width: 576px) {
    .contentMainLayout {
        width: calc(100% - 30px);
        height: 100dvh;
        padding: 50px 10px;
        margin: auto;
    }

    .h6,
    h6 {
        font-size: 12px;
    }

    .tabContentHeaderLayout {
        position: relative;
        width: 100%;
        min-height: 100px;
        padding: 5px 10px;
        justify-content: space-between;
        font-size: 24px;
        line-height: 22px;
    }

    .buttonmodalClose {
        position: relative;
        right: 0px;
        font-size: 30px;
    }
}