.header {
    transition: .5s ease-in-out;
    position: relative;
    display: unset
}

    .header .header_optional {
        box-shadow: 0 2px 4px rgba(30, 45, 190, .12);
        display: unset;
    }

.header_optional > .nav_header {
    transition: .5s ease-in-out;
    background: 0 0/cover #fff;
    position: sticky;
    top: 0;
    z-index: 2;
    /* border-bottom: 1px solid #e7ebf1; */
    background: #0057E7;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.15);
}

.menu-bar {
    background-color: #fff;
    border-bottom: none;
    display: unset
}

.fixed-header .header_optional > .nav_header {
    width: 100%;
    /*    background-color: #fff*/
}

.menu-bar .header_top {
    background-size: cover;
    /* border-bottom: 1px solid #e7ebf1; */
    z-index: 3;
    position: relative;
    background: linear-gradient(180deg, #EDF4FF 0%, #FFF 100%);
}

    .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 .nav-brand {
        display: flex;
        align-items: center;
        padding: 11px 0;
        height: 100%;
        position: relative
    }

        .menu-bar .header_top .nav-brand::after {
            content: "";
            /* display: block;
    background: url(../images/bg-header.png) center no-repeat;
    width: 800px;
    position: absolute;
    height: 100%;
    left: -95px;
    z-index: -1 */
        }

        .menu-bar .header_top .nav-brand > a {
            display: flex;
            flex-shrink: 0
        }

        .menu-bar .header_top .nav-brand img {
/*            width: 116px;*/
            height: auto;
            max-height: 100px;
            margin-right: 0;
            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: 0;
        }

            .menu-bar .header_top .nav-brand .logocontent .toplogocontent {
                text-transform: uppercase;
                color: #0057E7;
                font-family: Mulish, sans-serif;
                font-size: 24px;
                font-weight: 1000;
                font-style: italic;
                line-height: 32px;
            }

            .menu-bar .header_top .nav-brand .logocontent .bottomlogocontent {
                color: #6B7A99;
                font-family: Mulish, sans-serif;
                font-size: 18px;
                font-style: normal;
                font-weight: 900;
                line-height: 26px;
                text-transform: uppercase;
                font-style: italic;
            }

.menu-bar .header_bottom > #main-menu {
    float: unset
}

.menu-bar .header_bottom > ul > li {
    margin-right: 30px
}

    #searchModal .modal-body .search .searchInputContainer,
    .menu-bar .header_bottom > ul > li:hover {
        border: none
    }

    .menu-bar .header_bottom > ul > li > a {
        letter-spacing: .15px;
        color: var(--text-white, #182940);
        font-family: "Mulish SemiBold", sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5;
        padding: 12px 0;
        /* text-transform: uppercase; */
        transition: none
    }

        .menu-bar .header_bottom > ul > li:hover > a,
        .menu-bar .header_bottom > ul > li > a.current,
        .menu-bar .header_bottom > ul > li > a:hover,
        .menu-bar .mini_nav .header_bottom > ul > li:hover > a,
        .menu-bar .mini_nav .header_bottom > ul > li > a.current,
        .menu-bar .mini_nav .header_bottom > ul > li > a:hover {
            color: #fff;
        }

            .menu-bar .header_bottom > ul > li:hover > a::before,
            .menu-bar .header_bottom > ul > li > a.current::before,
            .menu-bar .header_bottom > ul > li > a:hover::before {
                content: "";
                position: absolute;
                bottom: 0;
                width: 100%;
                border-bottom: 3px solid #F59E0B;
                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: 16px;
                height: 16px;
                background-image: url("../images/arrow-down.svg");
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                right: 0;
                background-size: contain;
                background-repeat: no-repeat;
            }

            .menu-bar .header_bottom > ul > li:hover > a::after,
            .menu-bar .header_bottom > ul > li > a.has-submenu.current::after,
            .menu-bar .header_bottom > ul > li > a.has-submenu:hover::after {
                background-image: url("../images/arrow-down.svg");
                background-size: contain;
                background-repeat: no-repeat;
            }

    .menu-bar .header_bottom > ul > li:last-child,
    .menu-bar .mini_nav .header_bottom > ul > li:last-child {
        margin-right: 0
    }

    .menu-bar .header_bottom ul li > a[title="Đào tạo"] ~ .RenderChildNodesMegaMenu .MegaMenu-wrapper a .sub-arrow,
    .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: 'Mulish SemiBold', sans-serif;
        font-weight: 700;
        font-size: 16px;
        line-height: 1.5;
        letter-spacing: .15px;
        color: #333;
        padding: 5px 16px;
    }

    .menu-bar .header_bottom > ul > li > ul li a.current {
        color: #0057E7
    }

    .menu-bar .header_bottom > ul > li > ul > li > a.has-submenu {
        padding: 5px 30px 5px 16px;
    }

    .menu-bar .header_bottom > ul > li > ul,
    .menu-bar .header_bottom > ul > li > ul > li > ul {
        padding: 7px 0;
        transition: .5s ease-in-out;
        background: #fff;
        border-radius: 4px;
        box-shadow: 0 0 6px 0 #CAD2EC;
    }

        .menu-bar .header_bottom > ul > li > ul > li > a:hover {
            background: 0 0;
            color: #0057E7;
        }

.menu-bar .header_bottom {
    display: flex;
    justify-content: space-between;
    position: relative;
    align-items: center
}

    .menu-bar .header_bottom > ul > li.has_megamenu,
    .sm {
        position: unset
    }

    .menu-bar .header_bottom ul li > a[title="Đào tạo"] ~ .RenderChildNodesMegaMenu {
        width: auto !important;
        max-width: unset !important;
        transition: none;
        padding: 20px;
        margin: 0 !important
    }

        .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;
                color: #e88a27;
                transition: none;
                padding: 0 0 10px
            }

            .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;
                    display: -webkit-box;
                    -webkit-box-orient: vertical;
                    overflow: hidden;
                    -webkit-line-clamp: 1;
                    color: #333;
                    transition: 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: 0 0;
                        color: #e88a27 !important;
                        -webkit-line-clamp: unset;
                        max-height: 200px;
                        transition: .5s ease-in-out
                    }

@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>')
        }

    #main-menu {
        -webkit-font-smoothing: subpixel-antialiased
    }

        #main-menu > li > ul.show-animation {
            -webkit-animation: .3s show-animation;
            animation: .3s show-animation
        }

    @-webkit-keyframes show-animation {
        0% {
            opacity: 0
        }

        100% {
            opacity: 1
        }
    }

    @keyframes show-animation {
        0% {
            opacity: 0
        }

        100% {
            opacity: 1
        }
    }

    #main-menu > li > ul.hide-animation {
        -webkit-animation: .3s hide-animation;
        animation: .3s hide-animation
    }

    @-webkit-keyframes hide-animation {
        0% {
            opacity: 1
        }

        100% {
            opacity: 0
        }
    }

    @keyframes hide-animation {
        0% {
            opacity: 1
        }

        100% {
            opacity: 0
        }
    }
}

#searchModal .modal-content {
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .3);
    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
    }

#searchModal .modal-body {
    padding: 0 20px 15px
}

.extraoption #currentTime,
.language-object > :not(:last-child) {
    margin-right: 10px;
    padding-right: 10px
}

#searchModal .modal-body input {
    border-radius: 60px;
    border: 1px solid #ecd7c5;
    padding: 10px 15px;
    background: 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 #fffbf0;
    background-position: calc(100% - 15px) 50%;
    outline: 0
}

footer {
    padding-top: 20px;
    background: 0 0/cover #fff;
    border: none;
    position: relative;
    /*    border-top: 2px solid #ffb6ba;*/
    background-image: url("../images/footer-bg.png");
    overflow: hidden;
}

    footer::before {
        content: none;
        display: block;
        width: 100%;
        height: 40px;
        position: absolute;
        top: -40px
    }

    footer .Footer_ThongTin {
        display: flex;
        flex-direction: column
    }

        footer .Footer_ThongTin * {
            color: #fff;
            font-family: "Mulish Regular", sans-serif;
            font-size: 14px;
            font-style: normal;
            font-weight: 400;
            line-height: 1.42;
            display: block;
        }

        footer .Footer_ThongTin > span {
            display: block;
            position: relative;
            padding-left: 22px;
        }

            footer .Footer_ThongTin > span::before {
                content: "";
                width: 14px;
                height: 14px;
                position: absolute;
                left: 0;
                top: 50%;
                transform: translateY(-50%);
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
            }

            footer .Footer_ThongTin > span:nth-of-type(1):before {
                background-image: url("../images/icon-thongtin-1.svg");
            }

            footer .Footer_ThongTin > span:nth-of-type(2):before {
                background-image: url("../images/icon-thongtin-2.svg");
            }

            footer .Footer_ThongTin > span:nth-of-type(3):before {
                background-image: url("../images/icon-thongtin-3.svg");
            }

            footer .Footer_ThongTin > span:nth-of-type(4):before {
                background-image: url("../images/icon-thongtin-4.svg");
            }

            footer .Footer_ThongTin > span:not(:last-child) {
                margin-bottom: 4px;
            }

        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, #d61c26);
            font-family: "Mulish Bold", sans-serif;
            font-size: 18px;
            font-style: normal;
            font-weight: 600;
            line-height: 1.44;
            text-transform: uppercase;
            margin-bottom: 12px;
            background: url("../images/logo-footer.png") no-repeat left center;
            height: 50px;
        }

    footer .Footer_QR > * .Title,
    footer .Footer_QR > * span {
        color: #8EC5FF;
        font-style: normal;
        font-weight: 400
    }

    footer .Footer_QR {
        border-radius: 10px;
        /* border: 1px solid #f5d6d6; */
        /* background: #fff5f5; */
        padding: 15px;
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        row-gap: 24px
    }

        footer .Footer_QR > :not(:last-child) {
            /* margin-right: 20px;
    padding-right: 20px;
    border-right: 1px solid #f5d6d6 */
        }

        footer .Footer_QR > * .Title {
            text-align: center;
            font-family: "Roboto Slab";
            font-size: 14px;
            line-height: 1.42;
            margin-bottom: 10px
        }

        footer .Footer_QR > * span {
            font-family: "Mulish Regular", sans-serif;
            font-size: 14px;
            line-height: 1.42;
        }

.DnnModule-OnlineCounter .ModOnlineCounterC {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-flow: row wrap;
}

    .DnnModule-OnlineCounter .ModOnlineCounterC .counteronline {
        position: relative;
        display: block;
        padding: 8px 12px 8px 36px;
        border-radius: 8px;
        border: 1px solid rgba(255, 255, 255, 0.15);
        background: rgba(255, 255, 255, 0.10);
    }

        .DnnModule-OnlineCounter .ModOnlineCounterC .counteronline:before {
            content: "";
            position: absolute;
            left: 12px;
            top: 50%;
            transform: translateY(-50%);
            width: 16px;
            height: 16px;
            background-size: contain;
        }

        .DnnModule-OnlineCounter .ModOnlineCounterC .counteronline.hitcounter_totalonline:before {
            background: url("../images/icon-luottruycap.svg") no-repeat center;
        }

        .DnnModule-OnlineCounter .ModOnlineCounterC .counteronline.hitcounter_totalvisitor:before {
            background: url("../images/icon-tongluottruycap.svg") no-repeat center;
        }

        .DnnModule-OnlineCounter .ModOnlineCounterC .counteronline span:last-child {
            font-family: "Mulish Bold", sans-serif;
            font-size: 14px;
            font-style: normal;
            font-weight: 700;
            line-height: 1.42;
            color: #E37900;
        }

.socical-icon img {
    border-radius: 50%;
}

footer .copyright,
footer .copyright a {
    color: #8EC5FF;
    font-style: normal;
    font-weight: 400;
    line-height: 1.42
}

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: center;
    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;
    justify-content: flex-end;
    gap: 12px;
    flex-wrap: wrap;
}

    footer .follow-link > div {
        flex-shrink: 0
    }

footer .footer-sub {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    row-gap: 10px
}

footer .copyright {
    font-family: "Arimo Regular", sans-serif;
    font-size: 14px;
    display: flex;
    flex-direction: column;
    line-height: 1.42;
    gap: 5px
}

.extraoption #currentTime,
.language-object a,
.language-object span {
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: Roboto;
    font-size: 14px;
    line-height: 1.57;
    position: relative;
    color: var(--text-mi, #182940);
    font-weight: 500
}

footer .copyright a {
    font-family: Roboto;
    font-size: 14px
}

.menu-bar .mini_nav .header_bottom > ul > li > a,
.mini_nav h6 a,
.mini_nav > a.Home-link {
    font-family: "Roboto Slab";
    font-style: normal;
    line-height: 1.5
}

footer .main-footer {
    margin-bottom: 20px;
    display: flex;
    gap: 12px;
    flex-direction: column;
    height: 100%;
    width: 100%
}

    footer .main-footer .footer-main {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        row-gap: 15px
    }

.language-object,
.mini_nav h6 {
    display: flex;
    align-items: center;
    justify-content: center
}

.extraoption,
.mini_nav > a.Home-link {
    align-items: center;
    display: flex
}

.language-object a,
.language-object span {
    font-style: normal
}

.extraoption #currentTime::after,
.language-object > :not(:last-child)::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 #currentTime {
    font-style: normal
}

.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%);
        justify-content: center;
        gap: 8px;
        color: #fff;
        font-size: 16px;
        font-weight: 500;
        border-radius: 6px;
        background: var(--red, #d61c26);
        padding: 6px 12px
    }

    .mini_nav h6 a {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        color: var(--red, #d61c26);
        font-size: 22px;
        font-weight: 600;
        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 > a {
        color: var(--text-mi, #182940);
        font-size: 16px;
        font-weight: 500;
        text-transform: none
    }

        .menu-bar .mini_nav .header_bottom > ul > li:hover > a::before,
        .menu-bar .mini_nav .header_bottom > ul > li > a.current::before,
        .menu-bar .mini_nav .header_bottom > ul > li > a:hover::before {
            bottom: 8px
        }


.searchHeader {
    position: relative;
}

    .searchHeader .search-input {
        height: 40px;
        padding: 10px 76px 10px 16px;
        background-color: #fff;
        border-radius: 360px;
        border: 1px solid #C9DAED;
        background: #FFF;
        min-width: 430px;
        transition: all .5s ease-in-out;
    }

    .searchHeader .searchButton {
        cursor: pointer;
        display: inline-block;
        background-color: #E37900;
        padding: 6px;
        border-radius: 0 360px 360px 0;
        width: 60px;
        height: 38px;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 1px;
        background-image: url(../images/icon-search.svg);
        background-repeat: no-repeat;
        background-position: 19px 50%;
    }

.input-search-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

/* Nút xóa */
#clear-button {
    position: absolute;
    right: 65px; /* Căn lề phải, nằm trước nút searchButton */
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    color: #999;
    width: 20px;
    height: 20px;
    line-height: 18px;
    text-align: center;
    border-radius: 50%;
    user-select: none;
    display: none; /* Mặc định ẩn */
}

    #clear-button:hover {
        background-color: #eee;
        color: #333;
    }

/* Định vị khung kết quả đổ xuống */
#searchResults {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1050;
    background: #fff;
    border: 1px solid #C0DBFF;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    max-height: 400px;
    overflow-y: auto;
    margin-top: 4px;
    border-radius: 8px;
}

/* Hover item kết quả */
.search-result-item a:hover {
    background-color: #f8f9fa;
}

.search-results-list {
}

    .search-results-list .search-result-item {
        border-bottom: 1px solid #C0DBFF;
    }

        .search-results-list .search-result-item .search-result-item-wrapper {
            display: flex;
            align-items: flex-start;
            gap: 12px;
            padding: 8px 16px;
        }

        .search-results-list .search-result-item:last-child {
            border-bottom: 0;
        }

.search-view-all {
    padding: 8px 16px;
    text-align: center;
    font-family: Mulish, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.42;
    border-top: 1px solid #C0DBFF;
}

.search-item-img img,
.search-item-img {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid #D5E3F5;
    flex-shrink: 0;
}

.search-item-info .search-item-title {
    color: #1A1F36;
    font-family: Mulish, sans-serif;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.5;
    margin-bottom: 4px;
}

.search-item-info .search-item-unit {
    display: block;
    position: relative;
    padding-bottom: 0;
    padding-left: 20px;
    color: #1A1F36;
    font-family: Mulish, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.38;
}

    .search-item-info .search-item-unit:before {
        content: '';
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 14px;
        height: 14px;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        background-image: url(../images/icon-unit.svg);
    }

a.LoginLink {
    color: #6B7A99;
    font-family: Mulish,sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.5; /* 150% */
    display: inline-block;
    position: relative;
    padding-left: 26px;
    cursor: pointer;
}

    a.LoginLink:before {
        content: "";
        width: 18px;
        height: 18px;
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        background-image: url(../images/icon-login.svg);
        background-repeat: no-repeat;
        background-position: center;
    }

.login-nav a.dropdown-item {
    color: #1A1F36;
    font-family: Mulish, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.5; /* 150% */
}

    .login-nav a.dropdown-item.active,
    .login-nav a.dropdown-item:active {
        color: #0057E7 !important;
        background-color: #fff;
    }

@media screen and (max-width:1366px) {
    .menu-bar .header_bottom > ul > li {
        margin-right: 30px
    }

    .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: 0
    }

    .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 {
        gap: 10px
    }

    .menu-bar .header_top .nav_top_option > img {
        max-height: 135px
    }
}

@media screen and (max-width:1117px) {

    #main-menu-state:not(:checked) ~ .header_bottom #main-menu,
    .sm-contra ul a span.sub-arrow {
        display: none
    }

    .sm-contra ul a span.sub-arrow {
        display: block;
    }

    .header_optional > .nav_header {
        position: static;
    }

    .menu-bar .header_top .nav_top_option > img {
        max-height: 130px
    }

    .header .contra-nav label {
        display: block;
        z-index: 100;
        margin: 0;
        float: unset;
        position: absolute;
        top: 12px;
        right: 12px;
    }

    .header_top .login-nav {
        display: none;
    }

    .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-brand {
/*        margin-left: 45px*/
    }

    .main-menu-btn-icon,
    .main-menu-btn-icon:after,
    .main-menu-btn-icon:before {
        background: #73190f;
        width: 20px
    }

    #main-menu-state:not(:checked) ~ .header_bottom .nav-action {
        display: flex
    }
}

@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 .main-footer > div:first-child {
            flex: 0 0 100%;
            max-width: 100%
        }
}

@media screen and (max-width:767px) {
    .header .contra-nav label {
        top: 12px;
    }

    .menu-bar .header_bottom > ul > li > a.has-submenu::after {
        content: none
    }

    .header_top .login-nav {
        display: none;
    }

    .menu-bar .header_bottom > ul > li > ul > li > a:hover {
        color: #FFD23B !important;
    }
    .menu-bar .header_bottom > ul > li > ul,
    .menu-bar .header_bottom > ul > li > ul > li > ul {
        background-color: transparent;
    }

        .menu-bar .header_bottom > ul > li > ul, .menu-bar .header_bottom > ul > li > ul > li > ul {
            padding: 0;
            box-shadow: unset;
            width: 100% !important;
        }


    .menu-bar .header_top .nav-information,
    .menu-bar .header_top .nav_top_option > img {
        display: none
    }

    .menu-bar .header_top .nav-brand::after {
        width: 100%;
        left: 0;
        display: none;
    }

    #main-menu:before,
    .menu-bar .header_bottom > ul > li:hover > a::before,
    .menu-bar .header_bottom > ul > li > a.current::before,
    .menu-bar .header_bottom > ul > li > a:hover::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 > ul > li > a,
    .menu-bar .header_bottom > ul > li > ul > li > ul > li > a,
    .menu-bar .header_bottom > ul > li > ul > li > a.has-submenu {
        padding: 12px 16px;
    }

    .menu-bar .header_bottom > ul > li > a.has-submenu {
        margin-right: 0
    }

    .header_optional > .nav_header,
    .sm-contra > li:hover {
/*        background: 0 0*/
    }

    .menu-bar .header_bottom > ul > li > a {
        padding: 12px;
        transition: all .3s ease-in-out;
    }

        .menu-bar .header_bottom > ul > li > ul li a.current,
        .menu-bar .header_bottom > ul > li:hover > a,
        .menu-bar .header_bottom > ul > li > a.current,
        .menu-bar .header_bottom > ul > li > a:hover {
            border-bottom: none;
            color: #FFD23B;
        }

        .menu-bar .header_bottom > ul > li > a.current {
            background-color: transparent;
        }
        .menu-bar .header_top .nav-brand {
            margin-left: 0;
        }

    .menu-bar .header_top .nav_top_option {
        justify-content: flex-start;
        margin: 0
    }

    .menu-bar .logocontent {
        align-items: flex-start
    }

    .header .contra-nav label {
        left: unset;
    }

    .menu-bar .header_bottom .icon-search {
        top: -58px;
        right: 50px
    }

    .menu-bar .header_bottom {
        display: block
    }

        .menu-bar .header_bottom > ul > li > ul {
            background: 0 0;
            box-shadow: none;
            padding: 0;
            margin-bottom: 0
        }

            .menu-bar .header_bottom > ul > li > ul > li {
                display: flex;
                align-items: center;
                padding-bottom: 0;
                flex-direction: column;
                align-items: flex-start;
            }

                .menu-bar .header_bottom > ul > li > ul > li:last-child,
                .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: 700;
                    display: inline-block;
                    width: 1em;
                    margin-left: -1em;
                    display: none
                }

                .fixed-header .header_optional > .nav_header {
                    position: relative
                }

                .menu-bar .header_bottom > ul > li {
                    margin-right: 0;
                }

                    .menu-bar .header_bottom > ul > li > ul > li > a,
                    .menu-bar .header_bottom > ul > li > ul > li > ul > li > a {
                        color: #fff;
                        width: 100%;
                    }
            }

@media screen and (max-width:700px) {
    .menu-bar .header_top .nav-brand img {
/*        width: 64px;
        height: 64px*/
    }

    .menu-bar .header_top .nav-brand {
        align-items: flex-start
    }

    .logocontent .toplogocontent {
        font-size: 20px
    }

    .logocontent .bottomlogocontent,
    .menu-bar .header_top .nav-brand .logocontent .bottomlogocontent {
        font-size: 28px
    }

    .header .contra-nav label {
    }

    .menu-bar .header_top .nav-brand .logocontent .toplogocontent {
        font-size: 18px
    }
}

@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,
    footer .main-footer .footer-main .footer-CM {
        display: none
    }

    footer .Footer_QR {
        justify-content: center
    }

    .header .contra-nav label {
        position: absolute;
    }

    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
    }
}

@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: row;
        gap: 15px
    }

        .extraoption #currentTime::after,
        .language-object > :not(:last-child)::after {
            content: none
        }

    .menu-bar .header_top .nav-brand .logocontent .toplogocontent,
    footer .Footer_ThongTin h2 {
        font-size: 16px
    }

    .menu-bar .header_top .nav-brand .logocontent .bottomlogocontent {
        font-size: 22px
    }

    .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
    }
}

g973