@charset "utf-8";
.page_quality .dropdown-column:nth-child(4) a {
				color: #fff !important;
				/* padding-left: 5px; */
				background-color: #002fa5;
			}
.intro-content {
    display: block;}	
	
	
	.material-test .page-nav-btn.next-btn,.dimensional-test .page-nav-btn.next-btn{
    color: white;
    border: none;
    cursor: pointer;
    position: absolute;
    right: -60px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    opacity: 1;
    }
	.material-test .page-nav-btn.next-btn a.layer-set,.dimensional-test .page-nav-btn.next-btn a.layer-set{ display:block; border:0; }
	.material-test .page-nav-btn.next-btn a.layer-set .gradient-bg-container,.dimensional-test .page-nav-btn.next-btn a.layer-set .gradient-bg-container{ background:none;background-color: #f3f5f7;}
	.material-test .page-nav-btn.next-btn a.layer-set .layer-icon,.dimensional-test .page-nav-btn.next-btn a.layer-set .layer-icon{ font-size:20px;}
	
	.material-test .page-nav-btn.prev-btn,.dimensional-test .page-nav-btn.prev-btn{
                color: white;
                border: none;
                cursor: pointer;
                position: absolute;
                left: -60px;
                top: 50%;
                transform: translateY(-50%);
                z-index: 10;
	}
	.material-test .page-nav-btn.prev-btn a.layer-set,.dimensional-test .page-nav-btn.prev-btn a.layer-set{ display:block;; border:0;}
	.material-test .page-nav-btn.prev-btn a.layer-set .gradient-bg-container,.dimensional-test .page-nav-btn.prev-btn a.layer-set .gradient-bg-container{ background:none;background-color: #f3f5f7;}
	.material-test .page-nav-btn.prev-btn a.layer-set .layer-icon,.dimensional-test .page-nav-btn.prev-btn a.layer-set .layer-icon{ font-size:20px;}
	
	
	
.quality_control_imgs{ position:relative;margin-bottom: 160px;}	
.pC_shows{ display:block}
.mobile_show{ display:none}
.quality_control_imgs .back_imgs_show{}
.quality_control_imgs .back_imgs_show img{ width:100%; height:auto}
.quality_control_imgs .back_imgs_show img{-webkit-clip-path: circle(0%);
	-webkit-transition: all 3s cubic-bezier(0.215, 0.610, 0.355, 1) 0s; width:100%;}
.quality_control_imgs .back_imgs_show img.is-inview{
	-webkit-clip-path: circle(100%);-webkit-transition-delay:0.1s;
}
.quality_control_imgs .img_center_b{position: absolute;
  top: 50%;           /* 先让元素顶部到父容器垂直中点 */
  left: 50%;          /* 先让元素左侧到父容器水平中点 */
  transform: translate(-50%, -50%); /* 向左、向上偏移自身50%，实现真正居中 */
  width: 405px;       /* 宽高可选，不设置也能居中 */
  height: auto; z-index:1}
.quality_control_imgs .img_center_b img{ width:405px; margin-top:240px;
filter: drop-shadow(0px 4px 10px rgba(0, 0, 0, 0.3));
  -webkit-filter: drop-shadow(0px 4px 10px rgba(0, 0, 0, 0.3));}  



.quality_control_imgs .img_center_l{position: absolute;
  top: 50%;           /* 先让元素顶部到父容器垂直中点 */
  left: 50%;          /* 先让元素左侧到父容器水平中点 */
  transform: translate(-50%, -50%); /* 向左、向上偏移自身50%，实现真正居中 */
  width: 235px;       /* 宽高可选，不设置也能居中 */
  height: auto; z-index:1}
 .quality_control_imgs .img_center_l img{ width:100%; margin-left: -130px;
  margin-top: -160px; 
  filter: drop-shadow(0px 4px 10px rgba(0, 0, 0, 0.3));
  -webkit-filter: drop-shadow(0px 4px 10px rgba(0, 0, 0, 0.3));
  
  } 

.quality_control_imgs .img_center_l{}
  

  
  .quality_control_imgs .img_center_r{position: absolute;
  top: 50%;           /* 先让元素顶部到父容器垂直中点 */
  left: 50%;          /* 先让元素左侧到父容器水平中点 */
  transform: translate(-50%, -50%); /* 向左、向上偏移自身50%，实现真正居中 */
  width: 235px;       /* 宽高可选，不设置也能居中 */
  height: auto; z-index:1}
 .quality_control_imgs .img_center_r img{ width:100%;margin-left: 130px;
  margin-top: -160px;
  filter: drop-shadow(0px 4px 20px rgba(8, 31, 92, 0.3));
  -webkit-filter: drop-shadow(0px 4px 20px rgba(8, 31, 92, 0.3));
  } 
  



.quality_control_imgs .img_center{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 238px;
  height: auto;
  z-index:2;
}
.quality_control_imgs .img_center img{
  width:100%;
  -webkit-clip-path: circle(0%);
  -webkit-transition: all 3s cubic-bezier(0.215, 0.610, 0.355, 1) 0s;
}
.quality_control_imgs .img_center.is-inview img{
  -webkit-clip-path: circle(100%);
  -webkit-transition-delay:0.3s; /* 这个只控制圆形显示延迟，不影响 hover */
}

/*  hover 放大动画：立即执行，无延迟 */
.quality_control_imgs .img_center img {
  transition: transform 0.3s ease !important;
  transition-delay: 0s !important;
}
.quality_control_imgs .img_center img:hover {
  transform: scale(1.10);
  cursor: pointer;
  transition-delay: 0s !important; /* 强制无延迟 */
}

/* 1. 入场动画样式：仅过渡 translateY 和 opacity，不影响 scale */
.quality_control_imgs .img_center_b img,
.quality_control_imgs .img_center_r img,
.quality_control_imgs .img_center_l img {
  opacity: 0;
  transform: translateY(30px);
  /* 只过渡位移和透明度，排除scale，避免覆盖悬浮的缩放过渡 */
  transition: 
    transform 1.2s cubic-bezier(.26,1,.48,1), 
    opacity 1.2s cubic-bezier(.26,1,.48,1);
  width: 100%;
  pointer-events: auto; /* 确保hover能触发 */
}

/* 入场动画激活样式：仅重置位移和透明度，保留scale的可修改性 */
.quality_control_imgs .img_center_b img.is-inview,
.quality_control_imgs .img_center_r img.is-inview,
.quality_control_imgs .img_center_l img.is-inview {
  transform: translateY(0px); /* 只重置位移，不写scale，留给hover */
  opacity: 1;
  -webkit-transition-delay: 0.8s;
  transition-delay: 0.8s;
}

/* 2. 悬浮放大样式：提升选择器优先级，仅过渡scale */
.quality_control_imgs .icon-png { /* 提升优先级：父容器 + 类名 */
  transform-origin: center center;
  display: block;
  max-width: 100%;
  z-index: 11;
  /* 仅过渡scale，时长0.3s，和入场动画的transition不冲突 */
  transition: transform 0.3s ease !important;
}

/* 悬浮时仅修改scale，和入场动画的transform（translateY）叠加生效 */
.quality_control_imgs .icon-png:hover {
  /* 使用 transform 复合属性：先位移0（继承入场后的状态），再缩放 */
  transform: translateY(0) scale(1.1) !important;
  cursor: pointer;
  /* 可选：悬浮时过渡时长优先用0.3s，覆盖入场的1.2s */
  transition: transform 0.3s ease !important;
}


.drop-shadow{filter: drop-shadow(0px 4px 18px rgba(8, 31, 92, 0.4));
  -webkit-filter: drop-shadow(0px 4px 18px rgba(8, 31, 92, 0.4)); }

/* 1. 基础样式：设置过渡动画 */
.upward_10px{
    /* 你的其他原有样式 */
    display: inline-block; /* 或者 block，确保 transform 生效 */
    
    /* 核心：添加过渡效果，0.3秒是比较舒适的动画时长 */
    transition: transform 0.3s ease; 
}

/* 2. 鼠标悬停样式：向上移动 10px */
.upward_10px:hover {
    /* 核心：Y轴负方向移动即为向上 */
    transform: translateY(-10px);
    
    /* 可选：如果想同时加点其他效果，比如阴影或透明度 */
    /* box-shadow: 0 10px 20px rgba(0,0,0,0.1); */
}  
  


/* ====================== 文字定位 + 动画（最终版：入场慢，悬浮快） ====================== */
.quality_control_imgs  .text_l_01{ position:absolute; left:8%; top:20%; z-index:1; height:60px;width: 208px;}
.quality_control_imgs  .text_l_02{ position:absolute; left:4%; top:50%; z-index:1; height:60px; width: 208px; margin-top:-30px}
.quality_control_imgs  .text_l_03{ position:absolute; left:8%; bottom:20%; z-index:1; height:60px;width: 208px; }
.quality_control_imgs  .text_r_01{ position:absolute; right:8%; top:20%; z-index:1; height:60px;width: 208px; }
.quality_control_imgs  .text_r_02{ position:absolute; right:4%; top:50%; z-index:1; height:60px;width: 208px; margin-top:-30px }
.quality_control_imgs  .text_r_03{ position:absolute; right:8%; bottom:20%; z-index:1; height:60px; width: 208px;}

/* 基础状态：入场动画慢（1.2s），鼠标离开时回弹快（0.4s）*/
.quality_control_imgs .text_l_01,
.quality_control_imgs .text_l_02,
.quality_control_imgs .text_l_03,
.quality_control_imgs .text_r_01,
.quality_control_imgs .text_r_02,
.quality_control_imgs .text_r_03 {
  opacity: 0;
  transition: all 1.2s cubic-bezier(.26,1,.48,1) 0s;
}

/* 初始位置 */
.quality_control_imgs .text_l_01,
.quality_control_imgs .text_l_02,
.quality_control_imgs .text_l_03 {
  transform: translateX(80px);
}
.quality_control_imgs .text_r_01,
.quality_control_imgs .text_r_02,
.quality_control_imgs .text_r_03 {
  transform: translateX(-80px);
}

/* 入场动画：保留延迟，只放慢滑入速度 */
.quality_control_imgs  .text_l_01.is-inview{
  transform: translateX(0px);
  opacity: 1;
  transition-delay: 1.5s;
}
.quality_control_imgs  .text_l_02.is-inview{
  transform: translateX(0px);
  opacity: 1;
  transition-delay: 1.2s;
}
.quality_control_imgs  .text_l_03.is-inview{
  transform: translateX(0px);
  opacity: 1;
  transition-delay: 1s;
}
.quality_control_imgs  .text_r_01.is-inview{
  transform: translateX(0px);
  opacity: 1;
  transition-delay: 1.5s;
}
.quality_control_imgs  .text_r_02.is-inview{
  transform: translateX(0px);
  opacity: 1;
  transition-delay: 1.2s;
}
.quality_control_imgs  .text_r_03.is-inview{
  transform: translateX(0px);
  opacity: 1;
  transition-delay: 1s;
}
/* 修复：鼠标离开瞬间 立即归位，无延迟 */
.quality_control_imgs .text_l_01.is-inview,
.quality_control_imgs .text_l_02.is-inview,
.quality_control_imgs .text_l_03.is-inview,
.quality_control_imgs .text_r_01.is-inview,
.quality_control_imgs .text_r_02.is-inview,
.quality_control_imgs .text_r_03.is-inview {
  transition-delay: 0s !important;
}

/* 悬浮：立即响应，快动画，无延迟 */
.quality_control_imgs .text_l_01.is-inview:hover,
.quality_control_imgs .text_l_02.is-inview:hover,
.quality_control_imgs .text_l_03.is-inview:hover {
  transform: translateX(-10px) !important;
  cursor: pointer;
  transition: all 0.4s ease 0s !important;
}
.quality_control_imgs .text_r_01.is-inview:hover,
.quality_control_imgs .text_r_02.is-inview:hover,
.quality_control_imgs .text_r_03.is-inview:hover {
  transform: translateX(10px) !important;
  cursor: pointer;
  transition: all 0.4s ease 0s !important;
}


			
.section-title {
  font-family: Source Han Sans;
  font-size: 40px;
  font-weight: 500;
  color: #002fa5;
  margin-bottom: 40px;
  position: relative;
  display: inline-block;
}
			/* Hero 区域 */
			.hero {
				position: relative;
				top: 0;
				min-height: 100vh;
				/* background: linear-gradient(135deg, #001440 0%, #002060 50%, #003080 100%); */
				display: flex;
				align-items: center;
				justify-content: center;
				overflow: visible;
			}

			.hero-content {
				position: relative;
				top: 0;
				z-index: 10;
				text-align: center;
				opacity: 0;
				width: 100%;
			 min-height: 100vh;
				display: flex;
				align-items: center;
				justify-content: center;
				animation: fadeInUp 1s ease forwards 0.5s;
			}

			.hero-logo-img {
				width: 554px;
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%);
				z-index: 1;
			}

			.banner-image {
				width: 100%;
				height: auto;
				z-index: -1;
				min-width: 100%;
				min-height: 100%;
				object-fit: cover;
			}

			.banner-img {
				width: 100vw;
				height: auto;
				min-width: 100%;
				min-height: 100%;
				object-fit: cover;
			}

			.banner-img-container {
				display: flex;
				flex-direction: column;
				width: 100%;
			}

			.banner-img-container .banner-img {
				width: 100%;
				display: block;
				margin: 0;
				padding: 0;
			}

			/* 在 service-container 上添加渐变蒙版，蒙版位于图片之上、文字之下 */
			.service-container {
				position: relative;
			}

			.service-container .banner-img {
				position: relative;
				z-index: 0; /* 图片在最下层 */
			}

			.service-container::before {
				content: '';
				position: absolute;
				top: 0;
				left: 0;
				right: 0;
				bottom: 0;
				background: linear-gradient(90deg, rgba(6, 6, 6, 0.6) 19%, rgba(0, 0, 0, 0) 100%);
				z-index: 1; /* 蒙版位于图片之上 */
				pointer-events: none;
			}

			.btn-wrrapper {
				padding: 5px;
				width: 123px;
				border-radius: 100px;
				background: linear-gradient(180deg, #eef4fa 0%, #f4f4fa 100%);
				/* margin: 0 auto; */
			}

			.btn {
				width: 113px;
				height: 33px;
				background: linear-gradient(180deg, #ffffff 0%, #fafbfe 100%);
				color: #002fa5;
				font-size: 14px;
				border-radius: 100px;
				display: flex;
				align-items: center;
				justify-content: center;
				cursor: pointer;
			}

			@keyframes shoot {
				0% {
					transform: translate(0, 0);
					opacity: 0;
				}
				10% {
					opacity: 1;
				}
				90% {
					opacity: 0.5;
				}
				100% {
					transform: translate(-300px, 300px);
					opacity: 0;
				}
			}

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

			/* 内容区域 */
			.section {
				width: 1080px;
				margin: 0 auto;
				position: relative;
			}


			.section-user {
				font-family: Source Han Sans;
				font-size: 24px;
				font-weight: 500;
				line-height: 38.4px;
				letter-spacing: 0em;
				margin-bottom: 4px;
				color: #414141;
			}

			.section-tag {
				font-family: Source Han Sans;
				font-size: 20px;
				font-weight: normal;
				line-height: 38.4px;
				letter-spacing: 0em;
				color: #787878;
			}

			.first-title {
				font-family: Source Han Sans;
				font-size: 20px;
				font-weight: normal;
				line-height: 32px;
				letter-spacing: 0em;
				color: #002fa5;
				padding-top: 120px;
				margin-bottom: 120px;
			}

			/* Nav Logo */
			.nav-logo-img {
				width: clamp(100px, 15vw, 164px); /* 响应式宽度 */
				height: auto;
			}

			/* Nav Arrow */
			.nav-link-flex {
				display: flex;
				align-items: center;
				gap: 4px;
			}

			/* 页脚 */
			footer {
				color: #002fa5;
				/* padding: 50px; */
				position: relative; /* 确保背景图定位正常 */
				overflow: hidden; /* 隐藏溢出的背景图 */
			}

			.footer-content {
				width: 1440px;
				margin: 151px auto 132px;
				position: relative;
				display: flex;
				z-index: 1; /* 确保内容在背景图上方 */
			}

			.footer-logo {
				display: flex;
				flex-direction: column;
				margin-left: 219px;
				margin-right: 226px;
				position: relative;
				top: -7px;
			}

			.footer-section h3 {
				margin-bottom: 12px;
				color: #002fa5;
				font-size: 16px;
				line-height: 25px;
			}

			.footer-section a {
				display: block;
				color: #002fa5;
				text-decoration: none;
				margin-bottom: 12px;
				transition: all 0.3s ease;
				font-family: Source Han Sans;
				font-size: 16px;
				line-height: 25px;
			}

			.footer-section a:last-child {
				margin-bottom: 0;
			}

			.footer-section a:hover {
				color: #002fa5;
				transform: translateX(5px);
			}
			.footer-bold {
				font-weight: bold;
			}

			/* Footer Images */
			.footer-logo-blue {
				width: 272px; /* 响应式宽度 */
			}

			.footer-logo-text {
				width: 232px; /* 响应式宽度 */
				margin-left: 90px; /* 响应式左侧间距 */
				margin-top: 5px; /* 增加顶部间距，避免重叠 */
			}

			/* Footer Background */
			.footer-bg-img {
				width: 100%;
				height: auto; /* 改为自动高度，避免变形 */
				min-height: 578px; /* 最小高度保证覆盖 */
				position: absolute;
				top: 0;
				left: 0;
				z-index: -1;
				object-fit: cover; /* 保持图片比例 */
				background-color: #f3f5f7;
			}

			
			.margin-right-63 {
				margin-right: 63px;
			}

			
			.w-width-100 {
				width: 100% !important;
			}
			.wrrapper {
				background-color: #f3f5f7;
			}

			.intro-des {
				font-family: Source Han Sans;
				font-size: 16px;
				font-weight: normal;
				line-height: 28px;
				text-align: initial; /* 浏览器可能不支持 */
				letter-spacing: 0em;
				color: #858b98;
				margin-bottom: 60px;width: auto;
			}

			.intro-des2 {
				font-family: Source Han Sans;
				font-size: 16px;
				font-weight: normal;
				line-height: 28px;
				text-align: initial; /* 浏览器可能不支持 */
				letter-spacing: 0em;
				color: #858b98;
				margin-bottom: 51px;
			}
			.intro-img-container {
				display: grid;
				grid-template-columns: repeat(6, 1fr);
				gap: 54px;
				align-items: center;
			}

			.intro-img {
				width: 100%;
				margin-bottom: 160px;
			}
			.quality-swiper {
				width: 100%;
				padding: 20px 0;
			}

			.quality-swiper .swiper-wrapper {
				align-items: center;
			}

			.quality-swiper .swiper-slide {
				display: flex;
				justify-content: center;
				align-items: center;
				height: auto;
			}

			.quality-swiper .intro-img {
				width: auto;
				max-width: 100%;
				height: auto;
				margin-bottom: 0;
			}

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

			.industry-img {
				margin-top: 52px;
				width: 524px;
				height: auto;
			}

			.industry-des {
				width: 520px;
				background-color: #ffffff;
			}

			.industry-des2 {
				position: relative;
				z-index: 1;
				width: 520px;
				height: auto;
				padding-left: 162px;
				padding-top: 32px;
				padding-right: 40px;
				background-color: #ffffff;
			}
			.industry-img-container {
				position: relative;
				left: -170px;
			}

			.industry-title {
				font-size: 32px;
				font-weight: 500;
				line-height: 48px;
				letter-spacing: 0em;
				color: #002fa5;
				padding-bottom: 16px;
			}

			.industry-des-content {
				font-size: 16px;
				font-weight: normal;
				line-height: 30px;
				text-align: initial; /* 浏览器可能不支持 */
				letter-spacing: 0em;
				color: #858b98;
				margin-bottom: 9px;
			}

			.industry-des-content-item {
				margin-top: 9px;
				font-size: 16px;
				font-weight: normal;
				line-height: 30px;
				text-align: initial; /* 浏览器可能不支持 */
				letter-spacing: 0em;
				color: #002fa5;
			}

			.service-container {
				position: relative;
			}

			.service-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%);
  color: #fff;
  z-index: 2;
  width: 1080px;
  margin-left: -540px;
}
			.service-title {
				font-family: Source Han Sans;
				font-size: 40px;
				font-weight: 500;
				line-height: 48px;
				color: #ffffff;
				padding-bottom: 32px;
				position: relative;
			}

			.service-title::after {
				content: '';
				position: absolute;
				left: 0;
				bottom: 0;
				width: 64px;
				height: 3px;
				background-color: #ffffff;
			}
			.service-des {
				padding-top: 48px;
				font-family: Source Han Sans;
				font-size: 24px;
				font-weight: normal;
				line-height: 48px;
				text-transform: uppercase;
				color: #ffffff;
				width: 100%;
			}

			.margin-none {
				margin: 0;
			}
			.padding-none {
				padding: 0;
			}
			.padding-top-120 {
				padding-top: 120px;
			}
			.padding-top-149 {
				padding-top: 149px;
			}
			.padding-bottom-70 {
				padding-bottom: 70px;
			}
			.padding-bottom-80 {
				padding-bottom: 80px;
			}
			.padding-bottom-24 {
				padding-bottom: 24px;
			}
			.margin-right-80 {
				margin-right: 80px;
			}
			.padding-bottom-120 {
				padding-bottom: 120px;
			}
			.padding-bottom-130 {
				padding-bottom: 130px;
			}
			.padding-bottom-160 {
				padding-bottom: 160px;
			}
			.margin-bottom-160 {
				margin-bottom: 160px;
			}
			.padding-bottom-187 {
				padding-bottom: 187px;
			}
			.padding-bottom-127 {
				padding-bottom: 127px;
			}
			.padding-bottom-131 {
				padding-bottom: 131px;
			}
			.padding-bottom-91 {
				padding-bottom: 91px;
				border-bottom: #dcdcdc 1px solid;
			}
			.margin-bottom-24 {
				margin-bottom: 24px;
			}

			.padding-top-41 {
				padding-top: 41px;
			}
			.tab-content {
				opacity: 0 !important;
				pointer-events: none;
				height: 0 !important;
				overflow: hidden;
				box-sizing: border-box;
			}

			.tab-content {
				padding: 0 !important;
			}

			.tab-content.active {
				opacity: 1 !important;
				pointer-events: auto;
				height: auto !important;
				overflow: visible;
			}

			/* 产品案例部分新增样式 */
			#section_padding0 .product-cases-section {
				padding-top: 100px;
			}

			.section-header {
				display: flex;
				justify-content: center;
				align-items: center;
				margin-bottom: 60px;
			}

			.product-case-title {
				font-size: 32px;
				font-weight: 500;
				line-height: 48px;
				text-align: center;
				letter-spacing: 0em;
				color: #002fa5;
			}

			.tabs-container {
				display: flex;
				gap: 50px;
			}

			.tab {
				cursor: pointer;
				font-size: 20px;
				font-weight: 500;
				line-height: normal;
				letter-spacing: 0em;
				color: #858b98;
				transition: color 0.3s ease;
			}

			.tab.active {
				color: #002fa5;
			}

			.product-cards-container {
				margin-bottom: 40px;
				margin: 0 auto;
			}

			.product-card-grid {
				display: grid;
				grid-template-columns: repeat(3, 1fr);
				gap: 42px 39px;
				grid-auto-rows: 1fr;
			}

			.product-card {
				background: white;
				transition:
					transform 0.3s ease,
					box-shadow 0.3s ease;
				cursor: pointer;
				display: flex; /* 使卡片成为 flex 容器，便于子元素垂直布局并伸展 */
				flex-direction: column;
			}

			.product-card:hover {
				transform: translateY(-10px);
				box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
			}

			.card-content {
				display: flex;
				flex-direction: column;
				flex: 1; /* 让 card-content 在 .product-card 内撑满可用高度 */
			}

			.card-placeholder {
				width: 100%;
				height: 100%;
				display: flex;
				justify-content: center;
				align-items: center;
				position: relative;
				/* 新增：让内部的点水平排列并留出间隔 */
				gap: 6px; /* 点之间的间隔，可根据需要调整 */
			}

			/* 用伪元素实现第一个点 */
			.card-placeholder::before {
				content: '';
				position: static; /* 改为static，跟随flex布局 */
				transform: none; /* 取消位移，由flex布局居中 */
				width: 8px; /* 点的大小，可调整 */
				height: 8px; /* 点的大小，可调整 */
				border-radius: 50%; /* 圆形 */
				background-color: #002fa5; /* 点的颜色，可调整 */
			}

			/* 新增第二个点 */
			.card-placeholder::after {
				content: '';
				position: static;
				width: 8px;
				height: 8px;
				border-radius: 50%;
				background-color: #002fa5;
			}

			/* 新增第三个点（通过额外的span标签实现，也可以用其他方式） */
			.card-placeholder .dot-third {
				width: 8px;
				height: 8px;
				border-radius: 50%;
				background-color: #002fa5;
			}

			.card-des-content {
				width: 100%;
				height: 100%;
				flex: 1;
				display: flex;
				padding: 10px 24px 30px;
				flex-direction: column;
				justify-content: space-between;
			}

			.des-item {
				line-height: 30px;
  max-height: calc(30px * 6);
  overflow-y: auto;
  height: 180px;
  margin-bottom: 15px;
			}
			
			.des-item::-webkit-scrollbar {
  width: 3px;
}
.des-item::-webkit-scrollbar-track {
  background: transparent; /* 轨道透明，更高级 */
}
.des-item::-webkit-scrollbar-thumb {
  background: #d0d0d0;
  border-radius: 20px;
}
.des-item::-webkit-scrollbar-thumb:hover {
  background: #a0a0a0;
}
.des-item {
	line-height: 30px;
	max-height: calc(30px * 6);
	overflow-y: auto;
	height: 180px;
	margin-bottom: 15px;

	/* ========== 火狐 Firefox 原生滚动条兼容 ========== */
	scrollbar-width: thin; /* 火狐专用：纤细滚动条 */
	scrollbar-color: #cccccc #f1f1f1; /* 滑块颜色 轨道颜色 */
}

/* ========== Chrome、Edge、Safari webkit ========== */
.des-item::-webkit-scrollbar {
	width: 4px;
}
.des-item::-webkit-scrollbar-track {
	background: #f1f1f1;
	border-radius: 10px;
}
.des-item::-webkit-scrollbar-thumb {
	background: #ccc;
	border-radius: 10px;
}
.des-item::-webkit-scrollbar-thumb:hover {
	background: #999;
}


			
			.card-item-container {
				height: 108px;
			}

			.img-container {
				width: 100%;
				height: 256px;
				display: flex;
				justify-content: center;
				align-items: center;
			}

			.card-image {
  width: 180px !important;
  height: 180px !important;
  object-fit: cover;
  border-radius: 0;
}

			.card-title {
				color: #002fa5;
				font-family: Source Han Sans;
				font-size: 18px;
				font-weight: 500;
				line-height: 27px;
				/*text-align: initial;  浏览器可能不支持 */
				letter-spacing: 0em;
				margin: 2px 0 10px;
			}

			.card-sub-title {
				font-size: 12px;
				font-weight: normal;
				line-height: 19.5px;
				/*text-align: initial;  浏览器可能不支持 */
				letter-spacing: 0em;
				color: #002fa5;
			}

			.card-description {
				font-size: 12px;
				font-weight: normal;
				line-height: 24px;
				color: #858b98;
			}

			/* ========== 外层卡片容器 ========== */



.product-card {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}


.card-item {
  padding: 16px 6px 6px;
  background: #f9f9f9;
  color: #002fa5;
  display: flex;
  justify-content: space-between;
  margin-bottom: 4px;
  font-family: Source Han Sans;
  font-size: 12px;
  font-weight: normal;
  line-height: 22px;
  letter-spacing: 0em;
  flex-direction: row;
  gap: 20px;
  /* 锁死宽度，彻底不撑大父容器 */
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;

  /* ========== 重点：只允许水平滚动，垂直完全禁止 ========== */
  overflow-x: auto;   /* 内容太宽 → 左右滚动 */
  overflow-y: hidden;/* 垂直方向 完全隐藏滚动条，绝不上下滚动 */

  white-space: nowrap;

  /* 火狐滚动条 */
  scrollbar-width: thin;
  scrollbar-color: #ccc transparent;
}

/* 内部子元素不被挤压 */
.card-item > div {
  flex: 0 0 auto;
  min-width: max-content;
}

/* 谷歌浏览器 横向纤细滚动条 */
.card-item::-webkit-scrollbar {
  height: 2px;
}
.card-item::-webkit-scrollbar-track {
  background: transparent;
}
.card-item::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 10px;
}
.card-item::-webkit-scrollbar-thumb:hover {
  background: #999;
}



			.card-des-point {
				position: relative;
				padding-left: 10px;
			}
			.card-des-point::before {
				content: '';
				position: absolute;
				top: 7px;
				left: 0px;
				width: 3px;
				height: 3px;
				border-radius: 50%;
				background: #858b98;
			}

			.see-more-btn {
				margin-top: 27px;
				background: transparent;
				border: none;
				width: 124px;
				height: 44px;
				color: #002fa5;
				cursor: pointer;
				transition: color 0.3s ease;
			}

			.see-more-btn:hover {
				color: #001c70;
			}

			.pagination {
				display: flex;
				justify-content: center;
				gap: 16px;
				margin-top: 40px;
				padding-bottom: 80px;
			}

			.page-btn {
				font-family: Source Han Sans;
				display: flex;
				align-items: center;
				justify-content: center;
				width: 36px;
				height: 36px;
				border-radius: 50%;
				background: transparent;
				color: #858b98;
				cursor: pointer;
				transition: all 0.3s ease;
				font-size: 16px;
				font-weight: normal;
			}

			.page-btn.active {
				color: #002fa5;
				font-size: 32px;
				font-weight: 500;
				line-height: normal;
				text-align: initial;
			}

			.page-btn:hover:not(.active) {
				color: #002fa5;
			}

			.prev-group-btn,
			.next-group-btn {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 36px;
				height: 36px;
				color: #858b98;
				cursor: pointer;
				transition: all 0.3s ease;
				font-size: 16px;
				font-weight: normal;
			}

			.prev-group-btn:hover,
			.next-group-btn:hover {
				color: #002fa5;
			}

			.productLine {
				width: 600px;
				height: 1px;
				margin: 80px auto;
				background-color: #002fa5;
			}

			.final-paragraph {
				text-align: center;
				font-family: Source Han Sans;
				font-size: 32px;
				font-weight: normal;
				line-height: 48px;
				text-align: center;
				letter-spacing: 0em;
				color: #002fa5;
				padding: 0 70px 80px;
			}
			/* 添加蒙版遮罩层样式 */
			.dropdown-overlay {
				position: fixed;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				background: rgba(0, 0, 0, 0.3);
				z-index: 999;
				opacity: 0;
				visibility: hidden;
				transition: all 0.3s ease;
			}

			.dropdown-overlay.active {
				opacity: 1;
				visibility: visible;
			}

			/* 手机设备 (360px - 576px) */
			@media screen and (max-width: 576px) {
				nav {
					display: none; /* 隐藏桌面版导航 */
				}

				.first-title {
					font-family: Source Han Sans;
					font-size: 16px;
					font-weight: normal;
					line-height: 1.6em;
					letter-spacing: 0em;
					color: #002fa5;
					padding-top: 20px;
					margin-bottom: 20px;
				}

				/* 显示移动版导航 */
				mobile-nav {
					display: flex;
				}

				/* Hero 区域适配 */
				/* Hero 区域适配 */
				.hero {
					min-height: 50vh;
					margin-top: 60px; /* 为移动端导航留出空间 */
				}

				.hero-content {
					padding-top: 8px;
					align-items: center;
					position: relative;
					min-height: 50vh;
				}

				.banner-image {
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					object-fit: cover;
					object-position: center top;
					z-index: -1;
				}

				.page-title {
					position: absolute;
					left: 10%;
					bottom: 15%;
					text-align: center;
					z-index: 2;
					color: #fff;
					font-size: clamp(20px, 6vw, 36px);
				}

				/* 内容区域流式布局 */
				.section {
					width: 100%;
					padding: 24px 16px;
				}

				/* 质量横幅区域适配 */
				.service-container {
					position: relative;
    height: 240px;
    margin-bottom: 50px;
				}

				.service-content {
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translate(-50%, -50%);
					width: 90%;
					text-align: center;
					padding: 20px;
				}

				.service-title {
					font-size: 24px;
					line-height: 1.3;
					padding-bottom: 16px;
				}

				.service-title::after {
					left: 50%;
					transform: translateX(-50%);
				}

				.service-des {
					font-size: 16px;
					line-height: 1.6;
					padding-top: 16px;
				}

				/* 质量认证轮播适配 */
				.quality-swiper {
					padding: 10px 0;
				}

				.intro-img-container {
					grid-template-columns: repeat(2, 1fr);
					gap: 20px;
				}

				.intro-img {
					margin-bottom: 40px;
					width: 100%;
				}

				/* 产品卡片网格适配 */
				.product-card-grid {
					grid-template-columns: repeat(1, 1fr);
					gap: 20px;
				}

				.img-container {
					height: 180px;
				}

				.card-image {
					width: 120px;
					height: 120px;
				}

				.des-item {
					height: auto;
					min-height: inherit; padding-bottom:40px;
				}

				.card-des-content {
				    display:block;
					padding: 20px;
				}

				/* 分页器适配 */
				.pagination {
					gap: 12px;
					margin-top: 30px;
					padding-bottom: 40px;
				}

				.page-btn {
					width: 32px;
					height: 32px;
					font-size: 14px;
				}

				.page-btn.active {
					font-size: 24px;
				}

				/* 页脚适配 */
				.footer-content {
					width: 100% !important;
					margin: 40px 16px 32px !important;
					flex-direction: column;
					align-items: flex-start;
				}

				.footer-logo {
					margin-left: 0 !important;
					margin-right: 0 !important;
					margin-bottom: 24px;
					flex-direction: column;
					/* align-items: center; */
					gap: 16px;
				}

				.footer-logo-blue {
					width: 120px;
				}

				.footer-logo-text {
					position: relative;
					width: 100px;
					top: -11px;
					left: 40px;
					margin-left: 0px !important;
					margin-top: 0 !important;
				}

				.footer-section {
					margin-bottom: 24px;
					width: 100%;
				}

				.copyright {
					width: calc(100% - 32px);
					padding-right: 0;
					text-align: left;
					margin-bottom: 40px;
					font-size: 14px;
				}
				.card-item {
					padding: 15px 6px 13px;
					background: #f9f9f9;
					color: #002fa5;
					margin-bottom: 4px;
					font-family: Source Han Sans;
					font-size: 12px;
					font-weight: normal;
					line-height: 22px;
					letter-spacing: 0em;
					display: block;
				}
				intro-content {
					padding: 0 20px;
				}
			}

			/* 平板设备 (768px - 1024px) */
			@media screen and (max-width: 768px) {
				.section-title {
					font-family: Source Han Sans;
					font-size: 22px !important;
					font-weight: 500;
					color: #002fa5;
					margin-bottom: 40px;
					position: relative;
					display: inline-block; line-height:1.8;
				}

				/* 移动端导航隐藏 */
				nav:not(.mobile-nav) {
					display: none;
				}

				/* 显示移动版导航 */
				.mobile-nav {
					display: flex;
				}

				/* 调整内容区域宽度 */
				.section {
					padding: clamp(40px, 5vw, 60px) clamp(15px, 3vw, 20px);
				}

				/* 产品卡片网格适配 */
				.product-card-grid {
					/* grid-template-columns: repeat(2, 1fr); */
					gap: 30px;
				}

				/* 质量认证轮播适配 */
				intro-img-container {
					grid-template-columns: repeat(3, 1fr);
					gap: 30px;
				}
				.quality-swiper .swiper-slide {
					display: flex;
					justify-content: center;
					align-items: center;
					height: auto;
					width: 100% !important;
				}

				.quality-swiper .intro-img {
					width: 100% !important;
					max-width: 100% !important;
					height: auto;
					margin-bottom: 0;
				}


				.card-item {
					padding: 15px 6px 13px;
					background: #f9f9f9;
					color: #002fa5;
					display: flex;
					justify-content: space-between;
					margin-bottom: 4px;
					font-family: Source Han Sans;
					font-size: 12px;
					font-weight: normal;
					line-height: 22px;
					letter-spacing: 0em;
				}
			}

			/* 超小屏手机 (< 360px) */
			@media screen and (max-width: 360px) {
				hero {
					min-height: 40vh;
				}

				.page-title {
					font-size: 20px;
					bottom: 20%;
				}

				.service-title {
					font-size: 20px;
				}

				.service-des {
					font-size: 14px;
				}

				.product-card-grid {
					gap: 16px;
				}
				card-item {
					padding: 15px 6px 13px;
					background: #f9f9f9;
					color: #002fa5;
					margin-bottom: 4px;
					font-family: Source Han Sans;
					font-size: 12px;
					font-weight: normal;
					line-height: 22px;
					letter-spacing: 0em;
					display: block;
				}
			}
			
			
			@media screen and (max-width: 768px) {	
			
			 .first-title {
    padding-top: 0;
    margin-bottom: 0;
    font-size: 16px;
    line-height: 1.8;
    margin-top: -25px;padding-bottom: 20px;
  }
  .pC_shows{ display:none}
.mobile_show{ display:block}
  .quality-swiper .intro-img {
    width: 40% !important;}
	.padding-bottom-160 {
  padding-bottom: 0;
}

.intro-des2 {
  font-size: 14px;
  line-height: 1.8;}
  .section-header {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 30px;
  padding-top: 20px;
}
.product-case-title {
  font-size: 22px;
  line-height: 1.8;}
  .card-sub-title,.card-title{ line-height:1.8;}
  .product-card-grid {
  display: block;}
  .product-card{ display:block; margin-bottom:20px;}
  .card-content {
  display: block;}
  .card-item-container {
  height: auto;
}
.blank_contents{ min-height:150px;display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center; }
  #overview-content{padding: 24px 16px !important;}
  

  }