@charset "UTF-8";
input {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.towconfirm {
  height: 40px;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  height: 40px;
  background-color: #ffffff;
  z-index: 6666;
  box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
  line-height: 40px;
  border-radius: 6px;
  padding: 0 16px;
  color: #1f1f1f;
  font-size: 16px;
}

.towconfirm .confirm-box .text {
  line-height: 26px;
  margin-top: 6px;
  font-size: 14px;
}

.towconfirm .text.success::before {
  content: "\e62b";
  font-family: "iconfont";
  color: #52c41a;
  font-size: 18px;
  margin-right: 8px;
}

.towconfirm .text.fail::before {
  content: "\e60b";
  font-family: "iconfont";
  color: #ff414b;
  font-size: 18px;
  margin-right: 8px;
}

.towconfirm .text::before {
  content: "\e67f";
  font-family: "iconfont";
  color: #ff414b;
  font-size: 18px;
  margin-right: 8px;
}

.confirm-box {
  max-width: 500px;
  width: fit-content;
  height: fit-content;
  height: fit-content;
  background-color: #ffffff;
  border-radius: 8px;
  box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
  pointer-events: auto;
  padding: 20px 24px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  margin: auto;
  z-index: 99999;
}

.confirm-box .titles {
  width: 100%;
  line-height: 26px;
}

.confirm-box .titles span.t1 {
  color: rgba(0, 0, 0, 0.88);
  font-weight: 600;
  font-size: 16px;
}

.confirm-box .titles .iconfont {
  font-size: 12px;
  color: #8c8c8c;
  cursor: pointer;
}

.confirm-box .text {
  margin-top: 16px;
  font-size: 14px;
}

.confirm-box .footer-box {
  margin-top: 16px;
  text-align: right;
}

.confirm-box .footer-box button {
  min-width: 64px;
  height: 32px;
  padding: 0 8px;
  font-size: 14px;
  border-radius: 6px;
  transition: all 0.36s;
}

.confirm-box .footer-box .cancel-btn {
  color: rgba(0, 0, 0, 0.88);
  border: 1px solid #d9d9d9;
  background-color: #ffffff;
}

.confirm-box .footer-box .cancel-btn:hover {
  border: 1px solid #4096ff;
  color: #4096ff;
}

.confirm-box .footer-box .confirm-btn {
  color: #fff;
  background-color: #1677ff;
  box-shadow: 0 2px 0 rgba(5, 145, 255, 0.1);
  margin-left: 12px;
}

.confirm-box .footer-box .confirm-btn:hover {
  background-color: #4096ff;
}

header {
  height: 60px;
  padding: 0 81px 0 80px;
  background-color: #ffffff;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 666;
  border: 0.5px solid rgba(211, 211, 211, 0.2);
}

header .logo {
  display: inline-block;
  line-height: 56px;
}

header .menu-box {
  height: 58px;
}

header .menu-box .li {
  height: 60px;
  line-height: 60px;
  margin: 0 14px;
  color: #333;
  position: relative;
  overflow: hidden;
}

header .menu-box .li::after {
  content: "";
  display: block;
  border-radius: 10px;
  width: 34px;
  height: 2.69px;
  background: #a83328;
  position: absolute;
  bottom: -3px;
  left: 50%;
  margin-left: -17px;
  transition: all 0.16s;
}

header .menu-box .li.active {
  color: #191919;
  font-size: 17px;
  font-weight: 500;
  font-family: "MicrosoftYaHeiSemibold";
}

header .menu-box .li.active::after {
  bottom: 0px;
}

header .menu-box .li:hover {
  color: #191919;
}

header .menu-box .li:hover::after {
  bottom: 0px;
}

header .search-box {
  height: 58px;
}

header .search-box .search {
  width: 361px;
  height: 34px;
  padding: 0 16px;
  border: 1px solid #dfdfdf;
  border-radius: 50px;
  background: rgba(255, 255, 255, 0.39);
  position: relative;
}

header .search-box .search input {
  width: 100%;
  background-color: transparent;
  line-height: 26px;
}

header .search-box .search input::placeholder {
  color: #bababa;
  font-size: 14px;
  letter-spacing: 1px;
}

header .search-box .search .iconfont {
  font-size: 16px;
  color: dimgray;
  margin-top: 2px;
}

header .search-box .search button {
  background-color: transparent;
}

header .search-box .not-login .metro {
  width: 110px;
  height: 42px;
  margin-bottom: 0;
}

header .search-box .not-login .metro .selected {
  padding: 5px 6px;
  position: relative;
  top: 6px;
}

header .search-box .not-login .metro li {
  display: block;
}

header .search-box .not-login li {
  display: inline-block;
  line-height: 40px;
  position: relative;
  padding: 0 17px;
}

header .search-box .not-login li a {
  font-size: 15px;
  color: #606266;
}

header .search-box .not-login li::after {
  content: "";
  display: block;
  width: 1px;
  height: 14px;
  background-color: #858d9e;
  opacity: 0.4;
  position: absolute;
  left: 0;
  top: 13px;
}

header .search-box .not-login li:first-child::after {
  width: 0px;
}

header .search-box .not-login li:last-child {
  padding-right: 0;
}

header .search-box .not-login li:hover a {
  color: #cb1126;
}

header .search-box .login {
  line-height: 36px;
  margin-left: 16px;
}

header .search-box .login .goinfo,
header .search-box .login .logout {
  display: inline-block;
  font-size: 16px;
  color: #606266;
  margin-left: 17px;
  font-size: 15px;
}

header .search-box .login .iconfont {
  color: #606266;
  font-size: 24px;
  position: relative;
  cursor: pointer;
}

header .search-box .login .iconfont .num {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #b7251e;
  border-radius: 50%;
  position: absolute;
  right: 0px;
  top: 6px;
}

header .search-box .login .iconfont:hover {
  color: #b7251e !important;
}

header .search-box .login .goinfo img {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: 5px;
}

header .search-box .login .goinfo:hover,
header .search-box .login .logout:hover {
  color: #b7251e;
}

header .login {
  position: relative;
}

header .login .message-list {
  position: absolute;
  width: 400px;
  max-height: 460px;
  overflow-y: scroll;
  padding: 12px;
  background: #ffffff;
  border-radius: 4px 4px 4px 4px;
  filter: drop-shadow(2px 2px 5px gainsboro);
  top: 90px;
  left: 0;
  margin-left: -182px;
  transition: all 0.46s;
  opacity: 0;
  z-index: 66;
  visibility: hidden;
}

header .login .message-list .all-read {
  text-align: right;
  line-height: 22px;
  padding-right: 16px;
}

header .login .message-list .all-read a {
  font-size: 16px;
  color: #b7251e;
  line-height: 16px;
}

header .login .message-list .message-boxs {
  max-height: 400px;
  overflow: hidden;
  overflow-y: scroll;
}

header .login .message-list .message-boxs::-webkit-scrollbar {
  width: 6px;
}

header .login .message-list .message-boxs::-webkit-scrollbar-thumb {
  background: #f2f2f2;
  border-radius: 8px;
}

header .login .message-list .list {
  display: block;
  padding: 18px 26px 16px;
  position: relative;
}

header .login .message-list .list .line-read-point::after {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #cb1126;
  position: absolute;
  left: 11px;
  top: 25px;
}

header .login .message-list .list .msf-text .t1 {
  font-size: 14px;
  color: #333333;
  line-height: 20px;
}

header .login .message-list .list .msf-text .date {
  font-size: 16px;
  color: #9198a5;
  line-height: 20px;
  margin-top: 7px;
}

header .login .message-list .list .info {
  display: inline-block;
  padding: 0 10px;
  height: 26px;
  background: #f0f5ff;
  border-radius: 4px 4px 4px 4px;
  text-align: center;
  line-height: 26px;
  font-size: 14px;
  color: #cb1126;
  margin-top: 10px;
  position: absolute;
  top: 5px;
  right: 15px;
}

header .login .message-list .list::after {
  content: "11";
  display: block;
  width: 100%;
  height: 1px;
  background-color: #cb1126;
  position: absolute;
  left: 0;
  bottom: 0;
}

header .login .message-list .list:hover .t1 {
  color: #cb1126;
}

header .login .message-list::-webkit-scrollbar {
  display: none;
}

header .login .message-list.show {
  top: 50px;
  opacity: 1;
}

footer {
  width: 100%;
  background: #10152a;
  color: #ffffff;
  border-radius: 0px 0px 0px 0px;
  padding-top: 72px;
}

footer .logo {
  height: 56px;
  margin-bottom: 34px;
}

footer .logo img {
  height: 56px;
}

footer .right {
  text-align: center;
}

footer .right .desc {
  color: #ffffff;
  font-size: 14px;
  margin-top: 10px;
}

footer .right img {
  width: 126px;
  border-radius: 6px;
}

footer .contact {
  font-size: 14px;
}

footer .footer-top {
  border-bottom: 1px dashed rgba(224, 234, 255, 0.14);
  padding-bottom: 38px;
}

footer .ooperation {
  padding-top: 38px;
  padding-bottom: 38px;
  border-bottom: 1px dashed rgba(224, 234, 255, 0.14);
}

footer .ooperation li {
  min-width: 10%;
  text-align: left;
  margin: 4px 16px;
}

footer .ooperation li:first-child {
  text-align: left;
  margin: 4px 16px;
}

footer .ooperation a {
  color: #ffffff;
  opacity: 0.4;
  font-size: 14px;
  line-height: 14px;
}

footer .ooperation a:hover {
  opacity: 1;
}

footer .copyright {
  font-size: 14px;
  color: #858d9e;
  line-height: 14px;
  padding: 35px 0 32px;
  text-align: center;
  opacity: 0.4;
}

footer .copyright a {
  color: #fff;
  opacity: 0.4;
}

footer .copyright a:hover {
  opacity: 1;
}

footer .left .contact li {
  margin-right: 48px;
  transition: all 0.4s;
}

footer .left .contact li img {
  max-height: 16px;
  margin-right: 10px;
}

footer .left .contact li span {
  margin-left: -6px;
}

footer .left .contact li:hover {
  opacity: 0.7;
}

.paging {
  text-align: center;
  margin-top: 24px;
}

.paging .paging-ul {
  display: inline-block;
}

.paging .paging-ul li {
  display: inline-block;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  margin: 0 5px;
  line-height: 40px;
  position: relative;
  overflow: hidden;
  text-align: center;
  cursor: pointer;
}

.paging .paging-ul li a {
  display: inline-block;
  width: 100%;
  height: 100%;
  color: #858d9e;
  position: relative;
  z-index: 11;
}

.paging .paging-ul li::after {
  content: "";
  display: block;
  width: 100%;
  height: 0;
  background: #1e5fdd;
  position: absolute;
  bottom: 0;
  left: 0;
  transition: all 0.4s;
}

.paging .paging-ul li.active::after {
  height: 100%;
}

.paging .paging-ul li.active a {
  color: #ffffff;
}

.paging .paging-ul li:hover::after {
  height: 100%;
}

.paging .paging-ul li:hover a {
  color: #ffffff;
}

.paging .jump {
  display: inline-block;
  line-height: 40px;
  position: relative;
  top: -12px;
  color: #858d9e;
  font-weight: 350;
  font-size: 16px;
  margin-left: 0px;
}

.paging .jump input {
  width: 60px;
  height: 40px;
  background: #ffffff;
  border-radius: 4px 4px 4px 4px;
  border: 1px solid #dfe1e8;
  margin: 0 4px;
}

.paging .jump button {
  width: 60px;
  height: 40px;
  background: #1e5fdd;
  border-radius: 4px 4px 4px 4px;
  color: #ffffff;
  border: none;
  margin: 0 6px 0 6px;
}

.paging .first,
.paging .last {
  display: inline-block;
  color: #040a16;
  line-height: 40px;
  position: relative;
  top: -12px;
  margin: 0 55px;
}

.paging .first {
  margin: 0 6px 0 0;
}

.paging .last {
  margin: 0 0 0 6px;
}

.paging .last-page,
.paging .first-page {
  display: inline-block;
  color: #c5cad5;
  line-height: 40px;
  position: relative;
  top: -12px;
  margin: 0 6px;
}

.page-index {
  margin-top: 60px;
}

.page-index .banner {
  height: 420px;
}

.page-index .banner .banner-swiper {
  width: 100%;
  height: 420px;
  position: relative;
}

.page-index .banner .banner-swiper .swiper-slide > a {
  display: block;
  height: 100%;
  position: relative;
}

.page-index .banner .banner-swiper .swiper-slide > a img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide-parts {
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  width: 100%;
  height: 100%;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide-parts:after {
  content: "";
  z-index: 5;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.1);
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide-part {
  position: relative;
  width: 25%;
  height: 100%;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide-part-inner {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 100%;
  background-size: 0 0;
  background-repeat: no-repeat;
  transition: transform 0.5s ease-in-out;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide-part-inner:before {
  content: "";
  position: absolute;
  width: 100vw;
  height: 100%;
  background-image: inherit;
  background-size: cover;
  background-position: center center;
  transition: opacity 0.25s;
  opacity: 0;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide-part:nth-child(1) .slider__slide-part-inner {
  z-index: 3;
  transition-delay: 0.24s;
  transform: translateX(-32.5%);
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide.s--active
.slider__slide-part:nth-child(1)
.slider__slide-part-inner {
  transition-delay: 0.28s;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide-part:nth-child(1) .slider__slide-part-inner:before {
  left: 0vw;
  transition-delay: 0.365s;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide.s--active
.slider__slide-part:nth-child(1)
.slider__slide-part-inner:before {
  transition-delay: 0.28s;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide-part:nth-child(2) .slider__slide-part-inner {
  z-index: 2;
  transition-delay: 0.16s;
  transform: translateX(-65%);
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide.s--active
.slider__slide-part:nth-child(2)
.slider__slide-part-inner {
  transition-delay: 0.36s;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide-part:nth-child(2) .slider__slide-part-inner:before {
  left: -25vw;
  transition-delay: 0.285s;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide.s--active
.slider__slide-part:nth-child(2)
.slider__slide-part-inner:before {
  transition-delay: 0.36s;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide-part:nth-child(3) .slider__slide-part-inner {
  z-index: 1;
  transition-delay: 0.08s;
  transform: translateX(-97.5%);
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide.s--active
.slider__slide-part:nth-child(3)
.slider__slide-part-inner {
  transition-delay: 0.44s;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide-part:nth-child(3) .slider__slide-part-inner:before {
  left: -50vw;
  transition-delay: 0.205s;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide.s--active
.slider__slide-part:nth-child(3)
.slider__slide-part-inner:before {
  transition-delay: 0.44s;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide-part:nth-child(4) .slider__slide-part-inner {
  z-index: 0;
  transition-delay: 0s;
  transform: translateX(-130%);
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide.s--active
.slider__slide-part:nth-child(4)
.slider__slide-part-inner {
  transition-delay: 0.52s;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide-part:nth-child(4) .slider__slide-part-inner:before {
  left: -75vw;
  transition-delay: 0.125s;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide.s--active
.slider__slide-part:nth-child(4)
.slider__slide-part-inner:before {
  transition-delay: 0.52s;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide.s--active .slider__slide-part-inner {
  transform: translateX(0);
  transition-timing-function: ease;
}

.page-index .banner .banner-swiper .swiper-slide .slider__slide.s--active .slider__slide-part-inner:before {
  opacity: 1;
}

.page-index .banner .banner-swiper .pagination {
  width: 100%;
  height: 10px;
  position: absolute;
  bottom: 40px !important;
  left: 0;
  text-align: center;
}

.page-index .banner .banner-swiper .pagination .swiper-pagination-switch {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0.2);
  margin: 0 8px;
  transition: all 0.36s;
}

.page-index .banner .banner-swiper .pagination .swiper-active-switch {
  width: 26px;
  border-radius: 20px;
  background-color: rgba(0, 0, 0, 0.7);
  opacity: 0.8;
}

.page-index .rolling-box {
  width: 100%;
  height: 124px;
  background-color: #ffffff;
}

.page-index .rolling-box .rolling-content {
  padding: 26px 0;
}

.page-index .rolling-box .rolling-content .list {
  text-align: center;
}

.page-index .rolling-box .rolling-content .list .num {
  font-weight: 700;
  font-size: 40px;
  color: #cb1126;
  line-height: 49px;
  width: max-content;
  text-align: center;
}

.page-index .rolling-box .rolling-content .list .text {
  font-size: 16px;
  color: #1a1a1a;
  line-height: 23px;
}

.page-index .event-trailer {
  padding-top: 60px;
  padding-bottom: 80px;
  background-color: #f9f9f9;
}

.page-index .event-trailer .eventtrailer-content {
  background-color: #ffffff;
  box-shadow: 0px 8px 32px 0px rgba(220, 220, 220, 0.44);
  border-radius: 8px 8px 8px 8px;
}

.page-index .event-trailer .eventtrailer-content .left-box {
  width: calc(67.86% - 32px);
  padding: 24px 0 24px 24px;
}

.page-index .event-trailer .eventtrailer-content .left-box .left-content {
  margin-top: 12px;
}

.page-index .event-trailer .eventtrailer-content .left-box .list {
  width: calc(50% - 9px);
  height: 352px;
  border-radius: 6px;
  border: 1px solid #d8d8d8;
  overflow: hidden;
  margin-bottom: 16px;
}

.page-index .event-trailer .eventtrailer-content .left-box .list .img-box {
  height: 200px;
  width: 100%;
  position: relative;
  overflow: hidden;
}

.page-index .event-trailer .eventtrailer-content .left-box .list .img-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.6s;
  top: 0;
}

.page-index .event-trailer .eventtrailer-content .left-box .list .img-box .infos {
  width: 100%;
  height: 48px;
  line-height: 32px;
  padding: 8px 24px;
  background-color: rgba(0, 0, 0, 0.34);
  position: absolute;
  left: 0;
  bottom: 0;
  color: #ffffff;
}

.page-index .event-trailer .eventtrailer-content .left-box .list .img-box .infos .address {
  width: calc(100% - 102px);
}

.page-index .event-trailer .eventtrailer-content .left-box .list .img-box .infos .address span:nth-child(2) {
  display: inline-block;
  width: calc(100% - 24px) !important;
  line-height: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  position: relative;
  top: 2px;
}

.page-index .event-trailer .eventtrailer-content .left-box .list .img-box .infos .signup {
  display: inline-block;
  height: 32px;
  font-size: 14px;
  background: #e0eaff;
  border-radius: 100px 100px 100px 100px;
  padding: 0 12px;
  color: #1e5fdd;
}

.page-index .event-trailer .eventtrailer-content .left-box .list .img-box .infos .signend {
  display: inline-block;
  height: 32px;
  font-size: 14px;
  background: #ffffff;
  border-radius: 100px 100px 100px 100px;
  padding: 0 12px;
  color: #6d7177;
}

.page-index .event-trailer .eventtrailer-content .left-box .list .img-box .infos .signstart {
  display: inline-block;
  height: 32px;
  font-size: 14px;
  background: #faeff1;
  border-radius: 100px 100px 100px 100px;
  padding: 0 12px;
  color: #cb1126;
}

.page-index .event-trailer .eventtrailer-content .left-box .list .text-box {
  padding: 24px;
}

.page-index .event-trailer .eventtrailer-content .left-box .list .text-box .title {
  font-weight: 700;
  font-size: 20px;
  color: #3d3d3d;
  line-height: 26px;
  transition: 0.36s;
}

.page-index .event-trailer .eventtrailer-content .left-box .list .text-box .desc {
  font-size: 16px;
  min-height: 22px;
  color: #858d9e;
  line-height: 22px;
  margin-top: 16px;
}

.page-index .event-trailer .eventtrailer-content .left-box .list .text-box .date {
  font-size: 16px;
  color: #858d9e;
  line-height: 22px;
  margin-top: 16px;
}

.page-index .event-trailer .eventtrailer-content .left-box .list:nth-child(2n) {
  margin-left: 18px;
}

.page-index .event-trailer .eventtrailer-content .left-box .list:hover .img-box img {
  transform: scale(1.1);
}

.page-index .event-trailer .eventtrailer-content .left-box .list:hover .text-box .title {
  color: #1e5fdd;
}

.page-index .event-trailer .eventtrailer-content .right-box {
  width: 32.14%;
  padding: 24px 24px 24px 0;
}

.page-index .event-trailer .eventtrailer-content .right-box .right-content {
  margin-top: 24px;
}

.page-index .event-trailer .eventtrailer-content .right-box .titles {
  line-height: 32px;
  padding-bottom: 26px;
  border-bottom: 1px dashed #d8d8d8;
}

.page-index .event-trailer .eventtrailer-content .right-box .titles .blod {
  display: inline-block;
  font-weight: 700;
  font-size: 20px;
  color: #3d3d3d;
}

.page-index .event-trailer .eventtrailer-content .right-box .titles .more {
  line-height: 32px;
  font-size: 16px;
  color: #a6adb8;
}

.page-index .event-trailer .eventtrailer-content .right-box .titles .more .iconfont {
  display: inline-block;
  margin-left: 2px;
  transition: all 0.36s;
}

.page-index .event-trailer .eventtrailer-content .right-box .titles .more:hover {
  color: #1e5fdd;
  font-weight: bold;
}

.page-index .event-trailer .eventtrailer-content .right-box .titles .more:hover .iconfont {
  font-weight: bold;
  margin-left: 6px;
}

.page-index .event-trailer .eventtrailer-content .right-box .list {
  display: block;
  padding-bottom: 14px;
  position: relative;
  padding-left: 26px;
}

.page-index .event-trailer .eventtrailer-content .right-box .list .title {
  font-size: 16px;
  color: #040a16;
  line-height: 21px;
  position: relative;
  left: 0;
  transition: 0.36s;
}

.page-index .event-trailer .eventtrailer-content .right-box .list .address {
  font-size: 16px;
  color: #858d9e;
  line-height: 22px;
  margin-top: 10px;
}

.page-index .event-trailer .eventtrailer-content .right-box .list .address span {
  display: inline-block;
}

.page-index .event-trailer .eventtrailer-content .right-box .list .address .iconfont {
  font-size: 18px;
}

.page-index .event-trailer .eventtrailer-content .right-box .list .address .type {
  position: relative;
  padding-left: 16px;
  margin-left: 16px;
}

.page-index .event-trailer .eventtrailer-content .right-box .list .address .type::after {
  content: "";
  display: inline-block;
  height: 18px;
  width: 1px;
  background-color: #d8d8d8;
  position: absolute;
  left: 0;
  top: 2px;
}

.page-index .event-trailer .eventtrailer-content .right-box .list:last-child {
  padding-bottom: 0;
}

.page-index .event-trailer .eventtrailer-content .right-box .list::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #858d9e;
  position: absolute;
  left: 6px;
  top: 6px;
  transition: 0.36s;
}

.page-index .event-trailer .eventtrailer-content .right-box .list::after {
  content: "";
  display: block;
  width: 0;
  border-bottom: 1px dashed #1e5fdd;
  position: absolute;
  left: 0;
  bottom: 0;
  transition: all 0.46s;
}

.page-index .event-trailer .eventtrailer-content .right-box .list:hover::before {
  background: #1e5fdd;
}

.page-index .event-trailer .eventtrailer-content .right-box .list:hover .title {
  color: #1e5fdd;
}

.page-index .hot-topic {
  background-color: #ffffff;
  padding-top: 80px;
  padding-bottom: 80px;
}

.page-index .hot-topic .hottopic-content {
  position: relative;
}

.page-index .hot-topic .hottopic-content .left-box {
  width: calc(67.86% - 24px);
  padding: 24px;
  border-radius: 8px;
  border: 1px solid transparent;
  box-shadow: 0px 8px 32px 0px rgba(220, 220, 220, 0.44);
  background-clip: padding-box, border-box;
  background-origin: padding-box, border-box;
  background-image: linear-gradient(180deg, #eff4ff 0%, #ffffff 125px, #ffffff 100%), linear-gradient(to bottom, #cde0ff, #fff);
}

.page-index .hot-topic .hottopic-content .right-box {
  width: 32.14%;
  position: sticky;
  top: 80px;
}

.page-index .hot-topic .hottopic-content .right-box .ranking-box {
  border-radius: 8px;
  padding: 24px 0 4px;
  border: 1px solid transparent;
  box-shadow: 0px 8px 32px 0px rgba(220, 220, 220, 0.44);
  background-clip: padding-box, border-box;
  background-origin: padding-box, border-box;
  background-image: linear-gradient(180deg, #eff4ff 0%, #ffffff 95px, #ffffff 100%), linear-gradient(to bottom, #cadeff, #fff);
}

.page-index .hot-topic .hottopic-content .right-box .title-box {
  text-align: center;
  position: relative;
}

.page-index .hot-topic .hottopic-content .right-box .title-box .blod {
  font-weight: 700;
  font-size: 24px;
  color: #3d3d3d;
  line-height: 32px;
}

.page-index .hot-topic .hottopic-content .right-box .title-box::before,
.page-index .hot-topic .hottopic-content .right-box .title-box::after {
  content: "";
  display: block;
  height: 6px;
  width: calc(50% - 95px);
  position: absolute;
  top: 12px;
}

.page-index .hot-topic .hottopic-content .right-box .title-box::before {
  left: 4px;
  background-image: url("../images/line-left.png");
  background-position: right center;
}

.page-index .hot-topic .hottopic-content .right-box .title-box::after {
  background-image: url("../images/line-right.png");
  right: 4px;
}

.page-index .hot-topic .hottopic-content .right-box .submission {
  width: 100%;
  background-image: url("../images/activity-bg.png");
  background-size: cover;
  background-position: center;
  margin-top: 24px;
  padding: 24px;
  border-radius: 8px;
}

.page-index .hot-topic .hottopic-content .right-box .submission .img {
  width: 32px;
  transition: all 0.6s;
}

.page-index .hot-topic .hottopic-content .right-box .submission .text {
  width: calc(100% - 146px);
  font-weight: 700;
  font-size: 16px;
  color: #3d3d3d;
  line-height: 22px;
  margin-left: 8px;
}

.page-index .hot-topic .hottopic-content .right-box .submission a {
  display: inline-block;
  width: 124px;
  height: 40px;
  font-size: 14px;
  color: #1e5fdd;
  border-radius: 100px 100px 100px 100px;
  border: 2px solid #1e5fdd;
  text-align: center;
  line-height: 36px;
  font-weight: 600;
  margin-top: 2px;
}

.page-index .hot-topic .hottopic-content .right-box .submission a .iconfont {
  font-size: 12px;
  transition: all 0.4s;
}

.page-index .hot-topic .hottopic-content .right-box .submission a:hover {
  box-shadow: 2px 5px 10px #bbc9e6;
  transform: translateY(-1px);
}

.page-index .hot-topic .hottopic-content .right-box .submission:hover .img {
  transform: scale(1.1);
}

.page-index .popular-posts {
  background-color: #f9f9f9;
  padding-top: 80px;
  padding-bottom: 140px;
}

.page-index .popular-posts .popular-content {
  position: relative;
}

.page-index .popular-posts .popular-content .left-box {
  width: calc(67.86% - 24px);
  padding: 24px;
  border-radius: 8px;
  border: 1px solid transparent;
  box-shadow: 0px 8px 32px 0px rgba(220, 220, 220, 0.44);
  background-clip: padding-box, border-box;
  background-origin: padding-box, border-box;
  background-image: linear-gradient(180deg, #eff4ff 0%, #ffffff 125px, #ffffff 100%), linear-gradient(to bottom, #cde0ff, #fff);
}

.page-index .popular-posts .popular-content .left-box .content-box {
  margin-top: 24px;
}

.page-index .popular-posts .popular-content .left-box .list {
  margin-bottom: 16px;
  padding-bottom: 14px;
  position: relative;
}

.page-index .popular-posts .popular-content .left-box .list .avatar {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  object-fit: cover;
}

.page-index .popular-posts .popular-content .left-box .list .t1 {
  font-weight: 700;
  font-size: 18px;
  color: #040a16;
  line-height: 24px;
  margin-top: 12px;
}

.page-index .popular-posts .popular-content .left-box .list .desc {
  font-weight: 400;
  font-size: 14px;
  color: #858d9e;
  line-height: 24px;
  margin-top: 8px;
}

.page-index .popular-posts .popular-content .left-box .list .imgs {
  margin-top: 16px;
}

.page-index .popular-posts .popular-content .left-box .list .imgs img {
  width: 138px;
  height: 138px;
  border-radius: 4px 4px 4px 4px;
  object-fit: cover;
  margin-right: 3px;
}

.page-index .popular-posts .popular-content .left-box .list .infos {
  margin-top: 18px;
}

.page-index .popular-posts .popular-content .left-box .list .infos .top4 {
  position: relative;
  top: 4px;
}

.page-index .popular-posts .popular-content .left-box .list .infos .name {
  line-height: 24px;
  top: 0;
}

.page-index .popular-posts .popular-content .left-box .list .infos .avatar {
  top: -1px;
}

.page-index .popular-posts .popular-content .left-box .list .infos .iconfont {
  font-size: 18px;
  color: #b3b6be;
  margin-right: 6px;
}

.page-index .popular-posts .popular-content .left-box .list .infos .text {
  font-weight: 400;
  font-size: 14px;
  color: #858d9e;
  line-height: 18px;
  margin-right: 16px;
}

.page-index .popular-posts .popular-content .left-box .list .infos .date {
  font-size: 14px;
  color: #858d9e;
  line-height: 24px;
  margin-left: 16px;
}

.page-index .popular-posts .popular-content .left-box .list .infos .types {
  margin-left: 18px;
  line-height: 24px;
}

.page-index .popular-posts .popular-content .left-box .list .name {
  font-weight: 400;
  font-size: 14px;
  color: #858d9e;
  line-height: 30px;
  display: inline-block;
  position: relative;
  top: 2px;
  margin-left: 6px;
}

.page-index .popular-posts .popular-content .left-box .list .answer {
  display: block;
  padding: 0 10px;
  height: 30px;
  line-height: 26px;
  font-size: 14px;
  color: #858d9e;
  text-align: center;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #dbdcde;
  position: relative;
  overflow: hidden;
  z-index: 1;
  transition: all 0.36s;
  box-sizing: content-box;
}

.page-index .popular-posts .popular-content .left-box .list .answer::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-color: #538cfa;
  background: linear-gradient(134deg, #538cfa 0%, #1e5fdd 99%);
  position: absolute;
  right: 100%;
  top: 0;
  transition: all 0.36s;
  z-index: -1;
}

.page-index .popular-posts .popular-content .left-box .list .answer .iconfont {
  margin-right: 0px;
  line-height: 26px;
}

.page-index .popular-posts .popular-content .left-box .list::after {
  content: "";
  display: block;
  width: 0;
  height: 1px;
  background-color: #1e5fdd;
  position: absolute;
  left: 0;
  bottom: 0;
  transition: all 0.46s;
}

.page-index .popular-posts .popular-content .left-box .list:hover .answer {
  color: #1e5fdd;
  border: 1px solid #f0f5ff;
  background: #f0f5ff;
}

.page-index .popular-posts .popular-content .left-box .list:hover .answer .iconfont {
  color: #1e5fdd;
}

.page-index .popular-posts .popular-content .left-box .list:hover::after {
  width: 100%;
}

.page-index .popular-posts .popular-content .left-box .list:hover .t1 {
  color: #1e5fdd;
}

.page-index .popular-posts .popular-content .right-box {
  width: 32.14%;
  position: sticky;
  top: 80px;
}

.page-index .popular-posts .popular-content .right-box .active-users {
  border-radius: 8px;
  padding: 24px 0 4px;
  border: 1px solid transparent;
  box-shadow: 0px 8px 32px 0px rgba(220, 220, 220, 0.44);
  background-clip: padding-box, border-box;
  background-origin: padding-box, border-box;
  background-image: linear-gradient(180deg, #eff4ff 0%, #ffffff 125px, #ffffff 100%), linear-gradient(to bottom, #cde0ff, #fff);
}

.page-index .popular-posts .popular-content .right-box .active-users .title-box {
  text-align: center;
  position: relative;
}

.page-index .popular-posts .popular-content .right-box .active-users .title-box .blod {
  font-weight: 700;
  font-size: 24px;
  color: #3d3d3d;
  line-height: 32px;
}

.page-index .popular-posts .popular-content .right-box .active-users .title-box::before,
.page-index .popular-posts .popular-content .right-box .active-users .title-box::after {
  content: "";
  display: block;
  height: 6px;
  width: calc(50% - 120px);
  position: absolute;
  top: 12px;
}

.page-index .popular-posts .popular-content .right-box .active-users .title-box::before {
  left: 4px;
  background-image: url("../images/line-left.png");
  background-position: right center;
}

.page-index .popular-posts .popular-content .right-box .active-users .title-box::after {
  background-image: url("../images/line-right.png");
  right: 4px;
}

.page-index .popular-posts .popular-content .right-box .submission {
  width: 100%;
  background-image: url("../images/activity-bg.png");
  background-size: cover;
  background-position: center;
  margin-top: 24px;
  padding: 24px;
}

.page-index .popular-posts .popular-content .right-box .submission .img {
  width: 32px;
  transition: all 0.6s;
}

.page-index .popular-posts .popular-content .right-box .submission .text {
  width: calc(100% - 140px);
  font-weight: 700;
  font-size: 16px;
  color: #3d3d3d;
  line-height: 22px;
  margin-left: 8px;
}

.page-index .popular-posts .popular-content .right-box .submission a {
  display: inline-block;
  width: 114px;
  height: 40px;
  font-size: 14px;
  color: #1e5fdd;
  border-radius: 100px 100px 100px 100px;
  border: 2px solid #1e5fdd;
  text-align: center;
  line-height: 36px;
  font-weight: 600;
  margin-top: 2px;
}

.page-index .popular-posts .popular-content .right-box .submission a .iconfont {
  font-size: 12px;
}

.page-index .popular-posts .popular-content .right-box .submission a:hover {
  box-shadow: 2px 5px 10px #bbc9e6;
  transform: translateY(-1px);
}

.page-index .popular-posts .popular-content .right-box .submission:hover .img {
  transform: scale(1.1);
}

.page-index .them-title .blod {
  display: inline-block;
  font-weight: 700;
  font-size: 24px;
  color: #3d3d3d;
  line-height: 32px;
  position: relative;
  padding-bottom: 15px;
  padding-left: 9px;
}

.page-index .them-title .blod::after {
  content: "";
  display: block;
  width: 45.6px;
  height: 36.97px;
  position: absolute;
  bottom: 0;
  left: -2px;
}

.page-index .them-title .more {
  line-height: 26px;
  font-size: 16px;
  color: #a6adb8;
  position: relative;
  top: 4px;
}

.page-index .them-title .more .iconfont {
  display: inline-block;
  margin-left: 2px;
  transition: all 0.36s;
}

.page-index .them-title .more:hover {
  color: #1e5fdd;
  font-weight: bold;
}

.page-index .them-title .more:hover .iconfont {
  font-weight: bold;
  margin-left: 6px;
}

.page-index .main-title {
  font-weight: 700;
  font-size: 22px;
  color: #3d3d3d;
  line-height: 29px;
}

.page-index .main-title::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 20px;
  background: #1e5fdd;
  position: relative;
  top: 2px;
  margin-right: 15px;
}

.page-index .hottopic-box .essence-box {
  top: 6px;
}

.page-index .hottopic-box .list {
  display: block;
  padding: 24px 0;
  border-bottom: 1px dotted #d3d4d9;
  position: relative;
}

.page-index .hottopic-box .list .title {
  width: calc(100% - 100px);
  font-weight: 700;
  font-size: 20px;
  color: #3d3d3d;
  line-height: 26px;
}

.page-index .hottopic-box .list .title .iconfont {
  font-size: 21px;
  color: #cb1126;
}

.page-index .hottopic-box .list .desc {
  min-height: 24px;
  font-size: 16px;
  color: #858d9e;
  line-height: 24px;
  margin-top: 8px;
}

.page-index .hottopic-box .list .infos {
  margin-top: 16px;
}

.page-index .hottopic-box .list .infos .avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
}

.page-index .hottopic-box .list .infos .name {
  font-size: 16px;
  color: #040a16;
  line-height: 24px;
  margin-left: 8px;
}

.page-index .hottopic-box .list .infos .type {
  display: inline-block;
  padding-left: 20px;
  position: relative;
  margin-left: 24px;
  min-height: 30px;
}

.page-index .hottopic-box .list .infos .type span {
  height: 30px;
  line-height: 30px;
  background: #f1f1f1;
  border-radius: 4px;
  color: #858d9e;
  padding: 0 6px;
  margin-left: 5px;
}

.page-index .hottopic-box .list .infos .type::after {
  content: "";
  display: block;
  width: 1px;
  height: 18px;
  background-color: #d8d8d8;
  position: absolute;
  left: 0;
  top: 5px;
}

.page-index .hottopic-box .list .date-box {
  font-size: 16px;
  color: #858d9e;
  line-height: 30px;
}

.page-index .hottopic-box .list .date-box .iconfont {
  margin-right: 6px;
}

.page-index .hottopic-box .list .date-box .date {
  position: relative;
  padding-left: 24px;
  margin-left: 24px;
}

.page-index .hottopic-box .list .date-box .date::after {
  content: "";
  display: block;
  width: 1px;
  height: 14px;
  background-color: #d8d8d8;
  position: absolute;
  left: 0;
  top: 8px;
}

.page-index .hottopic-box .list:last-child {
  border-bottom: none;
  padding: 24px 0 0;
}

.page-index .hottopic-box .list:last-child::after {
  border-bottom: none;
}

.page-index .hottopic-box .list::after {
  content: "";
  display: block;
  width: 0;
  border-bottom: 1px solid #1e5fdd;
  position: absolute;
  left: 0;
  bottom: -1px;
  transition: all 0.36s;
}

.page-index .hottopic-box .list:last-child::after {
  height: 0px;
}

.page-index .hottopic-box .list:hover .title {
  color: #1e5fdd;
}

.page-index .hottopic-box .list:hover::after {
  width: 100%;
}

.page-index .users-box {
  padding: 24px 26px 24px 32px;
}

.page-index .users-box .list {
  display: block;
  text-align: left;
  margin-bottom: 20px;
}

.page-index .users-box .list .right-blok {
  width: calc(100% - 88px);
}

.page-index .users-box .list:hover .name {
  color: #4d525c;
}

.page-index .users-box .list:last-child {
  margin-bottom: 0;
}

.page-index .users-box .avarat {
  width: 71px;
  height: 71px;
  border-radius: 50%;
  border: 1px solid rgba(30, 95, 221, 0.2);
  padding: 3px;
  position: relative;
  cursor: pointer;
}

.page-index .users-box .avarat img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  padding: 3px;
  border: 1px solid rgba(30, 95, 221, 0.6);
  object-fit: cover;
  top: 0;
  transition: all 0.3s;
}

.page-index .users-box .avarat:hover img {
  border: 1px solid rgba(30, 95, 221, 0);
  padding: 0;
}

.page-index .users-box .name {
  font-size: 18px;
  color: #040a16;
  line-height: 24px;
  transition: all 0.36s;
}

.page-index .users-box .type {
  margin-top: 10px;
}

.page-index .users-box .type span {
  display: inline-block;
  height: 30px;
  background: #f1f1f1;
  border-radius: 4px 4px 4px 4px;
  padding: 0 6px;
  line-height: 30px;
  font-size: 16px;
  color: #858d9e;
  margin-bottom: 8px;
  margin-right: 6px;
}

.page-index .users-box .release span {
  display: inline-block;
  font-size: 16px;
  color: #858d9e;
  line-height: 24px;
  margin-bottom: 2px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.page-index .users-box .release span:nth-child(2n-1) {
  width: 50%;
}

.page-index .users-box .release span:nth-child(2n) {
  width: 50%;
}

.page-index .ranking {
  padding: 0 22px 0;
  margin-top: 14px;
}

.page-index .ranking .list {
  display: block;
  margin-bottom: 12px;
}

.page-index .ranking .list .sort {
  width: 28px;
  height: 28px;
  background: #f0f5ff;
  border-radius: 6px;
  font-weight: 500;
  font-size: 14px;
  color: #858d9e;
  text-align: center;
  line-height: 28px;
  margin: 4px;
  transition: all 0.4s;
}

.page-index .ranking .list .text {
  display: inline;
  line-height: 36px;
  margin-left: 20px;
  font-size: 16px;
  color: #3d3d3d;
  transition: all 0.4s;
}

.page-index .ranking .list:nth-child(1) .sort {
  width: 36px;
  height: 36px;
  margin: 0;
  background-color: transparent;
  color: transparent;
  background-image: url("../images/trophy1.png");
  position: relative;
  top: -2px;
}

.page-index .ranking .list:nth-child(2) .sort {
  width: 36px;
  height: 36px;
  margin: 0;
  background-color: transparent;
  color: transparent;
  background-image: url("../images/trophy2.png");
  position: relative;
  top: -2px;
}

.page-index .ranking .list:nth-child(3) .sort {
  width: 36px;
  height: 36px;
  margin: 0;
  background-color: transparent;
  color: transparent;
  background-image: url("../images/trophy3.png");
  position: relative;
  top: -2px;
}

.page-index .ranking .list:hover .text {
  color: #1e5fdd;
}

.active-box {
  background-color: #f8f8f8;
  padding-bottom: 128px;
}

.calendar-box {
  padding-top: 32px;
}

.calendar-box .banner-swiper {
  width: 100%;
  height: 100%;
  border-radius: 10px;
  --swiper-pagination-color: #ffffff;
  /* 两种都可以 */
}

.calendar-box .banner-swiper .bgs {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.calendar-box .banner-swiper .swiper-pagination {
  width: 100%;
  position: absolute;
  bottom: 12px;
  text-align: center;
}

.calendar-box .banner-swiper .swiper-pagination .swiper-pagination-switch {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0.2);
  opacity: 0.6;
  margin: 0 8px;
  cursor: pointer;
  transition: all 0.3s;
}

.calendar-box .banner-swiper .swiper-pagination .swiper-pagination-switch:hover {
  opacity: 0.8;
}

.calendar-box .banner-swiper .swiper-pagination .swiper-active-switch.swiper-pagination-switch {
  width: 26px;
  height: 10px;
  background-color: rgba(0, 0, 0, 0.7);
  border-radius: 20px;
  opacity: 1;
}

.calendar-box .calendar-content {
  width: 100%;
  padding-bottom: 40px;
}

.calendar-box .calendar-content .left-banner {
  width: calc(100% - 560px);
  height: 440px;
}

.calendar-box .calendar-content .right-calendar {
  width: 536px;
  height: 440px;
  background-color: #ffffff;
  box-shadow: 0px 8px 32px 0px rgba(220, 220, 220, 0.44);
  border-radius: 6px;
  border: 1px solid #dcdcdc;
  margin-left: 24px;
}

.active-tab {
  background-color: #ffffff;
  border-radius: 6px;
  padding: 24px;
}

.active-tab .search .left {
  width: 740px;
  height: 64px;
  line-height: 62px;
  background: #ffffff;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #dbdcde;
  padding: 0 32px;
  position: relative;
}

.active-tab .search .left .iconfont {
  font-size: 20px;
  color: #1e5fdd;
}

.active-tab .search .left input {
  width: 580px;
  margin-left: 12px;
}

.active-tab .search .left input::placeholder {
  font-size: 16px;
  color: #b3b6be;
}

.active-tab .search .left .btn {
  border: none;
  outline: none;
  color: #1e5fdd;
  background-color: transparent;
}

.active-tab .search .right {
  line-height: 60px;
  color: #1e5fdd;
  cursor: pointer;
}

.active-tab .search .right .iconfont {
  font-size: 20px;
}

.active-tab .tabs {
  margin-top: 18px;
  height: 170px;
  overflow: hidden;
  transition: all 0.46s;
}

.active-tab .tabs.show {
  height: max-content;
}

.active-tab .tab-ul {
  margin: 8px 0;
}

.active-tab .tab-ul .name {
  display: inline-block;
  width: 156px;
  padding-left: 16px;
  color: #040a16;
  position: relative;
  top: 8px;
}

.active-tab .tab-ul .list {
  display: inline-block;
}

.active-tab .tab-ul .list a {
  display: inline-block;
  height: 37px;
  overflow: hidden;
  text-align: center;
  line-height: 34px;
  border-radius: 100px;
  border: 1px solid #dbdcde;
  font-size: 16px;
  color: #040a16;
  padding: 0 20px;
  margin: 0px 8px 16px;
  position: relative;
  z-index: 10;
}

.active-tab .tab-ul .list a::after {
  content: "";
  display: block;
  width: 0px;
  height: 100%;
  background-color: #538cfa;
  background: linear-gradient(134deg, #538cfa 0%, #1e5fdd 99%);
  position: absolute;
  left: 0px;
  top: 0;
  transition: all 0.46s;
  z-index: -1;
}

.active-tab .tab-ul .list a:hover {
  background: #f0f5ff;
  color: #1e5fdd;
}

.active-tab .tab-ul .active.list a {
  color: #ffffff;
}

.active-tab .tab-ul .active.list a::after {
  width: 100%;
}

.active-sort {
  height: 85px;
  background: #ffffff;
  border-radius: 6px 6px 6px 6px;
  margin-top: 24px;
  padding-left: 24px;
}

.active-sort > div {
  cursor: pointer;
}

.active-sort > div:hover .text {
  color: #1e5fdd;
  font-weight: bold;
}

.active-sort .text {
  font-size: 16px;
  line-height: 85px;
  color: #040a16;
}

.active-sort .active .text {
  color: #1e5fdd;
  font-weight: bold;
}

.active-sort .active .iconfont.bot {
  color: #1e5fdd;
}

.active-sort .icons {
  display: inline-block;
}

.active-sort .icons .iconfont {
  display: block;
  font-size: 9px;
  color: #b3b6be;
  margin-left: 12px;
}

.active-sort .date-box {
  display: inline-block;
  margin-left: 24px;
}

.active-con {
  width: 100%;
  margin-top: 25px;
}

.active-con .list {
  width: calc(33.33% - 16.66px);
  height: 347px;
  background: #ffffff;
  border-radius: 6px 6px 6px 6px;
  border: 1px solid #d8d8d8;
  margin-right: 25px;
  margin-bottom: 25px;
  overflow: hidden;
}

.active-con .list:nth-child(3n) {
  margin-right: 0;
}

.active-con .top-img {
  width: 100%;
  height: 200px;
  position: relative;
  overflow: hidden;
}

.active-con .top-img .bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.6s;
  top: 0px;
}

.active-con .top-text {
  width: 100%;
  height: 48px;
  background-color: rgba(2, 16, 29, 0.34);
  position: absolute;
  bottom: 0px;
  left: 0;
  line-height: 48px;
  padding: 0 24px;
}

.active-con .top-text .lef {
  color: #ffffff;
  width: calc(100% - 100px);
  font-size: 16px;
}

.active-con .top-text .rig {
  display: inline-block;
  width: 94px;
  height: 32px;
  background: #e0eaff;
  border-radius: 100px 100px 100px 100px;
  font-size: 14px;
  color: #1e5fdd;
  text-align: center;
  line-height: 32px;
  margin-top: 8px;
}

.active-con .top-text .rig.end {
  background-color: #ffffff;
  color: #6d7177;
}

.active-con .top-text .rig.start {
  color: #cb1126;
  background: #faeff1;
}

.active-con .bot-text {
  padding: 24px 24px 18px;
}

.active-con .bot-text .t1 {
  font-weight: 700;
  font-size: 18px;
  color: #3d3d3d;
  line-height: 26px;
}

.active-con .bot-text .t2 {
  font-size: 16px;
  height: 22px;
  color: #858d9e;
  line-height: 22px;
  margin-top: 16px;
}

.active-con .bot-text .date {
  height: 22px;
  line-height: 22px;
  margin-top: 16px;
}

.active-con .bot-text .date .left {
  font-size: 16px;
  color: #858d9e;
}

.active-con .bot-text .date .right {
  width: calc(100% - 152px);
  overflow: hidden;
  /* 隐藏溢出内容 */
  text-overflow: ellipsis;
  /* 当文本溢出时显示省略号 */
  white-space: nowrap;
  /* 禁止文本换行 */
  font-size: 14px;
  color: #1a1a1a;
  text-align: end;
}

.active-con .bot-text .date .right .iconfont {
  color: #1e5fdd;
}

.active-con .list:hover {
  box-shadow: 2px 5px 20px rgba(0, 0, 0, 0.1);
}

.active-con .list:hover .t1 {
  color: #1e5fdd;
}

.active-con .list:hover .top-img .bg-img {
  transform: scale(1.1);
}

.activeinfo-top {
  height: 312px;
  background: #ffffff;
  border-radius: 6px;
  overflow: hidden;
}

.activeinfo-top .left-box,
.activeinfo-top .right-box {
  width: 50%;
}

.activeinfo-top .left-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  top: 0;
}

.activeinfo-top .right-box {
  padding: 24px;
  position: relative;
}

.activeinfo-top .right-box .chapter-img {
  position: absolute;
  right: 266px;
  top: 122px;
  z-index: 10;
}

.activeinfo-top .right-box .code {
  width: 146px;
  position: absolute;
  right: 27px;
  top: 22px;
  border: 1px solid #dbdcde;
  padding-bottom: 8px;
  border-radius: 4px;
  overflow: hidden;
  text-align: center;
}

.activeinfo-top .right-box .code img {
  top: 0;
  width: 146px;
}

.activeinfo-top .right-box .code p {
  position: relative;
  z-index: 10;
}

.activeinfo-top .right-box .title {
  font-weight: 700;
  font-size: 22px;
  color: #040a16;
  line-height: 29px;
  margin-bottom: 22px;
  padding-right: 150px;
}

.activeinfo-top .right-box .list {
  margin-bottom: 8px;
}

.activeinfo-top .right-box .list .icon {
  width: 18px;
}

.activeinfo-top .right-box .list span {
  display: inline-block;
  font-size: 14px;
  color: #040a16;
  line-height: 22px;
}

.activeinfo-top .right-box .list .iconfont {
  font-size: 16px;
}

.activeinfo-top .right-box .bot {
  margin-top: 16px;
}

.activeinfo-top .right-box .imgs {
  padding-top: 2px;
}

.activeinfo-top .right-box .imgs .img-box .iconfont {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  text-align: center;
  line-height: 32px;
  background: #f1f1f1;
  border: 1px solid #ffffff;
  color: #d8d8d8;
  position: relative;
  left: -12px;
}

.activeinfo-top .right-box .imgs .img-box img {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid #ffffff;
  cursor: pointer;
}

.activeinfo-top .right-box .imgs .img-box img:nth-child(n + 2) {
  margin-left: -12px;
}

.activeinfo-top .right-box .imgs p {
  font-size: 14px;
  color: #b3b6be;
  line-height: 22px;
  margin-top: 4px;
}

.activeinfo-top .right-box .link1 {
  display: inline-block;
  width: 170px;
  height: 56px;
  color: #ffffff;
  font-weight: 700;
  font-size: 16px;
  text-align: center;
  line-height: 56px;
  background: #1e5fdd;
  transition: all 0.4s;
  border-radius: 100px 100px 100px 100px;
}

.activeinfo-top .right-box .link2 {
  display: inline-block;
  width: 172px;
  height: 56px;
  background: #f0f5ff;
  border-radius: 100px 100px 100px 100px;
  padding: 1px 10px 0;
  text-align: center;
  margin-left: 16px;
  transition: all 0.4s;
}

.activeinfo-top .right-box .link2 .t1 {
  font-size: 16px;
  font-weight: 700;
  color: #1e5fdd;
  line-height: 21px;
}

.activeinfo-top .right-box .link2 .t2 {
  font-weight: 400;
  font-size: 14px;
  color: #858d9e;
  line-height: 16px;
}

.activeinfo-top .right-box .link2:hover {
  box-shadow: 2px 10px 20px #ededed;
}

.activeinfo-top .right-box .link2,
.activeinfo-top .right-box .link2 {
  transform: translateY(-2px);
}

.active-info {
  width: 100%;
  background-color: #f8f8f8;
  background: linear-gradient(to bottom, #f1f4fe 0%, #f8f8f8 580px);
  padding-top: 33px;
  padding-bottom: 140px;
}

.active-info .breadcrumbs {
  margin-top: 16px;
}

.active-info .them-title {
  font-weight: 700;
  font-size: 22px;
  color: #3d3d3d;
  line-height: 29px;
}

.active-info .them-title::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 20px;
  background: #1e5fdd;
  position: relative;
  top: 2px;
  margin-right: 15px;
}

.breadcrumbs li {
  display: inline-block;
}

.breadcrumbs li a {
  color: #858d9e;
  font-size: 14px;
}

.breadcrumbs li a::after {
  content: "\e68e";
  font-family: "iconfont";
  font-size: 12px;
}

.breadcrumbs li:last-child a {
  color: #040a16;
}

.breadcrumbs li:last-child a::after {
  content: "";
}

.activeinfo-content {
  margin-top: 16px;
}

.activeinfo-content .acinfo-left {
  width: 100%;
}

.active-infotext {
  background-color: #ffffff;
  border-radius: 6px;
  padding: 24px;
}

.active-infotext .title {
  font-weight: 700;
  font-size: 28px;
  color: #040a16;
  line-height: 37px;
  margin-top: 25px;
}

.active-infotext .publish {
  margin-top: 16px;
}

.active-infotext .publish .name {
  font-size: 14px;
  color: #040a16;
  line-height: 22px;
  padding-right: 24px;
  position: relative;
  margin-right: 24px;
}

.active-infotext .publish .date {
  font-size: 14px;
  color: #858d9e;
  line-height: 22px;
}

.active-infotext .publish .name::after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 14px;
  background-color: #d8d8d8;
  position: absolute;
  right: 0;
  top: 3px;
}

.active-infotext .type {
  margin-top: 16px;
}

.active-infotext .type span {
  display: inline-block;
  height: 28px;
  background: #f1f1f1;
  border-radius: 4px 4px 4px 4px;
  font-size: 14px;
  color: #858d9e;
  line-height: 28px;
  padding: 0 6px;
}

.active-infotext .infotext-content {
  margin-top: 24px;
}

.active-infotext .infotext-content span {
  display: inline;
}

.active-infotext .infotext-content i {
  font-style: italic;
}

.active-infotext .infotext-content a {
  color: #0000ee;
  text-decoration: underline;
}

.active-infotext .infotext-content > p,
.active-infotext .infotext-content > div,
.active-infotext .infotext-content > span {
  line-height: 1.6em;
  font-size: 16px;
  color: #040a16;
  padding-bottom: 16px;
}

.active-infotext .infotext-content ol,
.active-infotext .infotext-content ul {
  margin-left: 24px;
}

.active-infotext .infotext-content img,
.active-infotext .infotext-content video {
  max-width: 100%;
}

.data-download {
  background: #ffffff;
  padding: 24px;
  margin-top: 24px;
  border-radius: 6px;
}

.data-download ul {
  margin-top: 24px;
}

.data-download li {
  margin-bottom: 24px;
}

.data-download li:last-child {
  margin-bottom: 0;
}

.data-download .left {
  line-height: 24px;
}

.data-download .left .iconfont {
  color: #b3b6be;
  font-size: 18px;
}

.data-download .left .text {
  display: inline-block;
  font-size: 14px;
  color: #040a16;
  margin-left: 2px;
}

.data-download .right a {
  display: inline-block;
  padding: 0 10px;
  height: 24px;
  background: #f0f5ff;
  border-radius: 100px 100px 100px 100px;
  font-size: 14px;
  color: #1e5fdd;
  text-align: center;
  line-height: 24px;
}

.data-download .right a:hover {
  color: #ffffff;
  background-color: #1e5fdd;
}

.problem-discussion {
  width: 100%;
  background-color: #ffffff;
  padding: 24px;
  margin-top: 24px;
  border-radius: 6px;
}

.problem-discussion .content-box {
  margin-top: 33px;
}

.problem-discussion .t1 {
  font-size: 18px;
  color: #040a16;
  line-height: 24px;
}

.problem-discussion .infos {
  font-size: 14px;
  color: #858d9e;
  line-height: 32px;
  margin-top: 16px;
}

.problem-discussion .infos .date {
  display: inline-block;
  position: relative;
  padding-right: 16px;
}

.problem-discussion .infos .date::after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 14px;
  background-color: #d8d8d8;
  position: absolute;
  top: 9px;
  right: 0;
}

.problem-discussion .infos .iconfont {
  margin-left: 16px;
}

.problem-discussion .answer {
  display: inline-block;
  padding: 0 10px;
  height: 30px;
  text-align: center;
  line-height: 28px;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #dbdcde;
  font-size: 14px;
  color: #858d9e;
  overflow: hidden;
  position: relative;
  z-index: 10;
  transition: all 0.36s;
  box-sizing: content-box;
}

.problem-discussion .answer .iconfont {
  margin-left: 0;
}

.problem-discussion .answer::after {
  content: "";
  display: inline-block;
  width: 0;
  height: 100%;
  background-color: #538cfa;
  background: linear-gradient(134deg, #538cfa 0%, #1e5fdd 99%);
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  transition: all 0.4s;
}

.problem-discussion .list {
  display: block;
  position: relative;
  padding-bottom: 16px;
  margin-bottom: 16px;
}

.problem-discussion .list::after {
  content: "";
  display: block;
  width: 0px;
  height: 1px;
  background-color: #1e5fdd;
  position: absolute;
  left: 0;
  bottom: 0;
  transition: all 0.46s;
}

.problem-discussion .list:hover .answer {
  color: #fff;
  background-color: #4a84f5;
  border: 1px solid #4a84f5;
}

.problem-discussion .list:hover::after {
  width: 100%;
}

.problem-discussion .list:hover .t1 {
  color: #1e5fdd;
}

.activity-questions {
  width: 100%;
  height: 80px;
  border-radius: 8px;
  background-image: url("../images/activity-bg.png");
  background-size: cover;
  background-position: center;
  margin-top: 24px;
  padding: 24px;
}

.activity-questions img {
  width: 32px;
}

.activity-questions span.text {
  font-weight: 700;
  font-size: 16px;
  color: #3d3d3d;
  line-height: 32px;
  margin-left: 8px;
}

.activity-questions .asking {
  display: inline-block;
  text-align: center;
  line-height: 28px;
  width: 93px;
  height: 30px;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #1e5fdd;
  font-size: 14px;
  color: #1e5fdd;
}

.activity-questions .asking .iconfont {
  font-size: 12px;
  position: relative;
  top: -1px;
}

.share {
  min-width: 40px;
  position: fixed;
  right: 24px;
  bottom: 42px;
}

.share .list {
  text-align: center;
  margin-bottom: 32px;
  position: relative;
}

.share .list .check-login {
  position: absolute;
  width: 114px;
  height: 48px;
  font-size: 14px;
  color: #858d9e;
  line-height: 48px;
  text-align: center;
  opacity: 0;
  left: -156px;
  visibility: hidden;
  top: 0;
  background: #ffffff;
  box-shadow: 0px 8px 32px 0px rgba(220, 220, 220, 0.44);
  border-radius: 6px 6px 6px 6px;
  transition: all 0.3s;
  z-index: 9999;
}

.share .list .check-login::before {
  content: "";
  position: absolute;
  top: 50%;
  right: -6px;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-top: 7px solid transparent;
  border-left: 7px solid #ddd;
  border-bottom: 7px solid transparent;
}

.share .list .check-login:after {
  content: "";
  position: absolute;
  top: 50%;
  right: -6px;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-top: 7px solid transparent;
  border-left: 7px solid white;
  border-bottom: 7px solid transparent;
}

.share .list .iconfont {
  width: 40px;
  height: 40px;
  background: #ffffff;
  border-radius: 50%;
  border: 1px solid #f1f1f1;
  text-align: center;
  line-height: 38px;
  color: #040a16;
  font-size: 18px;
  font-weight: bold;
  transition: all 0.3s;
}

.share .list .text {
  width: 100%;
  display: block;
  font-size: 14px;
  color: #858d9e;
  line-height: 18px;
  margin-top: 4px;
}

.share .list .fx {
  display: contents;
  height: 62px !important;
  background-image: none !important;
  padding: 0 !important;
  text-align: center;
  margin: 0 !important;
}

.share .list .bds_more::before {
  content: "\e659";
  font-family: "iconfont";
}

.share .list .fx::before {
  content: "\e659";
  font-family: "iconfont";
  display: block;
  text-align: center;
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 50%;
  background: #ffffff;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #f1f1f1;
  color: #040a16;
  font-size: 18px;
  font-weight: 600;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  margin-bottom: 4px;
}

.share .list .fx:hover::before {
  background: #faeff1;
  border: 1px solid #ffdfe3;
  color: #cb1126;
}

.share .list.ischeck {
  color: #cb1126 !important;
}

.share .list.ischeck .iconfont {
  content: "\e680";
  color: #cb1126;
}

.share .list.ischeck .text {
  color: #cb1126;
}

.share .list.ischeck::before {
  color: #cb1126;
}

.share .list:hover .check-login {
  opacity: 1;
  left: -136px;
  visibility: visible;
  z-index: 9999;
}

.share .list a:hover .iconfont {
  color: #cb1126;
  background: #faeff1;
  border: 1px solid #ffdfe3;
}

.answer-record > .reply-list {
  border-bottom: 1px dashed #dbdcde;
}

.answer-record > .reply-list:last-child {
  border: none;
}

.reply-list {
  position: relative;
  padding-bottom: 40px;
  margin-top: 40px;
}

.reply-list .reply-list {
  margin-left: 60px;
  margin-top: 0;
}

.reply-list .reply-list:nth-child(2) {
  margin-top: 40px;
}

.reply-list .reply-list:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
}

.reply-list .avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: inline-block;
}

.reply-list .avatar img {
  width: 44px;
  height: 44px;
  border-radius: 50%;
}

.reply-list .avatar span {
  display: inline-block;
  width: 74px;
  font-size: 10px;
  color: #858d9e;
  line-height: 17px;
  text-align: center;
  background: #f0f5ff;
  border-radius: 3px;
  position: relative;
  top: -16px;
  left: 50%;
  transform: translateX(-50%);
}

.reply-list .reply-box {
  width: calc(100% - 60px);
}

.reply-list .reply-box .names {
  font-size: 14px;
  color: #040a16;
  line-height: 18px;
}

.reply-list .reply-box .names .givebox {
  display: inline-block;
  min-width: 91px;
  height: 23px;
  font-size: 12px;
  color: #eb6e06;
  line-height: 22px;
  padding-right: 8px;
  margin-top: 8px;
  margin-right: 8px;
  text-align: end;
  position: relative;
  background-repeat: no-repeat;
  z-index: 1;
  padding-left: 32px;
}

.reply-list .reply-box .names .givebox::after {
  content: "";
  display: block;
  width: calc(100% - 26px);
  height: 23px;
  background-color: #faead7;
  border-radius: 10px 0 10px 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: -1;
}

.reply-list .reply-box .names .givebox.give {
  background-image: url("../images/likebox.png");
}

.reply-list .reply-box .names .givebox.comment {
  background-image: url("../images/comment.png");
}

.reply-list .reply-box .essencebox-about {
  position: absolute;
  top: 0;
  right: 205px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.7);
}

.reply-list .reply-box .essence-comments {
  background: transparent;
  margin-top: 20px;
  line-height: 18px;
  font-size: 14px;
}

.reply-list .reply-box .essence-comments .iconfont {
  margin-right: 7px;
}

.reply-list .reply-box .essence-comments.isselect {
  color: #eb6e06;
}

.reply-list .reply-box .essence-comments.noselect {
  color: #040a16;
  margin-right: 8px;
}

.reply-list .reply-box .dates {
  font-size: 14px;
  color: #858d9e;
  line-height: 22px;
  margin-top: 4px;
}

.reply-list .reply-box .link {
  display: inline-block;
  width: 64px;
  font-size: 14px;
  color: #858d9e;
  line-height: 24px;
  height: 24px;
  background: #f1f1f1;
  border-radius: 100px 100px 100px 100px;
  text-align: center;
  position: relative;
  z-index: 1;
  cursor: pointer;
  margin-left: 22px;
  transition: all 0.4s;
}

.reply-list .reply-box .link:hover {
  background: #f0f5ff;
  color: #1e5fdd;
}

.reply-list .reply-box .active.link {
  background-color: #1e5fdd;
  color: #ffffff;
}

.reply-list .reply-box .r {
  padding-top: 10px;
}

.reply-list .reply-box a.like,
.reply-list .reply-box a.delete {
  display: inline-block;
  font-size: 14px;
  color: #858d9e;
  line-height: 18px;
  margin-top: 20px;
}

.reply-list .reply-box a.like:hover .iconfont {
  content: "\e668";
  color: #cb1126;
}

.reply-list .reply-box a.like.active .iconfont {
  content: "\e668";
  color: #cb1126;
}

.reply-list .reply-box a.delete {
  margin-left: 16px;
}

.reply-list .titles {
  font-size: 14px;
  color: #040a16;
  line-height: 24px;
  margin-top: 16px;
}

.qa-details {
  background-color: #f8f8f8;
  padding-top: 80px;
  padding-bottom: 140px;
}

.qa-details .them-title {
  font-weight: 700;
  font-size: 22px;
  color: #3d3d3d;
  line-height: 29px;
}

.qa-details .them-title::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 20px;
  background: #1e5fdd;
  position: relative;
  top: 2px;
  margin-right: 15px;
}

.qa-details .qa-left {
  width: calc(100% - 352px);
}

.qa-details .qa-right {
  width: 328px;
  margin-left: 24px;
  margin-top: 16px;
}

.qa-details .qa-right .recommendations {
  background-color: #ffffff;
  padding: 24px;
  border-radius: 6px;
}

.qa-details .qa-right .recommendations ul {
  margin-top: 16px;
}

.qa-details .qa-right .recommendations ul li {
  padding: 8px 0;
}

.qa-details .qa-right .recommendations ul li a {
  display: inline;
  font-size: 14px;
  color: #3d3d3d;
  padding: 8px 0;
  line-height: 18px;
  transition: all 0.4s;
}

.qa-details .qa-right .recommendations ul li a:hover {
  color: #1e5fdd;
  font-weight: 600;
}

.qa-details .qa-right .questioner {
  background-color: #ffffff;
  padding: 24px;
  margin-top: 24px;
}

.qa-details .qa-right .questioner .title {
  font-weight: 400;
  font-size: 16px;
  color: #040a16;
  line-height: 21px;
  padding-bottom: 16px;
  border-bottom: 1px dashed #dbdcde;
}

.qa-details .qa-right .questioner .questioner-info {
  padding-top: 16px;
}

.qa-details .qa-right .questioner .questioner-info .avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid #dbdcde;
}

.qa-details .qa-right .questioner .questioner-info .userifo {
  width: calc(100% - 56px);
}

.qa-details .qa-right .questioner .questioner-info .userifo .name {
  font-weight: 400;
  font-size: 16px;
  color: #040a16;
  line-height: 18px;
}

.qa-details .qa-right .questioner .questioner-info .type {
  margin-top: 12px;
}

.qa-details .qa-right .questioner .questioner-info .type span {
  display: inline-block;
  height: 30px;
  background: #f1f1f1;
  border-radius: 4px 4px 4px 4px;
  font-size: 16px;
  color: #858d9e;
  line-height: 30px;
  padding: 0 6px;
  margin-right: 6px;
  margin-bottom: 10px;
}

.qa-details .qa-right .questioner .questioner-info .content-type span {
  display: inline-block;
  min-width: 72px;
  font-size: 14px;
  color: #858d9e;
  line-height: 18px;
}

.qa-details .qa-right .problem-comes {
  margin-top: 60px;
}

.qa-details .qa-right .problem-comes a {
  display: inline-block;
  font-size: 14px;
  color: #1e5fdd;
  line-height: 18px;
  margin-top: 16px;
  transition: all 0.36s;
}

.qa-details .qa-right .problem-comes a:hover {
  font-weight: 600;
}

.qa-details .qa-right .problem-status {
  margin-top: 60px;
}

.qa-details .qa-right .problem-status .title {
  margin-bottom: 16px;
}

.qa-details .qa-right .problem-status p.list {
  font-size: 14px;
  color: #858d9e;
  line-height: 34px;
}

.qa-details .qa-problem {
  background-color: #ffffff;
  padding: 24px;
  border-radius: 6px;
  margin-top: 16px;
}

.qa-details .qa-problem .title {
  font-weight: 700;
  font-size: 24px;
  color: #3d3d3d;
  line-height: 32px;
}

.qa-details .qa-problem .desc {
  font-size: 14px;
  color: #040a16;
  line-height: 24px;
  margin-top: 24px;
}

.qa-details .qa-problem .answer {
  margin-top: 24px;
}

.qa-details .qa-problem .answer a {
  color: #0000ee;
  text-decoration: underline;
}

.qa-details .qa-problem .answer span {
  display: inline;
}

.qa-details .qa-problem .answer i {
  font-style: italic;
}

.qa-details .qa-problem .answer > p,
.qa-details .qa-problem .answer > div,
.qa-details .qa-problem .answer > span {
  line-height: 1.6em;
  font-size: 16px;
  color: #040a16;
  padding-bottom: 16px;
}

.qa-details .qa-problem .answer ol,
.qa-details .qa-problem .answer ul {
  margin-left: 24px;
}

.qa-details .qa-problem .answer img,
.qa-details .qa-problem .answer video {
  max-width: 100%;
}

.qa-details .peer-response {
  background-color: #ffffff;
  padding: 24px;
  margin-top: 24px;
}

.qa-details .peer-response .response-box {
  height: 240px;
  background: #f7f7f7;
  border-radius: 8px 8px 8px 8px;
  padding: 24px 24px 30px;
  margin-top: 32px;
}

.qa-details .peer-response .response-box #char-count {
  font-size: 14px;
  color: #858d9e;
  position: relative;
  top: -4px;
}

.qa-details .peer-response .response-box textarea {
  width: 100%;
  height: 100%;
  background-color: transparent;
  outline: none;
}

.qa-details .peer-response .btn {
  margin-top: 32px;
  text-align: right;
}

.qa-details .peer-response .btn button {
  width: 98px;
  font-weight: 700;
  height: 48px;
  font-size: 16px;
  color: #ffffff;
  background: #1e5fdd;
  border-radius: 100px 100px 100px 100px;
  opacity: 1;
  border: none;
  transition: all 0.3s;
}

.community {
  background: linear-gradient(to bottom, #f2f5fd 0%, #f8f8f8 229px);
  padding-top: 32px;
  padding-bottom: 140px;
}

.community .thems-title {
  text-align: center;
  font-weight: 400;
  font-size: 22px;
  color: #858d9e;
  line-height: 29px;
}

.community .communitynew-select .select-box {
  width: 240px;
  background-color: #ffffff;
  border-radius: 100px 100px 100px 100px;
  margin-top: 24px;
  margin-right: 24px;
  padding: 0 12px;
}

.community .communitynew-select .select-box > select {
  width: 100%;
  height: 60px;
  margin-bottom: 0;
  font-size: 16px;
  color: #040a16;
}

.community .communitynew-select .select-box .metro {
  height: 62px;
  margin-bottom: 0;
}

.community .communitynew-select .select-box .metro .selected {
  padding: 22px 12px;
}

.community .communitynew-select .select-box .metro.open .carat:after {
  margin-top: -8px;
}

.community .communitynew-select .release-btn {
  min-width: 114px;
  text-align: center;
  display: inline-block;
  font-size: 14px;
  color: #1e5fdd;
  padding: 0 19px;
  line-height: 60px;
  height: 62px;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #1e5fdd;
  margin-top: 24px;
  margin-left: 24px;
}

.community .communitynew-select .release-btn .iconfont {
  font-size: 14px;
}

.community .search {
  height: 64px;
  background: #ffffff;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #e0eaff;
  margin-top: 24px;
  line-height: 62px;
  padding: 0 33px;
}

.community .search .iconfont {
  font-size: 20px;
  color: #1e5fdd;
}

.community .search .form-box {
  display: inline-block;
  width: calc(100% - 38px);
  margin-left: 18px;
}

.community .search .form-box input {
  display: inline-block;
  width: calc(100% - 60px);
}

.community .search .form-box input::placeholder {
  font-size: 16px;
  color: #b3b6be;
}

.community .search .form-box button {
  background-color: transparent;
  border: none;
  font-size: 16px;
  color: #1e5fdd;
}

.community .active-users {
  background-color: #ffffff;
  margin-top: 24px;
  padding: 24px;
  border-radius: 6px;
}

.community .active-users .users-box {
  margin-top: 32px;
  padding: 0;
}

.community .active-users .list {
  display: block;
  text-align: left;
  margin-bottom: 40px;
}

.community .active-users .list:last-child {
  margin-bottom: 0;
}

.community .active-users .avatar {
  width: 44px;
  height: 44px;
  object-fit: cover;
  border-radius: 50%;
  cursor: pointer;
}

.community .active-users .name {
  font-size: 18px;
  color: #040a16;
  line-height: 18px;
}

.community .active-users .type {
  margin-top: 12px;
}

.community .active-users .type span {
  display: inline-block;
  height: 30px;
  background: #f1f1f1;
  border-radius: 4px 4px 4px 4px;
  padding: 0 6px;
  line-height: 30px;
  font-size: 16px;
  color: #858d9e;
  margin-bottom: 8px;
  margin-right: 6px;
}

.community .active-users .type span:hover {
  color: #1e5fdd;
}

.community .active-users .right-box {
  width: 220px;
}

.community .active-users .release {
  margin-top: 2px;
}

.community .active-users .release span {
  display: inline-block;
  font-size: 16px;
  color: #858d9e;
  line-height: 24px;
  margin-bottom: 2px;
}

.community .popular-posts {
  background-color: #ffffff;
  border-radius: 6px 6px 6px 6px;
  padding: 24px 18px;
  margin-top: 24px;
}

.community .popular-posts .ranking {
  margin-top: 20px;
  padding: 0;
}

.community .popular-posts .ranking .list:last-child {
  margin-bottom: 0;
}

.community .popular-posts .them-title {
  margin-left: 6px;
}

.community-content {
  margin-top: 35px;
}

.community-tab {
  width: 190px;
  border-left: 3px solid #f1f1f1;
}

.community-tab .t1 {
  font-weight: 700;
  font-size: 20px;
  color: #040a16;
  line-height: 26px;
  padding-left: 16px;
}

.community-tab a {
  text-align: start;
  display: block;
  font-size: 16px;
  color: #858d9e;
  line-height: 21px;
  padding: 9px 0px 9px 12px;
  position: relative;
}

.community-tab a::before {
  content: "· ";
  position: absolute;
  left: 0;
  top: 12px;
}

.community-tab a.active {
  color: #1e5fdd;
  position: relative;
}

.community-tab a.active::after {
  content: "";
  display: block;
  width: 3px;
  height: 24px;
  background: #1e5fdd;
  position: absolute;
  left: -19px;
  top: 10px;
}

.community-tab a:hover {
  color: #1e5fdd;
}

.community-tab .tab-box {
  position: relative;
  padding-left: 20px;
  overflow: hidden;
  margin-left: -3px;
  margin-top: 8px;
}

.community-tab .square {
  display: block;
  width: 3px;
  height: 24px;
  background: #1e5fdd;
  position: absolute;
  left: 0px;
  transition: all 0.46s;
}

.community-center {
  width: calc(100% - 544px);
}

.community-center .community-content-box {
  background-color: #ffffff;
  border-radius: 6px 6px 6px 6px;
  padding: 24px 24px 0px;
}

.community-center .search-tab a {
  display: inline-block;
  padding: 4px 0 12px;
  margin-right: 26px;
  position: relative;
}

.community-center .search-tab a::after {
  content: "";
  display: block;
  width: 0px;
  height: 3px;
  background-color: #1e5fdd;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  transition: all 0.4s;
}

.community-center .search-tab a.active,
.community-center .search-tab a:hover {
  font-weight: bold;
  color: #1e5fdd;
}

.community-center .search-tab a.active::after,
.community-center .search-tab a:hover::after {
  width: 32px;
}

.community-center .content-box {
  padding-top: 24px;
}

.community-center .option-box input[type="radio"] {
  display: none;
}

.community-center .option-box .square-radio {
  width: 16px;
  height: 16px;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 3px 3px 3px 3px;
  border: 1px solid #dbdcde;
  margin-right: 8px;
}

.community-center .option-box .active {
  color: #1e5fdd;
}

.community-center .option-box .active .square-radio {
  border: 1px solid #1e5fdd;
  background-color: #1e5fdd;
  line-height: 14px;
  text-align: center;
}

.community-center .option-box .square-radio::before {
  content: "\e7c8";
  color: #ffffff;
  font-size: 12px;
  font-weight: bold;
  font-family: "iconfont";
  opacity: 0;
}

.community-center .option-box .active .square-radio::before {
  opacity: 1;
}

.community-center .option-box label {
  font-weight: 400;
  font-size: 14px;
  color: #040a16;
  line-height: 16px;
  margin-right: 32px;
}

.community-center .option-box label:hover {
  color: #1e5fdd;
}

.community-center .option-box input {
  width: 16px;
  height: 16px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 3px 3px 3px 3px;
  border: 1px solid #dbdcde;
  margin-right: 8px;
  position: relative;
  top: 2px;
}

.community-center .list {
  display: block;
  margin-bottom: 21px;
  padding-bottom: 21px;
  position: relative;
  transition: all 0.4s;
}

.community-center .list .chapter-img {
  width: 64px;
  position: absolute;
  right: 0;
  top: -10px;
  z-index: 10;
}

.community-center .list .avatar {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  object-fit: cover;
  top: 0;
}

.community-center .list .t1 {
  font-weight: 700;
  font-size: 18px;
  color: #040a16;
  line-height: 24px;
  margin-top: 12px;
}

.community-center .list .desc {
  font-weight: 400;
  font-size: 14px;
  color: #858d9e;
  line-height: 24px;
  margin-top: 8px;
}

.community-center .list .imgs {
  margin-top: 16px;
}

.community-center .list .imgs img {
  width: 138px;
  height: 138px;
  border-radius: 4px 4px 4px 4px;
  object-fit: cover;
}

.community-center .list .infos {
  margin-top: 16px;
}

.community-center .list .infos .avatar {
  top: -2px;
}

.community-center .list .infos .top4 {
  position: relative;
  top: 4px;
}

.community-center .list .infos .iconfont {
  font-size: 18px;
  color: #b3b6be;
  margin-right: 6px;
}

.community-center .list .infos .text {
  font-weight: 400;
  font-size: 14px;
  color: #858d9e;
  line-height: 18px;
  margin-right: 16px;
}

.community-center .list .infos .date {
  font-size: 14px;
  color: #858d9e;
  line-height: 18px;
  padding-left: 16px;
  margin-left: 6px;
  position: relative;
}

.community-center .list .infos .date::after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 14px;
  background-color: #b3b6bd;
  position: absolute;
  left: 0;
  top: 2px;
}

.community-center .list .infos .types {
  margin-left: 18px;
}

.community-center .list .name {
  font-weight: 400;
  font-size: 14px;
  color: #858d9e;
  line-height: 24px;
  display: inline-block;
  margin-left: 6px;
}

.community-center .list .answer {
  display: block;
  padding: 0 10px;
  height: 32px;
  line-height: 26px;
  font-size: 14px;
  color: #858d9e;
  text-align: center;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #dbdcde;
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.community-center .list .answer::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-color: #538cfa;
  background: linear-gradient(134deg, #538cfa 0%, #1e5fdd 99%);
  position: absolute;
  right: 100%;
  top: 0;
  transition: all 0.36s;
  z-index: -1;
}

.community-center .list .answer .iconfont {
  margin-right: 2px;
}

.community-center .list:last-child {
  margin-bottom: 0;
  padding-bottom: 24px;
}

.community-center .list:last-child::after {
  height: 0px;
}

.community-center .list::after {
  content: "";
  display: block;
  width: 0;
  height: 1px;
  background-color: #1e5fdd;
  position: absolute;
  left: 0;
  bottom: 0;
  transition: all 0.46s;
}

.community-center .list:hover::after {
  width: 100%;
}

.community-center .list:hover .t1 {
  color: #1e5fdd;
}

.community-center .list:hover .answer {
  color: #1e5fdd;
  border: 1px solid #f0f5ff;
  background-color: #f0f5ff;
}

.community-center .list:hover .answer .iconfont {
  color: #1e5fdd;
}

.community-right {
  width: 330px;
}

.community-right .them-title {
  font-weight: 700;
  font-size: 22px;
  color: #3d3d3d;
  line-height: 29px;
}

.community-right .them-title::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 20px;
  background: #1e5fdd;
  position: relative;
  top: 2px;
  margin-right: 15px;
}

.community-right .userinfo {
  background-color: #ffffff;
  padding: 24px;
  border-radius: 6px;
}

.community-right .userinfo .them-title {
  padding-bottom: 10px;
}

.community-right .userinfo .r-list {
  margin-top: 24px;
}

.community-right .userinfo .r-list .avatar {
  width: 60px;
  height: 60px;
}

.community-right .userinfo .r-list .avatar img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  object-fit: cover;
}

.community-right .userinfo .r-list .username {
  margin-left: 10px;
  padding: 4px 0 4px;
  overflow: hidden;
}

.community-right .userinfo .r-list .username .names {
  font-size: 16px;
  color: #040a16;
  line-height: 22px;
}

.community-right .userinfo .r-list .username .imgs img {
  max-height: 20px;
}

.community-right .userinfo .r-list .r-button {
  padding: 0 8px;
  font-size: 14px;
  color: #1e5fdd;
  height: 28px;
  border-radius: 100px;
  border: 1px solid #1e5fdd;
  background-color: #ffffff;
  transition: all 0.36s;
}

.community-right .userinfo .r-list .r-button:hover {
  font-weight: bold;
}

.community-right .userinfo .r-list .r-button .iconfont {
  font-size: 14px;
  margin-right: 4px;
}

.community-right .userinfo .r-list .fanslist {
  font-size: 14px;
  margin-top: 16px;
}

.community-right .userinfo .r-list .fanslist span {
  line-height: 20px;
  color: #858d9e;
}

.community-right .userinfo .r-list .fanslist span strong {
  color: #040a16;
}

.community-right .moderator-zone {
  width: 100%;
  height: 80px;
  margin-top: 24px;
  padding-left: 21px;
  background-image: url(../images/moderatorbg.png);
}

.community-right .moderator-zone strong {
  font-size: 18px;
  color: #040a16;
}

.community-right .moderator-zone span {
  font-size: 14px;
  color: #040a16;
}

.community-right .moderator-zone .iconfont {
  font-size: 16px;
  color: #000000;
  margin-right: 16px;
  margin-left: 10px;
}

.community-info {
  padding-top: 80px;
  padding-bottom: 140px;
  background-color: #f8f8f8;
}

.community-info .desc {
  background: #f7f7f7;
  border-radius: 6px 6px 6px 6px;
  font-size: 18px;
  color: #767676;
  line-height: 24px;
  padding: 24px 16px;
  margin-top: 24px;
}

.community-info .them-title {
  font-weight: 700;
  font-size: 22px;
  color: #3d3d3d;
  line-height: 29px;
}

.community-info .them-title::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 20px;
  background: #1e5fdd;
  position: relative;
  top: 2px;
  margin-right: 15px;
}

.community-info .info-content {
  margin-top: 16px;
}

.community-info .left-box {
  width: calc(100% - 354px);
  background-color: #ffffff;
  padding: 24px;
  border-radius: 6px;
}

.community-info .left-box .title {
  font-weight: 700;
  font-size: 24px;
  color: #3d3d3d;
  line-height: 32px;
}

.community-info .left-box .date {
  font-size: 14px;
  color: #858d9e;
  line-height: 22px;
  margin-top: 16px;
}

.community-info .left-box .text-content {
  margin-top: 24px;
  padding-bottom: 40px;
  border-bottom: 1px dashed #d8d8d8;
  overflow: hidden;
}

.community-info .left-box .text-content a {
  color: #0000ee;
  text-decoration: underline;
}

.community-info .left-box .text-content span {
  display: inline;
}

.community-info .left-box .text-content i {
  font-style: italic;
}

.community-info .left-box .text-content > p,
.community-info .left-box .text-content > div,
.community-info .left-box .text-content > span {
  line-height: 1.6em;
  font-size: 16px;
  color: #040a16;
}

.community-info .left-box .text-content ol,
.community-info .left-box .text-content ul {
  margin-left: 24px;
}

.community-info .left-box .text-content img,
.community-info .left-box .text-content video {
  max-width: 100%;
  height: auto;
}

.community-info .left-box .download {
  text-align: center;
  margin-top: 40px;
}

.community-info .left-box .download .lists {
  margin: 0 16px 24px 0;
  width: 180px;
}

.community-info .left-box .download img {
  width: 78px;
}

.community-info .left-box .download .t1 {
  font-size: 14px;
  color: #040a16;
  line-height: 22px;
  margin-top: 8px;
}

.community-info .left-box .download .t2 {
  font-weight: 400;
  font-size: 14px;
  color: #858d9e;
  line-height: 22px;
  margin-top: 10px;
}

.community-info .left-box .download .t2 span {
  margin: 0 4px;
}

.community-info .left-box .download .download-btn {
  font-size: 14px;
  color: #1e5fdd;
  display: inline-block;
  padding: 0 10px;
  height: 24px;
  background: #f0f5ff;
  border-radius: 100px 100px 100px 100px;
  text-align: center;
  line-height: 24px;
  margin-top: 16px;
  transition: all 0.4s;
}

.community-info .left-box .download .download-btn:hover {
  background-color: #1e5fdd;
  color: #ffffff;
}

.community-info .left-box .reply-all {
  margin-top: 48px;
}

.community-info .left-box .reply-all .replyall-title span {
  font-weight: 700;
  font-size: 22px;
  color: #3d3d3d;
  line-height: 29px;
  position: relative;
}

.community-info .left-box .reply-all .replyall-title span::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 20px;
  background: #1e5fdd;
  border-radius: 0px 0px 0px 0px;
  position: relative;
  top: 2px;
  margin-right: 14px;
}

.community-info .left-box .reply-all .replyall-title button {
  height: 30px;
  background-color: transparent;
  margin-left: 24px;
  position: relative;
  background: linear-gradient(134deg, #538cfa 0%, #1e5fdd 99%);
  color: #ffffff;
  padding: 0 24px;
  border-radius: 6px;
  font-size: 14px;
}

.community-info .left-box .reply-all .sort {
  text-align: right;
}

.community-info .left-box .reply-all .sort .date-box {
  margin-left: 24px;
}

.community-info .left-box .reply-all .sort .text {
  font-weight: 400;
  font-size: 16px;
  color: #040a16;
  line-height: 21px;
  margin-top: 0;
}

.community-info .left-box .reply-all .sort .icons {
  display: inline-block;
}

.community-info .left-box .reply-all .sort .icons .iconfont {
  display: block;
  font-size: 8px;
  color: #b3b6be;
  margin-left: 8px;
}

.community-info .left-box .reply-all .sort .active .text {
  color: #1e5fdd;
}

.community-info .left-box .reply-all .sort .active .iconfont.bot {
  color: #1e5fdd;
}

.community-info .left-box .reply-all .sort .like-box:hover .text,
.community-info .left-box .reply-all .sort .date-box:hover .text {
  color: #1e5fdd;
}

.community-info .left-box .reply-all .reply-ul > .reply-list {
  border-bottom: 1px dashed #dbdcde;
}

.community-info .left-box .reply-all .reply-ul > .reply-list:last-child {
  border: none;
}

.community-info .right-box {
  width: 330px;
}

.community-info .right-box .userinfo {
  background-color: #ffffff;
  text-align: center;
  padding: 37px 0 33px;
}

.community-info .right-box .userinfo .avatar {
  display: inline-block;
  width: 71px;
  height: 71px;
  position: relative;
  text-align: center;
  border: 1px solid #cadeff;
  border-radius: 50%;
  padding: 4px;
}

.community-info .right-box .userinfo .avatar img {
  width: 100%;
  height: 100%;
  top: 0;
  border: 1px solid #789feb;
  border-radius: 50%;
  object-fit: cover;
  padding: 4px;
}

.community-info .right-box .userinfo .name {
  font-size: 16px;
  color: #040a16;
  line-height: 21px;
  margin-top: 12px;
}

.community-info .right-box .userinfo .release {
  display: inline-block;
  width: 160px;
  height: 48px;
  line-height: 48px;
  font-size: 14px;
  color: #ffffff;
  font-weight: bold;
  background-color: #1e5fdd;
  background: linear-gradient(134deg, #538cfa 0%, #1e5fdd 99%);
  border-radius: 100px 100px 100px 100px;
  margin-top: 40px;
}

.community-info .right-box .userinfo .list {
  margin-top: 32px;
}

.community-info .right-box .userinfo .list .li {
  display: inline-block;
  text-align: center;
  margin: 0 2px;
}

.community-info .right-box .userinfo .list .li p {
  font-size: 14px;
  color: #858d9e;
  line-height: 18px;
}

.community-info .right-box .userinfo .list .li span {
  font-weight: 700;
  font-size: 18px;
  color: #040a16;
  line-height: 24px;
  margin-top: 8px;
}

.recommendations {
  background-color: #ffffff;
  padding: 24px;
  border-radius: 6px;
  margin-top: 24px;
}

.recommendations ul {
  margin-top: 24px;
}

.recommendations ul li a {
  display: block;
  font-size: 14px;
  color: #3d3d3d;
  line-height: 18px;
  padding: 8px 0;
}

.recommendations ul li a:hover {
  color: #1e5fdd;
}

.login-box {
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: #1e5fdd;
}

.login-box .left-img {
  width: calc(100% - 718px);
  height: 100%;
  background-size: cover;
  background-position: left center;
}

.login-box .right-box::-webkit-scrollbar {
  width: 6px;
}

.login-box .right-box::-webkit-scrollbar-thumb {
  background: #1e5fdd;
  border-radius: 8px;
}

.login-box .right-box::-webkit-scrollbar {
  /* 纵向滚动条 宽度 */
  width: 6px;
  /* 横向滚动条 高度 */
  height: 4px;
  /* 整体背景 */
  background: rgba(126, 126, 126, 0.2);
  /* 整体 圆角 */
  border-radius: 8px;
}

.login-box .right-box {
  width: 718px;
  height: 100%;
  overflow-y: scroll;
  background-color: #ffffff;
  padding: 80px 80px 45px;
  position: relative;
}

.login-box .right-box .t1 {
  font-size: 36px;
  color: #040a16;
  line-height: 34px;
  margin-top: 24px;
}

.login-box .right-box .t2 {
  font-size: 16px;
  color: #b3b6be;
  line-height: 21px;
  margin-top: 24px;
}

.login-box .right-box .link {
  font-size: 16px;
  color: #aaaaaa;
  line-height: 24px;
  margin-top: 24px;
}

.login-box .right-box .link a {
  color: #1e5fdd;
  margin-left: 6px;
}

.login-box .login-from {
  position: relative;
  height: calc(100% - 189px);
  min-height: 478px;
  padding-top: 16%;
}

.login-box .login-from .list p.label {
  display: inline-block;
  width: 76px;
  font-size: 16px;
  color: #858d9e;
  line-height: 64px;
  margin-bottom: 23px;
}

.login-box .login-from .list input {
  width: calc(100% - 76px);
  height: 64px;
  background: #f2f7fe;
  border-radius: 4px 4px 4px 4px;
  border: 1px solid #eeeef0;
  padding: 24px;
}

.login-box .login-from .list .retrieve label {
  display: inline-block;
}

.login-box .login-from .list .retrieve label input {
  margin-right: 16px;
  color: #040a16;
}

.login-box .login-from .list input[type="radio"] {
  width: 14px;
  height: 14px;
}

.login-box .login-from .forgot {
  margin-top: 24px;
  text-align: right;
}

.login-box .login-from .forgot a {
  font-size: 16px;
  color: #040a16;
  line-height: 24px;
}

.login-box .login-from .sub {
  width: 100%;
  height: 64px;
  background: #1e5fdd;
  border-radius: 100px 100px 100px 100px;
  font-weight: 700;
  font-size: 16px;
  color: #ffffff;
  margin-top: 80px;
  letter-spacing: 4px;
}

.login-box .list:nth-child(2) {
  margin-top: 40px;
}

.regist-box {
  width: 100%;
  height: 100%;
}

.regist-box .left-img {
  width: calc(100% - 718px);
  height: 100%;
  background-size: cover;
  background-position: left center;
}

.regist-box .right-box::-webkit-scrollbar {
  width: 6px;
}

.regist-box .right-box::-webkit-scrollbar-thumb {
  background: #1e5fdd;
  border-radius: 8px;
}

.regist-box .right-box::-webkit-scrollbar {
  /* 纵向滚动条 宽度 */
  width: 6px;
  /* 横向滚动条 高度 */
  height: 4px;
  /* 整体背景 */
  background: rgba(126, 126, 126, 0.2);
  /* 整体 圆角 */
  border-radius: 8px;
}

.regist-box .right-box {
  width: 718px;
  height: 100%;
  background-color: #ffffff;
  padding: 54px 80px 40px;
  position: relative;
  overflow-y: scroll;
}

.regist-box .right-box .regist-centers {
  min-height: calc(100% - 170px);
}

.regist-box .right-box .tab-box {
  margin-top: 32px;
}

.regist-box .right-box .tab-box a {
  font-size: 28px;
  color: #b3b6be;
  line-height: 34px;
  padding-bottom: 17px;
  position: relative;
}

.regist-box .right-box .tab-box a::after {
  content: "";
  display: inline-block;
  width: 0px;
  height: 4px;
  border-radius: 3px;
  background-color: #1e5fdd;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  transition: all 0.36s;
  bottom: 0;
}

.regist-box .right-box .tab-box a:nth-child(2) {
  margin-left: 40px;
}

.regist-box .right-box .tab-box a.active {
  color: #040a16;
}

.regist-box .right-box .tab-box a:hover {
  color: #040a16;
}

.regist-box .right-box .tab-box a:hover::after {
  width: 40px;
}

.regist-box .right-box .tab-box a.active::after {
  width: 40px;
}

.regist-box .right-box .link {
  font-size: 16px;
  color: #aaaaaa;
  line-height: 24px;
  margin-top: 10px;
  text-align: center;
}

.regist-box .right-box .link a {
  color: #1e5fdd;
  margin-left: 6px;
}

.regist-box .login-from {
  position: relative;
  margin-top: 40px;
}

.regist-box .login-from.forgot1 .list {
  width: calc(100% + 30px);
  margin-left: -30px;
}

.regist-box .login-from .code .list-box input {
  width: calc(100% - 160px);
}

.regist-box .login-from .code .list-box button {
  color: #1e5fdd;
  font-size: 16px;
  background-color: transparent;
}

.regist-box .login-from .list .list-box {
  display: inline-block;
  width: calc(100% - 158px);
  height: 64px;
  background: #f2f7fe;
  border-radius: 4px 4px 4px 4px;
  border: 1px solid #eeeef0;
}

.regist-box .login-from .list .list-box .bootstrap-select.btn-group .btn .filter-option {
  left: 24px;
  font-size: 16px;
  color: #040a16;
}

.regist-box .login-from .list .list-box .bootstrap-select.btn-group .btn .caret {
  width: 0;
  height: 0;
  border-width: 0;
  right: 24px;
  transform: rotate(0deg);
}

.regist-box .login-from .list .list-box .bootstrap-select.btn-group .btn .caret::before {
  content: "\e61e3";
  font-family: "iconfont";
  font-size: 16px;
  color: #858d9e;
  margin-left: -12px;
  position: relative;
  top: -7px;
}

.regist-box .login-from .list .list-box .bootstrap-select.btn-group .dropdown-menu {
  max-height: 446px !important;
  min-height: 64px !important;
}

.regist-box .login-from .list .list-box .bootstrap-select.btn-group .dropdown-menu .input-block-level {
  display: block;
  height: 40px;
  padding: 24px 12px;
  font-size: 14px;
}

.regist-box .login-from .list .list-box .dropdown-menu > li > a {
  padding: 21px 20px;
}

.regist-box .login-from .list .list-box .form-control {
  border: 1px solid #ededed;
}

.regist-box .login-from .list .metro .selected,
.regist-box .login-from .list .metro li {
  padding: 23px 24px;
  font-weight: 500;
}

.regist-box .login-from .list p.label {
  width: 158px;
  display: inline-block;
  font-size: 16px;
  color: #858d9e;
  line-height: 72px;
  padding-right: 24px;
  text-align: end;
}

.regist-box .login-from .list p.label.required::before {
  content: "*";
  font-size: 16px;
  color: #cb1126;
  position: relative;
  left: -4px;
  top: 3px;
}

.regist-box .login-from .list input {
  width: 100%;
  height: 62px;
  background-color: #f2f7fe;
  padding: 24px;
}

.regist-box .login-from .list.retrieve label {
  display: inline-block;
  margin-right: 24px;
}

.regist-box .login-from .list.retrieve label input {
  margin-right: 6px;
  color: #757575;
}

.regist-box .login-from .list input[type="radio"] {
  width: 14px;
  height: 14px;
}

.regist-box .login-from .sub {
  width: 100%;
  height: 64px;
  background: #1e5fdd;
  border-radius: 100px 100px 100px 100px;
  font-weight: 700;
  font-size: 16px;
  color: #ffffff;
  margin-top: 58px;
  letter-spacing: 4px;
}

.regist-box .protocol {
  margin-top: 16px;
}

.regist-box .protocol label {
  margin-top: 8px;
  display: block;
  font-size: 15px;
  color: #858d9e;
  line-height: 17px;
}

.regist-box .protocol label a {
  font-size: 15px;
  color: #1e5fdd;
}

.regist-box .protocol label a:hover {
  color: #1e5fdd;
  text-decoration: underline;
}

.regist-box .list:nth-child(n + 2) {
  margin-top: 16px;
}

.msk {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.44);
  position: fixed;
  left: 0;
  top: 0;
  z-index: 666;
  opacity: 1;
}

.msk.white {
  background-color: rgba(255, 255, 255, 0.1);
}

.msk.close {
  z-index: -1000;
  opacity: 0;
  display: none;
}

.msk.close .pop-box {
  top: 60px;
  opacity: 0;
}

.msk.close .user-infnpop {
  top: 60px;
  opacity: 0;
}

.msk .title .blod {
  font-weight: 700;
  font-size: 22px;
  color: #3d3d3d;
  line-height: 30px;
  position: relative;
  padding-left: 19px;
}

.msk .title .blod::after {
  content: "";
  display: block;
  width: 4px;
  height: 20px;
  background: #1e5fdd;
  position: absolute;
  left: 0;
  top: 5px;
}

.msk .title .iconfont {
  color: #1e5fdd;
  font-size: 18px;
  cursor: pointer;
  cursor: pointer;
  transition: all 0.3s;
  background: transparent;
}

.msk .title .iconfont:hover {
  font-weight: bold;
}

.msk .pop-box {
  width: 940px;
  padding: 44px 44px 70px;
  max-height: 90%;
  height: fit-content;
  background-image: url("../images/bg.png");
  background-color: #ffffff;
  background-size: 100% auto;
  background-position: top center;
  background-repeat: no-repeat;
  border-radius: 14px;
  overflow: hidden !important;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  opacity: 1;
  transition: all 0.4s 0.1s;
  scrollbar-color: #fff;
  /* 第一个方块颜色，第二个轨道颜色(用于更改火狐浏览器样式) */
  scrollbar-width: thin;
  /* 火狐滚动条无法自定义宽度，只能通过此属性使滚动条宽度变细 */
  -ms-overflow-style: none;
}

.msk .pop-box ol {
  list-style: auto;
  margin-left: 20px;
}

.msk .pop-box ul {
  list-style: disc;
  margin-left: 20px;
}

.msk .pop-box .dropdown {
  width: 100%;
  background: transparent;
  position: relative;
  top: 3px;
  left: 8px;
}

.msk .pop-box .dropdown:focus,
.msk .pop-box .dropdown:hover {
  box-shadow: none;
}

.msk .pop-box .dropdown.focus {
  box-shadow: none;
}

.msk .pop-box::-webkit-scrollbar {
  display: none;
}

.msk .pop-box form {
  width: calc(100% + 18px);
  margin-top: 24px;
  max-height: calc(100% - 82px);
  padding-right: 12px;
  overflow: hidden;
  overflow-y: scroll;
  scrollbar-width: thin;
  scrollbar-color: #2D6BE5 #ffffff;
}

.msk .pop-box form::-webkit-scrollbar {
  width: 6px;
  background: #ffffff;
}

.msk .pop-box form::-webkit-scrollbar-thumb {
  background: #1e5fdd;
  border-radius: 8px;
}

.msk .pop-box .fixed.list {
  background: #f2f7fe;
  border: 1px solid #eeeef0;
}

.msk .pop-box .fixed.list span {
  color: #040a16;
}

.msk .pop-box .list {
  height: 56px;
  background: #f7f7f7;
  border-radius: 4px 4px 4px 4px;
  border: 1px solid #eeeef0;
  padding: 16px 24px;
  margin-bottom: 16px;
}

.msk .pop-box .list .reply-textare {
  width: calc(100% - 176px);
  height: 160px;
  background: transparent;
  outline: none;
  margin-top: 0px;
}

.msk .pop-box .list > span {
  font-size: 14px;
  height: 14px;
  line-height: 14px;
  padding-right: 22px;
  color: #040a16;
  display: inline-block;
  border-right: 1px solid #b3b6be;
}

.msk .pop-box .list input {
  width: 610px;
  background-color: transparent;
  padding-left: 20px;
  font-size: 14px;
}

.msk .pop-box .list select,
.msk .pop-box .list input {
  color: #757575;
  font-size: 14px;
}

.msk .pop-box .list .dropdown .selected {
  color: #757575;
  font-size: 14px;
}

.msk .pop-box .textarea-box.fixd-box {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 6666;
}

.msk .pop-box .textarea-box .ke-container {
  width: 100% !important;
  height: 100% !important;
  border-radius: 4px;
  border: 1px solid #dbdcde;
}

.msk .pop-box .textarea-box .ke-edit {
  width: 100% !important;
  height: calc(100% - 50px) !important;
}

.msk .pop-box .textarea-box .ke-edit-iframe {
  height: 100% !important;
}

.msk .pop-box .textarea-box .ke-toolbar {
  background-color: #f2f7fe;
  border-bottom: 1px solid #dbdcde;
  border-radius: 4px 4px 0px 0px;
  padding: 12.5px 16px 12.5px 2px;
}

.msk .pop-box .textarea-box .ke-content {
  background-color: #f2f7fe;
}

.msk .pop-box .left-showtext {
  padding: 6px 0;
  position: relative;
}

.msk .pop-box .left-showtext .tp-annex-del {
  font-size: 14px;
  color: #000000;
  position: relative;
  margin-right: 24px;
}

.msk .pop-box .left-showtext .tp-annex-del {
  width: 412px;
  padding-bottom: 10px;
  padding-right: 24px;
}

.msk .pop-box .left-showtext .tp-annex-del:nth-child(2n) {
  margin-right: 0;
}

.msk .pop-box .left-showtext .iconfont {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 1px solid red;
  font-size: 8px;
  color: red;
  display: block;
  position: absolute;
  text-align: center;
  line-height: 15px;
  top: 0px;
  right: 0;
}

.msk .pop-box .left-showtext .iconfont.textstr {
  width: 36px;
  font-size: 12px;
  border: none;
  color: #cccccc;
}

.msk .pop-box .left-showtext .loadingline {
  display: block;
  width: 0;
  height: 2px;
  background-color: #366ef4;
  border-radius: 10px;
  position: absolute;
  left: 0;
  bottom: 0;
}

.msk .pop-box .updata {
  margin-top: 16px;
  height: 114px;
  position: relative;
}

.msk .pop-box .updata input {
  width: 100%;
  height: 114px;
  display: block;
  background-color: #ffffff !important;
  border-radius: 2px 2px 2px 2px;
  border: 1px dashed #366ef4;
  font-size: 14px;
  color: transparent;
  background: #ffffff;
}

.msk .pop-box .updata input::-webkit-file-upload-button {
  width: 0;
  background-color: #ffffff;
  border: none;
  color: #fff;
}

.msk .pop-box .file-box {
  width: 228px;
  position: absolute;
  left: 50%;
  top: 0;
  text-align: center;
  transform: translateX(-50%);
  margin-top: 20px;
}

.msk .pop-box .file-box .iconfont {
  font-size: 40px;
  color: #1e5fdd;
}

.msk .pop-box .file-box .text {
  font-size: 14px;
  margin-top: 6px;
  color: rgba(0, 0, 0, 0.6);
}

.msk .pop-box .file-box .text span {
  color: #0052d9;
}

.msk .pop-box .footer {
  margin-top: 32px;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 16px 44px 30px;
  background: #ffffff;
}

.msk .pop-box .footer .f-l {
  padding-top: 8px;
}

.msk .pop-box .footer .f-l input {
  width: 16px;
  height: 16px;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 3px 3px 3px 3px;
  border: 1px solid #dbdcde;
}

.msk .pop-box .footer .f-l span {
  font-size: 14px;
  color: #040a16;
  line-height: 14px;
  position: relative;
  top: -3px;
  margin-left: 4px;
}

.msk .pop-box .footer .f-r .cancel {
  line-height: 34px;
  width: 82px;
  height: 36px;
  background: #ffffff;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #e5e6eb;
  font-size: 14px;
  color: #040a16;
}

.msk .pop-box .footer .f-r .confirm {
  width: 82px;
  height: 36px;
  line-height: 34px;
  background: #1e5fdd;
  background: linear-gradient(134deg, #538cfa 0%, #1e5fdd 99%);
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #389dff;
  font-size: 14px;
  color: #ffffff;
  margin-left: 22px;
}

.msk .user-infnpop {
  width: 640px;
  min-height: 652px;
  height: min-content;
  background-image: url("../images/bg.png");
  background-color: #ffffff;
  background-size: 100% auto;
  background-position: top center;
  background-repeat: no-repeat;
  border-radius: 14px 14px 14px 14px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  padding: 44px;
  opacity: 1;
  transition: all 0.4s 0.1s;
}

.msk .user-infnpop .contents {
  text-align: center;
}

.msk .user-infnpop .avatat {
  width: 124px;
  height: 124px;
  position: relative;
  padding-top: 10px;
  left: 220px;
  margin-top: 32px;
  border-radius: 50%;
  border: 1px solid #cadeff;
  padding: 5px;
}

.msk .user-infnpop .avatat img {
  width: 100%;
  height: 100%;
  padding: 5px;
  border-radius: 50%;
  border: 1px solid #789feb;
  display: inline-block;
  top: 0;
}

.msk .user-infnpop .name {
  font-size: 20px;
  color: #040a16;
  line-height: 26px;
  margin-top: 16px;
}

.msk .user-infnpop .desc {
  font-size: 16px;
  color: #858d9e;
  line-height: 21px;
  margin-top: 8px;
}

.msk .user-infnpop .type {
  margin-top: 32px;
}

.msk .user-infnpop .type span {
  display: inline-block;
  height: 30px;
  background: #f1f1f1;
  border-radius: 4px 4px 4px 4px;
  font-size: 16px;
  color: #858d9e;
  line-height: 30px;
  padding: 0 6px;
  margin: 4px 2px;
}

.msk .user-infnpop .entry {
  text-align: center;
  margin-top: 32px;
}

.msk .user-infnpop .entry li {
  display: inline-block;
  margin: 0 40px;
}

.msk .user-infnpop .entry li .text {
  font-size: 14px;
  color: #858d9e;
  line-height: 18px;
}

.msk .user-infnpop .entry li .num {
  font-weight: 700;
  font-size: 24px;
  color: #040a16;
  line-height: 32px;
  margin-top: 8px;
}

.msk .user-infnpop .follow {
  display: inline-block;
  width: 160px;
  height: 48px;
  background: #1e5fdd;
  background: linear-gradient(134deg, #538cfa 0%, #1e5fdd 99%);
  border-radius: 100px 100px 100px 100px;
  font-weight: 700;
  font-size: 14px;
  color: #ffffff;
  text-align: center;
  line-height: 48px;
  margin-top: 44px;
}

.msk .user-infnpop .follow .iconfont {
  font-size: 14px;
  margin-right: 6px;
}

.msk .user-infnpop .grade {
  text-align: center;
  margin-top: 12px;
}

.msk .user-infnpop .grade .box {
  width: 100px;
  height: 24px;
  display: inline-block;
  background-image: url("../images/border.png");
  background-size: cover;
  background-position: center;
  position: relative;
  top: 6px;
}

.msk .user-infnpop .grade .t1 {
  width: 64px;
  font-size: 12px;
  color: #1e5fdd;
  display: inline-block;
  height: 24px;
  border-radius: 6px;
  line-height: 24px;
}

.msk .user-infnpop .grade .lv {
  width: 36px;
  height: 24px;
  line-height: 24px;
  font-size: 12px;
  color: #cb1126;
}

.msk .user-infnpop .imgs {
  display: inline-block;
  margin-left: 12px;
}

.msk .user-infnpop .imgs img {
  max-height: 30px;
  margin: 0 3px;
}

.no-date {
  text-align: center;
  line-height: 60px;
}

.no-date span {
  font-size: 18px;
  color: #0052d9;
}

.msk-mess {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.2);
  left: 0;
  top: 0;
  z-index: 1;
}

.msk-mess.close {
  display: none;
}

.personal-box {
  width: 100%;
  padding-top: 63px;
  padding-bottom: 115px;
  background-image: linear-gradient(180deg, #eff4fe 0%, #f8f8f8 100%);
}

.personal-box .left-box {
  width: 272px;
  background: #ffffff;
  border-radius: 8px 8px 8px 8px;
  padding: 32px 24px 24px;
}

.personal-box .left-box .list {
  height: 56px;
  line-height: 56px;
  border-radius: 8px 8px 8px 8px;
  margin-bottom: 8px;
  padding-left: 18px;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  z-index: 1;
  transition: all 0.4s;
}

.personal-box .left-box .list .iconfont {
  font-size: 16px;
  display: inline-block;
  margin-right: 18px;
  color: #858d9e;
}

.personal-box .left-box .list .text {
  font-size: 16px;
  color: #858d9e;
}

.personal-box .left-box .list::after {
  content: "";
  display: block;
  width: 0;
  height: 100%;
  background: #f0f5ff;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  transition: all 0.36s;
}

.personal-box .left-box .list.active,
.personal-box .left-box .list:hover {
  padding-left: 24px;
}

.personal-box .left-box .list.active::after,
.personal-box .left-box .list:hover::after {
  width: 100%;
}

.personal-box .left-box .list.active .iconfont,
.personal-box .left-box .list:hover .iconfont {
  color: #1e5fdd;
}

.personal-box .left-box .list.active .text,
.personal-box .left-box .list:hover .text {
  color: #1e5fdd;
}

.personal-box .right-box {
  width: calc(100% - 296px);
  position: relative;
  overflow: hidden;
}

.personal-box .right-box .problem-discussion {
  padding: 0;
}

.personal-box .right-box .tv-box {
  width: 100%;
  height: 100%;
  background: #ffffff;
  border-radius: 6px 6px 6px 6px;
  padding: 24px;
  position: absolute;
  right: -110%;
  opacity: 0;
  transition: all 0.4s;
  padding: 32px 60px 180px !important;
}

.personal-box .right-box .tv-box .opics .list .infos .date-box .date {
  position: relative;
  padding-right: 24px;
  margin-left: 24px;
}

.personal-box .right-box .tv-box .opics .list .infos .date-box .date::after {
  content: "";
  display: block;
  width: 1px;
  height: 14px;
  background-color: #d8d8d8;
  position: absolute;
  right: 0px !important;
  left: auto;
  top: 8px;
}

.personal-box .right-box .tv-box .tv-tab {
  margin-bottom: 24px;
}

.personal-box .right-box .tv-box .tv-tab a {
  display: inline-block;
  font-size: 16px;
  margin-right: 36px;
  padding-bottom: 12px;
  position: relative;
  padding-top: 8px;
}

.personal-box .right-box .tv-box .tv-tab a::after {
  content: "";
  display: block;
  width: 0px;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 2px;
  background-color: #1e5fdd;
  transition: all 0.4s;
}

.personal-box .right-box .tv-box .tv-tab a:hover,
.personal-box .right-box .tv-box .tv-tab a.active {
  color: #1e5fdd;
  font-weight: 600;
}

.personal-box .right-box .tv-box .tv-tab a:hover::after,
.personal-box .right-box .tv-box .tv-tab a.active::after {
  width: 100%;
}

.personal-box .right-box .tv-box .tv-tab .search {
  width: 260px;
  height: 42px;
  background: #ffffff;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #e0eaff;
  line-height: 40px;
  padding: 0 16px;
}

.personal-box .right-box .tv-box .tv-tab .search:hover .search-cancel {
  top: 0;
}

.personal-box .right-box .tv-box .tv-tab .search .search-cancel {
  right: 34px;
}

.personal-box .right-box .tv-box .tv-tab .search input {
  width: 202px;
  font-size: 14px;
}

.personal-box .right-box .tv-box .tv-tab .search .iconfont {
  font-size: 18px;
  color: #1e5fdd;
}

.personal-box .right-box .tv-box .tv-tab .search button {
  background-color: transparent;
}

.personal-box .right-box .tv-box.show {
  position: relative;
  right: 0;
  top: 0;
  opacity: 1;
}

.personal-box .right-box .data-form {
  margin-top: 24px;
}

.personal-box .right-box .title .blod {
  font-weight: 700;
  font-size: 22px;
  color: #3d3d3d;
  line-height: 30px;
  position: relative;
  padding-left: 19px;
}

.personal-box .right-box .title .blod::after {
  content: "";
  display: block;
  width: 4px;
  height: 20px;
  background: #1e5fdd;
  position: absolute;
  left: 0;
  top: 5px;
}

.personal-box .right-box .title .logoutacc {
  display: inline-block;
  width: 86px;
  height: 32px;
  background: #f1f1f1;
  border-radius: 100px 100px 100px 100px;
  text-align: center;
  line-height: 32px;
  font-size: 14px;
  color: #858d9e;
  cursor: pointer;
}

.personal-box .right-box .title .logoutacc:hover {
  background: #f0f5ff;
  color: #1e5fdd;
}

.personal-box .right-box .title .asubscribed {
  display: inline-block;
  min-width: 100px;
  height: 32px;
  background: #dd2c2c;
  border-radius: 100px 100px 100px 100px;
  text-align: center;
  line-height: 32px;
  font-size: 14px;
  color: #ffffff;
  padding: 0 22px;
  cursor: pointer;
  margin-right: 12px;
}

.personal-box .right-box .title .asubscribed .iconfont {
  margin-right: 2px;
  font-size: 14px;
}

.personal-box .right-box .title .qsubscribed {
  display: inline-block;
  min-width: 100px;
  height: 32px;
  border: 1px solid #dd2c2c;
  border-radius: 100px 100px 100px 100px;
  text-align: center;
  line-height: 32px;
  font-size: 14px;
  color: #dd2c2c;
  padding: 0 22px;
  cursor: pointer;
  margin-right: 12px;
}

.personal-box .right-box .title .qsubscribed .iconfont {
  margin-right: 2px;
  font-size: 14px;
}

.personal-box .right-box .data-box {
  width: 100%;
}

.personal-box .right-box .data-box .list {
  margin-bottom: 32px;
}

.personal-box .right-box .data-box .list .dropdownsbox {
  width: 366px;
  display: inline-block;
}

.personal-box .right-box .data-box .list .bootstrap-select.btn-group .dropdown-menu .input-block-level {
  display: none;
}

.personal-box .right-box .data-box .list .dropdown {
  background: #f2f3f5;
  margin-bottom: 0;
}

.personal-box .right-box .data-box .list .selectpicker {
  height: 40px;
  font-weight: 400;
  display: block;
  font-size: 14px;
  line-height: 40px;
  background: #f2f3f5;
  color: rgba(0, 0, 0, 0.9);
  overflow: hidden;
  border: none;
  white-space: nowrap;
  border-radius: 4px;
  width: 366px;
  padding: 0;
}

.personal-box .right-box .data-box .list .selectpicker::-webkit-scrollbar {
  width: 6px;
}

.personal-box .right-box .data-box .list input[type="radio"] {
  margin-right: 6px;
}

.personal-box .right-box .data-box .list input[type="text"] {
  width: 366px;
  height: 40px;
  background-color: #f2f3f5;
  padding: 0 12px;
  font-size: 14px;
}

.personal-box .right-box .data-box .list button {
  display: inline-block;
  width: 80px;
  height: 32px;
  font-size: 14px;
  color: #ffffff;
  background: #1e5fdd;
  border-radius: 100px 100px 100px 100px;
}

.personal-box .right-box .data-box .list textarea {
  width: 366px;
  height: 140px;
  font-size: 14px;
  line-height: 24px;
  background: #f2f3f5;
  border-radius: 2px 2px 2px 2px;
  padding: 16px 12px;
}

.personal-box .right-box .data-box .list:last-child {
  margin-bottom: 0;
}

.personal-box .right-box .data-box .avatar {
  display: inline-block;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  position: relative;
}

.personal-box .right-box .data-box .avatar img {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  object-fit: cover;
}

.personal-box .right-box .data-box .avatar .upimg-btn {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #e8f3ff;
  border-radius: 100px 100px 100px 100px;
  border: 2px solid #ffffff;
  position: absolute;
  right: -6px;
  bottom: -8px;
  text-align: center;
  line-height: 24px;
  color: #1e5fdd;
}

.personal-box .right-box .data-box .label {
  display: inline-block;
  width: 248px;
  line-height: 21px;
  font-size: 16px;
  color: #858d9e;
  text-align: right;
  margin-right: 16px;
  position: relative;
}

.personal-box .right-box .data-box .region-select {
  width: calc(100% - 264px);
}

.personal-box .right-box .data-box .label.required::before {
  content: "*";
  font-size: 16px;
  color: #cb1126;
  position: relative;
  left: -4px;
  top: 3px;
}

.personal-box .right-box .contribution {
  background: #ffffff;
  border-radius: 6px 6px 6px 6px;
}

.personal-box .right-box .contribution .card .car-list {
  width: 240px;
  height: 114px;
  line-height: 112px;
  background: #f0f5ff;
  border-radius: 8px;
  border: 1px solid transparent;
  box-shadow: 0px 8px 32px 0px rgba(220, 220, 220, 0.1);
  background-clip: padding-box, border-box;
  background-origin: padding-box, border-box;
  background-image: linear-gradient(180deg, #f0f5ff 0%, #f0f5ff 30px, #f0f5ff 100%), linear-gradient(to bottom, #cee0fd, #ebf2ff);
  text-align: center;
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.personal-box .right-box .contribution .card .car-list .num {
  font-weight: 700;
  font-size: 22px;
  color: #1e5fdd;
  transition: all 0.4s;
}

.personal-box .right-box .contribution .card .car-list .t1 {
  font-size: 16px;
  color: #040a16;
  display: inline-block;
  margin-left: 12px;
  transition: all 0.4s;
}

.personal-box .right-box .contribution .card .car-list:hover {
  box-shadow: 0px 8px 32px 0px rgba(220, 220, 220, 0.2);
}

.personal-box .right-box .contribution .card .car-list:hover .bg {
  transform: scale(1.2);
}

.personal-box .right-box .contribution .card .car-list:nth-child(n + 2) {
  margin-left: 16px;
}

.personal-box .right-box .contribution .card .bg {
  position: absolute;
  right: -34px;
  top: 35px;
  z-index: -1;
  transition: all 0.6s;
}

.personal-box .right-box .contribution .grade {
  margin-top: 26px;
  border-bottom: 1px dashed #b8bfd9;
  padding-bottom: 24px;
}

.personal-box .right-box .contribution .grade .grade-title {
  width: 100px;
  height: 24px;
  display: inline-block;
  background-image: url("../images/border.png");
  background-size: 100% 100%;
  line-height: 22px;
}

.personal-box .right-box .contribution .grade .grade-title .title {
  font-size: 12px;
  color: #1e5fdd;
  width: 65px;
  padding-left: 6px;
}

.personal-box .right-box .contribution .grade .grade-title .num {
  text-align: center;
  font-size: 12px;
  color: #cb1126;
  width: 30px;
}

.personal-box .right-box .contribution .grade .grade-imgs {
  display: inline-block;
  margin-left: 16px;
}

.personal-box .right-box .contribution .grade .grade-imgs img {
  max-height: 30px;
}

.personal-box .right-box .contribution .value-box {
  height: 540px;
  overflow-y: scroll;
}

.personal-box .right-box .contribution .value-box .t1 {
  font-weight: 700;
  font-size: 20px;
  color: #3d3d3d;
  line-height: 26px;
  padding: 24px 0;
}

.personal-box .right-box .contribution .value-box .head {
  margin-bottom: 18px;
  font-size: 16px;
  color: #040a16;
}

.personal-box .right-box .contribution .value-box .head span {
  display: inline-block;
  font-size: 16px;
  color: #040a16;
}

.personal-box .right-box .contribution .value-box .head span:nth-child(1) {
  width: calc(100% - 400px);
  position: relative;
  top: 4px;
}

.personal-box .right-box .contribution .value-box .head span:nth-child(2) {
  width: 160px;
  text-align: center;
}

.personal-box .right-box .contribution .value-box .head span:nth-child(3) {
  width: 180px;
  text-align: right;
}

.personal-box .right-box .contribution .value-box .bodys .li {
  font-size: 16px;
  color: #858d9e;
  margin-bottom: 18px;
}

.personal-box .right-box .contribution .value-box .bodys .li span:nth-child(1) {
  width: calc(100% - 400px);
  position: relative;
  top: 5px;
}

.personal-box .right-box .contribution .value-box .bodys .li span:nth-child(2) {
  width: 160px;
  text-align: center;
}

.personal-box .right-box .contribution .value-box .bodys .li span:nth-child(3) {
  width: 180px;
  font-size: 16px;
  color: #cb1126;
  text-align: right;
}

.personal-box .right-box .contribution .value-box .bodys span {
  font-size: 16px;
  color: #858d9e;
}

.personal-box .right-box .contribution .value-box::-webkit-scrollbar {
  display: none;
}

.personal-box .right-box .account-box.tv-box {
  padding: 60px 24px !important;
}

.personal-box .right-box .account-box.tv-box label {
  display: block;
  margin-bottom: 24px;
}

.personal-box .right-box .account-box.tv-box label .eay_btn {
  position: absolute;
  right: 16px;
  top: 0;
  line-height: 46px;
}

.personal-box .right-box .account-box.tv-box label .t1 {
  display: inline-block;
  width: 166px;
  text-align: right;
  font-size: 16px;
  color: #858d9e;
}

.personal-box .right-box .account-box.tv-box label input {
  width: 400px;
  height: 46px;
  border-radius: 2px;
  background-color: #f2f3f5;
  padding-left: 16px;
  border-radius: 4px;
}

.personal-box .right-box .account-box.tv-box label input::placeholder {
  font-size: 14px;
}

.personal-box .right-box .account-box.tv-box button {
  padding: 12px 28px;
  border-radius: 4px;
  margin-left: 166px;
  background: #1e5fdd;
  color: #1e5fdd;
  color: #ffffff;
  font-size: 14px;
  margin-top: 16px;
}

.personal-box .right-box .collection-box {
  padding: 60px;
  min-height: 568px;
}

.personal-box .right-box .collection-box .content-box.show {
  position: relative;
  right: 0;
}

.personal-box .right-box .collection-box .content-box {
  position: absolute;
  right: 120%;
  top: 0;
}

.personal-box .right-box .collection-box .content-box .essence-box {
  right: 6px;
  top: 6px;
}

.personal-box .right-box .collection-box .communitys .list {
  width: 100%;
  margin-bottom: 21px;
  padding-bottom: 21px;
  position: relative;
  transition: all 0.4s;
}

.personal-box .right-box .collection-box .communitys .list .avatar {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  object-fit: cover;
}

.personal-box .right-box .collection-box .communitys .list .t1 {
  font-weight: 700;
  font-size: 18px;
  color: #040a16;
  line-height: 24px;
  margin-top: 12px;
}

.personal-box .right-box .collection-box .communitys .list .desc {
  font-weight: 400;
  font-size: 14px;
  color: #858d9e;
  line-height: 24px;
  margin-top: 8px;
}

.personal-box .right-box .collection-box .communitys .list .imgs {
  margin-top: 16px;
}

.personal-box .right-box .collection-box .communitys .list .imgs img {
  width: 138px;
  height: 138px;
  border-radius: 4px 4px 4px 4px;
  object-fit: cover;
}

.personal-box .right-box .collection-box .communitys .list .infos {
  margin-top: 16px;
}

.personal-box .right-box .collection-box .communitys .list .infos .top4 {
  position: relative;
  top: 4px;
}

.personal-box .right-box .collection-box .communitys .list .infos .types {
  margin-left: 18px;
}

.personal-box .right-box .collection-box .communitys .list .infos .iconfont {
  font-size: 18px;
  color: #b3b6be;
  margin-right: 6px;
}

.personal-box .right-box .collection-box .communitys .list .infos .text {
  font-weight: 400;
  font-size: 14px;
  color: #858d9e;
  line-height: 18px;
  margin-right: 16px;
}

.personal-box .right-box .collection-box .communitys .list .infos .date {
  font-size: 14px;
  color: #858d9e;
  line-height: 24px;
  margin-left: 16px;
}

.personal-box .right-box .collection-box .communitys .list .name {
  font-weight: 400;
  font-size: 14px;
  color: #858d9e;
  line-height: 24px;
  display: inline-block;
  position: relative;
  margin-left: 6px;
}

.personal-box .right-box .collection-box .communitys .list .answer {
  display: block;
  width: 117px;
  height: 32px;
  line-height: 28px;
  font-size: 14px;
  color: #858d9e;
  text-align: center;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #dbdcde;
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.personal-box .right-box .collection-box .communitys .list .answer::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-color: #538cfa;
  background: linear-gradient(134deg, #538cfa 0%, #1e5fdd 99%);
  position: absolute;
  right: 100%;
  top: 0;
  transition: all 0.36s;
  z-index: -1;
}

.personal-box .right-box .collection-box .communitys .list .answer:hover {
  color: #ffffff;
  -webkit-box-shadow: 0 15px 30px rgba(30, 95, 221, 0.1);
  box-shadow: 0 15px 30px rgba(30, 95, 221, 0.1);
}

.personal-box .right-box .collection-box .communitys .list .answer:hover::after {
  right: 0;
}

.personal-box .right-box .collection-box .communitys .list .answer .iconfont {
  margin-right: 8px;
  line-height: 30px;
}

.personal-box .right-box .collection-box .communitys .list::after {
  content: "";
  display: block;
  width: 0;
  height: 1px;
  background-color: #1e5fdd;
  position: absolute;
  left: 0;
  bottom: 0;
  transition: all 0.46s;
}

.personal-box .right-box .collection-box .communitys .list:hover::after {
  width: 100%;
}

.personal-box .right-box .collection-box .communitys .list:hover .t1 {
  color: #1e5fdd;
}

.personal-box .right-box .collection-box .communitys .list:hover .answer {
  color: #1e5fdd;
  background-color: #f0f5ff;
  border: 1px solid #f0f5ff;
}

.personal-box .right-box .collection-box .communitys .list:hover .answer .iconfont {
  color: #1e5fdd;
}

.personal-box .right-box .collection-box .articles .list {
  width: calc(50% - 30px);
  height: 354px;
  border-radius: 6px;
  border: 1px solid #d8d8d8;
  overflow: hidden;
  margin-bottom: 33px;
}

.personal-box .right-box .collection-box .articles .list .img-box {
  height: 200px;
  width: 100%;
  position: relative;
  overflow: hidden;
}

.personal-box .right-box .collection-box .articles .list .img-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.6s;
  top: 0;
}

.personal-box .right-box .collection-box .articles .list .img-box .infos {
  width: 100%;
  height: 48px;
  line-height: 32px;
  padding: 8px 24px;
  background-color: rgba(0, 0, 0, 0.34);
  position: absolute;
  left: 0;
  bottom: 0;
  color: #ffffff;
}

.personal-box .right-box .collection-box .articles .list .img-box .infos .address {
  width: calc(100% - 102px);
}

.personal-box .right-box .collection-box .articles .list .img-box .infos .address span:nth-child(2) {
  width: calc(100% - 30px);
  display: inline-block;
  width: calc(100% - 24px) !important;
  line-height: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  position: relative;
  top: 2px;
}

.personal-box .right-box .collection-box .articles .list .img-box .infos .signup {
  display: inline-block;
  height: 32px;
  font-size: 14px;
  background: #e0eaff;
  border-radius: 100px 100px 100px 100px;
  padding: 0 12px;
  color: #1e5fdd;
}

.personal-box .right-box .collection-box .articles .list .img-box .infos .signstart {
  display: inline-block;
  height: 32px;
  font-size: 14px;
  background: #faeff1;
  border-radius: 100px 100px 100px 100px;
  padding: 0 12px;
  color: #cb1126;
}

.personal-box .right-box .collection-box .articles .list .img-box .infos .signend {
  display: inline-block;
  height: 32px;
  font-size: 14px;
  background: #ffffff;
  border-radius: 100px 100px 100px 100px;
  padding: 0 12px;
  color: #6d7177;
}

.personal-box .right-box .collection-box .articles .list .text-box {
  padding: 24px 24px 16px;
}

.personal-box .right-box .collection-box .articles .list .text-box .title {
  font-weight: 700;
  font-size: 20px;
  color: #3d3d3d;
  line-height: 26px;
  transition: 0.36s;
}

.personal-box .right-box .collection-box .articles .list .text-box .desc {
  font-size: 16px;
  color: #858d9e;
  min-height: 22px;
  line-height: 22px;
  margin-top: 16px;
}

.personal-box .right-box .collection-box .articles .list .text-box .quxiao {
  display: inline-block;
  height: 32px;
  border-radius: 40px;
  background: #b7251e;
  padding: 0 16px;
  text-align: center;
  line-height: 32px;
  color: #ffffff;
  margin-top: 16px;
  float: right;
}

.personal-box .right-box .collection-box .articles .list .text-box .date {
  font-size: 16px;
  color: #858d9e;
  line-height: 22px;
  margin-top: 16px;
}

.personal-box .right-box .collection-box .articles .list .text-box .date .right {
  max-width: calc(100% - 152px);
  font-size: 14px;
  color: #1a1a1a;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: end;
}

.personal-box .right-box .collection-box .articles .list .text-box .date .right .iconfont {
  color: #1e5fdd;
  font-size: 16px;
}

.personal-box .right-box .collection-box .articles .list:nth-child(2n) {
  margin-left: 60px;
}

.personal-box .right-box .collection-box .articles .list:hover .img-box img {
  transform: scale(1.1);
}

.personal-box .right-box .collection-box .articles .list:hover .text-box .title {
  color: #1e5fdd;
}

.personal-box .right-box .collection-box .opics .list {
  display: block;
  padding: 42px 0;
  border-bottom: 1px dashed #b8bfd9;
  position: relative;
}

.personal-box .right-box .collection-box .opics .list .title {
  font-weight: 700;
  font-size: 20px;
  color: #3d3d3d;
  line-height: 26px;
}

.personal-box .right-box .collection-box .opics .list .title .icon-imgs {
  width: 26px;
  top: -4px;
}

.personal-box .right-box .collection-box .opics .list .desc {
  font-size: 16px;
  color: #858d9e;
  line-height: 24px;
  margin-top: 8px;
}

.personal-box .right-box .collection-box .opics .list .infos {
  margin-top: 16px;
}

.personal-box .right-box .collection-box .opics .list .infos .avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
}

.personal-box .right-box .collection-box .opics .list .infos .name {
  font-size: 16px;
  color: #040a16;
  line-height: 24px;
  margin-left: 8px;
}

.personal-box .right-box .collection-box .opics .list .infos .type {
  display: inline-block;
  padding-left: 20px;
  position: relative;
  margin-left: 24px;
  min-height: 20px;
}

.personal-box .right-box .collection-box .opics .list .infos .type span {
  height: 30px;
  line-height: 30px;
  background: #f1f1f1;
  border-radius: 4px;
  color: #858d9e;
  padding: 0 6px;
  margin-left: 5px;
}

.personal-box .right-box .collection-box .opics .list .infos .type::after {
  content: "";
  display: block;
  width: 1px;
  height: 18px;
  background-color: #d8d8d8;
  position: absolute;
  left: 0;
  top: 5px;
}

.personal-box .right-box .collection-box .opics .list .date-box {
  font-size: 16px;
  color: #858d9e;
  line-height: 30px;
}

.personal-box .right-box .collection-box .opics .list .date-box .iconfont {
  margin-right: 6px;
}

.personal-box .right-box .collection-box .opics .list .date-box .date {
  position: relative;
  padding-left: 24px;
  margin-left: 24px;
}

.personal-box .right-box .collection-box .opics .list .date-box .date::after {
  content: "";
  display: block;
  width: 1px;
  height: 14px;
  background-color: #d8d8d8;
  position: absolute;
  left: 0;
  top: 8px;
}

.personal-box .right-box .collection-box .opics .list:last-child {
  border-bottom: none;
  padding: 24px 0 0;
}

.personal-box .right-box .collection-box .opics .list::after {
  content: "";
  display: block;
  width: 0;
  height: 1px;
  background-color: #1e5fdd;
  position: absolute;
  left: 0;
  bottom: -1px;
  transition: all 0.36s;
}

.personal-box .right-box .collection-box .opics .list:last-child::after {
  height: 0px;
}

.personal-box .right-box .collection-box .opics .list:hover .title {
  color: #1e5fdd;
}

.personal-box .right-box .collection-box .opics .list:hover::after {
  width: 100%;
}

.personal-box .right-box .community-center {
  padding: 0 24px 24px;
}

.personal-box .right-box .discussion-box .problem-discussion {
  padding-top: 0;
}

.personal-box .right-box .discussion-box .problem-discussion .list {
  margin-bottom: 24px;
}

.hot-topic-box {
  padding-top: 80px;
  padding-bottom: 140px;
  background: #f8f8f8;
  background: linear-gradient(to bottom, #f0f3fe, #f8f8f8 550px);
}

.hot-topic-box .hottopic-tab a {
  display: inline-block;
  line-height: 46px;
  height: 46px;
  padding: 0 32px;
  background-color: #ffffff;
  border-radius: 100px 100px 100px 100px;
  margin-right: 12px;
  margin-bottom: 12px;
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.hot-topic-box .hottopic-tab a .iconfont {
  color: #cb1126;
  font-size: 18px;
  transition: all 0.2s;
}

.hot-topic-box .hottopic-tab a .text {
  font-weight: 700;
  font-size: 16px;
  color: #040a16;
  transition: all 0.2s;
}

.hot-topic-box .hottopic-tab a:last-child {
  margin-right: 0;
}

.hot-topic-box .hottopic-tab a:hover {
  background: #cb1126;
  background: linear-gradient(117deg, #ed5263 0%, #cb1126 100%);
}

.hot-topic-box .hottopic-tab a:hover .iconfont {
  color: #ffffff;
}

.hot-topic-box .hottopic-tab a:hover .text {
  color: #ffffff;
}

.hot-topic-box .hottopic-tab a.active {
  background: #ed5263;
  background: linear-gradient(117deg, #ed5263 0%, #cb1126 100%);
}

.hot-topic-box .hottopic-tab a.active .iconfont {
  color: #ffffff;
}

.hot-topic-box .hottopic-tab a.active .text {
  color: #ffffff;
}

.hot-topic-box .hottopic-content {
  width: 100%;
}

.hot-topic-box .hottopic-content .titles {
  color: #3d3d3d;
  position: relative;
  padding-left: 19px;
}

.hot-topic-box .hottopic-content .titles .blod {
  font-weight: 700;
  font-size: 22px;
}

.hot-topic-box .hottopic-content .titles::after {
  content: "";
  display: block;
  width: 4px;
  height: 20px;
  background: #1e5fdd;
  border-radius: 0px 0px 0px 0px;
  position: absolute;
  left: 0;
  top: 5px;
}

.hot-topic-box .hottopic-content .aihost-box {
  margin-top: 20px;
  position: relative;
}

.hot-topic-box .hottopic-content .ai {
  position: absolute;
  left: 0;
  top: 0;
  width: calc(100% - 354px);
  height: 100%;
  background-color: #ffffff;
  padding: 24px;
  border-radius: 6px 6px 6px 6px;
}

.hot-topic-box .hottopic-content .ai .box {
  margin-top: 24px;
  max-height: calc(100% - 45px);
  overflow: hidden;
  overflow-y: scroll;
}

.hot-topic-box .hottopic-content .ai .box::-webkit-scrollbar {
  width: 0;
}

.hot-topic-box .hottopic-content .ai .box p {
  font-size: 14px;
  color: #4f535c;
  line-height: 24px;
}

.hot-topic-box .hottopic-content .hostperson {
  width: 330px;
}

.hot-topic-box .hottopic-content .hostperson .swiper-button-prev,
.hot-topic-box .hottopic-content .hostperson .swiper-button-next {
  display: inline-block;
  width: 22px;
  height: 22px;
  border-radius: 2px;
  border: 1px solid #ededed;
  cursor: pointer;
  position: relative;
  top: 4px;
  margin-left: 6px;
}

.hot-topic-box .hottopic-content .hostperson .swiper-button-prev span,
.hot-topic-box .hottopic-content .hostperson .swiper-button-next span {
  line-height: 20px;
  text-align: center;
  display: block;
  font-size: 14px;
  color: #0000ee;
}

.hot-topic-box .hottopic-content .special-issue {
  background-color: #ffffff;
  padding: 24px;
  margin-top: 24px;
  border-radius: 6px 6px 6px 6px;
}

.hot-topic-box .hottopic-content .special-issue .titles a.b1 {
  display: inline-block;
  font-size: 14px;
  color: #cb1126;
  text-align: center;
  width: 72px;
  height: 32px;
  line-height: 32px;
  background: #faeff1;
  border-radius: 100px 100px 100px 100px;
}

.hot-topic-box .hottopic-content .special-issue .titles a.y1 {
  display: inline-block;
  font-size: 14px;
  color: #ffffff;
  text-align: center;
  line-height: 32px;
  width: 64px;
  height: 32px;
  background: #cb1126;
  border-radius: 100px 100px 100px 100px;
  margin-left: 14px;
}

.hot-topic-box .hottopic-content .special-issue .top-box {
  margin-top: 24px;
}

.hot-topic-box .hottopic-content .special-issue .top-box .l-img {
  width: 204px;
  height: 255px;
  object-fit: cover;
}

.hot-topic-box .hottopic-content .special-issue .top-box .text {
  width: calc(100% - 204px);
  padding-left: 24px;
  font-size: 14px;
  color: #4f535c;
  line-height: 28px;
  max-height: 260px;
  overflow-y: scroll;
}

.hot-topic-box .hottopic-content .special-issue .top-box .text .tit {
  font-size: 26px;
  margin-bottom: 16px;
  font-weight: bold;
}

.hot-topic-box .hottopic-content .special-issue .top-box .text img {
  max-width: 100%;
}

.hot-topic-box .hottopic-content .special-issue .top-box .text video {
  max-width: 100%;
}

.hot-topic-box .hottopic-content .special-issue .top-box .text::-webkit-scrollbar {
  width: 6px;
}

.hot-topic-box .hottopic-content .special-issue .top-box .text::-webkit-scrollbar-thumb {
  background: #f2f2f2;
  border-radius: 8px;
}

.hot-topic-box .hottopic-content .expert-lineup {
  width: 100%;
  height: 310px;
  margin-top: 24px;
}

.hot-topic-box .hottopic-content .expert-lineup .t1 {
  font-weight: 700;
  font-size: 18px;
  color: #3d3d3d;
  line-height: 24px;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper {
  margin-top: 24px;
  height: 410px;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .expert-msk {
  width: 349px;
  height: 262px;
  overflow-y: scroll;
  background: #ffffff;
  box-shadow: 0px 8px 32px 0px rgba(220, 220, 220, 0.44);
  border-radius: 6px 6px 6px 6px;
  position: absolute;
  top: 420px;
  visibility: hidden;
  left: 50%;
  margin-left: -174.5px;
  z-index: 666;
  transition: all 0.46s;
  padding: 16px;
  z-index: 6666;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .expert-msk .names,
.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .expert-msk .position {
  font-size: 16px;
  color: #040a16;
  line-height: 21px;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .expert-msk .position {
  margin-top: 6px;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .expert-msk .type {
  margin-top: 16px;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .expert-msk .type span {
  display: inline-block;
  height: 30px;
  background: #f1f1f1;
  border-radius: 4px 4px 4px 4px;
  font-size: 16px;
  color: #858d9e;
  line-height: 30px;
  padding: 0 6px;
  margin-right: 5px;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .expert-msk .desc {
  font-size: 14px;
  color: #858d9e;
  line-height: 24px;
  margin-top: 16px;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .expert-msk::-webkit-scrollbar {
  width: 4px;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .expert-msk::-webkit-scrollbar-thumb {
  background: #f2f2f2;
  border-radius: 8px;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .swiper-wrapper {
  height: 230px !important;
  position: relative;
  z-index: 6;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .swiper-wrapper .swiper-slide {
  position: relative;
  cursor: pointer;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .swiper-button-prev,
.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .swiper-button-next {
  display: inline-block;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background-color: #ffffff;
  background: #ffffff;
  border: 1px solid #b3b6be;
  position: absolute;
  text-align: center;
  line-height: 20px;
  bottom: 154px;
  cursor: pointer;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .swiper-button-prev .iconfont,
.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .swiper-button-next .iconfont {
  font-size: 14px;
  color: #b3b6be;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .swiper-button-prev:hover,
.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .swiper-button-next:hover {
  border: 1px solid #1e5fdd;
  background-color: #1e5fdd;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .swiper-button-prev:hover .iconfont,
.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .swiper-button-next:hover .iconfont {
  color: #ffffff;
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .swiper-button-prev {
  left: calc(50% - 26px);
}

.hot-topic-box .hottopic-content .expert-lineup .expert-swiper .swiper-button-next {
  right: calc(50% - 26px);
}

.hot-topic-box .hottopic-content .expert-lineup .swiper-slide .lineup-box:hover .avatar img {
  padding: 0;
}

.hot-topic-box .hottopic-content .expert-lineup .swiper-slide .lineup-box:hover .name {
  color: #1e5fdd;
}

.hot-topic-box .hottopic-content .expert-lineup .swiper-slide .lineup-box:hover .expert-msk {
  visibility: visible;
  top: 144px;
}

.hot-topic-box .hottopic-content .expert-lineup .swiper-slide {
  height: 230px !important;
}

.hot-topic-box .hottopic-content .expert-lineup .lineup-box {
  width: 100%;
}

.hot-topic-box .hottopic-content .expert-lineup .lineup-box .avatar {
  display: inline-block;
  width: 144px;
  height: 144px;
  border-radius: 50%;
  border: 1px solid #f2f3f4;
  padding: 5px;
}

.hot-topic-box .hottopic-content .expert-lineup .lineup-box .avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  padding: 5px;
  border-radius: 50%;
  border: 1px solid #d8dae0;
  transition: all 0.46s;
}

.hot-topic-box .hottopic-content .expert-lineup .lineup-box .name {
  width: 144px;
  font-size: 16px;
  color: #3d3d3d;
  line-height: 21px;
  margin-top: 16px;
  text-align: center;
}

.hot-topic-box .hottopic-content .expert-lineup .lineup-box .lineup-msk {
  width: 349px;
  height: 262px;
  background: #ffffff;
  box-shadow: 0px 8px 32px 0px rgba(220, 220, 220, 0.44);
  border-radius: 6px 6px 6px 6px;
}

.hot-topic-box .articles {
  margin-top: 32px;
}

.hot-topic-box .articles a.more {
  display: inline-block;
  width: 66px;
  font-size: 16px;
  color: #a6adb8;
}

.hot-topic-box .articles a.more .iconfont {
  margin-left: 4px;
  transition: all 0.46s;
}

.hot-topic-box .articles a.more:hover {
  color: #1e5fdd;
}

.hot-topic-box .articles a.more:hover .iconfont {
  margin-left: 0;
}

.hot-topic-box .articles .box {
  margin-top: 24px;
}

.hot-topic-box .articles .list {
  width: calc(33.33% - 17.33px);
  height: 352px;
  border-radius: 6px;
  border: 1px solid #d8d8d8;
  overflow: hidden;
  margin-bottom: 16px;
}

.hot-topic-box .articles .list .img-box {
  height: 200px;
  width: 100%;
  position: relative;
  overflow: hidden;
}

.hot-topic-box .articles .list .img-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.6s;
  top: 0;
}

.hot-topic-box .articles .list .img-box .infos {
  width: 100%;
  height: 48px;
  line-height: 32px;
  padding: 8px 24px;
  background-color: rgba(0, 0, 0, 0.34);
  position: absolute;
  left: 0;
  bottom: 0;
  color: #ffffff;
}

.hot-topic-box .articles .list .img-box .infos .address {
  width: calc(100% - 110px);
}

.hot-topic-box .articles .list .img-box .infos .address span:nth-child(2) {
  width: calc(100% - 24px);
  display: inline-block;
  line-height: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  position: relative;
  top: 2px;
}

.hot-topic-box .articles .list .img-box .infos .signup {
  display: inline-block;
  height: 32px;
  font-size: 14px;
  background: #e0eaff;
  border-radius: 100px 100px 100px 100px;
  padding: 0 12px;
  color: #1e5fdd;
}

.hot-topic-box .articles .list .img-box .infos .signend {
  display: inline-block;
  height: 32px;
  font-size: 14px;
  background: #ffffff;
  border-radius: 100px 100px 100px 100px;
  padding: 0 12px;
  color: #6d7177;
}

.hot-topic-box .articles .list .img-box .infos .signstart {
  display: inline-block;
  height: 32px;
  font-size: 14px;
  background: #faeff1;
  border-radius: 100px 100px 100px 100px;
  padding: 0 12px;
  color: #cb1126;
}

.hot-topic-box .articles .list .text-box {
  padding: 24px;
}

.hot-topic-box .articles .list .text-box .title {
  font-weight: 700;
  font-size: 20px;
  color: #3d3d3d;
  line-height: 26px;
  transition: 0.36s;
}

.hot-topic-box .articles .list .text-box .desc {
  font-size: 16px;
  color: #858d9e;
  line-height: 22px;
  margin-top: 16px;
  min-height: 22px;
}

.hot-topic-box .articles .list .text-box .date {
  font-size: 16px;
  color: #858d9e;
  line-height: 22px;
  margin-top: 16px;
}

.hot-topic-box .articles .list:nth-child(3n - 1) {
  margin-left: 26px;
}

.hot-topic-box .articles .list:nth-child(3n) {
  margin-left: 26px;
}

.hot-topic-box .articles .list:hover .img-box img {
  transform: scale(1.1);
}

.hot-topic-box .articles .list:hover .text-box .title {
  color: #1e5fdd;
}

.hot-topic-box .topic {
  margin-top: 16px;
}

.hot-topic-box .topic a.w1 {
  display: inline-block;
  width: 104px;
  height: 30px;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #1e5fdd;
  line-height: 28px;
  text-align: center;
  font-size: 14px;
  color: #1e5fdd;
}

.hot-topic-box .topic a.w1 .iconfont {
  font-size: 14px;
}

.hot-topic-box .topic a.more {
  display: inline-block;
  width: 66px;
  font-size: 16px;
  color: #a6adb8;
  margin-left: 24px;
}

.hot-topic-box .topic a.more .iconfont {
  margin-left: 4px;
  transition: all 0.46s;
}

.hot-topic-box .topic a.more:hover {
  color: #1e5fdd;
}

.hot-topic-box .topic a.more:hover .iconfont {
  margin-left: 0;
}

.hot-topic-box .topic .hottopic-box {
  background-color: #ffffff;
  padding: 0 24px 24px;
  border-radius: 6px 6px 6px 6px;
  margin-top: 22px;
}

.hot-topic-box .topic .hottopic-box .list {
  padding: 32px 0;
}

.hot-topic-box .topic .hottopic-box .list .icon-imgs {
  width: 26px;
}

.hot-topic-box .topic .hottopic-box .list:last-child {
  padding: 24px 0;
}

.topic-articles {
  background-color: #f8f8f8;
  padding-top: 40px;
  padding-bottom: 140px;
}

.topic-articles .topic-host-btn-box button {
  margin-left: 12px;
  min-width: 80px;
  text-align: center;
}

.topic-articles .topic-host-btn-box .topic-host-essence,
.topic-articles .topic-host-btn-box .topic-host-audit,
.topic-articles .topic-host-btn-box .topic-host-top,
.topic-articles .topic-host-btn-box .topic-host-del {
  height: 40px;
  line-height: 40px;
  font-size: 16px;
  color: #040a16;
  background: #f6f6f6;
  padding: 0 16px;
  border-radius: 100px 100px 100px 100px;
}

.topic-articles .topic-host-btn-box .topic-host-essence.active,
.topic-articles .topic-host-btn-box .topic-host-audit.active,
.topic-articles .topic-host-btn-box .topic-host-top.active,
.topic-articles .topic-host-btn-box .topic-host-del.active {
  color: #eb6e06;
  background: #fff4e2;
}

.topic-articles .topic-host-btn-box .topic-host-audit {
  background: #f0f5ff;
  color: #1e5fdd;
  transition: all 0.36s;
}

.topic-articles .topic-host-btn-box .topic-host-audit:hover {
  background: #1e5fdd;
  color: #ffffff;
}

.topic-articles .topic-host-btn-box .topic-host-essence {
  transition: all 0.36s;
}

.topic-articles .topic-host-btn-box .topic-host-essence.active:hover {
  background-color: #eb6e06;
  color: #fff;
}

.topic-articles .topic-host-btn-box .topic-host-top {
  padding: 0 24px;
  transition: all 0.36s;
}

.topic-articles .topic-host-btn-box .topic-host-top.active {
  background: #f0f5ff;
  color: #1e5fdd;
}

.topic-articles .topic-host-btn-box .topic-host-top.active:hover {
  background: #1e5fdd;
  color: #ffffff;
}

.topic-articles .search {
  margin-top: 32px;
}

.topic-articles .search form {
  display: inline-block;
  width: 640px;
  height: 64px;
  line-height: 62px;
  background: #ffffff;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #e0eaff;
  padding: 0 32px;
  position: relative;
}

.topic-articles .search form .iconfont {
  font-size: 20px;
  color: #1e5fdd;
}

.topic-articles .search form input {
  width: 490px;
}

.topic-articles .search form button {
  color: #1e5fdd;
  border: none;
  background-color: transparent;
}

.topic-articles .search form:hover .search-cancel {
  top: 2px;
}

.topic-articles .search a.f1 {
  width: 114px;
  height: 40px;
  display: inline-block;
  text-align: center;
  line-height: 38px;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #1e5fdd;
  font-size: 14px;
  color: #1e5fdd;
  margin-top: 12px;
}

.topic-articles .search a.f1 .iconfont {
  font-size: 14px;
  margin-right: 6px;
}

.topic-articles .screen {
  height: 70px;
  background: #ffffff;
  border-radius: 6px 6px 6px 6px;
  margin-top: 24px;
  padding: 0 24px;
}

.topic-articles .screen .f-l .metro {
  width: 360px;
}

.topic-articles .screen .f-l .metro .selected {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 27px 26px 27px 12px;
}

.topic-articles .screen .f-l .metro .carat:after {
  margin-top: -6px;
}

.topic-articles .screen .f-l .metro .carat {
  top: 50%;
}

.topic-articles .screen .f-l .dropdown {
  margin-top: 17px;
}

.topic-articles .screen .f-r {
  line-height: 70px;
}

.topic-articles .screen .f-r input[type="radio"] {
  display: none;
}

.topic-articles .screen .f-r .square-radio {
  width: 16px;
  height: 16px;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 3px 3px 3px 3px;
  border: 1px solid #dbdcde;
  margin-right: 8px;
}

.topic-articles .screen .f-r .active {
  color: #1e5fdd;
}

.topic-articles .screen .f-r .active .square-radio {
  border: 1px solid #1e5fdd;
  background-color: #1e5fdd;
  line-height: 14px;
  text-align: center;
}

.topic-articles .screen .f-r .square-radio::before {
  content: "\e7c8";
  color: #ffffff;
  font-size: 12px;
  font-weight: bold;
  font-family: "iconfont";
  opacity: 0;
}

.topic-articles .screen .f-r .active .square-radio::before {
  opacity: 1;
}

.topic-articles .screen .f-r label {
  font-weight: 400;
  font-size: 14px;
  color: #040a16;
  line-height: 16px;
  margin-right: 32px;
}

.topic-articles .screen .f-r label:hover {
  color: #1e5fdd;
}

.topic-articles .screen .f-r input {
  width: 16px;
  height: 16px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 3px 3px 3px 3px;
  border: 1px solid #dbdcde;
  margin-right: 8px;
  position: relative;
  top: 2px;
}

.topic-articles .topic {
  background-color: #ffff;
  padding: 0 24px;
  margin-top: 24px;
}

.topic-articles .topic .hottopic-box .icon-imgs {
  width: 26px;
  top: -4px;
}

.topic-articles .topic .hottopic-box .list {
  padding: 24px 0;
}

.topic-articles .topic .hottopic-box .list:last-child {
  padding: 24px 0;
}

.topic-articles .paging {
  margin-top: 80px;
}

.topic-articles .screen-select {
  border: none;
  height: 40px;
  outline: none;
}

.topic-articles .card-topic {
  margin-top: 32px;
}

.topic-articles .card-topic .left-content {
  margin-top: 26px;
}

.topic-articles .card-topic .titles {
  font-weight: 700;
  font-size: 22px;
  color: #3d3d3d;
  line-height: 29px;
}

.topic-articles .card-topic .list {
  width: calc(33.33% - 17.33px);
  height: 352px;
  border-radius: 6px;
  border: 1px solid #d8d8d8;
  overflow: hidden;
  margin-bottom: 24px;
}

.topic-articles .card-topic .list .img-box {
  height: 200px;
  width: 100%;
  position: relative;
  overflow: hidden;
}

.topic-articles .card-topic .list .img-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.6s;
  top: 0;
}

.topic-articles .card-topic .list .img-box .infos {
  width: 100%;
  height: 48px;
  line-height: 32px;
  padding: 8px 24px;
  background-color: rgba(0, 0, 0, 0.34);
  position: absolute;
  left: 0;
  bottom: 0;
  color: #ffffff;
}

.topic-articles .card-topic .list .img-box .infos .address span:nth-child(2) {
  display: inline-block;
  width: calc(100% - 24px) !important;
  line-height: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  position: relative;
  top: 2px;
}

.topic-articles .card-topic .list .img-box .infos .signup {
  display: inline-block;
  height: 32px;
  font-size: 14px;
  background: #e0eaff;
  border-radius: 100px 100px 100px 100px;
  padding: 0 12px;
  color: #1e5fdd;
}

.topic-articles .card-topic .list .img-box .infos .signend {
  display: inline-block;
  height: 32px;
  font-size: 14px;
  background: #ffffff;
  border-radius: 100px 100px 100px 100px;
  padding: 0 12px;
  color: #6d7177;
}

.topic-articles .card-topic .list .img-box .infos .signstart {
  display: inline-block;
  height: 32px;
  font-size: 14px;
  background: #faeff1;
  border-radius: 100px 100px 100px 100px;
  padding: 0 12px;
  color: #cb1126;
}

.topic-articles .card-topic .list .text-box {
  padding: 24px;
}

.topic-articles .card-topic .list .text-box .title {
  font-weight: 700;
  font-size: 20px;
  color: #3d3d3d;
  line-height: 26px;
  transition: 0.36s;
}

.topic-articles .card-topic .list .text-box .desc {
  font-size: 16px;
  color: #858d9e;
  line-height: 22px;
  margin-top: 16px;
}

.topic-articles .card-topic .list .text-box .date {
  font-size: 16px;
  color: #858d9e;
  line-height: 22px;
  margin-top: 16px;
}

.topic-articles .card-topic .list:nth-child(3n),
.topic-articles .card-topic .list:nth-child(3n - 1) {
  margin-left: 26px;
}

.topic-articles .card-topic .list:hover .img-box img {
  transform: scale(1.1);
}

.topic-articles .card-topic .list:hover .text-box .title {
  color: #1e5fdd;
}

.hostbanzhu,
.toipthostbanzhu {
  background-color: #f8f8f8;
  padding-top: 40px;
  padding-bottom: 140px;
}

.hostbanzhu .topic-articles,
.toipthostbanzhu .topic-articles {
  padding-top: 0;
  margin-top: 30px;
}

.hostbanzhu .topic-articles .topic,
.toipthostbanzhu .topic-articles .topic {
  margin-top: 0;
}

.hostbanzhu .search-tab,
.toipthostbanzhu .search-tab {
  padding-top: 40px;
  padding-bottom: 19px;
}

.hostbanzhu .search-tab .filter-btn,
.toipthostbanzhu .search-tab .filter-btn {
  font-size: 16px;
  color: #999999;
  line-height: 21px;
  margin-right: 36px;
  position: relative;
  transition: all 0.36s;
}

.hostbanzhu .search-tab .filter-btn::after,
.toipthostbanzhu .search-tab .filter-btn::after {
  content: "";
  display: block;
  width: 0;
  height: 3px;
  background: #1e5fdd;
  position: absolute;
  bottom: -19px;
  left: 50%;
  transform: translateX(-50%);
  transition: all 0.36s;
}

.hostbanzhu .search-tab .filter-btn.active, .hostbanzhu .search-tab .filter-btn:hover,
.toipthostbanzhu .search-tab .filter-btn.active,
.toipthostbanzhu .search-tab .filter-btn:hover {
  font-weight: 700;
  color: #1e5fdd;
}

.hostbanzhu .search-tab .filter-btn.active::after, .hostbanzhu .search-tab .filter-btn:hover::after,
.toipthostbanzhu .search-tab .filter-btn.active::after,
.toipthostbanzhu .search-tab .filter-btn:hover::after {
  width: 34px;
}

.hostbanzhu .search,
.toipthostbanzhu .search {
  margin-top: 24px;
}

.hostbanzhu .search .search-key-form-form,
.toipthostbanzhu .search .search-key-form-form {
  width: 640px;
  height: 64px;
  line-height: 62px;
  background: #ffffff;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #e0eaff;
  padding: 0 32px;
  position: relative;
}

.hostbanzhu .search .search-key-form-form .iconfont,
.toipthostbanzhu .search .search-key-form-form .iconfont {
  font-size: 20px;
  color: #1e5fdd;
}

.hostbanzhu .search .search-key-form-form button,
.toipthostbanzhu .search .search-key-form-form button {
  color: #1e5fdd;
  border: none;
  background-color: transparent;
}

.hostbanzhu .search a.go-to-topic-article,
.hostbanzhu .search a.go-to-post,
.toipthostbanzhu .search a.go-to-topic-article,
.toipthostbanzhu .search a.go-to-post {
  width: 114px;
  height: 60px;
  display: inline-block;
  text-align: center;
  line-height: 60px;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #1e5fdd;
  font-size: 14px;
  color: #1e5fdd;
}

.hostbanzhu .search a.go-to-topic-article .iconfont,
.hostbanzhu .search a.go-to-post .iconfont,
.toipthostbanzhu .search a.go-to-topic-article .iconfont,
.toipthostbanzhu .search a.go-to-post .iconfont {
  font-size: 14px;
  margin-right: 6px;
}

.hostbanzhu .screen,
.toipthostbanzhu .screen {
  margin-right: 16px;
}

.hostbanzhu .screen select,
.toipthostbanzhu .screen select {
  width: 246px;
}

.hostbanzhu .screen .f-l .metro,
.toipthostbanzhu .screen .f-l .metro {
  width: 246px;
  height: 64px;
  background: #ffffff;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #e0eaff;
  margin-bottom: 0;
}

.hostbanzhu .screen .f-l .metro .selected,
.toipthostbanzhu .screen .f-l .metro .selected {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 23px 32px;
}

.hostbanzhu .screen .f-l .dropdown,
.toipthostbanzhu .screen .f-l .dropdown {
  margin-top: 17px;
}

.hostbanzhu .screen .f-r,
.toipthostbanzhu .screen .f-r {
  line-height: 70px;
}

.hostbanzhu .screen .f-r input[type="radio"],
.toipthostbanzhu .screen .f-r input[type="radio"] {
  display: none;
}

.hostbanzhu .screen .f-r .square-radio,
.toipthostbanzhu .screen .f-r .square-radio {
  width: 16px;
  height: 16px;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 3px 3px 3px 3px;
  border: 1px solid #dbdcde;
  margin-right: 8px;
}

.hostbanzhu .screen .f-r .active,
.toipthostbanzhu .screen .f-r .active {
  color: #1e5fdd;
}

.hostbanzhu .screen .f-r .active .square-radio,
.toipthostbanzhu .screen .f-r .active .square-radio {
  border: 1px solid #1e5fdd;
  background-color: #1e5fdd;
  line-height: 14px;
  text-align: center;
}

.hostbanzhu .screen .f-r .square-radio::before,
.toipthostbanzhu .screen .f-r .square-radio::before {
  content: "\e7c8";
  color: #ffffff;
  font-size: 12px;
  font-weight: bold;
  font-family: "iconfont";
  opacity: 0;
}

.hostbanzhu .screen .f-r .active .square-radio::before,
.toipthostbanzhu .screen .f-r .active .square-radio::before {
  opacity: 1;
}

.hostbanzhu .screen .f-r label,
.toipthostbanzhu .screen .f-r label {
  font-weight: 400;
  font-size: 14px;
  color: #040a16;
  line-height: 16px;
  margin-right: 32px;
}

.hostbanzhu .screen .f-r label:hover,
.toipthostbanzhu .screen .f-r label:hover {
  color: #1e5fdd;
}

.hostbanzhu .screen .f-r input,
.toipthostbanzhu .screen .f-r input {
  width: 16px;
  height: 16px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 3px 3px 3px 3px;
  border: 1px solid #dbdcde;
  margin-right: 8px;
  position: relative;
  top: 2px;
}

.toipthostbanzhu select {
  max-width: 160px;
}

.toipthostbanzhu .screen .f-l .metro {
  width: 160px;
}

.toipthostbanzhu .date-box {
  margin-left: 12px;
  padding-left: 12px;
  position: relative;
}

.toipthostbanzhu .date-box::before {
  content: "";
  display: block;
  width: 1px;
  height: 16px;
  background-color: #ededed;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.mvps {
  padding-top: 140px;
  padding-bottom: 196px;
  text-align: center;
  background: linear-gradient(to bottom, #f2f5fd 0%, #f8f8f8 100%);
}

.mvps > img {
  width: 120px;
}

.mvps .stay-tuned {
  font-size: 18px;
  color: #1e5fdd;
  line-height: 46px;
  margin-top: 16px;
}

.mvps .stay-tuned b {
  display: inline-block;
  letter-spacing: 0.05em;
  animation: slow_wave 0.8s infinite alternate;
}

.mvps .stay-tuned b:nth-child(2n + 0) {
  animation-delay: -1.56s;
}

.mvps .stay-tuned b:nth-child(2n + 1) {
  animation-delay: -1.44s;
}

.mvps .stay-tuned b:nth-child(2n + 2) {
  animation-delay: -1.32s;
}

.mvps .stay-tuned b:nth-child(2n + 3) {
  animation-delay: -1.2s;
}

.mvps .stay-tuned b:nth-child(2n + 4) {
  animation-delay: -1.08s;
}

.about-banner {
  width: 100%;
  height: 420px;
}

.about-banner .about-swiper {
  width: 100%;
  height: 420px;
}

.about-banner .about-swiper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  top: 0;
}

.about {
  padding-top: 30px;
  padding-bottom: 188px;
  background-color: #f8f8f8;
}

.about .titles {
  color: #3d3d3d;
  position: relative;
  padding-left: 19px;
}

.about .titles .blod {
  font-weight: 700;
  font-size: 22px;
}

.about .titles::after {
  content: "";
  display: block;
  width: 4px;
  height: 20px;
  background: #1e5fdd;
  border-radius: 0px 0px 0px 0px;
  position: absolute;
  left: 0;
  top: 5px;
}

.about .about-text {
  margin-top: 16px;
  background-color: #ffffff;
  padding: 24px;
  border-radius: 6px;
}

.about .about-text .text {
  color: #040a16;
  font-size: 16px;
  margin-top: 14px;
  line-height: 24px;
}

.about .about-card {
  background-color: #ffffff;
  padding: 24px;
  border-radius: 6px;
  margin-top: 24px;
}

.about .card-box {
  margin-top: 26px;
  position: relative;
}

.about .card-box .card {
  width: calc(25% - 18px);
  background: #f0f5ff;
  border-radius: 8px 8px 8px 8px;
  margin-left: 24px;
  padding: 30px 12px 30px 24px;
  top: 0px;
  transition: all 0.1s;
  z-index: 1;
}

.about .card-box .card .icon {
  width: 60px;
  position: absolute;
  right: 10px;
  top: 22px;
  z-index: -1;
  transition: all 0.46s;
}

.about .card-box .card .t1 {
  font-weight: 700;
  font-size: 16px;
  color: #3d3d3d;
  line-height: 30px;
}

.about .card-box .card .desc {
  font-size: 14px;
  color: #858d9e;
  line-height: 22px;
  margin-top: 16px;
}

.about .card-box .card:nth-child(1) {
  margin-left: 0;
}

.about .card-box .card::after {
  content: "";
  display: block;
  width: 100%;
  height: 0;
  box-shadow: 0px 5px 10px #d6e0f5;
  position: absolute;
  border-radius: 8px 8px 8px 8px;
  left: 0;
  bottom: 0;
  z-index: -1;
  transition: all 0.46s;
}

.about .card-box .card:hover .icon {
  width: 70px;
  top: 17px;
  right: 5px;
}

.about .card-box .card:hover .t1 {
  color: #1e5fdd;
}

.about .integral {
  margin-top: 24px;
  background: #ffffff;
  border-radius: 6px 6px 6px 6px;
  padding: 24px;
}

.about .integral .tips {
  font-size: 16px;
  line-height: 24px;
  margin-top: 26px;
  color: #040a16;
}

.about .integral .tips span {
  color: #040a16;
  position: relative;
  top: 2px;
  margin-right: 2px;
}

.about .integral .desc {
  font-size: 16px;
  color: #040a16;
  line-height: 24px;
  margin-top: 24px;
}

.about .integral .t1s {
  font-weight: 700;
  font-size: 18px;
  color: #040a16;
  line-height: 24px;
  margin-bottom: 16px;
  margin-top: 24px;
}

.about .integral img {
  max-width: 100%;
  margin-top: 26px;
}

.search-contentbox .content-box {
  position: absolute;
  right: -100%;
  transition: all 0.36s;
}

.search-contentbox .content-box.show {
  position: relative;
  right: 0;
}

.search-contentbox .content-box.wz .list {
  display: block;
  padding: 28px 0;
  border-bottom: 1px dashed #b8bfd9;
  position: relative;
}

.search-contentbox .content-box.wz .list .title {
  font-weight: 700;
  font-size: 20px;
  color: #3d3d3d;
  line-height: 26px;
}

.search-contentbox .content-box.wz .list .title .icon-imgs {
  width: 26px;
  top: -4px;
}

.search-contentbox .content-box.wz .list .desc {
  font-size: 16px;
  color: #858d9e;
  line-height: 24px;
  margin-top: 8px;
}

.search-contentbox .content-box.wz .list .infos {
  margin-top: 16px;
}

.search-contentbox .content-box.wz .list .infos .avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
}

.search-contentbox .content-box.wz .list .infos .name {
  font-size: 16px;
  color: #040a16;
  line-height: 24px;
  margin-left: 8px;
}

.search-contentbox .content-box.wz .list .infos .type {
  display: inline-block;
  padding-left: 20px;
  position: relative;
  margin-left: 24px;
}

.search-contentbox .content-box.wz .list .infos .type span {
  height: 30px;
  line-height: 30px;
  background: #f1f1f1;
  border-radius: 4px;
  color: #858d9e;
  padding: 0 6px;
  margin-left: 5px;
}

.search-contentbox .content-box.wz .list .infos .type::after {
  content: "";
  display: block;
  width: 1px;
  height: 18px;
  background-color: #d8d8d8;
  position: absolute;
  left: 0;
  top: 5px;
}

.search-contentbox .content-box.wz .list .date-box {
  font-size: 16px;
  color: #858d9e;
  line-height: 30px;
}

.search-contentbox .content-box.wz .list .date-box .iconfont {
  margin-right: 6px;
}

.search-contentbox .content-box.wz .list .date-box .date {
  position: relative;
  padding-left: 24px;
  margin-left: 24px;
}

.search-contentbox .content-box.wz .list .date-box .date::after {
  content: "";
  display: block;
  width: 1px;
  height: 14px;
  background-color: #d8d8d8;
  position: absolute;
  left: 0;
  top: 8px;
}

.search-contentbox .content-box.wz .list:last-child {
  border-bottom: none;
  padding: 24px 0 0;
}

.search-contentbox .content-box.wz .list::after {
  content: "";
  display: block;
  width: 0;
  height: 1px;
  background-color: #1e5fdd;
  position: absolute;
  left: 0;
  bottom: -1px;
  transition: all 0.36s;
}

.search-contentbox .content-box.wz .list:last-child::after {
  height: 0px;
}

.search-contentbox .content-box.wz .list:hover .title {
  color: #1e5fdd;
}

.search-contentbox .content-box.wz .list:hover::after {
  width: 100%;
}

.search-contentbox .content-box.ac .left-img {
  width: 260px;
  height: 146px;
  object-fit: cover;
  overflow: hidden;
}

.search-contentbox .content-box.ac .left-img img {
  width: 260px;
  height: 146px;
  object-fit: cover;
  transition: all 0.4s;
}

.search-contentbox .content-box.ac .fight-boxs {
  width: calc(100% - 284px);
}

.search-contentbox .content-box.ac .fight-boxs .infos .label {
  font-size: 14px;
  color: #858d9e;
}

.search-contentbox .content-box.ac .list:hover .left-img img {
  transform: scale(1.1);
}

.bright-btn {
  position: relative;
  overflow: hidden;
  z-index: 1;
  transition: all 0.46s;
}

.bright-btn::before, .bright-btn::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border: 0 solid transparent;
  z-index: -1;
  transition: all 0.45s;
}

.bright-btn::before {
  left: 0;
  bottom: 0;
  border-left-color: #1e5fdd;
  border-bottom-color: #1e5fdd;
}

.bright-btn::after {
  top: 0;
  right: 0;
  border-top-color: #1e5fdd;
  border-right-color: #1e5fdd;
}

.bright-btn:hover {
  box-shadow: 2px 5px 10px #a7c2f8;
}

.bright-btn:hover::before, .bright-btn:hover::after {
  border-width: 200px;
}

.privacy-box {
  width: calc(100% + 24px);
  height: calc(100% - 50px);
  overflow-y: scroll;
  font-size: 16px;
  line-height: 1.6;
  margin-top: 24px;
  margin-left: -24px;
  padding-left: 24px;
}

.privacy-box::-webkit-scrollbar {
  width: 6px;
}

.privacy-box::-webkit-scrollbar-thumb {
  background: #f2f2f2;
  border-radius: 8px;
}

.region-select {
  width: calc(100% - 116px);
}

.region-select .dropdown {
  width: 178px !important;
}

.empty-box {
  text-align: center;
  border-radius: 6px;
  background-color: #ffffff;
  padding: 36px 0;
}

.empty-box img {
  width: 76px;
}

.empty-box p.text {
  font-size: 16px;
  color: #e0e2e6;
  margin-top: 12px;
}

.bdshare_dialog_box {
  border: 1px solid #ededed !important;
}

.pressure-box {
  overflow: hidden;
  position: relative;
  transition: all 0.34s;
}

.pressure-box .show-flog {
  position: absolute;
  display: inline-block;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.36s;
  top: 8px;
  right: 0;
}

.pressure-box .show-flog .iconfont {
  margin-left: 3px;
}

.pressure-box .show-flog:hover {
  color: #1e5fdd;
}

.pressure-box.open {
  max-height: 1000px;
  padding-right: 92px;
}

.pressure-box.open .show-flog {
  cursor: pointer;
}

.pressure-box.pressure {
  padding-right: 92px;
  max-height: 49px;
}

.password-ipt {
  position: relative;
  width: calc(100% - 76px);
}

.password-ipt #eay_btn {
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 20px;
  color: #02101d;
  cursor: pointer;
}

.password-ipt .eay_btn {
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 20px;
  color: #02101d;
  cursor: pointer;
}

.bdselect_share_box {
  display: none;
  visibility: hidden;
  opacity: 0;
}

.bd_weixin_popup .bd_weixin_popup_foot {
  text-align: center !important;
}

.bd_weixin_popup {
  border-radius: 6px !important;
  padding: 24px !important;
}

.share-t1 {
  margin-bottom: 10px;
}

.share-t1 .list {
  display: inline-block;
  margin-right: 16px;
}

.share-t1 .list.eya span.text {
  color: #858d9e !important;
}

.share-t1 .list a span.text {
  color: #858d9e !important;
  font-size: 14px;
}

.share-t1 .list a .iconfont {
  color: #040a16;
  font-size: 18px;
}

.share-t1 .list .bdshare-button-style1-16 a,
.share-t1 .list .bdshare-button-style1-16 .bds_more {
  margin: 0;
}

.share-t1 .list.bdsharebuttonboxs:hover .sharewx-link {
  opacity: 1;
  visibility: visible;
  left: 0px;
}

.share-t1 .list.bdsharebuttonboxs {
  width: 60px;
  height: 16px;
  position: relative;
}

.share-t1 .list.bdsharebuttonboxs .sharewx-link {
  width: 120px;
  background-color: #fff;
  border-radius: 6px;
  padding: 12px;
  box-shadow: 6px 10px 20px rgba(0, 0, 0, 0.2);
  left: 10px;
  opacity: 0;
  visibility: hidden;
  transition: all 0.36s;
}

.share-t1 .list.bdsharebuttonboxs .sharewx-link .bdsharebuttonbox a {
  position: relative;
  margin: 9px 0;
  padding-left: 22px;
}

.share-t1 .list.bdsharebuttonboxs > a {
  margin: 0 0 !important;
  background-image: none;
  padding-left: 0;
  position: absolute;
  padding-left: 21px;
  top: 2px;
  color: #858d9e;
  font-size: 14px;
  transition: none;
}

.share-t1 .list.bdsharebuttonboxs > a span {
  position: relative;
  color: #858d9e !important;
}

.share-t1 .list.bdsharebuttonboxs > a::after {
  width: 48px;
  content: "\e659";
  font-family: "iconfont";
  display: inline-block;
  color: #040a16;
  font-size: 16px;
  text-align: left;
  position: absolute;
  left: 0;
  top: 0px;
}

.share-t1 .list.ischeck {
  color: #cb1126;
}

.share-t1 .list.ischeck a {
  color: #cb1126;
}

.share-t1 .list.ischeck a .iconfont {
  color: #cb1126;
}

.share-t1 .list.ischeck a span {
  color: #cb1126;
}

.share-t1 .list.eya a {
  cursor: auto;
}

.avatar_pop {
  cursor: pointer;
}

.post-btns {
  margin-top: -8px;
}

.post-btns button {
  width: 80px;
  height: 32px;
  font-size: 14px;
  color: #858d9e;
  background-color: #ffffff;
  border-radius: 100px 100px 100px 100px;
  border: 1px solid #dbdcde;
  transition: all 0.36s;
  margin-left: 10px;
}

.post-btns .user-post-edit:hover,
.post-btns .user-article-edit:hover {
  background-color: #f0f5ff;
  border: 1px solid #e0eaff;
  color: #1e5fdd;
}

.post-btns .user-post-del:hover,
.post-btns .user-article-del:hover {
  color: #cb1126;
  background-color: #faeff1;
  border: 1px solid rgba(203, 17, 38, 0.14);
}

.regist-box.newregist-box .right-box .tab-box {
  width: calc(100% + 60px);
}

.regist-box.newregist-box .list:nth-child(n + 2) {
  margin-top: 10px;
}

.regist-box.newregist-box .login-from .sub {
  margin-top: 10px;
}

.regist-box.newregist-box .right-box {
  padding: 26px 80px 26px;
}

.regist-box.newregist-box .right-box .tab-box {
  margin-top: 12px;
}

#userinfo-form .dropdown,
.form-post-edit-pop .dropdown {
  background: #f2f3f5;
}

.language-box {
  display: inline-block;
  position: relative;
  margin-left: 40px;
}

.language-box .language-selects {
  text-align: center;
  line-height: 24px;
  font-size: 14px;
  color: #606266;
  cursor: pointer;
}

.language-box .language-selects:hover {
  color: #9a060b;
}

.language-box .language-boxcen {
  width: 102px;
  height: 0px;
  overflow: hidden;
  position: absolute;
  left: -6px;
  padding: 6px 6px;
  background-color: #ffffff;
  box-shadow: 2px 10px 20px rgba(0, 0, 0, 0.1);
  border-radius: 6px;
  transition: all 0.36s;
  display: none;
}

.language-box .language-boxcen .language-selects {
  line-height: 36px;
  margin: 2px 0;
}

.language-box .language-boxcen .language-selects.selected {
  background-color: #f8e9e9;
  color: #9a060b;
}

.language-box .language-boxcen .language-selects:hover {
  background-color: #f8e9e9;
  color: #9a060b;
}

.language-box:hover .language-boxcen {
  padding: 6px 6px;
  padding-top: 12px;
  padding-bottom: 12px;
  height: 96px;
  display: block;
}

.not-login .language-box {
  margin-left: 0;
}

.not-login .language-box .language-selects {
  color: #040a16;
}

.not-login .language-box .language-boxcen .language-selects {
  padding-left: 12px;
}

.regist-box .login-from.first-edit .list p.label {
  width: 156px;
}

.regist-box .login-from.first-edit .list-box {
  width: calc(100% - 156px);
}

.regist-box .regist-centers .login-from .list p.label {
  width: 158px;
}

#show_message:hover {
  color: #b7251e;
}

.bdsharebuttonboxs:hover .sharewx-link {
  opacity: 1;
  visibility: visible;
  left: -113px;
  z-index: 66;
}

.bdsharebuttonboxs {
  width: 60px;
  height: 16px;
  position: relative;
}

.bdsharebuttonboxs .sharewx-link {
  width: 120px;
  background-color: #fff;
  border-radius: 6px;
  padding: 12px;
  box-shadow: 6px 10px 20px rgba(0, 0, 0, 0.2);
  opacity: 0;
  left: -123px;
  visibility: hidden;
  transition: all 0.36s;
}

.bdsharebuttonboxs .sharewx-link .bdsharebuttonbox a {
  position: relative;
  margin: 9px 0;
  padding-left: 22px;
}

.explain-boxs {
  font-size: 16px;
  line-height: 33px;
  margin-top: 24px;
  color: #040a16;
}

.communitypaging.paging .jump .jumppages,
.communitypaging.paging .jump #pageInput,
.communitypaging.paging .jump #submitInput {
  display: none;
}

.search .searchaddpostion {
  height: 100%;
  position: relative;
}

.search .searchaddpostion .search-cancel {
  font-size: 11px !important;
  position: absolute;
  right: 5px;
  top: 9px;
  opacity: 0;
  transition: all 0.36s;
  cursor: pointer;
}

.search .searchaddpostion:hover .search-cancel {
  opacity: 1;
  top: 10px;
}

.search {
  position: relative;
}

.search .search-cancel {
  font-size: 12px !important;
  margin-right: 16px;
  position: absolute;
  right: 94px;
  top: 5px;
  opacity: 0;
  transition: all 0.36s;
  cursor: pointer;
}

.search .left:hover .search-cancel {
  top: 2px;
  opacity: 1;
}

.search .search-key-form-form:hover .search-cancel {
  top: 2px;
  opacity: 1;
}

.search .form-box:hover .search-cancel {
  top: 2px;
  opacity: 1;
}

.essence-box {
  position: absolute;
  right: 20px;
  top: 0;
  z-index: 2;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  margin-left: 6px;
}

.essence-box img {
  width: 64px;
}

.ke-dialog {
  border-radius: 6px;
  overflow: hidden;
}

.ke-dialog .ke-dialog-content {
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid #ededed;
}

.ke-dialog .ke-dialog-header {
  height: 32px;
  background-size: 100%;
  line-height: 32px;
  border-bottom: 1px solid #ededed;
}

.ke-dialog .ke-input-text {
  line-height: 26px;
  height: 26px;
  border-color: #ededed;
  border-radius: 2px;
}

.ke-dialog .ke-button-common {
  background: #f0f0f0;
  height: 26px;
  line-height: 26px;
}

.ke-dialog .ke-button-common:hover {
  background: #f2f7fe;
  color: #306ee7;
}

.community-right .userinfo,
.hottopic-content .hostperson {
  background-color: #ffffff;
  padding: 24px;
  border-radius: 6px;
}

.community-right .userinfo .hostperson-box,
.hottopic-content .hostperson .hostperson-box {
  width: calc(100% + 16px);
  overflow: hidden;
  overflow-y: scroll;
  padding-right: 16px;
}

.community-right .userinfo .hostperson-box::-webkit-scrollbar,
.hottopic-content .hostperson .hostperson-box::-webkit-scrollbar {
  width: 6px;
}

.community-right .userinfo .hostperson-box::-webkit-scrollbar-thumb,
.hottopic-content .hostperson .hostperson-box::-webkit-scrollbar-thumb {
  background: rgba(126, 126, 126, 0.1);
  border-radius: 8px;
}

.community-right .userinfo .hostperson-box::-webkit-scrollbar,
.hottopic-content .hostperson .hostperson-box::-webkit-scrollbar {
  /* 纵向滚动条 宽度 */
  width: 6px;
  /* 横向滚动条 高度 */
  height: 4px;
  /* 整体背景 */
  background: rgba(126, 126, 126, 0.02);
  /* 整体 圆角 */
  border-radius: 8px;
}

.community-right .userinfo .them-title,
.hottopic-content .hostperson .them-title {
  font-weight: 700;
  font-size: 22px;
  color: #3d3d3d;
  line-height: 29px;
  padding-bottom: 10px;
}

.community-right .userinfo .them-title::before,
.hottopic-content .hostperson .them-title::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 20px;
  background: #1e5fdd;
  position: relative;
  top: 2px;
  margin-right: 15px;
}

.community-right .userinfo .r-list,
.hottopic-content .hostperson .r-list {
  margin-top: 24px;
}

.community-right .userinfo .r-list .avatar,
.hottopic-content .hostperson .r-list .avatar {
  width: 60px;
  height: 60px;
}

.community-right .userinfo .r-list .avatar img,
.hottopic-content .hostperson .r-list .avatar img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  object-fit: cover;
}

.community-right .userinfo .r-list .username,
.hottopic-content .hostperson .r-list .username {
  margin-left: 10px;
  padding: 4px 0 4px;
  overflow: hidden;
}

.community-right .userinfo .r-list .username .names,
.hottopic-content .hostperson .r-list .username .names {
  font-size: 16px;
  color: #040a16;
  line-height: 22px;
}

.community-right .userinfo .r-list .username .imgs img,
.hottopic-content .hostperson .r-list .username .imgs img {
  max-height: 20px;
}

.community-right .userinfo .r-list .r-button,
.hottopic-content .hostperson .r-list .r-button {
  padding: 0 8px;
  font-size: 14px;
  color: #1e5fdd;
  height: 28px;
  border-radius: 100px;
  border: 1px solid #1e5fdd;
  background-color: #ffffff;
  transition: all 0.36s;
}

.community-right .userinfo .r-list .r-button:hover,
.hottopic-content .hostperson .r-list .r-button:hover {
  font-weight: bold;
}

.community-right .userinfo .r-list .r-button .iconfont,
.hottopic-content .hostperson .r-list .r-button .iconfont {
  font-size: 14px;
  margin-right: 4px;
}

.community-right .userinfo .r-list .fanslist,
.hottopic-content .hostperson .r-list .fanslist {
  font-size: 14px;
  margin-top: 16px;
}

.community-right .userinfo .r-list .fanslist span,
.hottopic-content .hostperson .r-list .fanslist span {
  line-height: 20px;
  color: #858d9e;
}

.community-right .userinfo .r-list .fanslist span strong,
.hottopic-content .hostperson .r-list .fanslist span strong {
  color: #040a16;
}

.hottopic-content .hostperson .hostperson-box {
  max-height: 116px;
}

.hottopic-content .hostperson .hostperson-box .htzcr-swiper,
.hottopic-content .hostperson .hostperson-box .swiper-wrapper {
  height: 116px !important;
}

.community-right .userinfo .hostperson-box {
  max-height: 360px;
}

.moderator-zone,
.htzcr-zone {
  width: 100%;
  height: 80px;
  margin-top: 24px;
  font-size: 14px;
  color: #040a16;
  padding-left: 21px;
  background-image: url(../images/moderatorbg.png);
}

.moderator-zone strong,
.htzcr-zone strong {
  font-size: 18px;
  color: #040a16;
}

.moderator-zone span,
.htzcr-zone span {
  font-size: 14px;
  color: #040a16;
}

.moderator-zone .iconfont,
.htzcr-zone .iconfont {
  font-size: 16px;
  color: #000000;
  margin-right: 16px;
  margin-left: 10px;
}

.moderator-zone .btns,
.htzcr-zone .btns {
  margin-top: 6px;
}

.moderator-zone .btns img,
.htzcr-zone .btns img {
  margin-right: 6px;
}

.moderator-zone .btns span,
.htzcr-zone .btns span {
  color: #cb1126;
}

.htzcr-zone {
  margin-top: 20px;
  padding: 0 30px;
  background-image: url(../images/moderatorbg1.png);
  background-size: cover;
  background-position: right center;
  border-radius: 4px;
  overflow: hidden;
}

.htzcr-zone span.ml-20 {
  margin-left: 20px;
  color: #282828;
  padding-right: 26px;
}

.htzcr-zone .btns {
  width: 163px;
  height: 51px;
  border-radius: 6px;
  border: solid 1px #91cbe5;
  line-height: 50px;
  text-align: center;
}

.htzcr-zone .btns img {
  margin-right: 6px;
}

.top-up-pop {
  font-size: 16px;
}

.top-up-pop .dlist {
  margin-top: 26px;
}

.top-up-pop input {
  height: 54px;
  border-radius: 5px;
  border: 1px solid #e5e8ee;
  background-color: #f0f5ff;
  padding: 0 18px;
  margin: 0 18px;
}

.top-up-pop input::after {
  content: "\e65b";
  font-family: "iconfont";
}

.top-up-pop .pop-box form .footer {
  bottom: 22px;
}

.topic-host-audit-pop {
  font-size: 16px;
}

.topic-host-audit-pop label {
  margin-right: 18px;
}

.topic-host-audit-pop .dlist {
  margin-top: 26px;
}

.topic-host-audit-pop .label {
  width: 106px;
}

.topic-host-audit-pop textarea {
  border-radius: 6px;
  border: 1px solid #e5e8ee;
  background-color: #f0f5ff;
  padding: 20px 26px;
}

.topic-host-audit-pop textarea::placeholder {
  font-size: 14px;
}

.topic-host-audit-pop .pop-box form .footer {
  bottom: 22px;
}

.topic-host-audit-pop .layui-form-radio {
  margin-left: -6px;
}

.toipthostbanzhu .topic-articles {
  background-color: #ffff;
  padding: 0 24px 24px;
}

.toipthostbanzhu .topic-articles .essence-box {
  right: 58px;
  top: 12px;
}

.toipthostbanzhu .dropdownboox {
  width: 160px;
  height: 62px;
  background-color: #ffffff;
  border-radius: 100px;
  margin-left: 16px;
}

.toipthostbanzhu .dropdownboox select {
  padding: 0 32px;
}

.hostbanzhu .dropdownboox {
  width: 246px;
  height: 62px;
  background-color: #ffffff;
  border-radius: 100px;
  margin-left: 16px;
}

.hostbanzhu .dropdownboox select {
  padding: 0 32px;
}

.hostbanzhu .hottopic-box .list .date-box {
  margin-left: 12px;
  padding-left: 12px;
  position: relative;
}

.hostbanzhu .hottopic-box .list .date-box::before {
  content: "";
  display: block;
  width: 1px;
  height: 16px;
  background-color: #ededed;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.new-reviewreply {
  display: inline-block;
  padding: 5px 16px;
  line-height: 24px;
  background-color: #ffebec;
  color: #cf2e36;
  border-radius: 6px;
}

.new-reviewreply img {
  margin-right: 8px;
}

.new-source {
  font-size: 14px;
  color: #858d9e;
}

.new-source img {
  margin-right: 6px;
  position: relative;
  top: -1px;
}

.cooperation-box {
  background-color: #f8f8f8;
  padding-bottom: 60px;
}

.cooperation-box .cooperation-tab {
  padding-top: 24px;
}

.cooperation-box .cooperation-tab .left::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 20px;
  background: #1e5fdd;
  margin-right: 11px;
}

.cooperation-box .cooperation-tab .left span {
  font-size: 22px;
  font-weight: bold;
  color: #969696;
  cursor: pointer;
  margin-right: 30px;
  transition: all 0.36s;
}

.cooperation-box .cooperation-tab .left span:hover {
  color: #282828;
}

.cooperation-box .cooperation-tab .left span.active {
  color: #282828;
}

.cooperation-box .cooperation-tab .more {
  font-size: 18px;
  color: #989898;
}

.cooperation-box .cooperation-tab .more .iconfont {
  font-size: 16px;
  margin-left: 2px;
}

.cooperation-box .cooperation-card {
  margin-top: 20px;
  margin-bottom: 2px;
  max-height: 145px;
  overflow: hidden;
  transition: all 0.36s;
}

.cooperation-box .cooperation-card .list {
  width: calc(25% - 12px);
  height: 127px;
  background-color: #ffffff;
  border-radius: 6px;
  margin-right: 16px;
  overflow: hidden;
  padding: 19px 20px;
  transition: box-shadow 0.36s, transform 0.36s;
  margin-bottom: 16px;
  cursor: pointer;
  margin-top: 2px;
}

.cooperation-box .cooperation-card .list:hover {
  transform: translateY(-2px);
  border: solid 1px #1e5fdd;
  box-shadow: 0px 4px 0px #1e5fdd;
}

.cooperation-box .cooperation-card .list.active {
  transform: translateY(-2px);
  border: solid 1px #1e5fdd;
  box-shadow: 0px 4px 0px #1e5fdd;
}

.cooperation-box .cooperation-card .list .text-box {
  overflow: hidden;
  margin-left: 10px;
  flex: 1;
}

.cooperation-box .cooperation-card .list .t1 {
  font-size: 20px;
  color: #282828;
  line-height: 30px;
  font-weight: bold;
}

.cooperation-box .cooperation-card .list .desc {
  font-size: 14px;
  line-height: 24px;
  color: #666666;
  display: flex;
}

.cooperation-box .cooperation-card .list .desc span {
  max-width: 50%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding-right: 8px;
}

.cooperation-box .cooperation-card .list:nth-child(4n) {
  margin-right: 0;
}

.cooperation-box .cooperation-card .list .logo {
  width: 40px;
  max-height: 80px;
}

.cooperation-box .cooperation-type {
  min-height: 83px;
  background-color: #ffffff;
  border-radius: 10px;
  padding-left: 38px;
  padding-right: 38px;
  margin-bottom: 16px;
  padding-top: 8px;
  padding-bottom: 8px;
}

.cooperation-box .cooperation-type .cooperation-tabs {
  font-size: 16px;
  color: #282828;
  margin: 8px 0;
}

.cooperation-box .cooperation-type .cooperation-tabs a {
  margin-right: 26px;
  cursor: pointer;
}

.cooperation-box .cooperation-type .cooperation-tabs a.active {
  color: #1e5fdd;
  font-weight: bold;
}

.cooperation-box .cooperation-type .cooperation-tabs a:last-child {
  margin-right: 0;
}

.cooperation-box .cooperation-type form .ipt {
  width: 323px;
  height: 51px;
  background-color: #ffffff;
  border-radius: 24px;
  padding: 0 16px 0 11px;
  border: solid 1px #e8f0fe;
}

.cooperation-box .cooperation-type form .ipt .iconfont {
  color: #1e5fdd;
  margin-right: 12px;
  font-size: 16px;
  font-weight: normal;
}

.cooperation-box .cooperation-type form .ipt button {
  background: transparent;
  color: #1e5fdd;
  font-size: 16px;
  font-weight: normal;
}

.cooperation-box .cooperation-type form button {
  font-size: 18px;
  font-weight: bold;
}

.cooperation-box .cooperation-type form button .iconfont {
  font-size: 14px;
  margin-right: 2px;
}

.cooperation-box .cooperation-type form button.b1 {
  width: 122px;
  height: 51px;
  background-color: #1e5fdd;
  border-radius: 24px;
  color: #ffffff;
  margin-left: 38px;
}

.cooperation-box .cooperation-type form button.b2 {
  width: 122px;
  height: 51px;
  background-color: #f0f5ff;
  border-radius: 24px;
  color: #1e5fdd;
  margin-left: 9px;
}

.cooperation-box .main-title span {
  font-size: 22px;
  color: #282828;
}

.cooperation-box .main-title span::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 20px;
  background-color: #1e5fdd;
}

.cooperation-box .left-box {
  width: 30.21%;
}

.cooperation-box .right-contentbox {
  background-color: #ffffff;
  padding: 30px;
  border-radius: 10px;
}

.cooperation-box .right-contentboxbideo {
  background-color: #ffffff;
  padding: 30px 22px 16px;
  border-radius: 10px;
}

.cooperation-box .right-box {
  width: calc(69.79% - 16px);
  height: fit-content;
}

.cooperation-box .right-box .community-center {
  width: 100%;
}

.cooperation-box .catalogue {
  width: 100%;
  padding: 36px 0;
  border-radius: 10px;
  background-color: #ffffff;
}

.cooperation-box .catalogue .main-title {
  margin: 0 20px;
}

.cooperation-box .catalogue .demo-tree {
  padding: 14px 20px;
}

.cooperation-box .catalogue .demo-tree #treecontent {
  border-top: 1px solid #ececec;
  padding: 10px 0;
}

.cooperation-box .catalogue .layui-tree-iconClick {
  position: absolute;
  right: 0;
  margin: 0 16px;
}

.cooperation-box .catalogue .layui-tree-entry {
  height: 36px;
  padding: 0;
  padding-left: 22px;
}

.cooperation-box .catalogue .layui-tree > .layui-tree-set > .layui-tree-entry {
  height: 46px;
}

.cooperation-box .catalogue .layui-tree > .layui-tree-set > .layui-tree-entry > .layui-tree-main {
  height: 40px;
  line-height: 40px;
}

.cooperation-box .catalogue .layui-tree-entry:hover {
  background-color: #ffffff;
}

.cooperation-box .catalogue .layui-tree-entry:hover .layui-tree-txt {
  color: #1e5fdd;
}

.cooperation-box .catalogue #treecontent > .layui-tree > .layui-tree-spread .layui-tree-iconArrow::after {
  transform: rotate(90deg);
}

.cooperation-box .catalogue #treecontent > .layui-tree .layui-tree-checkedFirst > .layui-tree-entry {
  height: 47px;
  background-color: #1e5fdd;
  box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.03);
  border-radius: 4px;
}
.cooperation-box .catalogue #treecontent > .layui-tree .layui-tree-checkedFirst > .layui-tree-entry .layui-tree-txt{
  color:#ffffff
}

.cooperation-box .catalogue #treecontent > .layui-tree > .layui-tree-checkedFirst > .layui-tree-entry > .layui-tree-main {
  height: 47px;
  line-height: 26px;
}

.cooperation-box .catalogue #treecontent > .layui-tree > .layui-tree-checkedFirst > .layui-tree-entry .layui-tree-iconClick {
  color: #ffffff;
  top: 11px;
}

.cooperation-box .catalogue #treecontent > .layui-tree > .layui-tree-checkedFirst > .layui-tree-entry .layui-tree-txt {
  color: #ffffff;
}

.cooperation-box .catalogue #treecontent > .layui-tree > .layui-tree-checkedFirst > .layui-tree-entry .layui-tree-txt::before {
  color: #ffffff !important;
}

.cooperation-box .catalogue #treecontent > .layui-tree > .layui-tree-set > .layui-tree-entry .layui-tree-iconClick {
  top: 21px;
}

.cooperation-box .catalogue #treecontent > .layui-tree .layui-tree-checkedFirst .layui-tree-iconClick {
  top: 11px !important;
}

/* .cooperation-box .catalogue .layui-tree-spread .layui-tree-spread > .layui-tree-entry .layui-tree-txt {
  color: #1e5fdd;
} */

.cooperation-box .catalogue .layui-tree-pack {
  padding-top: 8px;
}

.cooperation-box .catalogue .layui-tree-iconArrow {
  padding: 0;
  font-style: normal;
}

.cooperation-box .catalogue .layui-tree-iconArrow:after {
  content: "\e6e3";
  width: auto;
  height: auto;
  display: inline-block;
  font-family: "iconfont";
  border-width: 0;
  border-style: none;
  position: relative;
}

.cooperation-box .catalogue .layui-tree-main {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding: 10px 0 0 0;
}

.cooperation-box .catalogue .layui-tree > .layui-tree-set > .layui-tree-entry > .layui-tree-main > .layui-tree-txt::before {
  content: "·";
  display: inline-block;
  color: #666666;
  margin-right: 16px;
}

.cooperation-box .cooperation-link {
  width: 100%;
  border-radius: 10px;
  background-color: #ffffff;
  padding: 28px 24px 26px;
  margin-top: 16px;
}

.cooperation-box .cooperation-link .link-box {
  padding-top: 14px;
}

.cooperation-box .cooperation-link .link-box .list {
  border-bottom: 1px solid #eaeaea;
  padding-bottom: 14px;
  padding-top: 14px;
}

.cooperation-box .cooperation-link .link-box .list:last-child {
  border-bottom: none;
}

.cooperation-box .cooperation-link .link-box .list:hover .name {
  color: #1e5fdd;
}

.cooperation-box .cooperation-link .link-box .logo {
  text-align: center;
  width: 40px;
}

.cooperation-box .cooperation-link .link-box .logo img {
  max-width: 40px;
  max-height: 80px;
}

.cooperation-box .cooperation-link .link-box .name {
  margin-left: 32px;
}

.cooperation-box .cooperation-link .link-box .iconfont {
  opacity: 0.7;
}

.cooperation-box .cooperation-list {
  padding-top: 18px;
}

.cooperation-box .cooperation-list .list {
  display: block;
  padding-bottom: 8px;
  margin-top: 8px;
  border-bottom: 1px dotted #b8bfd9;
}

.cooperation-box .cooperation-list .list:last-child {
  border-bottom: none;
}

.cooperation-box .cooperation-list .titles {
  font-size: 18px;
  font-weight: bold;
  line-height: 30px;
  color: #282828;
}

.cooperation-box .cooperation-list .titles .logo {
  width: 37px;
  margin-right: 6px;
}

.cooperation-box .cooperation-list .date-box {
  line-height: 30px;
  font-size: 14px;
  color: #888888;
  padding-left: 49px;
}

.cooperation-box .cooperation-list .show-btn {
  color: #999999;
  font-size: 14px;
}

.cooperation-box .cooperation-list .show-btn .iconfont {
  font-size: 16px;
  display: inline-block;
  color: #999999;
}

.cooperation-box .cooperation-list .show-btn > div {
  margin-right: 17px;
}

.cooperation-box .cooperation-list .dow-btn {
  min-width: 190px;
  font-size: 14px;
  color: #666666;
}

.cooperation-box .cooperation-list .dow-btn > div {
  margin-left: 12px;
}

.cooperation-box .cooperation-list .dow-btn .iconfont {
  font-size: 14px;
  display: inline-block;
  color: #040a16;
}

.cooperation-box .cooperation-list .edit-btn button {
  height: 34px;
  min-width: 85px;
  border-radius: 17px;
  font-size: 14px;
  padding: 0 12px;
}

.cooperation-box .cooperation-list .edit-btn .btn1 {
  color: #1e5fdd;
  background-color: #f0f5ff;
}

.cooperation-box .cooperation-list .edit-btn .btn2 {
  background-color: #fff4e2;
  color: #f0903e;
}

.cooperation-box .cooperation-list .edit-btn .btn3 {
  background-color: #fff8f8;
  color: #f46464;
}

.cooperation-box .cooperation-list .edit-btn .btn4 {
  background-color: #f6f6f6;
  color: #1e5fdd;
  border: solid 1px #1e5fdd;
}

.cooperation-box .cooperation-video {
  padding-top: 40px;
}

.cooperation-box .cooperation-video .list {
  width: calc(33.33% - 12px);
  background-color: #ffffff;
  border-radius: 5px;
  border: solid 1px #e8e8e8;
  margin-bottom: 34px;
  overflow: hidden;
  margin-right: 18px;
}

.cooperation-box .cooperation-video .list:nth-child(3n) {
  margin-right: 0;
}

.cooperation-box .cooperation-video .list:hover .poster {
  transform: scale(1.1);
}

.cooperation-box .cooperation-video .list .poster-box {
  width: 100%;
  height: 163px;
  position: relative;
  overflow: hidden;
}

.cooperation-box .cooperation-video .list .poster-box::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.22);
}

.cooperation-box .cooperation-video .list .poster-box .poster {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.36s;
}

.cooperation-box .cooperation-video .list .poster-box .video-icon {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.cooperation-box .cooperation-video .list .poster-box .video-number {
  width: 100%;
  position: absolute;
  padding: 8px 16px;
  left: 0;
  bottom: 0;
  color: #ffffff;
  z-index: 1;
  font-size: 14px;
}

.cooperation-box .cooperation-video .list .poster-box .video-number .iconfont {
  margin-right: 14px;
  font-size: 14px;
}

.cooperation-box .cooperation-video .list .poster-box .video-number .dates {
  font-size: 14px;
  color: #ffffff;
}

.cooperation-box .cooperation-video .list .t1 {
  height: 24px;
  font-size: 18px;
  font-weight: bold;
  color: #0a0a0a;
  padding: 0 19px;
  margin-top: 15px;
}

.cooperation-box .cooperation-video .list .date {
  height: 21px;
  font-size: 16px;
  color: #777474;
  padding: 0 19px;
  margin-top: 10px;
}

.cooperation-box .cooperation-video .list .btns {
  padding: 10px 10px 26px;
}

.cooperation-box .cooperation-video .list .btns button {
  min-width: 50px;
  height: 26px;
  border-radius: 6px;
  margin: 0 6px 8px;
  padding: 0 10px;
  font-size: 14px;
}

.cooperation-box .cooperation-video .list .btns .btn1 {
  background-color: #f0f5ff;
  color: #1e5fdd;
}

.cooperation-box .cooperation-video .list .btns .btn2 {
  background-color: #fff4e2;
  color: #f0903e;
}

.cooperation-box .cooperation-video .list .btns .btn3 {
  background-color: #f0f5ff;
  color: #1e5fdd;
}

.cooperation-box .cooperation-video .list .btns .btn4 {
  background-color: #fff8f8;
  color: #f46464;
}

.cooperation-box .cooperation-problem {
  padding-top: 14px;
}

.cooperation-box .cooperation-problem .list {
  border-bottom: 1px dotted #b8bfd9;
  padding-bottom: 18px;
  padding-top: 16px;
}

.cooperation-box .cooperation-problem .list:last-child {
  border-bottom: none;
}

.cooperation-box .cooperation-problem .list .avatar {
  width: 71px;
  height: 71px;
  border-radius: 50%;
}

.cooperation-box .cooperation-problem .list .name {
  font-size: 14px;
  font-weight: bold;
  color: #0a0a0a;
  text-align: center;
  margin-top: 12px;
}

.cooperation-box .cooperation-problem .text-box {
  margin-left: 20px;
}

.cooperation-box .cooperation-problem .text-box .t1 {
  font-size: 18px;
  line-height: 30px;
  font-weight: bold;
  color: #282828;
}

.cooperation-box .cooperation-problem .text-box .dates {
  font-size: 14px;
  line-height: 30px;
  color: #888888;
}

.cooperation-box .cooperation-problem .btns {
  margin-top: 16px;
}

.cooperation-box .cooperation-problem .btns button {
  height: 34px;
  padding: 0 20px;
  border-radius: 17px;
  font-size: 14px;
}

.cooperation-box .cooperation-problem .btns .btn1 {
  background-color: #f0f5ff;
  color: #1e5fdd;
}

.cooperation-box .cooperation-problem .btns .btn2 {
  color: #f0903e;
  background-color: #fff4e2;
}

.cooperation-box .cooperation-problem .btns .btn3 {
  background-color: #f6f6f6;
  color: #000000;
}

.cooperation-box .cooperation-problem .right-bnt button {
  height: 34px;
  padding: 0 14px;
  border-radius: 17px;
  font-size: 14px;
}

.cooperation-box .cooperation-problem .right-bnt .btn1 {
  background-image: linear-gradient(90deg, #fcac5c 0%, #fb8838 100%), linear-gradient(#e76f25, #e76f25);
  background-blend-mode: normal, normal;
  color: #ffffff;
}

.cooperation-box .cooperation-problem .right-bnt .btn2 {
  background-image: linear-gradient(90deg, #5a89f4 0%, #3565dc 100%), linear-gradient(#1e5fdd, #1e5fdd);
  background-blend-mode: normal, normal;
  color: #ffffff;
}

.enclosure-download {
  margin-top: 26px;
}

.enclosure-download .list {
  width: 100%;
  height: 60px;
  border-radius: 6px;
  background-color: #f8f8f8;
  padding: 0 16px 0 32px;
}

.enclosure-download .list .btn1 {
  width: 80px;
  height: 32px;
  background-color: #ffffff;
  border-radius: 6px;
  border: solid 1px #1e5fdd;
  font-size: 14px;
  color: #1e5fdd;
  margin-left: 16px;
}

.mine-rate {
  margin-top: 28px;
}

.mine-rate .t1 {
  font-size: 16px;
  color: #0c0c0c;
}

.mine-rate .end-tips {
  font-size: 16px;
  color: #0c0c0c;
  margin-left: 14px;
}

.mine-rate .end-tips .attitude {
  margin-right: 14px;
  min-width: 35px;
}

.mine-rate .star_score {
  background: url(../images/stark2.png);
  width: 40px;
  height: 26px;
  position: relative;
  background-size: 40px 26px !important;
}

.mine-rate .star_score a {
  width: 40px;
  height: 26px;
  display: block;
  text-indent: -999em;
  position: absolute;
  left: 0;
  background-size: 40px 26px !important;
}

.mine-rate .star_score a:nth-child(2n) {
  margin-right: 2vw;
}

.mine-rate .star_score a:hover {
  background: url(../images/stars2.png);
  left: 0;
}

.mine-rate .star_score a.clibg {
  background: url(../images/stars2.png);
  left: 0;
}

.mine-rate #starttwo .star_score {
  background: url(../images/starky.png);
}

.mine-rate #starttwo .star_score a:hover {
  background: url(../images/starsy.png);
  left: 0;
}

.mine-rate #starttwo .star_score a.clibg {
  background: url(../images/starsy.png);
  left: 0;
}

.cooperation-info.community-info .right-box .userinfo .list .li {
  margin: 0;
}

.cooperation-info.community-info .left-box {
  background-color: transparent;
  padding: 0;
}

.cooperation-info.community-info .left-box .top-box {
  background-color: #ffffff;
  padding: 24px;
  border-radius: 6px;
}

.cooperation-info.community-info .left-box .reply-all {
  background-color: #ffffff;
  padding: 24px;
  border-radius: 6px;
  margin-top: 24px;
}

.cooperation-info.community-info .left-box .report-cooperation {
  background-color: transparent;
  color: #999999;
  margin-left: 32px;
}

.cooperation-info.community-info .left-box .report-cooperation .iconfont {
  font-size: 18px;
  margin-right: 4px;
}

.cooperation-videoinfo.community-info .reply-allbox {
  height: 223px;
  background-color: #f0f5ff;
  border-radius: 6px;
  border: solid 1px #dcdcdc;
  padding: 15px 18px;
}

.cooperation-videoinfo.community-info .reply-allbox textarea {
  width: 100%;
  height: 150px;
  background-color: transparent;
}

.cooperation-videoinfo.community-info .reply-allbox .btn1 {
  width: 82px;
  height: 35px;
  background-image: linear-gradient(90deg, #4e88f8 0%, #2464e0 100%), linear-gradient(#989898, #989898);
  background-blend-mode: normal, normal;
  border-radius: 17px;
  color: #ffffff;
  font-size: 14px;
}

.cooperation-videoinfo.community-info .replyall-title {
  font-weight: 700;
  font-size: 22px;
  color: #3d3d3d;
  line-height: 29px;
}

.cooperation-videoinfo.community-info .replyall-title::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 20px;
  background: #1e5fdd;
  position: relative;
  top: 2px;
  margin-right: 8px;
}

.cooperation-videoinfo.community-info .reply-all .sort {
  margin-top: 10px;
  padding-left: 20px;
}

.cooperation-videoinfo.community-info .reply-all .sort .date-box {
  margin-left: 26px;
}

.cooperation-videoinfo.community-info .reply-all .sort .text {
  font-size: 16px;
  color: #040a16;
  line-height: 21px;
}

.cooperation-videoinfo.community-info .reply-all .sort .active .text {
  color: #1e5fdd;
}

.cooperation-videoinfo.community-info .text-content {
  border-bottom: none;
}

.cooperation-videoinfo.community-info .left-box {
  width: calc(100% - 428px);
}

.cooperation-videoinfo.community-info .right-box {
  background-color: #ffffff;
  border-radius: 10px;
  width: 405px;
  padding: 24px 12px;
}

.cooperation-videoinfo.community-info .reply-list {
  padding-bottom: 26px;
  padding-top: 26px;
  position: relative;
  margin-top: 0;
}

.cooperation-videoinfo.community-info .reply-list .reply-box {
  width: calc(100% - 56px);
}

.cooperation-videoinfo.community-info .reply-list .reply-box .names {
  line-height: 22px;
}

.cooperation-videoinfo.community-info .reply-list .reply-box .names .givebox {
  margin-top: 2px;
}

.cooperation-videoinfo.community-info .reply-list .reply-box a.like,
.cooperation-videoinfo.community-info .reply-list .reply-box a.delete {
  margin-top: 10px;
}

.cooperation-videoinfo.community-info .reply-box .essence-comments {
  margin-top: 0;
}

.cooperation-videoinfo.community-info .reply-box .essence-comments.isselect {
  color: #282828;
  font-size: 14px;
}

.cooperation-videoinfo.community-info .show-cooperation {
  font-size: 14px;
  background-color: transparent;
  color: #999999;
  margin-left: 0px;
}

.cooperation-videoinfo.community-info .show-cooperation .iconfont {
  font-size: 18px;
  margin-right: 4px;
}

.cooperation-videoinfo.community-info .essence-btn {
  margin-top: 16px;
}

.cooperation-videoinfo.community-info .report-cooperation {
  font-size: 14px;
  background-color: transparent;
  color: #999999;
  margin-left: 32px;
}

.cooperation-videoinfo.community-info .report-cooperation .iconfont {
  font-size: 18px;
  margin-right: 4px;
}

.mskcooperation-list .msk-mskcooperation {
  margin-bottom: 16px;
  margin-top: 16px;
  position: relative;
}

.mskcooperation-list .msk-mskcooperation .li {
  margin-bottom: 16px;
}

.mskcooperation-list .msk-mskcooperation input {
  width: 350px;
  height: 56px;
  background-color: #f2f7fe;
  border-radius: 4px;
  border: solid 1px #eeeeee;
  padding: 0 24px;
  margin-right: 11px;
}

.mskcooperation-list .msk-mskcooperation button {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  margin-left: 19px;
  color: #ffffff;
}

.mskcooperation-list .msk-mskcooperation .add_btns {
  background-color: #1e5fdd;
}

.mskcooperation-list .msk-mskcooperation .reduce_btn {
  background-color: #e34d4d;
}

.tree-box .layui-tree .layui-tree-entry {
  height: auto;
}

.tree-box .layui-form-select .layui-input {
  height: auto;
  background: transparent;
  border: none;
  padding: 0;
  color: #757575 !important;
  font-size: 14px;
}

.invisible {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.96);
  z-index: 10;
}

.invisible .iconfont {
  font-size: 26px;
  color: #e13636;
}

.invisible div {
  font-size: 14px;
  line-height: 30px;
  letter-spacing: 0px;
  color: #666666;
  width: 250px;
}

header .red-btn {
  border: none;
  outline: none;
  line-height: 34px;
  height: 34px;
  border-radius: 19px;
  padding: 0 16px;
  margin-left: 16px;
  font-size: 14px;
  letter-spacing: 1px;
  background: #b7251e;
  color: #fff;
  position: relative;
}

header .red-btn:hover .post-box {
  z-index: 100;
  visibility: visible;
}

header .red-btn .post-box {
  position: absolute;
  left: 50%;
  width: 92px;
  margin-left: -46px;
  border-radius: 6px;
  background-color: #ffffff;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.08);
  padding: 4px;
  z-index: -1000;
  visibility: hidden;
  transition: all 0.36s;
}

header .red-btn .post-box a {
  display: block;
  height: 40px;
  line-height: 40px;
  background: transparent;
  width: 100%;
  text-align: center;
  color: #191919;
  font-size: 16px;
  font-family: "harmonyos";
  transition: all 0s;
}

header .red-btn .post-box a:hover {
  color: #b7251e;
}

.ebook-success-box{
  text-align: center;
  width: 500px;
  padding: 38px 30px;
  max-height: 90%;
  height: fit-content;
  background-color: #ffffff;
  border-radius: 14px;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  opacity: 1;
  transition: all 0.4s 0.1s;
  scrollbar-width: none;

 
} 
.ebook-success-box .close-newbtn{
    position: absolute;
    right: 20px;
    top: 20px;
    cursor: pointer;
}