.head1 {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 50;
  width: 100%;
  padding: 2.2917vw 6.25vw;
  transition: all ease 0.6s;
}

.isback .head1 {
  transform: translateY(-100%);
}

.co-w {
  max-width: 100vw;
  margin: 0 auto;
}

:root {
  --color: #054BFA;
  --dark: #0f172a;
  --yellow: #FEE203;
  --head: 8.854vw;
  --f-poppins: "Poppins", sans-serif;
  --f-calibri: var(--f-poppins), "Calibri", sans-serif;
  --f-inter: var(--f-poppins), "Inter", sans-serif;
  --f-oswald: "Oswald", sans-serif;
  --f-noto: var(--f-poppins), "Noto Sans SC", sans-serif;
}

body {
  font-family: var(--f-poppins), var(--f-noto), sans-serif;
}

body.home {
  font-family: var(--f-calibri);
  color: var(--dark);
  background: #f5f9ff;
}

.head1 {
  background: transparent;
}

@media screen and (min-width:768px) {
  .head1 .head_logo {
    border: 1px solid rgba(219, 234, 254, 0.30);
    background: rgba(219, 234, 254, 0.20);
    padding-right: 12.5px;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
  }

}

.head1 .logo {
  gap: 0.573vw;
}

.logo2 {
  width: 15.3646vw;
  margin-top: -1.5208vw;
  position: absolute;
  left: 6.25vw;
  top: var(--head);
  z-index: 10;
}

.logo2 img:nth-child(2) {
  display: none;
}

.blackHead .logo2 img:nth-child(1) {
  display: none;
}

.blackHead .logo2 img:nth-child(2) {
  display: block;
}

.head1 .logo-icon {
  width: 2.917vw;
}

.head1 .logo-text {
  color: #fff;
  letter-spacing: 0.063vw;
  white-space: nowrap;
  font-family: var(--f-noto);
}

.blackHead .head1 .logo-text {
  color: var(--color);
}

.head1 .menu {
  gap: 2.5vw;
  font-family: var(--f-inter);
}
.head1 .menu img {
  height: 3.6458vw;
}
.head1 .menu .link a {
  color: #fff;
  text-transform: uppercase;
  font-weight: 400;
}

.blackHead .head1 .menu .link a {
  color: #0F172A;
}

.head1 .menu .link a:hover {
  color: var(--yellow);
}

.head-btn {
  padding: 0.677vw 1.875vw;
  border: 0.052vw solid rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(0.104vw);
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.055vw;
  transition: all .3s;
  font-family: var(--f-inter);
  font-weight: 400;
}

.blackHead .head-btn {
  border: 0.052vw solid #2563EB;
  background: #DBEAFE;
  color: #2563EB;
}

.head-btn:hover {
  background: var(--color);
  border-color: var(--color);
  color: #fff;
}

.scroll .head1 {
  backdrop-filter: blur(0.52vw);
  background: rgba(0, 0, 0, 0.2);
}

.sv1 {
  height: 100vh;
  min-height: 41.667vw;
  overflow: hidden;
}

.sv1-swiper {
  width: 100%;
  height: 100%;
}

.sv1-swiper .swiper-slide {
  position: relative;
  overflow: hidden;
}

.sv1-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.sv1-mask {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg, rgba(0, 22, 84, 0) 75.89%, rgba(0, 22, 84, 0.5) 100%),
    linear-gradient(85.69deg, rgba(0, 22, 84, 0.8) 2.16%, rgba(2, 20, 73, 0) 127.44%);
  z-index: 1;
}

.sv1-content {
  position: absolute;
  left: 6.25vw;
  bottom: 8.594vw;
  z-index: 2;
  width: 51.823vw;
}

.sv1-pagination {
  position: absolute;
  bottom: 2.083vw;
  left: 0;
  width: 100%;
  text-align: center;
  z-index: 10;
}

.sv1-pagination .swiper-pagination-bullet {
  width: 2.604vw;
  height: 0.208vw;
  border-radius: 0;
  background: rgba(255, 255, 255, 0.4);
  opacity: 1;
  margin: 0 0.26vw;
  transition: all .3s;
}

.sv1-pagination .swiper-pagination-bullet-active {
  background: var(--yellow);
  width: 3.646vw;
}

.sv1-badge {
  gap: 0.365vw;
  padding: 0.208vw 0.625vw;
  background: rgba(5, 75, 250, 0.2);
  border: 0.052vw solid rgba(5, 75, 250, 0.3);
  border-radius: 520.781vw;
  display: inline-flex;
}

.badge-dot {
  width: 0.365vw;
  height: 0.365vw;
  background: var(--color);
  border-radius: 50%;
  display: block;
  animation: pulse 2s infinite;
}

@keyframes pulse {

  0%,
  100% {
    opacity: 1;
  }

  50% {
    opacity: 0.5;
    background: var(--yellow);
  }
}

.badge-text {
  color: var(--yellow);
  letter-spacing: 0.052vw;
  text-transform: uppercase;
}

.sv1-title {
  margin-top: 1.042vw;
  color: #fff;
  line-height: 1;
  letter-spacing: -0.164vw;
}

.sv1-title .yellow {
  color: var(--yellow);
}

.sv1-desc {
  margin-top: 1.406vw;
  color: #cbd5e1;
  line-height: 1.4;
  max-width: 17.917vw;
}

.sv1-btns {
  margin-top: 1.875vw;
  gap: 0.729vw;
}

.btn-primary {
  display: inline-flex;
  padding: 0.677vw 1.823vw;
  background: var(--color);
  color: #fff;
  letter-spacing: 0.055vw;
  text-transform: uppercase;
  gap: 0.365vw;
  box-shadow: 0 1.042vw 1.302vw -0.26vw rgba(30, 58, 138, 0.2), 0 0.417vw 0.521vw -0.313vw rgba(30, 58, 138, 0.2);
  transition: all .3s;
}

.btn-primary img {
  width: 0.729vw;
  height: 0.729vw;
}

.btn-primary:hover {
  background: #2563eb;
  transform: translateY(-0.104vw);
}

.btn-ghost {
  padding: 0.677vw 1.875vw;
  border: 0.052vw solid rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(0.104vw);
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  letter-spacing: 0.055vw;
  text-transform: uppercase;
  transition: all .3s;
}

.btn-ghost:hover {
  background: rgba(255, 255, 255, 0.2);
}

.sv2 {
  padding: 5.208vw 6.25vw 2.6042vw;
  background: #f0f4f8;
}

.sv2-logo {
  width: 15.365vw;
  margin: 0 auto 1.042vw;
}

.sv2-title {
  color: var(--dark);
  text-transform: uppercase;
  letter-spacing: -0.055vw;
  font-family: var(--f-inter);
}

.sv2-desc {
  max-width: 45.104vw;
  margin: 0.938vw auto 0;
  color: #64748b;
  line-height: 1.5;
  font-family: var(--f-inter);
  letter-spacing: -0.055vw;
}

.sv3 {
  height: 42.188vw;
  overflow: hidden;
}

.sv3-wrap {
  height: 100%;
}

.sv3-ev {
  width: 50%;
  height: 100%;
  overflow: hidden;
  padding: 4.531vw 4.479vw;
}

.sv3-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.sv3-overlay {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.sv3-left .sv3-overlay {
  background: linear-gradient(-74.8deg, rgba(0, 0, 0, 0) 6.4%, rgb(0, 0, 0) 90%);
}

.sv3-right .sv3-overlay {
  background: linear-gradient(-70.11deg, rgba(0, 0, 0, 0.2) 67.8%, rgb(0, 0, 0) 84.87%);
}

.sv3-cat-title {
  position: relative;
  z-index: 2;
  color: #fff;
  font-family: var(--f-inter);
}

.sv3-sub-list {
  position: relative;
  z-index: 2;
  margin-top: 2.0833vw;
  font-family: var(--f-inter);
}

.sv3-sub-item {
  margin-bottom: 0.833vw;
}

.sv3-sub-item a {
  color: rgba(255, 255, 255, 1);
  transition: all .3s;
}

.sv3-sub-item.on a {
  color: var(--yellow);
  font-size: 1.5625vw;
  font-weight: bold;
}

.sv3-sub-item:hover a {
  color: var(--yellow);
}

.sv3-arrow {
  margin-left: 0.833vw;
}

.sv3-product-img {
  width: 10.9896vw;
  margin-top: 2.7604vw;
  position: relative;
  z-index: 2;
  mix-blend-mode: plus-lighter;
}

.sv3-product-img img {
  width: 100%;
  display: none;
}

.sv4 {
  padding: 6.25vw 0;
}

.sv4-wrap {
  padding: 0 6.25vw;
}

.sv4-head {
  margin-bottom: 3.125vw;
  align-items: flex-start;
}

.sv4-head-left {
  max-width: 36.458vw;
}

.sv4-sub,
.sv5-sub,
.sv6-sub,
.sv7-sub,
.sv8-sub,
.sv9-sub {
  color: var(--color);
  margin-bottom: 1.094vw;
}

.sv4-title {
  text-transform: uppercase;
  letter-spacing: -0.055vw;
  line-height: 1;
}

.sv4-head-right {
  max-width: 30.781vw;
  margin-top: 2.6042vw;
}

.sv4-head-desc {
  color: #64748b;
  line-height: 1.4;
  margin-bottom: 1.458vw;
}

.sv4-cards {
  gap: 1.042vw;
}

.sv4-card {
  padding: 1.563vw 1.823vw;
  background: #fbfcfd;
  min-height: 17.188vw;
  transition: all .3s;
}

.sv4-card.first {
  background: var(--color);
}

.sv4-card.first .sv4-card-title,
.sv4-card.first .sv4-card-desc {
  color: #fff;
}

.sv4-icon {
  width: 2.0833vw;
  height: 2.0833vw;
  margin-bottom: 3.333vw;
}

.sv4-card-title {
  color: var(--color);
  margin-bottom: 2.708vw;
  line-height: 1.5;
}

.sv4-card-desc {
  color: var(--color);
  line-height: 1.5;
}

.sv4-card:hover {
  background: var(--color);
}

.sv4-card:hover .sv4-card-title,
.sv4-card:hover .sv4-card-desc {
  color: #fff;
}

.sv4-card:hover .sv4-icon svg rect,
.sv4-card:hover .sv4-icon svg path,
.sv4-card:hover .sv4-icon svg circle {
  stroke: #fff;
}

.sv5 {
  padding: 5.208vw 6.25vw 0;
}

.sv5-head {
  margin-bottom: 2.396vw;
  align-items: flex-end;
}

.sv5-title {
  text-transform: uppercase;
  letter-spacing: -0.055vw;
  line-height: 1;
}

.sv5-body {
  align-items: flex-start;
  position: relative;
  z-index: 2;
}

.sv5-info {
  width: 45%;
}

.sv5-head-left {
  width: 34.5313vw;
}

.sv5-info-desc {
  color: #64748b;
  line-height: 1.4;
  width: 36.1458vw;
}

.sv5-map {
  width: 50%;
}

.sv5-map-img {
  width: 100%;
  margin: -7.3958vw 0 -2.0833vw;
  z-index: 0;
}

.sv5-stats {
  margin-top: 2.083vw;
}

.sv5-stat-num {
  color: var(--color);
  letter-spacing: -0.055vw;
  text-transform: uppercase;
  line-height: 1;
  margin-bottom: 1.094vw;
}

.sv5-stat-label {
  color: #64748b;
  font-family: var(--f-inter);
}

.sv6 {
  padding: 0 6.25vw 5.9375vw;
}

.sv7 {
  padding: 0 6.25vw 10.9375vw;
}

.sv6-head,
.sv7-head {
  margin-bottom: 2.083vw;
}

.sv6-sub,
.sv7-sub {
  font-family: var(--f-noto);
}

.sv6-title,
.sv7-title {
  text-transform: uppercase;
  letter-spacing: -0.055vw;
  line-height: 1;
  margin-top: 0.521vw;
  font-family: var(--f-oswald);
}

.sv6-desc,
.sv7-desc {
  color: #64748b;
  line-height: 1.4;
  margin-top: 1.042vw;
  max-width: 42.448vw;
  font-family: var(--f-inter);
}

.sv6-list {
  gap: 1.4583vw 2.0833vw;
}

.sv6-item {
  display: block;
}

.sv6-img {
  background: #fbfcfd;
  padding: 1.042vw 2.604vw;
  overflow: hidden;
}

.sv6-img img {
  width: 100%;
  margin: 0 auto;
}

.sv6-info {
  padding-top: 1.354vw;
}

.sv6-cat {
  color: #2563eb;
  font-family: var(--f-noto);
  display: -webkit-box;
  display: box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.sv6-name {
  color: var(--dark);
  text-transform: uppercase;
  letter-spacing: -0.055vw;
  line-height: 1.5;
  font-family: var(--f-oswald);
  display: -webkit-box;
  display: box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.sv8 {
  height: 48.021vw;
  overflow: hidden;
}

.sv8-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.sv8-overlay {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to right, rgba(30, 58, 138, 0.8) 0%, rgba(30, 58, 138, 0) 50%);
  z-index: 1;
}

.sv8-content {
  position: relative;
  z-index: 2;
  padding: 14.896vw 6.25vw 0;
  max-width: 36.458vw;
}

.sv8-sub {
  color: #fff;
}

.sv8-title {
  color: #fff;
  text-transform: uppercase;
  letter-spacing: -0.055vw;
  line-height: 1;
  margin-top: 0.99vw;
}

.sv8-desc {
  color: #fff;
  line-height: 1.4;
  margin-top: 2.604vw;
  max-width: 30.781vw;
}

.sv8-content .btn-primary {
  margin-top: 2.604vw;
}

.sv9 {
  overflow: hidden;
}

.sv9-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.sv9-content {
  position: relative;
  z-index: 1;
  padding: 5.8854vw 6.25vw 0;
  align-items: flex-start;
}

.nofoot-form .sv9-content {
  display: none;
}

.sv9-left {
  max-width: 36.458vw;
}

.sv9-sub {
  color: var(--yellow);
}

.sv9-title {
  color: #fff;
  text-transform: uppercase;
  letter-spacing: -0.055vw;
  line-height: 1;
  margin-top: 2.135vw;
}

.sv9-desc {
  color: #fff;
  margin-top: 0.99vw;
}

.sv9-right {
  width: 29.219vw;
  margin-right: 8.4375vw;
}

.sv9-form-title {
  color: #fff;
  text-transform: uppercase;
  margin-bottom: 1.563vw;
  font-family: var(--f-inter);
}

.form-row {
  margin-top: 2.6042vw;
  gap: 1.25vw;
}

.form-group {
  flex: 1;
  position: relative;
}

.form-group.full {
  width: 100%;
}

.form-group label {
  display: block;
  color: #fff;
  font-family: var(--f-inter);
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  transition: all .3s;
}

.form-group.active label {
  top: -0.2vw;
  transform: translateY(-100%);
  opacity: 0.7;
}

.form-group input {
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 0.052vw solid rgba(255, 255, 255, 0.3);
  color: #fff;
  padding: 0.417vw 0;
  transition: border-color .3s;
}

.form-group input:focus {
  border-bottom-color: var(--yellow);
}

.btn-submit {
  padding: 0.938vw 1.823vw;
  background: #2563eb;
  color: #fff;
  border: none;
  cursor: pointer;
  letter-spacing: 0.055vw;
  text-transform: uppercase;
  box-shadow: 0 1.042vw 1.302vw -0.26vw rgba(30, 58, 138, 0.2), 0 0.417vw 0.521vw -0.313vw rgba(30, 58, 138, 0.2);
  transition: all .3s;
  margin-top: 1.0417vw;
}

.btn-submit:hover {
  background: var(--color);
  transform: translateY(-0.104vw);
}

footer {
  position: relative;
}

.foot1 {
  padding: 6.5625vw 6.25vw 2.4479vw;
  color: #fff;
  position: relative;
  z-index: 2;
}

.foot-top {
  align-items: flex-start;
}

.foot-logo-img {
  width: 7.344vw;
}

.foot-nav {
  flex: 1;
  min-width: 0;
  gap: 6.208vw;
  margin-left: 7.0833vw;
}

.col-title {
  color: var(--yellow);
  text-transform: uppercase;
  letter-spacing: 0.055vw;
  margin-bottom: 2.344vw;
}

.col-list {
  list-style: none;
}

.col-list li {
  margin-bottom: 1.563vw;
}

.col-list li a {
  color: #fff;
  opacity: 0.8;
  transition: opacity .3s;
}

.col-list li a:hover {
  opacity: 1;
  color: var(--yellow);
}

.foot-col:nth-child(1) {
  margin-right: auto;
}

.foot-contact .contact-list {
  display: flex;
  flex-direction: column;
  gap: 1.615vw;
}

.contact-item {
  gap: 0.677vw;
}

.contact-icon {
  width: 1.667vw;
  flex-shrink: 0;
}

.contact-item p {
  opacity: 0.7;
}

.contact-item .txt {
  flex: 1;
  min-width: 0;
}

.contact-item a {
  color: #fff;
  font-family: var(--f-inter);
}

.contact-item a:hover {
  color: var(--yellow);
}

.foot1 .qr-wrap {
  gap: 1.875vw;
  margin-top: 2.604vw;
}

.foot1 .qr-item {
  gap: 0.833vw;
}

.foot1 .qr-item .qr-icon {
  width: 1.666vw;
}

.foot1 .qr-item .qr-icon img {
  width: 100%;
}

.foot1 .qr-item .qr-label {
  color: #fff;
  font-family: var(--f-noto);
}

.foot1 .qr-item .qr-value {
  color: #fff;
  font-family: var(--f-inter);
  margin: 0 0 0.416vw;
}

.foot1 .qr-item .qr-code {
  width: 7.812vw;
  height: 7.812vw;
}

.foot-bottom {
  padding-top: 5.2083vw;
}

.foot-bottom p {
  opacity: 0.7;
}

.foot-social {
  gap: 0.417vw;
  margin-left: 7.2917vw;
}

.social-icon {
  width: 2.188vw;
  height: 2.188vw;
  background: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .3s;
}

.social-icon img {
  width: 0.833vw;
  height: 0.833vw;
  transition: all ease .3s;
}

.social-icon:hover {
  background: var(--color);
}

.social-icon:hover img {
  filter: brightness(0) invert(1);
}

.foot-links {
  gap: 1.094vw;
  text-transform: capitalize;
}

.foot-links a {
  color: #fff;
  opacity: 0.7;
}

.foot-links a:hover {
  opacity: 1;
  color: var(--yellow);
}

body.about-page {
  font-family: var(--f-calibri);
  color: var(--dark);
}

.blue {
  color: #2563eb;
}

.yellow {
  color: var(--yellow);
}

.ab1 {
  height: 50vw;
  min-height: 41.667vw;
  overflow: hidden;
}

.ab1-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.ab1-mask {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, rgba(0, 22, 84, 0.8) 0%, rgba(0, 22, 84, 0) 60%);
  z-index: 1;
}

.ab1-content {
  position: absolute;
  left: 12.5vw;
  top: 13.594vw;
  z-index: 2;
  width: 39.896vw;
}

.ab1-badge {
  display: inline-block;
  padding: 0.208vw 0.625vw;
  background: #2563eb;
  color: #fff;
}

.ab1-title {
  margin-top: 0.521vw;
  color: #fff;
  line-height: 1.5;
  font-family: var(--f-noto);
}

.ab1-desc {
  margin-top: 0.521vw;
  color: #fff;
  line-height: 1.5;
  font-family: var(--f-inter);
}

.ab1-desc p {
  margin-bottom: 0;
}

.ab1-safe-up {
  position: absolute;
  left: 6.25vw;
  bottom: 6.25vw;
  z-index: 2;
  width: 15.365vw;
  overflow: hidden;
  height: 3.698vw;
}

.ab1-safe-up img {
  width: 100%;
  position: relative;
  top: -36%;
}

.ab2 {
  padding: 4.427vw 0 0;
  background: #f5f9ff;
  position: relative;
  overflow: hidden;
}

.ab2-wrap {
  padding: 0 12.656vw;
  position: relative;
  z-index: 2;
}

.ab2-head {
  margin-bottom: 5.3646vw;
}

.ab2-sub {
  color: #2563eb;
  margin-bottom: 1.042vw;
  text-transform: uppercase;
  font-family: var(--f-inter);
}

.ab2-title {
  line-height: 1.5;
  font-family: var(--f-inter);
}

.ab2-body {
  align-items: flex-start;
}

.ab2-left {
  width: 43.125%;
}

.ab2-desc {
  color: #64748b;
  line-height: 1.5;
  font-family: var(--f-noto);
}

.ab2-quote {
  margin-top: 2.083vw;
  gap: 0;
}

.ab2-ceo-img {
  width: 4.375vw;
  height: 5.313vw;
  overflow: hidden;
  flex-shrink: 0;
}

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

.ab2-quote-box {
  background: #f1f5f9;
  padding: 2.031vw 1.25vw;
  flex: 1;
  margin-left: 2.0833vw;
}

.ab2-quote-box p {
  color: #64748b;
  line-height: 1.5;
  font-family: var(--f-inter);
}

.ab2-right {
  width: 43.056%;
}

.ab2-logo {
  width: 15.365vw;
  overflow: hidden;
  margin-bottom: 1.25vw;
}

.ab2-logo img {
  width: 100%;
}

.ab2-right-desc {
  color: #64748b;
  line-height: 1.5;
  font-family: var(--f-noto);
}

.ab2-timeline {
  position: relative;
  padding: 12.7604vw 0.521vw 8.5417vw;
}

.ab2-bg {
  position: absolute;
  left: 0;
  bottom: -20%;
  width: 100%;
}

.timeline-line {
  width: 100%;
  height: 0.4167vw;
  background: url('/img/about/ab2-timeline.svg');
}

.timeline-items {
  position: relative;
  z-index: 1;
  align-items: center;
}

.timeline-item {
  position: relative;
}

.timeline-item .box {
  position: absolute;
  left: 50%;
  transform: translate(-50%, 0);
  width: 17.708vw;
  display: flex;
  flex-direction: column;
}

.timeline-item.up .box {
  bottom: 0;
}

.timeline-item:not(.up) .box {
  top: -0.9375vw;
}

.timeline-dot-top,
.timeline-dot-bottom {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.573vw;
}

.timeline-line-v {
  display: block;
  width: 0.104vw;
  height: 0.938vw;
  background: #2563eb;
}

.timeline-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #dbeafe;
  color: #1d4ed8;
  padding: 0.104vw 0.99vw;
  border-radius: 52.031vw;
  height: 1.458vw;
  font-family: var(--f-inter);
}

.timeline-text {
  color: #0f172a;
  line-height: 1.5;
  font-family: var(--f-inter);
}

.timeline-item.up .timeline-text {
  order: 0;
}

.timeline-item.up .timeline-dot-bottom {
  order: 1;
  display: flex;
  flex-direction: column-reverse;
}

.ab3 {
  flex-wrap: nowrap;
}

.ab3-item {
  width: 50%;
  height: 12.5vw;
  overflow: hidden;
}

.ab3-info {
  position: absolute;
  left: 0.833vw;
  bottom: 0.833vw;
  z-index: 2;
  color: #fff;
}

.ab3-info p {
  font-family: var(--f-noto);
  line-height: 1.5;
}

.ab3-logo {
  width: 3.438vw;
  height: 4.167vw;
  overflow: hidden;
  margin-bottom: 0.417vw;
}

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

.ab3-safe-logo {
  width: 15.365vw;
  height: 3.021vw;
  overflow: hidden;
  margin-bottom: 0.417vw;
}

.ab3-safe-logo img {
  width: 100%;
  position: relative;
  top: -36%;
}

.ab4 {
  padding: 4.167vw 0 4.375vw;
  background: linear-gradient(to bottom, #f5f9ff 0%, #fff 50%);
}

.ab4-wrap {
  padding: 0 12.5vw;
}

.ab4-head {
  margin-bottom: 2.083vw;
}

.ab4-sub {
  color: #2563eb;
  margin-bottom: 1.042vw;
  font-family: var(--f-inter);
}

.ab4-title {
  line-height: 1.5;
  font-family: var(--f-inter);
}

.ab4-certs {
  gap: 1.5vw;
}

.ab4-cert-item {
  height: 6vw;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.ab4-cert-item img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.ab5 {
  background: #262d3f;
  padding: 5.521vw 0 5.9896vw;
}

.ab5-wrap {
  padding: 0 12.5vw;
}

.ab5-head {
  margin-bottom: 4.167vw;
}

.ab5-sub {
  color: #2563eb;
  margin-bottom: 1.042vw;
  font-family: var(--f-inter);
}

.ab5-title {
  color: #fff;
  line-height: 1.5;
  font-family: var(--f-noto);
  margin-bottom: 0.521vw;
}

.ab5-desc {
  color: #fff;
  line-height: 1.5;
  font-family: var(--f-inter);
}

.ab5-steps {}

.ab5-step {
  background: rgba(255, 255, 255, 0.05);
  border: 0.052vw solid rgba(255, 255, 255, 0.1);
  border-radius: 0.729vw;
  padding: 1.094vw 1.354vw;
  width: 13.183vw;
  flex-shrink: 0;
}

.ab5-step-icon {
  width: 2.552vw;
  height: 2.552vw;
  background: rgba(37, 99, 235, 0.2);
  border-radius: 0.547vw;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.042vw;
}

.ab5-step-icon img {
  width: 1.276vw;
  height: 1.276vw;
}

.ab5-step-title {
  color: #fff;
  line-height: 1.5;
  font-family: var(--f-inter);
}

.ab5-step-arrow {
  display: flex;
  align-items: center;
  padding: 0 0.521vw;
  flex-shrink: 0;
  height: 8.333vw;
}

.ab5-step-arrow img {
  width: 0.729vw;
}

.ab6 {
  height: 38.802vw;
  overflow: hidden;
}

.ab6-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.ab6-content {
  position: relative;
  z-index: 2;
  padding: 14.896vw 0 0;
  max-width: 62.5vw;
  margin: 0 auto;
}

.ab6-sub {
  color: #fff;
  margin-bottom: 1.042vw;
  font-family: var(--f-noto);
}

.ab6-title {
  color: #fff;
  text-transform: uppercase;
  letter-spacing: -0.055vw;
  line-height: 1;
  font-family: var(--f-noto);
}

.ab6-desc {
  color: #fff;
  line-height: 1.5;
  margin-top: 0.521vw;
  font-family: var(--f-noto);
  max-width: 41.823vw;
  margin-left: auto;
  margin-right: auto;
}

.C-banner {
  height: 27.239vw;
  overflow: hidden;
  position: relative;
}

.C-banner .bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.C-banner .mask {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, rgba(11, 35, 76, 1) 0%, rgba(26, 82, 178, 0) 100%);
  z-index: 1;
}

.C-banner .banner-title {
  position: absolute;
  left: 50%;
  bottom: 5.208vw;
  transform: translateX(-50%);
  color: #fff;
  text-align: center;
  z-index: 2;
  font-family: var(--f-noto);
}

.C-btn1 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 1.822vw;
  height: 2.656vw;
  font-family: var(--f-inter);
  transition: all .3s;
  gap: 0.52vw;
  background: #2563eb;
  color: #fff;
  border-color: #2563eb;
}

.C-btn1 .icon {
  width: 0.729vw;
  height: 0.729vw;
  transition: all .3s;
  filter: brightness(0) invert(1);
}

.C-btn1:hover {
  border: 0.052vw solid rgba(37, 99, 235, 0.2);
  background: #fff;
  color: #2563eb;
}

.C-btn1:hover .icon {
  filter: brightness(1) invert(0);
}

.C-btn2 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 1.822vw;
  height: 2.656vw;
  border: 0.052vw solid #2563eb;
  background: #dbeafe;
  color: #2563eb;
  font-family: var(--f-noto);
  transition: all .3s;
}

.C-btn2:hover {
  background: #054bfa;
  color: #fff;
  border-color: #054bfa;
}

.C-more1 {
  gap: 0.52vw;
  color: #2563eb;
  font-family: var(--f-inter);
  text-transform: uppercase;
  letter-spacing: 0.054vw;
  transition: all .3s;
}

.C-more1 .icon {
  width: 0.729vw;
  height: 0.729vw;
}

.C-more1:hover {
  opacity: 0.7;
}

.pd1 {
  height: 27.239vw;
  overflow: hidden;
  position: relative;
}

.pd1 .bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.pd1 .mask {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, rgba(0, 22, 84, 0.8) 0%, rgba(0, 22, 84, 0) 60%);
  z-index: 1;
}

.pd1 .content {
  position: absolute;
  left: 12.708vw;
  bottom: 2.604vw;
  z-index: 2;
  max-width: 34.375vw;
}

.pd1 .content .badge {
  display: inline-block;
  padding: 0.26vw 0.729vw;
  color: #93C5FD;
  text-transform: uppercase;
  font-family: var(--f-inter);

  border-radius: 520.781vw;
  border: 0.052vw solid rgba(96, 165, 250, 0.30);
  background: rgba(59, 130, 246, 0.10);
}

.pd1 .content h1 {
  margin-top: 0.52vw;
  color: #fff;
  line-height: 1.2;
  font-family: var(--f-inter);
}

.pd1 .content h1 .yellow {
  color: var(--yellow);
}

.pd1 .content .desc {
  margin-top: 0.52vw;
  color: #cbd5e1;
  line-height: 1.5;
  font-family: var(--f-inter);
}

.pd1 .scroll-tip {
  position: absolute;
  left: 50%;
  bottom: 1.822vw;
  transform: translate(-50%, 0);
  color: rgba(255, 255, 255, 0.40);
  letter-spacing: 0.104vw;
}

.pd1 .scroll-tip .icon {
  width: 0.52vw;
  margin-left: 0.26vw;
}

.pd2 {
  background: #ecf0f8;
  padding: 4.166vw 0 5.208vw;
}

.pd2-wrap {
  padding: 0 12.5vw;
}

.pd2-breadcrumb {
  gap: 0.52vw;
  margin-bottom: 3.125vw;
  font-family: var(--f-noto);
}

.pd2-breadcrumb .sep {
  width: 1.25vw;
  height: 1.25vw;
}

.pd2-breadcrumb .active {
  color: #2563eb;
}

.pd2-body {
  gap: 3.125vw;
  align-items: flex-start;
  position: relative;
}

.pd2-left {
  width: 21.875vw;
  /* background: rgba(219, 234, 254, 0.5); */
  background: #fff;
  padding: 0 0.52vw 0.52vw;
  flex-shrink: 0;
  /* position: sticky;
  left: 0;
  top: 0; */
}

.pd2-left .level1 {
  gap: 0.885vw;
  padding: 0.781vw 0;
  cursor: pointer;
}

.pd2-left .level1 .title {
  color: #2563eb;
  font-family: var(--f-noto);
}

.pd2-left .level1 .arrow {
  width: 1.25vw;
  height: 1.25vw;
  transition: all .3s;
}

.pd2-left .level1.on .arrow {
  transform: rotate(90deg);
}

.pd2-left .level1-children {
  display: none;
}

.pd2-left .level1.on+.level1-children {
  display: block;
}

.pd2-left .level2 {
  padding: 0.677vw 1.25vw;
  height: 3.125vw;
  background: #f8fafc;
  border-bottom: 0.026vw solid rgba(119, 136, 175, 0.5);
  cursor: pointer;
  transition: all .3s;
  font-family: var(--f-noto);
}

.pd2-left .level2 .name {
  color: #56678f;
}

.pd2-left .arrow {
  width: 1.25vw;
  height: 1.25vw;
  transition: all .3s;
  background: url('/img/product/pd2-zuo-jt.svg') no-repeat center/contain;
}

.pd2-left .on .arrow {
  background: url('/img/product/pd2-zuo-jt-h.svg') no-repeat center/contain;
}

.pd2-left .level2.on,
.pd2-left .level2:hover {
  background: #dbeafe;
  border-bottom: 0.052vw solid rgba(37, 99, 235, 0.5);
}

.pd2-left .level2.on .name {
  color: #2563eb;
  font-weight: bold;
}

.pd2-left .level2.on .arrow {
  transform: rotate(90deg);
}

.pd2-left .level3-list {
  display: none;
}

.pd2-left .level2.on+.level3-list {
  display: block;
}

.pd2-left .level3 {
  padding: 0.677vw 1.25vw 0.677vw 3.385vw;
  height: 3.125vw;
  background: #f8fafc;
  border-bottom: 0.026vw solid rgba(119, 136, 175, 0.5);
  cursor: pointer;
  transition: all .3s;
  font-family: var(--f-noto);
}

.pd2-left .level3 .name {
  color: #56678f;
}

.pd2-left .level3.on {
  background: #eaf3ff;
  /* border-bottom: 0.052vw solid #2563eb; */
}

.pd2-left .level3.on .name {
  color: #2563eb;
  font-weight: 500;
}

.level3 .arrow {
  display: none;
}

.pd2-right {
  flex: 1;
  min-width: 0;
}

.pd2-search {
  margin-bottom: 0.833vw;
}

.pd2-search-box {
  width: 15.625vw;
  padding: 0.312vw 0.885vw;
  background: #EAF3FF;
  border: 0.052vw solid #2563eb;
}

.pd2-search-icon {
  width: 1.041vw;
  height: 1.041vw;
}

.pd2-search-input {
  margin-left: 1.562vw;
  flex: 1;
  min-width: 0;
  background: transparent;
  border: none;
  color: #0f172a;
  font-family: var(--f-inter);
}

.pd2-search-input::placeholder {
  color: #94a3b8;
}

.pd2-list {
  gap: 2.083vw 2.5vw;
}

.pd2-item {
  background: #fff;
  transition: all .3s;
  position: relative;
}

.pd2-item:hover {
  box-shadow: 0 0.52vw 1.562vw rgba(30, 58, 138, 0.1);
}

.pd2-item .pic {
  overflow: hidden;
}

.pd2-item .pic img {
  width: 100%;
  transition: all .6s;
}

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

.pd2-item .info {
  padding: 1.041vw;
}

.pd2-item .name {
  color: #0f172a;
  font-family: var(--f-oswald);
  text-transform: uppercase;
  letter-spacing: -0.026vw;
  line-height: 1.3;
  margin-bottom: 0.625vw;
}

.pd2-item .t1 {
  position: absolute;
  left: 0.729vw;
  top: 0.729vw;
  color: #1E3A8A;
  padding: 0.104vw 0.52vw;
  border: 0.052vw solid #E2E8F0;
  background: rgba(255, 255, 255, 0.90);
  box-shadow: 0 0.052vw 0.104vw 0 rgba(0, 0, 0, 0.05);
  backdrop-filter: blur(0.208vw);
  font-weight: bold;
}

.pd2-item .tags {
  gap: 0.781vw;
  margin-bottom: 0.625vw;
}

.pd2-item .tag {
  padding: 0.104vw 0.416vw;
  color: #1D4ED8;
  font-family: var(--f-inter);

  border-radius: 0.26vw;
  border: 0.052vw solid #DBEAFE;
  background: #EFF6FF;
}

.pd2-item .desc {
  color: #64748b;
  line-height: 1.5;
  font-family: var(--f-inter);
  margin-bottom: 1.041vw;
}

.pd2-item .C-btn1 {
  width: 100%;
}

.pd2-pagination {
  margin-top: 3.125vw;
  gap: 1.302vw;
}

.pd2-pagination .load-more {
  width: 10.156vw;
  height: 2.656vw;
  background: #054bfa;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.364vw;
  text-transform: uppercase;
  letter-spacing: 0.054vw;
  font-family: var(--f-noto);
  transition: all .3s;
  border: 0.052vw solid #054bfa;
}

.pd2-pagination .load-more .icon {
  width: 0.729vw;
  height: 0.729vw;
  filter: brightness(0) invert(1);
}

.pd2-pagination .load-more:hover {
  background: transparent;
  color: #054bfa;
}

.pd2-pagination .load-more:hover .icon {
  filter: brightness(1) invert(0);
}

.pd2-pagination .page-text {
  color: #2563eb;
  font-family: var(--f-noto);
}

.pd5 {
  position: relative;
  padding: 0 0 3.125vw;
  overflow: hidden;
}

.pd5-bg {
  position: absolute;
  left: -7%;
  top: -4%;
  width: 128%;
  height: 108%;
}

.pd5-wrap {
  position: relative;
  z-index: 2;
  padding: 11.531vw 4.531vw 0 8.333vw;
  gap: 5.841vw;
  /* align-items: flex-end; */
}

.pd5-left {
  justify-content: space-between;
  align-items: flex-start;
  flex: 1;
  min-width: 0;
}

.pd5-thumbs {
  width: 6.666vw;
  flex-shrink: 0;
}

.pd5-thumbs .swiper-button {
  width: 1.145vw;
  height: 1.145vw;
  margin: 0 auto;
  cursor: pointer;
}

.pd5-thumbs-swiper {
  height: 27.76vw;
  margin: 0.364vw 0;
}

.pd5-thumbs-swiper .swiper-slide {
  cursor: pointer;
  height: 6.666vw;
}

.pd5-thumbs-swiper .swiper-slide-thumb-active {
  border-color: #2563eb;
}

.pd5-thumbs-swiper .swiper-slide img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.pd5-main-swiper-wrap {
  width: 38.645vw;
}

.pd5-main-swiper-wrap .swiper {
  width: 100%;
  height: 30.781vw;
}
.pd5-main-swiper-wrap .swiper .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.pd5-main-swiper .swiper-slide {
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0.208vw 0.208vw rgba(0, 0, 0, 0.25);
}

.pd5-main-swiper .swiper-slide img {
  max-width: 90%;
  max-height: 90%;
  object-fit: contain;
}

.pd5-icons {
  margin: 1.25vw auto 0;
  width: 26.458vw;
}

.pd5-right {
  width: 34.687vw;
}

.pd5-right .product-title {
  line-height: 1.1;
  font-family: var(--f-inter);
}

.pd5-right .product-title .blue {
  color: #1e40af;
}

.pd5-right .product-desc {
  margin-top: 2.708vw;
  color: #475569;
  line-height: 1.5;
  font-family: var(--f-inter);
}
.pd5-right .product-desc tr td {
  padding: 0 .8333vw;
}
.pd5-right .sku-title {
  margin-top: 1.25vw;
  font-family: var(--f-inter);
}

.pd5-sku-list {
  gap: 2.083vw;
  margin-top: 1.25vw;
}

.pd5-sku-item {
  cursor: pointer;
  position: relative;
}

.pd5-sku-item .sku-btn {
  width: 10.156vw;
  height: 1.666vw;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #dbeafe;
  border: 0.052vw solid #2563eb;
  color: #2563eb;
  font-family: var(--f-noto);
  box-shadow: 0 1.041vw 1.302vw -0.26vw rgba(30, 58, 138, 0.05), 0 0.416vw 0.52vw -0.312vw rgba(30, 58, 138, 0.2);
  transition: all .3s;
}

.pd5-sku-item .sku-img {
  width: 10.156vw;
  height: 7.76vw;
  margin-top: 0.416vw;
  background: rgba(255, 255, 255, 0.5);
  box-shadow: 0 0.208vw 0.208vw rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
}

.pd5-sku-item .sku-img img {
  max-width: 90%;
  max-height: 90%;
  object-fit: contain;
}

.pd5-sku-item.on .sku-btn,
.pd5-sku-item:hover .sku-btn {}

.pd5-btns {
  margin-top: 1.25vw;
  gap: 0.781vw;
}

.pd5-btns .C-btn1 {
  width: 9.895vw;
  padding: 0;
  box-shadow: 0 1.041vw 1.302vw -0.26vw rgba(30, 58, 138, 0.20), 0 0.416vw 0.52vw -0.312vw rgba(30, 58, 138, 0.20);
}

.pd5-btns .C-btn2 {
  width: 7.5vw;
  box-shadow: 0 1.041vw 1.302vw -0.26vw rgba(30, 58, 138, 0.20), 0 0.416vw 0.52vw -0.312vw rgba(30, 58, 138, 0.20);
}

.pd6 {
  position: relative;
  padding: 2.343vw 0 4.166vw;
}
.pd6 .pic img {

  display: inline-block;
  width: auto;
}
.pd6-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 0;
}

.pd6-wrap {
  position: relative;
  z-index: 1;
  padding: 0 12.5vw;
}
.pd6-wrap img {
  display:inline-block
}
.pd6-section {
  backdrop-filter: blur(0.52vw);
  background: rgba(239, 246, 255, 0.8);
  padding: 0.729vw 1.25vw;
  margin-bottom: 2.083vw;
}
.pd6-section div {
  font-family: var(--f-noto) !important;
}
.pd6-section .section-title {
  color: #0f172a;
  line-height: 1.5;
  font-family: var(--f-noto);
  margin-bottom: 1.25vw;
}

.pd6-spec-table {
  width: 100%;
  /* max-width: 41.666vw; */
  margin: 3.125vw auto 0;
}

.pd6-spec-table .row {
  border-bottom: 0.052vw solid #7788AF;
  padding: 0.416vw 0;
  font-family: var(--f-noto);
}

.pd6-spec-table .row .label {
  color: #000;
}

.pd6-spec-table .row .value {
  color: #2563eb;
  text-align: right;
}

.pd6-lens {
  gap: 1.25vw;
  justify-content: center;
}

.pd6-lens .pic1 {
  width: 30vw;
}

.pd6-lens .pic2 {
  /* flex: 1; */
  min-width: 0;
}

.pd6-pack-list {
  gap: 6.666vw;
  justify-content: center;
  flex-wrap: wrap;
}

.pd6-pack-item {
  /* width: 26.666vw; */
  /* padding: 0 1.25vw 0.416vw; */
  flex-shrink: 0;
}

.pd6-pack-item .pack-header {
  gap: 1.25vw;
  margin-bottom: 0.416vw;
  font-family: var(--f-noto);
}

.pd6-pack-item .pack-header .method-badge {
  color: #1d4ed8;
}

.pd6-pack-item .pack-img {
  /* height: 15.312vw; */
  width: 12.4167vw;
}

.pd6-pack-item .pack-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.pd6-explore {
  margin-top: 3.125vw;
}

.pd6-explore .head {
  margin-bottom: 2.083vw;
}

.pd6-explore .head .title {
  font-family: var(--f-oswald);
  text-transform: uppercase;
  letter-spacing: -0.054vw;
}

.pd6-explore-list {
  gap: 1.25vw;
}

.pd6-explore-item {}

.pd6-explore-item .pic {
  background: #fbfcfd;
  overflow: hidden;
}

.pd6-explore-item .pic img {
  width: 100%;
  transition: all .6s;
}

.pd6-explore-item:hover .pic img {
  transform: scale(1.05);
}

.pd6-explore-item .item-info {
  padding: 0.937vw 0 0;
}

.pd6-explore-item .item-cat {
  color: #2563eb;
  font-family: var(--f-noto);
}

.pd6-explore-item .item-name {
  color: #0f172a;
  font-family: var(--f-oswald);
  text-transform: uppercase;
  letter-spacing: -0.039vw;
  line-height: 1.5;
}

.news1 {
  position: relative;
}

.news2 {
  background: #f5f9ff;
  padding: 4.166vw 0 5.208vw;
}

.news2-wrap {
  padding: 0 12.5vw;
}

.news2-tabs {
  gap: 1.979vw;
  margin-bottom: 2.083vw;
  padding-bottom: 1.302vw;
  border-bottom: 0.104vw solid #8E8E8E;
}

.news2-tabs .tab {
  color: #0f172a;
  font-family: var(--f-inter);
  transition: all .3s;
}

.news2-tabs .tab:hover {
  color: #2563eb;
}

.news2-tabs .tab.on {
  background: #2563eb;
  color: #fff;
  padding: 0 0.677vw;
}

.news2-featured {
  position: relative;
  height: 25.781vw;
  overflow: hidden;
  margin-bottom: 3.125vw;
}

.news2-featured .bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.news2-featured .gradient {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, rgba(30, 58, 138, 0.8) 0%, rgba(30, 58, 138, 0) 100%);
  z-index: 1;
}

.news2-featured .featured-content {
  position: relative;
  z-index: 2;
  padding: 0 4.739vw;
  max-width: 39.791vw;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.news2-featured .featured-title {
  color: #fff;
  font-family: var(--f-inter);
  line-height: 1.4;
}

.news2-featured .featured-title .yellow {
  color: #fee203;
}

.news2-featured .featured-desc {
  margin-top: 2.083vw;
  color: #cbd5e1;
  line-height: 1.5;
  font-family: var(--f-noto);
}

.news2-featured .featured-meta {
  margin-top: 2.083vw;
  gap: 0.677vw;
}

.news2-featured .featured-meta .cat {
  background: rgba(254, 226, 3, 0.1);
  padding: 0.052vw 0;
  width: 7.083vw;
  height: 2.083vw;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fee203;
  font-family: var(--f-inter);
}

.news2-featured .featured-meta .date {
  color: #fee203;
  font-family: var(--f-inter);
  display: flex;
  align-items: center;
}

.news2-list {
  gap: 2.083vw;
}

.news2-item {
  background: #fbfcfd;
  overflow: hidden;
  transition: all .3s;
}

.news2-item:hover {
  box-shadow: 0 0.52vw 1.562vw rgba(30, 58, 138, 0.1);
}

.news2-item .item-inner {
  gap: 4.166vw;
}

.news2-item .item-img {
  width: 45.833vw;
  height: 25.781vw;
  flex-shrink: 0;
  overflow: hidden;
}

.news2-item .item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all .6s;
}

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

.news2-item .item-content {
  flex: 1;
  min-width: 0;
  padding: 2.083vw 2.083vw 2.083vw 0;
}

.news2-item .item-title {
  color: #0f172a;
  font-family: var(--f-inter);
  line-height: 1.4;
  margin-bottom: 1.041vw;
}

.news2-item .item-desc {
  color: #64748b;
  line-height: 1.5;
  font-family: var(--f-inter);
}

.news2-item .item-meta {
  margin-top: 3.645vw;
  gap: 0.677vw;
}

.news2-item .item-meta .cat {
  background: rgba(37, 99, 235, 0.1);
  padding: 0.052vw 0;
  width: 7.083vw;
  height: 2.083vw;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #2563eb;
  font-family: var(--f-inter);
}

.news2-item .item-meta .date {
  color: #2563eb;
  font-family: var(--f-inter);
  display: flex;
  align-items: center;
}

.news2 .pd2-pagination {
  margin-top: 2.083vw;
}

.C-bg-group {
  position: relative;
}

.ct2 {
  padding: 4.427vw 0 0;
}

.ct2-wrap {
  max-width: 52.708vw;
  margin: 0 auto;
  text-align: center;
}

.ct2-badge {
  display: inline-flex;
  padding: 0.312vw 0.781vw;
  background: rgba(59, 130, 246, 0.1);
  border: 0.052vw solid rgba(96, 165, 250, 0.3);
  color: #2563eb;
  text-transform: uppercase;
  font-family: var(--f-inter);
  margin-bottom: 0.52vw;
}

.ct2-title {
  font-family: var(--f-inter);
  line-height: 1.5;
}

.ct2-title .blue {
  color: #3b82f6;
}

.ct2-desc {
  margin-top: 2.343vw;
  color: #000;
  font-family: var(--f-inter);
  line-height: 1.5;
}

.ct3 {
  padding: 4.166vw 0 0;
}

.ct3-wrap {
  padding: 0 12.5vw;
  gap: 4.166vw;
  align-items: flex-start;
}

.ct3-left {
  width: 27.031vw;
  flex-shrink: 0;
}

.ct3-contact-item {
  gap: 1.25vw;
  margin-bottom: 1.25vw;
  padding-left: 5.729vw;
}

.ct3-contact-item .ct-icon {
  width: 2.343vw;
  height: 2.343vw;
  flex-shrink: 0;
}

.ct3-contact-item .ct-label {
  color: #0f172a;
  font-family: var(--f-noto);
  margin-bottom: 0.156vw;
}

.ct3-contact-item .ct-value {
  color: #2563eb;
  font-family: var(--f-inter);
}

.ct3-contact-item .ct-value a {
  color: #2563eb;
  text-decoration: underline;
}

.ct3-qr-wrap {
  gap: 4.166vw;
  margin-top: 1.25vw;
}

.ct3-qr-item {
  gap: 1.25vw;
}

.ct3-qr-item .qr-icon {
  width: 2.343vw;
  height: 2.343vw;
  flex-shrink: 0;
}

.ct3-qr-item .qr-icon img {
  width: 100%;
}

.ct3-qr-item .qr-label {
  color: #0f172a;
  font-family: var(--f-noto);
}

.ct3-qr-item .qr-value {
  color: #2563eb;
  font-family: var(--f-inter);
  margin: 0.416vw 0;
}

.ct3-qr-item .qr-code {
  width: 7.812vw;
  height: 7.812vw;
}

.ct3-right {
  flex: 1;
  min-width: 0;
}

.ct3-right .img-large {
  height: 9.531vw;
  overflow: hidden;
  position: relative;
  margin-bottom: 1.25vw;
}

.ct3-right .img-large .overlay {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.4) 100%);
}

.ct3-right .img-large .label {
  position: absolute;
  right: 1.041vw;
  bottom: 0.625vw;
  color: #fff;
  font-family: var(--f-noto);
}

.ct3-right .img-small-row {
  gap: 1.25vw;
}

.ct3-right .img-small {
  flex: 1;
  height: 9.531vw;
  overflow: hidden;
  position: relative;
}

.ct3-right .img-small img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ct3-right .img-small .overlay {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.4) 100%);
}

.ct3-right .img-small .label {
  position: absolute;
  right: 1.041vw;
  bottom: 0.625vw;
  color: #fff;
  font-family: var(--f-noto);
}

.ct4 {
  padding: 4.166vw 0 5.208vw;
  position: relative;
  z-index: 1;
}

.ct4-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  z-index: -1;
}

.ct4-wrap {
  padding: 0 12.5vw;
  gap: 2.604vw;
  align-items: flex-start;
  position: relative;
  z-index: 1;
}

.ct4-left {
  width: 35.416vw;
  flex-shrink: 0;
}

.ct4-left .section-title {
  font-family: var(--f-noto);
  margin-bottom: 1.406vw;
}

.ct4-form {
  background: rgba(219, 234, 254, 0.5);
  padding: 0.729vw;
}

.ct4-form .form-grid {
  gap: 0.833vw 0.677vw;
}

.ct4-form .form-input {
  width: calc(50% - 0.364vw);
  height: 2.395vw;
  background: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(0.52vw);
  border: none;
  padding: 0 0.677vw;
  color: #0f172a;
  font-family: var(--f-inter);
}

.ct4-form .form-input::placeholder {
  color: #7788af;
}

.ct4-form .form-textarea {
  width: 100%;
  height: 10.833vw;
  background: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(0.52vw);
  border: none;
  padding: 0.677vw;
  color: #0f172a;
  font-family: var(--f-inter);
  resize: none;
}

.ct4-form .form-textarea::placeholder {
  color: #7788af;
}

.ct4-form .form-submit {
  width: 100%;
  height: 2.812vw;
  background: #2563eb;
  color: #fff;
  border: none;
  cursor: pointer;
  font-family: var(--f-noto);
  box-shadow: 0 1.302vw 2.604vw -0.625vw rgba(37, 99, 235, 0.3);
  transition: all .3s;
}

.ct4-form .form-submit:hover {
  background: #054bfa;
}

.ct4-right {
  flex: 1;
  min-width: 0;
}

.ct4-right .section-title {
  font-family: var(--f-noto);
  margin-bottom: 1.406vw;
}

.ct4-order-box {
  background: #fff;
  height: 25.572vw;
  overflow: hidden;
  padding: 1.354vw 0.989vw 0.625vw;
}

.ct4-order-box .order-title {
  text-transform: uppercase;
  font-family: var(--f-noto);
  margin-bottom: 0.625vw;
  padding-bottom: 0.625vw;
  border-bottom: 0.052vw solid #e2e8f0;
}

.ct4-order-table {
  width: 100%;
}

.ct4-order-table .thead {
  margin-bottom: 0.416vw;
  font-family: var(--f-noto);
  text-transform: capitalize;
}

.ct4-order-table .thead .th-product {
  flex: 1;
}

.ct4-order-table .thead .th-qty {
  width: 5.416vw;
  text-align: center;
}

.ct4-order-table .thead .th-action {
  width: 9.375vw;
  text-align: center;
}

.ct4-order-table .tbody {
  max-height: 17.708vw;
  overflow-y: auto;
}

.ct4-order-row {
  background: #f4f7ff;
  height: 2.916vw;
  padding: 0.416vw 2.604vw 0.416vw 0.625vw;
  margin-bottom: 0.416vw;
}

.ct4-order-row .row-img {
  width: 2.083vw;
  height: 2.083vw;
  background: #fff;
  overflow: hidden;
  flex-shrink: 0;
}

.ct4-order-row .row-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ct4-order-row .row-name {
  flex: 1;
  min-width: 0;
  margin-left: 0.625vw;
  text-transform: uppercase;
  font-family: var(--f-noto);
}

.ct4-order-row .row-qty {
  gap: 0;
  flex-shrink: 0;
}

.ct4-order-row .qty-btn {
  width: 1.562vw;
  height: 1.562vw;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #0f172a;
  font-family: var(--f-poppins);
  user-select: none;
  transition: all .3s;
}

.ct4-order-row .qty-btn:hover {
  color: #2563eb;
}

.ct4-order-row .qty-num {
  color: #2563eb;
  font-family: var(--f-poppins);
  min-width: 1.562vw;
  text-align: center;
  margin: 0 1.041vw;
}

.ct4-order-row .row-remove {
  margin-left: 2.083vw;
  width: 2.812vw;
  text-align: center;
  border-bottom: 0.052vw solid #000;
  cursor: pointer;
  font-family: var(--f-poppins);
  text-transform: uppercase;
  flex-shrink: 0;
  transition: all .3s;
}

.ct4-order-row .row-remove:hover {
  color: #ef4444;
  border-color: #ef4444;
}

.ct4-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 2.083vw;
}

.ct4-empty .empty-text {
  color: #2563eb;
  text-transform: uppercase;
  font-family: var(--f-noto);
}

.legal-banner {
  width: 100%;
  height: 20.833vw;
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}

.legal-banner::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle at 30% 50%, rgba(255, 204, 0, 0.05) 0%, transparent 50%),
    radial-gradient(circle at 70% 80%, rgba(255, 204, 0, 0.03) 0%, transparent 40%);
}

.legal-banner-title {
  color: #fff;
  letter-spacing: 0.625vw;
  text-transform: uppercase;
  position: relative;
  z-index: 1;
}

.legal-banner-title span {
  color: #FFCC00;
}

.legal-content {
  max-width: 50vw;
  margin: 0 auto;
  padding: 4.167vw 1.042vw 6.25vw;
}

.legal-intro {
  color: rgba(0, 0, 0, 0.65);
  line-height: 2;
  margin-bottom: 3.125vw;
  padding-bottom: 2.083vw;
  border-bottom: 1px solid #eee;
}

.privacy-section {
  margin-bottom: 2.083vw;
}

.privacy-section__title {
  color: #1a1a2e;
  padding-left: 0.833vw;
  border-left: 4px solid #FFCC00;
  margin-bottom: 0.833vw;
  line-height: 1.2;
}

.privacy-section__text {
  color: rgba(0, 0, 0, 0.7);
  line-height: 1.8;
  padding-left: 1.042vw;
}