@charset "utf-8";
*{margin:0;padding:0;outline:0;}
body,html{color:#333;font:16px/30px -apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif;background:#fff;}
blockquote,body,dd,div,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,input,li,ol,p,pre,td,textarea,th,ul{margin:0;padding:0;}
input[type=text],input[type=submit],textarea,button{-webkit-border-radius:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif;-webkit-appearance:none;}
input:focus{outline:0;}
textarea{resize:none;}
h1,h2,h3,h4,h5,h6{font-style:normal;font-size:100%;}
abbr,em,i,li,ol,ul{list-style-type:none;font-style:normal;}
img{border:0;vertical-align:middle;}
img{image-rendering:-moz-crisp-edges;image-rendering:-o-crisp-edges;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;-ms-interpolation-mode:nearest-neighbor;}
table{border-collapse:collapse;border-spacing:0;}
.clearfix{display:block;zoom:1;}
.clearfix:before{display:table;content:"";}
.clearfix:after{clear:both;display:block;visibility:hidden;height:0;content:"";}
* html .clearfix{height:1%;}
*{box-sizing:border-box;}
a{color:#333;text-decoration:none;-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;transition:.3s;-ms-transition:.3s;}
a:hover{color:#f16832;text-decoration:none;}
.hide,.none,ins{display:none;}
.fl{float:left;display:inline-block;}
.fr{float:right;display:inline-block;}

.wrap{clear:both;display:block;margin:0 auto;width:100%;padding:0 8%; max-width:1900px; box-sizing:border-box}
.nywrap{clear:both;display:block;margin:0 auto;width:100%;padding:0 8%; max-width:1400px; box-sizing:border-box}

.animate img{position:relative;opacity:1;-webkit-transition:.5s all;-moz-transition:.5s all;-o-transition:.5s all;transition:.5s all;-webkit-transform:scale(1,1) rotate(0);-ms-transition:.5s all;}
a:hover .animate img{-webkit-transform:scale(1.06,1.06);-moz-transform:scale(1.06,1.06);-o-transform:scale(1.06,1.06);transform:scale(1.06,1.06);-ms-transform:scale(1.06,1.06);}
.animate img:hover{-webkit-transform:scale(1.06,1.06);-moz-transform:scale(1.06,1.06);-o-transform:scale(1.06,1.06);transform:scale(1.06,1.06);-ms-transform:scale(1.06,1.06);}
.tran,.tran a,a.tran,.tran img{-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}

@font-face {
	font-family: "quicksand";
	src: url('../fonts/quicksand.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face{
	font-family:"din";
	src:url("../fonts/din-medium.woff") format("woff"),
		url("../fonts/din-medium.ttf") format("truetype"),
		url("../fonts/din-medium.eot") format("embedded-opentype"),
		url("../fonts/din-medium.svg") format("svg");
	font-weight:normal;
	font-style:normal;
}
@font-face {
	font-family: "RobotoCondensed-Light";
	src: url('../fonts/RobotoCondensed-Light-5.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

#top{ width:100%; background:#0cacb4}
#top .wrap{display: flex;justify-content:space-between ;align-items:center; line-height:40px}
#top .left span{ margin-right:10px; color:#fff}
#top .right{display: flex;align-items:center;justify-content:space-between ;}
#top .right .share{display: flex;}
#top .right .share i{ color:#fff; font-size:18px; margin-left:10px}
#top .right .lan{ padding-left:50px; box-sizing:border-box; position:relative}
#top .right .lan .title{display:flex;align-items:center; color:#fff; line-height:40px;height:40px}
#top .right .lan .title i{ margin-left:5px}
#top .right .lan .title i.fa-globe{ font-size:20px}
#top .right .lan .tisp{ background:#0cacb4; width:auto; position: absolute; right:0; top:40px; display:none; z-index:100; border:1px solid #fff}
#top .right .lan .tisp a{ display:block; text-align:center; border-bottom:1px solid rgba(255,255,255,.5); line-height:44px; color:#fff;padding:0 20px}
#top .right .lan .tisp a:last-child{ border:0}
#top .right .lan:hover .tisp{ display:block}

#header{ width:100%; background:#fff}
#header .wrap{ height:90px;display: flex;justify-content:space-between ;align-items:center;}
#header .logo img{ height:60px}
#header .right{display: flex;align-items:center}
#header .right .nav ul{display: flex;align-items:center}
#header .right .nav ul li{ position:relative}
#header .right .nav ul li h3 a{ color: #00183c !important;font-family: 'RobotoCondensed-Light', serif !important;font-weight:bold; padding:0 30px; display:block; font-size:16px; line-height:44px}
#header .right .nav ul li h3 a:hover{ background:#0cacb4; color:#fff}
#header .right .nav ul li.on h3 a{ background:#0cacb4; color:#fff}
#header .right .nav ul li.active h3 a{ background:#0cacb4; color:#fff}
#header .right .nav ul li .sub{ display:none; position:absolute; left:0; top:44px; z-index:99; width:360px; border:1px solid rgba(255,255,255,35)}
#header .right .nav ul li .sub p{ border-bottom:1px solid rgba(255,255,255,.5); background:#0cacb4; position:relative}
#header .right .nav ul li .sub p a{ color:#fff; padding:0 10px; line-height:44px;font-family: 'RobotoCondensed-Light', serif !important;}
#header .right .nav ul li .sub p:last-child{ border:0}
#header .right .search{ margin-left:50px}
#header .right .search i{ font-size:24px;}

#banner{ width:100%}
#banner .focus{ width:100%; overflow:hidden; position:relative}
#banner .focus img{ width:100%}

#product{ width:100%; padding:80px 0; background:#f6f6f7}
#product .title{display: flex;justify-content:space-between ;align-items:center;}
#product .title .left{ position:relative}
#product .title .left h2{ font-size:52px; color:#ebebec}
#product .title .left span{ color:#222; font-size:32px; position:absolute; left:0; bottom:-20px; font-weight:700}
#product .title .right{display: flex; max-width:80%}
#product .title .right a{ background:#0cacb4; padding:10px 40px; color:#fff; font-size:16px; line-height:1.3}
#product .title .right a:hover{ background:#f39800}
#product .list{ margin-top:50px}
#product .list ul{display: flex;align-items:flex-start;flex-wrap:wrap;gap:30px}
#product .list ul li{ width:calc((100% - 90px) / 4);}
#product .list ul li .img{ padding:20px; height:350px; background:#fff;box-shadow: 1px 1px 6px 0 rgba(0,0,0,0.05);display: flex;justify-content:center ;align-items:center; overflow:hidden}
#product .list ul li .img img{ max-width:100%;max-height:100%}
#product .list ul li p{ text-align:center; margin-top:20px; line-height:1.6}

#about{ width:100%; padding:150px 0; background:url(../images/bg_about.jpg) no-repeat center center; background-size:cover}
#about .aboutbox{display: flex;justify-content:space-between ;align-items:center;background:#fff}
#about .aboutbox .img{ width:40%}
#about .aboutbox .img img{width:100%;height:100%;object-fit:cover}
#about .aboutbox .text{ width:60%; padding:0 5%}
#about .aboutbox .text h2{ font-size:30px; font-weight:700}
#about .aboutbox .text .content{ margin-top:20px; font-size:16px; line-height:1.6}
#about .aboutbox .text .content p{ padding:5px 0}
#about .aboutbox .text .more{ margin-top:20px}
#about .aboutbox .text .more a{ display:inline-block; border:2px solid #0cacb4; padding:8px 40px; font-size:16px}
#about .aboutbox .text .more a:hover{background:#0cacb4; color:#fff}

#num{ width:100%; background:#f6f6f7}
#num .list{ background:#fff;display: flex;justify-content:space-between ;align-items:center;}
#num .list .item{ width:25%; padding:40px 0}
#num .list .item .num{ text-align:center; font-size:34px}
#num .list .item p{ text-align:center;; display:block; margin-top:10px; font-size:16px}

#news{ width:100%; padding:80px 0; background:#f6f6f7}
#news .title{display: flex;justify-content:space-between ;align-items:center;}
#news .title .left{ position:relative}
#news .title .left h2{ font-size:52px; color:#ebebec}
#news .title .left span{ color:#222; font-size:32px; position:absolute; left:0; bottom:-20px; font-weight:700}
#news .title .right{display: flex}
#news .list{ margin-top:50px}
#news .list ul{display: flex;align-items:center;flex-wrap:wrap;gap:30px}
#news .list ul li{ width:calc((100% - 30px) / 2); background:#fff; padding:30px 20px;box-shadow: 1px 1px 6px 0 rgba(0,0,0,0.05);}
#news .list ul li h2{ font-size:19px}
#news .list ul li time{ display:block; color:#999; margin-top:5px}
#news .list ul li .info{ line-height:1.5; font-size:15px; margin-top:20px}

#map{ width:100%; background:#0cacb4; padding:50px 0}
#map .wrap{display: flex;justify-content:space-between ;align-items:flex-start;gap:0}
#map .about{ width:30%}
#map .about .logo img{ height:50px}
#map .about .text{ margin-top:20px; line-height:1.5; color:#fff}
#map .nav{min-width:10%}
#map .nav h3{ font-size:18px; color:#fff; margin-bottom:10px}
#map .nav p{ line-height:1.8}
#map .nav p a{ color:#fff;}
#map .code{}
#map .code h3{ font-size:18px; color:#fff; margin-bottom:10px}
#map .code .img img{ width:140px}

#copyright{ width:100%; background:#007c82; padding:10px 0}
#copyright .wrap{display: flex;justify-content:space-between ;}
#copyright .left{color:#fff}
#copyright .right{display: flex;}
#copyright .right a{ margin-left:10px; color:#fff;}

@media (max-width:1500px){
	.wrap{padding:0 20px;}
	#header .right .nav ul li h3 a{padding:0 20px;}
	#map .wrap{gap:0 5%}
}
@media (max-width:1100px){
	#header .right .nav ul li h3 a{padding:0 10px;}
	#header .right .search{ margin-left:20px}
}
@media (max-width:900px){
	body,html{ width:100%;font-size:.22rem;line-height:.34rem;}	
	.wrap{ padding:0px .2rem}
	
	#top .wrap{line-height:.6rem; display:block}
	#top .left{ display:none}
	#top .right{ width:100%}
	#top .right .share{justify-content:space-between }
	#top .right .share i{ font-size:.22rem; margin-right:.1rem; margin-left:0}
	#top .right .lan{ padding-left:0}
	#top .right .lan .title{line-height:.6rem;height:.6rem}
	#top .right .lan .title i{ margin-left:.1rem}
	#top .right .lan .title i.fa-globe{ font-size:.26rem}
	#top .right .lan .tisp{right:0; left:auto; top:.6rem;}
	#top .right .lan .tisp a{  line-height:.6rem; font-size:.22rem;padding:0 .3rem}
	
	#header{position:relative; width:100%; }
	#header .wrap{height:1rem;}
	#header .logo img{height:.6rem}
	#header .right{overflow:hidden}
	#header .right .top{ display:none}	
	#header .right .nav{position:absolute;background:#fff;width:100%;top:1rem;z-index:105;padding:.1rem .25rem 0;left:0;border-top:1px solid #eee; margin-top:0; display:none}
	#header .right .nav ul{display:block}
	#header .right .nav ul li h3 a{line-height:.7rem;font-size:.22rem;padding:0; display:block;border-bottom:1px solid #eee; color:#333}
	#header .right .nav ul li.on h3 a{ background:#fff; color:#0cacb4; font-weight:700}
	#header .right .nav ul li .sub{position:inherit;top:0; width:100%; border:0}
	#header .right .nav ul li .sub p{ border-bottom:1px solid #eee; background:#fff}
	#header .right .nav ul li .sub p a{ color:#333; padding:0 .25rem; line-height:.6rem}
	#header .right .nav ul li .sub p:last-child{border-bottom:1px solid #eee;}
	#header .right .nav.isopen{ display:block}	
	#header .right .mnav{position:relative;display:block;width:.34rem;height:.33rem;cursor:pointer;margin-left:.1rem}
	#header .right .mnav span{position:absolute;display:block;width:.34rem;height:.05rem;background:#0cacb4;transition:all .5s;border-radius:.05rem}
	#header .right .mnav .s1{top:0;}
	#header .right .mnav .s2{top:.1rem;width:.26rem;}
	#header .right .mnav .s3{top:.2rem;}
	#header .right .mnav.isopen .s1{top:.1rem;transform:rotate(45deg);}
	#header .right .mnav.isopen .s2{width:0;opacity:0;}
	#header .right .mnav.isopen .s3{top:.1rem;transform:rotate(-45deg);}
	#header .right .search{ margin-right:.2rem}
	#header .right .search i{ font-size:.3rem;}
	
	#map{padding:.5rem 0}
	#map .wrap{display: block;}
	#map .about{ width:100%}
	#map .about .logo img{ height:.8rem}
	#map .about .text{ margin-top:.2rem; line-height:1.6; font-size:.22rem}
	#map .nav{ width:100%; margin-top:.5rem}
	#map .nav h3{ font-size:.3rem; margin-bottom:.2rem}
	#map .nav p{ line-height:1.6}
	#map .nav p a{ color:#fff; font-size:.22rem;}
	#map .code{ margin-top:.5rem}
	#map .code h3{ font-size:.3rem; margin-bottom:.2rem}
	#map .code .img img{ width:2rem}
	
	#copyright{padding:.2rem 0}
	#copyright .wrap{display: block;}
	#copyright .left{ text-align:center}
	#copyright .right{display: flex; text-align:center;justify-content:center;}
	#copyright .right a{ margin-left:.1rem; color:#fff;}
}
@media (max-width:800px){
	
	#product{padding:.8rem 0;}
	#product .title{display:block;}
	#product .title .left h2{ font-size:.5rem; }
	#product .title .left span{font-size:.38rem;bottom:-.2rem;}
	#product .title .right{ margin-top:.5rem;flex-wrap:wrap;gap:.1rem; max-width:100%}
	#product .title .right a{ padding:.1rem .2rem;font-size:.2rem; width:100%}
	#product .list{ margin-top:.5rem}
	#product .list ul{gap:.2rem}
	#product .list ul li{ width:calc((100% - .2rem) / 2);}
	#product .list ul li .img{ padding:.2rem; height:3.5rem;}
	#product .list ul li p{ margin-top:.2rem; font-size:.22rem}
	#product .list ul li p{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical}
	
	#about{ padding:1.5rem 0;}
	#about .aboutbox{display: block;}
	#about .aboutbox .img{ width:100%}
	#about .aboutbox .text{ width:100%; padding:.4rem}
	#about .aboutbox .text h2{ font-size:.3rem;}
	#about .aboutbox .text .content{ margin-top:.2rem; font-size:.22rem;}
	#about .aboutbox .text .content p{ padding:.2rem 0}
	#about .aboutbox .text .more{ margin-top:.2rem}
	#about .aboutbox .text .more a{ padding:.08rem .4rem; font-size:.22rem}
	
	#num .list{flex-wrap:wrap; padding:.1rem 0}
	#num .list .item{ width:50%; padding:.3rem 0}
	#num .list .item .num{font-size:.5rem}
	#num .list .item p{ margin-top:.1rem; font-size:.22rem}
	
	#news{padding:.8rem 0;}
	#news .title{display:block;}
	#news .title .left h2{ font-size:.5rem; }
	#news .title .left span{font-size:.38rem;bottom:-.2rem;}
	#news .title .right{ margin-top:.5rem;flex-wrap:wrap;gap:.1rem}
	#news .title .right a{ padding:.1rem .2rem;font-size:.2rem; width:calc((100% - .1rem) / 2)}
	#news .list{ margin-top:.5rem}
	#news .list ul{gap:.3rem 0}
	#news .list ul li{ width:100%; padding:.3rem .3rem}
	#news .list ul li h2{ font-size:.26rem; line-height:1.5}
	#news .list ul li time{ margin-top:.1rem}
	#news .list ul li .info{font-size:.22rem; margin-top:.2rem}
}

#nbanner{ height:400px; background-repeat:no-repeat; background-position:center center; background-size:cover}
#local{ width:100%; padding:10px 0}
#local a{ margin:0 5px}

#main{ width:100%; background:#f6f6f7; padding:50px 0}
#main .wrap{display: flex;justify-content:space-between ;align-items:flex-start;}
#main .left{ width:280px}
#main .left .clist{ background:#fff}
#main .left .clist .title{ background:#0cacb4; color:#fff; padding:10px 20px; font-size:20px;}
#main .left .clist .list ul li{ border-bottom:1px solid #eee}
#main .left .clist .list ul li a{ padding:10px 20px; display:block; line-height:1.4}
#main .left .contact{ background:#fff; margin-top:20px}
#main .left .contact .title{ background:#0cacb4; color:#fff; padding:10px 20px; font-size:20px;}
#main .left .contact .content{ padding:20px; line-height:2}
#main .product{ width:calc(100% - 320px)}
#main .product .title{ font-size:24px; font-weight:700; line-height:1.8}
#main .product .list{ margin-top:20px}
#main .product .list ul{display: flex;justify-content:flex-start;align-items:flex-start;flex-wrap:wrap;gap:30px}
#main .product .list ul li{ width:calc((100% - 60px) / 3);}
#main .product .list ul li .img{ padding:20px; background:#fff;box-shadow: 1px 1px 6px 0 rgba(0,0,0,0.05);}
#main .product .list ul li .img{height:370px; display: flex;justify-content:center ;align-items:center; overflow:hidden}
#main .product .list ul li .img img{ max-width:100%;max-height:100%}
#main .product .list ul li p{ text-align:center; padding:20px 10px; font-size:16px; line-height:1.6}

#main .about{ width:calc(100% - 320px)}
#main .about .title{ font-size:24px; font-weight:700; line-height:1.8}
#main .about .content{ padding:20px 0; font-size:16px; line-height:1.8}
#main .about .content p{ padding-bottom:10px}
#main .about .content img{ max-width:100%}
#main .about .piclist{ margin-top:20px}
#main .about .piclist ul{display: flex;justify-content:flex-start;align-items:flex-start;gap:0 20px}
#main .about .piclist ul li img{ width:100%}

#main .news{ width:calc(100% - 320px)}
#main .news .title{ font-size:24px; font-weight:700; line-height:1.8}
#main .news .list ul li{ background:#fff; padding:20px; margin-top:20px;}
#main .news .list ul li a{display: flex;justify-content:space-between ;align-items:center;}
#main .news .list ul li .img{ width:25%}
#main .news .list ul li .img img{ width:100%}
#main .news .list ul li .info{ width:72%}
#main .news .list ul li .info h2{ font-size:18px}
#main .news .list ul li .info time{ display:block; margin-top:10px}
#main .news .list ul li .info p{line-height:1.6; margin-top:10px}

#main .down{ width:calc(100% - 320px)}
#main .down .title{ font-size:24px; font-weight:700; line-height:1.8}
#main .down .list ul li{ background:#fff; padding:20px; margin-top:10px;display: flex;justify-content:space-between ;align-items:center;}
#main .down .list ul li h2{ font-size:18px}
#main .down .list ul li span a{ background:#0cacb4; color:#fff; border-radius:6px; padding:0 10px; line-height:40px; display:inline-block}

#main .rcontact{ width:calc(100% - 320px)}
#main .rcontact .company h2{ font-size:20px; font-weight:700; line-height:1.8; margin-bottom:20px}
#main .rcontact .company p{ font-size:16px; display:flex;align-items:center;justify-content:space-between; padding:10px 0}
#main .rcontact .company p i{ width:36px; height:36px; border-radius:36px; background:#0cacb4;display:flex;align-items:center;justify-content:center; color:#fff;}
#main .rcontact .company p em{ width:calc(100% - 50px)}
#main .rcontact .msg{ margin-top:30px}
#main .rcontact .msg .title{ font-size:20px; font-weight:700; line-height:1.8; margin-bottom:20px}
#main .rcontact .msg .form{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px 2%}
#main .rcontact .msg .form .item{ width:49%}
#main .rcontact .msg .form .item label{ display:block}
#main .rcontact .msg .form .item label font{ color:#f00}
#main .rcontact .msg .form .item .input{ border:1px solid #eee; background:#fff; line-height:50px; width:100%; text-indent:20px}
#main .rcontact .msg .form .item2{ width:100%}
#main .rcontact .msg .form .item2 label{ display:block}
#main .rcontact .msg .form .item2 .textarea{ border:1px solid #eee; background:#fff; line-height:50px; width:100%; text-indent:20px; height:200px}
#main .rcontact .msg .button{ text-align:center; margin-top:20px}
#main .rcontact .msg .button .btn{ border:0; background:#0cacb4; line-height:50px; padding:0 50px; color:#fff; font-size:16px}

#main .view{ max-width:1200px; margin:0 auto}
#main .view .title{text-align: center}
#main .view .title h1{ font-size:24px; font-weight:700; text-align: center; padding:20px 0}
#main .view .title .info{ text-align:center; border-bottom:1px solid #eee;}
#main .view .content{ padding:20px 0; line-height:1.8; font-size:16px}
#main .view .content p{ margin-bottom:20px}
#main .view .content img{ max-width:800px}
#main .view .content span{ text-wrap: normal;}
#main .view .uppage{ border-top:1px solid #eee; margin-top:20px; padding-top:20px}

#pro_view{ width:100%; padding:50px 0; background:#f0f0f0;}
#pro_view .wrap{display:flex;justify-content:space-between;}
#pro_view .nywrap{display:flex;justify-content:space-between;}
#pro_view .focus{ width:480px; overflow:hidden}
#pro_view .focus .bigpic { width: 100%;height:480px; border:1px solid #ddd; box-sizing:border-box; background:#fff}
#pro_view .focus .bigpic .swiper-slide { height:480px; overflow:hidden;background-size: cover;background-position: center;display: flex;justify-content:center ;align-items:center;}
#pro_view .focus .bigpic .swiper-slide img {display: block;max-width: 100%; max-height: 100%;}
#pro_view .focus .smallpic {box-sizing: border-box;padding: 10px 0;}
#pro_view .focus .smallpic .swiper-slide {width: 20%;height:80px;opacity: 0.4; border:2px solid #ddd;display: flex;justify-content:center ;align-items:center; background:#fff; padding:2px;}
#pro_view .focus .smallpic .swiper-slide-thumb-active {opacity: 1; border:2px solid #c2292d;}
#pro_view .focus .smallpic .swiper-slide img {display: block;max-width: 100%; max-height: 100%;object-fit: cover;}
#pro_view .right{ width:calc(100% - 500px);}
#pro_view .right h1{ font-size:26px; line-height:1.4}
#pro_view .right .info{line-height:1.8; color:#666; margin-top:20px;background: #fafafa;
    border-radius: 6px 6px 6px 6px;
    padding: 13px 23px 15px 23px;}
	#pro_view .right .info .infon{height: 48px;
    font-size: 16px;
    font-family: PingFang SC-Medium,PingFang SC;
    font-weight: 500;
    line-height: 48px;
    color: #505050;
	border-bottom:#ddd 1px solid;padding:0 20px 5px 20px;display:block;}

#pro_content{ width:100%; background:#f6f6f7; padding:0 0 50px; }
#pro_content .tabbox{ border:1px solid #ddd}
#pro_content .title{ height: 46px;
    font-size: 20px;
    font-family: Poppins-Medium,Poppins;
    font-weight: 600;
    color: #0cacb4;
    line-height: 28px;
    padding-top:20px;
	margin-bottom:20px;
}
#pro_content .tabbox .tabs{ background:#f2f2f2; display:flex}
#pro_content .tabbox .tabs a{padding:10px 25px; font-size:16px;font-family: 'RobotoCondensed-Light', serif !important;}
#pro_content .tabbox .tabs a.active{ background:#fff; color:#0cacb4; position:relative; font-weight:700}
#pro_content .tabbox .tabs a.active::before{position:absolute;top:-1px;left:0;content:'';height:3px; width:100%; background:#0cacb4}
#pro_content .tabbox .listbox{ overflow:hidden}
#pro_content .tabbox .listbox .mycontent{ padding:20px; line-height:1.9; font-size:16px;font-family: 'RobotoCondensed-Light', serif !important;}
#pro_content  .listbox .mycontent table tr td{border: #999 1px solid;}
#pro_content  .listbox .mycontent img{ max-width:1100px; height:auto !important}

#pro_send{ width:100%; background:#f6f6f7; padding:0 0 50px; }
#pro_send .box{ border:1px solid #ddd; padding:20px}
#pro_send .title{ color:#0cacb4; font-weight:700; font-size:18px}
#pro_send .listbox{ margin-top:30px}
#pro_send .listbox .form{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px 2%}
#pro_send .listbox .form .item{ width:49%}
#pro_send .listbox .form .item label{ display:block}
#pro_send .listbox .form .item label font{ color:#f00}
#pro_send .listbox .form .item .input{ border:1px solid #eee; background:#fff; line-height:50px; width:100%; text-indent:20px}
#pro_send .listbox .form .item2{ width:100%}
#pro_send .listbox .form .item2 label{ display:block}
#pro_send .listbox .form .item2 .textarea{ border:1px solid #eee; background:#fff; line-height:50px; width:100%; text-indent:20px; height:200px}
#pro_send .listbox .button{margin-top:20px}
#pro_send .listbox .button .btn{ border:0; background:#0cacb4; line-height:50px; padding:0 50px; color:#fff; font-size:16px}

@media (max-width:800px){
	body,html{ width:100%;font-size:.22rem;line-height:.34rem;}	
	.wrap{ padding:0px .2rem}
	
	#nbanner{ height:3rem;}
	#local{ width:100%; padding:.2rem 0; font-size:.2rem}
	#local a{ margin:0 .05rem; font-size:.2rem}
		
	#main{padding:.5rem 0}
	#main .wrap{display:block;}
	#main .left{ width:100%}
	#main .left .clist .title{ padding:.2rem .2rem; font-size:.24rem;}
	#main .left .clist .list ul li a{ padding:.2rem .2rem}
	#main .left .contact{ display:none}
	#main .product{ width:100%; margin-top:.5rem}
	#main .product .title{ font-size:.3rem;}
	#main .product .list{ margin-top:.2rem}
	#main .product .list ul{gap:.3rem}
	#main .product .list ul li{ width:100%;}
	#main .product .list ul li .img{ padding:.2rem; height:5rem}
	#main .product .list ul li p{padding:.2rem; font-size:.22rem;}
	
	#main .about{ width:100%; margin-top:.5rem}
	#main .about .title{font-size:.3rem;}
	#main .about .content{ padding:.2rem 0; font-size:.22rem; line-height:1.6}
	#main .about .content p{ padding-bottom:.2rem}
	#main .about .piclist{ margin-top:.2rem}
	#main .about .piclist ul{gap:0 .2rem;flex-wrap:wrap;gap:.2rem;}
	#main .about .piclist ul li{ width:calc((100% - .2rem) / 2)}
	
	#main .news{ width:100%; margin-top:.5rem}
	#main .news .title{font-size:.3rem;}
	#main .news .list ul li{ background:#fff; padding:.2rem; margin-top:.2rem;}
	#main .news .list ul li a{display: flex;justify-content:space-between ;align-items:center;}
	#main .news .list ul li .img{ width:30%}
	#main .news .list ul li .img img{ width:100%}
	#main .news .list ul li .info{ width:66%}
	#main .news .list ul li .info h2{ font-size:.22rem; line-height:1.4}
	#main .news .list ul li .info time{ display:block; margin-top:.1rem; font-size:.2rem; color:#777}
	#main .news .list ul li .info p{ display:none}
	
	#main .down{ width:100%; margin-top:.5rem}
	#main .down .title{font-size:.3rem;}
	#main .down .list ul li{ background:#fff; padding:.2rem; margin-top:.2rem;display: block;}
	#main .down .list ul li h2{ font-size:.22rem; line-height:1.4}
	#main .down .list ul li span{ display:block; margin-top:.1rem}
	#main .down .list ul li span a{padding:0 .1rem; line-height:.4rem;}
		
	#main .rcontact{ width:100%;}
	#main .rcontact .company h2{ font-size:.26rem;margin-bottom:.2rem}
	#main .rcontact .company p{ font-size:.22rem; padding:.1rem 0}
	#main .rcontact .company p i{ width:.4rem; height:.4rem; border-radius:.4rem; margin-right:.1rem;}
	#main .rcontact .company p em{ width:calc(100% - .5rem)}
	#main .rcontact .msg{ margin-top:.3rem}
	#main .rcontact .msg .title{ font-size:.26rem; margin-bottom:.2rem}
	#main .rcontact .msg .form{display: block;}
	#main .rcontact .msg .form .item{ width:100%; margin-top:.2rem}
	#main .rcontact .msg .form .item .input{ line-height:.6rem; text-indent:.2rem}
	#main .rcontact .msg .form .item2{ width:100%;margin-top:.2rem}
	#main .rcontact .msg .form .item2 .textarea{line-height:.6rem;text-indent:.2rem; height:2rem}
	#main .rcontact .msg .button{margin-top:.2rem}
	#main .rcontact .msg .button .btn{line-height:.6rem; padding:0 .5rem; font-size:0.22rem}
	
	#main .view{ max-width:100%;}
	#main .view .title h1{ font-size:.3rem; padding:.2rem 0}
	#main .view .title .info{ font-size:.2rem}
	#main .view .content{ padding:.2rem 0; line-height:1.8; font-size:.22rem}
	#main .view .content p{ margin-bottom:.2rem}
	#main .view .content img{ max-width:100%}
	#main .view .uppage{margin-top:.2rem; padding-top:.2rem}
	
	#pro_view{padding:.5rem 0;}
	#pro_view .wrap{display:block;}
	#pro_view .nywrap{display:block;}
	#pro_view .focus{ width:100%;}
	#pro_view .focus .bigpic { width: 100%; height:4.8rem}
	#pro_view .focus .bigpic .swiper-slide { height:4.8rem; }
	#pro_view .focus .smallpic {padding: .1rem 0;}
	#pro_view .focus .smallpic .swiper-slide {width: 20%;height:1rem;border:2px solid #ddd;padding:2px;}
	#pro_view .right{ width:100%; margin-top:.5rem}
	#pro_view .right h1{ font-size:.3rem;}
	#pro_view .right .info{line-height:1.6; color:#666; margin-top:.2rem; font-size:.22rem}
	
	#pro_content{padding:0 0 .5rem; }
	#pro_content .tabbox .tabs{ background:#f2f2f2;display: flex;}
	#pro_content .tabbox .tabs a{ line-height:.5rem; height:1rem; width:33.3%; padding:.05rem 0; font-size:.22rem; text-align:center; line-height:1.4;display: flex;justify-content:center ;align-items:center;}
	#pro_content .tabbox .listbox .mycontent{ padding:.2rem; line-height:1.8; font-size:.22rem}
	
	#pro_send{padding:0 0 .5rem; }
	#pro_send .box{padding:.2rem}
	#pro_send .title{ font-size:.24rem}
	#pro_send .listbox{ margin-top:.3rem}
	#pro_send .listbox .form{display: block;}
	#pro_send .listbox .form .item{ width:100%; margin-top:.2rem}
	#pro_send .listbox .form .item .input{ line-height:.6rem; text-indent:.2rem}
	#pro_send .listbox .form .item2{ width:100%;margin-top:.2rem}
	#pro_send .listbox .form .item2 .textarea{line-height:.6rem;text-indent:.2rem; height:2rem}
	#pro_send .listbox .button{margin-top:.2rem}
	#pro_send .listbox .button .btn{line-height:.6rem; padding:0 .5rem; font-size:0.22rem}
}
#fenye{padding:50px 0;text-align:center;clear:both;}
#fenye a{margin:0 2px;color:#5a5a5a;text-decoration:none;padding:10px 15px;border:1px solid #eee; background:#FFF}
#fenye .prev,#fenye .next{width:52px;text-align:center}
#fenye a.page-num-current{font-weight:700;color:#fff;background:#0cacb4;border:1px solid #0cacb4}
#fenye a:hover{background:#0cacb4;color:#fff;border:1px solid #0cacb4}
#fenye span{margin:0 2px;color:#5a5a5a;text-decoration:none;padding:10px 15px;border:1px solid #eee;background:#FFF}

@media (max-width:900px){	
	#fenye{padding:.5rem 0 0px;}
	#fenye a{margin:0 .02rem;padding:.1rem .15rem}
	#fenye .prev,#fenye .next{width:.55rem;}
	#fenye span{margin:0 .02rem;padding:.1rem .15rem}
	#fenye .page-num{ display:none}
}

.details_list_wrap{ background: #ffffff;
width:1200px;
    border-radius: 6px 6px 6px 6px;
    padding: 24px 20px 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start background: #ffffff;
    }
	
.details_list_wrap .item{	 display: inline-block;
    width: 340px;
    margin-right: 65px;
    margin-bottom: 32px;}
	
.details_list_wrap .item:nth-child(3n) {
    margin-right: 0
}
.details_list_wrap .item .itemTitle{font-size: 16px;
    font-family: PingFang SC-Semibold,PingFang SC;
    font-weight: 600;
    line-height: 30px;
    border-bottom: 1px solid #c8c8c8;
    color: #505050;
    overflow: hidden;
    text-overflow: ellipsis}
	
	.details_list_wrap .item .itemValue {
    font-size: 16px;
    font-family: PingFang SC-Regular,PingFang SC;
    font-weight: 400;
    color: #323232;
    line-height: 30px;
    margin-top: 10px
}
.icon-button {
    display: inline-block;
    height: 56px !important;
    text-align: center;
    padding: 13px 30px !important;
    line-height: 21px !important;
    border-radius: 6px !important;
    font-size: 18px !important;
    font-weight: normal !important;
    text-transform: capitalize;
    outline: 0;
    -webkit-transition: background-color .2s ease-in-out;
    -moz-transition: background-color .2s ease-in-out;
    -o-transition: background-color .2s ease-in-out;
    -ms-transition: background-color .2s ease-in-out;
    transition: background-color .2s ease-in-out;
    cursor: pointer;
    background-image: none !important
}
.icon-button:first-of-type {
    margin: 48px 36px 0 0 !important
}
.icon-button:last-of-type {
    margin: 48px 0 0 -4px !important;
    width: 300px
}

 .buttonClass2 {
    background-color: #0cacb4 !important;
    border-color: #0cacb4 !important;
    color: #fff !important;
    border: none !important;
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis
}

.buttonClass1 {
    background-color: #fff;
    border-radius: 6px 6px 6px 6px;
    border: 1px solid #0cacb4 !important;
    font-size: 18px;
    font-family: PingFang SC-Regular,PingFang SC;
    font-weight: 400;
    color: #0cacb4 !important;
    line-height: 21px;
    width: 260px;
    overflow: hidden;
    text-overflow: ellipsis
}

.buttonClass1 span {
    overflow: hidden;
    max-width: 160px
}

.buttonClass1 a {
    color: #0cacb4 !important;
    overflow: hidden;
    max-width: 160px
}

.buttonClass1:hover a {
    color: #fff !important
}

. .buttonClass1:hover {
    border-color: #0cacb4 !important;
    background-color: #0cacb4 !important;
    color: #fff !important
}