@charset "utf-8";
*,:after,:before{box-sizing:border-box;}
html{-webkit-text-size-adjust:none;}
html{zoom:1;}
html *{outline:0;zoom:1;}
body,blockquote,code,dd,div,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,input,legend,li,ol,p,pre,td,textarea,th,ul{margin:0;padding:0;}
body,button,input,select,textarea{font-size:14px;line-height:30px;font-family:arial,microsoft yahei,Microsoft YaHei;}
body{color:#333;margin:0 auto;background:#fff;
/*禁用Webkit内核浏览器的文字大小调整功能*/
-webkit-text-size-adjust:none;
/*取出点击出现半透明的灰色背景*/
-webkit-tap-highlight-color:rgba(0,0,0,0);
-webkit-tap-highlight:rgba(0,0,0,0);
/*设置字体的抗锯齿或者说光滑度*/
-webkit-font-smoothing: antialiased;}
address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:400;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400;}
em,i{font-style:normal;}
li{list-style:none;}
img{-webkit-box-sizing:border-box;box-sizing:border-box;max-width:100%;height:auto;vertical-align:middle;border:0;}
table{border-collapse:collapse;border-spacing:0;}
a{color:#333;text-decoration:none;-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;transition:.3s;-ms-transition:.3s;}
a:hover{color:#0165b3;text-decoration:none;}
a,a:focus{outline:0;}
.clearfix:after{clear:both;display:block;visibility:hidden;height:0;content:"";}
.clearfix{display:block;}
.fl{float:left;display:inline;}
.fr{float:right;display:inline;}
.wrap{clear:both;display:block;margin:0 auto;width:1200px;}
.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;}
.hide,.none,ins{display:none;}
.bor_box::after,.bor_box::before{pointer-events:none;}
.bor_box::after,.bor_box::before{position:absolute;top:15px;right:15px;bottom:15px;left:15px;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);}
a:hover .bor_box::after,a:hover .bor_box::before{opacity:.7;-webkit-transform:scale(1);transform:scale(1);}

#header{ width:100%; height:100px; z-index:999; background:#fff}
#header .logo{ padding:20px 0;}
#header .font{ font-size:20px; line-height:100px}
#banner{ width:100%; position:relative; overflow:hidden}
@media (max-width:800px){
	#header{ position:fixed; top:0; left:0;}
	#header{ width:100%; height:1rem; padding:0 .3rem}
	#header .logo{ padding:.25rem 0;}
	#header .logo img{ height:.5rem}
	#header .tel{ display:none}
	#header .font{ font-size:.2rem; font-weight:700; line-height:1rem}
	#banner{ width:100%; position:relative; overflow:hidden; margin-top:1rem; height:3rem}
	#banner img{width:100%;height:100%;object-fit:cover}
}

.htitle{text-align:center;}
.htitle .t{font-size:23px; display:block; color:#2e9eda; background:url(../images/titbg.png) no-repeat center top; padding-top:30px}
.htitle .en{ font-size:14px; display:block; text-transform:uppercase}

.htitle2 .t{color:#fff;background:url(../images/titbg2.png) no-repeat center top;}
.htitle2 .en{color:#fff;}
@media (max-width:800px){
	.wrap{ width:100%}		
	.htitle span{line-height:.3rem}
	.htitle .t{font-size:.3rem;font-weight:700; background-size: auto .2rem; padding-top:.3rem}
	.htitle .en{font-size:.2rem; margin-top:.1rem}
}
#service{ width:100%; padding:50px 0}
#service .list{ margin-top:50px}
#service .list ul li{ float:left; width:calc((100% - 60px) / 4); margin-right:20px; position:relative; overflow:hidden}
#service .list ul li:last-child{ margin-right:0}
#service .list ul li .img{ width:100%; height:200px; overflow:hidden}
#service .list ul li .img img{width:100%;height:100%;object-fit:cover}
#service .list ul li .t{ text-align:center; margin-top:10px; font-size:18px}
#service .list ul li .info{ width:100%; height:250px; background:rgba(46,158,218,.8); color:#fff; padding:50px 50px; line-height:24px;}
#service .list ul li .info{ position:absolute; left:0; top:-50px; opacity:0; font-size:16px}
#service .list ul li a:hover .info{ top:0; opacity:1; height:200px}
#service .tel{ text-align:center; margin-top:50px}
#service .tel span{ background:#2e9eda; color:#fff; font-size:20px; font-weight:700; padding:20px 30px; border-radius:4px}
@media (max-width:800px){
	#service{padding:.5rem .3rem}
	#service .list{ margin-top:.5rem}
	#service .list ul li{  width:calc((100% - .2rem) / 2); margin-right:.2rem; overflow:hidden;}
	#service .list ul li:nth-child(2n){ margin-right:0}
	#service .list ul li:nth-child(n+3){ margin-top:.2rem}
	#service .list ul li .img{height:2rem; border-radius:.06rem}
	#service .list ul li .t{ margin-top:.1rem; font-size:.24rem}
	#service .list ul li .info{  height:2.5rem; padding:.2rem; line-height:.24rem;}
	#service .list ul li .info{ top:-.5rem; font-size:.24rem; line-height:.3rem}
	#service .list ul li a:hover .info{ height:2rem}
	#service .tel{margin-top:.5rem}
	#service .tel span{ font-size:.3rem;padding:.2rem 0; border-radius:.06rem; width:100%; display:block}
}

  
#tixi{ width:100%; padding:50px 0; background:#f8f8f8}
#tixi .list{ position:relative; margin-top:30px}
#tixi .list .left{ width:200px; float:left;}
#tixi .list .left span{ left:0; top:50%; margin-top:-80px;}
#tixi .list .left span{width:100px;position:absolute;height:160px;display:block;text-align:center;background-color:#ffc000; line-height:160px; font-size:24px; font-weight:bold; color:#fff}
#tixi .list .left span:before{content:"";position:absolute;top:0;left:-40px;border-top:80px solid transparent;border-bottom:80px solid transparent;border-right:40px solid #ffc000;z-index:2}
#tixi .list .left span:after{content:"";position:absolute;top:0;right:-40px;border-top:80px solid transparent;border-bottom:80px solid transparent;border-left:40px solid #ffc000;z-index:2}
#tixi .list .right{ float:right; width:calc(100% - 200px)}
#tixi .list .right .item{ margin:20px 0;position:relative;}
#tixi .list .right .item .item_l{ float:left; width:100px;}
#tixi .list .right .item .item_l span{ left:0; top:50%; margin-top:-40px}
#tixi .list .right .item .item_l span{width:50px;position:absolute;height:80px;display:block;text-align:center;background-color:#008d8e; line-height:80px; font-size:18px; font-weight:700; color:#fff}
#tixi .list .right .item .item_l span:before{content:"";position:absolute;top:0;left:-20px;border-top:40px solid transparent;border-bottom:40px solid transparent;border-right:20px solid #008d8e;z-index:2}
#tixi .list .right .item .item_l span:after{content:"";position:absolute;top:0;right:-20px;border-top:40px solid transparent;border-bottom:40px solid transparent;border-left:20px solid #008d8e;z-index:2}
#tixi .list .right .item .item_r{ width:calc(100% - 100px); float:right; background:#fff; border-radius:10px; padding:30px 30px; line-height:26px;}
@media (max-width:800px){
	#tixi{ width:100%; padding:.5rem .3rem; background:#f8f8f8}
	#tixi .list{ position:relative; margin-top:.3rem}
	#tixi .list .left{display:none; float:inherit}
	#tixi .list .right{ float:inherit; width:100%}
	#tixi .list .right .item{ margin:20px 0;position: inherit;}
	#tixi .list .right .item .item_l{ float:inherit; width:100%;}
	#tixi .list .right .item .item_l span{ left:0; top:0%; margin-top:0}
	#tixi .list .right .item .item_l span{width:100%;position:inherit;height:.6rem;background-color:#008d8e; line-height:.6rem; font-size:.26rem;}
	#tixi .list .right .item .item_l span:before{content:"";position:absolute;top:0;left:0;border-top:0 ;border-bottom:0 solid transparent;border-right:0 solid #008d8e;z-index:2}
	#tixi .list .right .item .item_l span:after{content:"";position:absolute;top:0;right:0;border-top:0 ;border-bottom:0 solid transparent;border-left:0 solid #008d8e;z-index:2}
	#tixi .list .right .item .item_r{ width:100%; float:inherit; border-radius:0px; padding:.3rem; line-height:.36rem; font-size:.24rem;}
}

#zhuti{ width:100%; padding:50px 0}
#zhuti .list{ margin-top:30px}
#zhuti .list ul li{ float:left; width:calc(96% / 3 );; margin-top:20px}
#zhuti .list ul li:nth-child(1){ width:100%;}
#zhuti .list ul li:nth-child(3){ margin:20px 2% 0; }
#zhuti .list ul li .img{ width:100%; height:220px; overflow:hidden; position:relative}
#zhuti .list ul li:nth-child(1) .img{ width:100%; height:300px;}
#zhuti .list ul li .img img{width:100%;height:100%;object-fit:cover;}
#zhuti .list ul li .img .t{ width:100%; background:rgba(0,0,0,.5); color:#fff; line-height:40px; position:absolute; left:0; bottom:0; padding:0 10px; text-align:center; font-size:16px}
#zhuti .list ul li .info{ padding:10px; text-align:center; color:#888}
#zhuti .list ul li:hover .img .t{ background:rgba(46,158,218,.8); line-height:220px; font-weight:700; font-size:20px}
#zhuti .list ul li:hover .info{ color:#2e9eda}
#zhuti .list ul li:nth-child(1):hover .img .t{ background:rgba(46,158,218,.8); line-height:300px;}
@media (max-width:800px){
	#zhuti{ width:100%; padding:.5rem .3rem}
	#zhuti .list{ margin-top:.3rem}
	#zhuti .list ul li{ float: inherit; width:100%;; margin-top:.2rem}
	#zhuti .list ul li:nth-child(3){ margin:.2rem 0 0; }
	#zhuti .list ul li .img{height:3rem; border-radius:.06rem}
	#zhuti .list ul li:nth-child(1) .img{ height:3rem;}
	#zhuti .list ul li .img .t{line-height:.6rem; padding:0 .1rem;font-size:.26rem}
	#zhuti .list ul li .info{ padding:.1rem; color:#888; font-size:.24rem}
	#zhuti .list ul li:hover .img .t{ line-height:3rem;font-size:.3rem}
	#zhuti .list ul li:nth-child(1):hover .img .t{  line-height:3rem;}
}
#techer{ width:100%; padding:50px 0; background:#f8f8f8}
#techer .list{width:1200px;overflow:hidden;margin-top:50px;}
#techer .list .swiper-slide{ position:relative; overflow:hidden}
#techer .list .swiper-slide .t{ text-align:center; margin-top:10px; font-size:18px; line-height:40px; background:rgba(0,0,0,.5); color:#fff; text-align:center; position:absolute; left:0; bottom:0; width:100%}
#techer .list .swiper-slide .info{ position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(46,158,218,.8); text-align:center; padding:40px; opacity:0}
#techer .list .swiper-slide .info big{ display:block; color:#fff; font-size:24px; margin-top:30%; font-weight:bold}
#techer .list .swiper-slide .info p{ line-height:24px; color:#fff; margin-top:10px;}
#techer .list .swiper-slide a:hover .info{ opacity:1; }
#techer .list .swiper-slide a:hover .t{ bottom:-40px; opacity:0}
#techer .button{width:38px;height:38px;line-height:38px; border:2px solid #2e9eda; border-radius:100%;}
#techer .button{position:absolute;left:-50px;top:210px;z-index:99;cursor:pointer; text-align:center; font-size:24px; color:#2e9eda}
#techer .button-prev{left:-50px;}
#techer .button-next{right:-50px; left:auto}
#techer-container{ position:relative}
@media (max-width:800px){
	#techer{ padding:.5rem .3rem 1.1rem}
	#techer .list{margin-top:.5rem; width:100%}
	#techer .list .swiper-slide .t{ margin-top:.1rem; font-size:.24rem; line-height:.4rem;}
	#techer .list .swiper-slide .info{ padding:.4rem; }
	#techer .list .swiper-slide .info big{ font-size:.26rem; margin-top:0;}
	#techer .list .swiper-slide .info p{ line-height:.3rem; font-size:.24rem;  margin-top:.05rem;}
	#techer .list .swiper-slide .info p{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:7;display:-webkit-box;-webkit-box-orient:vertical;}
	#techer .list .swiper-slide a:hover .t{ bottom:-.4rem;}
	#techer .button{width:.4rem;height:.4rem;line-height:.4rem;}
	#techer .button{position:absolute;left:calc((100% - .6rem) / 2);top:auto; bottom:-.7rem; font-size:.24rem;}
	#techer .button-prev{left:calc((100% - .9rem) / 2); right:auto}
	#techer .button-next{right:calc((100% - .9rem) / 2); left:auto}
}
#peixun{ padding:50px 0; background:#f8f8f8}
#peixun .list{ margin-top:10px;}
#peixun .list ul li{ float:left; width:calc(100% / 5); text-align:center; margin-top:40px}
#peixun .list ul li .img i{ color:#fff; background:#000; font-size:38px;  width:100px; height:100px; text-align:center; line-height:100px; border-radius:100%}
#peixun .list ul li:nth-child(1)  .img i{background:linear-gradient(to right,#489ae5,#6ec4fb);}
#peixun .list ul li:nth-child(2)  .img i{background:linear-gradient(to right,#c2153a,#e64164);}
#peixun .list ul li:nth-child(3)  .img i{background:linear-gradient(to right,#31c399,#50e3be);}
#peixun .list ul li:nth-child(4)  .img i{background:linear-gradient(to right,#ef6239,#fe8c43);}
#peixun .list ul li:nth-child(5)  .img i{background:linear-gradient(to right,#009f9d,#00bebc);}
#peixun .list ul li:nth-child(6)  .img i{background:linear-gradient(to right,#56c997,#75e1b2);}
#peixun .list ul li:nth-child(7)  .img i{background:linear-gradient(to right,#e03636,#b51a1a);}
#peixun .list ul li:nth-child(8)  .img i{background:linear-gradient(to right,#7f1874,#9b0b8c);}
#peixun .list ul li:nth-child(9)  .img i{background:linear-gradient(to right,#ba874c,#986325);}
#peixun .list ul li:nth-child(10)  .img i{background:linear-gradient(to right,#00343f,#004857);}
#peixun .list ul li p{ font-size:16px; margin-top:20px}
#peixun .list ul li .info{ color:#999; line-height:20px; padding:0 20px; margin-top:10px}

@media (max-width:800px){
	#peixun{ padding:.5rem .3rem;}
	#peixun .list{ margin-top:.2rem;}
	#peixun .list ul li{ float:left; width:calc(100% / 3); margin-top:.3rem}
	#peixun .list ul li .img i{ color:#fff; background:#000; font-size:.34rem;  width:.8rem; height:.8rem;line-height:.8rem;}
	#peixun .list ul li p{ font-size:.22rem; margin-top:.2rem; padding:0 .2rem; line-height:.3rem}
	#peixun .list ul li .info{ display:none}
}

#feedback{ width:100%; padding:50px 0; background:url(../images/form_bg.jpg) no-repeat center center; background-size:cover}
#feedback .formbox{ margin-top:50px; padding:0 200px}
#feedback .formbox .inp{ float:left; width:49%; margin:10px 0}
#feedback .formbox .inp:nth-child(2n){ float:right}
#feedback .formbox .inp .text{ border:1px solid #fff; border-radius:4px; width:100%; text-indent:10px; line-height:50px}
#feedback .formbox .textarea{ width:100%}
#feedback .formbox .textarea .text{ height:180px}
#feedback .formbox .button{ margin-top:10px; text-align: center}
#feedback .formbox .button .btn{ background:#2e9eda; color:#fff; border-radius:4px; padding:10px 60px; font-size:18px; border:0}
#feedback .formbox .button .btn:hover{ opacity:.8}
@media (max-width:800px){
	#feedback{  padding:.5rem .3rem;}
	#feedback .formbox{ margin-top:.5rem; padding:0}
	#feedback .formbox .inp{ float: inherit; width:100%; margin:.1rem 0}
	#feedback .formbox .inp:nth-child(2n){ float: inherit}
	#feedback .formbox .inp .text{ border-radius:.04rem; width:100%; text-indent:.1rem; line-height:.7rem; font-size:.26rem}
	#feedback .formbox .textarea{ width:100%}
	#feedback .formbox .textarea .text{ height:2rem}
	#feedback .formbox .button{ margin-top:.1rem;}
	#feedback .formbox .button .btn{ border-radius:.04rem; padding:.1rem 0px; font-size:.26rem; width:100%;}
}
#xshi{ padding:50px 0; width:100%}
#xshi .list{ position:relative; height:400px; width:600px; margin:50px auto;}
#xshi .list .img{ position:absolute; left:30px; top:50px; z-index:5}
#xshi .list .img img{ height:300px; width:300px; border-radius:100%}
#xshi .list .text{ position:absolute; left:0;top:270px; background:#008d8e; width:120px; height:120px; color:#fff; font-size:30px;; font-weight:bold; padding:30px 0; text-align:center; border-radius:100%; z-index:6}
#xshi .list .line{ border:1px dashed #008d8e; width:400px; height:400px; border-radius:100%; position:absolute; left:30px; top:0px; z-index:3}
#xshi .list .txt{ position:absolute; left:330px; top:0px; z-index:4}
#xshi .list .txt .item{ line-height:60px; position:relative; padding-left:70px; font-size:24px; margin-top:10px}
#xshi .list .txt .item i{ position:absolute; left:0; top:5px}
#xshi .list .txt .item i{ display:inline-block; width:50px; height:50px; border-radius:100%; background:#008d8e; font-family:Impact; text-align:center; line-height:50px; font-size:24px; color:#fff}
#xshi .list .txt .item:nth-child(2){ margin-left:55px}
#xshi .list .txt .item:nth-child(3){ margin-left:76px}
#xshi .list .txt .item:nth-child(4){ margin-left:68px}
#xshi .list .txt .item:nth-child(5){ margin-left:32px}
#xshi .list .txt .item:nth-child(6){ margin-left:-45px; margin-top:0}
#xshi .list .txt .item:nth-child(1) i,
#xshi .list .txt .item:nth-child(3) i,
#xshi .list .txt .item:nth-child(5) i,
#xshi .list .txt .item:nth-child(6) i{ background:#ffc000}
@media (max-width:800px){
	#xshi{ padding:.5rem .3rem;}
	#xshi .list{ position:relative; height: auto; width:100%; margin:.5rem auto 0;}
	#xshi .list .img{position:absolute; left:auto; top:.5rem; right:0}
	#xshi .list .img img{ height:2.5rem; width:2.5rem; border-radius:100%}
	#xshi .list .text{ display:none}
	#xshi .list .line{ display:none}
	#xshi .list .txt{ position: inherit; left:0; top:0px; z-index:4}
	#xshi .list .txt .item{ line-height:.6rem; position:relative; padding-left:.6rem; font-size:.24rem; margin-top:0}
	#xshi .list .txt .item i{ position:absolute; left:0; top:.1rem}
	#xshi .list .txt .item i{ display:inline-block; width:.4rem; height:.4rem; border-radius:100%; background:#008d8e; font-family:Impact; text-align:center; line-height:.4rem; font-size:.22rem; color:#fff}
	#xshi .list .txt .item:nth-child(2){ margin-left:0}
	#xshi .list .txt .item:nth-child(3){ margin-left:0}
	#xshi .list .txt .item:nth-child(4){ margin-left:0}
	#xshi .list .txt .item:nth-child(5){ margin-left:0}
	#xshi .list .txt .item:nth-child(6){ margin-left:-0; margin-top:0}
	#xshi .list .txt .item:nth-child(1) i,
	#xshi .list .txt .item:nth-child(3) i,
	#xshi .list .txt .item:nth-child(5) i,
	#xshi .list .txt .item:nth-child(6) i{ background:#ffc000}
}
#about{ padding:50px 0;; background:#f8f8f8}
#about .content{ margin-top:50px;}
#about .left{ width:48%; float:left; overflow:hidden}
#about .left img{ width:100%}
#about .right{ width:48%; float:right}
#about .right .info{ line-height:30px; font-size:16px}
@media (max-width:800px){
	#about{ padding:.5rem .3rem;}
	#about .content{ margin-top:.5rem;}
	#about .left{ width:100%; float: inherit; overflow:hidden}
	#about .left img{ width:100%}
	#about .right{ width:100%; float: inherit; margin-top:.2rem}
	#about .right .info{ line-height:.38rem; font-size:.26rem}
}
#footer{ width:100%; background:#333}
#footer .left{ float:left;color:#fff; padding:50px 0}
#footer .right{ float:right; padding:50px 0 0; text-align:center}
#footer .right{ margin-left:20px; display:inline-block}
#footer .right img{ width:120px;}
#footer .right p{color:#fff; margin-top:5px; font-size:12px}
@media (max-width:800px){
	#footer{ text-align:center}
	#footer .left{ float:inherit;color:#fff; padding:.2rem .3rem  .5rem; font-size:.21rem; line-height:.3rem; }
	#footer .right{float:inherit;padding:.3rem 0 0; width:100%}
	#footer .right{ margin:0; }
	#footer .right img{ width:1.5rem;}
	#footer .right p{;margin-top:.05rem; font-size:.2rem; color:#fff}	
}
#gotop{position:fixed;right:.2rem;bottom:1rem;z-index:900;display:none;width:.6rem;height:.6rem;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;background-color:rgba(27,27,27,.6);}
#gotop img{display:block;width:.6rem;height:.6rem;}