body {
  background-color: #eee;
  min-height: 100vh;
}

/* 数据盒子 */

.living-data {
  padding: 1.173rem 0 0;
}

/* 卡位菜单 */
.spinner-out {
  width: 100%;
  height: 100%;
}

.ball-pulse>div {
  background: linear-gradient(90deg, #ED1515 0%, #FF4949 100%);
}

.live-menu {
  position: fixed;
  width: 100%;
  height: 1.173rem;
  left: 0;
  top: 1.173rem;
  background: #fff;
  display: flex;
  z-index: 100;
}

.live-menu button {
  border-radius: .373rem;
  border: none;
  height: .747rem;
  line-height: .747rem;
  color: #333333;
  background: none;
  font-weight: 400;
  font-family: PingFangSC-Regular, PingFang SC;
}

/* 卡位菜单 左侧滑动部分 */
.live-menu .live-menu-move {
  width: 64%;
  font-size: .4rem;
  position: relative;
  overflow: hidden;
  display: flex;
}

.live-menu .live-menu-move::after {
  content: '';
  position: absolute;
  z-index: 10;
  height: 60%;
  width: 3px;
  top: 20%;
  right: -3px;
  border-radius: 2px;
  box-shadow: 0px 0px 18px #999;
  border-radius: 100%;
  background: rgba(170, 170, 170, 0.418);
}

.live-menu .slide-static {
  width: 100%;
  overflow-y: hidden;
  overflow-x: scroll;
  display: flex;
  display: none;
}

.live-menu .slide-move {
  width: 1000%;
  display: flex;
  align-items: center;
}

.live-menu .slide-move button {
  width: 1.493rem;
}

.live-menu .slide-move button:last-child {
  margin-right: .053rem;
}

/* 卡位菜单 右侧固定部分 */
.live-menu .live-menu-fix {
  width: 36%;
  font-size: .427rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.live-menu-fix .btn-today {
  width: 2.8rem;
  color: #E33E41;
  font-weight: 600;
}

.live-menu-fix .btn-notice {
  width: 1.707rem;
}

.live-menu button.selected {
  background: linear-gradient(90deg, #ED1515 0%, #FF4949 100%);
  color: #FFFFFF;
  font-weight: 600;
}

/* 卡位通知 */
.fix-noitce {
  position: fixed;
  height: 1.067rem;
  line-height: 1.067rem;
  background: #FEEFD8;
  width: 100%;
  top: 2.347rem;
  z-index: 100;
  font-size: 15px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #B46730;
  padding-left: .427rem;
}

/* 标题 */
.live-title-bar {
  height: 1.867rem;
  box-sizing: border-box;
  font-size: .533rem;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: bold;
  color: #333333;
  line-height: .8rem;
  padding: .64rem .32rem 0 .427rem;
  display: flex;
  justify-content: space-between;
}

.live-title-bar .icon-dor::after {
  content: "";
  display: block;
  position: absolute;
  width: .213rem;
  height: .213rem;
  background: linear-gradient(90deg, #ED1515 0%, #FF4949 100%);
  left: 0;
  top: .4rem;
  transform: translate(0, -50%);
  border-radius: 100%;
}

.live-title-bar .icon-dor {
  position: relative;
  padding-left: .32rem;
}

/* 按钮 */
.btn-live-gray,
.btn-live {
  width: 1.973rem;
  height: .747rem;
  line-height: .747rem;
  border-radius: .373rem;
  border: 0.5px solid #333333;
  font-size: .373rem;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #333333;
  background: none;
}

.btn-live-gray {
  background: #bbb;
  color: #fff;
  border: 0;
}

/* 直播块 */
.live-cell {
  width: 93.6%;
  margin: 0 auto;
  border-radius: .213rem;
  overflow: hidden;
  background: #FAFAFA;
  position: relative;
}

.live-cell-upper {
  position: absolute;
  display: flex;
  width: 100%;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

/* 左侧块 */
.live-cell-upper .hm-live-in,
.live-cell-upper .left-info {
  width: 72.65%;
  position: relative;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
}

.live-cell-upper .hm-live-in {
  width: 100%;
}

.hm-live-in .hm-live-title {
  width: 8.72rem;
}

.tag36-green,
.tag36-red,
.tag36-alpha {
  height: .533rem;
  line-height: .533rem;
  font-size: 12px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  border-radius: .267rem;
}

.tag-prize {
  width: 3.413rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  height: .64rem;
  font-size: .373rem;
  border-radius: .107rem;
}

.hm-live .lt-box {
  position: absolute;
  left: .28rem;
  top: .36rem;
  z-index: 0;
}

.hm-live .rb-24 {
  width: .533rem;
}

.hm-live-title {
  width: 6.16rem;
  height: .693rem;
  line-height: .64rem;
  margin: .213rem 0;
  color: #fff;
  font-size: .56rem;
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hm-live-user {
  height: .747rem;
  line-height: .747rem;
  color: #fff;
  font-size: .347rem;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
}

.hm-live-user .img {
  float: left;
  width: .747rem;
  height: .747rem;
  border-radius: 100%;
  overflow: hidden;
  margin-right: .107rem;
}

.hm-live-user .img img {
  display: block;
}

/* 直播 &&心&& 上方动画 */
.live_animation {
  width: 1.333rem;
  height: 3.36rem;
  background-image: url(https://img2.ugoshop.com/mobile/5.2/images/@2x/live_animation.gif);
  background-size: 100%;
  position: absolute;
  right: 0;
  bottom: .533rem;
  z-index: 10;
}

.icon_zhibo {
  bottom: .32rem;
}

.icon_zhibo img {
  width: .64rem;
  height: .64rem;
}

/* 右侧块 */
.live-cell-upper .right-prod {
  width: 27.35%;
  background: #FAFAFA;
}

.right-prod>div {
  width: 2.133rem;
  height: 2.133rem;
  border-radius: .107rem;
  overflow: hidden;
  margin: .213rem auto 0;
  position: relative;
}

.right-prod>div .price-box {
  width: 100%;
  height: .747rem;
  line-height: .747rem;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%);
  position: absolute;
  bottom: 0;
  text-align: center;
  font-size: .427rem;
  font-weight: bold;
  color: #FFFFFF;
}

.hasAdv>div:nth-child(3)::after,
.right-prod>div:nth-child(1)::after,
.right-prod>div:nth-child(2)::after {
  content: "";
  display: block;
  background-color: rgba(0, 0, 0, .05);
  position: absolute;
  width: 100%;
  height: 100%;
  bottom: 0;
  z-index: 10;
}

.right-prod>div:last-child {
  height: 1.707rem;
  line-height: 1.707rem;
  border: 1px solid #ddd;
  text-align: center;
  font-size: .347rem;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #333;
}

.hasAdv>div:first-child {
  height: .747rem;
  overflow: hidden;
  border-radius: 0;
  display: flex;
}

.hasAdv>div:last-child {
  height: .747rem;
  line-height: .747rem;
}

.right-prod .r-arrow {
  padding-right: .107rem;
}

.right-prod .r-arrow::after {
  content: "";
  position: absolute;
  width: .16rem;
  height: .16rem;
  border-top: 1px solid #9D9D9D;
  border-right: 1px solid #9D9D9D;
  top: 40%;
  right: 0;
  transform: rotate(45deg) translate(0, -50%);
}

/* 没有直播 */
.no-living img {
  width: 2.773rem;
  height: 2.773rem;
}

.no-living p {
  font-size: 18px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #777777;
}

.no-living {
  height: 100%;
  text-align: center;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}

/* 加载等待 */
.spinner {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 10000;
  background: #fff;
}

.spinner-in {
  width: 100%;
  height: 100%;
}

/*  */
.flexCtr {
  display: flex;
  align-items: center;
  justify-content: center;
}

.top0 {
  top: 0;
}

.top88 {
  top: 1.173rem;
}