* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html,
body {
    width: 100%;
    background-color: #ffe557;
    overflow-x: hidden;
}

.header {
    width: 100%;
    height: .45rem;
    line-height: .45rem;
    background-color: #ffe610;
    color: #181818;
    font-size: .16rem;
    text-align: center;
    font-weight: 600;
    font-family: Arial, Helvetica, sans-serif;
}

.title {
    width: 100%;
    /* height: 5rem; */
    position: relative;
    /* background-color: skyblue; */
}

.title_container {
    position: absolute;
    height: .58rem;
    /* background-color: black; */
}

.banner {
    width: 2.56rem;
    height: .58rem;
    position: absolute;
    top: 0;
    left: .6rem;
    z-index: 9;
}

.cup {
    width: .37rem;
    height: .37rem;
    position: absolute;
    top: .04rem;
    left: 1.03rem;
    z-index: 99;
}

.word {
    font-size: .16rem;
    color: #fff;
    position: absolute;
    top: .11rem;
    left: 1.38rem;
    z-index: 99;
    font-weight: 600;
    height: .2rem;
    line-height: .2rem;
    width: 2rem;
    font-family: Arial, Helvetica, sans-serif;
}

.ranking {
    width: 3.5rem;
    height: 2.48rem;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 0.03rem 0.15rem 0px rgba(0, 0, 0, 0.06);
    border-radius: .1rem;
    position: absolute;
    top: .23rem;
    left: 50%;
    margin-left: -1.75rem;
    background-image: url('../images/used/bgi.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

.second {
    position: absolute;
    left: .15rem;
    bottom: .21rem;
}

.se_icon_small {
    width: 0.72rem;
    height: 0.72rem;
    border-radius: .15rem;
    position: absolute;
    bottom: .82rem;
    left: .22rem;
    z-index: 3;
}

.se_icon_small2 {
    width: 0.72rem;
    height: 0.72rem;
    border-radius: .15rem;
    position: absolute;
    bottom: .82rem;
    right: 0.18rem;
    z-index: 3;
}

.se_icon_big {
    widows: 0.9rem;
    height: 0.9rem;
    border-radius: .15rem;
    position: absolute;
    bottom: .99rem;
    left: .18rem;
    z-index: 3;
}

.rank_gameinfo {
    position: absolute;
    bottom: 0;
}

.rank_name {
    width: 1.05rem;
    height: .16rem;
    font-size: .13rem;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 500;
    color: rgba(255, 255, 255, 1);
    line-height: .16rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
}

.rank_left {
    position: absolute;
    bottom: .25rem;
    left: 0;
    text-align: center;
}

.rank_right {
    position: absolute;
    bottom: .25rem;
    right: -.06rem;
    text-align: center;
    z-index: 3;
}

.rank_players {
    width: 1.05rem;
    height: .17rem;
    font-size: .12rem;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.6);
    line-height: .17rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;

}

.rank_player_left {
    position: absolute;
    bottom: .08rem;
    left: 0;
    text-align: center;
}

.rank_player_right {
    position: absolute;
    bottom: .08rem;
    right: -.06rem;
    text-align: center;
    z-index: 3;
}

.rank_name_mid {
    width: 1.29rem;
    height: .16rem;
    font-size: .13rem;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 500;
    color: rgba(255, 255, 255, 1);
    line-height: .16rem;
    position: absolute;
    bottom: .33rem;
    left: 0;
    text-align: center;
    z-index: 2;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
}

.rank_players_mid {
    width: 1.29rem;
    height: .17rem;
    font-size: .12rem;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.6);
    line-height: .17rem;
    position: absolute;
    bottom: .17rem;
    left: 0;
    text-align: center;
    z-index: 2;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
}

.blue {
    width: 1.05rem;
    height: .89rem;
    position: absolute;
    bottom: 0;
}

.blue_cup {
    width: .36rem;
    /* height: .53rem; */
    position: absolute;
    bottom: 0.35rem;
    left: .36rem;
}

.first {
    position: absolute;
    left: 1.13rem;
    bottom: .21rem;
}

.orange {
    width: 1.29rem;
    height: 1.06rem;
    position: absolute;
    bottom: 0;
    z-index: 2;
}

.orange_cup {
    width: .36rem;
    /* height: .53rem; */
    position: absolute;
    bottom: 0.52rem;
    left: .46rem;
    z-index: 2;
}

.third {
    position: absolute;
    right: .2rem;
    bottom: .21rem;
}

.red {
    width: 1.06rem;
    height: .89rem;
    position: absolute;
    bottom: 0;
    right: -0.08rem;
    z-index: 1;
}

.red_cup {
    width: .36rem;
    /* height: .53rem; */
    position: absolute;
    bottom: 0.35rem;
    right: .32rem;
    z-index: 2;
}

/* 推荐游戏模块样式 */
.all_game {
    margin-top: 2.8rem;
    /* background-color: pink; */
}

.tab_container {
    width: 100%;
    height: .33rem;
    padding-left: .12rem;
    display: flex;
    align-items: center;
}

.tab_item {
    height: .19rem;
    font-size: .16rem;
    font-family: Arial, Helvetica, sans-serif;
    color: rgba(57, 57, 57, 1);
    line-height: .19rem;
    font-weight: 600;
    margin-right: .16rem;
}

.active {
    background-color: #fff;
    height: .33rem;
    box-shadow: 0px 0.03rem 0.15rem 0px rgba(0, 0, 0, 0.06);
    border-radius: .17rem;
    padding: .07rem .16rem;
}
/* .game{
    display: none;
} */
.all_game_container,
.cas_game_container,
.ac_game_container,
.rac_game_container,
.sp_game_container {
    margin-top: .13rem;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

.game_item {
    /* width: 1.11rem; */
    width: 32%;
    margin-right: 1%;
    margin-bottom: .12rem;
    padding-left: 1%;
    height: 1.46rem;
    border-radius: 10px;
    position: relative;
}

.game_pic {
    width: 100%;
}

.all_game_name {
    width: .96rem;
    height: .15rem;
    font-size: 0.13rem;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 400;
    color: rgba(255, 255, 255, 1);
    line-height: .15rem;
    position: absolute;
    left: .11rem;
    bottom: .18rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
}

.all_game_players {
    height: .1rem;
    font-size: .09rem;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.6);
    line-height: .1rem;
    position: absolute;
    left: .11rem;
    bottom: .03rem;
}
.selected{
    display: block;
}










/* .user_count {
    margin-top: .03rem;
    color: #000000;
    font-size: .1rem;
    text-align: center;
    height: .12rem;
    line-height: .12rem;
    font-family: Arial, Helvetica, sans-serif;
} */

body {
  max-width: 540px;
  margin: 0 auto;
}