img.lazy,
picture {
    display: flex
}

.wrap-content,
.wrap-content>.fw {
    grid-column: main
}

.ovf-hidden,
.scale-img,
.text-split {
    overflow: hidden
}

.grid-doingu,
.doingu-slide,
.gt_home-thongso {
    filter: drop-shadow(0 0 10px rgba(0, 0, 0, .1))
}

.gt_home-container,
.wrap-tuvan>.row.g-0 {
    --bs-gutter-x: clamp(16px, 30 / var(--max-w-unit) * var(--max-w), 30px);
    --bs-gutter-y: clamp(16px, 30 / var(--max-w-unit) * var(--max-w), 30px)
}

.dichvu-qc,
.doingu-qc,
.giayphep-slide .giayphep-qc,
.gt_home-thongso .gt_home-qc,
.tintuc-qc,
.tuvan-thongso,
.tuvan-thongso .tuvan-qc {
    container-type: inline-size;
    --item-w: 100cqw
}

@keyframes spin {
    to {
        transform: rotate(360deg)
    }
}

@keyframes blink {

    0%,
    100% {
        opacity: 1
    }

    50% {
        opacity: 0
    }
}

@keyframes shake-anim {
    0% {
        transform: rotate(0) scale(1) skew(1deg)
    }

    10%,
    30% {
        -moz-transform: rotate(-25deg) scale(1) skew(1deg)
    }

    20%,
    40% {
        -moz-transform: rotate(25deg) scale(1) skew(1deg)
    }

    100%,
    50% {
        -moz-transform: rotate(0) scale(1) skew(1deg)
    }
}

@keyframes rotate {
    from {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

@keyframes fadeup {
    from {
        opacity: 0;
        transform: translateX(-20px)
    }

    to {
        opacity: 1;
        transform: translateX(0)
    }
}

@keyframes pulse-animation {
    0% {
        transform: scale3d(1, 1, 1);
        opacity: 0
    }

    10% {
        transform: scale3d(1.1, 1.1, 1.1);
        opacity: 1
    }

    100% {
        transform: scale3d(1.6, 1.6, 1.6);
        opacity: 0
    }
}

@keyframes border-animation {
    0% {
        transform: scale3d(.6, .6, .6);
        opacity: 0
    }

    20% {
        transform: scale3d(1.2, 1.2, 1.2);
        opacity: 1
    }

    100% {
        transform: scale3d(1.4, 1.4, 1.4);
        opacity: 0
    }
}

@keyframes skeleton {

    0%,
    100% {
        opacity: 1
    }

    50% {
        opacity: .1
    }
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }

    50% {
        opacity: 1
    }
}

@-webkit-keyframes pulse {

    0%,
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05)
    }
}

@keyframes pulse {

    0%,
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05)
    }
}

.inset-0 {
    inset: 0
}

.pointer {
    cursor: pointer
}

.z--1 {
    z-index: -1
}

.z-1 {
    z-index: 1
}

.z-2 {
    z-index: 2
}

.z-3 {
    z-index: 3
}

.isolate {
    isolation: isolate
}

.square {
    aspect-ratio: 1/1
}

:root {
    --max-padding: clamp(24px, calc(30 / 1230 * 100vw), 30px);
    --max-w-unit: 1200;
    --max-w: min(1200px, calc(100vw - var(--max-padding)));
    --primary-color: #00ae48;
    --dark-primary-color: #005e27;
    --secondary-color: #b01f24;
    --third-color: #c19b67;
    --font-family: 'Roboto', sans-serif;
    --second-family: 'SVN-Poppins', sans-serif;
    --line: 3;
    --menu-link-color: #282828;
    --menu-sub-bg: #fafafa;
    --menu-sub-color: #313131;
    --menu-sub-divider: #ececec;
    --menu-line-color: rgba(0, 0, 0, 0.1)
}

::-webkit-scrollbar {
    width: 4px;
    height: 4px;
    position: fixed;
    right: 0;
    top: 0;
    bottom: 0;
    opacity: .5
}

::-webkit-scrollbar-track {
    background: #fff;
    border-radius: 10px
}

::-webkit-scrollbar-thumb {
    background-color: var(--primary-color);
    border-radius: 5px
}

body {
    top: 0 !important;
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, Liberation Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
    font-family: var(--font-family);
    font-size: 14px
}

button {
    all: unset;
    box-sizing: border-box
}

picture:has(>img.w-100) {
    width: 100%;
    height: auto
}

img {
    max-width: 100%;
    object-fit: cover;
    display: inline-block;
    height: auto
}

img.lazy {
    opacity: 0
}

img:not(.initial) {
    transition: opacity 1s
}

img:not([src]) {
    visibility: hidden
}

img:is(.loaded, .error) {
    opacity: 1
}

a,
input,
textarea {
    outline: 0;
    padding: 0
}

input[type=number] {
    appearance: textfield
}

input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.wrap-content {
    display: grid;
    width: 100% !important;
    grid-template-columns: [main-start] 1fr [content-start] var(--max-w) [content-end] 1fr [main-end]
}

.grid-dichvu,
.grid-doingu,
.grid-sp {
    grid-template-columns: repeat(auto-fill, minmax(max(150px, (100% - var(--gap) * 3) / 4), 1fr))
}

.wrap-content>:not(.fw, .wrap-content) {
    grid-column: content
}

.breadCrumbs+:is(.wrap-content, .wrap-main) {
    margin-block: clamp(24px, 48 / var(--max-w-unit) * var(--max-w), 48px)
}

.pagination {
    --bs-pagination-color: var(--primary-color);
    --bs-pagination-hover-color: var(--primary-color);
    --bs-pagination-active-bg: var(--primary-color);
    --bs-pagination-active-border-color: var(--primary-color);
    flex-wrap: wrap;
    margin: 20px 0 0 !important
}

.pagination .page-item .page-link {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%
}

:is(.title-main, .title-detail) {
    text-align: center;
    margin-bottom: clamp(12px, 20 / var(--max-w-unit) * var(--max-w), 20px);
    display: flex;
    flex-direction: column;
    align-items: center
}

:is(.title-main, .title-detail) :is(img, svg) {
    width: clamp(36px, 60 / var(--max-w-unit) * var(--max-w), 60px);
    height: clamp(36px, 60 / var(--max-w-unit) * var(--max-w), 60px);
    margin-bottom: clamp(6px, 12 / var(--max-w-unit) * var(--max-w), 12px);
    display: none;
}

:is(.title-main, .title-detail) .label {
    font: 500 clamp(14px, 16 / var(--max-w-unit) * var(--max-w), 16px)/1.5625 var(--font-family);
    text-transform: uppercase;
    text-align: center;
    color: #323131;
    /* margin-top: .875em; */
    margin-bottom: .25em;
    display: inline-block
}

:is(.title-main, .title-detail) :is(span, h1, h2, h3, h4, h5, h6):not(.label, .slogan) {
    font: 700 30px var(--font-family);
    text-transform: uppercase;
    text-align: center;
    color: #005e27;
    margin-bottom: 0;
    display: inline-block
}

:is(.title-main, .title-detail) .slogan {
    font: 400 clamp(12px, 14 / var(--max-w-unit) * var(--max-w), 14px)/1.78571 SVN-Gilroy, sans-serif;
    text-align: center;
    color: #4d4d4d;
    margin-top: .2142857143em;
    display: inline-block;
    text-wrap: balance
}

.time-main {
    color: #999;
    margin-bottom: .75rem
}

.time-main i {
    margin: 3px 7px 0 0;
    vertical-align: top
}

.time-main span {
    display: inline-block;
    vertical-align: top
}

.share {
    background: hsla(0, 0%, 50%, .15);
    border-radius: 5px;
    line-height: normal;
    margin-top: 15px;
    padding: 17px 15px 10px
}

.share b {
    display: block;
    margin-bottom: 5px
}

.text-split {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--line);
    box-orient: vertical;
    line-clamp: var(--line);
    display: -webkit-box;
    text-overflow: ellipsis;
    white-space: normal;
    height: calc(var(--line)*1lh)
}

.scale-img img {
    transition: .3s;
    transform: scale(1)
}

.scale-img {
    display: block
}

:is([class*=_item]:hover .scale-img, .scale-img:hover) picture>img,
:is([class*=_item]:hover .scale-img, .scale-img:hover)>img {
    transition: .3s;
    transform: scale(1.1)
}

[class*=-xemthem] {
    transition: .6s;
    position: relative;
    overflow: hidden
}

[class*=-xemthem]::before {
    transition: .6s;
    content: "";
    z-index: -1;
    position: absolute;
    inset: 0;
    background-image: linear-gradient(20deg, var(--bg, transparent) 50%, var(--xemthem-color, var(--primary-color)) 50%);
    background-size: 600%
}

[class*=-xemthem]:hover {
    color: #fff;
    transform: translateX(.5rem)
}

[class*=-xemthem]:hover::before {
    background-position: 100%
}

.transition {
    transition: .3s
}

.skeleton :is([class*="-pic "], [class*="-title "], [class*="-desc "], [class*="-content "], [class*="-price "], .should-skeletonize) {
    background: #e4e4e4;
    border-radius: 5px;
    animation: 2s ease-in-out infinite skeleton;
    color: transparent;
    -webkit-text-fill-color: rgba(0, 0, 0, 0)
}

.skeleton .pagination-ajax {
    filter: grayscale(1);
    position: relative
}

.skeleton .pagination-ajax::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 3
}

.skeleton img {
    opacity: 0
}

.htmx-indicator:not(.htmx-request) {
    display: none !important
}

.aos-overflow {
    overflow: hidden !important;
    overflow: clip visible !important
}

.menu-res {
    z-index: 100
}

.wrap-header {
    overflow: clip visible;
    position: relative
}

.wrap-header .logo {
    aspect-ratio: 351/66;
    width: min(351px, 70%) !important;
    height: auto !important;
    margin-inline: auto;
    margin-block: 8px
}

.wrap-header .header-top {
    position: relative;
    isolation: isolate;
    font: 400 14px/1.0714285714 var(--second-family);
    color: #fff;
    padding: 1lh 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.6em;
    width: 100%
}

.wrap-header .header-top::before {
    position: absolute;
    content: "";
    top: 0;
    left: 50%;
    translate: -50% 0;
    width: 100vw;
    height: 100%;
    background: #209e54;
    z-index: -1
}

@media(min-width:992px) {
    .wrap-header {
        height: calc(125 / var(--max-w-unit) * var(--max-w))
    }

    .wrap-header .header-top {
        position: absolute;
        left: calc(380 / var(--max-w-unit) * var(--max-w));
        top: 0;
        padding-left: calc(37 / var(--max-w-unit) * var(--max-w));
        height: auto;
        width: calc(100% - calc(380 / var(--max-w-unit) * var(--max-w)))
    }

    .wrap-header .header-top::before {
        left: 0 !important;
        translate: 0px 0px !important;
        border-radius: 0 0 0 45px
    }

    .wrap-header .logo {
        position: absolute;
        top: calc(30 / var(--max-w-unit) * var(--max-w));
        left: 0;
        width: calc(351 / var(--max-w-unit) * var(--max-w)) !important;
        height: calc(66 / var(--max-w-unit) * var(--max-w)) !important;
        margin: 0
    }
}

footer {
    background-color: var(--primary-color);
    --col-1: calc(280 / var(--max-w-unit) * var(--max-w));
    --col-2: calc(345 / var(--max-w-unit) * var(--max-w));
    --col-3: calc(155 / var(--max-w-unit) * var(--max-w));
    --col-4: calc(280 / var(--max-w-unit) * var(--max-w))
}

.footer-top {
    padding-block: clamp(24px, 59 / var(--max-w-unit) * var(--max-w), 59px) clamp(24px, 75 / var(--max-w-unit) * var(--max-w), 75px)
}

.footer-content {
    font: 400 14px/2.42857 var(--font-family)
}

.footer-content ul,
.footer-listview {
    list-style: disc inside
}

.footer-social {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: clamp(4px, 10 / var(--max-w-unit) * var(--max-w), 10px);
    margin-top: 8px
}

.footer-social a {
    padding: .3571428571em;
    font: 400 14px/1.1428571429 var(--font-family);
    color: #fff;
    border: 1px solid #fff;
    border-radius: 100px;
    gap: .5714285714em
}

.footer-social a :is(img, picture) {
    width: 2.1428571429em;
    height: 2.1428571429em
}

.footer-social a:has(span) {
    padding-right: 1.2857142857em
}

.footer-title {
    font: 700 clamp(14px, 18 / var(--max-w-unit) * var(--max-w), 18px)/1.1666666667 var(--font-family);
    text-transform: uppercase;
    color: #fff;
    margin-bottom: .2222222222em;
    display: flex;
    flex-direction: column;
    gap: .5em
}

.footer-title::after {
    content: "";
    width: 36px;
    height: 1px;
    background: currentColor
}

.footer-listview_item {
    padding-block: .5357142857em;
    font: 400 14px/1.4285714286 var(--font-family);
    color: #fff
}

.footer-listview_item:hover {
    color: var(--secondary-color)
}

.footer-powered {
    padding: 1.2142857143em 0;
    background: rgba(0, 0, 0, .2);
    font: 400 14px/1.1428571429 var(--font-family);
    text-align: center;
    color: #fff
}

#footer-map {
    height: 216px;
    position: relative
}

#footer-map iframe {
    height: 100% !important;
    left: 0 !important;
    position: absolute !important;
    top: 0 !important;
    width: 100% !important
}

.grid-sp {
    display: grid;
    --gap: clamp(8px, calc(20 / 1230 * 100vw), 20px);
    gap: var(--gap)
}

.wrap-gt_home {
    padding-block: clamp(24px, 67 / var(--max-w-unit) * var(--max-w), 67px) clamp(24px, 60 / var(--max-w-unit) * var(--max-w), 60px);
    background: #f5fff9;
    overflow: hidden
}

.gt_home-container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    row-gap: 24px
}

.gt_home-banner {
    border-radius: 10px;
    width: min(585px, 100%);
    overflow: hidden
}

.gt_home-info .gt_home-label {
    font: 500 clamp(14px, 20 / var(--max-w-unit) * var(--max-w), 20px)/1.15 var(--font-family);
    text-transform: uppercase;
    color: #4d4d4d;
    margin-bottom: .45em
}

.gt_home-info .gt_home-title {
    font: 700 clamp(18px, 35 / var(--max-w-unit) * var(--max-w), 35px)/1.2857142857 var(--font-family);
    text-transform: uppercase;
    color: #005e27;
    margin-bottom: .2571428571em
}

.gt_home-info .gt_home-desc {
    font: 400 clamp(12px, 14 / var(--max-w-unit) * var(--max-w), 14px)/2.14286 var(--font-family);
    color: #4d4d4d;
    margin-top: 1.4285714286em
}

.gt_home-info .gt_home-xemthem {
    font: 700 clamp(12px, 14 / var(--max-w-unit) * var(--max-w), 14px)/1.14286 var(--font-family);
    text-transform: uppercase;
    color: #fff;
    padding: .8571428571em 1.5em;
    border-radius: 10px;
    background: var(--primary-color);
    margin-top: clamp(24px, 50 / var(--max-w-unit) * var(--max-w), 50px)
}

.gt_home-tieuchi {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: start;
    margin-top: 9px;
    gap: clamp(8px, 12 / var(--max-w-unit) * var(--max-w), 12px)
}

.gt_home-tieuchi span {
    font: 600 clamp(12px, 14 / var(--max-w-unit) * var(--max-w), 14px)/1.4285714286 var(--second-family);
    color: #209e54;
    padding: .7142857143em 1.0714285714em;
    border: 1px solid #209e54;
    border-radius: .4285714286em;
    display: flex;
    align-items: center;
    gap: .4285714286em
}

.gt_home-tieuchi span :is(img, picture) {
    width: 1lh;
    height: 1lh
}

.gt_home-thongso {
    margin-top: clamp(24px, 60 / var(--max-w-unit) * var(--max-w), 60px)
}

.gt_home-thongso .gt_home-qc {
    --item-w-unit: 278
}

.gt_home-thongso .gt_home_item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    background: #fff;
    border: 1px solid #f1f5f9;
    border-radius: clamp(12px, 16 / var(--item-w-unit) * var(--item-w), 16px);
    padding: clamp(22px, 44 / var(--item-w-unit) * var(--item-w), 44px);
    padding-bottom: clamp(19px, 38 / var(--item-w-unit) * var(--item-w), 38px)
}

.gt_home-thongso .gt_home-pic {
    width: calc(68 / var(--item-w-unit) * var(--item-w));
    height: calc(68 / var(--item-w-unit) * var(--item-w))
}

.gt_home-thongso .gt_home-title {
    font: 700 clamp(24px, 40 / var(--item-w-unit) * var(--item-w), 40px)/1.2 var(--font-family);
    color: #005e27;
    margin-top: .3em
}

.gt_home-thongso .gt_home-divider {
    width: 40px;
    height: 2px;
    margin-top: clamp(8px, 16 / var(--item-w-unit) * var(--item-w), 16px);
    background: #c19b67
}

.gt_home-thongso .gt_home-desc {
    font: 600 clamp(12px, 15 / var(--item-w-unit) * var(--item-w), 15px)/1.6 var(--font-family);
    text-transform: uppercase;
    color: #4b4b4b;
    margin-top: 1.0666666667em
}

.wrap-dichvu,
.wrap-doingu,
.wrap-tintuc {
    margin-block: clamp(24px, 60 / var(--max-w-unit) * var(--max-w), 60px)
}

.grid-dichvu {
    --gap: clamp(4px, 10 / var(--max-w-unit) * var(--max-w), 10px);
    display: grid;
    gap: var(--gap)
}

.dichvu-qc {
    --item-w-unit: 293
}

.dichvu_item {
    overflow: hidden;
    position: relative;
    border-radius: clamp(5px, 10 / var(--item-w-unit) * var(--item-w), 10px)
}

.dichvu-pic {
    position: absolute;
    inset: 0
}

.dichvu-pic,
.dichvu-pic :is(img, picture) {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: unset !important
}

.dichvu-info {
    position: relative;
    z-index: 20;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: clamp(8px, 20 / var(--item-w-unit) * var(--item-w), 20px);
    background: rgba(0, 0, 0, .75)
}

@media (min-width: 992px) {
    .dichvu-info {
        aspect-ratio: 293/341;
    }
}

.dichvu-icon {
    width: clamp(36px, 60 / var(--item-w-unit) * var(--item-w), 60px);
    height: clamp(36px, 60 / var(--item-w-unit) * var(--item-w), 60px);
    margin-bottom: clamp(12px, 16 / var(--item-w-unit) * var(--item-w), 16px)
}

.dichvu-title {
    font: 700 16px/1.4375 var(--font-family);
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    margin-bottom: 1lh
}

.dichvu-desc {
    font: 400 14px/1.64286 var(--font-family);
    text-align: center;
    color: #fff;
    margin-bottom: 1.5714285714em
}

.dichvu-btn {
    font: 700 14px/1.14286 var(--font-family);
    text-transform: uppercase;
    color: #fff;
    padding: .8571428571em 1.5em;
    background: #209e54;
    border-radius: clamp(4px, 10 / var(--item-w-unit) * var(--item-w), 10px);
    --xemthem-color: var(--secondary-color)
}

.grid-doingu {
    --gap: clamp(8px, 30 / var(--max-w-unit) * var(--max-w), 30px);
    display: grid;
    gap: var(--gap)
}

.doingu-qc {
    --item-w-unit: 277
}

.doingu_item {
    display: flex;
    flex-direction: column;
    align-items: center;
    /* justify-content: center; */
    background: #fff;
    border-radius: clamp(6px, 12 / var(--item-w-unit) * var(--item-w), 12px);
    padding: clamp(5px, 10 / var(--max-w-unit) * var(--max-w), 10px)
}

.doingu-pic {
    width: 100%;
    height: auto;
    aspect-ratio: 257/338;
}

.doingu-pic,
.giayphep-slide .giayphep-pic {
    border-radius: clamp(5px, 10 / var(--item-w-unit) * var(--item-w), 10px)
}

.doingu-title {
    font: 700 clamp(14px, 17 / var(--item-w-unit) * var(--item-w), 17px)/1.58588 var(--font-family);
    text-align: center;
    text-transform: capitalize;
    color: #005e27;
    margin-top: .7647058824em
}

.doingu-chuc_vu {
    font: 400 clamp(12px, 14 / var(--item-w-unit) * var(--item-w), 14px)/1.37551 var(--font-family);
    text-align: center;
    color: #209e54;
    margin-bottom: clamp(4px, 9 / var(--item-w-unit) * var(--item-w), 9px)
}

.doingu-divider {
    width: 46px;
    height: 1px;
    background: #ffc300
}

.doingu-desc {
    font: 400 clamp(12px, 14 / var(--item-w-unit) * var(--item-w), 14px)/1.56464 var(--font-family);
    text-align: center;
    color: #4b5563;
    margin-block: clamp(4px, 8 / var(--item-w-unit) * var(--item-w), 8px) clamp(2px, 5 / var(--item-w-unit) * var(--item-w), 5px)
}

.wrap-giayphep {
    padding-block: clamp(24px, 60 / var(--max-w-unit) * var(--max-w), 60px);
    background-color: var(--primary-color);
    overflow: hidden
}

.giayphep-container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    row-gap: 24px
}

.giayphep-info {
    --w-lg: calc(341 / var(--max-w-unit) * var(--max-w))
}

.giayphep-slide {
    --w-lg: calc(831 / var(--max-w-unit) * var(--max-w))
}

.giayphep-title {
    font: 700 clamp(18px, 30 / var(--max-w-unit) * var(--max-w), 30px)/1.1666666667 var(--font-family);
    text-transform: uppercase;
    color: #fff900;
    margin-bottom: .7666666667em
}

.giayphep-divider {
    width: clamp(70px, 102 / var(--max-w-unit) * var(--max-w), 102px);
    height: 1px;
    background: #fff;
    margin-block: clamp(10px, 20 / var(--max-w-unit) * var(--max-w), 20px)
}

.giayphep-desc {
    font: 400 clamp(12px, 14 / var(--max-w-unit) * var(--max-w), 14px)/2.14286 var(--font-family);
    color: #fff;
    margin-bottom: clamp(12px, 21 / var(--max-w-unit) * var(--max-w), 21px)
}

.giayphep-xemthem {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .625em;
    font: 700 clamp(14px, 16 / var(--max-w-unit) * var(--max-w), 16px)/1.99618 var(--font-family);
    text-transform: uppercase;
    text-align: center;
    color: #282828;
    padding: .3125em 1.75em;
    border-radius: 7px;
    background: #fc0
}

.giayphep-xemthem svg {
    width: .875em;
    height: 1em
}

.giayphep-slide .giayphep-qc {
    --item-w-unit: 257
}

.giayphep-slide .giayphep-pic {
    padding: clamp(10px, 21 / var(--item-w-unit) * var(--item-w), 21px);
    background: #f2f2f2
}

.giayphep-slide .giayphep-title {
    font: 400 clamp(13px, 15 / var(--item-w-unit) * var(--item-w), 15px)/2 var(--font-family);
    text-transform: capitalize;
    text-align: center;
    color: #fff;
    margin-top: .7333333333em
}

.wrap-tuvan {
    background: linear-gradient(180deg, rgba(232, 255, 241, 0) 0, #e8fff1 100%);
    padding-block: clamp(24px, 60 / var(--max-w-unit) * var(--max-w), 60px);
    overflow: hidden
}

.tintuc_item,
.tuvan-form {
    background: #fff
}

.tuvan-form {
    border-radius: clamp(10px, 20 / var(--max-w-unit) * var(--max-w), 20px);
    padding: clamp(16px, 37 / var(--max-w-unit) * var(--max-w), 37px) clamp(16px, 35 / var(--max-w-unit) * var(--max-w), 35px);
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .1)
}

.tuvan-form>.row.g-0 {
    --bs-gutter-x: clamp(5px, 10 / var(--max-w-unit) * var(--max-w), 10px);
    --bs-gutter-y: clamp(5px, 10 / var(--max-w-unit) * var(--max-w), 10px)
}

.tuvan-form :is(input, textarea) {
    font: 400 clamp(12px, 14 / var(--max-w-unit) * var(--max-w), 14px)/1.5 var(--font-family);
    color: #333;
    border: 1px solid #e8e8e8;
    border-radius: .7142857143em;
    padding: .8571428571em
}

.tuvan-form :is(input, textarea)::placeholder {
    color: #4d4d4d
}

.tuvan-form input {
    height: 3.2142857143em
}

.tuvan-form textarea {
    height: 6.4285714286em !important;
    resize: none
}

.tuvan-form button[type=submit] {
    font: 700 clamp(13.7142857143px, 16 / var(--max-w-unit) * var(--max-w), 16px)/1.3125 var(--font-family);
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: .75em;
    background: #209e54;
    border-radius: .625em;
    height: 2.8125em;
    cursor: pointer;
    --xemthem-color: $secondary-color
}

.tuvan-thongso {
    --item-w-unit: 585
}

.tuvan-thongso .grid-tuvan {
    --gap: clamp(24px, 56 / var(--max-w-unit) * var(--max-w), 56px);
    --min-item-w: clamp(175px, 250 / var(--item-w-unit) * var(--item-w), 250px);
    display: grid;
    gap: clamp(24px, 36 / var(--max-w-unit) * var(--max-w), 36px) var(--gap);
    grid-template-columns: repeat(auto-fill, minmax(max(var(--min-item-w), (100% - var(--gap) * 3) / 4), 1fr))
}

.tuvan-thongso .tuvan-qc {
    --item-w-unit: 263
}

.tuvan-thongso .tuvan_item {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: clamp(5px, 10 / var(--item-w-unit) * var(--item-w), 10px)
}

.tuvan-thongso .tuvan-pic {
    width: clamp(36px, 72 / var(--item-w-unit) * var(--item-w), 72px);
    height: clamp(36px, 72 / var(--item-w-unit) * var(--item-w), 72px)
}

.tuvan-thongso .tuvan-info {
    flex: 1 1 auto;
    width: 1%
}

.tuvan-thongso .tuvan-title {
    font: 500 clamp(14px, 16 / var(--item-w-unit) * var(--item-w), 16px)/1.1875 var(--font-family);
    text-transform: capitalize;
    color: #242424
}

.tuvan-thongso .tuvan-desc {
    font: 700 clamp(24px, 45 / var(--item-w-unit) * var(--item-w), 45px)/1.15556 var(--font-family);
    text-transform: uppercase;
    color: #209e54;
    margin-top: .1555555556em
}

.tuvan-banner {
    border-radius: clamp(10px, 20 / var(--max-w-unit) * var(--max-w), 20px);
    margin-top: clamp(16px, 30 / var(--max-w-unit) * var(--max-w), 30px);
    width: min(585px, 100%);
    margin-inline: auto
}

.tintuc-slide {
    filter: drop-shadow(0 0 6px rgba(0, 0, 0, .1))
}

.tintuc-qc {
    --item-w-unit: 380
}

.tintuc-info {
    padding: clamp(6px, 15 / var(--item-w-unit) * var(--item-w), 15px)
}

.tintuc-date {
    font: 400 clamp(10px, 13 / var(--item-w-unit) * var(--item-w), 13px)/1.1538461538 var(--font-family);
    color: #767676;
    margin-bottom: 1.3076923077em
}

.tintuc-date img {
    width: 1.5384615385em !important;
    height: 1.5384615385em !important
}

.tintuc-title {
    font: 700 clamp(13px, 15 / var(--item-w-unit) * var(--item-w), 15px)/1.53333 var(--font-family);
    color: #1f1f1f;
    margin-bottom: .7333333333em
}

.tintuc-desc {
    font: 400 clamp(12px, 14 / var(--item-w-unit) * var(--item-w), 14px)/1.64286 var(--font-family);
    color: #555
}

.wrap-doitac {
    border-top: 1px dashed #ffc300;
    padding-block: clamp(24px, 60 / var(--max-w-unit) * var(--max-w), 60px)
}

#lxf{
    max-width: 300px;
    width: 100%;
    margin: 0 auto;
}