@charset "UTF-8";
/* 全局样式修改 */
html,
body,
div,
span,
iframe,
map,
font,
img,
a img,
samp,
strong,
hr,
h1,
h2,
h3,
h4,
h5,
h6,
b,
p,
blockquote,
a,
address,
code,
dl,
dt,
dd,
ol,
ul,
li,
form,
label,
table,
tr,
td,
th {
  padding: 0;
  margin: 0;
  border: 0;
  font-weight: normal;
}

input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

input[type="number"] {
  -moz-appearance: textfield;
}

ol,
ul {
  list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
}

a:link {
  text-decoration: none;
}

a:visited {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

a:active {
  text-decoration: none;
}

i {
  font-style: normal;
}

a {
  text-decoration: none;
  color: #222222;
}

a:focus {
  outline: none;
}

a.hidefocus {
  outline: none;
}

.fl {
  float: left;
}

.fr {
  float: right;
}

input[type="text"],
input[type="submit"],
input[type="button"] {
  -webkit-appearance: none;
  /*去除iPhone input默认样式}*/
}

input {
  outline: none;
}

.clearfix:after {
  display: block;
  content: "";
  clear: both;
  height: 0;
  overflow: hidden;
}

.clearfix {
  zoom: 1;
}

body {
  margin-top: 0;
  margin-right: auto;
  margin-bottom: 0;
  margin-left: auto;
  font-size: 14px;
  background: #eff1f4;
  color: #222;
}

.clear {
  clear: both;
}

div,
ul,
li,
input {
  box-sizing: border-box;
}

em,
i,
strong {
  font-style: normal;
}

::-webkit-scrollbar {
  width: 3px;
  height: 5px;
}

::-webkit-scrollbar-thumb {
  border-radius: 1em;
  background: #999;
}

::-webkit-scrollbar-track {
  border-radius: 1em;
  background-color: rgba(46, 52, 68, 0.1);
}

.w {
  width: 1024px;
  margin: 0 auto;
}

figure {
  margin: 0;
}

@media screen and (max-width: 1000px) {
  .w {
    width: 100%;
    overflow: hidden;
  }
}

/* 头部 底部 */
.header {
  width: 100%;
  background: #fff;
  padding: 15px 0;
  box-sizing: border-box;
}

@media screen and (max-width: 1000px) {
  .header {
    padding: 15px 10px;
  }
}

@media screen and (max-width: 768px) {
  .header {
    padding: 0.2rem 0.13333rem;
  }
}

.header .headWsrap {
  display: flex;
  align-items: center;
  gap: 30px;
}

.header .headWsrap .headLogo img {
  width: 120px;
}

.header .headWsrap nav {
  flex: 1;
  overflow: auto;
}

.header .headWsrap nav ul {
  display: flex;
  gap: 10px;
}

.header .headWsrap nav ul li {
  border-radius: 25px;
}

.header .headWsrap nav ul li a {
  display: block;
  padding: 10px 30px;
  font-size: 16px;
  font-weight: bold;
  white-space: nowrap;
}

.header .headWsrap nav ul li:hover,
.header .headWsrap nav ul li.active {
  background: #002f7b;
}

.header .headWsrap nav ul li:hover a,
.header .headWsrap nav ul li.active a {
  color: #fff;
}

.header .headWsrap .account {
  display: flex;
  border: 1px solid #cfdae5;
  padding: 5px 15px;
  border-radius: 20px;
}

.header .headWsrap .account .login {
  display: flex;
  align-items: center;
  gap: 3px;
}

.header .headWsrap .account .login::after {
  content: "/";
  margin: 0 5px;
}

.header .headWsrap .account .login:last-child::after {
  display: none;
}

.header .headWsrap .account .login span {
  color: #113d84;
}

@media screen and (max-width: 768px) {
  .header .headWsrap {
    flex-wrap: wrap;
    gap: 0.2rem;
  }
  .header .headWsrap .headLogo {
    order: 1;
  }
  .header .headWsrap .headLogo img {
    width: fit-content;
    height: 0.6rem;
  }
  .header .headWsrap nav {
    order: 3;
    flex: auto;
    width: 100%;
  }
  .header .headWsrap nav ul {
    gap: 0.13333rem;
  }
  .header .headWsrap nav ul li {
    border-radius: 0.33333rem;
  }
  .header .headWsrap nav ul li a {
    padding: 0.13333rem 0.4rem;
    font-size: 0.32rem;
  }
  .header .headWsrap .account {
    order: 2;
    margin-left: auto;
    padding: 0.06667rem 0.2rem;
    border-radius: 0.26667rem;
  }
  .header .headWsrap .account .login span {
    font-size: 0.30667rem;
  }
}

.footer {
  width: 100%;
  height: fit-content;
}

.footer .copyright {
  background: #fff;
  padding: 50px 0;
}

.footer .copyright .business {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
}

.footer .copyright .business dl dt {
  font-weight: bold;
  margin-bottom: 15px;
}

.footer .copyright .business dl dd {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.footer .copyright .business dl dd a {
  white-space: nowrap;
}

.footer .disclosure {
  background: #1f2428;
  padding: 20px 0;
}

.footer .disclosure p {
  text-align: center;
  line-height: 20px;
  color: #fff;
}

.footer .disclosure p a {
  color: #fff;
}

@media screen and (max-width: 1000px) {
  .footer .copyright {
    padding: 35px 10px;
  }
  .footer .disclosure {
    padding: 20px 10px;
  }
}

@media screen and (max-width: 768px) {
  .footer .copyright {
    padding: 0.66667rem 0.13333rem;
  }
  .footer .copyright .business {
    grid-template-columns: auto;
    gap: 0.2rem;
  }
  .footer .copyright .business dl dt {
    margin-bottom: 0.2rem;
    font-size: 0.32rem;
  }
  .footer .copyright .business dl dd {
    gap: 0.13333rem;
  }
  .footer .copyright .business dl dd a {
    font-size: 0.32rem;
  }
  .footer .disclosure {
    padding: 0.26667rem 0.13333rem;
  }
  .footer .disclosure p {
    line-height: 0.53333rem;
    font-size: 0.32rem;
  }
  .footer .disclosure p a {
    font-size: 0.32rem;
  }
}

.quickly {
  width: 36px;
  position: fixed;
  bottom: 30%;
  cursor: pointer;
  z-index: 99998;
  right: 3%;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-50px);
  transition: all 200ms linear;
}

.quickly.active_goTop {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.quickly img {
  width: 100%;
}

.quickly:hover {
  animation: rubberBand 0.8s;
}

@media screen and (max-width: 768px) {
  .quickly {
    width: 0.8rem;
  }
}

@keyframes rubberBand {
  from {
    transform: scale3d(1, 1, 1);
  }
  30% {
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    transform: scale3d(1.05, 0.95, 1);
  }
  to {
    transform: scale3d(1, 1, 1);
  }
}

/* 提取 */
.worldGames.segment {
  max-height: 820px;
  overflow-y: auto;
}

@media screen and (max-width: 768px) {
  .worldGames.segment {
    max-height: 16rem;
  }
}

.worldGames ul li {
  display: grid;
  grid-template-columns: 2fr 3fr 2fr;
  align-items: center;
  padding: 10px 15px;
  border-bottom: 1px solid #e0e0e0;
  background: #fff;
}

.worldGames ul li .anticipate {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: center;
}

.worldGames ul li .anticipate .factsMent {
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 5px 10px;
  width: fit-content;
  background: #eaecef;
  border-radius: 5px;
}

.worldGames ul li .anticipate .factsMent.progress {
  background: #ffd1d1;
}

.worldGames ul li .anticipate .factsMent.progress .iconfont,
.worldGames ul li .anticipate .factsMent.progress span {
  color: #fd2026;
}

.worldGames ul li .anticipate .factsMent span {
  white-space: nowrap;
}

.worldGames ul li .anticipate time,
.worldGames ul li .anticipate .unite {
  text-align: center;
}

.worldGames ul li .struggle {
  display: grid;
  grid-template-columns: 3fr 2fr 3fr;
  align-items: center;
}

.worldGames ul li .struggle .entrant {
  width: 100%;
  overflow: hidden;
}

.worldGames ul li .struggle .entrant a {
  display: flex;
  align-items: center;
  gap: 10px;
}

.worldGames ul li .struggle .entrant a img {
  width: 30px;
}

.worldGames ul li .struggle .entrant a span {
  flex: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.worldGames ul li .struggle .entrant:first-child a span {
  text-align: right;
}

.worldGames ul li .struggle .panel {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
  font-weight: bold;
}

.worldGames ul li .struggle .panel .score {
  padding: 5px;
  background: #eaecef;
}

.worldGames ul li .watchGame {
  display: flex;
  align-items: center;
  justify-content: end;
}

.worldGames ul li .watchGame .channel {
  display: flex;
  align-items: center;
  margin-right: 5px;
  gap: 5px;
}

.worldGames ul li .watchGame .channel .serve {
  display: flex;
  align-items: center;
  gap: 3px;
}

.worldGames ul li .watchGame .channel .serve .icon-guankan {
  font-size: 20px;
  color: #4e6ea2;
}

.worldGames ul li .watchGame .channel a {
  color: #47689e;
}

.worldGames ul li .watchGame .serveMore {
  display: flex;
  align-items: center;
}

.worldGames ul li .watchGame .serveMore .icon-xiajiantou {
  color: #d05253;
}

.worldGames ul li:hover {
  background: #01307c;
}

.worldGames ul li:hover .anticipate .factsMent {
  background: #47689e;
}

.worldGames ul li:hover .anticipate .factsMent .iconfont,
.worldGames ul li:hover .anticipate .factsMent span {
  color: #fff;
}

.worldGames ul li:hover .anticipate time,
.worldGames ul li:hover .anticipate .unite {
  color: #fff;
}

.worldGames ul li:hover .struggle .entrant a span {
  color: #fff;
}

.worldGames ul li:hover .struggle .panel .score {
  background: #47689e;
}

.worldGames ul li:hover .struggle .panel span {
  color: #fff;
}

.worldGames ul li:hover .watchGame .channel .serve span {
  color: #fff;
}

.worldGames ul li:hover .watchGame .channel a {
  color: #fff;
}

.worldGames ul li:hover .watchGame .serveMore {
  color: #fff;
}

.worldGames ul li:hover .watchGame .serveMore .iconfont {
  color: #fff;
}

@media screen and (max-width: 768px) {
  .worldGames ul li {
    grid-template-columns: auto;
    gap: 0.13333rem;
    padding: 0.13333rem 0.2rem;
  }
  .worldGames ul li .anticipate .factsMent {
    padding: 0.06667rem 0.13333rem;
    border-radius: 0.06667rem;
  }
  .worldGames ul li .anticipate .factsMent span {
    font-size: 0.32rem;
  }
  .worldGames ul li .anticipate time,
  .worldGames ul li .anticipate .unite {
    font-size: 0.32rem;
  }
  .worldGames ul li .anticipate .unite {
    text-align: right;
  }
  .worldGames ul li .struggle .entrant a {
    gap: 0.13333rem;
  }
  .worldGames ul li .struggle .entrant a img {
    width: 0.4rem;
  }
  .worldGames ul li .struggle .entrant a span {
    font-size: 0.32rem;
  }
  .worldGames ul li .struggle .panel {
    gap: 0.06667rem;
  }
  .worldGames ul li .struggle .panel .score {
    padding: 0.06667rem;
  }
  .worldGames ul li .struggle .panel span {
    font-size: 0.32rem;
  }
  .worldGames ul li .watchGame {
    justify-content: space-between;
  }
  .worldGames ul li .watchGame .channel {
    margin-right: 0;
    gap: 0.06667rem;
  }
  .worldGames ul li .watchGame .channel .serve {
    gap: 0.04rem;
  }
  .worldGames ul li .watchGame .channel .serve .icon-guankan {
    font-size: 0.34667rem;
  }
  .worldGames ul li .watchGame .channel .serve .serveText {
    font-size: 0.32rem;
  }
  .worldGames ul li .watchGame .channel a {
    font-size: 0.32rem;
  }
  .worldGames ul li .watchGame .serveMore {
    font-size: 0.32rem;
  }
  .worldGames ul li .watchGame .serveMore .icon-xiajiantou {
    font-size: 0.32rem;
  }
}

.material {
  width: 100%;
}

.material ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
}

.material ul.subsidiary {
  grid-template-columns: repeat(2, 1fr);
}

.material ul li {
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
}

.material ul li .portend {
  height: 180px;
  position: relative;
}

.material ul li .portend img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.material ul li .portend .parts {
  width: 50px;
  height: 50px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.material ul li .excerpt {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 125px;
  padding: 10px;
  box-sizing: border-box;
}

.material ul li .excerpt p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 2;
}

.material ul li .excerpt .harvest {
  display: flex;
  justify-content: space-between;
}

.material ul li .excerpt .harvest .precise {
  display: flex;
  align-items: center;
  gap: 5px;
}

.material ul li .excerpt .harvest .precise img {
  width: 15px;
}

.material ul li:hover {
  background: #01307c;
}

.material ul li:hover .excerpt p {
  color: #fff;
}

.material ul li:hover .excerpt .harvest .precise time,
.material ul li:hover .excerpt .harvest .precise span {
  color: #fff;
}

@media screen and (max-width: 768px) {
  .material ul {
    gap: 0.2rem;
    grid-template-columns: repeat(2, 1fr);
  }
  .material ul li {
    border-radius: 0.13333rem;
  }
  .material ul li .portend {
    height: 2.4rem;
  }
  .material ul li .portend .parts {
    width: 0.66667rem;
    height: 0.66667rem;
  }
  .material ul li .excerpt {
    height: 1.66667rem;
    padding: 0.13333rem;
  }
  .material ul li .excerpt p {
    font-size: 0.30667rem;
  }
  .material ul li .excerpt .harvest .precise {
    gap: 0.06667rem;
  }
  .material ul li .excerpt .harvest .precise img {
    width: 0.26667rem;
  }
  .material ul li .excerpt .harvest .precise time,
  .material ul li .excerpt .harvest .precise span {
    font-size: 0.32rem;
  }
}

.leagueNav {
  height: fit-content;
  overflow: auto;
  margin-bottom: 20px;
}

.leagueNav ul {
  display: flex;
  gap: 15px;
}

.leagueNav ul li {
  background: #fff;
}

.leagueNav ul li a {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 10px 20px;
}

.leagueNav ul li a img {
  max-width: 32px;
  height: 20px;
}

.leagueNav ul li a span {
  white-space: nowrap;
}

.leagueNav ul li.active,
.leagueNav ul li:hover {
  background: #01307c;
}

.leagueNav ul li.active a span,
.leagueNav ul li:hover a span {
  color: #fff;
}

@media screen and (max-width: 768px) {
  .leagueNav {
    margin-bottom: 0.26667rem;
  }
  .leagueNav ul {
    gap: 0.2rem;
  }
  .leagueNav ul li a {
    padding: 0.13333rem 0.26667rem;
    gap: 0.06667rem;
  }
  .leagueNav ul li a img {
    width: 0.33333rem;
  }
  .leagueNav ul li a span {
    font-size: 0.32rem;
  }
}

/* 公用 */
.materials {
  display: flex;
  justify-content: space-between;
}

.materials .release,
.materials .trend {
  display: flex;
  align-items: center;
  gap: 5px;
}

.materials .release img,
.materials .trend img {
  width: 20px;
}

.materials time,
.materials span {
  font-weight: bold;
  font-size: 14px;
}

@media screen and (max-width: 768px) {
  .materials .release,
  .materials .trend {
    gap: 0.06667rem;
  }
  .materials .release img,
  .materials .trend img {
    width: 0.33333rem;
  }
  .materials time,
  .materials span {
    font-size: 0.30667rem;
  }
}

.pager {
  width: 100%;
  display: flex;
  justify-content: center;
  width: 100%;
  box-sizing: border-box;
  padding: 20px;
  margin-top: 20px;
}

.pager .pagination {
  display: flex;
  gap: 10px;
  user-select: none;
}

.pager .pagination li {
  width: auto;
  height: auto;
  padding: 3px 10px;
  border-radius: 5px;
  background: #fff;
}

.pager .pagination li span,
.pager .pagination li a {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  color: #002f7b;
  font-size: 14px;
}

.pager .pagination li .icon-zuojiantou,
.pager .pagination li .icon-youjiantou {
  color: #01307c !important;
  font-size: 10px;
}

.pager .pagination .active {
  background: #01307c;
}

.pager .pagination .active span {
  color: #fff;
}

.pager .pagination .disabled {
  cursor: pointer;
  user-select: none;
}

.pager .pagination .disabled span {
  color: #cdcdcd;
  white-space: nowrap;
}

.pager .pagination .omit {
  cursor: default;
  width: auto;
  border: none;
}

@media screen and (max-width: 768px) {
  .pager {
    padding: 0.26667rem;
    margin-top: 0.26667rem;
  }
  .pager .pagination {
    gap: 0.13333rem;
  }
  .pager .pagination li {
    padding: 0.06667rem 0.13333rem;
    border-radius: 0.06667rem;
    border-width: 0.04rem;
  }
  .pager .pagination li.Jump {
    display: none;
  }
  .pager .pagination li span,
  .pager .pagination li a {
    font-size: 0.34667rem;
  }
  .pager .pagination li .icon-zuojiantou,
  .pager .pagination li .icon-youjiantou {
    font-size: 0.21333rem;
  }
}

.accumulate {
  width: 100%;
  height: fit-content;
  margin: 15px 0;
  display: flex;
  align-items: center;
  gap: 5px;
}

.accumulate .iconfont {
  color: #01307c;
}

.accumulate ol {
  flex: 1;
  width: 0;
  overflow: hidden;
  display: flex;
}

.accumulate ol li::after {
  content: ">";
  margin: 0 10px;
}

.accumulate ol li:last-child {
  flex: 1;
  overflow: hidden;
}

.accumulate ol li:last-child a {
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  color: #01307c;
}

.accumulate ol li:last-child::after {
  display: none;
}

@media screen and (max-width: 768px) {
  .accumulate {
    gap: 0.06667rem;
    margin: 0.2rem 0;
  }
  .accumulate .iconfont {
    font-size: 0.32rem;
  }
  .accumulate ol li::after {
    margin: 0 0.13333rem;
  }
  .accumulate ol li a {
    font-size: 0.32rem;
  }
}

/* 首页 */
.mainWsrap {
  width: 100%;
  height: fit-content;
  background: url(../public/image/bannar.webp) no-repeat;
  background-position: top;
  background-size: 100%;
  padding-top: 150px;
}

@media screen and (max-width: 768px) {
  .mainWsrap {
    padding-top: 2rem;
  }
}

.mainWsrap .newspaper,
.mainWsrap .popular,
.mainWsrap .trending,
.mainWsrap .nominate,
.mainWsrap .schedule {
  width: 100%;
  height: fit-content;
  padding: 30px 0 60px;
  box-sizing: border-box;
}

@media screen and (max-width: 1000px) {
  .mainWsrap .newspaper,
  .mainWsrap .popular,
  .mainWsrap .trending,
  .mainWsrap .nominate,
  .mainWsrap .schedule {
    padding: 30px 10px 60px;
  }
}

@media screen and (max-width: 768px) {
  .mainWsrap .newspaper,
  .mainWsrap .popular,
  .mainWsrap .trending,
  .mainWsrap .nominate,
  .mainWsrap .schedule {
    padding: 0.4rem 0.13333rem 0.8rem;
  }
}

.mainWsrap .schedule {
  width: 100%;
  height: fit-content;
  padding: 35px 0;
  padding-top: 130px;
  box-sizing: border-box;
}

@media screen and (max-width: 1000px) {
  .mainWsrap .schedule {
    padding: 35px 10px;
    padding-top: 130px;
  }
}

@media screen and (max-width: 768px) {
  .mainWsrap .schedule {
    padding: 0.46667rem 0.13333rem;
    padding-top: 1.73333rem;
  }
}

.mainWsrap .schedule .itinerary {
  padding: 20px 10px;
  box-sizing: border-box;
  border-radius: 10px;
  background: url(../public/image/dark_bg.webp) no-repeat;
  background-size: 100% 100%;
}

@media screen and (max-width: 768px) {
  .mainWsrap .schedule .itinerary {
    padding: 0.13333rem;
    padding-top: 0.26667rem;
    border-radius: 0.13333rem;
  }
}

.mainWsrap .newspaper,
.mainWsrap .nominate {
  background: #eff1f4;
}

.mainWsrap .newspaper,
.mainWsrap .popular {
  background: url(../public/image/dark_bg.webp) no-repeat;
  background-size: 100% 100%;
}

.mainWsrap .coalesce {
  width: 100%;
  height: fit-content;
  margin-bottom: 15px;
}

.mainWsrap .coalesce .designate {
  display: flex;
  align-items: center;
  gap: 35px;
  margin-bottom: 15px;
}

.mainWsrap .coalesce .designate .slogan {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
}

.mainWsrap .coalesce .designate .slogan span {
  font-size: 18px;
}

.mainWsrap .coalesce .designate .slogan strong {
  font-size: 26px;
  font-weight: bold;
}

.mainWsrap .coalesce .designate .streak {
  flex: 1;
  height: 35px;
  background: url(../public/image/leftSide.png) no-repeat;
  background-size: 100% 100%;
}

.mainWsrap .coalesce .designate .streak:last-child {
  background: url(../public/image/rightSide.png) no-repeat;
  background-size: 100% 100%;
}

.mainWsrap .coalesce .designNav {
  width: 100%;
  overflow: auto;
}

.mainWsrap .coalesce .designNav ul {
  display: flex;
  gap: 10px;
}

.mainWsrap .coalesce .designNav ul li {
  background: #fff;
  border-radius: 20px;
}

.mainWsrap .coalesce .designNav ul li a {
  display: block;
  padding: 10px 20px;
  font-weight: bold;
  white-space: nowrap;
}

.mainWsrap .coalesce .designNav ul li:hover,
.mainWsrap .coalesce .designNav ul li.active {
  background: #002f7b;
}

.mainWsrap .coalesce .designNav ul li:hover a,
.mainWsrap .coalesce .designNav ul li.active a {
  color: #fff;
}

@media screen and (max-width: 768px) {
  .mainWsrap .coalesce {
    margin-bottom: 0.2rem;
  }
  .mainWsrap .coalesce .designate {
    gap: 0.46667rem;
    margin-bottom: 0.2rem;
  }
  .mainWsrap .coalesce .designate .slogan {
    gap: 0.06667rem;
  }
  .mainWsrap .coalesce .designate .slogan span {
    font-size: 0.32rem;
  }
  .mainWsrap .coalesce .designate .slogan strong {
    font-size: 0.4rem;
  }
  .mainWsrap .coalesce .designate .streak {
    height: 0.46667rem;
  }
  .mainWsrap .coalesce .designNav ul {
    gap: 0.13333rem;
  }
  .mainWsrap .coalesce .designNav ul li {
    border-radius: 0.26667rem;
  }
  .mainWsrap .coalesce .designNav ul li a {
    padding: 0.13333rem 0.26667rem;
    font-size: 0.32rem;
  }
}

.mainWsrap .muster {
  width: 100%;
}

.mainWsrap .muster ul {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 15px;
}

.mainWsrap .muster ul li {
  width: 100%;
}

.mainWsrap .muster ul li a {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 38px 0;
  gap: 10px;
  overflow: hidden;
  background: linear-gradient(90deg, #e0e0e0, #fefefe);
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}

.mainWsrap .muster ul li a img {
  width: fit-content;
  height: 80px;
}

.mainWsrap .muster ul li a strong {
  width: 100%;
  font-size: 16px;
  font-weight: bold;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  text-align: center;
  padding: 0 30px;
  box-sizing: border-box;
}

.mainWsrap .muster ul li:hover a {
  background: #002f7b;
  animation-name: flipInY;
  animation-duration: 1s;
  animation-fill-mode: both;
}

.mainWsrap .muster ul li:hover a strong {
  color: #fff;
}

@keyframes flipInY {
  0% {
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transition-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transition-timing-function: ease-in;
  }
  60% {
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }
  80% {
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }
  100% {
    transform: perspective(400px);
  }
}

@media screen and (max-width: 768px) {
  .mainWsrap .muster ul {
    grid-template-columns: repeat(3, 1fr);
    gap: 0.2rem;
  }
  .mainWsrap .muster ul li a {
    padding: 0.50667rem 0;
    gap: 0.13333rem;
  }
  .mainWsrap .muster ul li a img {
    height: 1.06667rem;
  }
  .mainWsrap .muster ul li a strong {
    font-size: 0.32rem;
  }
}

.mainWsrap .searches {
  width: 100%;
  padding: 20px;
  box-sizing: border-box;
  background: #fff;
}

.mainWsrap .searches ol {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}

.mainWsrap .searches ol li {
  border: 1px solid #d5d5d5;
  border-radius: 5px;
}

.mainWsrap .searches ol li a {
  display: flex;
  padding: 10px 20px;
  position: relative;
  overflow: hidden;
}

.mainWsrap .searches ol li a .iconfont {
  position: absolute;
  right: -25%;
  transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}

.mainWsrap .searches ol li a .searchTit {
  transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}

.mainWsrap .searches ol li:hover {
  border-color: #002f7b;
}

.mainWsrap .searches ol li:hover a .iconfont {
  right: 8px;
  color: #002f7b;
}

.mainWsrap .searches ol li:hover a .searchTit {
  color: #002f7b;
  transform: translateX(-12px);
}

@media screen and (max-width: 768px) {
  .mainWsrap .searches {
    padding: 0.26667rem;
  }
  .mainWsrap .searches ol {
    gap: 0.2rem;
  }
  .mainWsrap .searches ol li {
    border-radius: 0.06667rem;
  }
  .mainWsrap .searches ol li a {
    padding: 0.13333rem 0.26667rem;
  }
  .mainWsrap .searches ol li a .iconfont {
    font-size: 0.32rem;
  }
  .mainWsrap .searches ol li a .searchTit {
    font-size: 0.30667rem;
  }
}

.mainWsrap .presumeNews {
  width: 100%;
  flex-direction: column;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 15px;
}

.mainWsrap .presumeNews .newsWsrap {
  width: 100%;
  overflow: hidden;
  background: #fff;
  border-radius: 20px;
  padding: 10px;
  box-sizing: border-box;
}

.mainWsrap .presumeNews .newsWsrap .specify {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 10px;
  border-bottom: 1px solid #d5d5d5;
}

.mainWsrap .presumeNews .newsWsrap .specify .specifyTit {
  display: flex;
  align-items: center;
  gap: 3px;
}

.mainWsrap .presumeNews .newsWsrap .specify .specifyTit img {
  width: 25px;
}

.mainWsrap .presumeNews .newsWsrap .specify .specifyTit span {
  font-weight: bold;
}

.mainWsrap .presumeNews .newsWsrap .specify .rallyMore {
  display: flex;
  align-items: center;
}

.mainWsrap .presumeNews .newsWsrap .specify .rallyMore .iconfont {
  font-size: 10px;
}

.mainWsrap .presumeNews .newsWsrap ul {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.mainWsrap .presumeNews .newsWsrap ul li {
  width: 100%;
  height: 150px;
  background: #fff;
  border-bottom: 1px solid #d5d5d5;
  padding: 15px 0;
}

.mainWsrap .presumeNews .newsWsrap ul li:last-child {
  border-bottom: none;
}

.mainWsrap .presumeNews .newsWsrap ul li a {
  display: flex;
  width: 100%;
  height: 100%;
}
.mainWsrap .presumeNews .newsWsrap ul li a .trailer {
  width: 42%;
}
.mainWsrap .presumeNews .newsWsrap ul li a .trailer img {
  width: 100%;
  height: 100%;
  border-radius: 15px;
}

.mainWsrap .presumeNews .newsWsrap ul li a .unilateral {
  flex: 1;
  width: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 5px 10px;
  box-sizing: border-box;
}

.mainWsrap .presumeNews .newsWsrap ul li a .unilateral .fragment {
  display: flex;
  flex-direction: column;
}

.mainWsrap .presumeNews .newsWsrap ul li a .unilateral .fragment strong {
  display: block;
  width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  margin-bottom: 5px;
}

.mainWsrap .presumeNews .newsWsrap ul li a .unilateral .fragment p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 2;
}

.mainWsrap .presumeNews .newsWsrap ul li a .unilateral .harvest {
  display: flex;
  justify-content: space-between;
}

.mainWsrap .presumeNews .newsWsrap ul li a .unilateral .harvest .precise {
  display: flex;
  align-items: center;
  gap: 5px;
}

.mainWsrap .presumeNews .newsWsrap ul li a .unilateral .harvest .precise img {
  width: 15px;
}

.mainWsrap .presumeNews .newsWsrap ul li:hover a .unilateral .fragment strong {
  color: #002f7b;
}

.mainWsrap .presumeNews .newsWsrap ul li:hover a .unilateral .fragment p {
  color: #002f7b;
}

.mainWsrap .presumeNews .newsWsrap ul li:hover a .unilateral .harvest {
  display: flex;
  justify-content: space-between;
}

.mainWsrap
  .presumeNews
  .newsWsrap
  ul
  li:hover
  a
  .unilateral
  .harvest
  .precise
  time,
.mainWsrap
  .presumeNews
  .newsWsrap
  ul
  li:hover
  a
  .unilateral
  .harvest
  .precise
  span {
  color: #002f7b;
}

@media screen and (max-width: 768px) {
  .mainWsrap .presumeNews {
    grid-template-columns: auto;
    gap: 0.2rem;
  }
  .mainWsrap .presumeNews .newsWsrap {
    border-radius: 0.26667rem;
    padding: 0.13333rem;
  }
  .mainWsrap .presumeNews .newsWsrap .specify {
    padding-bottom: 0.13333rem;
  }
  .mainWsrap .presumeNews .newsWsrap .specify .specifyTit {
    gap: 0.04rem;
  }
  .mainWsrap .presumeNews .newsWsrap .specify .specifyTit img {
    width: 0.33333rem;
  }
  .mainWsrap .presumeNews .newsWsrap .specify .specifyTit span {
    font-size: 0.32rem;
  }
  .mainWsrap .presumeNews .newsWsrap .specify .rallyMore .iconfont {
    font-size: 0.21333rem;
  }
  .mainWsrap .presumeNews .newsWsrap .specify .rallyMore .moreText {
    font-size: 0.30667rem;
  }
  .mainWsrap .presumeNews .newsWsrap ul li {
    height: 2.66667rem;
    padding: 0.2rem 0;
  }
  .mainWsrap .presumeNews .newsWsrap ul li a .trailer img {
    border-radius: 0.2rem;
  }
  .mainWsrap .presumeNews .newsWsrap ul li a .unilateral {
    padding: 0.06667rem 0.13333rem;
  }
  .mainWsrap .presumeNews .newsWsrap ul li a .unilateral .fragment strong {
    margin-bottom: 0.06667rem;
    font-size: 0.32rem;
  }
  .mainWsrap .presumeNews .newsWsrap ul li a .unilateral .fragment p {
    font-size: 0.32rem;
  }
  .mainWsrap .presumeNews .newsWsrap ul li a .unilateral .harvest .precise {
    gap: 0.06667rem;
  }
  .mainWsrap .presumeNews .newsWsrap ul li a .unilateral .harvest .precise img {
    width: 0.33333rem;
  }
  .mainWsrap .presumeNews .newsWsrap ul li a .unilateral .harvest .precise span,
  .mainWsrap
    .presumeNews
    .newsWsrap
    ul
    li
    a
    .unilateral
    .harvest
    .precise
    time {
    font-size: 0.32rem;
  }
}

/* 非首页 */
.innerPage {
  width: 100%;
  padding: 0 0 50px;
  box-sizing: border-box;
}

@media screen and (max-width: 1000px) {
  .innerPage {
    padding: 0 10px 50px;
  }
}

@media screen and (max-width: 768px) {
  .innerPage {
    padding: 0 0.13333rem 0.66667rem;
  }
}

.exosphere {
  width: 100%;
  overflow: hidden;
  display: flex;
  gap: 20px;
}

.exosphere .crucial {
  flex: 1;
  width: 0;
}

.exosphere .peripheral {
  width: 30%;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.exosphere .peripheral .unaided {
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05);
}

@media screen and (max-width: 768px) {
  .exosphere .peripheral .unaided {
    border-radius: 10px;
  }
}

.exosphere .peripheral .unaided .describe {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  border-bottom: 1px solid #dedede;
}

.exosphere .peripheral .unaided .describe .refer_icon {
  display: flex;
  align-items: center;
  gap: 5px;
}

.exosphere .peripheral .unaided .describe .refer_icon img {
  width: 20px;
}

.exosphere .peripheral .unaided .describe .refer_icon span {
  font-size: 16px;
  font-weight: bold;
}

.exosphere .peripheral .unaided .describe a {
  display: flex;
  align-items: center;
}

.exosphere .peripheral .unaided .describe a .iconfont {
  font-size: 10px;
}

@media screen and (max-width: 768px) {
  .exosphere .peripheral .unaided .describe {
    padding: 0.2rem;
  }
  .exosphere .peripheral .unaided .describe .refer_icon {
    gap: 0.06667rem;
  }
  .exosphere .peripheral .unaided .describe .refer_icon img {
    width: 0.33333rem;
  }
  .exosphere .peripheral .unaided .describe .refer_icon span {
    font-size: 0.33333rem;
  }
  .exosphere .peripheral .unaided .describe a .more {
    font-size: 0.32rem;
  }
  .exosphere .peripheral .unaided .describe a .iconfont {
    font-size: 0.18667rem;
  }
}

.exosphere .peripheral .unaided .newsAside {
  width: 100%;
  height: fit-content;
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .exosphere .peripheral .unaided .newsAside {
    padding: 0.2rem;
    border-radius: 0.13333rem;
  }
}

.exosphere .peripheral .unaided .newsAside ul li {
  margin-bottom: 10px;
}

.exosphere .peripheral .unaided .newsAside ul li:last-child {
  margin-bottom: 0;
}

.exosphere .peripheral .unaided .newsAside ul li a {
  display: flex;
  align-items: center;
  gap: 15px;
}

.exosphere .peripheral .unaided .newsAside ul li a p {
  flex: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.exosphere .peripheral .unaided .newsAside ul li a time {
  white-space: nowrap;
  color: #9c9c9c;
}

@media screen and (max-width: 768px) {
  .exosphere .peripheral .unaided .newsAside ul li {
    margin-bottom: 0.13333rem;
  }
  .exosphere .peripheral .unaided .newsAside ul li a {
    gap: 0.2rem;
  }
  .exosphere .peripheral .unaided .newsAside ul li a p {
    font-size: 0.32rem;
  }
  .exosphere .peripheral .unaided .newsAside ul li a time {
    font-size: 0.33333rem;
  }
}

.exosphere .peripheral .unaided .videoAside {
  width: 100%;
  height: fit-content;
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .exosphere .peripheral .unaided .videoAside {
    padding: 0.2rem;
    border-radius: 0.13333rem;
  }
}

.exosphere .peripheral .unaided .videoAside ul li {
  margin-bottom: 10px;
}

.exosphere .peripheral .unaided .videoAside ul li:last-child {
  margin-bottom: 0;
}

.exosphere .peripheral .unaided .videoAside ul li .thumbnail {
  height: 125px;
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 10px;
}

.exosphere .peripheral .unaided .videoAside ul li .thumbnail .trailer {
  width: 100%;
  height: 100%;
}

.exosphere .peripheral .unaided .videoAside ul li .thumbnail .play {
  width: 50px;
  height: 50px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.exosphere .peripheral .unaided .videoAside ul li .thumbnail time {
  position: absolute;
  top: 5px;
  left: 5px;
  color: #fff;
}

.exosphere .peripheral .unaided .videoAside ul li .thumbnail time:last-child {
  top: unset;
  left: unset;
  bottom: 5px;
  right: 5px;
}

.exosphere .peripheral .unaided .videoAside ul li p {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .exosphere .peripheral .unaided .videoAside ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.2rem;
  }
  .exosphere .peripheral .unaided .videoAside ul li {
    width: 100%;
    overflow: hidden;
    margin-bottom: 0;
  }
  .exosphere .peripheral .unaided .videoAside ul li .thumbnail {
    height: 2.4rem;
    border-radius: 0.13333rem;
    margin-bottom: 0.13333rem;
  }
  .exosphere .peripheral .unaided .videoAside ul li .thumbnail .play {
    width: 0.86667rem;
    height: 0.86667rem;
  }
  .exosphere .peripheral .unaided .videoAside ul li .thumbnail time {
    top: 0.10667rem;
    left: 0.10667rem;
    font-size: 0.30667rem;
  }
  .exosphere .peripheral .unaided .videoAside ul li .thumbnail time:last-child {
    bottom: 0.10667rem;
    right: 0.10667rem;
  }
  .exosphere .peripheral .unaided .videoAside ul li p {
    font-size: 0.32rem;
  }
}

@media screen and (max-width: 768px) {
  .exosphere {
    flex-direction: column;
  }
  .exosphere .crucial {
    width: 100%;
  }
  .exosphere .peripheral {
    width: 100%;
    gap: 0.26667rem;
  }
}

.exordium {
  width: 100%;
  height: fit-content;
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .exordium {
    padding: 0.2rem;
    border-radius: 0.13333rem;
  }
}

.exordium h1 {
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.exordium .attribute {
  width: 100%;
  margin: 10px 0;
}

.exordium .attribute ol {
  display: flex;
  justify-content: center;
  gap: 20px;
}

.exordium .attribute ol li {
  display: flex;
  align-items: center;
  gap: 5px;
}

.exordium .attribute ol li img {
  width: 15px;
}

.exordium .attribute ol li strong,
.exordium .attribute ol li span,
.exordium .attribute ol li time {
  font-size: 13px;
}

@media screen and (max-width: 768px) {
  .exordium h1 {
    font-size: 0.34667rem;
  }
  .exordium .attribute {
    margin: 0.2rem 0;
  }
  .exordium .attribute ol {
    gap: 0.26667rem;
  }
  .exordium .attribute ol li {
    gap: 0.06667rem;
  }
  .exordium .attribute ol li img {
    width: 0.26667rem;
  }
  .exordium .attribute ol li strong,
  .exordium .attribute ol li span,
  .exordium .attribute ol li time {
    font-size: 0.30667rem;
  }
}

.siftBalls {
  width: 100%;
  height: fit-content;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 5px;
  margin-bottom: 20px;
}

.siftBalls .balls {
  width: 100%;
  background: #fff;
}

.siftBalls .balls a {
  padding: 10px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
}

.siftBalls .balls a strong {
  font-size: 16px;
  font-weight: bold;
}

.siftBalls .balls a img {
  width: 28px;
}

.siftBalls .balls.active,
.siftBalls .balls:hover {
  background: #01307c;
}

.siftBalls .balls.active a strong,
.siftBalls .balls:hover a strong {
  color: #fff;
}

@media screen and (max-width: 768px) {
  .siftBalls {
    margin-bottom: 0.26667rem;
    gap: 0.06667rem;
  }
  .siftBalls .balls a {
    padding: 0.2rem 0;
    gap: 0.06667rem;
  }
  .siftBalls .balls a strong {
    font-size: 0.32rem;
  }
  .siftBalls .balls a img {
    width: 0.42667rem;
  }
}

.onceWeek {
  width: 100%;
  height: fit-content;
  margin-bottom: 15px;
}

.onceWeek ul {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 10px;
}

.onceWeek ul li {
  width: 100%;
  border-radius: 5px;
  background: #fff;
}

.onceWeek ul li a {
  display: flex;
  flex-direction: column;
  text-align: center;
  justify-content: center;
  font-weight: bold;
  padding: 10px 0;
  gap: 3px;
}

.onceWeek ul li a span {
  font-weight: bold;
}

.onceWeek ul li.active,
.onceWeek ul li:hover {
  background: #01307c;
}

.onceWeek ul li.active a time,
.onceWeek ul li.active a span,
.onceWeek ul li:hover a time,
.onceWeek ul li:hover a span {
  color: #fff;
}

@media screen and (max-width: 1000px) {
  .onceWeek ul li {
    margin-right: 10px;
  }
  .onceWeek ul li:last-child {
    margin-right: 0;
  }
}

@media screen and (max-width: 768px) {
  .onceWeek {
    margin-bottom: 0.26667rem;
    overflow: auto;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05);
  }
  .onceWeek ul {
    gap: 0.13333rem;
  }
  .onceWeek ul li a {
    padding: 0.13333rem 0.4rem;
    gap: 0.04rem;
  }
  .onceWeek ul li a time,
  .onceWeek ul li a span {
    font-size: 0.30667rem;
  }
}

.stratify {
  display: flex;
  gap: 20px;
}

@media screen and (max-width: 768px) {
  .stratify {
    flex-direction: column;
    gap: 0.26667rem;
  }
}

.stratify .eventsNav {
  width: 210px;
  height: fit-content;
  border-radius: 10px;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

.stratify .eventsNav ul li {
  background: #fff;
  border-bottom: 1px solid #d5d5d5;
}

.stratify .eventsNav ul li:last-child {
  border-bottom: none;
}

.stratify .eventsNav ul li a {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 10px;
  justify-content: center;
}

.stratify .eventsNav ul li a img {
  width: 25px;
}

.stratify .eventsNav ul li a span {
  font-weight: bold;
}

.stratify .eventsNav ul li.active,
.stratify .eventsNav ul li:hover {
  background: #01307c;
}

.stratify .eventsNav ul li.active a,
.stratify .eventsNav ul li:hover a {
  color: #fff;
}

@media screen and (max-width: 768px) {
  .stratify .eventsNav {
    width: 100%;
    overflow: auto;
    border-radius: 0.13333rem;
  }
  .stratify .eventsNav ul {
    display: flex;
    gap: 0.26667rem;
  }
  .stratify .eventsNav ul li {
    border-bottom: none;
  }
  .stratify .eventsNav ul li a {
    gap: 0.06667rem;
    padding: 0.13333rem 0.26667rem;
  }
  .stratify .eventsNav ul li a img {
    width: 0.33333rem;
  }
  .stratify .eventsNav ul li a span {
    font-size: 0.32rem;
    white-space: nowrap;
  }
}

.stratify .pivotal {
  flex: 1;
}

.stratify .pivotal ul {
  width: 100%;
  height: fit-content;
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  overflow: hidden;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

@media screen and (max-width: 768px) {
  .stratify .pivotal ul {
    padding: 0.2rem;
    border-radius: 0.13333rem;
  }
}

.stratify .pivotal ul li {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 3fr 1fr;
  align-items: center;
  padding: 15px;
  border: 1px solid #d5d5d5;
  border-radius: 10px;
}

.stratify .pivotal ul li time {
  font-weight: bold;
  white-space: nowrap;
}

.stratify .pivotal ul li .fierce {
  display: grid;
  grid-template-columns: 3fr 1fr 3fr;
  align-items: center;
}

.stratify .pivotal ul li .fierce a {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-weight: bold;
}

.stratify .pivotal ul li .fierce a:first-child {
  text-align: right;
}

.stratify .pivotal ul li .fierce span {
  text-align: center;
  font-size: 16px;
  font-weight: bold;
}

.stratify .pivotal ul li .happen {
  text-align: right;
  font-weight: bold;
  white-space: nowrap;
}

@media screen and (max-width: 768px) {
  .stratify .pivotal ul {
    grid-template-columns: auto;
    gap: 0.26667rem;
  }
  .stratify .pivotal ul li {
    padding: 0.2rem;
    gap: 0.06667rem;
  }
  .stratify .pivotal ul li time {
    font-size: 0.32rem;
  }
  .stratify .pivotal ul li .fierce a,
  .stratify .pivotal ul li .fierce span {
    font-size: 0.32rem;
  }
  .stratify .pivotal ul li .happen {
    font-size: 0.32rem;
  }
}

.hotEvents {
  width: 100%;
  height: fit-content;
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  overflow: hidden;
  margin-top: 20px;
}

@media screen and (max-width: 768px) {
  .hotEvents {
    padding: 0.2rem;
    border-radius: 0.13333rem;
  }
}

.hotEvents .subject {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 15px;
}

.hotEvents .subject img {
  width: 20px;
}

.hotEvents .subject strong {
  font-size: 16px;
  font-weight: bold;
}

.hotEvents .ballLeague ul {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

@media screen and (max-width: 768px) {
  .hotEvents {
    margin-top: 0.26667rem;
  }
  .hotEvents .subject {
    gap: 0.13333rem;
    margin-bottom: 0.2rem;
  }
  .hotEvents .subject img {
    width: 0.33333rem;
  }
  .hotEvents .subject strong {
    font-size: 0.33333rem;
  }
  .hotEvents .ballLeague ul {
    gap: 0.2rem;
  }
  .hotEvents .ballLeague ul li a {
    font-size: 0.32rem;
  }
}

.newsUpdates {
  width: 100%;
}

.newsUpdates ul li {
  height: 200px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05);
  overflow: hidden;
  margin-bottom: 15px;
}

.newsUpdates ul li:last-child {
  margin-bottom: 0;
}

.newsUpdates ul li a {
  display: flex;
  height: 100%;
}

.newsUpdates ul li a .preview img {
  width: 300px;
  height: 100%;
}

.newsUpdates ul li a .remark {
  flex: 1;
  padding: 10px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}

.newsUpdates ul li a .remark .extract {
  width: 100%;
}

.newsUpdates ul li a .remark .extract .remarkTitle {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  margin-bottom: 10px;
  font-size: 16px;
}

.newsUpdates ul li a .remark .extract p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 3;
}

.newsUpdates ul li a .remark .harvest {
  display: flex;
  justify-content: space-between;
}

.newsUpdates ul li a .remark .harvest .precise {
  display: flex;
  align-items: center;
  gap: 5px;
}

.newsUpdates ul li a .remark .harvest .precise img {
  width: 20px;
}

.newsUpdates ul li:hover {
  background: #01307c;
}

.newsUpdates ul li:hover a .extract .remarkTitle,
.newsUpdates ul li:hover a .extract p {
  color: #fff;
}

.newsUpdates ul li:hover a .harvest .precise span,
.newsUpdates ul li:hover a .harvest .precise time {
  color: #fff;
}

@media screen and (max-width: 768px) {
  .newsUpdates ul li {
    height: 2.66667rem;
    border-radius: 0.13333rem;
    margin-bottom: 0.26667rem;
  }
  .newsUpdates ul li a .preview img {
    width: 4.26667rem;
  }
  .newsUpdates ul li a .remark {
    padding: 0.13333rem;
  }
  .newsUpdates ul li a .remark .extract .remarkTitle {
    margin-bottom: 0.13333rem;
    font-size: 0.33333rem;
  }
  .newsUpdates ul li a .remark .extract p {
    font-size: 0.30667rem;
  }
  .newsUpdates ul li a .remark .harvest .precise {
    gap: 0.06667rem;
  }
  .newsUpdates ul li a .remark .harvest .precise img {
    width: 0.33333rem;
  }
  .newsUpdates ul li a .remark .harvest .precise span,
  .newsUpdates ul li a .remark .harvest .precise time {
    font-size: 0.30667rem;
  }
}

.connive {
  width: 100%;
  width: 100%;
  height: fit-content;
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .connive {
    padding: 0.2rem;
    border-radius: 0.13333rem;
  }
}

.connive .postpone {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}

.connive .postpone h1 {
  font-size: 15px;
  font-weight: bold;
  white-space: nowrap;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  display: flex;
  align-items: center;
  gap: 6px;
}

.connive .postpone h1::before {
  content: "";
  width: 3px;
  height: 10px;
  background: #002f7b;
  border-radius: 4px;
}

.connive .postpone time {
  font-size: 12px;
  font-weight: bold;
  color: #717171;
}

.connive .foundation {
  display: flex;
  align-items: center;
  margin: 12px 0;
  gap: 3px;
}

.connive .foundation img {
  width: 20px;
}

.connive .foundation span {
  font-weight: bold;
  color: #686868;
  font-size: 12px;
}

.connive .tidy {
  width: 100%;
}

.connive .tidy ul {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.connive .tidy ul li {
  white-space: nowrap;
  user-select: none;
}

.connive .tidy ul li a {
  padding: 5px 10px;
  box-sizing: border-box;
  background: #e6f0ff;
  color: #002f7b;
  font-size: 12px;
  font-weight: bold;
  border-radius: 4px;
}

.connive .solution {
  width: 100%;
  white-space: nowrap;
  margin-top: 26px;
}

.connive .solution ul {
  width: 100%;
}

.connive .solution ul li {
  border-bottom: 1px solid #c1d7db;
  padding: 10px 5px;
  box-sizing: border-box;
}

.connive .solution ul li:last-child {
  border-bottom: none;
}

.connive .solution ul li a {
  width: 100%;
  overflow: hidden;
  display: flex;
  align-items: center;
  gap: 6px;
}

.connive .solution ul li a img {
  width: 17px;
  height: fit-content;
}

.connive .solution ul li a p {
  font-size: 12px;
  font-weight: bold;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}

.connive .regard {
  width: 100%;
  white-space: nowrap;
  margin-top: 32px;
}

.connive .regard .unfurl {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: bold;
  color: #333333;
}

.connive .regard .unfurl::before {
  content: "";
  width: 3px;
  height: 10px;
  background: #002f7b;
  border-radius: 4px;
}

@media screen and (max-width: 768px) {
  .connive .postpone {
    gap: 3.06667vw;
  }
  .connive .postpone h1 {
    font-size: 3.2vw;
    gap: 0.66667vw;
  }
  .connive .postpone h1::before {
    width: 0.8vw;
    height: 2.66667vw;
    border-radius: 0.8vw;
  }
  .connive .postpone time {
    font-size: 2.66667vw;
  }
  .connive .foundation {
    margin: 2.93333vw 0;
    gap: 0.66667vw;
  }
  .connive .foundation img {
    width: 3.46667vw;
  }
  .connive .foundation span {
    font-size: 2.66667vw;
  }
  .connive .tidy ul {
    gap: 2.93333vw;
  }
  .connive .tidy ul li a {
    padding: 0.8vw 1.6vw;
    font-size: 2.93333vw;
    border-radius: 0.8vw;
  }
  .connive .solution {
    margin-top: 4.26667vw;
  }
  .connive .solution ul li {
    padding: 1.6vw 0.8vw;
  }
  .connive .solution ul li a {
    gap: 1.06667vw;
  }
  .connive .solution ul li a img {
    width: 2.66667vw;
  }
  .connive .solution ul li a p {
    font-size: 2.93333vw;
  }
  .connive .regard {
    margin-top: 4.8vw;
  }
  .connive .regard .unfurl {
    gap: 0.66667vw;
  }
  .connive .regard .unfurl::before {
    width: 0.8vw;
    height: 2.66667vw;
    border-radius: 0.8vw;
  }
}

.problem {
  height: fit-content;
}

.problem ul {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.problem ul li {
  background: #ffffff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  overflow: hidden;
}

.problem ul li a {
  display: block;
  width: 100%;
  padding: 20px;
  box-sizing: border-box;
}

.problem ul li a .linchpin {
  border-bottom: 1px solid #dde4ef;
  padding-bottom: 10px;
  margin-bottom: 10px;
}

.problem ul li a .linchpin .subject {
  display: flex;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 10px;
}

.problem ul li a .linchpin .subject .addTitle {
  flex: 1;
  font-size: 16px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.problem ul li a .linchpin .subject .choice {
  border-radius: 15px;
  padding: 5px 15px;
  background: #eef1f7;
}

.problem ul li a .linchpin p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 2;
}

.problem ul li a .establish {
  display: flex;
  justify-content: space-between;
}

.problem ul li a .establish .harvest {
  display: flex;
  gap: 15px;
}

.problem ul li a .establish .harvest .amass {
  display: flex;
  gap: 5px;
  align-items: center;
}

.problem ul li a .establish .harvest .amass img {
  width: 20px;
}

.problem ul li a .establish .harvest .amass span {
  color: #7f8b97;
}

.problem ul li a .establish .creation {
  display: flex;
  align-items: center;
  gap: 5px;
}

.problem ul li a .establish .creation img {
  width: 20px;
}

.problem ul li a .establish .creation span {
  color: #7f8b97;
}

.problem ul li:hover {
  background: #f5f7fa;
}

@media screen and (max-width: 768px) {
  .problem ul {
    gap: 2.66667vw;
  }
  .problem ul li {
    border-radius: 0.13333rem;
  }
  .problem ul li a {
    padding: 2.66667vw;
  }
  .problem ul li a .linchpin {
    padding-bottom: 1.33333vw;
    margin-bottom: 1.33333vw;
  }
  .problem ul li a .linchpin .subject {
    gap: 4vw;
    margin-bottom: 1.33333vw;
  }
  .problem ul li a .linchpin .subject .addTitle {
    font-size: 3.33333vw;
  }
  .problem ul li a .linchpin .subject .choice {
    border-radius: 2vw;
    padding: 0.66667vw 2vw;
    font-size: 3.2vw;
  }
  .problem ul li a .linchpin p {
    font-size: 3.06667vw;
  }
  .problem ul li a .establish .harvest {
    gap: 2vw;
  }
  .problem ul li a .establish .harvest .amass {
    gap: 0.66667vw;
  }
  .problem ul li a .establish .harvest .amass img {
    width: 2.66667vw;
  }
  .problem ul li a .establish .harvest .amass span {
    font-size: 3.2vw;
  }
  .problem ul li a .establish .creation {
    gap: 0.66667vw;
  }
  .problem ul li a .establish .creation img {
    width: 2.66667vw;
  }
  .problem ul li a .establish .creation span {
    font-size: 3.2vw;
  }
}

.solution {
  background: #ffffff;
  padding: 20px;
  box-sizing: border-box;
}

@media screen and (max-width: 768px) {
  .solution {
    padding: 2.66667vw;
  }
}

.solution .itself {
  margin-bottom: 15px;
}

.solution .itself .matter .subject {
  display: block;
  font-size: 16px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-bottom: 15px;
}

.solution .itself .establish {
  margin-top: 15px;
  display: flex;
  justify-content: space-between;
}

.solution .itself .establish .harvest {
  display: flex;
  gap: 15px;
}

.solution .itself .establish .harvest .amass {
  display: flex;
  gap: 5px;
  align-items: center;
  padding: 5px 15px;
  border: 1px solid transparent;
  user-select: none;
  border-radius: 15px;
  overflow: hidden;
}

.solution .itself .establish .harvest .amass img {
  width: 20px;
}

.solution .itself .establish .harvest .amass span {
  color: #7f8b97;
}

.solution .itself .establish .harvest .amass:nth-child(1) {
  border-color: #013384;
}

.solution .itself .establish .harvest .amass:nth-child(1):hover {
  background: #013384;
}

.solution .itself .establish .harvest .amass:nth-child(1):hover span {
  color: #fff;
}

.solution .itself .establish .harvest .amass:nth-child(2) {
  border-color: #f32c2c;
}

.solution .itself .establish .harvest .amass:nth-child(2):hover {
  background: #f32c2c;
}

.solution .itself .establish .harvest .amass:nth-child(2):hover span {
  color: #fff;
}

.solution .itself .establish .harvest .amass:nth-child(3) {
  border-color: #4cc9f0;
}

.solution .itself .establish .harvest .amass:nth-child(3):hover {
  background: #4cc9f0;
}

.solution .itself .establish .harvest .amass:nth-child(3):hover span {
  color: #fff;
}

.solution .itself .establish .creation {
  display: flex;
  align-items: center;
  gap: 5px;
}

.solution .itself .establish .creation img {
  width: 20px;
}

@media screen and (max-width: 768px) {
  .solution .itself {
    margin-bottom: 2vw;
  }
  .solution .itself .matter .subject {
    font-size: 3.33333vw;
    margin-bottom: 2vw;
  }
  .solution .itself .matter p {
    font-size: 3.06667vw;
  }
  .solution .itself .establish {
    margin-top: 2vw;
  }
  .solution .itself .establish .harvest {
    gap: 2vw;
  }
  .solution .itself .establish .harvest .amass {
    gap: 0.66667vw;
    padding: 0.66667vw 2vw;
    border-radius: 2vw;
  }
  .solution .itself .establish .harvest .amass img {
    width: 2.66667vw;
  }
  .solution .itself .establish .harvest .amass span {
    font-size: 3.2vw;
  }
  .solution .itself .establish .creation {
    gap: 0.66667vw;
  }
  .solution .itself .establish .creation img {
    width: 2.66667vw;
  }
  .solution .itself .establish .creation span {
    font-size: 3.2vw;
  }
}

.solution .splitLine {
  display: flex;
  align-items: center;
  gap: 20px;
}

.solution .splitLine .sumUp {
  font-size: 16px;
}

.solution .splitLine .line {
  flex: 1;
  height: 1px;
  background: #dde4ef;
}

.solution .splitLine .heated a {
  color: #12418c;
}

@media screen and (max-width: 768px) {
  .solution .splitLine {
    gap: 2.66667vw;
  }
  .solution .splitLine .sumUp {
    font-size: 3.33333vw;
  }
  .solution .splitLine .heated .topic {
    font-size: 3.06667vw;
  }
  .solution .splitLine .heated a {
    font-size: 3.06667vw;
  }
}

.solution .related {
  margin-top: 20px;
}

.solution .related ul {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.solution .related ul li {
  border-bottom: 1px solid #dde4ef;
}

.solution .related ul li a p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 3;
}

.solution .related ul li a .establish {
  display: flex;
  justify-content: space-between;
  margin: 15px 0;
}

.solution .related ul li a .establish .harvest {
  display: flex;
  gap: 15px;
}

.solution .related ul li a .establish .harvest .amass {
  display: flex;
  gap: 5px;
  align-items: center;
}

.solution .related ul li a .establish .harvest .amass img {
  width: 20px;
}

.solution .related ul li a .establish .harvest .amass span {
  color: #7f8b97;
}

.solution .related ul li a .establish .creation {
  display: flex;
  align-items: center;
  gap: 5px;
}

.solution .related ul li a .establish .creation img {
  width: 20px;
}

.solution .related ul li a .establish .creation span {
  color: #7f8b97;
}

@media screen and (max-width: 768px) {
  .solution .related {
    margin-top: 2.66667vw;
  }
  .solution .related ul {
    gap: 2vw;
  }
  .solution .related ul li a p {
    font-size: 3.06667vw;
  }
  .solution .related ul li a .establish {
    margin: 2vw 0;
  }
  .solution .related ul li a .establish .harvest {
    gap: 2vw;
  }
  .solution .related ul li a .establish .harvest .amass {
    gap: 0.66667vw;
  }
  .solution .related ul li a .establish .harvest .amass img {
    width: 2.66667vw;
  }
  .solution .related ul li a .establish .harvest .amass span {
    font-size: 3.2vw;
  }
  .solution .related ul li a .establish .creation {
    gap: 0.66667vw;
  }
  .solution .related ul li a .establish .creation img {
    width: 2.66667vw;
  }
  .solution .related ul li a .establish .creation span {
    font-size: 3.2vw;
  }
}

.afterword {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
}

.afterword p {
  text-indent: 2em;
  line-height: 22px;
}

.afterword img {
  width: 80%;
  border-radius: 10px;
}

@media screen and (max-width: 768px) {
  .afterword {
    gap: 0.2rem;
  }
  .afterword p {
    text-indent: 0.26667rem;
    line-height: 0.46667rem;
    font-size: 0.32rem;
  }
  .afterword img {
    width: 100%;
    border-radius: 0.13333rem;
  }
}

.effortless {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 30px;
}

.effortless .passage {
  width: 100%;
  overflow: hidden;
  border: 1px solid #dedede;
  border-radius: 20px;
  overflow: hidden;
}

.effortless .passage a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 15px;
}

.effortless .passage a span {
  white-space: nowrap;
  font-size: 13px;
  font-weight: bold;
}

.effortless .passage a p {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 13px;
  color: #999;
}

@media screen and (max-width: 768px) {
  .effortless {
    grid-template-columns: auto;
    gap: 0.26667rem;
    margin-top: 0.4rem;
  }
  .effortless .passage {
    border-radius: 0.2rem;
  }
  .effortless .passage a {
    gap: 0.13333rem;
    padding: 0.2rem;
  }
  .effortless .passage a span,
  .effortless .passage a p {
    font-size: 0.30667rem;
  }
}

.standout {
  width: 100%;
  height: 300px;
  position: relative;
  border-radius: 10px;
  overflow: hidden;
}

.standout .browse {
  width: 100%;
  height: 100%;
}

.standout .play_icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 65px;
  height: 65px;
}

.standout time {
  position: absolute;
  top: 10px;
  left: 10px;
  color: #fff;
  font-weight: bold;
}

.standout time:last-child {
  top: unset;
  left: unset;
  bottom: 10px;
  right: 10px;
}

@media screen and (max-width: 768px) {
  .standout {
    height: 4rem;
    border-radius: 0.13333rem;
  }
  .standout .play_icon {
    width: 1.06667rem;
    height: 1.06667rem;
  }
  .standout time {
    top: 0.13333rem;
    left: 0.13333rem;
    font-size: 0.32rem;
  }
  .standout time:last-child {
    bottom: 0.13333rem;
    right: 0.13333rem;
  }
}

.sketch {
  margin-bottom: 15px;
}

.sketch ul {
  margin-bottom: 10px;
}

.sketch ul li {
  margin-bottom: 10px;
}

.sketch ul li:last-child {
  margin-bottom: 0;
}

.sketch .website p {
  margin-bottom: 10px;
}

.sketch .website p:last-child {
  margin-bottom: 0;
}

@media screen and (max-width: 768px) {
  .sketch {
    margin-bottom: 0.2rem;
  }
  .sketch ul {
    margin-bottom: 0.13333rem;
  }
  .sketch ul li {
    margin-bottom: 0.13333rem;
  }
  .sketch ul li strong,
  .sketch ul li a {
    font-size: 0.32rem;
  }
  .sketch .website p {
    margin-bottom: 0.13333rem;
    font-size: 0.32rem;
  }
}

.series {
  margin-top: 20px;
  width: 100%;
  height: fit-content;
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .series {
    padding: 0.2rem;
    border-radius: 0.13333rem;
  }
}

.series .scene {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 15px;
}

.series .scene img {
  width: 20px;
}

.series .scene strong {
  font-size: 16px;
}

.series .associated ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 15px;
}

.series .associated ul li a .seriesCover {
  height: 145px;
  position: relative;
  margin-bottom: 10px;
}

.series .associated ul li a .seriesCover .gallery {
  width: 100%;
  height: 100%;
  border-radius: 10px;
}

.series .associated ul li a .seriesCover .playIcon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50px;
  height: 50px;
}

.series .associated ul li a .seriesCover time {
  position: absolute;
  top: 5px;
  left: 5px;
  color: #fff;
}

.series .associated ul li a .seriesCover time:last-child {
  top: unset;
  left: unset;
  bottom: 5px;
  right: 5px;
}

.series .associated ul li a p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 2;
}

@media screen and (max-width: 768px) {
  .series {
    margin-top: 0.26667rem;
  }
  .series .scene {
    gap: 0.06667rem;
    margin-bottom: 0.2rem;
  }
  .series .scene img {
    width: 0.26667rem;
  }
  .series .scene strong {
    font-size: 0.33333rem;
  }
  .series .associated ul {
    gap: 0.2rem;
  }
  .series .associated ul li a .seriesCover {
    height: 2.4rem;
    margin-bottom: 0.13333rem;
  }
  .series .associated ul li a .seriesCover .gallery {
    border-radius: 0.13333rem;
  }
  .series .associated ul li a .seriesCover .playIcon {
    width: 0.66667rem;
    height: 0.66667rem;
  }
  .series .associated ul li a .seriesCover time {
    top: 0.06667rem;
    left: 0.06667rem;
    font-size: 0.30667rem;
  }
  .series .associated ul li a .seriesCover time:last-child {
    bottom: 0.06667rem;
    right: 0.06667rem;
  }
  .series .associated ul li a p {
    font-size: 0.32rem;
  }
}

.wonderful {
  width: 100%;
  height: 300px;
  position: relative;
  background: url(../public/image/matchs_lanqiu_bg.webp) no-repeat;
  background-size: 100% 100%;
  border-radius: 10px;
  overflow: hidden;
}

.wonderful .additional {
  position: absolute;
  width: 100%;
  overflow: hidden;
  background: rgba(0, 15, 56, 0.3);
}

.wonderful .additional a {
  display: flex;
  padding: 10px;
}

.wonderful .additional a strong {
  color: #fff;
}

.wonderful .additional a p {
  flex: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  color: #fff;
}

.wonderful .dispute {
  height: 100%;
  display: grid;
  grid-template-columns: 3fr 2fr 3fr;
  align-items: center;
}

.wonderful .dispute .troops a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.wonderful .dispute .troops a img {
  width: 80px;
}

.wonderful .dispute .troops a strong {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 16px;
  color: #fff;
}

.wonderful .dispute .coming {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
}

.wonderful .dispute .coming time {
  color: #fff;
  font-size: 16px;
}

.wonderful .dispute .coming .ratio {
  display: flex;
  gap: 5px;
}

.wonderful .dispute .coming .ratio span {
  color: #fff;
  font-size: 24px;
}

.wonderful .dispute .coming a {
  color: #fff;
}

@media screen and (max-width: 768px) {
  .wonderful {
    height: 4.8rem;
    border-radius: 0.13333rem;
  }
  .wonderful .additional a {
    padding: 0.2rem;
  }
  .wonderful .additional a strong,
  .wonderful .additional a p {
    font-size: 0.30667rem;
  }
  .wonderful .dispute .troops a {
    gap: 0.13333rem;
  }
  .wonderful .dispute .troops a img {
    width: 1.33333rem;
  }
  .wonderful .dispute .troops a strong {
    font-size: 0.32rem;
  }
  .wonderful .dispute .coming {
    gap: 0.2rem;
  }
  .wonderful .dispute .coming time {
    font-size: 0.32rem;
  }
  .wonderful .dispute .coming .ratio {
    gap: 0.06667rem;
  }
  .wonderful .dispute .coming .ratio span {
    font-size: 0.4rem;
    font-weight: bold;
  }
  .wonderful .dispute .coming a {
    font-size: 0.30667rem;
  }
}

.critical {
  text-indent: 2em;
  line-height: 23px;
  margin-top: 10px;
}

@media screen and (max-width: 768px) {
  .critical {
    font-size: 0.30667rem;
    text-indent: 0.26667rem;
    line-height: 0.46667rem;
    margin-top: 0.13333rem;
  }
}

.concern {
  width: 100%;
  height: fit-content;
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  overflow: hidden;
  margin-top: 20px;
}

@media screen and (max-width: 768px) {
  .concern {
    padding: 0.2rem;
    border-radius: 0.13333rem;
  }
}

.concern .concernNav {
  width: 100%;
  height: fit-content;
  overflow: hidden;
  margin-bottom: 20px;
}

.concern .concernNav ul {
  display: flex;
  justify-content: center;
  gap: 20px;
}

.concern .concernNav ul li {
  padding: 10px 20px;
  border-radius: 20px;
  box-sizing: border-box;
  cursor: pointer;
  font-size: 16px;
  font-weight: bold;
  white-space: nowrap;
}

.concern .concernNav ul li.active,
.concern .concernNav ul li:hover {
  background: #002f7b;
  color: #fff;
}

@media screen and (max-width: 768px) {
  .concern .concernNav {
    margin-bottom: 0.26667rem;
  }
  .concern .concernNav ul {
    gap: 0;
    justify-content: space-around;
  }
  .concern .concernNav ul li {
    padding: 0.13333rem 0.26667rem;
    font-size: 0.32rem;
  }
}

.concern .narrate {
  width: 100%;
  height: fit-content;
  overflow: hidden;
}

.concern .narrate ol {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.concern .narrate ol li {
  width: 100%;
}

.concern .narrate ol li span {
  white-space: nowrap;
}

.concern .narrate .vendor {
  display: flex;
  align-items: center;
  margin: 10px 0;
}

.concern .narrate .vendor span {
  white-space: nowrap;
}

.concern .narrate .vendor ul {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.concern .narrate .vendor ul li {
  animation: shrink 2s ease-out infinite;
}

.concern .narrate .vendor ul li a {
  color: #002f7b;
}

@keyframes shrink {
  0%,
  100% {
    transform: translateY(0) scale(1);
  }
  50% {
    transform: translateY(5%) scale(1.08);
  }
}

.concern .narrate .notes {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

@media screen and (max-width: 768px) {
  .concern .narrate ol {
    gap: 0.13333rem;
  }
  .concern .narrate ol li {
    font-size: 0.30667rem;
  }
  .concern .narrate ol li time,
  .concern .narrate ol li a,
  .concern .narrate ol li span {
    font-size: 0.30667rem;
  }
  .concern .narrate .vendor {
    margin: 0.13333rem 0;
  }
  .concern .narrate .vendor span {
    font-size: 0.30667rem;
  }
  .concern .narrate .vendor ul {
    gap: 0.06667rem;
  }
  .concern .narrate .vendor ul li a {
    font-size: 0.30667rem;
  }
  .concern .narrate .notes {
    gap: 0.13333rem;
  }
  .concern .narrate .notes p {
    font-size: 0.30667rem;
  }
}

.concern .abstract {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.concern .abstract .summary {
  width: 100%;
}

.concern .abstract .summary .predict {
  display: block;
  grid-column: span 2;
  text-align: center;
  padding: 10px 0;
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
}

.concern .abstract .summary .property {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 60px;
}

.concern .abstract .summary .property::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 3px;
  height: 100%;
  background: #b0b1b1;
}

.concern .abstract .summary .property .factual {
  width: 100%;
  height: fit-content;
  box-sizing: border-box;
  border-radius: 5px;
}

.concern .abstract .summary .property .factual ol {
  position: relative;
  width: 100%;
  height: fit-content;
  box-sizing: border-box;
}

.concern .abstract .summary .property .factual ol li {
  width: 100%;
  height: fit-content;
  padding: 8px;
  box-sizing: border-box;
  margin-bottom: 20px;
  letter-spacing: 2px;
  border-radius: 5px;
}

.concern .abstract .summary .property .factual ol li p {
  font-weight: bold;
}

.concern .abstract .summary .property .factual ol li:last-child {
  margin-bottom: 0;
}

.concern .abstract .summary .property .factual ol li.tidings-level-0 p {
  color: #0f723c;
}

.concern .abstract .summary .property .factual ol li.tidings-level-1 p {
  color: #fb2828;
}

.concern .abstract .summary .property .factual ol li.tidings-level-2 p {
  color: #ff7e00;
}

.concern .abstract .summary .property .factual ol li.tidings-level-3 p {
  color: #4b8bc1;
}

.concern .abstract .summary .property .factual ol li.tidings-level-4 p {
  color: #20b363;
}

.concern .abstract .summary .property .factual ol li.tidings-level-5 p {
  color: #b863dc;
}

.concern .abstract .summary .property.vantage .factual ol li {
  background: rgba(251, 208, 208, 0.8);
}

.concern .abstract .summary .property.neutral {
  grid-template-columns: auto;
  gap: unset;
}

.concern .abstract .summary .property.neutral::after {
  display: none;
}

.concern .abstract .summary .property.neutral .factual ol {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 60px;
}

.concern .abstract .summary .property.neutral .factual ol li {
  background: rgba(212, 231, 255, 0.8);
}

.concern .abstract .summary .property.unlucky .factual ol li {
  background: rgba(226, 225, 225, 0.8);
}

@media screen and (max-width: 768px) {
  .concern .abstract {
    gap: 0.26667rem;
  }
  .concern .abstract .summary .predict {
    padding: 0.13333rem 0;
    margin-bottom: 0.13333rem;
    font-size: 0.33333rem;
  }
  .concern .abstract .summary .property {
    gap: 0.8rem;
  }
  .concern .abstract .summary .property::after {
    width: 0.04rem;
  }
  .concern .abstract .summary .property .factual {
    border-radius: 0.06667rem;
  }
  .concern .abstract .summary .property .factual ol li {
    padding: 0.10667rem;
    margin-bottom: 0.26667rem;
    letter-spacing: 0.02667rem;
    border-radius: 0.06667rem;
  }
  .concern .abstract .summary .property .factual ol li p {
    font-size: 0.30667rem;
  }
  .concern .abstract .summary .property.neutral .factual ol {
    gap: 0 0.8rem;
  }
}

.participant {
  width: 100%;
  height: fit-content;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-bottom: 15px;
}

@media screen and (max-width: 768px) {
  .participant {
    margin-bottom: 0.2rem;
  }
}

.participant .attendee {
  width: 100%;
  overflow: hidden;
}

.participant .attendee a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
}

.participant .attendee a img {
  height: 35px;
}

.participant .attendee a span {
  font-weight: bold;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .participant .attendee a {
    gap: 0.13333rem;
  }
  .participant .attendee a img {
    height: 0.66667rem;
  }
  .participant .attendee a span {
    font-size: 0.32rem;
  }
}

.rivalries {
  width: 100%;
  height: fit-content;
  overflow: hidden;
}

.rivalries .ntice {
  position: relative;
  width: 100%;
  padding-left: 10px;
  box-sizing: border-box;
  margin: 15px 0;
}

.rivalries .ntice::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 4px;
  height: 88%;
  border-radius: 2px;
  background: #0091fe;
}

.rivalries .ntice strong {
  font-size: 16px;
  font-weight: bold;
}

@media screen and (max-width: 768px) {
  .rivalries .ntice {
    padding-left: 0.2rem;
    margin: 0.2rem 0;
  }
  .rivalries .ntice::before {
    width: 0.08rem;
    border-radius: 0.02667rem;
  }
  .rivalries .ntice strong {
    font-size: 0.32rem;
  }
}

.rivalries .arrange {
  width: 100%;
  height: fit-content;
}

.rivalries .arrange ul {
  width: 100%;
  height: fit-content;
  border: 1px solid #d5d5d5;
  box-sizing: border-box;
}

.rivalries .arrange ul li {
  display: grid;
  grid-template-columns: 2fr 3fr 1fr;
  padding: 10px;
  width: 100%;
  box-sizing: border-box;
  border-bottom: 1px solid #d5d5d5;
  align-items: center;
  box-sizing: border-box;
}

.rivalries .arrange ul li:last-child {
  border-bottom: none;
}

.rivalries .arrange ul li .foresee {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.rivalries .arrange ul li .encounter {
  display: grid;
  grid-template-columns: 2fr 1fr 2fr;
  place-items: center;
}

.rivalries .arrange ul li .feedback {
  text-align: right;
}

.rivalries .arrange ul li:first-child {
  background: #d5d5d5;
}

.rivalries .arrange ul li:first-child strong {
  font-weight: bold;
  font-size: 14px;
  white-space: nowrap;
}

.rivalries .arrange ul li:nth-child(n + 2) {
  background: #fff;
}

.rivalries .arrange ul li:nth-child(n + 2) .foresee time,
.rivalries .arrange ul li:nth-child(n + 2) .foresee a {
  font-weight: bold;
}

.rivalries .arrange ul li:nth-child(n + 2) .foresee time {
  font-size: 14px;
}

.rivalries .arrange ul li:nth-child(n + 2) .encounter {
  width: 100%;
}

.rivalries .arrange ul li:nth-child(n + 2) .encounter .ranks {
  width: 100%;
  overflow: hidden;
}

.rivalries .arrange ul li:nth-child(n + 2) .encounter .ranks a {
  display: flex;
  align-items: center;
  gap: 5px;
}

.rivalries .arrange ul li:nth-child(n + 2) .encounter .ranks a img {
  width: 25px;
}

.rivalries .arrange ul li:nth-child(n + 2) .encounter .ranks a span {
  flex: 1;
  font-weight: bold;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.rivalries
  .arrange
  ul
  li:nth-child(n + 2)
  .encounter
  .ranks:first-child
  a
  span {
  text-align: right;
}

.rivalries .arrange ul li:nth-child(n + 2) .encounter .scoreline {
  font-weight: bold;
  font-size: 14px;
}

.rivalries .arrange ul li:nth-child(n + 2) .feedback {
  font-weight: bold;
}

@media screen and (max-width: 768px) {
  .rivalries .arrange ul li {
    padding: 0.2rem 0.13333rem;
  }
  .rivalries .arrange ul li:first-child strong {
    font-size: 0.32rem;
  }
  .rivalries .arrange ul li:nth-child(n + 2) {
    grid-template-columns: auto;
    gap: 0.13333rem;
  }
  .rivalries .arrange ul li:nth-child(n + 2) .foresee time,
  .rivalries .arrange ul li:nth-child(n + 2) .foresee a {
    font-size: 0.30667rem;
  }
  .rivalries .arrange ul li:nth-child(n + 2) .foresee time {
    place-self: center end;
  }
  .rivalries .arrange ul li:nth-child(n + 2) .encounter .ranks a {
    gap: 0.06667rem;
  }
  .rivalries .arrange ul li:nth-child(n + 2) .encounter .ranks a img {
    width: 0.33333rem;
  }
  .rivalries .arrange ul li:nth-child(n + 2) .encounter .ranks a span {
    font-size: 0.30667rem;
  }
  .rivalries
    .arrange
    ul
    li:nth-child(n + 2)
    .encounter
    .ranks:first-child
    a
    span {
    font-size: 0.30667rem;
  }
  .rivalries .arrange ul li:nth-child(n + 2) .encounter .scoreline {
    font-size: 0.30667rem;
  }
  .rivalries .arrange ul li:nth-child(n + 2) .feedback {
    place-self: center;
    font-size: 0.30667rem;
  }
}

.rivalries .shelf {
  width: 100%;
  height: fit-content;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

@media screen and (max-width: 768px) {
  .rivalries .shelf {
    gap: 0.2rem;
  }
}

.rivalries .squad {
  display: flex;
  gap: 10px;
  margin-bottom: 15px;
}

.rivalries .squad span {
  padding: 8px 12px;
  border-radius: 20px;
  font-weight: bold;
  cursor: pointer;
}

.rivalries .squad span:hover,
.rivalries .squad span.active {
  background: #0091fe;
  color: #fff;
}

@media screen and (max-width: 768px) {
  .rivalries .squad {
    gap: 0.13333rem;
    margin-bottom: 0.2rem;
  }
  .rivalries .squad span {
    padding: 0.13333rem;
    border-radius: 0.13333rem;
    font-size: 0.30667rem;
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    transform: translate3d(-100%, 0, 0);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}

.fadeInLeft {
  animation-name: fadeInLeft;
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    transform: translate3d(100%, 0, 0);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}

.fadeInRight {
  animation-name: fadeInRight;
}

.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}

.player {
  /* 主题颜色 */
  --theme-color: #fff;
  --theme-deputy-color: #fff;
  --team-color: #020f61;
  --active-color: #020f61;
  /* 主题颜色 */
  width: 100%;
  height: fit-content;
}

.player .player-inner {
  width: 100%;
  height: 150px;
  margin-bottom: 15px;
  display: flex;
  border-radius: 15px;
  overflow: hidden;
}

.player .player-inner .team-sign {
  width: 240px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  background: var(--theme-color);
  overflow: hidden;
  border-right: 1px solid #d5d5d5;
}

.player .player-inner .team-sign img {
  height: 75px;
}

.player .player-inner .team-sign figcaption {
  width: 100%;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  color: var(--team-color);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.player .player-inner .team-overview {
  flex: 1;
  width: 0;
  padding: 15px;
  box-sizing: border-box;
  overflow: hidden;
  background: var(--theme-color);
}

.player .player-inner .team-overview .team-mete {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 10px;
}

.player .player-inner .team-overview .team-mete li {
  display: flex;
  gap: 5px;
}

.player .player-inner .team-overview .team-mete li strong {
  font-weight: bold;
  white-space: nowrap;
}

.player .player-inner .team-overview .team-mete li a {
  color: #4e5a63;
}

.player .player-inner .team-overview .team-bio {
  display: flex;
  gap: 5px;
}

.player .player-inner .team-overview .team-bio strong {
  font-weight: bold;
  white-space: nowrap;
}

@media screen and (max-width: 768px) {
  .player .player-inner {
    height: fit-content;
    margin-bottom: 0.2rem;
    flex-wrap: wrap;
    border-radius: 0.2rem;
  }
  .player .player-inner .team-sign {
    width: 100%;
    padding: 0.26667rem 0;
    gap: 0.13333rem;
    border-right: none;
    border-bottom: 1px solid #d5d5d5;
  }
  .player .player-inner .team-sign img {
    height: 2rem;
  }
  .player .player-inner .team-sign figcaption {
    width: 2.66667rem;
    font-size: 0.34667rem;
  }
  .player .player-inner .team-overview {
    width: 100%;
    padding: 0.26667rem 0.13333rem 0.4rem;
  }
  .player .player-inner .team-overview .team-mete {
    gap: 0.26667rem;
    margin-bottom: 0.2rem;
  }
  .player .player-inner .team-overview .team-mete li {
    gap: 0.13333rem;
  }
  .player .player-inner .team-overview .team-mete li span,
  .player .player-inner .team-overview .team-mete li strong {
    font-size: 0.32rem;
  }
  .player .player-inner .team-overview .team-bio {
    gap: 0.13333rem;
  }
  .player .player-inner .team-overview .team-bio span,
  .player .player-inner .team-overview .team-bio strong {
    font-size: 0.32rem;
  }
}

.player .player-sidebar {
  width: 100%;
  height: fit-content;
  border-radius: 10px;
}

.player .player-sidebar .player-nav {
  width: 100%;
  height: fit-content;
  margin-bottom: 10px;
  border-radius: 10px;
  overflow: hidden;
}

.player .player-sidebar .player-nav ul {
  width: 100%;
  height: fit-content;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3px;
}

.player .player-sidebar .player-nav ul li {
  width: 100%;
  padding: 15px 0;
  display: flex;
  align-items: center;
  background: var(--theme-deputy-color);
  justify-content: center;
  cursor: pointer;
}

.player .player-sidebar .player-nav ul li span {
  font-weight: bold;
  font-size: 16px;
}

.player .player-sidebar .player-nav ul li.active,
.player .player-sidebar .player-nav ul li:hover {
  background: var(--active-color);
}

.player .player-sidebar .player-nav ul li.active span,
.player .player-sidebar .player-nav ul li:hover span {
  color: var(--theme-color);
}

.player .player-sidebar .growth {
  width: 100%;
  height: fit-content;
}

.player .player-sidebar .growth ul {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.player .player-sidebar .growth ul li {
  width: 100%;
  height: fit-content;
  display: flex;
}

.player .player-sidebar .growth ul li:last-child {
  margin-bottom: 0;
}

.player .player-sidebar .growth ul li .player-card {
  position: relative;
  width: 240px;
  background: #cfdae5;
}

.player .player-sidebar .growth ul li .player-card .player-avatar {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  height: 100%;
  width: 100%;
}

.player .player-sidebar .growth ul li .player-card .player-avatar img {
  height: 88px;
  border-radius: 50%;
}

.player .player-sidebar .growth ul li .player-card .player-avatar figcaption {
  font-weight: bold;
  color: var(--team-color);
  font-size: 13px;
  width: 100px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: center;
}

.player .player-sidebar .growth ul li .player-info {
  flex: 1;
  width: 0;
  padding: 20px;
  background: var(--theme-color);
}

.player .player-sidebar .growth ul li .player-info .player-mete {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 15px 0;
}

.player .player-sidebar .growth ul li .player-info .player-mete li {
  display: flex;
  gap: 5px;
  overflow: hidden;
  white-space: nowrap;
  flex-wrap: nowrap;
}

.player .player-sidebar .growth ul li .player-info .player-mete li strong {
  font-weight: bold;
}

.player .player-sidebar .growth ul li .player-info .player-mete li span {
  text-overflow: ellipsis;
  overflow: hidden;
}

.player .player-sidebar .growth ul li .player-info .player-bio {
  margin-top: 15px;
  display: flex;
  gap: 5px;
}

.player .player-sidebar .growth ul li .player-info .player-bio strong {
  font-weight: bold;
  white-space: nowrap;
}

.player .player-sidebar .growth ul li .player-info .player-bio .honor {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.player
  .player-sidebar
  .growth
  ul
  li
  .player-info
  .player-bio
  .honor
  .honorItem {
  position: relative;
  width: 130px;
  border: 1px solid #d5d5d5;
  padding: 15px;
  box-sizing: border-box;
}

.player
  .player-sidebar
  .growth
  ul
  li
  .player-info
  .player-bio
  .honor
  .honorItem
  figure {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 3px;
}

.player
  .player-sidebar
  .growth
  ul
  li
  .player-info
  .player-bio
  .honor
  .honorItem
  figure
  img {
  width: 30px;
}

.player
  .player-sidebar
  .growth
  ul
  li
  .player-info
  .player-bio
  .honor
  .honorItem
  figure
  figcaption {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
}

.player
  .player-sidebar
  .growth
  ul
  li
  .player-info
  .player-bio
  .honor
  .honorItem
  .levitated {
  position: absolute;
  top: 6px;
  right: 8px;
  width: 24px;
  height: 24px;
  background: #ee4a4a;
  color: #fff;
  text-align: center;
  line-height: 24px;
  border-radius: 50%;
}

@media screen and (max-width: 768px) {
  .player .player-sidebar .player-nav {
    margin-bottom: 0.13333rem;
  }
  .player .player-sidebar .player-nav ul {
    gap: 0.06667rem;
  }
  .player .player-sidebar .player-nav ul li {
    padding: 0.26667rem 0;
  }
  .player .player-sidebar .player-nav ul li span {
    font-size: 0.32rem;
  }
  .player .player-sidebar .player-list ul {
    gap: 0.13333rem;
  }
  .player .player-sidebar .player-list ul li {
    flex-wrap: wrap;
  }
  .player .player-sidebar .player-list ul li .player-card {
    width: 100%;
    padding: 0.26667rem 0;
    box-sizing: border-box;
  }
  .player .player-sidebar .player-list ul li .player-card .player-avatar {
    gap: 0.13333rem;
  }
  .player .player-sidebar .player-list ul li .player-card .player-avatar img {
    height: 1.70667rem;
  }
  .player
    .player-sidebar
    .player-list
    ul
    li
    .player-card
    .player-avatar
    figcaption {
    width: 2.4rem;
    font-size: 0.32rem;
  }
  .player .player-sidebar .player-list ul li .player-info {
    padding: 0.2rem 0.2rem 0.26667rem;
  }
  .player .player-sidebar .player-list ul li .player-info .player-mete {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.26667rem;
  }
  .player .player-sidebar .player-list ul li .player-info .player-mete li {
    gap: 0.06667rem;
  }
  .player
    .player-sidebar
    .player-list
    ul
    li
    .player-info
    .player-mete
    li
    strong,
  .player .player-sidebar .player-list ul li .player-info .player-mete li span {
    font-size: 0.32rem;
  }
  .player .player-sidebar .player-list ul li .player-info .player-bio {
    margin-top: 0.2rem;
    gap: 0.13333rem;
  }
  .player .player-sidebar .player-list ul li .player-info .player-bio strong {
    font-size: 0.32rem;
  }
  .player .player-sidebar .player-list ul li .player-info .player-bio .honor {
    gap: 0.13333rem;
  }
  .player
    .player-sidebar
    .player-list
    ul
    li
    .player-info
    .player-bio
    .honor
    .honorItem {
    width: 3.06667rem;
    padding: 0.2rem;
  }
  .player
    .player-sidebar
    .player-list
    ul
    li
    .player-info
    .player-bio
    .honor
    .honorItem
    figure {
    gap: 0.04rem;
  }
  .player
    .player-sidebar
    .player-list
    ul
    li
    .player-info
    .player-bio
    .honor
    .honorItem
    figure
    img {
    width: 0.8rem;
  }
  .player
    .player-sidebar
    .player-list
    ul
    li
    .player-info
    .player-bio
    .honor
    .honorItem
    figure
    figcaption {
    font-size: 0.32rem;
  }
  .player
    .player-sidebar
    .player-list
    ul
    li
    .player-info
    .player-bio
    .honor
    .honorItem
    .levitated {
    top: 0.08rem;
    right: 0.10667rem;
    width: 0.42667rem;
    height: 0.42667rem;
    line-height: 0.42667rem;
    font-size: 0.32rem;
  }
}
.question {
  width: 100%;
  margin-top: 12px;
}

.question ul {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.question ul li {
  position: relative;
  width: calc(50% - 5px);
  border: 1px solid #cadddf;
  padding: 10px 12px;
  box-sizing: border-box;
  background: #fff;
  border-radius: 5px;
}

.question ul li:hover {
  background: #15276a;
}

.question ul li:hover a article strong {
  color: #fff;
}

.question ul li:hover a article p {
  color: #fff;
}

.question ul li:first-child {
  width: 100%;
}

.question ul li .carefully {
  position: absolute;
  right: 20px;
  top: 10px;
  background: rgba(254, 243, 199, 0.5);
  padding: 2px 10px;
  box-sizing: border-box;
  border-radius: 10px;
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 4px;
}

.question ul li .carefully img {
  width: 12px;
  height: 12px;
  font-weight: bold;
}

.question ul li .carefully span {
  font-weight: bold;
  color: #d97809;
}

.question ul li a {
  width: 100%;
}

.question ul li a article {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.question ul li a article strong {
  font-weight: bold;
  color: #19222f;
  width: 80%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
}

.question ul li a article p {
  color: #19222f;
  line-height: 23px;
  display: -webkit-box;
  /* 弹性盒子模型 */
  -webkit-box-orient: vertical;
  /* 垂直排列子元素 */
  -webkit-line-clamp: 2;
  /* 限制3行 */
  overflow: hidden;
  font-size: 12px;
}
.question ul li a article .volution {
  height: 51px;
  overflow-y: auto;
}

.question ul li a .delicate {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 28px;
}

.question ul li a .delicate .alternative {
  display: flex;
  align-items: center;
  gap: 24px;
}

.question ul li a .delicate .alternative .impressions {
  display: flex;
  align-items: center;
  gap: 5px;
}

.question ul li a .delicate .alternative .impressions img {
  width: 24px;
}

.question ul li a .delicate .alternative .impressions span {
  font-weight: bold;
  color: #6f6f6f;
  font-size: 12px;
}

.question ul li a .delicate .rotation {
  display: flex;
  align-items: center;
  gap: 5px;
}

.question ul li a .delicate .rotation img {
  width: 24px;
}

.question ul li a .delicate .rotation time {
  font-size: 12px;
  font-weight: bold;
  color: #6f6f6f;
}
@media screen and (max-width: 768px) {
  .question ul {
    gap: 1.33333vw;
  }
  .question ul li {
    width: 100%;
    padding: 1.33333vw 1.6vw;
  }
  .question ul li .carefully {
    right: 2.66667vw;
    top: 1.33333vw;
    font-size: 2.93333vw;
    gap: 0.13333;
    border-radius: 1.6vw;
    padding: 0.26667vw 1.33333vw;
  }
  .question ul li .carefully img {
    width: 2.66667vw;
    height: 2.66667vw;
  }
  .question ul li a article {
    gap: 1.6vw;
  }
  .question ul li a article strong {
    font-size: 3.33333vw;
  }
  .question ul li a article p {
    font-size: 3.06667vw;
    line-height: 4.26667vw;
  }
  .question ul li a .delicate {
    gap: 1.6vw;
    margin-top: 3.73333vw;
  }
  .question ul li a .delicate .alternative {
    gap: 3.2vw;
  }
  .question ul li a .delicate .alternative .impressions {
    gap: 0.8vw;
  }
  .question ul li a .delicate .alternative .impressions img {
    width: 4.26667vw;
  }
  .question ul li a .delicate .alternative .impressions span {
    font-size: 2.66667vw;
  }
  .question ul li a .delicate .rotation {
    gap: 0.8vw;
  }
  .question ul li a .delicate .rotation img {
    width: 4.26667vw;
  }
  .question ul li a .delicate .rotation time {
    font-size: 2.66667vw;
  }
}
.retrieve {
  width: 100%;
  margin-top: 16px;
}

.retrieve ul {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.retrieve ul li {
  width: fit-content;
}

.retrieve ul li a {
  width: fit-content;
  padding: 5px 12px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 7px;
  transition: all 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
  background: #fff;
  border-radius: 5px;
}

.retrieve ul li a:hover {
  background: #3e7eaa;
  transform: scaleY(1.01) translateY(-2px);
}

.retrieve ul li a:hover span {
  color: #fff;
}

.retrieve ul li a span {
  font-weight: bold;
  color: #19222f;
  font-size: 12px;
}

.retrieve ul li a img {
  width: 14px;
  display: none;
}

.retrieve ul li a:hover img {
  display: block;
}
@media screen and (max-width: 768px) {
  .retrieve ul {
    gap: 2vw;
  }
  .retrieve ul li a {
    padding: 0.8vw 2vw;
    gap: 1.06667vw;
  }
  .retrieve ul li a span {
    font-size: 2.93333vw;
  }
  .retrieve ul li a span img {
    font-size: 2.66667vw;
  }
}
.inquires {
  width: 100%;
  overflow: hidden;
}

.inquires ul {
  width: 100%;
}

.inquires ul li {
  width: 100%;
  padding: 10px 5px;
  box-sizing: border-box;
  border-bottom: 1px solid #eeeff2;
}

.inquires ul li a {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 16px;
  overflow: hidden;
}

.inquires ul li a p {
  color: #727477;
  font-size: 13px;
  font-weight: bold;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.inquires ul li a .painstaking {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.inquires ul li a .painstaking .reply {
  display: flex;
  align-items: center;
  gap: 4px;
}

.inquires ul li a .painstaking .reply img {
  width: 14px;
  height: fit-content;
}

.inquires ul li a .painstaking .reply span {
  color: #aabbd6;
  font-size: 12px;
  white-space: nowrap;
}

.inquires ul li a .painstaking .deliver {
  display: flex;
  align-items: center;
  gap: 5px;
}

.inquires ul li a .painstaking .deliver img {
  width: 14px;
  height: fit-content;
}

.inquires ul li a .painstaking .deliver time {
  font-size: 12px;
  color: #aabbd6;
}
@media screen and (max-width: 768px) {
  .inquires ul li {
    padding: 1.33333vw 0.66667vw;
  }
  .inquires ul li a {
    gap: 2.13333vw;
  }
  .inquires ul li a p {
    font-size: 2.93333vw;
  }
  .inquires ul li a .painstaking .reply {
    gap: 1.06667vw;
  }
  .inquires ul li a .painstaking .reply img {
    width: 2.66667vw;
  }
  .inquires ul li a .painstaking .reply span {
    font-size: 2.13333vw;
  }
  .inquires ul li a .painstaking .deliver {
    gap: 1.06667vw;
  }
  .inquires ul li a .painstaking .deliver img {
    width: 2.66667vw;
  }
  .inquires ul li a .painstaking .deliver time {
    font-size: 2.13333vw;
  }
}
.connive {
  width: 100%;
  margin: 12px 0;
}

.connive .postpone {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}

.connive .postpone time {
  font-size: 12px;
  font-weight: bold;
  color: #fff;
}

.connive .foundation {
  display: flex;
  align-items: center;
  margin: 12px 0;
  gap: 3px;
}

.connive .foundation img {
  width: 20px;
}

.connive .foundation span {
  font-weight: bold;
  font-size: 12px;
}

.connive .tidy {
  width: 100%;
}

.connive .tidy ul {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.connive .tidy ul li {
  white-space: nowrap;
  user-select: none;
}

.connive .tidy ul li a {
  padding: 5px 10px;
  box-sizing: border-box;
  background: #e2f6f9;
  color: #1fbcd3;
  font-size: 12px;
  font-weight: bold;
  border-radius: 4px;
}

.connive .solution {
  width: 100%;
  white-space: nowrap;
  margin-top: 26px;
}

.connive .solution ul {
  width: 100%;
}

.connive .solution ul li {
  border-bottom: 1px solid #c1d7db;
  padding: 10px 5px;
  box-sizing: border-box;
}

.connive .solution ul li:last-child {
  border-bottom: none;
}

.connive .solution ul li a {
  width: 100%;
  overflow: hidden;
  display: flex;
  align-items: center;
  gap: 6px;
}

.connive .solution ul li a img {
  width: 17px;
  height: fit-content;
}

.connive .solution ul li a p {
  font-size: 12px;
  font-weight: bold;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}

.connive .regard {
  width: 100%;
  white-space: nowrap;
  margin-top: 32px;
}

.connive .regard .unfurl {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: bold;
  color: #333333;
}

.connive .regard .unfurl::before {
  content: "";
  width: 3px;
  height: 10px;
  background: #04b4ce;
  border-radius: 4px;
}
@media screen and (max-width: 768px) {
  .connive .postpone {
    gap: 3.06667vw;
  }
  .connive .postpone h1 {
    font-size: 3.2vw;
    gap: 1.06667vw;
  }
  .connive .postpone h1::before {
    width: 0.8vw;
    height: 1.86667vw;
    border-radius: 0.8vw;
  }
  .connive .postpone time {
    font-size: 2.66667vw;
  }
  .connive .foundation {
    margin: 2.93333vw 0;
    gap: 0.66667vw;
  }
  .connive .foundation img {
    width: 3.46667vw;
  }
  .connive .foundation span {
    font-size: 2.66667vw;
  }
  .connive .tidy ul {
    gap: 2.93333vw;
  }
  .connive .tidy ul li a {
    padding: 0.8vw 1.6vw;
    font-size: 2.93333vw;
    border-radius: 0.8vw;
  }
  .connive .solution {
    margin-top: 4.26667vw;
  }
  .connive .solution ul li {
    padding: 1.6vw 0.8vw;
  }
  .connive .solution ul li a {
    gap: 1.06667vw;
  }
  .connive .solution ul li a img {
    width: 2.66667vw;
  }
  .connive .solution ul li a p {
    font-size: 2.93333vw;
  }
  .connive .regard {
    margin-top: 4.8vw;
  }
  .connive .regard .unfurl {
    gap: 1.33333vw;
  }
  .connive .regard .unfurl::before {
    width: 0.8vw;
    height: 1.86667vw;
    border-radius: 0.8vw;
  }
}
.internal{
  background: #fff;
  padding: 10px;
  box-sizing: border-box;

}
.internal .itself {
  margin-bottom: 15px;
}

.internal .itself .matter .subject {
  display: block;
  font-size: 16px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-bottom: 15px;
  color: #222222;
}

.internal .itself .establish {
  margin-top: 15px;
  display: flex;
  justify-content: space-between;
}

.internal .itself .establish .harvest {
  display: flex;
  gap: 15px;
}

.internal .itself .establish .harvest .amass {
  display: flex;
  gap: 5px;
  align-items: center;
  padding: 5px 15px;
  border: 1px solid transparent;
  user-select: none;
  border-radius: 15px;
  overflow: hidden;
}

.internal .itself .establish .harvest .amass img {
  width: 20px;
}

.internal .itself .establish .harvest .amass span {
  color: #7f8b97;
}

.internal .itself .establish .harvest .amass:nth-child(1) {
  border-color: #013384;
}

.internal .itself .establish .harvest .amass:nth-child(1):hover {
  background: #013384;
}

.internal .itself .establish .harvest .amass:nth-child(1):hover span {
  color: #fff;
}

.internal .itself .establish .harvest .amass:nth-child(2) {
  border-color: #f32c2c;
}

.internal .itself .establish .harvest .amass:nth-child(2):hover {
  background: #f32c2c;
}

.internal .itself .establish .harvest .amass:nth-child(2):hover span {
  color: #fff;
}

.internal .itself .establish .harvest .amass:nth-child(3) {
  border-color: #4cc9f0;
}

.internal .itself .establish .harvest .amass:nth-child(3):hover {
  background: #4cc9f0;
}

.internal .itself .establish .harvest .amass:nth-child(3):hover span {
  color: #fff;
}

.internal .itself .establish .creation {
  display: flex;
  align-items: center;
  gap: 5px;
}

.internal .itself .establish .creation img {
  width: 20px;
}

@media screen and (max-width: 768px) {
  .internal .itself {
    margin-bottom: 2vw;
  }
  .internal .itself .matter .subject {
    font-size: 3.33333vw;
    margin-bottom: 2vw;
  }
  .internal .itself .matter p {
    font-size: 3.06667vw;
  }
  .internal .itself .establish {
    margin-top: 2vw;
  }
  .internal .itself .establish .harvest {
    gap: 2vw;
  }
  .internal .itself .establish .harvest .amass {
    gap: 0.66667vw;
    padding: 0.66667vw 2vw;
    border-radius: 2vw;
  }
  .internal .itself .establish .harvest .amass img {
    width: 2.66667vw;
  }
  .internal .itself .establish .harvest .amass span {
    font-size: 3.2vw;
  }
  .internal .itself .establish .creation {
    gap: 0.66667vw;
  }
  .internal .itself .establish .creation img {
    width: 2.66667vw;
  }
  .internal .itself .establish .creation span {
    font-size: 3.2vw;
  }
}

.internal .splitLine {
  display: flex;
  align-items: center;
  gap: 20px;
}

.internal .splitLine .sumUp {
  font-size: 16px;
}

.internal .splitLine .line {
  flex: 1;
  height: 1px;
  background: #dde4ef;
}

.internal .splitLine .heated a {
  color: #12418c;
}

@media screen and (max-width: 768px) {
  .internal .splitLine {
    gap: 2.66667vw;
  }
  .internal .splitLine .sumUp {
    font-size: 3.33333vw;
  }
  .internal .splitLine .heated .topic {
    font-size: 3.06667vw;
  }
  .internal .splitLine .heated a {
    font-size: 3.06667vw;
  }
}

.internal .related {
  margin-top: 20px;
}

.internal .related ul {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.internal .related ul li {
  border-bottom: 1px solid #dde4ef;
}

.internal .related ul li a p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 3;
  color: #222222;
  font-size: 12px;
  line-height: 24px;
  text-indent: 8px;
}

.internal .related ul li a .establish {
  display: flex;
  justify-content: space-between;
  margin: 15px 0;
}

.internal .related ul li a .establish .harvest {
  display: flex;
  gap: 15px;
}

.internal .related ul li a .establish .harvest .amass {
  display: flex;
  gap: 5px;
  align-items: center;
}

.internal .related ul li a .establish .harvest .amass img {
  width: 20px;
}

.internal .related ul li a .establish .harvest .amass span {
  color: #7f8b97;
}

.internal .related ul li a .establish .creation {
  display: flex;
  align-items: center;
  gap: 5px;
}

.internal .related ul li a .establish .creation img {
  width: 20px;
}

.internal .related ul li a .establish .creation span {
  color: #7f8b97;
}

@media screen and (max-width: 768px) {
  .internal .related {
    margin-top: 2.66667vw;
  }
  .internal .related ul {
    gap: 2vw;
  }
  .internal .related ul li a p {
    font-size: 3.06667vw;
  }
  .internal .related ul li a .establish {
    margin: 2vw 0;
  }
  .internal .related ul li a .establish .harvest {
    gap: 2vw;
  }
  .internal .related ul li a .establish .harvest .amass {
    gap: 0.66667vw;
  }
  .internal .related ul li a .establish .harvest .amass img {
    width: 2.66667vw;
  }
  .internal .related ul li a .establish .harvest .amass span {
    font-size: 3.2vw;
  }
  .internal .related ul li a .establish .creation {
    gap: 0.66667vw;
  }
  .internal .related ul li a .establish .creation img {
    width: 2.66667vw;
  }
  .internal .related ul li a .establish .creation span {
    font-size: 3.2vw;
  }
}
.several {
  width: 100%;
  overflow: hidden;
  padding: 10px;
  box-sizing: border-box;
}

.several ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.several ul li {
  padding: 2px 5px;
  box-sizing: border-box;
  border: 1px solid #e2e4e9;
}

.several ul li a {
  font-size: 12px;
  font-weight: bold;
  color: #727477;
  white-space: nowrap;
  user-select: none;
}

@media screen and (max-width: 768px) {
  .several ul {
    gap: 1.33333vw;
  }
  .several ul li {
    padding: 0.53333vw 1.06667vw;
  }
  .several ul li a {
    font-size: 2.66667vw;
  }
}
.searchs {
  margin-bottom: 14px;
}