:root {
  --font-primary-regular: "mona-sans-regular";
  --font-primary-thin: "mona-sans-thin";
  --font-primary-light: "mona-sans-light";
  --font-primary-medium: "mona-sans-medium";
  --font-primary-semiBold: "mona-sans-semiBold";
  --font-primary-bold: "mona-sans-bold";
  --font-primary-black: "mona-sans-black";
  --White: #fff;
  --Foundation-Green-green-50: #EAEFEA;
  --gray-9---body-text: #121212;
  --Foundation-Green-green-500: #295E30;
  --bg-1: #F5F5F7;
  --gray-4---stroke: #D8D8D8;
  --Foundation-Red-red-500: #E44119;
  --gray-6---subtle-text: #8C8C8C;
  --Foundation-Green-green-100: #BCCDBE;
  --Foundation-Green-green-300: #6F9272;
  --subtext: #494D59;
  --Grey-9: #090C13;
  --gray-8: #434343;
  --GPCN: #056142;
}

/* font */

@font-face {
  font-family: "mona-sans-regular";
  src: url(../font/mona-sans/MonaSans-Regular.ttf);
}

@font-face {
  font-family: "mona-sans-light";
  src: url(../font/mona-sans/MonaSans-Light.ttf);
}

@font-face {
  font-family: "mona-sans-medium";
  src: url(../font/mona-sans/MonaSans-Medium.ttf);
}

@font-face {
  font-family: "mona-sans-semiBold";
  src: url(../font/mona-sans/MonaSans-SemiBold.ttf);
}

@font-face {
  font-family: "mona-sans-bold";
  src: url(../font/mona-sans/MonaSans-Bold.ttf);
}

@font-face {
  font-family: "mona-sans-black";
  src: url(../font/mona-sans/MonaSans-Black.ttf);
}

label {
  font-weight: unset !important;
}

body {
  font-family: var(--font-primary-regular);
  font-size: 16px;
  line-height: 24px;
  color: var(--gray-9---body-text);
}

.text-white {
  color: var(--White) !important;
}

.color-green {
  color: var(--GPCN);
}

.required {
  color: #F00;
}

.text-center {
  text-align: center !important;
}

.bg-second {
  background-color: var(--bg-1);
}

a {
  text-decoration: none !important;
}

h1:not(.editor-content h1),
h2:not(.editor-content h2),
h3:not(.editor-content h3),
h4:not(.editor-content h4),
h5:not(.editor-content h5),
h6:not(.editor-content h6),
p:not(.editor-content p) {
  margin: 0;
}

.overlay-header,
.btn-close-menu,
.popup-search {
  display: none;
}

.bg-second {
  background-color: #F5F5F7;
}

.header-container {
  padding: 16px 0;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
  transition: all 0.3s ease;
  border-bottom: 1px solid;
  border-color: transparent;
}

.header-container.fixed,
body:not(.main-home-container) .header-container {
  background-color: var(--White);
  border-color: rgba(255, 255, 255, 0.20);
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.05);
}

.header-inner {
  width: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}

.header-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12px;
}

.header-right-first {
  display: flex;
  align-items: center;
  gap: 12px;
}

.header-language {
  position: relative;
  margin-left: 12px;
}

.header-language::after {
  content: "";
  position: absolute;
  top: 0;
  left: -12px;
  width: 1px;
  height: 100%;
  background-color: rgba(216, 216, 216, 0.50);
}

.header-language-current {
  display: flex;
  padding: 2px 8px 2px 2px;
  align-items: center;
  gap: 4px;
  border-radius: 62px;
  background: var(--Foundation-Green-green-50);
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-semiBold);
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
  cursor: pointer;
}

.header-language-current span {
  width: 22px;
}

.header-language-list {
  position: absolute;
  top: 28px;
  right: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 8px;
  width: max-content;
  border-radius: 8px;
  background: var(--White);
  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.10);
  z-index: 100;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
}

.header-language-list.active {
  opacity: 1;
  visibility: visible;
}

.header-language-item {
  display: flex;
  padding: 2px 8px 2px 2px;
  align-items: center;
  gap: 4px;
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-semiBold);
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
  cursor: pointer;
}

.navigator-menu {
  padding: 0;
  margin: 0;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 40px;
  list-style: none;
}

.navigator-menu li span,
.navigator-menu li a {
  position: relative;
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-semiBold);
  font-size: 14px;
  font-style: normal;
  line-height: 24px;
  text-transform: uppercase;
  border-bottom: 3px solid;
  border-color: transparent;
  transition: all 0.3s ease;
}

.navigator-menu li {
  position: relative;
}

.navigator-menu>li:hover>span,
.navigator-menu>li:hover>a {
  border-color: var(--Foundation-Green-green-500);
  color: var(--Foundation-Green-green-500);
}

.navigator-menu li .sub-menu {
  display: flex;
  width: 282px;
  padding: 32px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 16px;
  margin: 0;
  list-style: none;
  background: #FFF;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.25);
  position: absolute;
  top: 100%;
  left: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  /* opacity: 1;
  visibility: visible; */
  transition: all 0.3s ease;
}

.navigator-menu li .sub-menu li a {
  font-family: var(--font-primary-semiBold);
  border-width: 2px;
}

.navigator-menu li .sub-menu li:hover>a {
  border-color: var(--Foundation-Green-green-500);
  color: var(--Foundation-Green-green-500);
}

.navigator-menu li .sub-menu li .sub-menu {
  top: 0;
  left: calc(100% + 54px);
}

.navigator-menu li .sub-menu li .sub-menu::after {
  content: "";
  position: absolute;
  top: 0;
  left: -60px;
  width: 60px;
  height: 100%;
  background-color: transparent;
}

.navigator-menu li:hover>.sub-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.main-container {
  min-height: 100vh;
  background-color: var(--White);
}

.main-container:not(:has(.main-home-container)) {
  margin-top: 96px;
}

.footer-first-inner {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  padding: 16px 0;
}

.footer-first-inner .right {
  width: 400px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
}

.footer-first-inner .right .content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.footer-first-inner .right .content .title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
  text-transform: uppercase;
  opacity: 0.6;
}

.footer-first-inner .right .content .desc {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
}

.footer-first-inner .left {
  display: flex;
  align-items: center;
  gap: 32px;
  flex: 1 0 0;
}

.footer-first-inner .left .item {
  margin-right: 32px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
}


.footer-first-inner .left .item::after {
  content: "";
  position: absolute;
  top: 0;
  right: -32px;
  width: 1px;
  height: 100%;
  background-color: rgba(216, 216, 216, 0.50);
}

.footer-first-inner .left .item .content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 4px;
}

.footer-first-inner .left .item .content .title,
.item-follow-us .title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
  text-transform: uppercase;
  opacity: 0.6;
}

.footer-first-inner .left .item .content .desc {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
}

.item-follow-us {
  display: flex;
  align-items: center;
  gap: 16px;
}

.item-follow-us .social-list {
  display: flex;
  align-items: center;
  gap: 16px;
}

.footer-first {
  background: var(--bg-1);
}

.footer-second {
  padding: 48px 0 28px 0;
}

.footer-second-inner {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.footer-second-inner .left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.btn-color-green {
  display: flex;
  height: 40px;
  padding: 12px 16px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  border-radius: 40px;
  border: 1px solid rgba(255, 255, 255, 0.20);
  background: var(--Foundation-Green-green-500);
  color: var(--White);
  text-align: center;
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  cursor: pointer;
}

.footer-second-inner .right {
  color: var(--Foundation-Green-green-500);
  text-align: center;
  font-family: var(--font-primary-semiBold);
  font-size: 22px;
  font-style: normal;
  line-height: 30px;
  text-transform: uppercase;
  width: min(100%, 476px);
}

.footer-menu {
  padding: 28px 0 0 0;
  margin: 28px 0 0 0;
  border-top: 1px solid var(--gray-4---stroke);
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  flex-wrap: wrap;
}

.footer-menu>li {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.footer-menu>li>a,
.footer-menu>li>span {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
  text-transform: uppercase;
}

.footer-menu>li .sub-menu {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 0;
  margin: 0;
  list-style: none;
  max-width: 180px;
}

.footer-menu>li .sub-menu li a {
  color: var(--gray-9---body-text);
  transition: all 0.3s ease;
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
}

.footer-menu>li .sub-menu li:hover a {
  color: var(--Foundation-Green-green-500);
}

.banner-item {
  position: relative;
}

.banner-home .logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 360px;
}

.sec-72 {
  padding: 72px 0;
}

.sec-56 {
  padding: 56px 0;
}

.home-box-1-inner {
  display: flex;
  align-items: flex-start;
  gap: 30px;
}

.home-box-1-left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 80px;
  width: 900px;
}

.home-box-1-header {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
}

.main-title {
  font-family: var(--font-primary-bold);
  font-size: 36px;
  font-style: normal;
  line-height: 44px;
  text-transform: uppercase;
}

.green-text {
  color: var(--Foundation-Green-green-500);
}

.home-box-1-right {
  display: flex;
  padding-left: 56px;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  flex: 1 0 0;
}

.home-box-1-right .item {
  width: 100%;
  display: flex;
  padding: 8px 0;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 16px;
}

.home-box-1-right .item .number {
  color: var(--Foundation-Green-green-500);
  font-family: var(--font-primary-bold);
  font-size: 56px;
  font-style: normal;
  line-height: 64px;
}

.home-box-1-right .item:nth-child(even) .number {
  color: var(--Foundation-Red-red-500);
}

.home-box-1-right .item:not(:last-child) {
  padding-bottom: 12px;
  border-bottom: 1px solid #D8D8D8;
}

.home-box-1-left-content {
  width: 100%;
}

.map-wrapper {
  position: relative;
  width: 900px;
}

.map-image {
  width: 100%;
  display: block;
}

.asia {
  position: absolute;
  top: 260px;
  left: 270px;
}

#lineCanvas {
  position: absolute;
  inset: 0;
  z-index: 2;
}

.pin {
  position: absolute;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  animation: pulse 2s infinite;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.ping.usa img {
  margin-top: -20px;
}

.home-box-3 {
  position: relative;
}

.home-box-3-img {
  position: absolute;
  bottom: 0;
  right: 0;
}

.home-box-3-inner {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 32px;
  position: relative;
  z-index: 2;
}

.home-box-3-header {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.btn-color-red {
  display: flex;
  height: 44px;
  padding: 12px 7px 12px 24px;
  justify-content: center;
  align-items: center;
  gap: 12px;
  border-radius: 40px;
  background: var(--Foundation-Red-red-500);
  color: var(--White) !important;
  text-align: center;
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  text-transform: uppercase;
  cursor: pointer;
  border: none;
  position: relative;
}

.btn-color-red::before {
  content: "";
  border-radius: 45px;
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.04);
  transition: all 0.6s ease;
  transform: scaleX(0);
}

.btn-color-red:hover::before {
  transform: scaleX(1);
}

.btn-color-red span,
.btn-color-red .btn-icon {
  z-index: 1;
}

.btn-color-red .btn-icon,
.btn-view-all .btn-icon {
  display: flex;
  width: 30px;
  height: 30px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 32px;
  background: var(--White);
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
}

.leader-item {
  padding: 0 0 24px 20px;
  display: flex;
  width: 100%;
  align-items: center;
  gap: 64px;
}

.leader-item .leader-image {
  position: relative;
  width: 412px;
}

.leader-item .leader-image img {
  border-radius: 16px;
}

.leader-item .leader-image::after {
  content: '';
  width: 260px;
  height: 392px;
  border-radius: 16px;
  background: var(--Foundation-Green-green-500);
  position: absolute;
  left: -20px;
  bottom: -24px;
}

.leader-item .leader-image img {
  position: relative;
  width: 100%;
  z-index: 10;
}

.leader-item .leader-content {
  display: flex;
  /* flex: 1; */
  flex-direction: column;
  align-items: flex-start;
  gap: 64px;
  flex-shrink: 0;
  width: min(100%, 632px);
}

.leader-item .leader-content .first {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.leader-item .leader-content .first img {
  width: 60px;
}

.leader-item .leader-content .first .desc {
  color: #121212;
  font-family: var(--font-primary-medium);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  height: 78px;
}

.leader-item .leader-content .second {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.leader-item .leader-content .second .name {
  color: #121212;
  font-family: var(--font-primary-bold);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
  text-transform: uppercase;
}

.leader-item .leader-content .second .position {
  width: 297px;
  color: #595959;
}

.leader-item .leader-content .third {
  display: flex;
  align-items: center;
  gap: 16px;
  cursor: pointer;
}

.leader-item .leader-content .third .count {
  color: #BFBFBF;
  font-family: var(--font-primary-medium);
  font-size: 20px;
  font-style: normal;
  line-height: 28px;
}

.leader-item .leader-content .third .count .current {
  color: var(--Foundation-Red-red-500);
  font-size: 24px;
  margin-right: 4px;
}

.home-box-4-inner {
  display: flex;
  flex-direction: column;
  gap: 80px;
}

.home-box-4-content {
  width: min(100%, 1100px);
  margin: 0 auto;
}

.value-wrapper {
  max-width: 100%;
  position: relative;
}

.value-row {
  display: flex;
  justify-content: space-between;
  gap: 180px;
}

.value-item h3 {
  color: var(--Foundation-Green-green-500);
  font-family: var(--font-primary-bold);
  font-size: 22px;
  font-style: normal;
  line-height: 30px;
}

.value-item div {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
}

.value-row.top {
  justify-content: flex-start;
}

.value-row.bottom {
  justify-content: center;
}

.home-box-5-inner {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.news-item .news-img {
  display: block;
  width: 100%;
  height: 288px;
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
}

.news-item .news-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease;
}

.news-item:hover .news-img img {
  transform: scale(1.05);
}

.news-item .news-content {
  display: flex;
  padding-top: 16px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 16px;
}

.news-tag {
  color: var(--Foundation-Red-red-500);
  font-family: var(--font-primary-medium);
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
  text-transform: uppercase;
}

.news-title {
  color: var(--gray-9---body-text) !important;
  font-family: var(--font-primary-medium);
  font-size: 20px;
  font-style: normal;
  line-height: 28px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  height: 56px;
  transition: all 0.3s ease;
}

.news-item:hover .news-title,
.news-item-type-2:hover .news-title {
  color: var(--Foundation-Green-green-500) !important;
}

.news-date {
  color: var(--gray-6---subtle-text, #8C8C8C);
}

.news-slider .owl-dots,
.other-project-slider .owl-dots,
.certificate-slider .owl-dots {
  margin-top: 24px;
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  justify-content: center;
}

.news-slider .owl-dot span,
.other-project-slider .owl-dot span,
.certificate-slider .owl-dot span {
  display: none;
}

.news-slider .owl-dot,
.other-project-slider .owl-dot,
.certificate-slider .owl-dot {
  width: 8px;
  height: 8px;
  border-radius: 6px;
  background: var(--Foundation-Green-green-100);
  transition: all 0.3s ease;
}

.news-slider .owl-dot.active,
.other-project-slider .owl-dot.active,
.certificate-slider .owl-dot.active {
  width: 36px;
  background: var(--Foundation-Green-green-500);
}

.home-box-6 {
  padding: 100px 0;
  background-image: url('/img/bg-home-6.webp');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
}

.home-box-6::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, rgba(41, 94, 48, 0.00) 50%, rgba(41, 94, 48, 0.95) 78.88%);
  z-index: 1;
}

.home-box-6 .container {
  position: relative;
  z-index: 2;
}

.home-box-6-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 32px;
}

.home-box-6-inner .first {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  color: var(--White);
}

.home-box-6-inner .first .main-title {
  font-size: 32px;
  font-style: normal;
  line-height: 40px;
}

.form-newsletter {
  width: 450px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.form-newsletter .btn-submit-newsletter {
  border: none;
  width: max-content;
}

.form-newsletter .btn-submit-newsletter .btn-icon {
  display: flex;
  width: 30px;
  height: 30px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 32px;
  background: var(--White);
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
}

.form-newsletter .form-control {
  display: flex;
  height: 48px;
  padding: 12px 8px 12px 16px;
  align-items: center;
  border-radius: 48px;
  border: 1px solid var(--gray-4---stroke);
  background-color: transparent;
  color: var(--White);
}

.home-box-7 {
  display: flex;
  padding: 32px 0;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  background: var(--Foundation-Green-green-500);
}

.home-box-7-inner {
  width: min(100%, 1100px);
  margin: 0 auto;
}

.home-box-2 {
  padding: 72px 0 0 0;
}

.home-box-2-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 40px;
}

.home-box-2-header .desc {
  width: min(100%, 560px);
}

.home-box-2-content {
  position: relative;
}

.home-box-2-content-img {
  width: 100%;
  height: 760px;
  position: relative;
}

.home-box-2-content-img::after {
  background: linear-gradient(184deg, rgba(4, 17, 31, 0.00) 55.32%, rgba(4, 17, 31, 0.80) 80.76%);
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.home-box-2-content-img-item {
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transition: all 0.6s ease;
  top: 0;
  left: 0;
}

.home-box-2-content-img-item:not(:first-child) {
  position: absolute;
  top: 0;
  left: 0;
}

.home-box-2-content-img-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-box-2-content-img-item.active {
  opacity: 1;
  visibility: visible;
}

.home-box-2-content-list {
  position: absolute;
  left: 0;
  bottom: 0;
  display: flex;
  width: 100%;
  overflow: hidden;
}

.home-box-2-content-list .container {
  display: flex;
  align-items: flex-end;
  gap: 16px;
}

.home-box-2-content-list-item {
  flex: 1;
  position: relative;
  transition: all 0.6s ease;
  transform: translateY(216px);
  cursor: pointer;
}

.home-box-2-content-list-item.active {
  transform: translateY(0);
}

.home-box-2-content-list-item .first {
  padding: 32px;
  border-top: 1px solid var(--Foundation-Green-green-300, #6F9272);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  transition: all 0.6s ease;
}

.home-box-2-content-list-item.active .first {
  opacity: 0;
  visibility: hidden;
}

.home-box-2-content-list-item.active .second {
  opacity: 1;
  visibility: visible;
}

.home-box-2-content-list-item .first .title {
  color: var(--White);
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
  text-transform: uppercase;
}

.home-box-2-content-list-item .first .number {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  color: rgba(255, 255, 255, 0.20);
  font-family: var(--font-primary-bold);
  font-size: 88px;
  font-style: normal;
  line-height: 88px;
  text-transform: uppercase;
}

.home-box-2-content-list-item .second {
  display: flex;
  padding: 32px 32px 24px 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  flex: 1 0 0;
  border-radius: 16px 16px 0 0;
  background: var(--Foundation-Green-green-500);
  opacity: 0;
  visibility: hidden;
  transition: all 0.6s ease;
}

.home-box-2-content-list-item .second .title {
  color: var(--White);
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
  text-transform: uppercase;
}

.home-box-2-content-list-item .second .desc {
  color: var(--White);
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  height: 120px;
}

.home-box-2-content-list-item .second .line {
  width: 100%;
  height: 1px;
  background-color: #6F9272;
}

.btn-view-service .btn-icon {
  display: flex;
  width: 32px;
  height: 32px;
  border-radius: 32px;
  background: var(--White);
  justify-content: center;
  align-items: center;
  gap: 10px;
}

.btn-view-service {
  color: var(--White) !important;
  background-color: transparent;
  border: 1px solid rgba(255, 255, 255, 0.30);
}

.banner-item:has(.banner-content)::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.48) 0%, rgba(0, 0, 0, 0.00) 22.26%, rgba(0, 0, 0, 0.00) 46.69%);
}

.banner-content {
  position: absolute;
  left: 50%;
  bottom: 32px;
  transform: translateX(-50%);
  z-index: 1;
}

.breadcrumb {
  padding: 0;
  background-color: transparent;
  display: flex;
  align-items: center;
  gap: 8px;
}

.breadcrumb>li+li:before {
  display: none;
}

.breadcrumb li a {
  color: var(--White);
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 22px;
  text-transform: uppercase;
}

.breadcrumb li i {
  font-size: 12px;
  color: var(--Foundation-Red-red-500);
}

.banner-content .banner-title {
  color: #FFF;
  font-family: var(--font-primary-bold);
  font-size: 48px;
  font-style: normal;
  line-height: 56px;
  text-transform: uppercase;
}

.thong-diep-container {
  padding-bottom: 120px;
}

.thong-diep-inner .first {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 30px;
}

.thong-diep-inner .first .left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 8px;
}

.thong-diep-inner .first .left .left-info {
  display: flex;
  padding: 16px 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.thong-diep-inner .first .left .left-info .name {
  font-family: var(--font-primary-bold);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
}

.thong-diep-inner .first .right {
  display: flex;
  padding-left: 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  flex: 1 0 0;
}

.thong-diep-inner .first .right-list {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 32px 64px;
}

.thong-diep-inner .first .right-list .item {
  width: calc(50% - 32px);
  display: flex;
  align-items: center;
  gap: 16px;
  position: relative;
}

.thong-diep-inner .first .right-list .item:nth-child(2n)::after {
  content: '';
  position: absolute;
  top: 0;
  left: -32px;
  width: 1px;
  height: 100%;
  background-color: rgba(216, 216, 216, 0.50);
}

.thong-diep-inner .first .right-list .item .content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 8px;
}

.thong-diep-inner .first .right-list .item .content .title {
  color: var(--gray-8);
  width: 200px;
}

.thong-diep-inner .first .right-list .item .content .desc {
  color: var(--Foundation-Green-green-500);
  font-family: var(--font-primary-medium);
  font-size: 32px;
  font-style: normal;
  line-height: 40px;
}

.management-inner {
  display: flex;
  flex-direction: column;
  gap: 56px;
}

.menu-list,
.award-menu {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 32px;
  border-bottom: 1px solid var(--gray-4---stroke);
}

.menu-list-item,
.award-menu-item {
  display: flex;
  padding-bottom: 16px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  border-bottom: 2px solid;
  border-color: transparent;
  cursor: pointer;
  color: rgba(38, 38, 38, 0.80);
  font-family: var(--font-primary-bold);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  text-transform: uppercase;
  transition: all 0.3s ease;
  position: relative;
}

.menu-list-item:not(:last-child),
.award-menu-item:not(:last-child) {
  margin-right: 32px;
}

.menu-list-item:not(:last-child)::after,
.award-menu-item:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 0;
  right: -32px;
  background-color: var(--gray-4---stroke);
  width: 1px;
  height: 20px;
}

.menu-list-item.active,
.menu-list-item:hover,
.award-menu-item.active,
.award-menu-item:hover {
  color: var(--Foundation-Green-green-500);
  border-color: var(--Foundation-Green-green-500);
}

.menu-box {
  width: 100%;
  display: none;
  flex-direction: column;
  gap: 56px;
}

.menu-box.active {
  display: flex;
}

.menu-box-item {
  display: flex;
  width: 100%;
  align-items: flex-start;
  justify-content: center;
  gap: 30px;
  flex-wrap: wrap;
}

.menu-box-item:not(:first-child) {
  padding-top: 56px;
  border-top: 1px solid var(--gray-4---stroke);
}

.management-item {
  width: calc(33% - 20px);
}

.management-item-img {
  width: 100%;
  height: 264px;
  border-radius: 4px;
  overflow: hidden;
}

.management-item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.management-item-content {
  display: flex;
  padding: 16px 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.management-item-content .name {
  font-family: var(--font-primary-bold);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
}

.management-item-content .position {
  color: #121212;
}

.corporate-culture-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 56px;
}

.corporate-culture-header {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.corporate-culture-header .desc {
  color: var(--Foundation-Green-green-500);
  text-align: center;
  font-family: var(--font-primary-bold);
  font-size: 28px;
  font-style: normal;
  line-height: 36px;
}

.corporate-culture-content {
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: flex-start;
  gap: 64px;
}

.corporate-culture-content .list {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 56px;
}

.corporate-culture-content .list .item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.corporate-culture-content .list .item .title {
  color: var(--Foundation-Green-green-500);
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
  text-transform: uppercase;
}

.corporate-culture-content .list .item .desc {
  padding-bottom: 28px;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  height: 172px;
  color: var(--gray-9---body-text);
}

.history-inner,
.award-inner {
  display: flex;
  width: 100%;
  padding-top: 32px;
  align-items: flex-start;
  gap: 30px;
}

.history-right,
.time-line-list {
  width: 100px;
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 120px;
}

.history-item,
.time-line-item {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  margin-bottom: 80px;
  color: var(--gray-6---subtle-text);
  font-family: var(--font-primary-medium);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
  transition: all 0.3s ease;
  cursor: pointer;
  position: relative;
}

.history-item:not(:last-child):after,
.time-line-item:not(:last-child):after {
  content: '';
  position: absolute;
  top: 24px;
  right: 10px;
  width: 1px;
  height: 80px;
  border-right: 1px dashed var(--gray-4---stroke);
}

.history-item:hover,
.history-item.active,
.time-line-item:hover,
.time-line-item.active {
  color: var(--Foundation-Green-green-500);
}

.history-item .dot,
.time-line-item .dot {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1px solid;
  border-color: transparent;
  position: relative;
}

.history-item .dot::after,
.time-line-item .dot::after {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background-color: var(--gray-4---stroke);
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: all 0.3s ease;
}

.history-item:hover .dot::after,
.history-item.active .dot::after,
.time-line-item:hover .dot::after,
.time-line-item.active .dot::after {
  background-color: var(--Foundation-Green-green-500);
}

.history-item.active .dot,
.time-line-item.active .dot {
  border-color: var(--Foundation-Green-green-500);
}

.history-left,
.award-left {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  flex-shrink: 0;
}

.history-content-item {
  display: flex;
  align-items: flex-start;
  gap: 52px;
}

.history-content-item:not(:last-child) {
  padding-bottom: 40px;
  border-bottom: 1px solid var(--gray-4---stroke);
}

.history-content-item .right {
  display: flex;
  width: 1036px;
  align-items: flex-start;
  gap: 30px;
}

.history-content-item .right .content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  flex: 1 0 0;
}

.history-content-item .right .content .title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-bold);
  font-size: 22px;
  font-style: normal;
  line-height: 30px;
}

.history-content-item .right .content .img {
  width: 432px;
}

.history-content-item .left {
  display: flex;
  padding: 16px 0;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  gap: 10px;
  transform: rotate(-90deg);
  color: var(--gray-4---stroke);
  font-family: var(--font-primary-bold);
  font-size: 96px;
  font-style: normal;
  line-height: 88px;
  width: 88px;
  margin-top: -8px;
}

.strategic-vision-box-2-item-inner {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 30px;
}

.strategic-vision-box-2-item-inner .img {
  flex: 1;
}

.strategic-vision-box-2-item-inner .img img {
  width: 100%;
}

.strategic-vision-box-2-item-inner .content {
  display: flex;
  padding-left: 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  flex: 1 0 0;
}

.strategic-vision-box-2-item-inner .content .title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-bold);
  font-size: 36px;
  font-style: normal;
  line-height: 44px;
  text-transform: uppercase;
}

.strategic-vision-box-2-item-inner .content .desc {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.strategic-vision-box-2-item-inner .content .desc .first {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 20px;
  font-style: normal;
  line-height: 28px;
}

.strategic-vision-box-2-item-inner .content .desc .list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.strategic-vision-box-2-item-inner .content .desc .list .item {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 20px;
}

.strategic-vision-box-2-item:nth-child(2n) {
  background-color: var(--bg-1);
}

.strategic-vision-box-2-item:nth-child(2n) .strategic-vision-box-2-item-inner {
  flex-direction: row-reverse;
}

.strategic-vision-box-2-item:nth-child(2n) .strategic-vision-box-2-item-inner .content {
  padding-left: 0;
  padding-right: 32px;
}

.award-inner {
  flex-direction: column;
}

.award-box-item {
  display: none;
  align-items: flex-start;
  gap: 30px;
  width: 100%;
}

.award-box-item.active {
  display: flex;
}

.award-left {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
}

.award-left .award-left-item {
  width: min(100%, 980px);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.award-left .award-left-item .header {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--gray-4---stroke);
  color: var(--Foundation-Green-green-100);
  font-family: var(--font-primary-bold);
  font-size: 36px;
  font-style: normal;
  line-height: 44px;
  text-transform: uppercase;
}

.award-left .award-left-item .list {
  display: flex;
  align-items: center;
  gap: 32px 60px;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.award-img-container {
  background-color: var(--bg-1);
}

.award-img-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
}

.award-img-list {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(26, 1fr);
  grid-template-rows: repeat(4, 1fr);
  gap: 16px;
}

.award-img-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.award-img-item {
  position: relative;
  overflow: hidden;
  grid-column: span 7 / span 2;
  grid-row: span 2 / span 2;
  border-radius: 8px;
}

.award-img-item.first {
  grid-column: span 12 / span 5;
  grid-row: span 4 / span 4;
}

.partners-box-first {
  margin-bottom: 72px;
  display: flex;
  flex-direction: column;
  gap: 56px;
  align-items: center;
}

.partners-box-first .desc {
  width: min(100%, 960px);
  margin: 0 auto;
  text-align: center;
}

.partners-box-second {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 56px;
}

.partners-box-second .main-title {
  text-align: center;
}

.customer-item {
  display: flex;
  padding: 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  width: 100%;
  background: var(--bg-1);
}

.customer-item .info {
  display: flex;
  align-items: center;
  gap: 16px;
}

.customer-item .info-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  flex: 1 0 0;
}

.customer-item .info-content .name {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
}

.customer-item .info-content .position {
  color: var(--gray-6---subtle-text);
  font-size: 14px;
  font-style: normal;
  line-height: 20px;
}

.network-of-operations-inner {
  display: flex;
  align-items: flex-start;
  gap: 30px;
}

.network-of-operations-left {
  width: 645px;
  margin-top: 68px;
}

.network-of-operations-right {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.office-list {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.office-list .item {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 40px;
}

.office-list .item:not(:last-child) {
  padding-bottom: 40px;
  border-bottom: 1px solid var(--gray-4---stroke);
}

.office-list .item-title {
  width: 156px;
  color: var(--Foundation-Red-red-500);
  font-family: var(--font-primary-bold);
  font-size: 28px;
  font-style: normal;
  line-height: 36px;
  text-transform: uppercase;
}

.office-list .item-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 24px;
  flex: 1 0 0;
}

.office-list .item-content .item-content-item,
.office-list .item-content .project-item {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 20px;
  font-style: normal;
  line-height: 28px;
}

.office-list .item-content .project-item {
  display: flex;
  align-items: flex-start;
  gap: 64px;
}

.office-list .item-content .project-item .name,
.office-list .item-content .project-item .acreage {
  flex: 1 0 0;
}

.network-of-operations-form .form-control {
  display: flex;
  height: 56px;
  padding: 8px 16px;
  align-items: center;
  gap: 16px;
  border-radius: 32px;
  border: 1px solid var(--Foundation-Green-green-100);
  appearance: none;
  background-image: url(/img/icons/down.svg);
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 12px 12px;
  color: var(--gray-9---body-text);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  box-shadow: none;
}

.news-inner {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.news-inner-header {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: flex-start;
}

.news-inner-header .left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 16px;
  width: min(100%, 470px);
}

.news-inner-header .right {
  width: min(100%, 446px);
}

.news-inner-header .left .news-title {
  color: var(--Grey-9);
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
  height: auto;
  opacity: 0.9;
}

.form-search-news {
  width: 100%;
  display: flex;
  padding: 8px 8px 8px 16px;
  align-items: center;
  gap: 16px;
  border-radius: 32px;
  border: 1px solid var(--Foundation-Green-green-100);
}

.form-search-news .form-control {
  flex: 1;
  background-color: transparent;
  border: none;
  outline: none;
  box-shadow: none;
  padding: 0;
}

.form-search-news button {
  display: flex;
  width: 32px;
  height: 32px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  border-radius: 24px;
  background: var(--Foundation-Red-red-500);
  border: none;
}

.news-menu {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.news-menu-item {
  display: flex;
  height: 44px;
  padding: 12px 16px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  border-radius: 40px;
  border: 1px solid;
  border-color: var(--Foundation-Green-green-100);
  color: var(--Foundation-Green-green-500);
  text-align: center;
  font-family: var(--font-primary-medium);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
  transition: all 0.3s ease;
  cursor: pointer;
}

.news-menu-item:hover,
.news-menu-item.active {
  background: var(--Foundation-Green-green-500);
  border-color: var(--Foundation-Green-green-500);
  color: var(--White);
}

.news-list-first .news-slider .owl-dots {
  display: none;
}

.news-list-first {
  padding-bottom: 40px;
  border-bottom: 1px solid var(--gray-4---stroke);
}

.news-list-second {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 16px 64px;
  flex-wrap: wrap;
}

.news-item-type-2 {
  width: calc(50% - 32px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--gray-4---stroke);
}

.news-list-second .news-item-type-2:last-child,
.news-list-second .news-item-type-2:nth-last-child(2):nth-child(odd) {
  border-bottom: 0;
  border: none;
}

.news-item-type-2 .news-second {
  display: flex;
  gap: 24px;
  align-items: stretch;
}

.news-item-type-2 .news-second .img {
  width: 280px;
  height: 192px;
  border-radius: 8px;
  overflow: hidden;
}

.news-item-type-2 .news-second .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease;
}

.news-item-type-2:hover .news-second .img img {
  transform: scale(1.05);
}

.news-item-type-2 .news-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
}

.news-item-type-2 .news-content .desc {
  color: var(--gray-8);
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  height: 120px;
}

.news-item-type-2 .news-content .tag-time {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.pagination {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  justify-content: center;
  margin: 0;
}

.pagination li a {
  display: flex;
  width: 32px;
  height: 32px;
  justify-content: center;
  align-items: center;
  border-radius: 32px !important;
  background: #EEF0F4;
  color: var(--gray-9---body-text);
  text-align: center;
  font-size: 14px;
  line-height: 22px;
  transition: all 0.3s ease;
  border: none;
}

.pagination li:hover a,
.pagination li.active a {
  background: var(--Foundation-Green-green-500);
  color: var(--White);
}

.insider-news-item {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  flex-shrink: 0;
  margin-bottom: 40px;
}

.insider-news-item .img {
  border-radius: 8px;
  overflow: hidden;
}

.insider-news-item .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease;
}

.insider-news-item:hover .img img {
  transform: scale(1.05);
}

.insider-news-item .title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-bold);
  font-size: 22px;
  font-style: normal;
  line-height: 30px;
  padding-right: 8px;
  transition: all 0.3s ease;
}

.insider-news-item:hover .title {
  color: var(--Foundation-Green-green-500);
}

.news-inner:has(.insider-news-list) .pagination {
  margin-top: -40px;
}

.banner-news-details .banner-content {
  bottom: unset;
  top: 50%;
  transform: translate(-50%, -50%);
}

.banner-news-details .breadcrumb {
  justify-content: center;
  margin-bottom: 24px;
}

.banner-news-details .banner-title {
  text-align: center;
}

.news-detail-share {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  justify-content: center;
  margin-top: 24px;
}

.other-news-inner {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  gap: 40px;
}

.other-news-list {
  width: 100%;
}

.news-share {
  padding-top: 24px;
  border-top: 1px solid var(--gray-4---stroke);
  width: min(100%, 1000px);
  margin: auto;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 16px;
}

.news-share a {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.3s ease;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.10);
}

.news-detail-content {
  width: min(100%, 1000px);
  margin: 0 auto;
}

.news-detail-content img {
  max-width: 100%;
}

.career-menu {
  padding: 56px 0 72px 0;
}

.career-menu:has(.career-menu-item[data-item="2"].active) {
  background-color: #F9FAFB;
}

.career-menu-inner {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 64px;
  border-bottom: 1px solid var(--gray-4---stroke);
}

.career-menu-item {
  padding-bottom: 16px;
  border-bottom: 1px solid;
  border-color: transparent;
  color: rgba(38, 38, 38, 0.80);
  font-family: var(--font-primary-bold);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  text-transform: uppercase;
  transition: all 0.3s ease;
  cursor: pointer;
  position: relative;
}

.career-menu-item.active,
.career-menu-item:hover {
  border-color: var(--Foundation-Green-green-500);
  color: var(--Foundation-Green-green-500);
}

.career-menu-item:not(:last-child)::after {
  content: '';
  background-color: var(--gray-4---stroke);
  width: 1px;
  height: 20px;
  position: absolute;
  top: 0;
  right: -32px;
}

.career-box-1 {
  padding-bottom: 56px;
}

.career-box-1 .container {
  display: flex;
  align-items: flex-start;
  gap: 30px;
}

.career-box-1 .left {
  display: flex;
  padding-right: 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  flex: 1 0 0;
}

.career-box-1 .left .main-title {
  padding-right: 64px;
}

.career-box-1 .left .data-list {
  display: flex;
  align-items: flex-start;
  gap: 30px;
}

.career-box-1 .left .data-item {
  display: flex;
  padding: 0 46px 0 16px;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  border-right: 1px solid var(--gray-4---stroke);
}

.career-box-1 .left .data-item .number {
  color: var(--Foundation-Green-green-500);
  font-family: var(--font-primary-bold);
  font-size: 40px;
  font-style: normal;
  line-height: 56px;
  height: 56px;
}

.career-box-1 .left .data-item .desc {
  color: var(--gray-8);
  font-family: var(--font-primary-medium)
}

.career-box-1 .left .data-item:last-child {
  border-right: none;
  padding: 0 16px;
}

.career-box-1 .right {
  flex: 1 0 0;
}

.career-box-1 .right img {
  width: 100%;
}

.container::after,
.container::before {
  display: none;
}

.career-box-2 .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
}

.career-item-first {
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: stretch;
  margin-bottom: 40px;
}

.career-item-first .left {
  flex: 1 0 0;
}

.career-item-first .right {
  display: flex;
  padding: 64px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  flex: 1 0 0;
  border-bottom: 3px solid var(--Foundation-Green-green-500);
  background: var(--White);
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.10);
}

.career-item-first .right .title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
}

.career-item {
  margin-bottom: 40px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.career-item-img {
  display: flex;
  height: 288px;
  justify-content: center;
  align-items: center;
  width: 100%;
  border-radius: 12px;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
  overflow: hidden;
}

.career-item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease;
}

.career-item:hover .career-item-img img {
  transform: scale(1.05);
}

.career-item-title {
  margin-top: 16px;
  color: var(--gray-9---body-text) !important;
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
  font-family: var(--font-primary-bold);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  height: 64px;
  width: 100%;
  transition: all 0.3s ease;
}

.career-item:hover .career-item-title {
  color: var(--Foundation-Green-green-500) !important;
}

.career-box-3 .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 72px;
}

.career-box-3-item {
  display: flex;
  align-items: flex-start;
  gap: 30px;
}

.career-box-3-item .img {
  flex: 1;
  position: relative;
}

.career-box-3-item .img::after {
  content: "";
  position: absolute;
  left: -16px;
  bottom: -16px;
  width: 563px;
  height: 350px;
  border-radius: 16px;
  background: #DCEADC;
}

.career-box-3-item .img img {
  width: 629px;
  height: 385px;
  border-radius: 16px;
  z-index: 1;
  position: relative;
}

.career-box-3-item .desc {
  display: flex;
  width: 638px;
  padding-left: 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
}

.career-box-3-item:nth-child(odd) {
  flex-direction: row-reverse;
}

.career-box-3-item:nth-child(odd) .desc {
  padding-left: 0;
  padding-right: 32px;
}

.career-box-3-item:nth-child(odd) .img::after {
  left: auto;
  right: -16px;
}

.career-box {
  display: none;
}

.career-box.active {
  display: block;
}

.career-list {
  width: min(100%, 1170px);
  margin: auto;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.career-list-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.search-career {
  display: flex;
  align-items: center;
  gap: 64px;
  width: 100%;
}

.search-career .title {
  color: var(--Grey-9);
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
}

.form-search-career {
  display: flex;
  padding: 8px 8px 8px 16px;
  align-items: center;
  gap: 16px;
  flex: 1 0 0;
  border-radius: 32px;
  border: 1px solid var(--Foundation-Green-green-100);
}

.form-search-career .form-control {
  padding: 0;
  border: none;
  outline: none;
  box-shadow: none;
  background-color: transparent;
}

.form-search-career button.btn-search-news {
  display: flex;
  width: 32px;
  height: 32px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border: none;
  padding: 0;
}

.career-box-second {
  background-color: #F9FAFB;
  padding: 0 0 56px 0;
}

.career-list-item {
  padding: 32px;
  border-radius: 16px;
  background: #FFF;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 40px;
}

.career-list-item .first {
  display: flex;
  width: 100%;
  flex-direction: column;
  justify-content: center;
  gap: 12px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--gray-4---stroke);
}

.career-list-item .first .title {
  color: var(--gray-9---body-text) !important;
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
  transition: all 0.3s ease;
}

.career-list-item:hover .first .title {
  color: var(--Foundation-Green-green-500) !important;
}

.career-list-item .location {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  color: var(--gray-8) !important;
}

.career-list-item .second {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.career-list-item .second .desc {
  color: #595959;
  opacity: 0.6;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  height: 48px;
}

.application-deadline {
  color: var(--subtext);
  display: flex;
  align-items: center;
  gap: 8px;
}

.application-deadline .date {
  color: var(--Foundation-Green-green-500);
  font-family: var(--font-primary-medium);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
}

.career-list .pagination {
  margin-top: -40px;
}

.career-detail-container {
  background: #F9FAFB;
}

.career-detail-inner {
  display: flex;
  width: min(100%, 1170px);
  margin: auto;
  align-items: flex-start;
  gap: 30px;
}

.hightlight-career {
  display: flex;
  width: 364px;
  padding: 24px 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  flex-shrink: 0;
  border-radius: 16px;
  border: 1px solid rgba(216, 216, 216, 0.50);
  background: var(--White);
  position: sticky;
  top: 120px;
}

.hightlight-career-title {
  color: var(--Grey-9);
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
}

.hightlight-career-item:not(:last-child) {
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(216, 216, 216, 0.50);
  width: 100%;
}

.hightlight-career-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.hightlight-career-item .title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
}

.career-detail-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  flex: 1 0 0;
}

.career-detail-content-title {
  color: var(--Grey-9);
  font-family: var(--font-primary-bold);
  font-size: 28px;
  font-style: normal;
  line-height: 36px;
  text-transform: uppercase;
}

.career-contact-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 16px;
}

.career-contact-info .title {
  color: var(--Grey-9);
  font-family: var(--font-primary-semiBold);
  font-size: 20px;
  font-style: normal;
  line-height: 28px;
}

.career-contact-info .list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.career-contact-info .list .item {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
}

.career-contact-info .list .item a {
  color: var(--gray-9---body-text) !important;
}

.form-career {
  display: flex;
  padding: 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  gap: 32px;
  border-radius: 16px;
  border: 1px solid rgba(216, 216, 216, 0.50);
  background: #F6F6F6;
}

.form-career-header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  gap: 32px;
  margin-bottom: 24px;
}

.form-career-header .title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
}

.form-career-header .desc {
  color: #595959;
}

.form-career .form-item {
  width: 100%;
  margin-bottom: 16px;
}

.form-career .form-item label {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
}

.form-career .form-control {
  width: 100%;
  resize: none;
  min-height: 48px;
  display: flex;
  padding: 12px 16px;
  align-items: center;
  gap: 115px;
  gap: 32px;
  border-radius: 8px;
  border: 1px solid;
  background: var(--White);
  border-color: rgba(216, 216, 216, 0.50);
  transition: all 0.3s ease;
  box-shadow: none;
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-regular);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
}

.form-career .form-control:focus,
.form-career .form-control:hover {
  border-color: var(--Foundation-Green-green-500);
}

.form-career .form-control::placeholder {
  color: #595959;
}

.upload-wrapper {
  border: 1px dashed var(--Foundation-Green-green-500);
  border-radius: 12px;
  padding: 30px;
  width: 100%;
  margin: 20px 0 0 0;
  background: #fff;
  transition: all 0.2s ease;
}

.uploadBox.error .upload-wrapper {
  border-color: var(--Foundation-Red-red-500);
}

.upload-wrapper input {
  display: none;
}

.upload-wrapper.dragover {
  background: var(--Foundation-Green-green-100);
  border-color: var(--Foundation-Red-red-500);
}

.upload-content {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.upload-text {
  font-size: 16px;
}

.upload-btn {
  padding: 8px 20px;
  border-radius: 20px;
  border: 1px solid var(--Foundation-Red-red-500);
  background: var(--White);
  color: var(--Foundation-Red-red-500);
  cursor: pointer;
}

.upload-btn:hover {
  background: var(--Foundation-Red-red-500);
  color: var(--White);
}

.upload-note {
  font-size: 12px;
  color: var(--Grey-9);
}

.file-preview {
  display: flex;
  flex-direction: column;
  padding: 16px;
  gap: 16px;
  border-radius: 8px;
  border: 1px dashed #FF8A04;
  background: var(--White);
}

.file-item {
  display: flex;
  align-items: center;
  gap: 24px;
  gap: 32px;
}

.file-item .file-left {
  display: flex;
  align-items: center;
  gap: 8px;
  gap: 32px;
}

.file-item .file-left .file-name {
  color: var(--Grey-9);
  font-family: var(--font-primary-medium);
  font-size: 14px;
  font-style: normal;
  line-height: 22px;
}

.file-item .file-remove {
  cursor: pointer;
}

.investors-container .container {
  display: flex;
  align-items: flex-start;
  gap: 30px;
}

.investors-main {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: flex-start;
}

.investors-main>.main-title {
  width: min(100%, 1000px);
  margin: auto;
}

.time-line-box {
  width: min(100%, 1000px);
  margin: auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
}

.investors-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.investors-item {
  display: flex;
  padding: 12px 24px 12px 12px;
  align-items: center;
  gap: 16px;
  border-radius: 8px;
  background: var(--White);
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.10);
  width: 100%;
  cursor: pointer;
}

.investors-item .content {
  flex: 1;
}

.investors-item .content .date {
  color: var(--gray-6---subtle-text);
}

.investors-item .content .title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 20px;
  font-style: normal;
  line-height: 28px;
  transition: all 0.3s ease;
}

.investors-item:hover .content .title {
  color: var(--Foundation-Green-green-500);
}

.investors-item .actions {
  display: flex;
  align-items: center;
  gap: 16px;
}

.investors-item .actions .btn-see {
  padding-right: 16px;
  border-right: 1px solid var(--gray-4---stroke);
}

.information-released-box .main-title {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--gray-4---stroke);
  width: 100%;
  color: var(--Foundation-Green-green-100);
}

.investors-item-type-2 img {
  border-radius: 12px;
  overflow: hidden;
}

.investors-item-type-2 .content {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-left: 14px;
}

.investors-item-type-2 .content .title {
  font-family: var(--font-primary-bold);
}

.happy-cncers-inner {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 40px;
  gap: 32px;
}

.happy-cncers-content {
  width: 100%;
}

.happy-cncers-slider .owl-stage-outer {
  margin: -8px;
  padding: 8px;
}

.event-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  border-radius: 16px;
  border: 1px solid var(--gray-4---stroke);
  background: var(--White);
  overflow: hidden;
  cursor: pointer;
}

.event-item-img {
  width: 100%;
  height: 290px;
  border-radius: 8px;
  overflow: hidden;
}

.event-item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease;
}

.event-item:hover .event-item-img img {
  transform: scale(1.05);
}

.event-item-content {
  display: flex;
  padding: 16px 24px 24px 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  gap: 32px;
}

.event-item-content .title {
  color: #121212;
  font-family: var(--font-primary-medium);
  font-size: 20px;
  font-style: normal;
  line-height: 28px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  height: 56px;
}

.event-item-content .content {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
}

.event-item-content .content-item {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--gray-8);
}

.event-item-content .content-item img {
  width: 24px;
}

.event-item-content .content-item:last-child {
  width: 100%;
  flex: unset;
}

.event-item-content .action {
  width: 100%;
  display: flex;
  height: 44px;
  align-items: flex-start;
  gap: 8px;
}

.event-item-content .action .btn-register-event {
  flex: 1;
  padding: 12px 24px;
}

.btn-border-red {
  border: 1px solid var(--Foundation-Red-red-500);
  color: var(--Foundation-Red-red-500);
  padding: 0 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  border-radius: 40px;
  transition: all 0.3s ease;
  text-align: center;
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  text-transform: uppercase;
  cursor: pointer;
}

.modal-event .modal-dialog {
  width: min(95%, 1200px);
  height: 90vh;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.modal-event .modal-content {
  width: 100%;
  border-radius: 16px;
}

.modal-event .modal-header {
  display: flex;
  padding: 16px 24px;
  justify-content: space-between;
  align-items: center;
  gap: 32px;
  border-bottom: 1px solid var(--gray-4---stroke);
}

.modal-event .modal-header::after,
.modal-event .modal-header::before {
  display: none;
}

.modal-event .modal-title {
  color: #9DA8C3;
  text-align: center;
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
  text-transform: uppercase;
}

.modal-event .modal-body {
  padding: 0;
}

.event-info {
  width: min(95%, 1000px);
  margin: -45px auto 0 auto;
  display: flex;
  padding: 16px 32px;
  justify-content: space-between;
  align-items: center;
  border-radius: 16px;
  background: #FFF;
  box-shadow: 0 0 10px 0 rgba(7, 63, 146, 0.15);
  position: relative;
  z-index: 10;
}

.event-modal .btn-register-event {
  padding: 12px 24px;
}

.event-info .left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.event-info .left .first {
  font-family: var(--font-primary-medium);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
}

.event-info .left .second {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.event-info .left .second-item {
  display: flex;
  align-items: center;
  color: var(--Foundation-Red-red-500);
  font-family: var(--font-primary-semiBold);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  gap: 8px;
}

.event-modal-content {
  display: flex;
  padding: 24px 32px 72px 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  gap: 32px;
  background: var(--White, #FFF);
}

.register-event-modal .modal-dialog {
  width: min(95%, 800px);
  height: 90vh;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.register-event-modal .modal-content {
  width: 100%;
  overflow: hidden;
  border-radius: 16px;
}

.register-event-modal .modal-header {
  display: flex;
  height: 152px;
  padding: 16px 24px;
  justify-content: space-between;
  align-items: flex-start;
  gap: 32px;
  border-bottom: 1px solid var(--gray-4---stroke);
  background-image: url('/img/bg-register-event.webp');
  background-size: cover;
}

.get-advice-modal .modal-header {
  height: 96px;
  align-items: center;
}

.register-event-modal .modal-header::after,
.register-event-modal .modal-header::before {
  display: none;
}

.register-event-modal .modal-header .left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 16px;
  flex: 1;
}

.register-event-modal .modal-header .left .title {
  color: var(--White);
  text-align: center;
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
  text-transform: uppercase;
}

.register-event-modal .modal-header .left .name-event {
  color: var(--White);
  font-family: var(--font-primary-regular);
  font-size: 20px;
  font-style: italic;
  line-height: 28px;
  text-decoration: underline;
}

.register-event-modal .modal-header .right img {
  filter: brightness(0) invert(1);
  cursor: pointer;
}

.register-event-modal .modal-body {
  display: flex;
  padding: 24px 32px 72px 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;

  background: var(--White);
}

.form-register-event {
  width: 100%;
}

.form-register-event .row {
  margin: 0 -8px;
}

.form-register-event .row>* {
  padding: 0 8px;
}

.form-register-event .form-note {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--gray-9---body-text);
  margin-bottom: 16px;
}

.form-register-event .form-item,
.form-register-event .form-radio {
  margin-bottom: 16px;
}

.form-register-event .form-item label,
.form-register-event .form-radio label {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-semiBold);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
}

.form-register-event .form-control {
  display: flex;
  min-height: 48px;
  padding: 12px 16px;
  align-items: center;
  gap: 115px;
  border-radius: 8px;
  border: 1px solid;
  border-color: rgba(216, 216, 216, 0.50);
  background: var(--white, #FFF);
  outline: none;
  box-shadow: none;
  color: var(--gray-9---body-text);
}

.form-register-event .form-control.form-date {
  background-image: url('/img/icons/calendar-icon.svg');
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 20px 20px;
  padding-right: 32px;
}

.form-register-event .form-control::placeholder {
  color: var(--gray-6---subtle-text);
}

.form-register-event .form-control:focus,
.form-register-event .form-control:hover {
  border-color: var(--Foundation-Green-green-500);
}

.form-register-event .form-select,
.form-register-event .form-control.form-time {
  appearance: none;
  background-image: url('/img/icons/chevon-down-green.svg');
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 16px 16px;
  padding-right: 32px;
}

.form-register-event .form-button {
  margin-top: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.form-register-event .form-button .btn-submit-register,
.form-register-event .form-button .btn-see-detail {
  width: 248px;
  padding: 12px 24px;
}

.form-register-event .form-radio {
  display: flex;
  align-items: center;
  gap: 32px;
}

.form-register-event .form-radio label input {
  display: none;
  padding-left: 40px;
}

.form-register-event .form-radio .radio-item label {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-direction: row-reverse;
  font-family: var(--font-primary-regular);
  cursor: pointer;
}

.form-register-event .form-radio .radio-item label span {
  position: relative;
  width: 16px;
  height: 16px;
  border: 2px solid;
  border-color: rgba(216, 216, 216, 0.50);
  border-radius: 50%;
  transition: all 0.3s ease;
}

.form-register-event .form-radio .radio-item label span::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 8px;
  height: 8px;
  background-color: var(--Foundation-Green-green-500);
  border-radius: 50%;
  opacity: 0;
  transition: all 0.3s ease;
}

.form-register-event .form-radio .radio-item label input:checked+span {
  border-color: var(--Foundation-Green-green-500);
}

.form-register-event .form-radio .radio-item label input:checked+span::after {
  opacity: 1;
}

.happy-cncers-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
}

.happy-cncers-header .main-desc-type-2 {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 18px;
  font-style: normal;
  line-height: 26px;
}

.list-img-happy-cncers {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}

.img-happy-cncers-item {
  width: calc(33% - 8px);
  border-radius: 16px;
  overflow: hidden;
}

.img-happy-cncers-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.happy-cncersbox-4-bg {
  width: 100%;
  height: 880px;
}

.happy-cncersbox-4-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left;
}

.happy-cncers-box-4 {
  position: relative;
}

.happy-cncers-box-4 .container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
}

.happy-cncersbox-4-inner {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.happy-cncersbox-4-content {
  width: min(100%, 700px);
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
}

.happy-cncersbox-4-header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  color: var(--White);
}

.happy-cncersbox-4-item {
  display: flex;
  width: min(100%, 450px);
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.happy-cncersbox-4-item .title {
  display: flex;
  padding: 8px 24px;
  align-items: center;
  gap: 232px;
  border-radius: 90px;
  background: rgba(0, 0, 0, 0.15);
  color: var(--White);
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
}

.happy-cncersbox-4-item .desc {
  color: var(--White);
}

.happy-cncersbox-5-inner {
  display: flex;
  width: 100%;
  border-radius: 16px;
  align-items: center;
  gap: 64px;
}

.happy-cncersbox-5-left {
  flex: 1;
  display: flex;
  padding-right: 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  flex: 1 0 0;
}

.happy-cncersbox-5-left .first {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;

}

.happy-cncersbox-5-left .first .desc {
  font-family: var(--font-primary-medium);
}

.happy-cncersbox-5-left .second {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.happy-cncersbox-5-left .second .note {
  color: var(--Foundation-Red-red-500);
  font-family: var(--font-primary-medium);
  font-size: 14px;
  font-style: normal;
  line-height: 20px;
}

.happy-cncersbox-5-left .second .btn-view-all {
  width: max-content;
}

.project-item {
  width: 100%;
  margin-bottom: 40px;
}

.project-item-img {
  width: 100%;
  height: 464px;
  border-radius: 16px;
  overflow: hidden;
  display: block;
}

.project-item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease-in-out;
}

.project-item:hover .project-item-img img {
  transform: scale(1.05);
}

.project-item-content {
  padding: 24px 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.project-item-content .title {
  color: var(--Grey-9);
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
}

.project-item-content .locaiton {
  display: flex;
  align-items: center;
  color: #595959;
}

.project-list {
  margin-top: 56px;
  gap: 40px;
}

.project-list .row>*:last-child .project-item,
.project-list .row>*:nth-last-child(2):nth-child(odd) .project-item {
  margin-bottom: 0;
}

.project-detail-inner {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 30px;
}

.project-detail-left {
  display: flex;
  width: 758px;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
}

.project-detail-left .location {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
}

.project-detail-right {
  display: flex;
  flex-direction: column;
  padding: 32px;
  align-items: flex-start;
  gap: 16px;
  flex: 1 0 0;
  background: #FFF;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
}

.project-detail-right .item {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 30px;

}

.project-detail-right .item .left {
  display: flex;
  width: 186px;
  align-items: center;
  gap: 16px;
  font-family: var(--font-primary-medium);
}

.project-detail-right .item .desc {
  flex: 1;
}

.project-detail-right .item:not(:last-child) {
  padding-bottom: 16px;
  border-bottom: 1px solid #D9D9D9;
}

.other-project-inner {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
}

.other-project-content {
  width: 100%;
}

.other-project-slider .project-item .locaiton img {
  width: 24px;
}

.other-project-slider .owl-dots {
  margin-top: -16px;
}

.project-detail-second-content {
  margin-top: 40px;
}

.project-detail-container {
  display: flex;
  flex-direction: column;
  gap: 56px;
}

.project-img {
  width: 100%;
  height: 406px;
  border-radius: 16px;
  overflow: hidden;
  display: block;
}

.project-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.subsidiary-company-inner {
  display: flex;
  flex-direction: column;
  gap: 72px;
}

.subsidiary-company-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 72px;
}

.subsidiary-company-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 72px 40px;
}

.subsidiary-company-item {
  display: flex;
  width: 300px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  flex-shrink: 0;
}

.subsidiary-company-item-img {
  width: 100%;
  height: 122px;
  padding: 0 23px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  border: 1px solid var(--gray-4---stroke);
}

.subsidiary-company-item-img img {
  width: 100%;
  max-height: 100%;
  height: auto;
}

.subsidiary-company-item-name {
  text-align: center;
  font-family: var(--font-primary-semiBold);
  font-size: 20px;
  font-style: normal;
  line-height: 28px;
  text-transform: capitalize;
  width: 100%;
  height: 56px;
}

.esg-banner-content {
  display: flex;
  width: 652px;
  padding: 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  border-radius: 16px;
  background: var(--Foundation-Green-green-500);
  color: var(--White);
  float: right;
}

.esg-box-1 {
  padding: 40px 0;
  text-align: center;
  color: var(--Foundation-Green-green-500);
  text-align: center;
  font-family: var(--font-primary-bold);
  font-size: 18px;
  font-style: normal;
  line-height: 24px;
}

.esg-box-main {
  padding-top: 72px;
}

.esg-box-main .container {
  display: flex;
  flex-direction: column;
}

.esg-box-2-inner {
  display: flex;
  flex-direction: column;
  gap: 72px;
}

.esg-box-2-item {
  display: flex;
  align-items: flex-start;
  gap: 90px;
}

.esg-box-2-item:nth-child(odd) {
  flex-direction: row-reverse;
}

.esg-box-2-item .content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;

  width: 470px;
}

.esg-box-2-item .img {
  flex: 1;
  height: 500px;
  border-radius: 16px;
  overflow: hidden;
}

.esg-box-2-item .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.esg-box-3 {
  padding: 32px 0;
  background-image: url('../img/giai-thuong-bg.webp');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
}

.esg-box-3-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: 100%;
}

.esg-box-3-item img {
  width: 100%;
  max-width: 180px;
}

.esg-box {
  gap: 0;
}

.esg-box-3-item .name-award {
  text-align: center;
  font-family: var(--font-primary-bold);
  font-size: 20px;
  font-style: normal;
  line-height: 22px;
  width: 100%;
  color: var(--White);
}

.esg-box-3-item .time-award {
  color: var(--White);
  font-size: 20px;
  font-style: normal;
  line-height: 22px;
}

.esg-box-4-inner {
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: center;
}

.esg-box-4-inner .main-title {
  color: var(--Foundation-Green-green-500);
}

.esg-box-4-content {
  width: 100%;
}

.esg-box-5-inner {
  display: flex;
  flex-wrap: wrap;
  gap: 72px 64px;
}

.esg-box-5-item {
  width: 30%;
  height: 498px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  padding: 32px;
  position: relative;
  border-radius: 16px;
  background: #EDF8EE;
  transition: all 0.3s ease;
  cursor: pointer;
}

.esg-box-5-item:hover {
  background-color: #FCECE8;
}

.esg-box-5-item .title {
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
  text-transform: uppercase;
}

.esg-box-5-item .number {
  position: absolute;
  bottom: 8px;
  right: 12px;
  color: #BFBFBF;
  text-align: right;
  font-family: var(--font-primary-bold);
  font-size: 56px;
  font-style: normal;
  line-height: 64px;
  transition: all 0.3s ease;
}

.esg-box-5-item:hover .number {
  color: var(--gray-9---body-text);
}

.esg-box-6-data {
  display: flex;
  align-items: flex-start;
  gap: 110px;
}

.esg-box-6-data-item {
  display: flex;
  padding: 8px 0;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 16px;
  flex: 1;
  position: relative;
}

.esg-box-6-data-item:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 0;
  right: -55px;
  width: 1px;
  height: 144px;
  background-color: var(--gray-4---stroke);
}

.esg-box-6-data-item:first-child {
  flex: unset;
  width: 186px;
}

.esg-box-6-data-item .number {
  color: var(--Foundation-Red-red-500);
  font-family: var(--font-primary-bold);
  font-size: 52px;
  font-style: normal;
  line-height: 60px;
}

.esg-box-6-data-item .number .until {
  font-family: var(--font-primary-medium);
  font-size: 20px;
  font-style: normal;
  line-height: 28px;
}

.esg-box-6-list {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 72px;
  margin-top: 72px;
}

.esg-box-6-item {
  display: flex;
  align-items: flex-start;
  gap: 64px;
}

.esg-box-6-item .img {
  position: relative;
  width: 629px;
  height: 440px;
}

.esg-box-6-item .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 16px;
  z-index: 10;
  position: relative;
}

.esg-box-6-item .img::after {
  content: '';
  position: absolute;
  bottom: -16px;
  left: -16px;
  width: 563px;
  height: 404px;
  border-radius: 16px;
  background: #DCEADC;
}

.esg-box-6-item:nth-child(even) {
  flex-direction: row-reverse;
}

.esg-box-6-item:nth-child(even) .img::after {
  left: unset;
  right: -16px;
}

.esg-box-6-item .content {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
}

.production-technology-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  z-index: 10;
  position: relative;
}

.production-technology-container .main-title {
  color: var(--Foundation-Green-green-500);
}

.production-technology-box-1-content {
  width: 100%;
}

.production-technology-box-1-content-list .item {
  display: flex;
  padding: 8px 0;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 16px;
  flex: 1 0 0;
}

.production-technology-box-1-content-list .item .number {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-bold);
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 56px;
}

.production-technology-box-1-content-list .item .title {
  margin-top: -8px;
  text-align: center;
}

.production-technology-header {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 30px;
}

.production-technology-header .desc {
  color: var(--gray-8);
  flex: 1;
}

.production-technology-header .main-title {
  flex: 1;
}

.services-item {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  border-radius: 16px;
  background: var(--White);
  overflow: hidden;
  margin-bottom: 40px;
  cursor: pointer;
}

.services-item .img {
  position: relative;
  height: 224px;
  overflow: hidden;
}

.services-item .img>img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease;
}

.services-item:hover .img>img {
  transform: scale(1.05);
}

.services-item .icon {
  display: flex;
  width: 64px;
  min-height: 64px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 64px;
  background: linear-gradient(90deg, #285D2C 0%, #A4C939 100%);
}

.services-item .content {
  height: 256px;
  padding: 0 16px 16px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: -34px;
  z-index: 1;
}

.services-item .content .title {
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 20px;
  font-style: normal;
  line-height: 28px;
  transition: all 0.3s ease;
}

.services-item:hover .content .title {
  color: var(--Foundation-Green-green-500);
}

.industrial-solutions-service-item .icon {
  background: var(--GPCN);
}

.services-item.industrial-solutions-service-item:hover .content .title {
  color: var(--GPCN);
}

.production-technology-content {
  width: 100%;
}

.logoSwiper .item {
  display: flex;
  width: 100%;
  height: 76px;
  padding: 4px 12px;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  border-radius: 8px;
  border: 1px solid var(--gray-4---stroke);
}

.logoSwiper .item img {
  /* height: 100%; */
  width: 100%;
}

.certificate-item {
  display: flex;
  width: 100%;
  padding: 32px 64px;
  align-items: center;
  gap: 30px;
  border-radius: 16px;
  background: linear-gradient(90deg, #285D2C 0%, #A4C939 100%);
}

.certificate-item .img {
  width: 240px;
}

.certificate-item .content {
  display: flex;
  padding-left: 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  flex: 1 0 0;
  color: var(--White);
}

.certificate-item .content .title {
  font-family: var(--font-primary-bold);
  font-size: 24px;
  font-style: normal;
  line-height: 32px;
}

.production-technology-box-6 {
  background-image: url('../img/production-technology-box-6-bg.webp');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  height: 400px;
}

.production-technology-box-6::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(271deg, rgba(0, 0, 0, 0.00) 21.84%, rgba(0, 0, 0, 0.00) 33.89%, rgba(0, 0, 0, 0.80) 98.96%);
}

.book-service-content {
  width: min(100%, 878px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 32px;
  margin-top: 70px;
}

.book-service-content .title {
  color: var(--White, #FFF);
  font-family: var(--font-primary-bold);
  font-size: 36px;
  font-style: normal;
  line-height: 44px;
  text-transform: uppercase;
}

.book-service-content .actions {
  display: flex;
  align-items: flex-start;
  gap: 32px;
}

.book-service-content .actions .btn-get-advice {
  background: linear-gradient(90deg, #285D2C 0%, #A4C939 100%);
}

.book-service-content .actions .btn-booking {
  background: var(--White);
}

.book-service-content .actions .btn-booking span {
  background: linear-gradient(90deg, #285D2C 0%, #A4C939 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: all 0.3s ease-in-out;
}

.book-service-content .actions .btn-booking .btn-icon {
  background: linear-gradient(90deg, #285D2C 0%, #A4C939 100%);
}

.book-service-content .actions .btn-booking .btn-icon img {
  filter: brightness(0) invert(1);
}

.industry-logistics-box-2 {
  padding-bottom: 0 !important;
}

.industry-logistics-box-1 {
  padding: 72px 0 56px 0;
}

.industry-logistics-box-1 .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 56px;
}

.industry-logistics-box-1-first {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 30px;
}

.industry-logistics-box-1-first .left {
  padding-right: 64px;
  flex: 1;
}

.industry-logistics-box-1-first .right {
  position: relative;
}

.industry-logistics-box-1-first .right .point {
  position: absolute;
  background-color: transparent;
}

.industry-logistics-box-1-first .right .point.point-industry-logistics {
  top: 33%;
  left: 23%;
  width: 50%;
  height: 100px;
}

.industry-logistics-box-1-first .right .point.point-logistics {
  top: 5%;
  left: 37%;
  width: 24%;
  height: 111px;
}

.industry-logistics-box-1-second {
  width: 100%;
}

.industry-logistics-box-1-second-header {
  width: min(100%, 1000px);
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  text-align: center;
  margin: 0 auto;
}

.industry-logistics-box-1-second .img {
  width: 100%;
}

.industry-logistics-box-1-second .img img {
  width: 100%;
}

.industrial-solutions-box-1 .production-technology-header {
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
}

.industrial-solutions-box-1 .production-technology-header .desc {
  max-width: 1000px;
  margin: 0 auto;
}

.industrial-solutions-box-1-content {
  width: min(100%, 1000px);
  margin: auto;
}

.industrial-solutions-box-1-content img {
  width: 100%;
}

.industrial-solutions-certificate-slider .owl-dots {
  display: none;
}

.industrial-solutions-certificate-slider .owl-stage-outer {
  margin: -8px;
  padding: 8px;
}

.industrial-solutions-certificate-item {
  border-radius: 16px;
  background: var(--White);
  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.15);
}

.industrial-solutions-certificate-item .content .title {
  color: var(--GPCN);
}

.industrial-solutions-certificate-item .content .desc {
  color: var(--gray-9---body-text);
}

.industrial-solutions-box-3 {
  padding: 0 0 72px 0;
}

.industrial-solutions-box-4 {
  background-image: url('../img/industrial-solutions-box-4-bg.webp');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.industrial-solutions-box-4 .book-service-content .actions .btn-get-advice,
.industrial-solutions-box-4 .book-service-content .actions .btn-booking .btn-icon {
  background: var(--GPCN);
}

.industrial-solutions-box-4 .book-service-content .actions .btn-booking span {
  background: transparent;
  color: var(--GPCN);
  -webkit-text-fill-color: unset
}

.logistics-service-item .icon {
  background: var(--Foundation-Red-red-500);
}

.logistics-service-item:hover .content .title {
  color: var(--Foundation-Red-red-500);
}

.logistics-box-2 {
  padding-bottom: 32px !important;
}

.logistics-box-4 {
  background-image: url('../img/logistics-box-3-bg.webp');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.logistics-box-4-inner {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 30px;
}

.logistics-box-4-left {
  display: flex;
  padding-right: 64px;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  align-self: stretch;
  flex: 1;
}

.logistics-box-4-right {
  flex: 1;
  position: relative;
}

.logistics-box-4-right::after {
  content: '';
  position: absolute;
  bottom: -16px;
  right: -16px;
  width: 100%;
  height: 100%;
  background: var(--Foundation-Red-red-500);
  border-radius: 16px;
}

.logistics-box-4-right img {
  width: 100%;
  position: relative;
  z-index: 1;
}

.certificate-logistics-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  width: 100%;
}

.certificate-logistics-item .img {
  width: 100%;
}

.certificate-logistics-item .img img {
  width: 100%;
}

.certificate-logistics-item .title {
  color: var(--gray-9---body-text);
  text-align: center;
  font-family: var(--font-primary-medium);
  font-size: 20px;
  font-style: normal;
  line-height: 28px;
}

.logistics-box-1-inner {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
}

.logistics-box-1-content {
  display: flex;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
}

.logistics-box-1-item {
  display: flex;
  padding: 8px 0;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 16px;
  flex: 1 0 0;
}

.logistics-box-1-item .number {
  color: var(--Foundation-Red-red-500);
  font-family: var(--font-primary-bold);
  font-size: 56px;
  font-style: normal;
  line-height: 64px;
}

.logistics-box-1-item .desc {
  color: var(--gray-8);
  text-align: center;
}

.logistics-box-1-item:not(:last-child) {
  padding-right: 24px;
  border-right: 1px solid var(--gray-4---stroke);
}

.logistics-box-1-item:nth-child(2) {
  flex: unset;
  width: max-content;
  padding: 8px 67px 0 43px;
}

.logistics-box-2-inner {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.logistics-box-2-content {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  gap: 30px;
}

.logistics-box-2-map {
  width: 100%;
  position: relative;
}

.logistics-box-2-map .img-map {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  transition: all 0.3s ease-in-out;
}

.logistics-box-2-map .img-map:first-child {
  position: relative;
  top: unset;
  left: unset;
}

.logistics-box-2-map .img-map.active {
  opacity: 1;
}

.logistics-box-2-map img {
  width: 100%;
}

.logistics-box-2-map .point {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 40px;
  height: 40px;
  background: transparent;
  cursor: pointer;
}

.logistics-box-2-map .point.point-asia {
  top: 36%;
  left: 76%;
  width: 35%;
  height: 59%;
}

.logistics-box-2-map .point.point-euro {
  top: 38%;
  left: 51%;
  width: 12%;
  height: 16%;
}

.logistics-box-2-map .point.point-na {
  top: 42%;
  left: 21%;
  width: 17%;
  height: 16%;
}

.logistics-box-2-map .point.point-sa {
  top: 78%;
  left: 31%;
  width: 14%;
  height: 42%;
}

.logistics-box-2-list {
  display: flex;
  align-items: stretch;
  gap: 30px;
  width: 100%;
}

.logistics-box-2-item {
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  flex: 1 0 0;
  align-self: stretch;
  border-radius: 16px;
  background: var(--bg-1);
  width: calc(25% - 15px);
  cursor: pointer;
}

.logistics-box-2-item-header {
  display: flex;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-bold);
  font-size: 20px;
  font-style: normal;
  line-height: 28px;
}

.logistics-box-2-item-header .icon {
  display: flex;
  width: 40px;
  height: 40px;
  padding: 14px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 64px;
  background: var(--Foundation-Red-red-500);
  font-family: var(--font-primary-medium);
  color: var(--White);
}

.logistics-box-2-item-body {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}

.logistics-box-2-item-body>div {
  width: calc(50% - 12px);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.logistics-box-2-item-body .item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
}

.logistics-box-2-item-body .item .name-city {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
  white-space: nowrap;
}

.production-technology-box-4 {
  background-image: url('../img/production-technology-box-4-bg.webp');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 1070px;
}

.production-technology-box-4-inner {
  display: flex;
  align-items: flex-start;
  gap: 80px;
}

.production-technology-box-4-left {
  width: 645px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
}

.production-technology-box-4-left .main-title {
  width: min(100%, 400px);
  color: var(--Foundation-Green-green-500);
}

.production-technology-box-4-content {
  display: flex;
  flex-direction: column;
}

.production-technology-box-4-content .item {
  display: none;
  width: 100%;
  height: 762px;
  flex-direction: column;
  align-items: flex-start;
  border-radius: 8px;
  background: linear-gradient(90deg, rgba(164, 201, 57, 0.25) 0%, rgba(164, 201, 57, 0.00) 100%);
}

.production-technology-box-4-content .item.active {
  display: flex;
}

.production-technology-box-4-content .item .img {
  width: 100%;
  height: 372px;
  overflow: hidden;
  border-radius: 8px;
}

.production-technology-box-4-content .item .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.production-technology-box-4-content .item .content {
  display: flex;
  padding: 32px 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
}

.production-technology-box-4-content .item .content .title {
  color: var(--Foundation-Green-green-500);
  font-family: var(--font-primary-bold);
  font-size: 32px;
  font-style: normal;
  line-height: 40px;
  text-transform: uppercase;
}

.production-technology-box-4-content .item .content .address {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  color: var(--gray-9---body-text);
  font-family: var(--font-primary-medium);
  font-size: 16px;
  font-style: normal;
  line-height: 24px;
}

.production-technology-box-4-right {
  flex: 1;
  position: relative;
}

.production-technology-box-4-right .img-map {
  margin-right: -88px;
}

.production-technology-box-4-right .production-technology-box-4-box {
  width: 195px;
  padding: 8px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  border-radius: 8px;
  border: 1px solid var(--Foundation-Green-green-500);
  background: var(--White);
  cursor: pointer;
}

.production-technology-box-4-right .production-technology-box-4-box .title {
  color: var(--Foundation-Green-green-500);
  text-align: center;
  font-family: var(--font-primary-bold);
  font-size: 18px;
  font-style: normal;
  line-height: normal;
  text-transform: uppercase;
}


.production-technology-box-4-right .production-technology-box-4-box .desc {
  color: var(--Foundation-Green-green-500);
  font-size: 14px;
  font-style: normal;
  line-height: 20px;
}

.production-technology-box-4-right .production-technology-box-4-box:hover,
.production-technology-box-4-right .production-technology-box-4-box.active {
  background: linear-gradient(90deg, #285D2C 0%, #A4C939 100%);
  border-color: none;
}


.production-technology-box-4-right .production-technology-box-4-box:hover .title,
.production-technology-box-4-right .production-technology-box-4-box.active .title,
.production-technology-box-4-right .production-technology-box-4-box:hover .address,
.production-technology-box-4-right .production-technology-box-4-box.active .address {
  color: var(--White) !important;
}

.production-technology-box-4-right .production-technology-box-4-box {
  position: absolute;
  top: 0;
  right: 10px;
}

.production-technology-box-4-right .production-technology-box-4-box:nth-child(1) {
  top: -10px;
}

.production-technology-box-4-right .production-technology-box-4-box:nth-child(2) {
  top: 12%;
}

.production-technology-box-4-right .production-technology-box-4-box:nth-child(3) {
  top: 22%;
}

.production-technology-box-4-right .production-technology-box-4-box:nth-child(4) {
  top: 32%;
}

.production-technology-box-4-right .production-technology-box-4-box:last-child {
  top: 92%;
}

.production-technology-box-4-right .production-technology-box-4-box:nth-last-child(2) {
  top: 82%;
}

.production-technology-box-4-right .production-technology-box-4-box:nth-last-child(3) {
  top: calc(70% - 8px);
}

.production-technology-box-4-right .production-technology-box-4-box:nth-last-child(4) {
  top: 59%;
}

.investors-box {
  margin-top: 56px;
}

.ui-timepicker-wrapper {
  width: 350px;
}

.ui-timepicker-wrapper::-webkit-scrollbar {
  width: 4px;
}

.ui-timepicker-wrapper::-webkit-scrollbar-thumb {
  background-color: #285D2C;
  border-radius: 4px;
}

.ui-timepicker-wrapper::-webkit-scrollbar-track {
  background-color: transparent;
  border-radius: 4px;
}

.ui-timepicker-disabled {
  display: none;
}

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 59, 48, 0.6);
  }

  70% {
    box-shadow: 0 0 0 20px rgba(255, 59, 48, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(255, 59, 48, 0);
  }
}

@media (min-width: 1400px) {
  .container {
    width: 1320px;
    padding: 0;
  }
}