@font-face {
  font-family: 'iconfont';
  src: url('../font/iconfont.ttf');
}

[class*=iconfont] {
  font-family: iconfont!important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: .2px;
  -moz-osx-font-smoothing: grayscale;
}

body{
  min-width: 1160px;
}

.container{
  width: 1160px;
  margin: 0 auto;
}

/*顶部导航栏*/
.nav-menu{
  position: relative;
  z-index: 200;
  height: 42px;
  color: #222;
}

.nav-wrapper-left{
  display: inline-block;
}

.nav-wrapper-right{
  display: inline-block;
  float: right;
}

.nav-con-ul{
  display: flex;
  display: inline-block;
}

.nav-item{
  float: left;
  text-align: center;
  line-height: 42px;
  height: 42px;
  position: relative;
  background-color: hsla(0,0%,100%,0);
  white-space: nowrap;
}

.nav-item .home{
  margin-left: -10px;
  padding-left: 12px;
}

.nav-item .t{
  white-space: nowrap;
  color: #222;
  height: 100%;
  display: block;
  padding: 0 7px;
}

.nav-item .t:hover{
  background-color: hsla(0, 0%, 100%, .2)
}

.u-link:hover{
  background-color: hsla(340, 84%, 74%, 1) !important;
}

.nav-con-ul .iconfont{
  vertical-align: middle;
  font-size: 16px;
  line-height: 17px;
  color: #23ade5;
}

.icon-tv{
  padding-right: 3px;
}

.icon-tv:before{
  content:'\E668'
}

.icon-mobile:before{
  content:'\E724'
}

.nav-item .item-face{
  display: block;
  width: 32px;
  pointer-events:none;
}

.nav-item .i-face{
  position: absolute;
  z-index: 20;
  width: 32px;
  height: 32px;
  /* left: 8px;
  top: 0; */
  margin: 0 auto;
}

.nav-item .i-face .face{
  border: 0 solid #fff;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}

.up-load{
  width: 68px;
  height: 42px;
  margin-left: 5px;
}

.up-load .u-link{
  display: block;
  width: 100%;
  height: 46px;
  line-height: 42px;
  text-align: center;
  font-size: 14px;
  color: #fff;
  background-color: #f45a8d;
  border-radius: 0 0 6px 6px;
}

.header-banner{
  background: #eee;
  position: relative;
  z-index: 199;
  height: 170px;
  margin-top: -42px;
  background-position: center -10px;
  background-repeat: no-repeat;
}

.nav-mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: hsla(0, 0%, 100%, .4);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
}

.banner-link {
  position: absolute;
  width: 220px;
  height: 105px;
  left: 24px;
  top: 55px;
  background: transparent no-repeat 0;
  z-index: 10;
}

.header-content{
  position: relative;
  height: 170px;
}

.search{
  position: absolute;
  bottom: 20px;
  right: 0;
  width: 268px;
  height: 32px;
  padding: 2px 2px 2px 72px;
  background-color: #e5e9ef;
  background-color: rgba(0,0,0,.12);
  border-radius: 6px;
  font-size: 12px;
  z-index: 10;

}

.searchform{
  background-color: #fff;
  background-color: hsla(0, 0%, 100%, .88);
  display: block;
  height: 32px;
  border-radius: 4px;
  transition: background-color .2s;
}

.search-keyword{
  float: left;
  width: 200px;
  color: #222;
  font-size: 12px;
  overflow: hidden;
  height: 32px;
  line-height: 32px;
  padding: 0 12px;
  border: 0;
  box-shadow: none;
  background-color: transparent;
}

.searchform:hover{
  background-color: #fff;
}

.search-submit{
  display: block;
  position: absolute;
  right: 0;
  width: 48px;
  min-width: 0;
  cursor: pointer;
  height: 32px;
  background: url(../images/icons.png) -653px -720px;
  margin: 0;
  padding: 0;
  border: 0;
}

.search-submit:hover{
  background: url(../images/icons.png) -718px -720px;
}

.link-ranking{
  position: absolute;
  left: 2px;
  top: 2px;
  height: 32px;
  line-height: 32px;
  background-color: #fff;
  background-color: hsla(0, 0%, 100%, .88);
  border-radius: 4px;
  width: 68px;
  transition: background-color .2s;
}

.link-ranking span{
  padding-left: 26px;
  color: #f25d8e;
  display: inline-block;
  background: url(../images/icons.png) -659px -655px no-repeat;
}

.link-ranking:hover{
  background-color: #fff;
}

.header-wrapper{
  position: relative;
  width: 1160px;
  margin: 0 auto;
}

.primary-menu{
  width: 1160px;
  margin: 0 auto;
}

.primary-menu .nav-menu{
  position: relative;
  z-index: 200;
  height: 42px;
  color: #222;
  width: 1080px;
  height: 42px;
  margin-top: 6px;
  margin-bottom: 10px;
} 

.primary-menu .nav-menu li.home{
  width: 24px;
}

.primary-menu .nav-menu li{
  float: left;
  position: relative;
  margin-right: 0;
}

.primary-menu .nav-menu li.home>a .nav-name{
  position: relative;
  top: 15px;
  line-height: 20px;
}

.primary-menu .nav-menu>li .nav-name {
  display: inline-block;
  vertical-align: middle;
  color: #222;
  font-size: 12px;
  height: 40px;
  padding-top: 8px;
  line-height: 50px;
}

.primary-menu .nav-menu li.home a{
  width: 24px;
  display: block;
  background: url(../images/icons.png) -660px -1170px no-repeat;
}

.primary-menu .nav-menu>li {
  width: 48px;
  margin-right: 8px;
}

.primary-menu .nav-menu>li {
  width: 46px;
  text-align: center;
  display: block;
}

.primary-menu .nav-menu>li .num-wrap {
  position: absolute;
  top: 8px;
  left: 0;
  height: 14px;
  width: 100%;
  text-align: center;
}

.primary-menu .nav-menu>li .num-wrap span {
  display: inline-block;
  vertical-align: top;
  font-size: 12px;
  transform: scale(.85);
  color: #fff;
  background-color: #ffafc9;
  border-radius: 3px;
  height: 12px;
  line-height: 14px;
  max-width: 28px;
  padding: 1px 3px;
  font-family: sans-serif,sans-serifsans-serif,Calibri,Arial,Helvetica;
}

.primary-menu .nav-menu .side-nav {
  margin: 0 3px;
  width: 40px;
  text-align: center;
}

.primary-menu .nav-menu .side-nav .side-link {
  display: inline-block;
  position: relative;
  overflow: hidden;
  zoom: 1;
}

.primary-menu .nav-menu .side-nav .side-link i.zhuanlan {
  background-position: -87px -1814px;
}

.primary-menu .nav-menu .side-nav .side-link i {
  display: block;
  width: 18px;
  height: 18px;
  margin: 3px auto 2px;
  background: url(../images/icons.png) no-repeat;
}

.primary-menu .nav-menu .side-nav .side-link span {
  display: block;
  color: #222;
  margin: 0;
  font-size: 12px;
}

.primary-menu .nav-menu .side-nav .side-link i.square {
  background-position: -87px -2006px;
}

.primary-menu .nav-menu .side-nav .side-link i.live {
  background-position: -87px -1878px;
}

.primary-menu .nav-menu .side-nav .side-link i.blackroom {
  background-position: -87px -1942px;
}

.nav-gif{
  position: absolute;
  right: 0;
  top:  0;
  height: 50px;
  padding: 4px 0;
}

.gif-menu .random-p{
  width: 69px;
  height: 40px;
  display: inline-block;
  vertical-align: top;
  margin: 3px 0;
  overflow: hidden;
}

.gif-menu .random-p img{
  width: 100%;
  height: 100%;
  margin: 0 auto;
  border-radius: 3px;
}
/*顶部导航栏结束*/

/*轮播图*/
.chief-recommend-module {
  padding-bottom: 40px;
}

.chief-recommend-module .recommend-module {
  height: 220px;
}

.recommend-module {
  position: relative;
  height: 100%;
  overflow: hidden;
}

.recommend-module .groom-module {
  float: left;
  margin: 0 0 20px 20px;
}

.groom-module {
  width: 160px;
  height: 100px;
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  background: #fff;
}

.groom-module img {
  width: 100%;
  height: 100%;
}

.groom-module .pic {
  width: 160px;
  height: 100px;
}

.groom-module .card-mark {
  position: absolute;
  left: 0;
  top: 68px;
  width: 150px;
  /* height: 100%; */
  font-size: 12px;
  /* height: 20px; */
  line-height: 20px;
  padding: 10px 5px;
  overflow: hidden;
  background: #000;
  background: linear-gradient(transparent,rgba(0,0,0,.1) 20%,rgba(0,0,0,.2) 35%,rgba(0,0,0,.6) 65%,rgba(0,0,0,.9));
}

.groom-module .card-mark .title {
  color: #fff;
  height: 40px;
  overflow: hidden;
  margin-bottom: 5px;
  word-break: break-all;
  word-wrap: break-word;
}

.groom-module .card-mark .author, .groom-module .card-mark .play {
  opacity: 1;
  color: #99a2aa;
  height: 20px;
  line-height: 20px;
  overflow: hidden;
  transition: all .6s;
}

.watch-later-trigger {
  display: none;
  width: 22px;
  height: 22px;
  position: absolute;
  right: 6px;
  bottom: 4px;
  cursor: pointer;
  background-image: url(../images/time.png);
}

.home-card:hover .card-mark{
  top: 0;
}

.home-card:hover .w-later{
  display: block;
}

.chief-recommend-module .carousel-box {
  width: 440px;
  height: 220px;
  float: left;
}

.swiper-slide img{
  width: 459px;
  height: 220px;
}

.swiper-wrapper{
  position: relative;
}

.swiper-pagination{
  margin-left: 140px !important;
}

.my-bullet-active{
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: url(../images/icon_slide_selected.png);
  background-position: center;
  background-size: 11px 11px;
  background-repeat: no-repeat;
  transform: scale(1.8);
}

.my-bullet {
  display: inline-block;
  margin-left: 10px;
  width: 6px;
  height: 6px;
  border: 2px solid transparent;
  border-radius: 50%;
  background-color: #fff;
  vertical-align: middle;
  cursor: pointer;
  transition: all .2s;
}

/*第一栏推广*/
.chief-wrap-module{
  display: flex;
  justify-content: space-between;
  margin-bottom: 5px;
}

.chief-wrap-module .extension{
  width: 900px;
  height: 224px;
}

.chief-wrap-module .gg-window{
  width: 259px;
  height: 224px;
}

.extension .headline{
  padding: 0 0 15px;
}

.icon{
  display: inline-block;
  background-image: url(../images/icons.png);
}

.icon_t{
  width: 40px;
  height: 40px;
  margin-right: 10px;
  vertical-align: middle;
  float: left;
  margin-top: -10px;
}

.icon-promote{
  background-position: -141px -75px;
}

.headline .name{
  font-size: 24px!important;
  line-height: 24px;
  font-weight: 400;
  margin-right: 20px;
  float: left;
}

.storey-box {
  height: 168px;
  overflow: hidden;
}

.storey-box .spread-module {
  position: relative;
  float: left;
  margin: 0 20px 20px 0;
  /* transform: scale(1.4); */
}

.spread-module .pic {
  position: relative;
  width: 160px;
  height: 100px;
  display: block;
  overflow: hidden;
  text-align: center;
  border-radius: 4px;
}

.spread-module .pic img {
  margin: 0 auto;
  outline: 0;
}

.cover-preview-module {
  opacity: 0;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transition: opacity .3s;
}

.cover-preview-module .progress-bar {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 10px;
  border-color: #000;
  border-style: solid;
  border-width: 4px 8px;
  background: #444;
  box-sizing: border-box;
}

.cover-preview-module .progress-bar span {
  display: block;
  background: #fff;
  height: 2px;
}

.spread-module .pic .mask-video {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,.2);
  transition: opacity .3s;
} 

.danmu-module {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: all .3s;
  pointer-events: none;
}

.spread-module .t {
  width: 160px;
  padding-top: 8px;
  height: 40px;
  line-height: 20px;
  transition: all .2s linear;
  color: #222;
  word-wrap: break-word;
  word-break: break-all;
  overflow: hidden;
  text-align: left;
  font-size: 12px;
  font-weight: 400;
}

.spread-module:hover .w-later{
  display: block;
}

.spread-module:hover .t{
  color: #00a5db;
}

.mask-inner{
  position: absolute;
  top: 100px;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,.2);
}

.spread-module:hover .mask-inner{
  top: 0 !important;
}

.spread-module .pic .dur {
  opacity: 0;
  position: absolute;
  bottom: 2px;
  left: 6px;
  color: #fff;
  height: 12px;
  line-height: 12px;
  padding: 0 5px 1px 0;
  transition: all .3s;
}

.spread-module:hover .dur{
  opacity: 1;
}

.spread-module .pic .gg-pic {
  position: absolute;
  right: 0;
  top: 0;
}

.gg-window .online {
  background: #f4f4f4;
  border: 1px solid #e7e7e7;
  border-radius: 2px;
  color: #505050;
  height: 30px;
  line-height: 30px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 20px;
}

.gg-window .online a {
  -ms-flex: 1;
  flex: 1;
  text-align: center;
}

.gg-window .online a:hover{
  color: #00a5db;
}

.operate-card img{
  display: block;
  width: 100%;
  height: 153px;
  border-radius: 2px;
}

/*第二栏直播*/
.l-con{
  padding-bottom: 30px;
}

.gg-floor-module {
  margin-bottom: 20px;
  position: relative;
  width: 1160px;
  overflow: hidden;
  border-radius: 5px;
  max-height: 96px;
  font-size: 0;
}

.gg-floor-module img{
  width: 100%;
  height: 100%;
}

.bili-wrapper .l-con {
  float: left;
  width: 900px;
}

.live-module .zone-title {
  padding-right: 20px;
}

.live-module .storey-box {
  height: 336px;
  overflow: hidden;
}

.live-module .zone-title .headline {
  padding: 0 0 15px;
}

.bili-wrapper .r-con {
  width: 260px;
  float: right;
}

.live-module .zone-title .headline .icon_t.icon-live {
  background-position: -141px -652px;
}

.live-module .zone-title .headline .icon_t {
  width: 40px;
  height: 40px;
  margin-right: 10px;
  vertical-align: middle;
  float: left;
  margin-top: -10px;
}

.live-module .zone-title .headline .name {
  font-size: 24px!important;
  line-height: 24px;
  font-weight: 400;
  margin-right: 20px;
  float: left;
  color: #222;
}

.live-module .zone-title .headline .name:hover{
  color: #00a1d6;
}

.live-module .zone-title .headline .online {
  float: left;
  margin-top: 8px;
  color: #99a2aa;
}

.live-module .zone-title .headline .online span {
  color: #00a1d6;
}

.live-module .zone-title .headline .fire {
  margin-top: 8px;
  margin-left: 40px;
  padding-right: 10px;
  color: #6d757a;
  float: left;
}

.live-module .zone-title .headline .fire:hover{
  color: #00a1d6;
}

.live-module .zone-title .headline .fire .pmt-icon {
  display: inline-block;
  vertical-align: top;
  background-position: -665px -1113px;
  width: 14px;
  height: 14px;
  margin-top: 1px;
}

.live-module .zone-title .headline .link-more {
  float: right;
  width: 52px;
  height: 22px;
  line-height: 22px;
  background-color: #fff;
  border: 1px solid #ccd0d7;
  color: #555;
  border-radius: 4px;
  text-align: center;
  margin: 0 0 0 10px;
  transition: all .2s;
}

.live-module .zone-title .headline .link-more:hover{
  background-color: #ccd0d7;
}

.live-module .zone-title .headline .link-more:hover i{
  margin-left:6px;
}

.live-module .zone-title .headline .link-more i {
  display: inline-block;
  background-position: -478px -218px;
  width: 6px;
  height: 12px;
  margin: -2px 0 0;
  vertical-align: middle;
  transition: all .2s;
}

.live-module .zone-title .headline .read-push {
  float: right;
  cursor: pointer;
  background-color: #fff;
  border: 1px solid #ccd0d7;
  border-radius: 4px;
  height: 22px;
  padding: 0 10px;
  transition: all .2s;
}

.live-module .zone-title .headline .read-push .icon_read {
  display: inline-block;
  width: 12px;
  height: 13px;
  vertical-align: top;
  transition: all .5s;
  margin-top: 5px;
  background-position: -475px -89px;
}

.live-module .zone-title .headline .read-push:hover{
  background-color: #ccd0d7;
}

.live-module .zone-title .headline .read-push:hover .icon_read{
  transform: rotate(180deg);
}

.live-module .zone-title .headline .read-push .info {
  display: inline-block;
  vertical-align: top;
  line-height: 22px;
  margin-left: 5px;
}

.live-module .storey-box .card-live-module {
  float: left;
  margin: 0 20px 20px 0;
}

.card-live-module {
  position: relative;
  width: 160px;
  height: 148px;
  font-size: 12px;
  overflow: hidden;
}

.card-live-module .pic {
  position: relative;
  width: 160px;
  height: 100px;
  display: block;
  overflow: hidden;
  text-align: center;
  border-radius: 4px;
}

.lazy-img {
  background: url(../images/lazy.png) 50% no-repeat;
  width: 100%;
  height: 100%;
  display: inline-block;
}

.lazy-img img {
  display: block;
  width: 100%;
  height: 100%;
}

.card-live-module .pic .snum {
  position: absolute;
  bottom: 0;
  height: 34px;
  width: 100%;
  background: rgba(0,0,0,.5);
  background: linear-gradient(transparent,transparent,rgba(0,0,0,.5));
}

.card-live-module .pic .snum .auther {
  white-space: nowrap;
  text-overflow: ellipsis;
  left: 4px;
  bottom: 0;
  text-align: left;
}

.card-live-module .pic .snum span {
  line-height: 20px;
  height: 20px;
  display: inline-block;
  width: 47%;
  overflow: hidden;
  font-size: 12px;
  vertical-align: bottom;
  position: absolute;
  color: #fff;
  font-weight: 200;
}

.card-live-module .pic .snum .online {
  right: 4px;
  text-align: right;
  bottom: 0;
}

.card-live-module .pic .snum .online i {
  display: inline-block;
  width: 13px;
  height: 10px;
  vertical-align: baseline;
  margin-right: 5px;
  background: url(../images/people.png);
}

.card-live-module .pic .mask {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 4px;
  transition: opacity .3s;
  background-repeat: no-repeat;
  background-color: #000;
  background-position: 50%;
  background-size: contain;
}

.card-live-module .t {
  padding-top: 8px;
  height: 40px;
  line-height: 20px;
  transition: all .2s linear;
  color: #222;
  word-wrap: break-word;
  word-break: break-all;
  overflow: hidden;
  text-align: left;
}

.card-live-module .num {
  position: absolute;
  width: 100%;
  bottom: 0;
  height: 20px;
  line-height: 20px;
  color: #9ba3ab;
  background-color: #fff;
  transition: all .3s;
}

.card-live-module:hover .t{
  color: #00a1d6;
}

.card-live-module:hover .num{
  bottom: -20px;
}

.card-live-module:hover .snum{
  bottom: -20px;
}

.card-live-module:hover .mask{
  opacity: 1;
}

.live-module .storey-box .card-live-module {
  float: left;
  margin: 0 20px 20px 0;
}

.bili-tab{
  display: inline-block;
}

.bili-tab .bili-tab-item:first-child {
  margin-left: 0;
}

.bili-tab .bili-tab-item {
  float: left;
  position: relative;
  height: 20px;
  line-height: 20px;
  cursor: pointer;
  padding: 1px 0 2px;
  border-bottom: 1px solid transparent;
  margin-left: 12px;
  transition: .2s;
  transition-property: border,color;
}

.bili-tab .bili-tab-item.on {
  background-color: transparent;
  border-color: #00a1d6;
  color: #00a1d6;
}

.bili-tab .bili-tab-item.on:before {
    display: block;
}

.bili-tab .bili-tab-item:before {
  content: "";
  display: none;
  position: absolute;
  left: 50%;
  margin-left: -3px;
  bottom: 0;
  width: 0;
  height: 0;
  border-bottom: 3px solid #00a1d6;
  border-top: 0;
  border-left: 3px dashed transparent;
  border-right: 3px dashed transparent;
}

.live-module .tab-box {
  margin-top: 20px;
  overflow: hidden;
}

.live-module .tab-box .tab-con {
  width: 780px;
  transition: all .3s;
}

.live-module .tab-box .tab-con .tab-item {
  width: 260px;
  float: left;
}

.live-module .tab-box .tab-con .tab-item.rank .r-item {
  padding-left: 25px;
}

.live-module .tab-box .tab-con .tab-item .r-item {
  overflow: hidden;
  position: relative;
  margin: 0 0 14px;
}

.live-module .tab-box .tab-con .tab-item .r-item .number {
  position: absolute;
  color: #fff;
  height: 18px;
  line-height: 18px;
  top: 0;
  left: 0;
  font-size: 12px;
  min-width: 12px;
  text-align: center;
  background-color: #b8c0cc;
  z-index: 20;
  border-radius: 4px;
  padding: 0 3px;
  font-weight: bolder;
  float: left;
  margin-right: 6px;
}

.live-module .tab-box .tab-con .tab-item .r-item .preview {
  display: block;
  float: left;
  position: relative;
  margin-right: 12px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  overflow: hidden;
}

.lazy-img {
  background: url(../images/live-r-1.webp) 50% no-repeat;
  width: 100%;
  height: 100%;
  display: inline-block;
}

.live-module .tab-box .tab-con .tab-item .r-item .r-i {
  float: left;
  width: 205px;
}

.live-module .tab-box .tab-con .tab-item.rank .r-item .r-i {
  width: 180px;
}

.live-module .tab-box .tab-con .tab-item .r-item .r-i-t {
  line-height: 16px;
  overflow: hidden;
}

.live-module .tab-box .tab-con .tab-item .r-item .r-i-t .u-name {
  max-width: 135px;
  float: left;
  color: #222;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.live-module .tab-box .tab-con .tab-item .r-item .r-i-t .u-online {
  max-width: 60px;
  float: right;
  color: #99a2aa;
  line-height: 16px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.live-module .tab-box .tab-con .tab-item .r-item .r-i-t .u-online i {
  display: inline-block;
  vertical-align: middle;
  width: 12px;
  height: 12px;
  margin-top: -2px;
  margin-right: 0px;
  background: url(../images/live-eye.png) no-repeat;
}

.live-module .tab-box .tab-con .tab-item .r-item .r-i-st {
  margin-top: 4px;
  color: #99a2aa;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 190px;
}

.r-i:hover .u-name{
  color: #00a1d6 !important;
}

.r-item-n{
  background: #f25d8e !important;
}
/*第三栏动画*/
.zone-wrap-module .zone-title .headline .icon_t.icon-douga {
  background-position: -141px -908px;
}

.num span {
  line-height: 12px;
  height: 14px;
  display: inline-block;
  width: 48%;
  overflow: hidden;
  font-size: 12px;
  vertical-align: bottom;
}

.num .play .icon {
  background-position: -282px -90px;
}

.num .danmu .icon {
  background-position: -282px -218px;
}

.num i {
  display: inline-block;
  width: 12px;
  height: 12px;
  vertical-align: top;
  margin-right: 3px;
}

.zone-wrap-module .card-live-module .auther{
  white-space: nowrap;
  text-overflow: ellipsis;
  left: 4px;
  bottom: 0px;
  text-align: left;
}

.zone-wrap-module .card-live-module .snum1{
  position: absolute;
  left: -57px;
  bottom: -40px;
  height: 34px;
  width: 100%;
  background: rgba(0,0,0,.5);
  background: linear-gradient(transparent,transparent,rgba(0,0,0,.5));
}

.zone-wrap-module .card-live-module .snum1 .auther{
  color: #fff;
}

.zone-wrap-module .card-live-module:hover .snum1{
  bottom: -16px;
}

.zone-wrap-module .card-live-module:hover .mask-inner{
  top: 0 !important;
}

.zone-wrap-module .card-live-module:hover .watch-later-trigger{
  display: block;
  z-index: 10;
  right: -50px;
  bottom: 22px;
}

.rank-head h3{
  float: left;
  font-size: 18px;
  font-weight: 400;
}

.ri-info-wrap {
  line-height: 18px;
  overflow: hidden;
  color: #222;
}

.rank-list-wrap .r-item:first-child{
  margin-top: 0 !important;
  height: 50px !important;
  overflow: visible !important;
}

.rank-list-wrap .r-item{
  margin-top: 20px !important;
}

.rank-list-wrap .r-item:hover .ri-info-wrap{
  color: #00a1d6;
}

.ri-info-wrap {
  position: relative;
  display: block;
  cursor: pointer;
}

.ri-preview {
  margin-right: 5px;
  width: 80px;
  height: 50px;
  float: left;
  border-radius: 4px;
  position: relative;
}

.ri-preview:hover .w-later{
  display: inline-block !important;
}

.ri-detail {
  float: left;
}

.ri-detail .ri-title {
  height: 36px;
  line-height: 18px;
  margin-top: -3px;
  width: 150px;
  padding: 0;
}

.ri-detail .ri-point {
  line-height: 12px;
  color: #99a2aa;
  height: 12px;
  margin-top: 5px;
  overflow: visible !important;
}

.more-link {
  display: block;
  height: 24px;
  line-height: 24px;
  background-color: #e5e9ef;
  text-align: center;
  border: 1px solid #e0e6ed;
  color: #222;
  border-radius: 4px;
  transition: .2s;
}

.more-link:hover{
  background: #acafb3;
}

.more-link .icon-arrow-r {
  display: inline-block;
  vertical-align: middle;
  background-position: -478px -218px;
  width: 6px;
  height: 12px;
  margin: -2px 0 0 5px;
}

.rank-dropdown {
  float: right;
  margin-left: 90px;
}

.bili-dropdown {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  background-color: #fff;
  cursor: default;
  padding: 0 7px;
  height: 22px;
  line-height: 22px;
  border: 1px solid #ccd0d7;
  border-radius: 4px;
  z-index: 200 !important;
}

.tab-box{
  z-index: 1 !important;
}

.bili-dropdown .selected {
  display: inline-block;
  vertical-align: top;
}

.bili-dropdown .icon-arrow-down {
  background-position: -475px -157px;
  display: inline-block;
  vertical-align: middle;
  width: 12px;
  height: 6px;
  margin-left: 5px;
  margin-top: -1px;
}

.bili-dropdown .dropdown-list {
  position: absolute;
  width: 100%;
  background: #fff;
  border: 1px solid #ccd0d7;
  border-top: 0;
  left: -1px;
  top: 22px;
  z-index: 10;
  display: none;
  border-radius: 0 0 4px 4px;
}

.bili-dropdown:hover .dropdown-list {
  display: block;
}

.bili-dropdown .dropdown-list .dropdown-item {
  cursor: pointer;
  margin: 0;
  padding: 3px 7px;
}

/*第四栏番剧*/
.bangumi-module .up {
  padding-bottom: 15px;
}

.drama{
  padding-bottom: 30px !important;
}

.l-con {
  float: left;
  width: 900px;
}

.bangumi-timing-module .headline {
  position: relative;
}

.bangumi-timing-module .headline .icon_t.icon-bangumi {
  background-position: -141px -140px;
}

.bangumi-timing-module .headline .icon_t {
  width: 40px;
  height: 40px;
  margin-right: 10px;
  vertical-align: middle;
  float: left;
  margin-top: -10px;
}

.bangumi-timing-module .headline .name {
  font-size: 24px!important;
  line-height: 24px;
  font-weight: 400;
  margin-right: 20px;
  float: left;
  color: #222;
}

.bangumi-timing-module .headline .bili-tab {
  font-size: 18px;
  width: 650px;
  height: 30px;
  line-height: 30px;
}

.bili-tab {
  overflow: hidden;
  zoom: 1;
}

.bangumi-timing-module .headline .bili-tab .bili-tab-item {
  width: 70px;
  border-color: #e5e9ef;
  text-align: center;
  margin: 0;
  padding: 2px 4px 7px;
}

.bangumi-timing-module .headline .c-clink {
  position: absolute;
  right: 20px;
  top: -7px;
  border: 1px solid #f25d8e;
  width: 104px;
  height: 34px;
  line-height: 34px;
  text-align: center;
  color: #f25d8e;
  font-size: 14px;
  border-radius: 4px;
  transition: .1s;
}

.bangumi-timing-module .headline .c-clink:hover{
  background: #f25d8e;
  color: #fff;
}

.bangumi-timing-module .headline .c-clink:hover .icon{
  background-position: -541px -216px;
}

.bangumi-timing-module .headline .c-clink .icon {
  display: inline-block;
  vertical-align: middle;
  background-position: -478px -281px;
  width: 6px;
  height: 12px;
  margin: -2px 0 0 5px;
}

.bangumi-timing-module .timing-box {
  position: relative;
  margin: 26px 20px 40px 0;
  height: 398px;
  overflow-y: auto;
}

.bangumi-timing-module .card-timing {
  float: left;
  width: 180px;
  padding: 36px 34px 0 0;
}

.bangumi-timing-module .card-timing:first-child, .bangumi-timing-module .card-timing:nth-child(2), .bangumi-timing-module .card-timing:nth-child(3), .bangumi-timing-module .card-timing:nth-child(4) {
  padding-top: 0;
}

.card-timing-module .pic {
  width: 72px;
  height: 72px;
  margin-right: 12px;
  display: block;
  float: left;
  position: relative;
  overflow: hidden;
  border-radius: 4px;
}

.card-timing-module .pic img {
  width: 72px;
  height: 72px;
}

.card-timing-module .r-text {
  float: left;
  width: 96px;
  height: 72px;
  position: relative;
}

.card-timing-module .r-text .t {
  display: block;
  height: 36px;
  line-height: 18px;
  text-align: left;
  width: 100%;
  margin-top: -3px;
  word-break: break-all;
  word-wrap: break-word;
  color: #222;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
}

.card-timing-module .r-text .update {
  position: absolute;
  bottom: 0;
  text-align: left;
  margin-top: 2px;
  color: #aaa;
  left: 0;
  white-space: nowrap;
  line-height: 18px;
}

.card-timing-module .r-text .update .published {
  background: #ff8eb3;
} 


element.style {
}
.card-timing-module .r-text .update .published {
    background: #ff8eb3;
}
.card-timing-module .r-text .update a {
    color: #fff;
    border-radius: 9px;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    padding: 0 4px;
    height: 18px;
    line-height: 18px;
    min-width: 28px;
    max-width: 89px;
    text-overflow: ellipsis;
    overflow: hidden;
    background: #b8c0cc;
}

.sec-rank .rank-head {
  height: 24px;
  line-height: 24px;
}

.sec-rank .rank-head h3 {
  float: left;
  font-size: 18px;
  font-weight: 400;
}

.sec-rank .rank-list-wrap {
  width: 260px;
  overflow: hidden;
  zoom: 1;
  transition: all .2s linear;
}

.sec-rank .rank-list-wrap .rank-list {
  padding-bottom: 15px;
  /* min-height: 278px; */
  float: left;
  padding-top: 20px;
  position: relative;
}

.bangumi-rank-list .rank-item:first-child {
  margin-top: 0;
}

.bangumi-rank-list .rank-item {
  position: relative;
  padding-left: 25px;
  margin-top: 20px;
  overflow: hidden;
}

.bangumi-rank-list .rank-item .ri-num {
  position: absolute;
  color: #fff;
  height: 18px;
  line-height: 18px;
  top: 0;
  left: 0;
  font-size: 12px;
  min-width: 12px;
  text-align: center;
  background-color: #b8c0cc;
  border-radius: 4px;
  padding: 0 3px;
  font-weight: bolder;
  font-style: normal;
}

.rank-list .rank-item.highlight .ri-num {
  background: #f25d8e;
}

.rank-list .rank-item .ri-info-wrap {
  position: relative;
  display: block;
  cursor: pointer;
  width: 260px;
}

.bangumi-rank-list .rank-item .ri-title {
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 144px;
  line-height: 18px;
  vertical-align: top;
  color: #222;
  display: inline-block;
  overflow: hidden;
}

.bangumi-rank-list .rank-item .ri-total {
  display: inline-block;
  vertical-align: top;
  color: #99a2aa;
  margin-left: 10px;
}

.sec-rank .more-link {
  display: block;
  height: 24px;
  line-height: 24px;
  background-color: #acafb3;
  text-align: center;
  border: 1px solid #e0e6ed;
  color: #222;
  border-radius: 4px;
  transition: .2s;
}

section{
  width: 250px;
  display: inline-block;
}

.sec-rank .more-link .icon-arrow-r {
  display: inline-block;
  vertical-align: middle;
  background-position: -478px -218px;
  width: 6px;
  height: 12px;
  margin: -2px 0 0 5px;
}

.more-link:hover{
  background: #c1bbbb;
}

.rank-item:hover .ri-title{
  color: #00a1d6;
}

.r-con header {
  margin-bottom: 14px;
}

.r-con header h3 {
  font-size: 18px;
  font-weight: 400;
}

.carousel-module img{
  width: 100%;
  height: 100%;
}

.clearpadding{
  padding-bottom: 0 !important;
}

.bangumi-timing-module .headline .bili-tab .bili-tab-item.on {
  border-color: #00a1d6;
}

.padding-height{
  height: 260px !important;
}

/*第五栏国创*/
.bangumi-timing-module .headline .icon_t.icon-guochuang {
  background-position: -140px -1611px;
}

.slider-img {
  margin-top: 15px;
  width: 260px;
  height: 90px;
  border-radius: 4px;
  overflow: hidden;
}

.slider-img img{
  width: 100%;
  height: 100%;
}

.r-text .t:hover{
  color: #00a1d6;
}

.s-name {
  line-height: 24px !important;
  font-weight: 400;
  margin-right: 20px;
  float: left;
  color: #222;
  font-size: 18px !important;
}

/*第六栏漫画*/
.zone-title .headline .icon_t.icon-manga {
  background-position: -139px -1931px;
}

.cartoon-ri-preview{
  margin-right: 7px;
    width: 80px;
    height: 107px;
    float: left;
    border-radius: 4px;
    overflow: hidden;
}

.cartoon-r-con .r-item:first-child{
  height:107px !important;
}

.ri-detail.first-detail .ri-title {
  height: 36px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  overflow: hidden;
  white-space: normal;
}

.ri-detail.first-detail {
  width: 140px;
}

.ri-detail .ri-first-info {
  line-height: 12px;
  color: #99a2aa;
  height: 12px;
  margin-top: 4px;
}

.ri-detail .ri-first-info span {
  display: block;
  line-height: 18px;
}

.manga-spread-module {
  position: relative;
  width: 160px;
  font-size: 12px;
  overflow: hidden;
  float: left;
  margin: 0 20px 20px 0;
}

.manga-spread-module .pic {
  position: relative;
  width: 160px;
  height: 213px;
  display: block;
  overflow: hidden;
  text-align: center;
  border-radius: 4px;
}

.manga-spread-module .pic img {
  margin: 0 auto;
  outline: 0;
}

.manga-spread-module .t {
  padding-top: 8px;
  height: 20px;
  line-height: 20px;
  transition: all .2s linear;
  color: #222;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
}

.manga-spread-module .label {
  width: 100%;
  bottom: 0;
  height: 20px;
  line-height: 20px;
  color: #99a2aa;
  background-color: #fff;
}

.manga-spread-module:hover .t{
  color: #00a1d6;
}

.cartoon-storey-box{
  height: 560px !important;
}

/*第七栏音乐*/
.zone-title .headline .icon_t.icon-music {
  background-position: -140px -266px;
}

/*第八栏舞蹈*/
.zone-title .headline .icon_t.icon-dance {
  background-position: -141px -461px;
}

/*第九栏游戏*/
.zone-title .headline .icon_t.icon-game {
  background-position: -141px -203px;
}

/*第十栏科技*/
.zone-title .headline .icon_t.icon-technology {
  background-position: -141px -525px;
}

/*第十一栏数码*/
.zone-title .headline .icon_t.icon-digital {
  background-position: -140px -1741px;
}

/*第十二栏生活*/
.zone-title .headline .icon_t.icon-life {
  background-position: -137px -970px;
}

/*第十三栏鬼畜*/
.zone-title .headline .icon_t.icon-kichiku {
  background-position: -141px -332px;
}

/*第十四栏时尚*/
.zone-title .headline .icon_t.icon-fashion {
  background-position: -141px -718px;
}

/*第十五栏广告*/
.zone-title .headline .icon_t.icon-ad {
  background-position: -140px -1228px;
}

/*第十六栏娱乐*/
.zone-title .headline .icon_t.icon-ent {
  background-position: -141px -1032px;
}

/*第十七栏专栏*/
.zone-title .headline .icon_t.icon-article {
  background-position: -138px -1803px;
}

.article-card {
  display: inline-block;
  margin-bottom: 12px;
}

.article-card .article-cover {
  display: inline-block;
  width: 100px;
  height: 75px;
  vertical-align: top;
}

.article-card .article-info {
  width: 304px;
  margin-left: 16px;
  display: inline-block;
}

.article-card .article-cover img {
  width: 100px;
  height: 75px;
  border-radius: 4px;
}

.article-card .article-info .title {
  font-size: 12px;
  color: #222;
  line-height: 20px;
  height: 40px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
}

.article-card .article-info .data {
  margin-top: 6px;
  font-size: 12px;
  color: #99a2aa;
  line-height: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.article-card .article-info .data .view {
  width: 78px;
  display: inline-block;
}

.article-card .article-info .data .comment {
  width: 78px;
  display: inline-block;
}

.article-card .article-info .data .view .icon {
  background-position: -345px -218px;
  vertical-align: text-top;
}

.article-card .article-info .data .icon {
  display: inline-block;
  width: 14px;
  height: 12px;
  vertical-align: top;
  margin-right: 0;
}

.article-card .article-info .data .comment .icon {
  background-position: -345px -281px;
  vertical-align: text-top;
}

.article-card .article-info .data a {
  color: #99a2aa;
}

.article-rank-dropdown{
  margin-left: 162px !important;
}

/*第十八栏电影*/
.zone-title .headline .icon_t.icon-movie {
  background-position: -141px -396px;
}

/*第十九栏电视剧*/
.zone-title .headline .icon_t.icon-teleplay {
  background-position: -141px -845px;
}

/*第二十栏影视*/
.zone-title .headline .icon_t.icon-cinephile {
  background-position: -140px -1356px;
}

/*第二十一栏纪录片*/
.zone-title .headline .icon_t.icon-documentary {
  background-position: -140px -1292px;
}

/*第二十二栏特别推荐*/
.headline .icon_t.icon-special {
  background-position: -141px -780px;
}

.special-module .r-con a img{
  margin-top: 46px;
}

.special-module .user {
  position: absolute;
  left: 5px;
  top: 74px;
}

.special-module .user .tag {
  width: 30px;
  position: absolute;
  left: 124px;
  top: 28px;
  color: #aaa;
}

.special-module .user .face {
  width: 45px;
  height: 45px;
  border: 2px solid #fff;
  border-radius: 50%;
  vertical-align: middle;
  overflow: hidden;
  z-index: 20 !important;
}

.special-module .user .name {
  width: 68px;
  position: absolute;
  left: 52px;
  top: 28px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.special-module .card-live-module{
  height: 167px;
}

.special-module .card-live-module .t{
  margin-top: 15px;
  height: 50px;
}

.special-module .storey-box{
  height: 159px;
}

.special-module{
  height: 210px;
}

/*侧边导航模块*/
.elevator-module {
  position: fixed;
  z-index: 10;
  left: 50%;
  top: 232px;
  margin-left: 590px;
}

.elevator-module .nav-list {
  position: relative;
  background-color: #f6f9fa;
  border: 1px solid #e5e9ef;
  overflow: hidden;
  border-radius: 4px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
  padding-top: 6px;
}

.elevator-module .nav-list .item.on, .elevator-module .nav-list .item:hover {
  background-color: #00a1d6;
  color: #fff;
}

.elevator-module .back-top:hover{
  background-color: #00a1d6;
  color: #fff;
}

.elevator-module .nav-list .item {
  width: 48px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  transition: background-color .3s,color .3s;
  cursor: pointer;
  -ms-user-select: none;
  user-select: none;
}

.elevator-module .nav-list .customize {
  height: 16px;
  padding: 8px 0;
  border-top: 1px solid #e5e9ef;
}

.elevator-module .nav-list .customize .icon {
  display: block;
  margin: 0 auto 4px;
  background-position: -663px -151px;
  height: 18px;
  width: 18px;
  transform: scale(.7);
}

.elevator-module .back-top {
  position: relative;
  display: block;
  cursor: pointer;
  height: 30px;
  background-color: #f6f9fa;
  border: 1px solid #e5e9ef;
  border-top: none;
  overflow: hidden;
  border-radius: 4px;
  border-top-right-radius: 0;
  border-top-left-radius: 0;
  text-align: center;
  line-height: 43px;
}

.elevator-module .back-top i {
  background-position: -663px -89px;
  height: 18px;
  width: 19px;
  transform: scale(.7);
}

.bili-icon, .icon {
  display: inline-block;
  background-image: url(../images/icons.png);
}

.elevator-module .app-download {
  position: relative;
  width: 50px;
  height: 70px;
}

.elevator-module .app-download .app-icon {
  position: absolute;
  left: -15px;
  width: 80px;
  height: 80px;
  background-image: url(../images/app-download.png);
}
/*侧边导航模块结束*/

/*页脚区域*/
.container{
  width: 1160px;
  margin: 0 auto;
}

.b-footer-wrap{
  width: 1160px;
  margin: 0 auto;
  height: 136px;
}
.international-footer{
  width: 100%;
  height: 346px;
  position: relative;
  background-color: #f6f9fa;
}

.link-box .link-item1 .bt {
  font-size: 16px;
  color: #999;
  display: block;
  height: 20px;
  margin-bottom: 20px;
}

.international-footer .link-box .link-item1 .link-ul{
  height: 65px;
}

.international-footer .link-box .link-item1 .link-ul a {
  display: inline-block;
  margin-bottom: 10px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 400;
  width: 112px;
  height: 19px;
}

.link-item1{
  display: inline-block;
  width: 435px;
  height: 136px;
  border-right: 1px solid #eee;
  box-sizing: border-box;
  vertical-align: top;
  /* margin-top: 20px; */
}

.link-item1 a:hover{
  color: #00a1d6;
}

.link-item1:last-child{
  border: none;
}

.link-c{
  width:236px;
  height: 136px;
}

.link-c a{
  float: left;
  margin-right: 10px;
  margin-top: 30px;
}

.link-b{
  margin-left: 45px;
}

.link-c a:first-child{
  margin-left: 45px;
}

.link-a .link-ul a:last-child{
  width: 168px !important;
}

.link-c a:hover p{
  color: #00a1d6;
}

.international-footer .partner .pic-box {
  width: 100px;
  margin-right: 20px;
}

.international-footer .partner .pic-box .pic{
  width: 96px;
  height:  75px;
}

.international-footer .partner .pic962110 {
  margin: 5px 0;
  width: 100px;
  height: 40px;
}

.international-footer .partner {
  display: flex;
  padding-top: 40px;
  color: #999;
}

.international-footer .partner p {
  margin-bottom: 8px;
}

.international-footer .partner .sprite {
  display: inline-block;
  background-image: url(../images/hz_icon.png);
  background-repeat: no-repeat;
  vertical-align: middle;
  margin-right: 3px;
}

.international-footer .partner .sprite.bg1 {
  width: 16px;
  height: 16px;
  background-position: 0 -2px;
}

.international-footer .partner .sprite.bg2 {
  width: 18px;
  height: 20px;
  background-position: -41px 0px;
}

.international-footer .partner .sprite.bg3 {
  width: 16px;
  height: 16px;
  background-position: -18px -3px;
}

.international-footer .partner a {
  color: #999;
}

.international-footer .partner a:hover{
  color: #00a1d6;
}