@charset "utf-8";body{background:#fff}
body,html{width:100%;height:100%;font-family:"microsoft yahei"}
.download .header{width:100%;position:absolute;top:24px;z-index:10;box-sizing:border-box;-webkit-box-sizing:border-box}
.download .header-wrap{margin:0 auto;width:100%;height:100%;padding-left: 60px;}
.download .header-wrap .logo{display:block;margin-top:16px;float:left;}
.download .header-wrap .nav-box{float:left;margin-left:90px}
.download .header-wrap .nav-box li{float:left;width:100px;height:100px;text-align:center;box-sizing:border-box;cursor:pointer;margin-right: 37px;border-radius: 6px;display: flex;align-items: center;justify-content: center;flex-direction: column;}
.download .header-wrap .nav-box li i{display:block}
.download .header-wrap .nav-box li.one i{background:url(../img/icon-nav1.png) no-repeat center;width:42px;height:42px;margin:0 auto;background-size: 100% 100%;}
.download .header-wrap .nav-box li.two i{background:url(../img/icon-nav2.png) no-repeat center;width:42px;height:42px;margin:0 auto;background-size: 100% 100%;}
.download .header-wrap .nav-box li.three i{background:url(../img/icon-nav3.png) no-repeat center;width:42px;height:42px;margin:0 auto;background-size: 100% 100%;}
.download .header-wrap .nav-box li.four i{background:url(../img/icon-nav2.png) no-repeat center;width:42px;height:42px;margin:0 auto;background-size: 100% 100%;}
.download .header-wrap .nav-box li p{font-size:15px;color:#fff;}
.download .header-wrap .nav-box li.active {background: rgba(255,255,255,0.1);}
.download .header-wrap .nav-box li.active p{color:#ff9700}
.download .header-wrap .nav-box li.active.one i{background:url(../img/icon-nav1-on.png) no-repeat;background-size: 100% 100%;}
.download .header-wrap .nav-box li.active.two i{background:url(../img/icon-nav2-on.png) no-repeat;background-size: 100% 100%;}
.download .header-wrap .nav-box li.active.three i{background:url(../img/icon-nav3-on.png) no-repeat;background-size: 100% 100%;}
.download .header-wrap .nav-box li.active.four i{background:url(../img/icon-nav2-on.png) no-repeat;background-size: 100% 100%;}
.download .header-wrap .nav-box li:hover{background: rgba(255,255,255,0.1);}

.download{width:100%;height:100%}
.download .swiper-container{width:100%;height:100%}
.download .swiper-container .swiper-pagination{position:inherit}
.swiper-container{width:100%;height:100%}
.swiper-container .swiper-pagination{left:30px;bottom:80px;width:auto}
.swiper-container .swiper-slide{position:relative;overflow:hidden}
.swiper-pagination-bullet{width:10px;height:10px;background:0 0;border:1px solid #fff;opacity:1}
.swiper-pagination-bullet-active{background:#000}
.banner .slide1{background:url(https://wz.4299yx.cn/soft3/zuhao1/img/banner1.jpg) no-repeat top center;width:100%;height:100%;background-size:cover}
.banner .slide2{background:url(https://wz.4299yx.cn/soft3/zuhao1/img/banner2.jpg) no-repeat top center;width:100%;height:100%;background-size:cover}
.banner .slide3{background:url(https://wz.4299yx.cn/soft3/zuhao1/img/banner3.jpg) no-repeat top center;width:100%;height:100%;background-size:cover}
.banner .slide4{background:url(https://wz.4299yx.cn/soft3/zuhao1/img/banner4.jpg) no-repeat top center;width:100%;height:100%;background-size:cover}
.banner .swiper-slide .cont{position:relative;width:100%;max-width:1300px;height:100%;margin:0 auto}


.banner .slide1 .displayer{position:absolute;left:-39px;top:50%;transform: translateY(-50%);width:900px;height:524px;background:url(../img/displayer.png) no-repeat;background-size: 100% 100%;}
.banner .slide1 .displayer .man{position:absolute;top: -11px;right: -22px;width:458px;height:524px;background:url(../img/slide1-man.png) no-repeat;background-size: 100% 100%;}
.banner .slide1 .right{position:absolute;right:-39px;top:50%;opacity:.85;width: 438px;text-align: left;transform: translateY(-50%);}
.banner .slide1 .right .tit-img{width: 260px;height: 129px;background:url(../img/slide1-txt1.png) no-repeat;background-size: 100% 100%;}
.banner .slide1 .right .info{font-size: 14px;color: #fff;margin-top: 13px;line-height: 24px;}
.banner .slide1 .right .btn{margin-top: 25px; width: 336px;height: 74px;border-radius: 4px;background: #FF6801;color: #fff;font-size: 26px;font-weight: 600;display: flex;align-items: center;justify-content: center;}
.banner .slide1 .right .btn i{margin-right: 12px;width: 30px;height: 30px;background:url(../img/btn-download-icon.png) no-repeat;background-size: 100% 100%;}
.banner .slide1 .right .txt2{margin-top: 8px;font-size: 24px;color: #E1E1E1;display: flex;align-items: center;font-weight: 400;}
.banner .slide1 .right .txt2 i{margin-right: 7px;width: 48px;height: 48px;background:url(../img/slide1-hb.png) no-repeat;background-size: 100% 100%;}
.banner .slide1 .right .itemList{display: flex;align-items: center;margin-top: 20px;}
.banner .slide1 .right .itemList .item1{width: 100px;height: 100px;margin-right: 13px;background:url(../img/slide1-type1.png) no-repeat;background-size: 100% 100%;}
.banner .slide1 .right .itemList .item2{width: 100px;height: 100px;margin-right: 13px;background:url(../img/slide1-type2.png) no-repeat;background-size: 100% 100%;}
.banner .slide1 .right .itemList .item3{width: 100px;height: 100px;margin-right: 13px;background:url(../img/slide1-type3.png) no-repeat;background-size: 100% 100%;}
.banner .slide1 .right .itemList .item4{width: 100px;height: 100px;background:url(../img/slide1-type4.png) no-repeat;background-size: 100% 100%;}

.banner .slide2 .phone2{position:absolute;left:118px;top:50%;transform: translateY(-50%);width:494px;height:637px;background:url(../img/slide2-phone2.png) no-repeat;background-size: 100% 100%;z-index:10}
.banner .slide2 .man{position:absolute;left:228px;top:50%;transform: translateY(-30px);width:409px;height:321px;background:url(../img/slide2-man.png) no-repeat;background-size: 100% 100%;z-index:13}
.banner .slide2 .txt1{position:absolute;right:118px;top:50%;transform: translateY(-50%);width:446px;height:502px;background:url(../img/slide2-txt1.png) no-repeat;background-size: 100% 100%;opacity:.85;}
.banner .slide2 .txt1 .ermApp{position: absolute;left: 50%;transform: translateX(-50%);padding: 10px;background: #fff;top: 178px;}


.banner .slide3 .displayer{position:absolute;left:-39px;top:50%;transform: translateY(-50%);width:773px;height:500px;background:url(../img/displayer3.png) no-repeat;background-size: 100% 100%;}
.banner .slide3 .displayer .icon1{position: absolute;top: -60px;left: -80px;width: 138px;height: 160px;background:url(../img/icon1.png) no-repeat;background-size: 100% 100%;}
.banner .slide3 .displayer .icon2{position: absolute;bottom: -40px;right: -50px;width: 137px;height: 137px;background:url(../img/icon2.png) no-repeat;background-size: 100% 100%;}
.banner .slide3 .right{position:absolute;right:-39px;top:50%;opacity:.85;width: 500px;text-align: left;transform: translateY(-50%);}
.banner .slide3 .right .tit-img{width: 500px;height: 178px;background:url(../img/slide3-txt1.png) no-repeat;background-size: 100% 100%;}
.banner .slide3 .right .btn{margin-top: 62px; width: 336px;height: 74px;border-radius: 4px;background: #FF6801;color: #fff;font-size: 26px;font-weight: 600;display: flex;align-items: center;justify-content: center;}
.banner .slide3 .right .btn i{margin-right: 12px;width: 30px;height: 30px;background:url(../img/btn-download-icon.png) no-repeat;background-size: 100% 100%;}
.banner .slide3 .right .itemList{display: flex;align-items: center;margin-top: 60px;}
.banner .slide3 .right .itemList .item1{width: 111px;height: 111px;margin-right: 60px;background:url(../img/slide3-type1.png) no-repeat;background-size: 100% 100%;}
.banner .slide3 .right .itemList .item2{width: 111px;height: 111px;margin-right: 60px;background:url(../img/slide3-type2.png) no-repeat;background-size: 100% 100%;}
.banner .slide3 .right .itemList .item3{width: 111px;height: 111px;background:url(../img/slide3-type3.png) no-repeat;background-size: 100% 100%;}

.banner .slide4 .displayer{position:absolute;left:82px;top:50%;transform: translateY(-90px);width:736px;height:387px;background:url(../img/displayer4.png) no-repeat;background-size: 100% 100%;}
.banner .slide4 .txt1{position:absolute;right:82px;top:50%;transform: translateY(-50%);width:420px;height:498px;background:url(../img/slide4-txt1.png) no-repeat;background-size: 100% 100%;opacity:.85;}
.banner .slide4 .phone1{position: absolute;left: 82px;top:-182px;width: 338px;height: 507px;background:url(../img/slide4-phone1.png) no-repeat;background-size: 100% 100%;z-index: 10;}
.banner .slide4 .phone2{position: absolute;left: 263px;top:-144px;width: 322px;height: 476px;background:url(../img/slide4-phone2.png) no-repeat;background-size: 100% 100%;z-index: 9;}
.banner .slide4 .man{position: absolute;left: 7px;top:10px;width: 370px;height: 321px;background:url(../img/slide4-man.png) no-repeat;background-size: 100% 100%;z-index: 11;}
.banner .slide4 .txt1 .ermApp{position: absolute;left: 50%;transform: translateX(-50%);padding: 10px;background: #fff;top: 176px;}


/* 效果 */
.banner .slide1.swiper-slide-active .displayer{-webkit-animation-name:fadeIn;animation-name:fadeIn;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;-webkit-animation-fill-mode:both;animation-fill-mode:both}
.banner .slide1.swiper-slide-active .man{-webkit-animation:fadeInRight 1s both;animation:fadeInRight 1s both;-webkit-transform-origin:0 50%;transform-origin:0 50% ;-webkit-animation-delay:.6s;animation-delay:.6s}
.banner .slide1.swiper-slide-active .txt1{-webkit-animation-name:bounceInRight;animation-name:bounceInRight;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;opacity: 1;}
.banner .slide1.swiper-slide-active .txt2{-webkit-animation-name:bounceInRight;animation-name:bounceInRight;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-delay:.8s;animation-delay:.8s;opacity: 1;}
.banner .slide1.swiper-slide-active .itemList{-webkit-animation-name:bounceInRight;animation-name:bounceInRight;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-delay:1s;animation-delay:1s;opacity: 1;}
.banner .slide2.swiper-slide-active .phone2{-webkit-animation:fadeInLeftBottomPlus2 1.25s both;animation:fadeInLeftBottomPlus2 1.25s both;-webkit-transform-origin:0 50%;transform-origin:0 50%}
.banner .slide2.swiper-slide-active .man{-webkit-animation:fadeInRight2 1s both;animation:fadeInRight2 1s both;-webkit-transform-origin:0 50%;transform-origin:0 50%; -webkit-animation-delay:0.8s;animation-delay:0.8s;}
.banner .slide2.swiper-slide-active .txt1{-webkit-animation-name:bounceInRight2;animation-name:bounceInRight2;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;opacity: 1;}
.banner .slide3.swiper-slide-active .displayer{-webkit-animation-name:fadeIn;animation-name:fadeIn;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;-webkit-animation-fill-mode:both;animation-fill-mode:both}
.banner .slide3.swiper-slide-active .displayer .icon1{-webkit-animation-name:bounceIn;animation-name:bounceIn;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-delay:1s;animation-delay:1s}
.banner .slide3.swiper-slide-active .displayer .icon2{-webkit-animation-name:bounceIn;animation-name:bounceIn;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-delay:1.25s;animation-delay:1.25s}
.banner .slide3.swiper-slide-active .txt1{-webkit-animation-name:bounceInRight;animation-name:bounceInRight;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;opacity: 1;}
.banner .slide3.swiper-slide-active .itemList{-webkit-animation-name:bounceInRight;animation-name:bounceInRight;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-delay:0.5s;animation-delay:0.5s;opacity: 1;}
.banner .slide4.swiper-slide-active .txt1{-webkit-animation-name:bounceInRight2;animation-name:bounceInRight2;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;opacity: 1;}
.banner .slide4.swiper-slide-active .displayer{-webkit-animation-name:fadeIn;animation-name:fadeIn;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;-webkit-animation-fill-mode:both;animation-fill-mode:both}
.banner .slide4.swiper-slide-active .man{-webkit-animation:fadeInRight4 1s both;animation:fadeInRight4 1s both;-webkit-transform-origin:0 50%;transform-origin:0 50% ;-webkit-animation-delay:1s;animation-delay:1.8s}
.banner .slide4.swiper-slide-active .phone1{-webkit-animation:fadeInLeftBottomPlus4 1.25s both;animation:fadeInLeftBottomPlus4 1.25s both;-webkit-transform-origin:0 50%;transform-origin:0 50%;-webkit-animation-delay:.6s;animation-delay:.6s}
.banner .slide4.swiper-slide-active .phone2{-webkit-animation:fadeInLeftBottomPlus4_2 1.25s both;animation:fadeInLeftBottomPlus4_2 1.25s both;-webkit-transform-origin:0 50%;transform-origin:0 50%;-webkit-animation-delay:.3s;animation-delay:.3s}

@-webkit-keyframes fadeIn{from{opacity:0}
to{opacity:1}
}
@keyframes fadeIn{from{opacity:0}
to{opacity:1}
}
@-webkit-keyframes fadeInLeftBottomPlus2{0%{opacity:0;-webkit-transform:translateX(-110px) translateY(75px)}
80%{opacity:1}
100%{opacity:1;-webkit-transform:translateX(0) translateY(-50%)}
}
@keyframes fadeInLeftBottomPlus2{0%{opacity:0;transform:translateX(-110px) translateY(75px)}
80%{opacity:1}
100%{opacity:1;transform:translateX(0) translateY(-50%)}
}
@-webkit-keyframes fadeInLeftBottomPlus4{0%{opacity:0;-webkit-transform:translateX(-110px) translateY(-75px)}
80%{opacity:1}
100%{opacity:1;-webkit-transform:translateX(0) translateY(0)}
}
@keyframes fadeInLeftBottomPlus4{0%{opacity:0;transform:translateX(-110px) translateY(-75px)}
80%{opacity:1}
100%{opacity:1;transform:translateX(0) translateY(0)}
}
@-webkit-keyframes fadeInLeftBottomPlus4_2{0%{opacity:0;-webkit-transform:translateX(110px) translateY(-75px)}
80%{opacity:1}
100%{opacity:1;-webkit-transform:translateX(0) translateY(0)}
}
@keyframes fadeInLeftBottomPlus4_2{0%{opacity:0;transform:translateX(110px) translateY(-75px)}
80%{opacity:1}
100%{opacity:1;transform:translateX(0) translateY(0)}
}
@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(100px)}
80%{opacity:1}
100%{opacity:1;-webkit-transform:translateX(0px)}
}
@keyframes fadeInRight{0%{opacity:0;transform:translateX(100px)}
80%{opacity:1}
100%{opacity:1;transform:translateX(0)}
}
@-webkit-keyframes fadeInRight2{0%{opacity:0;-webkit-transform:translateX(60px)}
80%{opacity:1}
100%{opacity:1;-webkit-transform:translateX(0) translateY(-30px);}
}
@keyframes fadeInRight2{0%{opacity:0;transform:translateX(60px)}
80%{opacity:1}
100%{opacity:1;transform:translateX(0) translateY(-30px);}
}
@-webkit-keyframes fadeInRight4{0%{opacity:0;-webkit-transform:translateX(60px) translateY(30px)}
80%{opacity:1}
100%{opacity:1;-webkit-transform:translateX(0) translateY(0px);}
}
@keyframes fadeInRight4{0%{opacity:0;-webkit-transform:translateX(60px) translateY(30px)}
80%{opacity:1}
100%{opacity:1;-webkit-transform:translateX(0) translateY(0px);}
}
@-webkit-keyframes bounceInRight{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}
from{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}
60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}
75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}
90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}
to{-webkit-transform:none;transform:none}
}
@keyframes bounceInRight{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}
from{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}
60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}
75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}
90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}
to{-webkit-transform:none;transform:none}
}
@keyframes bounceInRight2{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}
from{opacity:0;-webkit-transform:translate3d(3000px,-50%,0);transform:translate3d(3000px,-50%,0)}
60%{opacity:1;-webkit-transform:translate3d(-25px,-50%,0);transform:translate3d(-25px,-50%,0)}
75%{-webkit-transform:translate3d(10px,-50%,0);transform:translate3d(10px)}
90%{-webkit-transform:translate3d(-5px,-50%,0);transform:translate3d(-5px,-50%,0)}
to{-webkit-transform:translateY(-50%);transform:translateY(-50%)}
}
@-webkit-keyframes bounceInRight2{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}
from{opacity:0;-webkit-transform:translate3d(3000px,-50%,0);transform:translate3d(3000px,-50%,0)}
60%{opacity:1;-webkit-transform:translate3d(-25px,-50%,0);transform:translate3d(-25px,-50%,0)}
75%{-webkit-transform:translate3d(10px,-50%,0);transform:translate3d(10px)}
90%{-webkit-transform:translate3d(-5px,-50%,0);transform:translate3d(-5px,-50%,0)}
to{-webkit-transform:translateY(-50%);transform:translateY(-50%)}
}
@-webkit-keyframes bounceIn{20%,40%,60%,80%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}
0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}
20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}
40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}
60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}
80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}
to{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}
}
@keyframes bounceIn{20%,40%,60%,80%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}
0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}
20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}
40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}
60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}
80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}
to{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}
}
