#main {
  width: 100%;
  position: relative;
  background-color: #1f2021;
  overflow: hidden;
  min-height: 100vh;
}
#main::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -4.07rem;
  z-index: 0;
  pointer-events: none;
  width: 7.5rem;
  height: 10.79rem;
  background: url(/assets/img/mobile/bg-yan.png) center / cover no-repeat;
}
.bg-news {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 25.1rem;
  background-image: url(/assets/img/mobile/bg-news.jpg);
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
}
@-webkit-keyframes news-detail-fade-in {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0.32rem, 0);
            transform: translate3d(0, 0.32rem, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
@keyframes news-detail-fade-in {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0.32rem, 0);
            transform: translate3d(0, 0.32rem, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
.news-detail {
  position: relative;
  color: #ccc7ba;
  font-size: 0.24rem;
  z-index: 1;
  padding: 1.2rem 0.35rem 2rem;
}
.news-detail > .news-header,
.news-detail > .tag-box,
.news-detail > .news-content {
  opacity: 0;
  -webkit-animation: news-detail-fade-in 1s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
          animation: news-detail-fade-in 1s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
  will-change: opacity, transform;
}
.news-detail > .news-header {
  -webkit-animation-delay: 0.18s;
          animation-delay: 0.18s;
}
.news-detail > .tag-box {
  -webkit-animation-delay: 0.28s;
          animation-delay: 0.28s;
}
.news-detail > .news-content {
  -webkit-animation-delay: 0.38s;
          animation-delay: 0.38s;
}
.news-detail .tag-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.news-detail .tag {
  color: #eadab1;
  width: 1.06rem;
  height: 0.33rem;
  background: url(/assets/img/mobile/bg-tag.png) center / contain no-repeat;
  text-align: center;
  line-height: 0.33rem;
}
.news-detail .line {
  width: 5.6rem;
  height: 1PX;
  background-color: #a1a280;
}
.news-detail img {
  width: 100%;
  height: auto;
  border: 1PX solid #a08d6b;
}
.news-detail h1 {
  font-size: 0.48rem;
  color: #eadab1;
  line-height: 0.64rem;
  margin: 0.2rem 0 0.5rem;
}
.news-detail h2 {
  font-size: 0.32rem;
  line-height: 0.45rem;
  margin-bottom: 0.5rem;
}
.news-detail p {
  margin: 0.25rem 0;
}
.news-header {
  font-size: 0.2rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 0.3rem;
}
.info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.info a {
  position: relative;
  color: #ccc7ba;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.info a.on {
  color: #eadab1;
}
.info a::after {
  content: '';
  margin: 0.04rem 0.12rem 0;
  width: 0.12rem;
  height: 0.21rem;
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAVCAYAAAByrA+0AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjo0MDoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjUwNTdCMjExMzZFQjExRjE5NzBDOEY3NUU5MTRCQUE4IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjUwNTdCMjEyMzZFQjExRjE5NzBDOEY3NUU5MTRCQUE4Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NTA1N0IyMEYzNkVCMTFGMTk3MEM4Rjc1RTkxNEJBQTgiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NTA1N0IyMTAzNkVCMTFGMTk3MEM4Rjc1RTkxNEJBQTgiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6Xdtj4AAABAUlEQVR42ozTz0sCQRjG8VlbSorAJLpoUqdAOiWCoCIhXv2LPbihl5AIgsAE6Sx48OBBUNfvC+/Asuys88IHf82j77wzmjiOn2B8FYwxHRSNZ0ngGu8IfANSj2j7Bo76vI7muUDARu547OFB3/vFFLErYLT/V/2FEEuMsXcFbN2iiyrWGGGTF7D1ghYuMMOPbdEVMDpumdwzVvhAuZAzkJ2SKqnL0LFY9jLAfXovWYGanvwV5pjgYD9MBmS0Dbzp6098p7/NBuTy9VHRaUT4y+o11BOWfm90sRzYwjUJCQwTlzDKW2wvn108c7WRdb3/8eV7vbfaivc/bpo40bN1EmAAg3xcVOEkS9kAAAAASUVORK5CYII=') center / contain no-repeat;
}
.info a:last-child::after {
  display: none;
}
@media (prefers-reduced-motion: reduce) {
  .news-detail > .news-header,
  .news-detail > .tag-box,
  .news-detail > .news-content {
    -webkit-animation: none;
            animation: none;
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}
.news-content a {
  color: #ccc7ba;
  text-decoration: underline;
}