/** mixins **/
@font-face {
  font-family: "blzIconFont";
  src: url(https://hs.res.netease.com/pc/zt/20240711145422/assets/iconfont_a8b2bfac.woff2) format('woff2'), url(https://hs.res.netease.com/pc/zt/20240711145422/assets/iconfont_97ffcb17.woff) format('woff');
}
.blz-iconfont {
  /* stylelint-disable */
  font-family: "blzIconFont" !important;
  /* stylelint-enable */
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon-dashen:before {
  content: "\E640";
}
.icon-dui:before {
  content: "\E63F";
}
.icon-liebiao:before {
  content: "\E63E";
}
.icon-suo:before {
  content: "\E63D";
}
.icon-tieba:before {
  content: "\E63C";
}
.icon-xiaohongshu:before {
  content: "\E637";
}
.icon-bilibili:before {
  content: "\E639";
}
.icon-weibo:before {
  content: "\E63A";
}
.icon-douyin:before {
  content: "\E63B";
}
.icon-weixin:before {
  content: "\E638";
}
.icon-a-edit1x:before {
  content: "\E636";
}
.icon-a-svg_111x:before {
  content: "\E62E";
}
.icon-a-svg_91x:before {
  content: "\E62F";
}
.icon-a-social-youtubef56a46d1a6cc2ffd841bc4a8d1de3d3d1x:before {
  content: "\E634";
}
.icon-a-social-facebook20d2ed4f5a690fe838af4c2beb4ba8be1:before {
  content: "\E635";
}
.icon-a-instagram1x:before {
  content: "\E630";
}
.icon-a-social-twitter0b53f984eb1a5a3eedc1976252de66631x:before {
  content: "\E631";
}
.icon-a-reddit1x:before {
  content: "\E632";
}
.icon-a-facebook1x:before {
  content: "\E633";
}
.icon-a-shopping-bag1x:before {
  content: "\E62D";
}
.icon-a-user-circle1x:before {
  content: "\E626";
}
.icon-a-grid1x1:before {
  content: "\E62C";
}
.icon-a-phone1x:before {
  content: "\E62B";
}
.icon-a-user1x:before {
  content: "\E624";
}
.icon-a-download1x:before {
  content: "\E625";
}
.icon-menu:before {
  content: "\E627";
}
.icon-a-log-out1x:before {
  content: "\E628";
}
.icon-a-chevron-down1x:before {
  content: "\E629";
}
.icon-a-bn-checkmark-filled1x:before {
  content: "\E62A";
}
.icon-a-help-circle1x:before {
  content: "\E621";
}
.icon-a-search1x:before {
  content: "\E622";
}
.icon-a-arrow-up-right1x:before {
  content: "\E620";
}
.icon-a-settings1x:before {
  content: "\E623";
}
.font-12 {
  font-size: 1rem;
}
.font-14 {
  font-size: 1.16666667rem;
}
.font-16 {
  font-size: 1.33333333rem;
}
.font-18 {
  font-size: 1.5rem;
}
.font-20 {
  font-size: 1.66666667rem;
}
.font-22 {
  font-size: 1.83333333rem;
}
.font-24 {
  font-size: 2rem;
}
.font-xs {
  font-size: 1rem;
}
.font-sm {
  font-size: 1.16666667rem;
}
.font-md {
  font-size: 1.33333333rem;
}
.font-lg {
  font-size: 1.33333333rem;
}
.font-larger {
  font-size: 1.66666667rem;
}
.header-xs {
  font-size: 1.66666667rem;
}
.header-sm {
  font-size: 2rem;
}
.header-md {
  font-size: 2.5rem;
}
.header-lg {
  font-size: 3rem;
}
@media screen and (min-width: 750px) {
  .font-xs {
    font-size: 1.16666667rem;
  }
  .font-sm {
    font-size: 1.33333333rem;
  }
  .font-md {
    font-size: 1.5rem;
  }
  .font-lg {
    font-size: 1.66666667rem;
  }
  .font-larger {
    font-size: 2rem;
  }
  .header-xs {
    font-size: 2rem;
  }
  .header-sm {
    font-size: 3rem;
  }
  .header-md {
    font-size: 4rem;
  }
  .header-lg {
    font-size: 5rem;
  }
}
/* stylelint-disable */
@font-face {
  font-family: "fzlth";
  src: url("https://nie.res.netease.com/comm/js/nie/ref/fonts/fzlth.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "belweb";
  src: url("https://nie.res.netease.com/comm/js/leihuo/fonts/BELWEB.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
.social-channel {
  position: relative;
  font-family: 'fzlth', sans-serif;
  z-index: 12;
  -webkit-box-shadow: 0 0 12px 2px rgba(0, 0, 0, 0.7);
          box-shadow: 0 0 12px 2px rgba(0, 0, 0, 0.7);
  --pop-border-radius: 6px;
  --pop-content-padding: 6px 6px 14px;
}
.social-channel .channel-bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #211510 url(https://hs.res.netease.com/pc/zt/20240711145422/assets/bg_8aac73e1.png) no-repeat center center;
  background-size: cover;
}
.social-channel .channel-content {
  position: relative;
  padding: 40px 0 35px;
  margin: 0 auto;
  max-width: 1600px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  z-index: 12;
}
.social-channel .channel-content .channel-title {
  color: #c3a483;
  font-weight: 700;
  padding: 10px 0;
  line-height: 1.5;
  font-size: 18px;
}
.social-channel .channel-content .channel-group-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
.social-channel .channel-content .channel-group-wrap .support-info {
  background: url(https://hs.res.netease.com/pc/zt/20240711145422/assets/support-bg_4139f862.png) no-repeat;
  width: 275px;
  background-size: auto 100%;
  position: relative;
  -webkit-transform: translateY(-2px);
          transform: translateY(-2px);
}
.social-channel .channel-content .channel-group-wrap .support-info::after {
  display: block;
  content: '';
  padding-top: 25.672%;
}
.social-channel .channel-content .channel-group-wrap .support-info .support-user,
.social-channel .channel-content .channel-group-wrap .support-info .feedback-content {
  position: absolute;
  top: 35px;
  cursor: pointer;
  color: #a77851;
  font-size: 14px;
}
.social-channel .channel-content .channel-group-wrap .support-info .support-user:hover,
.social-channel .channel-content .channel-group-wrap .support-info .feedback-content:hover,
.social-channel .channel-content .channel-group-wrap .support-info .support-user:active,
.social-channel .channel-content .channel-group-wrap .support-info .feedback-content:active {
  color: #e6d1a4;
}
.social-channel .channel-content .channel-group-wrap .support-info .support-user {
  left: 43px;
}
.social-channel .channel-content .channel-group-wrap .support-info .support-user .support-user-pop {
  display: none;
  position: absolute;
  left: 50%;
  bottom: 14px;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background-color: transparent;
  border: none;
  padding-bottom: 40px;
  line-height: 1;
  cursor: default;
}
.social-channel .channel-content .channel-group-wrap .support-info .support-user .support-user-pop::after {
  position: absolute;
  content: '';
  width: 0;
  height: 0;
  border: 10px solid transparent;
  bottom: 21px;
  left: 50%;
  border-top-color: #e6d1a4;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  z-index: 1;
  pointer-events: none;
}
.social-channel .channel-content .channel-group-wrap .support-info .support-user .support-user-pop .pop-content {
  position: relative;
  -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
          box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
  border-right: none;
  border-radius: var(--pop-border-radius);
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  background-color: #e6d1a4;
  color: #4d3624;
  font-size: 16px;
  padding: var(--pop-content-padding);
  width: 26vw;
  max-width: 180px;
  min-width: 136px;
}
.social-channel .channel-content .channel-group-wrap .support-info .support-user .support-user-pop .pop-content .pop-desc {
  margin-top: 6px;
  text-align: center;
  background-color: #58360e;
  font-size: 12px;
  color: #e6d1a4;
  padding: 6px;
  letter-spacing: 1px;
  cursor: default;
}
.social-channel .channel-content .channel-group-wrap .support-info .support-user .support-user-pop .pop-content .pop-img {
  position: relative;
  padding-top: 100%;
  background-color: #fbe7b8;
  border-radius: var(--pop-border-radius);
}
.social-channel .channel-content .channel-group-wrap .support-info .support-user .support-user-pop .pop-content .pop-img > img {
  position: absolute;
  padding: 0;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.social-channel .channel-content .channel-group-wrap .support-info .support-user .support-user-pop .pop-content + .pop-content {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-left: none;
  margin-left: -2px;
}
.social-channel .channel-content .channel-group-wrap .support-info .support-user .support-user-pop .pop-content:last-child {
  border-top-right-radius: var(--pop-border-radius);
  border-bottom-right-radius: var(--pop-border-radius);
  border-right: 1px solid #e6d1a4;
}
.social-channel .channel-content .channel-group-wrap .support-info .support-user .support-user-pop .pop-content .pop-footer {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 18px;
  cursor: default;
}
.social-channel .channel-content .channel-group-wrap .support-info .support-user .support-user-pop .pop-content .pop-footer .pop-footer-item {
  list-style: square;
  color: #4d3624;
  font-size: 12px;
}
.social-channel .channel-content .channel-group-wrap .support-info .support-user .support-user-pop .pop-content .pop-footer .pop-footer-item:not(:first-child) {
  margin-top: 10px;
}
.social-channel .channel-content .channel-group-wrap .support-info .support-user:hover .support-user-pop,
.social-channel .channel-content .channel-group-wrap .support-info .support-user:active .support-user-pop {
  display: block;
}
.social-channel .channel-content .channel-group-wrap .support-info .feedback-content {
  left: 117px;
  top: 34px;
  right: auto;
}
.social-channel .channel-content .channel-group-wrap .support-info .feedback-content .leihuo-feedback {
  position: absolute;
  opacity: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.social-channel .channel-content .channel-group {
  height: 100%;
  text-align: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}
.social-channel .channel-content .channel-group .channel-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 6px;
  position: relative;
  cursor: pointer;
  width: 60px;
  height: 59px;
  background: url(https://hs.res.netease.com/pc/zt/20240711145422/assets/icon-bg_51e645d6.png) no-repeat;
  background-size: 100% 100%;
  margin: 8px;
}
.social-channel .channel-content .channel-group .channel-item .blz-iconfont {
  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  -webkit-filter: brightness(0.85);
          filter: brightness(0.85);
  -webkit-transition: all 0.15s;
  transition: all 0.15s;
  border-radius: 50%;
}
.social-channel .channel-content .channel-group .channel-item .blz-iconfont.icon-lushibox {
  background-image: url(https://hs.res.netease.com/pc/zt/20240711145422/assets/icon-lushibox_d5af4fe7.png);
}
.social-channel .channel-content .channel-group .channel-item .blz-iconfont.icon-dashen {
  background-image: url(https://hs.res.netease.com/pc/zt/20240711145422/assets/icon-dashen_8d1a2e19.png);
}
.social-channel .channel-content .channel-group .channel-item .blz-iconfont.icon-xiaohongshu {
  background-image: url(https://hs.res.netease.com/pc/zt/20240711145422/assets/icon-xiaohongshu_5c777480.png);
}
.social-channel .channel-content .channel-group .channel-item .blz-iconfont.icon-bilibili {
  background-image: url(https://hs.res.netease.com/pc/zt/20240711145422/assets/icon-bilibili_4a0dfe93.png);
}
.social-channel .channel-content .channel-group .channel-item .blz-iconfont.icon-douyin {
  background-image: url(https://hs.res.netease.com/pc/zt/20240711145422/assets/icon-douyin_24ff8082.png);
}
.social-channel .channel-content .channel-group .channel-item .blz-iconfont.icon-weixin {
  background-image: url(https://hs.res.netease.com/pc/zt/20240711145422/assets/icon-weixin_e0a48aaf.png);
}
.social-channel .channel-content .channel-group .channel-item .blz-iconfont.icon-weibo {
  background-image: url(https://hs.res.netease.com/pc/zt/20240711145422/assets/icon-weibo_778a5914.png);
}
.social-channel .channel-content .channel-group .channel-item .blz-iconfont::before {
  display: none;
}
.social-channel .channel-content .channel-group .channel-item .channel-pop {
  position: absolute;
  left: 50%;
  bottom: calc(100%);
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background-color: transparent;
  border: none;
  padding-bottom: 12px;
  display: none;
  line-height: 1;
}
.social-channel .channel-content .channel-group .channel-item .channel-pop .pop-content {
  position: relative;
  -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
          box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
  border-right: none;
  border-radius: var(--pop-border-radius);
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  background-color: #e6d1a4;
  color: #4d3624;
  font-size: 16px;
  padding: var(--pop-content-padding);
  width: 26vw;
  max-width: 180px;
  min-width: 136px;
}
.social-channel .channel-content .channel-group .channel-item .channel-pop .pop-content .pop-desc {
  margin-top: 6px;
  text-align: center;
}
.social-channel .channel-content .channel-group .channel-item .channel-pop .pop-content .pop-img {
  position: relative;
  padding-top: 100%;
  background-color: #fbe7b8;
  border-radius: var(--pop-border-radius);
}
.social-channel .channel-content .channel-group .channel-item .channel-pop .pop-content .pop-img > img {
  position: absolute;
  padding: 0;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.social-channel .channel-content .channel-group .channel-item .channel-pop .pop-content + .pop-content {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-left: none;
  margin-left: -2px;
}
.social-channel .channel-content .channel-group .channel-item .channel-pop .pop-content:last-child {
  border-top-right-radius: var(--pop-border-radius);
  border-bottom-right-radius: var(--pop-border-radius);
  border-right: 1px solid #e6d1a4;
}
.social-channel .channel-content .channel-group .channel-item .channel-pop .pop-content-group {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  background-color: #e6d1a4;
  -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
          box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
  border-radius: var(--pop-border-radius);
}
.social-channel .channel-content .channel-group .channel-item .channel-pop .pop-content-group .pop-content-item {
  width: 28vw;
  max-width: 180px;
  min-width: 140px;
  position: relative;
  color: #4d3624;
  font-size: 16px;
  padding: var(--pop-content-padding);
}
.social-channel .channel-content .channel-group .channel-item .channel-pop .pop-content-group .pop-content-item .pop-desc {
  margin-top: 6px;
  text-align: center;
}
.social-channel .channel-content .channel-group .channel-item .channel-pop .pop-content-group .pop-content-item .pop-img {
  position: relative;
  padding-top: 100%;
  background-color: #fbe7b8;
  border-radius: var(--pop-border-radius);
}
.social-channel .channel-content .channel-group .channel-item .channel-pop .pop-content-group .pop-content-item .pop-img > img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  padding: 0;
}
.social-channel .channel-content .channel-group .channel-item:hover .channel-pop,
.social-channel .channel-content .channel-group .channel-item:active .channel-pop {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.social-channel .channel-content .channel-group .channel-item:hover .blz-iconfont,
.social-channel .channel-content .channel-group .channel-item:active .blz-iconfont {
  -webkit-filter: brightness(1.2);
          filter: brightness(1.2);
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
}
.social-channel .channel-content .channel-group .channel-item.channel-item--pop:hover::after {
  display: block;
}
.social-channel .channel-content .channel-group .channel-item::after {
  position: absolute;
  content: ' ';
  display: none;
  width: 0;
  height: 0;
  border: 10px solid transparent;
  top: -14px;
  left: 50%;
  border-top-color: #e6d1a4;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  z-index: 1;
  pointer-events: none;
}
@media screen and (min-width: 750px) {
  .social-channel .channel-content {
    padding: 28px 0;
  }
  .social-channel .channel-content .channel-group-wrap {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
  }
  .social-channel .channel-content .channel-group-wrap .channel-group {
    margin-right: 18px;
  }
  .social-channel .channel-content .channel-group-wrap .support-info {
    -webkit-transform: translateY(-6px);
            transform: translateY(-6px);
  }
  .social-channel .channel-content .channel-group-wrap .support-info .support-user .support-user-pop .pop-content .pop-desc {
    font-size: 16px;
  }
  .social-channel .channel-content .channel-group-wrap .support-info .support-user .support-user-pop .pop-content .pop-footer .pop-footer-item {
    font-size: 15px;
  }
  .social-channel .channel-content .channel-title {
    display: block;
  }
}
@media screen and (min-width: 960px) {
  .social-channel .channel-content .channel-group {
    margin-right: 30px;
  }
  .social-channel .channel-content .channel-group .channel-item {
    margin: 0 10px;
  }
}
@media screen and (max-width: 510px) {
  .social-channel .channel-content .channel-group .channel-item .pop-content-item .pop-desc {
    font-size: 14px;
  }
}

