:root {
  --w-container-header: clamp(400px, calc(1540 * 100vw / 1920), 1540px);
  --w-container: clamp(400px, calc(1540 * 100vw / 1920), 1540px);
  --w-container-2: clamp(400px, calc(1159 * 100vw / 1920), 1159px);
  --w-container-news: 995px;
  --size-section: clamp(20px, calc(80 * 100vw / 1920), 80px);
  --size-section-module: clamp(25px, calc(50 * 100vw / 1920), 50px);
  --gap-section: clamp(15px, calc(80 * 100vw / 1920), 80px);
  --gap-item: clamp(15px, calc(20 * 100vw / 1920), 20px);
  --fs-text: clamp(14px, calc(16 * 100vw / 1920), 16px);
  --fs-subtitle-slide: clamp(18px, calc(26 * 100vw / 1920), 26px);
  --fs-title-slide: clamp(32px, calc(110.1 * 100vw / 1920), 110.1px);
  --fs-number: clamp(28px, calc(71.1 * 100vw / 1920), 71.1px);
  --fs-title-name: clamp(16px, calc(20 * 100vw / 1920), 20px);
  --fs-sub-title: clamp(18px, calc(22 * 100vw / 1920), 22px);
  --fs-title: clamp(24px, calc(56 * 100vw / 1920), 56px);
  --fs-module-tab: clamp(14px, calc(18 * 100vw / 1920), 18px);
  --fs-number-prd: clamp(20px, calc(33 * 100vw / 1920), 33px);
  --fs-number-contribute: clamp(28px, calc(44.1 * 100vw / 1920), 44.1px);
  --fs-title-name-prd: clamp(18px, calc(24 * 100vw / 1920), 24px);
  --fs-title-slide-2: clamp(32px, calc(87.1 * 100vw / 1920), 87.1px);
  --fs-title-giatri: clamp(20px, calc(28 * 100vw / 1920), 28px);
  --fs-title-detail: clamp(20px, calc(26 * 100vw / 1920), 26px);
  --fs-tskt: clamp(18px, calc(23 * 100vw / 1920), 23px);
  --fs-number-bao-hanh: clamp(24px, calc(34 * 100vw / 1920), 34px);
}

@media screen and (max-width: 568px) {
  :root {
    --w-container-header: 100%;
    --w-container: 100%;
    --w-container-2: 100%;
  }
}
@font-face {
  font-family: "Inter-Regular";
  src: url("../fonts/Inter_18pt-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter-Semibold";
  src: url("../fonts/Inter_18pt-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter-Bold";
  src: url("../fonts/Inter_18pt-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter-Medium";
  src: url("../fonts/Inter_18pt-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter-ExtraBold";
  src: url("../fonts/Inter_18pt-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "CormorantGaramond-Bold";
  src: url("../fonts/CormorantGaramond-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@keyframes scrolldown {
  0% {
    top: 4px;
    opacity: 0;
  }
  50% {
    opacity: 1;
    top: calc(50% - 2px);
  }
  100% {
    opacity: 0;
    top: calc(100% - 4px);
  }
}
html {
  scroll-behavior: smooth;
}

body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeSpeed;
}

.load {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: none;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  z-index: 201;
}
.load svg {
  z-index: 2;
  position: relative;
}
.load:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1;
}
.load.show {
  display: flex !important;
}

.pad-section {
  padding: var(--size-section) 0;
}

.padtop-section {
  padding-top: var(--size-section);
}

.padbot-section {
  padding-bottom: var(--size-section);
}

.pad-module {
  padding: var(--size-section-module) 0;
}

.padtop-module {
  padding-top: var(--size-section-module);
}

.padbot-module {
  padding-bottom: var(--size-section-module);
}

.container {
  padding-left: 15px;
  padding-right: 15px;
  width: var(--w-container);
  margin: auto;
}
.container.container-2 {
  width: var(--w-container-2);
}

.container-news {
  padding-left: 15px;
  padding-right: 15px;
  width: var(--w-container-news);
  margin: auto;
  max-width: 100%;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Inter-Regular", sans-serif;
  font-size: var(--fs-text);
  font-weight: 400;
  line-height: 1.4;
}

.hide-pc {
  display: none;
}
@media (max-width: 991px) {
  .hide-pc {
    display: block;
  }
}

.no-border {
  border: none !important;
}

.no-margin {
  margin: 0px !important;
}

.pad-top {
  padding-top: 50px;
}
@media (max-width: 767px) {
  .pad-top {
    padding-top: 15px;
  }
}

.no-pad-y {
  padding-top: 0px;
  padding-bottom: 0px;
}

body {
  font-size: var(--fs-text);
  color: #383934;
  line-height: 1.5;
  top: 0 !important;
  font-weight: 400;
  max-width: 100vw;
  width: 100vw;
  overflow-x: hidden;
  font-family: "Inter-Regular", sans-serif;
}
body font {
  font-family: "Inter-Regular", sans-serif;
  font-weight: 400;
  font-size: var(--fs-text);
}
body.no-scroll, body.disable {
  overflow: hidden;
}

a {
  margin: 0px;
  padding: 0px;
  text-decoration: none;
  color: #383934;
  display: flex;
  align-items: center;
}
a:hover {
  color: #DE9F38;
}

button {
  cursor: pointer;
}

img {
  width: auto;
  max-width: 100%;
  height: auto;
  transition: transform 0.3s linear;
}

.img {
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.img.hover:hover img {
  transform: scale(1.05);
}

@media (max-width: 767px) {
  .menu-bottom-mb {
    position: sticky;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    height: 55px;
    gap: 15px;
    justify-content: center;
    background-color: rgb(255, 255, 255);
    border-top: 3px solid #DE9F38;
    padding: 0 20px;
    z-index: 99;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  }
  .menu-bottom-mb img {
    height: 25px;
    width: initial;
    object-fit: contain;
  }
  .menu-bottom-mb .item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border-radius: 35px;
    border: 1px solid #DE9F38;
    background: #fff;
    box-shadow: 0 0 10px -5px #383934;
  }
  .menu-bottom-mb .item svg {
    width: 25px;
    height: 25px;
  }
  .menu-bottom-mb .item.fb svg {
    fill: #DE9F38;
  }
  .menu-bottom-mb .item.yt svg {
    fill: #DE9F38;
  }
  .menu-bottom-mb .item.phone svg {
    fill: #DE9F38;
  }
  .menu-bottom-mb .item.mess svg {
    fill: #DE9F38;
  }
  .menu-bottom-mb .item.zalo {
    background: #DE9F38;
  }
  .menu-bottom-mb .item.language {
    font-weight: 700;
    font-size: 16px;
    color: #DE9F38;
  }
  .menu-bottom-mb .item.scroll-top svg path {
    fill: #DE9F38;
  }
}
.load.text-center {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  z-index: 201;
}
.load.text-center.show {
  display: flex;
}
.load.text-center:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1;
}
.load.text-center p {
  color: rgb(255, 255, 255);
  z-index: 2;
}
.load.text-center img {
  z-index: 2;
  width: 100px;
}

.w-full {
  width: 100% !important;
}

.text-center {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

strong {
  font-family: "Inter-Bold", sans-serif;
  font-weight: 700;
}
strong font {
  font-family: "Inter-Bold", sans-serif;
  font-weight: 700;
}

form input.error,
form textarea.error,
form select.error {
  border: 1px solid red !important;
}
form label.error {
  display: none !important;
}

input,
button,
textarea,
select {
  outline: none;
  border: 0;
  padding: 0;
  margin: 0;
  background-color: transparent;
  font-weight: 400;
}

.alrt-popup {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 999;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  opacity: 0;
}
.alrt-popup.show {
  opacity: 1;
  pointer-events: all;
}
.alrt-popup .wapper {
  background: rgb(255, 255, 255);
  width: 320px;
  border-radius: 10px;
  overflow: hidden;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.alrt-popup .wapper .main {
  padding: 15px;
  text-align: center;
}
.alrt-popup .wapper .title {
  background: #bf2929;
  color: rgb(255, 255, 255);
  text-align: center;
  font-weight: 400;
  padding: 15px 10px;
  margin-bottom: 0;
}
.alrt-popup .wapper .close-alrt {
  text-align: center;
  margin: 0 auto 10px auto;
  border: 2px solid #bf2929;
  padding: 5px 15px;
  cursor: pointer;
  width: 205px;
  height: 38px;
  border-radius: 20px;
  color: #bf2929;
  display: flex;
  align-items: center;
  justify-content: center;
}
.alrt-popup.success .wapper .title {
  background: #09e493;
}
.alrt-popup.success .wapper .close-alrt {
  display: none;
}

.overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 20;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.8);
  pointer-events: none;
  opacity: 0;
  transition: all 0.5s ease;
}
.overlay.show {
  opacity: 1;
  pointer-events: all;
  display: flex !important;
}
.overlay.show1 {
  z-index: 999;
  opacity: 1;
  pointer-events: all;
  display: flex !important;
}

.py-block {
  padding-top: var(--size-section);
  padding-bottom: var(--size-section);
}

.py-section {
  padding-top: var(--size-section-module);
  padding-bottom: var(--size-section-module);
}

.pb-section {
  padding-bottom: var(--size-section-module);
}

.pt-section {
  padding-top: var(--size-section-module);
}

.pb-block {
  padding-bottom: var(--size-section);
}

.pt-block {
  padding-top: var(--size-section);
}

.my-block {
  margin: var(--size-section) 0;
}

.mb-block {
  margin-bottom: var(--size-section);
}

.mt-block {
  margin-top: var(--size-section);
}

.grecaptcha-badge {
  display: none !important;
}

#notfound {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 40px;
  padding-bottom: 40px;
}
#notfound .notfound {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
#notfound .notfound .notfound-404 {
  text-align: center;
  color: #DE9F38;
  font-size: 100px;
}
#notfound .notfound h1 {
  line-height: 1;
}
#notfound .notfound h2,
#notfound .notfound p,
#notfound .notfound a {
  text-align: center;
}
#notfound .notfound h2 {
  color: #DE9F38;
  font-size: 32px;
  margin-bottom: 20px;
}
#notfound .notfound p {
  margin-bottom: 30px;
}
#notfound .notfound a {
  font-size: var(--fs-text);
  color: rgb(255, 255, 255);
  background-color: #DE9F38;
  padding: 10px 15px;
  border-radius: 5px;
  transition: background 0.5s linear;
  border: 1px solid #DE9F38;
  max-width: 250px;
}
#notfound .notfound a:hover {
  background-color: rgb(255, 255, 255);
  color: #DE9F38;
}
@media (max-width: 767px) {
  #notfound .notfound .notfound-404 {
    font-size: 50px;
  }
  #notfound .notfound h2 {
    font-size: 16px;
    margin-bottom: 15px;
  }
  #notfound .notfound p,
  #notfound .notfound a {
    font-size: 14px;
  }
}

.update.center {
  text-align: center;
}

.detail-ser h1 {
  color: #383934;
  font-size: 20px;
}
.detail-ser .title-module {
  padding: 0;
  margin-bottom: 0;
}
.detail-ser .result-search .item {
  padding: 20px 0;
  border-bottom: 1px solid #c8c8c8;
  display: flex;
  align-items: center;
}
.detail-ser .result-search .item .img {
  width: 15%;
  aspect-ratio: 16/10;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #c8c8c8;
  background: #fff;
}
.detail-ser .result-search .item .img img {
  object-fit: contain;
}
.detail-ser .result-search .item .right {
  width: 85%;
  padding-left: 15px;
}
.detail-ser .result-search .item:last-child {
  border-bottom: 0;
}
.detail-ser .result-search .item .module {
  color: rgb(255, 255, 255);
  background-color: #DE9F38;
  padding: 2px 10px;
  border-radius: 5px;
  margin-right: 10px;
  white-space: nowrap;
  font-size: 14px;
  height: 25px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.detail-ser .result-search .item h3 a {
  font-weight: 700;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
}
.detail-ser .result-search .item h3:hover a {
  color: #DE9F38;
}
.detail-ser .result-search .item .time {
  font-size: 16px;
  color: #DE9F38;
  font-style: italic;
  margin: 10px 0;
  display: flex;
  align-items: center;
}
.detail-ser .result-search .item .time svg {
  margin-right: 10px;
  fill: #DE9F38;
}
.detail-ser .result-search .item ._desc {
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
}
.detail-ser .result-search .item ._desc p {
  line-height: 1.3;
}
@media (max-width: 767px) {
  .detail-ser .result-search .item {
    flex-direction: column;
  }
  .detail-ser .result-search .item .img {
    width: 100%;
    aspect-ratio: 16/9;
    margin-bottom: 15px;
  }
  .detail-ser .result-search .item .right {
    padding: 0;
    width: 100%;
  }
}

.social-fixed {
  position: fixed;
  bottom: 15px;
  right: 15px;
  z-index: 20;
}
.social-fixed .mess {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  background: #DE9F38;
  border-radius: 30px;
  padding: 5px 20px;
}
.social-fixed .mess span {
  font-family: "Inter-Semibold", sans-serif;
  font-size: var(--fs-text);
  color: rgb(255, 255, 255);
  text-transform: uppercase;
}

.timeout {
  text-align: center;
  padding: 5px 0;
}

.popup-video {
  display: none;
}

.detail-content h2,
.detail-content h3,
.detail-content h4,
.detail-content h5,
.detail-content h6 {
  margin-bottom: 15px;
  line-height: 1.5;
  color: #383934;
}
@media (max-width: 767px) {
  .detail-content h2,
  .detail-content h3,
  .detail-content h4,
  .detail-content h5,
  .detail-content h6 {
    margin-bottom: 15px;
  }
}
.detail-content h2,
.detail-content h3,
.detail-content h4 {
  font-weight: 700;
}
.detail-content h2 font,
.detail-content h3 font,
.detail-content h4 font {
  font-weight: 700;
}
.detail-content h2 {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.4;
}
.detail-content h2 font {
  font-size: 20px;
}
.detail-content h3 {
  font-size: clamp(16px, 0.9375vw, 18px);
  font-family: "Inter-Semibold", sans-serif;
  line-height: 1.4;
}
.detail-content h3 font, .detail-content h3 span {
  font-size: clamp(16px, 0.9375vw, 18px);
  font-family: "Inter-Semibold", sans-serif;
}
.detail-content h4 {
  font-size: clamp(15px, 0.9375vw, 16px);
  font-family: "Inter-Semibold", sans-serif;
  line-height: 38px;
}
.detail-content h4 strong {
  font-size: clamp(15px, 0.9375vw, 16px);
  font-family: "Inter-Semibold", sans-serif;
  line-height: 38px;
}
.detail-content h4 font, .detail-content h4 span {
  font-size: var(--fs-text);
  font-weight: 700;
}
.detail-content h5 {
  font-size: 14px;
  font-weight: 700;
  line-height: 38px;
}
.detail-content h5 strong {
  font-size: 14px;
  font-weight: 700;
  line-height: 38px;
}
.detail-content h5 font, .detail-content h5 span {
  font-size: 14px;
  font-weight: 700;
}
@media (max-width: 767px) {
  .detail-content h5 {
    font-size: 14px;
  }
  .detail-content h5 font, .detail-content h5 span {
    font-size: 14px;
  }
}
.detail-content .title-item-about {
  font-size: 30px;
  color: #DE9F38;
  margin-bottom: 20px;
}
.detail-content .title-item-about font {
  font-size: 30px;
}
@media (max-width: 767px) {
  .detail-content .title-item-about {
    margin-bottom: 15px;
    font-size: 20px;
  }
  .detail-content .title-item-about font {
    font-size: 20px;
  }
}
.detail-content .description p {
  font-family: "Inter-Regular", sans-serif;
  font-weight: 400;
  font-size: var(--fs-text);
}
.detail-content p {
  line-height: 1.5;
  margin-bottom: 15px;
  font-size: var(--fs-text);
}
.detail-content p:last-child {
  margin-bottom: 0;
}
@media (max-width: 767px) {
  .detail-content p {
    margin-bottom: 15px;
  }
}
.detail-content strong {
  font-size: var(--fs-text);
}
.detail-content strong font, .detail-content strong span {
  font-weight: 700;
}
.detail-content figure {
  margin-bottom: 15px;
}
@media (max-width: 767px) {
  .detail-content figure {
    margin-bottom: 10px;
  }
}
.detail-content figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.detail-content figure figcaption {
  text-align: center;
  padding: 5px 15px;
  font-size: var(--fs-text-min);
  font-weight: 600;
  font-style: italic;
}
.detail-content figure figcaption font {
  font-size: var(--fs-text-min);
  font-weight: 600;
  font-style: italic;
}
.detail-content figure figcaption {
  font-style: italic;
}
.detail-content ul,
.detail-content ol {
  margin-bottom: 15px;
  padding-left: 25px;
}
.detail-content ul li,
.detail-content ol li {
  padding-bottom: 5px;
  line-height: 1.5;
  font-size: var(--fs-text);
  color: #383934;
}
.detail-content ul li:last-child,
.detail-content ol li:last-child {
  padding-bottom: 0;
}
.detail-content ul li::marker,
.detail-content ol li::marker {
  color: #383934;
}
.detail-content ul {
  list-style-type: disc;
}
.detail-content ul li {
  list-style-type: disc;
  font-size: var(--fs-text);
  color: #383934;
}
.detail-content ul ul {
  list-style-type: circle;
}
.detail-content ul ul li {
  list-style-type: circle;
}
.detail-content ol {
  list-style-type: decimal;
}
.detail-content ol li {
  list-style-type: decimal;
}
.detail-content .image-center {
  display: flex;
  justify-content: center;
  margin: 0 auto 15px;
}
.detail-content .image-center img {
  margin: auto;
  height: initial;
  object-fit: initial;
}
.detail-content .image-left {
  float: left;
}
.detail-content .image-left img {
  margin: auto;
  height: initial;
  object-fit: initial;
}
.detail-content .image-right {
  float: right;
  margin-bottom: 15px;
}
.detail-content .image-right img {
  margin: auto;
  height: initial;
  object-fit: initial;
}
.detail-content a {
  text-decoration: underline;
}
.detail-content a:hover {
  color: #DE9F38;
}
.detail-content a.more {
  text-decoration: none;
  color: #fff;
  margin: auto;
  margin-bottom: 30px;
}
@media (max-width: 767px) {
  .detail-content a.more {
    margin-bottom: 15px;
  }
}
.detail-content table {
  margin-bottom: 15px;
  width: 100%;
  border: none;
}
.detail-content table thead th {
  font-weight: 700;
  font-size: var(--fs-text);
  background: #DE9F38;
  color: #fff;
  border: 1px solid #DE9F38;
  padding: 10px;
}
.detail-content table thead th:nth-of-type(1) {
  border-radius: 6px 0 0 6px;
}
.detail-content table thead th:last-child {
  border-radius: 0 6px 6px 0;
}
.detail-content table tbody tr th {
  line-height: 1;
  font-weight: 400;
  font-size: var(--fs-text);
  color: #383934;
  border: none;
  background: #CEE5DA;
  font-weight: 700;
  white-space: nowrap;
}
.detail-content table tbody tr th,
.detail-content table tbody tr td {
  font-size: var(--fs-text);
  line-height: 1.5;
  padding: 15px;
  border: none;
  border-radius: 6px;
  border: 1px solid #fff;
}
.detail-content table tbody tr td {
  background: #F6F6F6;
}
.detail-content table.table {
  width: 100%;
  border: none;
}
.detail-content table.table thead th {
  font-weight: 700;
  font-size: var(--fs-text);
  background: #DE9F38;
  color: #fff;
  border: 1px solid #DE9F38;
  padding: 10px;
}
.detail-content table.table thead th:nth-of-type(1) {
  border-radius: 6px 0 0 6px;
}
.detail-content table.table thead th:last-child {
  border-radius: 0 6px 6px 0;
}
.detail-content table.table tbody tr th {
  line-height: 1;
  font-weight: 400;
  font-size: var(--fs-text);
  color: #383934;
  border: none;
  background: #CEE5DA;
  font-weight: 700;
  white-space: nowrap;
}
.detail-content table.table tbody tr th,
.detail-content table.table tbody tr td {
  font-size: var(--fs-text);
  line-height: 1.5;
  padding: 15px;
  border: none;
  border-radius: 6px;
  border: 1px solid #fff;
}
.detail-content table.table tbody tr td {
  background: #F6F6F6;
}
.detail-content table.table2 {
  width: 100%;
  border: none;
}
.detail-content table.table2 thead th {
  font-weight: 700;
  font-size: var(--fs-text);
  background: #DE9F38;
  color: #fff;
  border: 1px solid rgb(255, 255, 255);
  padding: 10px;
  border-radius: 6px;
}
.detail-content table.table2 tbody tr th {
  line-height: 1;
  font-weight: 400;
  font-size: var(--fs-text);
  color: #383934;
  border: none;
  background: #CEE5DA;
  font-weight: 700;
  white-space: nowrap;
}
.detail-content table.table2 tbody tr th,
.detail-content table.table2 tbody tr td {
  font-size: var(--fs-text);
  line-height: 1.5;
  padding: 15px;
  border: none;
  border-radius: 6px;
  border: 1px solid #fff;
}
.detail-content table.table2 tbody tr td {
  background: #E4F4EC;
}
.detail-content iframe {
  max-width: 100%;
}
.detail-content .iframe_video {
  margin-bottom: 15px;
}
.detail-content .iframe_video iframe,
.detail-content .iframe_video video {
  width: 100%;
  height: 100%;
}

.page {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-top: var(--size-section-module);
  width: 100%;
}
.page span,
.page a,
.page div {
  width: 37px;
  height: 37px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 37px;
  overflow: hidden;
  border: 1px solid #D8DEE6;
  position: relative;
  font-size: var(--fs-text);
  color: #383934;
}
.page span:hover, .page span.active-page,
.page a:hover,
.page a.active-page,
.page div:hover,
.page div.active-page {
  color: #DE9F38;
  border-color: #DE9F38;
}
.page span:hover svg path, .page span.active-page svg path,
.page a:hover svg path,
.page a.active-page svg path,
.page div:hover svg path,
.page div.active-page svg path {
  stroke: #DE9F38;
}
.page span.disabled,
.page a.disabled,
.page div.disabled {
  opacity: 0.5;
  pointer-events: none;
  cursor: not-allowed;
}
.page svg path {
  stroke: #D8DEE6;
}
.page .prev,
.page .next {
  width: 37px;
  height: 37px;
  background: rgb(255, 255, 255);
}

.popup-video {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s linear;
}
.popup-video .overlay-popup-video {
  position: absolute;
  z-index: 11;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
}
.popup-video .wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 12;
  width: 70%;
  aspect-ratio: 16/9;
}
.popup-video .wrapper .icon-close {
  position: absolute;
  right: -40px;
  top: -40px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: #DE9F38;
  border-radius: 50%;
}
@media (max-width: 767px) {
  .popup-video .wrapper .icon-close {
    right: calc((100% - 40px) / 2);
    top: initial;
    bottom: -50px;
  }
}
.popup-video .wrapper .icon-close svg {
  fill: rgb(255, 255, 255);
}
.popup-video .wrapper iframe,
.popup-video .wrapper video,
.popup-video .wrapper .video {
  width: 100%;
  height: 100%;
  display: block;
}
.popup-video.active {
  opacity: 1;
  pointer-events: all;
}
@media (max-width: 767px) {
  .popup-video .wrapper {
    width: 100%;
  }
}

.popup-index {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s linear;
}
.popup-index .overlay-popup-index {
  position: absolute;
  z-index: 11;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
}
.popup-index .wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 12;
  max-width: 70%;
  aspect-ratio: 16/9;
}
.popup-index .wrapper.has-video {
  width: 70%;
  max-width: 100%;
}
@media (max-width: 767px) {
  .popup-index .wrapper.has-video {
    width: calc(100% - 30px);
    max-width: 100%;
  }
}
.popup-index .wrapper .exit-popup {
  position: absolute;
  right: -40px;
  top: -40px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: #DE9F38;
  border-radius: 50%;
}
@media (max-width: 767px) {
  .popup-index .wrapper .exit-popup {
    right: calc((100% - 40px) / 2);
    top: initial;
    bottom: -50px;
  }
}
.popup-index .wrapper .exit-popup svg {
  fill: rgb(255, 255, 255);
}
.popup-index .wrapper iframe,
.popup-index .wrapper video,
.popup-index .wrapper .video {
  width: 100%;
  height: 100%;
  display: block;
}
.popup-index.active {
  opacity: 1;
  pointer-events: all;
}
@media (max-width: 767px) {
  .popup-index .wrapper {
    width: 100%;
  }
}

.card-news {
  display: flex;
  flex-direction: column;
  border-radius: 20px;
  border: 1px solid #E2DFD5;
  background: #FFF;
}
.card-news .img {
  aspect-ratio: 479/295;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 20px 20px 0 0;
}
.card-news .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.card-news .info {
  padding: 20px 25px;
}
@media (max-width: 767px) {
  .card-news .info {
    padding: 10px;
  }
}
.card-news .info span {
  color: #838383;
  font-family: "Inter-Regular", sans-serif;
  font-size: var(--fs-text);
  text-transform: lowercase;
  margin-bottom: 15px;
  display: inline-flex;
}
@media (max-width: 767px) {
  .card-news .info span {
    margin-bottom: 10px;
  }
}
.card-news .info .title-name {
  color: #383934;
  font-family: "Inter-Semibold", sans-serif;
  font-size: var(--fs-module-tab);
  margin-bottom: 15px;
}
.card-news .info .title-name font {
  color: #383934;
  font-family: "Inter-Semibold", sans-serif;
  font-size: var(--fs-module-tab);
}
.card-news .info .title-name a {
  color: #383934;
  font-family: "Inter-Semibold", sans-serif;
  font-size: var(--fs-module-tab);
}
.card-news .info .title-name a font {
  color: #383934;
  font-family: "Inter-Semibold", sans-serif;
  font-size: var(--fs-module-tab);
}
@media (max-width: 767px) {
  .card-news .info .title-name {
    margin-bottom: 10px;
  }
}
.card-news .info .flex-btn {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
}
.card-news .info .flex-btn .view {
  width: 41px;
  height: 41px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border-radius: 25px;
  border: 1px solid #DE9F38;
}
.card-news .info .flex-btn .view svg path {
  fill: #DE9F38;
}
.card-news:hover {
  border-color: #DE9F38;
}
.card-news:hover img {
  transform: scale(1.1);
}
.card-news:hover .info .title-name {
  color: #DE9F38;
}
.card-news:hover .info .title-name a {
  color: #DE9F38;
}
.card-news:hover .view {
  background: #DE9F38 !important;
}
.card-news:hover .view svg path {
  fill: rgb(255, 255, 255) !important;
}
.card-news.card-gallery {
  border: none;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.1);
}
.card-news.card-gallery .info .title-name {
  margin-bottom: 0;
}
.card-news.card-video {
  border: none;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.1);
}
.card-news.card-video .img {
  position: relative;
}
.card-news.card-video .img > svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  filter: grayscale(100);
  -moz-filter: grayscale(100);
  -webkit-filter: grayscale(100);
}
.card-news.card-video .info .title-name {
  margin-bottom: 0;
}
.card-news.card-video:hover .img > svg {
  filter: grayscale(0);
  -moz-filter: grayscale(0);
  -webkit-filter: grayscale(0);
}

.news-flex {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--gap-item);
}
.news-flex.flex-3-rows .card-news {
  width: calc((100% - var(--gap-item) * 2) / 3);
}
@media (max-width: 990px) {
  .news-flex.flex-3-rows .card-news {
    width: calc((100% - var(--gap-item)) / 2);
  }
}
@media (max-width: 767px) {
  .news-flex.flex-3-rows .card-news {
    width: 100%;
  }
}
@media (max-width: 767px) {
  .news-flex {
    flex-direction: column;
  }
}

.card-catalogue {
  border-radius: 12px;
  border: 1px solid #DBDBDB;
  background: #FFFEFE;
  padding: 20px;
  display: flex;
  flex-direction: column;
}
.card-catalogue .img {
  aspect-ratio: 291/406;
  overflow: hidden;
}
.card-catalogue .title-name {
  color: #383934;
  font-family: "Inter-Semibold", sans-serif;
  font-size: var(--gap-item);
  padding: var(--gap-item) 0;
}
.card-catalogue .title-name a {
  color: #383934;
  font-family: "Inter-Semibold", sans-serif;
  font-size: var(--gap-item);
  display: block;
  text-align: center;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  min-height: 42px;
}
.card-catalogue .flex-btn {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  gap: 15px;
}
@media (max-width: 767px) {
  .card-catalogue .flex-btn {
    gap: 10px;
    flex-direction: column;
  }
}
.card-catalogue .flex-btn > * {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: #383934;
  font-family: "Inter-Semibold", sans-serif;
  height: 45px;
  width: calc((100% - 15px) / 2);
  border-radius: 6px;
  transition: background 0.5s ease;
}
.card-catalogue .flex-btn > * span {
  font-family: "Inter-Semibold", sans-serif;
}
@media (max-width: 767px) {
  .card-catalogue .flex-btn > * {
    width: 100%;
    font-family: "Inter-Regular", sans-serif;
    font-weight: 400;
    text-transform: initial;
  }
  .card-catalogue .flex-btn > * span {
    font-family: "Inter-Regular", sans-serif;
    font-weight: 400;
    text-transform: initial;
  }
}
.card-catalogue:hover .title-name {
  color: #DE9F38;
}
@media (max-width: 1600px) {
  .card-catalogue {
    padding: 20px;
  }
}
@media (max-width: 767px) {
  .card-catalogue {
    padding: 10px;
  }
}

.flex-4-rows {
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap-item);
}
.flex-4-rows > * {
  width: calc((100% - var(--gap-item) * 3) / 4);
}
@media (max-width: 767px) {
  .flex-4-rows > * {
    width: calc((100% - var(--gap-item)) / 2);
  }
}

.flex-info-agency {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(15px, 5.2083333333vw, 100px);
  padding-top: calc(var(--size-section-module) - 30px);
}
.flex-info-agency .item {
  display: flex;
  gap: 10px;
  align-items: center;
}
.flex-info-agency .item p:first-child {
  font-size: clamp(20px, 2.6041666667vw, 50px);
  font-family: "Inter-Bold", sans-serif;
  line-height: 1;
  color: #DE9F38;
}
.flex-info-agency .item p:first-child sup {
  font-size: clamp(20px, 2.6041666667vw, 50px);
  font-family: "Inter-Bold", sans-serif;
  line-height: 1;
}

.map-location {
  width: calc(100% - var(--gap-item) * 2);
  margin: auto;
  display: flex;
  gap: var(--gap-item);
}
@media (max-width: 767px) {
  .map-location {
    flex-direction: column;
  }
}
.map-location > * {
  border-radius: 20px;
  background: radial-gradient(50% 50% at 50% 50%, #FFF 0%, #F2F2F2 100%);
  padding: var(--gap-item);
  display: flex;
  flex-direction: column;
  gap: 15px;
  align-items: center;
  justify-content: center;
}
.map-location > * .title-map {
  font-size: clamp(15px, 0.9375vw, 18px);
  font-family: "Inter-Semibold", sans-serif;
  line-height: 1.4;
}
.map-location > * .title-map font {
  font-size: clamp(15px, 0.9375vw, 18px);
  font-family: "Inter-Semibold", sans-serif;
}
.map-location .map-global {
  width: calc(64.5% - var(--gap-item));
}
@media (max-width: 767px) {
  .map-location .map-global {
    width: 100%;
  }
}
.map-location .map-vietnam {
  width: 35.5%;
}
@media (max-width: 767px) {
  .map-location .map-vietnam {
    width: 100%;
  }
}

.distribution-system .detail-content {
  margin-bottom: 20px;
}
@media (max-width: 767px) {
  .distribution-system .detail-content {
    margin-bottom: 15px;
  }
  .distribution-system .detail-content br {
    display: none;
  }
}
.distribution-system .detail-content p:last-child, .distribution-system .detail-content ul:last-child, .distribution-system .detail-content ol:last-child {
  margin-bottom: 0;
}

.filter-system {
  margin-bottom: clamp(35px, 2.6041666667vw, 50px);
}
@media (max-width: 767px) {
  .filter-system {
    margin-bottom: 15px;
  }
}
.filter-system form {
  display: flex;
  gap: 15px;
  width: 100%;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (max-width: 767px) {
  .filter-system form {
    gap: 10px;
    flex-wrap: wrap;
  }
}
.filter-system.lookup-order {
  border-radius: 8px;
  background: #FFF;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.15);
  padding: 15px;
}
.filter-system.lookup-order form {
  gap: 15px;
}
.filter-system .input, .filter-system .select {
  width: calc((100% - 190px) / 3);
  position: relative;
}
@media (max-width: 767px) {
  .filter-system .input, .filter-system .select {
    width: 100%;
  }
}
.filter-system .input .icon, .filter-system .select .icon {
  position: absolute;
  top: 12px;
  left: 17px;
}
@media (max-width: 767px) {
  .filter-system .input .icon, .filter-system .select .icon {
    top: 15px;
    left: 10px;
  }
  .filter-system .input .icon svg, .filter-system .select .icon svg {
    height: 14px;
  }
}
.filter-system .input > svg, .filter-system .select > svg {
  position: absolute;
  top: 20px;
  right: 20px;
}
@media (max-width: 767px) {
  .filter-system .input > svg, .filter-system .select > svg {
    display: none;
  }
}
.filter-system .input input, .filter-system .input select, .filter-system .select input, .filter-system .select select {
  width: 100%;
  border-radius: 8px;
  border: 1px solid #D8DEE6;
  appearance: none;
  background: #F9FAFB;
  height: 52px;
  padding-left: 50px;
  color: #838383;
}
@media (max-width: 767px) {
  .filter-system .input input, .filter-system .input select, .filter-system .select input, .filter-system .select select {
    padding-left: 38px;
  }
}
.filter-system .input input::placeholder, .filter-system .input select::placeholder, .filter-system .select input::placeholder, .filter-system .select select::placeholder {
  color: #838383;
}
@media (max-width: 767px) {
  .filter-system .input input, .filter-system .input select, .filter-system .select input, .filter-system .select select {
    height: 45px;
  }
}
.filter-system .input select, .filter-system .select select {
  cursor: pointer;
}
@media (max-width: 767px) {
  .filter-system .select {
    width: calc((100% - 10px) / 2);
  }
}
.filter-system .button {
  width: 145px;
  height: 52px;
  overflow: hidden;
}
@media (max-width: 767px) {
  .filter-system .button {
    width: 100%;
    height: 45px;
  }
}
.filter-system .button button {
  width: 100%;
  height: 100%;
  padding: 0 10px;
  border-radius: 8px;
}
@media (max-width: 767px) {
  .filter-system .button button {
    height: 45px !important;
  }
}

.flex-system {
  border-radius: 12px;
  background: #FFF;
  box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.15);
  overflow: hidden;
  padding: var(--gap-item);
  gap: var(--gap-item);
  display: flex;
  align-items: start;
  flex-wrap: wrap;
}
.flex-system .left-system {
  width: 32.4%;
}
@media (max-width: 767px) {
  .flex-system .left-system {
    width: 100%;
  }
}
.flex-system .left-system .title-system {
  height: 46px;
  border-radius: 8px;
  overflow: hidden;
  background: #DE9F38;
  display: flex;
  align-items: center;
  justify-content: center;
  text-transform: uppercase;
  font-size: var(--fs-item-news);
  color: #fff;
  font-weight: 700;
  margin-bottom: 15px;
}
.flex-system .left-system .list-system {
  max-height: 681px;
  overflow-y: auto;
}
@media (max-width: 767px) {
  .flex-system .left-system .list-system {
    max-height: 273px;
  }
}
.flex-system .left-system .list-system::-webkit-scrollbar {
  width: 2px;
}
.flex-system .left-system .list-system::-webkit-scrollbar-thumb {
  background: #AFAFAF;
}
.flex-system .left-system .item-system {
  cursor: pointer;
}
.flex-system .left-system .item-system:hover, .flex-system .left-system .item-system.active {
  background: #F6F6F6;
}
.flex-system .left-system .item-system:not(.hidden) {
  padding: var(--gap-item);
  border-bottom: 1px solid #D8DEE6;
}
.flex-system .left-system .item-system:not(.hidden):last-child {
  border-bottom: none;
}
.flex-system .left-system .item-system .infor h3 {
  font-size: var(--fs-text);
  text-transform: uppercase;
  color: #57585B;
  font-family: "Inter-Semibold", sans-serif;
  margin-bottom: 15px;
}
.flex-system .left-system .item-system .infor h3 font {
  font-size: var(--fs-text);
  text-transform: uppercase;
  color: #57585B;
  font-family: "Inter-Semibold", sans-serif;
}
.flex-system .left-system .item-system .infor ul {
  padding-left: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.flex-system .left-system .item-system .infor ul li {
  list-style: none;
  position: relative;
  padding-left: 27px;
}
.flex-system .left-system .item-system .infor ul li > svg {
  position: absolute;
  left: 0;
  top: 5px;
}
.flex-system .left-system .item-system:hover .infor h3 {
  color: #DE9F38;
}
.flex-system .left-system .item-system .view-map {
  display: inline-flex;
  padding-left: 20px;
  margin-top: 10px;
  align-items: center;
  gap: 10px;
  color: #DE9F38;
  cursor: pointer;
}
.flex-system .left-system .item-system .view-map:hover {
  color: #DE9F38;
}
.flex-system .left-system .item-system .view-map:hover svg path {
  fill: #DE9F38;
}
.flex-system .right-system {
  width: calc(67.6% - var(--gap-item));
}
@media (max-width: 767px) {
  .flex-system .right-system {
    width: 100%;
  }
}
.flex-system .right-system .list-map {
  aspect-ratio: 975/681;
  overflow: hidden;
  border-radius: 8px;
}
.flex-system .right-system .list-map .imap {
  width: 100%;
  height: 100%;
}
.flex-system .right-system .list-map .imap iframe {
  width: 100%;
  height: 100%;
}

.form-agency {
  width: 900px;
  margin: auto;
}
@media (max-width: 767px) {
  .form-agency {
    width: 100%;
  }
}
.form-agency form {
  display: flex;
  gap: var(--gap-item);
  flex-wrap: wrap;
}
.form-agency form .icon {
  position: absolute;
  left: 0;
  top: 0;
  width: 50px;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.form-agency form .form-input {
  width: 100%;
  position: relative;
}
.form-agency form .form-input.half {
  width: calc((100% - var(--fs-title-name)) / 2);
}
@media (max-width: 767px) {
  .form-agency form .form-input.half {
    width: 100%;
  }
}
.form-agency form .form-textarea {
  width: 100%;
  position: relative;
}
.form-agency form textarea {
  border: 1px solid #D8DEE6;
  background: #fff;
  width: 100%;
  border-radius: 6px;
  padding-top: 10px;
  padding-left: 50px;
}
.form-agency form input, .form-agency form select {
  height: 45px;
  border: 1px solid #D8DEE6;
  border-radius: 6px;
  background: #fff;
  width: 100%;
  padding-left: 50px;
  color: #838383;
}
.form-agency form input::placeholder, .form-agency form select::placeholder {
  color: #838383;
}
.form-agency form .custom-select {
  margin-bottom: 0;
}
.form-agency form .select-box {
  height: 51px;
  border: 1px solid #D8DEE6;
  border-radius: 4px;
  background: #fff;
  width: 100%;
  padding-left: 45px;
}
.form-agency .button {
  justify-content: center;
  width: 100%;
  display: flex;
}
.form-agency button {
  text-transform: uppercase;
  padding: 0 25px;
}

/*# sourceMappingURL=agency.css.map */