body {
  background: #f6f6f6;
}
.wp1440 a img {
  transition: 1s;
}
.con-box .wp1440 {
  margin-top: 0.2rem;
  background: #ffffff;
  padding: 0.28rem 0.38rem;
}

.tabs-ul {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.25rem;
}
.tabs-ul li {
  width: 1.35rem;
  height: 0.4rem;
  background: #eff0f2;
  border-radius: 0.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 0.35rem;
  cursor: pointer;
  font-size: 0.18rem;
  flex-shrink: 0;
}
.tabs-ul li:last-child{
  margin-right: 0;
}
.tabs-ul .active {
  background: #da2927;
  color: #fff;
}

/* 直播合集 */

.collection {
  display: inline-block;
  width: 48.5%;
  margin-bottom: 0.2rem;
  flex-shrink: 0;
}
.collection .coll_top {
  width: 100%;
  height: 3.8rem;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.collection .mask {
  box-sizing: border-box;
  padding: 0 1.1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}
.collection .coll_title {
  width: 100%;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.36rem;
  color: #fff;
  font-weight: normal;
}
.collection .coll_count {
  font-size: 0.26rem;
  color: #fff;
  margin-top: 0.4rem;
}
.collection .coll_bottom {
  box-sizing: border-box;
  padding: 0 0.3rem;
  display: flex;
  align-items: center;
}
.collection .coll_label {
  width: 0.98rem;
  height: 0.4rem;
  margin-right: 0.2rem;
  background-color: #e7f1fc;
  color: #027aff;
  font-size: 0.26rem;
  line-height: 0.4rem;
  text-align: center;
  border-radius: 0.05rem;
}
.collection .title_coll {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.32rem;
  color: #333;
}

/* 直播列表 */
.middle_contain {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.live_top {
  width: 48.5%;
  flex-shrink: 0;
  margin-bottom: 0.2rem;
}
.live_top .title {
  padding: 0.16rem 0.1rem;
  font-size: 0.18rem;
  color: #333;
}
.live_top .top_tip {
  width: 100%;
  height: 3.8rem;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.live_top .mask {
  box-sizing: border-box;
  padding: 0.1rem 0.2rem;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}
.live_top .mask_top {
  display: flex;
  justify-content: space-between;
}
.live_top .people_times {
  display: flex;
  align-items: center;
}
.live_top .people_times img {
  width: 0.2rem;
  height: 0.2rem;
}
.live_top .people_times span {
  font-size: 0.14rem;
  color: #fff;
  margin-top: 0.03rem;
}

.live_top .mask_center {
  margin-top: 0.5rem;
}
.live_top .yu_title {
  margin-bottom: 0.2rem;
  font-size: 0.18rem;
  color: #fff;
  font-weight: normal;
}
.live_top .line {
  margin-top: 0.2rem;
  width: 1.4rem;
  height: 2px;
  background-color: #fff;
}
.live_top .yu_time {
  margin-top: 0.28rem;
  font-size: 0.16rem;
  color: #fff;
}
.live_top .no_time {
  text-align: center;
  font-size: 0.16rem;
  color: #fff;
  margin-top: 1.5rem;
}
.live_top .have_time {
  margin-top: 0.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.live_top .play_btn {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.live_top .play_btn > img {
  width: 0.96rem;
  height: 0.96rem;
}

.status-wrap {
  width: 0.8rem;
  height: 0.26rem;
  line-height: 0.26rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 0.05rem;
}
.status-wrap > div {
  font-size: 0.14rem;
  color: #fff;
  padding-top: 0.02rem;
}
.l-start > img {
  width: 0.16rem;
  height: 0.16rem;
  margin-right: 0.05rem;
}
.l-playback > img {
  width: 0.16rem;
  height: 0.16rem;
  margin-right: 0.05rem;
}
.l-beforestare {
  background: rgba(66, 146, 255, 1);
}
.l-start {
  background: rgba(215, 19, 26, 1);
}
.l-end {
  background: rgba(158, 157, 157, 1);
}
.l-playback {
  background: rgba(0, 153, 68, 1);
}

.count_down {
  display: flex;
  align-items: center;
}
.count_down .count_item {
  display: flex;
  align-items: center;
}
.count_down .count_item > p {
  background-color: rgb(0, 0, 0, 0.5);
  font-size: 0.16rem;
  color: #fff;
  margin-right: 1px;
}
.count_down .unit {
  font-size: 0.16rem;
  color: #fff;
}

@media (max-width: 768px) {
  .con-box .wp1440{
    padding: 0.2rem 0.1rem;
  }
  .collection {
    width: 100%;
  }
  .collection .coll_top {
    height: 2.8rem;
  }
  .tabs-ul {
    justify-content: flex-start;
    overflow-y: auto;
}
  .live_top{
    width: 100%;
  }
  .live_top .top_tip{
    height: 2.8rem;
  }
  .live_top .title{
    line-height: 0.26rem;
  }
}