@font-face {
    font-family: "Mulish Regular";
    src: url(../fonts/Mulish/Mulish-Regular.ttf);
    font-weight: 400
}

@font-face {
    font-family: "Mulish Medium";
    src: url(../fonts/Mulish/Mulish-Medium.ttf);
    font-weight: 500
}

@font-face {
    font-family: "Mulish SemiBold";
    src: url(../fonts/Mulish/Mulish-SemiBold.ttf);
    font-weight: 600
}

@font-face {
    font-family: "Mulish Bold";
    src: url(../fonts/Mulish/Mulish-Bold.ttf);
    font-weight: 700
}

@font-face {
    font-family: "Mulish Black";
    src: url(../fonts/Mulish/Mulish-Black.ttf);
    font-weight: 800
}

@font-face {
    font-family: "Arimo Regular";
    src: url(../fonts/Arimo/Arimo-Regular.ttf);
    font-weight: 400
}

@font-face {
    font-family: "Arimo Medium";
    src: url(../fonts/Arimo/Arimo-Medium.ttf);
    font-weight: 500
}

@font-face {
    font-family: "Arimo SemiBold";
    src: url(../fonts/Arimo/Arimo-SemiBold.ttf);
    font-weight: 600
}

@font-face {
    font-family: "Arimo Bold";
    src: url(../fonts/Arimo/Arimo-Bold.ttf);
    font-weight: 700
}

a,
a:hover {
    text-decoration: none
}

b,
body,
p,
strong {
    font-family: Mulish, sans-serif;
}

iframe {
    border-radius: 12px;
}

.g-recaptcha iframe {
    border-radius: 0;
}

.container.container-full,
img {
    max-width: 100%
}

.btn,
.form-group select {
    font-family: inherit;
    font-style: normal
}

.loader span:nth-child(2),
.loader span:nth-child(3) {
    animation: 1.2s ease-in-out infinite both loaderBlockInverse
}

.btn,
.form-group select,
body {
    font-style: normal
}

[type=checkbox],
select {
    -webkit-appearance: none
}

body {
    font-weight: 400;
    color: var(--text-mi, #182940)
}

:root {
    --title: #001533;
    --text: #182940;
    --second-text: #173C68;
    --blur-text: #5E718F;
    --sub-text: #EDEDED;
    --main-purple: #0765E3;
    --background-green: #24A148;
    --background-blue: #0043CE;
    --white: #FFFFFF;
    --border-gray: #E3E6EB;
    --border-background: #F4F4FC
}

.form-control:focus,
.search-input:focus {
    outline: none;
    box-shadow: 0 0 5px .2rem rgba(30, 45, 190, .15)
}

body section {
    margin-bottom: 40px
}

@media screen and (max-width:1024px) {
    body section {
        margin-bottom: 35px
    }
}

@media screen and (max-width:768px) {
    body section {
        margin-bottom: 30px
    }
}

@media screen and (max-width:576px) {
    body section {
        margin-bottom: 20px
    }
}

.main-body-content {
    min-height: calc(100vh - 565px);
    padding: 15px 0 20px
}

.list_Advertisement,
li,
ul {
    padding: 0
}

.home-layout .main-body-content {
    min-height: calc(100vh - 565px);
    padding: 0
}

.home-layout .main-body-content {
    padding: 16px 0 40px;
    overflow: hidden;
}

    .home-layout .main-body-content.main-body-content-home {
        padding: 0;
        overflow: hidden;
    }

        .home-layout .main-body-content.main-body-content-home section {
            padding: 30px 0;
            margin-bottom: 0;
        }

            .home-layout .main-body-content.main-body-content-home section.SectionSangChe {
                padding-bottom: 0;
            }

.SectionSangChe .TitleCM {
    display: block !important;
}

.SectionBanner {
    min-height: 310px;
    background-image: url(../images/background.png);
    background-size: cover;
    background-position: center;
}

section.section-color-blue {
    background-color: #F0F4FA;
}

.text-center {
    text-align: center;
    vertical-align: middle
}

.text-left {
    text-align: left;
    vertical-align: middle
}

.contraC .Head {
    margin-bottom: 0
}

::-webkit-scrollbar {
    width: 8px;
    height: 4px
}

::-webkit-scrollbar-track {
    background-color: transparent;
    border-radius: 20px
}

::-webkit-scrollbar-thumb {
    background-color: #c1c1c1;
    border-radius: 20px;
    border: 8px solid transparent
}

    ::-webkit-scrollbar-thumb:hover {
        background-color: #979595
    }

li,
ul {
    margin: 0;
    list-style-type: none
}

img {
    object-fit: contain;
    object-position: 50% 50%
}

a:hover {
    color: inherit
}

p {
    color: var(--text);
    line-height: 1.5
}

b,
strong {
    font-weight: 700
}

.container {
    max-width: 1410px
}

.row.mini-row {
    margin-right: -8px;
    margin-left: -8px
}

    .row.mini-row .row.mini-row {
        row-gap: 16px
    }

    .row.mini-row > [class*=col-] {
        padding-right: 8px;
        padding-left: 8px
    }

select {
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: ''
}

.form-group select {
    background: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.22007 8.47C4.52007 8.17 4.99007 8.17 5.28007 8.47L12.0001 15.19L18.7201 8.47C18.7887 8.39631 18.8715 8.33721 18.9635 8.29622C19.0555 8.25523 19.1548 8.23319 19.2556 8.23141C19.3563 8.22963 19.4563 8.24816 19.5497 8.28588C19.6431 8.3236 19.7279 8.37974 19.7991 8.45096C19.8703 8.52218 19.9265 8.60702 19.9642 8.7004C20.0019 8.79379 20.0204 8.89382 20.0187 8.99452C20.0169 9.09523 19.9948 9.19454 19.9539 9.28654C19.9129 9.37854 19.8538 9.46134 19.7801 9.53L12.5301 16.78C12.2301 17.08 11.7601 17.08 11.4701 16.78L4.22007 9.53C4.07962 9.38938 4.00073 9.19875 4.00073 9C4.00073 8.80125 4.07962 8.61063 4.22007 8.47Z" fill="%230A0D14"/></svg>') no-repeat #fff;
    border: 1px solid var(--border-table, #ced8eb);
    padding: 8px 12px !important;
    border-radius: 4px !important;
    outline: 0;
    height: 42px !important;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: .5px;
    color: var(--text-main);
    background-position: calc(100% - 12px) center
}

@media screen and (max-width:1440px) and (min-width:1240px) {
    .container {
        max-width: 1344px
    }
}

@media screen and (max-width:1240px) and (min-width:1118px) {
    .container {
        max-width: 1200px
    }
}

@media screen and (max-width:991px) and (min-width:871px) {
    .container {
        max-width: 980px
    }
}

@media screen and (max-width:870px) {
    .container {
        max-width: 850px
    }
}

@media screen and (max-width:800px) {
    .container {
        max-width: 790px
    }
}

.back-to-top a::after {
    content: 'north';
    color: #f58220;
    font-size: 24px;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 400 !important
}

.anim-scroll-to-top.active-progress {
    opacity: 1;
    visibility: visible;
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.anim-scroll-to-top {
    z-index: 1000;
    position: fixed;
    right: 30px;
    bottom: 110px;
    height: 50px;
    width: 50px;
    cursor: pointer;
    display: none;
    border-radius: 50px;
    box-shadow: inset 0 0 0 2px rgba(38, 166, 254, .2);
    opacity: 0;
    visibility: hidden;
    -moz-transform: translateY(15px);
    -o-transform: translateY(15px);
    -ms-transform: translateY(15px);
    -webkit-transform: translateY(15px);
    transform: translateY(15px);
    -moz-transition: .3s ease-out;
    -webkit-transition: .3s ease-out;
    -ms-transition: .3s ease-out;
    -o-transition: .3s ease-out;
    transition: .3s ease-out
}

    .anim-scroll-to-top svg.progress-circle path {
        stroke: rgb(38, 166, 254);
        stroke-width: 4;
        box-sizing: border-box
    }

    .anim-scroll-to-top svg path {
        fill: none
    }

    .anim-scroll-to-top::after {
        content: "";
        position: absolute;
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path d="M480-80q-17 0-28.5-11.5T440-120v-607L284-572q-11 11-27.5 11.5T228-572q-11-11-11-28t11-28l224-224q6-6 13-8.5t15-2.5q8 0 15 2.5t13 8.5l224 224q11 11 11 27.5T732-572q-12 12-28.5 12T675-572L520-727v607q0 17-11.5 28.5T480-80Z" fill="%2326A6FE"/></svg>');
        background-repeat: no-repeat;
        background-position: center;
        left: 0;
        top: 0;
        height: 50px;
        width: 50px;
        cursor: pointer;
        display: block;
        z-index: 1;
        -moz-transition: .3s ease-out;
        -webkit-transition: .3s ease-out;
        -ms-transition: .3s ease-out;
        -o-transition: .3s ease-out;
        transition: .3s ease-out
    }

html {
    scroll-behavior: smooth
}

:-webkit-scrollbar {
    width: 8px
}

:-webkit-scrollbar-track {
    background: #b7c0cf;
    border-radius: 12px
}

:-webkit-scrollbar-thumb {
    background: #b7c0cf;
    border-radius: 12px
}

.btn-sidebar {
    position: fixed;
    right: 0;
    top: 30%;
    transform: translateY(-50%);
    z-index: 1105;
    background: #fff;
    padding: 8px;
    border-radius: 50% 0 0 50%;
    box-shadow: -2px 0 4px .1rem rgba(30, 45, 190, .15);
    align-items: center;
    justify-content: center
}

.div-full > .btn-sidebar,
.div-news > .btn-sidebar,
.div-sidebar > .btn-close {
    display: none
}

.home-layout:not(.inner-layout) .div-sidebar {
    max-width: 335px;
    width: 100%;
    top: 0;
    height: 100vh;
    position: fixed;
    right: -100%;
    transition: .5s;
    display: block;
    z-index: 1106;
    padding-top: 30px;
    overflow: hidden auto;
}

.div-sidebar .login-nav {
    display: none;
}

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

    .div-full > .btn-sidebar,
    .div-news > .btn-sidebar {
        display: flex;
        text-align: right;
        margin-bottom: 8px
    }

    .div-sidebar .login-nav {
        display: block;
    }

    .div-sidebar > .btn-close {
        display: block;
        margin-bottom: 8px
    }

    .div-sidebar {
        max-width: 335px;
        width: 100%;
        top: 0;
        height: 100vh;
        position: fixed;
        right: -100%;
        transition: .5s;
        display: block;
        z-index: 9999;
        padding-top: 30px;
        overflow: hidden auto
    }

        .div-sidebar.show {
            display: block !important;
            right: 0 !important;
            background: #fff;
            box-shadow: -4px 0 4px rgba(30, 45, 190, .12)
        }

    .dim-background {
        display: none;
        transition: .5s ease-in-out
    }

    .div-full.has_sidebar .dim-background,
    .div-news.has_sidebar .dim-background {
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background: rgba(0, 0, 0, .6);
        z-index: 100;
        display: block
    }

    .div-full,
    .div-main,
    .div-news {
        flex: 0 0 100%;
        max-width: 100%
    }
}

.btn {
    border-radius: 8px !important;
    padding: 12px 16px !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
    color: #fff !important;
    font-weight: 700 !important;
    min-width: 120px;
    border: none !important;
    outline: 0 !important
}

.btn-primary,
.btn-success {
    transition: all 0.3s ease-in-out;
    background: var(--main-purple) !important;
    border: 1px solid var(--main-purple) !important;
}

/*    .btn-primary:hover,
    .btn-success:hover {
        background-color: #fff !important;
        color: var(--main-purple) !important;
        border: 1px solid var(--main-purple) !important;
    }*/

.btn-brown {
    background: #73190f !important
}

.btn.btn-danger,
.btn.btn-warning,
a.btn.btn-danger,
a.btn.btn-warning {
    background: var(--btn-warning) !important;
    color: var(--white) !important;
    margin-right: 8px
}

.btn-secondary,
.btn-secondary:hover {
    background: var(--btn-secondary) !important
}

.btn-secondary {
    border-radius: 4px;
    padding: 8px 16px !important;
    margin-right: 8px
}

.btn-outline-primary,
.btn-outline-primary2 {
    padding: 8px 16px;
    background: var(--white) !important
}

.btn-outline-primary {
    border: 1px solid var(--main-purple) !important;
    border-radius: 4px;
    color: var(--main-purple) !important
}

.btn-outline-primary2 {
    border: 1px solid #73190f !important;
    border-radius: 4px;
    color: #73190f !important
}

.btn-outline-primary:hover {
    background: var(--white) !important;
    color: #000
}

.btn-outline-primary:focus {
    outline: 0
}

.btn-warning:hover {
    background: #e11d48 !important
}

.btn-red {
    background: var(--red, #d61c26)
}

    .btn-red:hover {
        background: #fff;
        color: var(--red, #d61c26) !important;
        border: 1px solid var(--red, #d61c26) !important
    }

.btn-black {
    background: var(--text-mi, #182940)
}

    .btn-black:hover {
        background: #fff;
        color: var(--text-mi, #182940) !important;
        border: 1px solid var(--text-mi, #182940) !important
    }

.btn-orange {
    background: var(--vng-m, #ea8f00)
}

    .btn-orange:hover {
        background: #fff;
        color: var(--vng-m, #ea8f00) !important;
        border: 1px solid var(--vng-m, #ea8f00) !important
    }

.group-button-action {
    display: flex;
    gap: 15px
}

@keyframes loader {

    0%, 10%, 100% {
        width: 80px;
        height: 80px
    }

    65% {
        width: 150px;
        height: 150px
    }
}

@keyframes loaderBlock {

    0%, 30% {
        transform: rotate(0)
    }

    55% {
        background-color: #e0954f
    }

    100% {
        transform: rotate(90deg)
    }
}

@keyframes loaderBlockInverse {

    0%, 20% {
        transform: rotate(0)
    }

    55% {
        background-color: #e0954f
    }

    100% {
        transform: rotate(-90deg)
    }
}

.loading {
    overflow: hidden;
    height: 100vh
}

.pre-loader {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 1000;
    background: #fff
}

.loader {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 80px;
    height: 80px;
    /*    transform: translate(-50%, -50%) rotate(45deg) translate3d(0, 0, 0);
    animation: 1.2s ease-in-out infinite loader*/
}

    .loader span {
        position: absolute;
        display: block;
        width: 40px;
        height: 40px;
        background-color: transparent !important;
        animation: 1.2s ease-in-out infinite both loaderBlock
    }

        .loader span:first-child {
            top: 0;
            left: 0
        }

        .loader span:nth-child(2) {
            top: 0;
            right: 0
        }

        .loader span:nth-child(3) {
            bottom: 0;
            left: 0
        }

        .loader span:nth-child(4) {
            bottom: 0;
            right: 0
        }

[type=radio]:checked,
[type=radio]:not(:checked) {
    position: absolute;
    left: -9999px
}

    [type=radio]:checked + label,
    [type=radio]:not(:checked) + label {
        position: relative;
        padding-left: 28px;
        cursor: pointer;
        display: inline-block;
        font-family: Roboto !important;
        font-style: normal;
        font-weight: 500 !important;
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 0;
        color: var(--text-mi, #182940)
    }

        [type=radio]:checked + label:before,
        [type=radio]:not(:checked) + label:before {
            content: '';
            position: absolute;
            left: 0;
            top: 0;
            width: 20px;
            height: 20px;
            border: 1px solid #ddd;
            border-radius: 100%;
            background: #fff
        }

        [type=radio]:checked + label:before {
            border-color: var(--blue, #0765e3)
        }

        [type=radio]:checked + label:after,
        [type=radio]:not(:checked) + label:after {
            content: '';
            width: 12px;
            height: 12px;
            background: var(--blue, #0765e3);
            position: absolute;
            top: 4px;
            left: 4px;
            border-radius: 100%;
            -webkit-transition: .2s;
            transition: .2s
        }

        [type=radio]:not(:checked) + label:after {
            opacity: 0;
            -webkit-transform: scale(0);
            transform: scale(0)
        }

        [type=radio]:checked + label:after {
            opacity: 1;
            -webkit-transform: scale(1);
            transform: scale(1)
        }

[type=checkbox] {
    appearance: none;
    background-color: transparent;
    margin: 0;
    font: inherit;
    color: currentColor;
    height: 1.15em;
    transform: translateY(-.075em);
    display: grid;
    place-content: center;
    box-sizing: border-box;
    padding: 0 !important;
    border-radius: 0 !important;
    border: none !important;
    width: 24px
}

    [type=checkbox]::before {
        content: "";
        width: 24px;
        height: 24px;
        display: block;
        background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3 6.25C3 4.45 4.46 3 6.25 3H17.75C19.55 3 21 4.46 21 6.25V17.75C21 19.55 19.54 21 17.75 21H6.25C5.38805 21 4.5614 20.6576 3.9519 20.0481C3.34241 19.4386 3 18.612 3 17.75V6.25ZM6.25 4.5C5.28 4.5 4.5 5.28 4.5 6.25V17.75C4.5 18.72 5.28 19.5 6.25 19.5H17.75C18.72 19.5 19.5 18.72 19.5 17.75V6.25C19.5 5.28 18.72 4.5 17.75 4.5H6.25Z" fill="%23E2E4E9"/></svg>');
        transition: .2s ease-in-out
    }

    [type=checkbox]:checked::before {
        content: "";
        width: 24px;
        height: 24px;
        display: block;
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><mask id="mask0_28_4142" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_28_4142)"><path d="M10.6 13.4L8.45 11.25C8.26667 11.0667 8.03333 10.975 7.75 10.975C7.46667 10.975 7.23333 11.0667 7.05 11.25C6.86667 11.4333 6.775 11.6667 6.775 11.95C6.775 12.2333 6.86667 12.4667 7.05 12.65L9.9 15.5C10.1 15.7 10.3333 15.8 10.6 15.8C10.8667 15.8 11.1 15.7 11.3 15.5L16.95 9.85C17.1333 9.66667 17.225 9.43333 17.225 9.15C17.225 8.86667 17.1333 8.63333 16.95 8.45C16.7667 8.26667 16.5333 8.175 16.25 8.175C15.9667 8.175 15.7333 8.26667 15.55 8.45L10.6 13.4ZM5 21C4.45 21 3.97917 20.8042 3.5875 20.4125C3.19583 20.0208 3 19.55 3 19V5C3 4.45 3.19583 3.97917 3.5875 3.5875C3.97917 3.19583 4.45 3 5 3H19C19.55 3 20.0208 3.19583 20.4125 3.5875C20.8042 3.97917 21 4.45 21 5V19C21 19.55 20.8042 20.0208 20.4125 20.4125C20.0208 20.8042 19.55 21 19 21H5Z" fill="%2335C19B"/></g></svg>')
    }

    [type=checkbox]:indeterminate::before {
        content: "";
        width: 24px;
        height: 24px;
        display: block;
        background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7 13H17V11H7V13ZM5 21C4.45 21 3.97917 20.8042 3.5875 20.4125C3.19583 20.0208 3 19.55 3 19V5C3 4.45 3.19583 3.97917 3.5875 3.5875C3.97917 3.19583 4.45 3 5 3H19C19.55 3 20.0208 3.19583 20.4125 3.5875C20.8042 3.97917 21 4.45 21 5V19C21 19.55 20.8042 20.0208 20.4125 20.4125C20.0208 20.8042 19.55 21 19 21H5Z" fill="%235E82D1"/></svg>')
    }

    [type=checkbox]:disabled {
        --form-control-color: var(--form-control-disabled);
        color: var(--form-control-disabled);
        cursor: not-allowed
    }

.sk-fading-circle {
    margin: 50px auto;
    width: 40px;
    height: 40px;
    position: relative
}

    .sk-fading-circle .sk-circle {
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0
    }

        .sk-fading-circle .sk-circle:before {
            content: '';
            display: block;
            margin: 0 auto;
            width: 15%;
            height: 15%;
            background-color: #333;
            border-radius: 100%;
            -webkit-animation: 1.2s ease-in-out infinite both sk-circleFadeDelay;
            animation: 1.2s ease-in-out infinite both sk-circleFadeDelay
        }

    .sk-fading-circle .sk-circle2 {
        -webkit-transform: rotate(30deg);
        -ms-transform: rotate(30deg);
        transform: rotate(30deg)
    }

    .sk-fading-circle .sk-circle3 {
        -webkit-transform: rotate(60deg);
        -ms-transform: rotate(60deg);
        transform: rotate(60deg)
    }

    .sk-fading-circle .sk-circle4 {
        -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg)
    }

    .sk-fading-circle .sk-circle5 {
        -webkit-transform: rotate(120deg);
        -ms-transform: rotate(120deg);
        transform: rotate(120deg)
    }

    .sk-fading-circle .sk-circle6 {
        -webkit-transform: rotate(150deg);
        -ms-transform: rotate(150deg);
        transform: rotate(150deg)
    }

    .sk-fading-circle .sk-circle7 {
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    .sk-fading-circle .sk-circle8 {
        -webkit-transform: rotate(210deg);
        -ms-transform: rotate(210deg);
        transform: rotate(210deg)
    }

    .sk-fading-circle .sk-circle9 {
        -webkit-transform: rotate(240deg);
        -ms-transform: rotate(240deg);
        transform: rotate(240deg)
    }

    .sk-fading-circle .sk-circle10 {
        -webkit-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
        transform: rotate(270deg)
    }

    .sk-fading-circle .sk-circle11 {
        -webkit-transform: rotate(300deg);
        -ms-transform: rotate(300deg);
        transform: rotate(300deg)
    }

    .sk-fading-circle .sk-circle12 {
        -webkit-transform: rotate(330deg);
        -ms-transform: rotate(330deg);
        transform: rotate(330deg)
    }

    .sk-fading-circle .sk-circle2:before {
        -webkit-animation-delay: -1.1s;
        animation-delay: -1.1s
    }

    .sk-fading-circle .sk-circle3:before {
        -webkit-animation-delay: -1s;
        animation-delay: -1s
    }

    .sk-fading-circle .sk-circle4:before {
        -webkit-animation-delay: -.9s;
        animation-delay: -.9s
    }

    .sk-fading-circle .sk-circle5:before {
        -webkit-animation-delay: -.8s;
        animation-delay: -.8s
    }

    .sk-fading-circle .sk-circle6:before {
        -webkit-animation-delay: -.7s;
        animation-delay: -.7s
    }

    .sk-fading-circle .sk-circle7:before {
        -webkit-animation-delay: -.6s;
        animation-delay: -.6s
    }

    .sk-fading-circle .sk-circle8:before {
        -webkit-animation-delay: -.5s;
        animation-delay: -.5s
    }

    .sk-fading-circle .sk-circle9:before {
        -webkit-animation-delay: -.4s;
        animation-delay: -.4s
    }

    .sk-fading-circle .sk-circle10:before {
        -webkit-animation-delay: -.3s;
        animation-delay: -.3s
    }

    .sk-fading-circle .sk-circle11:before {
        -webkit-animation-delay: -.2s;
        animation-delay: -.2s
    }

    .sk-fading-circle .sk-circle12:before {
        -webkit-animation-delay: -.1s;
        animation-delay: -.1s
    }

@-webkit-keyframes sk-circleFadeDelay {

    0%, 100%, 39% {
        opacity: 0
    }

    40% {
        opacity: 1
    }
}

@keyframes sk-circleFadeDelay {

    0%, 100%, 39% {
        opacity: 0
    }

    40% {
        opacity: 1
    }
}

.contact-section {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 50px;
    margin: 60px auto 30px;
}

    .contact-section .contact-background {
        width: 382px;
        height: 300px;
        object-fit: cover;
        object-position: center;
        background-image: url(../images/bg-contact.png);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;
    }

    .contact-section .title-block {
        position: relative;
        padding-bottom: 15px;
        margin-bottom: 15px;
    }

        .contact-section .title-block:after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 150px;
            height: 3px;
            border-radius: 120px;
            background: #FFC837;
        }

    .contact-section .title-text p {
        padding-bottom: 0;
        color: var(--blue, #0057E7);
        font-family: Mulish, sans-serif;
        font-style: normal;
        line-height: normal;
        text-transform: uppercase;
        font-weight: 700;
    }

    .contact-section .title-text .text-small {
        margin-bottom: 4px;
        font-size: 24px;
    }

    .contact-section .title-text .text-large {
        font-size: 32px;
    }

    .contact-section .company-name {
        color: var(--text, #1A1F36);
        font-family: Mulish, sans-serif;
        font-size: 18px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.66; /* 166.667% */
        padding-bottom: 8px;
    }

    .contact-section .info-list {
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-bottom: 24px;
    }

    .contact-section .info-item {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
    }

    .contact-section .info-text {
        color: #6B7A99;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
        padding: 0;
        margin-bottom: 0;
    }

    .contact-section .button-group {
        display: flex;
        gap: 16px;
        align-items: center;
        justify-content: flex-start;
    }

    .contact-section .btn-social {
        width: 70px;
        height: 70px;
        border-radius: 50%;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }

        .contact-section .btn-social.btn-whatsapp {
            background-image: url(../images/whatsapp-icon.png);
        }

        .contact-section .btn-social.btn-zalo {
            background-image: url(../images/zalo-icon.png);
        }

.DSChuyenMuc_Slide .CM_info {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid var(--line-box, #D5E3F5);
    background: #FFF;
}

    .DSChuyenMuc_Slide .CM_info a {
        color: var(--blue, #0057E7);
        font-family: Mulish, sans-serif;
        font-size: 14px;
        font-style: normal;
        font-weight: 800;
        line-height: 1.42; /* 142.857% */
        text-transform: uppercase;
    }

.slick-itemCM {
    margin: 0 4px;
}

.list_CM_Slide .slick-list {
    margin: 0 -4px;
}

.banner-content-wrapper {
    position: absolute;
    top: 30px;
    left: 30px;
    display: block;
    max-width: 50%;
}

    .banner-content-wrapper .banner-title {
        color: var(--blue, #0057E7);
        font-family: Mulish, sans-serif;
        font-size: 30px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.3;
        text-transform: uppercase;
        margin-bottom: 12px;
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
    }

    .banner-content-wrapper .banner-content {
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.55; /* 155.556% */
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
    }

.list_Banner {
    margin-bottom: 30px;
    position: relative;
}

.information_sidebar .view_list_item ul li {
    padding: 8px 12px;
    border-radius: 12px;
    border: 1px solid var(--line-box, #D5E3F5);
    background: #FFF;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
}

    .information_sidebar .view_list_item ul li > a:first-child,
    .information_sidebar .view_list_item ul li img {
        display: block;
        width: 42px;
        height: 42px;
        object-fit: contain;
        flex-shrink: 0;
    }

    .information_sidebar .view_list_item ul li .news_link {
        color: #0057E7;
        font-family: Mulish, sans-serif;
        font-size: 13px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.38; /* 138.462% */
        text-transform: uppercase;
    }

.information_sidebar .view_list_item ul li {
    margin-bottom: 8px;
}

.info-section-service {
}

    .info-section-service .intro-text,
    .info-section-service .services-intro {
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.5; /* 150% */
        padding-bottom: 0;
        margin-bottom: 16px;
    }

    .info-section-service .contact-title {
        color: #0057E7;
        font-family: Mulish, sans-serif;
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
        margin-bottom: 8px;
    }

    .info-section-service .contact-list {
        margin-bottom: 16px;
    }

    .info-section-service .contact-item {
        color: #0057E7;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
        position: relative;
        padding-left: 26px;
    }

        .info-section-service .contact-item a {
            color: #0057E7;
        }

        .info-section-service .contact-item:before {
            content: '';
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-50%);
            width: 18px;
            height: 18px;
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
        }

        .info-section-service .contact-item:not(:last-child) {
            margin-bottom: 8px;
        }

        .info-section-service .contact-item.address:before {
            background-image: url(../images/icon-address.png);
        }

        .info-section-service .contact-item.email:before {
            background-image: url(../images/icon-email.png);
        }

        .info-section-service .contact-item.phone:before {
            background-image: url(../images/icon-phone.png);
        }

    .info-section-service .services-intro {
        margin-bottom: 30px;
    }

    .info-section-service .services-grid {
        display: flex;
        flex-wrap: nowrap;
        flex-direction: row;
        gap: 12px;
    }

    .info-section-service .service-card {
        overflow: hidden;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        text-align: center;
        padding: 16px;
        border-radius: 12px;
        border: 1px solid #D5E3F5;
        background: #FFF;
        width: calc(100% / 3);
    }

    .info-section-service .service-icon {
        margin-bottom: 24px;
    }

        .info-section-service .service-icon img {
            width: 120px;
            height: 120px;
        }

    .info-section-service .service-title {
        color: #0057E7;
        text-align: center;
        font-family: Mulish, sans-serif;
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        margin-bottom: 12px;
    }

    .info-section-service .service-description {
        color: #6B7A99;
        text-align: center;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.5; /* 150% */
    }

.techport-intro {
}

    .techport-intro section {
        padding: 30px 0;
        margin: 0 !important;
    }

    .techport-intro .function-list {
        height: calc(100% - 44px);
    }

    .techport-intro .function-list,
    .techport-intro .service-group-wrapper,
    .techport-intro .registration-steps,
    .techport-intro .policy-list {
        border-radius: 12px;
        border: 1px solid #D5E3F5;
        background: #FFF;
        padding: 16px;
        margin: 0;
        flex: 1;
    }

    .techport-intro p {
        padding-bottom: 0;
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.5;
    }

    .techport-intro .intro-header {
        display: flex;
        gap: 24px;
        flex-direction: row;
        flex-wrap: nowrap;
    }

    .techport-intro .intro-header-content {
    }

        .techport-intro .intro-header-content .main-title {
            color: #0057E7;
            font-family: Mulish, sans-serif;
            font-size: 24px;
            font-style: normal;
            font-weight: 700;
            line-height: 1.33; /* 133.333% */
            margin-bottom: 12px;
        }

    .techport-intro .intro-header-logos {
        flex-shrink: 0;
        display: flex;
        gap: 24px;
    }

        .techport-intro .intro-header-logos img {
            max-width: 160px;
            aspect-ratio: 1;
        }

    .techport-intro section {
        margin: 30px 0;
    }

    .techport-intro .service-group-wrapper .service-group:not(:last-child),
    .techport-intro .function-list .function-item:not(:last-child) {
        margin-bottom: 12px;
    }

    .techport-intro .service-group-wrapper .service-group-title {
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 18px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.44; /* 144.444% */
        margin-bottom: 4px;
        position: relative;
        padding-left: 24px;
    }

        .techport-intro .service-group-wrapper .service-group-title:before {
            content: '';
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-50%);
            width: 18px;
            height: 18px;
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url(../images/icon-check.svg);
        }

    .techport-intro .section-roles .role-list .role-item:not(:last-child) {
        margin-bottom: 12px;
    }

    .techport-intro .policy-list .policy-item:not(:last-child) {
        margin-bottom: 8px;
    }

    .techport-intro .section-roles .role-item,
    .techport-intro .function-list .function-item,
    .techport-intro .policy-list .policy-item {
        position: relative;
        padding-left: 24px;
    }

        .techport-intro .section-roles .role-item:before,
        .techport-intro .function-list .function-item:before,
        .techport-intro .policy-list .policy-item:before {
            content: '';
            position: absolute;
            left: 0;
            top: 2px;
            width: 18px;
            height: 18px;
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url(../images/icon-check.svg);
        }

        .techport-intro .policy-list .policy-item:before {
            background-image: url(../images/icon-check-green.svg);
        }

    .techport-intro .service-sub-list li {
        padding-left: 16px;
    }

        .techport-intro .service-sub-list li:not(:last-child) {
            margin-bottom: 8px;
        }

    .techport-intro .section-title {
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 24px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.33; /* 133.333% */
        position: relative;
        padding-left: 16px;
        margin-bottom: 12px;
    }

        .techport-intro .section-title.text-center {
            padding-left: 0;
            margin-bottom: 24px;
        }

        .techport-intro .section-title:before {
            content: '';
            position: absolute;
            left: 0;
            top: 4px;
            width: 3px;
            height: 22px;
            border-radius: 180px;
            background: #E37900;
        }


        .techport-intro .section-title.text-center:before {
            display: none;
        }

    .techport-intro .benefits-grid {
        --spacing: 24px;
        --columns: 6;
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        margin-left: calc(-1 * var(--spacing));
        gap: unset;
    }

    .techport-intro .benefit-card {
        overflow: hidden;
        width: calc(calc(100% / var(--columns)) - var(--spacing));
        margin-left: var(--spacing);
        margin-bottom: var(--spacing);
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        text-align: center;
        padding: 16px;
        border-radius: 12px;
        border: 1px solid #D5E3F5;
        background: #FFF;
    }

    .techport-intro .benefit-icon {
        margin-bottom: 8px;
    }

    .techport-intro .benefit-title {
        color: #0057E7;
        text-align: center;
        font-family: Mulish, sans-serif;
        font-size: 17px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.44; /* 144.444% */
        margin-bottom: 2px;
    }

    .techport-intro .benefit-desc {
        color: #6B7A99;
        text-align: center;
        font-family: Mulish, sans-serif;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.42; /* 142.857% */
    }

    .techport-intro .section-registration-policy {
    }

    .techport-intro .grid-2-cols {
        --spacing: 24px;
        --columns: 2;
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        margin-left: calc(-1 * var(--spacing));
        gap: unset;
        align-items: stretch;
    }

    .techport-intro .column-box {
        overflow: hidden;
        width: calc(calc(100% / var(--columns)) - var(--spacing));
        margin-left: var(--spacing);
        /*        margin-bottom: var(--spacing);*/
        display: flex;
        flex-direction: column;
    }

    .techport-intro .registration-steps li:not(:last-child) {
        margin-bottom: 16px;
    }

    .techport-intro .registration-steps {
        height: calc(100% - 44px);
    }

        .techport-intro .registration-steps li {
            color: #1A1F36;
            font-family: Mulish, sans-serif;
            font-size: 16px;
            font-style: normal;
            line-height: 1.5; /* 150% */
        }

        .techport-intro .registration-steps strong {
            font-weight: 700;
            font-family: Mulish, sans-serif;
        }


.nhaCungCapList {
    --spacing: 16px;
    --columns: 4;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    margin-left: calc(-1 * var(--spacing));
    margin-bottom: calc(-1 * var(--spacing));
    gap: unset;
}

    .nhaCungCapList .itemNhaCungCap {
        overflow: hidden;
        width: calc(calc(100% / var(--columns)) - var(--spacing));
        margin-left: var(--spacing);
        margin-bottom: var(--spacing);
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 12px;
        padding: 12px;
        border-radius: 12px;
        border: 1px solid #D5E3F5;
        background: #FFF;
    }

    .nhaCungCapList .logoNhaCungCap,
    .unit-item-wrapper .itemNhaCungCap .logoNhaCungCap {
        border-radius: 12px;
        border: 1px solid #D5E3F5;
        background: #FFF;
        padding: 4px;
        width: 60px;
        height: 60px;
        flex-shrink: 0;
    }

        .nhaCungCapList .logoNhaCungCap img,
        .unit-item-wrapper .itemNhaCungCap .logoNhaCungCap img {
            width: 50px;
            height: 50px;
            object-fit: contain;
            border-radius: 8px;
        }

    .nhaCungCapList .nhaCungCapContent,
    .unit-item-wrapper .itemNhaCungCap .nhaCungCapContent {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 6px;
    }

    .nhaCungCapList .nhaCungCapName,
    .unit-item-wrapper .itemNhaCungCap .nhaCungCapName {
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 14px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.42; /* 142.857% */
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        word-break: break-all;
    }

    .nhaCungCapList .nhaCungCapDiaChi,
    .unit-item-wrapper .itemNhaCungCap .nhaCungCapDiaChi {
        color: #6B7A99;
        font-family: Mulish, sans-serif;
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.33; /* 133.333% */
        position: relative;
        padding-left: 20px;
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
    }

        .nhaCungCapList .nhaCungCapDiaChi:before,
        .unit-item-wrapper .itemNhaCungCap .nhaCungCapDiaChi:before {
            content: '';
            position: absolute;
            left: 0;
            top: 0;
            width: 16px;
            height: 16px;
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url(../images/icon-address.svg);
        }

    .nhaCungCapList .nhaCungCapLinhVuc,
    .unit-item-wrapper .itemNhaCungCap .nhaCungCapLinhVuc {
        display: inline-block;
        padding: 4px 8px;
        border-radius: 360px;
        background: #E8F0FB;
        color: #0057E7;
        font-family: Mulish, sans-serif;
        font-size: 11px;
        font-style: normal;
        font-weight: 600;
        line-height: 1.27; /* 127.273% */
    }

.chuyenGiaList {
    /*    --spacing: 24px;
    --columns: 5;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    margin-left: calc(-1 * var(--spacing));
    gap: unset;*/
}

    .chuyenGiaList .itemChuyenGia {
        /*        overflow: hidden;
        width: calc(calc(100% / var(--columns)) - var(--spacing));
        margin-left: var(--spacing);
        margin-bottom: var(--spacing);*/
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        gap: 10px;
        width: 100%;
    }

    .chuyenGiaList .avatarChuyenGia img {
        width: 80px;
        height: 80px;
        object-fit: cover;
        border-radius: 50%;
        border: 1px solid #D5E3F5;
    }

    .chuyenGiaList .infoChuyenGia {
        text-align: center;
    }

        .chuyenGiaList .infoChuyenGia p {
            padding-bottom: 0;
        }

        .chuyenGiaList .infoChuyenGia .tenChuyenGia {
            color: #0057E7;
            text-align: center;
            font-family: Mulish, sans-serif;
            font-size: 16px;
            font-style: normal;
            font-weight: 700;
            line-height: 1.5; /* 150% */
            margin-bottom: 0;
        }

        .chuyenGiaList .infoChuyenGia .linhVucChuyenGia {
            color: #6B7A99;
            text-align: center;
            font-family: Mulish, sans-serif;
            font-size: 14px;
            font-style: normal;
            font-weight: 400;
            line-height: 1.42; /* 142.857% */
            display: -webkit-box;
            overflow: hidden;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            margin-bottom: 0;
        }

        .chuyenGiaList .infoChuyenGia .donViChuyenGia {
            color: #1A1F36;
            text-align: center;
            font-family: Mulish, sans-serif;
            font-size: 13px;
            font-style: normal;
            font-weight: 400;
            line-height: 1.38; /* 138.462% */
            margin-bottom: 0;
        }

.TitleCM-alt-filter {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

    .TitleCM-alt-filter .select2-container,
    .TitleCM-alt-filter .select2-container--default .select2-selection--single,
    .TitleCM-alt-filter input[type="text"] {
        min-width: 250px !important;
        width: 250px !important;
        margin: 0;
    }

    .TitleCM-alt-filter input {
        border-radius: 8px;
        border: 1px solid var(--line-box, #D5E3F5);
        background: #FFF;
        padding: 9px 12px;
        height: 40px;
    }

    .TitleCM-alt-filter .select2-container--default .select2-selection--single {
        border-radius: 8px !important;
        border: 1px solid var(--line-box, #D5E3F5) !important;
        background: #FFF;
    }

.search-form {
    position: relative;
}

.search-form {
    position: relative;
}

    .search-form .btn-search-chuyen-gia {
        position: absolute;
        display: block;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        cursor: pointer;
        width: 40px;
        height: 38px;
        background-color: #0057E7;
        border-radius: 0 8px 8px 0;
        background-image: url(../images/icon-search.png);
        background-position: center;
        background-repeat: no-repeat;
    }

.TitleCM-alt .viewMore {
    color: #0057E7;
    font-family: Mulish, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.5; /* 150% */
    display: inline-block;
    padding-right: 20px;
    position: relative;
}

    .TitleCM-alt .viewMore:after {
        content: '';
        display: inline-block;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 16px;
        height: 16px;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        background-image: url(../images/icon-arrow-right.png);
    }

.cb-linhvuc-item-wrapper {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    gap: 8px;
    overflow-x: auto;
    margin-bottom: 16px;
}

    .cb-linhvuc-item-wrapper .cb-linhvuc-item {
        display: inline-block;
        white-space: nowrap;
        padding: 8px 16px;
        border-radius: 360px;
        border: 1px solid var(--line-box, #D5E3F5);
        background: #FFF;
        color: #6B7A99;
        text-align: center;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
        cursor: pointer;
        transition: all .3s ease-in-out;
    }

        .cb-linhvuc-item-wrapper .cb-linhvuc-item:hover,
        .cb-linhvuc-item-wrapper .cb-linhvuc-item.active {
            border-radius: 360px;
            background: #E37900;
            color: #FFF;
        }

.chaoBanList {
    --spacing: 24px;
    --columns: 4;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    margin-left: calc(-1 * var(--spacing));
    gap: unset;
    margin-bottom: -15px;
}

    .chaoBanList .chaoBan-item {
        overflow: hidden;
        width: calc(calc(100% / var(--columns)) - var(--spacing));
        margin-left: var(--spacing);
        margin-bottom: var(--spacing);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        border-radius: 12px;
        border: 1px solid #E8F0FB;
        background: #FFF;
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.15);
        transition: all .3s ease-in-out;
        position: relative;
    }

        .chaoBanList .chaoBan-item:hover,
        .product-item-wrapper .product-item:hover {
            transform: scale(1.05);
            box-shadow: 5px 5px 0 rgba(197, 130, 120, .2);
        }

        .chaoBanList .chaoBan-item:before,
        .product-item-wrapper .product-item:before {
            content: '';
            position: absolute;
            width: 100%;
            height: 100%;
            background: linear-gradient(45deg, transparent, rgba(232, 83, 63, .05), transparent);
            top: -100%;
            left: -100%;
            transition: all 0.5s ease;
        }

        .chaoBanList .chaoBan-item:hover:before,
        .product-item-wrapper .product-item:hover:before {
            top: 100%;
            left: 100%;
        }

        .chaoBanList .chaoBan-item:hover img {
            transform: scale(1.1);
        }

    .chaoBanList .itemChaoBan-content {
        padding: 12px 16px 18px;
        width: 100%;
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .chaoBanList .itemChaoBan-img {
        overflow: hidden;
        position: relative;
        display: block;
        width: 100%;
    }

        .chaoBanList .itemChaoBan-img img {
            aspect-ratio: 1.67;
            overflow: hidden;
            object-fit: cover;
            transition: all 0.3s ease-in-out;
            max-height: 197px;
        }

    .chaoBanList .itemChaoBan-linhVuc {
        position: absolute;
        display: inline-block;
        top: 8px;
        left: 8px;
        z-index: 1;
        padding: 6px 14px;
        border-radius: 360px;
        opacity: 0.8;
        background: #00072A;
        color: #FFF;
        font-family: Mulish, sans-serif;
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: 1.38; /* 138.462% */
    }

    .chaoBanList .itemChaoBan-title {
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .chaoBanList .itemChaoBan-unit {
        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; /* 138.462% */
        margin-bottom: 12px;
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

        .chaoBanList .itemChaoBan-unit:before {
            content: '';
            position: absolute;
            left: 0;
            top: 1px;
            width: 14px;
            height: 14px;
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url(../images/icon-unit.svg);
        }

    .chaoBanList .itemChaoBan-group-button {
        display: flex;
        gap: 8px;
        flex-flow: row nowrap;
    }

    .chaoBanList .itemChaoBan-group-button,
    .product-item-wrapper .itemChaoBan-group-button,
    .relatedProductsCarousel .itemChaoBan-group-button {
        display: flex;
        gap: 8px;
        flex-flow: row nowrap;
        margin-top: auto;
    }

        .chaoBanList .itemChaoBan-group-button .btn-chaoban,
        .product-item-wrapper .itemChaoBan-group-button .btn-chaoban,
        .relatedProductsCarousel .itemChaoBan-group-button .btn-chaoban {
            border-radius: 360px;
            padding: 8px 12px;
            text-align: center;
            font-family: Mulish, sans-serif;
            font-size: 14px;
            font-style: normal;
            font-weight: 700;
            line-height: 1.42; /* 142.857% */
            transition: all 0.3s ease-in-out;
        }

            .chaoBanList .itemChaoBan-group-button .btn-chaoban.btn-lienhe,
            .product-item-wrapper .itemChaoBan-group-button .btn-chaoban.btn-lienhe,
            .relatedProductsCarousel .itemChaoBan-group-button .btn-chaoban.btn-lienhe {
                border: 1px solid #C0DBFF;
                background: #FFF;
                color: #0057E7;
            }

                .chaoBanList .itemChaoBan-group-button .btn-chaoban.btn-lienhe:hover,
                .product-item-wrapper .itemChaoBan-group-button .btn-chaoban.btn-lienhe:hover,
                .relatedProductsCarousel .itemChaoBan-group-button .btn-chaoban.btn-lienhe:hover {
                    border: 1px solid #0057E7;
                    background: #0057E7;
                    color: #fff;
                }

            .chaoBanList .itemChaoBan-group-button .btn-chaoban.btn-chitiet,
            .product-item-wrapper .itemChaoBan-group-button .btn-chaoban.btn-chitiet,
            .relatedProductsCarousel .itemChaoBan-group-button .btn-chaoban.btn-chitiet {
                border: 1px solid #0057E7;
                background: #0057E7;
                color: #fff;
            }

                .chaoBanList .itemChaoBan-group-button .btn-chaoban.btn-chitiet:hover,
                .product-item-wrapper .itemChaoBan-group-button .btn-chaoban.btn-chitiet:hover,
                .relatedProductsCarousel .itemChaoBan-group-button .btn-chaoban.btn-chitiet:hover {
                    border: 1px solid #0057E7;
                    background: #fff;
                    color: #0057E7;
                }

.itemChaoBan-noiBat {
    display: inline-block;
    position: absolute;
    bottom: 0;
    left: 0;
    border-radius: 0 12px 0 0;
    overflow: hidden;
}

.item-noiBat {
    display: inline-block;
    position: relative;
    border-radius: 360px;
    font-family: Mulish, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 1; /* 142.857% */
    padding: 8px 20px;
    color: #FFF;
    transition: all 0.3s ease-in-out;
    background-color: #c90404;
    overflow: hidden;
}

.itemChaoBan-noiBat > span {
    display: inline-block;
    position: relative;
    border-radius: 0 12px 0 0;
    font-family: Mulish, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 1; /* 142.857% */
    padding: 8px 20px;
    color: #FFF;
    transition: all 0.3s ease-in-out;
    background-color: #c90404;
}

    .item-noiBat:before,
    .itemChaoBan-noiBat > span:before {
        content: '';
        position: absolute;
        left: -20%;
        top: -10%;
        width: 0;
        height: 100%;
        transform: rotate(15deg) scale(1, 2);
        box-shadow: 0 0 30px 15px rgba(255, 255, 255, 0.7);
        animation: button-glow 3000ms ease-in-out infinite;
    }

.itemChaoBan-img {
    position: relative;
}

@keyframes button-glow {
    0% {
        left: -20%;
    }

    50% {
        left: 120%;
    }

    100% {
        left: 120%;
    }
}

.pagination-wrapper {
    margin-top: 30px;
}

.pagination {
    gap: 8px;
}

    .pagination .page-item {
        min-width: 32px;
        height: 32px;
    }

        .pagination .page-item .page-link {
            text-align: center;
            border-radius: 8px;
            display: inline-block;
            border-radius: 8px;
            border: 1px solid rgba(107, 122, 153, 0.50);
            min-width: 32px;
            height: 32px;
            background-color: transparent;
            color: #1A1F36;
            text-align: center;
            font-family: Mulish, sans-serif;
            font-size: 14px;
            font-style: normal;
            font-weight: 600;
            line-height: 1.5; /* 142.857% */
        }

        .pagination .page-item.active .page-link {
            display: inline-block;
            color: #fff !important;
            background: #0057E7 !important;
        }

        .pagination .page-item.first-page .page-link,
        .pagination .page-item.prev-page .page-link,
        .pagination .page-item.next-page .page-link,
        .pagination .page-item.last-page .page-link {
            background-position: center;
            background-repeat: no-repeat;
            background-size: 18px;
        }

        .pagination .page-item.first-page .page-link {
            background-image: url(../images/first-page.svg);
        }

        .pagination .page-item.prev-page .page-link {
            background-image: url(../images/prev-page.svg);
        }

        .pagination .page-item.next-page .page-link {
            background-image: url(../images/next-page.svg);
        }

        .pagination .page-item.last-page .page-link {
            background-image: url(../images/last-page.svg);
        }

        .pagination .page-item.disabled {
            opacity: 0.5;
        }

.content-banner-wrapper {
    display: flex;
    gap: 20px;
    justify-content: space-between;
}

    .content-banner-wrapper .content-banner-intro {
        width: calc(50% - 10px);
    }

    .content-banner-wrapper .ContentBannerPane {
        width: 577px;
        flex-shrink: 0;
    }

    .content-banner-wrapper .content-banner-title {
        color: #FFF;
        font-family: Mulish, sans-serif;
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        margin-bottom: 12px;
    }

        .content-banner-wrapper .content-banner-title .text-yellow {
            color: #FFDF20;
        }

    .content-banner-wrapper .content-banner-description,
    .content-banner-wrapper .content-banner-sub-title {
        color: #FFF;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 1.5; /* 150% */
        margin-bottom: 12px;
    }

    .content-banner-wrapper .content-banner-sub-title {
        margin-bottom: 20px;
    }

        .content-banner-wrapper .content-banner-sub-title .sub-title-item {
            display: block;
            position: relative;
            padding-left: 24px;
        }

            .content-banner-wrapper .content-banner-sub-title .sub-title-item::before {
                content: '';
                position: absolute;
                left: 0;
                top: 50%;
                transform: translateY(-50%);
                width: 16px;
                height: 16px;
                background-image: url(../images/icon-sub-title.svg);
                background-size: contain;
                background-repeat: no-repeat;
            }

            .content-banner-wrapper .content-banner-sub-title .sub-title-item:not(:last-child) {
                margin-bottom: 8px;
            }

    .content-banner-wrapper .content-banner-stat {
        display: flex;
        gap: 10px;
    }

    .content-banner-wrapper .content-banner-stat-item {
        display: flex;
        flex-direction: column;
        gap: 2px;
        border: 1px solid rgba(255, 255, 255, 0.12);
        background: rgba(255, 255, 255, 0.20);
        padding: 8px 16px;
        border-radius: 12px;
        flex: 1;
        max-width: 223px;
    }

        .content-banner-wrapper .content-banner-stat-item .number {
            text-align: center;
            font-family: Mulish, sans-serif;
            font-size: 24px;
            font-style: normal;
            font-weight: 700;
            line-height: 1.33; /* 133.333% */
        }

        .content-banner-wrapper .content-banner-stat-item:first-child .number {
            color: #FFB1B1;
        }

        .content-banner-wrapper .content-banner-stat-item:nth-child(2) .number {
            color: #6BF47B;
        }

        .content-banner-wrapper .content-banner-stat-item:last-child .number {
            color: #74E1FF;
        }

        .content-banner-wrapper .content-banner-stat-item .text {
            color: #BEDBFF;
            text-align: center;
            font-family: Mulish, sans-serif;
            font-size: 14px;
            font-style: normal;
            font-weight: 700;
            line-height: 1.42; /* 142.857% */
        }


.modal-content {
    box-shadow: 0px 0px 8px 0px #00123D1F;
    border-radius: 16px;
}

.modal-header {
    padding: 16px 24px;
    border-bottom: 1px solid #E2E4E9
}

    .modal-header h5 {
        font-family: 'Inter';
        font-style: normal;
        font-weight: 600;
        font-size: 22px;
        line-height: 28px;
        /* identical to box height, or 127% */
        /* Content/text-main */
        color: var(--text-main);
    }

.modal-body {
    padding: 24px 24px 16px;
}

.modal-footer {
    padding: 16px 24px;
    border-top: 1px solid #E2E4E9
}

    .modal-footer > :not(:last-child) {
        margin: 0;
    }

.Delete_info {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    margin-bottom: 32px;
}

    .Delete_info .warning {
        /* Body/Large */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 1.5;
        /* or 150% */
        text-align: center;
        letter-spacing: 0.5px;
        /* Content/text-main */
        color: var(--text-main);
        display: flex;
        flex-direction: column;
    }

.btn.btn-primary.btn-gui {
    position: relative;
    padding: 12px 30px 12px 53px !important;
}

.not-logged-in .btn.btn-primary.btn-gui {
    z-index: -1;
}

    .btn.btn-primary.btn-gui:before {
        content: "";
        width: 15px;
        height: 15px;
        position: absolute;
        left: 30px;
        height: 15px;
        width: 15px;
        background-image: url(../images/icon-sent.svg);
        background-size: contain;
        background-repeat: no-repeat;
        top: 50%;
        transform: translateY(-50%);
    }

.itemTimMua {
    border-radius: 12px;
    border: 1px solid #D5E3F5;
    background: #FFF;
    padding: 16px;
    position: relative;
    transition: all 0.3s ease-in-out;
    overflow: hidden;
}

    .itemTimMua:before {
        content: '';
        position: absolute;
        width: 100%;
        height: 100%;
        background: linear-gradient(45deg, transparent, rgba(232, 83, 63, .05), transparent);
        top: -100%;
        left: -100%;
        transition: all 0.5s ease;
    }

    .itemTimMua:hover:before {
        top: 100%;
        left: 100%;
    }

    .itemTimMua .infoTimMua-wrapper {
        display: flex;
        gap: 16px;
        align-items: flex-start;
        justify-content: flex-start;
        margin-bottom: 16px;
    }

    .itemTimMua .infoTimMua {
        width: 100px;
        flex-shrink: 0;
    }

    .itemTimMua .img-fluid {
        width: 100px;
        height: 100px;
        border-radius: 12px;
    }

    .itemTimMua .dateTimMua span {
        color: #6B7A99;
        font-family: Mulish, sans-serif;
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 1.42; /* 142.857% */
    }

    .itemTimMua .dateTimMua > span {
        display: block;
    }

        .itemTimMua .dateTimMua > span:not(:last-child) {
            margin-bottom: 8px;
        }

    .itemTimMua .tenTimMua {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
        margin-bottom: 8px;
        min-height: 48px;
    }

    .itemTimMua .donViTimMua {
        padding-bottom: 0;
        position: relative;
        padding-left: 20px;
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 13px;
        font-style: normal;
        font-weight: 600;
        line-height: 1.38; /* 138.462% */
        margin-bottom: 0;
    }

        .itemTimMua .donViTimMua:before {
            content: "";
            width: 14px;
            height: 14px;
            position: absolute;
            left: 0;
            top: 2px;
            background-image: url(../images/icon-unit2.svg);
            background-size: contain;
            background-repeat: no-repeat;
        }

.text-b {
    font-weight: 700 !important;
}

.text-r {
    color: #FF7169 !important;
}

.text-d {
    color: #1A1F36 !important;
}

.filter-box {
    padding: 16px;
    border-radius: 12px;
    border: 1px solid #D5E3F5;
    background: #F0F4FA;
    margin-bottom: 12px;
}

.filter-title {
    color: #0057E7;
    font-family: Mulish, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.5; /* 150% */
    margin-bottom: 12px;
}

.filter-list li {
    display: block;
    color: #1A1F36;
    font-family: Mulish, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.5; /* 150% */
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    position: relative;
}

.filter-list a {
    display: block;
    color: #1A1F36;
    font-family: Mulish, sans-serif;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.5; /* 150% */
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    position: relative;
    padding-left: 14px;
}

.filter-list .filter-sub-list a {
    padding-left: 10px;
}

.filter-list a:before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 7px;
    background-color: #0057E7;
}

.filter-list .filter-sub-list a:before {
    display: none;
}

.filter-list li:not(:last-child),
.filter-list a:not(:last-child) {
    /*        margin-bottom: 8px;*/
}

/* Hiệu ứng khi Hover */
filter-list li:hover,
.filter-list a:hover {
    color: #0057E7;
}

/* Hiệu ứng khi Active */
filter-list li.active,
.filter-list a.active {
    color: #0057E7;
}

.mainContenData-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 12px;
    border: 1px solid #D5E3F5;
    background: #F0F4FA;
    padding: 12px 16px;
    margin-bottom: 24px;
    gap: 12px;
}

    .mainContenData-head #productCountInfo {
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 14px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.42; /* 142.857% */
    }

    .mainContenData-head .searchHeader {
        width: 400px;
        position: relative;
    }

        .mainContenData-head .searchHeader .searchButton {
            position: absolute;
            display: block;
            right: 1px;
            top: 50%;
            transform: translateY(-50%);
            cursor: pointer;
            width: 50px;
            height: 40px;
            background-color: #0057E7;
            border-radius: 0 8px 8px 0;
            background-image: url(../images/icon-search.png);
            background-position: center;
            background-repeat: no-repeat;
        }

    .mainContenData-head input {
        max-width: 400px;
        height: 42px;
        border-radius: 8px;
        border: 1px solid #D5E3F5;
        background: #FFF;
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.42; /* 142.857% */
    }
        /* placeholder color */
        .mainContenData-head input::placeholder {
            color: #6B7A99;
            font-family: Mulish, sans-serif;
            font-size: 14px;
            font-style: normal;
            font-weight: 400;
            line-height: 1.42; /* 142.857% */
        }

.mainContenData-head-chuyengia .searchHeader,
.mainContenData-head-chuyengia .searchHeader input {
    width: 100%;
    max-width: 100%;
}

.product-item-wrapper,
.unit-item-wrapper {
    --spacing: 24px;
    --columns: 3;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    margin-left: calc(-1 * var(--spacing));
    gap: unset;
    margin-bottom: -15px;
}

    .product-item-wrapper .product-item {
        overflow: hidden;
        width: calc(calc(100% / var(--columns)) - var(--spacing));
        margin-left: var(--spacing);
        margin-bottom: var(--spacing);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        border-radius: 12px;
        border: 1px solid #E8F0FB;
        background: #FFF;
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.15);
        position: relative;
        transition: all 0.3s ease-in-out;
    }

.relatedProductsCarousel .product-item {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    border-radius: 12px;
    border: 1px solid #E8F0FB;
    background: #FFF;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.15);
    position: relative;
    transition: all 0.3s ease-in-out;
}

.product-item-wrapper .product-item,
.relatedProductsCarousel .product-item {
}

.relatedProductsCarousel .product-item {
    /*    aspect-ratio: 0.91;*/
}

    .product-item-wrapper .product-item a,
    .relatedProductsCarousel .product-item a {
        overflow: hidden;
        width: 100%;
        max-width: 100%;
    }

    .product-item-wrapper .product-item > a,
    .relatedProductsCarousel .product-item > a {
        display: block;
        aspect-ratio: 1.67;
    }

    .product-item-wrapper .product-item img,
    .relatedProductsCarousel .product-item img {
        transition: all 0.3s ease-in-out;
    }

    .product-item-wrapper .product-item:hover img,
    .relatedProductsCarousel .product-item:hover img {
        transform: scale(1.1);
    }

.product-item-wrapper .chuyengia-item {
    overflow: hidden;
    width: calc(calc(100% / var(--columns)) - var(--spacing));
    margin-left: var(--spacing);
    margin-bottom: var(--spacing);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 16px 16px 24px;
    border-radius: 12px;
    border: 1px solid #E5E5F2;
    background: #FFF;
    box-shadow: 0 4px 4px 0 #F0F5FF;
    transition: all 0.3s ease-in-out;
}

    .product-item-wrapper .product-item:hover,
    .product-item-wrapper .chuyengia-item:hover {
        box-shadow: 0 4px 8px 0 #D5E3F5;
    }

    .product-item-wrapper .chuyengia-item .infoChuyenGia {
        width: 100%;
        margin-bottom: 16px;
    }

    .product-item-wrapper .chuyengia-item .tenChuyenGia {
        color: #0057E7;
        text-align: center;
        font-family: Mulish, sans-serif;
        font-size: 18px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.44; /* 144.444% */
        text-align: center;
        margin-bottom: 16px;
    }

    .product-item-wrapper .chuyengia-item .avatarChuyenGia,
    .product-item-wrapper .chuyengia-item .avatarChuyenGia img {
        width: 120px;
        height: 120px;
        border-radius: 50%;
        object-fit: cover;
    }

    .product-item-wrapper .chuyengia-item .avatarChuyenGia {
        margin-bottom: 16px;
        border: 1px solid #D5E3F5;
    }

.product-item-wrapper .infoChuyenGia p {
    padding-bottom: 0;
    color: #1A1F36;
    font-family: Mulish, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.4;
    position: relative;
    padding-left: 24px;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    word-break: break-word;
}

    .product-item-wrapper .infoChuyenGia p:before {
        content: '';
        position: absolute;
        left: 0;
        top: 1px;
        width: 18px;
        height: 18px;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }

    .product-item-wrapper .infoChuyenGia p.hocViChuyenGia:before {
        background-image: url(../images/icon-hocvi.svg);
    }

    .product-item-wrapper .infoChuyenGia p.linhVucChuyenGia:before {
        background-image: url(../images/icon-linhvuc.svg);
    }

    .product-item-wrapper .infoChuyenGia p.donViChuyenGia:before {
        background-image: url(../images/icon-donvi.svg);
    }

    .product-item-wrapper .infoChuyenGia p:not(:last-child) {
        margin-bottom: 12px;
    }

.product-item-wrapper .itemChaoBan-linhVuc,
.relatedProductsCarousel .itemChaoBan-linhVuc {
    display: inline-block;
    position: absolute;
    top: 8px;
    left: 8px;
    padding: 6px 14px;
    border-radius: 360px;
    opacity: 0.8;
    background: #00072A;
    color: #FFF;
    cursor: unset;
    color: #FFF;
    font-family: Mulish, sans-serif;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.38; /* 138.462% */
}

.product-item-wrapper .product-item .card-body,
.relatedProductsCarousel .product-item .card-body {
    padding: 12px 16px 18px;
    width: 100%;
}

.product-item-wrapper .product-item .card-img-top,
.relatedProductsCarousel .product-item .card-img-top {
    width: 100%;
    aspect-ratio: 1.67;
    object-fit: cover;
}

.product-item-wrapper .card-title,
.product-item .itemChaoBan-ratting,
.relatedProductsCarousel .card-title {
    margin-bottom: 8px;
}

    .product-item-wrapper .card-title a,
    .relatedProductsCarousel .card-title a {
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        word-break: break-all;
    }

.product-item-wrapper .card-text,
.relatedProductsCarousel .card-text {
    color: #1A1F36;
    font-family: Mulish, sans-serif;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.38; /* 138.462% */
    padding-bottom: 0;
    position: relative;
    padding-left: 20px;
    margin-bottom: 20px;
}

    .product-item-wrapper .card-text:before,
    .relatedProductsCarousel .card-text:before {
        content: '';
        position: absolute;
        left: 0;
        top: 2px;
        width: 14px;
        height: 14px;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        background-image: url(../images/icon-unit.svg);
    }

.itemChaoBan-ratting {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
}

    .itemChaoBan-ratting span {
        color: #6B7A99;
        font-family: Mulish,sans-serif;
        font-size: 13px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.38; /* 138.462% */
    }

.rating-stars-static {
    display: flex;
    gap: 2px;
}

.unit-item-wrapper .itemNhaCungCap {
    overflow: hidden;
    width: calc(calc(100% / var(--columns)) - var(--spacing));
    margin-left: var(--spacing);
    margin-bottom: var(--spacing);
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px;
    padding: 12px;
    border-radius: 12px;
    border: 1px solid #D5E3F5;
    background: #FFF;
}

.timua-item-wrapper {
    --spacing: 24px;
    --columns: 2;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    margin-left: calc(-1 * var(--spacing));
    gap: unset;
    margin-bottom: -15px;
}

    .timua-item-wrapper .itemTimMua {
        overflow: hidden;
        width: calc(calc(100% / var(--columns)) - var(--spacing));
        margin-left: var(--spacing);
        margin-bottom: var(--spacing);
    }

    .timua-item-wrapper .infoTimMua-wrapper {
        display: flex;
        gap: 16px;
        align-items: flex-start;
        justify-content: flex-start;
        margin-bottom: 0;
    }

    .timua-item-wrapper .tenTimMua,
    .timua-item-wrapper .dateTimMua {
        margin-bottom: 6px;
    }

    .timua-item-wrapper .itemTimMua .dateTimMua > span:not(:last-child) {
        margin-bottom: 6px;
    }

.box-filter {
    padding: 16px;
    border-radius: 12px;
    border: 1px solid #D5E3F5;
    background: #F0F4FA;
    margin-bottom: 12px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

    .box-filter .filter-title {
        padding-bottom: 0;
        margin-bottom: 0;
        color: #0057E7;
        font-family: Mulish, sans-serif;
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
    }

    .box-filter .select2-container--default .select2-selection--single {
        margin: 0 !important;
        border-radius: 8px !important;
        border: 1px solid #D5E3F5 !important;
        background: #FFF;
    }

        .box-filter .select2-container--default .select2-selection--single .select2-selection__rendered {
            line-height: 32px !important;
        }

.btn-timkiem {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-radius: 8px;
    background-color: #0057E7;
    color: #FFF;
    font-family: Mulish, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
}

    .btn-timkiem:hover {
        color: #fff;
    }

.btnChiTietChuyenGia {
    padding: 8px 12px;
    border-radius: 360px;
    border: 1px solid #C0DBFF;
    background: #FFF;
    transition: all 0.3s ease-in-out;
    display: block;
    text-align: center;
    width: 100%;
    color: #0057E7;
    text-align: center;
    font-family: Mulish, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.42; /* 142.857% */
    margin-top: auto;
}

    .btnChiTietChuyenGia:hover {
        border: 1px solid #0057E7;
        background: #0057E7;
        color: #fff;
    }

.sanpham-detail-top {
    padding: 16px;
    border-radius: 12px;
    border: 1px solid #D5E3F5;
    background: #FFF;
    display: flex;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 32px;
}

    .sanpham-detail-top .sanpham-detail-image {
        width: calc(50% - 8px);
    }

    .sanpham-detail-top .sanpham-detail-info {
        width: calc(50% - 8px);
    }

    .sanpham-detail-top .lSSlideWrapper img {
        aspect-ratio: 1.67;
        border-radius: 12px;
        background: #bbbbbb;
        border-radius: 12px !important;
    }

    .sanpham-detail-top .lSPager {
        margin-top: 12px !important;
    }

        .sanpham-detail-top .lSPager li {
            border-radius: 8px !important;
            border: 2px solid #fff;
            transition: all 0.3s ease-in-out;
        }

            .sanpham-detail-top .lSPager li.active {
                border-radius: 8px !important;
                border: 2px solid #E37900;
            }

        .sanpham-detail-top .lSPager img {
            border-radius: 5px;
            aspect-ratio: 1.3;
            object-fit: cover;
        }

    .sanpham-detail-top .product-title {
        color: #0057E7;
        font-family: Mulish, sans-serif;
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
        margin-bottom: 16px
    }


.supplier-box {
    border-radius: 12px;
    background: #F0F4FA;
    padding: 16px;
}

    .supplier-box .supplier-box-title {
        color: #0057E7;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
        text-transform: uppercase;
        margin-bottom: 8px;
    }

    .supplier-box .supplier-box-content {
        display: flex;
        align-items: flex-start;
        gap: 12px;
    }

        .supplier-box .supplier-box-content .supplier-box-image {
            width: 80px;
            height: 80px;
            border-radius: 12px;
            border: 1px solid var(--line-box, #D5E3F5);
            background-color: #fff;
            object-fit: contain;
            flex-shrink: 0;
        }

.supplier-info .supplierName-title {
    display: block;
    color: #1A1F36;
    font-family: Mulish, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.5; /* 150% */
    margin-bottom: 6px;
}

.supplier-box .supplier-info p {
    padding-bottom: 0;
    color: #6B7A99;
    font-family: Mulish, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.42; /* 142.857% */
    position: relative;
    padding-left: 26px;
}

    .supplier-box .supplier-info p:before,
    .supplier-contact-list li:before {
        content: '';
        position: absolute;
        left: 0;
        top: 2px;
        width: 18px;
        height: 18px;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }

    .supplier-box .supplier-info p.supplier-address:before,
    .supplier-contact-list li.supplier-contact-item-address:before {
        background-image: url(../images/icon-address2.svg);
    }

    .supplier-box .supplier-info p.supplier-phone:before,
    .supplier-contact-list li.supplier-contact-item-phone:before {
        background-image: url(../images/icon-phone2.svg);
    }

    .supplier-box .supplier-info p.supplier-email:before,
    .supplier-contact-list li.supplier-contact-item-email:before {
        background-image: url(../images/icon-mail2.svg);
    }

.supplier-contact-list li.supplier-contact-item-website:before {
    background-image: url(../images/icon-donvi.svg);
}

.supplier-box .supplier-info p:not(:last-child) {
    margin-bottom: 6px;
}

.linhvuc-sanpham-badge-wrapper {
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
}

.linhvuc-sanpham-badge {
    display: inline-block;
    color: #0057E7;
    font-family: Mulish, sans-serif;
    font-size: 13px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.38; /* 138.462% */
    padding: 6px 14px;
    margin-bottom: 0;
    border-radius: 360px;
    background: #E8F0FB;
}

.product-price {
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
}

    .product-price .product-price-label {
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.5; /* 150% */
    }

    .product-price .product-price-value {
        display: inline-block;
        border-radius: 8px;
        background: #E37900;
        color: #FFF;
        padding: 10px 16px 10px 42px;
        position: relative;
    }

        .product-price .product-price-value:before {
            content: '';
            position: absolute;
            left: 16px;
            top: 50%;
            transform: translateY(-50%);
            width: 18px;
            height: 18px;
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url(../images/icon-phone3.svg);
        }

.product-supplier-info {
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    flex-flow: row wrap;
}

    .product-supplier-info span {
        color: #6B7A99;
        font-family: Mulish, sans-serif;
        font-size: 13px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.38; /* 138.462% */
    }

    .product-supplier-info strong {
        color: #0057E7;
        font-family: Mulish, sans-serif;
        font-size: 13px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.38; /* 138.462% */
    }


.sanpham-detail-tabs {
    border-radius: 12px;
    border: 1px solid #D5E3F5;
    background: #FFF;
}

    .sanpham-detail-tabs .tab-content {
        padding: 24px 16px;
    }

    .sanpham-detail-tabs .nav-tabs {
        border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
    }

        .sanpham-detail-tabs .nav-tabs .nav-link,
        .sanpham-detail-tabs .nav-tabs .nav-link:hover,
        .sanpham-detail-tabs .nav-tabs .nav-link.active {
            border: none;
            border-radius: 12px 12px 0 0;
            transition: all 0.3s ease-in-out;
        }


        .sanpham-detail-tabs .nav-tabs .nav-link {
            padding: 12px 24px;
            color: #1A1F36;
            text-align: center;
            font-family: Mulish, sans-serif;
            font-size: 16px;
            font-style: normal;
            font-weight: 700;
            line-height: 1.5; /* 150% */
            border-bottom: 2px solid rgba(0, 0, 0, 0.00);
        }


            .sanpham-detail-tabs .nav-tabs .nav-link:hover,
            .sanpham-detail-tabs .nav-tabs .nav-link.active {
                color: #0057E7;
                border-bottom: 2px solid #0057E7;
            }

    .sanpham-detail-tabs .product-info-sub {
        border-radius: 12px;
        border: 1px solid #D5E3F5;
        background: #F0F4FA;
        padding: 16px;
    }

    .sanpham-detail-tabs span,
    .sanpham-detail-tabs strong {
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
    }

    .sanpham-detail-tabs strong {
        color: #6B7A99
    }

.lSSlideWrapper {
    border-radius: 12px;
}

.content-banner-layout {
    display: flex;
    gap: 20px;
    /*    background: #0d4ba1;
    padding: 16px;*/
    border-radius: 16px;
    height: 260px;
}

.bannerMainSwiper {
    flex: 1;
    width: 0; /* Đảm bảo Swiper tính đúng width flex item */
    height: 100%;
    border-radius: 12px;
    overflow: hidden;
}

    .bannerMainSwiper .banner-main-item {
        position: relative;
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
    }

        .bannerMainSwiper .banner-main-item a {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 12px 12px 0 0;
        }

        .bannerMainSwiper .banner-main-item img {
            display: block;
            width: 100%;
            height: auto;
            object-fit: cover;
            border-radius: 12px 12px 0 0;
            aspect-ratio: 2.3;
        }

    .bannerMainSwiper .banner-main-caption {
        position: relative;
        padding: 12px 16px;
        border-top: 1px solid rgba(255, 255, 255, 0.20);
        background: rgba(255, 255, 255, 0.10);
        color: #fff;
        border-radius: 0 0 12px 12px;
        height: 46px;
        flex-shrink: 0
    }

        .bannerMainSwiper .banner-main-caption .banner-title {
            color: #BEDBFF;
            font-family: Mulish, sans-serif;
            font-size: 14px;
            font-style: normal;
            font-weight: 700;
            line-height: 1.42; /* 142.857% */
            display: -webkit-box;
            overflow: hidden;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 1;
        }

.bannerThumbSwiper {
    width: 110px;
    height: 100%;
}

    .bannerThumbSwiper .swiper-slide {
        cursor: pointer;
        overflow: hidden;
        transition: all 0.25s ease;
        border-radius: 12px;
        border: 2px solid rgba(255, 255, 255, 0.30);
        opacity: 0.9684;
    }

    /* Class mặc định Swiper gán cho Slide Thumb đang active */
    .bannerThumbSwiper .swiper-slide-thumb-active {
        border: 2px solid rgba(255, 139, 21, 0.94);
        opacity: 0.9684;
    }

    .bannerThumbSwiper .banner-thumb-item {
        width: 100%;
        height: 100%;
    }

        .bannerThumbSwiper .banner-thumb-item img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 8px;
        }

.bannerThumbSwiper {
    width: 50px;
}

/* Đáp ứng giao diện di động */
@media (max-width: 767px) {
    .content-banner-layout {
        flex-direction: column;
        height: auto;
    }

    .bannerMainSwiper {
        width: 100%;
        height: 250px;
    }

    .bannerThumbSwiper {
        width: 100%;
        height: 70px;
    }
}

/* Container Chi tiết */
.mainContentData-detail .tim-mua-detail-card {
    background: #ffffff;
    border-radius: 12px;
    border: 1px solid var(--line-box, #D5E3F5);
    padding: 16px;
    margin-bottom: 30px
}

.mainContentData-detail .detail-icon-box {
    width: 100px;
    height: 100px;
    background: #F0F4FA;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
}

    .mainContentData-detail .detail-icon-box img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

.mainContentData-detail .detail-title {
    color: #0057E7;
    font-family: Mulish, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.5; /* 150% */
    margin-bottom: 0;
}

.mainContentData-detail .detail-meta {
    color: #6B7A99;
    font-family: Mulish, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.5; /* 150% */
}

    .mainContentData-detail .detail-meta .text-dark {
        color: #1A1F36;
    }

.mainContentData-detail .detail-header-info {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.mainContentData-detail .highlight-orange {
    color: #FF7169;
}

    .mainContentData-detail .highlight-orange .fw-600 {
        font-weight: 600;
    }

.fs-12 {
    font-size: 12px;
}

.fs-13 {
    font-size: 13px;
}

.fs-14 {
    font-size: 14px;
}

.fs-15 {
    font-size: 15px;
}

/* Bảng thông tin chi tiết */
.mainContentData-detail .detail-info-grid {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.mainContentData-detail .detail-header-wrapper {
    gap: 16px;
    margin-bottom: 16px;
}

.mainContentData-detail .info-row {
    display: flex;
    align-items: center;
    font-size: 14px;
    line-height: 1.5;
}

.mainContentData-detail .info-label {
    width: 220px;
    flex-shrink: 0;
    color: #1A1F36;
    font-family: Mulish, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.5; /* 150% */
}

.mainContentData-detail .info-value {
    flex: 1;
    color: #1A1F36;
    font-family: Mulish, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5; /* 150% */
}

.text-justify {
    text-align: justify;
}

/* Section Tìm mua liên quan */
.text-orange {
    color: #f36f21;
}

.mainContentData-detail .title-bar {
    display: inline-block;
    width: 4px;
    height: 20px;
    background-color: #f36f21;
    border-radius: 2px;
}

.mainContentData-detail .related-img-box {
    width: 100px;
    height: 100px;
    background: #eef5ff;
    border-radius: 8px;
    padding: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
}

    .mainContentData-detail .related-img-box img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

.mainContentData-detail .related-card {
    border-radius: 12px;
    border: 1px solid var(--line-box, #D5E3F5);
    background: #FFF;
    padding: 16px;
}

.mainContentData-detail .related-card-title {
    color: #1A1F36;
    font-family: Mulish, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.5; /* 150% */
    margin-bottom: 8px;
}

.mainContentData-detail .related-card-meta-wrapper {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 16px;
}

.mainContentData-detail .related-card:hover {
    /*        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;*/
}

.mainContentData-detail .related-card-unit {
    color: #1A1F36;
    font-family: Mulish, sans-serif;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.38; /* 138.462% */
    position: relative;
    padding-left: 20px;
}

    .mainContentData-detail .related-card-unit:before {
        content: "";
        width: 14px;
        height: 14px;
        position: absolute;
        left: 0;
        top: 2px;
        background-image: url(../images/icon-unit2.svg);
        background-size: contain;
        background-repeat: no-repeat;
    }

.mainContentData-detail .related-card-meta {
    color: #6B7A99;
    font-family: Mulish, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.5; /* 142.857% */
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.text-line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Custom Responsive */
@media (max-width: 768px) {
    .mainContentData-detail .info-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .mainContentData-detail .info-label {
        width: 100%;
        margin-bottom: 2px;
    }
}


/* Detail Card Chuyên Gia */
.chuyen-gia-detail-card {
    margin-bottom: 30px;
}

.chuyen-gia-detail-wrapper {
    display: flex;
    gap: 24px;
    align-items: flex-start;
    justify-content: flex-start;
    margin-bottom: 30px;
}

.chuyen-gia-avatar-wrapper {
    width: 216px;
    height: 250px;
    border-radius: 12px;
    border: 1px solid var(--line-box, #D5E3F5);
    flex-shrink: 0;
}

.chuyen-gia-avatar {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
}

.cg-name {
    color: var(--blue, #0057E7);
    font-family: Mulish, sans-serif;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.33; /* 133.333% */
    margin-bottom: 16px;
    word-break: break-word;
}

.cg-info-list p {
    color: #1A1F36;
    font-family: Mulish, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5; /* 150% */
    position: relative;
    padding-bottom: 0;
    padding-left: 26px;
    word-break: break-word;
}

    .cg-info-list p:before {
        content: '';
        position: absolute;
        left: 0;
        top: 2px;
        width: 18px;
        height: 18px;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }

    .cg-info-list p.cg-info-item-linhvuc:before {
        background-image: url(../images/icon-linhvuc.svg);
    }

    .cg-info-list p.cg-info-item-donvi:before {
        background-image: url(../images/icon-donvi.svg);
    }

    .cg-info-list p.cg-info-item-dienthoai:before {
        background-image: url(../images/icon-phone2.svg);
    }

    .cg-info-list p.cg-info-item-email:before {
        background-image: url(../images/icon-mail2.svg);
    }

    .cg-info-list p.cg-info-item-hocvi:before {
        background-image: url(../images/icon-hocvi.svg);
    }

    .cg-info-list p:not(:last-child) {
        margin-bottom: 16px;
    }

    .cg-info-list p strong {
        font-weight: 700;
    }

.cg-description-content {
    color: #1A1F36;
    font-family: Mulish, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5; /* 150% */
    border-radius: 12px;
    border: 1px solid #D5E3F5;
    background: #FFF;
    padding: 16px;
    flex: 1;
}

.cg-description-section-wrapper {
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 24px;
    margin-bottom: 24px;
}

    .cg-description-section-wrapper .cg-description-content p {
        margin-bottom: 12px;
    }

        .cg-description-section-wrapper .cg-description-content p:last-child {
            margin-bottom: 0;
        }

    .cg-description-section-wrapper > * {
        width: 50%;
        display: flex;
        flex-direction: column;
    }
/* Chuyên gia cùng lĩnh vực Card (Khớp chính xác với hình ảnh đính kèm) */
.title-bar {
    display: inline-block;
    width: 4px;
    height: 18px;
    background-color: #f36f21;
    border-radius: 2px;
}

.cg-related-card {
    border-radius: 12px;
    border: 1px solid #E5E5F2;
    background: #FFF;
    box-shadow: 0 4px 4px 0 #F0F5FF;
    padding: 16px;
    display: flex;
    gap: 16px;
    align-items: flex-start;
    min-height: 126px;
}

    .cg-related-card:hover {
    }

.cg-related-avatar-box {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    overflow: hidden;
    border: 1px solid #cbd5e1;
}

.cg-related-avatar {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cg-related-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cg-related-name {
    color: #0057E7;
    font-family: Mulish, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.5; /* 150% */
}

.cg-related-lv {
    color: #6B7A99;
    font-family: Mulish, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.42; /* 142.857% */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    word-break: break-word;
    white-space: break-spaces;
}

.cg-related-donvi {
    color: #1A1F36;
    font-family: Mulish, sans-serif;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.38; /* 138.462% */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    word-break: break-word;
    white-space: break-spaces;
}

.linhVucFilterSwiper {
    width: 100%;
    overflow: hidden;
}

    .linhVucFilterSwiper .swiper-slide {
        width: auto; /* Giúp độ rộng button tự điều chỉnh theo độ dài chữ */
    }

.dangKyDichVu-form {
    border-radius: 12px;
    border: 1px solid #D5E3F5;
    background: #F0F4FA;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

    .dangKyDichVu-form .dangKyDichVu-form-title {
        color: #0057E7;
        font-family: Mulish, sans-serif;
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
        padding-bottom: 0;
    }

    .dangKyDichVu-form input[type=text],
    .dangKyDichVu-form input[type=phone],
    .dangKyDichVu-form input[type=number],
    .dangKyDichVu-form input[type=email],
    .dangKyDichVu-form textarea {
        width: 100%;
        padding: 10px 12px;
        border-radius: 8px;
        border: 1px solid #D5E3F5;
        background: #FFF;
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.42; /* 142.857% */
        transition: all 0.5s ease-in-out;
    }

        /* placeholder */
        .dangKyDichVu-form input[type=text]::placeholder,
        .dangKyDichVu-form input[type=phone]::placeholder,
        .dangKyDichVu-form input[type=number]::placeholder,
        .dangKyDichVu-form input[type=email]::placeholder {
            color: #6B7A99;
            font-family: Mulish, sans-serif;
            font-size: 14px;
            font-style: normal;
            font-weight: 400;
            line-height: 1.42; /* 142.857% */
        }

        .dangKyDichVu-form input:focus,
        .dangKyDichVu-form textarea:focus {
            outline: none;
            box-shadow: 0 0 5px .2rem rgba(30, 45, 190, .15)
        }

    .dangKyDichVu-form .btn-guiDangKy {
        padding: 10px 30px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .dangKyDichVu-form .btn-guiDangKy {
        padding: 10px 30px;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 8px;
        color: #FFF;
        border-radius: 8px;
        background: #0057E7;
        text-align: center;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
        cursor: pointer;
    }

    .dangKyDichVu-form .form-group {
        margin-bottom: 0;
    }

.btn-lienhe {
    cursor: pointer;
}

.fw-700 {
    font-weight: 700;
}

/***********************NOTIFY**************************/
div[data-notify="container"] {
    border-radius: 8px !important;
    padding: 12px !important;
    z-index: 1000000000000 !important;
    max-width: 600px;
    display: flex !important;
    flex-direction: row;
    align-items: center;
}

    div[data-notify="container"] span[data-notify="message"] {
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 1.5; /* 150% */
        letter-spacing: 0.5px;
    }

        div[data-notify="container"] span[data-notify="message"] a {
            font-weight: 700;
            color: inherit;
        }

    div[data-notify="container"] button[data-notify="dismiss"],
    div[data-notify="container"] span[data-notify="icon"] {
        font-size: 0;
        opacity: 1 !important;
        min-width: 24px;
        height: 24px;
    }

    div[data-notify="container"] button[data-notify="dismiss"] {
        top: 50% !important;
        transform: translateY(-50%);
    }

    div[data-notify="container"] span[data-notify="icon"] {
        margin-right: 12px;
    }

        div[data-notify="container"] button[data-notify="dismiss"]::after,
        div[data-notify="container"] span[data-notify="icon"]::after {
            content: '';
            display: block;
            width: 24px;
            height: 24px;
        }

    div[data-notify="container"] button[data-notify="dismiss"]::after {
        position: absolute;
        top: 50% !important;
        transform: translateY(-50%);
    }

.alert-warning {
    border: 1px solid #FFD182 !important;
    background: #FFECCC !important;
}

    .alert-warning span[data-notify="message"] {
        color: #FFA200;
    }

    .alert-warning button[data-notify="dismiss"]::after {
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><mask id="mask0_620_10061" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_620_10061)"><path d="M11.9998 13.4L7.0998 18.3C6.91647 18.4833 6.68314 18.575 6.3998 18.575C6.11647 18.575 5.88314 18.4833 5.6998 18.3C5.51647 18.1167 5.4248 17.8833 5.4248 17.6C5.4248 17.3167 5.51647 17.0833 5.6998 16.9L10.5998 12L5.6998 7.1C5.51647 6.91667 5.4248 6.68334 5.4248 6.4C5.4248 6.11667 5.51647 5.88334 5.6998 5.7C5.88314 5.51667 6.11647 5.425 6.3998 5.425C6.68314 5.425 6.91647 5.51667 7.0998 5.7L11.9998 10.6L16.8998 5.7C17.0831 5.51667 17.3165 5.425 17.5998 5.425C17.8831 5.425 18.1165 5.51667 18.2998 5.7C18.4831 5.88334 18.5748 6.11667 18.5748 6.4C18.5748 6.68334 18.4831 6.91667 18.2998 7.1L13.3998 12L18.2998 16.9C18.4831 17.0833 18.5748 17.3167 18.5748 17.6C18.5748 17.8833 18.4831 18.1167 18.2998 18.3C18.1165 18.4833 17.8831 18.575 17.5998 18.575C17.3165 18.575 17.0831 18.4833 16.8998 18.3L11.9998 13.4Z" fill="%23FFA200"/></g></svg>');
    }

    .alert-warning span[data-notify="icon"]::after {
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><mask id="mask0_620_10059" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_620_10059)"><path d="M2.72479 21C2.54146 21 2.37479 20.9542 2.22479 20.8625C2.07479 20.7708 1.95812 20.65 1.87479 20.5C1.79146 20.35 1.74562 20.1875 1.73729 20.0125C1.72896 19.8375 1.77479 19.6667 1.87479 19.5L11.1248 3.5C11.2248 3.33333 11.354 3.20833 11.5123 3.125C11.6706 3.04167 11.8331 3 11.9998 3C12.1665 3 12.329 3.04167 12.4873 3.125C12.6456 3.20833 12.7748 3.33333 12.8748 3.5L22.1248 19.5C22.2248 19.6667 22.2706 19.8375 22.2623 20.0125C22.254 20.1875 22.2081 20.35 22.1248 20.5C22.0415 20.65 21.9248 20.7708 21.7748 20.8625C21.6248 20.9542 21.4581 21 21.2748 21H2.72479ZM4.44979 19H19.5498L11.9998 6L4.44979 19ZM11.9998 18C12.2831 18 12.5206 17.9042 12.7123 17.7125C12.904 17.5208 12.9998 17.2833 12.9998 17C12.9998 16.7167 12.904 16.4792 12.7123 16.2875C12.5206 16.0958 12.2831 16 11.9998 16C11.7165 16 11.479 16.0958 11.2873 16.2875C11.0956 16.4792 10.9998 16.7167 10.9998 17C10.9998 17.2833 11.0956 17.5208 11.2873 17.7125C11.479 17.9042 11.7165 18 11.9998 18ZM11.9998 15C12.2831 15 12.5206 14.9042 12.7123 14.7125C12.904 14.5208 12.9998 14.2833 12.9998 14V11C12.9998 10.7167 12.904 10.4792 12.7123 10.2875C12.5206 10.0958 12.2831 10 11.9998 10C11.7165 10 11.479 10.0958 11.2873 10.2875C11.0956 10.4792 10.9998 10.7167 10.9998 11V14C10.9998 14.2833 11.0956 14.5208 11.2873 14.7125C11.479 14.9042 11.7165 15 11.9998 15Z" fill="%23FFA200"/></g></svg>');
    }

.alert-success {
    border: 1px solid #9DE1CE !important;
    background: #D7F3EB !important;
}

    .alert-success span[data-notify="message"] {
        color: #35C19B;
    }

    .alert-success button[data-notify="dismiss"]::after {
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><mask id="mask0_620_10051" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_620_10051)"><path d="M11.9998 13.4L7.0998 18.3C6.91647 18.4833 6.68314 18.575 6.3998 18.575C6.11647 18.575 5.88314 18.4833 5.6998 18.3C5.51647 18.1167 5.4248 17.8833 5.4248 17.6C5.4248 17.3167 5.51647 17.0833 5.6998 16.9L10.5998 12L5.6998 7.09999C5.51647 6.91665 5.4248 6.68332 5.4248 6.39999C5.4248 6.11665 5.51647 5.88332 5.6998 5.69999C5.88314 5.51665 6.11647 5.42499 6.3998 5.42499C6.68314 5.42499 6.91647 5.51665 7.0998 5.69999L11.9998 10.6L16.8998 5.69999C17.0831 5.51665 17.3165 5.42499 17.5998 5.42499C17.8831 5.42499 18.1165 5.51665 18.2998 5.69999C18.4831 5.88332 18.5748 6.11665 18.5748 6.39999C18.5748 6.68332 18.4831 6.91665 18.2998 7.09999L13.3998 12L18.2998 16.9C18.4831 17.0833 18.5748 17.3167 18.5748 17.6C18.5748 17.8833 18.4831 18.1167 18.2998 18.3C18.1165 18.4833 17.8831 18.575 17.5998 18.575C17.3165 18.575 17.0831 18.4833 16.8998 18.3L11.9998 13.4Z" fill="%2335C19B"/></g></svg>');
    }

    .alert-success span[data-notify="icon"]::after {
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><mask id="mask0_620_10049" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_620_10049)"><path d="M12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C12.8 2 13.5792 2.09167 14.3375 2.275C15.0958 2.45833 15.825 2.725 16.525 3.075C16.775 3.20833 16.9375 3.40833 17.0125 3.675C17.0875 3.94167 17.0417 4.19167 16.875 4.425C16.7083 4.65833 16.4875 4.80833 16.2125 4.875C15.9375 4.94167 15.6667 4.90833 15.4 4.775C14.8667 4.525 14.3125 4.33333 13.7375 4.2C13.1625 4.06667 12.5833 4 12 4C9.78333 4 7.89583 4.77917 6.3375 6.3375C4.77917 7.89583 4 9.78333 4 12C4 14.2167 4.77917 16.1042 6.3375 17.6625C7.89583 19.2208 9.78333 20 12 20C14.2167 20 16.1042 19.2208 17.6625 17.6625C19.2208 16.1042 20 14.2167 20 12C20 11.8667 19.9958 11.7375 19.9875 11.6125C19.9792 11.4875 19.9667 11.3583 19.95 11.225C19.9167 10.9417 19.9708 10.6708 20.1125 10.4125C20.2542 10.1542 20.4667 9.98333 20.75 9.9C21.0167 9.81667 21.2667 9.84167 21.5 9.975C21.7333 10.1083 21.8667 10.3083 21.9 10.575C21.9333 10.8083 21.9583 11.0417 21.975 11.275C21.9917 11.5083 22 11.75 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22ZM10.6 13.8L19.9 4.475C20.0833 4.29167 20.3125 4.19583 20.5875 4.1875C20.8625 4.17917 21.1 4.275 21.3 4.475C21.4833 4.65833 21.575 4.89167 21.575 5.175C21.575 5.45833 21.4833 5.69167 21.3 5.875L11.3 15.9C11.1 16.1 10.8667 16.2 10.6 16.2C10.3333 16.2 10.1 16.1 9.9 15.9L7.05 13.05C6.86667 12.8667 6.775 12.6333 6.775 12.35C6.775 12.0667 6.86667 11.8333 7.05 11.65C7.23333 11.4667 7.46667 11.375 7.75 11.375C8.03333 11.375 8.26667 11.4667 8.45 11.65L10.6 13.8Z" fill="%2335C19B"/></g></svg>');
    }

.alert-info {
    border: 1px solid #85A3E0 !important;
    background: #CDD9F2 !important;
}

    .alert-info span[data-notify="message"] {
        color: #0543BD;
    }

    .alert-info button[data-notify="dismiss"]::after {
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><mask id="mask0_620_10056" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_620_10056)"><path d="M11.9998 13.4L7.0998 18.3C6.91647 18.4833 6.68314 18.575 6.3998 18.575C6.11647 18.575 5.88314 18.4833 5.6998 18.3C5.51647 18.1167 5.4248 17.8833 5.4248 17.6C5.4248 17.3167 5.51647 17.0833 5.6998 16.9L10.5998 12L5.6998 7.1C5.51647 6.91667 5.4248 6.68334 5.4248 6.4C5.4248 6.11667 5.51647 5.88334 5.6998 5.7C5.88314 5.51667 6.11647 5.425 6.3998 5.425C6.68314 5.425 6.91647 5.51667 7.0998 5.7L11.9998 10.6L16.8998 5.7C17.0831 5.51667 17.3165 5.425 17.5998 5.425C17.8831 5.425 18.1165 5.51667 18.2998 5.7C18.4831 5.88334 18.5748 6.11667 18.5748 6.4C18.5748 6.68334 18.4831 6.91667 18.2998 7.1L13.3998 12L18.2998 16.9C18.4831 17.0833 18.5748 17.3167 18.5748 17.6C18.5748 17.8833 18.4831 18.1167 18.2998 18.3C18.1165 18.4833 17.8831 18.575 17.5998 18.575C17.3165 18.575 17.0831 18.4833 16.8998 18.3L11.9998 13.4Z" fill="%230543BD"/></g></svg>');
    }

    .alert-info span[data-notify="icon"]::after {
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><mask id="mask0_620_10054" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_620_10054)"><path d="M12 17C12.2833 17 12.5208 16.9042 12.7125 16.7125C12.9042 16.5208 13 16.2833 13 16V12C13 11.7167 12.9042 11.4792 12.7125 11.2875C12.5208 11.0958 12.2833 11 12 11C11.7167 11 11.4792 11.0958 11.2875 11.2875C11.0958 11.4792 11 11.7167 11 12V16C11 16.2833 11.0958 16.5208 11.2875 16.7125C11.4792 16.9042 11.7167 17 12 17ZM12 9C12.2833 9 12.5208 8.90417 12.7125 8.7125C12.9042 8.52083 13 8.28333 13 8C13 7.71667 12.9042 7.47917 12.7125 7.2875C12.5208 7.09583 12.2833 7 12 7C11.7167 7 11.4792 7.09583 11.2875 7.2875C11.0958 7.47917 11 7.71667 11 8C11 8.28333 11.0958 8.52083 11.2875 8.7125C11.4792 8.90417 11.7167 9 12 9ZM12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C13.3833 2 14.6833 2.2625 15.9 2.7875C17.1167 3.3125 18.175 4.025 19.075 4.925C19.975 5.825 20.6875 6.88333 21.2125 8.1C21.7375 9.31667 22 10.6167 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22ZM12 20C14.2333 20 16.125 19.225 17.675 17.675C19.225 16.125 20 14.2333 20 12C20 9.76667 19.225 7.875 17.675 6.325C16.125 4.775 14.2333 4 12 4C9.76667 4 7.875 4.775 6.325 6.325C4.775 7.875 4 9.76667 4 12C4 14.2333 4.775 16.125 6.325 17.675C7.875 19.225 9.76667 20 12 20Z" fill="%230543BD"/></g></svg>');
    }

.alert-danger {
    border: 1px solid #E98888 !important;
    background: #F6CECE !important;
}

    .alert-danger span[data-notify="message"] {
        color: #D20808;
    }

    .alert-danger button[data-notify="dismiss"]::after {
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><mask id="mask0_620_10066" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_620_10066)"><path d="M11.9998 13.4L7.0998 18.3C6.91647 18.4833 6.68314 18.575 6.3998 18.575C6.11647 18.575 5.88314 18.4833 5.6998 18.3C5.51647 18.1167 5.4248 17.8833 5.4248 17.6C5.4248 17.3167 5.51647 17.0833 5.6998 16.9L10.5998 12L5.6998 7.1C5.51647 6.91667 5.4248 6.68334 5.4248 6.4C5.4248 6.11667 5.51647 5.88334 5.6998 5.7C5.88314 5.51667 6.11647 5.425 6.3998 5.425C6.68314 5.425 6.91647 5.51667 7.0998 5.7L11.9998 10.6L16.8998 5.7C17.0831 5.51667 17.3165 5.425 17.5998 5.425C17.8831 5.425 18.1165 5.51667 18.2998 5.7C18.4831 5.88334 18.5748 6.11667 18.5748 6.4C18.5748 6.68334 18.4831 6.91667 18.2998 7.1L13.3998 12L18.2998 16.9C18.4831 17.0833 18.5748 17.3167 18.5748 17.6C18.5748 17.8833 18.4831 18.1167 18.2998 18.3C18.1165 18.4833 17.8831 18.575 17.5998 18.575C17.3165 18.575 17.0831 18.4833 16.8998 18.3L11.9998 13.4Z" fill="%23D20808"/></g></svg>');
    }

    .alert-danger span[data-notify="icon"]::after {
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><mask id="mask0_620_10064" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_620_10064)"><path d="M2.72479 21C2.54146 21 2.37479 20.9542 2.22479 20.8625C2.07479 20.7708 1.95812 20.65 1.87479 20.5C1.79146 20.35 1.74562 20.1875 1.73729 20.0125C1.72896 19.8375 1.77479 19.6667 1.87479 19.5L11.1248 3.5C11.2248 3.33333 11.354 3.20833 11.5123 3.125C11.6706 3.04167 11.8331 3 11.9998 3C12.1665 3 12.329 3.04167 12.4873 3.125C12.6456 3.20833 12.7748 3.33333 12.8748 3.5L22.1248 19.5C22.2248 19.6667 22.2706 19.8375 22.2623 20.0125C22.254 20.1875 22.2081 20.35 22.1248 20.5C22.0415 20.65 21.9248 20.7708 21.7748 20.8625C21.6248 20.9542 21.4581 21 21.2748 21H2.72479ZM4.44979 19H19.5498L11.9998 6L4.44979 19ZM11.9998 18C12.2831 18 12.5206 17.9042 12.7123 17.7125C12.904 17.5208 12.9998 17.2833 12.9998 17C12.9998 16.7167 12.904 16.4792 12.7123 16.2875C12.5206 16.0958 12.2831 16 11.9998 16C11.7165 16 11.479 16.0958 11.2873 16.2875C11.0956 16.4792 10.9998 16.7167 10.9998 17C10.9998 17.2833 11.0956 17.5208 11.2873 17.7125C11.479 17.9042 11.7165 18 11.9998 18ZM11.9998 15C12.2831 15 12.5206 14.9042 12.7123 14.7125C12.904 14.5208 12.9998 14.2833 12.9998 14V11C12.9998 10.7167 12.904 10.4792 12.7123 10.2875C12.5206 10.0958 12.2831 10 11.9998 10C11.7165 10 11.479 10.0958 11.2873 10.2875C11.0956 10.4792 10.9998 10.7167 10.9998 11V14C10.9998 14.2833 11.0956 14.5208 11.2873 14.7125C11.479 14.9042 11.7165 15 11.9998 15Z" fill="%23D20808"/></g></svg>');
    }

button.close, button.mailbox-attachment-close {
    padding: 0;
    background-color: transparent;
    border: 0;
}

.owl-carousel {
    display: block;
}

.information_sidebar .TinBai_SideBar_Wrapper .TinBai_SideBar_Item:not(:last-child) {
    margin-bottom: 24px;
}

.having_sideline_flexrow .TinBai_SideBar_Wrapper .TinBai_SideBar_Item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

    .having_sideline_flexrow .TinBai_SideBar_Wrapper .TinBai_SideBar_Item .item_img_wrapper {
        display: block;
        width: 70px;
        flex-shrink: 0;
        aspect-ratio: 1;
        margin-bottom: 0;
    }

        .having_sideline_flexrow .TinBai_SideBar_Wrapper .TinBai_SideBar_Item .item_img_wrapper .item_img {
            aspect-ratio: 1;
            margin-bottom: 0;
            object-fit: cover;
            border-radius: 8px;
        }

    .having_sideline_flexrow .TinBai_SideBar_Wrapper .TinBai_SideBar_Item .news_info {
        display: flex;
        flex-direction: column-reverse;
    }

.information_sidebar .news_title {
    margin-bottom: 4px;
}

.having_sideline_flexrow .TinBai_SideBar_Wrapper .TinBai_SideBar_Item .news_info .news_title a {
    overflow: hidden;
    color: #1A1F36;
    text-overflow: ellipsis;
    font-family: Mulish, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.42; /* 142.857% */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.information_sidebar .news_date {
    color: #0057E7;
    font-family: Mulish, sans-serif;
    font-size: 13px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.38; /* 138.462% */
}


/* Styling Thống kê đánh giá */
.rating-stat-card {
    background: #F0F4FA;
    border-radius: 12px;
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 24px;
    max-width: 440px;
}

.rating-score-box {
    text-align: center;
    min-width: 72px;
}

    .rating-score-box .score-num {
        color: #0057E7;
        text-align: center;
        font-family: Mulish, sans-serif;
        font-size: 32px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        margin-bottom: 4px;
    }

    .rating-score-box .score-count {
        color: #6B7A99;
        text-align: center;
        font-family: Mulish, sans-serif;
        font-size: 13px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.38; /* 138.462% */
        margin-bottom: 4px;
    }

    .rating-score-box .score-stars i {
        color: #ff9800;
        font-size: 13px;
    }

.rating-bars-box {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.rating-bar-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #495057;
}

    .rating-bar-item .star-label {
        color: #1A1F36;
        text-align: right;
        font-family: Mulish, sans-serif;
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 1.42; /* 142.857% */
    }

        .rating-bar-item .star-label i {
            color: #ff9800;
            font-size: 12px;
        }

    .rating-bar-item .progress-track {
        flex-grow: 1;
        height: 8px;
        background-color: #e2ebf7;
        border-radius: 10px;
        overflow: hidden;
    }

    .rating-bar-item .progress-fill {
        height: 100%;
        background-color: #ff9800;
        border-radius: 10px;
        transition: width 0.3s ease;
    }

    .rating-bar-item .percent-text {
        color: #6B7A99;
        font-family: Mulish, sans-serif;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.42; /* 142.857% */
        display: inline-block;
        flex-shrink: 0;
        width: 39px;
    }

@media (max-width: 576px) {
    .rating-stat-card {
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
    }
}

/* CSS cho rating 5 ngôi sao */
.star-rating {
    display: inline-flex;
    flex-direction: row-reverse;
    font-size: 1.5rem;
}

    .star-rating input {
        display: none;
    }

    .star-rating label {
        color: #ccc;
        cursor: pointer;
        padding: 0 3px;
        transition: color 0.2s ease-in-out;
    }

        .star-rating label:hover,
        .star-rating label:hover ~ label,
        .star-rating input:checked ~ label {
            color: #ffc107; /* Màu vàng sao */
        }

.rating-stars-static {
    color: #ffc107;
}

.star-rating [type=radio]:checked + label:before,
.star-rating [type=radio]:checked + label:after,
.star-rating [type=radio]:not(:checked) + label:before,
.star-rating [type=radio]:not(:checked) + label:after {
    display: none;
}

.star-rating [type=radio]:checked + label,
.star-rating [type=radio]:not(:checked) + label {
    padding-left: 5px;
}

.danhGiaFormContainer {
    padding: 16px;
    border-radius: 12px;
    border: 1px solid var(--line-box, #D5E3F5);
    background: #F0F4FA;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

    .danhGiaFormContainer .btn-gui {
        width: fit-content;
        align-self: flex-end;
    }

.danh-sach-nhan-xet-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 550px;
    overflow-y: auto;
}

.danh-sach-nhan-xet-item-content {
    border-radius: 12px;
    border: 1px solid #D5E3F5;
    padding: 16px;
}

    .danh-sach-nhan-xet-item-content .nhan-xet-head {
        margin-bottom: 6px;
    }

    .danh-sach-nhan-xet-item-content .rating-stars-static {
        margin-bottom: 8px;
    }

    .danh-sach-nhan-xet-item-content .nhan-xet-title {
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
    }

    .danh-sach-nhan-xet-item-content .nhan-xet-date,
    .danh-sach-nhan-xet-item-content .nhan-xet-noi-dung {
        color: #6B7A99;
        font-family: Roboto, sans-serif;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.42; /* 142.857% */
    }

    .danh-sach-nhan-xet-item-content .nhan-xet-noi-dung {
        color: #1A1F36;
        margin-bottom: -12px;
    }

/* CSS cho Banner & Chi tiết Nhà cung cấp */
.mainContenData-supplier {
    gap: 16px;
}

    .mainContenData-supplier .select2-container {
        margin-left: auto;
    }

.supplier-card-banner {
    position: relative;
    overflow: hidden;
    margin-bottom: 24px;
    border-radius: 12px;
    border: 1px solid #D5E3F5;
    background: #FFF;
}

.supplier-banner-img {
    width: 100%;
    aspect-ratio: 2.8;
    object-fit: cover;
}

.supplier-info-wrapper {
    position: relative;
    padding: 0 24px 24px 24px;
}

.supplier-avatar-box {
    position: absolute;
    top: -60px;
    left: 24px;
    background: #fff;
    border-radius: 12px;
    padding: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
    width: 140px;
    text-align: center;
    z-index: 1;
    border: 1px solid #D5E3F5;
}

.supplier-avatar-img {
    width: 124px;
    aspect-ratio: 1;
    object-fit: contain;
    background-color: transparent;
    border-radius: 12px;
}

.supplier-badge-product {
}

.supplier-details-body {
    margin-left: 160px;
    padding-top: 16px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.supplier-name {
    color: #0057E7;
    font-family: Mulish, sans-serif;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.5; /* 150% */
    display: block;
    margin-bottom: 8px;
}

.supplier-sub-info {
    font-size: 13px;
    color: #1A1F36;
    margin-bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
}

    .supplier-sub-info p {
        margin-bottom: 0;
        padding-bottom: 0;
        font-weight: 700;
        font-size: 15px;
    }

.supplier-contact-list {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
}

    .supplier-contact-list li {
        margin-bottom: 6px;
        color: #6B7A99;
        font-family: Mulish, sans-serif;
        font-size: 15px;
        font-style: normal;
        font-weight: 600;
        line-height: 1.42; /* 142.857% */
        position: relative;
        padding-left: 26px;
    }

        .supplier-contact-list li a {
            color: #6B7A99;
        }

        .supplier-contact-list li:last-child {
            margin-bottom: 0;
        }


.sortHeader {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0px;
}

    .sortHeader .sortHeader-title {
        color: #6B7A99;
        font-family: Mulish, sans-serif;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.42; /* 142.857% */
        white-space: nowrap;
    }

    .sortHeader .form-select {
        background-color: transparent;
        border: none;
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 14px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.42; /* 142.857% */
    }

        .sortHeader .form-select:focus {
            box-shadow: none;
        }

.modal-backdrop.show {
    z-index: 0;
}

.thong-tin-doi-tuong-tim-mua {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

    .thong-tin-doi-tuong-tim-mua .titleH {
        color: #0057E7;
        font-family: Mulish, sans-serif;
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
        margin-bottom: 4px;
        position: relative;
        padding-left: 31px;
    }

        .thong-tin-doi-tuong-tim-mua .titleH::before {
            content: '';
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-50%);
            width: 24px;
            height: 24px;
            background-image: url('../images/icon-thongtinnguoimua.svg');
            background-repeat: no-repeat;
            background-size: contain;
            background-position: center;
        }

    .thong-tin-doi-tuong-tim-mua .info-row {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .thong-tin-doi-tuong-tim-mua .info-label {
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
    }

    .thong-tin-doi-tuong-tim-mua .info-value {
        color: #1A1F36;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.5; /* 150% */
    }

.SectionSangChe .pagination.pagination-customize {
    display: none;
}

/*.toggle-sub-lv {
    transition: transform 0.2s ease;
    font-size: 12px;
    color: #6c757d;
}

.lv-parent-item.open > .d-flex > .toggle-sub-lv {
    transform: rotate(180deg);
}

.filter-sub-list {
    margin-top: 4px;
    border-left: 2px solid #e9ecef;
}

    .filter-sub-list .filter-item-lv {
        font-size: 0.9em;
        padding-top: 4px;
        padding-bottom: 4px;
    }*/

.list-unstyled.filter-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.list-unstyled.filter-sub-list {
    margin-top: 8px;
}

    .list-unstyled.filter-sub-list li:not(:last-child) {
        margin-bottom: 8px;
    }

.lv-parent-item .fa {
    transition: all 0.2s ease-in-out;
}

.lv-parent-item.open .fa {
    transform: rotate(90deg);
}

#donViCungCapFilter .filter-list {
    max-height: 400px;
    overflow-y: auto;
}

.rc-anchor-light.rc-anchor-compact,
.rc-anchor-light.rc-anchor-normal {
    border: 1px solid #D5E3F5 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}

.layout-3-col .event-other {
    --spacing: 24px;
    --columns: 3;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    margin-left: calc(-1 * var(--spacing));
    gap: unset;
}

    .layout-3-col .event-other .item {
        overflow: hidden;
        width: calc(calc(100% / var(--columns)) - var(--spacing));
        margin-left: var(--spacing);
        margin-bottom: var(--spacing);
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

        .layout-3-col .event-other .item .Orther-img {
            width: 100%;
            aspect-ratio: 1.65;
            border-radius: 10px;
            overflow: hidden;
            position: relative;
            margin-bottom: 10px;
            display: block;
        }

        .layout-3-col .event-other .item .Event-img-thumbnail,
        .layout-3-col .event-other .item .Orther-img {
            width: 100%;
            aspect-ratio: 1.65;
            border-radius: 10px;
            overflow: hidden;
            position: relative;
            margin-bottom: 10px;
            display: block;
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center;
        }

        .layout-3-col .event-other .item .DateTookplace,
        .layout-3-col .event-other .item .Orther-date {
            color: var(--blue,#0765e3);
            font-family: Mulish, sans-serif;
            font-size: 16px;
            font-style: normal;
            font-weight: 400;
            line-height: 1.5;
            display: inline-block;
            padding-left: 20px;
            margin-bottom: 2px;
            position: relative;
        }

            .layout-3-col .event-other .item .DateTookplace:before,
            .layout-3-col .event-other .item .Orther-date:before {
                content: '';
                width: 16px;
                height: 16px;
                position: absolute;
                left: 0;
                top: 4px;
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
                background-image: url('../images/icon-date-16.svg');
            }

        .layout-3-col .event-other .item .Orther-link,
        .owl-carousel-event .title-event span.takeplace {
            color: var(--text-mi,#182940);
            font-family: Mulish, sans-serif;
            font-size: 16px;
            font-style: normal;
            font-weight: 700;
            line-height: 1.5;
        }

            .layout-3-col .event-other .item .Orther-link span,
            .owl-carousel-event .title-event span.takeplace {
                display: -webkit-box;
                overflow: hidden;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 3;
                margin-bottom: 4px;
            }

        .layout-3-col .event-other .item .Orther-img span[id*=lbltype] {
            display: block;
            position: absolute;
            bottom: 0;
            right: 0;
            left: 0;
            padding: 7px;
            border-radius: 0 0 10px 10px;
            background: rgba(0,0,0,.6);
            text-align: center;
            font-family: Roboto,sans-serif;
            font-size: 16px;
            font-style: normal;
            font-weight: 600;
            line-height: 1.5;
            color: var(--white,#fff);
        }

            .Section-SuKienNoiBat .owl-carousel-event .main-img .div-img .label-status.label-status-dangdienra,
            .layout-3-col .event-other .item .Orther-img span[id*=lbltype].otherHTE-red {
                color: #ffc52d;
            }

.owl-carousel-event .main-img {
    margin-bottom: 10px;
    border-radius: 10px;
}

    .owl-carousel-event .main-img .div-img,
    .owl-carousel-event .main-img .div-img .img-thumb,
    .owl-carousel-event .main-img .div-img .img-thumb img {
        border-radius: 10px;
        width: 100%;
        aspect-ratio: 1.65;
        object-fit: cover;
    }

        .owl-carousel-event .main-img .div-img .img-thumb-warpper {
            border-radius: 10px;
            overflow: hidden;
            position: relative;
        }

    .owl-carousel-event .main-img .div-img {
        position: relative;
    }

        .owl-carousel-event .main-img .div-img .img-thumb {
            display: block;
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center;
            transition: .3s ease-in-out;
        }

        .owl-carousel-event .main-img .div-img .label-status {
            position: absolute;
            bottom: 0;
            right: 0;
            left: 0;
            text-align: center;
            padding: 7px;
            border-radius: 0 0 10px 10px;
            background: rgba(0,0,0,.6);
            font-family: Roboto,sans-serif;
            font-size: 16px;
            font-style: normal;
            font-weight: 600;
            line-height: 1.5;
            color: #ea8f00;
            margin-bottom: 0;
        }

.owl-carousel-event .content-meta > * {
    display: block;
}

    .owl-carousel-event .content-meta > *.date-event-none {
        display: none;
    }

.owl-carousel-event .date-event,
.owl-carousel-event .lblDiaDiem {
    color: var(--blue,#0765e3);
    font-family: Mulish,sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
    display: inline-block;
    margin-bottom: 2px;
    padding-left: 20px;
    position: relative;
}

.owl-carousel-event .lblDiaDiem {
    display: none;
}

.owl-carousel-event .date-event:before,
.suKien-slidePane-wrapper .detail-suKienSlide:before {
    width: 16px;
    height: 16px;
    background-image: url(../images/icon-date-16.svg);
    position: absolute;
    left: 0;
    content: "";
    background-repeat: no-repeat;
    background-position: center;
    top: 50%;
    transform: translateY(-50%);
    background-size: contain;
}

.DnnModule-HueTourisEvent .having_icon > h4 {
    display: block;
    padding-bottom: 0;
    border-bottom: 0;
    font-size: 24px;
}

.Section-SuKienNoiBat .main-event-tieudiem, .suKien-topPane {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 30px;
}

    .Section-SuKienNoiBat .main-event-tieudiem > *, .suKien-topPane > * {
        width: calc(50% - 15px);
    }

    .Section-SuKienNoiBat .main-event-tieudiem .main-content-left .img-thumb {
        border-radius: 10px;
        box-shadow: 10px 10px 0 0 rgba(0,0,0,.1);
        aspect-ratio: 1.7;
        object-fit: cover;
        transition: .3s ease-in-out;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

    .Section-SuKienNoiBat .main-event-tieudiem .title-event a {
        display: block;
        color: #182940;
        font-family: Mulish, sans-serif;
        font-size: 22px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.54;
        margin-bottom: 20px;
        transition: .3s ease-in-out;
    }

    .Section-SuKienNoiBat .main-event-tieudiem .content-meta .detail-suKienMain,
    .suKien-topPane .detail-suKienMain {
        padding-bottom: 0;
        padding-left: 34px;
        margin-bottom: 0;
        display: block;
        position: relative;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.5;
        text-align: justify;
    }

        .Section-SuKienNoiBat .main-event-tieudiem .content-meta .date-event,
        .suKien-topPane .detail-suKienMain.detail-suKienMain-date {
            font-weight: 600;
            color: #0765e3;
        }

        .Section-SuKienNoiBat .main-event-tieudiem .content-meta .detail-suKienMain-location,
        .suKien-topPane .detail-suKienMain.detail-suKienMain-location {
            font-weight: 600;
        }

.event-main-time-countdown-item-text {
    font-weight: 700 !important;
}

.Section-SuKienNoiBat .main-event-tieudiem .content-meta .detail-suKienMain:not(:last-of-type),
.suKien-topPane .detail-suKienMain:not(:last-child) {
    margin-bottom: 10px;
}

.Section-SuKienNoiBat .main-event-tieudiem .content-meta .detail-suKienMain:before,
.suKien-topPane .detail-suKienMain:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 24px;
    height: 24px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.Section-SuKienNoiBat .main-event-tieudiem .content-meta .detail-suKienMain.date-event:before,
.suKien-topPane .detail-suKienMain.detail-suKienMain-date:before {
    background-image: url(../images/icon-date.svg);
}

.Section-SuKienNoiBat .main-event-tieudiem .content-meta .detail-suKienMain.detail-suKienMain-location:before,
.suKien-topPane .detail-suKienMain.detail-suKienMain-location:before {
    background-image: url(../images/icon-location.svg);
}



.form-GuiGopY.form-Request.not-logged-in {
    position: relative;
    z-index: 1;
}

    .form-GuiGopY.form-Request.not-logged-in:before {
        /* Thêm các kiểu CSS cho trạng thái không đăng nhập */
        /* From https://css.glass */
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(255, 255, 255, 0.2);
        border-radius: 0 0 12px 12px;
        box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
        backdrop-filter: blur(2.7px);
        -webkit-backdrop-filter: blur(2.7px);
        border: 1px solid rgba(255, 255, 255, 0.3);
    }


    .form-GuiGopY.form-Request.not-logged-in:after {
        content: "Vui lòng đăng nhập để gửi đăng ký";
        position: absolute;
        top: 30%;
        left: 50%;
        transform: translate(-50%, -50%);
        color: #E37900;
        font-family: Mulish, sans-serif;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 1.5; /* 150% */
        text-align: center;
    }