@charset "gb2312";
html, body{background: #fff;font-family: Microsoft YaHei, SimHei; /*padding: constant(safe-area-inset-bottom)(safe-area-inset-top)(safe-area-inset-left)(safe-area-inset-top);*/}
.top{position: absolute;width: 100%;height: .88rem;top: 0;left: 0;background-color: #fff;text-align: right;z-index: 999;box-shadow: 0 .05rem .15rem rgba(4, 31, 102, .5);}
.top.fixed{position: fixed;}
.top span{background: url("//img1.cache.jj.cn/myjj/index_201711/logo_top.png") no-repeat center;background-size: 1.36rem;display: inline-block;width: 1.36rem;height: 100%;margin-left: .27rem;float: left}
.top .link{background: url("//img1.cache.jj.cn/myjj/index_201711/btn_link.png?v=1130") no-repeat top;padding: 0 1px;float: right;background-size: 1.26rem 1.08rem;width: 1.26rem;height: .52rem;margin-top: .18rem;margin-right: .27rem;opacity: .7;}
.top .link:active{background-position: bottom;}
/*¾»Íø*/
/*.top{padding-top: 1.08rem;}*/
/*.top .banner{display: block;position: absolute;top: 0;left: 0;width: 100%;height: 1.08rem;overflow: hidden;text-align: center;}*/
/*.top .banner img{height: 100%;}*/
/*.main{padding-top: 1.08rem;}*/
.main{width: 7.2rem;max-width: 720px;margin: 0 auto;overflow: hidden}
.part_1{margin-top: -.3rem;width: 7.2rem;min-height: 13.1rem;position: relative;background: url("//img1.cache.jj.cn/myjj/index_201801/banner2.jpg") no-repeat center .3rem;background-size: 7.2rem}
.part_1 .light{width: 3.48rem;height: 4.28rem;position: absolute;right: 0;top: 0;background: url("//img1.cache.jj.cn/myjj/index_201711/light.png") no-repeat;background-size: 3.48rem 4.28rem}
.part_1 .light_anim{width: 7.2rem;height: 11.45rem;position: absolute;right: 0;top: 0;background: url("//img1.cache.jj.cn/myjj/index_201711/guang.png") no-repeat;background-size: 7.2rem 11.45rem}
.part_1 .gold_1{width: .9rem;height: .86rem;position: absolute;left: .1rem;top: 8.4rem;background: url("//img1.cache.jj.cn/myjj/index_201711/gold1.png") no-repeat;background-size: .9rem .86rem}
.part_1 .gold_2{width: 1.07rem;height: 1.39rem;position: absolute;right: 0;top: 2.4rem;background: url("//img1.cache.jj.cn/myjj/index_201711/gold2.png") no-repeat;background-size: 1.07rem 1.39rem}
.part_1 .pai_1{width: 6.13rem;height: 2.78rem;position: absolute;right: 1.1rem;top: .45rem;background: url("//img1.cache.jj.cn/myjj/index_201711/pai1.png") no-repeat top right;background-size: 100% 100%}
.part_1 .pai_2{width: 6.32rem;height: 4.19rem;position: absolute;right: .25rem;top: 1.3rem;background: url("//img1.cache.jj.cn/myjj/index_201711/pai2.png") no-repeat top right;background-size: 100% 100%}
.part_1 .farmer{width: 2.33rem;height: 3.91rem;position: absolute;right: 1.25rem;top: 1.4rem;background: url("//img1.cache.jj.cn/myjj/index_201711/farmer.png") no-repeat top right;background-size: 100% 100%}
.part_1 .fire_dom{width: 1.9rem;height: 4.01rem;position: absolute;left: 0;top: 3.4rem;background: url("//img1.cache.jj.cn/myjj/index_201711/zhadan_00.png") no-repeat;background-size: 1.9rem 4.01rem;}
.part_1 .people_box{width: 7.2rem;height: 7.2rem;position: absolute;right: 0;bottom: .7rem;}
.part_1 .pai_3{width: 5.97rem;height: 3.88rem;position: absolute;left: .3rem;bottom: 0;background: url("//img1.cache.jj.cn/myjj/index_201711/pai3.png") no-repeat left bottom;background-size: 5.97rem}
.part_1 .people{width: 8.66rem;height: 8.47rem;position: absolute;right: 0;top: -1rem;background: url("//img1.cache.jj.cn/myjj/index_201801/people.png") no-repeat;background-size: 8.66rem}
.part_2{position: relative;width: 7.2rem;min-height: 11.27rem;margin-top: -5.6rem;background: url("//img1.cache.jj.cn/myjj/index_201711/bg_index.png") no-repeat center top;background-size: 7.2rem;padding-top: 4.95rem}
.part_2 .list{width: 100%;position: absolute;left: 0}
.part_2 .list a{position: absolute;width: 100%;height: 100%;left: 0;top: 0;display: none}
.part_2 .list_01{top: 3.95rem;height: 7.17rem}
.part_2 .list_01 .balloon{opacity: 0;width: 1.91rem;height: 1.35rem;background: url("//img1.cache.jj.cn/myjj/index_201711/balloon.png") no-repeat left bottom;background-size: 1.91rem 1.35rem;position: absolute;bottom: 4.6rem;left: .5rem}
.part_2 .list_01 .gift_1{opacity: 0;width: 1.31rem;height: 1.61rem;background: url("//img1.cache.jj.cn/myjj/index_201711/gift1.png") no-repeat right bottom;background-size: 0% 0%;position: absolute;bottom: 5.45rem;right: 1.8rem}
.part_2 .list_01 .gift_2{opacity: 0;width: .83rem;height: .8rem;background: url("//img1.cache.jj.cn/myjj/index_201711/gift2.png") no-repeat left bottom;background-size: 0% 0%;position: absolute;bottom: 5.95rem;left: 5.95rem}
.part_2 .list_01 .box{width: 7.2rem;height: 4.47rem;position: absolute;top: 1rem;padding-top: 1.7rem;background: url("//img1.cache.jj.cn/myjj/index_201711/bg_gift.png?v=1129") no-repeat center top;background-size: 7.2rem 6.17rem}
.part_2 .list_01 .box img{width: 6.43rem;margin-left: .35rem}
.part_2 .list_02{top: 10rem;height: 6.22rem}
.part_2 .list_02 .shark{width: 2.6rem;height: 2.18rem;background: url("//img1.cache.jj.cn/myjj/index_201711/shark.png") no-repeat;background-size: 2.60rem 2.18rem;position: absolute;top: 1rem;right: .1rem;z-index: 1;}
.part_2 .list_02 .ball{width: .98rem;height: .92rem;background: url("//img1.cache.jj.cn/myjj/index_201711/ball.png") no-repeat;background-size: .98rem .92rem;position: absolute;top: .6rem;left: 2.15rem;z-index: 3;}
.part_2 .list_02 .box{width: 7.2rem;height: 5.45rem;position: absolute;top: .75rem;left: 0;background: url("//img1.cache.jj.cn/myjj/index_201711/bg_game.png") no-repeat center top;background-size: 7.2rem;z-index: 2;}
.part_2 .img_box{position: absolute;top: 3.1rem;left: .2rem;width: 6.8rem;height: 2rem;overflow: hidden;}
.part_2 .img_box ul{width: 18rem;height: 2rem;position: absolute;top: 0;left: -1.2rem;transition: all ease 1.5s;-webkit-transition: all ease 1.5s;-moz-transition: all ease 1.5s;-ms-transition: all ease 1.5s;-o-transition: all ease 1.5s;}
.part_2 .list_02 li{display: inline-block;width: 1.8rem;height: 2rem;position: relative;transition: all ease 1.5s;-webkit-transition: all ease 1.5s;-moz-transition: all ease 1.5s;-ms-transition: all ease 1.5s;-o-transition: all ease 1.5s;}
.part_2 .list_02 li.on{margin-left: -5.4rem;}
.part_2 .list_02 li img{width: 1.9rem;margin-left: -.05rem;}
footer{width: 100%;max-width: 720px;min-height: 3.4rem;margin: 0 auto;background: #fff}
footer ul{width: 6.7rem;border-top: 1px solid #ccc;margin: auto;padding-top: .52rem;text-align: center;}
footer li{display: inline-block;min-height: .43rem;text-align: left;}
footer .left{padding-left: .58rem;background: url("//img1.cache.jj.cn/myjj/index_201711/icon_wx.png") no-repeat left center;background-size: .43rem}
footer .right{padding-left: .58rem;background: url("//img1.cache.jj.cn/myjj/index_201711/icon_tel.png") no-repeat left center;background-size: .43rem}
footer .bottom{margin-top: .35rem;padding-left: 1.3rem;position: relative;}
footer .bottom img{width: 1.15rem;position: absolute;left: 0;top: 0;bottom: 0;margin: auto;}
footer li p{padding: .02rem 0 .07rem;font-size: .17rem;line-height: 1;color: #999}
footer li span{display: block;font-size: .18rem;line-height: 1;color: #999;padding-bottom: .02rem;}
footer li a{color: #999;line-height: 1;}
footer .bottom p{padding: .02rem 0 .12rem;}
footer .bottom{min-height: .5rem}
footer .bottom span{font-size: .17rem}
.fixed_pos{width: 100%; /*padding: constant(safe-area-inset-bottom)(safe-area-inset-right);*/height: 1.25rem;overflow: hidden;position: fixed;bottom: -1.25rem;left: 0;z-index: 100000;background-color: rgba(255, 255, 255, 0.85);vertical-align: middle}
.fixed_pos span{position: absolute;top: 0;left: 0;width: 4rem;height: 100%;background: url("//img1.cache.jj.cn/myjj/index_201711/icon_logo.png") no-repeat .3rem center, url("//img1.cache.jj.cn/myjj/index_201711/logo_bottom.png") no-repeat 1.3rem center;background-size: .77rem, 2.5rem;}
.fixed_pos button{width: 2.68rem;height: .83rem;position: absolute;z-index: 110000;margin: auto;top: .06rem;bottom: 0;background: url("//img1.cache.jj.cn/myjj/index_201711/btn_down.png?v=1129") no-repeat center top;background-size: 100% 200%;right: .3rem}
.fixed_pos button:active{background-position: bottom}
.fixed_anim{display: block;bottom: 0;transition: all ease .6s;-o-transition: all ease .6s;-ms-transition: all ease .6s;-moz-transition: all ease .6s;-webkit-transition: all ease .6s; /*animation:box_fixed .6s ease 1;-webkit-animation:box_fixed .6s ease 1;-ms-animation:box_fixed .6s ease 1;-o-animation:box_fixed .6s ease 1;*/-webkit-animation-play-state: initial}
@keyframes box_fixed{
  0%{bottom: -1.15rem}
  100%{bottom: 0}
}
@-webkit-keyframes box_fixed{
  0%{bottom: -1.15rem}
  100%{bottom: 0}
}
.part_1 .pai_1{animation: bg .4s linear 1, move_pai_1 2.5s linear infinite .4s;-webkit-animation: bg .4s linear 1, move_pai_1 2.5s linear infinite .4s;-ms-animation: bg .4s linear 1, move_pai_1 2.5s linear infinite .4s;-o-animation: bg .4s linear 1, move_pai_1 2.5s linear infinite .4s}
@keyframes move_pai_1{
  0%, 100%{top: .45rem;}
  50%{top: .4rem;}
}
@-webkit-keyframes move_pai_1{
  0%, 100%{top: .45rem;}
  50%{top: .4rem;}
}
.part_1 .pai_2{animation: bg .4s linear 1, move_pai_2 2.5s linear infinite .4s;-webkit-animation: bg .4s linear 1, move_pai_2 2.5s linear infinite .4s;-ms-animation: bg .4s linear 1, move_pai_2 2.5s linear infinite .4s;-o-animation: bg .4s linear 1, move_pai_2 2.5s linear infinite .4s}
@keyframes move_pai_2{
  0%, 100%{top: 1.3rem;}
  50%{top: 1.25rem;}
}
@-webkit-keyframes move_pai_2{
  0%, 100%{top: 1.3rem;}
  50%{top: 1.25rem;}
}
.part_1 .farmer{animation: bg .4s linear 1, move_farmer 2.5s linear infinite .4s;-webkit-animation: bg .4s linear 1, move_farmer 2.5s linear infinite .4s;-ms-animation: bg .4s linear 1, move_farmer 2.5s linear infinite .4s;-o-animation: bg .4s linear 1, move_farmer 2.5s linear infinite .4s}
@keyframes move_farmer{
  0%, 100%{top: 1.4rem;}
  50%{top: 1.5rem;}
}
@-webkit-keyframes move_farmer{
  0%, 100%{top: 1.4rem;}
  50%{top: 1.5rem;}
}
.part_1 .people_box{animation: move_people 3s linear infinite .4s;-webkit-animation: move_people 3s linear infinite .4s;-ms-animation: move_people 3s linear infinite .4s;-o-animation: move_people 3s linear infinite .4s}
.part_1 .people{animation: peop_in .4s linear 1;-webkit-animation: peop_in .4s linear 1;-ms-animation: peop_in .4s linear 1;-o-animation: peop_in .4s linear 1}
@keyframes peop_in{
  0%{transform: translate(0, -2rem);opacity: 0}
  100%{transform: translate(0, 0);opacity: 1}
}
@-webkit-keyframes peop_in{
  0%{transform: translate(0, -2rem);opacity: 0}
  100%{transform: translate(0, 0);opacity: 1}
}
@keyframes move_people{
  0%, 100%{right: 0;bottom: .7rem;}
  50%{right: -.1rem;bottom: .6rem;}
}
@-webkit-keyframes move_people{
  0%, 100%{right: 0;bottom: .7rem;}
  50%{right: -.1rem;bottom: .6rem;}
}
.part_1 .pai_3{animation: bg .35s linear 1;-webkit-animation: bg .35s linear 1;-ms-animation: bg .35s linear 1;-o-animation: bg .35s linear 1}
@keyframes move_pai_3{
  0%, 100%{left: .3rem;bottom: .7rem;}
  50%{left: .4rem;bottom: .63rem;}
}
@-webkit-keyframes move_pai_3{
  0%, 100%{left: .3rem;bottom: .7rem;}
  50%{left: .4rem;bottom: .63rem;}
}
.part_1 .fire_dom{animation: fire_in .4s linear 1, fire_rotate 2.5s linear infinite .4s, img_change 400ms step-start infinite;-webkit-animation: fire_in .4s linear 1, fire_rotate 2.5s linear infinite .4s, img_change 400ms step-start infinite;-ms-animation: fire_in .4s linear 1, fire_rotate 2.5s linear infinite .4s, img_change 400ms step-start infinite;-o-animation: fire_in .4s linear 1, fire_rotate 2.5s linear infinite .4s, img_change 400ms step-start infinite;}
@keyframes fire_in{
  0%{transform: rotate(-90deg);transform-origin: left bottom}
  100%{transform: rotate(0deg);transform-origin: left bottom}
}
@-webkit-keyframes fire_in{
  0%{transform: rotate(-90deg);transform-origin: left bottom}
  100%{transform: rotate(0deg);transform-origin: left bottom}
}
@keyframes fire_rotate{
  0%, 100%{-webkit-transform: rotate(0deg);-webkit-transform-origin: left top;}
  50%{-webkit-transform: rotate(3deg);-webkit-transform-origin: left top}
}
@-webkit-keyframes fire_rotate{
  0%, 100%{-webkit-transform: rotate(0deg);-webkit-transform-origin: left top;background-image: url("//img1.cache.jj.cn/myjj/index_201711/zhadan_00.png");}
  33.33%{background-image: url("//img1.cache.jj.cn/myjj/index_201711/zhadan_07.png");}
  66.66%{background-image: url("//img1.cache.jj.cn/myjj/index_201711/zhadan_13.png");}
  50%{-webkit-transform: rotate(3deg);-webkit-transform-origin: left top}
}
@keyframes fire_cut{
  0%, 100%{background-image: url("//img1.cache.jj.cn/myjj/index_201711/zhadan_00.png");}
  33.33%{background-image: url("//img1.cache.jj.cn/myjj/index_201711/zhadan_07.png");}
  66.66%{background-image: url("//img1.cache.jj.cn/myjj/index_201711/zhadan_13.png");}
}
@-webkit-keyframes fire_cut{
  0%, 100%{background-position: left;}
  33.33%{background-position: center;}
  66.66%{background-position: right;}
}
.part_1 .light_anim{animation: light_rotate 10s linear infinite .4s;-webkit-animation: light_rotate 10s linear infinite .4s;-ms-animation: light_rotate 10s linear infinite .4s;-o-animation: light_rotate 10s linear infinite .4s}
@keyframes light_rotate{
  0%, 100%{transform: rotate(0deg);transform-origin: right top}
  50%{transform: rotate(-50deg);transform-origin: right top}
}
@-webkit-keyframes light_rotate{
  0%, 100%{transform: rotate(0deg);transform-origin: right top}
  50%{transform: rotate(-50deg);transform-origin: right top}
}
@keyframes move{
  0%, 100%{transform: translate(0, 0)}
  50%{transform: translate(0, .05rem)}
}
@-webkit-keyframes move{
  0%, 100%{-webkit-transform: translate(0, 0)}
  50%{-webkit-transform: translate(0, .05rem)}
}
@keyframes img_change{
  0%{background-image: url(//img1.cache.jj.cn/myjj/index_201711/zhadan_00.png);}
  34%{background-image: url(//img1.cache.jj.cn/myjj/index_201711/zhadan_00.png);}
  67%{background-image: url(//img1.cache.jj.cn/myjj/index_201711/zhadan_07.png);}
  100%{background-image: url(//img1.cache.jj.cn/myjj/index_201711/zhadan_13.png);}
}
@keyframes move2{
  0%, 100%{transform: translate(0, 0)}
  50%{transform: translate(.1rem, 0)}
}
@-webkit-keyframes move2{
  0%, 100%{-webkit-transform: translate(0, 0)}
  50%{-webkit-transform: translate(.1rem, 0)}
}
@keyframes move3{
  0%, 100%{transform: translate(0, 0)}
  50%{transform: translate(.1rem, .05rem)}
}
@-webkit-keyframes move3{
  0%, 100%{-webkit-transform: translate(0, 0)}
  50%{-webkit-transform: translate(.1rem, .05rem)}
}
@keyframes bg{
  0%{background-size: 0 0;opacity: 1}
  100%{background-size: 100% 100%;opacity: 1}
}
@-webkit-keyframes bg{
  0%{background-size: 0 0;opacity: 1}
  100%{background-size: 100% 100%;opacity: 1}
}
@keyframes peop_rotate{
  0%, 100%{transform: rotate(0deg);transform-origin: left bottom}
  50%{transform: rotate(1deg);transform-origin: left bottom}
}
@-webkit-keyframes peop_rotate{
  0%, 100%{-webkit-transform: rotate(0deg);-webkit-transform-origin: left bottom}
  50%{-webkit-transform: rotate(1deg);-webkit-transform-origin: left bottom}
}
.part_2 a.anim_01,
.part_2 a.anim_02{display: block;animation: translateY 1s ease 1;-webkit-animation: translateY 1s ease 1;-ms-animation: translateY 1s ease 1;-o-animation: translateY 1s ease 1}
.part_2 a.other_show1 .balloon,
.part_2 a.other_show2 .gift_1,
.part_2 a.other_show2 .gift_2{opacity: 1;animation-fill-mode: forwards;-webkit-animation-fill-mode: forwards;}
.part_2 .anim_01 .balloon{animation: bg .4s ease 1 1s, bg2 2s ease infinite 1.4s;-webkit-animation: bg .4s ease 1 1s, bg2 2s ease infinite 1.4s;-ms-animation: bg .4s ease 1 1s, bg2 2s ease infinite 1.4s;-o-animation: bg .4s ease 1 1s, bg2 2s ease infinite 1.4s}
.part_2 .anim_01 .gift_1{animation: bg .4s linear 1 1.4s, move_gift_1 2s linear infinite 1.8s;-webkit-animation: bg .4s linear 1 1.4s, move_gift_1 2s linear infinite 1.8s;-ms-animation: bg .4s linear 1 1.4s, move_gift_1 2s linear infinite 1.8s;-o-animation: bg .4s linear 1 1.4s, move_gift_1 2s linear infinite 1.8s}
@keyframes move_gift_1{
  0%, 100%{bottom: 5.4rem;right: 1.8rem;background-size: 100% 100%;}
  50%{bottom: 5.35rem;right: 1.8rem;background-size: 100% 100%;}
}
@-webkit-keyframes move_gift_1{
  0%, 100%{bottom: 5.4rem;right: 1.8rem;background-size: 100% 100%;}
  50%{bottom: 5.35rem;right: 1.8rem;background-size: 100% 100%;}
}
.part_2 .anim_01 .gift_2{animation: bg .4s linear 1 1.6s, move_gift_2 2s linear infinite 2s;-webkit-animation: bg .4s linear 1 1.6s, move_gift_2 2s linear infinite 2s;-ms-animation: bg .4s linear 1 1.6s, move_gift_2 2s linear infinite 2s;-o-animation: bg .4s linear 1 1.6s, move_gift_2 2s linear infinite 2s}
@keyframes move_gift_2{
  0%, 100%{bottom: 5.95rem;left: 5.95rem;background-size: 100% 100%;}
  50%{bottom: 5.9rem;left: 5.95rem;background-size: 100% 100%;}
}
@-webkit-keyframes move_gift_2{
  0%, 100%{bottom: 5.95rem;left: 5.95rem;background-size: 100% 100%;}
  50%{bottom: 5.9rem;left: 5.95rem;background-size: 100% 100%;}
}
.part_2 .anim_02 .ball{animation: move_ball 2s linear infinite;-webkit-animation: move_ball 2s linear infinite;-ms-animation: move_ball 2s linear infinite;-o-animation: move_ball 2s linear infinite}
@keyframes move_ball{
  0%, 100%{top: .6rem;left: 2.15rem;}
  50%{top: .7rem;left: 2.15rem;}
}
@-webkit-keyframes move_ball{
  0%, 100%{top: .6rem;left: 2.15rem;}
  50%{top: .7rem;left: 2.15rem;}
}
.part_2 .anim_02 .shark{animation: move_shark 2.5s linear infinite;-webkit-animation: move_shark 2.5s linear infinite;-ms-animation: move_shark 2.5s linear infinite;-o-animation: move_shark 2.5s linear infinite}
@keyframes move_shark{
  0%, 100%{top: 1rem;right: .1rem;}
  50%{top: 1.1rem;right: .1rem;}
}
@-webkit-keyframes move_shark{
  0%, 100%{top: 1rem;right: .1rem;}
  50%{top: 1.1rem;right: .1rem;}
}
@-webkit-keyframes translateY{
  0%{-webkit-transform: translateY(4rem)}
  100%{-webkit-transform: translateY(0rem)}
}
@-moz-keyframes translateY{
  0%{-moz-transform: translateY(4rem)}
  100%{-moz-transform: translateY(0rem)}
}
@keyframes bg2{
  0%, 100%{background-size: 100% 100%}
  50%{background-size: 98% 98%}
}
@-webkit-keyframes bg2{
  0%, 100%{background-size: 100% 100%}
  50%{background-size: 98% 98%}
}
