@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: #081b30;
}

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: linear-gradient(90deg, #bae1f5, #edf7ff, #bae1f5);
  color: #081b30;
}

.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.5);
}

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

figure {
  margin: 0;
}

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

/* 头部 底部 */
.header {
  height: fit-content;
}

.header .practical {
  height: fit-content;
  padding: 15px 0;
}

.header .practical .fungible {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.header .practical .fungible .emblem {
  width: 210px;
}

.header .practical .fungible .emblem a img {
  width: 100%;
}

.header .practical .fungible .ballSearch {
  width: 410px;
}

.header .practical .fungible .ballSearch ul {
  display: flex;
  gap: 1px;
}

.header .practical .fungible .ballSearch ul li {
  padding: 10px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  cursor: pointer;
}

.header .practical .fungible .ballSearch ul li:hover,
.header .practical .fungible .ballSearch ul li.active {
  background: #013384;
  color: #fff;
}

.header .practical .fungible .ballSearch .lookup {
  display: flex;
  align-items: center;
  height: 35px;
}

.header .practical .fungible .ballSearch .lookup input {
  flex: 1;
  height: 100%;
  border: 1px solid #013384;
  border-right: none;
  background: none;
  text-indent: 10px;
}

.header .practical .fungible .ballSearch .lookup button {
  width: 60px;
  height: 100%;
  background: #013384;
  border: unset;
  cursor: pointer;
}

.header .practical .fungible .ballSearch .lookup button .iconfont {
  font-size: 24px;
  color: #fff;
}

.header .priority {
  height: fit-content;
  background: #013384;
}

.header .priority ul {
  width: 100%;
  overflow-x: auto;
  display: flex;
}

.header .priority ul li a {
  display: block;
  padding: 15px 30px;
  font-size: 16px;
  color: #fff;
  font-weight: bold;
  white-space: nowrap;
}

.header .priority ul li.active a {
  background: #fff;
  color: #013384;
}

.header .secondary {
  height: fit-content;
  background: #fff;
  padding: 10px 0;
}

.header .secondary ul {
  width: 100%;
  display: flex;
  overflow-x: auto;
}

.header .secondary ul li a {
  display: block;
  padding: 8px 20px;
  font-weight: bold;
  border-radius: 15px;
  white-space: nowrap;
}

.header .secondary ul li.active a {
  background: #013384;
  color: #fff;
}

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

@media screen and (max-width: 768px) {
  .header .practical {
    padding: 0.2rem 0.13333rem;
  }
  .header .practical .fungible {
    gap: 1.6rem;
  }
  .header .practical .fungible .emblem {
    width: 2.8rem;
  }
  .header .practical .fungible .ballSearch {
    flex: 1;
  }
  .header .practical .fungible .ballSearch ul {
    overflow-x: auto;
  }
  .header .practical .fungible .ballSearch ul li {
    padding: 0.13333rem 0.26667rem;
    border-top-left-radius: 0.13333rem;
    border-top-right-radius: 0.13333rem;
    font-size: 0.30667rem;
    white-space: nowrap;
  }
  .header .practical .fungible .ballSearch .lookup {
    height: 0.6rem;
  }
  .header .practical .fungible .ballSearch .lookup input {
    text-indent: 0.13333rem;
    font-size: 0.32rem;
  }
  .header .practical .fungible .ballSearch .lookup button {
    width: 0.8rem;
  }
  .header .practical .fungible .ballSearch .lookup button .iconfont {
    font-size: 0.4rem;
  }
  .header .priority {
    padding: 0 0.13333rem;
  }
  .header .priority ul li a {
    padding: 0.2rem 0.4rem;
    font-size: 0.33333rem;
  }
  .header .secondary {
    padding: 0.13333rem;
  }
  .header .secondary ul li a {
    padding: 0.10667rem 0.26667rem;
    border-radius: 0.33333rem;
    font-size: 0.30667rem;
  }
}

.footer {
  height: fit-content;
}

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

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

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

.footer .authorized .substitute dl dd {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.footer .authorized .substitute dl dd a {
  white-space: nowrap;
}

.footer .disclaimer {
  background: #013384;
  padding: 20px 0;
}

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

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

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

@media screen and (max-width: 768px) {
  .footer .authorized {
    padding: 0.66667rem 0.13333rem;
  }
  .footer .authorized .substitute {
    grid-template-columns: auto;
    gap: 0.2rem;
  }
  .footer .authorized .substitute dl dt {
    margin-bottom: 0.2rem;
    font-size: 0.32rem;
  }
  .footer .authorized .substitute dl dd {
    gap: 0.13333rem;
  }
  .footer .authorized .substitute dl dd a {
    font-size: 0.32rem;
  }
  .footer .disclaimer {
    padding: 0.26667rem 0.13333rem;
  }
  .footer .disclaimer p {
    line-height: 0.53333rem;
    font-size: 0.32rem;
  }
  .footer .disclaimer 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);
  }
}

/* 提取 */
.matchPlan {
  background: #fff;
}

.matchPlan.another ul li {
  grid-template-columns: 2fr 3fr 2fr;
}

.matchPlan.another ul li .spectate {
  display: flex;
  align-items: center;
  justify-content: end;
}

.matchPlan.another ul li .spectate .channel {
  display: flex;
  align-items: center;
  margin-right: 5px;
  gap: 5px;
}

@media screen and (max-width: 768px) {
  .matchPlan.another ul li {
    grid-template-columns: auto;
  }
  .matchPlan.another ul li .spectate {
    justify-content: space-between;
  }
  .matchPlan.another ul li .spectate .channel {
    margin-right: 0;
    gap: 0.06667rem;
  }
}

.matchPlan ul li {
  width: 100%;
  display: grid;
  grid-template-columns: 2fr 2fr 1fr;
  align-items: center;
  padding: 15px;
  box-sizing: border-box;
  border-bottom: 1px solid #dde4ef;
}

.matchPlan ul li .forecast {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  align-items: center;
}

.matchPlan ul li .forecast .result {
  display: flex;
  align-items: center;
  padding: 5px 10px;
  width: fit-content;
  background: #dde4ef;
  border-radius: 5px;
  gap: 4px;
}

.matchPlan ul li .forecast .result.afoot {
  background: #ffd1d1;
}

.matchPlan ul li .forecast .result.afoot .iconfont,
.matchPlan ul li .forecast .result.afoot span {
  color: #fd2026;
}

.matchPlan ul li .forecast .result span {
  white-space: nowrap;
}

.matchPlan ul li .forecast time {
  text-align: center;
}

.matchPlan ul li .forecast .super {
  text-align: center;
}

.matchPlan ul li .strive {
  display: grid;
  grid-template-columns: 3fr 1fr 3fr;
  width: 100%;
  align-items: center;
  gap: 12px;
}
.matchPlan ul li .strive .attend {
  width: 100%;
  overflow: hidden;
}
.matchPlan ul li .strive .attend a {
  display: flex;
  align-items: center;
  gap: 5px;
  width: 100%;
}

.matchPlan ul li .strive .attend a img {
  width: 30px;
  max-height: 26px;
}

.matchPlan ul li .strive .attend a strong {
  flex: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 12px;
  color:;
}

.matchPlan ul li .strive .attend:first-child a strong {
  text-align: right;
}

.matchPlan ul li .strive .verdict {
  display: flex;
  justify-content: center;
  gap: 3px;
}

.matchPlan ul li .spectate .channel .feedWord {
  display: flex;
  align-items: center;
}

.matchPlan ul li .spectate .channel a {
  white-space: nowrap;
  color: #5372a4;
}

.matchPlan ul li .spectate .moreChannel {
  display: flex;
  align-items: center;
}

.matchPlan ul li .spectate .moreChannel span {
  font-size: 12px;
}

.matchPlan ul li .spectate .moreChannel span.iconfont {
  font-size: 14px;
  color: #cf4e4f;
}

.matchPlan ul li:hover {
  background: #013384;
}

.matchPlan ul li:hover .forecast .result {
  background: rgba(255, 255, 255, 0.2);
}

.matchPlan ul li:hover .forecast .result .iconfont,
.matchPlan ul li:hover .forecast .result span {
  color: #fff;
}

.matchPlan ul li:hover .forecast time {
  color: #fff;
}

.matchPlan ul li:hover .forecast .super {
  color: #fff;
}

.matchPlan ul li:hover .strive .attend a strong {
  color: #fff;
}

.matchPlan ul li:hover .strive .verdict span {
  color: #fff;
}

.matchPlan ul li:hover .spectate .channel .feedWord span,
.matchPlan ul li:hover .spectate .channel .feedWord strong {
  color: #fff;
}

.matchPlan ul li:hover .spectate .channel a {
  color: #fff;
}

.matchPlan ul li:hover .spectate .moreChannel span {
  color: #fff;
}

@media screen and (max-width: 768px) {
  .matchPlan ul li {
    grid-template-columns: auto;
    gap: 0.13333rem;
    padding: 0.2rem;
  }
  .matchPlan ul li .forecast .result {
    padding: 0.06667rem 0.13333rem;
    border-radius: 0.06667rem;
  }
  .matchPlan ul li .forecast .result span {
    font-size: 0.32rem;
  }
  .matchPlan ul li .forecast time {
    font-size: 0.32rem;
  }
  .matchPlan ul li .forecast .super {
    font-size: 0.32rem;
  }
  .matchPlan ul li .strive .attend a {
    gap: 0.06667rem;
  }
  .matchPlan ul li .strive .attend a img {
    width: 0.4rem;
  }
  .matchPlan ul li .strive .attend a strong {
    font-size: 0.32rem;
  }
  .matchPlan ul li .strive .verdict span {
    font-size: 0.32rem;
  }
  .matchPlan ul li .spectate {
    display: flex;
    justify-content: space-between;
  }
  .matchPlan ul li .spectate .channel {
    display: flex;
    gap: 0.06667rem;
  }
  .matchPlan ul li .spectate .channel .feedWord span,
  .matchPlan ul li .spectate .channel .feedWord strong {
    font-size: 0.32rem;
  }
  .matchPlan ul li .spectate .channel a {
    font-size: 0.32rem;
  }
  .matchPlan ul li .spectate .moreChannel span {
    font-size: 0.32rem;
  }
}

/* 公用 */
.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;
  }
}

.layering {
  height: fit-content;
  position: relative;
  margin: 15px 0;
  padding-left: 8px;
}

.layering::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 4px;
  height: 100%;
  background: #013384;
  border-bottom-right-radius: 15px;
  border-top-right-radius: 15px;
}

.layering ul {
  display: flex;
}

.layering ul li::after {
  content: ">";
  margin: 0 10px;
}

.layering ul li:last-child {
  flex: 1;
  overflow: hidden;
}

.layering ul li:last-child a {
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  color: #013384;
}

.layering ul li:last-child::after {
  display: none;
}

@media screen and (max-width: 768px) {
  .layering {
    margin: 0.2rem 0;
    padding-left: 0.13333rem;
  }
  .layering::after {
    width: 0.06667rem;
    height: 88%;
    border-bottom-right-radius: 0.2rem;
    border-top-right-radius: 0.2rem;
  }
  .layering ul li::after {
    margin: 0 0.13333rem;
  }
  .layering ul li a {
    font-size: 0.32rem;
  }
}

.matchsNav {
  height: fit-content;
  overflow: auto;
  margin-bottom: 10px;
}

.matchsNav ul {
  display: flex;
  gap: 10px;
}

.matchsNav ul li {
  background: #fff;
}

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

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

.matchsNav ul li a img {
  height: 25px;
  max-width: 36px;
}

.matchsNav ul li a span {
  font-weight: bold;
  white-space: nowrap;
}

.matchsNav ul li:hover {
  background: #013384;
}

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

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

/* 首页 */
.mainWsrap {
  padding-top: 30px;
}

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

.mainWsrap .leagueNav {
  width: 100%;
  height: fit-content;
  overflow-x: auto;
  background: #fff;
  border-bottom: 1px solid #e6ebf3;
}

.mainWsrap .leagueNav ul {
  display: flex;
  gap: 3px;
}

.mainWsrap .leagueNav ul li a {
  display: block;
  padding: 15px 25px;
  white-space: nowrap;
}

.mainWsrap .leagueNav ul li:hover,
.mainWsrap .leagueNav ul li.active {
  background: #013384;
}

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

@media screen and (max-width: 768px) {
  .mainWsrap .leagueNav ul {
    gap: 0.04rem;
  }
  .mainWsrap .leagueNav ul li a {
    padding: 0.2rem 0.33333rem;
    font-size: 0.32rem;
  }
}

.mainWsrap .denoted {
  height: fit-content;
  position: relative;
  padding-left: 10px;
  margin-bottom: 15px;
  display: flex;
  justify-content: space-between;
}

.mainWsrap .denoted::after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 100%;
  background: #013384;
}

.mainWsrap .denoted strong {
  font-weight: bold;
  color: #013384;
  font-size: 15px;
}

.mainWsrap .denoted a {
  display: flex;
  align-items: center;
}

.mainWsrap .denoted a span {
  color: #013384;
  font-size: 13px;
}

.mainWsrap .denoted a span.iconfont {
  font-size: 10px;
}

@media screen and (max-width: 768px) {
  .mainWsrap .denoted {
    padding-left: 0.16rem;
    margin-bottom: 0.2rem;
  }
  .mainWsrap .denoted::after {
    width: 0.06667rem;
    height: 80%;
  }
  .mainWsrap .denoted strong {
    font-size: 0.33333rem;
  }
  .mainWsrap .denoted a span {
    font-size: 0.30667rem;
  }
  .mainWsrap .denoted a span.iconfont {
    font-size: 0.21333rem;
  }
}

.mainWsrap .superior {
  height: fit-content;
  padding: 30px 0 60px;
  box-sizing: border-box;
}

@media screen and (max-width: 1000px) {
  .mainWsrap .superior {
    padding: 30px 10px 60px;
  }
}

@media screen and (max-width: 768px) {
  .mainWsrap .superior {
    padding: 0.4rem 0.13333rem 0.8rem;
  }
}

.mainWsrap .superior .superiorCore {
  display: grid;
  grid-template-columns: 3fr 2fr 1fr;
  gap: 15px;
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
}

@media screen and (max-width: 768px) {
  .mainWsrap .superior .superiorCore {
    padding: 0.2rem;
  }
}

.mainWsrap .superior .superiorCore .topNews {
  width: 100%;
  overflow: hidden;
}

.mainWsrap .superior .superiorCore .topNews ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}

.mainWsrap .superior .superiorCore .topNews ul li {
  width: 100%;
  overflow: hidden;
}

.mainWsrap .superior .superiorCore .topNews ul li a {
  display: block;
  width: 100%;
}

.mainWsrap .superior .superiorCore .topNews ul li a img {
  width: 100%;
  height: 125px;
  margin-bottom: 5px;
}

.mainWsrap .superior .superiorCore .topNews ul li a p {
  width: 100%;
  box-sizing: border-box;
  font-size: 13px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.mainWsrap .superior .superiorCore .topNews ul li:hover a p {
  color: #013384;
}

.mainWsrap .superior .superiorCore .topNews ul li:first-child {
  grid-column: span 2;
  width: 100%;
}

.mainWsrap .superior .superiorCore .topNews ul li:first-child a {
  display: block;
  width: 100%;
  height: 200px;
  position: relative;
}

.mainWsrap .superior .superiorCore .topNews ul li:first-child a img {
  width: 100%;
  height: 100%;
}

.mainWsrap .superior .superiorCore .topNews ul li:first-child a p {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  background: rgba(0, 0, 0, 0.1);
  color: #fff;
  font-size: 13px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.mainWsrap .superior .superiorCore .latestEvent {
  width: 100%;
  height: fit-content;
  overflow: hidden;
}

.mainWsrap .superior .superiorCore .latestEvent ol li {
  margin-bottom: 10px;
}

.mainWsrap .superior .superiorCore .latestEvent ol li:last-child {
  margin-bottom: 0;
}

.mainWsrap .superior .superiorCore .latestEvent ol li a {
  display: flex;
  align-items: center;
  gap: 10px;
}

.mainWsrap .superior .superiorCore .latestEvent ol li a span {
  padding: 2px 5px;
  border: 1px solid #aabbd6;
  color: #013384;
  white-space: nowrap;
  min-width: 17%;
  text-align: center;
}

.mainWsrap .superior .superiorCore .latestEvent ol li a p {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  flex: 1;
}

.mainWsrap .superior .superiorCore .latestEvent ol li:hover a p,
.mainWsrap .superior .superiorCore .latestEvent ol li:hover a time {
  color: #013384;
}

.mainWsrap .superior .superiorCore .viralVideo {
  width: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.mainWsrap .superior .superiorCore .viralVideo ul {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.mainWsrap .superior .superiorCore .viralVideo ul li {
  width: 100%;
  overflow: hidden;
  flex: 1;
}

.mainWsrap .superior .superiorCore .viralVideo ul li:last-child {
  margin-bottom: 0;
}

.mainWsrap .superior .superiorCore .viralVideo ul li a {
  display: block;
  width: 100%;
  height: fit-content;
}

.mainWsrap .superior .superiorCore .viralVideo ul li a .trailer {
  width: 100%;
  height: 105px;
  position: relative;
  margin-bottom: 5px;
}

.mainWsrap .superior .superiorCore .viralVideo ul li a .trailer .visual {
  width: 100%;
  height: 100%;
}

.mainWsrap .superior .superiorCore .viralVideo ul li a .trailer .play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
}

.mainWsrap .superior .superiorCore .viralVideo ul li a p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 2;
  font-size: 13px;
}

.mainWsrap .superior .superiorCore .viralVideo ul li:hover a p {
  color: #013384;
}

@media screen and (max-width: 768px) {
  .mainWsrap .superior .superiorCore {
    grid-template-columns: auto;
    gap: 0.26667rem;
  }
  .mainWsrap .superior .superiorCore .topNews ul {
    gap: 0.13333rem;
  }
  .mainWsrap .superior .superiorCore .topNews ul li a img {
    height: 1.8rem;
    margin-bottom: 0.06667rem;
  }
  .mainWsrap .superior .superiorCore .topNews ul li a p {
    font-size: 0.30667rem;
  }
  .mainWsrap .superior .superiorCore .topNews ul li:first-child {
    grid-column: span 2;
    width: 100%;
  }
  .mainWsrap .superior .superiorCore .topNews ul li:first-child a {
    height: 3.2rem;
  }
  .mainWsrap .superior .superiorCore .topNews ul li:first-child a p {
    padding: 0.13333rem;
    font-size: 0.30667rem;
  }
  .mainWsrap .superior .superiorCore .latestEvent ol li {
    margin-bottom: 0.13333rem;
  }
  .mainWsrap .superior .superiorCore .latestEvent ol li a {
    gap: 0.13333rem;
  }
  .mainWsrap .superior .superiorCore .latestEvent ol li a span {
    padding: 0.06667rem 0.13333rem;
  }
  .mainWsrap .superior .superiorCore .latestEvent ol li a p {
    font-size: 0.32rem;
  }
  .mainWsrap .superior .superiorCore .viralVideo ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.26667rem;
  }
  .mainWsrap .superior .superiorCore .viralVideo ul li {
    margin-bottom: 0.13333rem;
  }
  .mainWsrap .superior .superiorCore .viralVideo ul li a .trailer {
    height: 2rem;
    margin-bottom: 0.06667rem;
  }
  .mainWsrap .superior .superiorCore .viralVideo ul li a .trailer .play {
    width: 0.66667rem;
    height: 0.66667rem;
  }
  .mainWsrap .superior .superiorCore .viralVideo ul li a p {
    font-size: 0.30667rem;
  }
}

.mainWsrap .bestsel {
  height: fit-content;
  padding: 30px 0 60px;
  box-sizing: border-box;
}

@media screen and (max-width: 1000px) {
  .mainWsrap .bestsel {
    padding: 30px 10px 60px;
  }
}

@media screen and (max-width: 768px) {
  .mainWsrap .bestsel {
    padding: 0.4rem 0.13333rem 0.8rem;
  }
}

.mainWsrap .bestsel .bestselCore {
  display: flex;
  gap: 20px;
}

.mainWsrap .bestsel .bestselCore .progress {
  flex: 1;
  overflow: hidden;
}

.mainWsrap .bestsel .bestselCore .featured {
  width: 27%;
  height: fit-content;
  overflow: hidden;
}

.mainWsrap .bestsel .bestselCore .featured .material {
  background: #fff;
  margin-bottom: 20px;
}

.mainWsrap .bestsel .bestselCore .featured .material:last-child {
  margin-bottom: unset;
}

.mainWsrap .bestsel .bestselCore .featured .material .indicate {
  border-top: 2px solid #013384;
  display: flex;
  background: rgba(238, 241, 247, 0.8);
}

.mainWsrap .bestsel .bestselCore .featured .material .indicate a {
  padding: 15px;
}

.mainWsrap .bestsel .bestselCore .featured .material .indicate a.active {
  background: #013384;
  color: #fff;
}

.mainWsrap .bestsel .bestselCore .featured .sportsNews {
  height: fit-content;
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
}

@media screen and (max-width: 768px) {
  .mainWsrap .bestsel .bestselCore .featured .sportsNews {
    padding: 0.2rem;
  }
}

.mainWsrap .bestsel .bestselCore .featured .sportsNews ul li {
  border-bottom: 1px solid #dde4ef;
  margin-bottom: 10px;
}

.mainWsrap .bestsel .bestselCore .featured .sportsNews ul li:last-child {
  margin-bottom: unset;
}

.mainWsrap .bestsel .bestselCore .featured .sportsNews ul li a {
  display: flex;
  gap: 10px;
  padding-bottom: 10px;
}

.mainWsrap .bestsel .bestselCore .featured .sportsNews ul li a img {
  width: 25px;
}

.mainWsrap .bestsel .bestselCore .featured .sportsNews ul li a p {
  flex: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.mainWsrap .bestsel .bestselCore .featured .sportsNews ul li:hover a p {
  color: #013384;
}

.mainWsrap .bestsel .bestselCore .featured .sportsVideos {
  height: fit-content;
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
}

@media screen and (max-width: 768px) {
  .mainWsrap .bestsel .bestselCore .featured .sportsVideos {
    padding: 0.2rem;
  }
}

.mainWsrap .bestsel .bestselCore .featured .sportsVideos ul li {
  margin-bottom: 10px;
}

.mainWsrap .bestsel .bestselCore .featured .sportsVideos ul li:last-child {
  margin-bottom: 0;
}

.mainWsrap .bestsel .bestselCore .featured .sportsVideos ul li a .glance {
  width: 100%;
  height: 135px;
  position: relative;
  margin-bottom: 10px;
}

.mainWsrap .bestsel .bestselCore .featured .sportsVideos ul li a .glance img {
  width: 100%;
  height: 100%;
}

.mainWsrap
  .bestsel
  .bestselCore
  .featured
  .sportsVideos
  ul
  li
  a
  .glance
  img.play_icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50px;
  height: 50px;
}

.mainWsrap .bestsel .bestselCore .featured .sportsVideos ul li a .glance time {
  position: absolute;
  bottom: 8px;
  right: 8px;
  color: #fff;
  padding: 3px 8px;
  border-radius: 10px;
  background: rgba(200, 200, 200, 0.18);
}

.mainWsrap .bestsel .bestselCore .featured .sportsVideos ul li a P {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 12px;
  font-weight: bold;
}

@media screen and (max-width: 768px) {
  .mainWsrap .bestsel .bestselCore .featured .material {
    margin-bottom: 0.26667rem;
  }
  .mainWsrap .bestsel .bestselCore .featured .material .indicate {
    border-top-width: 0.02667rem;
  }
  .mainWsrap .bestsel .bestselCore .featured .material .indicate a {
    padding: 0.13333rem 0.2rem;
    font-size: 0.32rem;
  }
  .mainWsrap .bestsel .bestselCore .featured .sportsNews ul li {
    margin-bottom: 0.13333rem;
  }
  .mainWsrap .bestsel .bestselCore .featured .sportsNews ul li a {
    gap: 0.13333rem;
    padding-bottom: 0.13333rem;
  }
  .mainWsrap .bestsel .bestselCore .featured .sportsNews ul li a img {
    width: 0.33333rem;
  }
  .mainWsrap .bestsel .bestselCore .featured .sportsNews ul li a p {
    font-size: 0.32rem;
  }
  .mainWsrap .bestsel .bestselCore .featured .sportsVideos ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.2rem;
  }
  .mainWsrap .bestsel .bestselCore .featured .sportsVideos ul li {
    width: 100%;
    overflow: hidden;
    margin-bottom: unset;
  }
  .mainWsrap .bestsel .bestselCore .featured .sportsVideos ul li a .glance {
    height: 1.8rem;
    margin-bottom: 0.13333rem;
  }
  .mainWsrap
    .bestsel
    .bestselCore
    .featured
    .sportsVideos
    ul
    li
    a
    .glance
    img.play_icon {
    width: 0.66667rem;
    height: 0.66667rem;
  }
  .mainWsrap
    .bestsel
    .bestselCore
    .featured
    .sportsVideos
    ul
    li
    a
    .glance
    time {
    bottom: 0.10667rem;
    right: 0.10667rem;
    padding: 0.04rem 0.10667rem;
    border-radius: 0.13333rem;
  }
  .mainWsrap .bestsel .bestselCore .featured .sportsVideos ul li a P {
    font-size: 0.29333rem;
  }
}

@media screen and (max-width: 768px) {
  .mainWsrap .bestsel .bestselCore {
    flex-wrap: wrap;
    gap: 0.26667rem;
  }
  .mainWsrap .bestsel .bestselCore .progress {
    width: 100%;
  }
  .mainWsrap .bestsel .bestselCore .featured {
    width: 100%;
  }
}

.mainWsrap .trending {
  height: fit-content;
  padding: 30px 0 60px;
  box-sizing: border-box;
}

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

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

.mainWsrap .trending .trendCore {
  background: #fff;
  padding: 15px;
  box-sizing: border-box;
}

.mainWsrap .trending .trendCore .hotSearch ul {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}

.mainWsrap .trending .trendCore .hotSearch ul li {
  border: 1px solid #d5d5d5;
  border-radius: 5px;
}

.mainWsrap .trending .trendCore .hotSearch ul li a {
  display: flex;
  padding: 10px 20px;
  position: relative;
  overflow: hidden;
}

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

.mainWsrap .trending .trendCore .hotSearch ul li a .searchTit {
  transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}

.mainWsrap .trending .trendCore .hotSearch ul li:hover {
  border-color: #013384;
}

.mainWsrap .trending .trendCore .hotSearch ul li:hover a .iconfont {
  right: 8px;
  color: #013384;
}

.mainWsrap .trending .trendCore .hotSearch ul li:hover a .searchTit {
  color: #013384;
  transform: translateX(-12px);
}

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

.mainWsrap .favourite {
  height: fit-content;
  padding: 30px 0 60px;
  box-sizing: border-box;
}

@media screen and (max-width: 1000px) {
  .mainWsrap .favourite {
    padding: 30px 10px 60px;
  }
}

@media screen and (max-width: 768px) {
  .mainWsrap .favourite {
    padding: 0.4rem 0.13333rem 0.8rem;
  }
}

.mainWsrap .favourite .demandCore {
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
}

@media screen and (max-width: 768px) {
  .mainWsrap .favourite .demandCore {
    padding: 0.2rem;
  }
}

.mainWsrap .favourite .demandCore .hotVideos {
  height: fit-content;
}

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

.mainWsrap .favourite .demandCore .hotVideos ul li {
  width: 100%;
  overflow: hidden;
}

.mainWsrap .favourite .demandCore .hotVideos ul li a .exhibi {
  width: 100%;
  height: 130px;
  margin-bottom: 10px;
  position: relative;
}

.mainWsrap .favourite .demandCore .hotVideos ul li a .exhibi img {
  width: 100%;
  height: 100%;
}

.mainWsrap .favourite .demandCore .hotVideos ul li a .exhibi img.play_icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50px;
  height: 50px;
}

.mainWsrap .favourite .demandCore .hotVideos ul li a p {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 13px;
  font-weight: bold;
}

@media screen and (max-width: 768px) {
  .mainWsrap .favourite .demandCore .hotVideos ul {
    grid-template-columns: repeat(3, 1fr);
    gap: 0.2rem;
  }
  .mainWsrap .favourite .demandCore .hotVideos ul li a .exhibi {
    height: 2rem;
    margin-bottom: 0.13333rem;
  }
  .mainWsrap .favourite .demandCore .hotVideos ul li a .exhibi img.play_icon {
    width: 0.66667rem;
    height: 0.66667rem;
  }
  .mainWsrap .favourite .demandCore .hotVideos ul li a p {
    font-size: 0.30667rem;
  }
}

.mainWsrap .exclusive {
  height: fit-content;
  padding: 30px 0 60px;
  box-sizing: border-box;
}

@media screen and (max-width: 1000px) {
  .mainWsrap .exclusive {
    padding: 30px 10px 60px;
  }
}

@media screen and (max-width: 768px) {
  .mainWsrap .exclusive {
    padding: 0.4rem 0.13333rem 0.8rem;
  }
}

.mainWsrap .exclusive .launchTeams {
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
}

@media screen and (max-width: 768px) {
  .mainWsrap .exclusive .launchTeams {
    padding: 0.2rem;
  }
}

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

.mainWsrap .exclusive .launchTeams ul li {
  background: #eef1f7;
  border: 1px solid #c9d4e5;
}

.mainWsrap .exclusive .launchTeams ul li figure {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 25px 10px;
  box-sizing: border-box;
}

.mainWsrap .exclusive .launchTeams ul li figure img {
  width: 60px;
}

.mainWsrap .exclusive .launchTeams ul li figure figcaption {
  margin-top: 10px;
  font-weight: bold;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.mainWsrap .exclusive .launchTeams ul li:hover {
  background: #ccd6e6;
  border: 1px solid #013384;
}

.mainWsrap .exclusive .launchTeams ul li:hover figure figcaption {
  color: #013384;
}

@media screen and (max-width: 768px) {
  .mainWsrap .exclusive .launchTeams ul {
    grid-template-columns: repeat(4, 1fr);
    gap: 0.2rem;
  }
  .mainWsrap .exclusive .launchTeams ul li figure {
    padding: 0.33333rem 0.13333rem;
  }
  .mainWsrap .exclusive .launchTeams ul li figure img {
    width: 0.8rem;
  }
  .mainWsrap .exclusive .launchTeams ul li figure figcaption {
    margin-top: 0.13333rem;
    font-size: 0.32rem;
  }
}

.mainWsrap .curated {
  height: fit-content;
  padding: 30px 0 60px;
  box-sizing: border-box;
}

@media screen and (max-width: 1000px) {
  .mainWsrap .curated {
    padding: 30px 10px 60px;
  }
}

@media screen and (max-width: 768px) {
  .mainWsrap .curated {
    padding: 0.4rem 0.13333rem 0.8rem;
  }
}

.mainWsrap .curated .curatedArea {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
}

@media screen and (max-width: 768px) {
  .mainWsrap .curated .curatedArea {
    padding: 0.2rem;
  }
}

.mainWsrap .curated .curatedArea .curatedNews {
  width: 100%;
}

.mainWsrap .curated .curatedArea .curatedNews ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}

.mainWsrap .curated .curatedArea .curatedNews ul li {
  width: 100%;
  overflow: hidden;
}

.mainWsrap .curated .curatedArea .curatedNews ul li a {
  display: block;
  width: 100%;
}

.mainWsrap .curated .curatedArea .curatedNews ul li a img {
  width: 100%;
  height: 125px;
  margin-bottom: 5px;
}

.mainWsrap .curated .curatedArea .curatedNews ul li a p {
  width: 100%;
  box-sizing: border-box;
  font-size: 13px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.mainWsrap .curated .curatedArea .curatedNews ul li:hover a p {
  color: #013384;
}

.mainWsrap .curated .curatedArea .curatedNews ul li:first-child {
  grid-column: span 2;
  width: 100%;
}

.mainWsrap .curated .curatedArea .curatedNews ul li:first-child a {
  display: block;
  width: 100%;
  height: 200px;
  position: relative;
}

.mainWsrap .curated .curatedArea .curatedNews ul li:first-child a img {
  width: 100%;
  height: 100%;
}

.mainWsrap .curated .curatedArea .curatedNews ul li:first-child a p {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  background: rgba(0, 0, 0, 0.1);
  color: #fff;
  font-size: 13px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.mainWsrap .curated .curatedArea .hottestNews {
  width: 100%;
  height: fit-content;
  overflow: hidden;
  --color1: #fe2d46;
  --color2: #ff6600;
  --color3: #fbb10e;
  --color4: #013384;
}

.mainWsrap .curated .curatedArea .hottestNews ul li {
  margin-bottom: 10px;
}

.mainWsrap .curated .curatedArea .hottestNews ul li:last-child {
  margin-bottom: 0;
}

.mainWsrap .curated .curatedArea .hottestNews ul li a {
  display: flex;
  gap: 10px;
  align-items: center;
}

.mainWsrap .curated .curatedArea .hottestNews ul li a .place {
  width: 20px;
  height: 20px;
  text-align: center;
}

.mainWsrap .curated .curatedArea .hottestNews ul li a .place span {
  font-size: 18px;
  font-weight: bold;
}

.mainWsrap .curated .curatedArea .hottestNews ul li a .place span.iconfont {
  color: #f73131;
}

.mainWsrap .curated .curatedArea .hottestNews ul li a p {
  flex: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.mainWsrap .curated .curatedArea .hottestNews ul li:nth-child(2) a .place span {
  color: var(--color1);
}

.mainWsrap .curated .curatedArea .hottestNews ul li:nth-child(3) a .place span {
  color: var(--color2);
}

.mainWsrap .curated .curatedArea .hottestNews ul li:nth-child(4) a .place span {
  color: var(--color3);
}

.mainWsrap .curated .curatedArea .hottestNews ul li:nth-child(5) a .place span {
  color: var(--color4);
}

@media screen and (max-width: 768px) {
  .mainWsrap .curated .curatedArea {
    grid-template-columns: auto;
    gap: 0.26667rem;
    background: unset;
    padding: 0;
  }
  .mainWsrap .curated .curatedArea .curatedNews {
    background: #fff;
    padding: 0.2rem;
  }
  .mainWsrap .curated .curatedArea .curatedNews ul {
    gap: 0.13333rem;
  }
  .mainWsrap .curated .curatedArea .curatedNews ul li a img {
    height: 1.66667rem;
    margin-bottom: 0.06667rem;
  }
  .mainWsrap .curated .curatedArea .curatedNews ul li a p {
    font-size: 0.30667rem;
  }
  .mainWsrap .curated .curatedArea .curatedNews ul li:first-child a {
    height: 2.66667rem;
  }
  .mainWsrap .curated .curatedArea .curatedNews ul li:first-child a p {
    padding: 0.13333rem;
    font-size: 0.30667rem;
  }
  .mainWsrap .curated .curatedArea .hottestNews {
    background: #fff;
    padding: 0.2rem;
  }
  .mainWsrap .curated .curatedArea .hottestNews ul li {
    margin-bottom: 0.13333rem;
  }
  .mainWsrap .curated .curatedArea .hottestNews ul li a {
    gap: 0.13333rem;
  }
  .mainWsrap .curated .curatedArea .hottestNews ul li a .place {
    width: 0.24rem;
  }
  .mainWsrap .curated .curatedArea .hottestNews ul li a .place span {
    font-size: 0.37333rem;
  }
  .mainWsrap .curated .curatedArea .hottestNews ul li a p {
    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 .advocate {
  width: 30%;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.exosphere .advocate .product {
  background: #fff;
}

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

.exosphere .advocate .product .prompt .promptIcon {
  display: flex;
  align-items: center;
  gap: 5px;
}

.exosphere .advocate .product .prompt .promptIcon img {
  width: 20px;
}

.exosphere .advocate .product .prompt .promptIcon strong {
  font-size: 16px;
  font-weight: bold;
}

.exosphere .advocate .product .prompt a {
  display: flex;
  align-items: center;
}

.exosphere .advocate .product .prompt a .iconfont {
  font-size: 10px;
}

.exosphere .advocate .product .newsRace {
  height: fit-content;
  padding: 10px;
  --color1: #050505;
  --color2: #ff6600;
  --color3: #fbb10e;
  --color4: #013384;
}

.exosphere .advocate .product .newsRace ol li {
  margin-bottom: 15px;
}

.exosphere .advocate .product .newsRace ol li:last-child {
  margin-bottom: 0;
}

.exosphere .advocate .product .newsRace ol li a {
  display: flex;
  align-items: center;
  gap: 5px;
}

.exosphere .advocate .product .newsRace ol li a .place {
  width: 16px;
  height: 16px;
  text-align: center;
}

.exosphere .advocate .product .newsRace ol li a .place span {
  font-size: 16px;
  font-weight: bold;
}

.exosphere .advocate .product .newsRace ol li a p {
  flex: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.exosphere .advocate .product .newsRace ol li a time {
  white-space: nowrap;
  color: #9c9c9c;
}

.exosphere .advocate .product .newsRace ol li:nth-child(1) a .place span {
  color: var(--color1);
}

.exosphere .advocate .product .newsRace ol li:nth-child(2) a .place span {
  color: var(--color2);
}

.exosphere .advocate .product .newsRace ol li:nth-child(3) a .place span {
  color: var(--color3);
}

.exosphere .advocate .product .newsRace ol li:nth-child(4) a .place span {
  color: var(--color4);
}

.exosphere .advocate .product .newsRace ol li:hover a p {
  color: #013384;
}

@media screen and (max-width: 768px) {
  .exosphere .advocate .product .newsRace ol li {
    margin-bottom: 0.13333rem;
  }
  .exosphere .advocate .product .newsRace ol li a {
    gap: 0.2rem;
  }
  .exosphere .advocate .product .newsRace ol li a p {
    font-size: 0.32rem;
  }
  .exosphere .advocate .product .newsRace ol li a time {
    font-size: 0.33333rem;
  }
}

.exosphere .advocate .product .videoRace {
  height: fit-content;
  padding: 10px;
}

.exosphere .advocate .product .videoRace ul li {
  margin-bottom: 10px;
}

.exosphere .advocate .product .videoRace ul li:last-child {
  margin-bottom: 0;
}

.exosphere .advocate .product .videoRace ul li .teaser {
  height: 140px;
  position: relative;
  overflow: hidden;
}

.exosphere .advocate .product .videoRace ul li .teaser figure {
  width: 100%;
  height: 100%;
  position: relative;
}

.exosphere .advocate .product .videoRace ul li .teaser figure img {
  width: 100%;
  height: 100%;
}

.exosphere .advocate .product .videoRace ul li .teaser figure figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  color: #fff;
  font-size: 13px;
  padding: 8px;
  box-sizing: border-box;
  background: rgba(0, 0, 0, 0.1);
}

.exosphere .advocate .product .videoRace ul li .teaser .play_icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50px;
  height: 50px;
}

.exosphere .advocate .product .videoRace ul li .teaser time {
  position: absolute;
  top: 5px;
  left: 5px;
  color: #fff;
  font-size: 13px;
  font-weight: bold;
}

.exosphere .advocate .product .videoRace ul li .teaser time:last-child {
  top: unset;
  left: unset;
  bottom: 35px;
  right: 5px;
}

@media screen and (max-width: 768px) {
  .exosphere .advocate .product .prompt {
    padding: 0.13333rem;
  }
  .exosphere .advocate .product .prompt .promptIcon {
    gap: 0.06667rem;
  }
  .exosphere .advocate .product .prompt .promptIcon img {
    width: 0.33333rem;
  }
  .exosphere .advocate .product .prompt .promptIcon strong {
    font-size: 0.33333rem;
  }
  .exosphere .advocate .product .prompt a {
    font-size: 0.30667rem;
  }
  .exosphere .advocate .product .prompt a .iconfont {
    font-size: 0.18667rem;
  }
  .exosphere .advocate .product .newsRace {
    padding: 0.13333rem;
  }
  .exosphere .advocate .product .newsRace ol li {
    margin-bottom: 0.2rem;
  }
  .exosphere .advocate .product .newsRace ol li a {
    gap: 0.06667rem;
  }
  .exosphere .advocate .product .newsRace ol li a .place {
    width: 0.34667rem;
    height: 0.34667rem;
  }
  .exosphere .advocate .product .newsRace ol li a .place span {
    font-size: 0.34667rem;
  }
  .exosphere .advocate .product .newsRace ol li a p {
    font-size: 0.30667rem;
  }
  .exosphere .advocate .product .newsRace ol li a time {
    font-size: 0.32rem;
  }
  .exosphere .advocate .product .videoRace {
    padding: 0.13333rem;
  }
  .exosphere .advocate .product .videoRace ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.2rem;
  }
  .exosphere .advocate .product .videoRace ul li {
    margin-bottom: 0.13333rem;
  }
  .exosphere .advocate .product .videoRace ul li .teaser {
    height: 2.4rem;
  }
  .exosphere .advocate .product .videoRace ul li .teaser figure figcaption {
    font-size: 0.29333rem;
    padding: 0.10667rem;
  }
  .exosphere .advocate .product .videoRace ul li .teaser .play_icon {
    width: 0.66667rem;
    height: 0.66667rem;
  }
  .exosphere .advocate .product .videoRace ul li .teaser time {
    top: 0.06667rem;
    left: 0.06667rem;
    font-size: 0.32rem;
  }
  .exosphere .advocate .product .videoRace ul li .teaser time:last-child {
    bottom: 0.6rem;
    right: 0.06667rem;
  }
}

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

.preamble {
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
}

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

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

.preamble .conclusion {
  width: 100%;
  margin: 10px 0;
}

.preamble .conclusion ul {
  display: flex;
  justify-content: center;
  gap: 20px;
}

.preamble .conclusion ul li {
  display: flex;
  align-items: center;
  gap: 5px;
}

.preamble .conclusion ul li img {
  width: 15px;
}

.preamble .conclusion ul li strong,
.preamble .conclusion ul li span,
.preamble .conclusion ul li time {
  font-size: 13px;
}

@media screen and (max-width: 768px) {
  .preamble h1 {
    font-size: 0.34667rem;
  }
  .preamble .conclusion {
    margin: 0.2rem 0;
  }
  .preamble .conclusion ul {
    gap: 0.26667rem;
  }
  .preamble .conclusion ul li {
    gap: 0.06667rem;
  }
  .preamble .conclusion ul li img {
    width: 0.26667rem;
  }
  .preamble .conclusion ul li strong,
  .preamble .conclusion ul li span,
  .preamble .conclusion ul 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.29333rem;
  }
}

.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 .brilliant {
  flex: 1;
}

.stratify .brilliant ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

.stratify .brilliant ul li {
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
  border-radius: 10px;
}

@media screen and (max-width: 768px) {
  .stratify .brilliant ul li {
    padding: 0.2rem;
  }
}

.stratify .brilliant ul li .willBe {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 5px;
}

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

.stratify .brilliant ul li .combat a {
  width: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
}

.stratify .brilliant ul li .combat a img {
  width: 60px;
}

.stratify .brilliant ul li .combat a strong {
  width: 100%;
  text-align: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.stratify .brilliant ul li .combat .iconfont {
  font-size: 36px;
  text-align: center;
  color: #fec760;
}

@media screen and (max-width: 768px) {
  .stratify .brilliant ul {
    gap: 0.26667rem;
  }
  .stratify .brilliant ul li {
    border-radius: 0.13333rem;
  }
  .stratify .brilliant ul li .willBe {
    margin-bottom: 0.13333rem;
  }
  .stratify .brilliant ul li .willBe time,
  .stratify .brilliant ul li .willBe a {
    font-size: 0.32rem;
  }
  .stratify .brilliant ul li .combat a {
    gap: 0.06667rem;
  }
  .stratify .brilliant ul li .combat a img {
    width: 0.8rem;
  }
  .stratify .brilliant ul li .combat a strong {
    font-size: 0.32rem;
  }
  .stratify .brilliant ul li .combat .iconfont {
    font-size: 0.56rem;
  }
}

.hotEvents {
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
  margin-top: 20px;
}

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

.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;
  }
}

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

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

.latestNews ul li {
  height: fit-content;
  background: #fff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

.latestNews ul li a {
  display: flex;
  height: 200px;
  padding: 10px;
  box-sizing: border-box;
}

.latestNews ul li a .sneakPeek {
  height: 100%;
}

.latestNews ul li a .sneakPeek img {
  width: 300px;
  height: 100%;
}

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

.latestNews ul li a .discuss .discussTit {
  width: 100%;
}

.latestNews ul li a .discuss .discussTit .abstract {
  display: block;
  width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  margin-bottom: 5px;
  font-size: 15px;
  font-weight: bold;
}

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

.latestNews ul li a .discuss .analysis {
  display: flex;
  justify-content: space-between;
}

.latestNews ul li a .discuss .analysis .delicate {
  display: flex;
  align-items: center;
  gap: 5px;
}

.latestNews ul li a .discuss .analysis .delicate img {
  width: 15px;
}

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

.latestNews ul li:hover a .discuss .discussTit .abstract,
.latestNews ul li:hover a .discuss .discussTit p {
  color: #fff;
}

.latestNews ul li:hover a .analysis .delicate span,
.latestNews ul li:hover a .analysis .delicate time {
  color: #fff;
}

@media screen and (max-width: 768px) {
  .latestNews ul {
    gap: 0.26667rem;
  }
  .latestNews ul li a {
    height: 2.66667rem;
    padding: 0.13333rem;
  }
  .latestNews ul li a .sneakPeek img {
    width: 4rem;
  }
  .latestNews ul li a .discuss {
    padding-left: 0.13333rem;
  }
  .latestNews ul li a .discuss .discussTit .abstract {
    margin-bottom: 0.06667rem;
    font-size: 0.33333rem;
  }
  .latestNews ul li a .discuss .discussTit p {
    font-size: 0.30667rem;
  }
  .latestNews ul li a .discuss .analysis .delicate {
    gap: 0.06667rem;
  }
  .latestNews ul li a .discuss .analysis .delicate img {
    width: 0.26667rem;
  }
  .latestNews ul li a .discuss .analysis .delicate time,
  .latestNews ul li a .discuss .analysis .delicate span {
    font-size: 0.32rem;
  }
}

.newest {
  height: fit-content;
}

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

.newest ul li {
  background: #fff;
}

.newest ul li .portent {
  height: 180px;
  position: relative;
}

.newest ul li .portent img {
  width: 100%;
  height: 100%;
}

.newest ul li .portent img.play_icon {
  width: 55px;
  height: 55px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

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

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

.newest ul li .partial .analysis {
  display: flex;
  justify-content: space-between;
}

.newest ul li .partial .analysis .delicate {
  display: flex;
  align-items: center;
  gap: 5px;
}

.newest ul li .partial .analysis .delicate img {
  width: 15px;
}

@media screen and (max-width: 768px) {
  .newest ul li .portent {
    height: 2.4rem;
  }
  .newest ul li .portent img.play_icon {
    width: 0.86667rem;
    height: 0.86667rem;
  }
  .newest ul li .partial {
    height: 1.8rem;
    padding: 0.13333rem;
  }
  .newest ul li .partial p {
    font-size: 0.32rem;
  }
  .newest ul li .partial .analysis .delicate {
    gap: 0.06667rem;
  }
  .newest ul li .partial .analysis .delicate img {
    width: 0.26667rem;
  }
  .newest ul li .partial .analysis .delicate span,
  .newest ul li .partial .analysis .delicate time {
    font-size: 0.30667rem;
  }
}

.connive {
  width: 100%;
  box-sizing: border-box;
  background: #fff;
}

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

.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;
    font-size: 3.2vw;
  }
  .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 .establish {
  display: flex;
  justify-content: space-between;
  margin: 15px 0;
}

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

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

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

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

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

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

.solution .related ul li .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 .establish {
    margin: 2vw 0;
  }
  .solution .related ul li .establish .harvest {
    gap: 2vw;
  }
  .solution .related ul li .establish .harvest .amass {
    gap: 0.66667vw;
  }
  .solution .related ul li .establish .harvest .amass img {
    width: 2.66667vw;
  }
  .solution .related ul li .establish .harvest .amass span {
    font-size: 3.2vw;
  }
  .solution .related ul li .establish .creation {
    gap: 0.66667vw;
  }
  .solution .related ul li .establish .creation img {
    width: 2.66667vw;
  }
  .solution .related ul li .establish .creation span {
    font-size: 3.2vw;
  }
}

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

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

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

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

.discourse {
  height: fit-content;
  margin-top: 30px;
}

.discourse ul {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.discourse ul li {
  width: 100%;
  overflow: hidden;
  border: 1px solid #dde4ef;
  border-radius: 20px;
  overflow: hidden;
}

.discourse ul li a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 15px;
}

.discourse ul li a strong {
  white-space: nowrap;
  font-size: 13px;
  font-weight: bold;
}

.discourse ul li a p {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 13px;
  color: #546474;
}

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

.thrilling {
  width: 100%;
  height: 300px;
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 15px;
}

.thrilling .climax {
  width: 100%;
  height: 100%;
}

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

.thrilling .playBack img {
  width: 100%;
  height: 100%;
}

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

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

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

.general {
  height: fit-content;
}

.general ol {
  margin-bottom: 10px;
}

.general ol li {
  margin-bottom: 10px;
}

.general ol li:last-child {
  margin-bottom: 0;
}

.general .fantastic p {
  margin-bottom: 10px;
}

.general .fantastic p:last-child {
  margin-bottom: 0;
}

@media screen and (max-width: 768px) {
  .general ol {
    margin-bottom: 0.13333rem;
  }
  .general ol li {
    margin-bottom: 0.13333rem;
  }
  .general ol li span,
  .general ol li a {
    font-size: 0.30667rem;
  }
  .general .fantastic p {
    margin-bottom: 0.13333rem;
    font-size: 0.30667rem;
  }
}

.tourVideo {
  margin-top: 20px;
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
}

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

.tourVideo .relevancy {
  height: fit-content;
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 15px;
}

.tourVideo .relevancy img {
  width: 20px;
}

.tourVideo .relevancy strong {
  font-size: 16px;
  font-weight: bold;
}

.tourVideo .similar {
  height: fit-content;
}

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

.tourVideo .similar ul li a .exhibition {
  height: 145px;
  position: relative;
  margin-bottom: 10px;
}

.tourVideo .similar ul li a .exhibition .excellent {
  width: 100%;
  height: 100%;
}

.tourVideo .similar ul li a .exhibition .control {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50px;
  height: 50px;
}

.tourVideo .similar ul li a .exhibition .control img {
  width: 100%;
  height: 100%;
}

.tourVideo .similar ul li a .exhibition time {
  position: absolute;
  top: 5px;
  left: 5px;
  color: #fff;
}

.tourVideo .similar ul li a .exhibition time:last-child {
  top: unset;
  left: unset;
  bottom: 5px;
  right: 5px;
}

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

@media screen and (max-width: 768px) {
  .tourVideo {
    margin-top: 0.26667rem;
  }
  .tourVideo .relevancy {
    gap: 0.06667rem;
    margin-bottom: 0.2rem;
  }
  .tourVideo .relevancy img {
    width: 0.33333rem;
  }
  .tourVideo .relevancy strong {
    font-size: 0.33333rem;
  }
  .tourVideo .similar ul {
    gap: 0.2rem;
  }
  .tourVideo .similar ul li a .exhibition {
    height: 2.4rem;
    margin-bottom: 0.13333rem;
  }
  .tourVideo .similar ul li a .exhibition .control {
    width: 0.86667rem;
    height: 0.86667rem;
  }
  .tourVideo .similar ul li a .exhibition time {
    top: 0.06667rem;
    left: 0.06667rem;
    font-size: 0.30667rem;
  }
  .tourVideo .similar ul li a .exhibition time:last-child {
    bottom: 0.06667rem;
    right: 0.06667rem;
  }
  .tourVideo .similar ul li a p {
    font-size: 0.30667rem;
  }
}

.splendid {
  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;
  display: grid;
  grid-template-columns: 3fr 2fr 3fr;
  align-items: center;
}

.splendid .backbone figure {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.splendid .backbone figure img {
  width: 80px;
}

.splendid .backbone figure figcaption {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 16px;
  color: #fff;
}

.splendid .verdict {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
}

.splendid .verdict time {
  color: #fff;
  font-size: 16px;
}

.splendid .verdict .tally {
  display: flex;
  gap: 5px;
}

.splendid .verdict .tally span {
  color: #fff;
  font-size: 24px;
  font-weight: bold;
}

.splendid .verdict a {
  color: #fff;
}

.splendid .auxiliary {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  background: rgba(0, 15, 56, 0.2);
  display: flex;
  padding: 10px;
}

.splendid .auxiliary strong {
  color: #fff;
}

.splendid .auxiliary a {
  flex: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  color: #fff;
}

@media screen and (max-width: 768px) {
  .splendid {
    height: 4.8rem;
    border-radius: 0.13333rem;
  }
  .splendid .backbone figure {
    gap: 0.13333rem;
  }
  .splendid .backbone figure img {
    width: 1.33333rem;
  }
  .splendid .backbone figure figcaption {
    font-size: 0.32rem;
  }
  .splendid .verdict {
    gap: 0.2rem;
  }
  .splendid .verdict time {
    font-size: 0.32rem;
  }
  .splendid .verdict .tally {
    gap: 0.06667rem;
  }
  .splendid .verdict .tally span {
    font-size: 0.4rem;
    font-weight: bold;
  }
  .splendid .verdict a {
    font-size: 0.30667rem;
  }
  .splendid .auxiliary {
    padding: 0.2rem 0.13333rem;
  }
  .splendid .auxiliary strong,
  .splendid .auxiliary a {
    font-size: 0.30667rem;
  }
}

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

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

.involved {
  padding: 15px;
  box-sizing: border-box;
  background: #fff;
  margin-top: 20px;
}

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

@media screen and (max-width: 768px) {
  .involved {
    margin-top: 0.26667rem;
  }
}

.involved .involvedNav {
  height: fit-content;
  margin-bottom: 30px;
  display: flex;
  justify-content: center;
  gap: 20px;
}

.involved .involvedNav .navTab {
  border-radius: 5px;
  overflow: hidden;
}

.involved .involvedNav .navTab a {
  display: block;
  padding: 10px 20px;
  font-weight: bold;
  white-space: nowrap;
}

.involved .involvedNav .navTab:hover {
  background: #f5f5f5;
}

.involved .involvedNav .navTab.active {
  background: #01307c;
}

.involved .involvedNav .navTab.active a {
  color: #fff;
}

@media screen and (max-width: 768px) {
  .involved .involvedNav {
    margin-bottom: 0.4rem;
    gap: 0.26667rem;
  }
  .involved .involvedNav .navTab {
    border-radius: 0.06667rem;
  }
  .involved .involvedNav .navTab a {
    padding: 0.13333rem 0.26667rem;
    font-size: 0.32rem;
  }
}

.briefing {
  height: fit-content;
}

.briefing ol li {
  margin-bottom: 10px;
}

.briefing ol li:last-child {
  margin-bottom: 0;
}

.briefing .streams {
  display: flex;
  align-items: center;
}

.briefing .streams strong {
  white-space: nowrap;
}

.briefing .streams .ul-signal {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.briefing .streams .ul-signal li {
  animation: shrink 2s ease-out infinite;
}

.briefing .streams .ul-signal li a {
  color: #01307c;
}

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

.briefing .kindly {
  margin-top: 10px;
}

.briefing .kindly p {
  margin-bottom: 10px;
}

.briefing .kindly p:last-child {
  margin-bottom: 0;
}

@media screen and (max-width: 768px) {
  .briefing ol li {
    margin-bottom: 0.13333rem;
    font-size: 0.32rem;
  }
  .briefing ol li a,
  .briefing ol li p,
  .briefing ol li time,
  .briefing ol li strong {
    font-size: 0.32rem;
  }
  .briefing .streams strong {
    font-size: 0.32rem;
  }
  .briefing .streams .ul-signal {
    gap: 0.06667rem;
  }
  .briefing .streams .ul-signal li a {
    font-size: 0.32rem;
  }
  .briefing .kindly {
    margin-top: 0.13333rem;
  }
  .briefing .kindly p {
    margin-bottom: 0.13333rem;
    font-size: 0.32rem;
  }
  .briefing .kindly p strong {
    font-size: 0.32rem;
  }
}

.together {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-bottom: 15px;
}

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

.together .ranks a img {
  height: 50px;
}

.together .ranks a strong {
  font-weight: bold;
}

.together .ranks:last-child a strong {
  text-align: right;
}

@media screen and (max-width: 768px) {
  .together {
    margin-bottom: 0.2rem;
  }
  .together .ranks a {
    gap: 0.13333rem;
  }
  .together .ranks a img {
    height: 1.06667rem;
  }
  .together .ranks a strong {
    font-size: 0.32rem;
  }
}

.genNav {
  height: fit-content;
  margin-bottom: 15px;
  display: flex;
  justify-content: center;
}

.genNav ul {
  display: flex;
  background: #f0f0f0;
  padding: 5px;
  border-radius: 5px;
  gap: 1px;
}

.genNav ul li {
  border-radius: 5px;
}

.genNav ul li a {
  display: block;
  padding: 10px 15px;
  font-weight: bold;
  border-radius: 5px;
}

.genNav ul li:hover,
.genNav ul li.active {
  background: #fff;
}

@media screen and (max-width: 768px) {
  .genNav {
    margin-bottom: 0.2rem;
  }
  .genNav ul {
    padding: 0.06667rem;
    border-radius: 0.06667rem;
  }
  .genNav ul li {
    border-radius: 0.06667rem;
  }
  .genNav ul li a {
    padding: 0.2rem;
    border-radius: 0.06667rem;
    font-size: 0.32rem;
  }
}

.whisper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
}

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

.whisper.vantage .field {
  background: linear-gradient(to right, #088a4e, #0d9c6c, #0d9c6c);
}

.whisper.vantage .field .addUp {
  background: #acdccb;
}

.whisper.vantage .field .addUp span {
  color: #0d9c6c;
}

.whisper.unlucky {
  grid-template-columns: auto;
}

.whisper.unlucky .sphere {
  width: 55%;
  margin: auto;
}

.whisper.unlucky .sphere .field {
  background: linear-gradient(to right, #6c7381, #999, #999);
}

.whisper.unlucky .sphere .field .addUp {
  background: #ccced2;
}

.whisper.unlucky .sphere .field .addUp span {
  color: #999;
}

.whisper.neutral .field {
  background: linear-gradient(to right, #37c8e7, #58cde8, #58cde8);
}

.whisper.neutral .field .addUp {
  background: #b1e5f2;
}

.whisper.neutral .field .addUp span {
  color: #58cde8;
}

.whisper .sphere {
  background: #f0f0f0;
  border-radius: 5px;
  overflow: hidden;
}

.whisper .sphere .field {
  display: flex;
  justify-content: space-between;
  padding: 10px;
  box-sizing: border-box;
}

.whisper .sphere .field .fieldTit .iconfont {
  color: #fff;
}

.whisper .sphere .field .fieldTit strong {
  color: #fff;
  font-weight: bold;
}

.whisper .sphere .field .addUp {
  border-radius: 50%;
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 20px;
}

.whisper .sphere .field .addUp span {
  font-weight: bold;
}

.whisper .sphere ol {
  padding: 5px;
  box-sizing: border-box;
}

.whisper .sphere ol li {
  margin-bottom: 8px;
}

.whisper .sphere ol li:last-child {
  margin-bottom: 0;
}
.whisper .sphere ol li.tidings-level-0 p {
  color: #013384;
}
.whisper .sphere ol li.tidings-level-1 p {
  background: #e83f52;
}

.whisper .sphere ol li.tidings-level-2 p {
  background: #ef8120;
}

.whisper .sphere ol li.tidings-level-3 p {
  background: #f8bf00;
}

.whisper .sphere ol li.tidings-level-4 p {
  background: #9bc73c;
}

.whisper .sphere ol li.tidings-level-5 p {
  background: #00a69a;
}

.whisper .sphere ol li p {
  padding: 8px;
  border-radius: 5px;
  font-weight: bold;
  font-size: 12px;
  color: #fff;
}

@media screen and (max-width: 768px) {
  .whisper .sphere {
    border-radius: 0.06667rem;
  }
  .whisper .sphere dt {
    padding: 0.13333rem;
  }
  .whisper .sphere dt .headline .iconfont {
    font-size: 0.34667rem;
  }
  .whisper .sphere dt .headline strong {
    font-size: 0.32rem;
  }
  .whisper .sphere dt .mark {
    width: 0.4rem;
    height: 0.4rem;
    line-height: 0.4rem;
  }
  .whisper .sphere dt .mark span {
    font-size: 0.32rem;
  }
  .whisper .sphere dd {
    padding: 0.13333rem;
  }
  .whisper .sphere dd p {
    padding: 0.13333rem;
    font-size: 0.32rem;
  }
}

@media screen and (max-width: 768px) {
  .whisper .sphere {
    border-radius: 0.06667rem;
  }
  .whisper .sphere .field {
    padding: 0.13333rem;
  }
  .whisper .sphere .field .fieldTit .iconfont {
    font-size: 0.34667rem;
  }
  .whisper .sphere .field .fieldTit strong {
    font-size: 0.32rem;
  }
  .whisper .sphere .field .addUp {
    width: 0.4rem;
    height: 0.4rem;
    line-height: 0.4rem;
  }
  .whisper .sphere .field .addUp span {
    font-size: 0.32rem;
  }
  .whisper .sphere ol {
    padding: 0.13333rem;
  }
  .whisper .sphere ol li p {
    padding: 0.13333rem;
    font-size: 0.32rem;
  }
}

.indicia {
  text-align: center;
  margin: 15px;
}

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

@media screen and (max-width: 768px) {
  .indicia {
    margin: 0.2rem;
  }
  .indicia strong {
    font-size: 0.34667rem;
  }
}

.earlier {
  width: 100%;
}

.earlier ul {
  border-radius: 5px;
  overflow: hidden;
}

.earlier ul li {
  display: grid;
  grid-template-columns: 2fr 3fr 1fr;
  padding: 10px;
  box-sizing: border-box;
  border-bottom: 1px solid #e0e0e0;
}

.earlier ul li:first-child,
.earlier ul li:last-child {
  border-bottom: none;
}

.earlier ul li .kickoff {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.earlier ul li .contend {
  display: grid;
  grid-template-columns: 2fr 1fr 2fr;
}

.earlier ul li .explicit {
  text-align: right;
}

.earlier ul li:first-child {
  background: #01307c;
}

.earlier ul li:first-child strong {
  font-weight: bold;
  white-space: nowrap;
  color: #fff;
  white-space: nowrap;
}

.earlier ul li:first-child .contend .team {
  text-align: center;
}

.earlier ul li:first-child .contend .panel {
  text-align: center;
}

.earlier ul li:nth-child(n + 2) {
  background: #f0f0f0;
  align-items: center;
}

.earlier ul li:nth-child(n + 2) .contend {
  align-items: center;
}

.earlier ul li:nth-child(n + 2) .contend .team {
  overflow: hidden;
}

.earlier ul li:nth-child(n + 2) .contend .team a {
  display: flex;
  align-items: center;
  gap: 10px;
}

.earlier ul li:nth-child(n + 2) .contend .team a img {
  width: 25px;
}

.earlier ul li:nth-child(n + 2) .contend .team a strong {
  flex: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.earlier ul li:nth-child(n + 2) .contend .team:first-child {
  text-align: right;
}

.earlier ul li:nth-child(n + 2) .contend .panel {
  text-align: center;
}

.earlier ul li:nth-child(n + 2):hover {
  background: #d5d5d5;
}

@media screen and (max-width: 768px) {
  .earlier ul {
    border-radius: 0.06667rem;
  }
  .earlier ul li {
    grid-template-columns: auto;
  }
  .earlier ul li:first-child {
    grid-template-columns: 2fr 3fr 1fr;
  }
  .earlier ul li:first-child strong {
    font-size: 0.32rem;
  }
  .earlier ul li:nth-child(n + 2) .kickoff time,
  .earlier ul li:nth-child(n + 2) .kickoff a {
    font-size: 0.32rem;
  }
  .earlier ul li:nth-child(n + 2) .kickoff time {
    text-align: right;
  }
  .earlier ul li:nth-child(n + 2) .contend .team a img {
    width: 0.4rem;
  }
  .earlier ul li:nth-child(n + 2) .contend .team a strong {
    font-size: 0.32rem;
  }
  .earlier ul li:nth-child(n + 2) .contend .panel {
    font-size: 0.32rem;
  }
  .earlier ul li:nth-child(n + 2) .explicit {
    text-align: center;
    font-size: 0.32rem;
  }
}

.future {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
}

.future ul {
  border-radius: 5px;
  overflow: hidden;
}

.future ul li {
  padding: 10px;
  box-sizing: border-box;
  border-bottom: 1px solid #e0e0e0;
}

.future ul li:first-child,
.future ul li:last-child {
  border-bottom: none;
}

.future ul li:first-child {
  background: #01307c;
}

.future ul li:first-child strong {
  font-weight: bold;
  white-space: nowrap;
  color: #fff;
  white-space: nowrap;
}

.future ul li:nth-child(n + 2) {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  background: #f0f0f0;
}

.future ul li:nth-child(n + 2) .contend {
  display: grid;
  grid-template-columns: 2fr 1fr 2fr;
  align-items: center;
}

.future ul li:nth-child(n + 2) .contend .team {
  overflow: hidden;
}

.future ul li:nth-child(n + 2) .contend .team a {
  display: flex;
  align-items: center;
  gap: 10px;
}

.future ul li:nth-child(n + 2) .contend .team a img {
  width: 25px;
}

.future ul li:nth-child(n + 2) .contend .team a strong {
  flex: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.future ul li:nth-child(n + 2) .contend .team:first-child {
  text-align: right;
}

.future ul li:nth-child(n + 2) .contend .panel {
  text-align: center;
}

.future ul li:nth-child(n + 2):hover {
  background: #d5d5d5;
}

@media screen and (max-width: 768px) {
  .future {
    grid-template-columns: auto;
    gap: 0.2rem;
  }
  .future ul {
    border-radius: 0.06667rem;
  }
  .future ul li {
    padding: 0.13333rem;
  }
  .future ul li:first-child strong {
    font-size: 0.32rem;
  }
  .future ul li:nth-child(n + 2) {
    gap: 0.13333rem;
  }
  .future ul li:nth-child(n + 2) .kickoff a {
    font-size: 0.32rem;
  }
  .future ul li:nth-child(n + 2) .contend .team a {
    gap: 0.13333rem;
  }
  .future ul li:nth-child(n + 2) .contend .team a img {
    width: 0.4rem;
  }
  .future ul li:nth-child(n + 2) .contend .team a strong {
    font-size: 0.32rem;
  }
  .future ul li:nth-child(n + 2) .contend .panel {
    font-size: 0.32rem;
  }
  .future ul li:nth-child(n + 2) .explicit {
    font-size: 0.32rem;
  }
}

.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;
}

.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;
}

.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: #eef1f7;
}

.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;
}

.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: 16px 0;
}

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

.retrieve ul li {
  width: fit-content;
  border: 1px solid #3e7eaa;
  background: #fff;
}

.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);
}

.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;
  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: #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: #081b30;
}

.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: #081b30;
  line-height: 24px;
  font-size: 12px;
  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;
}
.channelArea{
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
}

@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;
}