html, body {position: relative;height: 100%;}
.mob-header-group{width: 100%;border-bottom: 2px solid #f2f2f2;background-color: #ffffff;position: fixed;top: 0px;z-index: 99;}
.mob-header{background-color: #fff;width: 1200px;height: 76px;margin: 0 auto;}
.mob-header .mob-nav{width: 1200px;height: 76px;display: table;}
.mob-header .mob-nav a{display: table-cell;vertical-align: middle;}
.mob-header .mob-nav img{max-width: 300px ;max-height: 50px;border: 0;vertical-align: middle;}
.mob-header .mob-nav a.go-home{float: right;width: 80px;height: 30px;line-height: 30px;text-align: center;color: #ef505e;border:1px solid #ef505e;border-radius: 16px;text-decoration: none;margin-top: 20px;-webkit-transition: all .3s;transition: all .3s;}
.mob-header .mob-nav a.go-home:hover{background-color:#ef505e;color: #fff;}
.swiper-container-vertical>.aix-swiper-pagination.swiper-pagination-bullets{right: 20px;}
.aix-swiper-pagination.swiper-pagination .swiper-pagination-bullet{border: 2px solid #d1cccc;}
.aix-swiper-pagination.swiper-pagination .swiper-pagination-bullet-active{background-color: #959595;border-color:#959595 }
.swiper-container{width: 100%;min-width: 1200px;height: 100%;margin-left: auto;margin-right: auto;}
.swiper-slide{font-size: 18px;background: #fff;}
.swiper-slide.page1{background: url(../images/phone_web/bg1.png) no-repeat center 76px;}
.swiper-slide.page1 .content{position: relative;margin: 0 auto;width: 1160px;margin-top: 200px;}
.swiper-slide.page1 .content .txt{float: left;margin-top: 116px;margin-left: 60px;}
.swiper-slide.page1 .content .txt .txt2{width: 493px;height: 103px;background: url(../images/phone_web/t2.png) no-repeat center;padding-top: 20px;position: relative;}
.swiper-slide.page1 .content .txt .txt2 .site{position: absolute;left: 22px;bottom: 20px;color: #ff9233;font-size: 20px;}
.swiper-slide.page1 .content .txt .txt3{margin-top: 30px;text-align: center;color: #717372;}
.swiper-slide.page1 .content .mob-img{float: right;width: 520px;height: 725px;background: url(../images/phone_web/mob-1.png) no-repeat bottom;}
.swiper-slide.page2{background-color: #f5f7f9;display: block;}
.swiper-slide.page2 .content{width: 1100px;height: 640px;margin: 0 auto;margin-top: 150px;}
.swiper-slide.page2 .item-wrap .item{float: left;width: 210px;height: 270px;margin-right: 52px;position: relative;z-index: 1;}
.swiper-slide.page2 .item-wrap .item .t1{font-size: 26px;color: #646464;line-height: 50px;text-align: center;}
.swiper-slide.page2 .item-wrap .item .t2{font-size: 14px;color: #9b9b9b;line-height: 30px;margin-top: 10px;}
.swiper-slide.page2 .item-wrap .item.item1{background: #f5f7f9 url(../images/phone_web/p1.png) no-repeat center bottom;}
.swiper-slide.page2 .item-wrap .item.item2{background: #f5f7f9 url(../images/phone_web/p2.png) no-repeat center bottom;}
.swiper-slide.page2 .item-wrap .item.item3{background: #f5f7f9 url(../images/phone_web/p3.png) no-repeat center bottom;margin-left: 104px;}
.swiper-slide.page2 .item-wrap .item.item4{background: #f5f7f9 url(../images/phone_web/p4.png) no-repeat center bottom;margin-right: 0px;}
.swiper-slide.page2 .content .pic{width: 881px;height: 365px;margin: 0 auto;}
.swiper-slide.page3{background-color: #fff;}
.swiper-slide.page3 .content{width: 1160px;height: 640px;margin: 0 auto;margin-top: 140px;}
.swiper-slide.page3 .content .txt{width: 620px;text-align: center;padding-top: 215px;float: left;}
.swiper-slide.page3 .content .txt .t1{font-size: 40px;color: #333;}
.swiper-slide.page3 .content .txt .t2{font-size: 28px;color: #333;padding-top: 30px;text-align: left;}
.swiper-slide.page3 .content  .mob-img{width: 536px;height: 666px;float: right;position: relative;overflow: hidden;}
.swiper-slide.page3 .content  .mob-img .mob-bg{width: 536px;height: 666px;float: right;background: url(../images/phone_web/mob3.png) no-repeat right center;}
.swiper-slide.page3 .content  .mob-img .show-card{width: 255px;height: 394px;position: absolute;top: 149px;left: 224px;}
.swiper-slide.page3 .content  .mob-img .show-card li{width: 230px;height: 90px;margin: 8px 0 0 12px;background: url(../images/phone_web/cards-list.png) no-repeat;}
.swiper-slide.page3 .content  .mob-img .show-card li.card-2{background-position: 0 -100px;}
.swiper-slide.page3 .content  .mob-img .show-card li.card-3{background-position: 0 -200px;}
.swiper-slide.page3 .content  .mob-img .show-card li.card-4{background-position: 0 -316px;-webkit-transform: perspective(500px) rotateX(-5deg) scale(1.14) translateY(-30px);transform: perspective(500px) rotateX(-5deg) scale(1.14) translateY(-30px);margin-top: -10px;}
.swiper-slide.page3 .content  .mob-img .show-card li.card-5{background-position: 0 -433px;-webkit-transform: perspective(500px) rotateX(-10deg) scale(1.23) translateY(-15px);transform: perspective(500px) rotateX(-10deg) scale(1.23) translateY(-15px);margin-top: -80px;}
.swiper-slide.page3 .content  .mob-img .show-card li.card-6{background-position: 0 -541px;-webkit-transform: perspective(500px) rotateX(-10deg) scale(1.32) translateY(0);transform: perspective(500px) rotateX(-10deg) scale(1.32) translateY(0);margin-top: -81px;}
.fadeInLeftSmall {
    -webkit-animation-name:fadeInLeftSmall;
    animation-name:fadeInLeftSmall;
}
@-webkit-keyframes fadeInLeftSmall {
    0% {
        opacity:0;
        -webkit-transform:translate3d(-50px, 0, 0);
        transform:translate3d(-50px, 0, 0)
    }
    100% {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
}
@keyframes fadeInLeftSmall {
    0% {
        opacity:0;
        -webkit-transform:translate3d(-50px, 0, 0);
        -ms-transform:translate3d(-50px, 0, 0);
        transform:translate3d(-50px, 0, 0)
    }
    100% {
        opacity:1;
        -webkit-transform:none;
        -ms-transform:none;
        transform:none
    }
}
.fadeInRightSmall {
    -webkit-animation-name:fadeInRightSmall;
    animation-name:fadeInRightSmall;
}
@-webkit-keyframes fadeInRightSmall {
    0% {
        opacity:0;
        -webkit-transform:translate3d(50px, 0, 0);
        transform:translate3d(50px, 0, 0)
    }
    100% {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
}
.fadeInRightB {
    -webkit-animation-name:fadeInRightB;
    animation-name:fadeInRightB;
}
@-webkit-keyframes fadeInRightB {
    0% {
        opacity:0;
        -webkit-transform:translate3d(100px, 0, 0);
        transform:translate3d(100px, 0, 0)
    }
    100% {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
}

@keyframes fadeInRightB {
    0% {
        opacity:0;
        -webkit-transform:translate3d(100px, 0, 0);
        -ms-transform:translate3d(100px, 0, 0);
        transform:translate3d(100px, 0, 0)
    }
    100% {
        opacity:1;
        -webkit-transform:none;
        -ms-transform:none;
        transform:none
    }
}
@keyframes fadeInRightSmall {
    0% {
        opacity:0;
        -webkit-transform:translate3d(50px, 0, 0);
        -ms-transform:translate3d(50px, 0, 0);
        transform:translate3d(50px, 0, 0)
    }
    100% {
        opacity:1;
        -webkit-transform:none;
        -ms-transform:none;
        transform:none
    }
}
.cardShow1 {
    -webkit-animation-name:cardShow1;
    animation-name:cardShow1;
}
@-webkit-keyframes cardShow1 {
    0% {
        -webkit-transform:translateY(-10px)
    }
    100% {
        -webkit-transform:translateY(0)
    }
}
@keyframes cardShow1 {
    0% {
        transform:translateY(-10px)
    }
    100% {
        transform:translateY(0)
    }
}
.cardShow2 {
    -webkit-animation-name:cardShow2;
    animation-name:cardShow2;
}
@-webkit-keyframes cardShow2 {
    0% {
        -webkit-transform:translateY(-80px)
    }
    100% {
        -webkit-transform:translateY(0)
    }
}
@keyframes cardShow2 {
    0% {
        transform:translateY(-80px)
    }
    100% {
        transform:translateY(0)
    }
}
.cardShow3 {
    -webkit-animation-name:cardShow3;
    animation-name:cardShow3;
}
@-webkit-keyframes cardShow3 {
    0% {
        -webkit-transform:translateY(-170px)
    }
    100% {
        -webkit-transform:translateY(0)
    }
}
@keyframes cardShow3 {
    0% {
        transform:translateY(-170px)
    }
    100% {
        transform:translateY(0)
    }
}
.cardShow4 {
    -webkit-animation-name:cardShow4;
    animation-name:cardShow4;
}
@-webkit-keyframes cardShow4 {
    0% {
        -webkit-transform:translateY(-250px)
    }
    60% {
        -webkit-transform:perspective(0) rotateX(-5deg) scale(1) translateY(-10px)
    }
    100% {
        -webkit-transform:perspective(500px) rotateX(-5deg) scale(1.14) translateY(-30px)
    }
}
@keyframes cardShow4 {
    0% {
        transform:translateY(-250px)
    }
    60% {
        transform:perspective(0) rotateX(-10deg) scale(1) translateY(-10px)
    }
    100% {
        transform:perspective(500px) rotateX(-10deg) scale(1.14) translateY(-30px)
    }
}
.cardShow5 {
    -webkit-animation-name:cardShow5;
    animation-name:cardShow5;
}
@-webkit-keyframes cardShow5 {
    0% {
        -webkit-transform:translateY(-290px)
    }
    70% {
        -webkit-transform:perspective(0) rotateX(-10deg) scale(1) translateY(-5px)
    }
    100% {
        -webkit-transform:perspective(500px) rotateX(-10deg) scale(1.23) translateY(-15px)
    }
}
@keyframes cardShow5 {
    0% {
        transform:translateY(-290px)
    }
    70% {
        transform:perspective(0) rotateX(-10deg) scale(1) translateY(-5px)
    }
    100% {
        transform:perspective(500px) rotateX(-10deg) scale(1.23) translateY(-15px)
    }
}
.cardShow6 {
    -webkit-animation-name:cardShow6;
    animation-name:cardShow6;
}
@-webkit-keyframes cardShow6 {
    0% {
        -webkit-transform:translateY(-290px)
    }
    80% {
        -webkit-transform:perspective(0) rotateX(-10deg) scale(1) translateY(0)
    }
    100% {
        -webkit-transform:perspective(500px) rotateX(-10deg) scale(1.32) translateY(0)
    }
}
@keyframes cardShow6 {
    0% {
        transform:translateY(-290px)
    }
    80% {
        transform:perspective(0) rotateX(-10deg) scale(1) translateY(0)
    }
    100% {
        transform:perspective(500px) rotateX(-10deg) scale(1.32) translateY(0)
    }
}
.swiper-slide.page4{background-color: #f5f7f9;}
.swiper-slide.page4 .content{width: 1160px;margin: 0 auto;margin-top: 140px;}
.swiper-slide.page4 .content .mob-img{float: left;position: relative;overflow: hidden}
.swiper-slide.page4 .content .mob-img .mob-bg{width: 521px;height:680px;background: url(../images/phone_web/mob4.png) no-repeat center;}
.swiper-slide.page4 .content .mob-img .mob-bg .mob-tip1{position: absolute;left:20px;width: 475px; height: 367px;z-index: 2;background: url(../images/phone_web/mob-tip1.png) no-repeat center;}
.swiper-slide.page4 .content .mob-img .mob-bg .mob-tip2{position: absolute;top: 64px;left:15px;width: 480px; height: 372px;z-index: 1;background: url(../images/phone_web/mob-tip2.png) no-repeat center;}
.swiper-slide.page4 .content .txt{width: 540px;text-align: center;padding-top: 215px;float: right;}
.swiper-slide.page4 .content .txt .t1{font-size: 40px;color: #333;}
.swiper-slide.page4 .content .txt .t2{font-size: 28px;color: #333;padding-top: 30px;text-align: left;}
.swiper-slide.page5{background-color: #fff;}
.swiper-slide.page5 .content{width: 1160px;margin: 0 auto;margin-top: 140px;}
.swiper-slide.page5 .content .txt{width: 540px;float: left;text-align: center;padding-top: 215px;}
.swiper-slide.page5 .content .txt .t1{font-size: 40px;color: #333;}
.swiper-slide.page5 .content .txt .t2{font-size: 28px;color: #333;padding-top: 30px;text-align: left;}
.swiper-slide.page5 .content  .mob-img{float: right;position: relative;}
.swiper-slide.page5 .content  .mob-img .mob-bg{width: 589px;height:666px;background: url(../images/phone_web/mob-5.png) no-repeat right center;}
.swiper-slide.page5 .content  .mob-img .mob-bg ul{width: 589px;height:666px;}
.swiper-slide.page5 .content  .mob-img .mob-bg ul li{position: absolute;width:457px;height:160px;}
.swiper-slide.page5 .content  .mob-img .mob-bg .card-1{top: 182px;right: 8px;background: url(../images/phone_web/card1.png) no-repeat center;z-index: 1;}
.swiper-slide.page5 .content  .mob-img .mob-bg .card-2{top: 264px;right: 47px;background: url(../images/phone_web/card2.png) no-repeat center;z-index: 2;}
.swiper-slide.page5 .content  .mob-img .mob-bg .card-3{top: 347px;right: -82px;background: url(../images/phone_web/card3.png) no-repeat center;z-index: 1;}