/* 关于我们页专用样式 */

/* 修正模板背景图路径：背景图实际存放于 /static/picture（style.css 指向的 ../image/ 为空目录，导致白字+白底不可见） */
.nab { }
.qywh { background-image: url(/static/picture/na03.jpg); }
.youshi { background-image: url(/static/picture/ysbj.jpg); }

/* 公司简介大标题（文本版，替代参考站 logo 图） */
.nab h1 { font-size:44px; line-height:56px; font-weight:bold; }

/* 企业环境：左右箭头滚动轮播 */
.hj-carousel {
  width: 100%;
  float: left;
  margin-top: 50px;
  padding: 0 8.33vw;
  box-sizing: border-box;
  position: relative;
}
.hj-viewport {
  overflow: hidden;
  width: 100%;
}
.hj-track {
  display: flex;
  transition: transform 0.5s ease;
}
.hj-slide {
  flex: none;
  width: 33.333%;
  padding: 0 10px;
  box-sizing: border-box;
}
.hj-slide img {
  width: 100%;
  height: 280px;
  object-fit: cover;
  display: block;
  border-radius: 8px;
}
.hj-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  background: rgba(12, 66, 122, 0.85);
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  transition: background 0.3s;
}
.hj-arrow svg {
  width: 22px;
  height: 22px;
}
.hj-arrow:hover {
  background: #0C427A;
}
.hj-prev {
  left: calc(8.33vw - 4px);
}
.hj-next {
  right: calc(8.33vw - 4px);
}

@media screen and (max-width: 992px) {
  .hj-slide {
    width: 50%;
  }
  .hj-slide img {
    height: 220px;
  }
}
@media screen and (max-width: 768px) {
  .hj-slide {
    width: 100%;
  }
  .hj-slide img {
    height: 200px;
  }
}

/* 企业文化页（about1.html） */
.wh-title {
  width: 100%;
  float: left;
  margin-top: 80px;
  margin-bottom: 40px;
  text-align: center;
  font-size: 32px;
  font-weight: bold;
  color: #0C427A;
}
.wh-core {
  width: 100%;
  float: left;
  padding: 0 8.33vw;
  box-sizing: border-box;
}
.wh-core ul {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
.wh-core ul li {
  width: calc(25% - 15px);
  background: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 10px;
  padding: 30px 24px;
  text-align: center;
  box-sizing: border-box;
}
.wh-core ul li h3 {
  font-size: 22px;
  color: #0C427A;
  margin-bottom: 15px;
}
.wh-core ul li p {
  font-size: 15px;
  line-height: 26px;
  color: #666;
}
.wh-values {
  width: 100%;
  float: left;
  padding: 40px 8.33vw 100px;
  box-sizing: border-box;
}
.wh-values ul {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
.wh-values ul li {
  width: calc(33.33% - 14px);
  background: #f6f8fa;
  border-left: 4px solid #0C427A;
  padding: 24px;
  box-sizing: border-box;
}
.wh-values ul li h3 {
  font-size: 20px;
  color: #0C427A;
  margin-bottom: 12px;
}
.wh-values ul li p {
  font-size: 14px;
  line-height: 26px;
  color: #555;
}

@media screen and (max-width: 992px) {
  .wh-core ul li,
  .wh-values ul li {
    width: calc(50% - 10px);
  }
}
@media screen and (max-width: 768px) {
  .wh-core ul li,
  .wh-values ul li {
    width: 100%;
  }
}

/* 品牌优势图标（矢量 SVG，替换 ys01-04.png 模板图） */
.youshi .pic {
  display: flex;
  justify-content: center;
  align-items: center;
}
.youshi .pic svg {
  width: 64px;
  height: 64px;
  color: #b8c2cf;
  transition: all 0.3s;
}
.youshi ul li:hover .pic svg {
  color: #0C427A;
  transform: scale(1.1);
}

/* 关于页：数据条（视频下方，一行4个） */
.nab-stats {
  width: 100%;
  float: left;
  margin-top: 24px;
  padding-top: 24px;
}
.nab-stats ul {
  display: flex;
}
.nab-stats ul li {
  width: 33.33333333%;
  text-align: center;
}
.nab-stats ul li .xpic {
  overflow: hidden;
  display: flex;
  justify-content: center;
}
.nab-stats ul li .xpic img {
  width: 56px;
  height: auto;
}
.nab-stats ul li dl dt {
  margin-top: 12px;
  font-size: 12px;
  line-height: 20px;
  color: #666;
}
.nab-stats ul li dl dd {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  line-height: 20px;
  color: #666;
}
.nab-stats ul li dl dd b {
  font-size: 28px;
  line-height: 34px;
  color: #0C427A;
  font-family: Roboto, Arial, sans-serif;
  margin-right: 2px;
}
@media screen and (max-width: 768px) {
  .nab-stats ul li {
    width: 33.33333333%;
  }
  .nab-stats ul li .xpic img {
    width: 44px;
  }
  .nab-stats ul li dl dd b {
    font-size: 24px;
  }
}
