/*****************************************************HEADER TOP*****************************************************/

.header {
    transition: all 0.5s ease-in-out;
    position: relative;
    display: unset;
}

    .header .header_optional {
        box-shadow: 0px 2px 4px rgba(30, 45, 190, 0.12);
        display: unset;
    }

.header_optional > .nav_header {
    transition: all 0.5s ease-in-out;
    background: #FFF;
    background-size: cover;
    position: sticky;
    top: 0;
    z-index: 10;
    border-bottom: 1px solid #E7EBF1;
    /*background-image: url(../images/bg-menu.png);*/
    background-color: #C17E01;
    /*background: url(../images/bg-menu.png) lightgray 0px -41px / 100% 645.652% no-repeat;*/
}

    .header_optional > .nav_header:before {
        content: '';
        background-image: url(../images/bg-menu.png);
        background-repeat: no-repeat;
        background-size: cover;
        mix-blend-mode: soft-light;;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
    }

    .header_optional > .nav_header > .container {
        z-index: 2;
    }

.menu-bar {
    background-color: white;
    border-bottom: none;
    display: unset;
}

.fixed-header .header_optional > .nav_header {
    width: 100%;
    /* box-shadow: 0px 2px 4px rgba(30, 45, 190, 0.12); */
    background-color: #C17E01;
}

@media screen and (min-width: 768px) {
    .fixed-header .header_optional > .nav_header {
        background-color: #C17E01;
    }
}

.menu-bar .header_top {
    background: url(../images/top-header.png) no-repeat center;
    background-size: cover;
    /*border-bottom: 1px solid #E7EBF1;*/
    /* box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15); */
    z-index: 1;
    position: relative;
    /*overflow: hidden;*/
}

    .menu-bar .header_top .nav_top_option {
        display: flex;
        justify-content: space-between;
        align-items: center;
        position: relative;
    }

        .menu-bar .header_top .nav_top_option > img {
            position: absolute;
            right: 0;
            z-index: -1;
        }

    .menu-bar .header_top .image-header {
        position: absolute;
        right: 0;
        top: 0;
        z-index: -1;
        height: -webkit-fill-available;
        object-fit: cover;
        display: none;
    }

    .menu-bar .header_top .nav-brand {
        display: flex;
        align-items: center;
        padding: 30px 0;
        height: 100%;
        position: relative;
    }

        .menu-bar .header_top .nav-brand::after {
            content: "";
            display: block;
            /*background: url(../images/bg-header.png) no-repeat center;*/
            width: 800px;
            position: absolute;
            height: 100%;
            left: -95px;
            z-index: -1;
        }

        .menu-bar .header_top .nav-brand > a {
            display: flex;
        }

        .menu-bar .header_top .nav-brand img {
            width: 100px;
            height: 100px;
            max-height: 100px;
            margin-right: 20px;
            padding: 0;
        }

        .menu-bar .header_top .nav-brand .logocontent {
            display: flex;
            align-items: flex-start;
            position: relative;
            height: 100%;
            flex-direction: column;
            justify-content: space-between;
            gap: 5px;
        }

            .menu-bar .header_top .nav-brand .logocontent .toplogocontent {
                text-transform: uppercase;
                color: #FFFFFF;
                font-family: "Roboto Slab";
                font-size: 18px;
                font-style: normal;
                font-weight: 700;
                line-height: 1.28;
            }

            .menu-bar .header_top .nav-brand .logocontent .bottomlogocontent {
                color: #FFD976;
                font-family: "Roboto Slab";
                font-size: 34px;
                font-style: normal;
                font-weight: 700;
                line-height: 1.47; /* 111.111% */
                text-transform: uppercase;
            }

/*****************************************************HEADER BOTTOM*****************************************************/

.menu-bar .header_bottom > #main-menu {
    float: unset;
}

.menu-bar .header_bottom > ul > li {
    margin-right: 60px;
}

    .menu-bar .header_bottom > ul > li:hover {
        border: none
    }

    .menu-bar .header_bottom > ul > li > a {
        letter-spacing: 0.15px;
        color: var(--text-mi, #FFFFFF);
        font-family: "Roboto Slab";
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
        padding: 12px 0;
        text-transform: uppercase;
        transition: none;
    }

        .menu-bar .header_bottom > ul > li > a.current,
        .menu-bar .header_bottom > ul > li > a:hover,
        .menu-bar .header_bottom > ul > li:hover > a {
            color: #182940;
        }

            .menu-bar .header_bottom > ul > li > a.current::before,
            .menu-bar .header_bottom > ul > li > a:hover::before,
            .menu-bar .header_bottom > ul > li:hover > a::before {
                content: "";
                position: absolute;
                bottom: 0;
                width: 100%;
                border-bottom: 2px solid #182940;
                left: 0;
            }

        .menu-bar .header_bottom > ul > li > a.has-submenu {
            padding-right: 22px;
        }

            .menu-bar .header_bottom > ul > li > a.has-submenu::after {
                content: "";
                display: block;
                width: 12px;
                height: 7px;
                background-image: url('data:image/svg+xml,<svg width="12" height="8" viewBox="0 0 12 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.9996 7.5C5.78029 7.5 5.56087 7.41455 5.39373 7.24365L0.251105 1.99365C-0.0837016 1.65186 -0.0837016 1.09814 0.251105 0.756348C0.585911 0.414551 1.1283 0.414551 1.4631 0.756348L5.9996 5.38906L10.5369 0.757031C10.8717 0.415234 11.4141 0.415234 11.7489 0.757031C12.0837 1.09883 12.0837 1.65254 11.7489 1.99434L6.60627 7.24434C6.43886 7.41523 6.21923 7.5 5.9996 7.5Z" fill="white"/></svg>');
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                right: 0;
            }

.header.fixed-header .menu-bar .header_bottom > ul > li > a.has-submenu::after {
    background-image: url('data:image/svg+xml,<svg width="12" height="8" viewBox="0 0 12 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.9996 7.5C5.78029 7.5 5.56087 7.41455 5.39373 7.24365L0.251105 1.99365C-0.0837016 1.65186 -0.0837016 1.09814 0.251105 0.756348C0.585911 0.414551 1.1283 0.414551 1.4631 0.756348L5.9996 5.38906L10.5369 0.757031C10.8717 0.415234 11.4141 0.415234 11.7489 0.757031C12.0837 1.09883 12.0837 1.65254 11.7489 1.99434L6.60627 7.24434C6.43886 7.41523 6.21923 7.5 5.9996 7.5Z" fill="white"/></svg>');
}

.header.fixed-header .menu-bar .header_bottom > ul > li > a.has-submenu.current::after {
    background-image: url('data:image/svg+xml,<svg width="12" height="8" viewBox="0 0 12 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.9996 7.5C5.78029 7.5 5.56087 7.41455 5.39373 7.24365L0.251105 1.99365C-0.0837016 1.65186 -0.0837016 1.09814 0.251105 0.756348C0.585911 0.414551 1.1283 0.414551 1.4631 0.756348L5.9996 5.38906L10.5369 0.757031C10.8717 0.415234 11.4141 0.415234 11.7489 0.757031C12.0837 1.09883 12.0837 1.65254 11.7489 1.99434L6.60627 7.24434C6.43886 7.41523 6.21923 7.5 5.9996 7.5Z" fill="%23841800"/></svg>');
}

            .menu-bar .header_bottom > ul > li > a.has-submenu.current::after,
            .menu-bar .header_bottom > ul > li > a.has-submenu:hover::after,
            .menu-bar .header_bottom > ul > li:hover > a::after {
                background-image: url('data:image/svg+xml,<svg width="12" height="8" viewBox="0 0 12 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.9996 7.5C5.78029 7.5 5.56087 7.41455 5.39373 7.24365L0.251105 1.99365C-0.0837016 1.65186 -0.0837016 1.09814 0.251105 0.756348C0.585911 0.414551 1.1283 0.414551 1.4631 0.756348L5.9996 5.38906L10.5369 0.757031C10.8717 0.415234 11.4141 0.415234 11.7489 0.757031C12.0837 1.09883 12.0837 1.65254 11.7489 1.99434L6.60627 7.24434C6.43886 7.41523 6.21923 7.5 5.9996 7.5Z" fill="%23841800"/></svg>');
            }

    .menu-bar .header_bottom > ul > li:last-child {
        margin-right: 0;
    }

    .menu-bar .header_bottom > ul > li > a > span {
        display: none;
    }

.menu-bar .header_bottom > ul > li > ul > li > a,
.menu-bar .header_bottom > ul > li > ul > li > ul > li > a {
    font-family: 'Roboto Slab';
    font-weight: 500;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0.15px;
    color: #182940;
    padding: 6px 16px
}

        .menu-bar .header_bottom > ul > li > ul > li > a.has-submenu {
            padding: 6px 30px 6px 16px;
        }



.header.fixed-header .menu-bar .header_bottom > ul > li > a {
    color: #FFFFFF;
}

    .header.fixed-header .menu-bar .header_bottom > ul > li > a.current {
        color: #182940;
    }

        .header.fixed-header .menu-bar .header_bottom > ul > li > a.current::before {
            border-bottom: 2px solid #182940;
        }

@media (min-width: 768px) {
    .sm-contra ul a span.sub-arrow {
        border: none;
        width: 20px;
        height: 20px;
        top: 50%;
        transform: translateY(-50%);
        right: 0;
        margin-top: 0;
        font-size: 0;
    }

        .sm-contra ul a span.sub-arrow::before,
        .sm-contra ul a.has-submenu.highlighted span.sub-arrow::before {
            content: "" !important;
            width: 20px;
            height: 20px;
            flex-shrink: 0;
            display: block;
            background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="mask0_778_5250" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="20" height="20"><rect width="20" height="20" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_778_5250)"><path d="M10.7885 9.99991L7.39424 6.60566C7.27885 6.49028 7.21982 6.34525 7.21716 6.17057C7.21448 5.99591 7.2735 5.84821 7.39424 5.72749C7.51496 5.60675 7.66132 5.54639 7.83332 5.54639C8.00532 5.54639 8.15168 5.60675 8.27241 5.72749L12.0176 9.47268C12.0956 9.55066 12.1506 9.63293 12.1827 9.71947C12.2147 9.806 12.2307 9.89948 12.2307 9.99991C12.2307 10.1003 12.2147 10.1938 12.1827 10.2803C12.1506 10.3669 12.0956 10.4492 12.0176 10.5271L8.27241 14.2723C8.15703 14.3877 8.012 14.4467 7.83732 14.4494C7.66266 14.4521 7.51496 14.3931 7.39424 14.2723C7.2735 14.1516 7.21313 14.0052 7.21313 13.8332C7.21313 13.6612 7.2735 13.5149 7.39424 13.3942L10.7885 9.99991Z" fill="%231C1B1F"/></g></svg>');
        }
}

.menu-bar .header_bottom > ul > li > ul {
    padding: 10px 0;
    box-shadow: 0px 2px 4px 0px #00000026;
    transition: all 0.5s ease-in-out;
    background: #FFF;
}

    .menu-bar .header_bottom > ul > li > ul > li > ul {
        padding: 10px 0;
        box-shadow: 0px 2px 4px 0px #00000026;
        transition: all 0.5s ease-in-out;
        background: #FFF;
    }

    .menu-bar .header_bottom > ul > li > ul > li > a:hover {
        background: none;
        color: #182940;
    }

.menu-bar .header_bottom ul ul li a.current {
    color: #182940 !important;
    background: #F4F8FF;
}

.menu-bar .header_bottom {
    display: flex;
    justify-content: space-between;
    position: relative;
    align-items: center;
}

/*****************************************************HEADER BOTTOM - MEGA MENU*****************************************************/

.sm {
    position: unset;
}

.menu-bar .header_bottom > ul > li.has_megamenu {
    position: unset;
}

/* .header .menu-bar .header_bottom ul li > a[title="Đào tạo"] ~ .RenderChildNodesMegaMenu {
    display: none;
} */

.menu-bar .header_bottom ul li > a[title="Đào tạo"] ~ .RenderChildNodesMegaMenu {
    width: auto !important;
    max-width: unset !important;
    /* gap: 30px;
    flex-wrap: wrap; */
    transition: none;
    padding: 20px;
    margin: 0 !important;
}

    /* .menu-bar .header_bottom ul li > a[title="Đào tạo"] ~ .RenderChildNodesMegaMenu:hover{
    display: flex;
} */

    /* .menu-bar .header_bottom ul li > a[title="Đào tạo"] ~ .RenderChildNodesMegaMenu .MegaMenu-wrapper {
    flex: 0 0 calc(100%/6 - 25px);
} */

    .menu-bar .header_bottom ul li > a[title="Đào tạo"] ~ .RenderChildNodesMegaMenu .MegaMenu-wrapper {
        width: calc(100%/4 - 22.5px);
        float: left;
    }

        .menu-bar .header_bottom ul li > a[title="Đào tạo"] ~ .RenderChildNodesMegaMenu .MegaMenu-wrapper:not(:last-child) {
            margin-right: 30px;
        }

        .menu-bar .header_bottom ul li > a[title="Đào tạo"] ~ .RenderChildNodesMegaMenu .MegaMenu-wrapper > a {
            font-family: 'Roboto Slab';
            font-style: normal;
            font-weight: 600;
            font-size: 16px;
            line-height: 1.33;
            text-align: left;
            text-transform: uppercase;
            /* active */
            color: #E88A27;
            transition: none;
            padding: 0 0 10px 0;
        }

        .menu-bar .header_bottom ul li > a[title="Đào tạo"] ~ .RenderChildNodesMegaMenu .MegaMenu-wrapper a .sub-arrow {
            display: none;
        }

        .menu-bar .header_bottom ul li > a[title="Đào tạo"] ~ .RenderChildNodesMegaMenu .MegaMenu-wrapper .MegaMenu-parent {
            position: relative !important;
            left: unset !important;
            top: unset !important;
            margin: 0 !important;
            min-width: unset !important;
            max-width: unset !important;
            width: 100% !important;
            border: none;
            display: flex !important;
            text-align: left !important;
            flex-direction: column;
            align-items: flex-start;
            gap: 10px;
        }

            .menu-bar .header_bottom ul li > a[title="Đào tạo"] ~ .RenderChildNodesMegaMenu .MegaMenu-wrapper .MegaMenu-parent .MegaMenu-child a {
                padding: 0;
                font-family: 'Roboto Slab';
                font-style: normal;
                font-weight: 500;
                font-size: 14px;
                line-height: 1.5;
                /* or 150% */
                display: -webkit-box;
                -webkit-box-orient: vertical;
                overflow: hidden;
                -webkit-line-clamp: 1;
                /* Gray 1 */
                color: #333333;
                transition: all 2s ease-in-out;
                max-height: 21px;
            }

                .menu-bar .header_bottom ul li > a[title="Đào tạo"] ~ .RenderChildNodesMegaMenu .MegaMenu-wrapper .MegaMenu-parent .MegaMenu-child a:hover {
                    background: none;
                    color: #E88A27 !important;
                    -webkit-line-clamp: unset;
                    max-height: 200px;
                    transition: all 0.5s ease-in-out;
                }

/* .menu-bar .header_bottom ul li a[title="Tuyển sinh"] {
    background: linear-gradient(0deg, #C86000 0%, #A04D00 100%);
    border-radius: 60px;
    padding: 9px 40px 9px 20px;
    margin-top: 4px;
    margin-right: 0
}

.menu-bar .header_bottom ul li a[title="Tuyển sinh"]:hover,
.menu-bar .header_bottom ul li a[title="Tuyển sinh"]:focus {
    color: #FFF;
    border: none;
}

.menu-bar .header_bottom > ul > li > a[title="Tuyển sinh"].has-submenu::after {
    right: 16px;
    background-image: url('data:image/svg+xml,<svg width="12" height="8" viewBox="0 0 12 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.9996 7.5C5.78029 7.5 5.56087 7.41455 5.39373 7.24365L0.251105 1.99365C-0.0837016 1.65186 -0.0837016 1.09814 0.251105 0.756348C0.585911 0.414551 1.1283 0.414551 1.4631 0.756348L5.9996 5.38906L10.5369 0.757031C10.8717 0.415234 11.4141 0.415234 11.7489 0.757031C12.0837 1.09883 12.0837 1.65254 11.7489 1.99434L6.60627 7.24434C6.43886 7.41523 6.21923 7.5 5.9996 7.5Z" fill="white"/></svg>') !important;
} */

@media (min-width:768px) {
    /* prevent text rendering degrade during animation in Mac browsers */
    #main-menu {
        -webkit-font-smoothing: subpixel-antialiased;
    }
        /* show animation */
        #main-menu > li > ul.show-animation {
            -webkit-animation: show-animation 0.3s;
            animation: show-animation 0.3s;
        }

    @-webkit-keyframes show-animation {
        0% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    @keyframes show-animation {
        0% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }
    /* hide animation */
    #main-menu > li > ul.hide-animation {
        -webkit-animation: hide-animation 0.3s;
        animation: hide-animation 0.3s;
    }

    @-webkit-keyframes hide-animation {
        0% {
            opacity: 1;
        }

        100% {
            opacity: 0;
        }
    }

    @keyframes hide-animation {
        0% {
            opacity: 1;
        }

        100% {
            opacity: 0;
        }
    }
}

/*****************************************************SEARCH BOX*****************************************************/
#searchModal .modal-content {
    border-radius: 8px;
    background: #FFF;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.30);
    border: none;
}

#searchModal .modal-header {
    border-bottom: none;
    padding: 15px 20px;
}

    #searchModal .modal-header h5 {
        color: var(--text, #323232);
        font-family: Roboto Slab;
        font-size: 18px;
        font-style: normal;
        font-weight: 600;
        line-height: 20px; /* 111.111% */
    }

#searchModal .modal-body {
    padding: 0 20px 15px;
}

    #searchModal .modal-body input {
        border-radius: 60px;
        border: 1px solid #ECD7C5;
        padding: 10px 15px;
        background: #FFFBF0 url('data:image/svg+xml,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.6 1.4C3.2804 1.4 1.4 3.2804 1.4 5.6C1.4 7.9196 3.2804 9.8 5.6 9.8C7.9196 9.8 9.8 7.9196 9.8 5.6C9.8 3.2804 7.9196 1.4 5.6 1.4ZM0 5.6C0 2.50721 2.50721 0 5.6 0C8.69279 0 11.2 2.50721 11.2 5.6C11.2 8.69279 8.69279 11.2 5.6 11.2C2.50721 11.2 0 8.69279 0 5.6Z" fill="%2373190F"/><path fill-rule="evenodd" clip-rule="evenodd" d="M8.60542 8.60493C8.87878 8.33156 9.322 8.33156 9.59537 8.60493L13.7954 12.8049C14.0687 13.0783 14.0687 13.5215 13.7954 13.7949C13.522 14.0682 13.0788 14.0682 12.8054 13.7949L8.60542 9.59488C8.33205 9.32151 8.33205 8.87829 8.60542 8.60493Z" fill="%2373190F"/></svg>') no-repeat;
        background-position: calc(100% - 15px) 50%;
        outline: none
    }

    #searchModal .modal-body .search .searchInputContainer {
        border: none;
    }

/*****************************************************FOOTER TOP*****************************************************/
footer {
    padding-top: 20px;
    padding-bottom: 20px;
    /*background: #0036C0;*/
    border: none;
    position: relative;
    background-size: cover;
    /*border-top: 2px solid #FFB6BA;*/
    background-image: url(../images/bg-footer-image.png);
    background-repeat: no-repeat;
    background-size: cover;
    mix-blend-mode: multiply;
}

    footer > .container {
        z-index: 2;
        position: relative;
    }

    /*footer .footer-bg-wrapper {
        background-image: url(../images/bg-footer-image.png);
        background-repeat: no-repeat;
        background-size: cover;
        mix-blend-mode: multiply;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
    }*/

    footer::before {
        content: none;
        display: block;
        /* background: url(../images/hoavan.png); */
        width: 100%;
        height: 40px;
        position: absolute;
        top: -40px;
    }

    footer .Footer_ThongTin {
        display: flex;
        flex-direction: column;
    }

        footer .Footer_ThongTin * {
            color: var(--text-mi, #FFF);
            font-family: Roboto;
            font-size: 14px;
            font-style: normal;
            font-weight: 400;
            line-height: 1.5; /* 171.429% */
        }

        footer .Footer_ThongTin strong {
            font-weight: 700;
        }

        footer .Footer_ThongTin .phone_fax {
            display: flex;
            column-gap: 20px;
            flex-wrap: wrap;
        }

        footer .Footer_ThongTin h2 {
            color: var(--red, #FFD565);
            font-family: "Roboto Slab";
            font-size: 22px;
            font-style: normal;
            font-weight: 600;
            line-height: 1.45; /* 144.444% */
            /*text-transform: uppercase;*/
            margin-bottom: 5px;
        }

    footer .block-copyright {
    }

    footer .block-info {
        margin-bottom: 15px;
    }

    footer .block-info span,
    footer .block-copyright span {
        display: block;
    }

    footer .block-copyright span {
        color: #7AC9FF;
    }

        footer .block-copyright span:not(:last-child) {
            margin-bottom: 2px;
        }

    footer .Footer_QR {
        border-radius: 0;
        border: none;
        background-color: transparent;
        padding: 0;
        display: flex;
        flex-direction: column;
    }

        footer .Footer_QR > *:not(:last-child) {
            /*margin-right: 20px;
            padding-right: 20px;
            border-right: 1px solid #F5D6D6;*/
        }

        footer .Footer_QR > * .Title {
            color: var(--text-mi, #182940);
            text-align: center;
            font-family: "Roboto Slab";
            font-size: 14px;
            font-style: normal;
            font-weight: 500;
            line-height: 1.42; /* 142.857% */
            margin-bottom: 10px;
        }

        footer .Footer_QR > * span {
            color: var(--text-mi, #182940);
            font-family: Roboto;
            font-size: 13px;
            font-style: normal;
            font-weight: 500;
            line-height: 1.38; /* 138.462% */
        }

        footer .Footer_QR .Group_QR {
            display: flex;
            gap: 10px;
        }

            footer .Footer_QR .Group_QR li {
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 5px;
            }

        footer .Footer_QR .Group_App {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 10px;
        }

        footer .Footer_QR .App_Download span {
            width: 95px;
            text-align: center;
            display: block;
        }

        footer .Footer_QR .Option ul {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: 15px;
        }

            footer .Footer_QR .Option ul li {
                display: flex;
                flex-direction: column;
                align-items: center;
            }

        footer .Footer_QR .Option .Title {
            margin-bottom: 5px;
        }

    footer .follow-link {
        display: flex;
        align-items: flex-start;
        gap: 10px;
    }

    footer .footer-sub {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        row-gap: 10px;
    }

    footer .copyright {
        color: #58677A;
        font-family: Roboto;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.42;
        display: flex;
        flex-direction: column;
        gap: 5px;
    }

        footer .copyright a {
            color: #58677A;
            font-family: Roboto;
            font-size: 14px;
            font-style: normal;
            font-weight: 400;
            line-height: 1.42; /* 142.857% */
        }

    footer .main-footer {
        /*margin-bottom: 10px;*/
        display: flex;
        gap: 10px;
        flex-direction: column;
        height: 100%;
        width: 100%;
    }

        footer .main-footer .footer-main {
            display: flex;
            justify-content: space-between;
            /*padding-bottom: 20px;
            border-bottom: 1px solid #E0E0E0;*/
            flex-wrap: nowrap;
            row-gap: 15px;
        }

    footer .btn-hopThuGopY {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 15px;
        gap: 5px;
        border-radius: 6px;
        background: var(--blue, #26A6FE);
        width: fit-content;
    }

        footer .btn-hopThuGopY span {
            color: #FFF;
            font-family: Roboto;
            font-size: 16px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
            display: inline-block;
            white-space: nowrap;
        }

    footer .footer-right-top {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 10px;
        margin-bottom: 10px;
    }

    footer .facebook-btn {
        display: inline-block;
        width: 38px;
        height: 38px;
        border-radius: 6px;
        background-image: url('../images/facebook.svg');
    }

    footer .btn-soDoCong {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 5px;
        margin-bottom: 2px;
    }

        footer .btn-soDoCong span {
            display: inline-block;
            color: var(--yellow, #FFC52D);
            font-family: Roboto;
            font-size: 16px;
            font-style: normal;
            font-weight: 400;
            line-height: 1.5; /* 150% */
            text-decoration-line: underline;
        }

    footer .deisgn-text,
    footer .deisgn-text a {
        color: #FFF;
        text-align: right;
        font-family: Roboto;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.5;
        padding-bottom: 0;
    }

/*****************************************************LANGUAGE*****************************************************/
.language-object {
    display: flex;
    align-items: center;
    justify-content: center;
}

    .language-object a,
    .language-object span {
        overflow: hidden;
        color: var(--text-mi, #182940);
        text-overflow: ellipsis;
        font-family: Roboto;
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 1.57; /* 157.143% */
        position: relative;
    }

    .language-object > * {
        margin-right: 10px;
        padding-right: 10px;
    }

        .language-object > *:not(:last-child)::after,
        .extraoption #currentTime::after {
            content: "";
            width: 1px;
            height: 15px;
            background: #ACB7C9;
            display: block;
            position: absolute;
            right: 0;
            top: 50%;
            transform: translateY(-50%);
        }

    .language-object .Language.selected {
        color: #D61C26;
        display: none;
    }

.extraoption {
    display: flex;
    align-items: center;
}

    .extraoption #currentTime {
        overflow: hidden;
        color: var(--text-mi, #182940);
        text-overflow: ellipsis;
        font-family: Roboto;
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 1.57; /* 157.143% */
        margin-right: 10px;
        position: relative;
        padding-right: 10px;
    }

/*****************************************************MINI NAV*****************************************************/
.mini_nav {
    display: flex;
    justify-content: space-between;
    position: relative;
}

    .mini_nav > a.Home-link {
        position: absolute;
        right: calc(100% + 30px);
        width: max-content;
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        color: #FFF;
        font-family: "Roboto Slab";
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: 1.5;
        border-radius: 6px;
        background: var(--red, #D61C26);
        padding: 6px 12px;
    }

    .mini_nav h6 {
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .mini_nav h6 a {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            color: var(--red, #D61C26);
            font-family: "Roboto Slab";
            font-size: 22px;
            font-style: normal;
            font-weight: 600;
            line-height: 1.5; /* 181.818% */
            text-transform: uppercase;
        }

.menu-bar .mini_nav .header_bottom > ul > li {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-right: 30px;
}

    .menu-bar .mini_nav .header_bottom > ul > li:last-child {
        margin-right: 0;
    }

    .menu-bar .mini_nav .header_bottom > ul > li > a {
        color: var(--text-mi, #182940);
        font-family: "Roboto Slab";
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: 1.5; /* 150% */
        text-transform: none;
    }

        .menu-bar .mini_nav .header_bottom > ul > li > a.current, .menu-bar .mini_nav .header_bottom > ul > li > a:hover, .menu-bar .mini_nav .header_bottom > ul > li:hover > a {
            color: #D61C26;
        }

            .menu-bar .mini_nav .header_bottom > ul > li > a.current::before, .menu-bar .mini_nav .header_bottom > ul > li > a:hover::before, .menu-bar .mini_nav .header_bottom > ul > li:hover > a::before {
                bottom: 8px;
            }

/*****************************************************RESPONSIVE NAV*****************************************************/
@media screen and (max-width: 1366px) {
    .menu-bar .header_bottom > ul > li {
        margin-right: 50px;
    }

    .menu-bar .header_top .nav-action .search-group .searchInputContainer input {
        font-size: 14px;
        width: 280px;
    }

    .menu-bar .header_top .nav-brand img {
        margin-right: 16px;
    }
}

@media screen and (max-width: 1240px) {
    .footer-CM > div {
        flex: 0 0 calc(50% - 30px)
    }

    .menu-bar .header_bottom > ul > li {
        margin-right: 45px;
    }

    .menu-bar .header_bottom .icon-search {
        margin-left: 10px;
    }

    .menu-bar .header_top .nav-brand img {
        width: 90px;
        height: 90px;
        margin-right: 16px;
    }

    .menu-bar .header_top .nav-brand .logocontent .toplogocontent {
        font-size: 22px;
    }

    .menu-bar .header_top .nav-brand .logocontent .bottomlogocontent {
        font-size: 33px;
    }

    /* footer .main-footer > div {
        flex: 0 0 calc(50% - 30px);
        max-width: calc(50% - 30px);
    }  */

    footer .main-footer {
        gap: 10px;
    }

    .menu-bar .header_top .nav_top_option > img {
        max-height: 135px;
    }
}

@media screen and (max-width: 1117px) {
    .sm-contra ul a span.sub-arrow {
        display: none;
    }

    .menu-bar .header_top .nav_top_option > img {
        max-height: 130px;
    }

    .header .contra-nav label {
        display: block;
        top: -93px;
        z-index: 100;
        left: auto;
        right: 0;
        margin: 0;
        float: unset;
        position: absolute;
    }

    .menu-bar .header_bottom .icon-search {
        display: block;
        top: -62px;
        z-index: 10000;
        right: 20px;
        margin: 0;
        float: unset;
        position: absolute;
    }

    /* .menu-bar .header_top .nav_top_option {
        padding-left: 52px;
    } */

    .menu-bar .header_top .nav-brand {
        margin-left: 45px;
    }

    .main-menu-btn-icon, .main-menu-btn-icon:before, .main-menu-btn-icon:after {
        background: #fff;
        width: 20px;
    }

    #main-menu-state:not(:checked) ~ .header_bottom #main-menu {
        display: none;
    }

    #main-menu-state:not(:checked) ~ .header_bottom .nav-action {
        display: flex;
    }

    .menu-bar .header_bottom {
        flex-direction: column-reverse;
    }
    .menu-bar .header_top .nav-brand {
        padding: 15px 0;
        margin: 0;
    }
}

@media screen and (max-width: 991px) {
    .header_optional > .nav_header {
        position: static;
    }

    footer .main-footer .footer-main {
        flex-direction: column;
        justify-content: unset;
        gap: 10px;
    }

    footer .main-footer {
        gap: 10px;
    }

        /* .footer-CM > div {
        flex: unset;
    } */

        /* footer .main-footer > div {
        flex: 0 0 calc(100%/3 - 20px);
        max-width: calc(100%/3 - 20px);
    } */

        footer .main-footer > div:nth-child(1) {
            flex: 0 0 100%;
            max-width: 100%;
        }

    footer .footer-right-top,
    footer .btn-soDoCong,
    .onlinecounter-statistics {
        justify-content: flex-start !important;
        align-items: flex-start !important;
    }

    footer .deisgn-text {
        text-align: left;
        padding-bottom: 0;
    }
}

@media screen and (max-width: 767px) {

    .menu-bar .header_bottom > ul > li > a.has-submenu::after {
        content: none;
    }

    .menu-bar .header_top .nav_top_option > img {
        display: none;
    }

    .menu-bar .header_top .nav-brand::after {
        width: 100%;
        left: 0;
    }

    .menu-bar .header_bottom > ul > li > a.current::before, .menu-bar .header_bottom > ul > li > a:hover::before, .menu-bar .header_bottom > ul > li:hover > a::before {
        content: none;
    }

    .menu-bar .header_bottom > ul > li:last-child {
        margin-right: 15px;
    }

    .menu-bar .header_bottom > ul > li > a > span {
        display: block;
        padding-top: 6px;
    }

    .menu-bar .header_bottom > ul > li > a.has-submenu {
        margin-right: 0;
    }

    .header_optional > .nav_header {
        background: #C17E01;
    }

    /* .menu-bar .header_bottom > ul > li > a {
        color: #D61C26;
    } */

    .menu-bar .header_bottom > ul > li > a.current, .menu-bar .header_bottom > ul > li > a:hover, .menu-bar .header_bottom > ul > li:hover > a {
        border-bottom: none;
    }

    .menu-bar .header_top .nav-information {
        display: none;
    }

    .menu-bar .header_top .nav-brand {
        margin-left: 0;
    }

    .menu-bar .header_top .nav_top_option {
        justify-content: flex-start;
    }

    .menu-bar .logocontent {
        align-items: flex-start;
    }

    .menu-bar .header_top .nav_top_option {
        margin: 0;
    }

    .header .contra-nav label {
        left: unset;
        right: 0;
    }

    .menu-bar .header_bottom .icon-search {
        top: -58px;
        right: 50px;
    }

    #main-menu:before {
        content: none;
    }

    .menu-bar .header_bottom {
        display: flex;
        flex-direction: column-reverse;
    }

        .menu-bar .header_bottom > #main-menu {
            width: 100%;
        }

        .sm-contra > li:hover {
            background: none;
        }

    .menu-bar .header_bottom > ul > li > ul {
        background: none;
        box-shadow: none;
        padding: 0;
        margin-bottom: 10px;
    }

        .menu-bar .header_bottom > ul > li > ul > li {
            /*display: flex;*/
            align-items: center;
            padding-bottom: 10px;
        }

            .menu-bar .header_bottom > ul > li > ul > li > ul {
                padding: 0;
                background-color: transparent;
                box-shadow: none;
            }

            .menu-bar .header_bottom > ul > li > ul > li:last-child {
                padding-bottom: 0;
            }

            .menu-bar .header_bottom > ul > li > ul > li > a {
                padding-bottom: 0;
            }

            .menu-bar .header_bottom > ul > li > ul > li::before {
                content: "\2022";
                color: #FFF;
                font-weight: bold;
                display: inline-block;
                width: 1em;
                margin-left: -1em;
                display: none;
            }

            .menu-bar .header_bottom > ul > li > ul > li > ul {
                margin-top: 9px;
            }

            .menu-bar .header_bottom > ul > li > ul > li > a.has-submenu {
                padding-bottom: 0px;
            }

            .menu-bar .header_bottom > ul > li > ul > li > ul > li:last-child > a {
                padding-bottom: 0;
            }

    .sm-contra ul ul a:hover,
    .sm-contra ul ul a:focus,
    .sm-contra ul ul a:active {
        color: #182940 !important;
    }

    .fixed-header .header_optional > .nav_header {
        position: relative;
    }

    .sm-contra ul a span.sub-arrow {
        display: inline-block;
        padding-top: 0;
    }
}

@media screen and (max-width: 700px) {
    .menu-bar .header_top .nav-brand img {
        width: 64px;
        height: 64px;
    }

    .logocontent .toplogocontent {
        font-size: 20px;
    }

    .logocontent .bottomlogocontent {
        font-size: 28px;
    }

    .header .contra-nav label {
        top: -80px;
    }

    .menu-bar .header_top .nav-brand .logocontent .toplogocontent {
        font-size: 18px;
    }

    .menu-bar .header_top .nav-brand .logocontent .bottomlogocontent {
        font-size: 28px;
    }
}

@media screen and (max-width: 600px) {
    .menu-bar .logocontent {
        display: none;
    }

    .extraoption {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
    }

        .extraoption #currentTime::after {
            content: none
        }
}

@media screen and (max-width: 576px) {
    .footer .Footer_QR .QRCode {
        display: none;
    }

    /* footer .Footer_QR .Option ul {
        flex-direction: row;
        flex-wrap: wrap;
    } */

    footer .Footer_QR {
        justify-content: center;
    }

    footer .main-footer .footer-main .footer-CM {
        display: none;
    }

    .header .contra-nav label {
        position: absolute;
        top: -85px;
    }

    footer .copyright {
        align-items: flex-start;
        flex-direction: column;
    }


        footer .copyright .follow-link {
            gap: 10px;
            flex-direction: column;
            align-items: flex-start;
        }

    footer .footer-information ul li .address {
        width: unset;
    }

    .search #currentTime {
        display: none !important;
    }
}

@media screen and (max-width: 460px) {
    .menu-bar .header_top .nav-brand img {
        width: 64px;
        height: 64px;
    }

    .menu-bar .header_bottom .icon-search {
        top: -55px;
    }

    #currentTime {
        display: none;
    }

    .language-object {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        flex-direction: column;
    }

        .language-object > *:not(:last-child)::after, .extraoption #currentTime::after {
            content: none
        }

    .menu-bar .header_top .nav-brand .logocontent .toplogocontent {
        font-size: 16px;
    }

    .menu-bar .header_top .nav-brand .logocontent .bottomlogocontent {
        font-size: 22px;
    }

    footer .Footer_ThongTin h2 {
        font-size: 16px;
    }

    .menu-bar .header_top .nav-brand .logocontent {
        gap: 4px;
    }

    .language-object > * {
        margin-right: 0;
        padding-right: 0;
    }
}

@media screen and (max-width: 380px) {
    .footer-CM > div {
        flex: 0 0 100%;
    }

    footer .main-footer .footer-action {
        flex-direction: column;
        align-items: flex-start;
    }
}
