@charset "utf-8";
html{color:#000;background:#FFF; }
body { color:#666;font-size:12px} /*网站字体颜色*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,th,var,optgroup{font-style:inherit;font-weight:inherit;}
del,ins{text-decoration:none;}
li{list-style:none;}
caption,th{text-align:left;}
q:before,q:after{content:'';}
abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:baseline;}
sub{vertical-align:baseline;} 
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit; }
input,button,textarea,select{*font-size:100%;}
input,select{vertical-align:middle;}
i,em{ font-style:normal;}
select,input,button,textarea,button{font-size:99%}
table{font-size:inherit;font-size:100%; border-collapse:collapse;}
pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}
/*title*/
h1 { font-size:32px; text-align:center;}
h2 { font-size:26px;}
h3 { font-size:20px;}
h4 { font-size:14px;}
h5 { font-size:12px;}
h6 { font-size:10px;}

.mt10{ margin-top:10px;}

a { color:#666; text-decoration:none;}  /*for ie f6n.net*/
a:focus{outline:0;} /*for ff f6n.net*/
.vam { vertical-align:middle;}
.clear{ clear:both; height:0; line-height:0; font-size:0;}
.clearfix:after{ content:""; clear:both; height:0; visibility:hidden; display:block;}
.clearfix{*zoom:1}
p{ word-spacing:-1.5px;}
.tr { text-align:right;}
.tl { text-align:left;}
.center { text-align:center;}
.fl { float:left;}
.fr { float:right;}
.pa{ position:absolute;}
.pr{ position:relative}
/* -- 购物车外部框架 -- */
.cart_header , .cart_content , .cart_footer { width:760px; margin:0 auto;}

/* -- 页面整体布局 -- */
.header , .content , .footer { width:1200px; margin:0 auto;  }
.h_nav li a:-webkit-any-link{ display:block;}






/* -- 以上部分以前resetcommon -- */



/* -- 首页样式开始 -- */
.clearfix{*zoom:1}
i,em{ font-style:normal;}

body{min-width: 1200px;max-width: 1920px;margin: 0 auto;overflow-x: hidden; width: 100%; }

.bantest {position: relative;width: 100%;overflow: hidden;}  
.banner{ width:100%; position:relative;}
.banner .slick-dotted.slick-slider{ margin:0;}
.banner img{ display:block; /* width:100%; */}
.banner .slick-arrow {position: absolute;font-size: 0;top: 50%;z-index: 9; width:73px; height: 73px; margin-top: -73px;border: 0; outline: none;overflow:hidden;}
.banner .slick-prev {left: 10%; display: none; background:url(../images/ban_prev.png) no-repeat;}
.banner .slick-next {right: 10%; display: none;background:url(../images/ban_next.png) no-repeat;}   
.slick-dots { position: absolute;left: 50%; font-size:0; bottom: 8%;width: 300px;text-align: center;margin-left: -175px;z-index: 11;}
.slick-dots li {display: inline-block;margin: 0 8px; }
.slick-dots li button {display: block;background:url(../images/ban_dot1.png) no-repeat;width: 26px;height: 26px;border-radius: 26px;border:0; box-shadow:0; -webkit-transition: .5s;-moz-transition: .5s;transition: .5s;}
.slick-dots .slick-active button {background:url(../images/ban_dot2.png) no-repeat;border:0;} 

.tit{ font-size:50px ; text-align:center; color:#3e3a39;}
.tit a{ color:#333;}
.tit em{ display:block; font-size:20px; padding:30px 0 0; margin-top:6px;font-weight:normal;  background:url(../images/line.png) no-repeat center top;}

.guide{ height:574px; overflow:hidden; background:url(../images/guide_bg.jpg) no-repeat center top; padding-top:133px;}
.guide .content{ width:1400px; position:relative;}
.guide dl{ height:auto; background:#fff url(../images/guide_bg.png) no-repeat 98.5% 20px;}
.guide dt{ width:50%;overflow:hidden; position:relative; float:left;}
/*.guide dt em{ display:block;width:100%; height:100%; background:rgba(0,0,0,0.5) url(../images/guide_v.png) no-repeat center center; position:absolute; top:0;}*/
.guide dt img{ display:block;width:100%;}
.guide dd{ width:42%; float:right; padding:10px 3% 0 0;}
.guide dd h3{ font-size:30px ; color:#333;}
.guide dd p{font-size:16px ; line-height:30px; color:#666; margin:5px 0 0px;}
.guide dd h5{ padding-top:10px;}
.guide dd h5 img{ display:block;}
.guide ul{ width:1400px; margin:35px auto 0; height:120px;}
.guide li{ width:20%; float:left; text-align:center; font-size:20px ; color:#666; height:95px; border-right:1px solid #cecece; box-sizing:border-box;}
/*.guide li:nth-child(2n){ border:0;}*/
.guide li span{ display:block; font-size:60px;color:#333;}
.guide li span em{ display:inline-block; width:27px; height:27px; border-radius:27px; font-size:16px ; text-align:center; line-height:27px; color:#FFF;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fbef9d+19,bf8c21+93 */
background: #ef7a00}


@media (min-width: 1200px) and (max-width: 1680px) {
	.guide ul{ width:1200px; margin:10px auto 0; height:120px;}
}


.mlu{ position:absolute; top:280px; left:-50px;}


.pro{padding-top:80px; height:auto; background:url(../images/pro_bg.jpg) no-repeat center top; overflow:hidden;}
.pro .content{ width:1400px; margin:0 auto;}
.prot{ height:160px;}
.prot h3{ width:33%; float:left; padding-left:2%; font-size:50px ; color:#fff;}
.prot h3 a{ display:block; color:#fff;}
.prot h3 em{ display:block; font-size:22px; padding-top:6px;}
.prot p{ width:40%; float:right;}
.prot p span{display:block; width:25%; float:left; text-align:center; font-size:22px ; color:#fff; height:95px; border-right:1px solid rgba(255,255,255,0.2); box-sizing:border-box;}
.prot p span img{ display:block; margin:0 auto 10px; width:67px; height:67px;}
.prot p em{ display:block; font-size:22px ; color:#fff;}
.prot p:last-child{ border:0;}
.pro01{ background:#fff; padding:30px 2% 0;    border-bottom: #fff 1px solid;}
.pro02{ float:left; width:24.63%; overflow:hidden;}
.pro02 h3{ width:100%; float:left; border-right:1px solid #fff; font-size:23px ; font-weight:bold; margin-bottom:1px; box-sizing:border-box; text-align:center; background:#efedec; height:134px;line-height: 134px; overflow:hidden}
.pro02 h3 a{ display:block; color:#333; height:134px;}
.pro02 h3 a span{ /*margin-left:-40px;*/ display:inline-block}
.pro02 h3 em{ float:left; padding-left:45px;}
.pro02 h3 em img{ width:68px; }
.pro02 .cur a{ font-size:23px;background:#ef7a00; color:#FFF}
.pro02 .cur a img{margin-top:-134px;}
.pro03{ width:74.3%!important; float:right;}
.pro03 p{ overflow:hidden;width:100%!important;}
.pro03 p img{ display:block; width:100%;}
.pro03 p:before{content: '';
            cursor: pointer;
            position: absolute;
            left: -100%;
            top: 0;
            width: 100%;
            height: 100%;
            background-image: -moz-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0));
            background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0));
            transform: skewx(-25deg);}
.pro03 p:hover:before{
            left: 100%;
            -moz-transition: 1s;
            -o-transition: 1s;
            -webkit-transition: 1s;
            transition: 1s;
        }
.sure_phone{width: 313px; height: 135px; background: #ef7a00 url(../images/quanguo.png) no-repeat center 35px;}
.sure_phone span{ display: block;color: #fff; font-size: 30px; font-weight: bold; padding-top: 70px; padding-left: 30px;}
		
.pro1{ margin:55px 0 0 2%;}
.pro1 li{ overflow:hidden; width:22.7%; float:left; margin-right:2.4%; margin-bottom:18px;}
.pro1 li img{ display:block; width:100%;-moz-transition: 1s;transition: 1s;}
.pro1 li em{ display:block; overflow:hidden;    border: 1px solid #ccc;}
.pro1 li span{ display:block; height:60px; border-bottom:1px solid #d7d7d7; font-size:18px ; text-align:center; line-height:60px; color:#666;}
.pro1 li:hover span{border-bottom:0 solid rgba(187,135,27,1); color:#000; font-weight:bold;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#bb871b+0,faee9e+100 */
background:#ef7a00; color:#FFF}
.pro1 li:nth-child(4n){ margin-right:0;}		
.pro1 li:hover img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
			
.prosou{ height:163px; margin:40px 2% 50px; background:#efedec;}
.prosou h4{ width:18.73%;float:left;height:163px;background:#ef7a00; background-size:100% 100%; font-size:24px ; text-align:center; color:#FFF;}
.prosou h4 em{ display:block; width:34px; height:34px; background:url(../images/sou_q.png) no-repeat; margin:33px auto 12px;}
.prosou p{ width:78%; float:right; padding-top:39px; font-size:16px ; line-height:36px; color:#666;}
.prosou p a{ display:block; float:left; width:25%; height:36px; line-height:36px; overflow:hidden;}
.prosou p a:hover{ font-weight:bold; color:#000;}	
		


.shil{ background:url(../images/shil_bg.jpg) no-repeat center top; padding:60px 0 0; height:880px;}
.shil .tit,.shil .tit em{ color:#fff;}	
.shil .content{ width:1400px; margin:0 auto;}
.shil1{ background:#fff; margin-top:55px; padding:20px 0 20px 1.8%;}
.shil2{ float:left; width:44%!important;}
.shil2 dl{ position:relative; height:564px;}
.shil2 dt{ overflow:hidden;}
.shil2 dt img{ display:block; width:100%;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.shil2 dt:hover img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.shil2 dd{ width:720px; height:165px; background:#f8f8f8; position:absolute; bottom:10%; left:96%;}
.shil2 dd b{ display:block; float:left; width:12.5%; margin:50px 2% 0 2%;}
.shil2 dd h5{ float:left; width:80%; margin-top:40px; font-size:30px ; font-weight:bold; color:#333;}
.shil2 dd h5 p{ font-size:16px ; color:#666; margin-top:8px;}	
.shil3{ width:55%; float:left;}
.shil3 h3{ width:23.5%; float:left; margin-left:1.5%;}
.shil3 h3 img{ display:block; width:100%;}
.shil3 h3 em{ display:block; height:66px; margin-bottom:20px; backface-visibility:#fff; box-shadow:0 0 0.5rem #ccc; border-radius:0 0 0 2rem; font-size:24px ; text-align:center; line-height: 60px;color:#333;}
.shil3 .cur em{ font-weight:bold; color:#FFF;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#bb871b+5,faee9e+54,bb871b+99 */
background:#ef7a00}

@media (min-width: 1200px) and (max-width: 1680px) {
	.shil2 dt{ overflow:hidden;width: 100%!important;}
	.shil2 dd{/* width:98%; */ }
	.shil2 dd h5{ float:right}
}	

		
.case{ margin:75px 0;}
.case .content{ width:1400px; margin:0 auto;}
.caset{ height:55px; margin:45px 0 12px;}
.caset h3,.caset h5{ width:15%; float:left; font-size:20px ; line-height:55px; text-align:center; position:relative; border:1px solid #cccccc; margin-right:1.6%;}
.caset h3:nth-child(6){ margin-right:0}
.caset h3 img,.caset h5 img{ vertical-align:middle; padding-right:1%;}
.caset h3 a,.caset h5 a{ display:block; color:#666;}
.caset .cur a,.caset li:hover a{ color:#FFF; font-weight:bold;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#bb871b+5,faee9e+54,bb871b+99 */
background:#ef7a00}
.case4{ width:73.42%; height:650px; float:left; overflow:hidden;}
.case4 dl{ height:700px;}
.case4 dt img{ display:block; width:100%;}
.case4 dd{ background:#fff; position:relative; z-index:1; box-shadow:0 0 0.5rem #ccc; width:90%; margin:-50px auto 0; padding:20px 3%;}
.case4 dd h4 a{ display:block; font-size:24px ; color:#333;}
.case4 dd p{ font-size:16px ; color:#666; padding-top:5px;}
.case3{ width:25.71%; float:right;}
.case3 li{ overflow:hidden; margin-bottom:9px; position:relative;}
.case3 li img{ display:block; width:100%;}
.case3 .cur1{ border:3px solid #ef7a00; box-sizing:border-box;}
.case3 li:before{content: '';
            cursor: pointer;
            position: absolute;
            left: -100%;
            top: 0;
            width: 100%;
            height: 100%;
            background-image: -moz-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0));
            background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0));
            transform: skewx(-25deg);}
.case3 li:hover:before{
            left: 100%;
            -moz-transition: 1s;
            -o-transition: 1s;
            -webkit-transition: 1s;
            transition: 1s;
        }



.super{ background:url(../images/super_bg.jpg) no-repeat center top; padding:80px 0 55px;}
.super .content{ width:1400px; margin:0 auto;}
.super2{ height:836px;}
.super1{ position:relative;}
.super2 dl{ margin-top:66px; position:relative;}
.super2 dt{ height:968px; height:493px; float:right; position:relative; margin-right:-260px;margin-top: 43px;}
.super2 dd{ width:43.9%; margin:135px 0 0 0;}
.super2 dd h3{ height:140px; background:url(../images/super_icon1.png) no-repeat left 6px; font:40px "Microsoft YaHei UI"; font-weight:bold; color:#242424; padding-left:85px;}
.super2 dl:nth-child(2) dd h3{background:url(../images/super_icon2.png) no-repeat left 6px;}
.super2 dl:nth-child(3) dd h3{background:url(../images/super_icon3.png) no-repeat left 6px;}
.super2 dl:nth-child(4) dd h3{background:url(../images/super_icon4.png) no-repeat left 6px;}
.super2 dd h3 span{ display:block; font-size:24px;}
.super2 dd p{ font:16px "Microsoft YaHei UI"; line-height:30px; color:#666; background:url(../images/super_arr.png) no-repeat left 8px; padding-left:20px;}
.supert{ margin-top:10px; float:left; width:67.14%;}
.supert h3{ width:23.936%; float:left; margin-right:0.8%; position:relative;}
.supert h3 img{ display:block; width:100%;}
.supert h3 em{ display:block; font:18px "Microsoft YaHei UI"; text-align:center; height:32px; line-height:32px; color:#fff; background:rgba(0,0,0,0.5); width:100%; position:absolute; bottom:0;}
.supert .cur{ border:3px solid #ef7a00; box-sizing:border-box;}
.supert .cur em{ display:none;}
.super h5{ width:32.14%; float:right; margin-top:45px;}
.super h5 span{ display:block; width:50%; float:left; background:url(../images/super_lx.png) no-repeat left 2px; padding-left:50px; font:6px "Microsoft YaHei UI"; color:#666;}
.super h5 span em{ display:block; font:30px Arial, Helvetica, sans-serif; font-weight:bold; color:#ef7a00;}
.super h5 a{ display:block; float:right; width:34.22%; height:50px; font:22px "Microsoft YaHei UI"; text-align:center; line-height:50px; color:#FFF;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#bb871b+5,faee9e+54,bb871b+99 */
background: #ef7a00}


.process{ height:403px; overflow:hidden; background:url(../images/process_bg.jpg) no-repeat center top; padding-top:60px;}
.process .tit{ color:#fff;}
.process .content{ width:1400px; margin:0 auto;}
.process ul{ height:190px; background:#fff; margin-top:40px; position:relative;}
.process ul:before{ content:""; position:absolute; top:55%; left:0; width:100%; height:1px; background:#d5d5d5;}
.process li{ width:11.11%; float:left; text-align:center; font-size:20px ; color:#333; position:relative;}
.process li em{ display:block; width:45px; height:45px; margin:35px auto 50px;}
.process li:before{ content:""; position:absolute; top:97px; left:50%; margin-left:-8px; width:17px; height:17px; background:#eee; z-index:1;}
.process li:after{ content:""; position:absolute; top:102px; left:50%; margin-left:-3px; width:7px; height:7px; background:#ababab; z-index:1;}
.process li:hover{ font-weight:bold; color:#ef7a00;}
.process li:hover:before{ background:#f5ecd9;}
.process li:hover:after{ background:#ef7a00;} 


.news{ margin-top:75px; overflow:hidden;}
.news .content{ width:1400px; margin:0 auto; position:relative;}
.dy{ width:26%;}
.dy .tit{ text-align:left;}
.dy .tit em{ background:none; padding:0;}
.dy h3{ margin-top:55px; font-size:26px ; color:#333;}
.dy h3 a{ color:#333; border-bottom:4px solid #ef7a00;}
.dy2{ width:72.857%; float:right;overflow:hidden; height:386px;}
.dy2 dl{ border-left:1px solid #d9d9d9; width:31.37%; float:left; margin-right:34px;}
.dy2 dt{ overflow:hidden;}
.dy2 dt img{ display:block; width:100%;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.dy2 dd{ padding:32px 2% 0 6%;}
.dy2 dd h4 a{ display:block; font-size:20px ; font-weight:bold; line-height:35px; color:#000;}
.dy2 dd p{ font-size:16px ; line-height:28px; color:#333; height:56px; overflow:hidden;}
.dy2 dd em{ display:block; font-size:16px; color:#333; margin-top:28px;}
.dy_arr{ width:15%; position:absolute; top:85%; left:0;}
.dy_arr:before{ content:""; position:absolute; top:15%; left:50%; width:1px; height:70%; background:#e3e3e3;}
.dy2 dt:hover img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.dy2 dl:hover dd h4 a{ text-decoration:underline;}
	

.faq{ width:1400px; padding:65px 0; margin:50px auto 0;border-top:1px solid #d9d9d9;}
.faq h3{ width:15%; font-size:26px ; color:#333; float:left;}
.faq h3 a{ color:#333; border-bottom:4px solid #ef7a00;}
.faq1{width:72.857%; float:right;overflow:hidden;}
.faq1 dl{ width:31.37%; float:left; margin-right:36px;}
.faq1 dt{ width:18.75%; float:left; height:60px; background:#999999; font-size:20px ; text-align:center; line-height:30px; color:#ffffff;}
.faq1 dt em{ display:block; color:#fff;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#faee9e+10,bb871b+100 */
background: #ef7a00}
.faq1 dd{ width:75.9375%; float:right;}
.faq1 dd h4 a{ display:block; font-size:16px ; font-weight:bold; line-height:30px; height:30px; color:#000; overflow:hidden;}
.faq1 dd p{ font-size:16px ; line-height:24px; color:#666; margin-top:5px;}
.faq1 dl:hover dd h4 a,.faq1 dl:hover dt a{ text-decoration:underline;}




.about{ background:url(../images/about.jpg) no-repeat center top; padding-top:120px; margin-bottom:40px;}
.about dl{ background:#fff; box-shadow:0 0 0.2rem #ccc; width:1400px; margin:0 auto; padding:25px 0 0 0;}
.about dt{ width:51%; float:right; margin-right:21px;}
.about dt img{ display:block; width:100%;}
.about dd{ width:42%; float:left; padding:50px 0 0 3.3%;}
.about dd h3{ font-size:50px ; color:#333; position:relative;}
/* .about dd h3:before{ content:""; position:absolute; top:-75px; left:0; width:2px; height:174px; background:#ef7a00;} */
.about dd h3 a{ display:block; color:#333; padding-left:30px;}
.about dd h3 em{ display:block; font-size:22px ; color:#666;}
.about dd p{ font-size:16px ; line-height:30px; color:#666; margin:46px 0 0 0;}
.about dd span a{ display:block; font-size:16px ; color:#ef7a00; padding-left:5%;}





.pic{ height:465px; margin-top:36px;overflow:hidden;}
.pic .content{ width:1400px;}
.pict{ height:63px; width:567px; margin:0 auto 32px;}
.pict h3{ font-size:18px ; height:61px; width:185px;  border:1px solid #d1d1d1;line-height:61px; float:left;text-align: center;}
.pict h3 em{ display:block; width:24px; height:24px; overflow:hidden; margin:17px 7px 0 42px; float:left;}
.pict h3 img{ display:block;width:100%;transition:all 0s;}
.pict h3 a{ display:block; color:#333;}
.pict h3 a:hover,.pict .cur a{ font-weight:bold;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#faee9e+10,bb871b+100 */
background:#ef7a00; color:#FFF}
.pict .cur a img{ margin-top:-24px !important;}
.pic1{ height:308px; overflow:hidden;}
.pic2{ height:308px; position:relative;}
.pic3{ overflow:hidden;}
.pic1 li{ width:24.14%; float:left; margin-right:16px; overflow:hidden; position:relative;}
.pic1 li img{ display:block; width:100%;  height:auto;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.pic1 li a:hover img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.pic1 li em{display:block;font-size: 16px ; line-height:40px;color: #666; text-align:center; height:40px; overflow:hidden;}
.pic1 li:hover em{ font-weight:bold; color:#000; margin-top:20px;-webkit-transition: 1s;}





/*yqlj*/
.yqlj {padding: 15px 0;background:#eeeeee;margin-bottom: 30px;}
.yqlj .container {position: relative;padding: 15px 0;/* background: #fff; */}
.yqlj .box {text-align: left;margin: 0 30px;}
.yqlj .box .p1 {display: inline-block;*display: inline;*zoom: 1;vertical-align: middle;width: 56px;height: 35px;margin-right: 15px; margin-top:-20px}
.yqlj .box ul {display: inline-block; /**display: inline;*zoom: 1;vertical-align: middle;position: relative;margin-top: -33px;margin-left: 73px;*/}
.yqlj .box ul li {float: left;padding: 0 20px; padding-top:8px; font-size:16px;}
.yqlj .box ul li a {color: #8f8f8f;}
.yqlj .box ul li:last-child {border-right: none;}
.yqlj .box ul li:hover a {color: #ef7a00;}

@media (min-width: 1200px) and (max-width: 1680px) {
	.guide .content,.pro .content,.shil .content,.case .content,.super .content,.process .content,.news .content,.pic .content,.link .content{ width:1200px;}
	.guide dd p{ margin:28px 0 20px;}
	.pro01{ padding:30px 2%;}
	/* .pro02 h3{ height:58px;} */
	.pro02 h3 em{ /*padding-top:22px;*/}
	.prosou p{ font-size:14px;}
	.shil{ height:780px;}
	.shil2 dl{ height:490px;}
	.shil2 dd{ left:96%;bottom: 8%;}
	.case4 dl,.case4{ height:580px!important; width:860px!important}
	.case4 dl dt{ width:100%!important}
	.super h5 span em{ font-size:26px;}
	.dy .tit em{ font-size:18px;}
	.dy2 dl{ margin-right:25px;}
	.faq{ width:1200px; margin:50px auto 0;}
	.pic{ height:410px!important;}
	.super2 dd{margin:135px 0 0 0px!important}
	/* .super2 dt{ width:56%!important} */
}


@keyframes living {
    0%{
        transform: scale(1);
        /* opacity: 1; */margin-top: 6px;
    }
    50%{
        transform: scale(1);
        /* opacity: 0.7; */margin-top:0px;
    }
    100%{
        transform: scale(1);
        /* opacity: 1; */margin-top: 6px;
    }
}
@keyframes living1 {
    0%{
        transform: scale(1);
        /* opacity: 1; */margin-top: 0;
    }
    50%{
        transform: scale(1);
        /* opacity: 0.7; */margin-top: 0;
    }
    100%{
        transform: scale(1);
        /* opacity: 1; */margin-top: 0;
    }
}
@-webkit-keyframes spin{
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


/*animation*/
@-webkit-keyframes hvr-buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}
@keyframes hvr-buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}