@charset "utf-8";
@font-face {
	font-family:Lato;
	src: url(../font/Lato.woff2);
}
@font-face {
	font-family:LatoBold;
	src: url(../font/LatoBold.woff2);
}
body{ width: 100%; overflow-x: hidden; width: 100%; overflow-x: hidden; margin:0px; padding:0px; font-size:12px;font-family:Lato,LatoBold,Helvetica,Arial,sans-serif;color:#898989;line-height:1; background:#FFF; }
ul,li,dl,dd,dt,p,h1,h2,h3,h4,h5,h6,ol,form,input{ margin:0px; padding:0px;list-style:none;}
input,textarea { font-family: "PINGFANG_MEDIUM"; border: none; outline: none; background: none; }
ul,li{ list-style:none}
img{border:0px; padding:0px; 
/* display: block; */
}
a{ color:#5c5c5c; text-decoration:none}
.top{ z-index: 99; position: absolute; width: 100%; padding: 0 2%; box-sizing: border-box; height: 1.15rem;}
.top .logo{ float: left; height: 1.25rem; line-height: 1.25rem;}
.top .logo img{ height: 1.15rem; display: inline-block; vertical-align: middle;}
.top .language{ transition: 0.5s; position: relative; width: .86rem; float: right; line-height: 1.15rem; height: 1.22rem; background: url(../images/MainTb_09.png) center center no-repeat; background-size:.26rem auto ;}
.top .language img{ display: inline-block;vertical-align: middle;}
.top .language dl{ display: none; width: .91rem; position: absolute; top: .85rem; background: rgba(0,0,0,0.7); padding: 0 .08rem; box-sizing: border-box; left: 50%; transform: translateX(-50%);}
.top .language dl dd{ height: .4rem; position: relative; line-height: .4rem;}
.top .language dl dd a{ display: block; height: .4rem; line-height: .45rem; font-size: .2rem; color: #fff;  padding-right: .2rem; box-sizing: border-box;}
.top .language dl dd:after{ display: block; width: 0;  height: .02rem; background: linear-gradient(#28bbff,#2eb1f2); content: ''; position: absolute; bottom: 0; left: 0; transition: 0.5s;}
.top .language dl dd:hover:after{ display: block; width: 100%; left: 0;}
.top .language dl dd:hover a{ color: #28bbff; background: url(../images/MainTb_06.png) right center no-repeat;}
.top .language:hover dl{ display: block;}
.top .language:hover{ background: url(../images/setbg.png) center center no-repeat; background-size:.26rem auto ;}
.top .quote{ float: right; line-height: 1.15rem;}
.top .quote a{ transition: 0.5s; display: inline-block; vertical-align: middle; width: 1.9rem; height: .48rem; text-align: center; line-height: .46rem; background: #3399ff; color: #fff; font-size: .25rem;}
.top .quote a:hover{ background: #007aff;} 
.top .nav{ float: right; margin-right: .2rem;}
.top .nav ul{ float: right;}
.top .nav ul li{position: relative; float: left; margin-left: .4rem; line-height: 1.15rem; z-index: 1;}
.top .nav ul .getquote{ display: none; }
.top .nav ul li .bt{ position: relative; line-height: .38rem; font-size: .25rem; color: #fff; height: .38rem; display: inline-block; vertical-align: middle; position: relative;}
.top .nav ul li .bt:after{ transition: 0.5s; width: 0; position: absolute; bottom: 0; right: 0; height: .02rem; background: #00f6ff; transform: translateY(.02rem); content: '';}
.top .nav ul li:hover .bt:after{left: 0; width: 100%;}
.top .nav ul li:hover .bt{ color: #00f6ff;}
.top .nav ul li.on .bt:after{left: 0; width: 100%;}
.top .nav ul li.on .bt{ color: #00f6ff;}
.top .nav ul li dl{ display: none; width: 3rem; background: rgba(0,0,0,0.7); padding: 0 .12rem; box-sizing: border-box; position: absolute; top: .85rem; left: 0;}
/*.top .nav ul li dl.product{ display: none;  background: rgba(0,0,0,0.7); box-sizing: border-box; position: absolute; top: .85rem; left:50%; transform: translateX(-50%); height: auto;width: auto; writing-mode:tb-rl; filter:FlipV(); transition: 0.5s; }  */ /*202408默认三列有分类的情况下居中布局 */

.top .nav ul li dl.product{ display: none;  width: 4rem; background: rgba(0,0,0,0.7);  padding: 0 .12rem; box-sizing: border-box; position: absolute; top: .85rem; left:0;  height: auto; transition: 0.5s; /* 202408 */}
.top .nav ul li:hover { z-index: 2;}
.top .nav ul li:hover .product_category{ display: block;}
.top .nav ul li .product_category{ display: none; width: 9rem;   background: rgba(0,0,0,0.7); box-sizing: border-box; position: absolute; top: .85rem; left:50%; transform: translateX(-50%); height: 4.2rem;}
.top .nav ul li .product_category .Nr{ transition: 0.5s; height: 100%; width: 33%; float: left;padding: 0 .15rem; box-sizing: border-box;}
.top .nav ul li .product_category .Nr:last-child{ margin-right: 0;}
.top .nav ul li .product_category .Nr h2{ text-align: center; font-size: .18rem; height: .6rem; line-height: .6rem; font-weight: bold; color: #fff;}
.top .nav ul li .product_category .Nr dl{ position: relative; left: auto; top: auto; width: 100%; background:none}
.top .nav ul li .product_category .Nr:nth-child(2){ width: 34%;}
.top .nav ul li .product_category .Nr:hover{ background: #000;}
/* .top .nav ul li dl.product_01{ display: none; width: 3rem; background: rgba(0,0,0,0.7); padding: 0 .12rem; box-sizing: border-box; position: absolute; top: .85rem; left: -3rem;}
.top .nav ul li dl.product_02{ display: none; width: 3rem; background: rgba(0,0,0,0.7); padding: 0 .12rem; box-sizing: border-box; position: absolute; top: .85rem; left: 0rem;}
.top .nav ul li dl.product_03{ display: none; width: 3rem; background: rgba(0,0,0,0.7); padding: 0 .12rem; box-sizing: border-box; position: absolute; top: .85rem; left: 3rem;} */
.top .nav ul li:hover dl{ display: block;}
.top .nav ul li dl dd{ height: .42rem; line-height: .4rem; position: relative;}
.top .nav ul li dl.product dd{ height: .42rem; line-height: .4rem; position: relative;  /*  width: 33%; */padding: 0 0; box-sizing: border-box;writing-mode:lr-tb; /* 202408 */}
.top .nav ul li dl dd a{ display: block; width: 100%; height: 100%; height: .4rem; line-height: .4rem; font-size: .2rem; padding-right: .2rem; box-sizing: border-box; color: #fff;}
.top .nav ul li dl dd:after{ display: block; width: 0;  height: .02rem; background: linear-gradient(#28bbff,#2eb1f2); content: ''; position: absolute; bottom: 0; left: 0; transition: 0.5s;}
.top .nav ul li dl dd:hover:after{ display: block; width: 100%; left: 0;}
.top .nav ul li dl dd:hover a{ color: #28bbff; background: url(../images/MainTb_06.png) right center no-repeat;}
.top .nav ul li dl dd.on:after{ display: block; width: 100%; left: 0;}
.top .nav ul li dl dd.on a{ color: #28bbff; background: url(../images/MainTb_06.png) right center no-repeat;}


.bannerPage{ overflow: hidden; width: 100%; background: #4691ac; height: auto; position: relative;}
.bannerPage img{ transition: 4s; display: block; width: 100%; height: auto; transform: scale(1);}
.bannerPage .Nr{ font-family:Lato,LatoBold,Helvetica,Arial,sans-serif; font-size: 64px; font-weight: bold; font-weight: 600; color: #fff; text-align: center; position: absolute; width: 100%; top: 50%; transform: translateY(-50%);}
.bannerPage.on img{ transform: scale(1.1);}
.w1440{ width: 1440px; margin: 0 auto;}
.ProList{ background: url(../images/proBg_02.jpg) center top no-repeat;  width: 100%; padding-bottom: 130px; background-size:100% 100%;}
.title{ padding-top: 100px; padding-bottom: 70px;}
.title h2{ text-align: center; font-size: 51px; font-weight: bold; color: #040405; text-align: center;}
.title span{ display: block; margin: 20px auto 0 auto; width: 60px; height: 3px; background: #3399ff;}
.title p{ padding-top: 30px; font-size: 18px; color: #000; line-height: 28px;}
.ProList .layer1 ul{ width: 100%;}
.ProList .layer1 ul li{ width: 100%; margin-bottom: 70px; overflow: hidden; height: auto; background: #fff; box-shadow: 0 0 10px rgba(0,0,0,0.1);}
.ProList .layer1 ul li .icon{ float: left; height:auto; width: 800px; float: left; display: flex; align-items: center; /* 垂直居中 */ justify-content: center; /* 水平居中 */}
.ProList .layer1 ul li .icon img{ width: 100%;}
.ProList .layer1 ul li .text{ width: calc(100% - 900px); float: left; padding: 60px 50px 0 60px; box-sizing: border-box;}
.ProList .layer1 ul li .text h2{ font-size: 32px; font-weight: bold; color: #070707; line-height: 50px;}
.ProList .layer1 ul li .text span{ display: block; margin: 15px 0 0 0; width: 60px; height: 3px; background: #3399ff;}
.ProList .layer1 ul li .text p{ font-size: 16px;  line-height: 26px; color: #060606; margin-top: 15px;}
.ProList .layer1 ul li:nth-child(2n) .icon{ float: right;}
.ProList .layer1 ul li:nth-child(2n) .text{ float: left; padding: 60px 50px 0 100px;}
.ProList .layer1 ul li:last-child{ margin-bottom: 0;}
.ProList .layer2{position: relative;}
.ProList .layer2 .swiper-container{ overflow: hidden; padding: 10px; box-sizing: border-box;}
.ProList .layer2 .Nr{ width: 100%; transition: 0.5s;}
.ProList .layer2 .Nr:hover{ transform: translateY(-10px); box-shadow: 0 10px 10px rgba(0,0,0,0.2);}
.ProList .layer2 .Nr:hover .text{ color:#00f6ff}
.ProList .layer2 .icon{ width: 100%; height:auto; overflow: hidden;}
.ProList .layer2 .Nr:hover .icon img{ transform: scale(1.1);}
.ProList .layer2 .icon img{ transition: 0.5s; display: block; width: 100%; height: 100%; object-fit: cover;}
.ProList .layer2 .text{ background:linear-gradient(to right, #3399ff, #2eb1f2); width: 100%; height: 165px; padding: 25px 15px; box-sizing: border-box; font-size: 20px; color: #fff; line-height: 28px;}
.ProList .layer2 .swiper-button-next{ margin: 0; width: 18px; height: 28px; background: url(../images/next.png); background-size:100% 100% ; top: 50%; transform: translateY(-50%); right: -45px;}
.ProList .layer2 .swiper-button-prev{ margin: 0; width: 18px; height: 28px; background: url(../images/prev.png); background-size:100% 100% ; top: 50%; transform: translateY(-50%); left: -45px;}
.ProList .layer2 .swiper-button-next:after{ display: none;}
.ProList .layer2 .swiper-button-prev:after{ display: none;}
.SendMain{ width: 1080px; margin: 0 auto;}
.SendMain ul{ width: 100%;}
.SendMain ul li{ width: 100%; margin-bottom: 20px; overflow: hidden;}
.SendMain ul li input{ width: 32%; float: left; margin:0 2% 0 0; border-radius:7px; border: 1px solid #28bbff; box-sizing: border-box; height: 54px; box-sizing: border-box; background: #fff; padding: 0 15px; box-sizing: border-box; font-size: 14px;}
.SendMain ul li input:last-child{ margin-right: 0;}
.SendMain ul li input.big{ width: 100%;}
.SendMain ul li input.small{ width: 200px;}
.SendMain ul li textarea{ width: 100%; height: 185px; border-radius:7px; border: 1px solid #28bbff; box-sizing: border-box; padding: 15px; background: #fff;font-size: 14px;/* 202408 */}
.SendMain ul li .code{ float: left; height: 52px; line-height: 72px; font-size: 14px; color: #333; transform: translateY(1px);}
.SendMain ul li .code a{ display: block; float: right; text-align: end;}
.SendMain ul li .code img{ display: inline-block; margin-right: 10px; height: 100%; width: auto;}
.SendMain ul li button{ display: block; width: 100%; height: 54px; background: #28bbff; border-radius:7px; font-size: 16px; text-align: center; line-height: 54px; color: #fff; cursor: pointer; border: none; transition: 0.5s;}
.SendMain ul li button:hover{ box-shadow: 0 0 10px rgba(0,0,0,0.1); font-size: 22px; background: #005982;}
.SendMain ul li button img{ display: inline-block; vertical-align: middle; margin-left: 10px; transform: translateY(-2px);}
.footer{ width: 100%; background: #4599be;  background: url(/uploads/image/20240923/1727079956.jpg); background-size:100% 100% ;}
.footer .footerBox{ padding: 130px 0 0 0;} /*20240928*/
.footer .footerBox .footerLeft{ float: left; margin-right: 65px;}
.footer .footerBox .footerLeft h2{ font-size: 26px; font-weight: bold; color: #fff;}
.footer .footerBox .footerLeft span{ width: 82px; height: 3px; background: #00f6ff; margin: 30px 0; display: block;}
.footer .footerBox .footerLeft p{ width: 380px; color: #fff; font-size: 16px; line-height: 20px; margin-bottom: 20px;}
.footer .footerBox .footerLeft ul{ width: 100%;}
.footer .footerBox .footerLeft ul li{ transition: 0.5s; line-height: 32px; font-size: 16px; color: #fff; position: relative;}
.footer .footerBox .footerLeft ul li img{ display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.footer .footerBox .footerLeft ul li a{ transition: 0.5s; font-size: 16px; color: #fff;}
.footer .footerBox .footerLeft dl{ position: relative; padding-top: 20px;}
.footer .footerBox .footerLeft dl .code{ display: none; position: absolute; padding:2px; background: #fff; border-radius:7px; left:50%; transform:translateX(-50%); top:60px;} /*20240928*/
.footer .footerBox .footerLeft dl .code img{ width: 120px; height: 120px; background: #ccc;}
.footer .footerBox .footerLeft dl dd{ float: left; margin: 0 25px 0 0; width: 50px; height: 50px; position: relative; }/*20240928*/
.footer .footerBox .footerLeft dl dd .iconWarp{ width:100%; height:50px; overflow:hidden;} /*20240928*/
.footer .footerBox .footerLeft dl dd .icon{ width: 100%; height: 200%; position: relative; transition: 0.5s;}
.footer .footerBox .footerLeft dl dd .icon b{ display: block; width: 100%; height: 50%; position: relative;}
.footer .footerBox .footerLeft dl dd .icon b img{ display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.footer .footerBox .footerLeft dl dd:hover .icon{ transform: translateY(-50px);}
.footer .footerBox .footerLeft dl dd:hover .code{ display:block} /*20240928*/
.footer .footerBox .footerLeft:first-child ul li{ padding-left: 24px; }
.footer .footerBox .footerLeft:last-child{ float: left; margin-left: 130px;}
.footer .copyRight{ margin-top: 125px; border-top:1px solid #fff; height: 52px; line-height: 52px; font-size: 14px; color: #fff; text-align: center;}
.footer .copyRight a{  color: #fff; /* 202408 */}
.footer .footerBox .footerLeft ul li:hover{ color: #00f6ff;}
.footer .footerBox .footerLeft ul li:hover a{ color: #00f6ff;}
.top .SideClick{ display: none;}
.backTop{ display: block;background: url(../images/backTop_07.jpg); width: 45px; height: 45px; position: fixed; right: 0; bottom: 200px; cursor: pointer; z-index: 99; transition: 0.8s;}
.backTop:hover{ opacity: 0.6;}
.bannerIndex{ width: 100%; max-height: 100vh; height: auto; position: relative; overflow: hidden;}
.bannerIndex .swiper-container{ width:100%; max-height:100vh;}
.bannerIndex .swiper-container .swiper-slide{ max-height:100vh;}
.bannerIndex img{ width: 100%; height: auto;}
.bannerIndex .textBox{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.bannerIndex .textBox h2{ font-size: 64px; color: #fff; margin-bottom: 30px; line-height: 88px;}
.bannerIndex .textBox p{ font-size: 36px; line-height: 54px; color: #fff;}
.bannerIndex .swiper-pagination{ bottom: 55px!important; width: 100%; height: 4px; line-height: 4px;}
.bannerIndex .swiper-pagination span{ overflow: hidden; position: relative; opacity: 1; width: 120px; height: 4px; margin: 0 15px!important; border-radius:2px; background: #fff;}
.bannerIndex .swiper-pagination span:after{position: absolute; left: 0; top: 0;  content: ''; width: 0; height: 100%; display: block; background: #3399ff; }
.bannerIndex .swiper-pagination span.swiper-pagination-bullet-active:after{ width: 100%;transition:4s linear;}
/*.indexContainer{ padding-bottom: 40px; width: 100%; background: url(../images/proBg_02.jpg) top center no-repeat; background-size:100% 100%;}*/
.indexContainer .warpTop{background: url(../images/proBg_02.jpg) top center no-repeat; background-size:100% 100%; padding-bottom:180px;}
.indexContainer .warpBottom{background: url(../images/proBg_02.jpg) top center no-repeat; background-size:100% 100%;padding-bottom: 40px; }
.indexContainer{  width: 100%;}
.indexContainer .layer1 ul{ overflow: hidden;}
.indexContainer .layer1 ul li{ position: relative; height:410px; float: left; overflow: hidden; width: 48%; float: left; margin: 0 4% 0 0;}
.indexContainer .layer1 ul li:nth-child(2n){ margin-right: 0;}
.indexContainer .layer1 ul li img{ display: block; object-fit:cover; transition: 0.5s;}
.indexContainer .layer1 ul li:hover img{ transform: scale(1.1);}
.indexContainer .layer1 ul li .bt{position: absolute; left: 40px; top: 40px; font-size: 32px; color: #fff; font-weight: normal;}
.indexContainer .layer1 ul li:hover .bt{ color: #00f6ff;}
.indexContainer .layer2{ padding-top: 190px;}
.indexContainer .layer2Left{ float: left; width: 30%; float: left; padding-right:20px; box-sizing:border-box;}
.indexContainer .layer2Left .title h2{ text-align: left;}
.indexContainer .layer2Left .title span{ margin: 20px 0 0 0;}
.indexContainer .layer2Left a{ position: relative; overflow: hidden; display: block; width: 220px; height: 56px; text-align: center; line-height: 56px; background: #3399ff; font-size: 20px; color: #fff; transition: 0.5s;}
.indexContainer .layer2Left a span{ display: block; width: 100%; height: 100%; position: relative; z-index: 2; font-size: 20px; color: #fff; line-height: 56px; text-align: center;}
.indexContainer .layer2Left a:after{ width: 0; height: 100%; transition:1s; position: absolute; right: -30px; top: 0; content: ''; background: #007aff; transform: skew(30deg);}
.indexContainer .layer2Left a:hover:after{ width: 180%; left: -30px; }
.indexContainer .layer2Right{ width: 70%; float: right; position: relative;}
.indexContainer .layer2Right .swiper-container{ width: 100%; overflow: hidden;}
.indexContainer .layer2Right .Nr{ width: 100%;}
.indexContainer .layer2Right .Nr .icon{ height: 255px; width: 100%; overflow: hidden;}
.indexContainer .layer2Right .Nr .icon img{ transition: 0.5s; display: block; width: 100%; height: 100%; overflow: hidden;object-fit: cover;}
.indexContainer .layer2Right .Nr:hover .icon img{ transform: scale(1.1);}
.indexContainer .layer2Right .Nr .text{ width: 100%; height: 124px; background: linear-gradient(to right,#3399ff,#2eb1f2); padding: 30px 20px 0 20px; box-sizing: border-box;}
.indexContainer .layer2Right .Nr .text p{ font-size: 22px; line-height: 26px; color: #fff; height: 52px; overflow: hidden;}
.indexContainer .layer2Right .Nr:hover .text p{ color: #00f6ff;}
.indexContainer .layer2Right .swiper-button-next{ width: 16px; height: 26px; background: url(../images/arrow_05.png); background-size:100% 100%; right: -37px; top: 50%; transform: translateY(-50%);}
.indexContainer .layer2Right .swiper-button-prev{ width: 16px; height: 26px; background: url(../images/arrow_03.png); background-size:100% 100%; left: -37px; top: 50%; transform: translateY(-50%);}
.indexContainer .layer2Right .swiper-button-next:after{ display: none;}
.indexContainer .layer2Right .swiper-button-prev:after{ display: none;}
.indexContainer .layer2Right .swiper-pagination{ bottom: -24px!important;}
.indexContainer .layer2Right .swiper-pagination span{ background: #404c4e; opacity: 1;}
.indexContainer .layer2Right .swiper-pagination span.swiper-pagination-bullet-active{ background: #3399ff;}
/*.indexContainer .layer3{ margin-top: 180px;  background: url(../images/index_11.jpg) center center no-repeat; height: 830px; background-attachment:fixed; background-size:auto 100%; position: relative;}*/
.indexContainer .layer3{ height: 830px; background-attachment:fixed;  position: relative;}
.indexContainer .layer3:after{ position:fixed; z-index:-1;background: url(/uploads/image/20240923/1727080032.jpg) center center no-repeat;background-size:100% auto; content:''; width:100%; height:100%; left:0; top:0; }

.indexContainer .layer3Box{ width: 100%; position: absolute; top: 50%; transform: translateY(-50%);}
.indexContainer .layer3Box p{ text-align: center; font-weight: bold; font-size: 48px; color: #fff; line-height: 66px;}
.indexContainer .layer3Box a{ overflow: hidden; position: relative; display: block; width: 220px; height: 56px; text-align: center; line-height: 56px; background: #3399ff; font-size: 20px; color: #fff; margin: 45px auto 0 auto;}
.indexContainer .layer3Box a span{ display: block; width: 100%; height: 100%; position: relative; z-index: 2; font-size: 20px; color: #fff; line-height: 56px; text-align: center;}
.indexContainer .layer3Box a:after{ width: 0; height: 100%; transition:1s; position: absolute; right: -30px; top: 0; content: ''; background: #007aff; transform: skew(30deg);}
.indexContainer .layer3Box a:hover:after{ width: 180%; left: -30px; }
.indexContainer .layer4 .swiper-container{ padding: 10px; box-sizing: border-box; overflow: hidden;}
.indexContainer .layer4 .swiper-container .swiper-slide{ border: 12px solid #3399ff; box-sizing: border-box;}

.indexContainer .layer4Box{ position: relative;}
.indexContainer .layer4Box .swiper-button-next{ width: 16px; height: 26px; background: url(../images/arrow_05.png); background-size:100% 100%; right: -40px; top: 50%; transform: translateY(-50%);}
.indexContainer .layer4Box .swiper-button-prev{ width: 16px; height: 26px; background: url(../images/arrow_03.png); background-size:100% 100%; left: -40px; top: 50%; transform: translateY(-50%);}
.indexContainer .layer4Box .swiper-button-next:after{ display: none;}
.indexContainer .layer4Box .swiper-button-prev:after{ display: none;}
.indexContainer .layer4Box img{ transition: 0.5s; display: block; width: 100%; height: auto;}
.indexContainer .layer4Box img:hover{ transform: scale(1.05); box-shadow: 0 10px 10px rgba(0,0,0,0.2);}
.indexContainer .layer5 .swiper-container{ width: 100%; overflow: hidden; padding: 10px; box-sizing: border-box;}
.indexContainer .layer5Box{ position: relative;}
.indexContainer .layer5 .Nr{ width: 100%;transition: 0.5s;}
.indexContainer .layer5 .Nr .icon{ max-height:255px; width: 100%; overflow: hidden;}
.indexContainer .layer5 .Nr .icon img{ object-fit: cover; display: block; width: 100%; height: 13vw; overflow: hidden; transition: 0.5s;}
.indexContainer .layer5 .Nr:hover .icon img{ transform: scale(1.1);}
.indexContainer .layer5 .Nr .text{ width: 100%; height: 165px; background: linear-gradient(to right,#3399ff,#2eb1f2); padding: 25px 30px 0 30px; box-sizing: border-box;}
.indexContainer .layer5 .Nr .text p{ margin-bottom: 35px; font-size: 22px; line-height: 26px; color: #fff; height: 52px; overflow: hidden;}
.indexContainer .layer5 .Nr .text span{ display: block; font-size: 22px; color: #fff;}
.indexContainer .layer5 .Nr:hover .text p{ color: #00f6ff;}
.indexContainer .layer5 .Nr:hover .text span{ color: #00f6ff;}
.indexContainer .layer5 .swiper-button-next{ margin: 0; width: 16px; height: 26px; background: url(../images/arrow_05.png); background-size:100% 100%; right: -40px; top: 50%; transform: translateY(-50%);}
.indexContainer .layer5 .swiper-button-prev{ margin: 0; width: 16px; height: 26px; background: url(../images/arrow_03.png); background-size:100% 100%; left: -40px; top: 50%; transform: translateY(-50%);}
.indexContainer .layer5 .swiper-button-next:after{ display: none;}
.indexContainer .layer5 .swiper-button-prev:after{ display: none;}
.indexContainer .layer5 .Nr:hover{ transform: translateY(-10px); box-shadow: 0 10px 10px rgba(0,0,0,0.2);}
.why_MYD{ padding-top: 190px; padding-bottom: 80px; width: 100%; background: url(../images/proBg_02.jpg) center top no-repeat; background-size: 100% 100%;}
.why_MYD ul{ width: 1140px; margin: 0 auto;}
.why_MYD ul li{ margin-bottom: 170px; position: relative; width: 100%;}
.why_MYD ul li .text{ float: right; width: 630px; padding: 60px 20px 60px 155px; border: 4px solid #3399ff; box-sizing: border-box;}
.why_MYD ul li .icon{ z-index: 10; position: absolute; left: 0; top: -100px; overflow: hidden; width: 640px;}
.why_MYD ul li .icon img{ transition: 0.5s; display: block; width: 100%; height: auto;}
.why_MYD ul li .text h2{ font-size: 32px; color: #333; line-height: 40px;}
.why_MYD ul li .text p{ font-size: 20px; line-height: 32px; color: #333;}
.why_MYD ul li .text span{ display: block; width: 60px; height: 2px; margin: 20px 0; background: #3399ff;}
.why_MYD ul li:nth-child(2n) .icon{ left: auto; right: 0;}
.why_MYD ul li:nth-child(2n) .text{ float: left; padding: 60px 155px 60px 20px;}
.why_MYD ul li:hover .icon img{ transform: scale(1.1);}
.why_MYD ul li:last-child{ margin: 0;}
.Culture{ width: 100%; background: url(../images/proBg_02.jpg) center top no-repeat; padding-top: 95px; padding-bottom: 130px; background-size: 100% 100%; }
.Culture ul li{ margin-bottom: 90px; overflow: hidden;}
.Culture ul li .icon{ overflow: hidden; border-radius:30px; float: right; width: 835px; float: right;}
.Culture ul li .icon img{ transition: 0.5s; display: block; width: 100%; height: auto;}
.Culture ul li .text{ width: calc(100% - 835px); float: left; padding: 170px 120px 0 0; box-sizing: border-box;}
.Culture ul li .text h2{ font-size: 52px; color: #333; text-align: right; width: 100%;}
.Culture ul li .text span{ transition: 0.5s; display: block; width: 60px; height: 2px; margin: 20px 0; background: #3399ff; float: right;}
.Culture ul li .text p{ display: block; width: 100%; text-align: right; font-size: 22px; color: #000033; line-height: 28px;}
.Culture ul li .icon:hover img{ transform: scale(1.1);}
.Culture ul li:nth-child(2n) .icon{ float: left;}
.Culture ul li:nth-child(2n) .text{padding: 170px 0 0 120px;}
.Culture ul li:nth-child(2n) h2{ text-align: left;}
.Culture ul li:nth-child(2n) p{ text-align: left;}
.Culture ul li:nth-child(2n) span{ float: left;}
.Culture ul li:last-child{ margin-bottom: 0;}
.Culture ul li:hover .text span{ width: 160px;}
.Certifications{width: 100%; background: url(../images/proBg_02.jpg) center top no-repeat; padding: 130px 0 110px 0;background-size: 100% 100%; }
.Certifications ul{ overflow: hidden; width: 1460px; margin: 0 auto; padding: 10px; box-sizing: border-box;}
.Certifications ul li{ background: #fff; overflow: hidden; transition: 0.5s; width:276px; float: left; margin: 0 15px 20px 0; height: 395px; border: 12px solid #3399ff; box-sizing: border-box; position: relative;}
.Certifications ul li:nth-child(5n){ margin-right: 0;}
.Certifications ul li img{ width: 100%; height: 100%;object-fit: contain; position: absolute; left:50%; top: 50%; transform: translate(-50%,-50%); transition: 0.5s;}
.Certifications ul li:hover{ transform: translateY(-10px); box-shadow: 0 10px 10px rgba(0,0,0,0.2);}
.Certifications ul li:hover img{ transform: translate(-50%,-50%) scale(1.1);}

.Services{ width: 100%; background: url(../images/proBg_02.jpg) center top no-repeat; padding: 150px 0 40px 0;background-size: 100% 100%; }
.Services .layer1{ overflow: hidden;}
.Services .layer1 ul li{padding-bottom: 90px; overflow: hidden;}
.Services .layer1 .icon{ width: 635px; float: left; padding-bottom: 10px;}
.Services .layer1  ul li:nth-child(2n) .icon { float: right;}
.Services .layer1 .icon img{ width: 500px; height: auto; display: block; margin: 0 auto; border-radius:50%;}
.Services .layer1 .text{ width: calc(100% - 635px); float: left; padding-left: 120px; padding-top:88px; box-sizing: border-box;}
.Services .layer1 .text h2{ height:auto; font-size: 46px; color: #000;line-height: 68px;}
.Services .layer1 .text span{ display: block; width: 60px; height: 2px; background: #3399ff; margin: 10px 0 35px 0;}
.Services .layer1 .text p{ font-size: 22px; color: #000; line-height: 38px;}
.Services .layer2 ul{ overflow: hidden;}
.Services .layer2 ul li{ width: 280px; float: left; margin: 0 10px 0 0;}
.Services .layer2 ul li:nth-child(5n){ margin-right: 0;}
.Services .layer2 ul li .text{ width: 100%; height: 100px; text-align: center; padding: 10px 0 0 0; box-sizing: border-box; font-size: 18px; line-height: 26px; color: #000;}
.Services .layer2 ul li .icon{ width: 100%; height: 210px; border: 1px solid #fff; border-radius:7px; overflow: hidden;}
.Services .layer2 ul li .icon img{ display:block; width: 100%; height: 100%; transition: 0.5s;}
.Services .layer2 ul li:hover .icon img{ transform: scale(1.1);}
.Services .layer2 dl dd{ transition: 0.5s; float: left; width: 300px; margin: 0 80px 0 0;}
.Services .layer2 dl dd .icon{ width: 100%; height: 418px; border-radius:7px; overflow: hidden;}
.Services .layer2 dl dd .icon img{ transition: 0.5s; width: 100%; height: 100%;}
.Services .layer2 dl dd .text{ width: 100%; height: 100px; text-align: center; padding: 10px 0 0 0; box-sizing: border-box; font-size: 18px; line-height: 26px; color: #000;}
.Services .layer2 dl dd:nth-child(4n){ margin-right: 0;}
.Services .layer2 dl dd:hover{transform: translateY(-10px); }
.Services .layer3{ background: url(../images/OEM_15.jpg?20240928) center center no-repeat; min-height: 675px; height: 100%; background-size:100% 100%; background-attachment:fixed;}
.Services .layer3 .bt{ width: 100%; height: 245px; text-align: center; line-height: 245px; font-size: 48px; font-weight: bold; color: #fff;}
.Services .layer3Box{ overflow: hidden;}
.Services .layer3Box .con{ float: left; width: 50%; padding: 0 45px; box-sizing: border-box;}
.Services .layer3Box .con ul{ width: 100%;}
.Services .layer3Box .con ul li{ margin-bottom: 15px; background: rgba(255,255,255,0.3); width: 100%; position: relative; border: 1px solid #3399ff; box-sizing: border-box; border-radius:8px; border-left:7px solid #3399ff;}

.Services .layer3Box .con ul li ol li{ list-style:auto; background: none;padding: 0; margin: 0;}
.Services .layer3Box .con ul li ol { padding-left: 25px;}


.Services .layer3Box .con ul li .tit{ overflow:hidden; cursor: pointer; padding: 0 12px; box-sizing: border-box; height: 56px; line-height: 56px; font-size: 16px; color: #fff; position: relative;}
.Services .layer3Box .con ul li .tit:after{ content: ''; background: url(../images/OEM_Icon_03.png); width: 18px; height: 18px; position: absolute; right: 30px; top: 50%; transform: translateY(-50%); transition: 0.5s;}
.Services .layer3Box .con ul li .tit.on:after{ transform: translateY(-50%) rotate(180deg);}
.Services .layer3Box .con ul li .text{ display: none; font-size: 16px; width: 100%; padding: 12px; box-sizing: border-box; background: #3399ff; line-height: 1.6; color: #fff;}
.News{ padding-top: 1px; position: relative; z-index: 10; width: 100%; background: url(../images/proBg_02.jpg) center top no-repeat; background-size: 100% 100%; }
.News .NewBox{ margin: -185px auto 0 auto; background: #fff; box-shadow: 0 10px 10px rgba(0,0,0,0.2); padding-bottom: 20px;}
.News .NewBox .hd{ width: 100%; height: 90px;}
.News .NewBox .hd ul{ overflow: hidden;}
.News .NewBox .hd ul li{ float: left; background: #3399ff; width: 50%; height: 90px; line-height: 90px; text-align: center; cursor: pointer; font-size: 24px; color: #fff;}
.News .NewBox .hd ul li.on{ background: #fff; color:#3399ff;}
.News .NewBox .hd ul li a{ color: #fff;display:block;width: 100%;/* 202408 */}
.News .NewBox .hd ul li.on a{ background: #fff; color:#3399ff;/* 202408 */}
.News .NewBox .bd{ width: 100%; padding: 0 40px; box-sizing: border-box;}
.News .NewBox .bd ul{ width: 100%; padding-top: 40px;}
.News .NewBox .bd ul li{ width: 100%; height: 260px; margin-bottom: 40px; overflow: hidden;}
.News .NewBox .bd ul li .icon{ float: left; width: 380px; height: 260px;  }
.News .NewBox .bd ul li .icon img{ display: block; width: 100%; height: 100%;object-fit: cover;}
.News .NewBox .bd ul li .text{ width: calc(100% - 380px); float: left; padding: 0 0 0 30px; box-sizing: border-box;}
.News .NewBox .bd ul li .text h2{ font-size: 24px; color: #000; line-height: 36px;}
.News .NewBox .bd ul li .text span{ transition: 0.5s; display: block; width: 38px; height: 3px; background: #3399ff; margin: 30px 0;}
.News .NewBox .bd ul li .text p{ font-size: 16px; line-height: 26px; color: #000; height: 52px; overflow: hidden;}
.News .NewBox .bd ul li .text b{ display: block; text-decoration: underline; font-size: 20px; color: #000; margin-top: 55px;}
.News .NewBox .bd ul li:hover .text h2{ font-size: 24px; color: #3399ff; line-height: 36px;}
.News .NewBox .bd ul li:hover .text span{ width: 60px;}
.News .pageMain{ width: 100%; padding: 100px 0;}
.News .pageMain dl{ text-align: center;}
.News .pageMain dl dd{ font-size: 16px; color: #666;  margin: 0 10px; width: 60px; height: 42px; display: inline-block;}
.News .pageMain dl dd a{transition: 0.5s; display: block; width: 100%; height: 42px; line-height: 40px; text-align: center; background: #fff; border: 1px solid #eee; border-radius:7px;}
.News .pageMain dl dd input{ width: 100%; height: 100%; text-align: center; background: #fff; border: 1px solid #eee; border-radius:7px;}
.News .pageMain dl dd.on a{  background: #005982; color: #fff; border: 1px solid #005982;}
.News .pageMain dl dd:hover a{ background: #005982; color: #fff; border: 1px solid #005982;}
.News .pageMain dl dd:last-child{ background: linear-gradient(#0bcfc0,#1d75cb); box-sizing: border-box; padding: 1px; border-radius:7px ;}
.News .pageMain dl dd:last-child a{ border: none; width: 100%; height: 100%;}
.NewsWarp{ position: relative; z-index: 10; width: 100%; background: url(../images/proBg_02.jpg) center top no-repeat; padding: 70px 0 0 0;background-size: 100% 100%; }
.NewDetails{ background: #fff; padding: 0 130px 70px 130px; box-sizing:border-box; box-shadow: 0 0 10px rgba(0,0,0,0.1);}
.NewDetails .bt{ padding: 75px 0 40px 0;}
.NewDetails .bt h2{ font-size: 34px; text-align: center; color: #005982;}
.NewDetails .bt span{ display: block; text-align: center; margin: 20px 0 0 0; color: #000; font-size: 16px;}
.NewDetails p{ font-size: 18px; color: #000; line-height: 26px; margin-bottom: 24px;}
.NewDetails img{ display: block; margin: 0 auto 24px auto;  max-width: 100%; height: auto;}
.NewDetails p b{ font-weight: bold; margin-right: 10px;}
.NewDetails ol,.NewDetails ul, .NewDetails li{ font-size: 18px; color: #000; line-height: 26px; list-style: revert;margin-left: 1em; }
.NewDetails ol,.NewDetails ul{ margin-bottom: 24px;}
.NewDetails.fontSmall p{ font-size: 14px; line-height: 22px;}
.NewDetails.fontBig p{ font-size: 22px; line-height: 34px;}
.CantactUs{width: 100%; background: url(../images/proBg_02.jpg) center top no-repeat; padding: 85px 0;background-size: 100% 100%; }
.CantactUs .layer1{ overflow: hidden; height: 500px;}
.CantactUs .layer1Left{ width: 685px; float: left; background: linear-gradient(to right,#0099ff,#2eb1f2); height: 500px; padding: 55px 30px 25px 30px; box-sizing: border-box;}
.CantactUs .layer1Left h2{ font-size: 32px; color: #fff;}
.CantactUs .layer1Left span{  margin: 20px 0; width: 60px; height: 2px; background: #00f6ff; display: block;}
.CantactUs .layer1Left p{ width: 430px; font-size: 18px; line-height: 24px; color: #fff;}
.CantactUs .layer1Left ul{ padding-top: 25px;}
.CantactUs .layer1Left ul li{ color: #fff; font-size: 16px; line-height: 28px; position: relative; padding-left: 27px;}
.CantactUs .layer1Left ul li a{ color: #fff; font-size: 16px; line-height: 28px; position: relative; }
.CantactUs .layer1Left ul li img{ position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.CantactUs .layer1Left dl{ padding-top: 20px; /* overflow: hidden; */position: relative;/* 202408 */}
.CantactUs .layer1Left dl dd{ float: left; margin: 0 25px 0 0; width: 50px; height: 50px; position: relative; overflow: hidden;}
.CantactUs .layer1Left dl dd .icon{ width: 100%; height: 200%; position: relative; transition: 0.5s;}
.CantactUs .layer1Left dl dd .icon b{ display: block; width: 100%; height: 50%; position: relative;}
.CantactUs .layer1Left dl dd .icon b img{ display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.CantactUs .layer1Left dl dd:hover .icon{ transform: translateY(-50px);}
.CantactUs .layer1Left dl .code{ display: none; position: absolute; padding:2px; background: #fff; border-radius:7px; /* right: 50px;  */bottom:20px;left:120px;/* 202408 */}
.CantactUs .layer1Left dl .code img{ width: 120px; height: 120px; background: #ccc;/* 202408 */}
.CantactUs .layer1Right{ width: calc(100% - 685px); height: 100%; float: right;}
.CantactUs .layer1Right img{ display: block; width: 100%; height: 100%;}
.CantactUs .layer2{ padding-bottom: 70px;}
.CantactUs .layer2 .bt{font-weight: bold; padding: 125px 0 50px 0; text-align: center; font-size: 52px; color: #333;} 
.CantactUs .layer2 img{ display: block; width: 100%; height: auto;}
.CantactUs .layer3{ padding: 0 5%; box-sizing: border-box; background: url(../images/CantactUs_09.jpg) center top no-repeat; height: 765px; background-size:auto 100%; background-attachment: fixed; position: relative; width:100%; overflow:hidden;}
.CantactUs .layer3 .swiper-container{ width: 100%; height: 100%;}
.CantactUs .layer3Box{ position: relative; width: 100%; height: 100%;}
.CantactUs .layer3Box:after{ z-index: 2; width: 100%; height: 2px; content: ''; background: #cccccc; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.CantactUs .layer3 .swiper-container .Nr{ z-index: 3; width: 16px; height: 16px; border-radius:50%; border:4px solid #80c0f5; background: #2c9bf3; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.CantactUs .layer3 .NrBox{ width:400px; padding: 0 25px 15px 25px; box-sizing: border-box; background: linear-gradient(to right,#3399ff,#2eb1f2); position: absolute; left: 50%; transform: translateX(-50%); top: 50px;}
.CantactUs .layer3 .NrBox span{ display: block; text-align: center; line-height: 44px; color: #fff; font-size: 20px;}
.CantactUs .layer3 .NrBox p{ font-size: 18px; color: #fff; line-height: 24px;}
.CantactUs .layer3 .NrBox:after{background: url(../images/cantact_10.png); width: 14px; height: 19px; content: ''; position: absolute; top: 0; left: 50%; transform: translate(-50%,-100%);}
.CantactUs .layer3 .swiper-container .swiper-slide:nth-child(2n) .NrBox{ top: auto; bottom: 58px;}
.CantactUs .layer3 .swiper-container .swiper-slide:nth-child(2n) .NrBox:after{ background: url(../images/cantact_08.png); background-size:100% 100% ; top: auto; bottom: 0; transform: translate(-50%,100%);}
.CantactUs .layer3Box .swiper-button-next{ background: url(../images/cantact_05.png); width: 16px; height: 28px; top: 50%; transform: translateY(-50%); right: -38px; margin: 0;}
.CantactUs .layer3Box .swiper-button-prev{ background: url(../images/cantact_03.png); width: 16px; height: 28px; top: 50%; transform: translateY(-50%); left: -38px; margin: 0;}
.CantactUs .layer3Box .swiper-button-next:after{ display: none;}
.CantactUs .layer3Box .swiper-button-prev:after{ display: none;}
.AboutMYD{width: 100%; background: url(../images/proBg_02.jpg) center top no-repeat; background-size:100% 100%;}
.AboutMYD .layer1Box{box-shadow: 0 0 10px rgba(0,0,0,0.1); width: 100%; background: #fff; padding-bottom: 40px;}
.AboutMYD .layer1Box ul li{ overflow: hidden;}
.AboutMYD .layer1Box .text{ width: 50%; float: left; padding:70px 40px 0 40px; box-sizing: border-box;}
.AboutMYD .layer1Box .text h2{ height: 64px; line-height: 64px; font-size: 31px; color: #333;}
.AboutMYD .layer1Box .text span{ display: block; width: 60px; height: 2px; background: #3399ff; margin-bottom: 15px;}
.AboutMYD .layer1Box .text p{ font-size: 18px; color: #000; line-height: 22px; padding-bottom: 15px;}
.AboutMYD .layer1Box .icon{ width: 50%; float: right; padding-top: 90px; overflow: hidden;}
.AboutMYD .layer1Box .icon:hover img{ transform: scale(1.1);}
.AboutMYD .layer1Box .icon img{ display: block; width: 100%; height: auto; transition: 0.5s;}
.AboutMYD .layer1Box ul li:nth-child(2n) .icon{ float: left;}
.AboutMYD .layer1Box ul li:nth-child(2n) .text{ float: right;}
.AboutMYD .layer2 img{ display: block; height: auto; width: 100%;}
.AboutMYD .layer2Box{ position: relative;}
.AboutMYD .layer2Box video{ display: block; width: 100%; height: auto;}
.AboutMYD .layer2Box .playClick{ background: url(../images/playClick_03.png); width: 100px; height: 100px; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.AboutMYD .layer3{ width: 100%;}
.AboutMYD .layer3 .ab2 { box-sizing: border-box; width: 100%;padding: 6.25vw 11.458vw;background: #2c8ff1;overflow: hidden;position: relative;}
.AboutMYD .layer3 .ab2 .bj {position: absolute; top: 50%;left: 50%;width: 87%;-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);pointer-events: none;}
.AboutMYD .layer3 .ab2 .bj img {max-width: 100%;width: 100%;webkit-transition: transform 1s;transition: transform 1s;pointer-events: none;}
.AboutMYD .layer3 .ab2 .swiper1 .swiper-slide {opacity: 0.5; transition: 0.5s;}
.AboutMYD .layer3 .ab2 .swiper1 .swiper-slide-active { opacity: 1;}
.AboutMYD .layer3 .ab2 .swiper1 .swiper-slide img{ transform: scale(0); display: block; width: 100%; height: auto; transition: 0.5s; margin-top: 25px;}
.AboutMYD .layer3 .ab2 .swiper1 .swiper-slide-active img{ transform: scale(1);}
.AboutMYD .layer3 .ab2 .col { width: 100%;}
.AboutMYD .layer3 .ab2 .intr h4 {font-size: 1.563vw;font-family: "Pano";font-weight: 400; color: #ffffff;  margin: 0 0 0.781vw;transition: 0.5s;}
.AboutMYD .layer3 .ab2 .intr p {font-size: 0.938vw;font-weight: 400;color: #ffffff;transition:0.5s; line-height: 1.2vw;;}
.AboutMYD .layer3 .ab2 .pic {width: 100%; margin: 0.521vw 0 0;transition: 0.5s;}
.AboutMYD .layer3 .ab2 .pic img {max-width: 100%;width: 100%;opacity: 0;transition: 0.5s;}
.AboutMYD .layer3 .ab2 .swiper-slide-active img {opacity: 1;}
.AboutMYD .layer3 .ab2 .swiper2 {width: 100%;position: relative;}
.AboutMYD .layer3 .ab2 .swiper-btn2 {position: absolute;top: 50%;transform: translateY(-50%);z-index: 5;}
.AboutMYD .layer3 .ab2 .prev {left: 0; background: url(../images/about_22.jpg); background-size:100% 100% ;}
.AboutMYD .layer3 .ab2 .next {right: 0; background: url(../images/about_25.jpg); background-size:100% 100% ;}
.AboutMYD .layer3 .ab2 .swiper2 .swiper-slide {padding: 3.125vw 0;}
.AboutMYD .layer3 .ab2 .swiper2 .col::after {content: ""; position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);width: 100%;height: 0.052vw;background: #ffffff;}
.AboutMYD .layer3 .ab2 .date {position: absolute; left: 50%;bottom: 0.521vw;transform: translateX(-50%);}
.AboutMYD .layer3 .ab2 .date span {font-size: 1.042vw;font-family: "Pano";font-weight: 400;color: #ffffff;opacity: 0.5;transition:0.5s;}
.AboutMYD .layer3 .ab2 .swiper-slide-active .date span {opacity: 1;}
.AboutMYD .layer3 .ab2 .dot {width: 8px;height: 8px; background: #ffffff;border-radius: 50%;margin: 0 auto;position: relative;}
.AboutMYD .layer3 .ab2 .dot::after {content: "";position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);width: 20px;height: 20px;background: rgba(255, 255, 255, 0.27); border-radius: 50%;opacity: 0;
transition: 0.5s;}
.AboutMYD .layer3 .ab2 .swiper-slide-active .dot::after { opacity: 1; animation: boderM 3s infinite;}
.swiper-btn2{width: 2.344vw; height: 2.083vw;background: #ffffff; box-shadow: 0px 3px 6px 1px rgba(0, 0, 0, 0.06);cursor: pointer; transition: 0.5s;}
.swiper-btn2:hover {background: #d2d2d2;}
.swiper-btn2 i {color: #D97A1E;font-size: 0.833vw; transition: 0.5s;}
.swiper-btn2:hover i {color: #ffffff;}
.AboutMYD .layer4Box ul{ width: 100%; overflow: hidden;}
.AboutMYD .layer4Box ul li{ overflow: hidden; width: 32%; float: left; margin: 0 2% 40px 0;}
.AboutMYD .layer4Box ul li:nth-child(3n){ margin-right: 0;}
.AboutMYD .layer4Box ul li img{ display: block; width: 100%; height: auto; transition: 0.5s;}
.AboutMYD .layer4Box ul li:hover img{ transform: scale(1.1);}
@keyframes a1{
	0%{transform: translateX(0);}
	100%{transform: translateX(-50%);}
}
@keyframes a2{
	0%{transform: translateX(0);}
	100%{transform: translateX(50%);}
}
.AboutMYD .layer5{ background: #fff; width: 100%; padding-bottom: 110px;}
.AboutMYD .layer5 .line{ height: 110px; width: 100%; overflow: hidden; padding: 15px; box-sizing: border-box; position: relative;}
.AboutMYD .layer5 .line ul{ position: absolute; left: 0; white-space: nowrap; text-align: left;}
.AboutMYD .layer5 .line ul li{ margin-right: 15px; display: inline-block; width: 240px; height: 80px; border-radius:40px; background: #fff; box-shadow: 0 0 10px rgba(0,0,0,0.1); position: relative;}
.AboutMYD .layer5 .line ul li img{ height: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.AboutMYD .layer5 .line ul li:last-child{ margin-right: 0;}
.AboutMYD .layer5 .line:nth-child(2) ul{ animation: a1 30s linear infinite;}
.AboutMYD .layer5 .line:nth-child(3) ul{ animation: a2 30s linear infinite;left: auto; right: 0;}
@media (min-width:1024px) and (max-width:1560px) {
	.indexContainer .layer5 .Nr .text p{ font-size:16px; line-height:18px; height:54px; margin-bottom:20px;}
	.indexContainer .layer2Right .Nr .text p{ font-size:18px; line-height: 26px; color: #fff; height: 52px; overflow: hidden;}
    .footer .footerBox .footerLeft p{ width:100%;}
	.ProList .layer2 .swiper-button-next{ right: 15px;}
	.ProList .layer2 .swiper-button-prev{ left: 15px;}
	.indexContainer .layer3{ height: 600px;}
	.AboutMYD .layer1Box .text p{ font-size: 14px; line-height: 18px;}
	.CantactUs .layer3 .NrBox{ width: 300px;}
	.w1440{ width: 100%; padding: 0 5%; box-sizing: border-box;}
	.title{ padding-top:45px; padding-bottom: 45px;}
	.ProList .layer1 ul li { height: 7.2rem;}
	.ProList .layer1 ul li .text{ padding-right: 2%;}
	.ProList .layer1 ul li .icon{ width: 60%;height: 7.2rem; display: flex; align-items: center; /* 垂直居中 */ justify-content: center; /* 水平居中 */}
	.ProList .layer1 ul li .icon img{ width: 100%; height: auto;}
	.ProList .layer1 ul li .text{ width: 40%;}
	.ProList .layer1 ul li:nth-child(2n) .text{ padding-left:2% ;}
	.ProList .layer1 ul li .text h2{ font-size: 26px; line-height: 32px;}
	.bannerPage .Nr{ font-size: 48px;}
	.SendMain{ width: 95%; margin: 0 auto;}
	.footer .footerBox .footerLeft{ margin:0; width:30%; box-sizing:border-box;}
	.footer .footerBox .footerLeft:first-child{ width:40%;  padding-right: 35px;margin-left: 0;}
	.footer .footerBox .footerLeft:last-child{ margin-left:0;}
	
	

	.bannerIndex .swiper-pagination span{ width: 80px;}
	.why_MYD ul{ width: 95%; margin: 0 auto;}
	.why_MYD ul li .icon{ width:8.6rem;}
	.why_MYD ul li .text{ width: 55%;}
	.Culture ul li .icon { width: 70%;}
	.Culture ul li .text{ width: 30%; padding: 70px 30px 0 0;}
	.Culture ul li:nth-child(2n) .text{ padding: 70px 0 0 30px;}
	.Culture ul li .text h2{ font-size: 38px;}
	.Culture ul li .text p{ font-size: 18px;}
	.Certifications ul{ width: 98%; margin: 0 auto;}
	.Certifications ul li{ width: 23.5%; float: left; margin-right: 2%; border: 8px solid #3399ff;}
	.Certifications ul li:nth-child(5n){ margin-right: 2%;}
	.Certifications ul li:nth-child(4n){ margin-right: 0;}
	.Services .layer1 .icon{ width: 50%;}
	.Services .layer1 .icon img{ width: 80%; margin: 0 auto; height: auto;}
	.Services .layer1 .text{ width: 50%; padding: 50px 0 0 0;}
	.Services .layer2 ul{ width: 100%;}
	.Services .layer2 ul li{ width: 23.5%; margin: 0 2% 0 0;}
	.Services .layer2 ul li:nth-child(5n){ margin-right: 2%;}
	.Services .layer2 ul li:nth-child(4n){ margin-right: 0;}
	.Services .layer2 ul li .icon{ height: 15vw;}
	.Services .layer2 ul li .icon img{ object-fit:cover;}
	.Services .layer2 dl dd{ width: 23.5%; float: left; margin: 0 2% 0 0;}
	.Services .layer2 dl dd:nth-child(4n){ margin-right: 0;}
	.Services .layer2 dl dd .icon{ height: auto;}
	.Services .layer2 dl dd .text{ font-size: 18px;}
	.Services .layer3Box{padding: 0;}
	.Services .layer3Box .con ul li .tit{ font-size: 16px;}
	.Services .layer3Box .con ul li .text{ font-size: 16px;}
	.News .NewBox{ width: 95%; padding: 0; margin: -90px auto 0 auto; padding-bottom: 10px;}
	.CantactUs .layer1Left{ width: 50%;}
	.CantactUs .layer1Right{ width: 50%; overflow: hidden;}
	.CantactUs .layer1Right img{ height: 100%; width: auto;}
	.AboutMYD .layer1Box .text h2{ font-size: 20px;}
	.bannerIndex .textBox h2{ font-size: 42px; line-height: 58px;}
	.bannerIndex .textBox p{ font-size: 26px; line-height: 38px;}
	.indexContainer .layer2Left .title h2{ font-size: 42px;}
	.NewDetails p{ font-size: 16px;}
	.NewDetails.fontSmall p{ font-size: 12px; line-height: 22px;}
	.NewDetails.fontBig p{ font-size: 20px; line-height: 34px;}
	.indexContainer .layer4Box .swiper-button-next{ right: 15px;}
	.indexContainer .layer4Box .swiper-button-prev{ left: 15px;}
	.indexContainer .layer5 .swiper-button-prev{ left: 15px;}
	.indexContainer .layer5 .swiper-button-next{ right: 15px;}
	.footer{ padding:0 30px; box-sizing:border-box;}
	.footer .footerBox{ padding: 50px 0; box-sizing: border-box;}
	.AboutMYD .layer1Box .text h2{ height: auto; padding: 15px 0; line-height: 30px;}
    
}
@media (max-width:1024px){
	

	
    .footer .footerBox .footerLeft p{ width:100%;}
	.top .language dl{ width: 100px; left: auto; transform: none; right: 20px; top: 60px; border-radius:5px ;}
	.top .language dl dd{ height: 46px; line-height: 46px;}
	.top .language dl dd a{ padding: 0 10px; font-size: 16px; height: 46px; line-height: 46px;}
	body{ width: 100%; overflow-x: hidden;}
	.w1440{ width: 100%; padding: 0 5%; box-sizing: border-box;}
	.indexContainer .layer5 .Nr .text span{ font-size: 14px;}
	.indexContainer .layer5 .swiper-button-next{right: 10px!important;}
	.indexContainer .layer5 .swiper-button-prev{left: 10px!important;}
	.indexContainer .layer4 .swiper-container .swiper-slide{ border: 6px solid #3399ff;}
	.indexContainer .layer4Box .swiper-button-next{ right: 10px;}
	.indexContainer .layer4Box .swiper-button-prev{ left: 10px;}
	.title{ padding-top: 45px; padding-bottom: 45px;}
    .title h2{ font-size: 22px; line-height: 28px;}
	.title p{ font-size: 16px; line-height: 24px;}
	.ProList .layer1 ul li{ width: 100%; height: auto; margin-bottom: 15px;}
	.ProList .layer1 ul li .icon{ width: 100%; height: auto;}
	.ProList .layer1 ul li .icon img{ display: block; width: 100%; height: auto;}
	.ProList .layer1 ul li .text{ padding: 30px 15px; box-sizing: border-box; width: 100%; height: auto;}
	.ProList .layer1 ul li .text h2{ font-size: 22px; line-height: 28px;}
	.ProList .layer1 ul li .text p{ font-size: 16px;}
	.ProList .layer1 ul li:nth-child(2n) .text{ padding: 30px 15px;}
	.ProList .layer2{ width: 100%; overflow: hidden;}
	.SendMain{ width: 100%; padding: 0 2%; box-sizing: border-box;}
	.SendMain ul li{ margin-bottom: 15px;}
	.SendMain ul li input{ width: 100%; margin-bottom: 15px;}
	.SendMain ul li input:last-child{ margin-bottom: 0;}
	.footer{ padding: 30px 15px; box-sizing: border-box;}
	.footer .footerBox .footerLeft{ width: 100%; margin: 0 0 25px 0;}
	.footer .footerBox .footerLeft:nth-child(2){ width: 50%;}
	.footer .footerBox .footerLeft:nth-child(3){ width: 50%; margin: 0;}
	.footer .footerBox .footerLeft dl dd{ width: 25%; margin: 0;}
	.footer .footerBox .footerLeft dl .code{ left:50%} /*20240928*/
	.footer .copyRight{ margin-top: 50px; padding: 20px 0; line-height: 32px; height: auto;}
	.bannerPage .Nr{ font-size: 22px;}
	.top{ top: 0; height: 60px; padding: 0 2%; box-sizing: border-box;}
	.top .logo{ height: 100%; line-height: 70px; padding: 0;}
	.top .logo img{ height: 80%; width: auto;}
	.top .language{ height: 100%; width: 50px; background: url(../images/MainTb_09.png) center center no-repeat; background-size:25px auto ;}
	.top .quote{ display: none;}
	.top .nav{  display: none; width: 100%; position: absolute; top: 60px; background: #fff; left: 0;}
	.top .nav ul{ width: 100%;}
	.top .nav ul li{ border-bottom: 1px solid #ddd; width: 100%; height: auto; line-height: 46px; margin: 0; padding: 0 15px; box-sizing: border-box;}
	.top .nav ul li .bt{ height: 46px; line-height: 46px; font-size: 16px; color: #333;}
	.top .nav ul li.on .bt{ color: #3399ff;}
	.top .nav ul li .bt:after{ background: #3399ff;}
	.top .nav ul li:hover .bt{ color: #3399ff;}
	.top .nav ul li dl{ padding: 15px 0; background: none; top: auto; left: auto; position: relative; width: 100%;}
	.top .nav ul li dl.product{ padding: 15px 0; background: none; top: auto; left:0; position: relative; width: 100%;writing-mode:horizontal-tb;height:auto;/* 202408 */}
	.top .nav ul li dl dd{ padding-left: 15px; box-sizing: border-box; height: 40px; line-height: 40px;}
	.top .nav ul li dl.product dd{ padding-left: 15px; box-sizing: border-box; height: 40px; line-height: 40px;writing-mode:horizontal-tb;display: block;/* 202408 */}
	.top .nav ul li dl dd a{ font-size: 14px; line-height: 40px; height: 42px; color: #333;}
	.top .SideClick{ display: block; position: absolute; right: 70px; top: 50%; transform: translateY(-50%); width: 24px; height: 20px; transition: 0.5s;}
	.top .SideClick span{ display: block; position: absolute; left: 0; width: 100%; height: 2px; background: #fff; border-radius:2px; transition: 0.5s;}
	.top .SideClick span:nth-child(1){ top: 0;}
	.top .SideClick span:nth-child(2){ top: 50%; transform: translateY(-50%);}
	.top .SideClick span:nth-child(3){ bottom: 0;}
	.top .SideClick.on{ transform: translateY(-50%) rotate(180deg);}
	.top .SideClick.on span:nth-child(1){ top: 50%; transform: translateY(-50%) rotate(-45deg);}
	.top .SideClick.on span:nth-child(2){ width: 0;}
	.top .SideClick.on span:nth-child(3){ top: 50%; transform: translateY(-50%) rotate(45deg);}
	.indexContainer .layer2{ padding-top: 0; overflow: hidden;}
	.indexContainer .layer2Left{ width: 100%; padding-bottom: 20px;}
	.indexContainer .layer2Right{ width: 100%;}
	.indexContainer .layer2Left .title h2{ text-align: center;}
	.indexContainer .layer2Left .title span{ display: block; margin: 20px auto 0 auto;}
	.indexContainer .layer2Left a{ margin: 0 auto;}
	.top .nav ul li{ position: relative;}
	.top .nav ul .getquote{ display:block; }
	.top .nav ul li:after{ width: 46px; height: 46px; position: absolute; right: 0; top: 0; transition: 0.5s; content: ''; background: url(../images/set1.png) center center no-repeat; background-size:20% auto;}
	.top .nav ul li:nth-child(1):after{ display: none;}
	.top .nav ul li:last-child:after{ display: none;}
	.top .nav ul li:hover:after{ background: url(../images/set2.png) center center no-repeat; background-size:20% auto ; transform: rotate(180deg);}
	.indexContainer .layer2Right .Nr .icon{ height: auto;}
	.indexContainer .layer2Right .Nr .icon img{ height: auto;}
	.indexContainer .layer3{ margin-top: 50px;}
	.indexContainer .layer5 .Nr .icon { height: auto;}
	.indexContainer .layer5 .Nr .icon img{ height: 21vw; min-height: 13vh;}
	.indexContainer .layer5 .Nr .text{ padding: 15px; height:125px;}
	.bannerIndex .swiper-pagination span{ width: 30px; padding: 0 3px;}
	.bannerIndex .swiper-pagination{ bottom: 25px!important;}
	.bannerIndex .textBox h2{ font-size: 18px; line-height: 22px; margin-bottom: 15px;}
	.bannerIndex .textBox p{ font-size: 14px; line-height: 18px;}
	.indexContainer .layer1 ul li{ width: 100%; height: auto; margin: 0 0 15px 0;}
	.indexContainer .layer1 ul li img{ display:block; width:100%; height:auto;}
	.indexContainer .layer1 ul li .bt{ left: 20px; top: 20px; font-size: 22px;}
	.why_MYD ul{ width: 96%; margin: 0 auto;}
	.why_MYD ul li{ margin-bottom: 30px;}
	.why_MYD ul li .icon{ width: 100%; height: auto; position: relative; top: auto; left: auto;}
	.why_MYD ul li .text{ width: 100%; padding:20px; box-sizing: border-box;}
	.why_MYD ul li .text h2{ font-size: 22px; line-height: 28px;}
	.why_MYD ul li .text p{ font-size: 16px; line-height: 22px;}
	.why_MYD ul li:nth-child(2n) .text{ padding: 20px;}
	.why_MYD{ padding: 30px 0;}
	.Culture{ padding: 30px 0;}
	.Culture ul li{ margin: 0;}
	.Culture ul li .icon{ width: 100%; height: auto;}
	.Culture ul li .text{ width: 100%; padding: 30px 0;}
	.Culture ul li .text h2{ text-align: center; font-size: 28px;}
	.Culture ul li .text p{ font-size: 16px;}
	.Culture ul li .text span{ margin: 20px auto; float: initial;}
	.Culture ul li .text p{ text-align: center;}
	.Culture ul li:nth-child(2n) .text{ padding: 30px 0;}
	.Culture ul li:nth-child(2n) .text h2{ text-align: center;}
	.Culture ul li:nth-child(2n) .text span{ float: initial;}
	.Culture ul li:nth-child(2n) .text p{ text-align: center;}
	.Certifications{ padding: 30px 0;}
	
	.Certifications ul{ width: 100%;}
	.Certifications ul li{ width: 32%; height: 42vw; float: left; margin-right: 2%;border: 4px solid #3399ff; overflow: hidden;}
	.Certifications ul li:nth-child(5n){ margin-right: 2%;}
	.Certifications ul li:nth-child(4n){ margin-right: 2%;}
	.Certifications ul li:nth-child(3n){ margin-right: 0;}
	.Services .layer3Box .con{ width: 100%;}
	.Services .layer3{ background-size:auto 100%;  background-attachment:revert-layer; height: auto; padding-bottom: 50px;}
	.Services .layer3 .bt{ height: 145px; line-height: 145px; font-size: 36px;}
	.News .NewBox{ width:100%; padding: 0; margin: 0 auto 0 auto;}
	.News .NewBox .hd{ height: 60px;}
	.News .NewBox .hd ul li{ height: 60px; line-height: 60px; font-size: 16px;}
	.News .NewBox .bd{ width: 100%; padding: 15px;}
	.News .NewBox .bd ul li{ height: auto;}
	.News .NewBox .bd ul{ padding: 0;}
	.News .NewBox .bd ul li .icon{ width: 100%; height: auto;}
	.News .NewBox .bd ul li .text{ width: 100%; padding: 15px 0;}
	.News .pageMain{ padding: 30px 15px; box-sizing: border-box;}
	.News .pageMain dl dd{ font-size: 12px; width: 40px; height: 30px; line-height: 30px; margin: 0 4px; margin-bottom: 10px;}
	.News .pageMain dl dd a{ height: 30px; font-size: 12px; line-height: 30px; border-radius:4px;}
	.NewDetails img{ width: 100%; height: auto;}
	.CantactUs{ padding: 35px 0;}
	.CantactUs .layer1{ height: auto;}
	.CantactUs .layer1Left{ width: 100%; padding:30px 15px; box-sizing: border-box;}
	.CantactUs .layer1Left p{ width: 100%; font-size: 14px;}
	.CantactUs .layer1Left .icon{ width: 100%;}
	.CantactUs .layer1Right{ width: 100%; height:300px}
	.CantactUs .layer2 .bt{ padding: 55px 0; font-size: 28px;}
	.CantactUs .layer3{ height: 650px; padding: 0;}
	.CantactUs .layer3 .NrBox{ width: 300px;}
	.CantactUs .layer3 .NrBox p{ font-size: 16px;}
	.AboutMYD .layer1Box .text{ width: 100%; padding: 20px;}
	.AboutMYD .layer1Box .text h2{ font-size: 20px;}
	.AboutMYD .layer1Box .text h2{ height: auto; padding: 15px 0; line-height: 30px;}
	.AboutMYD .layer1Box .text p{ font-size: 16px;}
	.AboutMYD .layer1Box .icon{ width: 100%; padding: 20px 0;}
	.AboutMYD .layer3 .ab2{ padding: 30px 55px; box-sizing: border-box;}
	.AboutMYD .layer3 .ab2 .intr h4{ font-size: 24px;}
	.AboutMYD .layer3 .ab2 .intr p{ font-size: 16px; margin-top: 20px; height: auto; line-height: 24px;}
	.AboutMYD .layer3 .ab2 .swiper2 .swiper-slide{ padding: 25px 0;}
	.AboutMYD .layer3 .ab2 .date{ bottom: 0;}
	.AboutMYD .layer3 .ab2 .date span{ font-size: 1.1em;}
	.AboutMYD .layer3 .ab2 .next{ width: 30px; height: 30px;}
	.AboutMYD .layer3 .ab2 .prev{ width: 30px; height: 30px;}
	.AboutMYD .layer3 .ab2 .bj{ width: 200%; height: auto;}
	.AboutMYD .layer4Box ul li{ width: 49%; float: left; margin: 0 2% 15px 0;}
	.Services .layer2 ul li:nth-child(5n){ margin-right:2%;}
	.AboutMYD .layer4Box ul li:nth-child(3n){ margin-right: 2%;}
	.AboutMYD .layer4Box ul li:nth-child(2n){ margin-right: 0;}
	
	.Services{ padding: 30px 0;}
	.Services .layer1{ width: 100%;}
	.Services .layer1 .icon{ width: 100%; height: auto;}
	.Services .layer1 .icon img{ width: 50%; height: auto; margin: 0 auto;}
	.Services .layer1 .text{ width: 100%; padding: 0 15px; box-sizing: border-box;}
	.Services .layer1 .text h2{ text-align: center; line-height: 46px; font-size: 20px;}
	.Services .layer1 .text span{ margin: 0 auto 15px auto;}
	.Services .layer1 .text p{ font-size: 16px; line-height: 26px;}
	.Services .layer2 ul li{ width: 49%; float: left; margin: 0 2% 0 0;}
	.Services .layer2 ul li:nth-child(2n){ margin-right: 0;}
	.Services .layer2 ul li .icon{ height: auto; height:29vw;}
	.Services .layer2 ul li .icon img{ object-fit:cover;}
	.Services .layer2 ul li .text{ font-size: 16px; line-height: 38px; overflow: hidden; height: 38px; padding: 0;}
	.Services .layer2 dl dd{ width: 49%; float: left; margin: 0 2% 0 0;}
	.Services .layer2 dl dd:nth-child(2n){ margin-right: 0;}
	.Services .layer2 dl dd .icon{ height: auto;}
	.Services .layer2 dl dd .text{ font-size: 16px;}
	.Services .layer3Box .con{ width: 100%; padding: 0;}
	.Services .layer3Box .con ul li .tit{ font-size:16px; height:auto; line-height:28px; padding:15px 45px 15px 15px;}
	.top .nav ul li .product_category{ display: none;}
	.CantactUs .layer3Box .swiper-button-next{ right: 15px;}
	.CantactUs .layer3Box .swiper-button-prev{ left: 15px;} 
	.indexContainer .layer2Right .swiper-button-next{ right: -25px;}
	.indexContainer .layer2Right .swiper-button-prev{ left: -25px;}
	.footer .footerBox{ padding: 30px 0 0 0;}
	.indexContainer .layer3Box p{ font-size: 20px;line-height: 33px;}
	.indexContainer .layer3{ height: 400px; background-attachment: scroll; background-size: 100% !important;}
	.footer{ background-size:290% 100%; background-position:center center; }
	.NewDetails .bt h2{ font-size:24px; line-height:32px;}
	.indexContainer .layer5 .Nr .text p{ font-size:14px; line-height:18px; height:54px; margin-bottom:20px;}
	.Services .layer3Box .con ul li .tit{ height:auto;}
	
	.ProList .layer2 .swiper-button-prev{ left: 1%;}
	.ProList .layer2 .swiper-button-next{ right: 1%;}
	.ProList .layer2 .swiper-button-next{ width:10px; height:18px;}
	.ProList .layer2 .swiper-button-prev{ width:10px; height:18px;}
}