@font-face {
  font-family: DINAlternateBold;
  src: url("https://upload.techgp.cn/production/htz-article/assets/DINPro-Medium.ttf");
}
* {
  -webkit-touch-callout: none;
/*系统默认菜单被禁用*/
  -webkit-user-select: none;
/*webkit浏览器*/
  -khtml-user-select: none;
/*早期浏览器*/
  -moz-user-select: none;
/*火狐*/
  -ms-user-select: none;
/*IE10*/
  user-select: none;
}
input,
textarea {
  -webkit-user-select: auto;
  user-select: auto;
}
.comment-input-wrapper * {
  -webkit-user-select: auto;
  user-select: auto;
}
* {
  padding: 0;
  margin: 0;
  font-family: 'PingFang SC', 'Avenir', Helvetica, Arial, sans-serif;
}
body {
  max-width: 700px;
  margin: 0px auto;
  background-color: #fff;
}
.ani {
  animation: bounce-in 0.5s;
}
.follow-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 1.12rem;
  background: #f6f6f6;
  border-radius: 0.28rem;
  padding: 0 0.3rem;
  font-size: 0.28rem;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  color: #444;
}
.follow-head .author-block {
  display: flex;
  align-items: center;
}
.follow-head .author-block .column-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 200px;
}
.follow-head .author-block img {
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 0.3rem;
  margin-right: 0.22rem;
}
.follow-head .follow-btn {
  -webkit-tap-highlight-color: transparent;
  width: 74px;
  height: 30px;
  background: url("https://upload.techgp.cn/production/static-article-h5/subscibe/red.png") center no-repeat;
  background-size: contain;
}
.follow-head .has-follow {
  background: url("https://upload.techgp.cn/production/static-article-h5/subscibe/gray.png") center no-repeat;
  background-size: contain;
}
.follow-head .focus-btn {
  -webkit-tap-highlight-color: transparent;
  width: 74px;
  height: 30px;
  background: url("https://upload.techgp.cn/production/static-article-h5/subscibe/red-gz.png") center no-repeat;
  background-size: contain;
}
.follow-head .has-focus {
  background: url("https://upload.techgp.cn/production/static-article-h5/subscibe/gray-gz.png") center no-repeat;
  background-size: contain;
}
.page {
  padding: 0 0.3rem 0;
}
#content img {
  max-width: 100%;
  object-fit: cover;
}
#content pre {
  word-break: break-all;
  white-space: normal;
}
.news-title {
  font-size: 0.38rem;
  font-weight: bold;
  color: #444;
  text-align: left;
  word-break: break-all;
  margin-top: 0.26rem;
}
.news-time {
  color: #b4b4b4;
}
.news-head {
  display: flex;
  padding: 0.16rem 0;
  justify-content: space-between;
  align-items: center;
}
.news-head .teacher-wrap {
  display: flex;
  flex: 1;
}
.news-head .teacher-wrap .teacher-avatar {
  width: 32px;
  height: 32px;
  border-radius: 32px;
  margin-right: 6px;
}
.news-head .teacher-wrap .teacher-info {
  display: flex;
  flex: 1;
  flex-direction: column;
  color: #444;
  font-size: 0.28rem;
}
.news-head .column {
  color: #b4b4b4;
  font-size: 0.28rem;
  display: flex;
  align-items: center;
}
.news-head .column .name {
  margin-right: 10px;
}
.news-head .column .t-avatar {
  width: 32px;
  height: 32px;
  border-radius: 32px;
  margin-right: 6px;
}
.news-head .pdf-btn {
  display: inline-block;
  color: #f44849 !important;
  width: 1.5rem;
  height: 0.48rem;
  background: url("https://upload.techgp.cn/production/htz-article/assets/show-icon.png") no-repeat center;
  background-size: contain;
}
.hor {
  flex-direction: row !important;
  justify-content: space-between !important;
  align-items: center !important;
}
.market {
  width: 100%;
  padding: 0 0 0.16rem;
  margin-bottom: 1px;
  line-height: 0.43rem;
  font-size: 0.3rem;
  font-weight: 400;
  color: #808080;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  border-bottom: 0.5px solid #edeff3;
}
.market-list {
  overflow: hidden;
  width: 6rem;
  display: flex;
  justify-content: space-between;
  flex-flow: row wrap;
}
.market-item {
  min-width: 45%;
  padding-top: 0.2rem;
  -webkit-tap-highlight-color: transparent;
}
.market-scale {
  margin-left: 0.16rem;
  font-size: 0.28rem;
  font-weight: 500;
  color: #cf3231;
}
.tricker {
  width: 0.2rem;
  height: 0.2rem;
  border-right: 0.04rem solid #d8d8d8;
  border-bottom: 0.04rem solid #d8d8d8;
  margin-top: 0.15rem;
  transform: rotate(45deg) translate(-0.05rem, 0.15rem);
  -webkit-tap-highlight-color: transparent;
}
.pull-down {
  transform: rotate(-135deg) translate(0, -0.25rem);
}
.dropped {
  color: #268d5b;
}
.up {
  color: #e63535;
}
#content {
  font-size: 0.34rem !important;
  line-height: 1.7;
  padding: 0.2rem 0;
  word-break: break-all;
  color: #444;
}
#content p {
  font-size: 0.35rem !important;
  color: #1f2126 !important;
  word-break: break-all;
}
#content>p {
  margin-bottom: 0.35rem;
}
#content section {
  padding: 0 !important;
}
.match-symbol {
  color: #4c97ff;
}
.disclaimer {
  background: #f8f9f9;
  color: #b2b2b2;
  padding: 0.24rem 0.34rem;
  margin-bottom: 20px;
}
.disclaimer p {
  font-size: 0.2rem;
}
.disclaimer .disclaimer-title {
  margin-bottom: 0.06rem;
}
.share {
  margin-bottom: 30px;
}
.share-title {
  text-align: center;
  font-size: 0.28rem;
  color: #808080;
  line-height: 40px;
}
.share-icons {
  display: flex;
  justify-content: center;
}
.share-icons img {
  width: 52px;
  height: 80px;
  object-fit: contain;
}
.split-line {
  height: 10px;
  background: #f4f5f7;
}
.recommend-wrap .recommend-list {
  background: #fff;
  padding: 0 0.3rem;
}
.recommend-wrap .recommend-list .recommend-item {
  display: flex;
  padding: 9px 0;
  max-height: 1.92rem;
  border-bottom: 0.5px solid #e9ebf0;
  box-sizing: border-box;
  justify-content: space-between;
}
.recommend-wrap .recommend-list .recommend-item .col-xs {
  display: flex;
}
.recommend-wrap .recommend-list .recommend-item:last-child {
  border-bottom: none;
}
.recommend-wrap .recommend-list .recommend-item img {
  width: 2.08rem;
  height: 1.58rem;
  margin-left: 0.3rem;
  flex: 0;
  object-fit: cover;
  border-radius: 2px;
}
.recommend-wrap .recommend-list .recommend-item .title {
  font-size: 0.32rem;
  line-height: 22px;
  color: #444;
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  word-break: break-all;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.recommend-wrap .recommend-list .recommend-item .time {
  font-size: 0.28rem;
  color: #b4b4b4;
  margin-top: 8px;
}
.recommend-wrap .recomed-title {
  height: 40px;
  line-height: 40px;
  background: #fff;
  padding-left: 0.36rem;
  border-bottom: 0.5px solid #e9ebf0;
  color: #444;
  font-size: 0.32rem;
  position: relative;
}
.has-read {
  color: #808080 !important;
}
.between-xs {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.comment-head {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 0.5px solid #e9ebf0;
}
.comment-total {
  display: flex;
  position: relative;
  line-height: 0.8rem;
  padding-left: 0.36rem;
}
.comment-sort {
  width: 1.92rem;
  height: 0.58rem;
  background-color: #f6f6f6;
  border-radius: 0.29rem;
  display: flex;
  align-items: center;
  margin-right: 0.3rem;
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.comment-sort .sort-item-create-time,
.comment-sort .sort-item-support-count {
  flex: 1;
  font-size: 0.26rem;
  color: #b4b4b4;
  display: flex;
  align-items: center;
  justify-content: center;
}
.comment-sort .active-sort-item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 0.92rem;
  height: 0.42rem;
  background: #fff;
  box-shadow: 0rem 0.04rem 0.08rem 0rem rgba(75,75,75,0.1);
  border-radius: 0.25rem;
  font-size: 0.26rem;
  color: #ce5959;
  text-shadow: 0px 0px 0px rgba(206,89,89,0.27);
  position: absolute;
  left: 0;
  top: 0.08rem;
  transition: 0.3s transform;
}
.comment-sort .createTime {
  transform: translateX(5px);
}
.comment-sort .supportCount {
  transform: translateX(0.88rem);
}
.comment-num {
  font-size: 0.3rem;
  color: #444;
}
.like-total {
  font-size: 0.3rem;
  font-weight: 400;
  color: #98a0b3;
}
.under-line {
  display: inline-block;
  width: 3px;
  height: 15px;
  background: #ce5959;
  position: absolute;
  top: 12px;
  left: 0;
}
.comment-list {
  padding: 0 0.36rem;
  padding-bottom: 2rem;
}
.comment-item {
  list-style: none;
  border-bottom: 0.5px solid #f9f9f9;
  padding: 0.24rem 0;
  display: flex;
}
.comment-item:last-child {
  border-bottom: none;
}
.comment-avatar {
  width: 32px;
  height: 32px;
  border-radius: 32px;
  margin-right: 0.18rem;
}
.comment-detail {
  flex: 1;
}
.comment-detail .creator {
  display: flex;
  justify-content: space-between;
  line-height: 32px;
}
.comment-detail .creator .comment-nickname {
  line-height: 18px;
}
.comment-detail .creator .comment-nickname .name {
  font-size: 0.28rem;
  color: #444;
}
.comment-detail .creator .comment-nickname .name .as-top {
  display: inline;
  padding: 0px 5px;
  background-color: #f6f6f6;
  border-radius: 3px;
  font-size: 0.26rem;
  color: #b4b4b4;
}
.comment-detail .creator .comment-nickname .time {
  font-size: 0.26rem;
  color: #b4b4b4;
}
.comment-detail .creator .support-count {
  color: #98a0b3;
  font-size: 0.28rem;
  position: relative;
  display: flex;
  align-items: center;
  -webkit-tap-highlight-color: transparent;
}
.comment-detail .creator .support-count span {
  color: #b4b4b4;
  font-weight: 400;
  font-size: 0.28rem;
  position: relative;
  top: 3px;
}
.comment-detail .creator .support-count::after {
  content: '';
  background: url("https://upload.techgp.cn/production/htz-article/assets/like-icon-new-2.svg") no-repeat center;
  background-size: contain;
  margin-left: 0.06rem;
  display: inline-block;
  width: 20px;
  height: 20px;
}
.comment-detail .creator .support-count.active span {
  color: #ce5959;
}
.comment-detail .creator .support-count.active:after {
  background: url("https://upload.techgp.cn/production/htz-article/assets/like-active-icon-new.svg") no-repeat center;
  background-size: contain;
}
.comment-detail .author-reply {
  color: #808080;
  display: flex;
  height: 20px;
  line-height: 20px;
}
.comment-detail .author-reply .label {
  font-size: 0.3rem;
  margin-right: 5px;
  color: #138ab4;
}
.comment-detail .author-reply .time {
  font-size: 0.26rem;
  color: #b4b4b4;
}
.comment-detail .comment-content {
  font-size: 0.32rem;
  word-break: break-all;
  color: #444;
  padding-top: 5px;
  line-height: 24px;
}
.comment-detail .three-line {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.comment-detail .reply-wrapper {
  background-color: #f6f6f6;
  padding: 12px;
  margin-top: 8px;
  border-radius: 5px;
}
.no-comment {
  text-align: center;
  color: #bdbfc2;
  font-size: 0.32rem;
  margin-top: 1rem;
}
.toast-wrapper {
  display: flex;
  align-items: center;
}
.toast-wrapper .toast {
  box-sizing: border-box;
  background-color: rgba(48,45,55,0.7);
  border-radius: 5px;
  padding: 10px 30px;
  display: inline-block;
  max-width: 240px;
  min-width: 120px;
  color: #fff;
  z-index: 9999;
  position: fixed;
  font-size: 0.3rem;
  text-align: center;
  top: 40%;
  left: 50%;
  transform: translateX(-50%);
}
.control-bar {
  box-sizing: border-box;
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 50px;
  background-color: #fff;
  padding: 7px 15px;
  border-top: 1px solid #e9ebf0;
  z-index: 99;
  display: flex;
  padding-bottom: calc(7px + env(safe-area-inset-bottom));
  height: calc(50px + env(safe-area-inset-bottom));
}
.control-bar .comment-btn {
  display: flex;
  font-size: 0.28rem;
  font-weight: 400;
  color: #808080;
  align-items: center;
  background: #f2f2f2;
  border-radius: 18px;
  flex: 1;
  padding-left: 10px;
}
.control-bar .comment-btn img {
  width: 15px;
  height: 15px;
  margin-right: 5px;
}
.control-bar .other-wrapper {
  display: flex;
  align-items: center;
  padding-left: 13px;
}
.control-bar .other-wrapper .btn-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.control-bar .other-wrapper .btn-wrapper img {
  width: 20px;
  height: 20px;
}
.control-bar .other-wrapper .btn-wrapper .func-name {
  color: #707a8d;
  font-size: 0.22rem;
}
.control-bar .other-wrapper .content-t,
.control-bar .other-wrapper .comment-t {
  margin-left: 12px;
}
.control-bar .other-wrapper .collect-t,
.control-bar .other-wrapper .like-t,
.control-bar .other-wrapper .share-t {
  margin-left: 25px;
}
.control-bar .superscript {
  position: absolute;
  top: -7px;
  left: 15px;
  font-size: 10px;
  color: #707a8d;
  font-family: DINAlternateBold;
  padding: 0 3px;
  background: #ce5959;
  color: #fff;
  border-radius: 50px;
}
.comment-input-wrapper {
  box-sizing: border-box;
  padding: 0.26rem 0.3rem 0;
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  background: #f6f7f9;
  z-index: 99;
  overflow: hidden;
  display: none;
}
.comment-input {
  width: 100%;
  overflow: hidden;
  position: relative;
}
.comment-block {
  width: 100%;
  height: 4.5rem;
  background: #fff;
  margin-bottom: 0.3rem;
  -webkit-user-select: text;
  font-size: 0.3rem;
  outline: none;
  padding: 5px;
  overflow-y: auto;
}
.comment-count {
  font-size: 0.28rem;
  color: #98a0b3;
  margin-left: 0.22rem;
}
.btns-wrapper {
  display: flex;
  justify-content: space-between;
}
.btns-wrapper .icon-btns {
  display: flex;
  align-items: center;
}
.btns-wrapper .icon-btns .emoji {
  width: 0.58rem;
  height: 0.58rem;
  margin-left: 5px;
}
.btns-wrapper .actions {
  display: flex;
}
.comment-count {
  font-size: 0.28rem;
  color: #98a0b3;
  margin-left: 0.22rem;
}
.btn-cancel,
.btn-confirm {
  padding: 0.08rem 0.4rem;
  font-size: 0.3rem;
  color: #fff;
  background: #c7c7c7;
  border: none;
  outline: none;
}
.btn-confirm {
  background: #f44849;
  margin-left: 0.22rem;
}
.btn-confirm[disabled] {
  opacity: 0.4;
}
.tip {
  font-size: 0.28rem;
  color: #99a1b4;
  text-align: center;
  line-height: 40px;
}
.download-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
  background: #fff;
  width: 100%;
  height: 1.2rem;
  position: fixed;
  bottom: 0;
  padding: 0 0.36rem;
  box-shadow: inset 0px 1px 0 0 #eee;
  z-index: 111;
  padding-bottom: env(safe-area-inset-bottom);
  height: calc(1.2rem + env(safe-area-inset-bottom));
}
.download-content .sina-logo {
  height: 0.8rem;
}
.download-content .app-info {
  width: 5rem;
  font-size: 0.24rem;
  display: flex;
  align-items: center;
}
.download-content .app-info .icon {
  width: 0.84rem;
  height: 0.84rem;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.download-content .app-info .info {
  flex-grow: 1;
  flex-basis: 0;
  padding-left: 0.24rem;
}
.download-content .app-info .info .title {
  color: #444;
  font-size: 0.3rem;
  font-weight: 500;
}
.download-content .app-info .info .desc {
  font-size: 0.24rem;
  color: #b4b4b4;
  display: inline-block;
}
.download-content .download-button {
  color: #fff;
  font-size: 0.3rem;
  padding: 0.14rem 0.4rem;
  background: #ce5959;
  border-radius: 2px;
}
.emojiMsg {
  height: 0.42rem;
  width: 0.42rem;
  vertical-align: middle;
}
.toggle-btn {
  color: #138ab4;
  font-size: 0.32rem;
}
.display-block {
  display: block !important;
}
.down-load-icon {
  position: absolute;
  right: 0.36rem;
  bottom: 0.72rem;
  width: 0.74rem;
  height: 0.74rem;
  z-index: 9999;
  cursor: pointer;
}
.FAKE_A {
  color: #007aff;
  display: inline;
  text-decoration: underline;
}
.task-success {
  width: 160px;
  height: 42px;
  border-radius: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(68,68,68,0.7);
  position: fixed;
  bottom: 1.4rem;
  left: 50%;
  margin-left: -80px;
  font-size: 0.32rem;
  color: #fff;
  animation: bounce-in 0.5s;
}
.task-success img {
  width: 22px;
}
.task-success .score {
  color: #ffce9d;
  margin-right: 3px;
  margin-left: 2px;
  position: relative;
  top: 1px;
}
.f-loading {
  width: 50px;
  height: 50px;
  position: fixed;
  top: 50%;
  right: 0;
}
.banner {
  text-align: center;
  height: 1.6rem;
}
.banner .ad-img {
  width: 6.9rem;
  height: 1.2rem;
  margin: 10px 0;
  border-radius: 3px;
}
.swiper-pagination {
  bottom: 15px !important;
}
.swiper-pagination-bullet {
  width: 6px !important;
  height: 5px !important;
  border-radius: 0 !important;
  background-color: #fff !important;
  opacity: 1 !important;
  margin: 0 3px !important;
}
.swiper-pagination-bullet-active {
  background-color: #ce5959 !important;
  width: 12px !important;
}
.audio-bar {
  background-color: #f6f6f6;
  border-radius: 10px;
  padding: 16px 15px;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.audio-bar .audio-title {
  font-size: 0.34rem;
  font-weight: 500;
  color: #444;
  line-height: 22px;
  display: -webkit-box;
  overflow: hidden;
  word-break: break-all;
  margin-bottom: 10px;
}
.audio-bar .audio-wrapper {
  display: flex;
}
.audio-bar .audio-wrapper .progress-bar {
  display: flex;
  align-items: center;
  flex: 1;
  padding-right: 5px;
  font-weight: 400;
  color: #808080;
  font-size: 0.24rem;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
.audio-bar .audio-wrapper .progress-bar .current-time {
  width: 35px;
  text-align: right;
}
.audio-bar .audio-wrapper .progress-bar .duration-time {
  width: 35px;
  text-align: right;
}
.audio-bar .audio-wrapper .progress-bar .progress {
  flex: 1;
  position: relative;
  height: 10px;
  display: flex;
  align-items: center;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
.audio-bar .audio-wrapper .progress-bar .progress .bg-bar {
  position: absolute;
  left: 0;
  right: 0;
  height: 3px;
  background: #ececec;
  border-radius: 2px;
  margin: 0 5px;
}
.audio-bar .audio-wrapper .progress-bar .progress .pg-bar {
  position: absolute;
  left: 0;
  right: 500px;
  height: 3px;
  background: #ce5959;
  border-radius: 2px;
  margin: 0 5px;
}
.audio-bar .audio-wrapper .progress-bar .progress .audio-pointer {
  width: 18px;
  height: 18px;
  background: #fff;
  border: 1px solid #e2e2e2;
  border-radius: 18px;
  position: absolute;
  left: 3px;
  top: -5px;
}
.audio-bar .audio-wrapper .audio-btn-wrapper {
  flex-basis: 50px;
  height: 50px;
  background: url("https://upload.techgp.cn/production/htz-article/assets/play-bg.svg") center no-repeat;
  position: relative;
}
.audio-bar .audio-wrapper .play::after {
  display: block;
  content: '';
  background: url("https://upload.techgp.cn/production/htz-article/assets/play-icon.svg") center no-repeat;
  width: 20px;
  height: 20px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.audio-bar .audio-wrapper .pause::after {
  display: block;
  content: '';
  background: url("https://upload.techgp.cn/production/htz-article/assets/pause-icon.svg") center no-repeat;
  width: 20px;
  height: 20px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.audio-bar .audio-wrapper .loading::before {
  display: block;
  content: '';
  background: url("https://upload.techgp.cn/production/htz-article/assets/circle.png") center no-repeat;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  animation: rotate 0.5s infinite linear;
}
.column-groups {
  margin-bottom: 10px;
}
.column-btn {
  font-size: 12px;
  line-height: 14px;
  color: #808080;
  border: 0.5px solid #ececec;
  display: inline-block;
  margin-right: 5px;
  padding: 3px 5px;
  -webkit-tap-highlight-color: transparent;
}
.autopush-popup-wrapper .backdrop {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5);
  z-index: 100;
}
.autopush-popup-wrapper .popup {
  z-index: 101;
  position: fixed;
  width: 6rem;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 8px;
}
.autopush-popup-wrapper .popup .autopush-image {
  width: 3rem;
  height: 3rem;
  object-fit: contain;
  margin-top: 0.2rem;
  margin-bottom: 0.2rem;
}
.autopush-popup-wrapper .popup .ask-title {
  font-weight: 500;
  color: #444;
  line-height: 24px;
  font-size: 17px;
  margin-bottom: 0.2rem;
}
.autopush-popup-wrapper .popup .ask-desc {
  font-weight: 400;
  font-size: 15px;
  color: #444;
  line-height: 24px;
  margin-bottom: 0.2rem;
}
.autopush-popup-wrapper .popup .opt-btns {
  width: 100%;
  height: 1rem;
  border-top: 0.5px solid #edeff3;
  display: flex;
}
.autopush-popup-wrapper .popup .opt-btns .reject-btn {
  flex: 1;
  font-weight: 500;
  color: #444;
  font-size: 17px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-right: 0.5px solid #edeff3;
}
.autopush-popup-wrapper .popup .opt-btns .allow-btn {
  flex: 1;
  font-weight: 500;
  color: #ce5959;
  font-size: 17px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.share_audio_context {
  height: 0;
  overflow: hidden;
  transition: 0.3s height;
  border: none !important;
  font-size: 0.28rem !important;
  position: relative !important;
  background: #f6f6f6 !important;
  border-radius: 0.34rem !important;
  padding: 0 !important;
  margin: 10px auto !important;
}
.share_audio_context span {
  height: 0.52rem !important;
  width: 0.52rem !important;
  margin: 0 !important;
  margin-left: 6px !important;
  text-align: left !important;
}
.share_audio_info {
  display: flex !important;
}
.share_audio_info >span {
  display: flex !important;
  width: 100% !important;
  height: 0.7rem !important;
}
.share_audio_info .share_audio_title {
  display: block !important;
  line-height: 0.7rem !important;
  font-size: 0.28rem !important;
  padding-left: 0.2rem;
  padding-right: 0.2rem;
  width: 1.4rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.share_audio_info .audio-ani {
  flex: 1;
  min-height: 0.7rem;
}
.share_audio_info .audio-ani2 {
  flex: 1;
  min-height: 0.7rem;
  display: flex;
  align-items: center;
  margin: 0 0.1rem 0 0.2rem;
}
.share_audio_info .share_audio_desc {
  width: 1rem !important;
  height: 0.7rem !important;
  line-height: 0.7rem !important;
  padding-top: 0 !important;
  padding-left: 3px;
  font-size: 0.28rem !important;
}
@-moz-keyframes bounce-in {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  70% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes bounce-in {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  70% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 1;
  }
}
@-o-keyframes bounce-in {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  70% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 1;
  }
}
@keyframes bounce-in {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  70% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes bounce-in {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@-webkit-keyframes bounce-in {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@-o-keyframes bounce-in {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes bounce-in {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@-moz-keyframes rotate {
  0% {
    transform: translate(-50%, -50%) rotate(0);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
@-webkit-keyframes rotate {
  0% {
    transform: translate(-50%, -50%) rotate(0);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
@-o-keyframes rotate {
  0% {
    transform: translate(-50%, -50%) rotate(0);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
@keyframes rotate {
  0% {
    transform: translate(-50%, -50%) rotate(0);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}


div[contenteditable]:empty:before{
  content: attr(placeholder);
  color: #CCCCCC;
}
.emoji-wrapper {
  /* position: fixed;
  left: 0;
  bottom: 0; */
  transform: translate(0, 260%);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 10000;
  width: 100%;
  background-color: #F5F6FA;
  transition: transform .3s;
  max-width: 500px;
}

.showActionSheet {
  transform: translate(0, 0) !important;
}

.qq_face {
  height: 222px;
  overflow-y: scroll;
  margin: 0 5px;
  display: flex;
}

.qq_face a {
  float: left;
  display: block;
  width: 44px;
  height: 44px;
  font-size: 0;
  text-indent: -999em;
  cursor: pointer;
  background: url('https://upload.techgp.cn/production/hxg-article/assets/qq_face.png') no-repeat;
  background-size: 570px 265px;
}

@media (max-width: 370px) {
  .qq_face {
    margin: 0 5px;
    text-align: center;
    display: flex;
  }
}

.qq_face .swiper-slide:last-child {
  /* align-content: flex-start; */
}

.qq_face .swiper-slide {
  display: flex;
  justify-content: space-around;
  align-items: center;
  flex-wrap: wrap;
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
}

.qq_face .swiper-slide:last-child {
  /* align-content: flex-start; */
}

.qq_face .swiper-slide:last-child:after {
  content: '';
  flex: auto;
}

.qq_face .swiper-pagination-bullet {
  opacity: 0.1;
}

.qq_face .swiper-pagination-bullet-active {
  background: #000;
  opacity: .5;
}

.qq_face .qqface0 {
  background-position: 6px 6px
}

.qq_face .qqface1 {
  background-position: -34px 6px
}

.qq_face .qqface2 {
  background-position: -72px 6px
}

.qq_face .qqface3 {
  background-position: -110px 6px
}

.qq_face .qqface4 {
  background-position: -147px 6px
}

.qq_face .qqface5 {
  background-position: -186px 6px
}

.qq_face .qqface6 {
  background-position: -224px 6px
}

.qq_face .qqface7 {
  background-position: -261px 6px
}

.qq_face .qqface8 {
  background-position: -300px 6px
}

.qq_face .qqface9 {
  background-position: -338px 6px
}

.qq_face .qqface10 {
  background-position: -375px 6px
}

.qq_face .qqface11 {
  background-position: -414px 6px
}

.qq_face .qqface12 {
  background-position: -452px 6px
}

.qq_face .qqface13 {
  background-position: -491px 6px
}

.qq_face .qqface14 {
  background-position: -528px 6px;
}

.qq_face .qqface15 {
  background-position: 6px -34px
}

.qq_face .qqface16 {
  background-position: -34px -34px
}

.qq_face .qqface17 {
  background-position: -72px -34px
}

.qq_face .qqface18 {
  background-position: -110px -34px
}

.qq_face .qqface19 {
  background-position: -147px -34px
}

.qq_face .qqface20 {
  background-position: -186px -34px
}

.qq_face .qqface21 {
  background-position: -224px -34px
}

.qq_face .qqface22 {
  background-position: -261px -34px
}

.qq_face .qqface23 {
  background-position: -300px -34px
}

.qq_face .qqface24 {
  background-position: -338px -34px
}

.qq_face .qqface25 {
  background-position: -375px -34px
}

.qq_face .qqface26 {
  background-position: -414px -34px
}

.qq_face .qqface27 {
  background-position: -452px -34px
}

.qq_face .qqface28 {
  background-position: -491px -34px
}

.qq_face .qqface29 {
  background-position: -528px -34px
}

.qq_face .qqface30 {
  background-position: 6px -72px
}

.qq_face .qqface31 {
  background-position: -34px -72px
}

.qq_face .qqface32 {
  background-position: -72px -72px
}

.qq_face .qqface33 {
  background-position: -110px -72px
}

.qq_face .qqface34 {
  background-position: -147px -72px
}

.qq_face .qqface35 {
  background-position: -186px -72px
}

.qq_face .qqface36 {
  background-position: -224px -72px
}

.qq_face .qqface37 {
  background-position: -261px -72px
}

.qq_face .qqface38 {
  background-position: -300px -72px
}

.qq_face .qqface39 {
  background-position: -338px -72px
}

.qq_face .qqface40 {
  background-position: -375px -72px
}

.qq_face .qqface41 {
  background-position: -414px -72px
}

.qq_face .qqface42 {
  background-position: -452px -72px
}

.qq_face .qqface43 {
  background-position: -491px -72px
}

.qq_face .qqface44 {
  background-position: -528px -72px
}

.qq_face .qqface45 {
  background-position: 6px -110px
}

.qq_face .qqface46 {
  background-position: -34px -110px
}

.qq_face .qqface47 {
  background-position: -72px -110px
}

.qq_face .qqface48 {
  background-position: -110px -110px
}

.qq_face .qqface49 {
  background-position: -147px -110px
}

.qq_face .qqface50 {
  background-position: -186px -110px
}

.qq_face .qqface51 {
  background-position: -224px -110px
}

.qq_face .qqface52 {
  background-position: -261px -110px
}

.qq_face .qqface53 {
  background-position: -300px -110px
}

.qq_face .qqface54 {
  background-position: -338px -110px
}

.qq_face .qqface55 {
  background-position: -375px -110px
}

.qq_face .qqface56 {
  background-position: -414px -110px
}

.qq_face .qqface57 {
  background-position: -452px -110px
}

.qq_face .qqface58 {
  background-position: -491px -110px
}

.qq_face .qqface59 {
  background-position: -528px -110px
}

.qq_face .qqface60 {
  background-position: 6px -148px
}

.qq_face .qqface61 {
  background-position: -34px -148px
}

.qq_face .qqface62 {
  background-position: -72px -148px
}

.qq_face .qqface63 {
  background-position: -110px -148px
}

.qq_face .qqface64 {
  background-position: -147px -148px
}

.qq_face .qqface65 {
  background-position: -186px -148px
}

.qq_face .qqface66 {
  background-position: -224px -148px
}

.qq_face .qqface67 {
  background-position: -261px -148px
}

.qq_face .qqface68 {
  background-position: -300px -148px
}

.qq_face .qqface69 {
  background-position: -338px -148px
}

.qq_face .qqface70 {
  background-position: -375px -148px
}

.qq_face .qqface71 {
  background-position: -414px -148px
}

.qq_face .qqface72 {
  background-position: -452px -148px
}

.qq_face .qqface73 {
  background-position: -491px -148px
}

.qq_face .qqface74 {
  background-position: -528px -148px
}

.qq_face .qqface75 {
  background-position: 6px -185px
}

.qq_face .qqface76 {
  background-position: -34px -185px
}

.qq_face .qqface77 {
  background-position: -72px -185px
}

.qq_face .qqface78 {
  background-position: -110px -185px
}

.qq_face .qqface79 {
  background-position: -147px -185px
}

.qq_face .qqface80 {
  background-position: -186px -185px
}

.qq_face .qqface81 {
  background-position: -224px -185px
}

.qq_face .qqface82 {
  background-position: -261px -185px
}

.qq_face .qqface83 {
  background-position: -300px -185px
}

.qq_face .qqface84 {
  background-position: -338px -185px;
}

.qq_face .qqface85 {
  background-position: -375px -185px
}

.qq_face .qqface86 {
  background-position: -414px -185px
}

.qq_face .qqface87 {
  background-position: -452px -185px
}

.qq_face .qqface88 {
  background-position: -491px -185px
}

.qq_face .qqface89 {
  background-position: -528px -185px
}

.qq_face .qqface90 {
  background-position: 6px -225px;
}

.qq_face .qqface91 {
  background-position: -34px -225px;
}

.qq_face .qqface92 {
  background-position: -72px -225px;
}

.qq_face .qqface93 {
  background-position: -110px -225px;
}

.qq_face .qqface94 {
  background-position: -147px -225px;
}

.qq_face .qqface95 {
  background-position: -186px -225px;
}

.qq_face .qqface96 {
  background-position: -224px -225px;
}

.qq_face .qqface97 {
  background-position: -261px -225px;
}

.qq_face .qqface98 {
  background-position: -300px -225px;
}

.qq_face .qqface99 {
  background-position: -338px -225px;
}

.qq_face .qqface100 {
  background-position: -375px -225px;
}

.qq_face .qqface101 {
  background-position: -414px -225px;
}

.qq_face .qqface102 {
  background-position: -452px -225px;
}

.qq_face .qqface103 {
  background-position: -491px -225px;
}

.qq_face .qqface104 {
  background-position: -528px -225px;
}