@charset"utf-8";
/*css document*/

body{background: url("/static/images/app_bg.png") no-repeat center -150px;}
.app_box{min-width:980px;max-width:1180px;margin:130px auto 0 auto;}
.ad_left{float:left;width:512px;height:470px;position: relative;}
.app_phone{width:255px;height:489px;background:url("/static/images/app_phone.png")}
.app_sunshine{width:159px;height:161px;background: url("/static/images/app_sunshine.png");position: absolute;top:0;
    right:0px;}
.app_people{width:286px;height:264px;background: url("/static/images/app_people.png");position: absolute;bottom:0;
    right:80px;}
.con_right{float:right;position: relative;}
.app_ad_word{width:439px;height:119px;background: url("/static/images/app_adword.png");margin-bottom: 30px;}
.download_type p{margin-top:10px;cursor: pointer;}
.download_type p:hover{opacity: .8;}
.app_iphone{width:196px;height:50px;background: url("/static/images/app_d_phone.png")}
.app_android{width:196px;height:50px;background: url("/static/images/app_android.png")}
.app_code{width:209px;height:303px;background: url("/static/images/app_codebg.png") repeat;text-align: center;float:left;}
.app_book{width:85%;line-height: 40px;font-size: 16px;color:#fff;border:1px solid #fff;border-radius: 5px;
    display: inline-block;margin-top:15px;cursor: pointer;}
.app_sm{width:157px;height:25px;background: url("/static/images/app_sm.png") no-repeat;margin:15px auto;}
.download_type{float:right;margin:85px 0 0 0;}



/*动画*/
/*太阳*/
@-webkit-keyframes circle{
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);}
}

.app_sunshine{
    -webkit-transform: rotate(360deg);
    animation: circle 8s infinite linear;
    -moz-animation: circle 8s infinite linear;
    -webkit-animation: circle 8s infinite linear;
    -o-animation: circle 8s infinite linear;
}

/*手机*/
@keyframes app_phone {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0);
        -webkit-animation-timing-function: cubic-bezier(0, 0, 0.76, 0.3);
        animation-timing-function: cubic-bezier(0, 0, 0.76, 0.3); }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0px, 0);
        transform: translate3d(0, 0px, 0);
        -webkit-animation-timing-function: cubic-bezier(0, 0, 0.76, 0.3);
        animation-timing-function: cubic-bezier(0, 0, 0.76, 0.3); } }
.app_phone{
    -moz-animation: app_phone 0.5s;
    -webkit-animation: app_phone 0.5s;
    animation: app_phone 0.5s;
}

/*小人*/
@keyframes people {
    from {
        opacity: 1;
        -webkit-transform: translate3d(-20px, 0, 0);
        transform: translate3d(-20px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0, 0, 0.43, 0.43);
        animation-timing-function: cubic-bezier(0, 0, 0.43, 0.43); }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0px, 0);
        transform: translate3d(0, 0px, 0);
        -webkit-animation-timing-function: cubic-bezier(0, 0, 0.43, 0.43);
        animation-timing-function: cubic-bezier(0, 0, 0.43, 0.43); } }
.app_people {
    -webkit-opacity: 0;
    -o-opacity: 0;
    -moz-opacity: 0;
    -moz-animation: people 2s 1.3s 21 alternate forwards;
    -webkit-animation: people 2s 1.3s 21 alternate forwards;
    animation: people 2s 1.3s 21 alternate forwards; }