body {width: 100%;}
video::-webkit-media-controls {
  display:none !important;
}
/* common */
.wrapper {
  width: 100%;
  height: 100vh;
  background: #111;
  position: relative;
}
h1 {
  font-size: 24px;;
}
h2 {
  font-size: .28rem;
  color: #fff;
  line-height: 1;
}
iframe {width: 100%; min-height: 3.6rem; border: none; margin: 0 auto;}
.overhidden {
  overflow: hidden;
}
.sjx-icon {
  border-left: .06rem solid transparent;
  border-right: .06rem solid transparent;
  border-top: .08rem solid #b0b0bf;
  margin-left: .06rem;
}
.jiaobiao {
  position: absolute;
  right: 0;
  top: -.04rem;
  opacity: .8;
  font-size: .5rem;
}
.nopay-masking {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-size: cover;
  background-position: center;
  -webkit-filter: blur(8px);
          filter: blur(8px);
}
.nopay-masking-p {
  font-size: .32rem;
  color: #000;
  position: absolute;
  left: 50%;
  text-align: center;
  top: 50%;
  margin: -.4rem 0 0 -1.12rem;
  font-weight: 700;
  text-shadow: 0 .02rem #fff, .02rem 0 #fff, -.02rem 0 #fff, 0 -.02rem #fff;
}
.filterblur {
  -webkit-filter: blur(8px);
          filter: blur(8px);
}
/* floor */
.swiper-container-all {
  width: 100%;
  height: 100vh;
}
.floor1, .floor2 {position: relative; height: 100%;}
.floor2 {overflow: auto; -webkit-overflow-scrolling: touch; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;}
.pull-tip {
  width: 2.81rem;
  height: .48rem;
  position: absolute;
  left: 50%;
  top: 0;
  margin-left: -1.4rem;
  z-index: 2;
  background-image: url(/images/live/pull-tip.png);
  transition: all .3s;
  transform-origin: center;
}
.pull-tip.ani {
  -webkit-transform: scaleX(0);transform: scaleX(0);
}
.pull-icon {
  width: 100%;
  height: 50%;
  position: absolute;
  left: 0;
  bottom: .3rem;
  background-size: 2.36rem 1.44rem;
  background-repeat: no-repeat;
  background-image: url(/images/live/pull-icon.jpg);
  background-position: bottom;
}
.floortip-masking {
  background-image: url(/images/live/floor-tip.png);
  background-size: 2.34rem 2.09rem;
  background-position: 70% 5%;
  background-repeat: no-repeat;
}
/************************ 头图 ************************/
.banner {
  width: 1280px;
  margin:0 auto;
  color: #fff;
  font-weight: 700;
  text-align: center;
  position: relative;
 
  font-size: 0;
  overflow:hidden;
  line-height: 1;
 
}
.banner.noimg {
  padding: .78rem .68rem;
  background-image: url(/images/live/banner-bg.png);
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 100% 3.52rem;
  font-size: .48rem;
  line-height: .68rem;
}
.banner-link {
	float:left;
}
.container-banner {
  width: 100%;
}
.wrapper-banner {
  -webkit-box-align: center;-ms-flex-align: center;align-items: center;
}
.wrapper-banner img{
   
}
.pagination-banner {
  width: 100%;
  left: 0;
  bottom: .2rem;
}
.swiper-pagination-bullet {
  background: #fff;
  opacity: .5;
  margin: 0 .06rem;
}
.swiper-pagination-bullet-active {
  background: #e53d00;
  opacity: 1;
}
.banner-tip2 {
  width: 100%;
  height: .9rem;
  background:-webkit-linear-gradient(rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 100%);
  background:-o-linear-gradient(rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 100%);
  background:linear-gradient(rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 100%);
  position: absolute;
  left: 0;
  bottom: 0;
  color: #fff;
  font-size: .24rem;
  padding: 0 .3rem;
  z-index: 2;
}
.banner-tip2 .iconfont {
  font-size: .24rem;
}
/************************ 详情 ************************/
.detail {
	 width:500px;
  float:right;
  text-align:left;
  position:relative;
}
.detail-title h1 {
  line-height:30px;;
  font-size:24px;
  color: #fff;
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  margin-bottom:30px;
  
}
.checklang {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  min-width: .87rem;
  border: .02rem solid #fff;
  border-radius: .02rem;
  overflow: hidden;
}
.checklang span {
  width: 50%;
  color: #fff;
  text-align: center;
}
.checklang span.active {
  background-color: #E53D00;
  color: #fff;
}
.icon-detail {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  margin-left: .2rem;
  color: #fff;
  font-size: .36rem;
}

.detail-title{ margin-top:50px;}
.detail-count {
  font-size: 16px;
  color: #fff;
  line-height: 22px;
  margin-bottom:20px;
 
 
}
.detail-count > span:nth-child(1) {
  font-size: 20px;

  color: #FC3B12;
}
.detail-content {
 
}
.detail-content__t {
  font-size: .26rem;
  font-weight: 300;
  color: #fff;
}
.detail-content__t:not(:first-child){
 
}
.detail-content__t .iconfont {
  font-size: .24rem;
  padding: .04rem 0 0;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
}
.detail-content__t span:nth-child(1) {
  width: 80px;
  font-size:14px;;
  margin-bottom:10px;
  word-break: break-all;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
}
.detail-content__t span:nth-child(2) {
   
  font-size:14px;
  word-break: break-all;
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
/************************ 嘉宾 ************************/
.guest {
  width: 100%;
  padding: 0 0 .44rem .28rem;
}
.guest-wrapper {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.guest-item {
  width: 2.08rem;
  margin: 0 .48rem 0 0;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
}
.guest-item--small {
  width: 1.28rem;
}
.guest-item__avator {
  width: 100%;
  height: 1.28rem;
  border: .02rem solid #000;
  border-radius: .2rem;
  background-size: cover;
  background-position: center;
}
.guest-item__name {
  font-size: .28rem;
  line-height: .39rem;
  color: #fff;
  margin: .16rem 0 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  width: 100%;
  text-align: center;
}
.guest-item__title {
  font-size: .22rem;
  line-height: .31rem;
  color: #9898A6;
  font-weight: 400;
  margin: .06rem 0 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  width: 100%;
  text-align: center;
}
/* 视频 */
.video-live {
  padding: .36rem .28rem .52rem;
  border-top: .01rem solid #3D3D4D;
}

.video-box {
  margin: .26rem 0 0;
  height: auto;
  width: 100%;
  position: relative;
}
.video-box video {
  position: relative;
  z-index: 8;
}
.wxapp-qr {
  width: 3rem;
  height: 3rem;
}
.wxapp-img {
  width: 100%;
}
.wxapp-tip {
  font-size: .28rem;
  font-weight: 600;
  margin: .4rem 0 0;
}
.floor1 .video-1 {
  max-height: 100% !important;
  height: auto !important;
}
.floor1 video {
  max-height: 10.72rem;
  max-width: 100%;
}
.floor1 canvas {
  position: absolute;
  z-index: -2;
}
/* 导航 */
.nav {
	width:1280px;
	margin:0 auto;
  
  position: relative;
}
 
.nav-1 {
  position: relative;
}
.nav-1-content {
  width: 5.4rem;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.nav-1-content__item {
  color: #b0b0bf;
  font-size: 18px;
  padding: 20px 0 14px;
  margin-right: 32px;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  position: relative;
}
.nav-1-content__item.active {
  color: #fff;
}
.nav-1-content__item.active::after {
  content: '';
  width: 36px;
  height:6px;
  background-color: #e53d00;
  position: absolute;
  left: 50%;
  bottom: 0;
  margin-left: -18px;
}
.nav-1-content__update {
  position: absolute;
  right: -12px;
  top: 20px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #eb3748;
}
.nav-1-sort {
  position: absolute;
  right: 0;
  top: .18rem;
}
.nav-1-sort__item {
  height: .52rem;
  padding: 0 .2rem;
  border-radius: .3rem;
  border: .02rem solid #757580;
  color: #b0b0bf;
  position: relative;
}
.sort-item__list {
  width: 100%;
  background-color: #111;
  -webkit-box-shadow: 0 -.04rem 0.4rem rgba(0,0,0,.3);
          box-shadow: 0 -.04rem 0.4rem rgba(0,0,0,.3);
  padding: .2rem .1rem;
  text-align: center;
  position: absolute;
  left: 0;
  top: 150%;
  z-index: 100;
}

.sort-item__list::before {
  content: '';
  width: 0;
  border-left: .06rem solid transparent;
  border-right: .06rem solid transparent;
  border-bottom: .14rem solid #111;
  position: absolute;
  bottom: 100%;
  right: .2rem;
}
.sort-item__list li {
  padding: .1rem 0;
}
.nav-sort__cur {
  font-size: .24rem;
  text-align: center;
}
.nav-2 {
  width: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.nav-2__item {
  color: #9898a6;
  font-size: .28rem;
  font-weight: 400;
  margin-right: .48rem;
  padding: .2rem 0 .28rem;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
}
.nav-2__item.active {
  color: #FF5314;
}
/************************ 图片 ************************/
.photo {
	width:1280px;
	margin:0 auto;
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
}
.photo.float {
  padding: .8rem 0 0 0;
}
.pic-loading {
  display: block;
  margin: 0 auto;
  height: .8rem;
  -webkit-animation: ani-rotates 1s infinite;
          animation: ani-rotates 1s infinite;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.pic-loading.hide {
  height: 0;
  margin: 0 auto;
  -webkit-animation: none;animation: none;
}
.pic-wait {
  margin: 1.5rem auto;
}
.pic-wait__img {
  width: 3.65rem;
  height: 1.77rem;
  background-image: url(/images/live/wait1.png);
  background-size: 100% 100%;
}
.pic-wait__word {
  color: #fff;
  margin-top: .18rem;
  font-size: .3rem;
}
.pic-loading__top {
  margin: 0 auto .2rem;
}
.pic-nomore {
  width: 100%;
  font-size: .28rem;
  color: #ccc;
  opacity: .5;
  padding: .5rem 0 .2rem;
  text-align: center;
}
.pic-no {
  margin: 2rem auto;
  text-align: center;
  color: #b0b0bf;
  font-style: italic;
  font-size: .28rem;
}
.pic-container {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.pic-container__waterfall {
  width: 100%;
}
.waterfall-container__left {
  width: 3.72rem;
  float: left;
}
.waterfall-container__right {
  width: 3.72rem;
  float: right;
}
.pic-container__tiled {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-line-pack: start;
      align-content: flex-start;
}
.pic_item {
  width: 100%;
  margin: .06rem 0 0 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  -webkit-transition: all .5s;
  transition: all .5s;
  background-color: rgba(204, 204, 204, 1);
  position: relative;
}
.picItem {
  overflow: hidden;
}
.pre {
  background-image: url(/images/live/pre.gif);
  background-position: center !important;
  background-size: 50% auto !important;
}
.tiled_item {
  
  width: 270px;
  height: 270px;
  background-size: cover;
  background-position: center;
  -webkit-transition: all .5s;
  transition: all .5s;
  background-color: rgba(204, 204, 204, 1);
}
.all .tiled_item{-webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;}
		  
.all .tiled_item:not(:nth-child(4n)) {
  margin: 15px 15px 0 0;
}
.timeLine .tiled_item:not(:nth-child(3n)) {
  margin: 15px 15px 0 0;
}
.picSelect {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  border: .04rem solid transparent;
}
.picSelect.selected {
  border: .04rem solid #e53d00;
}
.picSelect.unselected {
  background: rgba(17, 17, 17, .7);
  border: none;
}
.picSelect.unselectedw {
  background: rgba(255, 255, 255, .7);
  border: none;
}
.select-tag {
  width: .4rem;
  height: .4rem;
  background: rgba(0, 0, 0, 0.6);
  position: absolute;
  left: -.02rem;
  top: -.02rem;
  border: .01rem solid rgba(255, 255, 255, .6);
}
.select-tag.selected {
  background: #e53d00 url(/images/live/gou-w-icon.png) center no-repeat;
  background-size: .28rem .28rem;
  border: none;
}
.gifSign {
  width: .72rem;
  height: .36rem;
  position: absolute;
  left: 0;
  top: 0;
}
.picType1 {
  height: 2.47rem;
}
.picType2 {
  height: 3.7rem;
}
.picType3 {
  height: 5.55rem;
}
/* 图文 */
.imgText-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-line-pack: start;
  align-content: flex-start;
}
.text_item {
  width: 100%;
  padding: .38rem .28rem .1rem;
}
.icon-yuandian {
  font-size: .28rem;
  color: #e53d00;
}
.imageText-title {
  color: #fff;
  font-size: .28rem;
  margin-left: .1rem;
  word-break: break-word;
}
.imageText-word {
  color: #c0c5ca;
  line-height: .36rem;
  font-weight: 300;
  margin: .16rem 0 .12rem;
  word-break: break-word;
}
.imageText-time {
  font-size: .2rem;
  color: #808080;
  font-weight: 300;
  line-height: 1;
}
.area-one {
   
  margin: 0 !important;
  max-width: none;
}
.area-two {
  max-width: 50%;
  height: 270px;
}
.area-two:not(:nth-of-type(odd)) {
  margin: 0;
}
.area-two:not(:nth-of-type(even)) {
  margin: 0 .06rem 0 0;
}
/*时间线*/
.timeLine-one {
  width: 100%;
  position: relative;
  -webkit-transition: all .1s;
  transition: all .1s;
}
.timeLine-one.mb {
  margin-bottom: 20px;
}
.timeLine-one:first-child .timeLine-one-outer {
  margin-top: .28rem;
}
.timeLine-one:last-child .timeLine-one-inner {
  height: 0;
}
.timeLine-one-inner {
  width: .02rem;
  height: 100%;
  left: .396rem;
  background-color: rgba(255, 255, 255, .16);
  position: absolute;
  top: .01rem;
  z-index: -1;
}

.timeLine-one-outer {
  width: 100%;
  position: relative;
  z-index: 2;
}
.timeLine-title {
  padding: 0 .28rem 0;
  line-height: 0;
}
.timeLine-dot {
  font-size: .28rem;
  position: relative;
  margin: 0 .1rem 0 0;
}
.timeLine-line {
  width: .01rem;
}
.timeLine-time {
  color: #fff;
  line-height: 1.1;
}
.timeLine-shrink {
  margin: 0 0 0 .12rem;
  -webkit-transition: all .2s ease;
  transition: all .2s ease;
  font-size: .24rem;
  color: #fff;
  -webkit-transform: rotateZ(90deg);
          transform: rotateZ(90deg);
}

.timeLine-shrink.active {
  -webkit-transform: rotateZ(0deg);
          transform: rotateZ(0deg);
}
.timeLine-picbox {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-line-pack: start;
      align-content: flex-start;
  padding: .18rem .2rem .44rem .6rem;
  position: relative;
  z-index: 2;
}
/* 视频 */
.media .pic-container {
  padding: 0 .3rem .9rem;
}
.media-item {
  width: 100%;
  padding: 0 0 .3rem;
}
.media-item:not(:last-child) {
  border-bottom: .01rem solid #3d3d3d;
}
.media-description {
  color: #fff;
  margin-top: .2rem;
  align-self: flex-start;
}
.video-size-letterbox {
  height: 3.5rem !important;
  overflow: hidden;
}
.video-js .vjs-big-play-button {
  width: 1.8rem !important;
  height: 1.8rem !important;
  border: none !important;
  margin-left: -.9rem !important;
  margin-top: -.9rem !important;
  background-color: transparent !important;
  background-image: url(/images/live/play-icon.png);
  background-size: contain;
}
.video-js .vjs-big-play-button:before{
  display: none;
}
.video-down {
  width: 1.6rem;
  height: .44rem;
  margin: .1rem 0 0;
  border: .5px solid #DDDDDD;
  border-radius: .2rem;
  color: #9898A6;
}
.video-down .iconfont {
  color: #9898A6;
  font-size: .3rem;
}
/*热门*/
.hot-item-big {
  width: 100%;
  min-height: 3.7rem;
  position: relative;
}
.hot-item-big img:nth-child(1) {
  width: 100%;
}
.hot-item-small {
  max-width: 50%;
  min-width: 45%;
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
  height: 3.71rem;
  display: inline-block;
  font-size: 0;
  background-color: rgba(204, 204, 204, 0.3);
  background-size: cover;
  background-position: center;
  position: relative;
}
.hot-item {
  margin: .1rem 0 0 0;
  font-size: 0;
  opacity: 1;
  -webkit-transition: opacity .4s;
  transition: opacity .4s;
}
.hot-item-small:nth-child(2n) {
  margin: .1rem 0 0 .1rem;
}
.no-sign-big {
  width: 1.12rem;
  height: .64rem;
  background-color: #e53d00;
  color: #fff;
  position: absolute;
  left: 0;
  top: -.04rem;
  font-size: .5rem;
}
.no-sign-big span {
  font-size: .36rem;
}
.no-sign-small {
  width: .6rem;
  height: .56rem;
  background-color: #e53d00;
  color: #fff;
  position: absolute;
  left: 0;
  top: -.04rem;
  font-size: .44rem;
}
.bigNoTag-big,
.bigNoTag-small {
  background-color: #e53d00;
  color: #fff;
  z-index: 999;
  position: absolute;
  left: .4rem;
  top: .84rem;
}
.bigNoTag-big {
  width: 1.12rem;
  height: .64rem;
  font-size: .5rem;
}
.bigNoTag-big span {
  font-size: .36rem;
}
.bigNoTag-small {
  width: .6rem;
  height: .56rem;
  font-size: .44rem;
}
/*评论*/
.discuss {
  padding: 0 0 0rem;
  position: relative;
}
.discuss-item {
  width: 100%;
  padding: .28rem .32rem .34rem;
  border-bottom: .01rem solid #3D3D4D;
}
.discuss-item.last {
  border-bottom: .01rem solid transparent;
}
.discuss-item__avator {
  width: .8rem;
  height: .8rem;
  border-radius: 50%;
  overflow: hidden;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  background-color: #ccc;
}
.discuss-item__avator img {
  width: 100%;
}
.discuss-item__detail {
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
  margin: .24rem 0 0 .25rem;
  padding: 0;
}
.discuss-item__name {
  font-size: .28rem;
  color: #fff;
}
.discuss-item__content {
  color: #b0b0bf;
  font-size: .26rem;
  line-height: 1.4;
  margin-top: .14rem;
  word-break: break-all;
}
.discuss-item__other {
  margin-top: .14rem;
}
.discuss-item__time {
  color: #757580;
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
}
.discuss-item__like {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
}
.discuss-item__likecount {
  font-size: .28rem;
  color: #fff;
  margin-right: .1rem;
  line-height: 1;
}
.discuss-item__likecount.like {
  color: #e53d00;
}
.discuss-item__likeicon {
  font-size: .26rem;
  color: #fff;
}
.discuss-item__likeicon.icon-dianzanhou {
  color: #e53d00;
}
.discuss-item__like.icon-dianzanhou {
  color: #e53d00;
}

/************************ 广告 ************************/
.advertisement {
  padding: 0 0 1rem;
}
.advertisement.jh  {
  padding: 0 0 2rem;
}
.ad-guest,
.ad-photoplus,
.ad-service {
  width: 100%;
  margin: .88rem 0 0 0;
  padding: 0 .4rem;
}
.ad-title {
  margin: 0 0 .38rem 0;
}
.ad-title__content {
  font-size: .4rem;
  letter-spacing: .12rem;
  margin: 0 .26rem 0 .4rem;
  color: #d5d5d5;
  font-weight: 700;
  text-align: center;
  position: relative;
}
.ad-title__content::after,
.ad-title__content::before {
  content: '';
  width: 0;
  border-left: .06rem solid transparent;
  border-right: .06rem solid transparent;
  border-top: .12rem solid #d5d5d5;
  position: absolute;
  left: -.5rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.ad-title__content::after {
  left: unset;
  right: -.4rem;
}
.cusLogoImg {
  width: 100%;
}
.ad-content {
  font-size: .28rem;
  font-weight: lighter;
  line-height: .48rem;
  color: #ccc;
  margin: 0 0 .44rem 0;
  text-align: center;
}
.cusWebSite {
  margin: .24rem 0 0 0;
  width: 100%;
  height: .9rem;
  font-size: .3rem;
  background: #222;
  color: #d5d5d5;
  border: 1px solid tranparent;
}
.download {
  width: 100%;
  margin: .26rem 0 0;
}
.download-img {
  width: 3.65rem;
  height: 2.81rem;
  background-size: contain;
}

.download-button {
  border: 1px solid #fff;
  width: 4.32rem;
  height: .9rem;
  font-size: .32rem;
  font-weight: 600;
  color: #fff;
  margin: .24rem 0 0;
}
.download-icon {
  color: #fff;
  font-size: .24rem;
  margin-right: .1rem;
}

/************************ logo ************************/
.logo {
  width: 100%;
  height: .6rem;
  
  background-size: 100% auto;
  background-position: center bottom;
  background-repeat: no-repeat;
  padding: 1rem 0 0 0;
}
.logo-position {
  position: absolute;
  bottom: 0;
  left: 0;
}
/************************ 弹窗 ************************/
/* 公共 */
.masking, .password-masking, .main-masking, .guide-masking, .floortip-masking {
  width: 100%;
  height: 100%;
  background-color: #111;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}
.masking {
  z-index: 10002;
}
.password-masking {
  z-index: 10001;
}
.guide-masking {
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 9996;
}
.floortip-masking {
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 9995;
}
.close {
  position: absolute;
  right: .3rem;
  top: .3rem;
  color: #fff;
  font-size: .36rem;
  padding: 0 0 .3rem .3rem;
}
.swiper-masking, .guest-container, .sponsor-container, .mes-container, .find-container, .jh-container,
.puzzle-type-wrapper, .puzzle-haibao-wrapper, .ninegrid-wrapper, .diyninegrid-wrapper, .find-choose-container, .video-down-wrapper {
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background: rgba(0, 0, 0, 0.9);
  z-index: 999;
}
.video-down-wrapper {
  z-index: 1001;
}
.guest-container, .sponsor-container {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.find-container {
  background: rgba(255, 255, 255, 1);
}
.jh-container {
  background: rgba(0, 0, 0, 0.7);
  z-index: 995;
}
.ninegrid-wrapper {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.diyninegrid-wrapper {
  background: rgba(0, 0, 0, 1);
  width:100%; height: 100%; position:fixed; left:0; top:0; z-index:10001;
}

/* loading页 */
.pageLoading {
  width: .88rem;
  height: .88rem;
}
.pageLoading-bg {
  width: 7.32rem;
  height: 4.49rem;
  background-image: url(/images/live/loading-bg.png);
  background-size: contain;
  margin: 1.56rem auto 0;
}
.pageLoading-word {
  width: 4.26rem;
  height: 1.19rem;
  background-size: contain;
}
.pageLoading.ad {
  position: absolute;
  left: 50%;
  bottom: 1.6rem;
  margin-left: -0.44rem;
}
.ani-rotate {
  -webkit-animation: ani-rotates 1s infinite;
          animation: ani-rotates 1s infinite;
}
.ani-rotate-linear {
  -webkit-animation: ani-rotates 2s linear infinite;
          animation: ani-rotates 2s linear infinite;
}
@-webkit-keyframes ani-rotates {
  0% {
    -webkit-transform: rotateZ(0);
            transform: rotateZ(0);
  }
  100% {
    -webkit-transform: rotateZ(1turn);
            transform: rotateZ(1turn);
  }
}
@keyframes ani-rotates {
  0% {
    -webkit-transform: rotateZ(0);
            transform: rotateZ(0);
  }
  100% {
    -webkit-transform: rotateZ(1turn);
            transform: rotateZ(1turn);
  }
}
/* 密码页 */
.password-wrapper {
  width: 6.7rem;
  background: #fff;
  padding: .52rem .4rem;
}
.password-wrapper h3 {
  font-size: .34rem;
  font-weight: 700;
  line-height: .34rem;
  margin: 0 0 .56rem;
}
.common-input {
  width: 100%;
  height: .9rem;
  border: .01rem solid #cad1d6;
  background: #f6f8fa;
  padding: 0 .22rem;
}
.common-input-icon {
  width: .44rem;
  height: .44rem;
  background-size: 100% 100%;
  margin: 0 .22rem 0 0;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
.input-icon-password {
  font-size: .36rem;
}
.common-input > input {
  height: 100%;
  font-size: .3rem;
  font-weight: 700;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
}
.common-button {
  width: 100%;
  height: .9rem;
  background-color: #e53d00;
  color: #fff;
  font-size: .32rem;
  font-weight: 700;
  margin: .24rem 0 0;
}
.common-button.active {
  background-color: #c0c5c9;
}
/* 主视觉页 */
.main-view-wrapper {
  width: 100%;
  height: 100%;
  position: relative;
}
.main-view {
  width: 100%;
  overflow: hidden;
  background-size: 100% auto;
  background-position: top center;
  background-repeat: no-repeat;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
}
.main-view.ani {
  -webkit-animation: mainViewAni 3s ease 1s 1;
          animation: mainViewAni 3s ease 1s 1;
}
@-webkit-keyframes mainViewAni {
  0% {
    background-position: top center;
  }
  40%, 60% {
    background-position: bottom center;
  }
  100% {
    background-position: top center;
  }
}
@keyframes mainViewAni {
  0% {
    background-position: top center;
  }
  40%, 60% {
    background-position: bottom center;
  }
  100% {
    background-position: top center;
  }
}
.main-view.modify {
  background-size: cover;
  background-position: top center;
}
.main-view-enter {
  width: 3rem;
  height: .9rem;
  background:rgba(245,245,250,.5);
  -webkit-box-shadow:0px 0px 10px 0px rgba(152,152,166,1);
          box-shadow:0px 0px 10px 0px rgba(152,152,166,1);
  border-radius: .45rem;
  position: absolute;
  left: 50%;
  margin-left: -1.5rem;
  bottom: .6rem;
}
.main-view-enter span {
  color: #333;
  font-size: .32rem;
}
.main-view-enter-icon {
  font-size: .34rem;
  color: #fff;
  margin: 0 0 0 .16rem;
  display: none;
}
.main-view-interval {
  width: .72rem;
  height: .72rem;
  border-radius: 50%;
  position: absolute;
  right: .4rem;
  top: .4rem;
  background: rgba(26, 26, 26, 0.4);
  color: #fff;
  font-size: .32rem;
  font-weight: 700;
}
/* 引导页 */
.guide-content {
  width: 5.8rem;
  height: 8.52rem;
  background-image: url(/images/live/tipnew1.png);
  background-size: 100% 100%;
  position: relative;
}
.guide-content.en {
  background-image: url(/images/live/tipnew1-en.png);
}
.guide-close {
  right: .12rem;
  top: -.56rem;
}

/* 悬浮功能按钮 */
.pos-box {
  position: fixed;
  bottom:1rem;
  right:0.12rem;
  z-index: 99;
}
.pos-box__button {
  width: 1rem;
  height: 1rem;
  background-color: rgba(51, 51, 51, 0.8);
  color: #fff;
  border-radius: 100%;
  -webkit-box-shadow: 0 0 .5rem rgba(0, 0, 0, 0.2);
          box-shadow: 0 0 .5rem rgba(0, 0, 0, 0.2);
}
.pos-box a:not(:first-child) {
  margin-top: .4rem;
}
.pos-box .iconfont {
  margin-bottom: .04rem;
  font-size: .36rem;
}
.pos-box span {
  -webkit-transform: scale(.7);
          transform: scale(.7);
}
/* 大图预览页 */
.swiper-masking {
  background: none;
}
.imgShowTip{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 7.5rem;
  height: 1.4rem;
  z-index: 99;
}
.modalClose {
  color: #fff;
  font-size: .36rem;
  position: absolute;
  right: .3rem;
  top: .3rem;
  padding: .2rem;
  background-color: rgba(0, 0, 0, 0.15);
  border-radius: 50%;
}
.slide_zoom_container{
  width: 7.5rem;
  -webkit-user-drag: none;
}
.big_img_slide{
  width: 100%;
  -webkit-user-drag: none;
}
.imgShowSwiper{
  width:100%;
  height:100%;
  background-color:#000;
}
.imgShowSwiper .swiper-slide {
  height: 100%;
  background:url(/images/live/load2.gif) no-repeat center;
  background-size: .9rem;
}
.modal_footer{
  width: 100%;
  padding: 1.5rem .4rem 0;background:-webkit-gradient(linear,left top, left bottom,from(rgba(0,0,0,0)),color-stop(rgba(0,0,0,0.5)),to(rgba(0,0,0,1)));background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,0.5),rgba(0,0,0,1));
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 999;
}
.pic-mes-box {
  padding: .12rem 0 .2rem;
  border-bottom: .5px solid rgba(255, 255, 255, 0.2);
}
.pic-mes-box p {
  font-size: .24rem;
  color: #fff;
  opacity: .8;
  display: -webkit-box;display: -ms-flexbox;display: flex;
}
.pic-name {
  margin-bottom: .1rem;
}
.pic-name span {
  max-width: 4rem;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pic-operate-box {
  height: .9rem;
  position: relative;
  padding: .1rem 0 0;
}
.pic-operate-box p {
  font-size: .24rem;
  color: #fff;
  -webkit-transform: scale(.8);transform: scale(.8);
}
.singleShare, .like, .reward, .haibao, .originPic, .dayin {
  color: #fff;
  font-size: .36rem;
}
.reward {font-size: .54rem; line-height: .9;}
.originPic {font-size: .4rem;}
.like {font-size: .38rem;}
.dayin {font-size: .44rem;}
.like-box, .reward-box {
  width: 1rem;
  position: absolute;
  top: -1.3rem;
  right: -.3rem;
}
.like-box--out {
  width:1rem;
  height:1rem;
  background:rgba(0, 0, 0, .3);
  border-radius: 50%;
  position: absolute;
  bottom: .04rem;
  right: .02rem;
}
.like-box--out p {
  font-size: .24rem;
  color: #fff;
}
.reward-box {
  top: -2.4rem;
}
.haibao-box, .originPic-box, .singleShare-box {
  height: .76rem;
}
.originPic-box {
  margin-left: -.3rem;
}
.like-ani {
  color: #e53d00;
  -webkit-animation: ilike .8s ease-in forwards;
          animation: ilike .8s ease-in forwards;
}
@-webkit-keyframes ilike {
  0% {-webkit-transform: scale(1);transform: scale(1);}
  30% {-webkit-transform: scale(1.3);transform: scale(1.3);}
  100% {-webkit-transform: scale(1);transform: scale(1);}
}
@keyframes ilike {
  0% {-webkit-transform: scale(1);transform: scale(1);}
  30% {-webkit-transform: scale(1.3);transform: scale(1.3);}
  100% {-webkit-transform: scale(1);transform: scale(1);}
}
/* 主办方嘉宾介绍页 */
.sponsor-content,
.guest-content {
  width: 6rem;
  position: absolute;
  left: 50%;
  top: 0;
  -webkit-transform: translate3d(-50%, 0, 0);
          transform: translate3d(-50%, 0, 0);
  padding: 2rem 0 1rem;
}
.sponsor-imgBg {
  width: 4.7rem;
  overflow: hidden;
  background-image: url(/images/live/sectionbg.png);
  background-size: .08rem .08rem;
}
.guest-imgBg {
  width: 4.7rem;
}
.sponsor-img {
  width: 100%;
}
.guest-img {
  width: 100%;
}
.sponsor-name,
.guest-name {
  font-size: .38rem;
  font-weight: 700;
  color: #fff;
  line-height: .38rem;
  text-align: center;
  margin: .5rem 0 0 0;
}
.sponsor-describe,
.guest-describe {
  max-width: 100%;
  word-break: break-all;
  font-size: .26rem;
  color: #808080;
  line-height: .4rem;
  text-align: justify;
  margin: .17rem 0 0 0;
}
.sponsor-qrcode,
.guest-qrcode {
  width: 1.94rem;
  height: 1.94rem;
  margin: .39rem 0 0 0;
}
.guest-qrcode img {
  width: 100%;
  height: 100%;
}
.qrcode {
  width: 100%;
  height: 100%;
}
.sponsor-link,
.guest-link {
  font-size: .3rem;
  margin: .16rem 0 0 0;
  color: #ccc;
}
/* 活动详情介绍页 */
.mes-content {
  width: 100%;
  height: 100%;
  padding: .92rem .4rem .4rem;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.mes-title {
  max-width: 6rem;
  font-size: .42rem;
  font-weight: 700;
  color: #fff;
  line-height: 1;
  margin: 0 0 .66rem 0;
}

.mes-one {
  font-size: .28rem;
  color: #fff;
  margin: 0 0 .22rem;
}

.mes-one span {
  width: 1.84rem;
  padding: 0 .2rem 0 0;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  line-height: .5rem;
  word-break: break-all;
}
.mes-one p {
  font-weight: 300;
  word-break: break-all;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  line-height: .5rem;
}
.mesimg-container i {
  font-size: .32rem;
}
.mesimg-container span {
  font-size: .32rem;
  margin-left: .2rem;
}
.mesimg-container img {
  width: 100%;
}
/*找自己提示页*/
.find-container p {
  font-size: .36rem;
  color: #333;
  font-weight: 700;
  line-height: 1.4;
}
.find-example, .number-example {
  width: 6.72rem;
  height: 5rem;
  margin: .76rem 0 .52rem 0;
  background-image: url(/images/live/find-example.png);
  background-size: 100% 100%;
  -webkit-box-flex: 0;-ms-flex: none;flex: none;
}
.number-example {
  margin: 0 0 .72rem;
  background-image: url(/images/live/hmsb.png);
}
.number-input {
  width: 6.3rem;
  border: .02rem solid #ddd;
  height: .9rem;
  background-color: #f5f5fa;
  padding: 0 .4rem;
}
.number-input input {
  width: 100%;
  height: 100%;
  font-size: .36rem;
  color: #9898a6;
}
.find-container .find-tips {
  color: #6b6d70;
  font-size: .24rem;
  font-weight: 300;
  line-height: .4rem;
  padding: 0 .6rem
}
.find-container .find-tips>span {
  color: #333;
  font-weight: 700;
}
.find-button {
  width: 6.3rem;
  height: .88rem;
  background-color: #333;
  color: #fff;
  font-size: .32rem;
  font-weight: 700;
  margin: .46rem 0 .26rem 0;
  position: relative;
  -webkit-box-flex: 0;-ms-flex: none;flex: none;
}
.find-button > input {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}
.find-container .find-sure {
  font-size: .2rem;
  color: #6b6d70;
  font-weight: 300;
  line-height: 1;
}
.find-type-box {
  width: 6.7rem;
  padding: .6rem 0 .9rem;
  background: #fff;
  position: relative;
}
.find-type-box .iconfont {
  color: #333;
}
.find-type-box p {
  color: #3d3d4d;
  font-size: .32rem;
}
.find-type-box__bottom {
  margin: .8rem 0 0;
}
.find-type-bottom__item img {
  width: 2rem;
}
.find-type-bottom__item:nth-child(2) {
  margin-left: 1.1rem;
}
.find-type-bottom__item span {
  color: #3d3d4d;
  font-size: .26rem;
  margin-top: .28rem;
}
/* 合辑页 */
.jh-button {
  position: fixed;
  bottom: 1rem;
  left: 50%;
  margin-left: -.5rem;
  z-index: 996;
  color: #fff;
}
.jh-button.active {
  background-color: #3F3F3F;
}
.jh-button__1 .iconfont{
  margin-bottom: .04rem;
  font-size: .34rem;
}
.jh-button__1 span {
  -webkit-transform: scale(.7);
          transform: scale(.7);
}
.jh-button__2 .iconfont{
  font-size: .24rem;
}
.jh-container {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 995;
}
.jh-container-inner {
  width: 100%;
  height: 8.6rem;
  background-color: #222;
  position: absolute;
  top: 100%;
  left: 0;
  padding: .6rem .32rem 0;
  -webkit-transition: -webkit-transform .2s ease;
  transition: -webkit-transform .2s ease;
  transition: transform .2s ease;
  transition: transform .2s ease, -webkit-transform .2s ease;
}
.jh-container-inner.active {
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
}
.jh-container-inner > h2 {
  font-size: .4rem;
  color: #fff;
  line-height: 1;
  font-style: normal;
  font-weight: 700;
}
.jh-container-inner > a {
  font-size: .3rem;
  line-height: .32rem;
  color: #e53d00;
  margin: .31rem 0;
}
.jh-container-inner > a > .icon-gengduo {
  font-size: .3rem;
}
.jh-box {
  width: 100%;
  padding: .24rem 0 1.8rem;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: start;
      align-content: flex-start;
  -ms-flex-wrap: wrap;flex-wrap: wrap;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
}
.day_btn{
  min-height: 1rem;
  -ms-flex-item-align: start;align-self: flex-start;
  position: relative;
  width: 100%;
  padding: .22rem 0 .22rem 0.24rem;
  margin: 0 0 0.3rem 0;
  line-height: .36rem;
  border-width: 1px;
  border-style: solid;
  text-align: left;
  border-color: #fff;
  color: #fff;
  font-size: 0.3rem;
  font-weight: 700;
  background: no-repeat center;
  background-size:cover;
}
.day_btn.grey {
  -webkit-filter: grayscale(1);filter: grayscale(1);
}
.list-item--fang {
  width: 3.34rem;
  height: 2.4rem;
  margin-bottom: .18rem;
  border:none;
  background-size: cover; background-position:center;
  background-color: rgba(204, 204, 204, 1);
  position: relative;
}
.list-item--fang:nth-child(2n) {
  margin-left: .18rem;
}
.list-item--fang.grey {
  -webkit-filter: grayscale(1); filter: grayscale(1);
}
.list-item__title {
  width: 100%;
  padding: 0 .2rem;
  color: #fff;
  line-height: .5rem;
  height: .48rem;
  background-color: rgba(0, 0, 0, .5);
  text-align: center;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  position: absolute;
  bottom: 0;
  left: 0;
}
.day_title {
  max-width: 6rem;
}
.arrow_right {
  font-size: .24rem;
  font-weight: 300;
  position: absolute;
  right: .12rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.arrow_right.active {
  color: #fff;
}
.arrow_right > .icon-gengduo {
  font-size: .36rem;
}
.jh-close {
  width: 100%;
  height: 2rem;
  background-image: url(/images/live/jh-masking.png);
  background-size: 100% 100%;
  position: absolute;
  left: 0;
  bottom: 0;
}
/* 数量统计 */
.count-wrapper {
  padding: 0 .15rem;
  height: .56rem;
  background-color: rgba(0, 0, 0, .8);
  position: fixed;
  left: 0;
  top: 2.14rem;
  z-index: 6;
  color: #fff;
  font-size: .24rem;
  border-radius: 0 .36rem .36rem 0;
}
/* 分享 */
.share, .yachang {
  position:fixed;
  top:0;
  left:0;
  display: none;
  width:100%;
  height:100%;
  z-index: 999;
  background: url(/images/live/shareguide.gif) no-repeat center;
  background-size:cover;
}
.yachang {
  background: rgba(0, 0, 0, .8);
}
.yachang img {
  width: 6.4rem;
  position: absolute;
  left: .3rem;
  bottom: .05rem;
}
/*试用*/
.try {
  width: 100%;
  height: .88rem;
  font-size: .32rem;
  position: fixed;
  bottom: 0;
  left: 0;
  background: #333;
  -webkit-box-shadow: 0px -1px 15px 0px rgba(0,0,0,0.5);
          box-shadow: 0px -1px 15px 0px rgba(0,0,0,0.5);
  color: #fff;
  z-index: 11;
}
/*局部loading*/
.loading--box {
  width: 1.3rem;
  height: 1.3rem;
  background-color: rgba(0, 0, 0, 0.9);
  border-radius: .1rem;
  position: fixed;
  left: 50%;
  top: 50%;
  z-index: 99999;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
/*评论框*/
.discuss-wrapper {
  width: 100%;
  height: 1.2rem;
  padding: 0 .32rem;
  background-color: #292929;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 12;
}
.discuss-wrapper.bottom88 {
  bottom: .88rem;
}
.discuss-input {
  height: .72rem;
  border: .01rem solid #757580;
  padding: 0 .3rem;
  background-color: #1F1F1F;
  color: #B0B0BF;
  font-size: .26rem;
  line-height: 1;
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
  border-radius: .4rem;
}
.discuss-button {
  width: 1.36rem;
  height: .72rem;
  margin-left: .23rem;
  border: .01rem solid #e53d00;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  border-radius: .4rem;
  color: #e53d00;
}
.discuss-button:active {
  opacity: .6
}
.none {
  display: none;
}

.icon-top {
  width: .7rem;
  height: .7rem;
  background-size: contain;
}
.icon-top:not(:first-child) {
  margin: .1rem 0 0;
}


.pos-top {
  right: .2rem; top: .2rem; position: fixed; z-index: 99;
  padding: 0 0.1rem;
  font-size: 0;
}
.icon-danmu {
  background-image: url(/images/live/danmu-icon-open.png);
}
.icon-danmu-guan {
  background-image: url(/images/live/danmu-icon-close.png);
}

/* 拼图类型弹窗 */
.puzzle-haibao-wrapper {
  z-index: 1000;
}
.puzzle-type-title {
  font-size: .32rem;
  color: #333;
}
.puzzle-type-box, .haibao-type-box {
  width: 6.7rem;
  padding: .62rem 0 .85rem;
  background: #fff;
  position: relative;
}
.puzzleClose {
  position: absolute;
  right: .2rem;
  top: .2rem;
  color: #333;
  font-size: .42rem;
}
.puzzle-type-box ul {
  width: 4.51rem;
  margin: .65rem 0 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.puzzle-type-box li {
  width: 2.25rem;
  height: 2.25rem;
  position: relative;
}
.puzzle-type-box li:nth-child(n+3) {
  padding-top: .2rem;
}
.puzzle-type-box li:nth-child(2n+1)::after {
  content: '';
  width: 100%;
  height: .02rem;
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #E4E4EB;
  -webkit-transform: scaleY(.5);
          transform: scaleY(.5);
}
.puzzle-type-box li:nth-child(2n+1)::before {
  content: '';
  width: .02rem;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  background-color: #E4E4EB;
  -webkit-transform: scaleX(.5);
          transform: scaleX(.5);
}
.puzzle-type-box li:nth-child(2n)::after {
  content: '';
  width: .02rem;
  height: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #E4E4EB;
  -webkit-transform: scaleX(.5);
          transform: scaleX(.5);
}
.puzzle-type-box li:nth-child(2n)::before {
  content: '';
  width: 100%;
  height: .02rem;
  position: absolute;
  bottom: 0;
  right: 0;
  background-color: #E4E4EB;
  -webkit-transform: scaleY(.5);
          transform: scaleY(.5);
}
.puzzle-type-box li div {
  height: 1.28rem;
}
.puzzle-type-box li img {
  width: .9rem;
}
.puzzle-type-box li span {
  color: #000;
  font-weight: 600;
  font-size: .28rem;
  margin: .2rem 0 0;
}
.haibao-type-box ul {
  margin: .65rem 0 0;
}
.haibao-type-box li {
  color: #000;
  font-size: .12rem;
}
.haibao-type-box li:not(:last-child) {
  margin-right: .8rem;
}
.haibao-type-box li img {
  width: 1.2rem;
  border: 1px solid #ccc;
}
.haibao-type-box li span {
  margin-top: .3rem;
  font-size: .28rem;
  font-weight: 600;
}

/* 九宫格弹窗 */
.ninegrid-wrapper {
  background: #fff;
  padding: 1.14rem .69rem 1rem;
}
.ninegrid-title {
  font-size: .32rem;
  line-height: .52rem;
  color: #3D3D4D;
  text-align: center;
}
.ninegrid-title.strong {
  font-size: .4rem;
  font-weight: 600;
}
.ninegrid-example {
  width: 3.2rem;
  margin: .5rem 0 0;
}
.ninegrid-box {
  margin: .7rem 0 .6rem;
}
.ninegrid-box ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.ninegrid-box li {
  width: 1.92rem;
  height: 1.92rem;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  -webkit-box-flex: 1;
      -ms-flex: auto;
          flex: auto;
  background-color: #ccc;
  position: relative;
  overflow: hidden;
}
.ninegrid-box li:not(:nth-child(3n)) {
  margin: 0 .18rem .18rem 0;
}
.ninegrid-box li .iconfont {
  color: #fff;
}
.ninegrid-box li .icon-add {
  font-size: .48rem;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);
  z-index: 2;
}
.ninegrid-box li .icon-dashangchenggong {
  font-size: .42rem;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);
  z-index: 2
}
.nine-yet {
  width: 1.2rem;
  height: 1.2rem;
  background-color: #fff;
  border-radius: 50%;
  position: absolute;
  right: -.6rem;
  bottom: -.6rem;
  padding: .2rem;
  z-index: 2;
}
.nine-yet .iconfont {
  color: #9898A6 !important;
  font-weight: 600;
}
.ninegrid-upload {
  width: 100%;
  padding: .45rem 0;
  margin: 0 0 .6rem;
  background-color: #333;
  color: #fff;
  font-size: .36rem;
}
.diyninegrid-area {
  width: 6rem;
  height: 6rem;
  position: relative;
}
.diyninegrid-ruler {
  width: 6.06rem;
  height: 6.06rem;
  background-image: url(/images/live/diynine.jpg);
  position: absolute;
  left: -.03rem;
  top: -.03rem;
  z-index: 1;
  pointer-events: none;
}
.diyninegrid-area .icon-add {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: .72rem;
  z-index: 2;
  pointer-events: none;
}
.diyninegrid-buttons {
  width: 6rem;
  position: absolute;
  left: .75rem;
  bottom: .22rem;
}
.diyninegrid-buttons > div{
  font-size: .32rem;
  color: #fff;
}
.diyninegrid-buttons > div.disabled{
  opacity: .4;
}
#Mavatar-wrapper {
  background-color: rgba(240, 240, 240, 0) !important;
}
/* 拼图操作按钮 */
.puzzle-operate {
  width: 100%;
  height: .88rem;
  background: rgba(51, 51, 51, .95);
  position: fixed;
  z-index: 101;
  bottom: 0;
  left: 0;
}
.puzzle-button {
  width: 50%;
  height: 100%;
  font-size: .28rem;
  color: #fff;
  position: relative;
}
.puzzle-cancel {
  font-weight: 300;
}
.puzzle-cancel::after {
  content: '';
  width: .02rem;
  height: .4rem;
  background-color: rgba(255, 255, 255, 0.2);
  position: absolute;
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.puzzle-sure i {
  width: .32rem;
  height: .32rem;
  font-size: .24rem;
  border-radius: 50%;
  background-color: #e53d00;
  color: #fff;
  margin: 0 0 0 .12rem;
  text-align: center;
  line-height: .34rem;
  font-style: normal;
}
/* 拼图结果页 */
.puzzled-result {
  width: 100%;
  height: 100%;
  background: #111;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1000;
}
.puzzled-result-content {
  width: 100%;
  height: 100%;
  font-size: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0 0 1rem;
  background-color: #000;
}
.puzzled-result-title {
  width: 100%;
  height: .84rem;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
  background: rgba(0, 0, 0, .3);
  padding: 0 0 0 .4rem;
  color: #fff;
}
.puzzled-result-title.bottom {
  top: auto;
  bottom: 0;
  padding: 0;
}
.puzzled-result-title.transparent {
  background: none;
}
.puzzled-result-title p {
  font-size: .32rem;
  font-weight: 300;
  color: #fff;
}
.puzzled-result-title span {
  font-size: .24rem;
  font-weight: 300;
}
/* .puzzled-result-hand {
  font-size: .36rem;
  margin: 0 .12rem 0 0;
} */
.puzzled-result-back {
  font-size: .32rem;
  margin: 0 .36rem 0 -.12rem;
}
.puzzled-result-close {
  position: absolute;
  right: .4rem;
  top: .26rem;
  font-size: .42rem;
  color: #fff;
  text-shadow: 1px 1px 1px #333;
}
.puzzled-img {
  width: 100%;
}
/* 拼图视频 */
.diyvideo-container {
  background-color: #000;
}
.diyvideo-content {
  width: 100%;
}
.diyvideo-container .bar-window__content {
  padding: .88rem 0 0;
}
.diyvideo-container .bar-window__name {
  font-size: .3rem;
}
.diyvideo-container .bar-window__operate {
  width: 1.4rem;
  height: .48rem;
  border-radius: .3rem;
  background-color: #e53d00;
  position: absolute;
  top: 50%;
  right: .4rem;
  font-size: .28rem;
  -webkit-transform: translateY(-50%);transform: translateY(-50%);
}
.diyvideo-container .bar-window__operate .icon-down {
  font-size: .32rem;
}
.diyvideo-container .bar-window__title .icon-fanhui {
  position: absolute;
  top: 50%;
  left: .4rem;
  -webkit-transform: translateY(-50%);transform: translateY(-50%);
  font-size: .28rem;
}
.diyvideo-container .bar-window__content {
  background-color: #000;
}
.diyvideo-container .diyvideo-video {
  width: 100%;
}
.diyvideo-container .diyvideo-music {
  width: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.diyvideo-container .diyvideo-ul {
  width: 100%;
  flex-wrap: wrap;
}
.diyvideo-container .diyvideo-music__item {
  width: 50%;
  height: 2.6rem;
  padding: 0 0 0 .74rem;
}
.diyvideo-container .diyvideo-music__post {
  width: 1.4rem;
  height: 1.4rem;
  border: .04rem solid transparent;
  border-radius: .22rem;
  background-size: cover;
  background-repeat: no-repeat;
}
.diyvideo-container .diyvideo-music__post.special {
  border: .04rem solid rgba(255, 255, 255, .3);
}
.diyvideo-container .diyvideo-music__post.special .iconfont{
  font-size: .8rem;
  color: rgba(255, 255, 255, 0.5);
}
.diyvideo-container .diyvideo-music__post.active {
  border: .04rem solid #e53d00;
}
.diyvideo-container .diyvideo-music__name {
  font-size: .28rem;
  margin: 0 0 0 .3rem;
  color: #fff;
}
.diyvideo-container .diyvideo-music__name.active {
  color: #e53d00;
}
.diyvideo-container .video-diy {
  max-height: 100% !important;
  height: auto !important;
  display: -webkit-box !important;display: -ms-flexbox !important;display: flex !important;
}
.diyvideo-container video {
  -webkit-box-flex: 1;
  -ms-flex: auto;
  flex: auto;
  max-width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.diyvideo-container video.android {
  height: 92vh !important;
}
.diyvideo-container canvas {
  position: absolute;
  z-index: -2;
}


.toast {min-width: 1rem;padding: 10px 15px;background: rgba(0, 0, 0, .8);position: fixed;left: 50%;top: 50%;z-index: 99999;border-radius: 5px;-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);font-size: .3rem;color: #fff;}
.toast p {text-align: center;}

.tanmu {  z-index: 11;}
.tanmu {  position: fixed; border-radius:.33rem; color: #fff; left: 0; top: 0; font-size: 16px; padding-left: 2px; line-height: 28px; opacity: .9; max-width:5rem; overflow:hidden;}
.tanmuContent { display: flex; justify-content: space-between;}
.headImg { width: .6rem; height: .6rem; margin-right:5px; border-radius: 50%; overflow: hidden; -webkit-box-flex: 0;  -ms-flex: none; flex: none; background-color: #ccc;}
.headImg img { width: 100%; height: 100%; border-radius: 50%;}
.message { color:#fff;}
.tanmu .praiseBox { display: inline-block; height: 100%; display: flex; justify-content: center; align-items: center; margin: 0 10px;font-size: .32rem;
    margin: .1rem .2rem;}
.tanmu .t-praise { display: inline-block; width: 15px; height: 16px; background: url(/images/live/zan0.png) no-repeat; background-size: 100% 100%; margin-right: 3px;}
.tanmu .t-praise1 { background: url(/images/live/zan.png) no-repeat; background-size: 100% 100%;}
.tanmu .t-numer { display: inline-block; font-size: 16px; color: #666;}
.tanmu .t-color { color: #fff;}
.tanmu .t-bgcolor1 {background: rgba(72, 136, 212, 0.6);}
.tanmu .t-bgcolor2 {background-color: rgba(229,135,0,0.6);}
.tanmu .t-bgcolor3 {background-color: rgba(237,91,98,0.6);}
.tanmu .t-bgcolor4 {background-color: rgba(229,61,0,0.6);}

.showcanvas { width: 100%; height: 100%; font-size: 0; overflow: auto; -webkit-overflow-scrolling: touch; padding: 0 0 1rem; background-color: #000;}
.closecanvasbtn {  position: absolute; top: 0; left: 0; right: 0; margin: auto; width: 7.5rem; height: 1.4rem;  z-index:10002; }
.canvas-title {width: 100%; height: .84rem; line-height: .84rem;  position: fixed; bottom: 0; left: 0; z-index: 10004; background: rgba(0, 0, 0, .3); padding: 0 0 0 .4rem; color: #fff;}
.canvas-title p { font-size: .32rem; font-weight: 300; color: #fff; text-align: center;}

.foot { width: 100%; overflow: hidden; clear: both; padding-bottom: 1.3rem; background: #FFF; text-align:center}
.foot li { float: left; width: 36%; overflow: hidden;}
.foot li:nth-child(2) { width: 26.5%; }
.foot li:nth-child(3) { width: 37.5%; }
.foot li img { }

.nav.float { position: fixed; top: 0; left: 50%; margin-left:-640px; z-index: 995; background: rgba(255, 255, 255, 0.95);}


.ewm{ position:absolute; right:10px; top:137px; text-align:center} 
.ewm canvas{ width:120px; margin-bottom:5px;}
.ewm p{ height:24px; line-height:24px; font-size:14px; color:#999; font-weight:normal;}