body,html{background: url(../images/bg.png) no-repeat top center #050213; background-size: 100% auto; padding-bottom: 45px;}
.fiximg{line-height: 0;}
.fiximg img{width: 100%;}
.play{padding: 0 12px; margin-top: -30px;}
.play article{background: url(../images/line.png) repeat-y center; background-size: 100% auto; padding: 0 20px;}
.play article p{margin-bottom: 0; color: #7EE7FF; font-size: 13px; line-height: 23px;}
.marginTop_{margin-top: -2px;}
footer{background: url(../images/icon13.png) no-repeat bottom center; position: fixed; width: 100%; left: 0; bottom: 0px; background-size: 100% auto;}
footer .item{width: 25%; float: left;}
footer .item .after{display: none;}
footer .item img{width: 100%;}
footer .item.active .after{display: block;}
footer .item.active .before{display: none;}
.rank{background: url(../images/line.png) repeat-y center; background-size: 100% auto; padding: 0 10px;}
.rank header{display: flex; padding: 0 12%; justify-content: space-between;}
.rank header img{height: 42px;}
.rank span .after{display: none;}
.rank span.active .after{display: block;}
.rank span.active .before{display: none;}
.rank .title{display: flex; padding: 16px 12%; justify-content: space-between;}
.rank .title span{width: 64px;height: 24px; display: block; font-size: 12px; color: #7EE7FF; text-align: center; line-height: 24px; background: #003C4D;border-radius: 12px;border: 1px solid rgba(57, 255, 242, 0.6);}
.rank .title span.active{color: #6F0C0C;background: linear-gradient(180deg, #FFB700 0%, #FEE76A 100%);border: none;}
.rank .rank-title{display: flex; align-items: center; height: 24px; border-radius: 12px; color: #4EA2B5; font-size: 12px; line-height: 24px; background: #02303D;}
.rank .rank-title span{text-align: center;}
.rank .rank-title span:nth-child(1){flex: 2;}
.rank .rank-title span:nth-child(2){flex: 7;}
.rank .rank-title span:nth-child(3){flex: 3;}
.rank .rank-title span:nth-child(4){flex: 3;}
.rank ul{list-style: none; padding: 0; margin: 0;max-height: 630px; overflow-y: scroll;}
.rank ul li{display: flex; align-items: center;margin-top: 10px;height: 54px;background: #065268;border-radius: 16px;}
.rank ul li span{display: flex; align-items: center; justify-content: center; font-size: 12px; color: #fff;}
.rank ul li span:nth-child(1){flex: 2;font-size: 16px;width: 36px; height: 36px;}
.rank ul li span:nth-child(2){flex: 7; justify-content: flex-start; padding-left: 10px;}
.rank ul li span:nth-child(3){flex: 3;}
.rank ul li span:nth-child(4){flex: 3;}
.rank ul li span img{width: 30px; height: 30px; margin-right: 10px; border-radius: 50%;}
.rank ul li span em{font-style: normal;}
.rank ul li:nth-child(1) span:nth-child(1){background: url(../images/one.png) no-repeat center; background-size: 36px 36px;}
.rank ul li:nth-child(2) span:nth-child(1){background: url(../images/two.png) no-repeat center; background-size: 36px 36px;}
.rank ul li:nth-child(3) span:nth-child(1){background: url(../images/three.png) no-repeat center; background-size: 36px 36px;}
.rank ul.two li:nth-child(1) span:nth-child(1){background: url(../images/one2.png) no-repeat center; background-size: 36px 36px;}
.rank ul.two li:nth-child(2) span:nth-child(1){background: url(../images/two2.png) no-repeat center; background-size: 36px 36px;}
.rank ul.two li:nth-child(3) span:nth-child(1){background: url(../images/three2.png) no-repeat center; background-size: 36px 36px;}









