@charset 'UTF-8';

body,
div,
ul,
li,
p,
h1,
h2,
h3,
a
{
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif,'黑体';

    margin: 0;
    padding: 0;

    -webkit-user-select: none;

    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-font-smoothing: antialiased;
}
html,
body
{
    overflow: hidden;

    width: 100%;
    height: 100%;

    background: #fff;
}
li,
ul
{
    list-style: none;
}
a
{
    text-decoration: none;
}
.wrap,
.cont,
.cont > li
{
    position: absolute;

    overflow: hidden;

    width: 100%;
    height: 100%;

    background: #fafafa url(http://cache.amap.com/h5/activity/taojin/bg.png) no-repeat center bottom;
    background-size: contain;
}
.wrap,
.cont
{
    position: relative;

    overflow: hidden;
}
.cont > li .after
{
    position: absolute;
    z-index: 999;
    bottom: 25px;
    left: 50%;

    width: 16px;
    height: 9px;
    margin-left: -8px;

    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAARCAYAAAC8XK78AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACXSURBVEhLvc5NCoAgEIbhuUOrjquIl2qZ62xXtykn/CDsBzOdD4aEFs9LSqkh3GyM6UlobLHJNgeMWust3CIREfE1mo6stV14eImIBPdsHz8kIh5xrGXEGQ/f6YJjLSKycaxmxGccqxFRjGN/In7jWElENRz7ElEdx3IimuHYW0RzHLuLEMOxNEIUx5IIWRyLEY6vHCfaAXaiQHpKsb/8AAAAAElFTkSuQmCC) no-repeat;
    -webkit-background-size: 16px 9px;
            background-size: 16px 9px;
}

.cont > li.play .after
{
    -webkit-animation: arrow 1s  both infinite alternate;
}


@-webkit-keyframes arrow
{
    0%
    {
        -webkit-transform: translateY(-6px);
    }
    100%
    {
        -webkit-transform: translateY(6px);
    }

}
header
{
    margin-top: 11%;

    text-align: center;
}
header h2
{
    font-size: 28px;
    font-weight: normal;
    line-height: 23px;

    padding-bottom: 14px;

    color: #f69600;
}
header p
{
    font-size: 17px;
    line-height: 17px;

    color: #f59d05;
}
li article
{
    position: absolute;
    top: 28%;
    left: 50%;

    width: 212px;
    height: 212px;
    margin-left: -106px;
}

#page1 > article
{
    background: #e6e6e6 url(http://cache.amap.com/h5/activity/taojin/phone.png) no-repeat center bottom;
    background-size: 138px 178px;
}
.mask
{
    position: absolute;
    top: -1px;

    width: 101%;
    height: 101%;

    background: #fafafa;

    -webkit-mask-image: -webkit-gradient(radial, 106 106, 0, 106 106, 106, from(rgba(1,0,0,0)), color-stop(99%, rgba(0,0,0,0)), to(rgba(1,0,0,1)));
}
article span
{
    position: absolute;
    z-index: 999;
}
#page1 span
{
    background-image: url(http://cache.amap.com/h5/activity/taojin/icons11.png);
    background-repeat: no-repeat;
    -webkit-background-size: 58px 173px;
            background-size: 58px 173px;
}

.play article
{
    -webkit-transform-origin: center;
    -webkit-animation: fadeIn_bg .5s .2s ease-in-out both;
}
@-webkit-keyframes fadeIn_bg
{
    0%
    {
        -webkit-transform: scale(.5);

        opacity: 0;
    }
    100%
    {
        -webkit-transform: scale(1);

        opacity: 1;
    }
}


#point
{
    position: absolute;
    z-index: 999;
    top: 50%;
    right: 8px;

    width: 4px;
    height: 38px;

    -webkit-transform: translateY(-50%);

}
.point span
{
    display: block;

    width: 4px;
    height: 4px;
    margin: 4px 0;

    border-radius: 50%;
    background-color: #d0d0d0;
}
.point span.current
{
    background: #ffa21e;
}


#ios_dload,
#and_dload
{
    font-size: 16px;
    line-height: 37px;

    position: fixed;
    z-index: 999;
    bottom: 12.8%;
    left: 50%;

    display: none;

    width: 47%;
    height: 37px;

    -webkit-transform: translateX(-50%);
    opacity: .95;
    border-radius: 19px;
    background-color: #606060;
}

#ios_dload a,
#and_dload a
{
    position: absolute;
    left: 50%;

    width: 100px;
    height: 100%;

    -webkit-transform: translateX(-50%);
    text-indent: 35px;

    color: #fff;
    background: url(http://cache.amap.com/h5/activity/taojin/ios_icon.png) no-repeat 0 4px;
    background-size: 22px 26px;
}

#and_dload a
{
    background: url(http://cache.amap.com/h5/activity/taojin/android1.png) no-repeat 0 4px;
    background-size: 24px 29px;;
}

/* page1 */
.item1_1
{
    top: 49%;
    left: -15px;

    width: 28px;
    height: 28px;

    border-radius: 14px;
    background-color: #fff;
    background-position: 7px -145px;
}
.item1_1:before
{
    position: absolute;
    top: 0;
    left: 0;

    -webkit-box-sizing: border-box;
    width: 200%;
    height: 200%;

    content: '';
    -webkit-transform: scale(.5);
    -webkit-transform-origin:left top;
    pointer-events: none;

    border: 1px solid #ccc;
    border-radius: 28px;
}
.item1_2
{
    top: 11%;
    left: 0;

    width: 30px;
    height: 30px;

    border-radius: 15px;
    background-color: #ffa311;
    background-position: 7px 9px;
}
.item1_3
{
    top: -11px;
    left: 25%;

    width: 28px;
    height: 28px;

    border-radius: 14px;
    background-color: #fff;
    background-position: 8px -46px;
}
.item1_3:before
{
    position: absolute;
    top: 0;
    left: 0;

    -webkit-box-sizing: border-box;
    width: 200%;
    height: 200%;

    content: '';
    -webkit-transform: scale(.5);
    -webkit-transform-origin:left top;
    pointer-events: none;

    border: 1px solid #ccc;
    border-radius: 28px;
}
@media only screen and (-webkit-device-pixel-ratio : 1.5)
{
    .item1_1:before,
    .item1_3:before
    {
        width: 150%;
        height: 150%;

        -webkit-transform: scale(.666667);
    }
}
@media only screen and (-webkit-device-pixel-ratio : 3)
{
    .item1_1:before,
    .item1_3:before
    {
        width: 150%;
        height: 150%;

        -webkit-transform: scale(.666667);
    }
}
.item1_4
{
    top: -8px;
    right: 25%;

    width: 32px;
    height: 32px;

    border-radius: 16px;
    background-color: #6eb7f0;
    background-position: 8px -94px;
}
.item1_5
{
    top: 59px;
    right: -12px;

    width: 38px;
    height: 38px;

    border-radius: 19px;
    background-color: #69be27;
    background-position: -27px -143px;
}
#page1 .item1_6
{
    bottom: -33px;
    left: 6px;

    width: 154px;
    height: 55px;

    background: url(http://cache.amap.com/h5/activity/taojin/road.png) no-repeat right bottom;
    background-size: 154px 55px;
}
.play .item1_6
{
    -webkit-animation: road .8s .6s ease-in-out both;
            animation: road .8s .6s ease-in-out both;
}

@-webkit-keyframes road
{
    0%
    {
        height: 0;
    }
    100%
    {
        height: 55px;
    }
}


#page1 .item1_7
{
    bottom: 16px;
    left: 31px;

    width: 40px;
    height: 56px;

    background: url(http://cache.amap.com/h5/activity/taojin/house1.png) no-repeat;
    -webkit-background-size: cover;
            background-size: cover;
}
.play .item1_7
{
    -webkit-animation: house_l .6s 1s ease-in-out both;
            animation: house_l .6s 1s ease-in-out both;
}
@-webkit-keyframes house_l
{
    0%
    {
        height: 0;
    }
    100%
    {
        height: 56px;
    }
}

#page1 .item1_8
{
    right: 43px;
    bottom: 10px;

    width: 26px;
    height: 40px;

    background: url(http://cache.amap.com/h5/activity/taojin/house2.png) no-repeat;
    -webkit-background-size: cover;
            background-size: cover;
}
.play .item1_8
{
    -webkit-animation: house_2 .5s 1.4s ease-in-out both;
            animation: house_2 .5s 1.4s ease-in-out both;
}
@-webkit-keyframes house_2
{
    0%
    {
        height: 0;
    }
    100%
    {
        height: 40px;
    }
}

.item1_9
{
    bottom: 19px;
    left: 61px;

    width: 20px;
    height: 29px;

    background-position: -35px 0;
}

.play .item1_9
{
    -webkit-animation: fallIn .5s 1.6s ease-in-out both;
            animation: fallIn .5s 1.6s ease-in-out both;
}
@-webkit-keyframes fallIn
{
    0%
    {
        -webkit-transform: translateY(-999px);
    }
    100%
    {
        -webkit-transform: translateY(0px);
    }
}

.item1_10
{
    right: 95px;
    bottom: 69px;

    width: 17px;
    height: 31px;

    background-position: -36px -50px;
}
.play .item1_10
{
    -webkit-animation: fallIn .5s 1.8s ease-in-out both;
}
.item1_11
{
    right: 68px;
    bottom: 10px;
    bottom: 18px;

    width: 21px;
    height: 31px;

    background-position: -35px -100px;
}
.play .item1_11
{
    -webkit-animation: fallIn .5s 1.8s ease-in-out both;
}
/*page2_add*/
#page2_add > article
{
    width: 218px;
    height: 218px;
    background: url(http://cache.amap.com/h5/activity/taojin/add_436x436.png) no-repeat center bottom;
    -webkit-background-size: 218px 218px;
            background-size: 218px 218px;
}
.item2_add_1{
    left:90px;
    /*top:40px;*/
    position:absolute;
    bottom:118px;
    width:40px;
    height:0px;
    background:url(http://cache.amap.com/h5/activity/taojin/add_80x125.png) no-repeat;
    background-size: 40px 62px;
    -webkit-transform-origin:center bottom;
}

.item2_add_1_2{
    left:60px;
    font-size: 10px;
    position: absolute;
    padding: 10px 15px;
    color: #ff8c1a;
    border: 1px solid #ffc982;
    border-radius: 4px;
    background: #fff;
}
.item2_add_1_2:after,.item2_add_1_2:before{
    top:100%;
    left:50%;
    border:solid transparent;
    content:"";
    height:0;
    width:0;
    position:absolute;
    pointer-events:none;
}
.item2_add_1_2:after{
    /*border-color:rgba(136,183,213,0);*/
    border-top-color:#fff;
    border-width:9px;
    margin-left:-9px;
}
.item2_add_1_2:before{
    /*border-color:rgba(136,183,213,0);*/
    border-top-color:#ffc982;
    border-width:10px;
    margin-left:-10px;
}
.item2_add_3{
    width:140px;
    /*height:100px;*/
    left:40px;
    bottom:61px;
}
.green_pops{
    height:100%;
}
.item2_add_3 .pops_left,.item2_add_3 .pops_right,.item2_add_3 .pops_middle{
    position:absolute;
    width:5px;
    /*height:100px;*/
    left:0;
    bottom:0;
    overflow: hidden;
}
.item2_add_3 .pops_middle{
    left:31px;
    bottom:37px;
    -webkit-transform:rotate(90deg);

}
.item2_add_3 .pops_inner{
    background: url(http://cache.amap.com/h5/activity/taojin/10x200.png) no-repeat;
    background-size: 5px 100px;
    width:100%;
    height:100px;
    position:absolute;
    bottom:0;
}
.item2_add_3 .pops_right{
    right:0;left:auto;
}

.item2_add_4{
    right:22px;
    bottom:0px;
    width:59px;
    height:60px;
    background:url(http://cache.amap.com/h5/activity/taojin/add_119x121.png) no-repeat;
    background-size: 59px 60px;
}

.play .item2_add_1{
    -webkit-animation: up_wobble 1.0s .7s ease-in-out both;
}
.play .item2_add_1_2
{
    -webkit-transform-origin: center bottom;
    -webkit-animation: fadeIn_bg 1.0s 1.2s ease-in-out both;
}
/*@-webkit-keyframes up_wobble{
0%{height: 0;}
50%{ height: 62px;-webkit-transform:translateX(0%)}
58%{-webkit-transform:translateX(-25%) rotate(-5deg)}
66%{-webkit-transform:translateX(20%) rotate(3deg)}
74%{-webkit-transform:translateX(-15%) rotate(-3deg)}
82%{-webkit-transform:translateX(10%) rotate(2deg)}
90%{-webkit-transform:translateX(-5%) rotate(-1deg)}
100%{-webkit-transform:translateX(0%); height: 62px;}
}*/
@-webkit-keyframes up_wobble{
0%{height: 0;}
50%{ height: 62px;-webkit-transform:rotate(0deg)}
66%{-webkit-transform:rotate(-15deg)}
82%{-webkit-transform:rotate(15deg);}
100%{-webkit-transform:rotate(0deg);height:62px;}
}

.play .item2_add_3 .pops_left{
    -webkit-transform-origin:top;
    -webkit-animation: pops_up .8s 1.2s ease-in-out both;
}
.play .item2_add_3 .pops_middle{
    -webkit-transform-origin: bottom;
    -webkit-animation: pops_up .5s 1.6s ease-in-out both;
}
.play .item2_add_3 .pops_right{
    -webkit-transform-origin: top;
    -webkit-animation: pops_up .6s 2.0s ease-in-out both;
}
@-webkit-keyframes pops_up
{
    0%
    {
        height: 0;
    }
    100%
    {
        height: 100px;
    }
}
.play .item2_add_4{
    -webkit-animation: fallIn .5s 2.5s ease-in-out both;
}

/* page2 */
#page2 > article
{
    width: 217px;
    height: 217px;

    background: url(http://cache.amap.com/h5/activity/taojin/bg22.png) no-repeat center bottom;
    -webkit-background-size: 217px 217px;
            background-size: 217px 217px;
}
.item2_1
{
    top: 25px;
    left: -6px;
    width: 40px;
    height: 62px;
    background: url(http://cache.amap.com/h5/activity/taojin/2green.png);
}
.item2_2
{
    top: 14px;
    right: 63px;

    width: 37px;
    height: 57px;

    background: url(http://cache.amap.com/h5/activity/taojin/2orange.png);
}
.item2_3
{
    top: 56px;
    right: -6px;

    width: 37px;
    height: 57px;

    background: url(http://cache.amap.com/h5/activity/taojin/2blue.png);
}
.item2_4
{
    bottom: 35px;
    left: 58px;

    width: 43px;
    height: 68px;

    background: url(http://cache.amap.com/h5/activity/taojin/2yellow.png);
}
.item2_5
{
    right: 0;
    bottom: -15px;

    width: 81px;
    height: 56px;

    background: url(http://cache.amap.com/h5/activity/taojin/2money.png);
}
.item2_1,
.item2_2,
.item2_3,
.item2_4,
.item2_5
{
    background-repeat: no-repeat;
    background-size: cover;
}

.play .item2_1
{
    -webkit-animation: fallIn .5s .7s ease-in-out both;
}
.play .item2_2
{
    -webkit-animation: fallIn .5s 1s ease-in-out both;
}
.play .item2_3
{
    -webkit-animation: fallIn .5s 1s ease-in-out both;
}
.play .item2_4
{
    -webkit-animation: fallIn .5s 1s ease-in-out both;
}
.play .item2_5
{
    -webkit-transform-origin: center;
    -webkit-animation: fadeIn_bg .5s .4s ease-in-out both;
}
/* page3 */
#page3 > article
{
    background: #f0f0f0 url(http://cache.amap.com/h5/activity/taojin/wallet.png) no-repeat center 56px;
    background-size: 116px 115px;
}
#page3 > article .coins
{
    position: absolute;
    z-index: 999;
    bottom: 152px;
    left: 55px;

    width: 100px;
    height: 25px;

    background: url(http://cache.amap.com/h5/activity/taojin/coins2.png) no-repeat;
    -webkit-background-size: cover;
            background-size: cover;
}


.item3_1,
.item3_2,
.item3_3,
.item3_4,
.item3_5,
.item3_6,
.item3_7,
.item3_8,
.item3_9,
.item3_10
{
    top: 35px;

    width: 25px;
    height: 25px;

    -webkit-transition-timing-function: ease-in;
    -webkit-transition-duration: 1.4s;
    -webkit-transition-property: -webkit-transform;
    -webkit-transform: translateY(-499px);

    background: url(http://cache.amap.com/h5/activity/taojin/coin2.png) no-repeat;
    -webkit-background-size: cover;
            background-size: cover;
}
.item3_1
{
    top: 35px;
    left: 68px;

    -webkit-transition-delay: .5s;
}
.item3_2
{
    top: 28px;
    left: 75px;

    -webkit-transition-delay: 0;
}
.item3_3
{
    top: 36px;
    left: 124px;

    -webkit-transition-delay: .1s;
}
.item3_4
{
    top: 20px;
    left: 95px;

    -webkit-transition-delay: .6s;
}
.item3_5
{
    top: 28px;
    left: 105px;

    -webkit-transition-delay: .1s;
}
.item3_6
{
    top: 25px;
    left: 108px;

    -webkit-transition-delay: .4s;
}
.item3_7
{
    top: 21px;
    left: 85px;

    -webkit-transition-delay: .5s;
}
.item3_8
{
    top: 30px;
    left: 88px;

    -webkit-transition-delay: .3s;
}
.item3_9
{
    top: 26px;
    left: 105px;

    -webkit-transition-delay: .4s;
}
.item3_10
{
    top: 32px;
    left: 115px;

    -webkit-transition-delay: .2s;
}


.play .item3_1,
.play .item3_2,
.play .item3_3,
.play .item3_4,
.play .item3_5,
.play .item3_6,
.play .item3_7,
.play .item3_8,
.play .item3_9,
.play .item3_10
{
    -webkit-transform: translateY(0);
}





/* page4 */
#page4 > article
{
    background: url(http://cache.amap.com/h5/activity/taojin/bg4.png) no-repeat center bottom;
    background-size: cover;
}
.item4_1
{
    top: 33px;
    left: 48px;

    width: 13px;
    height: 16px;
}
.item4_2
{
    top: 83px;
    left: 86px;

    width: 25px;
    height: 32px;
}
.item4_2 .blink
{
    position: absolute;
    top: -5px;
    left: 11px;

    width: 17px;
    height: 11px;

    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACEAAAAXCAYAAACFxybfAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAICSURBVEhLxZU5L0RRGIbHmlgSS1CIEtHQorMWFILKEvwI4j/QWDp0Yqmm0EgUaMTSKikUoiGWRGgkM57vzGviZubewXA9yZtzzvd+y82c64pkSywW69b2f+ABBtCcjuHD8Fb0gjoVChcG16Nb9BiPxwsUDg8GV6NLhsdZNxXODhr1ozl6dqB8hdOCX0zuqT2AwX5MVvbQbBi9onu0hUaYUSHbwTmP+I6bDuzfUKXs34GG7ehOMz6GHKBp1ICWZTnMU+nvomHuvjNB3rTKfgQtBrVNBbOKASduUjBNKvkW1OXQfwFNKZQeEopQNDErPdaIJVclKeD1kNOso4OYvVcr6A4VKeyPDSBxkdUX/KhfM+xyvBN0jdbQENpQ3bzSMkNyixUFQc4xS5VKPBAvxT90iV6+fpX2xCoKhLwLVK8yD8TtaneV6uB8hGqU4g+5dh03ibIEnO2FakQz6BC9yTLP7rlN5R6INygtCbEr5HlnUiChV/kOznafObIdxCrRKNpGD8g+eMOykxCzL7LrgXrRLLKP4hnqV1oqmOtWaLDfZymUlRb8fPI60fznxuztOuxXWiUnT+Ek5mvrBaMEPesBzlnKZH0b6ifREj08v2JGKJrQA9ifV53CP4I2/l/GIBi8R/ETa/CL81cwuBbZC9alUPgw3P5rjuv4P/AAfdqGRCTyDj6dMAIF0JatAAAAAElFTkSuQmCC) no-repeat;
    -webkit-background-size: cover;
            background-size: cover;
}
.item4_3
{
    bottom: 9px;
    left: 83px;

    width: 15px;
    height: 20px;
}
.item4_4
{
    bottom: 68px;
    left: 17px;

    width: 17px;
    height: 21px;
}
.item4_5
{
    top: 39px;
    right: 38px;

    width: 17px;
    height: 21px;
}
.item4_6
{
    right: 25px;
    bottom: 55px;

    width: 17px;
    height: 21px;
}
.item4_7
{
    right: 15px;
    bottom: -20px;

    width: 65px;
    height: 60px;

    background-image: url(http://cache.amap.com/h5/activity/taojin/gold_big.png);
}
.item4_1,
.item4_2,
.item4_3,
.item4_4,
.item4_5,
.item4_6
{
    z-index: 999;

    background: url(http://cache.amap.com/h5/activity/taojin/gold_sm.png);
}

#page4 > article span
{
    background-repeat: no-repeat;
    background-size: cover;
}

.play .item4_1,
.play .item4_2,
.play .item4_3
{
    -webkit-animation: fadeIn_bg .5s .4s ease-in-out both;
}
.play .item4_4,
.play .item4_5,
.play .item4_6
{
    -webkit-animation: fadeIn_bg .5s .7s ease-in-out both;
}
.play .item4_7
{
    -webkit-animation: fadeIn_bg .5s .9s ease-in-out both;
}
.play .item4_2 .blink
{
    -webkit-animation: blink 1.5s .9s ease-in-out both infinite;
}
@-webkit-keyframes blink
{
    0%
    {
        opacity: 0;
    }
    100%
    {
        opacity: 1;
    }
}



.item4_1b,
.item4_2b,
.item4_3b,
.item4_4b,
.item4_5b,
.item4_6b
{
    font-size: 11px;

    position: absolute;

    padding: 3px 4px;

    color: #ff8c1a;
    border: 1px solid #ffc982;
    border-radius: 4px;
    background: #fff;
}
.item4_1b:after,
.item4_2b:after,
.item4_3b:after,
.item4_4b:after,
.item4_5b:after,
.item4_6b:after
{
    position: absolute;
    top: 100%;
    left: 50%;

    width: 10px;
    height: 7px;
    margin-left: -5px;

    content: ' ';
    pointer-events: none;

    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAANCAYAAACkTj4ZAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAD8SURBVDhPnY47qsJAGIXHF14RBSsrKwu5WliIW3En1hJdh4rYhVteIroC4xZsUmntBvJ7zp9MUIzxceCDYeacjzFy/BO5BPJ1uIXDhP50pLJvgy0dBsdc6DtzCbzo4ZNgo1s4DCMyycO6kGATFd4JurrBViU24rqF8DBbviWjZO8suYnn91GZ76wyZZQcZqunEhuV7Z11qiz6yfqlBKmBVqNa7Z29sXcnw5l3fGMn7j7kB/yCgaVeKQ5P/+OtygDPvLvtAG64TdIFtwWFQ/xiR1IkFm6TdEBaSWUZEsJtkhJog7RiFtxw+5AyaAIW+OU+sCOeecc3dtiNY8wVqBS4kXogk4kAAAAASUVORK5CYII=) no-repeat;
    -webkit-background-size: cover;
            background-size: cover;
}

.item4_1b
{
    top: 5px;
    left: 18px;
}
.item4_2b
{
    top: 52px;
    left: 65px;
}
.item4_3b
{
    bottom: 30px;
    left: 54px;
}
.item4_4b
{
    bottom: 90px;
    left: -16px;
}
.item4_5b
{
    top: 12px;
    right: 12px;
}
.item4_6b
{
    right: -4px;
    bottom: 82px;
}

.play .item4_1b,
.play .item4_2b,
.play .item4_3b
{
    -webkit-transform-origin: center;
    -webkit-animation: fadeIn_bg .8s 1s ease-in-out both;
}
.play .item4_4b,
.play .item4_5b,
.play .item4_6b
{
    -webkit-transform-origin: center;
    -webkit-animation: fadeIn_bg .8s 1.2s ease-in-out both;
}



@media (device-height:667px) and (-webkit-min-device-pixel-ratio:2)
{
    /* iphone6 */
    @-webkit-keyframes fadeIn_bg
    {
        0%
        {
            -webkit-transform: scale(.8);

            opacity: 0;
        }
        100%
        {
            -webkit-transform: scale(1.1);

            opacity: 1;
        }
    }
    @keyframes fadeIn_bg
    {
        0%
        {
            transform: scale(.8);

            opacity: 0;
        }
        100%
        {
            transform: scale(1.1);

            opacity: 1;
        }
    }
}

@media (device-height:736px) and (-webkit-min-device-pixel-ratio:2)
{
    /* iphone6 Plus */
    @-webkit-keyframes fadeIn_bg
    {
        0%
        {
            -webkit-transform: scale(.9);

            opacity: 0;
        }
        100%
        {
            -webkit-transform: scale(1.2);

            opacity: 1;
        }
    }
    @keyframes fadeIn_bg
    {
        0%
        {
            transform: scale(.9);

            opacity: 0;
        }
        100%
        {
            transform: scale(1.2);

            opacity: 1;
        }
    }
}