@charset "utf-8";
body{background: #32074f;padding-bottom: 100px;overflow-x: hidden}
.w1100{margin: 0 auto}
.topBg{position: absolute;top: 0;right: 0;left: 0;z-index: 0}
.topBg img{width: 100%}
.actTop{position: relative;z-index: 2;height: 740px;}
.actTop .w1100{position: relative}
.actTop .topTip{width: 187px;height: 151px;background: url("../images/toptip.png") no-repeat top
center;text-align: center;position: absolute;top: 0;left: 0}
.actTop .topTip h3{font-size: 20px;color: #fff;padding-top: 60px}
.actTop .topTip p{font-size: 20px;color: #fff}
.actTop .topTip p em{color: #fff100;font-size: 28px;}
.topGroup{position:relative}
.topGroup .bigtext{position: absolute}
.topGroup .bigtext0{left: 50%;margin-left:-275px;top: 24px}
.topGroup .bigtext1{left: 50%;margin-left:-339px;top: 125px}
.topGroup .bigtext2{left: 50%;margin-left: -281px;top:230px;}
.topGroup .actTime{position: absolute;width: 100%;text-align: center;font-size: 20px;color: #fff;top: 345px;z-index: 2;}
.topGroup .countdown{width: 665px;height: 211px;background: url("../images/timebg.png") no-repeat;position: absolute;top: 312px;left: 50%;margin-left: -332.5px;z-index: 1}
.countdown .timeBox{position: absolute;width: 100%;top: 130px;}
.countdown .timeBox ul{display: block;overflow: hidden;text-align:center}
.countdown .timeBox ul li{display: inline-block;vertical-align: middle}
.countdown .timeBox ul li{*display: inline;}
.countdown .timeBox ul li.bg{font-size: 36px;color: #fff}
.countdown .timeBox ul li.oText{color: #51edff;font-size: 28px;margin: 0 1%;}
.topGroup .glasee{position: absolute;right: 75px;top: 376px;z-index: 1;}
.topGroup .movie{position: absolute;left: 75px;top: 326px;z-index: 1;}
.topGroup .stage{width: 1097px;height: 295px;background: url("../images/stage.png") no-repeat top center;position: absolute;top: 470px;left: 50%;margin-left: -548.5px;}
.stage .items{position: absolute;top: 120px;left: 0;width: 100%;}
.stage .items ul li{float: left;width: 108px;height: 108px;background: #27defe;text-align:center;margin-left: 24px;border: 1px solid #27defe;cursor: pointer}
.stage .items ul li{display: block}
.stage .items ul li i{width: 50px;height: 50px;margin: 5px auto;display: block;background: url("../images/icons.png") no-repeat 0 0}
.stage .items ul li.i0 i{background-position: 0 0}
.stage .items ul li.i1 i{background-position: 0 -50px}
.stage .items ul li.i2 i{background-position: 0 -100px}
.stage .items ul li.i3 i{background-position: 0 -150px}
.stage .items ul li.i4 i{background-position: 0 -200px}
.stage .items ul li.i5 i{background-position: 0 -250px}
.stage .items ul li.i6 i{background-position: 0 -300px}
.stage .items ul li.i7 i{background-position: 0 -350px}
.stage .items ul li p{display: table-cell;height: 40px;width: 110px;vertical-align: middle;font-size: 14px;color: #053eac}
.stage .items ul li:hover{border-color: #00308e\9;box-shadow: 0 0 4px #cedfff}
.floor{position: relative;z-index: 1}
.floor1 .title{width: 734px;height: 154px;margin: 0 auto;background: url("../images/sprite.png") no-repeat 0 0}
.floor2 .title{width: 734px;height: 175px;margin: 0 auto;background: url("../images/sprite.png") no-repeat 0 -158px}
.floor3 .title{width: 785px;height: 186px;margin: 0 auto;background: url("../images/sprite.png") no-repeat 0 -338px}
.floor4 .title{width: 1100px;height: 258px;margin: 0 auto;background: url("../images/sprite.png") no-repeat 0 -534px}
.floor4 .title h3{text-align: center;color: #4d1473;font-size: 36px;font-weight: normal;padding-top: 184px;}
.floor5 .title{width: 746px;height: 152px;margin: 0 auto;background: url("../images/sprite.png") no-repeat 0 -809px}
.floor1 .oldAndNew{height: 408px;background: url("../images/oldandnew.png") no-repeat top center; overflow: hidden;}
.floor1 .oldAndNew .cell{width: 500px;float: left;margin-top: 185px;   }
.floor1 .oldAndNew .cell li{width: auto;display: inline-block;font-size: 18px;color: #330750;vertical-align: middle;text-align: center;margin: 0 22px;}
.floor1 .oldAndNew .cell li{*display: inline}
.floor1 .oldAndNew .cell li.plus{width: 22px;height: 22px;background: url("../images/y3.png") no-repeat;margin: 0}
.floor1 .oldAndNew .cell li p{margin-top: 5px}
.floor1 .oldAndNew .cell li p i{color: #d92d2d;font-size: 30px}
.floor1 .oldAndNew .cellRight{margin-left: 80px}
.floor2 .tabMod{}
.floor2 .tabMod .hd{}
.floor2 .tabMod .hd ul li{float: left;width: 308px;height: 71px;background: url("../images/sprite.png") no-repeat -313px -972px;margin-left: -44px;position: relative;text-align: center;line-height: 71px;font-size: 20px;color: #7661ff;cursor: pointer}
.floor2 .tabMod .hd ul li:first-child{margin: 0}
.floor2 .tabMod .hd ul li.li0{z-index: 3}
.floor2 .tabMod .hd ul li.li1{z-index: 2}
.floor2 .tabMod .hd ul li.li2{z-index: 1}
.floor2 .tabMod .hd ul li.li3{z-index: 0}
.floor2 .tabMod .hd ul li.on{z-index: 9;background-position: 0 -972px;color: #fff}
.floor2 .tabMod .bd{background: #29169f}
.floor2 .tabMod .bd ul li{float: left;width: 255px;margin: 20px 0px 0 16px;}
.floor2 .tabMod .bd ul li .name{width: 255px;height: 116px;background: url("../images/sprite.png") no-repeat 0 -1050px;font-size: 36px;color: #ffdd00;text-align: center;line-height: 116px;text-shadow: 0 0 10px #ffdd00;}
.floor2 .tabMod .bd ul li .name em{font-size: 20px;color: #f60;line-height: 24px}
.floor2 .tabMod .bd ul li p{line-height: 50px;}
.floor2 .tabMod .bd ul li p span.newPrice{color: #fff;font-size: 30px;float:left}
.floor2 .tabMod .bd ul li p span.newPrice i{font-size: 14px}
.floor2 .tabMod .bd ul li p .originalPrice{font-size: 16px;color: #21f1d1;display: block;text-align: right;}
.floor2 .tabMod .bd ul li p .originalPrice s{text-decoration: line-through;}
.floor3 .game{background: url("../images/gamebg.png") no-repeat top center;width: 1100px;height: 960px;position: relative}
.floor3 .game .scrollBox{width: 257px;height: 543px;background: url("../images/white-iphone-5c.png") no-repeat top center;float: left;margin: 100px 0 0 130px;position: relative}
.floor3 .game .scrollBox .scrollThis{width: 217px;height: 384px;overflow: hidden;margin: 82px 0 0 21px;position: relative}
.floor3 .game .scrollBox .scrollThis ul li{float: left;width: 217px;height: 384px;position: absolute;top: 0;left: 0}
.floor3 .game .scrollBox .scrollThis ul li img{width: 217px;height: 384px;}
.floor3 .game .scrollBox .scrollThis .scrollPage{position: absolute;bottom: 20px;width: 100%;text-align: center;z-index: 9;}
.floor3 .game .scrollBox .scrollThis .scrollPage i{display: inline-block;width: 8px;height: 8px;background: green;margin: 0 2px;border-radius: 50px;cursor: pointer;}
.floor3 .game .scrollBox .scrollThis .scrollPage i.on{background: #f60}
.floor3 .game .scrollBox .abtn{}
.floor3 .game .scrollBox .abtn a{position: absolute;top: 50%;margin-top: -27px;width: 37px;height: 54px;background: url("../images/sprite.png") no-repeat}
.floor3 .game .scrollBox .abtn a.prev{background-position: -260px -1052px;left: -100px;}
.floor3 .game .scrollBox .abtn a.next{background-position: -300px -1052px;right: -100px;}
.floor3 .game .rightPart{height: 900px;overflow: hidden;}
.floor3 .game .rightPart .er{position: relative;text-align: right;top: 80px;right: 55px;}
.floor3 .game .rightPart .qrcode{ width:198px;}
.floor3 .game .rightPart .man{}
.floor3 .game .rightPart .rule{color: #fff;color: #fff;margin: 120px 50px 0 200px;}
.floor3 .game .rightPart .rule h2{color: #fff600;font-size: 24px;font-weight: normal}
.floor3 .game .rightPart .rule p{line-height: 24px;font-size: 16px;margin-top: 15px}
.floor3 .game .reminder{position: absolute;left: 50%;margin-left:-264px;bottom: 20px;width: 528px;height: 307px;background: url("../images/reminder.png") no-repeat top center;color: #fff}
.floor3 .game .reminder h2{font-size: 18px;color: #fff600}
.floor3 .game .reminder p{font-size: 14px;padding-top: 5px;line-height: 24px;}
.floor3 .game .reminder .textWarp{padding: 38px;-webkit-transform: rotate(-3deg);-moz-transform: rotate(-3deg);-ms-transform: rotate(-3deg);transform: rotate(-3deg);}
.floor4 .wxDesc{width: 1100px;height: 445px;margin: 40px auto;background: url("../images/wxbg.png") no-repeat;position: relative}
.floor4 .wxDesc .leftPart{width: 389px;height: 359px;background: url("../images/wxrect.png") no-repeat;position: absolute;left: 72px;top: 70px;top: 44px;text-align: center}
.floor4 .wxDesc .leftPart p{line-height: 40px;font-size: 18px;color: #fff;margin-top: 20px;}
.floor4 .wxDesc .leftPart p a{color: #f95fff}
.floor4 .wxDesc .leftPart p a:hover{text-decoration: underline}
.floor4 .wxDesc .rightPart{color: #f7ff1d;font-size: 24px;width: 400px;position: absolute;right: 125px;top: 75px;}
.floor4 .wxDesc .rightPart p{margin-top: 15px}
.floor4 .wxDesc .rightPart p:first-child{color: #53d9ff}
.floor5 .w1100{background: url("../images/line.png") no-repeat 255px 98px;}
.floor5 .rects{height: 610px;width: 100%;position: relative;color: #fff}
.floor5 .rects .rect{background: url("../images/sprite.png") no-repeat;position: absolute;}
.floor5 .rects .redRect{width: 441px;height: 248px;background-position: 0 -1419px;top: 40px;left: 30px}
.floor5 .rects .blueRect{width: 414px;height: 248px;background-position: -550px -1054px;top: 100px;right: 30px;}
.floor5 .rects .yellowRect{width: 545px;height: 224px;background-position: 0 -1178px;bottom: 0;left: 160px;}
.floor5 .rects .rect .rectWarp{padding: 20px 30px}
.floor5 .rects .rect h2{text-align: left;padding-bottom: 5px;font-weight: normal;padding: 10px 15px;}
.floor5 .rects .rect h3{text-align: left;font-weight: normal;height: 36px;line-height: 36px;background: url("../images/sprite.png") no-repeat;padding-left: 10px;margin: 7px 0;}
.floor5 .rects .rect p{padding-left: 10px;line-height: 35px;}
.floor5 .rects .redRect h3{background-position: -560px -1360px}
.floor5 .rects .blueRect h3{background-position: -560px -1316px}
.floor5 .rects .yellowRect h2{color: #b9441c;font-size: 30px;text-align: center;padding: 25px 0}
.floor5 .rects .yellowRect ul li{display: inline-block;vertical-align: middle;width: 100px;height: 100px;background: url("../images/sprite.png") no-repeat -350px -1060px;margin: 0 13px;}
.floor5 .rects .yellowRect ul li{*display: inline}
.floor5 .rects .yellowRect ul li.arrow{width:12px;height: 19px;background: url("../images/sprite.png") no-repeat -462px -1098px;margin: 0}
.floor5 .rects .yellowRect ul li em{display: block;padding: 17px 26px;font-size: 24px;}
.fixedBar{border: 1px solid #ea219d;text-align: center;position: fixed;right: 0;top: 50%;width: 180px;z-index: 99;box-shadow: 0 0 8px #ea219d;margin-top: -165px}
.fixedBar h2{position: absolute;top: -28px;background: url("../images/sprite.png") no-repeat -450px -1418px;height: 54px;width: 104px;font-size: 16px;color: #fff;font-weight: normal;line-height: 54px;left: 50%;margin-left: -52px;}
.fixedBar ul{margin-top: 30px;padding-bottom: 20px}
.fixedBar ul li{display: inline-block;width: 150px;height: 40px;background: #59006d;color: #fff;line-height: 40px;margin-top: 12px}
.fixedBar ul li a{color: #fff;font-size: 14px;display: block}
.fixedBar ul li.on{background: #fff556}
.fixedBar ul li.on a{color:#59006d}
.fixedBar a.backtop{position: absolute;bottom: -13px;width: 86px;height: 26px;background: #053eac;line-height: 26px;color: #fff;left: 50%;margin-left: -43px;}
.fixedBar ul li.contact{background: none;border: 2px dotted #21f1d1;width: 146px;height: 36px;text-align: left}
.fixedBar ul li.contact a{color: #21f1d1;}
.fixedBar ul li.contact.on{background: none}
.fixedBar ul li a{display: block;font-size: 16px;   margin-left: 10px;}
.fixedBar ul li a i{display: inline-block;width: 20px;height: 20px;vertical-align: middle;background: url("../images/sprite.png") no-repeat}
.fixedBar ul li a i{*display: inline}
.fixedBar ul li a.qq i{background-position: -459px -1546px}
.fixedBar ul li a.phone i{background-position: -457px -1513px}


/*动画*/.topGroup .actTime{-webkit-animation:bounceInDown 1s 2.5s ease both;-moz-animation:bounceInDown 1s 2.5s ease both;}
.topGroup .bigtext2{-webkit-animation:bounceInRight 1s 1.8s ease both;-moz-animation:bounceInRight 1s 1.8s ease both;}
.topGroup .bigtext1{-webkit-animation:bounceInLeft 1s 1.2s ease both;-moz-animation:bounceInLeft 1s 1.2s ease both;}
.topGroup .bigtext0{-webkit-animation:zoomInDown 1s .2s ease both;-moz-animation:zoomInDown 1s .2s ease both;-ms-animation:zoomInDown 1s .2s ease both;animation:zoomInDown 1s .2s ease both;}
.topGroup .stage{-webkit-animation:zoomInDown 1s 3s ease both;-moz-animation:zoomInDown 1s 3s ease both;-ms-animation:zoomInDown 1s 3s ease both;animation:zoomInDown 1s 3s ease both;}
.topGroup .movie{-webkit-animation:lt300 1s 6s ease both;-moz-animation:lt300 1s 6s ease both;-ms-animation:lt300 1s 6s ease both;animation:lt300 1s 6s ease both;}
.topGroup .glasee{-webkit-animation:rt300 1s 6s ease both;-moz-animation:rt300 1s 6s ease both;-ms-animation:rt300 1s 6s ease both;animation:rt300 1s 6s ease both;}
.topGroup .countdown{-webkit-animation:zoomIn 1s 3.5s ease both;-moz-animation:zoomIn 1s 3.5s ease both;-ms-animation:zoomIn 1s 3.5s ease both;animation:zoomIn 1s 3.5s ease both;}
.actTop .topTip{-webkit-animation:tada 1s .2s ease both infinite;-moz-animation:tada 1s .2s ease both infinite;-ms-animation:tada 1s .2s ease both infinite;animation:tada 1s .2s ease both infinite;}
.stage .items ul li{-webkit-animation:bounceInLeft 2s ease both;-moz-animation:bounceInLeft 2s ease both;-ms-animation:bounceInLeft 1s ease both;animation:bounceInLeft 1s ease both;}
.stage .items ul li.i7{animation-delay:3.5s;-webkit-animation-delay:3.5s;-moz-animation-delay:3.5s;-ms-animation-delay:3.5s;}
.stage .items ul li.i6{animation-delay:3.8s;-webkit-animation-delay:3.8s;-moz-animation-delay:3.8s;-ms-animation-delay:3.8s;}
.stage .items ul li.i5{animation-delay:4.1s;-webkit-animation-delay:4.1s;-moz-animation-delay:4.1s;-ms-animation-delay:4.1s;}
.stage .items ul li.i4{animation-delay:4.4s;-webkit-animation-delay:4.4s;-moz-animation-delay:4.4s;-ms-animation-delay:4.4s;}
.stage .items ul li.i3{animation-delay:4.7s;-webkit-animation-delay:4.7s;-moz-animation-delay:4.7s;-ms-animation-delay:4.7s;}
.stage .items ul li.i2{animation-delay:5s;-webkit-animation-delay:5s;-moz-animation-delay:5s;-ms-animation-delay:5s;}
.stage .items ul li.i1{animation-delay:5.3s;-webkit-animation-delay:5.3s;-moz-animation-delay:5.3s;-ms-animation-delay:5.3s;}
.stage .items ul li.i0{animation-delay:5.6s;-webkit-animation-delay:5.6s;-moz-animation-delay:5.6s;-ms-animation-delay:5.6s;}
.stage .items ul li i{transition:all 0.6s ease;-webkit-transition:all 0.6s ease;-moz-transition:all 0.6s ease;-ms-transition:all 0.6s ease;}
.stage .items ul li:hover i{-webkit-transform: scale(1.2);-moz-transform: scale(1.2);-ms-transform: scale(1.2);transform: scale(1.2)}
.animate .title{-webkit-animation:sl05 1s .2s ease both;-moz-animation:sl05 1s .2s ease both;-ms-animation:sl05 1s .2s ease both;animation:sl05 1s .2s ease both;}
.animate .tabMod{-webkit-animation:zoomIn 2s .4s ease both;-moz-animation:zoomIn 2s .4s ease both;-ms-animation:zoomIn 2s .4s ease both;animation:zoomIn 2s .4s ease both;}
.animate .oldAndNew{-webkit-animation:bounceInUp 2s .4s ease both;-moz-animation:bounceInUp 2s .4s ease both;-ms-animation:bounceInUp 2s .4s ease both;animation:bounceInUp 2s .4s ease both;}
.animate .game{-webkit-animation:dn50 2s .4s ease both;-moz-animation:dn50 2s .4s ease both;-ms-animation:dn50 2s .4s ease both;animation:dn50 2s .4s ease both;}
.animate .oldAndNew .cell li{-webkit-animation:bounceInDown 1s ease both;-moz-animation:bounceInDown 1s ease both;-ms-animation:bounceInDown 1s ease both;animation:bounceInDown 1s ease both;}
.animate .oldAndNew .cell li:nth-child(1){animation-delay:1.4s;-webkit-animation-delay:1.4s;-moz-animation-delay:1.4s;-ms-animation-delay:1.4s;}
.animate .oldAndNew .cell li:nth-child(2){animation-delay:1.5s;-webkit-animation-delay:1.5s;-moz-animation-delay:1.5s;-ms-animation-delay:1.5s;}
.animate .oldAndNew .cell li:nth-child(3){animation-delay:1.6s;-webkit-animation-delay:1.6s;-moz-animation-delay:1.6s;-ms-animation-delay:1.6s;}
.animate .oldAndNew .cell li:nth-child(4){animation-delay:1.7s;-webkit-animation-delay:1.7s;-moz-animation-delay:1.7s;-ms-animation-delay:1.7s;}
.animate .oldAndNew .cell li:nth-child(5){animation-delay:1.8s;-webkit-animation-delay:1.8s;-moz-animation-delay:1.8s;-ms-animation-delay:1.8s;}
.floor3 .game .rightPart .man{-webkit-animation:swing 1s .2s ease both infinite;-moz-animation:swing 1s .2s ease both infinite;}
.floor3 .game .reminder{-webkit-animation:tada 3s .2s ease both;-moz-animation:tada 3s .2s ease both;}
.animate .wxDesc{-webkit-animation:flipInY 2s .4s ease both;-moz-animation:flipInY 2s .4s ease both;-ms-animation:flipInY 2s .4s ease both;animation:flipInY 2s .4s ease both;}
.animate .wxDesc .leftPart p{-webkit-animation:swing 2s 1s ease both;-moz-animation:swing 2s 1s ease both;-ms-animation:swing 2s 1s ease both;animation:swing 2s 1s ease both;}
.floor4 .wxDesc .rightPart p{-webkit-animation:fadeInDown 2s 3s ease both;-moz-animation:fadeInDown 2s 3s ease both;-ms-animation:fadeInDown 2s 3s ease both;animation:fadeInDown 2s 3s ease both;}
.animate .rects .redRect{-webkit-animation:lt300 2s 1s ease both;-moz-animation:lt300 2s 1s ease both;-ms-animation:lt300 2s 1s ease both;animation:lt300 2s 1s ease both;}
.animate .rects .blueRect{-webkit-animation:rt300 2s 1s ease both;-moz-animation:rt300 2s 1s ease both;-ms-animation:rt300 2s 1s ease both;animation:rt300 2s 1s ease both;}
.animate .rects .yellowRect{-webkit-animation:up90 2s 1.5s ease both;-moz-animation:up90 2s 1.5s ease both;-ms-animation:up90 2s 1.5s ease both;animation:up90 2s 1.5s ease both;}
@-webkit-keyframes bounceInUp{0%{opacity: 0;-webkit-transform: translateY(2000px);}
    60%{opacity: 1;-webkit-transform: translateY(-30px);}
    80%{-webkit-transform: translateY(10px);}
    100%{-webkit-transform: translateY(0);}}
@-moz-keyframes bounceInUp{0%{opacity: 0;-moz-transform: translateY(2000px);}
    60%{opacity: 1;-moz-transform: translateY(-30px);}
    80%{-moz-transform: translateY(10px);}
    100%{-moz-transform: translateY(0);}}
@-o-keyframes bounceInUp{0%{opacity: 0;-o-transform: translateY(2000px);}
    60%{opacity: 1;-o-transform: translateY(-30px);}
    80%{-o-transform: translateY(10px);}
    100%{-o-transform: translateY(0);}}
@keyframes bounceInUp{0%{opacity: 0;transform: translateY(2000px);}
    60%{opacity: 1;transform: translateY(-30px);}
    80%{transform: translateY(10px);}
    100%{transform: translateY(0);}}
@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translateY(-20px)}
    100%{opacity:1;-webkit-transform:translateY(0)}}
@-moz-keyframes fadeInDown{0%{opacity:0;-moz-transform:translateY(-20px)}
    100%{opacity:1;-moz-transform:translateY(0)}}
@-webkit-keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);opacity:0}
    40%{-webkit-transform:perspective(400px) rotateY(-10deg)}
    70%{-webkit-transform:perspective(400px) rotateY(10deg)}
    100%{-webkit-transform:perspective(400px) rotateY(0deg);opacity:1}}
@-moz-keyframes flipInY{0%{-moz-transform:perspective(400px) rotateY(90deg);opacity:0}
    40%{-moz-transform:perspective(400px) rotateY(-10deg)}
    70%{-moz-transform:perspective(400px) rotateY(10deg)}
    100%{-moz-transform:perspective(400px) rotateY(0deg);opacity:1}}
@-webkit-keyframes tada{0%{-webkit-transform:scale(1)}
    10%,20%{-webkit-transform:scale(0.9) rotate(-3deg)}
    30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg)}
    40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg)}
    100%{-webkit-transform:scale(1) rotate(0)}}
@-moz-keyframes tada{0%{-moz-transform:scale(1)}
    10%,20%{-moz-transform:scale(0.9) rotate(-3deg)}
    30%,50%,70%,90%{-moz-transform:scale(1.1) rotate(3deg)}
    40%,60%,80%{-moz-transform:scale(1.1) rotate(-3deg)}
    100%{-moz-transform:scale(1) rotate(0)}}
@-webkit-keyframes swing{20%,40%,60%,80%,100%{-webkit-transform-origin:top center}
    20%{-webkit-transform:rotate(15deg)}
    40%{-webkit-transform:rotate(-10deg)}
    60%{-webkit-transform:rotate(5deg)}
    80%{-webkit-transform:rotate(-5deg)}
    100%{-webkit-transform:rotate(0deg)}}
@-moz-keyframes swing{20%,40%,60%,80%,100%{-moz-transform-origin:top center}
    20%{-moz-transform:rotate(15deg)}
    40%{-moz-transform:rotate(-10deg)}
    60%{-moz-transform:rotate(5deg)}
    80%{-moz-transform:rotate(-5deg)}
    100%{-moz-transform:rotate(0deg)}}
@-webkit-keyframes bounceInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px)}
    60%{opacity:1;-webkit-transform:translateX(30px)}
    80%{-webkit-transform:translateX(-10px)}
    100%{-webkit-transform:translateX(0)}}
@-moz-keyframes bounceInLeft{0%{opacity:0;-moz-transform:translateX(-2000px)}
    60%{opacity:1;-moz-transform:translateX(30px)}
    80%{-moz-transform:translateX(-10px)}
    100%{-moz-transform:translateX(0)}}
@-webkit-keyframes tada{0%{-webkit-transform:scale(1)}
    10%,20%{-webkit-transform:scale(0.9) rotate(-3deg)}
    30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg)}
    40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg)}
    100%{-webkit-transform:scale(1) rotate(0)}}
@-moz-keyframes tada{0%{-moz-transform:scale(1)}
    10%,20%{-moz-transform:scale(0.9) rotate(-3deg)}
    30%,50%,70%,90%{-moz-transform:scale(1.1) rotate(3deg)}
    40%,60%,80%{-moz-transform:scale(1.1) rotate(-3deg)}
    100%{-moz-transform:scale(1) rotate(0)}}
@-webkit-keyframes zoomIn{0%{opacity: 0;-webkit-transform: scale3d(.3, .3, .3);transform: scale3d(.3, .3, .3);}
    50%{opacity: 1;}}
@keyframes zoomIn{0%{opacity: 0;-webkit-transform: scale3d(.3, .3, .3);transform: scale3d(.3, .3, .3);}
    50%{opacity: 1;}}
@-webkit-keyframes zoomInUp{0%{opacity: 0;-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);}
    60%{opacity: 1;-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);}}
@keyframes zoomInUp{0%{opacity: 0;-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);}
    60%{opacity: 1;-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);}}
@-webkit-keyframes zoomInDown{0%{opacity: 0;-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);}
    60%{opacity: 1;-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);}}
@keyframes zoomInDown{0%{opacity: 0;-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);}
    60%{opacity: 1;-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);}}
.zoomInDown{-webkit-animation-name: zoomInDown;animation-name: zoomInDown;}
@-webkit-keyframes zoomInLeft{0%{opacity: 0;-webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);}
    60%{opacity: 1;-webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);}}
@keyframes zoomInLeft{0%{opacity: 0;-webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);}
    60%{opacity: 1;-webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);}}
@-webkit-keyframes zoomInRight{0%{opacity: 0;-webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);}
    60%{opacity: 1;-webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);}}
@keyframes zoomInRight{0%{opacity: 0;-webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);}
    60%{opacity: 1;-webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);}}
.zoomInRight{-webkit-animation-name: zoomInRight;animation-name: zoomInRight;}
@-webkit-keyframes bounceInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px)}
    60%{opacity:1;-webkit-transform:translateX(30px)}
    80%{-webkit-transform:translateX(-10px)}
    100%{-webkit-transform:translateX(0)}}
@-moz-keyframes bounceInLeft{0%{opacity:0;-moz-transform:translateX(-2000px)}
    60%{opacity:1;-moz-transform:translateX(30px)}
    80%{-moz-transform:translateX(-10px)}
    100%{-moz-transform:translateX(0)}}
@-webkit-keyframes bounceInRight{0%{opacity:0;-webkit-transform:translateX(2000px)}
    60%{opacity:1;-webkit-transform:translateX(-30px)}
    80%{-webkit-transform:translateX(10px)}
    100%{-webkit-transform:translateX(0)}}
@-moz-keyframes bounceInRight{0%{opacity:0;-moz-transform:translateX(2000px)}
    60%{opacity:1;-moz-transform:translateX(-30px)}
    80%{-moz-transform:translateX(10px)}
    100%{-moz-transform:translateX(0)}}
@-webkit-keyframes bounceInDown{0%{opacity:0;-webkit-transform:translateY(-2000px)}
    60%{opacity:1;-webkit-transform:translateY(30px)}
    80%{-webkit-transform:translateY(-10px)}
    100%{-webkit-transform:translateY(0)}}
@-moz-keyframes bounceInDown{0%{opacity:0;-moz-transform:translateY(-2000px)}
    60%{opacity:1;-moz-transform:translateY(30px)}
    80%{-moz-transform:translateY(-10px)}
    100%{-moz-transform:translateY(0)}}
/***** 动画样式 *****//* 向上滑动*/@-webkit-keyframes up20{0%{opacity:0;-webkit-transform:translateY(20px);}
                               100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes up20{0%{opacity:0;-moz-transform:translateY(20px);}
    100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes up20{0%{opacity:0;transform:translateY(20px);}
    100%{opacity:1;transform:translateY(0);}}
@-webkit-keyframes up35{0%{opacity:0;-webkit-transform:translateY(35px);}
    100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes up35{0%{opacity:0;-moz-transform:translateY(35px);}
    100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes up35{0%{opacity:0;transform:translateY(35px);}
    100%{opacity:1;transform:translateY(0);}}
@-webkit-keyframes up70{0%{opacity:0;-webkit-transform:translateY(70px);}
    100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes up70{0%{opacity:0;-moz-transform:translateY(70px);}
    100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes up70{0%{opacity:0;transform:translateY(70px);}
    100%{opacity:1;transform:translateY(0);}}
@-webkit-keyframes up85{0%{opacity:0;-webkit-transform:translateY(85px);}
    100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes up85{0%{opacity:0;-moz-transform:translateY(85px);}
    100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes up85{0%{opacity:0;transform:translateY(85px);}
    100%{opacity:1;transform:translateY(0);}}
@-webkit-keyframes up90{0%{opacity:0;-webkit-transform:translate(200px,200px);}
    100%{opacity:1;-webkit-transform:translate(0,0);}}
@-moz-keyframes up90{0%{opacity:0;-moz-transform:translate(200px,200px);}
    100%{opacity:1;-moz-transform:translate(0,0);}}
@keyframes up90{0%{opacity:0;transform:translate(200px,200px);}
    100%{opacity:1;transform:translate(0,0);}}
.animate .up20{-webkit-animation:up20 1s .3s ease both;-moz-animation:up20 1s .3s ease both;animation:up20 1s .3s ease both;}
.animate .up21{-webkit-animation:up20 1s 1s ease both;-moz-animation:up20 1s 1s ease both;animation:up20 1s 1s ease both;}
.animate .up35{-webkit-animation:up35 1s .5s ease both;-moz-animation:up35 1s .5s ease both;animation:up35 1s .5s ease both;}
.animate .up36{-webkit-animation:up35 1s 1.5s ease both;-moz-animation:up35 1s 1.5s ease both;animation:up35 1s 1.5s ease both;}
.animate .up70{-webkit-animation:up70 1s .3s ease both;-moz-animation:up70 1s .3s ease both;animation:up70 1s .3s ease both;}
.animate .up71{-webkit-animation:up70 1s 1s ease both;-moz-animation:up70 1s 1s ease both;animation:up70 1s 1s ease both;}
.animate .up85{-webkit-animation:up85 1s .5s ease both;-moz-animation:up85 1s .5s ease both;animation:up85 1s .5s ease both;}
.animate .up86{-webkit-animation:up85 2s 1s ease both;-moz-animation:up85 2s 1s ease both;animation:up85 2s 1s ease both;}
.animate .up87{-webkit-animation:up85 2.5s 1s ease both;-moz-animation:up85 2.5s 1s ease both;animation:up85 2.5s 1s ease both;}
.animate .up88{-webkit-animation:up85 3s 1s ease both;-moz-animation:up85 3s 1s ease both;animation:up85 3s 1s ease both;}
.animate .up89{-webkit-animation:up85 3.5s 1s ease both;-moz-animation:up85 3.5s 1s ease both;animation:up85 3.5s 1s ease both;}
.animate .up90{-webkit-animation:up90 3.5s 1s ease both;-moz-animation:up90 3.5s 1s ease both;animation:up90 3.5s 1s ease both;}
/* 向下滑动*/@-webkit-keyframes dn30{0%{opacity:0;-webkit-transform:translateY(-20px);}
             100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes dn30{0%{opacity:0;-moz-transform:translateY(-20px);}
    100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes dn30{0%{opacity:0;transform:translateY(-20px);}
    100%{opacity:1;transform:translateY(0);}}
@-webkit-keyframes dn50{0%{opacity:0;-webkit-transform:translateY(-50px);}
    100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes dn50{0%{opacity:0;-moz-transform:translateY(-50px);}
    100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes dn50{0%{opacity:0;transform:translateY(-50px);}
    100%{opacity:1;transform:translateY(0);}}
.animate .dn30{-webkit-animation:dn30 1s .3s ease both;-moz-animation:dn30 1s .3s ease both;animation:dn30 1s .3s ease both;}
.animate .dn31{-webkit-animation:dn30 1s .6s ease both;-moz-animation:dn30 1s .6s ease both;animation:dn30 1s .6s ease both;}
.animate .dn50{-webkit-animation:dn50 2s 2s ease both;-moz-animation:dn50 2s 2s ease both;animation:dn50 2s 2s ease both;}
/* 向左滑动*/@-webkit-keyframes lt50{0%{opacity:0;-webkit-transform:translateX(50px);}
             100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes lt50{0%{opacity:0;-moz-transform:translateX(50px);}
    100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes lt50{0%{opacity:0;transform:translateX(50px);}
    100%{opacity:1;transform:translateY(0);}}
@-webkit-keyframes lt100{0%{opacity:0;-webkit-transform:translateX(100px);}
    100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes lt100{0%{opacity:0;-moz-transform:translateX(100px);}
    100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes lt100{0%{opacity:0;transform:translateX(100px);}
    100%{opacity:1;transform:translateY(0);}}
@-webkit-keyframes lt300{0%{opacity:0;-webkit-transform:translateX(300px);}
    100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes lt300{0%{opacity:0;-moz-transform:translateX(300px);}
    100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes lt300{0%{opacity:0;transform:translateX(300px);}
    100%{opacity:1;transform:translateY(0);}}
.animate .lt50{-webkit-animation:lt50 1s 1.5s ease both;-moz-animation:lt50 1s 1.5s ease both;animation:lt50 1s 1.5s ease both;}
.animate .lt51{-webkit-animation:lt50 1s .3s ease both;-moz-animation:lt50 1s .3s ease both;animation:lt50 1s .3s ease both;}
.animate .lt100{-webkit-animation:lt100 2s 1.5s ease both;-moz-animation:lt100 2s 1.5s ease both;animation:lt100 2s 1.5s ease both;}
.animate .lt101{-webkit-animation:lt100 2s 2s ease both;-moz-animation:lt100 2s 2s ease both;animation:lt100 2s 2s ease both;}
.animate .lt102{-webkit-animation:lt100 1s 1s ease both;-moz-animation:lt100 1s 1s ease both;animation:lt100 1s 1s ease both;}
.animate .lt103{-webkit-animation:lt100 1s 1.2s ease both;-moz-animation:lt100 1s 1.2s ease both;animation:lt100 1s 1.2s ease both;}
.animate .lt300{-webkit-animation:lt300 3s 1s ease both;-moz-animation:lt300 3s 1s ease both;animation:lt300 3s 1s ease both;}
/* 向右滑动*/@-webkit-keyframes rt50{0%{opacity:0;-webkit-transform:translateX(-50px);}
             100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes rt50{0%{opacity:0;-moz-transform:translateX(-50px);}
    100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes rt50{0%{opacity:0;transform:translateX(-50px);}
    100%{opacity:1;transform:translateY(0);}}
@-webkit-keyframes rt150{0%{opacity:0;-webkit-transform:translateX(-150px);}
    100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes rt150{0%{opacity:0;-moz-transform:translateX(-150px);}
    100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes rt150{0%{opacity:0;transform:translateX(-150px);}
    100%{opacity:1;transform:translateY(0);}}
@-webkit-keyframes rt300{0%{opacity:0;-webkit-transform:translateX(-300px);}
    100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes rt300{0%{opacity:0;-moz-transform:translateX(-300px);}
    100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes rt300{0%{opacity:0;transform:translateX(-300px);}
    100%{opacity:1;transform:translateY(0);}}
.animate .rt50{-webkit-animation:rt50 1s .3s ease both;-moz-animation:rt50 1s .3s ease both;animation:rt50 1s .3s ease both;}
.animate .rt150{-webkit-animation:rt150 1s 1s ease both;-moz-animation:rt150 1s 1s ease both;animation:rt150 1s 1s ease both;}
.animate .rt151{-webkit-animation:rt150 1s .5s ease both;-moz-animation:rt150 1s .5s ease both;animation:rt150 1s .5s ease both;}
.animate .rt152{-webkit-animation:rt150 1s .8s ease both;-moz-animation:rt150 1s .8s ease both;animation:rt150 1s .8s ease both;}
.animate .rt300{-webkit-animation:rt300 3s 1s ease both;-moz-animation:rt300 3s 1s ease both;animation:rt300 3s 1s ease both;}
/* 旋转抖动*/@-webkit-keyframes ro2{0%{-webkit-transform:rotate(0deg);}
             5%,15%,25%{-webkit-transform:rotate(-2deg);}
             10%,20%,30%{-webkit-transform:rotate(2deg);}
             35%{-webkit-transform:rotate(0deg);}}
@-moz-keyframes ro2{0%{-moz-transform:rotate(0deg);}
    5%,15%,25%{-moz-transform:rotate(-2deg);}
    10%,20%,30%{-moz-transform:rotate(2deg);}
    35%{-moz-transform:rotate(0deg);}}
@keyframes ro2{0%{transform:rotate(0deg);}
    5%,15%,25%{transform:rotate(-2deg);}
    10%,20%,30%{transform:rotate(2deg);}
    35%{transform:rotate(0deg);}}
.animate .ro2{-webkit-animation:ro2 1.5s .2s linear infinite;-moz-animation:ro2 1.5s .2s linear infinite;animation:ro2 1.5s .2s linear infinite;}
/* 伸缩*/@-webkit-keyframes sl05{0%{-webkit-transform:scale(0.5,0.5);}
           30%{-webkit-transform:scale(0.9,0.9);}
           60%{-webkit-transform:scale(0.5,0.5);}
           100%{-webkit-transform:scale(1,1);}}
@-moz-keyframes sl05{0%{-moz-transform:scale(0.5,0.5);}
    30%{-moz-transform:scale(0.9,0.9);}
    60%{-moz-transform:scale(0.5,0.5);}
    100%{-moz-transform:scale(1,1);}}
@keyframes sl05{0%{transform:scale(0.5,0.5);}
    30%{transform:scale(0.9,0.9);}
    60%{transform:scale(0.5,0.5);}
    100%{transform:scale(1,1);}}
.animate .sl05{-webkit-animation:sl05 1.5s .3s ease both;-moz-animation:sl05 1.5s .3s ease both;animation:sl05 1.5s .3s ease both;}
.irotateIn{transition: all .5s;-moz-transition: all .5s;-webkit-transition: all .5s;-o-transition: all .5s;-moz-transform: rotate(360deg);-webkit-transform: rotate(360deg);-o-transform: rotate(360deg);transform: rotate(360deg);}
.irotateOut{transition: all .5s;-moz-transition: all .5s;-webkit-transition: all .5s;-o-transition: all .5s;-moz-transform: rotate(-360deg);-webkit-transform: rotate(-360deg);-o-transform: rotate(-360deg);transform: rotate(-360deg);}
@keyframes flying{0%{margin-top: 0px;}
    50%{margin-top: 6px;}
    100%{margin-top: 0px;}}
@-webkit-keyframes flying{0%{margin-top: 0px;}
    50%{margin-top: 6px;}
    100%{margin-top: 0px;}}
@-moz-keyframes flying{0%{margin-top: 0px;}
    50%{margin-top: 6px;}
    100%{margin-top: 0px;}}
@-webkit-keyframes rotate{from{-webkit-transform:rotate(0deg)}
    to{-webkit-transform:rotate(360deg)}}
@-moz-keyframes rotate{from{-moz-transform:rotate(0deg)}
    to{-moz-transform:rotate(360deg)}}
@-ms-keyframes rotate{from{-ms-transform:rotate(0deg)}
    to{-ms-transform:rotate(360deg)}}
@-o-keyframes rotate{from{-o-transform:rotate(0deg)}
    to{-o-transform:rotate(360deg)}}
.rotate360{animation: 9.5s linear 0s normal none infinite rotate;-webkit-animation:9.5s linear 0s normal none infinite rotate;}
/***** 动画样式 结束 *****/