@charset "utf-8";

:root {
	/*--width: 100vw *0.98;*/
	--width: 1528;
	--marginH: 16px;
	--max-width: 1560px;
	--max-width2: 1560;
	--mainpic-height: 877.5px;
	--mainpic-height2: 877.5;
}
body,td,th {
	font-size: 12px;
}
body,html {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	padding:0px;
}
a {
	text-decoration: none;
	box-sizing:unset;
}

.nav{  max-width:var(--max-width); width: var(--width);display:block; margin:0 auto; position:relative;}
.nav2 {
	display: block;
	margin: 0 auto;
	position: relative;
	min-height: 88px;
	width: 100vw *0.98;
	max-width:1440px;
	
}
.clear {
	width:100%; margin:0 auto; height:0px; clear:both; position:relative; display:block; overflow:hidden;
}
	.nav2 .fl {
		font-size: 40px;
		/*font-weight: 400;
		line-height: 1.2em;*/
	}
	.nav2 .fr {
		font-size: 22px;
		/*font-weight: 300;
		line-height: 1.5em;*/
	}
	.mainpic {
		max-width: var(--max-width);
		width: var(--width);
		background-image: url(chrome_LSPNpJbLxu.webp);
		height: calc(var(--width) * (var(--mainpic-height2) / var(--max-width)));
		max-height: var(--mainpic-height);
		background-size: calc(var(--width)) calc(var(--width) * (var(--mainpic-height2) / var(--max-width)));
		color: #333;
		background-color: rgba(0,0,0,0);
		position: relative;
		margin-top: 22px;
		z-index =-1;
	}
.mainpic2{max-width:var(--max-width); width: var(--width); height: calc(var(--width) * (var(--mainpic-height2) / var(--max-width)));max-height:var(--mainpic-height); 
}
video{max-width:var(--max-width); width: var(--width);height: calc(var(--width) * (var(--mainpic-height2) / var(--max-width)));max-height:var(--mainpic-height);}
.margin-top{height:22px;}
.bradius{  border-radius:24px;}
.dh {
	border-bottom-right-radius: 24px;
	position: relative;
	z-index: 9999;
	background-color: #FFF;
	font-family: "Montserrat", Sans-serif;
	font-size: 18px;
	font-weight: 300;
	line-height: 1.5em;
	box-sizing: border-box;
	width:686px; height:106px;
	background-color:#FFF; padding-bottom:24px;
	margin-left:-1px;
	margin-bottom:-1px;
}
.cur {
	font-family: "黑体", Arial;
	align-items: center;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.5em;
	color: #EA7324;
	width: 170px;
	display: block;
	float: left;
	margin-top: 42px;
}
.cur a{
	
	color: #EA7324;
	
}
.nocur {
	white-space: nowrap;
	margin-inline-end: var(--e-nav-menu-horizontal-menu-item-margin);
	font-size: 18px;
	font-weight: 600;
	line-height: 1.5em;
	font-family: "黑体", Arial;
	width: 170px;
	display: block;
	float: left;
	margin-top: 42px;
	color: #102C68;
}
.nocur a{
	
	color: #102C68;
}
	.nocur a:hover {
		color: #EA7324;
	}
/* 覆盖渐变层 */
.mainpic::before {
	max-width:var(--max-width); width: var(--width);
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
   233deg, rgba(234, 115, 36, 0.58) 15.56%, rgba(57, 201, 204, 0.60) 42.17%, #147CB5 75.16%, #001D5C 95.94%
  );
  pointer-events: none; /* 允许点击穿透到视频 */
   border-radius:24px;
}
.fl{ float:left; margin:0px;}
.fr {
	float: right;
}
.leftbor {
	margin-left: -1px;
	z-index: 9999;
	color: red;
	position: relative;
}
.bannertxt {
	position: absolute;
	left: 84px;
	top: 420px;
	width: 835px;
	height: 381px;
	z-index: 9999;
	color: #FFF ;font-size: 18px;
	font-weight: 300;
	line-height: 1.5em;
	box-sizing: border-box;
	
}
	.bannertxt .txt2 {
		color: #FFF;
		font-size: 33px;
		font-weight: 400;
		line-height: 1.5em;
		box-sizing: border-box;
		margin-top:40px;
	}
	.bannertxt .txt {
		color: #FFF;
		font-size: 88px;
		font-weight: 600;
		line-height: 1.5em;
		box-sizing: border-box;
	}

	.button {
	box-sizing: border-box;
	display: inline-block;
	line-height: 1;
	text-align: center;
	font-size: 21px;
	font-weight: 500;
	border-radius: 33px 33px 33px 33px;
	padding: 14px 28px 14px 28px;
	background-color: #EA7324;
	margin-top: 46px;
	border: 1px solid #EA7324;
}
	.button:hover {
		background-color: #FFF;
		transition: all 0.9s ease;
		transform: translateY(-4px);  /*悬停时上移2px*/ 
		box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);  /*添加阴影 */
	}
	.button:hover >a {
		
		color: #EA7324;
		
	}

.button .hover {
	display: none;
	
}

	.button .nohover {
		display: inherit;
		
	}

	.button:hover .hover {
		display: inherit;
		
	}
	.button:hover .nohover {
		display: none;
		
	}
	.button a {
		color: #FFF;
		text-decoration: none;
	}
		

.pic1 {
	background-image: url(p2.jpg);
	background-position: center right;
	background-repeat: no-repeat;
	background-size: cover;
	height: 695px;
	width: 743px;
	border-radius: 30px;
	
	/* 动画与过渡 */
	animation-duration: 1.25s;
	animation-name: none; /* 需补充关键帧名称 */
	transition-property: background, border, box-shadow, transform;
	transition-duration: 0.3s, 0.3s, 0.3s, 0.4s;
	transition-timing-function: ease, ease, ease, ease;
	transition-delay: 0s, 0s, 0s, 0s;
	transition-behavior: normal; /* 非标准属性，建议移除 */
}
.pic1x {
	background-image: url(p2x.jpg);
	background-position: center right;
	background-repeat: no-repeat;
	background-size: cover;
	
	height: 695px;
	width: 711px;
	border-radius: 30px;
	/* 动画与过渡 */
	animation-duration: 1.25s;
	animation-name: none; /* 需补充关键帧名称 */
	transition-property: background, border, box-shadow, transform;
	transition-duration: 0.3s, 0.3s, 0.3s, 0.4s;
	transition-timing-function: ease, ease, ease, ease;
	transition-delay: 0s, 0s, 0s, 0s;
	transition-behavior: normal; /* 非标准属性，建议移除 */
}
.img2{
	background-image: url(RD-scale-flow-chemistry-line_Image_2025-11-12_093656_771.webp)!important;
	height: 586px!important;
	width: 705px!important;
	}
.radius {
	border-radius:30px; /*background-color:rebeccapurple;*/
}
.jbl::before {
	background-image: linear-gradient(235deg, #09A2A5 7%, #EA7324 95%);
	background-color: rgba(0,0,0,0);
	opacity: 0.16; /* 16%透明度 */
	width: 584px;
	height: 410px;
	display: block;
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	margin-top: 48px;
	border-radius: 30px;
	/*width: 100%;
	height: 100%;*/
}
.fnum2 {
	/*position: absolute;*/
	position: absolute;
	left: 28px;
	z-index: 1000;
	top: 26px;
	background-color: #102C68;
	width: 300px;
	height: 210px;
	border-radius: 30px;
	display: block;
}
.fnum2after {
	position: absolute;
	left: 520px;
	z-index: 900;
	top: 250px;
	background-color: #FFFFFF;
	width: 356px;
	height: 266px;
	border-radius: 30px;
	display: block;
	content: " ";
}
.fnum2after2 {
	position: absolute;
	left: -100px;
	z-index: 900;
	bottom: -16px;
	background-color: #FFFFFF;
	width: 328px;
	height: 116px;
	border-radius: 30px;
	display: block;
	content: " ";
}
.fnum2x {
	/*position: absolute;*/
	position: absolute;
	left: -30px;
	z-index: 1000;
	bottom: -24px;
	background-color: #102C68;
	width: 328px;
	height: 116px;
	border-radius: 30px;
	display: block;
}
.bottom {
	height: 400px;
	background-color: transparent;
	background-image: linear-gradient(66deg, #0AB2B5 0%, #0D465B 100%);
	width: 1440px;
}
.beforebottom {
	background-image: url("Asset-1@2x-1.webp.png");
	position: absolute;
	top: 0px;
	left: 0px;
	width: 1440px;
	height: 400px;
	background-size:cover;
}
.beforebottom div {
	text-align: center; font-size:50px; color:#FFF;
}
	/*.beforebottom .button {
		background-color: #FFF !important;
		border: 0px !important;
		color: #EA7324 !important;
		cursor: pointer;*/
		/*background-color:red;*/
	/*}

	.beforebottom a {
		
		border: 0px !important;
		color: #EA7324 !important;
		font-size: 24px;
	}

	.beforebottom .button :hover {
		background-color: #EA7324 !important;
		border: 0px !important;
		color: #FFF !important;
	}

	.beforebottom a :hover {
		color: #EA7324 !important;
		font-size: 24px;
	}*/

.button2 {
	box-sizing: border-box;
	display: inline-block;
	line-height: 1;
	text-align: center;
	font-size: 21px !important;
	font-weight: 500;
	border-radius: 33px 33px 33px 33px;
	padding: 14px 28px 14px 28px;
	background-color: #FFF;
	margin-top: 46px;
	border: 0px;
	color: #EA7324;
}

	.button2:hover {
		background-color: #EA7324;
		transition: all 0.9s ease;
		transform: translateY(-4px); /*悬停时上移2px*/
		box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /*添加阴影*/
		color: #FFF;
	}
	.button2:hover >a {
		color: #FFF;
	}
	.button2 a:hover {
		color: #FFF;
	}

	.button2 .hover {
		display: none;
	}

	.button2 .nohover {
		display: inherit;
	}

	.button2:hover .hover {
		display: inherit;
	}

	.button2:hover .nohover {
		display: none;
	}

	.button2 >a {
		color: #EA7324;
		text-decoration: none;
	}
.leftbottomradus {
	clip-path: none; /* 取消 clip-path */
	mask: linear-gradient(to right, white, white), linear-gradient(to top, white, white), radial-gradient(30px 30px at 250px 130px, transparent 99%, white 100%);
	mask-composite: exclude;
	-webkit-mask: linear-gradient(to right, white, white), linear-gradient(to top, white, white), radial-gradient(30px 30px at 250px 130px, transparent 99%, white 100%);
	-webkit-mask-composite: xor;
}
.anchor-links-dropdown {
	width: 300px;
	height: 42.5px;
	border-radius: 10px;
	background-color: rgb(238, 241, 246);
	background-image: url("data:image/svg+xml,%3Csvg width='64px' height='64px' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Cpath d='M12 5V19M12 19L6 13M12 19L18 13' stroke='%2312224a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 8px center;
	background-size: 20px 20px;
	cursor: pointer; padding-left:14px; appearance:none;
}
.jt {
	width: 252px;
	height: 77px;
	font-size: 18px;
	font-weight: 600;
	background-repeat: no-repeat;
	float: left;
	color: #102C68; text-align:center;
	line-height:82px;
	font-weight:300;
}
#container {
            width: 652px;          /* 固定场景宽度 */
            height: 75px;          /* 场景高度 */
            overflow: hidden;      /* 隐藏超出部分 */
            position: relative;
            border: 1px solid #ccc;
            font-weight:300;
			background-color:#69EAED66;
			border-radius:9px;
			margin-left:500px;
        }
        #text {
            position: absolute;
            white-space: nowrap;  /* 禁止换行 */
            font-size: 24px;
            font-weight: bold;
            line-height: 75px;    /* 垂直居中 */
			
        }
.step{
	height:81px;background-image: linear-gradient(90deg, #69EAED00 0%, #69EAED99 100%); border:2px solid #00B2B5; margin-top:20px;
}
.step .title{
	width:311px; height:55px; line-height:55px; background-color:#102C68; font-size:18px; color:#FFF; margin-top:16px; margin-left:6px; float:left;border-radius:30px; text-align:center;
	}
	.step .content{
		width:432px;font-size:16px; margin-left:44px; line-height:22px; color:#333; height:92px;display: flex;align-items: center;float:left;border-radius:30px; }
		.step img{width:497px; height:14px; float:right; margin-right:28px; margin-top:38px;}
.nav2 h2{ font-size:40px; font-weight:400; color:#102C68}
.nav2 h4{font-size:24px; color:#102C68; font-weight:600 }
.ulist{
	
}

/*ul li处理*/
ul{ list-style:none; list-style-type:none; margin:0px; padding:0px;}
li{ list-style:none; list-style-type:none;}
#ulist li{
	display:block; margin:0px; padding:0px;
	border-bottom:1px dashed #ccc; height:75px;
	margin-bottom:15px; clear:both; width:600px;
	}
#ulist .dian{ display:block; float:left; width:8px; height:62px; background-color:rgb(105, 234, 237); border-radius:3px; margin-right:18px;}
#ulist span{  display:block;}
.ttitle { font-size:40px; font-weight:400; color:#102C68;
}
.ccontent{ font-size:18px; font-weight:300; color:#666666; line-height:42px;}
	.ccontent li { list-style:disc; margin-left:29px; 
	}
	.ccontent .title {
		font-weight:bold;
	}
.imgtopleftbefore {
	background: linear-gradient(235deg, rgba(234, 115, 36, 0.50) 10.24%, rgba(255, 255, 255, 0.67) 23.88%, rgba(234, 115, 36, 0.50) 49.24%, #39C9CC 80.86%);
	opacity: 0.5;
	width: 753px;
	height: 746px;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 999;
	display: block;
	border-radius: 30px;
}
.imgtopleft {
	width: 753px;
	height: 746px;
	background-color: rebeccapurple;
	/*background-image: url("QC-2-scaled.jpg");*/
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: cover;
	border-radius: 30px;
	z-index: 998;
	position:relative;
}
.imgtopleftkuang {
	width: 376px;
	height: 156px;
	position: absolute;
	top: -50px;
	left: -50px;
	border-radius: 30px;
	background-color:#FFF;
	z-index:9999;
}
.imgbottomleftkuang {
	width: 376px;
	height: 156px;
	position: absolute;
	bottom: -50px;
	left: -50px;
	border-radius: 30px;
	background-color: #FFF;
	z-index: 9999;
}
.imglefttopbor {
	width: 40px;
	height: 40px;
	opacity: 1;
	position: absolute;
	z-index: 9999;
	top: 0px;
	left: 320px;
}
.imglefttopbor2 {
	width: 40px;
	height: 40px;
	opacity: 1;
	position: absolute;
	z-index: 9999;
	top: 105px;
	left: -2px;
}

.imgleftbottombor {
	width: 40px;
	height: 40px;
	opacity: 1;
	position: absolute;
	z-index: 9999;
	bottom: -2px;
	left: 320px;
}

.imgleftbottombor2 {
	width: 40px;
	height: 40px;
	opacity: 1;
	position: absolute;
	z-index: 9999;
	bottom: 105px;
	left: -2px;
}

	

	
	



