.banner{overflow:hidden;padding-top:13.8%;padding-bottom:13.8%;filter:alpha(opacity=0);opacity:0;-webkit-transition:all 1.5s  ease-out;transition:all 1.5s ease-out;-webkit-transform:scale(1.3); transform:scale(1.3); }
.banner.active{filter:alpha(opacity=100);opacity:1;-webkit-transform:scale(1); transform:scale(1);}
.banner img{-webkit-animation: bounceOut  1s 1s ease-out both;animation: bounceOut  1s ease-out both;max-width:40%; }
.banner.active img{-webkit-animation: bounceInLeft  1s 1s ease-out both;animation: bounceInLeft  1s ease-out both;opacity:1}
.ahead{text-align:center;padding-bottom:2%;position:relative;}
.ahead::after{width:1920px;height:1px;background:#ccc;content:"";position:absolute;left:0;margin-left:-360px;bottom:0}
.ahead dt{font-size:24px;color:#333333;margin-bottom:1%;font-weight:bold;}
.ahead dd{font-size:12px;color:#666666;}
.fall{font-size:16px;line-height:36px;color:#333;text-align:justify;margin-top:4%}
.fall p{text-indent:2em}
.fall  img{max-width:100%;display:block;margin:30px auto}
.offer{font-size:14px;color:#333;padding-top:15px;position:relative;clear:both; }
.offer::after{width:1920px;height:1px;background:#ccc;content:"";position:absolute;left:0;margin-left:-360px;top:0}
.offer a{float:left;max-width:50%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.offer a:first-child+a{float:right;}
.road{background:#111111;height:70px;}
.road.active{position:fixed;top:0;left:0;width:100%;z-index:2000}
.road li{float:left;position:relative;width:30%}
.road a{display:block;font-size:16px;line-height:70px;color:#b4b2b2;position:relative;z-index:20;text-align:center;}
.road li.active a,.road li:hover a{color:#fff}
.sun{position:absolute;top:0;left:0;width:100%;height:100%;background:url(../img/lin.jpg) no-repeat center center;background-size:cover;filter:alpha(opacity=0);opacity:0;-webkit-transition:all 0.5s ease;transition:all 0.5s ease;}
.road li.active .sun,.road li:hover .sun{filter:alpha(opacity=100);opacity:1;}
.long{padding-bottom:6.7%;clear:both;}
.way li{width:32%;float:left;margin-left:2%;border:1px solid #ebebeb;border-radius:5px;padding:20px 0;position:relative;box-sizing:border-box;}
.way li:first-child{margin-left:0}
.way li p{width:39%;position:absolute;bottom:50%;-webkit-transform:translateY(50%);transform:translateY(50%);left:0;text-align:center;}
.way li p img.sp{display:none;}
.zi{margin-left:39%;border-left:1px dashed #222;padding:6px 0;font-size:24px;text-align:center;line-height:1.4;color:#222222;white-space:nowrap}
.zi span{display:block;font-size:14px}
.way li .color{position:absolute;left:0;top:0;width:100%;height:100%;filter:alpha(opacity=0);opacity:0;z-index:-1;border-radius:5px;}
.way li:hover .color{filter:alpha(opacity=100);opacity:1;}
.way li:hover{border-color:rgba(0,0,0,0)}
.way li:hover .zi{color:#fff;border-color:#fff}
.way li:hover p img{display:none;}
.way li:hover p img.sp{display:inline;}
.maps{border:4px solid #000000;clear:both;background:#000000 }
.map{padding-bottom:43%;position:relative;}
#map{position:absolute;top:0;left:0;width:100%;height:100%;}
.gp{font-size:22px;color:#fff;line-height:1.5;text-align:center;padding:2% 0}
.type{text-align:center;padding:14px 0;border-top:1px solid #999999;border-bottom:1px solid #999999}
.type a{font-size:14px;line-height:32px;color:#1f1a17;padding:0 2.2%;display:inline-block;vertical-align:top;margin:0 1%}
.type a.active,.type a:hover{color:#fff;background:#1f1a17;}
.list li{width:32%;float:left;margin-top:5.5%;margin-right:2%;background:#fff}
.list li:nth-child(3n){margin-right:0}
.list li p{padding:0 5%;font-size:18px;color:#333;line-height:42px;position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:#fff}
.list li p::after{width:12px;height:100%;top:0;background:url(../img/zn2.png) no-repeat center center;position:absolute;right:5%;content:"";display:block;}
.list li:hover p{background:#e4007f;background: -webkit-gradient(linear, right bottom, left top, color-stop(0%, #5d1986), color-stop(100%, #e4007f));color:#fff}
.list li:hover p::after {background:url(../img/zn1.png) no-repeat center center;}
.list li:hover{box-shadow:0 0 10px rgba(0,0,0,.4)}
.see li{width:19%;float:left;margin-left:1.5%;margin-bottom:3%}
.see li:first-child{width:59%;margin-left:0;margin-bottom:0}
.see li:first-child .video{border-radius:0px}
.video{display:block;padding-bottom:50%;position:relative;background:#000;border-radius:5px;overflow:hidden;}
.video iframe{position:absolute;top:0;left:0;width:100%;height:100%;}
.video::after{width:100%;height:100%;position:absolute;top:0;left:0;z-index:200;content:"";background:none}
.cmy{margin-top:7px;}
.cmy>span{font-size:18px;color:#333;line-height:1.5;-webkit-transition:all 0.5s ease;transition:all 0.5s ease;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;vertical-align:top;max-width:100%}
.cmy p{font-size:12px;color:#999999;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.see li:hover .cmy>span{color: #e4007f;background-image:-webkit-gradient(linear, right bottom, left top, color-stop(0%, #5d1986), color-stop(40%, #920f83), color-stop(61.5%, #c10781), color-stop(100%, #e4007f));-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.see li:hover .video{box-shadow:0 0 4px 1px rgba(0,0,0,.3)}
 .vis li{width:18.4%;float:left;margin-left:2%;}
 .vis li:first-child{margin-left:0}
 .vis li .video{border-radius:5px}
 .vis li:hover .video{box-shadow:0 0 4px 1px rgba(0,0,0,.3)}
.nlist li{width:49%;float:left;margin-bottom:3.5%;background:#fff;position:relative;}
.nlist li:nth-child(2n){margin-left:2%}
.news{padding:7px;position:relative;z-index:20}
.ning{padding-bottom:56%;position:relative;overflow:hidden;}
.info{padding: 4%;color:#999999;}
.info h2{color:#222}
.info h2 a{font-size:20px;display:inline-block;vertical-align:top;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:normal;}
.text{font-size:12px;line-height:2;margin-top:2%;margin-bottom:1%;height:48px;overflow:hidden;}
.info p{font-size:12px;text-align:right;}
.nlist li .color2{position:absolute;top:0;left:0;width:100%;height:100%;filter:alpha(opacity=0);opacity:0;}
.nlist li:hover .color2{filter:alpha(opacity=100);opacity:1}
.nlist li:hover .info,.nlist li:hover .info h2{color:#fff}
.info h2:hover a{color:#fff}
.coco li{width:23.8%;float:left;margin-right:1.6%;margin-bottom:1.6%;position:relative;overflow:hidden;}
.coco li:nth-child(4n){margin-right:0}
.rect{padding-bottom:64%;position:relative;}
.stext{font-size:16px;line-height:2;color:#fff;position:absolute;bottom:0;left:0;width:100%;text-align:center;background:rgba(0,0,0,.4)} 
.stext .color{position:absolute;top:0;left:0;width:100%;height:100%;filter:alpha(opacity=0);opacity:0;}
.stext p{position:relative;z-index:200}
.coco li:hover .stext .color{filter:alpha(opacity=100);opacity:1;}
.home{font-size:40px;text-align:center;margin-bottom:4%;line-height:1.4}
.home span{font-size:16px;display:block;}
.need{width:67%;padding-right:6%;color:#fff}
.need .home{text-align:left;margin-bottom:9%;}
.dd{font-size:26px;margin-bottom:1%}
.need >p{font-size:16px;line-height:26px;color:#b6b6b6}
.some{font-size:0;letter-spacing:-5px;padding-top:4%}
.some li{width:300px;display:inline-block;vertical-align:top;padding-top:6%;white-space:nowrap}
.imgs{position:relative;display:inline-block;vertical-align:middle;width:78px;height:78px;border:1px solid #fff;box-sizing:border-box;border-radius:5px}
.imgs .color2{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:5px;filter:alpha(opacity=0);opacity:0;}
.imgs img{position:absolute;top:50%;left:50%;z-index:200;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);}
.liv{display:inline-block;vertical-align:middle;white-space:normal;font-size:20px;color:#fff;letter-spacing:normal;margin-left:10%}
.liv  span{font-size:12px;color:#acacac;display:block;}
.dimg{text-align:right;width:260px}
.some li:hover .imgs .color2{filter:alpha(opacity=100);opacity:1;}
.some li:hover .imgs{border-color:rgba(0,0,0,0)}
.step li{width:17.5%;float:left;margin-top:2%;margin-bottom:2%;position:relative;border-radius:10px;background:#222222;color:#fff;font-size:20px;padding:20px 0;margin-left:10% }
.step li>p{position:relative;z-index:32;text-align:center;}
.step li .color{position:absolute;left:0;width:100%;height:100%;top:0;filter:alpha(opacity=0);opacity:0;border-radius:10px;}
.step li.sp{float:right;}
.step li:last-child{margin-left:0;}
.step li:first-child{margin-left:0;}
.step li::after{width:57%;height:100%;background:url(../img/jia1.png) no-repeat center center;content:"";position:absolute;top:0;right:100%}
.step li:hover .color{filter:alpha(opacity=100);opacity:1;}
.step li:last-child::after,.step li:first-child::after{display:none;}
.step li.sp::after{background:url(../img/jia2.png) no-repeat center center;}
.shop{position:relative;overflow:hidden;background:#fff}
.ping{padding-bottom:68%;position:relative;overflow:hidden;}
.pinfo{padding:7% 0 6%;text-align:center;color:#222222}
.pinfo .sp{font-size:24px;padding-bottom:3%;margin-bottom:4%;position:relative;}
.pinfo .sp::after{width:40px;height:1px;background:#222;position:absolute;bottom:0;left:50%;margin-left:-20px;content:"";}
.pinfo p span{font-size:12px;color:#666;margin:0 3%}
.shop .color2{position:absolute;top:0;left:0;width:100%;height:100%;filter:alpha(opacity=0);opacity:0;}
.shop:hover .color2{filter:alpha(opacity=100);opacity:1;}
.shop:hover .pinfo{color:#fff}
.shop:hover .pinfo p span{color:#fff}
.shop:hover .pinfo .sp::after{background:#fff}
.ctrl{padding-top:3%;text-align:center}
.ctrl a{z-index:200;width:35px;height:35px;border-radius:50%;display:inline-block;margin:0 2%;background:#999999;position:relative;line-height:32px}
.ctrl a .color2{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;filter:alpha(opacity=0);opacity:0;}
.ctrl a:hover .color2{filter:alpha(opacity=100);opacity:1}
.area{width:58%;}
.data{padding-left:8%}
.data .home{text-align:left;margin-bottom:7%}
.around{font-size:26px;color:#333;margin-bottom:10%}
.around p{font-size:14px;color:#666666;display:block;padding-top:5px}
.his li{font-size:16px;color:#444444;padding-top:6px;padding-bottom:5px}
.his li::before{content:"·";width:15px;display:inline-block;font-size:20px}
.his li span{font-size:24px;}
.his li:last-child::before{content:""}
.orders li{border:1px solid #fff;width:17%;float:left;margin-right:10.6%;text-align:center;position:relative;padding-bottom:17%;border-radius:5px;box-sizing:border-box;margin-bottom:5%}
.orders li .color2{position:absolute;top:0;left:0;width:100%;height:100%;filter:alpha(opacity=0);opacity:0;border-radius:5px;}
.order{position:absolute;bottom:50%;left:0;width:100%;text-align:center;-webkit-transform:translateY(50%);transform:translateY(50%);z-index:20}
.order p{font-size:24px;color:#fff;padding-top:25px;}
.order p span{font-size:20px;filter:alpha(opacity=50);opacity:.5;display:block;padding-top:4px;}
.orders{padding-top:2%}
.orders li:hover .color2{filter:alpha(opacity=100);opacity:1;}
.orders li:hover{border-color:rgba(0,0,0,0)}
.orders li:nth-child(4n){margin-right:0}
.ggps{padding-left:56.5%;position:relative;}
.map2{width:53%;position:absolute;top:0;left:0;height:100%;box-shadow:0 0 10px rgba(0,0,0,.5)}
.post input{padding-left:9px;font-size:18px;line-height:50px;border:1px solid #999999;margin-bottom:18px;float:left;width:100%;background:none;-webkit-transition:all 0.5s ease;transition:all 0.5s ease;}
.post textarea{padding:6px 8px;font-size:18px;height:150px;border:1px solid #999999;margin-bottom:18px;width:100%;background:none;-webkit-transition:all 0.5s ease;transition:all 0.5s ease;}
.post button{font-size:22px;line-height:50px;height:50px;display:block;border:none;color:#fff;width:100%;}
.post input:focus,.post textarea:focus{border-color:#e4007f;box-shadow:0 0 6px #e4007f;}
.plam{padding-left:51%;position:relative;}
.pla{position:absolute;top:0;left:0;width:49%;height:100%;overflow:hidden;}
.profile{padding:8% 6%;background:#fff}
.profile .sp{font-size:16px;line-height:28px;color:#666}
.profile .home{text-align:left;margin-bottom:8%}
.yuans{padding:0 3.5%}
.yuan td{text-align:center;position:relative;}
.yuan td>p{font-size:16px;color:#b9b9b9;padding:0 5%;-webkit-transition:color 0.4s ease;transition:color 0.4s ease;}
.xdt{font-size:18px;color:#ffffff;padding:20px 0;margin-bottom:20px;background:url(../img/li.png) no-repeat bottom center;-webkit-transition:color 0.4s ease;transition:color 0.4s ease;}
.yuan td::after{width:1px;height:60%;top:20%;left:0;content:"";background:#9b9b9b;position:absolute;}
.yuan td:first-child::after{display:none;}
.yuan td:hover .xdt{color:#e4007f;background:url(../img/li2.jpg) no-repeat bottom center;}
.yuan td:hover >p{color:#e4007f}
.yuan td img.sp{display:none}
.yuan td:hover img{display:none}
.yuan td:hover img.sp{display:inline}
.prize{margin-top:0%}
#prize .owl-dots{position:static;margin-top:1%}
.vi img{display:block;max-width:100%;margin:0 auto}
.cele li{width:31.5%;float:left;margin-right:2.75%;margin-bottom:3%}
.cele li:nth-child(3n){margin-right:0;}
.type2{text-align:center;padding:14px 0;border-top:1px solid #fff;border-bottom:1px solid #fff;margin-bottom:4%}
.type2 a{font-size:14px;line-height:32px;color:#fff;padding:0 2.2%;display:inline-block;vertical-align:top;margin:0 1%}
.type2 a.active,.type2 a:hover{color:#1f1a17;background:#fff;}
.mets{overflow:hidden;position: relative;width:100%;}
.met li{width:32.5%;float:left;margin-left:1%;margin-bottom:1%}
.met li:first-child{width:66.5%;margin-left:0}
.ctrl2 a.fi{position:absolute;top:50%;margin-top:-17px;left:-84px;margin-left:0}
.ctrl2 a.la{position:absolute;top:50%;margin-top:-17px;right:-84px;margin-right:0}
.skills{position:relative;padding-right:51%;margin-bottom:2%}
.may{width:49%;position:absolute;top:0;right:0;height:100%;overflow:hidden;}
.skill{padding:8% 6%;background:#fff}
.skill>p{font-size:16px;line-height:1.9;color:#606060}
.skill .home{text-align:left;margin-bottom:5%}
.gets{font-size:0;letter-spacing:-5px;padding-top:9%}
.gets li{width:22%;display:inline-block;margin-left:4%;vertical-align:top;font-size:14px;color:#666666;letter-spacing:normal;line-height:1.5;text-align:center}
.gets li:first-child{margin-left:0}
.much{padding-bottom:8px;white-space:nowrap}
.much img{display:inline-block;vertical-align:bottom;margin-right:4px}
.much i{display:inline-block;font-size:30px;font-style:normal;vertical-align:top}
.brand li{width:24%;float:left;margin-bottom:1.5%;position:relative;}
.brand li:first-child+li{width:49%;margin-left:1.5%;margin-right:1.5%}
.brand li:first-child+li .label{padding-bottom:75%!important}
.brand li:first-child+li+li+li{position:absolute;left:0;bottom:0}
.stext2{position:absolute;bottom:0;left:0;font-size:16px;padding:2% 0;text-align:center;color:#fff;background:rgba(0,0,0,.5);width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.brand li .color{position:absolute;top:0;left:0;width:100%;height:100%;filter:alpha(opacity=0);opacity:0;}
.brand li:hover .color{filter:alpha(opacity=100);opacity:1}
.wo img{display:block;margin:0 auto;max-width:100%}
.culture td{width:33.3%;border:1px solid #858585;position:relative;text-align:center;padding:3% 0 3.5%;color:#fff}
.be1{width:12px;height:12px;border-radius:50%;background:#858585;position:absolute;top:-5px;left:-5px}
.be2{width:12px;height:12px;border-radius:50%;background:#858585;position:absolute;top:-5px;right:-5px}
.be3{width:12px;height:12px;border-radius:50%;background:#858585;position:absolute;bottom:-5px;left:-5px}
.be4{width:12px;height:12px;border-radius:50%;background:#858585;position:absolute;bottom:-5px;right:-5px}
.idt{font-size:18px;padding:4% 0;position:relative;margin-bottom:5%;}
.idt::after{width:36px;height:1px;background:#fff;content:"";display:block;position:absolute;left:50%;bottom:0;margin-left:-18px}
.idd{font-size:16px;line-height:1.75;color;padding:0 15%;filter:alpha(opacity=60);opacity:.6;}
.culture td .color2{position:absolute;top:0;left:0;width:100%;height:100%;filter:alpha(opacity=0);opacity:0;}
.ico{height:50px;line-height:50px;}
.culture td:hover .color2{filter:alpha(opacity=100);opacity:1;}
.modal{position:fixed;top:0;left:0;height:100%;width:100%;background:#000;background:rgba(0,0,0,.8);z-index:4200;align-items:center;display:none;}
.modal>iframe{width:50%;position:fixed;height:60%;top:0%;left:0%;box-shadow:10px 10px 20px rgba(0,0,0,.5);filter:alpha(opacity=0);opacity:0; -webkit-transform: translateY(-80px);-webkit-transition:all 0.5s ease-out 0.2s;transform: translateY(-80px);transition:all 0.5s ease-out 0.2s;transition:all 0.5s ease-out 0.2s;}
.modal.active>iframe{ -webkit-transform: translateY(0);transform: translateY(0);filter:alpha(opacity=100);opacity:1;}
a.close{width:50px;height:50px;background:url(../img/close.png) no-repeat center center;position:absolute;right:0px;top:0px;margin-top:-50px;margin-left:-50px}

 @media screen and (max-width: 1600px) {
.banner{padding-top:10%;padding-bottom:10%}
.yuans{padding:0}
 }
 
 @media screen and (max-width: 1400px) {
.ctrl2 a.fi{left:1%}
.ctrl2 a.la{right:1%}
 }
  
 
 @media screen and (max-width: 1200px) {
.road{height:50px}
.road a{line-height:50px}
.much img{height:40px}
.orders li{width:23.5%;margin-right:2%;padding-bottom:23.5%;margin-bottom:3%}
 }
 @media screen and (max-width: 1000px) {
.home{font-size:30px}
.gets li{font-size:12px}
.see li{margin-bottom:1%} 
.cmy > span,.info h2 a{font-size:16px}
.around{font-size:20px}
 }

 @media screen and (max-width: 800px) { 
.way li p{width:60px}
.zi{margin-left:60px}
.need{width:100%;padding-right:0}
.dimg {display:none}
.need .home{margin-bottom:4%;text-align:center}
.some{padding-top:0}
.some li{width:50%;padding-top:4%}
 }
 
 
 
 
 @media screen and (max-width: 640px) { 
.ahead dt{font-size:18px}
 .fall img{margin:15px auto}
.offer a{max-width:100%; }
.offer a:first-child+a{float:left;margin-top:2%}
.banner{padding-top:60px}
.list li{width:49%;}
.list li:nth-child(3n){margin-right:2%}
.list li:nth-child(2n){margin-right:0%}
.list li p{font-size:16px;line-height:34px}
.road.active,.road{width:60px;top:50%;height:auto;margin-top:-30px;filter:alpha(opacity=80);opacity:.8;position:fixed;z-index:3000}
.road li{float:none;width:100%!important;margin-bottom:2px}
.road a{width:100%;font-size:12px;line-height:20px}
.skills{padding-right:0;padding-top:50%}
.plam{padding-left:0;padding-top:50%}
.may,.pla{width:100%;height:0;padding-bottom:50%}
.much img{height:24px;}
.skill > p,.much i{font-size:14px;line-height:1.5;}
.home{font-size:18px}
.home span,.idt{font-size:14px}
.stext2{font-size:12px;}
.idd{font-size:12px;line-height:1.5;padding:0 5px}
.ico{height:36px;line-height:36px}
 .ico img{height:28px}
.way li{width:49%;padding:10px 0}
.way li:last-child{margin-left:0;margin-top:2%}
.zi{font-size:16px}
.way li p{width:50px}
.way li img{width:30px}
.zi{margin-left:50px}
.gp{font-size:14px}
.profile{padding:4%;}
.profile .home{margin-bottom:3%}
.profile .sp,.need > p{font-size:14px;line-height:1.5;}
.yuan td > p{font-size:12px}
.xdt{font-size:14px;padding:10px 0;margin-bottom:10px}
.yuan td>img{max-width:30px}
.times{margin-bottom:60px}
.see li{width:48%;margin-left:1%;margin-bottom:2%;margin-right:1%}
.see li:first-child{width:98%;margin-bottom:2%;margin-left:1%;}
.vis li{width:32%;margin-bottom:2%}
.vis li:nth-child(3n+1){margin-left:0}
.info h2 a{display:block;}
.text{line-height:18px;height:36px}
.coco li{width:32%;margin-right:2%;margin-bottom:2%}
.coco li:nth-child(4n){margin-right:2%}
.coco li:nth-child(3n){margin-right:0}
.dd{font-size:18px}
.imgs{width:50px;line-height:50px;height:50px;}
.liv{font-size:15px;margin-left:5%;max-width:65%}
.step li{width:22%;margin-left:4%;font-size:12px}
.step li::after{width:18%;background-size:90%!important}
.pinfo .sp{font-size:16px}
.area{display:block;width:100%;text-align:center;}
.data{display:block;padding-left:10%;padding-right:10%}
.data .home{margin-bottom:3%}
.around{font-size:16px;margin-bottom:4%}
.his li span{font-size:16px}
.order p{font-size:15px;padding-top:5px}
.order>img{height:22px}
.order p span{font-size:12px;padding-top:0}
.ggps{padding-left:0}
.map2{width:100%;padding-bottom:50%;position:relative;height:0;margin-bottom:4%}
.modal>iframe{width:100%;height:40%}

 }