.underline{
  border: none;
  height: 1px; /* 原始高度 */
  background: #999;
  margin: 20px 0;
  transform: scaleY(0.5); /* 垂直压缩为 0.5px */
  transform-origin: 0 0; /* 确保从顶部开始缩放 */
  margin-top: 20px;             /* 上下边距 */
  width: 100%;
}
/* 第一屏 轮播 1111111111111111111111111111111111111111111111111111*/
.video {
  height: 98vh;
  width: 100%;
  background-color: rgba(33, 36, 49, 0.8);
}
.glide {
  position: relative;
  z-index: 50;
}
.glide__slide img,
.glide__slide video {
  width: 100vw;
  /* height: 100vh; */
  height: 98vh;
  /* 自动等比例缩放 */
  object-fit: cover;
}
.slide-caption {
  position: absolute;
  z-index: 70;
  color: var(--text-color-lightest);
  text-align: center;
}
.glide__bullets {
  bottom: 3em !important;
}

.glide__slide {
  display: flex;
  /* align-items: center; */
  justify-content: center;
  opacity: 0.7;
  transition: opacity 5s;
}
.glide__slide--active { opacity: 1; }
.video .slide-caption .slide-title {
  display: flex;
  justify-content: center;
}
.video .slide-caption .slide-text {
  margin: 20px 0;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border-radius: 4px;
}

.video .slide-caption .slide-text {
  font-size: 0.33rem;
}
.video .slide-caption .slide-text span {
  font-size: 0.33rem;
  color: #ff9d29;
}
.slide-item {
  position: relative;
  padding: 0.2rem 0.25rem;
  display: flex;
  width: fit-content;
  justify-content: flex-start;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.slide-item img {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: fill;
}
.slide-caption .item {
  text-align: left;
  margin-top: 0.35rem;
  font-size: 0.9rem;
  font-weight: 600;
}
.video .slide-caption .slide-title h1 {
  font-size: 0.75rem;
  font-family: Source Han Sans CN;
  /* font-weight: 600; */
  margin: 0 0.5625rem;
}
.video .slide-caption-one {
  margin-top: 4.3125rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.video .slide-caption .slide-caption-one > li {
  margin: 0 10px;
}
.video .slide-caption ul .circle {
  width: 6px;
  height: 6px;
  background: #ff9d29;
  border-radius: 50%;
}
.glide__arrows .glide__arrow .glide__arrow--left{
  border: none;
  box-shadow: none;

}
.glide__arrows .glide__arrow .glide__arrow--right{
  border: none;
  box-shadow: none;
}
.video .slide-caption h3 {
  font-size: 24px;
  margin: 48px 0;
}
.video .slide-caption.left {
  max-width: 80vw;
  text-align: left;
}
/* .slide-caption > * {
  opacity: 0;
} */
.slide-item-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 0.5rem;
  row-gap: 20px;
  margin: 0.8rem 0 0.8rem 10px;
  text-align: left;
  width: fit-content;
}
section {
  position: relative;
  overflow: hidden;
}

@media (max-width: 1600px) {
.video {
  margin-top: 100px;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  width: auto;
  height: auto;
}

.glide__slide video {
    margin-top: 100px;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  width: auto;
  height: auto;
}
.glide__slide img{
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  width: auto;
  height: auto;
}
}
@media (max-width: 1030px) {
.video {
  margin-top: 105px;
 
}
.glide__slide video {
    margin-top: 105px;
}
.glide__slide img{
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  width: auto;
  height: auto;
}
}
@media (max-width: 858px) {
.video {
  margin-top: 220px;
 
}
.glide__slide video {
    margin-top: 220px;
}
.glide__slide img{
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  width: auto;
  height: auto;
}
}
@media (max-width: 662px) {
.video {
  margin-top: 240px;
 
}
.glide__slide video {
    margin-top: 240px;
}
.glide__slide img{
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  width: auto;
  height: auto;
}
}
/* 第二屏 合同物流 22222222222222222222222222222222222222222222222*/
.custom_navbar h1 {
  font-size: 0.75rem;
  color: #000000da;
  font-weight: 800;      /* 加粗 */
  text-align: center;     /* 水平居中 */
  margin-bottom: 0.775rem; 
  /* margin-top: 0.775rem; */
  line-height: 1.5;       /* 可选：调整行高，使垂直方向更协调 */
}

.custom_navbar,
.certificate{
padding: 5vh 15vw;
}

@media (max-width: 1600px) {
.custom_navbar,
.certificate{
padding: 1vh 2vw;
}
}

.custom_navbar .navbar {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: unset;
  margin: .375rem 0;
  position: relative;
 
}

.custom_navbar .nav-tabs {
  border: none;
  display: flex;
  justify-content: center;
  align-items: center;
}

.custom_navbar .nav-item .nav-link {
  margin: 0 1.75rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

/* 小横杠 */
/* .nav-item .nav-link span::after {
  content: "";
  display: block;
  text-align: center;
  height: 4px;
  width: 40px;
  margin-top: 10px;
  border-bottom: 4px solid #fd3907;
} */

.custom_navbar .nav>li>a {
  padding: unset;
}

.img1 {
  background-image: url(../imgs/icons/truck.png);
}

.img2 {
  background-image: url(../imgs/icons/road.png);
}

.img3 {
  background-image: url(../imgs/icons/multidimensional.png);
}

.custom_navbar .nav-item .nav-link .img1,
.custom_navbar .nav-item .nav-link .img2,
.custom_navbar .nav-item .nav-link .img3 {
  margin-bottom: 15px;
  width: 1rem;
  height: 1rem;
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  background-size: 100% 100%;
  background-size: cover;
  background-position: center;
  object-fit: cover;
}

.nav-tabs>li>a {
  border: none;
}

.custom_navbar .nav-tabs>li.active>a,
.custom_navbar.nav-tabs>li.active>a:focus,
.custom_navbar.nav-tabs>li.active>a:hover {
  background-color: unset;
  border: none;
}

.custom_navbar .nav>li>a:focus,
.custom_navbar .nav>li>a:hover {
  background-color: unset;
}

.custom_navbar .nav-item .nav-link span {
  font-size: 13;
  color: #333333;
}

.custom_navbar .active a>span {
  font-size: 13 !important;
  color: #D11034 !important;
  /* font-weight: bold; */
}

.custom_navbar .active a .img1 {
  background-image: url(../imgs/icons/truck_active.png);
}

.custom_navbar .active a .img2 {
  background-image: url(../imgs/icons/road_active.png);
}

.custom_navbar .active a .img3 {
  background-image: url(../imgs/icons/multidimensional_active.png);
}
/* 图片后面那个背景 */
/* .custom_navbar .nav .active::after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  bottom: -0.375rem;
  left: 50%;
  border-left: .15rem solid transparent;
  border-right: .15rem solid transparent;
  border-bottom: .25rem solid #EEF1FB;
  transform: translateX(-50%);
}

.custom_navbar .tab-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: #EEF1FB;
  padding: 30px;
} */
/* 修改为只控制 active 的选项卡 */
.tab-content > .tab-pane {
  display: none; /* 默认隐藏 */
  width: 100%;
}

.tab-content > .tab-pane.active {
  display: flex; /* 只有 active 的显示为 flex */
  overflow: hidden;
}


/* 主容器设置为flex，两个部分各占50% */
/* overflow: hidden; 防止动画溢出 */
/* 直接对所有 #package1, #package2, #package3 设置了 display: flex，导致：
所有选项卡 同时显示（垂直堆叠）。
Bootstrap 的 display: none 被覆盖，无法隐藏非激活选项卡。 */
/* #package1,
#package2,
#package3 {
  display: flex;
  width: 100%;
  overflow: hidden; 
} */

.image-with-caption {
  display: inline-block; /* 保持容器紧凑 */
  margin: 0; /* 清除默认外边距 */
  text-align: center; /* 内容居中 */
  cursor: pointer; /* 整个区域可点击 */
  transition: all 0.3s; /* 添加过渡效果 */
}

.image-with-caption img {
  width: 100%; /* 图片宽度填充容器 */
  display: block; /* 消除图片底部间隙 */
}

.image-with-caption figcaption {
  margin-top: 8px; /* 标题与图片间距 */
  font-size: 14px;
  color: #333333;
  font-weight: normal;

}

.image-with-caption:hover figcaption {
  color: #D11034; 
}
/* part1 从左侧滑入 */
.part1 {
  flex: 1; /* 占1/2宽度 */
  transform: translateX(-100%); /* 初始在左侧外面 */
  animation: slideInFromLeft 1s ease-out forwards;
}

/* part2 从右侧滑入 */
.part2 {
  flex: 1; /* 占1/2宽度 */
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 两列 */
  grid-template-rows: repeat(2, 1fr); /* 两行 */
  gap: 10px; /* 图片间距 */
  transform: translateX(100%); /* 初始在右侧外面 */
  animation: slideInFromRight 1s ease-out forwards;
}

/* part2 中的图片样式 */
.part2 img {
  width: 100%;
  height: auto;
  object-fit: cover; /* 保持图片比例 */
  cursor: pointer; /* 鼠标手型 */
  transition: transform 0.3s; /* 悬停效果 */
  
}

/* 图片悬停放大效果 */
.part2 img:hover {
  transform: scale(1.05); /* 鼠标悬停时轻微放大（1.05倍） */
  cursor: pointer;         /* 鼠标指针变为手型（提示可点击） */
}

/* 左侧滑入动画 */
@keyframes slideInFromLeft {
  from { transform: translateX(-100%); }
  to { transform: translateX(0); }
}

/* 右侧滑入动画 */
@keyframes slideInFromRight {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}


/* 第三屏 标准化 333333333333333333333333333333333333333333333333333333*/
/* 整体,设置颜色等 */
.certificate h1 {
  font-size: 0.75rem;
  color: #000000da;
  font-weight: 800;      /* 加粗 */
  text-align: center;     /* 水平居中 */
  margin-bottom: 0.775rem; 
  /* margin-top: 0.775rem; */
  line-height: 1.5;       /* 可选：调整行高，使垂直方向更协调 */
}
/* 父容器使用 flex 布局 */
.button-container {
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center;    /* 垂直居中 */
margin-top: 20px;
}

/* 按钮样式（保持你的原有代码） */
.go-button {
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center;    /* 垂直居中 */

  width: 180px;
  height: 50px;
  border: 2px solid #999;
  background-color: #ffffff;
  color: #999;
  border-radius: 30px;
  font-weight: bold;
}

.go-button:hover {
  background-color: #D11034; /* 悬停时变深绿色 */
  color: #fff; /* 白色文字 */
  border:none;
}

/* 第四屏 标准化详情*/
section.standardDetail {
  width: 100%;
  position: relative;
  /* background: url(../imgs/bg8.jpg); */
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  background-size: 100% 100%;
  padding: 1.125rem 0;
  /* object-fit: cover; */
 
}

.swiper-slide-left {
  position: relative; /* 下层元素需有定位 */
  width: 100%;
  z-index: 1;        /* 数值小于上层元素的 z-index */
}

.swiper-slide-left img {
  width: 100%;
  height: 40%;
  /* object-fit: cover; */
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  background-size: 100% 100%;
}

.swiper-slide-right {
  padding: 40px 20px;
  margin: 0 auto;
  position: relative; /* 关键！ */
  display: flex;
  justify-content: center;
  align-items: center;
  /* border: 1px solid #ec1717;  */
  border-radius: 12.6px; /* 圆角 */
  box-shadow: 0 0 15px rgba(94, 92, 92, 0.3); /* 模糊阴影，半透明 */
  background: #fff;
  width: 70%;
  height: auto;
  margin-top: -60px;
  z-index: 10;
   overflow: hidden;/*防止溢出 */
}


/* part1 从左侧滑入 */
.swiper-slide-right img{
  transform: translateX(-100%); /* 初始在左侧外面 */
  animation: slideInFromLeft 1s ease-out forwards;
}

/* part2 从右侧滑入 */
.swiper-slide-right .right {
  transform: translateX(100%); /* 初始在右侧外面 */
  animation: slideInFromRight 1s ease-out forwards;
}

/* 左侧滑入动画 */
@keyframes slideInFromLeft {
  from { transform: translateX(-100%); }
  to { transform: translateX(0); }
}

/* 右侧滑入动画 */
@keyframes slideInFromRight {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}

.swiper-slide-right img {
  
  width: 100%;
  height: auto;
  object-fit: cover; /* 保持图片比例 */
  transition: transform 0.3s; /* 悬停效果 添加平滑过渡*/
}


/* 图片悬停放大效果 */
.swiper-slide-right:hover img {
  transform: scale(1.05); /* 鼠标悬停时轻微放大（1.05倍） */
}

.swiper-slide-right .right{
  margin-left: 50px;
}
.swiper-slide-right h2{
  font-weight: 800;
  font-size: 20px;
  margin-bottom: 10px;
  color: #333333;
}

/* 小横杠 */
.swiper-slide-right h2::after {
  content: "";
  display: block;
  text-align: center;
  height: 1px;
  width: 80px;
  margin-top: 10px;
  border-bottom: 3px solid #D11034;
}

.swiper-slide-right p{
  margin: 40px 0; /* 上下边距20px，左右边距0 */
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  color: #666;
}

.swiper-slide-right .info{
  margin: 40px 0; /* 上下边距20px，左右边距0 */
  padding: 0 5px; /* 左右内边距5px，让内容离边缘更近 */
  display: flex;
  justify-content: center;
  align-items:flex-start;
  font-size: 0.4rem;
  gap: 40px; /* 添加这个属性设置子元素之间的间距 */
}
.swiper-slide-right .right span{
  margin: 1px 0; /* 上下边距20px，左右边距0 */
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 32px;
  font-weight: 800;
  color: #333333;
}
@media (max-width: 1600px) {
  .swiper-slide-right {
  padding: 40px 20px;
  margin: 0 auto;
  position: relative; /* 关键！ */
  display: flex;
  justify-content: center;
  align-items: center;
  /* border: 1px solid #ec1717;  */
  border-radius: 12.6px; /* 圆角 */
  box-shadow: 0 0 15px rgba(94, 92, 92, 0.3); /* 模糊阴影，半透明 */
  background: #fff;
  width: 80%;
  height: auto;
  margin-top: -60px;
  z-index: 10;
   overflow: hidden;/*防止溢出 */
}

  
.swiper-slide-right img {
  width: 50%;
}
}
@media (max-width: 1100px) {
  .swiper-slide-right {
  
  padding: 40px 20px;
  margin: 0 auto;
  position: relative; /* 关键！ */
  display: flex;
  justify-content: center;
  align-items: center;
  /* border: 1px solid #ec1717;  */
  border-radius: 12.6px; /* 圆角 */
  box-shadow: 0 0 15px rgba(94, 92, 92, 0.3); /* 模糊阴影，半透明 */
  background: #fff;
  width: 95%;
  height: auto;
  margin-top: -60px;
  z-index: 10;
   overflow: hidden;/*防止溢出 */
}

  
.swiper-slide-right img {
  
  width: 50%;

}
}

/* 第五屏 产品展示 5555555555555555555555555555555555555555555555555555555*/
.product h1 {
  font-size: 0.75rem;
  color: #000000da;
  font-weight: 800;      /* 加粗 */
  text-align: center;     /* 水平居中 */
  /* margin-bottom: 0.775rem; 底部外边距 */
  margin-top: 0.775rem;
  margin-bottom: 0.775rem;
  line-height: 1.5;       /* 可选：调整行高，使垂直方向更协调 */
  position: relative;
}

.product h1::after{
 position: absolute;
      /* 绝对定位 */
      /* 是经典的居中技巧 */
      left: 50%;
      /* 从50%位置开始 */
      transform: translateX(-50%);
      /* 向左回退自身宽度的一半 */
      bottom: -10px;
      /* 定位到p标签下方 */
      margin: 0;
      /* 清除可能干扰的margin */
      content: "";
      text-align: center;
      width: 80px;
      margin-top: 10px;
      border-bottom: 3px solid #D11034;
}
.allnews{
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 40px 100px; /* 上下边距20px，左右边距0 */
  padding: 0 10px; /* 左右内边距5px，让内容离边缘更近 */
  gap: 40px; /* 添加这个属性设置子元素之间的间距 */
}

.allnews .new1,
.allnews .new2,
.allnews .new3{
  width:30%;
  height: auto;
  object-fit: cover;
  transition: transform 0.3s ease; /* 平滑过渡 */
  cursor: pointer;         /* 鼠标指针变为手型（提示可点击） */
}

/* 分别设置悬停效果：仅当前悬停的块上移 */
.allnews .new1:hover,
.allnews .new2:hover,
.allnews .new3:hover {
  transform: translateY(-10px); /* 上移10px（负值向上） */
  cursor: pointer;         /* 鼠标指针变为手型（提示可点击） */
}

/* 小横杠 */
.swiper-slide-right h2::after {
  content: "";
  display: block;
  text-align: center;
  height: 1px;
  width: 80px;
  margin-top: 10px;
  border-bottom: 3px solid #D11034;
}

.allnews img{
  width:80%;
  height: 100%;
  object-fit: cover;
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  background-size: 100% 100%;
}

.allnews .bottom p{
  margin: 20px 0; /* 上下边距20px，左右边距0 */
  justify-content: center;
  align-items: center;
  font-size: 16px;
  color: #999;

}

/* 小横杠 */
.allnews .new1 h2::after,
.allnews .new2 h2::after,
.allnews .new3 h2::after {
  content: "";
  display: block;
  text-align: center;
  height: 1px;
  width: 40px;
  margin-top: 10px;
  border-bottom: 2px solid #D11034;
  /*transition: transform 0.8s ease;  平滑过渡 */
  transition: width 0.5s ease;
}
/* 卡片悬停时，h2 横杠变长 */
.allnews .new1:hover h2::after,
.allnews .new2:hover h2::after,
.allnews .new3:hover h2::after {
  width: 100%;
}

.button {
  /* display: inline-block; */
  display: flex;
  justify-content: center;
  align-items: center;
 /* 尺寸 */
 width: 120px; /* 固定宽度 */
 height: 40px;  /* 固定高度（可选） */
  /* 边框（描边） */
  border: 1px solid #333; /* 边框宽度+样式+颜色 */


  background-color: #333; /* 绿色背景 */
  color: #fff; /* 白色文字 */
  text-decoration: none; /* 去掉下划线 */

  font-weight: bold;
  transition: background-color 0.3s; /* 悬停动画 */
  border-color: #999;
}

.button:hover {
  background-color: #D11034; /* 悬停时变深绿色 */
  color: #fff; /* 白色文字 */
  border:none;
}

.product {
  /* width: 100vw; */
  height: 100%;
  position: relative;
}
.product .box {
  padding: 1.5rem 0 0.125rem 1.375rem;
  width: 100%;
  height: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  justify-content: center;
  align-items: center;
}
.product .box .right {
  justify-self: start;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.product .box .right h1 {
  font-size: 0.4rem;
  color: #333333;
}
.product .box .right p {
  font-size: 0.225rem;
  color: #666666;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 0.3rem 0 1.125rem 0;
}

.product .box .right .right_img p {
  font-size: 14px;
  color: #999999;
  text-align: center;
}