@charset "utf-8";
*{margin:0;padding:0;outline:0;}
body,html{overflow-x:hidden;color:#333;font:14px/30px "Microsoft Yahei", "PingFang SC", "Helvetica Neue", Helvetica, Arial;;}
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:"Microsoft Yahei", "PingFang SC", "Helvetica Neue", Helvetica, Arial;-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;}
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:#0067e6;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;}

@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;
}

#header{width:100%;position:fixed;left:0;top:0;z-index:390;background:#fff;}
#header{background:#fff;box-shadow:0 2px 10px 0 rgba(28,28,28,.1);}
#header .wrap{height:100px;display:flex;justify-content:space-between ;align-items:center;}
#header .logo img{height:36px;}
#header .right{display:flex;align-items:center;gap:0 50px;}
#header .right .nav ul{display:flex;align-items:center;gap:0 50px;}
#header .right .nav ul li a{font-size:16px;position:relative;line-height:50px;display:block;}
#header .right .nav ul li a:before{content:"";position:absolute;background-color:#0067e6;height:3px;width:0;bottom:0;left:50%;transition:all 300ms ease-in-out;}
#header .right .nav ul li a:hover:before{width:100%;left:0;}
#header .right .nav ul li.active a:before{width:100%;left:0;}
#header .right .zixun a{background:#0067e6;color:#fff;padding:6px 20px;border-radius:46px;font-size:22px; font-family:"din"}
#header .right .zixun a{display:flex;align-items:center;}
#header .right .zixun a i{ margin-right:5px; font-size:16px}
#header .right .zixun a:hover{background:#fb8320}
#header .right .mnav{display:none;}
#header.fixed .wrap{height:70px;}
#header.fixed .logo img{height:30px;}

#banner{width:100%;margin-top:100px;background:#333;}
#banner .focus{position:relative;}
#banner .focus .swiper-slide{position:relative;}
#banner .focus .swiper-slide .img img{width:100%;height:100%;object-fit:cover;}
#banner .focus .swiper-slide .info{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background:rgba(0,0,0,.7);}
#banner .focus .swiper-slide .info .title{font-size:60px;font-weight:700;color:#fff;line-height:1.3;text-align:center;}
#banner .focus .swiper-slide .info .desc{margin-top:50px;display:flex;justify-content:center;gap:0 30px;}
#banner .focus .swiper-slide .info .desc a{background:#0067e6;color:#fff;padding:10px 40px;border-radius:6px;font-size:16px;}
#banner .focus .swiper-slide .info .desc a:hover{background:#fff;color:#0067e6;}
#banner .focus .swiper-slide .info .desc a:last-child{background:#fff;color:#0067e6;}
#banner .focus .swiper-slide .info .desc a:last-child:hover{background:#0067e6;color:#fff;}
#banner .focus .swiper-pagination-bullet{width:8px;height:8px;border-radius:10px;background:#fff;opacity:.9;margin:0 5px;-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
#banner .focus .swiper-pagination-bullet-active{background:#fb8320;width:30px}

.stitle{text-align:center;}
.stitle h2{font-size:36px;position:relative;line-height:1.5;display:inline-block;padding-bottom:20px;}
.stitle h2:before{content:"";position:absolute;background-color:#0067e6;height:2px;width:40px;bottom:0;left:50%;transform:translatex(-20px);}
.stitle .desc{color:#888;padding:0 10vw;line-height:1.6;margin-top:20px;}
.more_btn a{display:inline-block;border:2px solid #eee;background:#fff;color:#0067e6;padding:8px 50px;border-radius:50px;font-size:16px;}
.more_btn a:hover{border:2px solid #0067e6;background:#0067e6;color:#fff;}

#apply{width:100%;padding:50px 0;}
#apply .list{margin-top:50px;overflow:hidden;}
#apply .list .tabs{display:flex;justify-content:center;align-items:center;gap:0 10px;}
#apply .list .tabs a{display:block;padding:0 20px;line-height:50px;background:#faf9f9;font-size:16px;border-radius:4px;}
#apply .list .tabs a.active{background:#0067e6;color:#fff;}
#apply .list .swiper-slide .item{display:flex;justify-content:space-between ;align-items:center;padding:30px 0;}
#apply .list .swiper-slide .item .text{width:48%;}
#apply .list .swiper-slide .item .text .big .bigtitle{font-size:28px;font-weight:700;}
#apply .list .swiper-slide .item .text .big .biginfo{font-size:16px;margin-top:10px;}
#apply .list .swiper-slide .item .text .slist h4{font-size:16px;margin-top:20px;}
#apply .list .swiper-slide .item .text .slist p{line-height:1.6;margin-top:10px;font-size:16px;}
#apply .list .swiper-slide .item .img{width:48%;}
#apply .list .swiper-slide .item .img img{width:100%;border-radius:10px;}
#apply .list .swiper-slide:nth-child(2n) .item{flex-direction:row-reverse;}
#apply .list .swiper-slide:nth-child(2n) .item:nth-child(2n){flex-direction:row;}
#tabs-tabbox{margin-top:50px;}

#count{width:100%;padding:50px 0;background:url(../images/bg_count.jpg) center center no-repeat #222;background-size:cover;}
#count .wrap{display:flex;justify-content:space-between ;align-items:center;padding:30px 0;}
#count .item{width:25%;text-align:center;}
#count .item .icon{font-size:50px;color:#fff;}
#count .item .num{margin-top:60px;display:flex;justify-content:center;align-items:flex-end;gap:0 5px;position:relative;padding-bottom:30px;}
#count .item .num big{font-size:38px;font-family:"din";line-height:1;color:#fff;}
#count .item .num sub{line-height:1.5;color:#fff;font-size:16px;}
#count .item .num:before{content:"";position:absolute;background-color:#0067e6;height:3px;width:40px;bottom:0;left:50%;transform:translatex(-20px);}
#count .item .text{font-size:16px;margin-top:20px;color:#fff;}

#product{width:100%;padding:50px 0;}
#product .list{margin-top:30px;overflow:hidden;}
#product .list .tabs{display:flex;justify-content:center;align-items:center;gap:0 3vw;}
#product .list .tabs a{position:relative;display:inline-block;font-size:18px;line-height:50px;}
#product .list .tabs a:before{content:"";position:absolute;background-color:#0067e6;height:2px;width:0;bottom:0;left:50%;transition:all 300ms ease-in-out;}
#product .list .tabs a.active:before{width:35px;transform:translatex(-15px);}
#product .list .tabs a:hover:before{width:35px;transform:translatex(-15px);}
#product .list .tabs a.active{color:#0067e6;}
#product .list ul{display:flex;align-items:center;flex-wrap:wrap;gap:30px;}
#product .list ul li{width:calc((100% - 90px) / 4);position:relative;padding-bottom:20px;border:1px solid #eee;overflow:hidden;border-radius:4px;}
#product .list ul li .img{text-align:center;overflow:hidden;}
#product .list ul li .img img{width:90%;}
#product .list ul li .title{text-align:center;font-size:18px;}
#product .list ul li .baojia{text-align:center;color:#0067e6;font-size:16px;font-weight:700;}
#product .list ul li .tag{position:absolute;right:10px;top:10px;}
#product .list ul li .tag i{padding:0 10px;line-height:30px;background:#0067e6;color:#fff;border-radius:4px; display: inline-block}
#product .list ul li .tag .new{background:#0b68f9;color:#fff;}
#product .list ul li .tag .hot{background:#ed3949;}
#product .list ul li .info{position:absolute;left:5vw;top:2vw;width:100%;height:100%;background:rgba(0,0,0,.7);padding:50px;opacity:0;}
#product .list ul li .info h4{font-size:18px;color:#fff;position:relative;padding-bottom:10px;}
#product .list ul li .info h4:before{content:"";position:absolute;background-color:#0067e6;height:2px;width:40px;bottom:0;left:0;}
#product .list ul li .info .intro{margin-top:20px;color:#fff;line-height:1.6;font-size:16px;}
#product .list ul li .info .btn{margin-top:30px;background:#0067e6;text-align:center;color:#fff;width:100%;line-height:40px;border-radius:6px;}
#product .list ul li .info .btn:hover{background:#fff;color:#0067e6;}
#product .list ul li:hover .info{opacity:1;left:0;top:0;padding:30px;}
#product .more_btn{margin-top:50px;text-align:center;}
#tabs-product{margin-top:50px; padding-bottom:10px}

#client{width:100%;background:url(../images/bg_client.jpg) center center no-repeat #222;background-size:cover;}
#client .focus{position:relative;}
#client .focus .swiper-slide{text-align:center;padding:100px 0;}
#client .focus .swiper-slide .title{font-size:40px;color:#fff;line-height:1.5;}
#client .focus .swiper-slide .desc{margin-top:50px;color:#fff;font-size:18px;line-height:1.6;padding:0 10vw;}
#client .focus .swiper-slide .user{margin-top:50px;color:#fff;font-size:18px;line-height:1.6;;}

#action{width:100%;padding:50px 0;}
#action .list{margin-top:50px;}
#action .list ul{display:flex;flex-wrap:wrap;gap:30px;}
#action .list ul li{width:calc((100% - 90px) / 4);background:#faf9f9;padding:30px 20px 50px;text-align:center;border-radius:6px;}
#action .list ul li{-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;transition:.3s;-ms-transition:.3s;}
#action .list ul li .icon img{height:40px;}
#action .list ul li .info .title{font-size:20px;font-weight:700;margin-top:15px;}
#action .list ul li .info .desc{font-size:15px;line-height:1.6;margin-top:15px;color:#555;}
#action .list ul li:hover{z-index:1;box-shadow:0px 0px 12px 0px rgba(0, 0, 0, 0.1);}
#action .list ul li:hover{-webkit-transform:translatey(-10px);-ms-transform:translatey(-10px);-o-transform:translatey(-10px);transform:translatey(-10px);}
#action .more_btn{margin-top:50px;text-align:center;}

#try{width:100%;background:url(../images/bg_try.jpg) no-repeat center center #222;background-size:cover;}
#try .wrap{padding:110px 0;display:flex;justify-content:space-between ;align-items:center;}
#try .text .title{font-size:30px;color:#fff;line-height:1.5;}
#try .text .desc{font-size:16px;color:#fff;margin-top:10px;}
#try .btn a{background:#0067e6;color:#fff;display:inline-block;padding:10px 50px;border-radius:50px;font-size:16px;}
#try .btn a:hover{color:#0067e6;background:#fff;}

#case{width:100%;padding:50px 0;}
#case .list{margin-top:50px;}
#case .list ul{display:flex;flex-wrap:wrap;gap:30px;}
#case .list ul li{width:calc((100% - 60px) / 3);background:#faf9f9;}
#case .list ul li .img{overflow:hidden;}
#case .list ul li .img img{width:100%;}
#case .list ul li .info{padding:30px;}
#case .list ul li .info .title{font-size:18px;line-height:1.6;}
#case .list ul li .info .title{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;}
#case .list ul li .info .pro{color:#888;margin-top:10px;}
#case .list ul li .info .desc{line-height:1.6;font-size:15px;margin-top:10px;color:#888;}
#case .list ul li .info .desc{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;display:-webkit-box;-webkit-box-orient:vertical;}
#case .list ul li .info .more{margin-top:20px;color:#0067e6;}
#case .list ul li .info .more i{margin-left:5px;font-size:12px;}
#case .list ul li .info .more i{-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;transition:.3s;-ms-transition:.3s;}
#case .list ul li:hover .info .more{ color:#fb8320}
#case .list ul li:hover .info .more i{margin-left:15px;}
#case .more_btn{margin-top:50px;text-align:center;}

#brand{width:100%;padding:40px 0;background:#faf9f9;border-top:1px solid #ddd;}
#brand .swiper-slide{width:calc((100% -100px) / 6);}
#brand .swiper-slide img{opacity:.5;}
#brand .swiper-slide img{-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;transition:.3s;-ms-transition:.3s;}
#brand .swiper-slide:hover img{opacity:1;}

#map{width:100%;padding:80px 0;background:#232323;}
#map .wrap{display:flex;justify-content:space-between ;}
#map .wrap .about{width:30%;}
#map .wrap .about .logo img{height:30px;}
#map .wrap .about .content{margin-top:20px;line-height:1.8;font-size:16px;color:#fff;}
#map .wrap .contact{width:30%;}
#map .wrap .contact .title{font-size:18px;font-weight:700;color:#fff;}
#map .wrap .contact .content{margin-top:20px;line-height:1.8;font-size:16px;color:#fff;}
#map .wrap .contact .content a{color:#fff; text-decoration:underline}
#map .wrap .qrcode .title{font-size:18px;font-weight:700;color:#fff;}
#map .wrap .qrcode .img{margin-top:20px;}
#map .wrap .qrcode .btn{margin-top:20px;}
#map .wrap .qrcode .btn a{background:#0067e6;color:#fff;display:block;border-radius:50px;text-align:center;padding:2px 0;}
#map .wrap .qrcode .btn a:hover{background:#fff;color:#0067e6;}

#copyright{width:100%;padding:10px 0;background:#111;color:#bbb;text-align:center;}
#copyright i{margin:0 10px;}
#copyright a{color:#bbb;}
#copyright a:hover{color:#0067e6;}
#copyright span,#copyright span a{color:#666}
#mnav{ display:none}
#gotop{ position:fixed; right:20px; bottom:2vw; z-index:350}
#gotop a{ width:50px; height:50px; background:#0067e6; color:#fff; font-size:16px; border-radius:50px; display:block}
#gotop a{display:flex;justify-content:center;align-items:center;}
#gotop :hover{background:#fb8320}

@media (max-width:1400px){
	.wrap{ padding:0 20px}
}
@media (max-width:1100px){
	#header .logo img{height:30px;}
	#header .right{gap:0 30px;}
	#header .right .nav ul{gap:0 30px;}
}
@media (max-width:900px){
	#header .logo img{height:26px;}
	#header .right{gap:0 20px;}
	#header .right .nav ul{gap:0 20px;}
}
@media (max-width:800px){
	body,html{font-size:.23rem;line-height:.34rem;}
	.wrap{ padding:0}
	
	#header{padding:0 .25rem;}
	#header .wrap{height:.9rem;}
	#header .logo img{height:.4rem;}
	#header .right{gap:0;}
	#header .right .nav{position:absolute;background:#fff;height:auto;min-height:100vh;width:100%;top:.9rem;z-index:999;padding:.1rem .25rem 0;transform:translatex(100%);left:0;border-top:1px solid #eee;}
	#header .right .nav ul{ display:block}
	#header .right .nav ul li{ border-bottom:1px solid #eee}
	#header .right .nav ul li a{font-size:.24rem;line-height:.8rem;}
	#header .right .nav ul li a:before{left:0;}
	#header .right .nav.isopen{transform:translatex(0); display:block}
	#header .right .zixun{display:none;}
	#header .right .mnav{position:relative;display:block;width:.34rem;height:.25rem;cursor:pointer;}
	#header .right .mnav span{position:absolute;display:block;width:.34rem;height:.05rem;background:#0067e6;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.fixed .wrap{height:.9rem;}
	#header.fixed .logo img{height:.4rem;}
	
	#banner{margin-top:.9rem;}
	#banner .focus{position:relative;}
	#banner .focus .swiper-slide .img{height:4rem;}
	#banner .focus .swiper-slide .info .title{font-size:.34rem;}
	#banner .focus .swiper-slide .info .desc{margin-top:.3rem;gap:0 .3rem;}
	#banner .focus .swiper-slide .info .desc a{padding:.1rem .4rem;font-size:.22rem;}
	
	.stitle h2{font-size:.4rem;padding-bottom:.2rem;}
	.stitle .desc{padding:0;margin-top:.2rem;font-size:.22rem;}
	.more_btn a{padding:.1rem .5rem;border-radius:.5rem;font-size:.22rem;}
	
	#apply{padding:.5rem .25rem;}
	#apply .list{margin-top:.5rem;}
	#apply .list .tabs{gap:.2rem;flex-wrap:wrap;justify-content:flex-start;}
	#apply .list .tabs a{padding:0 .2rem;line-height:.6rem;font-size:.22rem;}
	#apply .list .swiper-slide .item{padding:.3rem 0;display:block;}
	#apply .list .swiper-slide .item .text{width:100%;margin-top:.5rem;}
	#apply .list .swiper-slide .item .text .big .bigtitle{font-size:.34rem;}
	#apply .list .swiper-slide .item .text .big .biginfo{font-size:.22rem;margin-top:.1rem;}
	#apply .list .swiper-slide .item .text .slist h4{font-size:.22rem;margin-top:.2rem;}
	#apply .list .swiper-slide .item .text .slist p{line-height:1.6;margin-top:.1rem;font-size:.22rem;}
	#apply .list .swiper-slide .item .img{width:100%;}
	#tabs-tabbox{margin-top:.5rem;}
	
	#count{padding:.5rem .25rem ;}
	#count .wrap{padding:.3rem 0;flex-wrap:wrap;gap:.5rem 0;}
	#count .item{width:50%;}
	#count .item .icon{font-size:.5rem;}
	#count .item .num{margin-top:.3rem;padding-bottom:.3rem;}
	#count .item .num big{font-size:.5rem;}
	#count .item .num sub{font-size:.22rem;}
	#count .item .text{font-size:.22rem;margin-top:.2rem;;}
	
	#product{padding:.5rem .25rem;}
	#product .list{margin-top:.3rem;}
	#product .list .tabs{gap:.2rem .4rem;flex-wrap:wrap;}
	#product .list .tabs a{font-size:.24rem;line-height:.5rem;}
	#product .list .tabs a.active:before{width:100%;transform:translatex(-50%);}
	#product .list .tabs a:hover:before{width:100%;transform:translatex(-50%);}
	#product .list ul{gap:.3rem;}
	#product .list ul li{width:calc((100% - .3rem) / 2);padding-bottom:.2rem;}
	#product .list ul li .img img{width:90%;}
	#product .list ul li .title{font-size:.24rem;}
	#product .list ul li .baojia{font-size:.22rem;}
	#product .list ul li .tag{right:.1rem;top:.1rem;}
	#product .list ul li .tag i{padding:0 .1rem;line-height:.36rem; font-size:.2rem}
	#product .list ul li .info{display:none;}
	#product .more_btn{margin-top:.5rem;}
	#tabs-product{margin-top:.5rem;}
	
	#client .focus .swiper-slide{padding:1rem .25rem;}
	#client .focus .swiper-slide .title{font-size:.4rem;}
	#client .focus .swiper-slide .desc{margin-top:.5rem;font-size:.24rem;padding:0;}
	#client .focus .swiper-slide .user{margin-top:.5rem;font-size:.22rem;;}
	
	#action{padding:.5rem .25rem;}
	#action .list{margin-top:.5rem;}
	#action .list ul{gap:.3rem;}
	#action .list ul li{width:calc((100% - .3rem) / 2);padding:.3rem .2rem .5rem;}
	#action .list ul li .icon img{height:.5rem;}
	#action .list ul li .info .title{font-size:.26rem;margin-top:.2rem;}
	#action .list ul li .info .desc{font-size:.22rem;margin-top:.22rem;}
	#action .more_btn{margin-top:.5rem;}
	
	#try{padding:0 .25rem;}
	#try .wrap{padding:1rem 0;display:block;}
	#try .text .title{font-size:.3rem;text-align:center;}
	#try .text .desc{font-size:.22rem;margin-top:.1rem;text-align:center;}
	#try .btn{text-align:center;margin-top:.5rem;}
	#try .btn a{padding:.1rem .5rem;border-radius:.5rem;font-size:.24rem;}
	
	#case{padding:.5rem .25rem;}
	#case .list{margin-top:.5rem;}
	#case .list ul{gap:.3rem;}
	#case .list ul li{width:100%;}
	#case .list ul li .info{padding:.3rem;}
	#case .list ul li .info .title{font-size:.26rem;}
	#case .list ul li .info .title{-webkit-line-clamp:20;}
	#case .list ul li .info .pro{margin-top:.1rem;}
	#case .list ul li .info .desc{font-size:.22rem;margin-top:.1rem;}
	#case .list ul li .info .more{margin-top:.2rem;font-size:.22rem;}
	#case .list ul li .info .more i{margin-left:.1rem;font-size:.2rem;}
	#case .list ul li:hover .info .more i{margin-left:.2rem;}
	#case .more_btn{margin-top:.5rem;}
	
	#brand{padding:.4rem .25rem;}
	#brand .swiper-slide{width:calc((100% -.6rem) / 3);}
	#brand .swiper-slide img{width:100%;}
	
	#map{padding:.8rem .25rem;;}
	#map .wrap{display:block;}
	#map .wrap .about{width:100%;}
	#map .wrap .about .logo img{height:.4rem;}
	#map .wrap .about .content{margin-top:.2rem;line-height:1.6;font-size:.22rem;}
	#map .wrap .contact{width:100%;margin-top:.5rem;}
	#map .wrap .contact .title{font-size:.26rem;}
	#map .wrap .contact .content{margin-top:.2rem;line-height:1.6;font-size:.22rem;}
	#map .wrap .qrcode{margin-top:.5rem;}
	#map .wrap .qrcode .title{font-size:.26rem;;}
	#map .wrap .qrcode .img{margin-top:.2rem;}
	#map .wrap .qrcode .btn{margin-top:.5rem;}
	#map .wrap .qrcode .btn a{display:inline-block;border-radius:.5rem;padding:.1rem .5rem;}
	
	#copyright{padding:.2rem 0 1rem;font-size:.2rem;}
	#copyright i{margin-left:0;display:block;}
	
	#mnav{ display:block;width:100%; background:#0067e6; position:fixed; left:0; bottom:0; z-index:30}
	#mnav{padding-bottom:constant(safe-area-inset-bottom);padding-bottom:env(safe-area-inset-bottom);}
	#mnav .box{display:flex;justify-content:space-between; padding:.1rem 0;}
	#mnav .box a{ width:50%; text-align:center;color:#fff; font-size:.22rem; padding:.1rem 0;}
	#mnav .box a i{ margin-right:.1rem; font-size:.2rem}
	#mnav .box a:last-child{ border-left:1px solid rgba(255,255,255,.3)}
	
	#gotop{ right:.25rem; bottom:20vw;}
	#gotop a{ width:.6rem; height:.6rem; font-size:.24rem; border-radius:.6rem}
}

#nbanner{ width:100%; position:relative; margin-top:100px}
#nbanner .img img{width:100%;height:100%;object-fit:cover;}
#nbanner .info{ position:absolute; left:0; top:0; width:100%; height:100%;}
#nbanner .info{display:flex;justify-content:center;align-items:center;}
#nbanner .info .text{ font-size:44px; color:#fff; position:relative; line-height:2}
#nbanner .info .text:before{content:"";position:absolute;background-color:#0067e6;height:2px;width:100px;bottom:0;left:0;}

#clist{ border-bottom:1px solid #eee}
#clist .wrap{display:flex;justify-content:center;align-items:center;gap:3vw}
#clist a{ padding:15px 0; font-size:16px; position:relative}
#clist a.active:before{content:"";position:absolute;background-color:#0067e6;height:2px;width:100%;bottom:0;left:0;}
#clist a.active{ color:#0067e6; font-weight:700}

#main{ width:100%}
#main .apply{ padding:50px 0}
#main .apply .item{display:flex;justify-content:space-between ;align-items:center;padding:60px 0; border-bottom:1px solid #eee}
#main .apply .item .text{width:48%;}
#main .apply .item .text .big .bigtitle{font-size:28px;font-weight:700;}
#main .apply .item .text .big .biginfo{font-size:16px;margin-top:10px;}
#main .apply .item .text .slist h4{font-size:16px;margin-top:20px;}
#main .apply .item .text .slist p{line-height:1.6;margin-top:10px;font-size:16px;}
#main .apply .item .img{width:48%;}
#main .apply .item .img img{width:100%;border-radius:10px;}
#main .apply .item:nth-child(2n){flex-direction:row-reverse;}
#main .apply .item:last-child{ border-bottom:0}

#main .product{ padding:50px 0}
#main .product ul{display:flex;align-items:center;flex-wrap:wrap;gap:30px;}
#main .product ul li{width:calc((100% - 90px) / 4);position:relative;padding-bottom:20px;border:1px solid #eee;overflow:hidden;}
#main .product ul li .img{text-align:center;overflow:hidden;}
#main .product ul li .img img{width:90%;}
#main .product ul li .title{text-align:center;font-size:18px;}
#main .product ul li .baojia{text-align:center;color:#0067e6;font-size:16px;font-weight:700;}
#main .product ul li .tag{position:absolute;right:10px;top:10px;}
#main .product ul li .tag i{padding:0 10px;line-height:30px;background:#0067e6;color:#fff;border-radius:4px; display: inline-block}
#main .product ul li .tag .new{background:#0b68f9;color:#fff;}
#main .product ul li .tag .hot{background:#ed3949;}
#main .product ul li .info{position:absolute;left:5vw;top:2vw;width:100%;height:100%;background:rgba(0,0,0,.7);padding:50px;opacity:0;}
#main .product ul li .info h4{font-size:18px;color:#fff;position:relative;padding-bottom:10px;}
#main .product ul li .info h4:before{content:"";position:absolute;background-color:#0067e6;height:2px;width:40px;bottom:0;left:0;}
#main .product ul li .info .intro{margin-top:20px;color:#fff;line-height:1.6;font-size:16px;}
#main .product ul li .info .btn{margin-top:30px;background:#0067e6;text-align:center;color:#fff;width:100%;line-height:40px;border-radius:6px;}
#main .product ul li .info .btn:hover{background:#fff;color:#0067e6;}
#main .product ul li:hover .info{opacity:1;left:0;top:0;padding:30px;}

#main .case{ padding:50px 0}
#main .case ul{display:flex;align-items:center;flex-wrap:wrap;gap:30px;}
#main .case ul li{width:calc((100% - 60px) / 3);background:#faf9f9;}
#main .case ul li .img{overflow:hidden;}
#main .case ul li .img img{width:100%;}
#main .case ul li .info{padding:30px;}
#main .case ul li .info .title{font-size:18px;line-height:1.6;}
#main .case ul li .info .title{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;}
#main .case ul li .info .pro{color:#888;margin-top:10px;}
#main .case ul li .info .desc{line-height:1.6;font-size:15px;margin-top:10px;color:#888;}
#main .case ul li .info .desc{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;display:-webkit-box;-webkit-box-orient:vertical;}
#main .case ul li .info .more{margin-top:20px;color:#0067e6;}
#main .case ul li .info .more i{margin-left:5px;font-size:12px;}
#main .case ul li .info .more i{-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;transition:.3s;-ms-transition:.3s;}
#main .case ul li:hover .info .more i{margin-left:15px;}

#main .contact{ padding:50px 0}
#main .contact .content{ background:#fff; padding:20px 20px;display:flex;justify-content:space-between ;}
#main .contact .content .item{ width:24%; border:1px solid #eee; padding:40px 20px; text-align:center; border-radius:6px}
#main .contact .content .item .icon{display:inline-block;width:80px;height:80px;font-size:30px;line-height:80px;color:#fff;background:#0067e6;}
#main .contact .content .item .icon{border:1px solid #eee;border-radius:100% 50% 50% 100% / 75% 69% 69% 75%;}
#main .contact .content .item .info{ margin-top:30px}
#main .contact .content .item .info .title{ font-size:18px; font-weight:700}
#main .contact .content .item .info .desc{ margin-top:20px; font-size:18px}
#main .contact .content .item .info .desc a{ text-decoration:underline}
#main .contact .map{ margin-top:20px; background:#fff; padding:20px 20px;display:flex;justify-content:space-between ;}
#main .contact .map .mapbox{ width:50%}
#main .contact .map .mapbox iframe{ width:100%; height:100%}
#main .contact .map .formbox{ width:45%; padding:20px 0}
#main .contact .map .formbox .item{ padding:10px 0}
#main .contact .map .formbox .item .text{ width:100%; border:1px solid #ddd; border-radius:4px; padding:13px 20px;}
#main .contact .map .formbox .item .text:focus{border-color:#fb8320!important;}
#main .contact .map .formbox .item .textarea{ width:100%; border:1px solid #ddd; border-radius:4px; padding:13px 20px; height:100px}
#main .contact .map .formbox .item .textarea:focus{border-color:#fb8320!important;}
#main .contact .map .formbox .button .btn{ display:inline-block; border:0; background:#0067e6; border-radius:4px; padding:13px 50px; font-size:16px; color:#fff; cursor:pointer}
#main .contact .map .formbox .button .btn:hover{ background:#fb8320}

@media (max-width:800px){
	body,html{font-size:.23rem;line-height:.34rem;}
	#nbanner{ margin-top:.9rem}
	#nbanner .img{ height:3rem}
	#nbanner .info{ padding:0 .25rem}
	#nbanner .info .text{ font-size:.4rem; text-align:center}
	#nbanner .info .text:before{width:40px;left:50%;transform:translatex(-50%);}
	
	#clist{ border-bottom:1px solid #eee;padding:.2rem .25rem}
	#clist .wrap{flex-wrap:wrap;gap:0 8vw}
	#clist a{ padding:.1rem 0; font-size:.24rem;}

	#main .apply{ padding:.2rem .2rem}
	#main .apply .item{padding:.5rem 0;display:block;}
	#main .apply .item .text{width:100%;margin-top:.5rem;}
	#main .apply .item .text .big .bigtitle{font-size:.34rem;}
	#main .apply .item .text .big .biginfo{font-size:.22rem;margin-top:.1rem;}
	#main .apply .item .text .slist h4{font-size:.22rem;margin-top:.2rem;}
	#main .apply .item .text .slist p{line-height:1.6;margin-top:.1rem;font-size:.22rem;}
	#main .apply .item .img{width:100%;}
	
	#main .product{ padding:.5rem .25rem}
	#main .product ul{gap:.3rem;}
	#main .product ul li{width:calc((100% - .3rem) / 2);padding-bottom:.2rem;}
	#main .product ul li .img img{width:90%;}
	#main .product ul li .title{font-size:.24rem;}
	#main .product ul li .baojia{font-size:.22rem;}
	#main .product ul li .tag{right:.1rem;top:.1rem;}
	#main .product ul li .tag i{padding:0 .1rem;line-height:.36rem; font-size:.2rem}
	#main .product ul li .info{display:none;}
	
	#main .case{ padding:.5rem .25rem}
	#main .case ul{gap:.3rem;}
	#main .case ul li{width:100%;}
	#main .case ul li .info{padding:.3rem;}
	#main .case ul li .info .title{font-size:.26rem;}
	#main .case ul li .info .title{-webkit-line-clamp:20;}
	#main .case ul li .info .pro{margin-top:.1rem;}
	#main .case ul li .info .desc{font-size:.22rem;margin-top:.1rem;}
	#main .case ul li .info .more{margin-top:.2rem;font-size:.22rem;}
	#main .case ul li .info .more i{margin-left:.1rem;font-size:.2rem;}
	#main .case ul li:hover .info .more i{margin-left:.2rem;}
	
	#main .contact .content{padding:.2rem;flex-wrap:wrap;gap:.2rem;}
	#main .contact .content .item{ width:100%; padding:.3rem;}
	#main .contact .content .item .icon{width:1rem;height:1rem;font-size:.3rem;line-height:1rem;}
	#main .contact .content .item .info{ margin-top:.3rem}
	#main .contact .content .item .info .title{ font-size:.24rem;}
	#main .contact .content .item .info .desc{ margin-top:.2rem; font-size:.26rem; line-height:1.6}
	#main .contact .map{ margin-top:.2rem;  padding:.2rem;display: block;}
	#main .contact .map .mapbox{ width:100%}
	#main .contact .map .mapbox iframe{ width:100%; height:5rem}
	#main .contact .map .formbox{ width:100%; padding:.3rem  0 0}
	#main .contact .map .formbox .item{ padding:.1rem 0}
	#main .contact .map .formbox .item .text{padding:.2rem .2rem; font-size:.22rem}
	#main .contact .map .formbox .item .textarea{  padding:.2rem; height:1.5rem; font-size:.22rem}
	#main .contact .map .formbox .button .btn{padding:.2rem 0; width:100%; font-size:.24rem;}	

}

#fenye{padding:50px 0 0px;display:flex;align-items:center;justify-content:center;gap:0 10px}
#fenye a{color:#5a5a5a;padding:8px 15px;border:1px solid #eee;border-radius:4px}
#fenye .prev,#fenye .next{width:52px;text-align:center}
#fenye a.curr{font-weight:700;color:#fff;background:#0067e6;border:1px solid #0067e6}
#fenye a:hover{background:#0067e6;color:#fff;border:1px solid #0067e6}

@media (max-width:800px){
	body,html{font-size:.23rem;line-height:.34rem;}
	#fenye{padding:.5rem 0 0px;gap:0 .1rem}
	#fenye a{margin:0 .02rem;padding:.1rem .15rem}
	#fenye .prev,#fenye .next{width:.55rem;}
	#fenye .num,#fenye .prev{ display:none}
}