html,
body {
  height: 100%;
  overflow-x: hidden;
}

* {
  box-sizing: border-box;
}

[v-clock] {
  display: none;
}

#app {
  margin: 0 auto;
}

.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 1.333333rem;
  padding: 0 0.266667rem;
  background: linear-gradient(90deg, #FF5810, #FFB43B);
  box-shadow: 0 0.026667rem 0.013333rem 0 rgba(180,55,12,0.7);
  z-index: 10;
}

.header .header-hd {
  width: 3.52rem;
  height: 1.053333rem;
}

.header .header-fd {
  width: 2.533333rem;
  height: 0.853333rem;
  background: url("../images/btn_download.gif")no-repeat center;
  background-size: 100%;
}

.footer {
  top: auto;
  bottom: 0;
  box-shadow: none;
}

.page {
  padding: 1.333333rem 0;
}

.search {
  display: flex;
  align-items: center;
  width: 8.92rem;
  height: 0.933333rem;
  margin: 0.4rem auto 0;
  padding-left: 0.36rem;
  background: #ECECEC;
  border-radius: 0.466667rem;
}

.search .search-icon {
  width: 0.56rem;
  height: 0.56rem;
  background: url("../images/search_icon.png")no-repeat center;
  background-size: 100%;
}

.search .search-inp {
  margin-left: 0.213333rem;
  font-family: PingFang SC;
  font-weight: 400;
  font-size: 0.32rem;
  color: #999999;
}

.nav-wrap {
  margin-top: 0.44rem;
}

.nav-wrap .nav-box .nav-list {
  display: flex;
  align-items: center;
  margin-bottom: 0.293333rem;
  padding-left: 0.226667rem;
}

.nav-wrap .nav-box .nav-list .nav-item {
  padding: 0 0.24rem;
  font-weight: 400;
  font-size: 0.373333rem;
  color: #666666;
}

.nav-wrap .nav-box .nav-list .nav-item.active {
  height: 0.666667rem;
  color: #FF721C;
  line-height: 0.64rem;
  background: rgba(255,135,38,0.3);
  border-radius: 0.333333rem;
  border: 0.013333rem solid #FF5810;
}

.nav-wrap .tab {
  display: flex;
  align-items: center;
  padding-left: 0.226667rem;
  margin-top: 0.373333rem;
}

.nav-wrap .tab .tab-item {
  margin: 0 0.4rem;
  font-weight: 400;
  font-size: 0.373333rem;
  color: #666666;
}

.nav-wrap .tab .tab-item.active {
  height: 0.666667rem;
  padding: 0 0.32rem;
  margin: 0 0.133333rem;
  color: #FF721C;
  line-height: 0.64rem;
  background: rgba(255,135,38,0.3);
  border-radius: 0.333333rem;
  border: 0.013333rem solid #FF5810;
}

.move-list {
  display: flex;
  flex-wrap: wrap;
  margin-top: 0.36rem;
  padding: 0 0.32rem;
}

.move-list .move-item {
  width: 2.906667rem;
  margin: 0 0.106667rem 0.266667rem;
}

.move-list .move-item .move-content {
  position: relative;
  height: 4.133333rem;
  border-radius: 0.173333rem;
  overflow: hidden;
}

.move-list .move-item .move-content .move-img {
  width: 100%;
  height: 100%;
}

.move-list .move-item .move-content .tag {
  position: absolute;
  top: 0.133333rem;
  right: 0.133333rem;
  height: 0.293333rem;
  padding: 0 0.066667rem;
  background: linear-gradient(90deg, #015EEA, #00C0FA);
  border-radius: 0.053333rem;
  font-weight: 400;
  font-size: 0.213333rem;
  color: #FFFFFF;
}

.move-list .move-item .move-content .list-footer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 0.533333rem;
  padding: 0 0.106667rem;
  text-align: right;
  font-weight: 400;
  font-size: 0.32rem;
  color: #FFFFFF;
  line-height: 0.533333rem;
  background: linear-gradient(to right, rgba(0,0,0,0.01), rgba(0,0,0, 0.5));
  border-radius: 0 0 0.173333rem 0.173333rem;
}

.move-list .move-item .move-content .list-footer span {
  margin-left: 0.053333rem;
  font-size: 0.32rem;
  color: #FF731D;
}

.move-list .move-item .move-name {
  margin-top: 0.16rem;
  font-weight: 400;
  font-size: 0.373333rem;
  color: #000000;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}