/**
 * 首页样式
 * @author 鹿文学
 */
/* common */
.banner .swiper-slide {min-height:30vw;}
.tab-scroll .tabpanel .double-list .panel1 .item .iconbox {height:34.46vw;}
body{background:#FFF;}
/* header */
.header .caption{margin:0 22.5%;width:55%;}
.header .hbtn{width:22.5%;}
.header .logo span{text-align:left;}
.header .logo span img{margin-left:14.4%;}
.header .login{color:#fff;font-size:0.4rem;}
.header .login span{text-align:right;}
.header .login span i{margin-right:14.4%;padding:2% 12%;border:3px solid #fff;border-radius:8px;font-style:normal;}
.header .search{right:15%;width:0.66rem; margin-top: 0.12rem;}
.header .header_code{right:35%;width:0.66rem;}
.header .login~.search{right: 15%;}
.header .lb1 {width:10%;}
.header .lb2 {width:16%;margin-left:11%;}
.header .lb3 {width:17%;margin-left:29%;}
.header .serperate {width:2%;margin-left:26%;vertical-align:middle;}
.header .serperate span i {font-size:0.28rem;}
.header .lb2 span i,.header .lb3  span i,.header .serperate span i {margin-left:0;padding:0;border:none;}
.header .lb1 img {
    width: 0.9rem;
    height: 0.9rem;
    border-radius: 50%;}
.header .search img,.header .header_code img{width:0.66rem;display:block;}
.header .logo img{height:0.812rem;vertical-align:baseline;}
.header .down{font-size: 0.46rem;right:3%;width:0.8rem;color:#53aee5;}
.header .down .down_sub {height: 0.8rem;line-height:0.8rem;background:#fff;border-radius:0.08rem;text-align:center;margin:0 auto;display:block;}
.header .user_info{display:block;width:3rem;font-size: 0.46rem;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;line-height: 0.8rem;margin-left: 1.5rem;}
.header .enter{margin-top:0.1rem}
/* 下载入口 */
.down{width:100%;height:auto;overflow:hidden;}
.down-close-img{width: 0.5rem; margin: 0.65rem 0.1rem 0.25rem 0.3rem;float: left;}
.down-sign{float: left;margin: 0.15rem 0.4rem 0 0.35rem;height: 12.1vw;width: 12.1vw;position:relative;}
.down-sign-img{width:100%; position: relative; z-index: 2;}
.down-text{float:left;font-size: 0.5rem;margin: 0.3rem 0 0.2rem 0;color: #505050;font-weight:bold;}
.down-text-span{display:block;font-size:0.36rem;color:#666;padding-top: 0.1rem;font-weight:100;}
.down-btn{float:right;background:#d23e30;color:#ffffff;height:100%;font-size:0.4rem; padding: 0.65rem 0.35rem;}
.down-tab{display: table;position: absolute;top: 0;left: 0;background-color: #d1d1d1;height: 12.1vw;width: 12.1vw;z-index: 0;border-radius: 8px;font-size: 0.4rem;}
.down-tabcell {display: table-cell;vertical-align: middle;text-align: center;}
.down-tabcell-text {width: 100%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
/* banner */
.banner {width:100%;overflow:hidden;}
.banner .swiper-slide {width:100%;background:#E2E2E2;color:#BBBABA;max-height:480px;text-align:center;position:relative;overflow:hidden;display:block;} 
.banner .swiper-slide img{z-index:2;width:100%;border:none;position:relative;}
.banner .swiper-slide .font {font-size:1rem;}

/* recently play */
.recently-play{position:relative;padding:.26rem 0;width:100%;max-height:430px;background:#EDEDED;}
.recently-play .wrap{position:relative;height:100%;}
.recently-play-title{position:absolute;z-index:9;width:0.8rem;height:100%;color:#fff;font-size:0.42rem;}
.recently-play-title span{margin:74% 0;height:68.375%;}
.recently-play-title span i{border-top-right-radius:8px;border-bottom-right-radius:8px;background:#f70;text-align:center;font-style:normal;line-height:1.1;}

.play-scroll {position:relative;margin-left:0.83rem;height:100%;text-align:center;}
.play-scroll:after{position:absolute;top:0;left:-2px;z-index:20;display:block;width:3.9%;height:100%;background:#ededed;content:'';}
.play-scroll .item{
	margin-top:-1px;
	padding:1px 0;
	height:100%;
	}
/* .play-scroll .item{margin-top:-1px;margin-left:0.44rem;padding:1px 0;width:3.42rem;height:100%;background:#fff;} */
.play-scroll .item a{-webkit-tap-highlight-color:transparent;}
.play-scroll .item .icon{position:relative;display:block;overflow:hidden;margin:8.3% auto 8%;width:1.72rem;height:1.72rem;max-width:172px;max-height:172px;border-radius:0.4rem;background:#e2e2e2;color:#bbbaba;}
.play-scroll .item .icon img{position:relative;z-index:2;width:100%;height:100%;border-radius:0.4rem;}
.play-scroll .item .icon .font{font-size:0.36rem;}
.play-scroll .item .name{display:block;overflow:hidden;color:#333;text-overflow:ellipsis;white-space:nowrap;font-size:0.46rem;}
.play-scroll .item .butn{display:block;margin:5% auto 8%;width:1.64rem;height:0.66rem;line-height:0.66rem;text-align:center;border:3px solid #d23e30;border-radius:8px;color:#d23e30;font-size:0.4rem;}


/* recommend list */
.recommend-list{width:100%;background:#fff;}

.tab-scroll>div{width:100%;}
.tab-scroll .tabmenu {box-sizing:border-box;height:100%;border-bottom:2px solid #e7e7e7;overflow:hidden;clear:both;}
.tab-scroll .tabmenu .s-slide {margin-bottom:-2px;width:25%;height:1.46rem;border-bottom:8px solid transparent;text-align:center;font-size:0.48rem;float:left;}
.tab-scroll .tabmenu .s-slide.active {color:#d23e30;border-bottom-color:#d23e30;} 
.tab-scroll .tabmenu .s-slide a {position:relative;top:32%;}
.tab-scroll .tabmenu .s-slide a .circle{top:0;right:0;}

.tab-scroll .tabpanel>.s-slide {display:none;}


.tab-scroll .tabpanel .text-pic-list li{max-height:272px;}
.tab-scroll .tabpanel .text-pic-list .item{position:relative;margin:0 3.22%;height:100%;border-bottom:1px solid rgba(231,231,231,0.7);}
.tab-scroll .tabpanel .text-pic-list .iconbox{position:relative;float:left;display:block;overflow:hidden;margin:2.4% 5.6% 2.4% 0;width:1.82rem;height:1.82rem;max-width:182px;max-height:182px;border-radius:0.48rem;background:#e2e2e2;color:#bbbaba;font-size:0.36rem;}
.tab-scroll .tabpanel .text-pic-list .iconbox .icon{position:relative;z-index:2;width:100%;height:100%;}
.tab-scroll .tabpanel .text-pic-list .butnbox{float:right;width:22%;height:100%;max-width:180px;text-align:right;margin-top:3.4%;}
.tab-scroll .tabpanel .text-pic-list .butnbox .butn{border:3px solid #d23e30;border-radius:.08rem;color:#d23e30;font-size:0.4rem;width:1.6rem;height:0.88rem;display:inline-block;line-height:0.88rem;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box;}
.tab-scroll .tabpanel .text-pic-list .text{margin-right:22.5%;margin-left:19%;padding-top:1%;}
.tab-scroll .tabpanel .text-pic-list .text .title {height:1;overflow:hidden;font-size:0.88rem;}
.tab-scroll .tabpanel .text-pic-list .text .title_small{
	margin-top:0.4rem;
}
.tab-scroll .tabpanel .text-pic-list .text .title span{display:inline-block;margin-right:2%;}
.tab-scroll .tabpanel .text-pic-list .text .title span:last-child{margin-right:0;}
.tab-scroll .tabpanel .text-pic-list .text .title .name{
	display:inline-block;
	vertical-align:middle;
	color:#333;font-size:0.46rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding-right: 10px;}
.tab-scroll .tabpanel .text-pic-list .text .title .mark{
	display:inline-block;
	vertical-align:middle;
	margin-top:-1%;
	padding:0.5%;
	border:3px solid transparent;
	border-radius:8px;font-size:0.22rem;}
.tab-scroll .tabpanel .text-pic-list .text .title .gift-mark{border-color:#f70;color:#f70;}
.tab-scroll .tabpanel .text-pic-list .text .title .send-mark{border-color:#28cb60;color:#28cb60;}
.tab-scroll .tabpanel .text-pic-list .text .info{overflow:hidden;margin:0;color:#999;text-overflow:ellipsis;white-space:nowrap;font-size:0.36rem;}
.tab-scroll .tabpanel .text-pic-list .text .info .type{color:#d23e30;}
.tab-scroll .tabpanel .text-pic-list .text .info .description{position:relative;margin-left:6%;}
.tab-scroll .tabpanel .text-pic-list .text .info .description:before{position:absolute;top:21%;left:-.23rem;display:block;width:.04rem;height:65.38%;background:#e0e0e0;content:'';}


.tab-scroll .tabpanel .panel3  .text .title .name {width:100%;}

.tab-scroll .tabpanel .double-list .tab{margin:0.36rem 3.22% 0rem;}
.tab-scroll .tabpanel .double-list .tab li{float:left;width:50%;text-align:center;}
.tab-scroll .tabpanel .double-list .tab .btn{display:block;height:1.02rem;max-height:102px;border:3px solid #d23e30;color:#d23e30;font-size:0.48em;}
.tab-scroll .tabpanel .double-list .tab .btn .table{height:100%;}
.tab-scroll .tabpanel .double-list .tab li:first-child .btn{border-right:0;border-bottom-left-radius:8px;border-top-left-radius:8px;}
.tab-scroll .tabpanel .double-list .tab li:last-child .btn{border-left:0;border-top-right-radius:8px;border-bottom-right-radius:8px;}
.tab-scroll .tabpanel .double-list .tab .btn.active{background:#d23e30;color:#fff;}
.tab-scroll .tabpanel .double-list .tab .btn .icon{display:inline-block;margin-top:-1%;margin-right:0.3rem;width:0.62rem;height:0.62rem;max-width:62px;background-size:100% 100%;background-repeat:no-repeat;vertical-align:middle;}
.tab-scroll .tabpanel .double-list .tab .btn .icon-active{background-image:url(../images/activity_activity_not.png);}
.tab-scroll .tabpanel .double-list .tab .btn .icon-notice{background-image:url(../images/activity_notice_not.png);}
.tab-scroll .tabpanel .double-list .tab .btn .icon-open-yes{background-image:url(../images/service_opened_not.png);}
.tab-scroll .tabpanel .double-list .tab .btn .icon-open-no{background-image:url(../images/service_trailer_not.png);}
.tab-scroll .tabpanel .double-list .tab .btn.active .icon-active{background-image:url(../images/activity_activity_selected.png);}
.tab-scroll .tabpanel .double-list .tab .btn.active .icon-notice{background-image:url(../images/activity_notice_selected.png);}
.tab-scroll .tabpanel .double-list .tab .btn.active .icon-open-yes{background-image:url(../images/service_opened_selected.png);}
.tab-scroll .tabpanel .double-list .tab .btn.active .icon-open-no{background-image:url(../images/service_trailer_selected.png);}

.tab-scroll .tabpanel .double-list .panel1{background:#ededed;}
.tab-scroll .tabpanel .double-list .panel1 li{width:100%;max-height:676px;background:#fff;}
.tab-scroll .tabpanel .double-list .panel1 li~li{margin-top:.3rem;}
.tab-scroll .tabpanel .double-list .panel1 .item{margin:0 3.2%;padding-top:1px;height:100%;}
.tab-scroll .tabpanel .double-list .panel1 .item .iconbox{position:relative;display:block;overflow:hidden;margin-top:3.4%;max-height:428px;background:#e2e2e2;color:#bbbaba;text-align:center;}
.tab-scroll .tabpanel .double-list .panel1 .item .icon{position:relative;z-index:2;width:100%;}
.tab-scroll .tabpanel .double-list .panel1 .item .iconbox .font{font-size:0.72rem;}
.tab-scroll .tabpanel .double-list .panel1 .item .iconbox .status{position:absolute;right:0;bottom:0;z-index:4;display:block;width:2.12rem;height:0.72rem;border-top-left-radius:0.08rem;background:#f70;color:#fff;text-align:center;font-size:0.36rem;}
.tab-scroll .tabpanel .double-list .panel1 .item .iconbox .status img{margin-top:-3.5%;margin-right:5%;width:0.4rem;height:0.4rem;vertical-align:middle;}
.tab-scroll .tabpanel .double-list .panel1 .item .iconbox .status.soon{background:#28CB60;}
.tab-scroll .tabpanel .double-list .panel1 .item .iconbox .status.disabled{background:#9e9e9e;}
.tab-scroll .tabpanel .double-list .panel1 .item .title{overflow:hidden;margin:1.7% 0 .88%;color:#333;font-weight:normal;text-overflow:ellipsis;white-space:nowrap;font-size:0.46rem;}
.tab-scroll .tabpanel .double-list .panel1 .item .time{margin:0 0 1.95%;color:#999;font-size:0.4rem;}


.tab-scroll .tabpanel .double-list .panel2 {margin-top:.5rem;}
.tab-scroll .tabpanel .double-list .panel2 .item {margin:0 3.2%;border-bottom:1px solid #e7e7e7;position:relative;}
.tab-scroll .tabpanel .double-list .panel2 .title {font-size:0.42rem;margin:0.41rem 0 0.26rem;margin:0.2rem 0 0;height:.6rem;position:relative;font-weight:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.tab-scroll .tabpanel .double-list .panel2 .title:before {content:'';width:0.1rem;height:0.1rem;margin-right:0.2rem;background:#d23e30;border-radius:100%;}
.tab-scroll .tabpanel .double-list .panel2 .time {font-size:0.4rem;color:#999;margin:0 0 0.27rem 0;text-align:right;}
.tab-scroll .tabpanel .double-list .panel2 .time .icon {width:0.36rem;height:0.36rem;margin-right:0.2rem;}
.tab-scroll .tabpanel .double-list .panel2 .time .date {margin-right:0.36rem;}

.tab-scroll .tabpanel .panel3 {padding-top:0px;}
.tab-scroll .tabpanel .panel3 .iconbox {width:1.72rem;height:1.72rem;max-height:172px;max-width:172px;border-radius:0.4rem;font-size:0.36rem;}
.tab-scroll .tabpanel .panel3 .text {padding-top:0;}
.tab-scroll .tabpanel .panel3 .text .title .name{font-size:0.46rem;}
.tab-scroll .tabpanel .panel3 .text .info .server-icon {width:0.44rem;height:0.44rem;margin-right:0.12rem;vertical-align:middle;margin-top:-1%;}
.tab-scroll .tabpanel .panel3 .text .info .server-name {color:#d23e30;margin-right:.4rem;}

.tab-scroll .tabpanel .panel3 .butnbox .opening-btn {color:#FF3228;}
.tab-scroll .tabpanel .panel4 .butnbox{width:24%;max-width:200px;}
.tab-scroll .tabpanel .panel4 .butnbox .butn {width:auto;margin-right:0.2rem;border:none;text-align:right;line-height:1.45;margin-top:12%;}
.tab-scroll .tabpanel .panel4 .butnbox .butn .icon~span{font-size:0.36rem;color:#C0C0C0;display:block;}
.tab-scroll .tabpanel .panel4 .butnbox .butn .icon-notice-yes~span {color:#d23e30;}
.tab-scroll .tabpanel .panel4 .butnbox .butn .icon {width:0.66rem;height:0.66rem;background:url(../images/service_trailer_notice.png) no-repeat;background-size:100% 100%;display:inline-block;}
.tab-scroll .tabpanel .panel4 .butnbox .butn .icon-notice-yes {background-image:url(../images/service_trailer_notified.png);}

.s-slide .empty {padding-top:1.2rem;}


@media screen and (max-width:1200px) {
  .tab-scroll .tabpanel .double-list .panel1 li~li {margin-top:2.4%;}
}
@media screen and (max-width:660px) {
  .header .login span i {border-width:2px; border-radius:6px;}
  
  .recently-play-title span i,.tab-scroll .tabpanel .double-list .tab li:last-child .btn {border-top-right-radius:6px;border-bottom-right-radius:6px;}
  .tab-scroll .tabmenu .s-slide {border-bottom-width:6px;margin-top:-4px;}
  .play-scroll .item .butn , 
  .tab-scroll .tabpanel .text-pic-list .butnbox .butn,
  .tab-scroll .tabpanel .text-pic-list .text .title .mark {border-width:2px;border-radius:6px;}
  .tab-scroll .tabpanel .double-list .tab li:first-child .btn {border-top-left-radius:6px;border-bottom-left-radius:6px;}
  .tab-scroll .tabpanel .double-list .tab .btn{border-width:2px;}
}
@media screen and (max-width:540px) {
  .header .login span i {border-width:1px;border-radius:4px;}
  
  .recently-play-title span i,.tab-scroll .tabpanel .double-list .tab li:last-child .btn {border-top-right-radius:4px;border-bottom-right-radius:4px;}
  .tab-scroll .tabmenu {border-bottom-width:1px;}
  .tab-scroll .tabmenu .s-slide {border-bottom-width:4px;margin-top:-3px;}
  
  .play-scroll .item .butn,
  .tab-scroll .tabpanel .text-pic-list .butnbox .butn,.tab-scroll .tabpanel .text-pic-list .text .title .mark {border-width:1px;border-radius:4px;}
  
  .tab-scroll .tabpanel .double-list .tab li:first-child .btn {border-top-left-radius:4px;border-bottom-left-radius:4px;}
  .tab-scroll .tabpanel .double-list .tab .btn{border-width:1px;}
}
@media screen and (max-width:400px) {
  .tab-scroll .tabmenu .s-slide {border-bottom-width:2px;margin-top:-1px;}
}



.small_bg{
	background:url("../images/home_btn_small@3x.png") no-repeat center center;
	background-size:70% 70%;
}
.tab-scroll .tabpanel .text-pic-list .iconbox_small{
	border-radius:50%;
}
.tab-scroll .tabpanel .text-pic-list .text .title.z_title{
	padding:0;
	height:1.52rem;
	line-height:1.52rem;
}
.tab-scroll .tabpanel .text-pic-list .iconbox.iconbox_small{
	border-radius:50%;
}