﻿html,body{width:100%;overflow-x: hidden;margin: 0;padding: 0;font-size:28px;font-family:"微软雅黑";background-color:transparent;}
a{text-decoration:none;}
ul,li{list-style:none;padding:0;margin:0;}
.center{margin:0 auto;position:relative;}
.abs_center{position:absolute;left: 50%;transform: translateX(-50%);-webkit-transform:translateX(-50%);}
.all_center{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);}
.win_bg{width:100%;height:100%;background-color:rgba(0,0,0,.95);position:fixed;top: 50%;left: 50%;transform: translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);} /*弹层黑色背景*/
[v-cloak] {display: none;}

/*滚动条统一样式*/
.scrollbar{overflow-x:hidden;scrollbar-track-color:none;}
.scrollbar::-webkit-scrollbar{width:4px;background-color:transparent;} /*滚动条整体部分*/
.scrollbar::-webkit-scrollbar-track{border-radius:2px;-webkit-box-shadow: inset 0 0 0 rgba(0,0,0,0);background-color:transparent;display:none;} /* 滚动条的轨道*/
.scrollbar::-webkit-scrollbar-track-piece{background-color:transparent;display:none;}/* 滚动条的内层轨道*/
.scrollbar::-webkit-scrollbar-thumb{border-radius:2px;background: #8a2d2d;}/*滚动条里面的小方块，能向上向下移动（或往左往右移动，取决于是垂直滚动条还是水平滚动条）*/

.upin{width:555px;height:204px;background-image:url(../images/upin/upin_bg.png);}
.app .upin{width:5.55rem;height:2.04rem;background-size:100%;}


.main{width:19.20rem;height:44.71rem;background-image:url(../images/pc/bg.jpg);position:absolute;left:50%;transform:translateX(-50%);}


/*主导航*/
.menu_ul{font-size:0;text-align:center;position:absolute;width:100%;top: 13.09rem;}
.menu_ul li{display:inline-block;width:3.11rem;height:.80rem;line-height:.80rem;text-align:center;font-size:.32rem;margin:0 .37rem; font-family:"Adobe 黑体 Std";color:#8deaff;cursor:pointer; background-image:url(../images/pc/menu_bg.png);background-size:100%;background-position:center center;background-repeat:no-repeat;position:relative;}
.menu_ul li.on{background-image:url(../images/pc/menu_bg_on.png);background-size:100%;color:#ffecaa;}


/*头部*/
.tab_ul{font-size:0;text-align:center;position:absolute;width:100%;top: 28.68rem;}
.tab_ul li{display:inline-block;width:2.25rem;height:.82rem;line-height:.68rem;text-align:center;font-size:.26rem;margin:0 .3rem; font-family:"Adobe 黑体 Std";color:#fccd7e;cursor:pointer; background-image:url(../images/pc/tab_bg.png);background-size:100%;background-position:center center;background-repeat:no-repeat;position:relative;}
.tab_ul li.on{background-image:url(../images/pc/tab_bg_on.png);background-size:100%;color:#fffebc;}


/*排行榜*/
.rank{width:1130px;height:752px;display:inline-block;position:absolute;top:3015px;left:394px;}
.rank .box{width:100%;margin:auto;}
.rank span{color:#ffe6c6;font-family:"Adobe 黑体 Std";text-align:center;font-size:20px;}

.rank .list{height:620px;padding-bottom:30px;}
.rank .list li:nth-child(2n){background-color:rgba(47,18,4,.5);}

.rank .item{font-size:0;height:70px;line-height:70px;overflow:hidden;}
.rank .item.light{background-color:#f47452 !important;}
.rank .item span{height:100%;display:inline-block;font-size:20px;vertical-align:top;text-align:center;position:relative;overflow:hidden;}
.rank .item.unqualified>span{color:#6c5f4e !important;}
.rank .item .orderNum{width:180px;}
.rank .item .orderNum i{font-style:normal;}
.rank .item:nth-child(-n+3) .orderNum i{display:inline-block;width:34px;height:36px;font-size:0;background-repeat:no-repeat;background-position:center center;}
.rank li:nth-child(1) .orderNum i{background-image:url(../images/rank_1.png);}
.rank li:nth-child(2) .orderNum i{background-image:url(../images/rank_2.png);}
.rank li:nth-child(3) .orderNum i{background-image:url(../images/rank_3.png);}

.rank .item .nick{width:306px;text-align:left;text-indent:75px;}
.rank .item .nick .headimg{width:48px;height:48px;border-radius:50%;position:absolute;top:12px;left:20px;}
.rank .item .cno{width:212px;}
.rank .item .praise_num{width:196px;}
.rank .item .liveTime{width:220px;}

/*排行榜——标题*/
.rank .title{width:calc(100% - 8px);box-sizing:border-box; background-color: rgba(237,173,89,.8);margin:0;}
.rank .title span{font-size:24px;color:#fff1e0;}
.rank .title .nick{text-align:center;text-indent:0;}


/*排行榜——我的排行*/
.rank .mydata{height:70px;line-height:70px;background-color:#8a2d2d;}
.rank .mydata span{color:#ffe6c6;}
.rank .item.mydata span.orderNum{top:-1px;}
.rank .item.mydata span.orderNum i{display:inline-block;width:76px;height:71px;font-size:20px;color:#260c00; background-image:url(../images/pc/ordernum_bg.png);background-repeat:no-repeat;background-position:top center;background-size:100%;vertical-align:top;position:relative;top:-2px;}

/*导航样式切换*/
.user{background-image:url(../images/pc/bg_user.jpg);}
.user .tab_ul{top: 26.81rem;}
.user .rank{top:2839px;}
.user .rank .item .nick{width:3.56rem;}
.user .rank .item .cno{width:2.62rem;}
.user .rank .item .praise_num{width:2.46rem;}








.app .main{width:7.5rem;height:51.91rem;background-image:url(../images/app/bg.jpg);background-size:100%;}


/*主导航*/
.app .menu_ul{font-size:0;text-align:center;position:absolute;width:100%;top: 12.75rem;}
.app .menu_ul li{display:inline-block;width:3.11rem;height:.80rem;line-height:.80rem;text-align:center;font-size:.32rem;margin:0 .12rem; font-family:"Adobe 黑体 Std";color:#8deaff;cursor:pointer; background-image:url(../images/pc/menu_bg.png);background-size:100%;background-position:center center;background-repeat:no-repeat;position:relative;}
.app .menu_ul li.on{background-image:url(../images/pc/menu_bg_on.png);background-size:100%;color:#ffecaa;}


/*头部*/
.app .tab_ul{font-size:0;text-align:center;position:relative;width:100%;top: 34.83rem;}
.app .tab_ul li{display:inline-block;width:2.54rem;height:.92rem;line-height:.78rem;text-align:center;font-size:.29rem;margin:0 .35rem; font-family:"Adobe 黑体 Std";color:#fccd7e;cursor:pointer; background-image:url(../images/pc/tab_bg.png);background-size:100%;background-position:center center;background-repeat:no-repeat;position:relative;}
.app .tab_ul li.on{background-image:url(../images/pc/tab_bg_on.png);background-size:100%;color:#fffebc;}


/*排行榜*/
.app .rank{width:calc(6.86rem + 8px);height:8.89rem;top:36.42rem;left:.33rem;}

.app .rank .list{height:7.07rem;padding-bottom:.3rem;}

.app .rank .item{font-size:0;height:.8rem;line-height:.8rem;overflow:hidden;}
.app .rank .item span{font-size:.22rem;}
.app .rank .item .orderNum{width:.7rem;}
.app .rank .item:nth-child(-n+3) .orderNum i{width:.42rem;height:.44rem;background-size:100%;}

.app .rank .item .nick{width:2.3rem;text-indent:0.71rem;}
.app .rank .item .nick .headimg{width:.48rem;height:.48rem;top:.16rem;left:.1rem;}
.app .rank .item .cno{width:1.3rem;}
.app .rank .item .praise_num{width:1.35rem;}
.app .rank .item .liveTime{width:1.20rem;}

/*排行榜——标题*/
.app .rank .title{width:calc(100% - 8px);}
.app .rank .title span{font-size:.24rem;text-indent:0;}
.app .rank .title .nick{text-align:center;text-indent:0;}
.app .rank .title .liveTime{line-height: .3rem;padding-top: .1rem;box-sizing: border-box;}

/*排行榜——我的排行*/
.app .rank .mydata{width:calc(100% - 8px);margin:0;}
.app .rank .item.mydata span.orderNum i{width:.76rem;height:.81rem;font-size:.24rem; background-image:url(../images/app/ordernum_bg.png);}





.app .room{height:8.3rem;background-color: #fff;background-image: none;}
.pc .room{background-color:transparent;}

/*头部*/
.app .room .tab_ul{top: .36rem;}
.app .room .tab_ul li{width:1.54rem;height:.6rem;line-height:.6rem;font-size:.26rem;margin:0 .45rem;color:#333; background-image:none;}
.app .room .tab_ul li.on{background-image:none;border-radius:.3rem;background-color:#FEDB65;}



/*排行榜*/
.app .room .rank{width:calc(100% - 8px);height:100%;top:1.18rem;left:0;}

.app .room .rank .list{height:100%;padding-bottom:.2rem;box-sizing: border-box;}
.app .room .rank .list li:nth-child(2n){background-color:transparent;}

.app .room .rank .item{font-size:0;height:1.05rem;line-height:1.05rem;overflow:hidden;}
.app .room .rank .item span{font-size:.22rem;}
.app .room .rank .item .orderNum{width:.5rem;font-size:.4rem;line-height:.44rem;font-family:Bahnschrift;margin-left:.2rem;color:#333;}
.app .room .rank .item:nth-child(-n+3) .orderNum i{width:.42rem;height:.44rem;background-size:100%;background:none;font-size:.4rem;}
.app .room .rank li:nth-child(1) .orderNum i{color:#FF1515}
.app .room .rank li:nth-child(2) .orderNum i{color:#1CB4FF}
.app .room .rank li:nth-child(3) .orderNum i{color:#FF8D1C}

.app .room .rank .item .pic{width:1.11rem;}
.app .room .rank .item .pic .headimg{width:.76rem;height:.76rem;top:.16rem;left:0;border-radius:50%;position:relative;}

.app .room .rank .item .rightbox{width:4.8rem;display:inline-block;vertical-align:top;margin-left:.09rem;line-height:.48rem;}

.app .room .rank .item .rightbox .nick{display:inline;text-indent:0;color:#333;font-size:.32rem;}
.app .room .rank .item .rightbox .cno{width:1.8rem;color:#AFAFAF;font-size:.32rem;margin-left:.24rem;}
.app .room .rank .item .rightbox .praise_num{width:4.8rem;font-size:.28rem;color:#FF1787;text-align:left;}
.app .room .rank .item .rightbox .praise_num font{color:#9393A8;margin-right:.16rem;}

/*排行榜——标题*/
.app .room .rank .title{width:calc(100% - 8px);}
.app .room .rank .title span{font-size:.24rem;text-indent:0;}
.app .room .rank .title .nick{text-align:center;text-indent:0;}
.app .room .rank .title .liveTime{line-height: .3rem;padding-top: .1rem;box-sizing: border-box;}

/*排行榜——我的排行*/
.app .rank .mydata{width:calc(100% - 8px);margin:0;}
.app .rank .item.mydata span.orderNum i{width:.76rem;height:.81rem;font-size:.24rem; background-image:url(../images/app/ordernum_bg.png);}


/*导航样式切换*/
.app .user{background-image:url(../images/app/bg_user.jpg);}
.app .user .tab_ul{top: 33.18rem;}
.app .user .rank{top:34.76rem;}
.app .user .rank .item .nick{width:2.8rem;}
.app .user .rank .item .cno{width:1.8rem;}







