/*************************************************************************/
/*全局样式开始*/
/*************************************************************************/
@charset "utf-8";
*{margin:0;padding:0;outline:0;}
body,html{overflow-x:hidden;color:#333;font:14px/30px "思源黑体","Source Han Sans CN","微软雅黑","Microsoft YaHei", "Helvetica Neue", Helvetica, STHeiTi, 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:"思源黑体","Source Han Sans CN","微软雅黑","Microsoft YaHei", "Helvetica Neue", Helvetica, STHeiTi, 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:#0267af;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;max-width:1400px;width:100%; padding:0 0}
.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;}
.rotate,.rotate2 img{-webkit-transition:all 0.8s;-moz-transition:all 0.8s;transition:all 0.8s;-ms-transition:all 0.8s;}
a:hover .rotate,a:hover rotate2 img{-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg);-webkit-transition:all 0.8s;-moz-transition:all 0.8s;transition:all 0.8s;-ms-transition:all 0.8s;}
.bor_box::after,.bor_box::before{pointer-events:none;}
.bor_box::after,.bor_box::before{position:absolute;top:20px;right:20px;bottom:20px;left:20px;content:'';opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;}
.bor_box::before{border-top:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:scale(0,1);transform:scale(0,1);}
.bor_box::after{border-right:1px solid #fff;border-left:1px solid #fff;-webkit-transform:scale(1,0);transform:scale(1,0);}


@font-face {
	font-family: "quicksand";
	src: url('../fonts/quicksand.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

#header{ width:100%; padding:0 50px; height:130px;display: flex;justify-content:space-between ;align-items:flex-end;position:relative}
#header .wrap{ }
#header .logo{ padding:35px 0 35px}
#header .logo img{ height:65px}
#header .right{display: flex;justify-content:space-between ;align-items:center; padding-top:40px}
#header .right .nav ul{display: flex;justify-content:space-between ;align-items:center;}
#header .right .nav ul li{ margin-left:50px;}
#header .right .nav ul li h3 span{ display:none}
#header .right .nav ul li h3 a{ font-size:16px; font-weight:normal; line-height:70px;padding:8px 0; position:relative; display:block}
#header .right .nav ul li h3 a::before{position:absolute;bottom:-16px;left:50%; margin-left:-8px;content:''; border: 8px solid transparent;border-bottom-color:#fff;transform:rotate(180deg); z-index:90; opacity:0}
#header .right .nav ul li h3 a::after {position: absolute;left: 0;bottom:30px;width: 100%;height: 1px;background-color: #005bac;content: ""; opacity:0}
#header .right .nav ul li:hover h3 a::before,
#header .right .nav ul li.currclass h3 a::after,
#header .right .nav ul li:hover h3 a::after{ opacity:1}
#header .right .nav ul li.currclass h3 a,
#header .right .nav ul li:hover h3 a{ font-weight:700; color:#0267af}
#header .right .nav ul li .sub{ display:none; position:absolute; left:0; width:100%; top:130px; background:rgba(255,255,255,.9); z-index:88; border-radius:4px}
#header .right .nav ul li .sub dl{ padding:25px 0;display: flex;justify-content:center ;align-items:center;}
#header .right .nav ul li .sub a{ text-align:center; margin:0 30px; font-size:16px}
#header .right .lan{display: flex;justify-content:space-between ;align-items:center; border:1px solid #0267af; border-radius:4px; overflow:hidden; line-height:26px;}
#header .right .lan span{ background:#0267af; color:#fff; width:28px; text-align:center; font-size:14px}
#header .right .lan span a{ color:#fff; display:block}
#header .right .lan span+span{background:#fff; color:#0267af}
#header .right .lan span+span a{color:#0267af}
#header .right .mnav{ display:none}
#header .right .search{ width:250px; border:1px solid #0267af; line-height:34px; border-radius:34px; position:absolute; right:50px; top:20px}
#header .right .search .key{ width:100%; line-height:34px; border:0; background:none; text-indent:20px}
#header .right .search .btn{ position:absolute; right:20px; top:0; line-height:34px; border:0; background:none}

#banner{ position:relative; overflow:hidden}
#banner .swiper-slide{ position:relative;}
#banner .swiper-slide img{ width:100%}
#banner .swiper-slide .text{ position:absolute; left:0; top:0; width:100%; height:100%;display: flex;;align-items:center;justify-content:center;}
#banner .swiper-slide .text .box{ text-align:center}
#banner .swiper-slide .text .box h3{ font-size:46px; color:#fff}
#banner .swiper-slide .text .box p{ font-size:28px; color:#fff; margin-top:30px; font-family:"quicksand"}

      .swiper-pagination-bullet {
        width: 20px;
        height: 20px;
        text-align: center;
        line-height: 20px;
        font-size: 12px;
        color: #fff;
        opacity: 1;
        background: rgba(0, 0, 0, 0.2);
      }

      .swiper-pagination-bullet-active {
        color: #fff;
        background: #007aff;
      }
	  
.htitle{display: flex;justify-content:space-between;align-items:center;}
.htitle .left h2{ font-size:36px; color:#0267af}
.htitle .left p{ font-size:20px; margin-top:20px; color:#0267af; width:80%; opacity:.8}
.htitle .more{ height:30px; width:30px; border:1px solid #0267af; border-radius:30px; position:relative}
.htitle .more .txt{ position: absolute;left:10px; top:0; white-space: nowrap; width:0; overflow:hidden; line-height:28px; color:#0267af}
.htitle .more i{ width:28px; height:28px; text-align:center; position:absolute; right:0; top:0; line-height:28px; color:#0267af; font-size:18px}
.htitle .more:hover{ width:100px}
.htitle .more:hover .txt{ width:70px}

.line-box{position: absolute;left: 0;top: 0;width: 100%;height: 100%;}
.line-box div{height: 100%;width: 25%;display: inline-block;vertical-align: top;}
.line-box div:last-child{border-right: 1px solid rgba(160,160,160,0.2);}

#product{ width:100%;}
#product .wrap{ padding:100px 0; background:url(../images/bg_a.png) no-repeat right 130px; position:relative}
#product .list{ margin-top:60px; position:relative; z-index:2}
#product .list ul{display: flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:30px 30px}
#product .list ul li{ width:calc((100% - 90px) / 4);-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
#product .list ul li .img{ overflow:hidden; text-align: center}
#product .list ul li .img img{ width:66%}
#product .list ul li p{ background:#0267af; color:#fff; font-size:16px; text-align:center; line-height:40px; display:none}
#product .list ul li a{ display:block}
#product .list ul li:hover a{
	-webkit-transition: transform 0.5s;
	-moz-transition: transform 0.5s;
	-ms-transition: transform 0.5s;
	-o-transition: transform 0.5s;
	transition: transform 0.5s;
	-webkit-transform: rotateY(-360deg);
	-moz-transform: rotateY(-360deg);
	-ms-transform: rotateY(-360deg);
	-o-transform: rotateY(-360deg);
	transform: rotateY(-360deg);
}
#product .list ul li:hover img{
	-webkit-transform: rotateY(360deg);
	-moz-transform: rotateY(360deg);
	-ms-transform: rotateY(360deg);
	-o-transform: rotateY(360deg);
	transform: rotateY(360deg);
}
#product .arrow{display: block;margin: 0 auto;position: relative;-webkit-animation: arrow 1s infinite both;-moz-animation: arrow 1s infinite both;-ms-animation: arrow 1s infinite both;-o-animation: arrow 1s infinite both;animation: arrow 1s infinite both; text-align:center; top:-90px}
@-webkit-keyframes arrow{100%{-webkit-transform: translateY(100%);}}
@-moz-keyframes arrow{100%{-moz-transform: translateY(100%);}}
@-ms-keyframes arrow{100%{-ms-transform: translateY(100%);}}
@-o-keyframes arrow{100%{-o-transform: translateY(100%);}}
@keyframes arrow{100%{transform: translateY(100%);}}

#solution{ width:100%; background:#f6f7f8}
#solution .wrap{ background:url(../images/bg_s.png) no-repeat right 40px; padding:70px 0; position:relative}
#solution .list{ margin-top:30px; position:relative; z-index:2}
#solution .list ul{display: flex;justify-content:space-between;align-items:flex-start;gap:30px;flex-wrap:wrap;}
#solution .list ul li{ width:calc((100% - 60px) / 3);-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
#solution .list ul li .img{ overflow:hidden; position:relative}
#solution .list ul li .img .box{ position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(2,103,175,0.67);display: flex;justify-content:center;align-items:center; opacity:0}
#solution .list ul li .img .box i{ font-size:44px; color:#fff}
#solution .list ul li .img img{ width:100%}
#solution .list ul li p{ background:#3384ca; color:#fff; font-size:20px; line-height:30px; padding:20px 15px; position:relative; font-weight:700}
#solution .list ul li p::before{position:absolute;top:-16px;left:30px;content:''; border:8px solid transparent;border-bottom-color:#3384ca;z-index:90;}
#solution .list ul li:hover{box-shadow: 0 0 50px rgba(0,0,0,0.3);z-index: 1;}
#solution .list ul li:hover .img .box{ opacity:1}
#solution .list ul li:hover p{ background:#6da7d9}
#solution .list ul li:hover p::before{border-bottom-color:#6da7d9;}


#news{ width:100%; padding:70px 0;}
#news .list{ margin-top:40px}
#news .list ul{display: flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;}
#news .list ul li{ width:calc((100% - 150px) / 6)}
#news .list ul li .img{ overflow:hidden; border:1px solid #eee}
#news .list ul li .img img{ width:100%}
#news .list ul li p{ margin-top:10px; text-align:center}



#about{ width:100%; padding:120px 0; background:url(../images/about_bg.jpg) no-repeat center center; background-size:cover}
#about .wrap{display: flex;justify-content:space-between;align-items:center;}
#about .left{ width:48%}
#about .left .title{display: flex;justify-content:space-between;align-items:center;}
#about .left .title h2{ font-size:32px; color:#fff}
#about .left .title .more{ height:30px; width:30px; border:1px solid #fff; border-radius:30px; position:relative}
#about .left .title .more .txt{ position: absolute;left:10px; top:0; white-space: nowrap; width:0; overflow:hidden; line-height:28px; color:#fff}
#about .left .title .more i{ width:28px; height:28px; text-align:center; position:absolute; right:0; top:0; line-height:28px; color:#fff; font-size:18px}
#about .left .title .more:hover{ width:100px}
#about .left .title .more:hover .txt{ width:70px}
#about .left .text{ margin-top:30px; font-size:16px; line-height:2.2; color:#fff}
#about .left .text p{ padding:10px 0}
#about .right{ width:48%}
#about .right img{ max-width:100%}


#map{ width:100%; padding:50px 0}
#map .wrap{display: flex;justify-content:space-between;align-items:flex-start;}
#map .logo{ padding-right:100px}
#map .logo .info{ margin-top:10px}
#map .logo .info p{ font-size:18px; font-weight:bold; color:#0267af}
#map .logo .info .qrcode{ margin-top:10px}
#map .logo .info .qrcode img{ width:70px}
#map .tel{ margin-top:30px; font-size:20px; color:#0267af; font-family:"din";}
#map .tel i{ margin-right:5px; width:20px;}
#map .item h2{margin-bottom:10px; }
#map .item h2 a{ color:#0267af; font-weight:700;font-size:16px}
#map .item a{line-height:28px;color:rgba(0,0,0,.5);}
#map .item .list{display: flex;justify-content:space-between;align-items:center;flex-wrap:wrap; width:300px}
#map .item .list p{ width:150px}

#copyright{ width:100%; padding:5px 0; border-top:1px solid #eee; text-align:center; color:rgba(0,0,0,.5); font-size:12px}
#copyright a{ color:#999; margin-left:10px}

@media (max-width:1400px){
	.wrap{ padding:0 20px}
	#header{padding:0 20px; }
	#header .right .search{ right:20px;}
	#header .right .nav ul li{ margin-left:20px;}
	#header .right .nav ul li h3 a{ font-size:16px;}
	#header .right .lan{ margin-left:30px;}
}
@media (max-width:1100px){
	#header{padding:0 20px; }
	#header .logo img{ height:45px}
	#header .right .search{ right:20px;}
	#header .right .nav ul li{ margin-left:10px;}
	#header .right .nav ul li h3 a{ font-size:16px;}
	#header .right .lan{ margin-left:10px;}
}
@media (max-width:900px){
	body,html{ font-size:.23rem; line-height:.34rem}
	.wrap{ padding:0px}
	
	#header{ height:1rem; padding:0 .25rem; position:relative;align-items:center;}
	#header .right .search{ display:none}
	#header .logo{ padding:0}
	#header .logo img{ height:.6rem}
	#header .right{padding-top:0}
	#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:.03rem;background:#0267af;transition:all .5s;}
	#header .right .mnav .s1{top:.05rem;}
	#header .right .mnav .s2{top:.15rem;width:.26rem;}
	#header .right .mnav .s3{top:.25rem;}
	#header .right .mnav.isopen .s1{top:.15rem;transform:rotate(45deg);}
	#header .right .mnav.isopen .s2{width:0;opacity:0;}
	#header .right .mnav.isopen .s3{top:.15rem;transform:rotate(-45deg);}
	#header .right .nav{position: absolute;background:#fff;height: auto; min-height:100vh;width:100%;top:1rem;z-index:105;padding:.1rem .25rem 0;transform:translatex(100%);left:0; border-top:1px solid #eee;}
	#header .right .nav ul{ display:block}
	#header .right .nav.isopen{transform:translatex(0);}
	#header .right .nav ul li{ margin-left:0; position:relative}
	#header .right .nav ul li h3{ line-height:.7rem; height:.7rem; font-weight:normal;border-bottom:1px solid #eee;}
	#header .right .nav ul li h3 span{ display:block; position:absolute; right:0; top:0;padding-left:10%;}
	#header .right .nav ul li h3 span i{ text-align:right; font-size:.24rem; color:#999;-webkit-transition: all .3s;transition: all .3s;}
	#header .right .nav ul li h3 a{ font-size:.24rem; padding:0; line-height:.7rem}
	#header .right .nav ul li h3 a::before{ display:none}
	#header .right .nav ul li h3 a::after {bottom:0px;width: 100%;height: 1px;background-color: #005bac;content: ""; opacity:0}
	#header .right .nav ul li .sub{ display:none; position: inherit; left:0; width: auto; margin-left:0; top:0; background:#fff;border-radius:0}
	#header .right .nav ul li .sub::before{ display:none}
	#header .right .nav ul li .sub dl{ padding:10px; display:block}
	#header .right .nav ul li .sub a{ display:block; text-align:left; color:#68747f;border-bottom:1px solid #eee; line-height:.7rem; font-size:.24rem; margin:0}
	#header .right .lan{ margin-left:0; margin-right:.2rem;  line-height:.34rem;}
	#header .right .lan span{ width:.4rem; font-size:.2rem}
}
@media (max-width:800px){	
	#banner{ position:relative; overflow:hidden}
	#banner .swiper-slide{ position:relative; height:4.5rem; }
	#banner .swiper-slide .text .box{ padding:0 .25rem}
	#banner .swiper-slide .text .box h3{ font-size:.3rem; color:#fff}
	#banner .swiper-slide .text .box p{ font-size:.23rem; color:#fff; margin-top:30px; font-family:"quicksand"}
	#banner .swiper-slide img{width:100%;height:100%;object-fit:cover}
	
	.htitle .left h2{ font-size:.34rem;}
	.htitle .left p{ font-size:.23rem; margin-top:.2rem;}
	.htitle .more{ height:.42rem; width:.42rem; border-radius:.42rem;}
	.htitle .more .txt{line-height:.4rem;}
	.htitle .more i{ width:.4rem; height:.4rem;line-height:.4rem; font-size:.22rem}
	.htitle .more:hover{ width:1.5rem}
	.htitle .more:hover .txt{ width:1rem}
	#product .wrap{ padding:.5rem .25rem;}
	#product .list{ margin-top:.3rem}
	#product .list ul{gap:.3rem .25rem}
	#product .list ul li{ width:calc((100% - .25rem) / 2);}
	#product .list ul li p{ font-size:.23rem; line-height:.5rem}
	#product .arrow{top:-.5rem}
	
	#solution .wrap{ padding:.5rem .25rem; }
	#solution .list{ margin-top:.3rem}
	#solution .list ul{gap:.25rem .25rem;}
	#solution .list ul li{ width:calc((100% - .25rem) / 2);}
	#solution .list ul li .img .box i{ font-size:.6rem}
	#solution .list ul li p{ font-size:.23rem; line-height:.3rem; padding:.2rem .25rem}
	#solution .list ul li p::before{top:-16px;left:.25rem;}
	
	#news{ width:100%; padding:.5rem .25rem;}
	#news .list{ margin-top:.3rem}
	#news .list ul{display: flex;justify-content:space-between;align-items:center;gap:.3rem;flex-wrap:wrap;}
	#news .list ul li{ width:calc((100% - .3rem) / 2)}
	#news .list ul li .img img{ width:100%}
	#news .list ul li .p{ margin-top:.2rem}
	
	#about{ padding:1rem .25rem; }
	#about .wrap{display: block}
	#about .left{ width:100%}
	#about .left .title h2{ font-size:.36rem;}
	#about .left .title .more{ height:.42rem; width:.42rem; border-radius:.42rem;}
	#about .left .title .more .txt{line-height:.4rem;}
	#about .left .title .more i{ width:.4rem; height:.4rem;line-height:.4rem; font-size:.22rem}
	#about .left .title .more:hover{ width:1.5rem}
	#about .left .title .more:hover .txt{ width:1rem}
	#about .left .text{ margin-top:.3rem; font-size:.24rem; line-height:1.8;}
	#about .left .text p{ padding:.1rem 0}
	#about .right{ width:100%; margin-top:.2rem}
	#about .right img{ max-width:100%}
	#map{ width:100%; padding:.5rem 0}
	#map .wrap{display: block;}
	#map .logo{ padding-right:0; text-align:center}
	#map .logo .info{ margin-top:.1rem}
	#map .logo .info p{ font-size:.24rem; font-weight:bold}
	#map .logo .info .qrcode{ margin-top:.1rem}
	#map .logo .info .qrcode img{ width:1rem}
	#map .logo .tel{ margin-top:.3rem; font-size:.26rem;}
	#map .logo .tel i{ margin-right:.05rem;}
	#map .item{ display:none}
	
	#copyright{padding:.2rem 0; font-size:.2rem}
	#copyright a{margin-left:0; display:block; font-size:.2rem}
}

#nbanner{ width:100%; background-repeat:no-repeat; background-position:center center; background-size:cover}
#nbanner .wrap{ height:400px;display: flex;align-items:flex-end;justify-content:flex-start;}
#nbanner .title{ padding-bottom:100px}
#nbanner .title h2{ color:#fff; font-size:40px}
#nbanner .title .weizhi{ color:#fff; margin-top:20px; font-size:16px}
#nbanner .title .weizhi a{ color:#fff}
#nbanner .title .weizhi i{ margin:0 10px}

#main{ width:100%; padding:50px 0; background:#f8f8f8; border-bottom:1px solid #eee}
#main .product .list ul li{display: flex;justify-content:space-between;align-items:center; margin-bottom:20px; background:#fff}
#main .product .list ul li .img{ width:240px; padding:20px}
#main .product .list ul li .img img{ width:100%}
#main .product .list ul li .info{ width:calc(100% - 450px); padding:20px 20px}
#main .product .list ul li .info h2{ font-size:30px; color:#0267af}
#main .product .list ul li .info p{ font-size:16px; margin-top:15px; line-height:26px}
#main .product .list ul li .more{ width:210px;}
#main .product .list ul li .more .morebtn{ height:30px; width:30px; border:1px solid #6da7d9; border-radius:30px; position:relative; margin:0 auto}
#main .product .list ul li .more .morebtn .txt{ position: absolute;left:10px; top:0; white-space: nowrap; width:0; overflow:hidden; line-height:28px; color:#0267af}
#main .product .list ul li .more .morebtn i{ width:28px; height:28px; text-align:center; position:absolute; right:0; top:0; line-height:28px; color:#0267af; font-size:18px}
#main .product .list ul li .more .morebtn:hover{ width:100px}
#main .product .list ul li .more .morebtn:hover .txt{ width:70px}
#main .product .list ul li{-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
#main .product .list ul li:hover{box-shadow: 0 0 13px #ddd;}

#main .product2 .title{ padding-right:40%}
#main .product2 .title h2{ font-size:36px; color:#0267af}
#main .product2 .title p{ font-size:16px; margin-top:20px}
#main .product2 .list{ margin-top:10px}
#main .product2 .list ul li{display: flex;justify-content:space-between;align-items:center; margin-top:20px; background:#fff}
#main .product2 .list ul li .img{ width:280px; padding:20px}
#main .product2 .list ul li .img img{ width:100%}
#main .product2 .list ul li .info{ width:calc(100% - 450px); padding:20px 20px}
#main .product2 .list ul li .info h2{ font-size:24px; color:#0267af}
#main .product2 .list ul li .info p{ font-size:16px; margin-top:15px; line-height:26px}
#main .product2 .list ul li .more{ width:210px;}
#main .product2 .list ul li .more .morebtn{ height:30px; width:30px; border:1px solid #6da7d9; border-radius:30px; position:relative; margin:0 auto}
#main .product2 .list ul li .more .morebtn .txt{ position: absolute;left:10px; top:0; white-space: nowrap; width:0; overflow:hidden; line-height:28px; color:#0267af}
#main .product2 .list ul li .more .morebtn i{ width:28px; height:28px; text-align:center; position:absolute; right:0; top:0; line-height:28px; color:#0267af; font-size:18px}
#main .product2 .list ul li .more .morebtn:hover{ width:100px}
#main .product2 .list ul li .more .morebtn:hover .txt{ width:70px}
#main .product2 .list ul li{-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
#main .product2 .list ul li:hover{box-shadow: 0 0 13px #ddd;}

#main .product3{display: flex;justify-content:space-between;align-items:flex-start;}
#main .product3 select { display:none;}
#main .product3 .left{ width:200px; background:#fff; padding:10px 30px}
#main .product3 .left ul li{ border-bottom:1px solid #eee; margin:10px 0}
#main .product3 .left ul li a{ font-size:16px; padding:10px 0;display:block}
#main .product3 .left ul li.currclass{ border-bottom:1px solid #0267af;}
#main .product3 .left ul li.currclass a{ color:#0267af; font-weight:700}
#main .product3 .right{ width:calc(100% - 260px)}
#main .product3 .right .title h2{ font-size:30px; color:#0267af}
#main .product3 .right .title p{ font-size:16px; margin-top:10px}
#main .product3 .right .list{ padding-top:20px}
#main .product3 .right .list ul li{display: flex;justify-content:space-between;align-items:flex-start; background:#fff; margin-top:20px}
#main .product3 .right .list ul li .img{ width:330px}
#main .product3 .right .list ul li .img img{ width:100%}
#main .product3 .right .list ul li .info{ width:calc(100% - 350px); padding-right:50px; padding-top:50px}
#main .product3 .right .list ul li .info h2{ font-size:20px; color:#0267af}
#main .product3 .right .list ul li .info .text{ font-size:16px; margin-top:10px}
#main .product3 .right .list ul li .info .text .btn{ cursor:pointer}
#main .product3 .right .list ul li .info .text .btn span{ margin-left:10px}
#main .product3 .right .list ul li .info .text .btn .plus2{ display:none}
#main .product3 .right .list ul li .info .text p{ font-size:14px; line-height:26px; margin-top:10px;height:0; overflow:hidden;}
#main .product3 .right .list ul li .info .text.isopen p{ height:100%}
#main .product3 .right .list ul li .info .text.isopen .btn .plus{ display:none}
#main .product3 .right .list ul li .info .text.isopen .btn .plus2{ display: inline-block}
#main .product3 .right .list ul li{-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
#main .product3 .right .list ul li:hover{box-shadow: 0 0 13px #ddd;}

#main .searchlist .title h2{ font-size:30px; color:#0267af}
#main .searchlist  .title p{ font-size:16px; margin-top:10px}
#main .searchlist  .list{ padding-top:20px}
#main .searchlist .list ul li{display: flex;justify-content:space-between;align-items:flex-start; background:#fff; margin-top:20px}
#main .searchlist .list ul li .img{ width:330px}
#main .searchlist .list ul li .img img{ width:100%}
#main .searchlist .list ul li .info{ width:calc(100% - 350px); padding-right:50px; padding-top:50px}
#main .searchlist .list ul li .info h2{ font-size:20px; color:#0267af}
#main .searchlist .list ul li .info .text{ font-size:16px; margin-top:10px}
#main .searchlist .list ul li .info .text .btn{ cursor:pointer}
#main .searchlist .list ul li .info .text .btn span{ margin-left:10px}
#main .searchlist .list ul li .info .text .btn .plus2{ display:none}
#main .searchlist .list ul li .info .text p{ font-size:14px; line-height:26px; margin-top:10px;height:0; overflow:hidden;}
#main .searchlist .list ul li .info .text.isopen p{ height:100%}
#main .searchlist .list ul li .info .text.isopen .btn .plus{ display:none}
#main .searchlist .list ul li .info .text.isopen .btn .plus2{ display: inline-block}
#main .searchlist .list ul li{-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
#main .searchlist .list ul li:hover{box-shadow: 0 0 13px #ddd;}

#main.bgfff{ background:#fff !important}
#main .contact .text{ font-size:16px; line-height:1.9;}
#main .contact .text strong{ font-size:30px; color:#0267af;display:block}
#main .contact .map{ margin-top:30px;}
#main .contact .map iframe{ height:400px}

#main .news ul li{display: flex;justify-content:space-between;align-items:center; margin-top:20px; background:#fff}
#main .news ul li .img{ width:280px; padding:20px}
#main .news ul li .img img{ width:100%}
#main .news ul li .info{ width:calc(100% - 490px); padding:20px 20px}
#main .news ul li .info h2{ font-size:20px;}
#main .news ul li .info p{ font-size:16px; margin-top:15px; line-height:26px}
#main .news ul li .info time{ color:#999; margin-top:10px}
#main .news ul li .more{ width:210px;}
#main .news ul li .more .morebtn{ height:30px; width:30px; border:1px solid #6da7d9; border-radius:30px; position:relative; margin:0 auto}
#main .news ul li .more .morebtn .txt{ position: absolute;left:10px; top:0; white-space: nowrap; width:0; overflow:hidden; line-height:28px; color:#0267af}
#main .news ul li .more .morebtn i{ width:28px; height:28px; text-align:center; position:absolute; right:0; top:0; line-height:28px; color:#0267af; font-size:18px}
#main .news ul li .more .morebtn:hover{ width:100px}
#main .news ul li .more .morebtn:hover .txt{ width:70px}
#main .news ul li{-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
#main .news ul li:hover{box-shadow: 0 0 13px #ddd;}

#main .about{ padding:20px 0;}
#main .about .title{ font-size:24px; color:#0267af; font-weight:700}
#main .about .text{display: flex;justify-content:space-between;align-items:flex-start;}
#main .about .text .content{ width:60%;margin-top:30px; line-height:1.9; font-size:16px}
#main .about .text .content p{ margin-bottom:10px}
#main .about .text  .img{ width:35%; padding-top:40px}
#main .about .text  .img img{ width:100%}

#main .content h1{ text-align:center; font-size:30px; font-weight:normal; padding:30px 0}
#main .content .info{ border-bottom:1px solid #eee; text-align:center; padding-bottom:10px; color:#999}
#main .content .info span{ margin:0 10px}
#main .content .mycontent{ line-height:2; font-size:16px;; padding:30px 0}
#main .content .mycontent img{ max-width:800px}
#main .content .mycontent p{ padding-bottom:10px}
#main .content .uppage{ border-top:1px solid #eee; padding-top:20px}

#fenye{padding:50px 0 0px;text-align:center;clear:both;}
#fenye table{text-align:center;margin:0 auto}
#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.curr{font-weight:700;color:#fff;background:#528e06;border:1px solid #528e06}
#fenye a:hover{background:#528e06;color:#fff;border:1px solid #528e06}
#fenye span{margin:0 2px;color:#5a5a5a;text-decoration:none;padding:10px 15px;border:1px solid #eee;background:#FFF}

@media (max-width:800px){
	body,html{ font-size:.23rem; line-height:.34rem}
	#main{ padding:.5rem 0;}
	#nbanner{ padding:0 .25rem}	
	#nbanner .wrap{ height:3rem;}
	#nbanner .title{ padding-bottom:.5rem}
	#nbanner .title h2{font-size:.36rem}
	#nbanner .title .weizhi{  margin-top:.2rem; font-size:.24rem}
	#nbanner .title .weizhi i{ margin:0 .1rem}
	
	#main .product{ padding:0 .25rem}
	#main .product .list ul li{margin-bottom:.2rem;}
	#main .product .list ul li .img{ width:1.5rem; padding:.2rem}
	#main .product .list ul li .img img{ width:100%}
	#main .product .list ul li .info{ width:calc(100% - 2.5rem); padding:0}
	#main .product .list ul li .info h2{ font-size:.24rem;}
	#main .product .list ul li .info p{ font-size:.22rem; margin-top:.1rem; line-height:.34rem}
	#main .product .list ul li .info p{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical}
	#main .product .list ul li .more{ width:1rem;}
	#main .product .list ul li .more .morebtn{ height:.4rem; width:.4rem;border-radius:.4rem;}
	#main .product .list ul li .more .morebtn .txt{ display:none}
	#main .product .list ul li .more .morebtn i{ width:.4rem; height:.4rem; line-height:.4rem; color:#0267af; font-size:.22rem}
	#main .product .list ul li .more .morebtn:hover{ width:.4rem}
	
	#main .product2{ padding:0 .25rem}
	#main .product2 .title{ padding-right:0%}
	#main .product2 .title h2{ font-size:.3rem; }
	#main .product2 .title p{ font-size:.22rem; margin-top:.2rem}
	#main .product2 .list{ margin-top:.1rem}
	#main .product2 .list ul li{ margin-top:.2rem;}
	#main .product2 .list ul li .img{ width:2rem; padding:.2rem}
	#main .product2 .list ul li .img img{ width:100%}
	#main .product2 .list ul li .info{ width:calc(100% - 2.5rem); padding:0}
	#main .product2 .list ul li .info h2{ font-size:.24rem; color:#0267af}
	#main .product2 .list ul li .info p{ font-size:.22rem; margin-top:.1rem; line-height:.34rem}
	#main .product2 .list ul li .info p{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:1;display:-webkit-box;-webkit-box-orient:vertical}
	#main .product2 .list ul li .more{ width:1rem;}
	#main .product2 .list ul li .more .morebtn{ height:.4rem; width:.4rem;border-radius:.4rem;}
	#main .product2 .list ul li .more .morebtn .txt{ display:none}
	#main .product2 .list ul li .more .morebtn i{ width:.4rem; height:.4rem; line-height:.4rem; color:#0267af; font-size:.22rem}
	#main .product2 .list ul li .more .morebtn:hover{ width:.4rem}
	
	#main .product3{display: block; padding:0 .25rem}
	#main .product3 select { display:block;width: 100%;font-size:.24rem;line-height: .6rem;height: .6rem;color: #0267af;padding: 0 .2rem;border:0; border-radius:.04rem; background:#fff;}
	#main .product3 .left{ display:none}
	#main .product3 .right{ width:100%; margin-top:.5rem}
	#main .product3 .right .title h2{ font-size:.3rem;}
	#main .product3 .right .title p{ font-size:.22rem; margin-top:.1rem}
	#main .product3 .right .list{ padding-top:.2rem}
	#main .product3 .right .list ul li{margin-top:.2rem}
	#main .product3 .right .list ul li .img{ width:2rem}
	#main .product3 .right .list ul li .img img{ width:100%}
	#main .product3 .right .list ul li .info{ width:calc(100% - 2rem); padding-right:.1rem; padding:.3rem 0}
	#main .product3 .right .list ul li .info h2{ font-size:.24rem; line-height:.34rem}
	#main .product3 .right .list ul li .info .text{ font-size:.22rem; margin-top:.1rem}
	#main .product3 .right .list ul li .info .text span{ margin-left:.1rem}
	#main .product3 .right .list ul li .info .text .plus2{ display:none}
	#main .product3 .right .list ul li .info .text p{ font-size:.22rem; line-height:.34rem; margin-top:.2rem;height:0; overflow:hidden;}
	#main .product3 .right .list ul li .info .text.isopen p{ height:100%}
	#main .product3 .right .list ul li .info .text.isopen .plus{ display:none}
	#main .product3 .right .list ul li .info .text.isopen .plus2{ display: inline-block}
	
	#main .contact{ padding:0 .25rem}
	#main .contact .text{ font-size:.24rem; line-height:1.9;}
	#main .contact .text strong{ font-size:.26rem}
	#main .contact .map{ margin-top:.5rem;}
	#main .contact .map iframe{ height:4rem}
	
	#main .news{ padding:0 .25rem}
	#main .news ul li{ margin-top:.2rem;}
	#main .news ul li .img{ width:2.5rem; padding:.2rem}
	#main .news ul li .img img{ width:100%}
	#main .news ul li .info{ width:calc(100% - 2.5rem); padding:0 .2rem 0 0}
	#main .news ul li .info h2{ font-size:.24rem; color:#0267af; font-weight:normal}
	#main .news ul li .info p{ display:none}
	#main .news ul li .more{ display:none}
	
	#main .about{ padding:0 .25rem;}
	#main .about .title{ font-size:.3rem; }
	#main .about .text{display: flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap-reverse}
	#main .about .text .content{ width:100%;margin-top:.4rem; line-height:1.8; font-size:.24rem}
	#main .about .text .content p{ margin-bottom:.1rem}
	#main .about .text  .img{ width:100%; padding-top:.4rem}
	#main .about .text  .img img{ width:100%}
	
	#main .content h1{ font-size:.3rem; padding:.25rem 0; line-height:.4rem}
	#main .content .info{ padding-bottom:.1rem; font-size:.2rem}
	#main .content .info span{ margin:0 .1rem;}
	#main .content .info span+span+span{ display:none}
	#main .content .mycontent{ padding:.4rem 0; line-height:1.8; font-size:.24rem}
	#main .content .mycontent p{ padding-bottom:.1rem}
	#main .content .mycontent img{ max-width:100%}
	#main .content .uppage{padding:.2rem 0 0}
	#main .content .uppage p{ font-size:.22rem}
	
	#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 .num,#fenye .prev{display:none}
}