body{background: #FFC55F;}
.backUp{position: fixed; line-height: 0; width: 42px; height: 42px; z-index: 1; bottom: 100px; right: 16px;}
.backUp img{width: 100%; height: 100%;}
.banner{line-height: 0; position: relative;}
.banner img{width: 100%;}
.banner .video{position: absolute; width: 96%; left: 2%; bottom: 2.5%; }
.banner .video .bg{width: 100%; position: relative; z-index: 2; }
.banner .video video{position: absolute; width: 89%; height: 73%; left: 5.5%; top: 18%; }
/* .banner .video video::-webkit-media-controls { display: none !important; } */
.content{line-height: 0; position: relative;}
.content .bg{width: 100%;}
.gamebox{position: absolute; width: 100%; top: 0; left: 0; }
.titles{display: flex; align-items: center; justify-content: center; }
.titles .item{width: 25.3%; margin: 0 3.6%;}
.titles .item img{width: 100%;}
.subtitle{display: flex; align-items: center; justify-content: center; margin-top: 8px; }
.subtitle .item{width: 25.3%; margin: 0 3.6%; }
.subtitle .item img{width: 100%;}
.gamebox .box{width: 95.5%; position: relative; margin: 20px auto 0; }
.gamebox .box ul{position: absolute; width: 100%; height: 100%; list-style: none; padding: 0; margin: 0; left: 0; top: 0; }
.gamebox .box ul li{width: 32.4%; position: absolute; }
.gamebox .box ul li img{width: 100%;}
.gamebox .box ul li:nth-child(1){ animation: move1 1.5s ease-in-out infinite; width: 18.1%; left: 18%; bottom: 20%; }
@keyframes move1 {
	0%{left: 16%; bottom: 10%;}
	50%{left: 18%; bottom: 22%;}
	100%{left: 16%; bottom: 10%;}
}
.gamebox .box ul li:nth-child(2){animation: move2 1.5s ease-in-out infinite; width: 21.7%; left: 46%; bottom: 18%; }
@keyframes move2 {
	0%{bottom: 10%;}
	50%{ bottom: 18%;}
	100%{ bottom: 10%;}
}
.gamebox .box ul li:nth-child(3){animation: move3 1s ease-in-out infinite; animation-delay: 0.5s; width: 24.8%; left: 39%; top: 14%; }
@keyframes move3 {
	0%{left: 39%; top: 16%;}
	50%{ left: 36%; top: 10%;}
	100%{ left: 39%; top: 16%;}
}
.gamebox .box ul li:nth-child(4){animation: move4 1.2s linear infinite; animation-delay: 0.3s; left: 26%; bottom: 10%; }
@keyframes move4 {
	0%{left: 26%; bottom: 10%;}
	50%{ left: 23%; bottom: 2%;}
	100%{ left: 26%; bottom: 10%;}
}
.gamebox .box ul li:nth-child(5){animation: move5 2s linear infinite; animation-delay: 0.2s;width: 26%; left: 21%; top: 18%; }
@keyframes move5 {
	0%{left: 21%; top: 18%;}
	50%{ left: 14%; top: 7%;}
	100%{ left: 21%; top: 18%;}
}
.gamebox .box ul li:nth-child(6){animation: move6 2s linear infinite; animation-delay: 0.5s;width: 23%; left: 60%; bottom: 14%; }
@keyframes move6 {
	0%{left: 63%; bottom: 16%;}
	50%{ left: 60%; bottom: 7%;}
	100%{ left: 63%; bottom: 16%;}
}
.gamebox .box ul li:nth-child(7){animation: move7 1.3s linear infinite; animation-delay: 0.3s;width: 25%; left: 57%; top: 16%; }
@keyframes move7 {
	0%{left: 57%; top: 19%;}
	50%{ left: 61%; top: 9%;}
	100%{ left: 57%; top: 19%;}
}
.gamebox .btns{display: flex; align-items: center; justify-content: center; }
.gamebox .btns button{background: none; margin: 0 6px; width: 22.7%; padding:0; border: none; }
.gamebox .btns button img{width: 100%;}
.gamebox .tipbox{margin: 8px auto 24px; padding: 30px 14% 34px 15%; width: 93%; background: url(../images/bg1.png) no-repeat center; background-size: 100% 100%;  }
.gamebox .tipbox p{font-size: 12px; line-height: 18px; color: #8C2621; text-align: center; }
.gamebox .tipbox h5{font-size: 12px; color: #8C2621;display: flex; align-items: center; justify-content: center;}
.gamebox .tipbox h5 button{background: none; margin-left: 10px; width: 60px; padding:0; border: none;}
.gamebox .tipbox h5 button img{width: 100%;}
.gamebox .footerbtns{display: flex; align-items: center; justify-content: center; }
.gamebox .footerbtns button{background: none; margin: 0 8px; width: 29%; padding:0; border: none; }
.gamebox .footerbtns button img{width: 100%;}
.shadow{position: fixed; background: rgba(0, 0, 0, 0.6); width: 100%; height: 100%; left: 0; top: 0; z-index: 9; }
.awardsAlert{position: fixed; width: 70%; z-index: 10; left: 15%; top: 15%; line-height: 0; }
.awardsAlert .bg{width:100%}
.awardsAlert .box{position: absolute; left: 0; height: 100%; top: 15%; }
.awardsAlert .box .list{ height: 77%; overflow-y: scroll; display: flex; justify-content: center; flex-wrap: wrap; }
.awardsAlert .box .list .item{width: 23%; margin: 0 2.3%; }
.awardsAlert .box .list .item .img{width: 100%;height: 16vw;display: flex; align-items: center; justify-content: center; background: #FFFFFF;border-radius: 4px;border: 1px solid #FFDA99;}
.awardsAlert .box .list .item .img img{max-width: 90%; max-height: 90%; }
.awardsAlert .box .list .item p{margin-top: 6px; text-align: center; color: #AB562D; font-size: 10px; line-height: 14px; height: 44px; margin-bottom: 0; }
.awardsAlert .box button{background: none; display: block; margin: 20% auto 0; width: 27%; padding:0; border: none;}
.awardsAlert .box button img{width: 100%;}
.getawardsAlert{position: fixed; background: url(../images/bg22.png) no-repeat center; background-size: 110% auto; z-index: 10; top: 0%; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.getawardsAlert .box{ width: 70%; margin: 0 auto; line-height: 0; }
.getawardsAlert .bg{width:100%}
.getawardsAlert .list{overflow-y: scroll; position: relative; margin-top: -26px; margin-bottom: -25px; display: flex; justify-content: center; flex-wrap: wrap; }
.getawardsAlert .list::before{display: block; z-index: 0; content: ''; top: 25px; position: absolute; width: 100%; height: calc(100% - 50px);background: url(../images/bgm1.png) repeat-y center; background-size: 100% auto; }
.getawardsAlert .box .list .item{width: 23%; position: relative; margin: 0 2.3%; }
.getawardsAlert .box .list .item .img{width: 100%;height: 16vw;display: flex; align-items: center; justify-content: center; background: #FFFFFF;border-radius: 4px;border: 1px solid #FFDA99;}
.getawardsAlert .box .list .item .img img{max-width: 90%; max-height: 90%; }
.getawardsAlert .box .list .item p{margin-top: 6px; text-align: center; color: #AB562D; font-size: 10px; line-height: 14px; height: 44px; margin-bottom: 0; }
.getawardsAlert button{background: none; display: block; margin: 20px auto 0; width: 27%; padding:0; border: none;}
.getawardsAlert button img{width: 100%;}
.fixRight{position: fixed; z-index: 3; right: 0; top: 15%; width: 13.4%; }
.fixRight img{width: 100%;}
.fixRight a{margin-bottom: 10px; display: block; line-height: 0; }
.myawardsAlert{position: fixed; z-index: 11; line-height: 0; width: 100%; left: 0; bottom: 0; }
.myawardsAlert .bg{width: 100%; }
.myawardsAlert  h4{position: absolute; text-align: left; width: 100%; box-sizing: border-box; padding: 0 25px; left: 0; top: 9.5%; font-size: 11px; color: #AB562D; font-weight: 400; margin-top: 0; margin-bottom: 0; }
.myawardsAlert  header{ position: absolute; padding: 0 16px; display: flex; align-items: center; font-size: 11px; color: #AB562D; height: 6%; left: 13px; top: 14%; width: calc(100% - 26px); background: url(../images/bg16.png) no-repeat center; background-size: 100% 100%;}
.myawardsAlert  header span{flex: 1;}
.myawardsAlert  header span:nth-last-child(1){flex: 2; text-align: right; }
.myawardsAlert  ul{list-style: none; height: 78.5%; overflow-y: scroll; width: calc(100% - 26px); left: 13px; top: 21.5%; position: absolute; padding: 0; margin: 0; }
.myawardsAlert  ul li{ display: flex; align-items: center; padding: 11px 16px; background: url(../images/bg17.png) no-repeat center;background-size: 100% 100%;border-radius: 16px; margin-bottom: 10px; }
.myawardsAlert  ul .time{flex: 2; font-size: 11px; line-height: 16px; color: #AB562D; }
.myawardsAlert  ul .count{flex: 1; font-size: 11px; line-height: 16px; color: #AB562D;}
.myawardsAlert  ul .list{flex: 4; overflow-x: scroll; }
.myawardsAlert  ul .imgs{display: flex; align-items: center; justify-content: flex-end; }
.myawardsAlert  ul .item{margin-right: 6px; width: 60px; }
.myawardsAlert  ul .img{ margin: 0 auto; width: 44px;height: 44px;background: #fff;border-radius: 8px;border: 1px solid #FFDA99; display: flex; align-items: center; justify-content: center; }
.myawardsAlert  ul .img img{max-width: 90%; max-height: 90%; }
.myawardsAlert  ul p{ margin-top: 5px; line-height: 10px; color: #AB562D; font-size: 10px; margin-bottom: 0; text-align: center; }
.supermanbox{ background: url(../images/bg18.png) no-repeat top center #FFC55F; background-size: 100% auto; }
.supermanbox .notice{width: calc(100% - 18px); padding: 18px 13px; box-sizing: border-box; margin: 10px auto; background: url(../images/bg21.png) no-repeat center; background-size: 100% 100%; }
.supermanbox .notice h4{ font-size: 12px; margin-top: 0; margin-bottom: 0; font-weight: 400; color: #AB562D; display: flex; align-items: center; justify-content: center; }
.supermanbox .notice .tip{ margin-top: 14px; line-height: 20px; padding: 15px; font-size: 12px; color: #AB562D; background: url(../images/bg25.png) no-repeat center; background-size: 100% 100%;}
.supermanbox .notice h4 span{width: 29px; height: 38px; margin-right: 2px; display: block; font-size: 20px; color: #FFF3B2; line-height: 38px; text-align: center; background: url(../images/bg19.png) no-repeat center; background-size: 100% 100%; }
.index_ranks{background: url(../images/bgt.png) no-repeat top center; background-size: 100% auto; width: calc(100% - 18px); margin: 8px auto 35px; padding: 20px 12px; border-radius: 20px;}
.index_ranks header{ font-size: 11px; color: #AB562D; text-align: center; display: flex; align-items: center; height: 26px;  background: url(../images/bg13.png) no-repeat center; background-size: 100% 100%; }
.index_ranks header span:nth-child(1){flex: 1.2;}
.index_ranks header span:nth-child(2){flex: 3;}
.index_ranks header span:nth-child(3){flex: 1.2;}
.index_ranks h6{text-align: center; font-size: 10px; line-height: 14px; color: #AB562D; margin-top: 14px; margin-bottom: 8px; }
.index_ranks ul{list-style: none; padding: 0 12px; margin: 0 -12px 0 -12px;background: url(../images/bgm.png) repeat-y top center; background-size: 100% auto; }
.index_ranks ul li{padding: 12px 0;font-size: 12px; text-align: center; color: #AB562D; display: flex; align-items: center; }
.index_ranks ul .num{flex: 1.2; display: flex; align-items: center; justify-content: center; }
.index_ranks ul .num img{width: 34px; height: 34px; }
.index_ranks ul .coin{flex: 1.2;font-size: 12px;}
.index_ranks ul li .user{ flex: 3; display: flex; align-items: center; }
.index_ranks ul li .user img{width: 44px;height: 44px; margin-right: 24px; border-radius: 50%; border: 1px solid #E71414;}
.index_ranks ul li:nth-last-child(1){ position: fixed; left: 0; bottom: 0; width: 100%; box-sizing: border-box; padding: 26px 21px 18px; background: url(../images/bg20.png) no-repeat center; background-size: 100% 100%;}
.index_ranks header span{display: flex; align-items: center; justify-content: center; position: relative; }
.index_ranks header span img{width: 12px; height: 12px; margin-left: 4px; }
.index_ranks header span .info{width: 180px; height: 84px; position: absolute; right: 0; top: 20px; }
.index_gifts{padding: 0 9px;}
.index_gifts section{ margin-top: 10px; background: url(../images/bg14.png) no-repeat center; background-size: 100% 100%; padding-bottom: 20px; padding-top: 60px; }
.index_gifts section.bg2{ background: url(../images/bg12.png) no-repeat center; background-size: 100% 100%; }
.index_gifts section h6{font-size: 11px; margin-top: 0; margin-bottom: 0; padding-bottom: 15px; line-height: 14px; color: #AB562D; text-align: center; }
.index_gifts section button{margin: 0 auto; display: block; background: none; width: 32%; border: none; padding: 0; }
.index_gifts section button img{width: 100%;}
.index_gifts section .list{display: flex; align-items: center; justify-content: center; }
.index_gifts section .list .item{width: 65px; margin: 0 12px; }
.index_gifts section .list .item .img{ display: flex; align-items: center; justify-content: center; width: 65px; height: 65px;background: #FFFFFF;border-radius: 4px;border: 1px solid #FFDA99; }
.index_gifts section .list .item .img img{max-width: 90%; max-height: 90%; }
.index_gifts section .list .item p{margin: 7px 0 12px; text-align: center; font-size: 10px; height: 28px; line-height: 14px; color: #AB562D; }
.awardsruleAlert{position: fixed; z-index: 10; width: 100%; bottom: 0; left: 0; }
.awardsruleAlert .box{position: relative; margin-top: 12px; line-height: 0; }
.awardsruleAlert .bg{width: 100%;}
.awardsruleAlert .content{position: absolute; width: 90%; height: 95%; overflow-y: scroll; left: 5%; top: 2%; }
.awardsruleAlert .content section{ padding: 32px 0px 0px; position: relative; margin-top: 20px; }
.awardsruleAlert .content section .title{position: absolute; font-size: 12px; color: #AB562D; width: 130px; height: 28px; text-align: center; line-height: 28px; top: -8px; left: 50%; margin-left: -65px; background: url(../images/titbg.png) no-repeat center; background-size: 100% 100%; }
.awardsruleAlert .content section .list{display: flex; justify-content: center; flex-wrap: wrap; }
.awardsruleAlert .content section .item{ width: 25%; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.awardsruleAlert .content section .item .img{width: 65px;height: 65px; display: flex; align-items: center; justify-content: center; background: #FFFFFF;border-radius: 4px;border: 1px solid #FFDA99;}
.awardsruleAlert .content section .item .img img{max-width: 90%; max-height: 90%; }
.awardsruleAlert .content section .item p{text-align: center; width: 65px; font-size: 10px; margin-top: 6px;height: 40px; margin-bottom: 0; line-height: 14px; color: #AB562D; }
.awardsruleAlert .rule{position: absolute; font-size: 11px; line-height: 22px; color: #AB562D; width: 86%; height: 92%; overflow-y: scroll; left: 7%; top: 8%;}
.awardsruleAlert .subtitle .item{width: 33%; margin: 0 6px; }

.welfarebox{position: absolute; width: 100%; top: 0; left: 0; }
.recharge{ padding: 60px 13px 18px; width: calc(100% - 18px); margin: 5px auto 0; background: url(../images/bg5.png) no-repeat center; background-size: 100% 100%; }
.recharge h6{font-size: 12px; margin-bottom: 0; line-height: 14px; color: #AB562D; text-align: center; }
.recharge h4{height: 32px; padding: 0 12px; font-weight: 400; font-size: 12px; color: #AB562D; display: flex; align-items: center; width: calc(100% - 26px); margin: 15px auto 10px; background: url(../images/bg10.png) no-repeat center; background-size: 100% 100%; }
.recharge h4 span:nth-child(2){margin-left: auto; text-align: right; width: 45%; border-left: 1px solid #FFDA99; }
.recharge .ad{line-height: 0;}
.recharge .ad img{width: 100%;}
.giftbox{padding: 55px 5px 30px; width: calc(100% - 18px); margin: 8px auto 0; background: url(../images/bg6.png) no-repeat center; background-size: 100% 100%;}
.giftbox .btns{ margin-top: 18px; display: flex; align-items: center; justify-content: center; }
.giftbox .btns button{background: none; margin: 0 12px; width: 26%; padding:0; border: none; }
.giftbox .btns button img{width: 100%;}
.giftbox h6{font-size: 12px; padding: 0 22px; margin-bottom: 0; line-height: 18px; color: #AB562D; text-align: center; }
.giftbox h4{height: 32px; position: relative; padding: 0 12px; font-weight: 400; font-size: 12px; color: #8C2621; display: flex; align-items: center; justify-content: center; margin: 16px auto 18px; }
.giftbox h4 button{background: none; margin-left: 6px; height: 28px; width: 60px; padding:0; border: none;}
.giftbox h4 button img{width: 100%; height: 100%; }
.giftbox h4 .leftbtn{position: absolute; left: 0; top: 0; height: 28px; }
.giftbox h4 .leftbtn img{height: 100%; width: auto; }
.giftbox h4 .rightbtn{position: absolute; right: 0; top: 0; height: 28px; }
.giftbox h4 .rightbtn img{height: 100%; width: auto; }
.giftbox .list{display: flex; align-items: center; justify-content: space-evenly; }
.giftbox .list .item{width: 30%; padding: 14px 10px 14px; background: url(../images/bg11.png) no-repeat center; background-size: 100% 100%; }
.giftbox .list .item.on{background: url(../images/bg7.png) no-repeat center; background-size: 100% 100%; }
.giftbox .list .item img{width: 100%;}
.giftbox .list .item p{margin-bottom: 0; text-align: center; margin-top: 8px; font-size: 12px; color: #AB562D; line-height: 18px; }
.giftboxAlert{position: fixed; width: 70%; z-index: 10; left: 15%; top: 15%; line-height: 0; }
.giftboxAlert .bg{width:100%}
.giftboxAlert .box{position: absolute; width: 100%; left: 0; height: 100%; top: 11%; }
.giftboxAlert .box .list{display: flex; justify-content: center; flex-wrap: wrap; }
.giftboxAlert .box .list .item{width: 23%; margin: 0 2.3%; }
.giftboxAlert .box .list .item .img{width: 100%;height: 16vw;display: flex; align-items: center; justify-content: center; background: #FFFFFF;border-radius: 4px;border: 1px solid #FFDA99;}
.giftboxAlert .box .list .item .img img{max-width: 90%; max-height: 90%; }
.giftboxAlert .box .list .item p{margin-top: 6px; text-align: center; color: #AB562D; font-size: 10px; line-height: 14px; height: 44px; margin-bottom: 0; }
.giftboxAlert .box button{background: none; display: block; margin: 20% auto 0; width: 27%; padding:0; border: none;}
.giftboxAlert .box button img{width: 100%;}
.giftboxAlert header{text-align: center; margin-bottom: 10px; font-size: 12px; color: #AB562D; line-height: 28px; background: url(../images/titbg.png) no-repeat center; background-size: auto 100%; height: 28px; }