.index-bg{ background:#f4f4f4;}
.viewport-top{ padding:4rem 0 0; background:#f4f4f4;}
.tab-content>.tab-pane {
	display: none
}
.tab-content>.active {
	display: block
}
.fade {
	opacity: 0;
	-webkit-transition: opacity .15s linear;
	-o-transition: opacity .15s linear;
	transition: opacity .15s linear
}
.fade.in {
	opacity: 1
}
/*主播排行榜*/
.livecate {	top:0;left:0;z-index:2;	background:transparent; width:100%;}
.livecate ul{height:1.3rem;box-sizing:border-box;	will-change:transform;display:-webkit-box;display:-webkit-flex;	display:-ms-flexbox;display:flex;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-property:transform;	transition-property:transform;-webkit-transform:translateY(0rem);transform:translateY(0rem);background:#fff;}
.livecate-item{height:1.3rem;-webkit-box-flex:1;	-webkit-flex:1;	-ms-flex:1; flex:1;	text-align:center;line-height:1.3rem;font-size:0.34rem;position:relative;}
.livecate-item a{ color:#666666;}
.active a{ color:#ca63ff;}
.livecate li.active:after{content:" ";display:block;width:1rem;	height:3px;	border-radius:4px;background:#ca63ff;font-size:0;line-height:0;	position:absolute;left:50%;margin-left:-0.5rem;	bottom:0.3rem;}
.collapse{ display:block;}
.livecate.collapse ul{-webkit-transform: translateY(0);	transform: translateY(0);}

.top-type-wrapper{ padding-top:20px;}
.top-type-cate{ padding:0 20px 10px;}
.top-type-cate ul{ width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
.top-type-cate li{-webkit-box-flex:1;-moz-box-flex:1;-ms-flex:1; flex:1;}
.top-type-cate li a{ width:100%; height:0.8rem; display:block;border-color:#c9c9c9;border-style:solid;border-width:0.01rem 0.01rem 0.01rem 0.01rem; color:#666666; text-align:center; line-height:0.8rem;}
.top-type-cate li:first-of-type a{ border-width:1px;border-radius:5px 0 0 5px;}
.top-type-cate li:last-of-type a{ border-radius:0 5px 5px 0;}
.top-type-cate li a:hover{background-color:#ca63ff;border-color:#ca63ff;color:#fff;}
.top-type-cate li a:active,.top-type-cate li.active a{ background-color:#ca63ff; color:#fff; border-color:#ca63ff;}

.top-content{ padding-top:20px;}
.top-list{}
.top-list-item{ padding:0 0.4rem; border-bottom:1px solid #dddddd; height:2.4rem; line-height:2.4rem; font-size:0.3rem;}
.top-list-item a{ display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex; width:100%;}
.top-list-item:hover,.top-list-item:active{ background:#fff;}
.top-list-item section{ height:100%;}
.top-nmuber{ width:36px; margin-right:30px; text-align:center; font-family:Arial; color:#333333;}
.top-list-name{flex:1;-webkit-box-flex:1;-moz-box-flex:1;-ms-flex:1; text-align:left; color:#333333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.top-list-name span{ color:#999999; font-size:0.3rem;}
.top-list-img{ width:1rem; height:1rem; margin-right:0.3rem;margin-top:0.2rem;}
.top-list-img img{ width:1rem; height:1rem; border-radius:50%;}
.top-list-item:first-of-type,.top-list-item:nth-child(2),.top-list-item:nth-child(3){ height:1.4rem; line-height:1.4rem;}
.top-list-item:first-of-type .top-nmuber{ color:#fff;background-image: url(/public/static/images/mobile/ico_rand_first.png);background-size:50px 50px;background-position:center; background-repeat:no-repeat; width:50px; height:160px;}
.top-list-item:first-of-type .top-nmuber,.top-list-item:nth-child(2) .top-nmuber,.top-list-item:nth-child(3) .top-nmuber{ margin-right:0.3rem;}
.top-list-item:nth-child(2) .top-nmuber{ color:#df6eb9;}
.top-list-item:nth-child(3) .top-nmuber{ color:#ca63ff;}
.top-list-item:first-of-type .top-list-name{ color:#fb7c5c;}
.top-list-item:nth-child(2) .top-list-name{ color:#df6eb9;}
.top-list-item:nth-child(3) .top-list-name{ color:#ca63ff;}