/* 公共部分 */
html,
body,
ul,
li,
ol,
dl,
dd,
dt,
p,
h1,
h2,
h3,
h4,
h5,
h6,
form,
fieldset,
legend,
img {
  margin: 0;
  padding: 0;
  list-style: none;
}
@font-face {
  font-family: 'Bebas-Regular';
  src: url('https://jt.dangbei.net//fonts/Bebas-Regular.ttf');
  font-weight: normal;
  font-style: normal;
}
* {
  font-family: "Lantinghei SC", "Microsoft Yahei", "Hiragino Sans GB", "Helvetica Neue", Helvetica, Arial, sans-serif;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

body a {
  text-decoration: none !important;
}

.clear {
  clear: both;
}

.clearfix::before,
.clearfix::after {
  content: "";
  display: block;
  height: 0;
  line-height: 0px;
  clear: both;
  visibility: hidden;
}

img {
  pointer-events: none;
}

body {
  /* max-width: 18.75rem; */
  margin: 0 auto;
  /* background-color: white;   */
  /*todo App内注释，h5内需要  --駿濤  20191014*/
  overflow-x: hidden !important;
  min-height: 100vh;
  box-sizing: border-box;
}

/* 底部有footer时给body添加active类名 */
body.active {
  padding-bottom: 3rem;
}

.limit-1-line {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.limit-2-line {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

/* 底部导航栏 */
footer {
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 50%;
  right: 0;
  transform: translateX(-50%);
  height: 2.4rem;
  width: 100%;
  background: #32333D;
  box-sizing: border-box;
  z-index: 999;
}

footer ul li {
  height: 100%;
  float: left;
  text-align: center;
  display: flex;
  align-items: center;
  text-align: center
}

footer ul {
  overflow: hidden;
  height: 100%;
  display: flex;
  justify-content: space-around;
}

footer ul li a {
  display: block;
  height: 100%;
  width: 100%;
}

footer ul li img {
  width: 1.3rem;
  height: 1.3rem;
  height: auto;
}

footer ul li img:nth-of-type(2) {
  display: none;
}

footer ul li p {
  font-size: .5rem;
  color: rgba(255, 255, 255, 0.60);
  letter-spacing: 0;
  text-align: center;
  line-height: .5rem;
}

footer ul li.active img:nth-of-type(1) {
  display: none;
}

footer ul li.active img:nth-of-type(2) {
  display: inline;
}

footer ul li.active p {
  color: #FFFFFF;
}

.footer-img {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0.05rem;
  width: 2.25rem;
  border-radius: 50%;
  box-sizing: border-box;
}

.footer-img img {
  display: block;
  width: 100%;
  height: 2.25rem;
  margin-bottom: .3rem;
}

.footer-img p {
  color: rgba(255, 255, 255, 0.60);
  font-size: .5rem;
  text-align: center
}

/* 右下角遥控按钮 */
.telecontrol {
  touch-action: none;
  position: fixed;
  right: .8rem;
  bottom: 7.25rem;
  z-index: 999;
}

.telecontrol img {
  display: block;
  width: 3.05rem;
  height: 3.05rem;
}

.footer-bottom {
  font-size: 0.5rem;
  color: rgba(255, 255, 255, 0.40);
  text-align: center;
  margin: 1rem 0;
}

/*----- 首页--------- */
.content {}

.header {
  padding: 0 0.8rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: .55rem;
  margin-bottom: 0.6rem;
}

.header-left {
  display: block;
  background: rgba(255, 255, 255, 0.08);
  border-radius: .2rem;
  width: 13.35rem;
  height: 2.1rem;
  line-height: 2.1rem;
  font-size: .7rem;
  color: rgba(255, 255, 255, 0.60);
}

.header-left img {
  width: 1.3rem;
  height: auto;
  margin-right: .2rem;
  margin-left: .4rem;
  vertical-align: middle;
}

.header-right {
  display: flex;
}

.header-right a {
  margin-right: .4rem;
}

.header-right img {
  display: block;
  width: 1.3rem;
  height: auto;
}

/* 首页导航 */
.index-nav .wrapper01 {
  position: relative;
  height: 1.3rem;
  width: 90%;
  overflow: hidden;
  margin: 0 auto;
  margin-bottom: .8rem;
  box-sizing: border-box;
}

.index-nav .wrapper .scroller {
  position: absolute
}

.index-nav .wrapper .scroller li {
  height: 1.3rem;
  float: left;
  text-align: center;
  display: block;
  box-sizing: border-box;
  position: relative;
  font-size: .7rem;
}

.index-nav .wrapper .scroller li::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: .8rem;
  transform: translateX(-50%);
  height: 0.1rem;
  background-color: transparent;
  border-radius: 2px;
}

.index-nav .wrapper .scroller li.cur::before {
  background: rgba(255, 255, 255, 0.80);
}

.index-nav .wrapper .scroller li.cur a {
  color: rgba(255, 255, 255, 0.80);
}

.index-nav .wrapper .scroller li a {
  display: block;
  color: rgba(255, 255, 255, 0.60);
  font-size: .8rem;
  padding: 0 0.6rem;
  font-weight: 600;
  letter-spacing: 0.05rem;
}

.index-nav .wrapper .scroller li.huiyuan a {
  color: #FADABD;
}

.index-nav .wrapper .scroller li.cur.huiyuan a {
  color: #F4C09C;
}

.index-nav .wrapper .scroller li.cur.huiyuan::before {
  background-image: linear-gradient(179deg, #FADABD 0%, #F4C09C 100%);
}

.content-box {
  padding: 0 0.8rem;
  overflow: hidden;
}

.index-list {
  display: none;
}

.index-list.active {
  display: block;
}

/* 轮播图 */
.common-lunbo {
  margin-bottom: 1.2rem;
  border-radius: .2rem;
  background: rgba(255, 255, 255, 0.04);
  min-height: 9.65rem;
}

.common-lunbo .swiper-slide {
  border-radius: .2rem;
}

.common-lunbo .swiper-slide a {
  display: block;
}

.common-lunbo .swiper-slide img {
  display: block;
  width: 100%;
  height: 9.65rem;
  border-radius: .2rem;
  -o-object-fit: cover;
     object-fit: cover;
}

.common-lunbo .swiper-pagination {
  width: auto !important;
  left: initial;
  right: .65rem;
}

.common-lunbo .swiper-pagination span {
  width: .2rem;
  height: .2rem;
  background: rgb(255, 255, 255);
  opacity: 0.5;
}

.common-lunbo .swiper-pagination span.swiper-pagination-bullet-active {
  background: #FFFFFF;
  opacity: 1;
}

.common-lunbo .swiper-slide-top {
  position: absolute;
  right: .4rem;
  top: 0;
  padding: 0 .15rem;
  text-align: center;
  border-radius: 0 0 0.1rem 0.1rem;
  font-size: .5rem;
  color: #FFFFFF;
  letter-spacing: 0;
  text-align: center;
  height: 0.8rem;
  line-height: .8rem;
}

.common-lunbo .swiper-slide-text {
  position: absolute;
  left: .4rem;
  bottom: .3rem;
  max-width: 12rem;
}

.common-lunbo .swiper-slide-text span {
  display: block;
  font-size: .5rem;
  color: rgba(255, 255, 255, 0.60);
  margin-bottom: .1rem;
}

.common-lunbo .swiper-slide-text p {
  font-size: .8rem;
  color: rgba(255, 255, 255, 0.80);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 热播影片(两行五个模块) */
.now-hit {
  margin-bottom: 0.2rem;
}

.now-hit-two ul li {
  width: 49%;
  margin-right: 2%;
}

.now-hit-two ul li:nth-last-of-type(1) {
  margin-right: 0;
}

.now-hit-two ul li .hit-movie-list-in {
  min-height: 4.75rem;
}

/* 热播影片(一行三个模块) */
.hit-movie {
  overflow: hidden;
  margin-bottom: .3rem;
}

.hit-movie-title {
  margin-bottom: .7rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.hit-movie-title span {
  font-size: .8rem;
  color: rgba(255, 255, 255, 0.80);
  font-weight: bold;
}

.hit-movie-title a {
  font-size: .5rem;
  color: rgba(255, 255, 255, 0.60);
  display: flex;
  align-items: center;
}

.hit-movie-title a img {
  width: 0.5rem;
  height: auto;
}

.hit-movie-list {
  overflow: hidden;
}

.hit-movie-list li {
  width: 32%;
  float: left;
  margin-right: 2%;
  margin-bottom: 1rem;
}

.hit-movie-list li:nth-of-type(3n) {
  margin-right: 0;
}

.hit-movie-list li a {
  display: block;
}

.hit-movie-list-in {
  position: relative;
  background: rgba(255, 255, 255, 0.04);
  overflow: hidden;
  border-radius: 0.2rem;
  min-height: 7.2rem;
}

.hit-movie-list li img {
  display: block;
  width: 100%;
  height: 7.55rem;
}

.now-hit-two ul li .hit-movie-list-in img {
  height: 4.5rem;
}

.hit-movie-list-t {
  position: absolute;
  right: .4rem;
  top: 0;
  padding: 0 .15rem;
  text-align: center;
  border-radius: 0 0 0.1rem 0.1rem;
  font-size: .5rem;
  color: #FFFFFF;
  letter-spacing: 0;
  text-align: center;
  height: .8rem;
  line-height: .8rem;
}

.hit-movie-list-b {
  position: absolute;
  background-image: linear-gradient(-180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.80) 100%);
  bottom: 0;
  left: 0;
  right: 0;
  height: 1.3rem;
  line-height: 1.3rem;
  padding: 0 0.4rem;
}

.hit-movie-list-score {
  color: #FD7E14;
  font-size: .5rem;
  text-align: right;
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  box-sizing: border-box;
}

.hit-movie-list-selection {
  font-size: .5rem;
  color: rgba(255, 255, 255, 0.60);
  text-align: right;
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  box-sizing: border-box;
}

.hit-movie-list li p {
  font-size: .7rem;
  color: rgba(255, 255, 255, 0.80);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: .2rem;
  text-align: left;
}

.hit-movie-list li span {
  display: block;
  font-size: .6rem;
  color: rgba(255, 255, 255, 0.60);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: .1rem;
  text-align: left;
}

/* 会员专区 */
.vip-top {
  background-image: linear-gradient(90deg, rgba(166, 168, 172, 0.28) 0%, rgba(166, 168, 172, 0.00) 95%);
  border-radius: 1.2rem;
  margin-bottom: 1.2rem;
  padding: .55rem 0 .55rem .9rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.vip-top span {
  font-size: .7rem;
  color: #FADABD;
}

.vip-top a {
  display: inline-block;
  background-image: linear-gradient(179deg, #FADABD 0%, #F4C09C 100%);
  box-shadow: 0 .325rem .125rem -.2rem #30323C;
  border-radius: .6rem;
  font-size: .6rem;
  color: #64310E;
  height: 1.2rem;
  line-height: 1.2rem;
  padding: 0 .8rem;
}

.vip-title {
  margin-bottom: .4rem;
}

.vip-title span {
  color: #FADABD;
}

.vip-nav {
  margin-bottom: .5rem;
}

.vip-nav ul {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.vip-nav li {
  display: inline-block;
  font-size: .7rem;
  color: rgba(255, 255, 255, 0.60);
  height: 1.5rem;
  line-height: 1.5rem;
  padding: 0 0.4rem;
  border: .05rem solid transparent;
  border-radius: .8rem;
}

.vip-nav li.active {
  background-image: linear-gradient(180deg, #3E404D 0%, #393B46 97%);
  border-color: #F4C09C;
}

.vip-content .vip-list {
  display: none;
}

.vip-content .vip-list.active {
  display: block;
}

.vip-content .vip-list .hit-movie-list-score {
  color: #F4C09C;
}

/*-------- 影视详情--------- */
/* 详情顶部 */
.film-detail-header {
  padding: 0.8rem 0.8rem 0;
  margin-bottom: 1.2rem;
}

.film-detail-header-in {
  display: flex;
  align-items: center;
}

.film-detail-header-img {
  margin-right: 0.6rem;
}

.film-detail-header-img img {
  display: block;
  width: 5.05rem;
  border-radius: 0.2rem;
  height: auto;
}

.film-detail-header-text {
  max-width: 10.5rem;
}

.film-detail-header-text h3 {
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.80);
  margin-bottom: .4rem;
}

.film-detail-header-text p {
  font-size: .6rem;
  color: rgba(255, 255, 255, 0.80);
  letter-spacing: 0;
  text-align: justify;
  margin-bottom: .2rem;
  line-height: 0.9rem;
}

.film-detail-header-text span {
  display: block;
  font-size: .5rem;
  color: rgba(255, 255, 255, 0.40);
  letter-spacing: 0;
  text-align: justify;
}

.film-detail-header-link {
  margin-top: 1.4rem;
  display: flex;
}

.film-detail-header-link a {
  display: flex;
  height: 1.5rem;
  outline: none;
  background: rgba(255, 255, 255, 0.08);
  align-items: center;
  justify-content: center;
}

.film-detail-header-link a img {
  display: inline-block;
  width: .8rem;
  vertical-align: middle;
  margin-right: .4rem;
}

.film-detail-header-link a:nth-of-type(1) {
  color: #666666;
  letter-spacing: 0;
  padding: 0;
  width: 1.5rem;
  text-align: center;
  border-radius: 50%;
}

.film-detail-header-link a:nth-of-type(1) img {
  margin-right: 0;
}

.film-detail-header-link a:nth-of-type(2) {
  text-align: center;
  padding: 0;
  font-size: .7rem;
  color: rgba(255, 255, 255, 0.80);
  letter-spacing: 0;
  border-radius: .7rem;
  width: 4.25rem;
  margin-left: .4rem;
  text-align: center;
  padding: 0;
  font-size: .7rem;
  color: rgba(255, 255, 255, 0.80);
  letter-spacing: 0;
  border-radius: .7rem;
  width: 4.25rem;
  margin-left: .4rem;
  padding-left: 1rem;
  background-image: url(http://tytestapi.qun7.com/ykq/image/player.png);
  background-size: 0.8rem 0.8rem;
  background-repeat: no-repeat;
  background-position: 0.6rem 0.4rem;
  line-height: normal;
  justify-content: center;
  align-items: center;
}

.film-detail-header-link a img:nth-of-type(2) {
  display: none;
}

.film-detail-header-link a.active img:nth-of-type(1) {
  display: none;
}

.film-detail-header-link a.active img:nth-of-type(2) {
  display: inline;
}

/* 选集 */
.film-detail-selection {
  padding-left: 0.8rem;
  margin-bottom: 1.2rem;
}

.film-detail-selection-top {
  margin-bottom: .7rem;
}

.film-detail-selection-top h3 {
  font-size: .8rem;
  color: rgba(255, 255, 255, 0.80);
  letter-spacing: 0;
  font-weight: 600;
  float: left;
}

.film-detail-selection-top span {
  font-size: .5rem;
  color: rgba(255, 255, 255, 0.40);
  letter-spacing: 0;
  float: right;
  margin-right: 1.2rem;
}

.film-detail-selection-b .swiper-slide {
  width: auto;
  height: auto;
  margin-right: .4rem;
  border: 1px solid transparent;
  border-radius: .2rem;
}

.film-detail-selection-b a {
  background-image: linear-gradient(90deg, rgba(166, 168, 172, 0.28) 0%, rgba(166, 168, 172, 0.00) 95%);
  display: inline-block;
  width: auto;
  border-radius: .2rem;
  padding: 0.9rem 1.1rem;
  height: auto;
  font-size: .8rem;
  color: rgba(255, 255, 255, 0.80);
  line-height: initial;
  text-align: center;
  position: relative;
}

.film-detail-selection-b a img {
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  width: .75rem;
  height: .75rem;
}

.film-detail-selection-b .swiper-container {
  overflow-x: scroll;
}

.film-detail-selection-b .swiper-container::-webkit-scrollbar {
  background-color: transparent;
  display: none;
}

/* 剧情简介 */
.film-detail-intro {
  padding: 0 0.8rem;
  margin-bottom: 1rem;
  position: relative;
}

.film-detail-intro h3 {
  font-size: .8rem;
  color: #011227;
  line-height: .9rem;
  margin-bottom: .5rem;
  font-weight: 600;
}

.film-detail-intro-text {
  font-size: .7rem;
  color: #4E5263;
  letter-spacing: 0;
  text-align: justify;
  line-height: 1.2rem;
  
}

.film-detail-intro-text.active {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

.film-detail-intro-more {
  text-align: center;
  line-height: initial;
  margin-top: .2rem;
  position: absolute;
  right: 0.8rem;
  top: 0;
}

.film-detail-intro-more span {
  display: flex;
  align-items: center;
  color: #B5B7C4;
  font-size: 0.6rem;
}

.film-detail-intro-more img {
  width: 1rem;
  height: 1rem;
}

.film-detail-intro-more.active img {
  transform: rotate(180deg);
}

/* 演职员 */
.film-detail-actor {
  padding:0 0.8rem;
  overflow: hidden;
}

.film-detail-actor-title {
  font-size: .8rem;
  color: rgba(255, 255, 255, 0.80);
  line-height: 1rem;
  margin-bottom: .7rem;
  font-weight: 600;
}

.film-detail-actor ul li {
  text-align: center;
  margin-right: 1%;
  width: 24%;
  margin-bottom: 0.8rem;
  float: left;
}

.film-detail-actor ul li:nth-of-type(4n) {
  margin-right: 0;
}

.film-detail-actor ul li a {
  display: block;
}

.film-detail-actor ul li img {
  display: block;
  width: 100%;
  min-height: 5rem;
  border-radius: 0.2rem;
  margin-bottom: 0.3rem;
}

.film-detail-actor ul li p {
  font-size: .7rem;
  color: rgba(255, 255, 255, 0.80);
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ---------演职员详情页--------- */
.actor-detail-header {
  padding: .7rem .8rem 0;
  margin-bottom: 1.2rem;
}

.actor-detail-header-in {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.actor-detail-header-img {
  margin-right: 0.6rem;
  background: #EFEFEF;
  border-radius: 100%;
}

.actor-detail-header-img img {
  display: block;
  width: 3.1rem;
  height: 3.1rem;
  border-radius: 50%;
  -o-object-fit: cover;
     object-fit: cover;
}

.actor-detail-header-text h3 {
  line-height: initial;
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.80);
  margin-bottom: .4rem;
  font-weight: 400;
}

.actor-detail-header-text p {
  font-size: .6rem;
  color: rgba(255, 255, 255, 0.60);
  margin-bottom: .2rem;
}

.actor-detail-header-text span {
  display: block;
  font-size: .5rem;
  color: rgba(255, 255, 255, 0.40);
}

/* 赛事 */
.event-fenlei {
  margin-bottom: .4rem;
}

.event-fenlei ul {
  overflow: hidden;
}

.event-fenlei ul li {
  float: left;
  width: 5.45rem;
  margin-right: .4rem;
  text-align: center;
  margin-bottom: .7rem;
}

.event-fenlei ul li:nth-of-type(3n) {
  margin-right: 0;
}

.event-fenlei ul li a {
  display: block;
}

.event-fenlei ul li div {
  background: #D9D9DC;
  border-radius: .4rem;
  width: 100%;
  height: 3rem;
  text-align: center;
  margin-bottom: .4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

.event-fenlei ul li img {
  display: block;
  width: 3.25rem;
  height: auto;
}

.event-fenlei ul li p {
  color: rgba(255, 255, 255, 0.80);
  font-size: .6rem;
}

.event-content-title {
  margin-bottom: 1.2rem;
}

.event-content-title span {
  display: inline-block;
  color: rgba(255, 255, 255, 0.60);
  font-size: .7rem;
  margin-right: .9rem;
  position: relative;
}

.event-content-title span::before {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -0.3rem;
  width: .8rem;
  height: .1rem;
  background: transparent;
  border-radius: 2px;
}

.event-content-title span.active {
  color: rgba(255, 255, 255, 0.80);
  font-size: .8rem;
}

.event-content-title span.active::before {
  background: rgba(255, 255, 255, 0.80);
}

.event-content .event-bottom {
  display: none;
}

.event-content .event-bottom.active {
  display: block;
}

.event-list {
  overflow: hidden;
}

.event-list li {
  background-image: linear-gradient(90deg, rgba(166, 168, 172, 0.28) 0%, rgba(166, 168, 172, 0.00) 95%);
  border-radius: .2rem;
  position: relative;
  margin-bottom: .8rem;
}

.event-list li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .6rem 0 .6rem .6rem;
}

.event-list-left div {
  height: 2rem;
  margin-bottom: .2rem;
}

.event-list-left div:nth-last-of-type(1) {
  margin-bottom: 0;
}

.event-list-left img {
  width: 2rem;
  height: 2rem;
  float: left;
  margin-right: .4rem;
}

.event-list-left span {
  float: left;
  height: 2rem;
  line-height: 2rem;
  color: rgba(255, 255, 255, 0.80);
  font-size: 0.7rem;
}

.event-list-left b {
  float: left;
  font-weight: 400;
  height: 2rem;
  line-height: 2rem;
  color: rgba(255, 255, 255, 0.80);
  font-size: 0.7rem;
}

.event-list-right {
  display: flex;
  align-items: center;
}

.event-list-time {
  text-align: right;
  margin-right: .6rem;
}

.event-list-time p {
  color: rgba(255, 255, 255, 0.80);
  font-size: .6rem;
  margin-bottom: .1rem;
}

.event-list-time span {
  color: rgba(255, 255, 255, 0.60);
  font-size: 0.6rem;
  display: block;
}

.event-list-right>span {
  background: #FFFFFF;
  border-radius: .8rem;
  width: 2.5rem;
  height: 1.3rem;
  line-height: 1.3rem;
  text-align: center;
  font-size: .6rem;
}

.huifang {
  color: #F98431;
}

.zhibo {
  color: #1CC2C1;
}

.yuyue {
  color: #2FA0E3;
}

/* 赛事列表 */
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

.clearfix {
  *zoom: 1;
}

.event-nav {
  height: 1.2rem;
  width: 90%;
  box-sizing: border-box;
  margin: .8rem auto;
}

.event-nav .wrapper {
  position: relative;
  height: 1.2rem;
  width: 100%;
  overflow: hidden;
  margin: 0 auto;
}

.event-nav .wrapper .scroller {
  position: absolute
}

.event-nav .wrapper .scroller li {
  height: 1.2rem;
  color: #333;
  float: left;
  text-align: center;
  color: rgba(255, 255, 255, 0.60);
  font-size: .7rem;
  display: block;
  box-sizing: border-box;
  position: relative;
}

.event-nav .wrapper .scroller li::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: .8rem;
  transform: translateX(-50%);
  height: 0.1rem;
  background-color: transparent;
}

.event-nav .wrapper .scroller li.cur a {
  color: rgba(255, 255, 255, 0.80);
}

.event-nav .wrapper .scroller li.cur::before {
  background: rgba(255, 255, 255, 0.80);
}

.event-nav .wrapper .scroller li a {
  display: block;
  margin: 0 .4rem;
  color: rgba(255, 255, 255, 0.60);
  font-size: .8rem;
}

/* 工具箱 */
.toolkit {
  padding: .55rem .8rem 0;
}

.toolkit-remote {
  background: rgba(255, 255, 255, 0.04);
  border-radius: .2rem;
  height: 9.65rem;
  margin-bottom: .35rem;
  position: relative;
}

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

.toolkit-remote p {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: .9rem;
  color: rgba(255, 255, 255, 0.40);
}

.toolkit-list {
  overflow: hidden;
  margin-bottom: .25rem;
}

.toolkit-list li {
  width: 20%;
  float: left;
  padding: 0.55rem 0;
  /* background: rgba(0,0,0,0.1); */
  border-radius: 0.4rem;
  text-align: center;
}

.toolkit-list li a {
  display: block;
}

.toolkit-list li img {
  width: 1.5rem;
  height: 1.5rem;
}

.toolkit-list li p {
  font-size: .6rem;
  color: rgba(255, 255, 255, 0.80);
}

.toolkit-yingyong-title {
  font-size: .9rem;
  color: rgba(255, 255, 255, 0.8);
  font-weight: 600;
}

.toolkit-yingyong-title span {
  font-size: .8rem;
  color: rgba(255, 255, 255, 0.40);
  margin-left: .4rem;
}

.toolkit-yingyong ul {
  overflow: hidden;
  padding: 0.7rem 0;
}

.toolkit-yingyong li {
  width: 4.25rem;
  margin-right: 0.3rem;
  float: left;
  margin-bottom: .4rem;
  padding: .9rem 0 .7rem;
  text-align: center;
  background: rgba(255, 255, 255, 0.04);
  border-radius: .25rem;
}

.toolkit-yingyong li:nth-of-type(4n) {
  margin-right: 0;
}

.toolkit-yingyong li img {
  width: 2rem;
  height: 2rem;
  border-radius: .1rem
}

.toolkit-yingyong li p {
  font-size: .6rem;
  color: rgba(255, 255, 255, 0.60);
  overflow: hidden;
  padding: 0 0.2rem;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.toolkit-yingyong-noapp {
  padding: 1.2rem 0;
  text-align: center;
}

.toolkit-yingyong-noapp img {
  width: 5rem;
  height: auto;
  margin-bottom: 0.4rem;
}

.toolkit-yingyong-noapp p {
  font-size: 0.7rem;
  color: rgba(255, 255, 255, 0.40);
}

/* 遥控器 */
.control-box {
  position: absolute;
  width: 100%;
  bottom: 50%;
  box-sizing: border-box;
  transform: translateY(50%);
  padding: 0 1.75rem;
}

.control-header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 1.5rem;
  position: relative;
  z-index: 19;
}

.control-header div {
  width: 3rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.control-header div img {
  display: block;
  width: 3rem;
  height: 3rem;
  /* margin-bottom: .2rem; */
}
.control-header div img:nth-of-type(2){display: none;}
.control-header div.active img:nth-of-type(1){display: none;}
.control-header div.active img:nth-of-type(2){display: block;}
.control-header div span {
  display: block;
  font-size: 0.6rem;
  color: #82869C;
  line-height: .8rem;
  white-space: nowrap;
}

.control-slider {
  margin-bottom: 1.5rem;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid #5D606A;
  border-radius: .7rem;
  padding: 0 1.5rem;
  position: relative;
}

.control-slider>img {
  position: absolute;
  left: 0.6rem;
  top: 50%;
  transform: translateY(-50%);
  width: 0.6rem;
  height: auto;
}

.control-slider .swiper-container {
  height: 1.5rem;
}

.control-slider .swiper-slide a {
  font-size: 0.7rem;
  color: rgba(255, 255, 255, 0.60);
  display: block;
  height: 1.5rem;
  line-height: 1.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ykq-box {
  margin: 0 auto;
  width: 13.2rem;
  height: 13.2rem;
  position: relative;
  overflow-x: hidden;
}

.menuHolder {
  width: 13.2rem;
  height: 13.2rem;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: relative;
  z-index: 4;
}

.menuHolder>img {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.menuHolder {
  padding: 1rem;
  height: 100%;
  width: 100%;
  box-sizing: border-box;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  overflow: hidden;
}

.menuHolder .p2 {
  padding: 0;
  margin: 0;
  list-style: none;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0;
  height: 0;
  transform: translate(-50%, -50%);
  z-index: 1;
  transform-origin: 0 0;
  transition: 1s;
}

.menuHolder .p1 .s2 {
  position: absolute;
  left: 0;
  top: 0;
}

/*中间的圆*/
.menuHolder .s1 .cen {
  position: absolute;
  display: block;
  width: 5rem;
  height: 5rem;
  text-align: center;
  align-items: center;
  background-size: 100% 100%;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
}

.menuHolder .s1 .cen.active {
  background: url("../image/light/remote_ok_foc.png") center center no-repeat;
  background-size: 100% 100%;
}

.menuHolder .p2 .s2 div {
  position: absolute;
  display: block;
  width: 6.4rem;
  height: 6.4rem;
}

.menuHolder .p2 .s2:nth-of-type(1) {
  transform: rotate(5deg)
}

.menuHolder .p2 .s2:nth-of-type(4) {
  transform: rotate(275deg)
}

.menuHolder .p2 .s2:nth-of-type(3) {
  transform: rotate(187deg)
}

.menuHolder .p2 .s2:nth-of-type(2) {
  transform: rotate(96deg)
}

.menuHolder .p2 {
  transform: rotate(40deg);
}

.menuHolder .p2 .s2 img {
  position: relative;
}

.bottom img {
  width: 8.5rem;
  height: 4.25rem;
  transform: rotate(-45deg);
  top: 9%;
  left: -24%;
  display: none;
}

.top img {
  width: 8.5rem;
  height: 4.25rem;
  transform: rotate(135deg);
  top: 9%;
  left: -22%;
  display: none;
}

.left img {
  width: 4.25rem;
  height: 8.5rem;
  transform: rotate(-135deg);
  top: -23%;
  left: 11%;
  display: none;
}

.right img {
  width: 4.25rem;
  height: 8.5rem;
  transform: rotate(45deg);
  top: -23%;
  left: 11%;
  display: none;
}

.bottom.active img,
.top.active img,
.left.active img,
.right.active img {
  display: block;
}
.lerad_power{

}

/* 应用中心 */
.common-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
  height: 2.1rem;
}

.common-header h3 {
  font-size: 1rem;
  color: #011227;
  font-weight: 600;
}

.common-header-right {
  display: flex;
}

.common-header-right img {
  width: 1.3rem;
  height: auto;
  vertical-align: middle;
}

.application-banner {
  /* height: 8.15rem; */
  margin-bottom: .35rem;
}

.application-banner .swiper-container {
  height: 100%;
}

.application-banner .swiper-slide a {
  display: block;
  height: 100%;
}

.application-banner .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: .2rem;
}

.application-banner-page {
  width: auto !important;
  right: .8rem;
  left: inherit !important;
}

.application-banner-page span {
  width: .2rem;
  height: .2rem;
  background: rgba(255, 255, 255, 0.50);
  border-radius: .125rem;
  opacity: 0.8;
}

.application-banner-page span.swiper-pagination-bullet-active {
  background: #FFFFFF;
  border-radius: .125rem;
}

.application-banner-in {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 2rem;
  line-height: 2rem;
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.70) 100%);
  border-radius: 0 0 .2rem .2rem;
  color: rgba(255, 255, 255, 0.80);
  font-size: .8rem;
  padding-left: 3.15rem;
  font-weight: 600;
  box-sizing: border-box;
}

.application-banner .swiper-slide .application-banner-in img {
  position: absolute;
  width: 2.5rem;
  height: 2.5rem;
  left: .4rem;
  bottom: .4rem;
}

.application-fenlei ul {
  overflow: hidden;
  margin-bottom: 0.5rem;
}

.application-fenlei li {
  width: 20%;
  float: left;
  /* margin-bottom: 1.125rem; */
  padding: 0.55rem 0;
  border-radius: .4rem;
  text-align: center;
}

.application-fenlei li a {
  display: block;
}

.application-fenlei li img {
  width: 1.2rem;
  height: 1.2rem;
}

.application-fenlei li p {
  font-size: .65rem;
  color: #4E5263;
}

.hot-application-t {
  margin-bottom: .7rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.hot-application-t span {
  font-size: .9rem;
  color: #011227;
  font-weight: 600;
}

.hot-application-t a {
  font-size: .6rem;
  color: #B5B7C4;
  display: flex;
  align-items: center;
}

.hot-application-t a img {
  width: 1rem;
  height: 1rem;
}

.hot-application-c {
  overflow: hidden;
}

.hot-application-c li {
  width: 100%;
  padding: 0.8rem 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}
.hot-application-c li::after {
  content: '';
  height: 1px;
  width: 200%;
  background-color: rgba(1, 18, 39, 0.1);
  position: absolute;
  bottom: 0;
  left: -50%;
  -webkit-transform: scale(0.5);
  -ms-transform: scale(0.5);
  transform: scale(0.5);
}

.hot-application-c li a {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.hot-application-c li:nth-of-type(4n) {
  margin-right: 0;
}

.hot-application-c li img {
  width: 2.3rem;
  height: 2.3rem;
  margin-right: 0.6rem;
}

.hot-application-c li h3 {
  font-size: .75rem;
  font-weight: 600;
  color: #011227;
  margin-bottom: .2rem;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 100%;
}

.hot-application-c .atar_Show {
  background: url('../image/light/star.png');
  background-size: .4rem .4rem;
  width: 2rem;
  height: .4rem;
  position: relative;
  margin: 0 auto;
  overflow: hidden;
}

.hot-application-c .atar_Show p {
  background: url('../image/light/star-active.png');
  background-size: .4rem .4rem;
  left: 0;
  height: .4rem;
  overflow: hidden;
}

/*----- 应用列表-----*/
.application-list li {
  width: 100%;
  padding: 0.8rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
.application-list li::after {
  content: '';
  height: 1px;
  width: 200%;
  background-color: rgba(1, 18, 39, 0.1);
  position: absolute;
  bottom: 0;
  left: -50%;
  -webkit-transform: scale(0.5);
  -ms-transform: scale(0.5);
  transform: scale(0.5);
}
.application-list-left {
  position: relative;
  width: 100%;
}

.application-list-left a {
  display: flex;
  align-items: center;
  width: 100%;
}

.application-list-left img {
  width: 2.3rem;
  height: 2.3rem;
  margin-right: 0.6rem;
}

.application-list-left h3 {
  font-size: .75rem;
  font-weight: 600;
  color: #011227;
  margin-bottom: .25rem;
  width: 8.5rem;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.application-list-left b {
  width: .8rem;
  height: .8rem;
  line-height: .8rem;
  display: inline-block;
  font-size: .4rem;
  text-align: center;
  color: #FFFFFF;
  font-weight: 400;
  margin-right: 0.2rem;
  font-family: 'Bebas-Regular';
}

.application-list-text>p {
  font-size: .5rem;
  color: rgba(255, 255, 255, 0.60);
  margin-bottom: 0.2rem;
  max-width: 10.5rem;
}

.application-list-text .atar_Show {
  background: url('../image/light/star.png');
  background-size: .6rem .6rem;
  width: 3rem;
  height: .6rem;
  position: relative;
  float: left;
}

.application-list-text .atar_Show p {
  background: url('../image/light/star-active.png');
  background-size: .6rem .6rem;
  left: 0;
  height: .6rem;
}

.application-list-left span {
  float: left;
  height: .4rem;
  line-height: .4rem;
  display: block;
  font-size: .4rem;
  color: rgba(255, 255, 255, 0.40);
  margin-left: .2rem;
}

.application-list-right {
  background: rgba(0, 140, 240, 0.1);
  border-radius: .7rem;
  width: 3.3rem;
  height: 1.4rem;
  line-height: 1.4rem;
  font-size: .6rem;
  text-align: center;
  white-space: nowrap;
  color: #008CF0;
  position: absolute;
  right: 0;
  z-index: 10;
  display: flex;
  justify-content: center;
  align-items: center;
}
:root .ani_dot { /* 这里使用Hack是因为IE6~IE8浏览器下， vertical-align解析不规范，值为bottom或其他会改变按钮的实际高度*/
  display: inline-block;
  width: 1.2em;
  height: 1.4rem;
  line-height: 1.2rem;
  overflow: hidden;
  letter-spacing: 0.1rem;
}
.ani_dot {
  animation: dot 3s infinite step-start;
  -webkit-animation: dot 3s infinite step-start;
}
@-webkit-keyframes dot {
  0% { width: 0; margin-right: 1.2em; }
  33% { width: .4em; margin-right: .8em; }
  66% { width: .8em; margin-right: .4em; }
  100% { width: 1.2em; margin-right: 0;}
}
@keyframes dot {
  0% { width: 0; margin-right: 1.2em; }
  33% { width: .4em; margin-right: .8em; }
  66% { width: .8em; margin-right: .4em; }
  100% { width: 1.2em; margin-right: 0;}
}

/* 应用详情 */
.application-detail-top {
  padding: .7rem .8rem 0;
  margin-bottom: 1rem;
}

.application-detail-top-in {
  position: relative;
  overflow: hidden;
  margin-bottom: 1rem;
  width: 100%;
  padding-left: 5.3rem;
  min-height: 4.5rem;
  box-sizing: border-box;
}

.application-detail-top-in>img {
  width: 4.5rem;
  height: 4.5rem;
  position: absolute;
  top: 0;
  left: 0;
}

.application-detail-top-text {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  position: relative;
  min-height: 4.5rem;
  justify-content: space-between;
}

.application-detail-top-text h3 {
  font-weight: 600;
  color: #011227;
  font-size: 1rem;
  /* margin-bottom: 0.4rem; */
}

.application-detail-top-text>p:nth-of-type(1) {
  margin-bottom: .2rem;
  color: #4E5263;
  font-size: .7rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.application-detail-top-text>p:nth-of-type(2) {
  margin-bottom: .2rem;
  color: rgba(255, 255, 255, 0.40);
  font-size: .5rem;
}

.application-detail-top-text .atar_Show {
  background: url('../image/light/star.png');
  background-size: .7rem .65rem;
  width: 3.5rem;
  height: .65rem;
  position: relative;
  margin-top: 0.5rem;
}

.application-detail-top-text .atar_Show p {
  background: url('../image/light/star-active.png');
  background-size: .7rem .65rem;
  left: 0;
  height: .65rem;
}

.application-detail-top-open {
  display: flex;
  flex-direction: row-reverse;
  margin-top: -.2rem;
  margin-bottom: 0.2rem;
}

.application-detail-top-open a {
  display: flex;
  align-items: center;
  background: rgba(255, 255, 255, 0.08);
  border-radius: .7rem;
  height: 1.5rem;
  line-height: 1.5rem;
  font-size: .7rem;
  color: rgba(255, 255, 255, 0.80);
  padding: 0 .6rem;
}

.application-detail-top-open a img {
  display: block;
  width: .8rem;
  height: auto;
  margin-right: .4rem;
}

.application-detail-top-link {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}

.application-detail-top-link a {
  display: flex;
  align-items: center;
  background: #008CF0;
  border-radius: .7rem;
  height: 1.4rem;
  line-height: 1.4rem;
  font-size: .6rem;
  color: #FFFFFF;
  padding: 0 1.05rem;
}

.application-detail-top-link a img {
  display: none;
  width: .8rem;
  height: auto;
  margin-right: .4rem;
}
/* 新加 */
.app_other{
  width: 100%;
  display: flex;
  justify-content: center;
}
.app_other .item{
  text-align: center;
  font-size: 0;
  width: 5.7rem;
  position: relative;
}
.app_other .item:nth-of-type(2)::before{
  position: absolute;
  content: '';
  top: 0.6rem;
  left:0;
  width: 0.05rem;
  height: 1.1rem;
  background-color: rgba(1, 18, 39, 0.1);
}
.app_other .item:nth-of-type(2)::after{
  position: absolute;
  content: '';
  top: 0.6rem;
  right: 0;
  width: 0.05rem;
  height: 1.1rem;
  background-color: rgba(1, 18, 39, 0.1);
}
.app_other .item p{
  font-size: 0.9rem;
  color: #82869C;
  font-family: 'Bebas-Regular';
  /* margin-bottom: 0.45rem; */
}
.app_other .item span{
  font-size: 0.7rem;
  color: #B5B7C4;
}
/* end */
.application-detail-bottom {
  padding: 0 0 1rem .8rem;
}

.application-detail-bottom h3 {
  color: #011227;
  font-size: .8rem;
  font-weight: 600;
  margin-bottom: 0.8rem;
}

.application-detail-bottom h3 p {
  display: none;
  color: rgba(255, 255, 255, 0.40);
  font-size: .7rem;
  margin-left: 0.2rem;
}

.application-detail-bottom .swiper-container {
  background: rgba(255, 255, 255, 0.04);
  border-radius: .2rem;
  min-height: 9rem;
  padding-right: 0.8rem;
}

.application-detail-bottom .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: .2rem;
}

.application-detail-page span {
  width: .2rem;
  height: .2rem;
  background: rgba(255, 255, 255);
  opacity: 0.8;
}

.application-detail-page span.swiper-pagination-bullet-active {
  width: .5rem;
  height: .2rem;
  background: #2FA0E3;
  border-radius: .1rem;
}

/* 留言板模块 */
.message-box {
  overflow: hidden;
  padding: 1rem .8em;
  box-sizing: border-box;
}

.message-liuyan {
  display: flex;
  margin-bottom: 2rem;
}

.message-liuyan a {
  display: inline-block;
  width: 100%;
  height: 2rem;
  line-height: 2rem;
  background: rgba(255, 255, 255, 0.08);
  border-radius: .2rem;
  text-align: center;
  font-size: .7rem;
  color: rgba(255, 255, 255, 0.80);
}

.message-no {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.message-no img {
  display: block;
  width: 2rem;
  height: auto;
  margin-bottom: .4rem;
}

.message-no p {
  font-size: .6rem;
  color: rgba(255, 255, 255, 0.40);
}

.message-list .weui-cell_swiped {
  margin-bottom: .5rem;
}

.weui-cell_swiped>.weui-cell__bd {
  background: rgba(255, 255, 255, 1);
  background-color: white;
  border-radius: 0.5rem
}

.weui-cell__bd .weui-cell {
  padding: 1rem;
}

.weui-cell__bd .weui-cell__ft {
  text-align: left;
  padding: 0 1rem 1rem;
  font-size: .6rem;
  color: rgba(255, 255, 255, 0.60);
}

.weui-cell__bd p {
  font-size: .7rem;
  color: rgba(255, 255, 255, 0.80);
  word-break: break-all;
}

.del .weui-swiped-btn {
  padding: 1.9rem 1em;
  border-radius: 0 0.6rem 0.6rem 0;
}

.weui-cell:before {
  border-top: 0;
}

.weui-pull-to-refresh__layer {
  color: rgba(255, 255, 255, 0.80);
}

/* 设备连接图标背景色 */
.icon_shadow {
  width: 2.2rem;
  height: 2.2rem;
  background-color: rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  align-items: center;
  display: flex;
  justify-content: center;
}