@charset "utf-8";
/* ==========================================================================

1920px（1rem = 页面宽度的 1%，最大 19.2px）
   ========================================================================== */

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

html { font-size: calc(100vw / 100); }
@media (min-width: 1920px) { html { font-size: 19.2px; } }

body {
  font-family: "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", "Helvetica Neue", Arial, sans-serif;
  color: #333;
  background: #fff;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

body.fixed { overflow: hidden; }

ul, ol, li { list-style: none; }
img { border: 0; display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; transition: color .3s; }
input, button { font-family: inherit; outline: none; border: 0; background: none; }
h1, h2, h3, h4 { font-weight: normal; }

.page { width: 100%; max-width: 1920px; margin: 0 auto; position: relative; overflow: hidden; }

/* 通用版心：左右各 36px 边距 */
.wrap { width: 100%; padding: 0 1.875rem; margin: 0 auto; }
.wrapper2{width:83.7rem;margin:0 auto;position:relative;height: auto}
/* 通用板块标题（英文胶囊 + 中文标题） */
.sec-head { text-align: center; }
.sec-badge {
  display: inline-block;
  height: 2.8rem;
  line-height:2.8rem;
  padding: 0 1.9rem;
  border-radius: 1.7rem;
  background: #0b0b0b;
  color: #fff;
  font-size: 1.51rem;
  letter-spacing: .06em;
  font-weight: 500;
    min-width: 10rem
}
.sec-badge span { display: block; }
.sec-title {
  font-size: 2rem;
  line-height: 1.25;
  color: #00478B;
  font-weight: bold;
  margin-top: 1.3rem;
}
.sec-title.center { text-align: center; }
.sec-title.light { color: #fff; }

/* 通用「更多」按钮 */
.more-btn {
  display: inline-block;
  width: 10.26rem;
  height: 2.97rem;
  line-height: 2.97rem;
  text-align: center;
  background: #0B62B6;
  color: #fff;
  font-size:1.1rem;
  border-radius: .2rem;
  transition: background .3s;
    font-weight: bold;
}
.more-btn:hover { background: #053572; }
.sec-more { text-align: center; margin-top: 2.5rem; }
.more-link { display: inline-block; color: #0B62B6; font-size: 1rem; margin-top: 2rem; }
.more-link:hover { color: #23AC38; }

/* ==========================================================================
   Header
   ========================================================================== */
.all_header{position: fixed;z-index: 999;width: 100%;}
.header { background: #fff; position: relative; z-index: 60; }
.header-inner {
  height: 4.792rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.logo { flex: 1 1 auto; min-width: 0; display: block; overflow: hidden; }
.logo img {
  height: 2.76rem;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  object-position: left center;
}

.header-right { display: flex; align-items: center; flex: none; }
.search {
  position: relative;
  width: 13.18rem;
  height: 2.45rem;
  border: 1px solid #23AC38;
  background: #23AC38;
  display: flex;
  align-items: center;
  transition: background .3s;
}
.search:hover { background: #1d9430; }
.search input {
  flex: 1;
  height: 100%;
  padding: 0 .9rem;
  color: #fff;
  font-size: .94rem;
  min-width: 0;
}
.search input::placeholder { color: #EAF7EC; }
.search button {
  width: 2.45rem;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.search button img { width: 1.2rem; height: auto; }
.lang { margin-left: 1.35rem; font-size: 1.09rem; color: #333; font-weight: bold; }
.lang:hover { color: #23AC38; }

/* 移动端功能按钮 / 抽屉 / 搜索条：桌面端全部隐藏 */
.hd-btn { display: none; }
.mnav-head { display: none; }
.nav-mask { display: none; }
.mobile-search { display: none; }
.sub-toggle { display: none; }

/* ==========================================================================
   导航
   ========================================================================== */
.nav { background: #00478B; position: relative; z-index: 55; }
.nav-list { display: flex; justify-content: center; }
.nav-list > li { position: relative; }
.nav-list > li > a {
  display: block;
  height: 3.14rem;
  line-height: 3.14rem;
  padding: 0 2.6rem;
  color: #fff;
  font-size: 1.094rem;
  position: relative;
}
.nav-list > li > a::after {
  content: "";
  position: absolute;
  left: 1.6rem;
  right: 1.6rem;
  bottom: 0;
  height: .18rem;
  background: #fff;
  transform: scaleX(0);
  transition: transform .3s;
}
.nav-list > li:hover > a,
.nav-list > li.on > a { background: #0B62B6; }
.nav-list > li:hover > a::after{ transform: scaleX(1); }
.nav-list > li.on > a::after { transform: scaleX(0); }

/* 二级下拉 */
.nav .sub {
  position: absolute;
  left: 50%;
  top: 100%;
  width:100%;
  margin-left: -50%;
  padding:0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(.6rem);
  transition: all .3s ease;
  box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .18);
}
.nav .has-sub:hover .sub { opacity: 1; visibility: visible; transform: translateY(0); }
.nav .sub a {
  display: block;
  height: 2.55rem;
  line-height: 2.55rem;
  text-align: center;
  color: #fff;
  font-size: 1rem;
  background:rgba(27,121,210,0.7);
  color: #fff;
  margin: 0;
  border-bottom: 1px solid rgba(255,255,255,0.6);
  transition: all .25s;
}
.nav .sub a:last-child { border-bottom: 0; }
.nav .sub a:hover { background: #00478B; color: #fff; }

/* ==========================================================================
   Banner 轮播
   ========================================================================== */
.banner { position: relative; height: 49.48rem; overflow: hidden; background: #053572; }
.banner-slides { position: absolute; inset: 0; }
.banner-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .8s ease;
}
.banner-slide.active { opacity: 1; visibility: visible; }
.banner-bg { position: absolute; inset: 0; width: 100%; height: 100%; }
.banner-inner {
  position: relative;
  z-index: 2;
  height: 100%;
  text-align: center;
  color: #fff;
  padding-top: 19.4rem;
}
.banner-title {
  font-size: 3.3rem;
  font-weight: bold;
  letter-spacing: .02em;
  text-shadow: 0 .1rem .6rem rgba(0, 0, 0, .35);
}
.banner-title.big { font-size: 3.75rem; }
.banner-sub {
  margin-top: 1.5rem;
  font-size: 1.35rem;
  letter-spacing: .06em;
  text-shadow: 0 .1rem .4rem rgba(0, 0, 0, .35);
}
.banner-boxes {
  margin-top: 2.3rem;
  display: flex;
  justify-content: center;
  gap: 1.56rem;
}
.banner-boxes li {
  width: 13.33rem;
  height: 10.05rem;
  background: rgba(255, 255, 255, .55);
  border: 1px solid rgba(255, 255, 255, .85);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #00478B;
  font-size: 1.98rem;
  font-weight: bold;
  line-height: 1.5;
  transition: all .35s;
}
.banner-boxes li:hover { background: rgba(255, 255, 255, .82); transform: translateY(-.4rem); }
.banner-boxes li span { display: block; }

/* slide 3 */
.banner3-panel {
  position: relative;
  width: 63.7rem;
  height: 21.3rem;
  margin: 0 auto;
  background: rgba(255, 255, 255, .18);
  border-top: .18rem solid #fff;
  border-bottom: .18rem solid #fff;
  padding-top: 2.7rem;
}
.banner3-title { font-size: 3.63rem; font-weight: bold; letter-spacing: .03em; }
.banner3-cols { display: flex; justify-content: center; gap: 1.15rem; margin-top: 2.3rem; }
.banner3-cols li {
  width: 13.33rem;
  height: 10.05rem;
  background: rgba(255, 255, 255, .55);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #00478B;
  font-size: 1.98rem;
  font-weight: bold;
  line-height: 1.5;
  transition: all .35s;
}
.banner3-cols li:hover { background: rgba(255, 255, 255, .85); }
.banner3-side {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  writing-mode: vertical-rl;
  font-size: 1.5rem;
  color: #fff;
  letter-spacing: .2em;
  opacity: .9;
}
.banner3-side.left { left: -3.5rem; }
.banner3-side.right { right: -3.5rem; }

/* 轮播控件 */
.banner-ctrl {
  position: absolute;
  left: 0; right: 0;
  bottom: 4rem;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
}
.b-arrow {
  width: 2.76rem;
  height: 2.76rem;
  border-radius: 50%;
  border: 1px solid #fff;
  position: relative;
  transition: all .3s;
}
.b-arrow::before {
  content: "";
  position: absolute;
  top: 50%; left: 50%;
  width: .55rem; height: .55rem;
  border-top: 1.5px solid #fff;
  border-right: 1.5px solid #fff;
  font-weight: bold;
}
.b-prev::before { transform: translate(-30%, -50%) rotate(-135deg); }
.b-next::before { transform: translate(-70%, -50%) rotate(45deg); }
.b-dots { display: flex; align-items: center; gap: .9rem; }
.b-dots a {
  width: .78rem; height: .78rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, .5);
  transition: all .3s;
}
.b-dots a.on { width: 1.5rem; border-radius: .75rem; background: #fff; }
.b-arrow:hover { background: rgba(255, 255, 255, .25); }

/* ==========================================================================
   通知公告
   ========================================================================== */
.notice { background: #23AC38; height: 4.69rem; position: relative; z-index: 10; }
.notice-inner { display: flex; align-items: center; height: 100%; }
.notice-title {
  display: flex;
  align-items: center;
  color: #fff;
  padding-right: 1.8rem;
  position: relative;
  flex: none;
}
.notice-title::after {
  content: "";
  position: absolute;
  right: 0; top: 50%;
  transform: translateY(-50%);
  width: 1px; height: 3.85rem;
  background: rgba(255, 255, 255, .45);
}
.notice-title img { width: 2.2rem; height: auto; }
.notice-title b { font-size: 1.35rem; letter-spacing: .06em; margin-left: .8rem; font-weight: bold; }
.notice-title span { font-size: 1.35rem; margin-left: .6rem; font-weight: bold; }
.notice-scroll { flex: 1; height: 2.4rem; overflow: hidden; margin-left: 1.8rem; position: relative; }
.notice-list { transition: transform .5s ease-in-out; }
.notice-list li {
  height: 2.4rem;
  line-height: 2.4rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #fff;
  font-size: 1rem;
}
.notice-list li a {
  flex: 1;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-right: 2rem;
  display: flex;
  align-items: center;
}
.notice-list li a i {
  width: .45rem; height: .45rem;
  border-radius: 50%;
  background: #fff;
  margin-right: .9rem;
  margin-bottom: .1rem;
  flex: none;
}
.notice-list li a:hover { color: #d8ffe0; }
.notice-list li em { font-style: normal; font-size: .94rem; opacity: .92; flex: none; }

/* ==========================================================================
   关于我们
   ========================================================================== */
.about { position: relative; height: 49.53rem; overflow: hidden; background: #00478B; }
.about::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("../img26/part01.jpg") center / cover no-repeat;
  transform: translateX(6%) scale(1.16);
  opacity: .5;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 62%, rgba(0, 0, 0, .25) 100%);
  mask-image: linear-gradient(180deg, #000 0%, #000 62%, rgba(0, 0, 0, .25) 100%);
  filter: brightness(1.12) saturate(.9);
}
.about::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0, 71, 139, .3) 0%, rgba(0, 71, 139, .34) 60%, rgba(35, 172, 56, .55) 100%);
  pointer-events: none;
}
.about-inner { position: relative; z-index: 2; display: flex; height: 100%; }

.about-left { width: 50%; padding-top: 3.3rem; display: flex; flex-direction: column; }
.about-left .sec-badge {background-image: -moz-linear-gradient( 90deg, rgba(0,71,139,1) 0%, rgb(36,116,193) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgba(0,71,139,1) 0%, rgb(36,116,193) 100%);
  background-image: -ms-linear-gradient( 90deg, rgba(0,71,139,1) 0%, rgb(36,116,193) 100%);align-self: flex-start;font-weight: bold;color:#5dc0ff;font-size: 1.3rem;}
.about-left .sec-title { font-size: 2rem; color: #fff; margin-top: 1.6rem;}
.about-text { margin-top: 1.8rem; width: 39rem; max-width: 100%; }
.about-text p { font-size:1rem; line-height: 2.05; color: #fff; }
.about-left .more-link{color:#0082ff;margin-top:1rem;}



/* 四个基地：2 × 2 等分对齐 */
.base-list {
  display: grid;
  grid-template-columns: repeat(2, 14.29rem);
  gap:2rem 4rem;
  margin-top:2rem;
  width: auto;
  max-width: 100%;
}
.base-list li { position: relative; }
.base-pic { width: 100%; height: 10.2rem; overflow: hidden; }
.base-pic img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.base-list li:hover .base-pic img { transform: scale(1.06); }
.base-name {
  position: absolute;
  left: 0; right: 0;
  bottom: 0rem;
  height: 3rem;
  line-height: 3rem;
  text-align: center;
  background:rgba(28, 93, 212,0.8);
  color: #fff;
  font-size: 1.05rem;
  width:calc(100% + 1.8rem);
  margin:0 auto;
  transform: translateX(-0.9rem)
}
.base-name:before{content:"";position: absolute;left:0;top:-1rem;background: #0c285c;width:0.9rem;height:1rem;display: inline-block;clip-path: polygon(100% 0, 100% 100%, 0 100%);}
.base-name:after{content:"";position: absolute;right:0;top:-1rem;background: #0c285c;width:0.9rem;height:1rem;display: inline-block;clip-path: polygon(0 0, 100% 100%, 0 100%);}
.base-list li:hover .base-name{
  background:rgba(28, 93, 212,1);
}
.base-name a{color: #fff;}



/* 数据：与左侧内容等高对齐 */
.about-nums {
  position: absolute;
  right: 1.4rem;
  top: 2rem;
  bottom: 3.2rem;
  width: 36.4rem;
  display: flex;
  flex-wrap: wrap;
  align-content: space-between;
}
.num-box { width: 50%; text-align: center;padding:1rem 0; }

.num-ico { width: 7.5rem;  display: flex; align-items: center; justify-content: center;background:rgba(255,255,255,0.4);border-radius:50%;padding:0.3rem;margin:0 auto}
.num-ico img { height: auto;width:100%;}
.num-val {
  font-size: 3rem;
  color: #fff;
  font-weight: bold;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 .1rem .4rem rgba(0, 0, 0, .18);
  margin-top:0.5rem;
}
.num-val b { font-weight: bold; }
.num-val sup { font-size: 1.2rem; top: -.7em; position: relative; margin-left: .1rem;}
.num-val i { font-style: normal; font-size: 1.05rem; font-weight: normal; margin-left: .3rem;font-family:"PingFang SC" !important  }
.num-txt { font-size: 1.05rem; color: #fff; margin-top:0.8rem; }
.num-box:hover{background: #23ac38;}
/* ==========================================================================
   新闻中心
   ========================================================================== */
.news {
  position: relative;
  height: auto;
  padding-bottom: 3.6rem;
  overflow: hidden;
  background: #C6D9E9;
}

.news .sec-badge{
    background-image: -moz-linear-gradient( 90deg, rgba(155,192,226,1) 0%, rgb(143,190,236) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgba(155,192,226,1) 0%, rgb(143,190,236) 100%);
  background-image: -ms-linear-gradient( 90deg, rgba(155,192,226,1) 0%, rgb(143,190,236) 100%);
    font-weight: bold;
}
.news .sec-badge span{color:#3a86ce}


.news-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.news-inner { position: relative; z-index: 2; padding-top: 3rem; }

.news-cards { display: flex; justify-content: center; gap: 1.98rem; margin-top: 1.7rem; }
.news-card {
  width: 26.3rem;
  background: #fff;
  overflow: hidden;
  transition: box-shadow .35s, transform .35s;
  box-shadow: 0 .3rem .9rem rgba(0, 0, 0, .06);
}

.news-pic {  aspect-ratio: 4 / 3;
  display: grid;
  place-items: center;}



.news-pic img{width: 100%; height: 100%; object-fit: cover;object-position: 50% 50%;width:100%; transition: transform .6s; }
.news-body { padding: .85rem 1.15rem .8rem; }
.news-body h3 {
  font-size: 1.1rem;
  line-height: 1.5;
  font-weight: bold;
  height: 3.4rem;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.news-body h3 a { color: #252525; }

.news-body p {
  margin-top: .45rem;
  font-size: .85rem;
  line-height: 1.6;
  color: #6b6b6b;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  min-height: 3.04rem;
}
.news-foot {
  margin-top: .55rem;
  padding-top:1rem;
  border-top: 1px solid rgba(0, 0, 0, .1);
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 2rem;
}
.news-detail { flex: none; }
.news-foot span { font-size: 1.06rem; color: #333; }
.news-detail {
  display: inline-block;
  width: 3.8rem;
  height: 1.7rem;
  line-height: 1.7rem;
  text-align: center;
  background: #fff;
  color: #00478B;
  font-size: .94rem;
  transition: background .3s, color .3s;
    font-weight: bold;display: none
}
.news-card:hover { transform: translateY(-.4rem); box-shadow: 0 .8rem 1.6rem rgba(0, 0, 0, .12); }
.news-card:hover { background: #00478B; }
.news-card:hover .news-body h3 a,
.news-card:hover .news-body p,
.news-card:hover .news-foot span { color: #fff; }
.news-card:hover .news-pic img { transform: scale(1.03); }
.news-card:hover .news-body h3 a { color: #fff; }
.news-card:hover .news-detail{ display: block}

/* ==========================================================================
   科研与人才培养
   ========================================================================== */
.research {
  position: relative;
  height: auto;
  padding-bottom: 3rem;
  overflow: hidden;

}
.research-bg {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  opacity: .8;
}

.research-inner { position: relative; z-index: 2; padding-top:3rem; }

.research .sec-badge{
  background-image: -moz-linear-gradient( 90deg, rgba(155,192,226,1) 0%, rgb(143,190,236) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgba(155,192,226,1) 0%, rgb(143,190,236) 100%);
  background-image: -ms-linear-gradient( 90deg, rgba(155,192,226,1) 0%, rgb(143,190,236) 100%);
    font-weight: bold;
}
.research .sec-badge span{color:#3a86ce}



/* 5 张卡片：按设计稿坐标 1:1 定位，图片与胶囊标签分离，保证图标与标签都不被遮挡 */
.research-cards { height:11.3rem; margin-top:2.5rem; margin-bottom: 4.4rem;display: grid;grid-template-columns: repeat(5, 1fr);gap: 2rem;}
.research-cards li {
 position: relative;
}

.research-cards li a { display: block; position: relative; height: 100%; }
.rc-pic {
  position: absolute;
  left: 0; top: 0;
  width: 100%;
  height:100%;
  overflow: hidden;
  background: #00478B;z-index:1;transition:0.5s;
}
.rc-pic img { width: 100%; height: 100%; object-fit: cover; transition:0.5s;position: absolute;z-index: 2;}
.rc-pic:before{  position: absolute;left: 0; top: 0;content:"";display: inline-block;width:100%;height:100%;background:rgba(0,0,0,0.5);transition: 0.5s;position: absolute;z-index: 3; }
.research-cards li:hover{border:#fff 3px solid;transform: scale(1.05); }
.research-cards li:hover .rc-pic:before{content:"";background:rgba(0,71,139,.8);}
.rc-ico {
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  width:6.5rem;
  height:6.5rem;
  z-index: 5;
  pointer-events: none;
  transition: opacity .35s;
}
.rc-ico img { width: 100%; height: auto; }
.rc-name {
  position: absolute;
  left: 50%;
  bottom:-1.2rem;
  transform: translateX(-50%);
  width: 12rem;
  height: 3.13rem;
  line-height:2.75rem;
  border-radius: 1.565rem;
  background: #fff;
  color: #252525;
  font-size: 1.15rem;
  text-align: center;
  z-index: 4;
  transition:.35s, color .35s;font-weight: bold;border:#00478b 4px solid;
}



.research-cards li:hover .rc-name {   background-image: -moz-linear-gradient( 90deg, rgb(107,183,255) 0%, rgb(255,255,255) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(107,183,255) 0%, rgb(255,255,255) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(107,183,255) 0%, rgb(255,255,255) 100%); color: #252525; }
.research .sec-more { margin-top: 0; }

/* ==========================================================================
   蓝绿左右切换
   ========================================================================== */
.compare {
  position: relative;
  display: flex;
  height: 35rem;
  overflow: hidden;
  background: #00478B;
}
.icombox {
  position: relative;
  flex: 1 1 50%;
  width: 50%;
  height: 100%;
  overflow: hidden;
  transition: flex-basis .55s cubic-bezier(.65,.05,.36,1);
}
.icom-left { background: #00478B; }
.icom-right { background: #23AC38; }



/* 文字列：固定在各自半区，加渐变蒙版保证对比度 */
.icombox-intro {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 26rem;
  padding-top: 3.4rem;
  padding-bottom: 3.4rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index: 5;
  pointer-events: none;
  transition: opacity .35s ease-out, top .2s;
}
.icombox-intro > * { pointer-events: auto; }
.icom-left .icombox-intro {
  left: 0;
  padding-left: 1.6rem;
  background: linear-gradient(90deg, rgba(0, 0, 0, .34) 0%, rgba(0, 0, 0, .2) 55%, rgba(0, 0, 0, 0) 100%);
}
.icom-right .icombox-intro {
  right: 0;
  padding-right: 1.6rem;
  align-items: flex-end;
  text-align: right;
  background: linear-gradient(270deg, rgba(0, 0, 0, .28) 0%, rgba(0, 0, 0, .16) 55%, rgba(0, 0, 0, 0) 100%);
}
.icombox-title {
  font-size: 2.1rem;
  color: #fff;
  font-weight: bold;
  line-height: 1.3;
  letter-spacing: .01em;
  white-space: nowrap;
  text-shadow: 0 .1rem .5rem rgba(0, 0, 0, .35);
}
.icombox-list { margin-top: 1.7rem; }
.icombox-list li {
  font-size: 1.02rem;
  color: #fff;
  line-height: 2.2;
  letter-spacing: 0;
  white-space: nowrap;
  text-shadow: 0 .1rem .4rem rgba(0, 0, 0, .35);
}
.icombox-link {
  display: inline-block;
  width:7.5rem;
  height: 2rem;
  line-height: 2rem;
  text-align: center;
  margin-top: 5.6rem;
  background-image: -moz-linear-gradient( 0deg, rgb(49,203,114) 0%, rgb(17,105,205) 100%);
  background-image: -webkit-linear-gradient( 0deg, rgb(49,203,114) 0%, rgb(17,105,205) 100%);
  background-image: -ms-linear-gradient( 0deg, rgb(49,203,114) 0%, rgb(17,105,205) 100%);
  color: #fff;
  font-size: .94rem;
  transition: background .35s, color .35s;font-weight: bold;
}





/* 中间大图 */
.icom-img {
  position: absolute;
  left:30%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 55%;
  height: auto;
  z-index: 3;
  pointer-events: none;
  transition: transform .8s ease-out, width .55s cubic-bezier(.65,.05,.36,1),left .55s,top .55s ;
}
.icom-left .icom-img {left:70%}


/* 收起一侧的提示文字 */
.icombox-side {
  position: absolute;
  top:-25%;
  left:0;
  right:0;
  margin:0 auto;
  text-align:center;
  font-size: 2rem;
  font-weight: bold;
  color: #fff;
  opacity:0;
  white-space: nowrap;
  z-index: 4;
  pointer-events: none;
  transition: opacity 0.6 ease .1s,top .5s;
}
/* 展开 / 收起 —— 用 flex-basis 过渡，比宽度过渡更顺滑 */
.compare .icombox.active { flex-basis: 70%; width: 70%; }
.compare .icombox.hide { flex-basis: 30%; width: 30%; }
.compare .icombox.hide .icombox-side { opacity: .6;top:8% }
.compare .icombox.hide .icombox-intro { opacity: 0;top:-25%;  transition: opacity .2s ease-in, top .1s; }
.icom-right .icombox-link:hover { background:#036d13;  }
.icombox-link:hover { background: #0B62B6;  }
.compare .icombox.active .icom-img {
  width:45%;
  transform: translate(-50%, -50%) scale(1.03);
}
.compare .icombox.hide .icom-img { width: 92%;left:50%;top:60% }
/* ==========================================================================
   技术与产品
   ========================================================================== */
.product { position: relative; height: 40.3rem; overflow: hidden; background: #C9DCE8; }
.product-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.product-mask { position: absolute; inset: 0; background: rgba(201, 220, 232, .68); }

.product-swiper { position: relative; height: 100%; z-index: 3; }
.ps-track {
  position: absolute;
  left: 50%;
  top: 4rem;
  width: 0;
  height: 34.3rem;
}
.ps-slide {
  position: absolute;
  top: 0;
  left: 50%;
  width: 41.8rem;
  height: 31.36rem;
  margin-left: -20.9rem;
  overflow: hidden;
  transition: left .6s cubic-bezier(.4, 0, .2, 1), opacity .6s;
}
.ps-slide img { width: 100%; height: 100%; object-fit: cover; }
.ps-slide .ps-cap {
  position: absolute;
  left: 2.5rem;
  bottom: 1.6rem;
  color: #fff;
  font-size: 1.35rem;
  text-shadow: 0 .1rem .5rem rgba(0, 0, 0, .5);
}
.ps-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2.76rem;
  height: 2.76rem;
  z-index: 9;
  transition: transform .3s;
}
.ps-arrow img { width: 100%; height: auto; }
.ps-prev { left: 31.1rem; }
.ps-next { right: 31.1rem; }
.ps-arrow:hover { transform: translateY(-50%) scale(1.12); }

/* ==========================================================================
   成果业绩
   ========================================================================== */
.outcome { position: relative; min-height: 47.03rem; overflow: hidden; background: #16323f; }
.outcome-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.outcome-mask { position: absolute; inset: 0; }
.outcome-inner { position: relative; z-index: 2; padding-top: 3rem; padding-bottom: 4rem; }
.outcome .sec-badge{
     background-image: -moz-linear-gradient( 90deg, rgba(76,112,146,0.5) 0%, rgb(76,112,146) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgba(76,112,146,0.5) 0%, rgb(76,112,146) 100%);
  background-image: -ms-linear-gradient( 90deg, rgba(76,112,146,0.5) 0%, rgb(76,112,146) 100%);
    font-weight: bold;
}
.outcome .sec-badge span{color:#92c3f2}

.tabs { margin-top: 2.6rem; }
.tabs-bar {
  display: flex;
  width: 56.3rem;
  margin: 0 auto;
  height: 3rem;
  background: #0B62B6;
  border-radius: 1.95rem;
  position: relative;padding:0 2rem
}
.tabs-bar .tab {
  flex: 1;
  text-align: center;
  line-height: 4.75rem;
  color: #fff;
  font-size: 1.2rem;
  position: relative;height:3.75rem;
  z-index: 2;transform: translateY(-0.75rem)

}


.tabs-bar .tab.active {   background-image: -moz-linear-gradient( 90deg, rgb(0,71,139) 0%, rgb(14,104,194) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(0,71,139) 0%, rgb(14,104,194) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(0,71,139) 0%, rgb(14,104,194) 100%);}
.tabs-bar .tab.active:before {
    content: "";
    position: absolute;
    left: -1rem;
    top: 0rem;
    background: #2982d7;
    width: 1rem;
    height: 0.75rem;
    display: inline-block;
    clip-path: polygon(100% 0, 100% 100%, 0 100%);

}
.tabs-bar .tab.active:after {
    content: "";
    position: absolute;
    left:auto;
    right:-1rem;
    top: 0rem;
    background: #2982d7;
    width: 1rem;
    height: 0.75rem;
    display: inline-block;
    clip-path: polygon(0 0, 100% 100%, 0 100%);
}


.tabs-panels { margin-top: 3.9rem; }
.tabs-panels .panel { display: none; }
.tabs-panels .panel.active { display: block; animation: fadeUp .45s ease both; }
@keyframes fadeUp { from { opacity: 0; transform: translateY(1.2rem); } to { opacity: 1; transform: none; } }

.out-cards { display: flex; justify-content: center; gap: 1.51rem; }
.out-cards li { width: 26.77rem; }
.out-cards li a { display: block; }
.oc-pic { height: 20.05rem; overflow: hidden; }
.oc-pic img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.out-cards li:hover .oc-pic img { transform: scale(1.06); }
.oc-txt {
  height: 4.8rem;
  padding: 0 1rem;
  display: flex;
  align-items: center;
  background: #fff;
  color: #001f3f;
  font-size: 1rem;
  line-height: 1.6;
  overflow: hidden;
}
.out-cards li:hover .oc-txt { background: #23AC38; color: #fff; }
.outcome .sec-more { margin-top: 3rem; }

/* ==========================================================================
   客户服务
   ========================================================================== */
.service { position: relative; height:50rem; overflow: hidden; background: #DCE6F0; }
.service-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.service::after { content: ""; position: absolute; inset: 0; background: rgba(232, 240, 247, .62); }
.service-inner { position: relative; z-index: 2; padding-top:3rem; }
.service .sec-badge{
  background-image: -moz-linear-gradient( 90deg, rgba(155,192,226,1) 0%, rgb(143,190,236) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgba(155,192,226,1) 0%, rgb(143,190,236) 100%);
  background-image: -ms-linear-gradient( 90deg, rgba(155,192,226,1) 0%, rgb(143,190,236) 100%);
    font-weight: bold;
}
.service .sec-badge span{color:#3a86ce}
.service-cards { display: flex; justify-content: center; margin-top:3rem; height: 26.7rem; }
.sv-card {
  position: relative;
  flex: 1 1 0;
  width: auto;
  min-width: 0;
  overflow: hidden;
  cursor: pointer;
  transition: flex-grow .7s cubic-bezier(.33, 1, .68, 1);
}
.sv-card.active { flex-grow: 1.42; }
.sv-pic {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transform: scale(1.06);
  transition: transform 1.1s cubic-bezier(.33, 1, .68, 1);
}
.sv-card.active .sv-pic { transform: scale(1); }
.sv-mask {
  position: absolute; inset: 0;
  background: rgba(0, 40, 80, .58);
  transition: background .7s cubic-bezier(.33, 1, .68, 1);
}
.sv-mask h3{ font-size: 1.56rem; font-weight: bold; letter-spacing: .04em; text-shadow: 0 .12rem .5rem rgba(0, 0, 0, .5);color:#fff;position: absolute;left:0;right:0;text-align: center;margin:0 auto;z-index: 9;top:50%;transform: translateY(-50%);opacity:1;transition: opacity .5s ease .08s}
.sv-card.active .sv-mask h3{opacity: 0}
.sv-card.active .sv-mask { background:rgba(0,71,139,0.8); }

.sv-info {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  opacity: 1;
  transform: translateY(1.1rem);
  transition: opacity .5s ease .08s, transform .7s cubic-bezier(.33, 1, .68, 1) .08s,scale .08s;transform: scale(0.85)
}
.sv-card.active .sv-info { opacity: 1; transform: translateY(0);transform: scale(1)}
.sv-ico {
  width: 7rem; height: 7rem;
  margin-bottom: 1.2rem;
  display: flex; align-items: center; justify-content: center;border:#fff 1px solid;padding:1.4rem;border-radius:1rem;
   transition: opacity .5s ease .08s;opacity:0;
}
.sv-card.active .sv-ico{opacity:1}
.sv-ico img { width: 100%; height: auto; filter: drop-shadow(0 .15rem .5rem rgba(0, 0, 0, .45)); }
.sv-info h3 { font-size: 1.56rem; font-weight: bold; letter-spacing: .04em; text-shadow: 0 .12rem .5rem rgba(0, 0, 0, .5); transition: opacity .5s ease .08s;opacity:0; }
.sv-card.active .sv-info h3{opacity:1}
.sv-detail {
  display: inline-block;
  width: 4.5rem;
  height: 2.1rem;
  line-height: 2.1rem;
  text-align: center;
  background: #23AC38;
  color: #fff;
  font-size: .94rem;
  margin-top: 2rem;
  transition: background .3s;opacity:0;transition: opacity .5s ease .08s
}
.sv-detail:hover { background: #0B62B6; }
.sv-card.active .sv-detail{opacity: 1}
/* ==========================================================================
   主要客户
   ========================================================================== */
.client { position: relative; height: 21rem; overflow: hidden;}
.client-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.client-mask { position: absolute; inset: 0; }
.client-inner { position: relative; z-index: 2; padding-top: 2.2rem; }

.client .sec-badge{
  background-image: -moz-linear-gradient( 90deg, rgba(79,210,99,1) 0%, rgba(99,218,117,0.99) 99%, rgb(99,218,117) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgba(79,210,99,1) 0%, rgba(99,218,117,0.99) 99%, rgb(99,218,117) 100%);
  background-image: -ms-linear-gradient( 90deg, rgba(79,210,99,1) 0%, rgba(99,218,117,0.99) 99%, rgb(99,218,117) 100%);
    font-weight: bold;
}
.client .sec-badge span{color:#009b21}


.client-swiper { position: relative; margin-top: 1.2rem; }
.cs-viewport { overflow: hidden; padding: 0 3%;width: 94%;margin:0 auto}
.cs-track { display: flex; gap: 1.3rem 1.3rem; transition: transform .55s cubic-bezier(.4, 0, .2, 1); }
.cs-item {
  flex: none;
  width: 14rem;
  height: 8.5rem;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: .8rem;
  transition: box-shadow .35s, transform .35s;position: relative
}
.cs-item:hover { transform: translateY(-.3rem); box-shadow: 0 .6rem 1.2rem rgba(0, 0, 0, .18); }
.cs-item img { max-width: 100%; max-height: 100%; object-fit: contain; }
.cs-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  z-index: 5;
}
.cs-arrow img { width: 1rem; height: auto; filter: brightness(0) invert(1); }
.cs-item p{text-align: center;background:rgba(0,71,139,0.8);font-size: 1rem;color: #fff;width: 100%;position: absolute;left:0;bottom:-4rem;padding:0.5rem 0.25rem;transition:bottom 0.35s}
.cs-prev { left: 0; }
.cs-next { right: 0; }
.cs-item:hover p{bottom:0}
.cs-arrow:hover { opacity: .7; }

/* ==========================================================================
   页脚
   ========================================================================== */
.footer { position: relative; height: auto; min-height: 32rem; overflow: hidden; background: #053572; color: #fff; padding-bottom: 1.5rem; }
.footer-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.footer::after { content: ""; position: absolute; inset: 0; background: rgba(5, 53, 114, .62); }
.footer-inner { position: relative; z-index: 2; padding-top:4rem; }

.footer-logo { display: flex; justify-content: center; }
.footer-logo img { height: 4.6rem; width: auto; }

.footer-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 3.6rem;
  flex-wrap: wrap;
}
.footer-nav li { position: relative; }
.footer-nav li + li::before {
  content: "";
  position: absolute;
  left: 0; top: 50%;
  transform: translateY(-50%);
  width: 1px; height: 1.2rem;
  background: rgba(255, 255, 255, .4);
}
.footer-nav a {
  display: block;
  padding: 0 1.35rem;
  height: 2.2rem;
  line-height: 2.2rem;
  font-size: 1.09rem;
  color: #fff;
}
.footer-nav a:hover, .footer-nav a.on { color: #7BE495; }

.footer-info {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 3rem;
  margin-top: 2.8rem;
}
.fi-col li { display: flex; align-items: center; font-size: 1.09rem; line-height: 2.4; }
.fi-col li i { width: 1.35rem; margin-right: .8rem; flex: none; }
.fi-col li i img { width: 100%; height: auto; }
.fi-qr { width: 4.9rem; height: 4.9rem;margin-left: 1.5rem; }
.fi-qr img { width: 100%; height: 100%; }

.copyright {
  text-align: center;
  margin-top: 7rem;
  font-size: 1.09rem;
  color: rgba(255, 255, 255, .75);
}

/* ==========================================================================
   通用滚动淡入
   ========================================================================== */
.reveal {
  opacity: 0;
  transform: translateY(1.5rem);
  transition: opacity .75s ease, transform .75s cubic-bezier(.22, .8, .3, 1);
}
.reveal-in { opacity: 1; transform: none; }

/* ==========================================================================
   返回顶部
   ========================================================================== */
.back-top {
  position: fixed;
  right: 1.2rem;
  bottom: 2.2rem;
  z-index: 200;
  width: 3rem;
  height: 3rem;
  border-radius: .35rem;
  background: #00478B;
  box-shadow: 0 .25rem .8rem rgba(0, 0, 0, .22);
  opacity: 0;
  visibility: hidden;
  transform: translateY(.8rem);
  transition: opacity .35s, visibility .35s, transform .35s, background .3s;
}
.back-top.on { opacity: 1; visibility: visible; transform: translateY(0); }
.back-top:hover { background: #23AC38; }
.back-top i {
  position: absolute;
  left: 50%; top: 55%;
  width: .72rem; height: .72rem;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* ==========================================================================
   回到顶部 / 通用动效
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/*内页*/
.sub .all_header{position: relative;}
.nybanner{position: relative;width:100%;height:15.625rem;}
.nybanner img{display: block;wdith:100%;height:100%;position: absolute;left:0;top:0;z-index: 1;}
.nybanner-z{font-size: 2rem;color: #fff;position: absolute;left:0;right:0;top:50%;transform: translateY(-50%);margin:0 auto;z-index: 2;text-align: center;font-weight:bold;text-shadow: 0px 4px 6px rgba(0, 0, 0, 0.75);}
.mbx{  background: rgba(35, 172, 56,0.8);width: 100%;height:2.6rem;line-height:2.6rem; position: absolute;left:0;bottom:0;z-index: 3;text-align: right}
.mbx-z:before{content:"";background:url("../img26/mbx-ico.png")left center no-repeat;width:1rem;height: 1.4rem;background-size: contain;display: inline-block;vertical-align: middle;margin-right:0.75rem;}
.mbx-z a{font-size:0.9rem;color: #fff;margin-right:0.25rem;}
.mbx-z a:after{content: "-";font-size:0.9rem;color: #fff;display: inline-block;margin-left: 0.25rem;}
.mbx-z a:last-child:after{content:"";display: none}
.main{background: #f2f2f2;width:100%;height: auto;overflow: hidden}
.list{display: flex;justify-content: space-between;width:100%;margin:2rem auto}
.list-l{width: 13.54rem;float: left;margin-top:2rem;}
.list-r{width:calc(100% - 16rem);background: #fff;padding:1.5rem;height: auto;overflow:hidden;float: right;}
 /* ========== 侧边栏容器 ========== */
  .sidebar-menu {
    width: 100%; /* 固定宽度 */
    background-color: #00478b;
    overflow: hidden;
    position: relative;
    background-position: bottom;
  }

  /* ========== 菜单项通用样式 ========== */
  .menu-list {
    list-style: none;
    position: relative;
    z-index: 2;
  }

  .menu-item {
    border-bottom: 1px solid  rgba(255, 255, 255, 0.2);
  }
  .menu-item:last-child {
    border-bottom: none;
  }

  /* 头部按钮（成套技术、关键产品） */
  .menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding:1rem 1.5rem;
    cursor: pointer;
    color: #fff;
    font-size:1.15rem;
    font-weight: 500;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    user-select: none;
  }
  .menu-header:hover span a{
    color:#f9efb9;
  }
 .menu-header.active span a{
    color:#f9efb9;
  }

  /* 图标 */
  .menu-icon {
    width: 1rem;
    height: 1rem;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    color:#77b0e6
  }

  /* 展开时图标旋转 (向上) */
  .menu-item.open .menu-icon {
    transform: rotate(180deg);
  }

  /* ========== 子菜单（折叠区域） ========== */
  .menu-sub {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out; /* JS 会动态计算高度 */
    background-color: rgba(0, 0, 0, 0.15); /* 子菜单稍微深一点 */
  }






  /* 子菜单列表 */
  .sub-list {
    list-style: none;
    padding: 0.5rem;  background-image: -moz-linear-gradient( 90deg, rgba(34,110,182,0) 0%, rgb(12,91,166) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgba(34,110,182,0) 0%, rgb(12,91,166) 100%);
  background-image: -ms-linear-gradient( 90deg, rgba(34,110,182,0) 0%, rgb(12,91,166) 100%);width:calc(100% - 1rem);margin:0 auto
  }

  /* 子菜单项 */
  .sub-item {
    padding: 0.875rem 1.25rem;
    padding-left: 1.25rem;
    color: #fff;
    font-size:0.95rem;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
  }

  .sub-item:hover {
    color: #f9efb9;
    background-color:#1f76c9;font-weight: bold;
  }

  /* ========== 核心：选中的子菜单样式 ========== */
  .sub-item.active {
    color:#f9efb9;
    font-weight: bold;
    background:#1f76c9;
    position: relative;
    z-index: 10;
  }

  /* 选中项左侧的高亮指示条 (可选) */
  .sub-item.active::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background-color: var(--menu-active-text);
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
  }
.typename{font-size:2rem;color: #000;width:100%;margin:1.5rem auto 2.5rem auto;text-align: center;font-weight:600;height:auto;overflow: hidden}

/*产品tab*/
.tabs-wrapper-outer {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0 2.5rem;
    margin:0 auto
  }

  /* 左右箭头 */
  .nav-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 2rem;
    height: 2rem;
    background: #fff;
    border: 1px solid #e3e8ee;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.1);
    color: #0b4a8f;
    transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    opacity: 0;
    pointer-events: none;
  }
  .nav-arrow.visible { opacity: 1; pointer-events: auto; }
  .nav-arrow.disabled { opacity: 0.3; cursor: not-allowed; }
  .nav-arrow:hover:not(.disabled) { background: #0b4a8f; color: #fff; }
  .nav-arrow.left { left: 0; }
  .nav-arrow.right { right: 0; }
  .nav-arrow svg { width: 1rem; height: 1rem; stroke: currentColor; fill: none; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }

  /* Tab 容器 */
  .tabs-container {
    display: flex;
    align-items: center;
     background-image: -moz-linear-gradient( 0deg, rgba(214,232,250,0) 0%, rgb(214,232,250) 50%, rgb(214,232,250) 50%, rgba(214,232,250,0) 100%);
  background-image: -webkit-linear-gradient( 0deg, rgba(214,232,250,0) 0%, rgb(214,232,250) 50%, rgb(214,232,250) 50%, rgba(214,232,250,0) 100%);
  background-image: -ms-linear-gradient( 0deg, rgba(214,232,250,0) 0%, rgb(214,232,250) 50%, rgb(214,232,250) 50%, rgba(214,232,250,0) 100%);
    border-radius: 0.5rem;
    padding:0.5rem 0.25rem;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none; 
      
  }




  .tabs-container::-webkit-scrollbar { display: none; }

  .tabs-list {
    display: flex;
    position: relative; /* 必须，为滑块提供定位基准 */
    white-space: nowrap;
    width:100%
  }

  /* ========== 独立的幽灵滑块 ========== */
  .tab-slider {
    position: absolute;
    top: 0; /* 因为容器加了 padding，滑块也相对于内边距开始 */
    left: 0;
    height: 100%;
    background: linear-gradient(to right, #3b82f6, #0b4a8f);
    border-radius:0.4rem;
    box-shadow: 0 0.25rem 0.625rem rgba(37, 99, 235, 0.35);
    /* 核心：使用 CSS 控制 left 和 width，让它在元素间丝滑移动 */
    transition: left 0.35s cubic-bezier(0.4, 0, 0.2, 1);, width 0.35s cubic-bezier(0.4, 0, 0.2, 1);;
    z-index: 1;
    pointer-events: none; /* 防止挡住鼠标事件 */
    opacity: 0;
  }
  .tab-slider.ready { opacity: 1; }

  /* ========== Tab 项 ========== */
  .tab-item {
    position: relative;
    flex: 1 0 auto;
    min-width: 8rem;
    padding:0.85rem 1.5rem;
    text-align: center;
    font-size: 1.1rem;
    color: #252525;
    cursor: pointer;
    line-height:1.2;
    font-weight: 600;
    border-radius: 0.5rem;
    user-select: none;
    transition: color 0.35s cubic-bezier(0.4, 0, 0.2, 1);;
    z-index: 2; /* 文字要在滑块上方 */
  }

  /* 悬浮或 active 时文字变白 */
  .tab-item:hover,
  .tab-item.active {
    color: #ffffff;
    font-weight: 800;
  }
/*产品列表*/
.list-product{width:100%;margin:2rem auto;position: relative;height: auto;overflow: hidden}
.list-product ul{display: grid;  grid-template-columns: repeat(3, 1fr);}
.list-product ul li{position: relative;margin:0.5rem auto}
.list-product ul li .pro_pic {  aspect-ratio: 4 / 3;
  display: grid;
  place-items: center;width:19.8rem;height:19.8rem;border:#ddd 2px solid;margin:0 auto;transition:transform 0.35s;}
.list-product ul li .pro-pic img{width:100%;height:100%;object-fit:cover;}
.list-product ul li h2{font-size: 1.1rem;margin:0.8rem auto;text-align: center;opacity:1;transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1);line-height:1.6;width:90%;display: table}
.list-product ul li h2 p{height:3.65rem;display: table-cell;vertical-align:middle;width:100%;}
.list-product ul li h3{font-size:1.1rem;background:rgba(0,71,139,0.8);padding:1rem 2rem;text-align: center;color: #fff;line-height:1.4;width:90%;margin:0 auto;opacity:0;transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1),bottom 0.35s cubic-bezier(0.4, 0, 0.2, 1);position: absolute;left:0;right:0;bottom:5rem;}
.list-product ul li:hover h3{opacity:1;bottom:2rem}
.list-product ul li:hover h2{opacity:0;}
.list-product ul li:hover .pro_pic {border:#00478b 2px solid}
.list-product ul li:hover .pro_pic {transform: scale(1.03)}
/*带头人列表*/

.list-leader{width:100%;margin:2rem auto;position: relative;height: auto;overflow: hidden}
.list-leader ul{display: grid;  grid-template-columns: repeat(4, 1fr);}
.list-leader ul li{position: relative;margin:0.5rem auto 5rem auto;}
.list-leader ul li .leader_pic {  aspect-ratio: 1 / 1;
  display: grid;
  place-items: center;width:14.48rem;height:14.48rem;margin:0 auto;overflow: hidden;}
.list-leader ul li .leader_pic img{width:100%;height:100%;object-fit:cover;transition:transform 0.35s;}

.list-leader ul li div.leader_z{font-size: 1.1rem;line-height:1.6;width:94%;background:rgba(0,71,139,0.8);position: absolute;right:0;bottom:-3rem;padding:0.8rem;z-index:3;transition:background 0.35s cubic-bezier(0.4, 0, 0.2, 1);overflow: hidden}
.list-leader ul li div.leader_z:after{content:"";background: url("../img26/leader_ico.png")right center no-repeat;width:4.27rem;height:6.09rem;background-size: contain;position: absolute;right:-6rem;bottom:0;transition:right 0.35s cubic-bezier(0.4, 0, 0.2, 1) }
.list-leader ul li div.leader_z h2{color: #fff;font-size:1.1rem;}
.list-leader ul li div.leader_z p{color: #fff;font-size: 0.9rem;line-height:1.6;margin-top: 0.15rem;height:2.86rem}

.list-leader ul li:hover div.leader_z{background:rgba(35,172,56,1);}
.list-leader ul li:hover div.leader_z:after{content:"";right:0}
.list-leader ul li:hover .leader_pic img{transform: scale(1.05)} 

 .gallery-container {
            display: grid;
             grid-template-columns: repeat(3, 1fr);
            gap: 1.5rem;
            margin: 0 auto;
        }
.gallery-user{ grid-template-columns: repeat(4, 1fr);}
        .gallery-item {
            background: #fff;
            overflow: hidden;
            cursor: pointer;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
     

        .gallery-item img {
            width: 100%;
            height: 15rem;
            object-fit: contain;
            background: #fff;
            display: block;border:#ddd 1px solid;padding:1rem
        }
        
        .gallery-item .title-box {
            width: 100%;display: table;vertical-align: middle;
        }
.gallery-item .title-box h2{display:table-cell;background-color: #5b7ba8;
            color: #fff;
            padding: 1rem;
            text-align: center;
            font-size:1rem;line-height:1.5;padding:0.7rem 2rem;height:4.5rem;overflow: hidden;vertical-align: middle}
        /* --- 优化后的灯箱 (Lightbox) 样式 --- */
        .lightbox {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.85);
            /* 添加背景模糊，提升高级感 */
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            
            /* 使用 visibility 配合 opacity 来做动画，不要用 display: none */
            visibility: hidden;
            opacity: 0;
            z-index: 1000;
            
            display: flex;
            justify-content: center;
            align-items: center;
            
            /* 缓动曲线让动画更顺滑 */
            transition: opacity 0.4s cubic-bezier(0.25, 1, 0.5, 1), 
                        visibility 0.4s;
        }
        
        .lightbox.active {
            visibility: visible;
            opacity: 1;
        }

        .lightbox-content {
            position: relative;
            max-width: 90%;
            max-height: 90%;
            display: flex;
            flex-direction: column;
            align-items: center;
            /* 内容整体缩放容器 */
            transform: scale(0.85);
            transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1); /* 弹性缓动 */
        }

        .lightbox.active .lightbox-content {
            transform: scale(1); /* 放大到正常比例 */
        }

        .lightbox-img {
            max-width: 100%;
            max-height: 75vh;
            box-shadow: 0 15px 35px rgba(0,0,0,0.5);
            /* 针对切换图片时的平滑过渡 */
            transition: opacity 0.3s ease, transform 0.3s ease;
        }

        /* 切换图片时的无动画类，用于重置状态 */
        .lightbox-img.fade-out {
            opacity: 0;
            transform: scale(0.95);
        }

        .lightbox-title {
            color: #fff;
            margin-top: 20px;
            font-size: 20px;
            font-weight: bold;
            text-shadow: 0 2px 4px rgba(0,0,0,0.8);
            opacity: 0;
            transform: translateY(10px);
            transition: opacity 0.4s ease 0.1s, transform 0.4s ease 0.1s;
        }

        .lightbox.active .lightbox-title {
            opacity: 1;
            transform: translateY(0);
        }

        /* 控制按钮优化 */
        .nav-btn {
            position: absolute;
            top: 50%;
            transform: translateY(-50%) scale(0.9);
            background: rgba(255, 255, 255, 0.1);
            color: white;
            border: 1px solid rgba(255, 255, 255, 0.2);
            font-size: 24px;
            width: 50px;
            height: 50px;
            border-radius: 50%;
            cursor: pointer;
            display: flex;
            justify-content: center;
            align-items: center;
            transition: all 0.3s ease;
            user-select: none;
            backdrop-filter: blur(4px);
        }
        .nav-btn:hover {
            background: rgba(255, 255, 255, 0.3);
            transform: translateY(-50%) scale(1.1);
        }
        .prev-btn { left: -70px; }
        .next-btn { right: -70px; }

        /* 关闭按钮优化 */
        .close-btn {
            position: absolute;
            top: -50px;
            right: -10px;
            color: rgba(255, 255, 255, 0.7);
            font-size: 36px;
            cursor: pointer;
            background: none;
            border: none;
            transition: color 0.3s, transform 0.3s;
            line-height: 1;
        }
        .close-btn:hover { 
            color: #fff; 
            transform: rotate(90deg);
        }
       
           .gallery-item:hover { transform: translateY(-.3rem); box-shadow: 0 .6rem 1.2rem rgba(0, 0, 0, .18); }
        
        
.gallery-item:hover .title-box h2{background: #00478b;}
        /* 移动端适配 */
        @media (max-width: 768px) {
            .prev-btn { left: 10px; }
            .next-btn { right: 10px; }
            .close-btn { top: -40px; right: 0; }
            .lightbox-title { font-size: 16px; }
        }
/*基地*/
.items_base{    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin: 1.5rem auto 2rem auto;padding:0.5rem;
    position: relative;background: #f0f0f0;}
.base_p{flex: 1 1 22%;min-width: 0;width:100%;}
.base_pic{    
    aspect-ratio: 4 / 3;
    display: grid;
    place-items: center;
    overflow: hidden;}
.base_pic img{width:100%;height:100%;object-fit: cover}
.base_z{    flex: 1 1 77%;
    min-width: 0;
    position: relative;
    z-index: 3;height:100%;margin-right:1%;padding:0.35rem 0}
.base_z h2{padding:0.5rem 0; text-align: center;background: #155a9d;transition:}
.base_z h2 a{font-size:1.1rem;color:#fff;font-weight: bold;}
.base_z p{font-size: 0.85rem;line-height:1.8;margin:0.5rem auto;text-align: left;min-height:5rem;}
.base_z span{float: right;display: inline-block;padding:0.4rem 1.2rem;line-height:1.2; text-align: center;border:#00478b 1px solid;font-size: 0.9rem;color:#00478b;vertical-align:middle;align-items: center;}

.items_base:hover{background: #0e4488;}
.items_base:hover .base_z span{color: #fff;border:#fff 1px solid}
.items_base:hover .base_z p{color: #b8ceea;}
.items_base:hover .base_z h2{background: #2e67ae;}

/*通用新闻列表*/
.list_o{padding:0.5rem 0.75rem ;min-height:4.4rem;display: flex;align-items: center;border-bottom: #ddd 1px solid;background: #fff;}
.list_o span{width:8rem;font-size:1.1rem;color: #334e70;text-align:center;margin-right:1rem;}
.list_o p{flex:1 1 0%;white-space:pre-line;overflow: hidden;color: #252525;font-size: 1.1rem;line-height:1.8;}
.list_t{padding:0.75rem 0.75rem;min-height:4.4rem;display: flex;align-items: center;border-bottom: #ddd 1px solid;background: #00478b;display: none;transition: padding 0.35s}
.list_t .idate{width:8rem;font-size:1.1rem;background: rgba(0, 136, 223,0.5);text-align: center;border-radius:10px;line-height:1.2;margin-right:1rem;color:#fff;padding:0.5rem 0 0.25rem 0;position: relative}
.list_t .idate:before{content:"";background:url("../img26/date_ico.png")left center no-repeat;width:1.82rem;height:1.72rem;display: inline-block;vertical-align: middle;background-size: contain;position: absolute;left:1rem;top:0.9rem;}
.list_t .idate b{font-weight: normal;display:inline-block;margin-left: 2rem;}
.list_t .idate span{display:inline-block;margin-left: 2rem;}
.list_t h2{flex:1 1 0%;white-space:pre-line;overflow: hidden;color: #fff;font-size: 1.1rem;line-height:1.8;}
.list-list ul li:hover .list_o{display: none;}
.list-list ul li:hover .list_t{display: flex;}

/*成套技术*/
.list-ctjs {margin-top: 2rem;}
.list-ctjs ul li{  background-image: -moz-linear-gradient( 90deg, rgb(245,245,245) 0%, rgb(255,255,255) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(245,245,245) 0%, rgb(255,255,255) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(245,245,245) 0%, rgb(255,255,255) 100%);border:#ddd 1px solid;padding:1.5rem;min-height:9.6rem;height: auto;overflow: hidden;width:100%;margin-top: 1.5rem;position: relative}
.list-ctjs ul li:after{content:"";background:url("../img26/ctjs-ico.png")right center no-repeat;width:14.43rem;height:8.9rem;background-size: contain;display:inline-block;position:absolute;right:0;bottom:0;z-index: 2;opacity:0;transition:opacity 0.35s;}
.list-ctjs ul li .ctjs-z{position: relative;z-index: 3;}
.list-ctjs ul li h2{font-size: 1.1rem;color: #000;transition:color 0.35s;}
.list-ctjs ul li p{font-size:0.9rem;color:#777;margin-top:0.7rem;transition:color 0.35s;line-height:1.8}
.list-ctjs ul li span{width:4rem;height:2rem;line-height:2rem; font-size:0.9rem;text-align: center;float: right;margin-top:1.5rem;display:block;border:#fff 1px solid;color: #fff;opacity:0;transition:opacity 0.35s;}
.list-ctjs ul li:hover{background: #105aa1;}
.list-ctjs ul li:hover:after{content:""; opacity:1;background-size: contain;}
.list-ctjs ul li:hover h2{color: #fff}
.list-ctjs ul li:hover p{color: #8fb8df}
.list-ctjs ul li:hover span{opacity:1}


/*产品正文*/
.product-z{width: 100%;margin:2rem auto;height: auto;overflow: hidden;display: flex}
.pro-right{flex: 1 1 0;padding:1rem 2rem}
.pro-right h2{font-size: 1.5rem;color:#000;}
.pro-right .pro-right-z{margin: 1rem auto;}
.pro-right .pro-right-z p{font-size: 1rem;color: #555;line-height:2;}
.pro-right .pro-right-z p:before{content: "·";display: inline-block;vertical-align:middle;margin-right:0.5rem;margin-bottom:0.03rem;}
/* 主容器 */
        .gallery-pro {
            width: 25rem;
            background: #fff;
            padding: 0.5rem;
            border: 1px solid #ddd;
          
            
        }

        /* 大图区域 */
        .main-image-wrapper {
            position: relative;
            width: 100%;
            height: 25rem;
            overflow: hidden; /* 隐藏缩放溢出部分 */
            border: 1px solid #eee;
            margin-bottom: 10px;
            cursor: pointer;
            background-color: #f9f9f9; /* 图片加载前的底色 */
            aspect-ratio: 4 / 3;
            display: grid;
            place-items: center;
        }

        .main-image {
            object-fit: cover;
            display: block;
        }

        /* --- 核心动画：淡入 + 轻微放大 --- */
        .fade-in-effect {
            animation: smoothFadeIn 0.4s ease-out forwards;
        }

        @keyframes smoothFadeIn {
            0% {
                opacity: 0.3;
                transform: scale(1.03); /* 初始稍微放大一点点，有一种收缩感 */
            }
            100% {
                opacity: 1;
                transform: scale(1); /* 恢复到正常大小 */
            }
        }

        /* 红色放大按钮 */
        .zoom-btn {
            position: absolute;
            bottom: 0;
            right: 0;
            width: 2.08rem;
            height: 2.08rem;
            background-color: rgba(0, 71, 139, 0.8);
            border: 2px solid #fff;
            border-bottom: none;
            border-right: none;
            cursor: pointer;
            display: flex;
            justify-content: center;
            align-items: center;
            transition: background 0.3s;
            background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line><line x1="11" y1="8" x2="11" y2="14"></line><line x1="8" y1="11" x2="14" y2="11"></line></svg>');
            background-repeat: no-repeat;
            background-position: center;
            z-index: 10;
        }

        .zoom-btn:hover { background-color: rgba(35, 172, 56, 0.8); }

        /* 缩略图区域 */
        .thumbnails {
            display: flex;
            gap: 0.52rem;
            overflow-x: auto;
        }

        .thumb-img {
            width:  5.5rem;
            height:  5.5rem;
            object-fit: cover;
            border: 2px solid transparent;
            cursor: pointer;
            opacity: 0.6;
            transition: all 0.3s ease; /* 给缩略图本身也加过渡 */
            transform: scale(0.95); /* 未选中时稍微小一点点 */
        }

        /* 选中和悬浮状态 */
        .thumb-img:hover { opacity: 0.9; }
        .thumb-img.active {
            border-color: #007bff;
            opacity: 1;
            transform: scale(1); /* 选中恢复大小 */
        }

        /* --- 模态框样式 (保持不变) --- */
        .modal { display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.9); justify-content: center; align-items: center; }
        .modal.active { display: flex; }
        .modal-content-wrapper { position: relative; max-width: 90%; max-height: 90%; }
        .modal-content { max-width: 100%; max-height: 90vh; display: block; box-shadow: 0 0 20px rgba(0,0,0,0.5); }
        .modal-prev, .modal-next { cursor: pointer; position: absolute; top: 50%; width: auto; padding: 16px; margin-top: -50px; color: white; font-weight: bold; font-size: 30px; transition: 0.6s ease; border-radius: 0 3px 3px 0; user-select: none; background-color: rgba(0,0,0,0.3); }
        .modal-prev:hover, .modal-next:hover { background-color: rgba(0,0,0,0.8); }
        .modal-prev { left: 0; border-radius: 3px 0 0 3px; }
        .modal-next { right: 0; border-radius: 0 3px 3px 0; }
        .pro-close-btn { position: absolute; top: 20px; right: 30px; color: #fff; font-size: 40px; font-weight: bold; cursor: pointer; z-index: 1001; }
        .pro-close-btn:hover { color: #ccc; }
.product-artice{margin-top:2rem;}
.product-title{font-size: 1.2rem;color: #000;border-bottom: #ddd 1px solid;position: relative;padding-bottom:1rem;text-indent:1rem}
.product-title:before{content:"";width: 5.2rem;background: #00478b;height:0.3rem;position: absolute;bottom:0;left:0}
.product-title:after{content:"";width: 1.56rem;background: #23ac38;height:0.3rem;position: absolute;bottom:0;left:5.2rem}

.fck{font-size:1rem;color: #252525;line-height:2.2;margin:0 auto;padding:1.5rem 1rem}
.fck div,.fck p,.fck span{font-size:1rem !important;color: #252525 !important;margin:0 auto;}
.fck img{display:inline}
.article-title{width:100%;margin:1.5rem auto;text-align: center;height: auto;overflow: hidden}
.article-title h1{font-size:1.5rem;color:#000;font-weight:600;line-height:1.8;width:98%;margin:0 auto}
.article-title p{color:#555;font-size:1rem;display:block;margin-top:1rem;}
.article .fck{padding:1rem}
/*联系我们*/

.my-map:before{content:"";width:98%;background-image: -moz-linear-gradient( 90deg, rgb(27,80,148) 0%, rgb(92,142,207) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(27,80,148) 0%, rgb(92,142,207) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(27,80,148) 0%, rgb(92,142,207) 100%);height:24rem;position: absolute;right:0;bottom:0;z-index: 0;}
.my-map { margin:0.4rem auto 0 auto; width:85%; height:25rem;padding:0.5rem;position:relative;z-index:5;}
.my-map .icon { background: url(../img26/red-mbx-ico.png) no-repeat;background-size: contain;display: none}
.my-map .icon-cir { height:0.8rem; width: 1.2rem; } 
     .amap-container{height: 100%;}
     .myinfowindow{width:13rem;min-height:4rem;}
     .myinfowindow h5{  overflow: hidden; font-size:1rem; font-weight: bold; width: 100%; text-overflow: ellipsis; word-break: break-all; white-space: nowrap; margin-top:1rem; }
     .myinfowindow div{ font-size:0.9rem; color: #6f6f6f;margin-top:0.5rem; line-height:1.5}
.amap-copyright{display: none !important}

.amap-maptypecontrol, .amap-overviewcontrol, .amap-scalecontrol, .amap-toolbar{z-index:10 !important}

.amap-maps{font-size:1rem !important;}
.amap-overlays{z-index: 10;}
.lxwm{  background-image: -moz-linear-gradient( 90deg, rgb(216,231,245) 0%, rgb(255,255,255) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(216,231,245) 0%, rgb(255,255,255) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(216,231,245) 0%, rgb(255,255,255) 100%);border-radius: 10px;width:100%;height:28rem;margin-top: -8rem;position: relative;z-index: 1;}
.lxwm:before{content:"";background: url("../img26/lxwm-ico.png")bottom center no-repeat;width:21.35rem;height:23.65rem;position: absolute;bottom:0;right:0;background-size: contain}
.lxwm-z{width:94%;margin:0 auto;padding-top:10rem;}
.lxwm-z p{line-height:1.5rem;margin-top:1rem;}
.lxwm-z i{width:0.3rem;height:0.3rem;background: #0c4388;border-radius:50%;display: inline-block;margin-right:1rem;margin-bottom: 0.03rem;vertical-align: middle;}

.lxwm-z span{display: inline-block;font-size: 1rem;color:#252525;}


.list-nodate ul li{padding:0.75rem 0.5rem 0.5rem 2rem ;border-bottom: #ddd 1px solid;background: #fff;position: relative;}
.list-nodate ul li h2{width:calc(100% - 1rem);white-space:pre-line;overflow: hidden;color: #252525;font-size: 1rem;line-height:1.8;display: inline-block;position: relative;z-index: 2;transition:color 0.35s}
.list-nodate ul li i{width:0.4rem;height:0.4rem;background: #0c4388;border-radius:50%;display: inline-block;vertical-align: top;position: absolute;left:1rem;top:1.25rem;z-index: 2;transition:color 0.35s}
.list-nodate ul li:before{content:"";width:0;height:100%;position: absolute;left:0;top:0; background: linear-gradient(to right, #3b82f6, #0b4a8f);transition:width 0.35s;z-index: 1;}
.list-nodate ul li:hover:before{content:"";width:100%}
.list-nodate ul li:hover i{background: #fff;}
.list-nodate ul li:hover h2{color: #fff;}

/*分页样式*/

.fck table{margin:0 auto}
.fck table td,.fck table th{border:#333 1px solid !important;text-align:center}
 .p_pages { clear:both; display:inline-block; padding:2.6rem 0; width:100%; text-align:center; font-size:1rem; }
.page a { display:inline-block; margin:0 5px; padding:0.3rem 0.6rem; border:1px #e37e11 solid; color: #111 }
.p_no_d{ display:inline-block; margin:0 5px; padding:0.3rem 0.6rem; border:1px #e37e11 solid;background:#e37e11; color:#fff; }
.page span{display:inline-block;}
.p_fun_d { display:inline-block; margin:0 5px; padding:0.3rem 0.6rem; border:1px #ddd solid; color: #111 }
.p_fun_d  a { display:inline-block; margin:0 5px; padding:0.3rem 0.6rem; border:1px #ddd solid; color: #111 }
.p_fun_d:hover{ background:#e37e11; color:#fff; }
.p_fun_d a:hover,.p_fun_d.thisclass a { background:#e37e11; color:#fff; }

.page {
	clear: both;
	display: inline-block;
	padding: 2.6rem 0;
	width: 100%;
	text-align: center;
	font-size: 1rem;
}
.page .pagination{display:block;position:static;text-align:center;}
.page a {
	display: inline-block;
	margin: 0 0.25rem;
	padding: 0.3rem 0.6rem;
	border: 1px #eee solid;
	color: #555
}
.page li.thisclass {
	display: inline-block;
	margin: 0 0.25rem;
	padding: 0.3rem 0.6rem;
	border: 1px #eee solid;
	background: #3d63c5;
	color: #fff;
}
.page a:hover, .page li.active a {
	background: #3d63c5;
	color: #fff;
}
.page li {
	display: inline-block;
*display:inline;
*zoom:1;
}
.page li select {
	font-size: 1rem;
}
.page li option {
	font-size: 1rem;
}
.list-zhuanli table{width:100%;}
.list-zhuanli table tr th{background:#00478b;color:#fff;font-size:1rem;border:#fff 1px solid;padding:1rem;}
.list-zhuanli table tr td{vertical-align:middle;color:#252525;font-size:0.85rem;text-align:center;padding:0.7rem;line-height:1.6;border:#ddd 1px solid;
}

.list-client{ grid-template-columns: repeat(4, 1fr);display: grid;gap:1.5rem 0.5rem;}
.list-client .cs-item{border:#ddd 1px solid;padding:0;height:10.5rem}
.list-client .cs-item p{position: static;padding:0.5rem 0;background:#1f76c9;}
.list-client .cs-item img{max-width:98%;max-height:98%}


/* ==========================================================================
   响应式
   ========================================================================== */
@media (max-width: 1200px) {

    .wrapper2{width:96%}
}

@media (max-width: 992px) {
    
  body.nav-open { overflow: hidden; }

  /* ---------- Header：搜索 / 菜单 按钮 ---------- */
  .header-inner { height: 60px; gap: 10px; }
  .logo img { height: 34px; max-width: 100%; }
  .header-right { gap: 8px; }
  .search, .lang { display: none; }

  .hd-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 6px;
    background: #00478B;
    color: #fff;
    cursor: pointer;
    transition: background .25s ease;
    flex: none;
  }
  .hd-btn:active { background: #0B62B6; }
  .hd-btn svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
  }
  .menu-btn { flex-direction: column; gap: 4px; }
  .menu-btn span {
    display: block;
    width: 18px;
    height: 2px;
    background: #fff;
    border-radius: 2px;
    transition: transform .3s ease, opacity .3s ease;
  }
  .menu-btn.on span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .menu-btn.on span:nth-child(2) { opacity: 0; }
  .menu-btn.on span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

  /* ---------- 点击搜索按钮展开的搜索条（固定定位在 header 正下方） ---------- */
  .mobile-search {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    top: 60px;
    z-index: 150;
    background: #00478B;
    padding: 12px 0;
    box-shadow: 0 10px 22px rgba(0, 0, 0, .25);
  }
  .mobile-search.open { display: block; }
  .mobile-search form {
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .mobile-search input {
    flex: 1;
    min-width: 0;
    height: 42px;
    padding: 0 14px;
    font-size: 14px;
    color: #333;
    background: #fff;
    border: 0;
    border-radius: 4px;
  }
  .mobile-search input::placeholder { color: #9AA7B4; }
  .mobile-search button {
    flex: none;
    height: 42px;
    padding: 0 22px;
    background: #23AC38;
    color: #fff;
    font-size: 14px;
    border-radius: 4px;
    cursor: pointer;
    transition: background .25s ease;
  }
  .mobile-search button:active { background: #1d9430; }

  /* ---------- 导航抽屉 ---------- */
  .nav {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: auto;
    width: 80%;
    max-width: 340px;
    z-index: 300;
    background: #fff;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    transform: translateX(100%);
    transition: transform .36s cubic-bezier(.4, 0, .2, 1);
    box-shadow: -6px 0 24px rgba(0, 0, 0, .18);
    padding-bottom: 30px;
  }
  .nav.open { transform: translateX(0); }
  .nav > .wrap { padding: 0; width: 100%; }

  /* 抽屉顶部栏：吸附在抽屉顶部，收起时随抽屉一起移出屏幕 */
  .mnav-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 52px;
    padding: 0 16px;
    background: #00478B;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    position: sticky;
    top: 0;
    z-index: 5;
    flex: none;
  }
  .mnav-close {
    position: relative;
    width: 30px;
    height: 30px;
    cursor: pointer;
    flex: none;
  }
  .mnav-close::before,
  .mnav-close::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 18px;
    height: 2px;
    background: #fff;
    border-radius: 2px;
  }
  .mnav-close::before { transform: translate(-50%, -50%) rotate(45deg); }
  .mnav-close::after { transform: translate(-50%, -50%) rotate(-45deg); }

  .nav-list { display: block; justify-content: flex-start; }
  .nav-list > li {
    border-bottom: 1px solid #EDF1F5;
    position: relative;
  }
  .nav-list > li > a {
    display: block;
    height: auto;
    line-height: 1.4;
    padding: 15px 46px 15px 16px;
    color: #123;
    font-size: 15px;
    white-space: normal;
  }
  .nav-list > li > a::after { display: none; }
  .nav-list > li:hover > a,
  .nav-list > li.on > a { background: none; color: #00478B; }
  .nav.open .nav-list > li > a { color: #123; }

  /* 子菜单展开按钮 */
  .sub-toggle {
    display: block;
    position: absolute;
    right: 10px;
    top: 7px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    z-index: 2;
  }
  .sub-toggle::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 8px;
    height: 8px;
    border-right: 2px solid #8FA6BB;
    border-bottom: 2px solid #8FA6BB;
    transform: translate(-50%, -70%) rotate(45deg);
    transition: transform .3s ease;
  }
  .has-sub.open .sub-toggle::before {
    transform: translate(-50%, -30%) rotate(-135deg);
  }

  /* 子菜单：手风琴（用 display 控制，兼容性最稳） */
  .nav .sub {
    position: static;
    left: auto;
    top: auto;
    width: auto;
    margin-left: 0;
    background: #F4F8FB;
    padding: 0;
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: none;
    box-shadow: none;
    overflow: hidden;
    display: none;
  }
  .nav .has-sub.open > .sub { display: block; }
  .nav .sub a {
    height: auto;
    line-height: 1.4;
    padding: 12px 16px 12px 30px;
    text-align: left;
    color: #456;
    background: transparent;
    font-size: 14px;
    border-bottom: 1px solid #E6EDF3;
    position: relative;
  }
  .nav .sub a::before {
    content: "";
    position: absolute;
    left: 17px;
    top: 50%;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #A9BCCD;
    transform: translateY(-50%);
  }
  .nav .sub a:last-child { border-bottom: 0; }
  .nav .sub a:hover { background: #E9F1F8; color: #00478B; }

  /* 遮罩 */
  .nav-mask {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 290;
    background: rgba(0, 0, 0, .45);
    opacity: 0;
    visibility: hidden;
    transition: opacity .35s ease, visibility .35s;
  }
  .nav-mask.on { opacity: 1; visibility: visible; }

  /* ---------- 其余版块 ---------- */
  .banner { height: 480px; }
  .banner-inner { padding-top: 150px; }
  .banner-boxes li, .banner3-cols li { font-size: 14px; }
  .product { height: 340px; }
  .ps-track { height: 240px; top: 30px; }
  .ps-slide { width: 440px; height: 330px; }
  .ps-prev { left: 60px; }
  .ps-next { right: 60px; }
  .compare { height: 420px; }
  .icombox-title { font-size: 20px; }
  .icombox-link { margin-top: 30px; }
  .icom-img { opacity: .5; }
      .about-inner { flex-direction: column; }
  .about-left { width: 100%; }
  .about-nums { position: static; width: 100%; margin-top: 2rem; }
  .news-cards { flex-wrap: wrap; }
  .out-cards { flex-wrap: wrap; }
    .banner-bg{object-fit: cover; }
    .list-r{width:100%;float:none;}
    .list-l{float: none;width: 15rem;margin:2rem auto;}
    .product-z{display: block;}
    .gallery-pro{margin:0 auto}
    .pro-right{padding:2rem 0;margin:0 auto}
        .mbx{text-align:left}
    .items_base{display: block}
    .base_z{height:auto;overflow: hidden;padding:0.5rem;margin:0 auto}
    .base_z p{line-height:2;font-size: 0.9rem;}
    .my-map{width:100%}
    .lxwm{height: auto;overflow: hidden;padding-bottom: 0.5rem;margin-top: -9rem;}
    .lxwm-z span{font-size: 0.9rem;}
    .lxwm-z i{width:0.2rem;height:0.2rem;display:none;}
    .list-leader ul{grid-template-columns:repeat(4, 1fr)}
}

@media (max-width: 768px) {
  
  html { font-size: 10px; }
  .wrap { padding: 0 15px; }
  .header-inner { height: 56px; gap: 8px; }
  .logo img { height: 28px; }
  .hd-btn { width: 32px; height: 32px; }
  .hd-btn svg { width: 17px; height: 17px; }
  .menu-btn span { width: 16px; }
  .nav { width: 84%; }
  .mobile-search input { height: 38px; }
  .mobile-search button { height: 38px; padding: 0 16px; }
  .banner { height: 320px; }
  .banner-inner { padding-top: 54px; }
  .banner-title { font-size: 19px; line-height: 1.35; }
  .banner-title.big { font-size: 19px; }
  .banner-sub { font-size: 12px; margin-top: 8px; }
  .banner-boxes { gap: 6px; margin-top: 12px; }
  .banner-boxes li { width: 88px; height: 66px; font-size: 11px; line-height: 1.35; padding: 0 2px; }
  .banner3-panel { width: 92%; height: auto; padding: 14px 0; }
  .banner3-title { font-size: 17px; }
  .banner3-cols { gap: 6px; margin-top: 10px; }
  .banner3-cols li { width: 86px; height: 64px; font-size: 11px; line-height: 1.35; }
  .banner3-side { display: none; }
  .banner-ctrl { bottom: 12px; gap: 12px; }
  .notice { height: auto; padding: 8px 0; }
  .notice-inner { flex-direction: column; align-items: stretch; }
  .notice-title { padding: 0 0 8px; }
  .notice-title::after { display: none; }
  .notice-title b { font-size: 14px; }
  .notice-title span { font-size: 14px; }
  .notice-title img { width: 22px; }
  .notice-scroll { margin-left: 0; height: 36px; }
  .notice-list li { height: 36px; line-height: 36px; font-size: 13px; }
  .about { height: auto; padding-bottom: 40px; }
  .about-left { padding-top: 30px; }
  .about-text { width: 100%; }
  .about-text p { font-size: 13px; }
  .base-list { width: 100%; gap: 24px ; margin-top: 30px;grid-template-columns: repeat(2, 1fr); }
  .base-list li { width: calc(100% - 6px); }
  .base-pic { height: 120px; }
  .sec-badge { height: 34px; line-height: 34px; padding: 0 18px; font-size: 14px; }
  .sec-title { font-size: 22px; }
  .num-ico { height: 70px; }
  .num-ico img { width: 74px; }
  .num-val { font-size: 24px; }
  .news { height: auto; padding-bottom: 40px; }
  .news-inner { padding-top: 34px; }
  .news-cards { flex-direction: column; align-items: center; gap: 16px; margin-top: 24px; }
  .news-card { width: 100%; max-width: 420px; }
  .research { height: auto; padding-bottom: 40px; }
  .research-inner { padding-top: 40px; }
  .research-cards { position: static; height: auto; display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-top: 24px; }
  .research-cards li { position: relative; left: auto !important; top: auto; width: auto; max-width: none; height: auto;margin-bottom: 24px;}
  .research-cards li:nth-child(n) { left: auto; }
  .research-cards li:last-child { grid-column: 1 / -1; justify-self: center; width: 50%; }
  .research-cards li a { height: auto; }
  .rc-pic { position: relative; height: 140px; }
  .rc-name { width: 90%; max-width: 100%; height:40px; line-height:32px; margin: 12px auto 0; font-size:18px; }
  .compare { flex-direction: column;}
  .icombox { width: 100% !important; height: 300px; }
  .icombox-intro { left: 0 !important; right: 0 !important; width: auto !important; text-align: left !important; padding: 0 20px; }
  .icom-img { width: 46%; opacity: .55; }
  .icombox-link { margin-top: 24px; }
  .icombox-list { margin-top: 14px; }
  .icombox-title { font-size: 20px; }
  .icombox-list li { font-size: 13px; line-height: 1.9; }
  .product { height: 280px; }
  .ps-track { height: 180px; top: 20px;left:61% }
  .ps-slide { width: 320px; height: 240px; }
  .ps-slide .ps-cap { font-size: 12px; left: 12px; }
  .ps-prev { left: 20px; }
  .ps-next { right: 20px; }
  .outcome { min-height: auto; }
  .outcome-inner { padding-top: 40px; padding-bottom: 40px; }
  .tabs-bar { width: 100%; height: 38px; border-radius: 19px; }
  .tabs-bar .tab.active:before { display: none; }
  .tabs-bar .tab.active:after { display: none; }
    .tabs-bar .tab{line-height:4rem;transform: translateY(0)}

  .out-cards { flex-direction: column; align-items: center; gap: 16px; margin-top: 20px; }
  .out-cards li { width: 100%; max-width: 420px; }
  .oc-pic { aspect-ratio: 4 / 3;
    display: grid;
    place-items: center;height: auto;}
    .oc-pic img{height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    width: 100%;
    transition: transform .6s;}
  .service { height: auto; padding-bottom: 40px; }
  .service-cards { flex-direction: column;  gap: 12px; margin-top: 24px; }
  .sv-card, .sv-card.active { width: 100%; height:150px; }
  .sv-info { opacity: 1; }
  .sv-ico { width: 60px; height: 60px; margin-bottom: 10px; }
  .client { height: auto; padding-bottom: 30px; }
  .cs-viewport { padding: 0 30px; }
  .cs-item { width: 150px; height: 90px; }
  .footer { height: auto; padding-bottom: 24px; }
  .footer-inner { padding-top: 40px; }
  .footer-logo img { height: 40px; }
  .footer-nav { margin-top: 24px;grid-template-columns: repeat(4, 1fr);display: grid;text-align: center;gap:10px 5px;}
  .footer-nav a { padding:0; font-size: 13px; }
    .footer-nav li:before{display: none}
  .footer-info { flex-direction: column; align-items:left; gap:0 10px; margin-top: 20px; }
  .fi-col li { font-size: 13px; }
  .copyright { margin-top: 26px; font-size: 12px; line-height: 1.8; padding: 0 15px; }
    .compare .icombox.hide .icom-img{display: none;}
    .compare .icombox.hide .icombox-side{top:42%}
    .compare{height:450px;}
    .service-cards{height:46rem}
    .fi-qr{margin: 1.5rem auto;text-align: center}
    .gallery-pro{width:100%;}
    .main-image{width:100%;height:100%;}


}
@media (max-width:480px) {
        .list-leader ul{grid-template-columns:repeat(2, 1fr)}
     .gallery-container{grid-template-columns:repeat(2, 1fr)}
         .gallery-user{grid-template-columns:repeat(2, 1fr)}
    .list-client{grid-template-columns:repeat(2, 1fr)}
    .list-client .cs-item{margin:0 auto}
    .banner{height:220px;}
    .footer-nav{grid-template-columns:repeat(3, 1fr)}
    .footer-nav a{font-size: 14px;}
    .fi-col li{align-items:unset}
    .fi-col li i{margin-top: 0.7rem;}
}