* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

@font-face {
  font-family: "HarmonyOS Sans SC";
  src: url("HarmonyOS_Sans_SC_Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

/* Light - 300 */
@font-face {
  font-family: "HarmonyOS Sans SC";
  src: url("HarmonyOS_Sans_SC_Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

/* Regular - 400 */
@font-face {
  font-family: "HarmonyOS Sans SC";
  src: url("HarmonyOS_Sans_SC_Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Medium - 500 */
@font-face {
  font-family: "HarmonyOS Sans SC";
  src: url("HarmonyOS_Sans_SC_Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* Bold - 700 */
@font-face {
  font-family: "HarmonyOS Sans SC";
  src: url("HarmonyOS_Sans_SC_Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Black - 900 */
@font-face {
  font-family: "HarmonyOS Sans SC";
  src: url("HarmonyOS_Sans_SC_Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: "HarmonyOS Sans SC", sans-serif !important;
  font-weight: 400;
  /* 常规 */
  /* font-weight: 500; 中等粗细 */
  /* font-weight: 700; 粗体 */
}


img {
  max-width: 100%;
  height: auto;
  object-fit: cover;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  transition: all 0.5s ease;
  user-select: none;
}

a {
  transition: all 0.5s ease;
}

.pic {
  line-height: 0;
  overflow: hidden;
}

.pic img {
  transition: all 0.5s ease;
  width: 100%;
}

body {
  float: left;
  width: 100%;
  scroll-behavior: smooth;
}

.wapshoww {
  display: none !important;
}

.nbanner {
  width: 100%;
  position: relative;
}

.nbanner img {
  width: 100%;
}

img {
  border: 0;
}

.max-width {
  width: 1635px;
  margin: 0 auto;
}

html {
  scrollbar-width: thin;
  scrollbar-color: #151a7b rgba(255, 255, 255, 0.75);
}

html::-webkit-scrollbar {
  width: 8px;
}

html::-webkit-scrollbar-thumb {
  background-color: #151a7b;
  border-radius: 8px;
}

@media screen and (max-width: 1700px) {
  .max-width {
    width: 90%;
    margin: 0 auto;
  }
}

.layout37 {
  display: none;
}

.pcshow {
  display: block !important;
}

.wapshow {
  display: none !important;
}

@media screen and (max-width: 1024px) {
  .max-width {
    width: 100%;
    padding: 0 15px;
  }

  .max-width2 {
    width: 100%;
    padding: 0 15px;
  }

  .pcshow {
    display: none !important;
  }

  .wapshow {
    display: block !important;
  }
}

.wapshow {
  display: none;
}

._nav3 {
  display: none;
}

.left {
  float: left;
}

.right {
  float: right;
}

.layout37 {
  display: none;
}

.qwe {
  font-size: var(--font16);
  line-height: 30px;
  color: #333;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.search-input {
  width: 147px;
  height: 42px;
  background-color: rgba(255, 255, 255, 0.08);
  /* 搜索框背景半透明白 */
  border: 1px solid rgba(255, 255, 255, 0.25);
  /* 搜索框边框半透明白 */
  border-radius: 21px;
  padding: 0 15px 0 35px;
  color: #ffffff;
  /* 核心：输入文字全白 */
  font-size: 13px;
  outline: none;
  text-align: center;
  transition: all 0.5s ease;
  font-size: 20px;
}

.search-input::placeholder {
  font-size: 20px;
  color: rgba(255, 255, 255, 0.6);
  /* 核心：占位符半透明白 */
}

.header-navbar {
  width: 100%;
  height: 90px;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 50px;
  box-shadow: none;
  position: fixed;
  top: 20px;
  left: 0;
  z-index: 9999;
  overflow: hidden;
  color: #ffffff;
  transition: all 0.5s ease;
}

.header-navbar.on {
  background: #fff;
  top: 0;
  background: #ffffffb3 !important;
  backdrop-filter: blur(21px);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.header-navbar.on .nav-item a {
  color: #333;
}

.header-navbar.on .menu-toggle {
  border-color: #333;
}

.header-navbar.on .menu-toggle span {
  background: #333;
}

.header-navbar.on .lang-item {
  color: #333;
}

.header-navbar.on span {
  color: #333;
}

.header-navbar.on .search-input {
  background-color: rgba(0, 0, 0, 0.08);
  border: 1px solid rgba(0, 0, 0, 0.25);
  color: #333;
}

.header-navbar.on .search-input::placeholder {
  color: rgba(0, 0, 0, 0.6) !important;
}

.header-navbar.on .search-icon {
  background: url(../img/search2.png) center no-repeat;
  background-size: cover;
}

.header-navbar.on .logo2 {
  display: block;
}

.header-navbar.on .logo1 {
  display: none;
}

.header-navbar.active {
  background: #fff;
  top: 0;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.header-navbar.active .nav-item a {
  color: #333;
}

.header-navbar.active .menu-toggle {
  border-color: #333;
}

.header-navbar.active .menu-toggle span {
  background: #333;
}

.header-navbar.active .lang-item {
  color: #333;
}

.header-navbar.active span {
  color: #333;
}

.header-navbar.active .search-input {
  background-color: rgba(0, 0, 0, 0.08);
  border: 1px solid rgba(0, 0, 0, 0.25);
  color: #333;
}

.header-navbar.active .search-input::placeholder {
  color: rgba(0, 0, 0, 0.6) !important;
}

.header-navbar.active .search-icon {
  background: url(../img/search2.png) center no-repeat;
  background-size: cover;
}

.header-navbar.active .logo2 {
  display: block;
}

.header-navbar.active .logo1 {
  display: none;
}

.header-navbar::after {
  display: none;
}

.nav-left,
.nav-center,
.nav-right {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
}

.menu-toggle {
  width: 45px;
  height: 45px;
  border: 1px solid #ffffff;
  /* 边框默认半透明白 */
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: all 0.3s ease;
  margin-right: 50px;
}

.menu-toggle span {
  width: 16px;
  height: 2px;
  margin: 2px 0;
  border-radius: 2px;
  background-color: #ffffff;
  /* 三横线默认白 */
  transition: all 0.3s ease;
}

.menu-toggle:hover {
  border-color: #ffffff;
  /* 悬停时边框全白 */
  background-color: rgba(255, 255, 255, 0.1);
  /* 悬停时轻微白背景 */
}

.nav-menu {
  display: flex;
  list-style: none;
  gap: 44px;
}

.nav-menu .nav-item.on {
  position: relative;
}

.nav-menu .nav-item.on:after {
  content: "";
  height: 6px;
  width: 6px;
  background: #000;
  border-radius: 50px;
  bottom: -14px;
  left: 50%;
  transform: translateX(-50%);
  position: absolute;
}

.header-navbar.on .nav-item a:hover {
  color: #181878 !important;
}

.header-navbar.on .nav-item:hover:after {
  background: #181878 !important;
}

.nav-item a {
  color: #ffffff;
  text-decoration: none;
  font-size: 20px;
  letter-spacing: 0.5px;
  transition: color 0.3s ease;
}

.nav-item a:hover {
  color: rgba(255, 255, 255, 0.7);
}

.nav-center {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.logo-container {
  display: flex;
  align-items: center;
  color: #ffffff;
  /* 核心：设为全白 */
  text-decoration: none;
  line-height: 0;
}

.logo-container .logo2 {
  display: none;
}

.logo-icon {
  width: 26px;
  height: 26px;
  border: 2.5px solid #ffffff;
  border-radius: 50%;
  margin-right: 8px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.logo-icon::before {
  content: "";
  width: 12px;
  height: 2.5px;
  background-color: #ffffff;
  /* 核心：图形全白 */
  position: absolute;
  top: 6px;
}

.logo-icon::after {
  content: "";
  width: 2.5px;
  height: 12px;
  background-color: #ffffff;
  /* 核心：图形全白 */
  position: absolute;
  left: 10px;
  top: 6px;
}

.logo-text-eng {
  font-size: 22px;
  font-weight: 700;
  font-style: italic;
  letter-spacing: -0.5px;
  margin-right: 6px;
  color: #ffffff;
  /* 核心：设为全白 */
}

.logo-text-chn {
  font-size: 13px;
  letter-spacing: 1px;
  color: #ffffff;
  /* 核心：设为全白 */
  border-left: 1px solid rgba(255, 255, 255, 0.3);
  /* 分割线保持半透明白 */
  padding-left: 6px;
  align-self: flex-end;
  margin-bottom: 3px;
}

.lang-switch {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-right: 76px;
}

.lang-item {
  color: #fff;
  /* 核心：默认半透明白 */
  text-decoration: none;
  transition: color 0.3s ease;
  cursor: pointer;
  line-height: 32px;
  font-size: 20px;
}

.lang-item:hover {
  color: #1200d8 !important;
}

.lang-item.active,
.lang-item:hover {
  color: #ffffff;
  /* 核心：高亮或悬停时全白 */
}

.search-box {
  position: relative;
  display: flex;
  align-items: center;
}

.search-input:focus {
  width: 180px;
  background-color: rgba(255, 255, 255, 0.15);
  border-color: #ffffff;
  text-align: left;
}

.search-input:focus+.search-icon {
  left: 14px !important;
}

.search-box:has(.search-input:focus) .search-icon {
  left: 14px !important;
}

.search-icon {
  position: absolute;
  left: 35px;
  width: 15px;
  height: 15px;
  background: url(../img/search.png) center no-repeat;
  background-size: cover;
  opacity: 0.5;
  top: 15px;
  transition: all 0.5s ease;
}

.search-icon::after {
  content: "";
  position: absolute;
  width: 1.5px;
  height: 5px;
  background-color: rgba(255, 255, 255, 0.5);
  /* 图标默认半透明白 */
  transform: rotate(-45deg);
  top: 8px;
  left: 7px;
}

.btn-group {
  display: flex;
}

.btn-group.flex {
  justify-content: center;
}

.btn-group .btn-main,
.btn-group .btn-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #1200d8;
  color: #fff;
  text-decoration: none;
  border-radius: 25px;
  transition: all 0.3s ease;
}

.btn-group .btn-main {
  height: 48px;
  width: 115px;
  font-size: 16px;
  background-color: transparent;
  position: relative;
}

.btn-group .btn-main p {
  position: relative;
  z-index: 1;
}

.btn-group .btn-main::after {
  content: "";
  background-color: #1200d8;
  width: 100%;
  height: 100%;
  left: 0;
  border-radius: 25px;
  transition: all 0.3s ease;
  position: absolute;
  z-index: 0;
}

.btn-group .btn-main.new {
  width: 160px;
}

.btn-group .btn-arrow {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  position: relative;
  z-index: 3;
}

.btn-group .btn-arrow svg {
  width: 24px;
  height: 24px;
}

.btn-group:hover .btn-main:after {
  width: 163px;
}

.btn-group:hover .btn-arrow {
  transform: rotate(45deg);
}

.index-Banner {
  width: 100%;
}

.index-Banner .video {
  line-height: 0;
  width: 100%;
  position: relative;
}

.index-Banner .video video {
  width: 100vw;
  height: 100vh;
  object-fit: cover;
}

.index-Banner .video .play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.8);
  line-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.5s ease;
}

.index-Banner .video .play:hover {
  transform: translate(-50%, -50%) scale(1.1);
}

.index-Banner .video .play img {
  width: 44px;
}

.index-Banner .video .bannerTit {
  position: absolute;
  top: 30%;
  left: 50px;
  color: #fff;
  font-size: 100px;
  line-height: 1.2;
}

.index-Banner .video .bannerExcerpt {
  position: absolute;
  right: 92px;
  color: #fff;
  font-size: 20px;
  line-height: 32px;
  width: 483px;
  bottom: 151px;
}

.index-Banner .video .tianrun-btn {
  align-items: center;
  height: 48px;
  position: absolute;
  bottom: 71px;
  right: 410px;
  text-decoration: none;
}

@keyframes arrow-bounce {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(3px);
  }
}

.indexTitle {
  color: #e9e9e9;
  text-align: center;
  font-weight: bold;
  font-size: 120px;
}

.indexTitle.inherit {
  font-weight: inherit;
}

.line-title-wrapper {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 20px 0;
  box-sizing: border-box;
}

.line-title-wrapper .split-line {
  flex: 1;
  height: 1px;
  background-color: #c1c1c1;
  position: relative;
}

.line-title-wrapper .split-line::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 5px;
  height: 5px;
  background-color: #c1c1c1;
  border-radius: 50%;
}

.line-title-wrapper .title-text {
  color: #000000;
  font-size: 20px;
  padding-left: 15px;
  white-space: nowrap;
}

.index-About {
  width: 100%;
  padding: 150px 0;
  position: relative;
  /* 左侧双卡片布局 */
  /* 通用卡片基础 */
  /* 蓝色核心技术卡片样式 */
  /* 白色品质升级卡片样式 */
  /* 容器基础样式 */
  /* 单个区块 */
}

.index-About:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;

  opacity: 1;
  z-index: -1;
}

.index-About .aboutCompany {
  font-size: 45px;
  color: #000;
  line-height: 1.3;
  margin-bottom: 34px;
  margin-top: 60px;
}

.index-About .aboutContent {
  font-size: 32px;
  color: #000;
  width: 50%;
  line-height: 1.3;
}

.index-About .company-section {
  display: flex;
  width: 100%;
  gap: 20px;
  align-items: flex-end;
  margin-top: 78px;
}

.index-About .content-left {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  aspect-ratio: 1 / 1;
}

.index-About .intro-text {
  font-size: 20px;
  color: #4d4d4d;
  line-height: 1.6;
  max-width: 394px;
}

.index-About .card-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  align-items: end;
  /* 还原图中的上下错落感 */
}

.index-About .card {
  border-radius: 20px;
  padding: 34px 34px 30px 34px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
  transition: transform 0.3s ease;
}

.index-About .card:hover {
  transform: translateY(-5px);
}

.index-About .card-icon img {
  width: 48px;
  height: 48px;
  margin-bottom: 116px;
}

.index-About .card-icon2 img {
  width: 48px;
  height: 48px;
  margin-bottom: 236px;
}

.index-About .card-title {
  font-size: 32px;
  line-height: 1.4;
  margin-bottom: 30px;
}

.index-About .card-desc {
  font-size: 20px;
  line-height: 1.6;
}

.index-About .card-blue {
  background-color: #151a7b;
  color: #fff;
}

.index-About .card-white {
  background-color: #ffffff;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
  color: #333;
}

.index-About .card-white .card-desc {
  color: #777;
}

.index-About .content-right {
  flex: 1;
  position: relative;
  border-radius: 24px;
  overflow: hidden;
}

.index-About .main-img {
  width: 100%;
  object-fit: cover;
  display: block;
  aspect-ratio: 1/1;
}

.index-About .glass-card {
  position: absolute;
  bottom: 30px;
  right: 33px;
  width: 55%;
  background: rgba(255, 255, 255, 0.15);
  /* 半透明底色 */
  backdrop-filter: blur(20px);
  /* 关键：高斯模糊 */
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 20px;
  padding: 25px;
  color: #fff;
  box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.2);
}

.index-About .glass-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.index-About .glass-header h3 {
  font-size: 32px;
  font-weight: bold;
}

.index-About .glass-mid {
  max-height: 0;
  transition: all 0.7s ease;
  overflow: hidden;
}

.index-About .glass-mid .contentTit {
  color: #fff;
  font-size: 20px;
  line-height: 1.4;
  margin-bottom: 20px;
}

.index-About .glass-mid .contentEditor {
  color: #fff;
  font-size: 20px;
  line-height: 1.4;
  margin-bottom: 20px;
  padding: 20px 0;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
}

.index-About .counter-section {
  display: flex;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  padding: 80px 0px 0 0;
}

.index-About .counter-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex: 1;
}

.index-About .number-box {
  font-size: 100px;
  font-weight: 800;
  color: #000000;
  line-height: 1.1;
  margin-bottom: 30px;
  display: inline-flex;
  align-items: center;
  position: relative;
}

.index-About .counter-label {
  font-size: 14px;
  color: #8c8c8c;
  font-weight: 500;
  letter-spacing: 0.5px;
}

.index-About .arrow-toggle svg {
  width: 24px;
  height: 24px;
  cursor: pointer;
}

.index-About .arrow-toggle {
  transition: all 0.7s ease;
}

.index-About .glass-content {
  margin-top: 20px;
}

.index-About .learn-more {
  color: #fff;
  text-decoration: none;
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.index-About .mini-arrow {
  width: 22px;
  height: 22px;
  background-color: #fff;
  color: #333;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.index-About .mini-arrow svg {
  width: 12px;
  height: 12px;
}

.index-About .glass-card:hover .glass-mid {
  max-height: 300px;
}

.index-About .glass-card:hover .arrow-toggle {
  transform: rotate(180deg);
}

.index-Product {
  width: 100%;
  padding-top: 140px;
}

.index-Product .productCont {
  color: #4d4d4d;
  font-size: 32px;
  width: 50%;
  line-height: 1.4;
  margin: 97px 0 177px 0;
}

.productList {
  width: 100%;
}

.productList .stack-list>li {
  position: -webkit-sticky;
  position: sticky;
  top: var(--sticky-top, 0px);
  width: 100%;
  background: transparent;
}

.productList .stack-list>li>a {
  display: block;
  width: 100%;
  background-color: #ffffff;
  border-bottom: 1px solid #e5e5e5;
  text-decoration: none;
  color: inherit;
  will-change: transform;
}

.productList .stack-list {
  position: relative;
  width: 100%;
  list-style: none;
}

.productList .stack-list .productLeft {
  flex: 1.2;
}

.productList .stack-list .product-code {
  font-weight: 700;
  color: #1a73e8;
  margin-bottom: 8px;
  text-transform: uppercase;
}

.productList .stack-list .product-name {
  font-size: 2.2rem;
  font-weight: 600;
  color: #111;
  margin-bottom: 20px;
}

.productList .stack-list .btn-group {
  display: inline-flex;
  align-items: center;
}

.productList .stack-list .btn-main {
  background: #111;
  color: #fff;
  padding: 12px 24px;
  font-size: 0.95rem;
  border-radius: 30px;
}

.productList .stack-list .btn-arrow svg {
  width: 18px;
  height: 18px;
}

.productList .stack-list .productRight {
  flex: 1;
  display: flex;
  justify-content: flex-end;
}

.productList ul li {
  width: 100%;
}

.productList ul li a {
  border-top: 1px solid #c1c1c1;
  border-bottom: 1px solid #c1c1c1;
  padding: 30px 0;
  display: block;
}

.productList ul li a:hover .product-name {
  color: #151a7b;
}

.productList ul li a:hover .productRight img {
  transform: scale(1.1);
}

.productList ul li a .productLayout {
  display: flex;
  justify-content: space-between;
}

.productList ul li a .productLayout .productLeft {
  width: 35.7%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.productList ul li a .productLayout .productLeft .product-code {
  font-size: 70px;
  font-weight: bold;
  /* 极粗 */
  color: #000000;
  line-height: 1;
}

.productList ul li a .productLayout .productLeft .product-name {
  font-size: 32px;
  font-weight: 700;
  color: #00110c;
  margin-top: 0px;
  margin-bottom: auto;
}

.productList ul li a .productLayout .productLeft .product-desc {
  margin-bottom: 40px;
  color: #4d4d4d;
  font-size: 16px;
  max-width: 584px;
  line-height: 1.6;
}

.productList ul li a .productLayout .productRight {
  overflow: hidden;
  line-height: 0;
  width: 49.4%;
  border-radius: 24px;
}

.productList ul li a .productLayout .productRight video {
  width: 100%;
}

.productList ul li a .productLayout .productRight img {
  transition: all 0.5s ease;
}

.index-About .glass-card:hover .mini-arrow {
  transform: translate(2px, -2px);
}

.mini-arrow {
  transition: all 0.5s ease;
}

.applicationUp {
  background: #f9f9f9;
}

.index-Applition .banner-container>.max-width {
  z-index: 999;
  padding: 30vh 0 63px 0;
}

.index-Applition {
  padding: 120px 0 0 0;
  width: 100%;
  /* 只有当进场或者需要动画时，才动态追加这个类名（1.5秒优雅慢速） */
  /* 激活状态：幕布完全放下来 */
  /* 激活状态：幕布完全放下来 (0%) */
  /* ================= 文字内容过渡保持不变 ================= */
}

.index-Applition .banner-container {
  margin-top: 120px;
  position: relative;
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}

.index-Applition .banner-container>.max-width {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100vh;
}

.index-Applition .banner-container {
  position: relative;
  width: 100%;
  height: 100vh;
  background: #000;
  overflow: hidden;
}

.index-Applition .banner-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  /* 默认状态：静默裁剪到最顶端，没有任何过渡动画 */
  clip-path: inset(0% 0% 100% 0%);
  z-index: 1;
}

.index-Applition .banner-bg.is-transitioning {
  transition: clip-path 1.5s cubic-bezier(0.25, 1, 0.5, 1);
}

.index-Applition .banner-bg.active {
  clip-path: inset(0% 0% 0% 0%);
}

.index-Applition .banner-bg.active {
  clip-path: inset(0% 0% 0% 0%);
  /* 注：z-index 会在 JS 中动态计算并以行内样式赋予，确保新图绝对高于旧图 */
}

.index-Applition .content-item {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.index-Applition .content-item.active {
  opacity: 1;
  visibility: visible;
  transform: translateY(-50%) translateX(0);
}

.index-Applition .progress-fill {
  transform-origin: left center;
  transform: scaleX(0);
}

.index-Applition .mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  z-index: 3;
}

.index-Applition .content-wrapper {
  position: relative;
  z-index: 4;
  color: #ffffff;
  max-width: 584px;
  margin-top: 110px;
}

.index-Applition .content-item {
  display: none;
}

.index-Applition .content-item .btn-group .btn-main {
  background: #ffffff;
  color: #1200d8;
}

.index-Applition .content-item .btn-group .btn-main:after {
  background: #fff;
}

.index-Applition .content-item .btn-group .btn-arrow {
  background: #ffffff;
  color: #f08300;
}

.index-Applition .content-item.active {
  display: block;
}

.index-Applition .content-item.active .title,
.index-Applition .content-item.active .desc,
.index-Applition .content-item.active .btn,
.index-Applition .content-item.active .btn-group {
  opacity: 0;
  transform: translateY(25px);
  animation: fadeInUp 0.8s forwards ease-out;
}

.index-Applition .content-item.active .title {
  animation-delay: 0.1s;
}

.index-Applition .content-item.active .desc {
  animation-delay: 0.25s;
}

.index-Applition .content-item.active .btn-group {
  animation-delay: 0.25s;
}

.index-Applition .content-item.active .btn {
  animation-delay: 0.4s;
}

.index-Applition .title {
  font-size: 45px;
  font-weight: 600;
  margin-bottom: 20px;
}

.index-Applition .desc {
  font-size: 32px;
  line-height: 1.4;
  color: #ffffff;
  margin-bottom: 46px;
}

.index-Applition .btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 24px;
  background-color: #ffffff;
  color: #333;
  text-decoration: none;
  border-radius: 30px;
  font-size: 0.85rem;
  font-weight: 500;
}

.index-Applition .nav-tabs {
  position: relative;
  z-index: 4;
  display: flex;
  gap: 37px;
  width: 100%;
}

.index-Applition .tab-item {
  display: flex;
  flex-direction: column;
  gap: 12px;
  cursor: pointer;
}

.index-Applition .tab-text {
  color: rgba(255, 255, 255, 0.4);
  transition: color 0.3s ease;
  white-space: nowrap;
  font-size: 16px;
}

.index-Applition .tab-item:hover .tab-text,
.index-Applition .tab-item.active .tab-text {
  color: #ffffff;
}

.index-Applition .progress-line-box {
  position: relative;
  width: 100%;
  height: 2px;
}

.index-Applition .base-line {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.25);
  transition: background-color 0.3s;
}

.index-Applition .tab-item.active .base-line {
  background-color: rgba(255, 255, 255, 0.1);
}

.index-Applition .progress-fill {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #ffffff;
  transform: scaleX(0);
  transform-origin: left center;
}

.index-Applition .tab-item.active .progress-fill {
  transition: transform linear;
}

@keyframes fadeInUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.index-Applition .applicationDown {
  display: flex;
  justify-content: space-between;
  padding: 100px 0 150px 0;
}

.index-Applition .applicationDown .tip {
  font-size: 45px;
  color: #4d4d4d;
  font-weight: bold;
}

.index-Applition .applicationDown .content {
  color: #898989;
  font-size: var(--font20);
  line-height: 1.6;
  width: 482px;
}

.index-Applition .applicationDown .content .btn-group {
  margin-top: 50px;
}

.index-Applition .applicationDown .content p {
  color: #00110c;
}

.usCont {
  color: #4d4d4d;
  font-size: var(--font32);
  line-height: 1.6;
  margin: 70px 0 150px 0;
  width: 49.5%;
}

.index-Quality {
  background: #f9f9f9;
  padding-bottom: 138px;
  /* 文字动画关键帧 */
}

.index-Quality .quality-section {
  width: 100%;
}

.index-Quality .quality-container {
  display: flex;
  gap: 156px;
  align-items: stretch;
}

.index-Quality .quality-media-box {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  min-height: 930px;
  background-color: #f5f5f5;
  width: 44.6%;
  perspective: 1200px;
}

.index-Quality .quality-image-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 24px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  transition: transform 0.7s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.6s ease;
}

.index-Quality .quality-image-wrapper::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.65);
  opacity: 0;
  transition: opacity 0.7s ease;
}

.index-Quality .quality-image-wrapper.state-active {
  opacity: 1;
  z-index: 3;
  pointer-events: auto;
  transform: translate3d(0, 0, 0) rotateZ(0deg);
  transform-origin: center center;
}

.index-Quality .quality-image-wrapper.state-active::after {
  opacity: 0;
}

.index-Quality .quality-image-wrapper.state-back {
  opacity: 1;
  z-index: 1;
  transform: translate3d(0, 0, -400px) rotateZ(0deg);
  transform-origin: center center;
}

.index-Quality .quality-image-wrapper.state-back::after {
  opacity: 1;
}

.index-Quality .quality-image-wrapper.state-right-bottom {
  opacity: 0;
  z-index: 2;
  transform: translate3d(100%, 100%, 0) rotateZ(45deg);
  transform-origin: left bottom;
}

.index-Quality .quality-image-wrapper.state-right-bottom::after {
  opacity: 0;
}

.index-Quality .quality-img {
  height: 100%;
}

.index-Quality .quality-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transform: scale(1.02);
  transition: opacity 0.7s ease, transform 0.7s ease;
}

.index-Quality .quality-image.active {
  opacity: 1;
  transform: scale(1);
  position: relative;
}

.index-Quality .quality-content-box {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.index-Quality .quality-slogan {
  font-size: 20px;
  color: #333333;
  font-weight: 500;
}

.index-Quality .quality-tabs-nav {
  display: flex;
  flex-direction: column;
  gap: 50px;
  margin-top: 60px;
}

.index-Quality .quality-tab-text {
  font-size: 55px;
  font-weight: 600;
  color: #c1c1c1;
  transition: color 0.3s ease;
  letter-spacing: 1px;
}

.index-Quality .quality-tab-item:hover .quality-tab-text,
.index-Quality .quality-tab-item.active .quality-tab-text {
  color: #333333;
}

.index-Quality .quality-tab-item {
  cursor: pointer;
  width: fit-content;
}

.index-Quality .quality-progress-box {
  position: relative;
  width: 100%;
  height: 2px;
  margin-top: 15px;
}

.index-Quality .quality-base-line {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #e0e0e0;
}

.index-Quality .quality-progress-fill {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #1a1a1a;
  transform: scaleX(0);
  transform-origin: left center;
}

.index-Quality .quality-tab-item.active .quality-progress-fill {
  transition: transform linear;
  /* linear 确保 5 秒内匀速前进 */
}

.index-Quality .quality-desc-wrapper {
  min-height: 100px;
  margin-top: 100px;
}

.index-Quality .quality-desc-item {
  display: none;
}

.index-Quality .quality-desc-item.active {
  display: block;
}

.index-Quality .quality-desc-item.active p {
  font-size: 20px;
  line-height: 1.6;
  color: #898989;
  opacity: 0;
  max-width: 550px;
  transform: translateY(15px);
  animation: qualityFadeInUp 0.6s forwards ease-out;
}

.index-Quality .quality-desc-item.active p b {
  color: #00110c;
}

.index-Quality .quality-more-action {
  display: flex;
  justify-content: flex-end;
  margin-top: auto;
}

.index-Quality .quality-link-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  font-size: 16px;
  color: #1200d8;
  transition: color 0.3s;
}

.index-Quality .quality-link-btn:hover .img {
  transform: translate(2px, -2px);
  /* 悬停时箭头往右上角微动 */
}

@keyframes qualityFadeInUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.index-Quality .quality-more-action:hover .quality-link-btn img {
  transform: translate(2px, -2px);
  /* 悬停时箭头往右上角微动 */
}

.index-News {
  margin-top: 180px;
  /* 卡片基础 */
  /* 当前项尺寸 */
  /* 背景图 */
  /* 内容区域 - 全部左对齐，宽度收缩时向左侧挤压 */
  /* 导航按钮 */
}

.index-News .quality-arrow-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  background-color: #fff;
  color: #5e5e5e;
  border-radius: 50%;
  font-size: 0.7rem;
  transition: transform 0.3s;
}

.index-News .news-glass-panel {
  position: absolute;
  bottom: 26px;
  left: 38px;
  right: 38px;
  padding: 34px 36px;
  border-radius: 12px;
  color: #ffffff;
  z-index: 3;
  transition: all 0.3s ease;
  background: rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: #fff;
  box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.2);
}

.index-News .news-glass-panel .tag {
  display: flex;
  align-items: center;
}

.index-News .news-glass-panel .tag .circle {
  height: 6px;
  width: 6px;
  border: 1px solid #fff;
  border-radius: 50%;
  margin-right: 7px;
}

.index-News .viewport {
  width: 100vw;
  height: 868px;
  overflow: hidden;
  position: relative;
}

.index-News .track {
  display: flex;
  align-items: flex-end;
  gap: 20px;
  will-change: transform;
  transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  position: absolute;
  bottom: 0;
  left: 0;
  padding-bottom: 60px;
}

.index-News .newcard {
  flex-shrink: 0;
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  background: #151515;
  color: #fff;
  cursor: pointer;
  width: 512px;
  height: 556px;
  transition: height 0.5s cubic-bezier(0.4, 0, 0.2, 1), width 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.5s;
}

.index-News .newcard:hover .card-desc {
  max-height: 50px;
}

.index-News .newcard:hover .card-link .quality-arrow-icon {
  transform: translate(2px, -2px);
}

.index-News .newcard.no-transition {
  transition: none !important;
}

.index-News .newcard.active {
  width: 808px;
  height: 808px;
}

.index-News .newcard.active .card-desc {
  max-height: 200px;
}

.index-News .card-bg {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.index-News .card-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: filter 0.6s ease;
}

.index-News .card.active .card-bg img {
  filter: grayscale(0%) brightness(1);
}

.index-News .card-number {
  position: absolute;
  top: 38px;
  left: 38px;
  font-size: 60px;
  font-weight: 700;
  z-index: 4;
  line-height: 1;
}

.index-News .card-content {
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.index-News .tag {
  display: inline-block;
  padding: 6px 14px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 100px;
  font-size: 12px;
  margin-bottom: 14px;
  letter-spacing: 0.5px;
}

.index-News .card-title {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 10px;
  width: 100%;
  text-align: left;
  line-height: 1.4;
}

.index-News .card-desc {
  font-size: 13px;
  line-height: 1.8;
  opacity: 0.7;
  margin-bottom: 20px;
  width: 100%;
  text-align: left;
  overflow: hidden;
  transition: all 0.5s ease;
  max-height: 0;
}

.index-News .newcard.active .card-desc {
  width: 66%;
}

.index-News .card-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  font-size: 13px;
}

.index-News .card-date {
  opacity: 0.5;
}

.index-News .card-link {
  display: flex;
  align-items: center;
  gap: 6px;
  transition: gap 0.3s ease;
}

.index-News .card:hover .card-link {
  gap: 10px;
}

.index-News .nav-buttons {
  position: absolute;
  top: 133px;
  right: 148px;
  display: flex;
  gap: 30px;
  z-index: 10;
}

.index-News .nav-btn {
  width: 60px;
  height: 60px;
  background: transparent;
  cursor: pointer;
  transition: all 0.3s ease;
  line-height: 0;
}

.index-News .nav-btn:hover {
  transform: scale(1.1);
}

.btn-group.flex:hover .btn-main:after {
  width: 200px;
}

.rightSearch {
  position: fixed;
  top: 0;
  right: -40vw;
  background: #fff;
  width: 30vw;
  height: 100vh;
  z-index: 99;
  padding: 34px 80px;
  z-index: 10001;
  transition: all 0.5s ease;
  /* 特色链接部分 */
  /* 提示说明文字部分 */
}

.rightSearch .rightSearchLayout {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.rightSearch.active {
  right: 0;
}

.rightSearch .search-box-container {
  position: relative;
  margin-bottom: 20px;
}

.rightSearch .search-box-container i {
  position: absolute;
  left: 24px;
  top: 50%;
  transform: translateY(-50%);
  color: #666;
  font-size: 18px;
}

.rightSearch .search-input {
  width: 100%;
  padding: 14px 14px 14px 56px;
  border: 1px solid #cccccc;
  border-radius: 30px;
  font-size: 16px;
  height: 60px;
  outline: none;
  color: #333;
  background-color: #fcfcfc;
  text-align: left;
  color: #000;
}

.rightSearch .search-input::placeholder {
  color: #000;
}

.rightSearch .ask-ai-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1.5px solid #2b3bf6;
  border-radius: 8px;
  padding: 12px 16px;
  color: #2b3bf6;
  font-weight: 500;
  font-size: 16px;
  text-decoration: none;
  margin-bottom: 30px;
  cursor: pointer;
  transition: background-color 0.2s;
}

.rightSearch .ask-ai-banner:hover {
  background-color: #f4f6ff;
}

.rightSearch .ask-ai-left {
  display: flex;
  align-items: center;
  gap: 8px;
}

.rightSearch .section-title {
  color: #757575;
  font-size: 14px;
  margin-bottom: 16px;
  font-weight: 400;
}

.rightSearch .links-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 40px;
}

.rightSearch .links-list li a {
  color: #000000;
  text-decoration: none;
  font-size: 22px;
  font-weight: 400;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  position: relative;
}

.rightSearch .links-list li a:after {
  content: "";
  height: 1px;
  width: 100%;
  background: #1200d8;
  position: absolute;
  bottom: -10px;
  left: 0;
  transition: all 0.5s ease;
  opacity: 0;
}

.rightSearch .links-list li a:hover {
  color: #1200d8;
}

.rightSearch .links-list li a:hover:after {
  opacity: 1;
}

.rightSearch .links-list li a .fa-external-link-alt {
  font-size: 16px;
  color: #333;
}

.rightSearch .info-section {
  color: #757575;
  font-size: 14px;
  line-height: 1.5;
}

.rightSearch .info-title {
  color: #555555;
  font-weight: bold;
  margin-bottom: 14px;
  font-size: 14px;
}

.rightSearch .info-list {
  padding-left: 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.rightSearch .info-list li {
  color: #8c96a0;
  list-style: disc;
}

.rightSearch .footer-btn-container {
  width: 100%;
  background-color: #ffffff;
  margin-top: auto;
}

.rightSearch .search-btn {
  width: 100%;
  background-color: #1200d8;
  color: #ffffff;
  border: none;
  border-radius: 20px;
  padding: 16px;
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(0, 0, 245, 0.2);
  transition: background-color 0.2s;
}

.rightSearch .search-btn:hover {
  background-color: #0000c2;
}

.rightSearch .close-btn {
  position: absolute;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  top: 50%;
  transform: translate(0, -50%);
  left: -30px;
  background-color: #ededed;
  color: #333333;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  outline: none;
  padding: 0;
  cursor: pointer;
  transition: all 0.2s ease;
}

.rightSearch .close-btn svg {
  width: 24px;
  /* 叉号的大小 */
  height: 24px;
}

.rightSearch .close-btn:hover {
  background-color: #e0e0e0;
  /* 悬停时背景稍微加深一点 */
  transform: translate(0, -50%) scale(1.05) rotate(-90deg);
  /* 悬停时稍微放大一点 */
}

.leftNav {
  position: fixed;
  top: 0;
  left: -40vw;
  background: #fff;
  width: 30vw;
  height: 100vh;
  z-index: 99;
  padding: 80px 54px 0 80px;
  z-index: 10001;
  transition: all 0.5s ease;
}

.leftNav .lang {
  display: flex;
  position: absolute;
  border-top: 1px solid #cccccc;
  padding-top: 30px;
  align-items: center;
  width: calc(100% - 160px);
  bottom: 100px;
  height: 60px;
}

.leftNav .lang:hover .icon .icon2 {
  display: block;
}

.leftNav .lang:hover .icon .icon1 {
  display: none;
}

.leftNav .lang a {
  display: block;
  font-size: 18px;
  margin-right: 12px;
}

.leftNav .lang a:hover {
  color: #1200d8;
}

.leftNav .lang .icon {
  margin-right: 16px;
}

.leftNav .lang .icon img {
  height: 24px;
  width: 24px;
}

.leftNav .lang .icon .icon2 {
  display: none;
}

.leftNav.active {
  left: 0;
}

.leftNav .blogroll {
  margin-top: 40px;
}

.leftNav .blogroll a {
  margin-bottom: 20px;
  display: block;
  color: #666;
  font-size: 18px;
}

.leftNav .blogroll a:hover {
  color: #1200d8;
}

.leftNav .navList ul li a {
  margin-bottom: 24px;
  display: block;
  color: #000;
  position: relative;
  font-size: 40px;
}

.leftNav .navList ul li a:hover {
  color: #1200d8;
}

.leftNav .navList ul li a .arrow {
  height: 12px;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translate(-50%, 0);
  width: 12px;
  border-top: 2px solid #000;
  border-right: 2px solid #000;
  transform: rotate(45deg);
}

.leftNav .close-btn {
  position: absolute;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  top: 50%;
  transform: translate(0, -50%);
  right: -30px;
  background-color: #ededed;
  color: #333333;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  outline: none;
  padding: 0;
  cursor: pointer;
  transition: all 0.2s ease;
}

.leftNav .close-btn svg {
  width: 24px;
  /* 叉号的大小 */
  height: 24px;
}

.leftNav .close-btn:hover {
  background-color: #e0e0e0;
  /* 悬停时背景稍微加深一点 */
  transform: translate(0, -50%) scale(1.05) rotate(-90deg);
  /* 悬停时稍微放大一点 */
}

.leftNav .navList ul li a:hover .arrow {
  border-top: 2px solid #0e00ac;
  border-right: 2px solid #0e00ac;
}

.leftNav .contContainer {
  position: absolute;
  height: calc(100% - 150px);
  width: calc(100% - 140px);
  padding-right: 20px;
  display: none;
  top: 100px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #ccc rgba(255, 255, 255, 0.75);
}

.leftNav .contContainer::-webkit-scrollbar-thumb {
  background-color: #ccc;
  border-radius: 8px;
}

.leftNav .menuTit {
  margin-top: 60px;
  display: flex;
  padding-bottom: 30px;
  justify-content: space-between;
  border-bottom: 1px solid #666;
}

.leftNav .menuTit span {
  font-size: 20px;
  color: #000;
}

.leftNav .menuTit a {
  text-decoration: underline;
  font-size: 16px;
  color: #666;
}

.leftNav .menuTit a:hover {
  color: #1200d8;
}

.leftNav .productNavList {
  padding: 30px 0;
  margin-bottom: 20px;
  border-bottom: 1px solid #666;
}

.leftNav .productNavList.noborder {
  border-bottom: 0;
}

.leftNav .productNavList .productItem {
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 15px;
}

.leftNav .productNavList .productItem:last-child {
  margin-bottom: 0;
}

.leftNav .productNavList .productItem:hover .proTit {
  color: #1200d8;
}

.leftNav .productNavList .productItem:hover .arrow {
  border-top: 2px solid #1200d8;
  border-right: 2px solid #1200d8;
}

.leftNav .productNavList .productItem .pic {
  width: 64px;
  height: 64px;
  margin-right: 16px;
}

.leftNav .productNavList .productItem .proTit {
  font-size: 18px;
  color: #000;
  margin-right: auto;
}

.leftNav .productNavList .productItem .arrow {
  height: 12px;
  width: 12px;
  border-top: 2px solid #000;
  border-right: 2px solid #000;
  top: 50%;
  transform: translate(0%, -50%) rotate(45deg);
}

.leftNav .proClassify {
  color: #000;
  font-size: 20px;
  display: block;
  width: 100%;
  line-height: 3.1;
}

.leftNav .proClassify:hover {
  color: #1200d8;
}

.backMenu {
  display: flex;
  font-size: 20px;
  color: #000;
  cursor: pointer;
  position: relative;
  padding-left: 20px;
}

.backMenu:hover {
  color: #1200d8;
}

.backMenu:hover .arrow {
  border-top: 2px solid #1200d8;
  border-right: 2px solid #1200d8;
}

.backMenu .arrow {
  height: 12px;
  width: 12px;
  left: 5px;
  border-top: 2px solid #000;
  border-right: 2px solid #000;
  top: 50%;
  transform: translate(0%, -50%) rotate(225deg);
  position: absolute;
}

@media screen and (max-width: 1500px) {
  .leftNav .lang {
    bottom: 50px;
  }

  .leftNav .contContainer {
    height: calc(100% - 100px);
    width: calc(100% - 100px);
    top: 40px;
  }

  .leftNav .menuTit {
    margin-top: 30px;
  }

  .leftNav .productNavList .productItem .proTit,
  .leftNav .proClassify {
    font-size: 16px;
  }

  .leftNav .productNavList .productItem .pic {
    height: 50px;
    width: 50px;
  }

  .leftNav .productNavList .productItem {
    height: 50px;
    margin-bottom: 10px;
  }
}

.pageMc {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 10000;
  display: none;
}

.industry-video {
  width: 100%;
  margin-top: 130px;
  padding: 0 20px;
  position: relative;
  z-index: 2;
}

.industry-video .video {
  position: relative;
}

.industry-video .video video {
  width: 100%;
  border-radius: 20px;
}

.industry-video .video .video-cont {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  text-align: center;
  z-index: 8;
}

.industry-video .video .video-cont .btn-group {
  display: flex;
  justify-content: center;
}

.industry-video .video .video-cont .videoTit {
  font-size: 45px;
  font-weight: bold;
  color: #fff;
  margin-bottom: 30px;
}

.industry-video .video .video-cont .videoDesc {
  font-size: 32px;
  line-height: 1.6;
  color: #fff;
  margin-bottom: 30px;
}

.industry-video .video .video-cont .btn-main {
  background: #ffffff;
  color: #1200d8;
}

.industry-video .video .video-cont .btn-main:after {
  background: #ffffff;
}

.industry-video .video .video-cont .btn-arrow {
  background: #ffffff;
  color: #f08300;
}

.site-footer .big-bg-text {
  transform: translate(0, 2vw);
}

.site-footer {
  width: 100%;
  background: linear-gradient(to bottom, #ffffff 0%, #e2ebf9 40%, #c5daf7 100%);
  overflow: hidden;
  position: relative;
}

.site-footer a {
  color: #181878;
  text-decoration: none;
  transition: color 0.3s ease;
}

.site-footer a:hover {
  color: #0056b3;
}

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

.site-footer .footer-upper {
  padding-top: 230px;
  padding-bottom: 90px;
}

.site-footer .footer-col {
  flex: 1;
  z-index: 2;
  position: relative;
}

.site-footer .col-info {
  flex: 2.2;
  padding-right: 60px;
}

.site-footer .company-name {
  font-size: 32px;
  font-weight: bold;
  color: #181878;
  line-height: 45px;
  margin-bottom: 20px;
}

.site-footer .company-desc {
  font-size: 20px;
  color: #555;
  line-height: 1.6;
  margin-bottom: 25px;
  max-width: 510px;
}

.site-footer .email-group {
  display: flex;
  align-items: center;
  gap: 20px;
  font-size: 20px;
  color: #1200d8;
  font-weight: 600;
  margin-bottom: 80px;
}

.site-footer .email-icon {
  width: 24px;
  height: 24px;
  color: #ff8c00;
  display: inline-flex;
  align-items: center;
}

.site-footer .footer-logo img {
  height: 42px;
  width: auto;
  display: block;
}

.logowap {
  display: none;
}

.site-footer .col-links {
  flex: 0.8;
  padding-top: 6px;
}

.site-footer .link-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 25px;
}

.site-footer .link-list a {
  font-size: 20px;
  color: #181878;
}

.site-footer .col-contact {
  width: 195px;
  display: flex;
  flex-direction: column;
  gap: 25px;
  font-size: 13px;
  color: #555;
}

.site-footer .col-contact h4 {
  font-size: 20px;
  color: #181878;
  margin-bottom: 12px;
  font-weight: bold;
}

.site-footer .col-contact p {
  line-height: 1.6;
  color: #555;
  font-size: 16px;
}

.site-footer .footer-lower {
  position: relative;
}

.site-footer .lower-container {
  display: flex;
  justify-content: flex-end;
  gap: 123px;
  font-size: 16px;
  color: #131313;
  position: relative;
  z-index: 2;
}

.site-footer .big-bg-text {
  font-size: 360px;
  font-weight: 900;
  color: #ffffff;
  text-shadow: 0 0 2px rgba(0, 0, 0, 0.01);
  letter-spacing: 0.02em;
  line-height: 1;
  pointer-events: none;
  user-select: none;
  text-align: center;
  opacity: 0.75;
}

#interactive-canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  filter: blur(40px);
}

.insideBanner {
  width: 100%;
  position: relative;
  margin-top: 90px;
}

.insideBanner .insideBannerPic {
  line-height: 0;
  position: relative;
}

.insideBanner .insideBannerPic .video-mask-wrapper {
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  right: 140px;
  width: 33%;
  z-index: 2;
  height: 567px;
}

.insideBanner .insideBannerPic img {
  max-height: 683px;
  object-fit: cover;
  width: 100%;
}

.insideBanner .bannerMbx {
  position: absolute;
  width: 100%;
  top: 40px;
}

.insideBanner .bannerMbx .currentTit {
  color: #fff;
  font-size: 70px;
  margin-top: 40px;
}

.insideBanner .bannerMbx .bannerMbxFlex {
  display: flex;
  align-items: center;
  font-size: 16px;
  color: #fff;
}

.insideBanner .bannerMbx .bannerMbxFlex a {
  color: #fff;
  display: block;
  font-size: 16px;
}

.contactPlate {
  padding: 120px 0;
}

.contactPlate .contactContainer {
  display: flex;
  width: 100%;
  gap: 186px;
  margin-top: 70px;
}

.contactPlate .contactContainer .info-sidebar {
  flex: 1;
  max-width: 560px;
}

.contactPlate .contactContainer .main-title {
  font-size: 45px;
  font-weight: bold;
  line-height: 1.5;
  margin-bottom: 24px;
  color: #000000;
  width: 100%;
}

.contactPlate .contactContainer .company-desc {
  font-size: 20px;
  color: #4d4d4d;
  line-height: 1.6;
  margin-bottom: 147px;
}

.contactPlate .contactContainer .company-name {
  font-size: 32px;
  color: #1200d8;
  font-weight: bold;
  margin-bottom: 30px;
  line-height: 1.4;
}

.contactPlate .contactContainer .contact-item {
  margin-bottom: 24px;
}

.contactPlate .contactContainer .contact-item .label {
  display: block;
  font-size: 16px;
  color: #c1c1c1;
  margin-bottom: 6px;
}

.contactPlate .contactContainer .highlight-text {
  font-size: 20px;
  font-weight: bold;
  line-height: 1.6;
  color: #1200d8;
}

.contactPlate .contactContainer .highlight-link {
  font-size: 20px;
  font-weight: bold;
  color: #1200d8;
  text-decoration: none;
  transition: color 0.2s;
}

.contactPlate .contactContainer .highlight-link:hover {
  text-decoration: underline;
}

.contactPlate .contactContainer .emails {
  display: flex;
  gap: 20px;
}

.contactPlate .contactContainer .form-container {
  flex: 1;
}

.contactPlate .contactContainer .form-title {
  font-size: 80px;
  margin-bottom: 34px;
  line-height: 1;
  color: #111111;
}

.contactPlate .contactContainer .form-row {
  display: flex;
  gap: 32px;
  margin-bottom: 32px;
}

.contactPlate .contactContainer .form-group {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.contactPlate .contactContainer .form-group.full-width {
  margin-bottom: 32px;
}

.contactPlate .contactContainer .form-group label {
  font-size: 16px;
  color: #4d4d4d;
  margin-bottom: 12px;
}

.contactPlate .contactContainer .form-group input[type="text"],
.contactPlate .contactContainer .form-group input[type="email"],
.contactPlate .contactContainer .form-group input[type="tel"],
.contactPlate .contactContainer .form-group textarea {
  width: 100%;
  background-color: #f9f9f9;
  border: 1px solid transparent;
  border-radius: 44px;
  padding: 0px 20px;
  height: 72px;
  font-size: 16px;
  color: #333333;
  outline: none;
  transition: all 0.2s ease-in-out;
}

.contactPlate .contactContainer .form-group textarea {
  border-radius: 20px;
  resize: vertical;
  height: 208px;
  padding: 16px 20px;
}

.contactPlate .contactContainer .btn-group {
  margin-top: 60px;
}

.contactPlate .contactContainer .form-group input:focus,
.contactPlate .contactContainer .form-group textarea:focus {
  background-color: #ffffff;
  border-color: #1200d8;
  box-shadow: 0 0 0 3px rgba(26, 27, 112, 0.1);
}

.contactPlate .contactContainer .btn-container {
  display: flex;
  margin-top: 30px;
}

.contactPlate .contactContainer .submit-btn {
  display: flex;
  align-items: center;
  background-color: #1200d8;
  border: none;
  border-radius: 25px;
  padding: 2px 2px 2px 24px;
  /* 留出左边文字间距 */
  color: #ffffff;
  cursor: pointer;
  font-size: 14px;
  font-weight: bold;
  transition: background-color 0.2s;
}

.contactPlate .contactContainer .submit-btn:hover {
  background-color: #131454;
}

.contactPlate .contactContainer .arrow-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #0e0f4d;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  margin-left: 16px;
  font-size: 16px;
}

.contactMap {
  padding-top: 120px 0;
}

.contactMap .map {
  margin-top: 100px;

  border-radius: 20px;
  height: 777px;
  width: 100%;
}

#baidu-map {
  width: 100%;
  height: 777px;
  border-radius: 20px;
}

.main-title {
  color: #000000;
  font-size: 45px;
  line-height: 1.5;
  width: 34%;
  font-weight: 500;
}

.main-title.bold {
  font-weight: bold;
  width: 46.7%;
}

.sub-description {
  color: #4d4d4d;
  font-size: 20px;
  line-height: 1.6;
  margin-bottom: 120px;
  margin-top: 25px;
  width: 34%;
}

.sub-description.bold {
  width: 46.7%;
}

.productModel {
  border: 1px solid #1200d8;
  border-radius: 24px;
  line-height: 45px;
  padding: 0 32px;
  color: #1200d8;
  font-size: 16px;
  display: inline-block;
  margin-bottom: 54px;
}

.newsPlate {
  padding: 120px 0 0 0;
}

.newsPlate.appdetail .newsContainer {
  padding-bottom: 106px;
  border-bottom: 1px solid #c1c1c1;
}

.newsPlate.nonept {
  padding-top: 0 !important;
}

.newsPlate .newsContainer {
  margin-top: 80px;
}

.newsPlate .newsContainer .detailTit {
  font-size: 32px;
  line-height: 45px;
  color: #000;
  font-weight: bold;
  padding-bottom: 76px;
  border-bottom: 1px solid #c1c1c1;
}

.newsPlate .newsContainer .detailCont .layout {
  display: flex;
  margin-top: 57px;
  align-items: center;
  gap: 45px;
}

.newsPlate .newsContainer .detailCont .layout .newdate {
  font-size: 16px;
  color: #000;
}

.newsPlate .newsContainer .detailCont .layout .lable {
  height: 30px;
  border-radius: 24px;
  padding: 0 15px;
  color: #1200d8;
  font-size: 14px;
  display: flex;
  align-items: center;
  border: 1px solid #1200d8;
  width: max-content;
}

.newsPlate .newsContainer .detailCont .layout .lable .circle {
  height: 6px;
  width: 6px;
  border: 1px solid #1200d8;
  border-radius: 50%;
  margin-right: 5px;
}

.newsPlate .newsContainer .detailCont .detailEditor {
  max-width: 1084px;
  margin: 0 auto;
  margin-top: 80px;
}

.newsPlate .newsContainer .detailCont .detailEditor p {
  font-size: 16px;
  line-height: 1.6;
  color: #000000;
}

.newsPlate .technologyLayout {
  display: flex;
  justify-content: space-between;
}

.newsPlate .technologyLayout .technologyTip {
  width: 24%;
  color: #000000;
  font-size: 16px;
  padding-right: 10%;
}

.newsPlate .technologyLayout .technologyList {
  width: 76%;
}

.newsPlate .technologyLayout .technologyList ul {
  border-top: 1px solid #c4c4c4;
}

.newsPlate .technologyLayout .technologyList ul li {
  border-bottom: 1px solid #c4c4c4;
  cursor: pointer;
}

.newsPlate .technologyLayout .technologyList ul li.on {
  border-bottom: 0px solid #c4c4c4;
}

.newsPlate .technologyLayout .technologyList ul li.on .technologyTit {
  color: #1200d8;
}

.newsPlate .technologyLayout .technologyList ul li .technologyTit {
  line-height: 1.6;
  font-size: 28px;
  padding: 32px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #000000;
}

.newsPlate .technologyLayout .technologyList ul li .technologyTit:hover {
  color: #1200d8;
}

.newsPlate .technologyLayout .technologyList ul li .technologyTit .toggle-btn {
  width: 32px;
  height: 32px;
  min-width: 32px;
  margin-left: 30px;
  border-radius: 50%;
  border: 1px solid #1200d8;
  background-color: transparent;
  position: relative;
  cursor: pointer;
  padding: 0;
  outline: none;
  box-sizing: border-box;
  transition: background-color 0.2s ease;
}

.newsPlate .technologyLayout .technologyList ul li .technologyTit .toggle-btn:hover {
  background-color: rgba(0, 0, 0, 0.05);
}

.newsPlate .technologyLayout .technologyList ul li .technologyTit .line {
  position: absolute;
  background-color: #1200d8;
  border-radius: 2px;
  top: 50%;
  left: 50%;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s;
}

.newsPlate .technologyLayout .technologyList ul li .technologyTit .line-horizontal {
  width: 16px;
  height: 1px;
  transform: translate(-50%, -50%);
}

.newsPlate .technologyLayout .technologyList ul li .technologyTit .line-vertical {
  width: 1px;
  height: 16px;
  transform: translate(-50%, -50%);
}

.newsPlate .technologyLayout .technologyList ul li .technologyTit .toggle-btn.active .line-vertical {
  transform: translate(-50%, -50%) rotate(90deg) scale(0);
  opacity: 0;
}

.newsPlate .technologyLayout .technologyList ul li .technologyCont {
  border-radius: 24px;
  width: 100%;
  overflow: hidden;
  display: none;
}

.newsPlate .technologyLayout .technologyList ul li .technologyCont img {
  width: 100%;
}

.newsPlate .applicatonList.bluebg .applicationText {
  background: #1200d8;
}

.newsPlate .applicatonList.bluebg .applicationText .applicationtit {
  color: #fff !important;
}

.newsPlate .applicatonList.bluebg .applicationText .applicationInfo {
  color: #fff !important;
}

.newsPlate .applicatonList li:nth-child(2n) a {
  flex-direction: row-reverse;
}

.newsPlate .applicatonList a {
  display: flex;
  justify-content: space-between;
  margin-bottom: 108px;
}

.newsPlate .applicatonList a:hover .applicationText .applicationtit {
  color: #1200d8;
}

.newsPlate .applicatonList a:hover .applicationPic img {
  transform: scale(1.1);
}

.newsPlate .applicatonList a .applicationPic {
  width: 65.8%;
  line-height: 0;
  border-radius: 24px;
  overflow: hidden;
}

.newsPlate .applicatonList a .applicationPic img {
  transition: all 0.5s ease;
}

.newsPlate .applicatonList a .applicationText {
  width: 32.45%;
  background: #f9f9f9;
  border-radius: 24px;
  padding: 45px 40px;
  display: flex;
  flex-direction: column;
}

.newsPlate .applicatonList a .applicationText .applicationtit {
  color: #000000;
  font-size: 32px;
  line-height: 1.6;
}

.newsPlate .applicatonList a .applicationText .applicationInfo {
  font-size: 16px;
  line-height: 1.6;
  margin-top: 16px;
  margin-bottom: auto;
}

.newsPlate .applicationLabList {
  display: flex;
  margin-bottom: 130px;
  flex-wrap: wrap;
  border-bottom: #898989 1px solid;
  gap: 44px;
}

.newsPlate .applicationLabList a {
  font-size: 20px;
  line-height: 1.6;
  padding-bottom: 16px;
  position: relative;
}

.newsPlate .applicationLabList a.on:after {
  content: "";
  position: absolute;
  bottom: -1.5px;
  left: 0;
  width: 100%;
  background: #1200d8;
  height: 2px;
}

.newsPlate .applicationLabList a.on,
.newsPlate .applicationLabList a:hover {
  color: #1200d8;
}

.newsPlate .applicationDetail .applicationEditor img {
  width: 100%;
  border-radius: 24px;
}

.newsPlate .application-section {
  display: flex;
  justify-content: center;
  margin-bottom: 260px;
}

.newsPlate .application-section .application-container {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: start;
  margin-top: 160px;
}

.newsPlate .application-section .application-contact-card {
  background-color: #f9f9f9;
  border-radius: 24px;
  width: 31.5%;
  padding: 44px 40px;
}

.newsPlate .application-section .card-tip {
  font-size: 20px;
  color: #000;
  line-height: 1.6;
  margin: 0 0 30px 0;
}

.newsPlate .application-section .card-email-box {
  display: flex;
  align-items: flex-start;
  gap: 25px;
}

.newsPlate .application-section .card-email-box .icon {
  margin-top: 12px;
}

.newsPlate .application-section .email-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.newsPlate .application-section .email-link {
  font-size: 32px;
  font-weight: 700;
  line-height: 1.6;
  color: #1200d8;
  text-decoration: none;
  transition: opacity 0.2s;
}

.newsPlate .application-section .email-link:hover {
  text-opacity: 0.8;
  text-decoration: underline;
}

.newsPlate .application-section .application-content {
  display: flex;
  flex-direction: column;
  gap: 30px;
  width: 52%;
}

.newsPlate .application-section .content-title {
  font-size: 32px;
  font-weight: 600;
  color: #000000;
  line-height: 1.6;
}

.newsPlate .application-section .content-description {
  font-size: 16px;
  color: #000;
  line-height: 1.6;
}

.newsPlate .contactCard {
  padding: 120px 0 186px 0;
  border-top: 1px solid #b4b4b4;
  margin-top: 106px;
}

.newsPlate .contactCard.noneBorder {
  margin-top: 0 !important;
  border-top: 0 !important;
  padding-top: 0 !important;
}

.newsPlate .contactCard .card {
  position: relative;
  width: 1084px;
  margin: 0 auto;
  background: #1200d8;
  border-radius: 20px;
  padding: 70px;
  overflow: hidden;
}

.newsPlate .contactCard .card.ora {
  background: #f08300;
}

.newsPlate .contactCard .card.ora>img {
  right: 90px;
  bottom: auto;
  top: 50%;
  transform: translate(0, -50%);
  width: 272px;
  border-radius: 20px;
  box-shadow: 0px 4px 21.8px 0px rgba(0, 0, 0, 0.25);
}

.newsPlate .contactCard .card>img {
  position: absolute;
  right: -67px;
  bottom: -54px;
}

.newsPlate .contactCard .card .cardTit {
  color: #fff;
  font-size: 45px;
}

.newsPlate .contactCard .card .cardInfo {
  color: #fff;
  font-size: 20px;
  line-height: 32px;
  width: 46%;
  margin-top: 30px;
}

.newsPlate .contactCard .card .btn-group {
  margin-top: 180px;
}

@media (min-width: 1900px) {
  .newsPlate.maxnopt {
    padding-top: 0;
  }
}

.relatedTop {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 90px;
}

.relatedTop span {
  color: #000000;
  font-size: 45px;
  display: flex;
}

.relatedTop span p {
  color: #c1c1c1;
}

.btn-group.bgwhite .btn-main {
  color: #1200d8 !important;
}

.btn-group.bgwhite .btn-main::after {
  background: #ffffff !important;
}

.btn-group.bgwhite .btn-arrow {
  background: #fff;
  color: #f08300;
}

.newsLabList {
  display: flex;
  gap: 16px;
}

.newsLabList a {
  display: block;
  line-height: 48px;
  padding: 0 32px;
  border-radius: 24px;
  background: #1200d8;
  color: #fff;
  font-size: 16px;
  border: 1px solid #1200d8;
}

.newsLabList a:hover {
  border: 1px solid #181878;
  background: #fff;
  color: #181878;
}

.newsLabList a.on {
  border: 1px solid #1200d8;
  background: #fff;
  color: #1200d8;
}

.newsLabList a.on:hover {
  background: #1200d8;
  color: #fff;
  border: 1px solid #1200d8;
}

.newsList ul {
  display: flex;
  flex-wrap: wrap;
  width: calc(100% + 20px);
  margin: -45px -10px;
}

.newsList ul.list li:first-child {
  width: 100%;
  margin-bottom: 40px;
  margin-top: 120px;
}

.newsList ul.list li:first-child a {
  display: flex;
  justify-content: space-between;
}

.newsList ul.list li:first-child a .pic {
  width: 47%;
}

.newsList ul.list li:first-child a .text {
  width: 47%;
  display: flex;
  flex-direction: column;
}

.newsList ul.list li:first-child a .text .newdate {
  margin-bottom: auto;
}

.newsList ul.list li:first-child a .text .lable {
  margin-top: 0;
}

.newsList ul.list li:first-child a .text .newTit {
  font-size: 32px;
}

.newsList ul li {
  width: 33.3%;
  padding: 45px 10px;
}

.newsList ul li a {
  display: block;
  width: 100%;
}

.newsList ul li a:hover .pic img {
  transform: scale(1.1);
}

.newsList ul li a:hover .newTit {
  color: #1200d8;
  text-decoration: underline;
}

.newsList ul li a .pic {
  line-height: 0;
  width: 100%;
  border-radius: 20px;
}

.newsList ul li a .newTit {
  color: #000000;
  font-size: 20px;
  line-height: 1.6;
  font-weight: bold;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.newsList ul li a .newdate {
  color: #999;
  font-size: 16px;
  margin-top: 26px;
}

.newsList ul li a .lable {
  height: 30px;
  border-radius: 24px;
  padding: 0 15px;
  color: #1200d8;
  font-size: 14px;
  display: flex;
  align-items: center;
  border: 1px solid #1200d8;
  margin: 35px 0 26px 0;
  width: max-content;
}

.newsList ul li a .lable .circle {
  height: 6px;
  width: 6px;
  border: 1px solid #1200d8;
  border-radius: 50%;
  margin-right: 5px;
}

.downloadList ul {
  display: flex;
  flex-wrap: wrap;
  width: calc(100% + 20px);
  margin: -45px -10px;
}

.downloadList ul li {
  width: 33.3%;
  padding: 45px 10px;
}

.downloadList ul li a {
  display: block;
  width: 100%;
}

.downloadList ul li a:hover .wordpic img {
  transform: scale(1.1);
}

.downloadList ul li a:hover .downloadCode {
  color: #1200d8;
  text-decoration: underline;
}

.downloadList ul li a .wordpic {
  text-align: center;
  position: relative;
  padding: 90px 0;
  border-radius: 24px;
  background: #f9f9f9;
  line-height: 0;
}

.downloadList ul li a .wordpic .icon {
  position: absolute;
  top: 32px;
  left: 32px;
  background: #1200d8;
  border-radius: 50px;
  width: 55px;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.downloadList ul li a .wordpic img {
  width: 46%;
  transition: all 0.3s ease-in-out;
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.3);
}

.downloadList ul li a .downloadSc {
  color: #4d4d4d;
  font-size: 16px;
  margin: 20px 0 10px 0;
}

.downloadList ul li a .downloadCode {
  color: #000000;
  font-size: 24px;
  line-height: 1.6;
}

.fy {
  display: flex;
  justify-content: space-between;
  margin-top: 150px;
}

.fy .pagination {
  display: flex;
  gap: 12px;
}

.fy .pagination a {
  height: 48px;
  width: 48px;
  color: #000000;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fy .pagination a.on {
  color: #f08300;
  border: 1px solid #f08300;
  border-radius: 50%;
}

.fy .pagination a:hover {
  color: #f08300;
}

.fy .fyBtn {
  line-height: 48px;
  border-radius: 24px;
  padding: 0 32px;
  font-size: 16px;
  display: block;
  color: #c1c1c1;
  background: #fff !important;
  border: 1px solid #c1c1c1 !important;
}

.fy .fyBtn:hover {
  border: 1px solid #1200d8 !important;
  color: #1200d8;
}

.aboutDetail~div {
  position: relative;
  z-index: 5;
  background-color: #ffffff;
}

#gsapTriggerSection {
  position: relative;
  z-index: 1;
  overflow: hidden;
  width: 100vw;
  height: 100vh;
}

.newsPlate .applicatonList.bluebg .applicationText:hover .btn-group.bgwhite .btn-main::after {
  background: #ffffff !important;
  width: 163px;
}

.newsPlate .applicatonList.bluebg .applicationText:hover .btn-group .btn-arrow {
  transform: rotate(45deg);
}

.aboutDetail .field-card-white {
  transition: all 0.3s ease-in-out !important;
}

@media (min-width: 2000px) {
  .aboutDetail {
    height: 100vh !important;
    max-height: 1100px !important;
    min-height: auto !important;
  }
}

.aboutDetail {
  width: 100vw;
  padding: 120px 0;
  background: #fff;
  border-radius: 24px 24px 0 0;
  position: relative;
  z-index: 5;
  min-height: 100vh;
  margin-top: -100vh;
  height: auto;
}



.aboutDetail .fields-grid-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  align-items: stretch;
}

.aboutDetail .field-card-white {
  border: 1px solid #2f1fdd;
  border-radius: 20px;
  padding: 34px;
  transition: all 0.5s ease;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 480px;
  position: relative;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  cursor: pointer;
}

.aboutDetail .field-card-white:hover {
  background: #1200d8;
}

.aboutDetail .field-card-white:hover .card-header h3,
.aboutDetail .field-card-white:hover .card-desc-text {
  color: #fff !important;
}

.aboutDetail .card-top-group {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.aboutDetail .card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.aboutDetail .card-header h3 {
  font-size: 32px;
  line-height: 1.6;
  color: #1200d8;
  font-weight: 500;
}

.aboutDetail .arrow-circle-btn {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid #3b42c4;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #3b42c4;
  transition: background-color 0.3s, color 0.3s;
}

.aboutDetail .field-card-white:hover .arrow-circle-btn {
  background-color: #1200d8;
  border: 1px solid #fff;
  color: #ffffff;
}

.aboutDetail .card-desc-text {
  font-size: 20px;
  line-height: 1.6;
  color: #1200d8;
  width: 80%;
  margin-bottom: 100px;
}

.aboutDetail .custom-icon-wrapper {
  width: 84px;
  height: 84px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #3b42c4;
}

.aboutDetail .custom-icon-wrapper .icon2 {
  display: none;
}

.aboutDetail .field-card-white:hover .custom-icon-wrapper .icon2 {
  display: block;
}

.aboutDetail .field-card-white:hover .custom-icon-wrapper .icon1 {
  display: none;
}

.aboutDetail .custom-icon-wrapper svg {
  width: 100%;
  height: 100%;
  stroke-width: 1.5;
}

.aboutDetail .grid-span-vertical {
  min-height: 100%;
}

.aboutDetail .left-nest-column {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.aboutDetail .left-nest-column .field-card-white {
  min-height: 228px;
}

.aboutDetail .field-card-dark-blue {
  background-color: #141974;
  border-radius: 20px;
  padding: 34px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.aboutDetail .field-card-dark-blue .card-desc-text {
  color: #fff;
}

.aboutDetail .field-card-dark-blue .card-desc-text {
  margin-bottom: 40px;
}

.aboutDetail .dark-card-title {
  font-size: 32px;
  color: #ffffff;
  line-height: 1.6;
}

.aboutDetail .metric-data-group {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.aboutDetail .metric-item {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.aboutDetail .metric-number {
  font-size: 70px;
  font-weight: 700;
  color: #ffffff;
  line-height: 1.1;
}

.aboutDetail .metric-label {
  font-size: 20px;
  line-height: 32px;
  color: #898989;
}

.hz-scroll-section {
  position: relative;
  width: 100%;
  height: 300vh;
  background-color: #ffffff;
}

.hz-scroll-section .hz-sticky-wrapper {
  position: sticky;
  top: -20vh;
  width: 100%;
  height: 120vh;
  padding-bottom: 100px;
  overflow: hidden;
}

.hz-scroll-section .hz-sticky-wrapper .sub-description {
  margin-bottom: 75px;
}

.hz-scroll-section .hz-sticky-wrapper .hz-cards-strip {
  display: flex;
  gap: 40px;
  padding-left: 5%;
  will-change: transform;
}

@media (min-width: 1700px) {
  .hz-scroll-section .hz-sticky-wrapper .hz-cards-strip {
    padding-left: calc((100vw - 1635px) / 2);
  }
}

.hz-scroll-section .hz-sticky-wrapper .hz-product-card {
  flex-shrink: 0;
  width: 670px;
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.hz-scroll-section .hz-sticky-wrapper .card-top {
  width: 100%;
}

.hz-scroll-section .hz-sticky-wrapper .step-num {
  font-size: 32px;
  color: #898989;
  margin-bottom: 12px;
  display: block;
}

.hz-scroll-section .hz-sticky-wrapper .step-line {
  width: 100%;
  height: 1px;
  background-color: #e2e8f0;
}

.hz-scroll-section .hz-sticky-wrapper .card-img {
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.hz-scroll-section .hz-sticky-wrapper .card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.hz-scroll-section .hz-sticky-wrapper .card-label {
  font-size: 20px;
  color: #000;
  font-weight: 500;
}

.hz-scroll-section .hz-sticky-wrapper .card-label::before {
  content: "*";
  margin-right: 4px;
}

.hz-scroll-section .hz-sticky-wrapper .mock-below {
  width: 100%;
  height: 100vh;
  background-color: #111111;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
}

@media (min-height: 1100px) {
  .hz-scroll-section {
    height: 92vh;
    max-height: 1100px;
  }
}

@media (min-height: 1000px) {
  .hz-scroll-section {
    max-height: 1050px;
  }
}

.hz-scroll-section {

  max-height: auto !important;
}

.previous-normal-section {
  width: 100%;
  height: 100vh;
  background-color: #f7fafc;
  display: flex;
  align-items: center;
  justify-content: center;
}

.gsap-interactive-section {
  position: relative;
  width: 100%;
  height: 100vh;
  background-color: #ffffff;
  overflow: hidden;
}

.text-flow-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 0px 5% 0 5%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 147px;
  z-index: 5;
}

.video-scale-container {
  position: absolute;
  left: 5%;
  top: 300px;
  width: 526px;
  height: 338px;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
  z-index: 2;
}

@media (min-width: 1700px) {
  .text-flow-wrapper {
    padding-left: calc((100vw - 1635px) / 2);
    padding-right: calc((100vw - 1635px) / 2);
  }

  .video-scale-container {
    left: calc((100vw - 1635px) / 2);
    width: 566px;
  }
}

.company-main-title {
  font-size: 45px;
  font-weight: bold;
  line-height: 1.6;
  color: #000000;
}

.video-placeholder-box {
  width: 72%;
  aspect-ratio: 16 / 9;
  margin-top: 60px;
}

.flow-right-text {
  font-size: 20px;
  line-height: 1.6;
  color: #4d4d4d;
  display: flex;
  flex-direction: column;
  gap: 20px;
  text-align: justify;
}

.video-scale-container video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.next-overlap-section {
  position: relative;
  width: 100%;
  min-height: 100vh;
  background-color: #111111;
  color: #ffffff;
  padding: 100px 60px;
  z-index: 20;
  box-shadow: 0 -20px 40px rgba(0, 0, 0, 0.3);
}

@media (max-width: 1024px) {
  .fields-grid-container {
    grid-template-columns: repeat(2, 1fr);
  }

  .grid-span-vertical,
  .field-card-dark-blue {
    grid-row: auto;
  }
}

@media (max-width: 1024px) {
  .fields-grid-container {
    grid-template-columns: 1fr;
  }

  .field-card-white {
    min-height: 320px;
  }

  .left-nest-column .field-card-white {
    min-height: 30vh;
  }
}

.newsPlate .applicatonList a.mbzero {
  margin-bottom: 0 !important;
}

.graphicList {
  margin-top: 80px;
}

.graphicList ul li:nth-child(2n) {
  background: #f9f9f9;
}

.graphicList ul li:nth-child(2n) a {
  flex-direction: row-reverse;
}

.graphicList ul li a {
  display: flex;
  width: 100%;
  padding: 200px 0;
  justify-content: space-between;
  align-items: center;
}

.graphicList ul li a.flexstart {
  align-items: flex-start;
}

.graphicList ul li a.flexstart.padding {
  padding: 0 !important;
}

.graphicList ul li a.padding {
  padding: 0px 0 130px 0;
}

.graphicList ul li a:hover .textLayout .graphicTit {
  color: #1200d8;
}

.graphicList ul li a:hover .picLayout img {
  transform: scale(1.1);
}

.graphicList ul li a .picLayout {
  width: 45%;
  border-radius: 20px;
  overflow: hidden;
}

.graphicList ul li a .picLayout img {
  transition: all 0.5s ease;
  width: 100%;
}

.graphicList ul li a .textLayout {
  width: 45%;
}

.graphicList ul li a .textLayout .graphicTit {
  font-size: 45px;
  line-height: 1.3;
  color: #000;
}

.graphicList ul li a .textLayout .graphicDesc {
  margin: 30px 0 50px 0;
  font-size: 20px;
  line-height: 32px;
  color: #000;
}

.pageLink {
  margin-top: 180px;
}

.pageLink.mt {
  margin-top: 150px;
  margin-bottom: 150px;
}

.pageLink ul {
  display: flex;
  gap: 20px;
}

.pageLink ul li a {
  display: block;
  width: 100%;
  position: relative;
  border-radius: 20px;
  overflow: hidden;
}

.pageLink ul li a:hover:after {
  display: none;
}

.pageLink ul li a:hover .pic img {
  transform: scale(1.1);
}

.pageLink ul li a:hover .linkTit {
  color: #1200d8;
}

.pageLink ul li a:hover .arrow-circle-btn {
  background: #1200d8;
  border: 1px solid #1200d8;
  color: #fff;
}

.pageLink ul li a:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  transition: all 0.3s ease;
}

.pageLink ul li a .arrow-circle-btn {
  position: absolute;
  z-index: 3;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  right: 0px;
  bottom: 0px;
  transition: background-color 0.3s, color 0.3s;
}

.pageLink ul li a .arrow-circle-btn svg {
  height: 24px;
  width: 24px;
}

.pageLink ul li a .text {
  position: absolute;
  left: 38px;
  bottom: 40px;
  width: calc(100% - 76px);
  z-index: 2;
}

.pageLink ul li a .num {
  font-size: 28px;
  z-index: 3;
  color: #fff;
  bottom: 98px;
}

.pageLink ul li a .linkTit {
  font-size: 36px;
  color: #fff;
  z-index: 3;
  line-height: 1.6;
  padding-right: 80px;
}

.pageLink ul li a .pic {
  width: 100%;
  line-height: 0;
  border-radius: 20px;
  overflow: hidden;
}

.pageLink ul li a .pic img {
  width: 100%;
}

.pagePosition {
  margin-top: 155px;
}

.pagePosition .currentPageTit {
  color: #000000;
  font-size: 70px;
  margin-top: 74px;
  line-height: 1.5;
  font-weight: 500;
}

.pagePosition .bannerMbxFlex {
  display: flex;
  align-items: center;
  font-size: 16px;
  color: #000;
}

.pagePosition .bannerMbxFlex a {
  color: #000;
  display: block;
  font-size: 16px;
}

.pagePosition .bannerMbxFlex a.on {
  color: #898989;
}

.slickPicList {
  width: 100%;
  position: relative;
  margin-bottom: 160px;
}

.slickPicList .slickTab {
  position: absolute;
  width: 100%;
  left: 50%;
  transform: translate(-50%, 0);
  bottom: 58px;
}

.slickPicList .slickTab .Flex {
  display: flex;
  gap: 20px;
  width: 100%;
}

@keyframes linewidth {
  0% {
    width: 0;
  }

  100% {
    width: 100%;
  }
}

.slickPicList .slickTab .slickTabItem {
  cursor: pointer;
  text-align: center;
  font-size: 16px;
  color: #fff;
  flex: 1;
}

.slickPicList .slickTab .slickTabItem.active .line:after {
  animation: linewidth 5s linear forwards;
}

.slickPicList .slickTab .slickTabItem .line {
  background: rgba(255, 255, 255, 0.5);
  width: 100%;
  height: 1px;
  margin-bottom: 20px;
  position: relative;
}

.slickPicList .slickTab .slickTabItem .line:after {
  content: "";
  position: absolute;
  left: 0%;
  z-index: 2;
  width: 0%;
  top: -1px;
  height: 2px;
  background: #fff;
}

.slickPicList li {
  width: 100%;
  position: relative;
}

.slickPicList li.slick-current .bannerText {
  opacity: 1;
  transform: translate(0, 0);
}

.slickPicList li .bannerPic img {
  height: 100vh;
  object-fit: cover;
  width: 100%;
}

.slickPicList li .bannerText {
  opacity: 0;
  transform: translate(0, 60px);
  position: absolute;
  transition: all 1s ease;
  top: 208px;
  border-radius: 20px;
  background: rgba(24, 24, 120, 0.6);
  padding: 112px 54px;
  width: 670px;
  left: 5%;
  z-index: 2;
}

.slickPicList li .bannerText .tit {
  color: #fff;
}

.slickPicList li .bannerText .desc {
  color: #fff;
  margin-top: 30px;
}

.historyTop {
  padding: 100px 0 0 0;
}

.historyTop .historyTopBg {
  padding: 150px 0;
  border-radius: 20px;
}

.historyTop .historyTopBg .usTitFont {
  color: #fff;
  text-align: center;
}

.historyTop .historyTopBg .usDescFont {
  text-align: center;
  color: #fff;
  width: 64%;
  margin: 30px auto 0 auto;
}

.historyList {
  padding: 100px 0 0 0;
  margin-bottom: 100px;
  position: relative;
}

.historyList:after {
  content: "";
  height: 100%;
  width: 1px;
  z-index: -1;
  background: #c1c1c1;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0);
}

.historyList ul {
  padding: 0 118px;
}

.historyList ul li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  padding: 72px 0;
}

.historyList ul li:last-child {
  padding-bottom: 0;
}

.historyList ul li:nth-child(2n) {
  flex-direction: row-reverse;
}

.historyList ul li:after {
  height: 28px;
  content: "";
  width: 28px;
  border-radius: 50%;
  background: #fff;
  position: absolute;
  left: 50%;
  top: 165px;
  z-index: 3;
  transform: translate(-50%, 0);
  border: 7px solid #1200d8;
}

.historyList ul li .historyPic {
  width: 39.5%;
  line-height: 0;
  border-radius: 20px;
  overflow: hidden;
}

.historyList ul li .historyPic img {
  width: 100%;
}

.historyList ul li .historyText {
  width: 39.5%;
}

.historyList ul li .historyText .historyNum {
  color: #1200d8;
  font-size: 70px;
  line-height: 1.6;
  font-weight: bold;
}

.historyList ul li .historyText .historyCont {
  color: #000000;
  margin-top: 25px;
}

@media (min-width: 1700px) {
  .slickPicList .bannerText {
    left: calc((100vw - 1635px) / 2);
  }
}

.usTitFont {
  font-size: 45px;
  line-height: 1.6;
}

.usDescFont {
  font-size: 20px;
  line-height: 1.6;
}

.pageLink {
  margin-bottom: 100px;
}

.aboutService {
  padding-top: 170px;
}

.aboutService .aboutServiceLayout {
  width: 100%;
  padding-left: 34.2%;
}

.aboutService .aboutServiceLayout .usTitFont {
  color: #000;
}

.aboutService .aboutServiceLayout .serviceList {
  width: 100%;
  margin-top: 88px;
}

.aboutService .aboutServiceLayout li {
  padding: 42px 50px;
  border: 1px solid #1200d8;
  border-radius: 20px;
  cursor: pointer;
  margin-bottom: 30px;
}

.aboutService .aboutServiceLayout li.on {
  background: #edf2f7;
}

.aboutService .aboutServiceLayout li.on .serviceTit .switchBtn {
  background: #f08300;
}

.aboutService .aboutServiceLayout li.on .serviceTit .switchBtn img {
  transform: rotate(-90deg);
}

.aboutService .aboutServiceLayout li:last-child {
  margin-bottom: 0;
}

.aboutService .aboutServiceLayout li .serviceCont {
  color: #4d4d4d;
  margin-top: 38px;
  display: none;
}

.aboutService .aboutServiceLayout li .serviceTit {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #000;
  font-size: 32px;
}

.aboutService .aboutServiceLayout li .serviceTit .switchBtn {
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background: #1200d8;
  display: flex;
  align-items: center;
  justify-content: center;
}

.aboutService .aboutServiceLayout li .serviceTit .switchBtn img {
  transition: all 0.5s ease;
}

.historyBanner {
  margin-top: 150px;
}

.historyBanner.mb {
  margin-bottom: 150px;
}

.historyBanner ul {
  padding-bottom: 35px;
}

.historyBanner .slick-dots {
  bottom: 0px;
  display: flex;
  gap: 12px;
  padding-bottom: 0;
  justify-content: center;
}

.historyBanner .slick-dots li {
  height: 12px;
  width: 12px;
  border-radius: 50%;
  background: #d9d9d9;
}

.historyBanner .slick-dots li.slick-active {
  background: #1200d8;
}

.historyBanner li {
  border-radius: 20px;
  padding: 70px;
}

.historyBanner li .usTitFont {
  color: #fff;
}

.historyBanner li .usDescFont {
  color: #fff;
  margin-top: 24px;
  width: 35%;
  margin-bottom: 250px;
}

.marquee-container {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  padding: 10px 0;
}

.marquee-container .marquee-content {
  display: inline-flex;
  animation: scroll-left 15s linear infinite;
}

.marquee-container .text-item {
  font-size: 120px;
  font-weight: bold;
  color: #e2e2e2;
  letter-spacing: 2px;
  padding-right: 50px;
}

@keyframes scroll-left {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-50%);
  }
}

.productInfomation {
  padding: 100px 0 170px 0;
}

.productInfomation .productInfomationLayout {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.productInfomation .productInfomationLayout .usTitFont {
  color: #000000;
  width: 44.6%;
  font-weight: bold;
}

.productInfomation .productInfomationLayout .usDescFont {
  color: #4d4d4d;
  width: 46%;
}

.productListBox ul {
  width: calc(100% + 20px);
  margin: -22px -10px;
  display: flex;
  flex-wrap: wrap;
}

.productListBox ul li {
  width: 33.3%;
  padding: 22px 10px;
}

.productListBox ul li a {
  border-radius: 20px;
  display: block;
  width: 100%;
  overflow: auto;
  position: relative;
}

.productListBox ul li a:hover:after {
  background-position: bottom center;
  /* 移到下半部分 */
}

.productListBox ul li a:hover .pic img {
  transition: all 0.5s ease;
}

.productListBox ul li a:hover .text .line {
  display: block;
}

.productListBox ul li a:hover .text .usDescFont {
  display: block;
}

.productListBox ul li a:hover .text .btn-group {
  display: flex;
}

.productListBox ul li a:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 20px;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(40, 44, 52, 0.3) 25%, rgba(20, 22, 26, 0.85) 50%,
      /* 原渐变占 0%-50% */
      rgba(151, 190, 231, 0.4) 50%, rgba(26, 92, 184, 0.7) 75%, rgba(1, 48, 128, 0.95) 100%
      /* 新渐变占 50%-100% */
    );
  background-size: 100% 200%;
  /* 宽度100%，高度200% */
  background-position: top center;
  /* 默认显示上半部分 */
  transition: background-position 0.5s ease;
  transition: all 0.8s;
}

.productListBox ul li a .pic {
  width: 100%;
}

.productListBox ul li a .text {
  width: calc(100% - 100px);
  position: absolute;
  left: 50px;
  bottom: 50px;
  z-index: 2;
}

.productListBox ul li a .text .line {
  width: 70px;
  height: 1px;
  background: #fff;
  margin: 24px 0;
  display: none;
}

.productListBox ul li a .text .usTitFont {
  color: #fff;
  font-weight: bold;
}

.productListBox ul li a .text .usDescFont {
  color: #fff;
  display: none;
  margin-bottom: 50px;
}

.productListBox ul li a .text .btn-group {
  display: none;
}

@media screen and (max-width: 1700px) {
  .site-footer .big-bg-text {
    font-size: 19vw;
  }

  .index-Banner .video .bannerTit {
    font-size: 70px;
  }

  .index-About .card-title {
    font-size: 24px;
    margin-bottom: 20px;
  }

  .index-About .card-desc {
    font-size: 16px;
  }

  .index-About .card {
    padding: 24px;
  }

  .index-About .card-icon img {
    margin-bottom: 56px;
  }

  .index-About .card-icon2 img {
    margin-bottom: 106px;
  }
}

@media screen and (max-width: 1500px) {
  .historyList ul {
    padding: 0 50px;
  }

  .historyBanner li .usDescFont {
    margin-bottom: 150px;
  }

  .usTitFont {
    font-size: 36px;
  }

  .historyBanner.mb {
    margin-bottom: 100px;
  }

  .aboutService {
    padding-top: 120px;
  }

  .aboutService .aboutServiceLayout .serviceList {
    margin-top: 50px;
  }

  .aboutService .aboutServiceLayout li {
    padding: 28px 34px;
    margin-bottom: 20px;
  }

  .aboutService .aboutServiceLayout li .serviceCont {
    margin-top: 24px;
  }

  .aboutService .aboutServiceLayout li .serviceTit {
    font-size: 24px;
  }

  .aboutService .aboutServiceLayout li .serviceTit .switchBtn {
    height: 32px;
    width: 32px;
  }

  .graphicList ul li a {
    padding: 120px 0;
  }

  .historyList ul li .historyText .historyNum {
    font-size: 50px;
  }

  .historyList ul li .historyText,
  .historyList ul li .historyPic {
    width: 44%;
  }

  .slickPicList li .bannerText {
    top: 100px;
    border-radius: 20px;
    background: rgba(24, 24, 120, 0.6);
    padding: 60px 40px;
  }

  .pagePosition .currentPageTit {
    font-size: 50px;
    margin-top: 40px;
  }

  .leftNav .navList ul li a {
    font-size: 32px;
    margin-bottom: 12px;
  }

  .rightSearch .search-input {
    height: 50px;
  }

  .leftNav .lang {
    width: calc(100% - 100px);
  }

  .rightSearch,
  .leftNav {
    padding: 40px 50px;
    width: 35vw;
  }

  .leftNav .lang a {
    font-size: 16px;
  }

  .leftNav .blogroll a {
    margin-bottom: 12px;
  }

  .rightSearch .ask-ai-banner,
  .rightSearch .links-list {
    margin-bottom: 15px;
  }

  .rightSearch .links-list {
    gap: 8px;
  }

  .rightSearch .links-list li a {
    font-size: 16px;
  }

  .rightSearch .search-btn {
    padding: 8px;
    font-size: 14px;
  }

  .hz-scroll-section .hz-sticky-wrapper {
    top: -30vh;
    height: 130vh;
  }

  .aboutDetail .field-card-white,
  .aboutDetail .field-card-dark-blue {
    padding: 24px;
  }

  .hz-scroll-section .hz-sticky-wrapper .hz-product-card {
    width: 400px;
    gap: 20px;
  }

  .hz-scroll-section .hz-sticky-wrapper .sub-description {
    margin-bottom: 30px;
  }

  .aboutDetail .card-header h3,
  .aboutDetail .dark-card-title {
    font-size: 28px;
  }

  .video-scale-container {
    top: 130px;
  }

  .flow-right-text {
    font-size: 16px;
  }

  .company-main-title {
    font-size: 26px;
  }

  .aboutDetail {
    padding: 60px 0;
  }

  .aboutDetail .metric-data-group {
    gap: 16px;
  }

  .aboutDetail .metric-number {
    font-size: 40px;
  }

  .aboutDetail .card-desc-text {
    font-size: 16px;
  }

  .aboutDetail .card-desc-text {
    margin-bottom: 50px;
  }

  .aboutDetail .custom-icon-wrapper {
    height: 60px;
    width: 60px;
  }

  .newsPlate .technologyLayout .technologyList ul li .technologyTit {
    font-size: 24px;
  }

  .newsPlate .technologyLayout .technologyTip {
    padding-right: 5%;
  }

  .newsPlate .newsContainer .main-title,
  .newsPlate .newsContainer .sub-description {
    width: 50%;
  }

  .newsPlate .applicationLabList {
    gap: 24px;
  }

  .newsPlate .application-section {
    margin-bottom: 140px;
  }

  .newsPlate .applicationLabList a {
    font-size: 18px;
  }

  .newsPlate .application-section .card-email-box .icon {
    margin-top: 4px;
  }

  .newsPlate .application-section .content-title {
    font-size: 24px;
  }

  .newsPlate .application-section .email-link {
    font-size: 24px;
  }

  .newsPlate .contactCard {
    padding: 80px 0 120px 0;
    margin-top: 80px;
  }

  .productList ul li a .productLayout .productLeft .product-desc {
    max-width: 500px;
  }

  .newsPlate .contactCard .card {
    width: 80%;
  }

  .newsPlate .contactCard .card .btn-group {
    margin-top: 120px;
  }

  .newsPlate .newsContainer .detailCont .detailEditor {
    max-width: 80%;
    margin-top: 60px;
  }

  .newsPlate .newsContainer .detailCont .layout {
    margin-top: 40px;
  }

  .pageLink ul li a .linkTit {
    font-size: 24px;
    bottom: 24px;
    left: 24px;
  }

  .graphicList ul li a.padding {
    padding-bottom: 80px;
  }

  .pageLink ul li a .num {
    left: 24px;
    bottom: 70px;
    font-size: 24px;
  }

  .pageLink ul li a .arrow-circle-btn {
    width: 40px;
    height: 40px;
  }

  .pageLink ul li a .arrow-circle-btn svg {
    width: 24px;
    height: 24px;
  }

  .newsPlate {
    padding: 50px 0;
  }

  .pageLink.mt {
    margin-top: 100px;
  }

  .insideBanner .insideBannerPic img {
    max-height: 500px;
    min-height: 300px;
  }

  .newsPlate .newsContainer .sub-description {
    margin-bottom: 80px;
  }

  .newsList ul.list li:first-child {
    margin-bottom: 0;
    margin-top: 80px;
  }

  .contactPlate .contactContainer {
    gap: 100px;
  }

  .contactPlate .contactContainer .info-sidebar {
    max-width: 40%;
  }

  .contactPlate .contactContainer .main-title {
    font-size: 32px;
  }

  .contactPlate .contactContainer .company-name {
    font-size: 24px;
  }

  .contactPlate .contactContainer .company-desc {
    font-size: 16px;
    margin-bottom: 90px;
  }

  .contactPlate .contactContainer .highlight-text {
    font-size: 16px;
  }

  .contactPlate .contactContainer .form-title {
    font-size: 60px;
  }

  .contactPlate .contactContainer .btn-group {
    margin-top: 40px;
  }

  .contactPlate .contactContainer .form-group input[type="text"],
  .contactPlate .contactContainer .form-group input[type="email"],
  .contactPlate .contactContainer .form-group input[type="tel"],
  .contactPlate .contactContainer .form-group textarea {
    height: 50px;
  }

  .contactPlate .contactContainer .form-row {
    gap: 20px;
    margin-bottom: 20px;
  }

  .contactPlate .contactContainer .form-group textarea {
    height: 150px;
  }

  .index-News .nav-buttons {
    top: 10px;
  }

  .index-News .nav-buttons img {
    height: 40px;
  }

  .index-News .nav-btn {
    height: 40px;
    width: 40px;
  }

  .index-News .viewport {
    height: calc(40vw + 60px);
  }

  .index-News .news-glass-panel {
    position: absolute;
    bottom: 20px;
    left: 24px;
    right: 24px;
    padding: 24px;
  }

  .index-News .card-number {
    font-size: 30px;
  }

  .index-News .card-title {
    font-size: 20px;
  }

  .newcard {
    width: 25vw !important;
  }

  .index-News .newcard {
    height: 400px;
  }

  .newcard.active {
    width: 40vw !important;
    height: 40vw !important;
    /* 激活卡片占屏幕宽度的 55% */
  }

  .index-Quality .quality-media-box {
    min-height: 630px;
  }

  .index-Quality .quality-tab-text {
    font-size: 32px;
  }

  .index-Quality .quality-desc-item.active p {
    font-size: 16px;
  }

  .index-Quality .quality-tabs-nav {
    gap: 30px;
  }

  .usCont {
    margin: 50px 0 80px 0;
  }

  .index-Applition .title {
    font-size: 32px;
  }

  .index-Applition .desc {
    font-size: 20px;
  }

  .index-Applition .applicationDown {
    padding: 70px 0 90px 0;
  }

  .index-Applition .applicationDown .tip {
    font-size: 32px;
  }

  .productList ul li a .productLayout .productLeft .product-code {
    font-size: 40px;
  }

  .productList ul li a .productLayout .productLeft .product-name {
    font-size: 24px;
    margin-top: 15px;
  }

  .productList ul li a .productLayout .productLeft .product-desc {
    font-size: 16px;
  }

  .index-About {
    padding: 100px 0;
  }

  .index-Product {
    padding-top: 100px;
  }

  .index-Product .productCont {
    font-size: 24px;
    margin: 60px 0 100px 0;
  }

  .index-About .number-box {
    font-size: 60px;
    margin-bottom: 20px;
  }

  .index-About .glass-header h3 {
    font-size: 24px;
  }

  .index-About .glass-mid .contentEditor {
    color: #fff;
    font-size: 16px;
    line-height: 1.4;
    margin-bottom: 14px;
    padding: 14px 0;
  }

  .index-About .card-icon img {
    margin-bottom: 46px;
  }

  .index-About .card-icon2 img {
    margin-bottom: 76px;
  }

  .nav-menu {
    gap: 24px;
  }

  .nav-item a {
    font-size: 14px;
  }

  .logo-container img {
    height: 30px;
  }

  .menu-toggle {
    width: 36px;
    height: 36px;
    margin-right: 30px;
  }

  .menu-toggle span {
    width: 14px;
  }

  .lang-item {
    font-size: 14px;
  }

  .lang-switch span {
    font-size: 14px;
  }

  .search-input {
    height: 32px;
    font-size: 14px;
  }

  .search-input::placeholder {
    font-size: 14px;
  }

  .search-icon {
    top: 10px;
  }

  .lang-switch {
    margin-right: 30px;
  }

  .header-navbar {
    height: 70px;
  }

  .index-Banner .video .bannerExcerpt {
    right: 60px;
    color: #fff;
    font-size: 16px;
    line-height: 1.6;
    width: 400px;
    bottom: 120px;
  }

  .index-Banner .video .tianrun-btn {
    height: 40px;
    width: 140px;
    bottom: 50px;
    right: 320px;
  }

  .index-Banner .video .tianrun-btn .btn-icon {
    height: 28px;
    width: 28px;
  }

  .indexTitle {
    font-size: 80px;
    line-height: 1;
  }

  .index-About .aboutCompany {
    font-size: 32px;
  }

  .index-About .aboutContent {
    font-size: 24px;
  }

  .index-About .intro-text {
    font-size: 16px;
  }
}

.navbar-floating {
  display: none;
}

.menu-overlay {
  display: none;
}

@media screen and (max-width: 1024px) {
  .historyList ul {
    padding: 0;
  }

  .pageLink ul li a .text {
    position: absolute;
    left: 20px;
    bottom: 20px;
    width: calc(100% - 40px);
    z-index: 2;
  }

  .insideBanner .insideBannerPic .video-mask-wrapper {
    display: none;
  }

  .historyBanner.mb {
    margin-bottom: 50px;
  }

  .aboutService .aboutServiceLayout {
    padding-left: 0;
  }

  .aboutService {
    padding-top: 50px;
  }

  .aboutService .aboutServiceLayout .serviceList {
    margin-top: 30px;
  }

  .aboutService .aboutServiceLayout li {
    padding: 20px 24px;
    margin-bottom: 20px;
  }

  .aboutService .aboutServiceLayout li .serviceCont {
    margin-top: 14px;
  }

  .aboutService .aboutServiceLayout li .serviceTit {
    font-size: 18px;
  }

  .aboutService .aboutServiceLayout li .serviceTit .switchBtn {
    height: 32px;
    width: 32px;
  }

  .historyList ul li .historyText .historyCont {
    margin-top: 5px;
  }

  .historyList ul li .historyText .historyNum {
    font-size: 30px;
    margin-top: 20px;
  }

  .historyList ul li {
    flex-direction: column !important;
    padding: 20px 0 20px 60px;
  }

  .historyList:after {
    left: 20px;
  }

  .historyList ul li:after {
    left: 15px;
    top: 59%;
  }

  .historyList ul li .historyPic {
    width: 100%;
  }

  .historyList {
    padding: 50px 0 0 0;
    margin-bottom: 50px;
  }

  .historyTop .historyTopBg .usDescFont {
    width: 80%;
  }

  .historyList ul li .historyText,
  .historyList ul li .historyPic {
    width: 100%;
  }

  .historyTop {
    padding-top: 30px;
  }

  .historyTop .historyTopBg {
    padding: 50px 0;
  }

  .graphicList ul li a {
    padding: 50px 0;
    flex-direction: column !important;
    gap: 40px;
  }

  .pageLink {
    margin-top: 50px;
  }

  .usTitFont {
    font-size: 24px;
    line-height: 1.6;
  }

  .slickPicList {
    margin-bottom: 60px;
  }

  .slickPicList li .bannerText .desc {
    margin-top: 10px;
  }

  .slickPicList li .bannerPic img {
    height: auto;
    min-height: 400px;
  }

  .slickPicList .slickTab .slickTabItem .line {
    margin-bottom: 10px;
  }

  .slickPicList .slickTab {
    bottom: 28px;
  }

  .usDescFont {
    font-size: 14px;
    line-height: 1.6;
  }

  .slickPicList li .bannerText {
    top: 30px;
    width: calc(100% - 30px);
    padding: 24px;
    left: 15px;
  }

  .graphicList {
    margin-top: 0;
  }

  .pageLink {
    margin-bottom: 30px !important;
  }

  .pageLink.mt {
    margin-top: 30px;
  }

  .pageLink ul {
    flex-direction: column;
  }

  .pageLink ul li {
    width: 100%;
  }

  .graphicList ul li a.padding {
    flex-direction: column;
  }

  .graphicList ul li a .textLayout,
  .graphicList ul li a .picLayout {
    width: 100%;
  }

  .graphicList ul li a .textLayout .graphicTit {
    font-size: 24px;
  }

  .pagePosition .currentPageTit {
    font-size: 30px;
    margin-top: 24px;
  }

  .graphicList ul li a .textLayout .graphicDesc {
    margin: 20px 0 30px 0;
    font-size: 14px;
    line-height: 1.6;
  }

  .pagePosition {
    margin-top: 125px;
  }

  .hz-scroll-section .hz-sticky-wrapper .hz-cards-strip {
    flex-direction: column;
  }

  .hz-scroll-section .hz-sticky-wrapper .sub-description {
    width: 100%;
  }

  .hz-scroll-section .hz-sticky-wrapper .hz-cards-strip {
    padding: 0 15px;
  }

  .aboutDetail .custom-icon-wrapper {
    height: 44px;
    width: 44px;
  }

  .aboutDetail .card-desc-text {
    margin-bottom: 30px;
  }

  .aboutDetail .field-card-dark-blue .card-desc-text {
    margin-bottom: 20px;
  }

  .sub-description {
    font-size: 16px;
  }

  .aboutDetail .metric-number {
    font-size: 30px;
  }

  .hz-scroll-section .hz-sticky-wrapper .card-label {
    font-size: 18px;
  }

  .hz-scroll-section .hz-sticky-wrapper .step-num {
    font-size: 24px;
  }

  .hz-scroll-section .hz-sticky-wrapper {
    padding-bottom: 60px;
  }

  .hz-scroll-section {
    height: auto;
  }

  .hz-scroll-section .hz-sticky-wrapper {
    height: auto;
    top: auto;
    position: relative;
  }

  .hz-scroll-section .hz-sticky-wrapper .hz-product-card {
    width: 100%;
  }

  .aboutDetail {
    padding-top: 0;
  }

  .aboutDetail .fields-grid-container {
    grid-template-columns: repeat(1, 1fr);
  }

  .gsap-interactive-section {
    height: auto !important;
  }

  .aboutDetail {
    margin-top: 0;
  }

  .video-scale-container {
    position: relative;
    top: 0;
    left: 15px;
    width: calc(100% - 30px);
    height: auto;
  }

  .text-flow-wrapper {
    position: relative;
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .video-placeholder-box {
    display: none;
  }

  .flow-right-text {
    font-size: 16px;
  }

  .company-main-title {
    font-size: 24px;
    margin-top: 30px;
  }

  .insideBanner {
    margin-top: 110px;
  }

  .newsPlate .technologyLayout {
    flex-direction: column;
  }

  .newsPlate .technologyLayout .technologyList ul li .technologyCont {
    height: 300px;
  }

  .newsPlate .technologyLayout .technologyList ul li .technologyTit p {
    font-size: 20px;
    width: calc(100% - 60px);
  }

  .newsPlate .technologyLayout .technologyList ul li .technologyTit {
    padding: 24px 0;
  }

  .newsPlate .technologyLayout .technologyList {
    width: 100%;
    margin-top: 30px;
  }

  .newsPlate .technologyLayout .technologyTip {
    width: 100%;
    padding-right: 0;
  }

  .newsPlate .applicatonList a {
    flex-direction: column-reverse !important;
    margin-bottom: 70px;
  }

  .newsPlate .applicatonList a .applicationPic,
  .newsPlate .applicatonList a .applicationText {
    width: 100%;
  }

  .newsPlate .applicatonList a .applicationPic {
    margin-bottom: 10px;
  }

  .newsPlate .applicatonList a .applicationText .applicationInfo {
    margin-bottom: 44px;
  }

  .newsPlate .applicatonList a .applicationText {
    padding: 24px;
  }

  .newsPlate .application-section .application-container {
    flex-direction: column !important;
    margin-top: 50px;
  }

  .newsPlate .application-section .card-email-box .icon {
    margin-top: 0;
  }

  .newsPlate .application-section .card-email-box .icon img {
    height: 20px;
  }

  .newsPlate .application-section {
    margin-bottom: 50px;
  }

  .newsPlate .application-section .content-description {
    font-size: 14px;
  }

  .newsPlate .application-section .content-title {
    font-size: 18px;
  }

  .newsPlate .application-section .application-content {
    width: 100%;
    margin-top: 30px;
  }

  .newsPlate .application-section .card-email-box {
    gap: 20px;
  }

  .newsPlate .application-section .application-contact-card {
    width: 100%;
    padding: 24px;
  }

  .newsPlate .application-section .email-link {
    font-size: 16px;
  }

  .newsPlate .applicationLabList {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    margin-bottom: 40px;
  }

  .newsPlate .applicationLabList a {
    white-space: nowrap;
  }

  .downloadList ul li a .downloadCode {
    font-size: 24px;
  }

  .productList ul li a .productLayout .productLeft .product-desc {
    max-width: 100% !important;
  }

  .downloadList ul li {
    width: 100%;
  }

  .downloadList ul {
    width: 100%;
    margin: -30px 0px;
  }

  .downloadList ul li {
    padding: 15px 0;
  }

  .newsPlate .contactCard .card {
    width: 100%;
    padding: 24px !important;
  }

  .newsPlate .contactCard {
    padding: 40px 0 60px 0;
    margin-top: 40px;
  }

  .relatedTop span {
    font-size: 24px;
  }

  .relatedTop {
    margin-bottom: 55px;
  }

  .relatedTop span {
    font-size: 16px;
  }

  .newsPlate .contactCard .card .cardTit {
    font-size: 24px;
  }

  .newsPlate .contactCard .card .btn-group {
    margin-top: 80px;
  }

  .newsPlate .contactCard .card .cardInfo {
    font-size: 14px;
    line-height: 1.6;
    width: 100%;
    margin-top: 20px;
  }

  .newsPlate .newsContainer .detailCont .detailEditor {
    max-width: 100%;
    margin-top: 40px;
  }

  .newsPlate .newsContainer .detailTit {
    font-size: 20px;
    line-height: 1.6;
  }

  .newsPlate .newsContainer .main-title {
    font-size: 28px;
    width: 100%;
  }

  .newsPlate .newsContainer {
    margin-top: 16px;
  }

  .newsPlate .newsContainer .detailTit {
    padding-bottom: 50px;
  }

  .newsList ul {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin: -30px 0px;
  }

  .newsList ul li {
    width: 100%;
    padding: 15px 0;
  }

  .newsList ul.list li:first-child a {
    flex-direction: column;
  }

  .newsList ul.list li:first-child a>div {
    width: 100% !important;
  }

  .newsList ul.list li:first-child a .btn-group {
    margin-top: 16px;
  }

  .newsList ul.list li:first-child {
    margin-bottom: 30px;
  }

  .newsList ul.list li:first-child a .text .newTit {
    font-size: 20px;
  }

  .newsList ul li a .lable {
    margin-bottom: 16px;
  }

  .newsList ul li a .newdate {
    margin-top: 16px;
  }

  .newsList ul.list li:first-child a .text {
    margin-top: 20px;
  }

  .newsPlate .newsContainer .sub-description {
    margin-bottom: 30px;
    width: 100%;
  }

  .newsList ul li a .lable {
    margin-top: 16px;
  }

  .newsPlate {
    padding: 30px 0;
  }

  .fy {
    justify-content: center;
    margin-top: 40px;
  }

  .newsLabList {
    gap: 6px;
  }

  .fy .fyBtn {
    display: none;
  }

  .newsLabList a {
    line-height: 36px;
    padding: 0 12px;
    border-radius: 20px;
    font-size: 14px;
    white-space: nowrap;
  }

  .newsPlate .newsContainer .sub-description {
    font-size: 16px;
  }

  .newsPlate .newsContainer {
    margin-top: 30px;
  }

  .contactPlate .contactContainer .form-container {
    width: 100%;
  }

  .contactPlate {
    padding: 60px 0;
  }

  .contactPlate .contactContainer {
    flex-direction: column;
    gap: 60px;
    margin-top: 30px;
  }

  .insideBanner .bannerMbx {
    top: 15px;
  }

  .contactPlate .contactContainer .info-sidebar {
    max-width: 100%;
  }

  .insideBanner .bannerMbx .currentTit {
    font-size: 24px;
    margin-top: 100px;
    text-align: center;
  }

  .contactMap .map {
    margin-top: 30px;
    height: 400px;
  }

  .contactPlate .contactContainer .main-title {
    font-size: 24px;
  }

  .contactPlate .contactContainer .highlight-link {
    font-size: 16px;
  }

  .contactPlate .contactContainer .company-name {
    font-size: 18px;
  }

  .contactPlate .contactContainer .company-desc {
    font-size: 16px;
    margin-bottom: 30px;
  }

  .contactPlate .contactContainer .highlight-text {
    font-size: 16px;
  }

  .contactPlate .contactContainer .form-title {
    font-size: 30px;
  }

  .contactPlate .contactContainer .btn-group {
    margin-top: 20px;
  }

  .contactPlate .contactContainer .form-group input[type="text"],
  .contactPlate .contactContainer .form-group input[type="email"],
  .contactPlate .contactContainer .form-group input[type="tel"],
  .contactPlate .contactContainer .form-group textarea {
    height: 40px;
  }

  .contactPlate .contactContainer .form-row {
    gap: 20px;
    margin-bottom: 20px;
  }

  .contactPlate .contactContainer .form-group textarea {
    height: 150px;
  }

  .navbar-floating {
    position: fixed;
    top: 15px;
    left: 15px;
    right: 15px;
    height: 80px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    z-index: 100;
    background: #ffffffb3 !important;
    backdrop-filter: blur(21px);
  }

  /* 汉堡按钮 */
  .menu-toggle-btn {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid #000000;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #333;
    font-size: 18px;
  }

  /* SKF 标志文本模拟（可替换为实际图片） */
  .logo-text {
    color: #ffffff;
    font-size: 28px;
    font-weight: 900;
    letter-spacing: 2px;
  }

  .logo-text img {
    height: 25px;
  }

  /* 顶部右侧原生搜索图标 */
  .search-toggle-btn {
    background: transparent;
    border: none;
    color: #333;
    font-size: 18px;
    cursor: pointer;
    padding: 8px;
  }

  /* ==========================================================================
           第二张图：点击打开的全屏菜单面板
           ========================================================================== */
  .menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    z-index: 200;
    padding: 24px;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    /* 动画过渡效果：默认隐藏在右侧 */
    transform: translateX(100%);
    transition: transform 0.3s ease-in-out;
  }

  /* 激活状态：从右侧滑入 */
  .menu-overlay.active {
    transform: translateX(0);
  }

  /* 展开面板顶部的头部区 */
  .overlay-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
  }

  .close-btn {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid #eaeaea;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #000000;
    font-size: 16px;
  }

  .logo-dark img {
    height: 25px;
  }

  .main-menu {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 30px;
  }

  .main-menu-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-decoration: none;
    color: #000000;
    font-size: 32px;
    font-weight: 400;
    position: relative;
  }

  .main-menu-item .arrow {
    height: 12px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(-50%, 0);
    width: 12px;
    border-top: 2px solid #000;
    border-right: 2px solid #000;
    transform: translate(0, -50%) rotate(45deg);
  }

  .main-menu-item i {
    font-size: 16px;
    color: #000000;
  }

  .sub-menu {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 16px;
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 25px;
    margin-bottom: 25px;
  }

  .sub-menu-item {
    text-decoration: none;
    color: #666666;
    font-size: 16px;
  }

  .search-box-container {
    margin-bottom: 25px;
    position: relative;
  }

  .search-input-wap {
    width: 100%;
    padding: 12px 16px 12px 40px;
    border: 1px solid #cccccc;
    border-radius: 8px;
    font-size: 15px;
    outline: none;
    background-color: #f9f9f9;
  }

  .search-input:focus {
    border-color: #5a5e61;
    background-color: #ffffff;
  }

  .search-box-container i {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #999999;
    font-size: 14px;
  }

  /* 语言切换样式 */
  .language-selector {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: auto;
    /* 自动推到面板最底部 */
    padding-top: 15px;
  }

  .lang-label {
    font-size: 14px;
    color: #666666;
    display: flex;
    align-items: center;
    gap: 6px;
  }

  .lang-select {
    padding: 6px 12px;
    border: 1px solid #cccccc;
    border-radius: 6px;
    font-size: 14px;
    background-color: #ffffff;
    color: #333333;
    outline: none;
    cursor: pointer;
  }

  .layout37 {
    display: block;
    position: fixed !important;
    z-index: 16;
    top: 0px;
  }

  .top_nav {
    display: none;
  }

  .nbanner {
    margin-top: 50px;
  }
}

@media (max-width: 1024px) {
  .nav-menu {
    display: none;
  }

  .logo-text-chn {
    display: none;
  }

  .industry-video {
    width: 100%;
    margin-top: 50px;
    padding: 0 15px;
  }

  .industry-video .video .video-cont .btn-group {
    display: flex;
    justify-content: center;
  }

  .industry-video .video .video-cont .videoTit {
    font-size: 20px;
    margin-bottom: 20px;
  }

  .industry-video .video .video-cont .videoDesc {
    font-size: 16px;
    line-height: 1.6;
    color: #fff;
    margin-bottom: 20px;
  }

  .industry-video .video video {
    height: 400px;
    object-fit: cover;
  }
}

@media screen and (max-width: 768px) {
  .header-navbar {
    display: none;
  }

  .leftNav {
    display: none;
  }
}

@media screen and (max-width: 1024px) {
  .productModel {
    margin-bottom: 30px;
  }

  #baidu-map {
    width: 100%;
    height: 400px;
    border-radius: 20px;
  }

  .logowap {
    display: block;
  }

  .logopc {
    display: none;
  }

  .site-footer .footer-container {
    flex-direction: column;
    gap: 14px;
  }

  .site-footer .footer-upper {
    padding-bottom: 30px;
  }

  .site-footer .col-contact {
    width: 100%;
    margin-top: 20px;
    gap: 10px;
  }

  .site-footer .company-name {
    font-size: 20px;
    margin-top: 10px;
  }

  .site-footer .company-desc,
  .site-footer a {
    font-size: 16px;
  }

  .site-footer .company-desc {
    margin-bottom: 15px;
  }

  .site-footer .email-group {
    margin-bottom: 20px;
  }

  .site-footer .link-list a {
    font-size: 16px;
  }

  .site-footer .footer-upper {
    padding-top: 50px;
  }

  .site-footer .col-info {
    padding-right: 0;
  }

  .site-footer .col-links {
    flex: none;
    padding-top: 0px;
  }

  .site-footer .link-list {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 12px;
  }

  .site-footer .lower-container {
    flex-direction: column;
    gap: 15px;
  }

  .site-footer .big-bg-text {
    font-size: 22vw;
    bottom: -20px;
  }
}

@media (max-width: 1024px) {
  .nav-menu {
    display: none;
  }

  .logo-text-chn {
    display: none;
  }
}

@media (max-width: 1024px) {
  .quality-container {
    flex-direction: column;
    gap: 40px;
  }

  .quality-media-box {
    min-height: 350px;
  }

  .quality-tab-text {
    font-size: 1.8rem;
  }
}

.productListSec {
  padding: 140px 0;
  background: #f9f9f9;
}

.productListSec.productCenterList {
  padding: 100px 0;
  background: #fff;
}

.productListSec.productCenterList.nonepadd {
  padding-bottom: 0;
}

.productListSec.productCenterList .interval {
  height: 150px;
}

.productListSec.productCenterList .usTitFont {
  color: #000;
  font-weight: bold;
  margin-bottom: 100px;
}

.productListSec.productCenterList ul li a {
  background: #f9f9f9;
}

.productListSec.productCenterList ul li a .title {
  margin-bottom: 0;
}

.productListSec.productCenterList ul li a .quality-more-action {
  margin-top: 20px;
}

.productListSec ul {
  width: calc(100% + 20px);
  margin: -22px -10px;
  display: flex;
  flex-wrap: wrap;
}

.productListSec ul li {
  width: 25%;
  padding: 22px 10px;
}

.productListSec ul li a {
  border-radius: 20px;
  display: block;
  width: 100%;
  overflow: auto;
  position: relative;
  padding: 38px 30px;
  background: #fff;
}

.productListSec ul li a:hover {
  background: linear-gradient(to bottom, #e3ecf7 0%, #b2cbe9 18%, #3b6da9 55%, #0b3b75 100%);
}

.productListSec ul li a:hover .pic img {
  transform: scale(1.1);
}

.productListSec ul li a:hover .title {
  color: #fff;
}

.productListSec ul li a:hover .quality-link-btn {
  color: #fff;
}

.productListSec ul li a:hover .quality-link-btn .icon2 {
  display: block;
}

.productListSec ul li a:hover .quality-link-btn .icon1 {
  display: none;
}

.productListSec ul li a .pic {
  width: 100%;
}

.productListSec ul li a .title {
  font-size: 26px;
  color: #000;
  margin: 40px 0 20px 0;
  font-weight: bold;
}

.productListSec ul li a .quality-link-btn {
  display: flex;
  gap: 8px;
  align-items: center;
}

.productListSec ul li a .quality-link-btn .icon2 {
  display: none;
}

.lineborder {
  background: #c1c1c1;
  margin-top: 150px;
  width: 100%;
  height: 1px;
}

.productCenter {
  width: 100%;
}

.productCenter .productCenterLayout {
  display: flex;
  justify-content: space-between;
}

.productCenter .productCenterLayout .rightCont {
  width: calc(32% - 38px);
}

.productCenter .productCenterLayout .rightCont .rigthTit {
  background: #0000fe;
  line-height: 68px;
  border-radius: 20px;
  padding: 0 35px;
  color: #fff;
  font-size: 20px;
  margin-bottom: 25px;
}

.productCenter .productCenterLayout .rightCont .menu-container {
  width: 100%;
  background-color: #f9f9f9;
  border-radius: 20px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  padding: 0 35px;
  height: calc(100% - 120px);
}

.productCenter .productCenterLayout .rightCont .menu-group {
  width: 100%;
}

.productCenter .productCenterLayout .rightCont .menu-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 0px;
  font-size: 20px;
  color: #1200d8;
  cursor: pointer;
  border-bottom: 1px solid #c1c1c1;
  transition: background-color 0.2s;
}

.productCenter .productCenterLayout .rightCont .menu-item:hover span {
  color: #1200d8;
}

.productCenter .productCenterLayout .rightCont .menu-group:last-child .menu-item:last-child {
  border-bottom: none;
}

.productCenter .productCenterLayout .rightCont .arrow {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-top: 2px solid #1200d8;
  border-right: 2px solid #1200d8;
  transform: rotate(45deg);
  transition: transform 0.2s ease, margin-top 0.2s ease;
}

.productCenter .productCenterLayout .rightCont .menu-group.open .main-item .arrow {
  transform: rotate(135deg);
  margin-top: -4px;
}

.productCenter .productCenterLayout .rightCont .submenu {
  display: none;
  background-color: #fafafa;
}

.productCenter .productCenterLayout .rightCont .sub-item {
  color: #666666;
  border-bottom: 1px solid #c1c1c1;
}

.productCenter .productCenterLayout .rightCont .submenu .sub-item:last-child {
  border-bottom: 1px solid #c1c1c1;
}

.productCenter .productCenterLayout .leftCont {
  width: 68%;
}

.productCenter .productCenterLayout .leftCont .leftContTop {
  display: flex;
  gap: 20px;
  margin-bottom: 60px;
}

.productCenter .productCenterLayout .leftCont .leftContTop .leftContTopItem .leftContTopItemTit {
  background: #edf2f7;
  line-height: 68px;
  border-radius: 20px;
  padding: 0 35px;
  color: #1200d8;
  font-size: 20px;
}

.productCenter .productCenterLayout .leftCont .leftContTop .leftContTopItem .pic {
  background: #f9f9f9;
  border-radius: 20px;
  padding: 50px;
  width: 100%;
  margin-top: 20px;
}

.productCenter .productCenterLayout .productInfomatione ul li {
  margin-bottom: 80px;
}

.productCenter .productCenterLayout .productInfomatione ul li table {
  width: 100%;
  border-collapse: collapse;
  font-size: 16px;
  color: #000000;
  text-align: left;
}

.productCenter .productCenterLayout .productInfomatione ul li th {
  font-weight: bold;
  padding: 12px 8px;
  border-bottom: 2px solid #000000;
}

.productCenter .productCenterLayout .productInfomatione ul li td {
  padding: 12px 8px;
  border-bottom: 1px solid #e0e0e0;
  height: 48px;
}

.productCenter .productCenterLayout .productInfomatione ul li .col-characteristic {
  width: 60%;
}

.productCenter .productCenterLayout .productInfomatione ul li .col-value {
  width: 20%;
}

.productCenter .productCenterLayout .productInfomatione ul li .col-unit {
  width: 20%;
}

.productCenter .productCenterLayout .productInfomatione ul li .section-header {
  font-weight: bold;
  padding-top: 16px;
  padding-bottom: 16px;
}

.productCenter .productCenterLayout .productInfomatione ul li .sub-row td {
  color: #333333;
}

.productCenter .productCenterLayout .productInfomatione ul li:last-child {
  margin-bottom: 0;
}

.productCenter .productCenterLayout .productInfomatione ul li:first-child .infomationEditor {
  display: block;
}

.productCenter .productCenterLayout .productInfomatione ul li .labTit {
  display: flex;
  justify-content: space-between;
  font-size: 20px;
  color: #0000fe;
  padding-bottom: 25px;
  margin-bottom: 25px;
  border-bottom: 1px solid #898989;
}

.productCenter .productCenterLayout .productInfomatione ul li .labTit .toggle-btn {
  width: 32px;
  height: 32px;
  background-image: url("/img/add.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 32px 32px;
}

.productCenter .productCenterLayout .productInfomatione ul li .labTit .toggle-btn.active {
  background-image: url("/img/sub.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 32px 32px;
}

.productCenter .productCenterLayout .productInfomatione ul li .infomationEditor {
  font-size: 16px;
  line-height: 28px;
  color: #4d4d4d;
  display: none;
}

.historyBanner .slick-dots li {
  padding: 0 !important;
}

@media screen and (max-width: 1500px) {
  .lineborder {
    margin-top: 100px;
  }

  .newsPlate .contactCard .card {
    padding: 50px;
  }

  .productListBox ul li a .text {
    width: calc(100% - 60px);
    left: 30px;
    bottom: 30px;
  }

  .productListBox ul li a .text .usDescFont {
    margin-bottom: 20px;
  }

  .productListBox ul li a .text .line {
    margin: 12px 0;
  }

  .productListSec.productCenterList .usTitFont {
    margin-bottom: 70px;
  }

  .productListSec ul li a {
    padding: 24px 20px;
  }

  .productCenter .productCenterLayout .rightCont .menu-container {
    padding: 0 25px;
  }

  .productCenter .productCenterLayout .productInfomatione ul li {
    margin-bottom: 40px;
  }

  .productCenter .productCenterLayout .rightCont .menu-item {
    font-size: 18px;
    padding: 12px 0;
  }

  .productListSec ul li a .title {
    font-size: 20px;
  }

  .productCenter .productCenterLayout .productInfomatione ul li .labTit {
    padding-bottom: 15px;
    margin-bottom: 15px;
  }

  .historyBanner {
    margin-top: 100px;
  }

  .productListSec ul li a .quality-link-btn {
    font-size: 16px;
  }
}

@media screen and (max-width: 1024px) {
  .lineborder {
    margin-top: 0px;
  }

  .productListBox ul li a .text {
    left: 24px;
  }

  .newsPlate .contactCard .card.ora>img {
    position: relative;
    top: 0;
    left: 0;
    transform: translate(0, 0%);
    width: 100%;
    margin-bottom: 40px;
  }

  .productListBox ul li {
    width: 100%;
  }

  .productListBox ul li a .text .line,
  .productListBox ul li a .text .usDescFont {
    display: block;
  }

  .productListSec {
    padding: 60px 0;
  }

  .productListBox ul {
    width: 100%;
    margin: -15px 0px;
  }

  .productListBox ul li {
    padding: 15px 0;
  }

  .productListBox ul li a .text .btn-group {
    display: flex;
  }

  .marquee-container .text-item {
    font-size: 40px;
  }

  .productInfomation .productInfomationLayout {
    flex-direction: column;
    gap: 20px;
  }

  .productInfomation .productInfomationLayout>div {
    width: 100% !important;
  }

  .productInfomation {
    padding: 50px 0 70px 0;
  }

  .productCenter .productCenterLayout {
    flex-direction: column-reverse;
  }

  .historyBanner {
    margin-top: 50px;
  }

  .productCenter .productCenterLayout .rightCont {
    width: 100%;
  }

  .productCenter .productCenterLayout .rightCont .rigthTit,
  .productCenter .productCenterLayout .leftCont .leftContTop .leftContTopItem .leftContTopItemTit {
    line-height: 50px;
    border-radius: 20px;
    padding: 0 20px;
    font-size: 18px;
    margin-bottom: 15px;
  }

  .productListSec ul li {
    width: 100%;
  }

  .productListSec ul li a .pic img,
  .productCenter .productCenterLayout .leftCont .leftContTop .leftContTopItem .pic img {
    max-width: 60%;
  }

  .historyBanner li .usDescFont {
    margin-bottom: 80px;
  }

  .historyBanner li .usDescFont {
    width: 100%;
  }

  .historyBanner li {
    padding: 30px 20px;
  }

  .productListSec ul {
    margin: -15px 0;
    width: 100%;
  }

  .productListSec ul li {
    padding: 15px 0;
  }

  .productCenter .productCenterLayout .leftCont .leftContTop .leftContTopItem .pic {
    text-align: center;
  }

  .productListSec ul li a .pic {
    text-align: center;
  }

  .productCenter .productCenterLayout .leftCont .leftContTop .leftContTopItem .pic {
    padding: 20px;
  }

  .productCenter .productCenterLayout .leftCont {
    width: 100%;
  }

  .productCenter .productCenterLayout .leftCont .leftContTop {
    flex-direction: column;
    margin-top: 40px;
  }

  .productCenter .productCenterLayout .leftCont .leftContTop>div {
    width: 100%;
  }

  .productListSec.productCenterList {
    padding: 50px 0;
  }

  .productListSec.productCenterList .interval {
    height: 50px;
  }

  .productListSec ul li a .title {
    font-size: 16px;
  }

  .productListSec.productCenterList .usTitFont {
    margin-bottom: 30px;
  }

  .newsPlate .applicatonList a .applicationText .applicationtit {
    font-size: 24px;
  }

  .wapcontContainer {
    position: absolute;
    height: calc(100% - 150px);
    width: calc(100% - 30px);
    padding-right: 20px;
    display: none;
    top: 100px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #ccc rgba(255, 255, 255, 0.75);
  }

  .wapcontContainer::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border-radius: 8px;
  }

  .menuTit {
    margin-top: 35px;
    display: flex;
    padding-bottom: 20px;
    justify-content: space-between;
    border-bottom: 1px solid #666;
  }

  .menuTit span {
    font-size: 20px;
    color: #000;
  }

  .menuTit a {
    text-decoration: underline;
    font-size: 16px;
    color: #666;
  }

  .menuTit a:hover {
    color: #1200d8;
  }

  .productNavList {
    padding: 30px 0;
    margin-bottom: 20px;
    border-bottom: 1px solid #666;
  }

  .productNavList.noborder {
    border-bottom: 0;
  }

  .productNavList .productItem {
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
  }

  .productNavList .productItem:last-child {
    margin-bottom: 0;
  }

  .productNavList .productItem:hover .proTit {
    color: #1200d8;
  }

  .productNavList .productItem:hover .arrow {
    border-top: 2px solid #1200d8;
    border-right: 2px solid #1200d8;
  }

  .productNavList .productItem .pic {
    width: 64px;
    height: 64px;
    margin-right: 16px;
  }

  .productNavList .productItem .proTit {
    font-size: 18px;
    color: #000;
    margin-right: auto;
  }

  .productNavList .productItem .arrow {
    height: 12px;
    width: 12px;
    border-top: 2px solid #000;
    border-right: 2px solid #000;
    top: 50%;
    transform: translate(0%, -50%) rotate(45deg);
  }

  .proClassify {
    color: #000;
    font-size: 20px;
    display: block;
    width: 100%;
    line-height: 2.5;
  }

  .proClassify:hover {
    color: #1200d8;
  }
}

.index-News .newcard .card-bg img {
  transition: all 0.5s ease;
}

.index-News .newcard:hover .card-bg img {
  transform: scale(1.1);
}

.applicatonList ul li:nth-child(1) {
  transition-delay: 0ms;
}

.applicatonList ul li:nth-child(2) {
  transition-delay: 100ms;
}

.applicatonList ul li:nth-child(3) {
  transition-delay: 200ms;
}

.applicatonList ul li:nth-child(4) {
  transition-delay: 300ms;
}

.applicatonList ul li:nth-child(5) {
  transition-delay: 400ms;
}

.applicatonList ul li:nth-child(6) {
  transition-delay: 500ms;
}

.applicatonList ul li:nth-child(7) {
  transition-delay: 600ms;
}

.contact-block a {
  color: #555 !important;
}

.applicatonList ul li:nth-child(8) {
  transition-delay: 700ms;
}

.aboutService .aboutServiceLayout li .serviceTit .switchBtn img {
  margin-left: 3px;
  transition: all 0.5s ease;
}

.aboutService .aboutServiceLayout li.on .serviceTit .switchBtn img {
  margin-left: 0px;
}

.productListSec ul li:hover .quality-link-btn img {
  transform: translate(2px, -2px);
}

.productListSec ul li img {
  transition: all 0.5s ease;
}