@media only screen and (max-width: 750px) {
  body .nav {
    top: 0px;
    width: 100%;
  }

  body .nav .search {
    position: fixed;
    top: 60px;
    width: 100%;
    height: 14.93333vw;
    z-index: 99;
    gap: 190px;
  }

  body .nav .search .search_box {
    position: absolute;
    left: 0;
    top: 14.93333vw;
    z-index: 999;
    height: 0;
    display: flex;
    width: 100%;
    overflow: hidden;
    flex-direction: column;
    background: var(--assistant-color);
  }

  body .nav .search .search_box .search_center ul {
    flex-direction: column;
    gap: 10px;
  }

  body .search_center {
    padding: 20px;
    width: 100%;
  }

  body .nav .search .menu {
    display: block;
    width: 8vw;
    height: 8vw;
  }

  body .nav .search .search_box .search_right {
    margin-left: 20px;
    margin-right: auto;
  }

  body .nav .search {
    padding: 0 2.66667vw;
    border-radius: 0;
    background-color: var(--assistant-color);
    transition: top 0.2s;
  }

  body .nav .search .search_left img {
    width: 18.66667vw;
    height: 7.2vw;
  }

  body .nav .search .search_left span {
    font-size: 2.4vw;
  }

  body .nav .search .search_box .search_center ul li::after {
    display: none;
  }

  body .nav .competition {
    width: 100vw;
    height: 42.8vw;
  }

  body .swiperBox .competition .competition_top .information {
    font-size: 14px;
  }

  body .swiperBox .competition .competition_top .ranksBox {
    font-size: 13px;
  }

  body .swiperBox .competition .competition_top .ranksBox .ranks a img {
    height: 8.53333vw;
  }

  body .swiperBox .competition .competition_top {
    gap: 3.46667vw;
  }

  body .swiperBox .competition .enter_live {
    width: 27.33333vw;
    height: 12.13333vw;
    font-size: 12px;
  }

  body .swiperBox .recommend_title {
    bottom: calc(90vw / 7.5);
    margin-left: 10px;
    left: 52%;
  }

  body .swiperBox .recommend_title span {
    font-size: 9.06667vw;
  }

  body .content .mian .title span {
    flex: 1;
    width: auto;
    font-size: calc(16vw / 7.5);
  }


  body .swiperBox .competition {
    width: 100%;
    gap: 2.66667vw;
    margin: calc(200vw / 7.5) auto !important;
    margin-bottom: calc(80vw / 7.5) !important;
  }

  body .nav .search {
    justify-content: space-around;
  }

  body .swiper-pagination-bullet {
    width: 5.33333vw !important;
    height: 1.6vw !important;
  }

  body .swiperBox .competition .competition_top .information {
    gap: 3.33333vw;
    font-size: 4.4vw;
  }

  body .swiperBox .competition .competition_top .ranksBox {
    font-size: 3.46667vw;
    gap: 1.6vw;
  }

  body .swiperBox .competition .enter_live {
    font-size: 2.13333vw;
  }
}


@media screen and (min-width: 1201px) {
  body .nav .search .search_box {
    height: auto !important;
  }
}

.nav {
  position: absolute;
  top: 80px;
  left: 50%;
  transform: translate(-50%);
  z-index: 99;
}

.nav .search {
  position: absolute;
  left: 50%;
  top: 20px;
  width: 100%;
  z-index: 999;
  transform: translate(-50%);
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 112px;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 20px;
  padding: 0 25px;
  gap: 20px;
}

.nav .search .search_left {
  display: flex;
  align-items: center;
  gap: 5px;
}

.nav .search .search_left img {
  vertical-align: middle;
}

.nav .search .search_left span {
  font-size: 18px;
  color: #fff;
  font-weight: 800;
}

.nav .search .search_box {
  display: flex;
  align-items: center;
  gap: 20px;
  flex: 1;
  overflow: hidden;
  transition: all 0.5s;
}

.nav .search .search_box .search_center {
  flex: 1;
  overflow-x: auto;
}

.nav .search .search_box .search_center ul {
  display: flex;
}

.nav .search .search_box .search_center ul li a {
  color: #f4f5f6;
  font-size: 16px;
  white-space: nowrap;
}

.nav .search .search_box .search_center ul li::after {
  content: "-";
  color: #fff;
  margin: 0 15px;
}

.nav .search .search_box .search_center ul li:last-child::after {
  display: none;
}

.nav .search .search_box .search_right {
  display: flex;
  align-items: center;
  width: auto;
  height: 41px;
  border-radius: 20px;
  padding-right: 10px;
}

.nav .search .search_box .search_right input {
  flex: 1;
  border: none;
  background: transparent;
  color: #fff;
  padding-left: 22px;
}

.nav .search .search_box .search_right ::-webkit-input-placeholder {
  color: #fff;
}

.nav .search .menu {
  display: none;
}

.swiperBox .recommend_title {
  position: absolute;
  left: 50%;
  bottom: 90px;
  transform: translate(-50%);
}

.swiperBox .recommend_title ul {
  display: flex;
}

.swiperBox .recommend_title ul li:last-child {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.swiperBox .recommend_title ul li a {
  color: #fff;
  white-space: nowrap;
}

.swiperBox .recommend_title ul li::after {
  content: "-";
  color: #fff;
  margin: 0 10px;
}

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

.swiperBox .recommend_title span {
  color: #fff;
  font-size: 68px;
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  display: block;
}

.swiperBox {
  position: relative;
  overflow: hidden;
  height: 487px;
}

.index_swiper {
  height: auto;
  background: url(../static/image/index_bj.jpg) no-repeat;
  background-size: 100%;
  background-position: top;
}

.swiperBox .nav_box {
  position: absolute;
  width: 100%;
  display: flex;
  transition: all 0.5s;
  height: 100%;
  z-index: -1;
}

.index_swiper .nav_box {
  opacity: 0;
}

.swiperBox .nav_box .nav_item {
  min-width: 100%;
  /* 设置每个轮播项的最小宽度为容器的宽度 */
  height: 100%;
}

.swiperBox .nav_box .nav_item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.swiperBox .nav_box .nav_boxSwiper {
  height: 100%;
}

.swiperBox .nav_box .nav_boxSwiper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.swiperBox .nav_box .nav_boxSwiper .swiper-pagination-bullet {
  width: 26px;
  height: 6px;
  border-radius: 0;
}

.swiperBox .competition {
  width: 750px;
  height: 221px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: center;
  margin: 200px auto !important;
  margin-bottom: 80px !important;
}

.swiperBox .competition .competition_top {
  flex: 1;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 26px;
  background: rgba(0, 0, 0, 0.2);
}

.swiperBox .competition .competition_top .information {
  font-size: 33px;
  color: #fff;
  display: flex;
  justify-content: center;
  gap: 25px;
}

.swiperBox .competition .competition_top .information span {
  color: #fff;
}

.swiperBox .competition .competition_top .ranksBox {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  gap: 12px;
  font-size: 26px;
}

.swiperBox .competition .competition_top .ranksBox .ranks {
  flex: 1;
  overflow: hidden;
}

.swiperBox .competition .competition_top .ranksBox .ranks a {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #fff;
  width: 100%;
}

.swiperBox .competition .competition_top .ranksBox .ranks a span {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
  display: block;
}

.swiperBox .competition .competition_top .ranksBox .ranks a img {
  width: auto;
  height: 64px;
}

.swiperBox .competition .competition_top .ranksBox .ranks:first-child a span {
  text-align: right;
}

.swiperBox .competition .enter_live {
  height: 51px;
  width: 165px;
  background-color: var(--assistant-color);
  display: flex;
}

.swiperBox .competition .enter_live a {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}

@media screen and (max-width: 530px) {
  body .footer .interlinkage .interlinkageBox {
    width: 100%;
  }

  body .footer .agreement .agreementBox ul {
    justify-content: flex-start;
  }
}

.footer .interlinkage {
  position: relative;
  left: 0;
  width: 100%;
  height: 55px;
  background-color: var(--bj-color);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

.footer .interlinkage span {
  font-size: 14px;
  color: #fff;
  white-space: nowrap;
  margin-right: 5px;
}

.footer .interlinkage .interlinkageBox {
  overflow: auto;
}

.footer .interlinkage .interlinkageBox ul {
  display: flex;
  align-items: center;
}

.footer .interlinkage .interlinkageBox ul li {
  padding: 0 8px;
  border-right: 2px solid #d1e5fa;
  font-size: 12px;
}

.footer .interlinkage .interlinkageBox ul li a {
  color: #ffffff;
  white-space: nowrap;
}

.footer .interlinkage .interlinkageBox ul li:last-child {
  border-right: none;
}

.footer .interlinkage .arrow {
  position: absolute;
  bottom: -77px;
  left: 50%;
  transform: translate(-50%);
  border: 40px solid transparent;
  border-top: 40px solid var(--bj-color);
}

.footer .interlinkage .arrow span {
  position: absolute;
  bottom: 7px;
  left: 50%;
  font-size: 27px;
  color: #fff;
  transform: translate(-55%) rotate(-90deg);
  font-weight: 800;
}

.footer .agreement {
  width: 100%;
  height: 192px;
  background-color: var(--assistant-color);
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 35px;
  justify-content: center;
}

.footer .agreement .agreementBox {
  width: 100%;
  overflow: auto;
}

.footer .agreement .agreementBox ul {
  width: 100%;
  display: flex;
  justify-content: center;
}

.footer .agreement .agreementBox ul li a {
  font-size: 16px;
  color: #fff;
  white-space: nowrap;
}

.footer .agreement .agreementBox ul li::after {
  content: "-";
  color: #fff;
  margin: 0 16px;
}

.footer .agreement .agreementBox ul li:last-child::after {
  display: none;
}

.footer .agreement p {
  text-align: center;
  color: #fff;
  font-size: 12px;
}

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

@media screen and (max-width: 750px) {
  body .content .mian {
    padding: 5px;
  }

  body .swiperBox {
    height: calc(457vw / 7.5);
  }

  body .index_swiper {
    height: auto;
  }

  body .content .mian .mian_left .news .newsBox .news_list .news_list_content p {
    padding-left: 3.86667vw;
    padding-right: 3.86667vw;
    text-indent: 6.8vw;
    font-size: 12px;
  }

  body .content .mian .mian_left .news .newsBox .news_list .news_list_content span {
    font-size: 14px;
    margin: calc(25vw / 7.5) 0;
  }

  body .content .mian .mian_left .video .video_mian .video_mian_left .play {
    width: calc(61vw / 7.5);
    height: calc(38vw / 7.5);
  }

  body .content .mian .mian_left .video .video_mian .video_mian_left .browse p {
    font-size: 10px;
  }

  body .content .mian .mian_left .video .video_mian .video_mian_left .browse span {
    white-space: nowrap;
  }

  body .content .mian .mian_left .video .video_mian .video_mian_left .browse {
    padding: 0 3.06667vw;
  }

  body .content .mian .mian_left .video .video_mian_footer {
    height: 13.33333vw;
  }

  body .content .mian .mian_left .video .video_mian_footer img {
    height: 100%;
  }

  body .content .mian .mian_left .news .newsBox .news_list .news_list_content .author .author_left {
    font-size: 2.66667vw;
    white-space: nowrap;
  }

  body .content .mian .mian_left .video .video_mian_footer img {
    object-fit: fill;
  }

  body .content .mian .mian_left .news .newsBox .news_list .news_list_content .author {
    padding: 1.46667vw;
  }

  body .content .mian .mian_left .news .newsBox .news_list .news_list_content .author .author_left span:first-child::after {
    margin: 0 1.6vw;
  }

  body .content .mian .mian_left .news .newsBox .news_list .news_list_content .author .author_right {
    gap: 2.13333vw;
  }

  body .content .mian .mian_left .news .newsBox .news_list .news_list_content .author .author_right span {
    gap: 0.66667vw;
  }

  body .content .mian .mian_right .hotinformation .hotinformationList li a .hotBox {
    font-size: 12px;
  }

  body .content .mian .mian_right .game .soon .soon_time ul li span {
    font-size: 16px;
  }

  body .content .mian .mian_right .game .soon .soon_time ul li::after {
    margin: 0 3.33333vw;
  }

  body .content .mian .mian_right .game .soon .playTime tr td p {
    font-size: 10px;
  }

  body .content .mian .mian_right .game .soon .playTime tr td a img {
    width: 4.4vw;
    height: 4.4vw;
  }

  body .content .mian .mian_right .game .soon .soon_team {
    gap: 6.53333vw;
  }

  body .content .mian .mian_right .game .time {
    height: 4vw;
    padding-left: 3.86667vw;
    padding-right: 1.46667vw;
  }

  body .content .mian .mian_left .news .newsBox .news_list .news_list_img img {
    height: 100% !important;
  }

  body .streaming_live {
    margin-top: calc(200vw / 7.5)
  }

  body .content .streaming_live .streaming_live_top {
    height: 30px;
  }

  body .content .streaming_live .streaming_live_top .streaming_left span {
    padding-right: 4vw !important;
    padding-left: calc(30vw / 7.5);
  }

  body .content .streaming_live {
    margin-bottom: calc(30vw / 7.5);
    padding: 0 calc(10vw / 7.5) !important;
  }

  body .content .streaming_live .streaming_live_bottom li .time {
    font-size: 2.26667vw;
  }

  body .cooperation {
    padding: 0 10px;
  }

  body .content .cooperation .cooperationBox ul li {
    width: 100%;
  }

  body .content .star .star_swiper img {
    height: 100%;
  }
}

@media screen and (max-width: 910px) {
  body .content .mian .mian_left .video .video_mian {
    flex-direction: column;
  }

  body .content .mian .mian_left .news .newsBox .news_list {
    flex-direction: column;
  }

  body .content .mian .mian_left .news .newsBox .news_list .news_list_img {
    width: 100%;
    height: 57.06667vw;
    display: flex;
  }

  body .content .mian .mian_left .news .newsBox .news_list .news_list_img a {
    width: 100%;
    height: 100%;
  }

  body .content .mian .mian_left .news .newsBox .news_list .news_list_img a img {
    width: 100%;
    height: 100%;
  }

  body .content .mian .mian_left .news .newsBox .newsBox_bottom {
    flex-direction: column;
  }
}

/* 最大宽度在1200px的设备（手机平板） */
@media only screen and (max-width: 1247px) {
  body .content .head .head_left span {
    padding-right: 7.33333vw;
    font-size: 12px;
  }

  body .content .head .head_center ul {
    padding-left: 7.2vw;
  }

  body .content .head .head_center ul li a {
    font-size: 12px;
  }

  body .content .streaming_live .streaming_live_top .streaming_left span {
    padding-right: 8vw;
    font-size: 11px;
  }

  body .content .streaming_live .streaming_live_top .streaming_center {
    padding-left: 8.8vw;
  }

  body .content .streaming_live .streaming_live_top .streaming_center p {
    width: 100%;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body .content .streaming_live .streaming_live_top .streaming_right .pre {
    font-size: 16px;
  }

  body .content .streaming_live .streaming_live_top .streaming_right .next {
    font-size: 16px;
  }

  body .content .streaming_live .streaming_live_top .streaming_right {
    gap: 4.26667vw;
  }

  body .content .mian {
    flex-direction: column;
  }

  body .content .mian .mian_left .news .newsBox .news_list .news_list_content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  body .content .mian .mian_left .news .newsBox .newsBox_bottom .news_list .news_list_img {
    display: flex;
  }

  body .content .mian .mian_left .news .newsBox .newsBox_bottom .news_list .news_list_img a {
    width: 100%;
    height: 100%;
  }

  body .content .mian .mian_left .news .newsBox .newsBox_bottom .news_list .news_list_img img {
    height: 100%;
    object-fit: fill;
  }
}

.content {
  width: 100%;
  overflow: hidden;
}

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

.content .head {
  width: 100%;
  height: 60px;
  display: flex;
  background-color: var(--assistant-color);
}

.content .head .head_left {
  width: 25%;
  height: 100%;
  background: var(--bj-color);
  text-align: right;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  clip-path: polygon(0 0, 0% 0%, 100% 0%, 94% 100%, 0% 100%);
}

.content .head .head_left span {
  font-size: 17px;
  color: #fff;
  padding-right: 75px;
  white-space: nowrap;
}

.content .head .head_center {
  width: 50%;
  overflow: auto;
}

.content .head .head_center ul {
  display: flex;
  height: 100%;
  align-items: center;
  padding-left: 54px;
}

.content .head .head_center ul li a {
  color: #fff;
  font-size: 14px;
  white-space: nowrap;
}

.content .head .head_center ul li a::after {
  content: "|";
  color: #fff;
  margin: 0 10px;
}

.content .head .head_center ul li:last-child a::after {
  display: none;
}

.content .head .head_right {
  width: 25%;
  background-color: var(--assistant-color);
  transform: translateX(-4%);
  display: flex;
  align-items: center;
  justify-content: center;
}

.content .head .head_right a {
  color: #fff;
  font-size: 11px;
}

.content .head .head_right a img {
  width: 10px;
  height: auto;
  vertical-align: middle;
}

.content .streaming_live {
  width: 100%;
  margin-bottom: 30px;
  z-index: 2;
  margin-top: 200px;
}

.content .streaming_live .streaming_live_top {
  display: flex;
  width: 100%;
  height: 60px;
  background-color: var(--assistant-color);
}

.content .streaming_live .streaming_live_top .streaming_left {
  width: 25%;
  height: 100%;
  background-color: #1b212b;
  clip-path: polygon(0 0, 0% 0%, 100% 0%, 94% 100%, 0% 100%);
}

.content .streaming_live .streaming_live_top .streaming_left span {
  display: flex;
  padding-left: 30px;
  align-items: center;
  height: 100%;
  padding-right: 60px;
  color: #0286d7;
  font-size: 17px;
}

.content .streaming_live .streaming_live_top .streaming_center {
  width: 50%;
  padding-left: 66px;
}

.content .streaming_live .streaming_live_top .streaming_center p {
  height: 100%;
  line-height: 60px;
  color: #fff;
  font-size: 14px;
  font-family: "微软雅黑";
}

.content .streaming_live .streaming_live_top .streaming_right {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 32px;
}

.content .streaming_live .streaming_live_top .streaming_right .pre,
.content .streaming_live .streaming_live_top .streaming_right .next {
  color: #bcbcbc;
  font-size: 32px;
  cursor: pointer;
}

.content .streaming_live .streaming_live_bottom {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding: 10px 0;
}

.content .streaming_live .streaming_live_bottom ul {
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.content .streaming_live .streaming_live_bottom li {
  width: calc(100% / 4 - 15px);
  height: 216px;
  display: flex;
  background: #fff;
  box-shadow: rgba(208, 215, 222, 0.5) 0px 0px 0px 1px,
    rgba(66, 74, 83, 0.04) 0px 6px 12px -3px,
    rgba(66, 74, 83, 0.12) 0px 6px 18px 0px;
}

.content .streaming_live .streaming_live_bottom li {
  height: 216px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
}

.content .streaming_live .streaming_live_bottom li .time {
  display: flex;
  justify-content: center;
  gap: 20px;
  font-size: 14px;
  color: #1b212b;
}

.qingbaoBox {
  width: 100%;
}

.content .streaming_live .streaming_live_bottom li .time a {
  color: #1b212b;
}

.content .streaming_live .streaming_live_bottom li .teamBox {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 15px;
  width: 100%;
}

.content .streaming_live .streaming_live_bottom li .teamBox .linkBox {
  flex: 1;
  overflow: hidden;
}

.content .streaming_live .streaming_live_bottom li .teamBox .team {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  overflow: hidden;
}

.content .streaming_live .streaming_live_bottom li .teamBox .team img {
  width: 43px;
  height: auto;
  object-fit: fill;
}

.content .streaming_live .streaming_live_bottom li .teamBox .team p {
  font-size: 14px;
  color: #333333;
  width: 100%;
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.content .streaming_live .streaming_live_bottom li .teamBox .team_vs {
  font-size: 20px;
  color: #333333;
  font-weight: 600;
}

.content .streaming_live .streaming_live_bottom li .select {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  width: 100%;
}

.content .streaming_live .streaming_live_bottom li .select div {
  display: flex;
  align-items: center;
  gap: 5px;
}

.content .streaming_live .streaming_live_bottom li .select div img {
  width: 16px;
  height: auto;
}

.content .streaming_live .streaming_live_bottom li .select div span {
  color: #1b212b;
}

.content .streaming_live .streaming_live_bottom li .select .intelligence::before {
  content: "|";
  color: #1b212b;
  margin-right: 21px;
}

.content .mian {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 20px;
}

.content .mian .title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #e7eaf0;
  height: 50px;
  width: 100%;
}

.content .mian .title span {
  height: 100%;
  line-height: 50px;
  text-align: center;
  font-size: 18px;
  color: #fff;
  width: 166px;
  background: var(--bj-color);
  clip-path: polygon(0 0, 0% 0%, 100% 0%, 85% 100%, 0% 100%);
}

.content .mian .title ul {
  display: flex;
  height: 100%;
}

.content .mian .title ul li {
  width: 88px;
  height: 100%;
  line-height: 50px;
  text-align: center;
  border: 1px solid transparent;
}

.content .mian .title ul li a {
  color: #1f1f1f;
  font-size: 15px;
}

.content .mian .title ul li a img {
  vertical-align: middle;
}

.content .mian .title ul .active {
  border-bottom: 1px solid var(--bj-color);
}

.content .mian .title ul .active a {
  color: var(--bj-color);
}

.content .mian .mian_left {
  flex: 2.5;
  display: flex;
  flex-direction: column;
  gap: 20px;
  overflow: hidden;
}

.content .mian .mian_left .video {
  display: flex;
  flex-direction: column;
}

.content .mian .mian_left .video .video_mian {
  display: flex;
  padding: 10px;
  border: 1px solid #d7d8d8;
  margin-top: 12px;
  gap: 15px;
  margin-bottom: 20px;
}

.content .mian .mian_left .video .video_mian .video_mian_left {
  flex: 2;
  width: 100%;
  position: relative;
  left: 0;
  display: flex;
}

.content .mian .mian_left .video .video_mian .video_mian_left .video_bg_box {
  width: 100%;
  height: 464px;
}

.content .mian .mian_left .video .video_mian .video_mian_left .videoImg {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.content .mian .mian_left .video .video_mian .video_mian_left .play {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.content .mian .mian_left .video .video_mian .video_mian_left .browse {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 52px;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 23px;
  box-sizing: border-box;
}

.content .mian .mian_left .video .video_mian .video_mian_left .browse p {
  font-size: 15px;
  color: #fff;
}

.content .mian .mian_left .video .video_mian .video_mian_left .browse span {
  font-size: 12px;
  color: #bcbcba;
}

.content .mian .mian_left .video .video_mian .video_mian_right {
  flex: 1;
  height: 464px;
  overflow: hidden;
}

.content .mian .mian_left .video .video_mian .video_mian_right ul {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.content .mian .mian_left .video .video_mian .video_mian_right ul li {
  width: 100%;
  flex: 1;
  padding: 8px 0;
  border-bottom: 1px solid #d7d7d7;
}

.content .mian .mian_left .video .video_mian .video_mian_right ul li .coverBox {
  display: flex;
  justify-content: space-between;
  gap: 11px;
}

.content .mian .mian_left .video .video_mian .video_mian_right ul li .coverBox .cover {
  width: 110px;
  height: 68px;
  display: block;
}

.content .mian .mian_left .video .video_mian .video_mian_right ul li .coverBox .cover .coverImg {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.content .mian .mian_left .video .video_mian .video_mian_right ul li .coverBox span {
  flex: 1;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  line-height: 22px;
}

.content .mian .mian_left .video .video_mian .video_mian_right ul li .coverBox span a {
  color: #333333;
  font-size: 12px;
}

.content .mian .mian_left .video .video_mian .video_mian_right ul li .plays {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
}

.content .mian .mian_left .video .video_mian .video_mian_right ul li .plays .playBox {
  display: flex;
  align-items: center;
  gap: 7px;
}

.content .mian .mian_left .video .video_mian .video_mian_right ul li:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.content .mian .mian_left .video .video_mian .video_mian_right ul li:first-child {
  padding-top: 0;
}

.content .mian .mian_left .video .video_mian_footer {
  width: 100%;
  height: 100px;
}

.content .mian .mian_left .video .video_mian_footer img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

.content .mian .mian_left .news .newsBox .news_list {
  display: flex;
  flex-direction: row;
  margin-bottom: 20px;
  flex: 1;
  overflow: hidden;
}

.content .mian .mian_left .news .newsBox .news_list .news_list_img {
  width: 50%;
  height: 328px;
}

.content .mian .mian_left .news .newsBox .news_list .news_list_img a {
  display: flex;
  width: 100%;
  height: 100%;
}

.content .mian .mian_left .news .newsBox .news_list .news_list_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.content .mian .mian_left .news .newsBox .news_list .news_list_content {
  text-align: center;
  flex: 1;
  height: 328px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}

.content .mian .mian_left .news .newsBox .news_list .news_list_content a>span {
  font-size: 16px;
  font-weight: 800;
  margin: 25px 0;
  color: #333;
  white-space: nowrap;
  width: 100%;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  padding-right: 35px;
  padding-left: 29px;
  box-sizing: border-box;
}

.content .mian .mian_left .news .newsBox .news_list .news_list_content span a {
  color: var(--color);
}

.content .mian .mian_left .news .newsBox .news_list .news_list_content p {
  font-size: 14px;
  color: #333333;
  line-height: 26px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  /* 显示的行数 */
  -webkit-box-orient: vertical;
  padding-right: 35px;
  padding-left: 29px;
  text-align: left;
  text-indent: 51px;
}

.content .mian .mian_left .news .newsBox .news_list .news_list_content .more {
  text-align: left;
  font-size: 14px;
  padding-left: 29px;
  margin-top: 10px;
  font-weight: 600;
  margin-bottom: 23px;
}

.content .mian .mian_left .news .newsBox .news_list .news_list_content .more a {
  color: #333333;
}

.content .mian .mian_left .news .newsBox .news_list .news_list_content .author {
  height: 47px;
  border: 1px solid #d7d8d8;
  padding: 11px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.content .mian .mian_left .news .newsBox .news_list .news_list_content .author .author_left {
  font-size: 14px;
  color: #333333;
}

.content .mian .mian_left .news .newsBox .news_list .news_list_content .author .author_left span:first-child::after {
  content: "|";
  color: #333333;
  margin: 0 12px;
}

.content .mian .mian_left .news .newsBox .news_list .news_list_content .author .author_right {
  display: flex;
  align-items: center;
  gap: 16px;
}

.content .mian .mian_left .news .newsBox .news_list .news_list_content .author .author_right .like {
  width: 16px;
  height: auto;
}

.content .mian .mian_left .news .newsBox .news_list .news_list_content .author .author_right span {
  font-size: 12px;
  color: #333333;
  display: flex;
  align-items: center;
  gap: 5px;
}

.content .mian .mian_left .news .newsBox .reversal {
  flex-direction: row-reverse;
}

.content .mian .mian_left .news .newsBox .newsBox_bottom {
  display: flex;
  gap: 20px;
}

.content .mian .mian_left .news .newsBox .newsBox_bottom .news_list {
  flex-direction: column;
}

.content .mian .mian_left .news .newsBox .newsBox_bottom .news_list .news_list_img {
  width: 100%;
}

.content .mian .mian_left .news .newsBox .newsBox_bottom .news_list .news_list_img img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

.content .mian .mian_right {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
  overflow: hidden;
}

.content .mian .mian_right .points {
  border: 1px solid #d7d8d8;
}

.content .mian .mian_right .points .channel ul {
  width: 100%;
  height: 40px;
  display: flex;
  padding: 6px;
  box-sizing: border-box;
}

.content .mian .mian_right .points .channel ul li {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
}

.content .mian .mian_right .points .channel ul li a {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #1f1f1f;
  font-size: 12px;
}

.content .mian .mian_right .points .channel ul li::after {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  content: "|";
  color: #1f1f1f;
}

.content .mian .mian_right .points .channel ul li:last-child::after {
  display: none;
}

.content .mian .mian_right .points .channel ul .active {
  background-color: var(--bj-color);
  border-radius: 5px;
}

.content .mian .mian_right .points .channel ul .active a {
  color: #fff;
}

.content .mian .mian_right .points .channel ul .active::after {
  right: -5px;
}

.content .mian .mian_right .points table,
.content .mian .mian_right .points tr,
.content .mian .mian_right .points td {
  border-collapse: collapse;
  border-spacing: 0;
  border: none;
}

.content .mian .mian_right .points table {
  width: 100%;
}

.content .mian .mian_right .points table thead tr {
  background-color: #1f1f1f;
}

.content .mian .mian_right .points table tr {
  height: 41px;
  line-height: 42px;
  background-color: #383838;
  border-bottom: 1px solid transparent;
}

.content .mian .mian_right .points table tr td {
  border-right: 1px solid #2c2c2c;
  color: #b0bec5;
  text-align: center;
}

.content .mian .mian_right .points table tr td img {
  vertical-align: middle;
  width: 26px;
  height: auto;
}

.content .mian .mian_right .points table tr:nth-child(2n) {
  background-color: #1f1f1f;
}

.content .mian .mian_right .points table tbody tr td:nth-child(2) {
  text-align: left;
  padding-left: 20px;
  box-sizing: border-box;
}

.content .mian .mian_right .points table tbody tr td:nth-child(2) span {
  margin-left: 10px;
  color: #b0bec5;
}

.content .mian .mian_right .points table tfoot tr td {
  color: var(--bj-color);
  font-size: 25px;
}

.content .mian .mian_right .points table tfoot tr td a {
  color: var(--bj-color);

}

.content .mian .mian_right .points table tbody tr:hover {
  background-color: var(--bj-color);
  border-bottom: 1px solid #fff;
}

.content .mian .mian_right .points table tbody tr:hover td {
  color: #fff;
  border-right: 1px solid transparent;
}

.content .mian .mian_right .hotinformation {
  border: 1px solid #d7d8d8;
}

.content .mian .mian_right .hotinformation .hotinformationList li {
  position: relative;
  height: 67px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #d7d8d8;
  padding: 0 14px;
  box-sizing: border-box;
}

.content .mian .mian_right .hotinformation .hotinformationList li a {
  display: flex;
  align-items: center;
  gap: 23px;
  width: 100%;
}

.content .mian .mian_right .hotinformation .hotinformationList li a .hot_ranking {
  font-size: 25px;
  font-weight: 800;
  color: #cfcfcf;
}

.content .mian .mian_right .hotinformation .hotinformationList li a .hotBox {
  font-size: 13px;
  flex: 1;
  overflow: hidden;
}

.content .mian .mian_right .hotinformation .hotinformationList li a .hotBox span {
  color: #181818;
  line-height: 24px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  width: 100%;
}

.content .mian .mian_right .hotinformation .hotinformationList li a .hot {
  position: absolute;
  right: 5px;
  bottom: 0;
  display: flex;
  align-items: center;
}

.content .mian .mian_right .hotinformation .hotinformationList li a .hot img {
  width: 8px;
  height: auto;
  margin-right: 3px;
}

.content .mian .mian_right .hotinformation .hotinformationList li a .hot span {
  color: #cfcfcf;
}

.content .mian .mian_right .hotinformation .hotinformationList li:nth-child(1) .hot_ranking {
  color: #ed7f7f;
}

.content .mian .mian_right .hotinformation .hotinformationList li:nth-child(1) .hot span {
  color: #ed7f7f;
}

.content .mian .mian_right .hotinformation .hotinformationList li:nth-child(2) .hot_ranking {
  color: #f9df86;
}

.content .mian .mian_right .hotinformation .hotinformationList li:nth-child(2) .hot span {
  color: #f9df86;
}

.content .mian .mian_right .hotinformation .hotinformationList li:nth-child(3) .hot_ranking {
  color: #ffcc00;
}

.content .mian .mian_right .hotinformation .hotinformationList li:nth-child(3) .hot span {
  color: #ffcc00;
}

.content .mian .mian_right .game {
  border: 1px solid #d7d8d8;
}

.content .mian .mian_right .game .time {
  height: 30px;
  background: url(../static/image/game_time.jpg) no-repeat;
  background-size: 100% 100%;
  background-position: center;
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 29px;
  padding-right: 11px;
  box-sizing: border-box;
}

.content .mian .mian_right .game .time .time_left {
  color: #333333;
  font-size: 12px;
}

.content .mian .mian_right .game .time .time_right {
  color: #fff;
  font-size: 12px;
}

.content .mian .mian_right .game .soon {
  padding: 15px;
}

.content .mian .mian_right .game .soon .soon_team {
  display: flex;
  justify-content: center;
  gap: 20px;
}

.content .mian .mian_right .game .soon .soon_team .soon_team_info {
  display: flex;
  flex: 1;
  overflow: hidden;
}

.content .mian .mian_right .game .soon .soon_team .soon_team_info a {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  overflow: hidden;
}

.content .mian .mian_right .game .soon .soon_team .soon_team_info img {
  width: 42px;
  height: auto;
}

.content .mian .mian_right .game .soon .soon_team .soon_team_info p {
  font-size: 16px;
  color: #5d5d5d;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.content .mian .mian_right .game .soon .soon_team .soon_team_vs {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.content .mian .mian_right .game .soon .soon_team .soon_team_vs .vsBox {
  border: 1px solid #f3f3f3;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  text-align: center;
  line-height: 45px;
  font-size: 12px;
  font-weight: 800;
  color: #333;
}

.content .mian .mian_right .game .soon .soon_team .soon_team_vs div {
  color: #333;
}

.content .mian .mian_right .game .soon .soon_time {
  height: 59px;
  margin-top: 17px;
  margin-bottom: 22px;
}

.content .mian .mian_right .game .soon .soon_time ul {
  height: 100%;
  background-color: #f1f1f1;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.content .mian .mian_right .game .soon .soon_time ul li {
  display: flex;
  text-align: center;
}

.content .mian .mian_right .game .soon .soon_time ul li span {
  font-size: 20px;
  font-weight: 800;
}

.content .mian .mian_right .game .soon .soon_time ul li p {
  color: #918f8d;
  font-size: 12px;
}

.content .mian .mian_right .game .soon .soon_time ul li::after {
  content: ":";
  color: #343434;
  margin: 0 5px;
  font-size: 20px;
  font-weight: 800;
}

.content .mian .mian_right .game .soon .soon_time ul li:last-child::after {
  display: none;
}

.content .mian .mian_right .game .soon .playTime {
  width: 100%;
}

.content .mian .mian_right .game .soon .playTime tr {
  height: 60px;
  border-top: 1px solid #f1f1f1;
}

.content .mian .mian_right .game .soon .playTime tr td {
  text-align: center;
}

.content .mian .mian_right .game .soon .playTime tr td p {
  color: #333333;
  font-size: 12px;
}

.content .mian .mian_right .game .soon .playTime tr td .team_time_vs {
  width: 16px;
  height: auto;
}

.content .mian .mian_right .game .soon .playTime tr td img {
  vertical-align: middle;
}

.content .mian .mian_right .game .soon .playTime tr td span {
  color: #333333;
  font-size: 12px;
  width: 50px;
  display: inline-block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.content .mian .mian_right .game .soon .playTime tr td img {
  width: 20px;
  height: auto;
}

.content .mian .mian_right .game .soon .playTime,
.content .mian .mian_right .game .soon tr,
.content .mian .mian_right .game .soon td {
  border: none;
  border-collapse: collapse;
  border-spacing: 0;
}

.content .star {
  height: 458px;
  background: url(https://www.hysigong.com/template/fivesets/static/image/star_bj.jpg) no-repeat;
  background-size: cover;
  background-position: center;
  padding: 20px;
  box-sizing: border-box;
}

.content .star .star_title {
  width: 165px;
  height: 50px;
  background-color: var(--bj-color);
  clip-path: polygon(0 0, 0% 0%, 100% 0%, 85% 100%, 0% 100%);
  color: #fff;
  line-height: 50px;
  text-align: center;
  font-size: 18px;
  margin-bottom: 20px;
}

.content .star .star_swiper {
  position: relative;
  overflow: hidden;
  padding: 0 50px;
}

.content .star .star_swiper img {
  height: 256px;
}

.content .star .star_swiper .briefBox {
  display: flex;
  gap: 14px;
  align-items: center;
  margin-top: 10px;
}

.content .star .star_swiper .briefBox span {
  color: #ffffff;
  font-weight: 800;
  font-size: 35px;
}

.content .star .star_swiper .briefBox .brief p {
  color: #fff;
}

.content .star .star_swiper .swiper-button-prev,
.content .star .star_swiper .swiper-button-next {
  width: 30px;
  height: 30px;
  background-color: #383838;
  border-radius: 50%;
}

.content .star .star_swiper .swiper-button-prev:after,
.content .star .star_swiper .swiper-button-next:after {
  color: #b0bec5;
  font-size: 15px;
}

.content .cooperation .cooperationBox {
  border: 1px solid #e7eaf0;
}

.content .cooperation .cooperationBox .cooperation_title {
  height: 49px;
  background-color: #e7eaf0;
}

.content .cooperation .cooperationBox .cooperation_title span {
  width: 164px;
  height: 100%;
  text-align: center;
  line-height: 49px;
  font-size: 18px;
  color: #fff;
  background: var(--bj-color);
  clip-path: polygon(0 0, 0% 0%, 100% 0%, 85% 100%, 0% 100%);
}

.content .cooperation .cooperationBox ul {
  width: 100%;
  display: flex;
  gap: 14px;
  margin: 18px 0;
  flex-wrap: wrap;
}

.content .cooperation .cooperationBox ul li {
  width: 243px;
  height: 86px;
  background-color: #f3f3f3;
  display: flex;
}

.content .cooperation .cooperationBox ul li a {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 40px;
}

.content .cooperation .cooperationBox ul li a img {
  width: 55px;
  height: 55px;
  object-fit: cover;
}

.content .cooperation .cooperationBox ul li a span {
  color: #4e4e4e;
  font-size: 20px;
}

@media screen and (max-width: 750px) {
  body .footer .agreement .agreementBox ul li a {
    font-size: calc(16vw / 7.5);
  }

  .footer .agreement .agreementBox ul li::after {
    margin: 0 calc(16vw / 7.5);
  }

  body .content .mian .mian_right .game .soon .playTime tr td img {
    height: calc(30vw / 7.5);
  }

  body .content .mian .mian_right .hotinformation .hotinformationList li a .hot {
    right: calc(5vw / 7.5);
  }

  body .nav .search {
    top: 0;
  }

  body .content .recommend_mian .recommend_mianBox {
    flex-direction: column;
  }

  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .competitionteam .competitionteam_info span {
    width: auto;
    font-size: 12px;
  }

  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .competitionteam .competitionteam_info .competitionteam_info_Img {
    height: 13.6vw;
  }

  body .competitionteam_vs img {
    width: 6vw;
    height: 2.8vw;
  }

  body .competitionteam_vs {
    gap: calc(30vw / 7.5);
  }

  body .competitionteam_vs span {
    font-size: calc(50vw / 7.5);
  }

  body .content .mian .mian_left .news .newsBox .news_list .news_list_content p {
    padding-left: calc(29vw / 7.5);
    padding-right: calc(35vw / 7.5);
  }

  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .wrap {
    transform: scale(0.7);
  }

  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .competitionteam .competitionteam_info {
    gap: 2.53333vw;
  }

  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability {
    transform: translate(-50%);
    display: flex;
    flex-direction: column;
    bottom: 0;
    top: unset;
  }

  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom {
    height: 260px;
    justify-content: space-around;
    padding-left: 0;
    padding-right: 0;
  }

  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability ul li .warfaproportionBox .speed {
    width: 72vw;
  }

  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis ul {
    margin: 2.66667vw;
  }


  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability ul li .warfaproportionBox .warfaproportion {
    font-size: 3.2vw;
  }

  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_time ul li::after {
    margin: 0 3.33333vw;
  }

  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .time {
    padding-left: 3.86667vw;
    padding-right: 1.46667vw;
    height: 5.33333vw;
  }

  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .playTime tr td a img {
    width: 6.13333vw;
    height: 6.13333vw;
  }

  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence {
    padding-bottom: calc(60vw / 7.5);
  }

  body .content .recommend_mian .recommend_mianBox .title span {
    width: 29.33333vw;
    font-size: 14px;
  }
}

@media screen and (max-width: 1200px) and (min-width: 750px) {

  body .content .recommend_mian .recommend_mianBox {
    flex-direction: column;
  }

  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom {
    padding: 35px;
  }
}

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

.competitionteam_vs span {
  font-size: 50px;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
  white-space: nowrap;
  color: #969296;
}

.content {
  width: 100%;
  overflow: hidden;
}

.content .recommend_mian {
  background-color: #f7f7f8;
  padding: 20px 0;
}

.content .recommend_mian .recommend_mianBox {
  display: flex;
  justify-content: space-between;
  gap: 20px;
}

.content .recommend_mian .recommend_mianBox .title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #e7eaf0;
  height: 50px;
  width: 100%;
}

.content .recommend_mian .recommend_mianBox .title span {
  height: 100%;
  line-height: 50px;
  text-align: center;
  font-size: 18px;
  color: #fff;
  width: 166px;
  background: var(--bj-color);
  clip-path: polygon(0 0, 0% 0%, 100% 0%, 85% 100%, 0% 100%);
}

.content .recommend_mian .recommend_mianBox .title ul {
  display: flex;
  height: 100%;
}

.content .recommend_mian .recommend_mianBox .title ul li {
  width: 88px;
  height: 100%;
  line-height: 50px;
  text-align: center;
  border: 1px solid transparent;
}

.content .recommend_mian .recommend_mianBox .title ul li a {
  color: #1f1f1f;
  font-size: 15px;
}

.content .recommend_mian .recommend_mianBox .title ul li a img {
  vertical-align: middle;
}

.content .recommend_mian .recommend_mianBox .title ul .active {
  border-bottom: 1px solid var(--bj-color);
}

.content .recommend_mian .recommend_mianBox .title ul .active a {
  color: var(--bj-color);
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left {
  flex: 2.5;
  overflow: hidden;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence {
  background-color: #fff;
  padding-bottom: 124px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 29px;
  padding: 41px 0;
  border-bottom: 1px solid #f1f1f1;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .intelligence_center_title {
  width: 219px;
  height: 56px;
  background-color: #e5e5e5;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .intelligence_center_title span {
  font-size: 14px;
  font-weight: 800;
  color: #3d3e3b;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .intelligence_center_title span span {
  font-size: 14px;
  font-weight: 800;
  color: #3d3e3b;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .intelligence_center_title p {
  font-size: 12px;
  color: #969296;
  font-weight: 600;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .competitionteam {
  display: grid;
  align-items: center;
  grid-template-columns: 2fr 1fr 2fr;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .competitionteam .competitionteam_info {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 19px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .competitionteam .competitionteam_info .competitionteam_info_Img {
  width: auto;
  height: 102px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .competitionteam .competitionteam_info .competitionteam_info_Img a {
  width: 100%;
  height: 100%;
  display: block;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .competitionteam .competitionteam_info .competitionteam_info_Img a img {
  width: 100%;
  height: 100%;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .competitionteam .competitionteam_info span {
  width: 100%;
  font-size: 13px;
  font-weight: 800;
  color: #434242;
  display: block;
  text-align: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .competitionteam .competitionteam_info p {
  color: #b2b4b8;
  font-size: 12px;
  font-weight: 600;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .competitionteam .competitionteam_right span {
  text-align: right;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .competitionteam .competitionteam_right p {
  text-align: right;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom {
  position: relative;
  display: flex;
  justify-content: space-between;
  padding: 0 60px;
  padding-top: 40px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .wrap {
  width: 110px;
  height: 110px;
  position: relative;
  border-radius: 50%;
  background: #f14d4a;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .wrap .leftWrap {
  width: 55px;
  height: 110px;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .wrap .leftWrap .left {
  width: 55px;
  height: 110px;
  border-radius: 55px 0 0 55px;
  background: #e1e1e4;
  transform-origin: right center;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .wrap .rightWrap {
  width: 55px;
  height: 110px;
  position: absolute;
  right: 0;
  top: 0;
  overflow: hidden;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .wrap .rightWrap .right {
  width: 55px;
  height: 110px;
  border-radius: 0 55px 55px 0;
  background: #e1e1e4;
  transform-origin: left center;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .wrap .proportion {
  width: 105px;
  height: 105px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 33px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .wrap .proportion .battlerate {
  width: 98px;
  height: 98px;
  border: 1px solid #e1e1e4;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .wrap .proportion .battlerate .per span {
  font-size: 12px;
  color: #e0e0e0;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .wrap .proportion .battlerate .per .cent {
  font-size: 23px;
  color: #3f3f3f;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .wrap .proportion .battlerate .achieve {
  color: #afafaf;
  font-size: 12px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .win {
  background-color: #54a3d4;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate(-50%);
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability span {
  text-align: center;
  color: #4a4a4a;
  font-size: 17px;
  margin-bottom: 19px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability ul {
  display: flex;
  flex-direction: column;
  gap: 13px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability ul li .redsquarered {
  color: #e44554;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability ul li .bluesquarered {
  color: #73b4dc;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability ul li .warfarerate {
  display: flex;
  align-items: self-end;
  gap: 7px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability ul li .warfarerate .ratio {
  width: 36px;
  text-align: right;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability ul li .warfarerate .ratio_left {
  text-align: left;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability ul li .warfaproportionBox {
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability ul li .warfaproportionBox .warfaproportion {
  display: flex;
  justify-content: space-between;
  color: #787878;
  font-size: 12px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability ul li .warfaproportionBox .warfaproportion .warfaproportion_title {
  font-size: 12px;
  color: #a6a6a6;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability ul li .warfaproportionBox .speed {
  width: 385px;
  height: 6px;
  display: flex;
  border-radius: 3px;
  background-color: #56a4d5;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability ul li .warfaproportionBox .speed .redsquare {
  width: 15%;
  height: 100%;
  border-radius: 3px;
  background-color: #f25451;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_bottom .probability ul li .warfaproportionBox .speed .bluesquare {
  width: 85%;
  height: 100%;
  border-radius: 3px;
  background-color: #56a4d5;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis {
  margin: 20px 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis ul {
  display: flex;
  border: 1px solid #e7e7e7;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis ul li {
  height: 35px;
  display: flex;
  align-items: center;
  padding: 0 40px;
  border-right: 1px solid #e7e7e7;
  color: #adadad;
  font-size: 12px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis ul li a {
  color: #434242;
  font-size: 16px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis ul .active a {
  color: #0091ea;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis ul li span {
  font-size: 21px;
  font-weight: 800;
  color: #d3d4d4;
  margin-left: 5px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis ul li .victoryred {
  color: #dc1023;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis ul li .victoryblue {
  color: #439ad0;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis ul .goover {
  color: #5d5d5d;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis ul .goover em {
  color: #df2739;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis ul .check {
  background-color: #f7f7f8;
  border-right: none;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis ul .check a {
  color: #e0e0e1;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right {
  flex: 1;
  overflow: hidden;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game {
  background-color: #fff;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .time {
  height: 30px;
  background: url(../static/image/game_time.jpg) no-repeat;
  background-size: 100% 100%;
  background-position: center;
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 29px;
  padding-right: 11px;
  box-sizing: border-box;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .time .time_left {
  color: #333333;
  font-size: 12px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .time .time_right {
  color: #fff;
  font-size: 12px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon {
  padding: 10px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_team {
  display: flex;
  justify-content: center;
  gap: 20px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_team .soon_team_info {
  flex: 1;
  overflow: hidden;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_team .soon_team_info a {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_team .soon_team_info img {
  width: auto;
  height: 52px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_team .soon_team_info p {
  font-size: 16px;
  color: #5d5d5d;
  display: block;
  text-align: center;
  overflow: hidden;
  width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_team .soon_team_vs {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_team .soon_team_vs .vsBox {
  border: 1px solid #f3f3f3;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  text-align: center;
  line-height: 45px;
  font-size: 12px;
  font-weight: 800;
  color: #333;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_team .soon_team_vs div {
  color: #333;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_time {
  height: 59px;
  margin-top: 17px;
  margin-bottom: 22px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_time ul {
  height: 100%;
  background-color: #f1f1f1;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_time ul li {
  display: flex;
  text-align: center;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_time ul li span {
  font-size: 20px;
  font-weight: 800;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_time ul li p {
  color: #918f8d;
  font-size: 12px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_time ul li::after {
  content: ":";
  color: #343434;
  margin: 0 5px;
  font-size: 20px;
  font-weight: 800;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_time ul li:last-child::after {
  display: none;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .playTime {
  width: 100%;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .playTime tr {
  height: 60px;
  border-top: 1px solid #f1f1f1;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .playTime tr td {
  text-align: center;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .playTime tr td p {
  color: #333333;
  font-size: 12px;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .playTime tr td img {
  width: 20px;
  height: auto;
  vertical-align: middle;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .playTime tr td .team_time_vs {
  width: 16px;
  height: auto;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .playTime tr td span {
  color: #333333;
  font-size: 12px;
  width: 50px;
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .playTime,
.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon tr,
.content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon td {
  border: none;
  border-collapse: collapse;
  border-spacing: 0;
}

@media screen and (max-width: 750px) {
  body .nav .search {
    top: 0;
  }

  body .content .live {
    padding: 10px;
  }

  body .content .live .live_left .video .video_mian {
    flex-direction: column;
  }

  body .content .live .live_left .video .video_mian .video_mian_left .video_bg_box {
    height: 53.33333vw;
  }

  body .content .live .live_left .video .video_mian .video_mian_left .browse p {
    font-size: 12px;
  }

  body .content .live .live_left .video .video_mian .video_mian_left .browse {
    padding: 0 3.06667vw;
  }

  body .content .live .live_left .videolist .videolist_item {
    height: 49.33333vw;
  }

  body .content .live .live_left .videolist .videolist_item .videolist_item_top {
    height: 43.06667vw;
  }

  body .content .live .live_left .videolist .videolist_item .videolist_item_top span {
    font-size: 2.53333vw;
  }

  body .content .live .live_left .videolist .videolist_item .videolist_item_top .videolist_item_play {
    width: 8.13333vw;
    height: 5.06667vw;
  }

  body .content .live .live_left .videolist .videolist_item .videolist_item_bottom .view {
    gap: 2.4vw;
  }

  body .content .live .live_left .videolist .videolist_item .videolist_item_bottom {
    padding: 0 1.6vw;
    font-size: 2.13333vw;
  }

  body .content .live .live_left .videolist .videolist_item .videolist_item_bottom .view img {
    width: 2.26667vw;
    height: 1.86667vw;
  }

  body .content .live .live_right .game .time {
    padding-left: 3.86667vw;
    padding-right: 1.46667vw;
    height: 5.33333vw;
  }

  body .content .live .live_right .game .soon .soon_team {
    gap: 6.53333vw;
  }

  body .content .live .live_right .game .soon .soon_time ul li::after {
    margin: 0 3.33333vw;
  }

  body .content .live .live_right .game .soon .playTime tr td a img {
    width: 6.13333vw;
    height: 6.13333vw;
  }

  body .content .live .live_right .game .soon {
    padding: 0;
  }

  body .content .live_page ul li {
    width: 6.13333vw;
    height: 6.13333vw;
    border-radius: 0.66667vw;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_center img {
    width: 100%;
    margin: 0;
    padding: 0;
    border-radius: calc(15vw / 7.5);
  }
}

@media screen and (max-width: 1200px) and (min-width: 750px) {
  body .content .live .live_right {
    flex-direction: row;
  }

  body .content .live .live_right .game {
    width: calc((100% - 5px) / 2);
  }

  body .content .live .live_right .hotinformation {
    width: calc((100% - 5px) / 2);
  }
}

@media only screen and (max-width: 1200px) {
  body .content .live .liveBox {
    flex-direction: column;
  }
}


.content {
  width: 100%;
  overflow: hidden;
}

.content .live {
  padding-top: 20px;
  padding-bottom: 32px;
  background-color: #f7f7f8;
}

.content .live .liveBox {
  display: flex;
  justify-content: space-between;
  gap: 20px;
}

.content .live .title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #e7eaf0;
  height: 50px;
  width: 100%;
}

.content .live .title span {
  height: 100%;
  line-height: 50px;
  text-align: center;
  font-size: 18px;
  color: #fff;
  width: 166px;
  background: var(--bj-color);
  clip-path: polygon(0 0, 0% 0%, 100% 0%, 85% 100%, 0% 100%);
}

.content .live .title ul {
  display: flex;
  height: 100%;
}

.content .live .title ul li {
  width: 68px;
  height: 100%;
  line-height: 50px;
  text-align: center;
  border: 1px solid transparent;
}

.content .live .title ul li a {
  color: #1f1f1f;
  font-size: 15px;
}

.content .live .title ul li a img {
  vertical-align: middle;
}

.content .live .title ul .active {
  border-bottom: 1px solid var(--bj-color);
}

.content .live .title ul .active a {
  color: var(--bj-color);
}

.content .live .live_left {
  background-color: #fff;
  padding-bottom: 27px;
  flex: 2.5;
  overflow: hidden;
}

.content .live .live_left .video {
  display: flex;
  flex-direction: column;
}

.content .live .live_left .video .video_mian {
  display: flex;
  gap: 15px;
  margin-bottom: 20px;
}

.content .live .live_left .video .video_mian .video_mian_left {
  flex: 3;
  height: auto;
  position: relative;
  left: 0;
  display: flex;
}

.content .live .live_left .video .video_mian .video_mian_left .video_bg_box {
  width: 100%;
  height: 400px;
}

.content .live .live_left .video .video_mian .video_mian_left .videoImg {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.content .live .live_left .video .video_mian .video_mian_left .play {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.content .live .live_left .video .video_mian .video_mian_left .browse {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 52px;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 5px;
  box-sizing: border-box;
}

.content .live .live_left .video .video_mian .video_mian_left .browse p {
  font-size: 15px;
  color: #fff;
}

.content .live .live_left .video .video_mian .video_mian_left .browse span {
  font-size: 12px;
  color: #bcbcba;
}

.content .live .live_left .video .video_mian .video_mian_right {
  flex: 1;
  padding-right: 10px;
  box-sizing: border-box;
}

.content .live .live_left .video .video_mian .video_mian_right ul {
  display: flex;
  flex-direction: column;
}

.content .live .live_left .video .video_mian .video_mian_right ul li {
  width: 100%;
  flex: 1;
  padding: 8px 0;
  border-bottom: 1px solid #d7d7d7;
}

.content .live .live_left .video .video_mian .video_mian_right ul li .coverBox {
  display: flex;
  justify-content: space-between;
  gap: 11px;
}

.content .live .live_left .video .video_mian .video_mian_right ul li .coverBox .cover {
  width: 110px;
  height: 68px;
  display: block;
}

.content .live .live_left .video .video_mian .video_mian_right ul li .coverBox .cover .coverImg {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.content .live .live_left .video .video_mian .video_mian_right ul li .coverBox span {
  flex: 1;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  line-height: 22px;
}

.content .live .live_left .video .video_mian .video_mian_right ul li .coverBox span a {
  color: #333333;
  font-size: 12px;
}

.content .live .live_left .video .video_mian .video_mian_right ul li .plays {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
}

.content .live .live_left .video .video_mian .video_mian_right ul li .plays .playBox {
  display: flex;
  align-items: center;
  gap: 7px;
}

.content .live .live_left .video .video_mian .video_mian_right ul li:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.content .live .live_left .video .video_mian .video_mian_right ul li:first-child {
  padding-top: 0;
}

.content .live .live_left .videolist {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.content .live .live_left .videolist .videolist_item {
  width: calc((100% - 10px) / 2);
  height: 370px;
  display: flex;
  flex-direction: column;
  border: 1px solid #d7d8d8;
}

.content .live .live_left .videolist .videolist_item .videolist_item_top {
  position: relative;
  width: 100%;
  height: 323px;
}

.content .live .live_left .videolist .videolist_item .videolist_item_top .videolist_item_bj {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.content .live .live_left .videolist .videolist_item .videolist_item_top .videolist_item_play {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.content .live .live_left .videolist .videolist_item .videolist_item_top span {
  position: absolute;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  color: #fff;
  font-size: 19px;
  white-space: nowrap;
  width: 100%;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
}

.content .live .live_left .videolist .videolist_item .videolist_item_bottom {
  height: 47px;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid #d7d8d8;
  padding: 0 12px;
}

.content .live .live_left .videolist .videolist_item .videolist_item_bottom .view {
  display: flex;
  align-items: center;
  gap: 15px;
}

.content .live .live_left .videolist .videolist_item .videolist_item_bottom .view div {
  display: flex;
  align-items: center;
}

.content .live .live_left .videolist .videolist_item .videolist_item_bottom .view div img {
  width: 14px;
  height: auto;
  margin-right: 3px;
}

.content .live .live_left .videolist .videolist_item .videolist_item_bottom .view div .like {
  width: 16px;
  height: auto;
}

.content .live .live_right {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
  overflow: hidden;
}

.content .live .live_right .game {
  background-color: #fff;
}

.content .live .live_right .game .time {
  height: 30px;
  background: url(../static/image/game_time.jpg) no-repeat;
  background-size: 100% 100%;
  background-position: center;
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 29px;
  padding-right: 11px;
  box-sizing: border-box;
}

.content .live .live_right .game .time .time_left {
  color: #333333;
  font-size: 12px;
}

.content .live .live_right .game .time .time_right {
  color: #fff;
  font-size: 12px;
}

.content .live .live_right .game .soon {
  padding: 15px;
}

.content .live .live_right .game .soon .soon_team {
  display: flex;
  justify-content: center;
  gap: 20px;
}

.content .live .live_right .game .soon .soon_team .soon_team_info {
  flex: 1;
  display: flex;
  overflow: hidden;
}

.content .live .live_right .game .soon .soon_team .soon_team_info a {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.content .live .live_right .game .soon .soon_team .soon_team_info img {
  width: auto;
  height: 53px;
}

.content .live .live_right .game .soon .soon_team .soon_team_info p {
  font-size: 16px;
  color: #5d5d5d;
  white-space: nowrap;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}

.content .live .live_right .game .soon .soon_team .soon_team_vs {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.content .live .live_right .game .soon .soon_team .soon_team_vs .vsBox {
  border: 1px solid #f3f3f3;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  text-align: center;
  line-height: 45px;
  font-size: 12px;
  font-weight: 800;
  color: #333;
}

.content .live .live_right .game .soon .soon_team .soon_team_vs div {
  color: #333;
}

.content .live .live_right .game .soon .soon_time {
  height: 59px;
  margin-top: 17px;
  margin-bottom: 22px;
}

.content .live .live_right .game .soon .soon_time ul {
  height: 100%;
  background-color: #f1f1f1;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.content .live .live_right .game .soon .soon_time ul li {
  display: flex;
  text-align: center;
}

.content .live .live_right .game .soon .soon_time ul li span {
  font-size: 20px;
  font-weight: 800;
}

.content .live .live_right .game .soon .soon_time ul li p {
  color: #918f8d;
  font-size: 12px;
}

.content .live .live_right .game .soon .soon_time ul li::after {
  content: ":";
  color: #343434;
  margin: 0 5px;
  font-size: 20px;
  font-weight: 800;
}

.content .live .live_right .game .soon .soon_time ul li:last-child::after {
  display: none;
}

.content .live .live_right .game .soon .playTime {
  width: 100%;
}

.content .live .live_right .game .soon .playTime tr {
  height: 60px;
  border-top: 1px solid #f1f1f1;
}

.content .live .live_right .game .soon .playTime tr td {
  text-align: center;
}

.content .live .live_right .game .soon .playTime tr td p {
  color: #333333;
  font-size: 12px;
  white-space: nowrap;
}

.content .live .live_right .game .soon .playTime tr td img {
  width: 20px;
  height: auto;
  vertical-align: middle;
}

.content .live .live_right .game .soon .playTime tr td .team_time_vs {
  width: 16px;
  height: auto;
}

.content .live .live_right .game .soon .playTime tr td span {
  color: #333333;
  font-size: 12px;
  width: 50px;
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.content .live .live_right .game .soon .playTime,
.content .live .live_right .game .soon tr,
.content .live .live_right .game .soon td {
  border: none;
  border-collapse: collapse;
  border-spacing: 0;
}

.content .live .live_right .hotinformation {
  background-color: #fff;
  border: 1px solid #d7d8d8;
}

.content .live .live_right .hotinformation .hotinformationList li {
  position: relative;
  height: 67px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #d7d8d8;
  padding: 0 14px;
  box-sizing: border-box;
}

.content .live .live_right .hotinformation .hotinformationList li a {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
}

.content .live .live_right .hotinformation .hotinformationList li a .hot_ranking {
  font-size: 25px;
  font-weight: 800;
  color: #cfcfcf;
}

.content .live .live_right .hotinformation .hotinformationList li a .hotBox {
  font-size: 13px;
  flex: 1;
  overflow: hidden;
}

.content .live .live_right .hotinformation .hotinformationList li a .hotBox span {
  color: #181818;
  line-height: 24px;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  width: 100%;
}

.content .live .live_right .hotinformation .hotinformationList li a .hot {
  position: absolute;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
}

.content .live .live_right .hotinformation .hotinformationList li a .hot img {
  width: 12px;
  height: 14px;
}

.content .live .live_right .hotinformation .hotinformationList li a .hot span {
  color: #cfcfcf;
}

.content .live .live_right .hotinformation .hotinformationList li:nth-child(1) .hot_ranking {
  color: #ed7f7f;
}

.content .live .live_right .hotinformation .hotinformationList li:nth-child(1) .hot span {
  color: #ed7f7f;
}

.content .live .live_right .hotinformation .hotinformationList li:nth-child(2) .hot_ranking {
  color: #f9df86;
}

.content .live .live_right .hotinformation .hotinformationList li:nth-child(2) .hot span {
  color: #f9df86;
}

.content .live .live_right .hotinformation .hotinformationList li:nth-child(3) .hot_ranking {
  color: #ffcc00;
}

.content .live .live_right .hotinformation .hotinformationList li:nth-child(3) .hot span {
  color: #ffcc00;
}

.content .live_page {
  margin-top: 37px;
}

.content .live_page ul {
  display: flex;
  justify-content: center;
  gap: 6px;
}

.content .live_page ul li {
  width: 36px;
  height: 36px;
  border: 1px solid #d9d8d8;
  border-radius: 5px;
  display: flex;
}

.content .live_page ul li span,
.content .live_page ul li a {
  font-size: 12px;
  color: #808080;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.content .live_page ul .active {
  background-color: var(--bj-color);
}

.content .live_page ul .active span {
  color: #fff;
}

.content .live_page ul .middle {
  border: none;
}

@media screen and (max-width: 750px) {
  body .nav .search {
    top: 0;
  }

  body .content .livedetail .livescreen {
    padding: 4.53333vw;
  }

  body .content .livedetail .livescreen .livescreen_center {
    height: 63.33333vw;
  }

  body .content .livedetail .livescreen .livescreen_center .cover {
    object-fit: fill;
  }

  body .content .livedetail .livescreen .livescreen_center .play {
    width: calc(73vw / 7.5);
    height: calc(73vw / 7.5);
  }

  body .content .livedetail .livescreen .livescreen_top h1 {
    font-size: 14px;
  }

  body .content .livedetail .livescreen .livescreen_top .timeinformation {
    margin-bottom: 4vw;
  }

  body .content .livedetail .livescreen .livescreen_top .timeinformation .timeinfo {
    font-size: 12px;
  }

  body .content .livedetail .livescreen .livescreen_top .timeinformation .timeinfo span:first-child::after {
    margin-left: 3.33333vw;
    margin-right: 2.93333vw;
  }

  body .content .livedetail .relatedvideos .relatedvideos_list {
    flex-wrap: wrap;
    padding: 4.93333vw;
  }

  body .content .livedetail .relatedvideos .relatedvideos_list .videolist_item {
    width: 100%;
  }

  body .content .livedetail .relatedvideos .relatedvideos_list .videolist_item .videolist_item_top span {
    font-size: 12px;
  }

  body .content .livedetail .relatedvideos .relatedvideos_list .videolist_item {
    height: 57.33333vw;
  }

  body .content .livedetail .relatedvideos .relatedvideos_list .videolist_item .videolist_item_top {
    height: 45.73333vw;
  }

  body .content .livedetail .relatedvideos .relatedvideos_list .videolist_item .videolist_item_bottom {
    height: 11.6vw;
  }

  body .content .livedetail .relatedvideos .relatedvideos_lis {
    gap: 6.53333vw;
  }

  body .content .livedetail .livescreen .livescreen_bottom {
    margin-top: 5.33333vw;
  }
}

@media screen and (max-width: 1200px) and (min-width: 750px) {

  body .content .livedetail .livescreen {
    padding: 34px;
  }

  body .content .livedetail .livescreen .livescreen_center a img {
    object-fit: fill;
  }

  body .content .livedetail .relatedvideos .relatedvideos_list .videolist_item {
    width: calc((100% - 32.7px) / 2);
  }

  body .content .livedetail .relatedvideos .relatedvideos_list {
    padding: 17px;
    gap: 10px;
  }

  body .content .livedetail .relatedvideos .relatedvideos_list .videolist_item .videolist_item_top span {
    font-size: 14px;
  }
}

.content {
  width: 100%;
  overflow: hidden;
}

.content .livedetail {
  padding: 23px 0;
  background-color: #f7f7f8;
}

.content .livedetail .livescreen {
  display: flex;
  flex-direction: column;
  padding: 34px 90px;
  background-color: #fff;
}

.content .livedetail .livescreen .livescreen_top {
  text-align: center;
}

.content .livedetail .livescreen .livescreen_top h1 {
  font-size: 27px;
  color: #181818;
  font-weight: 800;
}

.content .livedetail .livescreen .livescreen_top .timeinformation {
  display: flex;
  justify-content: space-between;
  margin-top: 22px;
  margin-bottom: 30px;
}

.content .livedetail .livescreen .livescreen_top .timeinformation .timeinfo {
  font-size: 17px;
  color: #8e8e8e;
}

.content .livedetail .livescreen .livescreen_top .timeinformation .timeinfo span:first-child::after {
  content: "|";
  color: #8e8e8e;
  margin-left: 25px;
  margin-right: 22px;
}

.content .livedetail .livescreen .livescreen_top .timeinformation .viewformation {
  display: flex;
  align-items: center;
  gap: 17px;
}

.content .livedetail .livescreen .livescreen_top .timeinformation .viewformation div {
  display: flex;
  align-items: center;
  gap: 5px;
}

.content .livedetail .livescreen .livescreen_top .timeinformation .viewformation div img {
  width: 17px;
  height: 14px;
}

.content .livedetail .livescreen .livescreen_top .timeinformation .viewformation div .like {
  width: 16px;
  height: auto;
}

.content .livedetail .livescreen .livescreen_top .timeinformation .viewformation div span {
  font-size: 11px;
  color: #5d5d5d;
}

.content .livedetail .livescreen .livescreen_center {
  position: relative;
  height: 750px;
}

.content .livedetail .livescreen .livescreen_center .cover {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.content .livedetail .livescreen .livescreen_center .play {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 73px;
  height: 73px;
}

.content .livedetail .livescreen .livescreen_center .play img {
  width: 100%;
  height: 100%;
}

.content .livedetail .livescreen .livescreen_bottom {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 20px;
  margin-top: 40px;
}

.content .livedetail .livescreen .livescreen_bottom ul {
  display: flex;
  gap: 7px;
}

.content .livedetail .livescreen .livescreen_bottom ul li {
  width: 100%;
  height: 100%;
}

.content .livedetail .livescreen .livescreen_bottom ul li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.content .livedetail .relatedvideos {
  margin-top: 23px;
  background-color: #fff;
}

.content .livedetail .relatedvideos .relatedvideos_title {
  height: 50px;
  background-color: #e7eaf0;
}

.content .livedetail .relatedvideos .relatedvideos_title span {
  width: 165px;
  height: 100%;
  display: block;
  text-align: center;
  line-height: 50px;
  color: #fff;
  font-size: 17px;
  background: var(--bj-color);
  clip-path: polygon(0 0, 0% 0%, 100% 0%, 85% 100%, 0% 100%);
}

.content .livedetail .relatedvideos .relatedvideos_list {
  padding: 37px;
  display: flex;
  gap: 49px;
}

.content .livedetail .relatedvideos .relatedvideos_list .videolist_item {
  width: calc((100% - 32.7px) / 3);
  height: 370px;
  display: flex;
  flex-direction: column;
  border: 1px solid #d7d8d8;
}

.content .livedetail .relatedvideos .relatedvideos_list .videolist_item .videolist_item_top {
  position: relative;
  width: 100%;
  height: 323px;
}

.content .livedetail .relatedvideos .relatedvideos_list .videolist_item .videolist_item_top .videolist_item_bj {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.content .livedetail .relatedvideos .relatedvideos_list .videolist_item .videolist_item_top .videolist_item_play {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.content .livedetail .relatedvideos .relatedvideos_list .videolist_item .videolist_item_top span {
  position: absolute;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  color: #fff;
  font-size: 19px;
  white-space: nowrap;
  width: 100%;
  text-align: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.content .livedetail .relatedvideos .relatedvideos_list .videolist_item .videolist_item_bottom {
  height: 47px;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid #d7d8d8;
  padding: 0 12px;
}

.content .livedetail .relatedvideos .relatedvideos_list .videolist_item .videolist_item_bottom .view {
  display: flex;
  align-items: center;
  gap: 18px;
}

.content .livedetail .relatedvideos .relatedvideos_list .videolist_item .videolist_item_bottom .view div {
  display: flex;
  align-items: center;
  gap: 3px;
}

.content .livedetail .relatedvideos .relatedvideos_list .videolist_item .videolist_item_bottom .view div img {
  width: 16px;
  height: auto;
  margin-right: 6px;
}

.content .livedetail .relatedvideos .relatedvideos_list .videolist_item .videolist_item_bottom .view div .like {
  width: 16px;
  height: auto;
}

@media screen and (max-width: 750px) {
  body .nav .search {
    top: 0;
  }

  body .content .news .newsBoxs {
    flex-direction: column;
  }

  body .content .news .newsBoxs .news_left .news_list {
    display: flex;
    flex-direction: column;
    padding: 2.13333vw;
    gap: 20px;
  }

  body .content .news .newsBoxs .news_left .news_list .news_item {
    padding: 2.13333vw;
    gap: 3.06667vw;
    flex-direction: column;
    align-items: center;
  }

  body .content .news .newsBoxs .news_left .news_list .news_item .news_item_right article a span {
    font-size: 12px;
    margin-bottom: 1.6vw;
  }

  body .content .news .newsBoxs .news_left .news_list .news_item .news_item_left {
    width: 100%;
    height: 36vw;
  }

  body .content .news .newsBoxs .news_left .news_list .news_item .news_item_left a img {
    object-fit: fill;
  }

  body .content .news {
    padding: 10px;
  }

  body .content .news .newsBoxs .news_right .game .time {
    padding-left: 3.86667vw;
    padding-right: 1.46667vw;
    height: 5.33333vw;
  }

  body .content .news .newsBoxs .news_right .game .soon .soon_team {
    gap: 6.53333vw;
  }

  body .content .news .newsBoxs .news_right .game .soon .soon_time ul li::after {
    margin: 0 3.33333vw;
  }

  body .content .news .news_right .game .soon .playTime tr td a img {
    width: 6.13333vw;
    height: 6.13333vw;
  }

  body .content .news .newsBoxs .news_right .game .soon {
    padding: 0;
  }
}

@media screen and (max-width: 1200px) and (min-width: 750px) {

  body .content .news .newsBoxs {
    flex-direction: column;
  }

  body .content .news .newsBoxs .news_right {
    flex-direction: row;
  }

  body .content .news .newsBoxs .news_right .hotinformation {
    width: 50%;
  }

  body .content .news .newsBoxs .news_right .game {
    width: 50%;
  }
}

.content {
  width: 100%;
  overflow: hidden;
}

.content .news {
  background-color: #f7f7f8;
  padding: 19px 0;
}

.content .news .newsBoxs {
  height: 100%;
  display: flex;
  justify-content: space-between;
  gap: 19px;
}

.content .news .newsBoxs .title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #e7eaf0;
  height: 50px;
  width: 100%;
}

.content .news .newsBoxs .title span {
  height: 100%;
  line-height: 50px;
  text-align: center;
  font-size: 18px;
  color: #fff;
  width: 166px;
  background: var(--bj-color);
  clip-path: polygon(0 0, 0% 0%, 100% 0%, 85% 100%, 0% 100%);
}

.content .news .newsBoxs .title ul {
  display: flex;
  height: 100%;
}

.content .news .newsBoxs .title ul li {
  width: 60px;
  height: 100%;
  line-height: 50px;
  text-align: center;
  border: 1px solid transparent;
}

.content .news .newsBoxs .title ul li a {
  color: #1f1f1f;
  font-size: 15px;
}

.content .news .newsBoxs .title ul li a img {
  vertical-align: middle;
}

.content .news .newsBoxs .title ul .active {
  border-bottom: 1px solid var(--bj-color);
}

.content .news .newsBoxs .title ul .active a {
  color: var(--bj-color);
}

.content .news .newsBoxs .news_left {
  flex: 2.5;
  overflow: hidden;
}

.content .news .newsBoxs .news_left .news_list {
  background-color: #fff;
  padding: 16px;
}

.content .news .newsBoxs .news_left .news_list .news_item {
  display: flex;
  gap: 23px;
  padding: 16px;
  border-bottom: 1px solid #ebebeb;
}

.content .news .newsBoxs .news_left .news_list .news_item .news_item_left {
  width: 180px;
  height: 110px;
}

.content .news .newsBoxs .news_left .news_list .news_item .news_item_left a {
  width: 100%;
  height: 100%;
  display: block;
}

.content .news .newsBoxs .news_left .news_list .news_item .news_item_left a img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.content .news .newsBoxs .news_left .news_list .news_item .news_item_right {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 14px;
  flex: 1;
}

.content .news .newsBoxs .news_left .news_list .news_item .news_item_right article a span {
  font-size: 15px;
  color: #333333;
  font-weight: 600;
  margin-bottom: 14px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.content .news .newsBoxs .news_left .news_list .news_item .news_item_right article a p {
  font-size: 12px;
  color: #333333;
}

.content .news .newsBoxs .news_left .news_list .news_item .news_item_right .timeinformation {
  display: flex;
  justify-content: space-between;
}

.content .news .newsBoxs .news_left .news_list .news_item .news_item_right .timeinformation .timeinfo {
  font-size: 12px;
  color: #8e8e8e;
}

.content .news .newsBoxs .news_left .news_list .news_item .news_item_right .timeinformation .timeinfo span:first-child::after {
  content: "|";
  color: #8e8e8e;
  margin-left: 17px;
  margin-right: 15px;
}

.content .news .newsBoxs .news_left .news_list .news_item .news_item_right .timeinformation .viewformation {
  display: flex;
  align-items: center;
  gap: 17px;
}

.content .news .newsBoxs .news_left .news_list .news_item .news_item_right .timeinformation .viewformation img {
  width: 17px;
  height: auto;
  vertical-align: middle;
}

.content .news .newsBoxs .news_left .news_list .news_item .news_item_right .timeinformation .viewformation span {
  font-size: 11px;
  color: #5d5d5d;
}

.content .news .newsBoxs .news_right {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
  overflow: hidden;
}

.content .news .newsBoxs .news_right .hotinformation {
  background-color: #fff;
  border: 1px solid #d7d8d8;
}

.content .news .newsBoxs .news_right .hotinformation .hotinformationList li {
  position: relative;
  height: 67px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #d7d8d8;
  padding: 0 14px;
  box-sizing: border-box;
}

.content .news .newsBoxs .news_right .hotinformation .hotinformationList li a {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 23px;
}

.content .news .newsBoxs .news_right .hotinformation .hotinformationList li a .hot_ranking {
  font-size: 25px;
  font-weight: 800;
  color: #cfcfcf;
}

.content .news .newsBoxs .news_right .hotinformation .hotinformationList li a .hotBox {
  font-size: 13px;
  flex: 1;
  overflow: hidden;
}

.content .news .newsBoxs .news_right .hotinformation .hotinformationList li a .hotBox span {
  color: #181818;
  line-height: 24px;
  display: block;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.content .news .newsBoxs .news_right .hotinformation .hotinformationList li a .hot {
  position: absolute;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
}

.content .news .newsBoxs .news_right .hotinformation .hotinformationList li a .hot img {
  width: 8px;
  height: auto;
  margin-right: 3px;
}

.content .news .newsBoxs .news_right .hotinformation .hotinformationList li a .hot span {
  color: #cfcfcf;
}

.content .news .newsBoxs .news_right .hotinformation .hotinformationList li:nth-child(1) .hot_ranking {
  color: #ed7f7f;
}

.content .news .newsBoxs .news_right .hotinformation .hotinformationList li:nth-child(1) .hot span {
  color: #ed7f7f;
}

.content .news .newsBoxs .news_right .hotinformation .hotinformationList li:nth-child(2) .hot_ranking {
  color: #f9df86;
}

.content .news .newsBoxs .news_right .hotinformation .hotinformationList li:nth-child(2) .hot span {
  color: #f9df86;
}

.content .news .newsBoxs .news_right .hotinformation .hotinformationList li:nth-child(3) .hot_ranking {
  color: #ffcc00;
}

.content .news .newsBoxs .news_right .hotinformation .hotinformationList li:nth-child(3) .hot span {
  color: #ffcc00;
}

.content .news .newsBoxs .news_right .game {
  background-color: #fff;
}

.content .news .newsBoxs .news_right .game .time {
  height: 30px;
  background: url(../static/image/game_time.jpg) no-repeat;
  background-size: 100% 100%;
  width: 100%;
  background-position: center;
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 29px;
  padding-right: 11px;
  box-sizing: border-box;
}

.content .news .newsBoxs .news_right .game .time .time_left {
  color: #333333;
  font-size: 12px;
}

.content .news .newsBoxs .news_right .game .time .time_right {
  color: #fff;
  font-size: 12px;
}

.content .news .newsBoxs .news_right .game .soon {
  padding: 15px;
}

.content .news .newsBoxs .news_right .game .soon .soon_team {
  display: flex;
  justify-content: center;
  gap: 20px;
}

.content .news .newsBoxs .news_right .game .soon .soon_team .soon_team_info {
  flex: 1;
  overflow: hidden;
}

.content .news .newsBoxs .news_right .game .soon .soon_team .soon_team_info a {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.content .news .newsBoxs .news_right .game .soon .soon_team .soon_team_info img {
  width: auto;
  height: 54px;
}

.content .news .newsBoxs .news_right .game .soon .soon_team .soon_team_info p {
  font-size: 16px;
  color: #5d5d5d;
  width: 100%;
  text-align: center;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.content .news .newsBoxs .news_right .game .soon .soon_team .soon_team_vs {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.content .news .newsBoxs .news_right .game .soon .soon_team .soon_team_vs .vsBox {
  border: 1px solid #f3f3f3;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  text-align: center;
  line-height: 45px;
  font-size: 12px;
  font-weight: 800;
}

.content .news .newsBoxs .news_right .game .soon .soon_team .soon_team_vs div {
  color: #333;
}

.content .news .newsBoxs .news_right .game .soon .soon_time {
  height: 59px;
  margin-top: 17px;
  margin-bottom: 22px;
}

.content .news .newsBoxs .news_right .game .soon .soon_time ul {
  height: 100%;
  background-color: #f1f1f1;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.content .news .newsBoxs .news_right .game .soon .soon_time ul li {
  display: flex;
  text-align: center;
}

.content .news .newsBoxs .news_right .game .soon .soon_time ul li span {
  font-size: 20px;
  font-weight: 800;
}

.content .news .newsBoxs .news_right .game .soon .soon_time ul li p {
  color: #918f8d;
  font-size: 12px;
}

.content .news .newsBoxs .news_right .game .soon .soon_time ul li::after {
  content: ":";
  color: #343434;
  margin: 0 5px;
  font-size: 20px;
  font-weight: 800;
}

.content .news .newsBoxs .news_right .game .soon .soon_time ul li:last-child::after {
  display: none;
}

.content .news .newsBoxs .news_right .game .soon .playTime {
  width: 100%;
}

.content .news .newsBoxs .news_right .game .soon .playTime tr {
  height: 60px;
  border-top: 1px solid #f1f1f1;
}

.content .news .newsBoxs .news_right .game .soon .playTime tr td {
  text-align: center;
}

.content .news .newsBoxs .news_right .game .soon .playTime tr td p {
  color: #333333;
  font-size: 12px;
}

.content .news .newsBoxs .news_right .game .soon .playTime tr td img {
  vertical-align: middle;
  width: 20px;
  height: auto;
}

.content .news .newsBoxs .news_right .game .soon .playTime tr td .team_time_vs {
  width: 16px;
  height: auto;
}

.content .news .newsBoxs .news_right .game .soon .playTime tr td span {
  color: #333333;
  font-size: 12px;
  width: 50px;
  display: inline-block;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.content .news .newsBoxs .news_right .game .soon .playTime,
.content .news .newsBoxs .news_right .game .soon tr,
.content .news .newsBoxs .news_right .game .soon td {
  border: none;
  border-collapse: collapse;
  border-spacing: 0;
}

@media screen and (max-width: 750px) {
  body .nav .search {
    top: 0;
  }

  body .content .newsdetail {
    padding: 20px 10px;
  }

  body .content .newsdetail .newsdetailBox {
    flex-direction: column;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_left {
    padding: 1.6vw;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_title {
    padding: 1.73333vw;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_center {
    padding: 3.33333vw;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_title h1 {
    font-size: 14px;
    width: 100%;
    text-align: left;
  }

  body .newdetail1 {
    width: 100%;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_title .timeinformation .timeinfo span:first-child::after {
    margin-left: 3.33333vw;
    margin-right: 2.93333vw;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_right .game .soon .playTime tr td a img {
    width: 6.13333vw;
    height: 6.13333vw;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_right .relatedinfor .relatedinfor_list {
    padding: 0 1.86667vw;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_right .relatedinfor .relatedinfor_list .relatedinfor_item .relatedinfor_item_content span {
    font-size: 14px;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_right .game .time {
    height: 5.33333vw;
    padding-left: 3.86667vw;
    padding-right: 1.46667vw;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_team {
    gap: 6.53333vw;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_time ul li::after {
    margin: 0 3.33333vw;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_right .game .soon {
    padding: 0;
  }
}

@media screen and (max-width: 1200px) and (min-width: 750px) {

  body .content .newsdetail .newsdetailBox {
    flex-direction: column;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_right .game {
    width: 50%;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_right .relatedinfor {
    width: 50%;
  }

  body .content .newsdetail .newsdetailBox .newsdetail_right {
    flex-direction: row;
  }
}


.content {
  width: 100%;
  overflow: hidden;
}

.content .newsdetail {
  background-color: #f7f7f8;
  padding: 20px 0;
}

.content .newsdetail .newsdetailBox {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  height: 100%;
}

.content .newsdetail .newsdetailBox .title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #e7eaf0;
  height: 50px;
  width: 100%;
}

.content .newsdetail .newsdetailBox .title span {
  height: 100%;
  line-height: 50px;
  text-align: center;
  font-size: 18px;
  color: #fff;
  width: 166px;
  background: var(--bj-color);
  clip-path: polygon(0 0, 0% 0%, 100% 0%, 85% 100%, 0% 100%);
}

.content .newsdetail .newsdetailBox .title ul {
  display: flex;
  height: 100%;
}

.content .newsdetail .newsdetailBox .title ul li {
  width: 88px;
  height: 100%;
  line-height: 50px;
  text-align: center;
  border: 1px solid transparent;
}

.content .newsdetail .newsdetailBox .title ul li a {
  color: #1f1f1f;
  font-size: 15px;
}

.content .newsdetail .newsdetailBox .title ul li a img {
  vertical-align: middle;
}

.content .newsdetail .newsdetailBox .title ul .active {
  border-bottom: 1px solid var(--bj-color);
}

.content .newsdetail .newsdetailBox .title ul .active a {
  color: var(--bj-color);
}

.content .newsdetail .newsdetailBox .newsdetail_left {
  flex: 2.5;
  height: 100%;
  background-color: #fff;
  padding: 12px;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_title {
  text-align: center;
  border-bottom: 1px solid #ebebeb;
  padding: 13px;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_title h1 {
  font-size: 27px;
  color: #181818;
  font-weight: 800;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_title .timeinformation {
  display: flex;
  justify-content: space-between;
  margin-top: 22px;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_title .timeinformation .timeinfo {
  font-size: 12px;
  color: #8e8e8e;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_title .timeinformation .timeinfo span:first-child::after {
  content: "|";
  color: #8e8e8e;
  margin-left: 25px;
  margin-right: 22px;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_title .timeinformation .viewformation {
  display: flex;
  align-items: center;
  gap: 17px;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_title .timeinformation .viewformation div {
  display: flex;
  align-items: center;
  gap: 3px;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_title .timeinformation .viewformation div img {
  width: 17px;
  height: auto;
  vertical-align: middle;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_title .timeinformation .viewformation div .like {
  width: 16px;
  height: auto;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_title .timeinformation .viewformation div span {
  font-size: 11px;
  color: #5d5d5d;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_center {
  padding: 25px;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_center .newsdetailImg {
  text-align: center;
  margin: 35px 0;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_center img {
  margin: 0 auto;
  width: 80%;
  height: auto;
  display: block;
  padding: 25px 0 25px 0;
  border-radius: 15px;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_center p {
  font-size: 16px;
  color: #5d5d5d;
  line-height: 28px;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_center .articleLike {
  display: flex;
  justify-content: flex-end;
  margin-top: 44px;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_center .articleLike img {
  width: 16px;
  height: auto;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_center .articleLike span {
  color: #a0a0a0;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_footer {
  height: 63px;
  line-height: 63px;
  text-align: center;
  border-top: 1px dashed #9b9b9b;
}

.content .newsdetail .newsdetailBox .newsdetail_left .newsdetail_left_footer p {
  font-size: 15px;
  color: #bfbfbf;
}

.content .newsdetail .newsdetailBox .newsdetail_right {
  flex: 1;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: hidden;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game {
  background-color: #fff;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .time {
  height: 30px;
  background: url(../static/image/game_time.jpg) no-repeat;
  background-size: 100% 100%;
  background-position: center;
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 29px;
  padding-right: 11px;
  box-sizing: border-box;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .time .time_left {
  color: #333333;
  font-size: 12px;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .time .time_right {
  color: #fff;
  font-size: 12px;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon {
  padding: 15px;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_team {
  display: flex;
  justify-content: center;
  gap: 20px;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_team .soon_team_info {
  flex: 1;
  overflow: hidden;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_team .soon_team_info a {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_team .soon_team_info img {
  width: auto;
  height: 53px;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_team .soon_team_info p {
  font-size: 16px;
  color: #5d5d5d;
  width: 100%;
  display: block;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  text-align: center;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_team .soon_team_vs {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  color: #333;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_team .soon_team_vs .vsBox {
  border: 1px solid #f3f3f3;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  text-align: center;
  line-height: 45px;
  font-size: 12px;
  font-weight: 800;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_time {
  height: 59px;
  margin-top: 17px;
  margin-bottom: 22px;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_time ul {
  height: 100%;
  background-color: #f1f1f1;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_time ul li {
  display: flex;
  text-align: center;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_time ul li span {
  font-size: 20px;
  font-weight: 800;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_time ul li p {
  color: #918f8d;
  font-size: 12px;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_time ul li::after {
  content: ":";
  color: #343434;
  margin: 0 5px;
  font-size: 20px;
  font-weight: 800;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .soon_time ul li:last-child::after {
  display: none;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .playTime {
  width: 100%;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .playTime tr {
  height: 60px;
  border-top: 1px solid #f1f1f1;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .playTime tr td {
  text-align: center;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .playTime tr td p {
  color: #333333;
  font-size: 12px;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .playTime tr td img {
  vertical-align: middle;
  width: 20px;
  height: auto;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .playTime tr td .team_time_vs {
  width: 16px;
  height: auto;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .playTime tr td span {
  color: #333333;
  font-size: 12px;
  width: 50px;
  display: inline-block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .playTime tr td span:first-child {
  text-align: right;
}

.content .newsdetail .newsdetailBox .newsdetail_right .game .soon .playTime,
.content .newsdetail .newsdetailBox .newsdetail_right .game .soon tr,
.content .newsdetail .newsdetailBox .newsdetail_right .game .soon td {
  border: none;
  border-collapse: collapse;
  border-spacing: 0;
}

.content .newsdetail .newsdetailBox .newsdetail_right .relatedinfor {
  background-color: #fff;
}

.content .newsdetail .newsdetailBox .newsdetail_right .relatedinfor .relatedinfor_list {
  padding: 0 14px;
  padding-top: 10px;
}

.content .newsdetail .newsdetailBox .newsdetail_right .relatedinfor .relatedinfor_list .relatedinfor_item {
  display: flex;
  gap: 6px;
  border-bottom: 1px solid #d7d7d7;
  padding: 14px 0;
}

.content .newsdetail .newsdetailBox .newsdetail_right .relatedinfor .relatedinfor_list .relatedinfor_item .relatedinfor_item_img {
  width: 110px;
  height: 68px;
}

.content .newsdetail .newsdetailBox .newsdetail_right .relatedinfor .relatedinfor_list .relatedinfor_item .relatedinfor_item_img a {
  display: block;
  width: 100%;
  height: 100%;
}

.content .newsdetail .newsdetailBox .newsdetail_right .relatedinfor .relatedinfor_list .relatedinfor_item .relatedinfor_item_img a img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.content .newsdetail .newsdetailBox .newsdetail_right .relatedinfor .relatedinfor_list .relatedinfor_item .relatedinfor_item_content {
  width: 60%;
}

.content .newsdetail .newsdetailBox .newsdetail_right .relatedinfor .relatedinfor_list .relatedinfor_item .relatedinfor_item_content span {
  font-size: 14px;
  font-weight: 600;
  color: #333333;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  display: block;
}

.content .newsdetail .newsdetailBox .newsdetail_right .relatedinfor .relatedinfor_list .relatedinfor_item .relatedinfor_item_content p {
  font-size: 12px;
  color: #333333;
  line-height: 24px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 2;
}

.content .newsdetail .newsdetailBox .newsdetail_right .relatedinfor .relatedinfor_list .relatedinfor_item:last-child {
  border-bottom: none;
}

@media screen and (max-width: 750px) {
  body .nav .search {
    top: 0;
  }

  body .content .games .match .match_title ul li {
    width: 22.53333vw;
  }

  body .content .games .match .match_title ul {
    gap: 1.6vw;
  }

  body .content .games .match .match_title ul li a {
    font-size: calc(16vw / 7.5);
  }

  body .content .games .match .match_title span {
    width: calc(230vw / 7.5);
    font-size: calc(18vw / 7.5);
  }

  body .content .games .match .match_games ul {
    display: flex;
    flex-direction: column;
    gap: calc(20vw / 7.5);
    padding: calc(12vw / 7.5);
  }

  body .content .games .match .match_games ul li {
    height: auto;
    gap: calc(10vw / 7.5);
    padding: calc(5vw / 7.5);
  }

  body .content .games .match .match_games ul li .match_games_left .playingTime {
    gap: 0;
    font-size: calc(12vw / 7.5);
  }

  body .content .games .match .match_games ul li .operate {
    margin-right: calc(10vw / 7.5);
  }

  body .content .games .match .match_games ul li .match_games_center .rankscompetition .ranks a img {
    height: calc(36vw / 7.5);
  }

  body .content .games .match .match_games ul li .match_games_center .rankscompetition .ranks span {
    font-size: calc(12vw / 7.5);
  }

  body .content .games .match .match_games ul li .match_games_left .nostarted {
    font-size: calc(12vw / 7.5);
  }

  body .content .games .match .match_games ul li .match_games_center .rankscompetition .ranksvs img {
    width: calc(21vw / 7.5);
    height: calc(12vw / 7.5);
  }

  body .content .games .match .match_games ul li .operate {
    gap: calc(12vw / 7.5);
  }

  body .content .games .match .match_games ul li .match_games_center .rankscompetition .ranksvs span {
    font-size: calc(12vw / 7.5);
  }

  body .content .games .match .match_games ul li .match_games_left .basketballLogo img {
    width: calc(20vw / 7.5);
    height: calc(22vw / 7.5);
  }

  body .content .games .match .match_games ul li .operate .live,
  body .content .games .match .match_games ul li .operate .intelligence {
    width: calc(62vw / 7.5);
    height: calc(30vw / 7.5);
    font-size: calc(12vw / 7.5);
    border-radius: calc(10vw / 7.5);
  }

  body .content .games .match .match_games ul li .match_games_center .rankscompetition {
    gap: 2vw;
  }

  body .content .games .match .match_games ul li .match_games_center .largeteam {
    gap: 0;
  }

  body .content .games .match .match_games ul li .match_games_center .largeteam img {
    width: calc(22vw / 7.5);
    height: calc(22vw / 7.5);
  }

  body .content .games .match .match_games ul li .match_games_center .largeteam span {
    font-size: calc(12vw / 7.5);
  }

  body .content .games .match .match_games ul li .match_games_left .basketballLogo {
    margin: 0;
  }

  body .content .games .match .match_games ul li .match_games_left {
    gap: calc(5vw / 7.5);
  }
}

@media screen and (max-width: 1300px) and (min-width: 750px) {

  body .content .games .match .match_games ul li .match_games_center {
    gap: 60px;
  }

  body .content .games .match .match_games ul li .match_games_center .largeteam {
    gap: 10px;
  }

  body .content .games .match .match_games ul li .match_games_left .playingTime {
    gap: 10px;
  }

  body .content .games .match .match_games ul li .match_games_center .rankscompetition {
    gap: 20px;
  }
}


.content {
  width: 100%;
  overflow: hidden;
}

.content .games {
  min-height: 821px;
  background-color: #f7f7f8;
}

.content .games .match {
  background-color: #fff;
  padding: 20px 0;
}

.content .games .match .match_title {
  width: 100%;
  height: 50px;
  background-color: #e7eaf0;
  display: flex;
  justify-content: space-between;
}

.content .games .match .match_title span {
  width: 228px;
  background: var(--bj-color);
  text-align: center;
  line-height: 50px;
  font-size: 18px;
  color: #fff;
  clip-path: polygon(0 0, 0% 0%, 100% 0%, 85% 100%, 0% 100%);
}

.content .games .match .match_title ul {
  display: flex;
  height: 100%;
  gap: 12px;
}

.content .games .match .match_title ul li {
  height: 100%;
  text-align: center;
  width: 89px;
  line-height: 50px;
  border-bottom: 1px solid transparent;
}

.content .games .match .match_title ul li a {
  color: #1f1f1f;
  font-size: 16px;
}

.content .games .match .match_title ul .active {
  border-bottom: 1px solid var(--bj-color);
}

.content .games .match .match_title ul .active a {
  color: var(--bj-color);
}

.content .games .match .match_games ul {
  padding: 12px;
}

.content .games .match .match_games ul li {
  height: 68px;
  display: grid;
  grid-template-columns: 2fr 4fr 2fr;
  align-items: center;
  text-align: center;
  border: 1px solid #f1f1f1;
  padding-right: 10px;
  box-sizing: border-box;
}

.content .games .match .match_games ul li span {
  white-space: nowrap;
}

.content .games .match .match_games ul li .match_games_left {
  display: grid;
  align-items: center;
  grid-template-columns: 1fr 2fr 1fr;
  gap: 5px;
}

.content .games .match .match_games ul li .match_games_left .basketballLogo {
  margin: 0 29px;
}

.content .games .match .match_games ul li .match_games_left .playingTime {
  display: flex;
  gap: 20px;
  font-size: 12px;
  color: #5d5d5d;
  justify-content: center;
}

.content .games .match .match_games ul li .match_games_left .nostarted {
  color: #333333;
  white-space: nowrap;
}

.content .games .match .match_games ul li .match_games_left .progress {
  color: #52cc9f;
}

.content .games .match .match_games ul li .match_games_left .end {
  color: gray;
}

.content .games .match .match_games ul li .match_games_left .notstarteds {
  color: #0286d7;
}

.content .games .match .match_games ul li .match_games_center {
  display: grid;
  align-items: center;
  grid-template-columns: 4fr 1fr;
}

.content .games .match .match_games ul li .match_games_center .rankscompetition {
  width: 100%;
  height: 100%;
  display: grid;
  grid-template-columns: 2fr 1fr 2fr;
  gap: 10px;
}

.content .games .match .match_games ul li .match_games_center .rankscompetition .ranksvs {
  display: flex;
  align-items: center;
  justify-content: center;
}

.content .games .match .match_games ul li .match_games_center .rankscompetition .ranksvs img {
  width: 21px;
  height: 12px;
  object-fit: cover;
}

.content .games .match .match_games ul li .match_games_center .rankscompetition .ranksvs span {
  font-size: 14px;
  color: #6d6d6d;
}

.content .games .match .match_games ul li .match_games_center .rankscompetition .ranks {
  display: flex;
  flex: 1;
  overflow: hidden;
}

.content .games .match .match_games ul li .match_games_center .rankscompetition .ranks a {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 5px;
  color: #333333;
}

.content .games .match .match_games ul li .match_games_center .rankscompetition .ranks span {
  flex: 1;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-align: left;
}

.content .games .match .match_games ul li .match_games_center .rankscompetition .ranks:first-child span {
  text-align: right;
}

.content .games .match .match_games ul li .match_games_center .rankscompetition .ranks a img {
  width: auto;
  height: 36px;
}

.content .games .match .match_games ul li .match_games_center .largeteam {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 20px;
}

.content .games .match .match_games ul li .match_games_center .largeteam img {
  width: 22px;
  height: 22px;
}

.content .games .match .match_games ul li .match_games_center .largeteam span {
  color: #333333;
}

.content .games .match .match_games ul li .operate {
  display: flex;
  gap: 12px;
  margin-right: 10px;
  width: 100%;
  justify-content: flex-end;
}

.content .games .match .match_games ul li .operate .live,
.content .games .match .match_games ul li .operate .intelligence {
  width: 62px;
  height: 30px;
  border-radius: 10px;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 12px;
}

.content .games .match .match_games ul li .operate .live {
  background-color: var(--color);
}

.content .games .match .match_games ul li .operate .intelligence {
  background: var(--bj-color);
}

.content .games .match .match_page ul {
  display: flex;
  justify-content: center;
  gap: 6px;
}

.content .games .match .match_page ul li {
  width: 36px;
  height: 36px;
  border: 1px solid #d9d8d8;
  border-radius: 5px;
  text-align: center;
  line-height: 36px;
}

.content .games .match .match_page ul li a {
  font-size: 12px;
  color: #808080;
}

.content .games .match .match_page ul .active {
  background-color: var(--bj-color);
}

.content .games .match .match_page ul .active a {
  color: #fff;
}

.content .games .match .match_page ul .middle {
  border: none;
}

@media screen and (max-width: 750px) {
  .content .streaming_live .streaming_live_bottom {
    padding: calc(10vw / 7.5);
  }

  body .content .streaming_live .streaming_live_bottom li {
    gap: calc(16vw / 7.5);
    height: calc(256vw / 7.5);
  }

  body .content .streaming_live .streaming_live_bottom li .teamBox .team img {
    width: calc(54vw / 7.5);
  }

  body .content .streaming_live .streaming_live_bottom li .teamBox .team p {
    font-size: calc(16vw / 7.5);
  }

  body .content .streaming_live .streaming_live_bottom li .select div span {
    font-size: calc(16vw / 7.5);
  }

  body .content .streaming_live .streaming_live_bottom li .select .intelligence::before {
    margin-right: calc(21vw / 7.5);
  }

  body .content .streaming_live .streaming_live_bottom li .select div img {
    width: calc(16vw / 7.5);
  }

  body .content .streaming_live .streaming_live_bottom li .select div {
    gap: calc(5vw / 7.5);
  }

  body .content .mian .mian_right .hotinformation .hotinformationList li a {
    gap: calc(23vw / 7.5);
  }

  body .content .mian .mian_right .hotinformation .hotinformationList li {
    padding: 0 calc(14vw / 7.5);
  }

  body .content .mian .mian_right .hotinformation .hotinformationList li a .hotBox {
    flex: 1;
    overflow: hidden;
  }

  body .content .mian .mian_right .hotinformation .hotinformationList li a .hotBox span {
    font-size: calc(14vw / 7.5);
  }

  body .content .streaming_live .streaming_live_bottom li .teamBox {
    gap: calc(20vw / 7.5);
  }
}

.big_box {
  padding-top: 40px;
  padding-bottom: 80px;
  box-sizing: border-box;
}

.big_box .competition_info {
  display: flex;
  flex-wrap: wrap;
  gap: 26px;
  margin-bottom: 30px;
}

.big_box .competition_info .competition_item {
  width: calc(100% / 2 - 13px);
  box-sizing: border-box;
  box-shadow: rgba(208, 215, 222, 0.5) 0px 0px 0px 1px, rgba(66, 74, 83, 0.04) 0px 6px 12px -3px, rgba(66, 74, 83, 0.12) 0px 6px 18px 0px;
}

.big_box .competition_title {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
  background: #e7eaf0;
}

.big_box .logo {
  display: flex;
  align-items: center;
  background: var(--bj-color);
  height: 50px;
  width: 186px;
  gap: 10px;
  padding-left: 10px;
  clip-path: polygon(0 0, 0% 0%, 100% 0%, 85% 100%, 0% 100%);
}

.big_box .competition_title .logo p {
  font-size: 16px;
  color: #fff;
}

.big_box .competition_title .logo img {
  height: 25px;
  width: auto;
}

.big_box .competition_title .see a {
  font-size: 18px;
  color: #f0751a;
}

.big_box .competition_info .competition_item .competition_content {
  padding: 0 15px;
  padding-top: 22px;
  padding-bottom: 54px;
  box-sizing: border-box;
}

.big_box .competition_info .competition_item .competition_content ul {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.big_box .competition_info .competition_item .competition_content ul li {
  display: grid;
  align-items: center;
  grid-template-columns: 1fr 3fr 1fr;
  gap: 5px;
}

.big_box .competition_info .competition_item .competition_content ul li .month {
  white-space: nowrap;
  font-size: 14px;
  color: #4a4a4a;
  display: flex;
  align-items: center;
}

.big_box .competition_info .competition_item .competition_content ul li .team {
  display: grid;
  align-items: center;
  grid-template-columns: 2fr 1fr 2fr;
  gap: 5px;
}

.big_box .competition_info .competition_item .competition_content ul li .team .team_name {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.big_box .competition_info .competition_item .competition_content ul li .team .team_name a {
  font-size: 14px;
  color: #4a4a4a;
}


.big_box .competition_info .competition_item .competition_content ul li .team .team_vs {
  text-align: center;
  white-space: nowrap;
}

.big_box .competition_info .competition_item .competition_content ul li .team .team_vs a {
  color: #4a4a4a;
  font-size: 14px;
}

.big_box .competition_info .competition_item .competition_content ul li .status {
  width: 100%;
  text-align: center;
}

.big_box .competition_info .competition_item .competition_content ul li .status a {
  white-space: nowrap;
  font-size: 14px;
  color: #4a4a4a;
}

.big_box .team_infolist {
  box-shadow: rgba(208, 215, 222, 0.5) 0px 0px 0px 1px, rgba(66, 74, 83, 0.04) 0px 6px 12px -3px, rgba(66, 74, 83, 0.12) 0px 6px 18px 0px;

}

.big_box .team_infolist .infolist {
  display: flex;
  gap: 22px;
  width: 100%;
  flex-direction: row;
  flex-wrap: wrap;

  padding: 15px;
  box-sizing: border-box;
}

.big_box .team_infolist .infolist li {
  text-align: center;
}

.big_box .team_infolist .infolist li a {
  width: 100%;
  display: flex;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  color: #4a4a4a;
  font-size: 14px;
  white-space: nowrap;
}


@media screen and (max-width: 750px) {
  .big_box {
    padding: 1.33333vw;
  }

  .big_box .competition_info {
    gap: 3.46667vw;
  }

  .big_box .competition_info .competition_item {
    width: 100%;
    border-radius: 1.33333vw;
  }

  .big_box .competition_title .logo p {
    font-size: 3.46667vw;
  }

  .big_box .competition_title .logo img {
    height: 4.93333vw;
  }

  .big_box .competition_info .competition_item .competition_content ul li .month {
    font-size: 2.93333vw;
  }

  .big_box .competition_info .competition_item .competition_content ul li .team .team_name a {
    font-size: 2.93333vw;
  }

  .big_box .competition_info .competition_item .competition_content ul li .status a {
    font-size: 2.93333vw;
  }

  .big_box .competition_info .competition_item .competition_content {
    padding: 0 calc(15vw / 7.5);
    padding-top: 2.93333vw;
    padding-bottom: 7.2vw;
  }

  .big_box .competition_info .competition_item .competition_content ul {
    gap: 2.93333vw;
  }

  .big_box .team_infolist .infolist {
    padding: 2vw;
    gap: 2.93333vw;
  }


  .big_box .team_infolist .infolist li a {
    font-size: 2.93333vw;
  }

  .big_box .competition_title .logo {
    gap: 2.93333vw;
  }

  body .videodetail_area article .itemize .assort {
    font-size: calc(16vw / 7.5);
  }

  body .intelligence article .cue .ul-signal li a {
    font-size: calc(16vw / 7.5);
  }

  body .intelligence article span,
  body .intelligence article p {
    font-size: calc(16vw / 7.5);
  }

  body .mian .intelligence article .cue p {
    font-size: calc(16vw / 7.5);
  }
}

.intelligence article {
  margin-top: 20px;
  padding: 0 20px;
}

.intelligence article .itemize {
  display: flex;
  align-items: center;
  gap: 5px;
}

.intelligence article .itemize .assort {
  font-size: 14px;
  color: #25170c;
}

.intelligence article .cue {
  display: flex;
}

.intelligence article .cue p {
  white-space: nowrap;
}

.intelligence article .cue .ul-signal {
  display: flex;
  gap: 5px;
  overflow-x: auto;
}

.intelligence article .cue .ul-signal li a {
  font-size: 14px;
  color: var(--bj-color);
  line-height: 22px;
  font-weight: bold;
}

@media screen and (max-width: 1000px) {
  .content .streaming_live .streaming_live_bottom li {
    width: calc(100% / 3 - 15px);
  }
}

@media screen and (max-width:750px) {
  .content .streaming_live .streaming_live_bottom ul {
    gap: calc(20vw / 7.5);
  }

  .content .streaming_live .streaming_live_bottom {
    padding: calc(20vw / 7.5) 0;
  }

  .content .streaming_live .streaming_live_bottom li {
    width: calc(100vw / 2 - 23vw / 7.5);
  }

  .content .streaming_live .streaming_live_bottom li .teamBox .team_vs {
    font-size: calc(20vw / 7.5);
  }

  .content .streaming_live .streaming_live_bottom li .select .intelligence::before {
    font-size: calc(20vw / 7.5);
  }

  body .svgCode {
    height: calc(16vw / 7.5);
  }

  body .footer .agreement p {
    font-size: calc(16vw / 7.5);
  }

  body .regard {
    gap: calc(20vw / 7.5);
    margin-top: calc(20vw / 7.5);
  }
}

.content .mian {
  padding-bottom: 20px;
}

.footer .regard {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 20px;
  margin-top: 20px;
}

.svgCode {
  width: auto;
  height: 12px;
  display: inline-block;
  vertical-align: middle;
  user-select: none;
}

.recommend_mian .intelligence .selectView {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 0 20px;
  box-sizing: border-box;
}

.recommend_mian .intelligence .selectView .textInfor {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.recommend_mian .intelligence .selectView .textInfor .cue {
  display: flex;
  align-items: center;
  white-space: nowrap;
}

.recommend_mian .intelligence .selectView .textInfor .cue .ul-signal {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.recommend_mian .intelligence .selectView .textInfor .cue .ul-signal li {
  font-size: 16px;
  font-weight: bold;
  display: flex;
}

.recommend_mian .intelligence .selectView .textInfor .cue .ul-signal li a {
  white-space: nowrap;
}

.recommend_mian .intelligence .selectView .textInfor>p {
  line-height: 26px;
  font-size: 14px;
}

.recommend_mian .intelligence .selectView .ranks {
  display: flex;
  align-items: center;
  gap: 20px;
  justify-content: center;
}

.recommend_mian .intelligence .selectView .ranks .team {
  flex: 1;
  overflow: hidden;
}

.recommend_mian .intelligence .selectView .ranks .team .linkBox {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  width: 100%;
}

.recommend_mian .intelligence .selectView .ranks .team img {
  width: 40px;
  height: auto;
}

.recommend_mian .intelligence .selectView .ranks .team p {
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  display: block;
  width: 100%;
  text-overflow: ellipsis;
  color: #434242;
}

.recommend_mian .intelligence .selectView .ranks .trend {
  display: grid;
  align-items: center;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 20px;
}

.recommend_mian .intelligence .selectView .ranks .trend li {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 10px;
}

.recommend_mian .intelligence .selectView .ranks .trend li span,
.recommend_mian .intelligence .selectView .ranks .trend li p {
  text-align: center;
  white-space: nowrap;
  white-space: nowrap;
  overflow: hidden;
  display: block;
  width: 100%;
  text-overflow: ellipsis;
}


.recommend_mian .intelligence .selectView .intelligence .report {
  margin-top: 20px;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li .report_title {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: center;
  margin-bottom: 20px;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li .report_title::before {
  content: '';
  width: 18px;
  height: 15px;
  background: #ff0000;
  border-radius: 5px;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li .report_title p {
  font-size: 16px;
  color: #ff0000;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li .letter {
  display: flex;
  justify-content: center;
  gap: 50px;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li .letter .troops {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  width: calc(100% / 2 - 25px);
  gap: 20px;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li .letter .troops li {
  width: 100%;
  background: #ff0000;
  line-height: 26px;
  padding: 5px 15px;
  box-sizing: border-box;
  font-size: 14px;
  overflow: hidden;
  display: block;
  width: 100%;
  text-overflow: ellipsis;
  color: #fff;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li .letter .troops li:nth-child(2) {
  background: #5e3d87;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li .letter .troops li:nth-child(3) {
  background: #68bc3c;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li .letter .troops li:nth-child(4) {
  background: #0081b4;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li .letter .troops li:nth-child(5) {
  background: #ffcc00;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li:nth-child(2) .report_title::before {
  background: #808080;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li:nth-child(2) .report_title p {
  color: #808080;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li:nth-child(2) .troops li {
  background: #808080;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li:nth-child(3) .report_title::before {
  background: #1784d5;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li:nth-child(3) .report_title p {
  color: #1784d5;
}

.recommend_mian .intelligence .selectView .intelligence .report>ul>li:nth-child(3) .troops li {
  background: #1784d5;
}

.recommend_mian .intelligence .selectView .confront {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.recommend_mian .intelligence .selectView .confront .confront_title {
  font-size: 16px;
  user-select: none;
}


.recommend_mian .intelligence .selectView .confront .entrty {
  display: flex;
  flex-direction: column;
}

.recommend_mian .intelligence .selectView .confront .entrty li {
  padding: 12px 0;
  border-bottom: 1px solid #e5e5e5;
}

.recommend_mian .intelligence .selectView .confront .entrty li .linkBox {
  display: grid;
  align-items: center;
  grid-template-columns: 1fr 4fr 1fr;
}

.recommend_mian .intelligence .selectView .confront .entrty li:first-child {
  padding-top: 0;
}

.recommend_mian .intelligence .selectView .confront .entrty li time {
  font-size: 14px;
  white-space: nowrap;
  color: #434242;
}

.recommend_mian .intelligence .selectView .confront .entrty li .compare {
  display: grid;
  align-items: center;
  grid-template-columns: 2fr 1fr 2fr;
  gap: 30px;
}

.recommend_mian .intelligence .selectView .confront .entrty li .compare .team {
  display: flex;
  align-items: center;
  gap: 12px;
  overflow: hidden;
}

.recommend_mian .intelligence .selectView .confront .entrty li .compare .team img {
  width: 27px;
  height: auto;
}

.recommend_mian .intelligence .selectView .confront .entrty li .compare .team p {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  color: #434242;
}

.recommend_mian .intelligence .selectView .confront .entrty li .compare .team:first-child p {
  text-align: right;
}

.recommend_mian .intelligence .selectView .confront .entrty li .compare .vs {
  display: flex;
  align-items: center;
}

.recommend_mian .intelligence .selectView .confront .entrty li .compare .vs span {
  font-size: 14px;
  white-space: nowrap;
  color: #434343;
}


.recommend_mian .intelligence .selectView .confront .entrty li .specs {
  white-space: nowrap;
  font-size: 14px;
  text-align: center;
  color: #434242;
}

.recommend_mian .intelligence .selectView .war {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.recommend_mian .intelligence .selectView .war .war_title {
  font-size: 16px;
  user-select: none;
}


.recommend_mian .intelligence .selectView .war .warContent {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.recommend_mian .intelligence .selectView .war .warContent .outer {
  width: calc(100% / 2 - 10px);
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.recommend_mian .intelligence .selectView .war .warContent .outer ul {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.recommend_mian .intelligence .selectView .war .warContent .outer ul li .teamBox {
  display: grid;
  align-items: center;
  grid-template-columns: 3fr 2fr 3fr;
}


.recommend_mian .intelligence .selectView .war .warContent .outer ul li .team {
  width: 100%;
  display: flex;
  align-items: center;
  flex-direction: column;
  overflow: hidden;
}

.recommend_mian .intelligence .selectView .war .warContent .outer ul li .team img {
  width: auto;
  height: 40px;
}

.recommend_mian .intelligence .selectView .war .warContent .outer ul li .team p {
  white-space: nowrap;
  overflow: hidden;
  display: block;
  width: 100%;
  text-overflow: ellipsis;
  text-align: center;
  font-size: 14px;
  color: #434242;
}

.recommend_mian .intelligence .selectView .war .warContent .outer ul li .teamInfo {
  display: flex;
  flex-direction: column;
  gap: 5px;
  color: #434242;
}

.recommend_mian .intelligence .selectView .war .warContent .outer ul li .teamInfo .vs {
  width: 100%;
  display: grid;
  align-items: center;
  grid-template-columns: 2fr 1fr 2fr;
  gap: 5px;
}

.recommend_mian .intelligence .selectView .war .warContent .outer ul li .teamInfo .vs span {
  font-size: 16px;
  white-space: nowrap;
  text-align: center;
}

.recommend_mian .intelligence .selectView .war .warContent .outer ul li .teamInfo .vs span:first-child {
  text-align: right;
}

.recommend_mian .intelligence .selectView .war .warContent .outer ul li .teamInfo .vs span:last-child {
  text-align: left;
}

.recommend_mian .intelligence .selectView .war .warContent .outer ul li .teamInfo time {
  width: 100%;
  text-align: center;
  font-size: 12px;
  white-space: nowrap;
}


.recommend_mian .intelligence .selectView .war .warContent .outer ul li .teamInfo .specs {
  white-space: nowrap;
  overflow: hidden;
  display: block;
  width: 100%;
  text-overflow: ellipsis;
  font-size: 12px;
  white-space: nowrap;
  text-align: center;
}

.recommend_mian .intelligence .selectView .war .warContent .outer .check {
  display: flex;
  align-items: center;
  justify-content: center;
}

.recommend_mian .intelligence .selectView .war .warContent .outer .check a {
  white-space: nowrap;
  font-size: 12px;
  color: #0081b4;
}

@media screen and (max-width:1000px) {

  .content .w {
    width: 100%;
  }
}

.main {
  padding-bottom: 40px;
}

@media screen and (max-width:750px) {
  .main {
    padding: calc(40px / 7.5) calc(10vw / 7.5);
    padding-top: 0;
  }

  .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center {
    gap: calc(29vw / 7.5);
    padding: calc(41vw / 7.5) 0;
  }

  .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .intelligence_center_title {
    width: calc(219vw / 7.5);
    height: calc(66vw / 7.5);
    gap: calc(8vw / 7.5);
    border-radius: calc(10vw / 7.5);
  }

  .content .recommend_mian .recommend_mianBox .title {
    height: calc(50vw / 7.5);
  }

  .content .recommend_mian .recommend_mianBox .title span {
    line-height: calc(50vw / 7.5);
  }

  .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .intelligence_center_title span {
    font-size: calc(18vw / 7.5);
  }

  .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .intelligence_center_title p {
    font-size: calc(16vw / 7.5);
  }

  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis ul li {
    height: calc(35vw / 7.5);
  }

  body .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis ul li a {
    font-size: calc(18vw / 7.5);
  }

  .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .analysis {
    margin: calc(20vw / 7.5) 0;
  }

  .recommend_mian .intelligence .selectView {
    padding: 0 calc(20vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .textInfor {
    gap: calc(15vw / 7.5);
  }

  .intelligence article {
    margin-top: calc(20vw / 7.5);
    padding: 0;
  }

  .recommend_mian .intelligence .selectView .textInfor>p {
    font-size: calc(16vw / 7.5);
    line-height: calc(26vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .textInfor .cue .ul-signal {
    gap: calc(10vw / 7.5);
  }

  .intelligence article .itemize .assort {
    font-size: calc(16vw / 7.5);
  }

  .content .recommend_mian .recommend_mianBox .title ul li {
    width: calc(88vw / 7.5);
    line-height: calc(50vw / 7.5);
  }

  .content .recommend_mian .recommend_mianBox .title ul li a {
    font-size: calc(18vw / 7.5);
  }

  .content .recommend_mian .recommend_mianBox .recommend_mianBox_right .game .soon .soon_team .soon_team_info img {
    height: calc(52vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .ranks .team img {
    width: calc(40vw / 7.5);
  }

  .content .recommend_mian .recommend_mianBox .recommend_mianBox_left .intelligence .intelligence_center .competitionteam {
    width: 100%;
    justify-content: space-between;
  }

  .recommend_mian .intelligence .selectView .intelligence .report>ul>li .letter {
    gap: calc(20vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .intelligence .report>ul>li .letter .troops li {
    height: calc(32vw / 7.5);
    line-height: calc(32vw / 7.5);
    padding: 0;
    padding-left: calc(15vw / 7.5);
    font-size: calc(16vw / 7.5);
    border-radius: calc(8vw / 7.5);

  }

  .recommend_mian .intelligence .selectView .intelligence .report>ul>li .report_title {
    gap: calc(10vw / 7.5);
    margin-bottom: calc(20vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .intelligence .report>ul>li .report_title::before {
    width: calc(18vw / 7.5);
    height: calc(15vw / 7.5);
    border-radius: calc(5vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .intelligence .report>ul>li .letter .troops {
    gap: calc(20vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .intelligence .report>ul {
    gap: calc(20vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .intelligence .report>ul>li .report_title p {
    font-size: calc(16vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .war .warContent .outer {
    width: 100%;
  }

  .recommend_mian .intelligence .selectView .ranks {
    gap: calc(20vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .confront .entrty li .compare {
    gap: calc(20vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .confront .entrty li {
    padding: calc(12vw / 7.5) 0;
  }

  .recommend_mian .intelligence .selectView .confront .entrty li time {
    font-size: calc(16vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .confront .entrty li .compare .vs span {
    font-size: calc(16vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .confront .entrty li .compare .team p {
    font-size: calc(16vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .confront .entrty li .specs {
    font-size: calc(16vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .confront {
    gap: calc(15vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .war .warContent .outer ul {
    gap: calc(20vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .war .warContent .outer ul li .team img {
    height: calc(45vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .war .warContent .outer ul li .team p {
    font-size: calc(16vw / 7.5);
  }

  .recommend_mian .intelligence .selectView {
    gap: calc(20vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .war .warContent .outer ul li .teamInfo {
    gap: calc(5vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .war .warContent .outer ul li .teamInfo .vs span {
    font-size: calc(16vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .war .warContent .outer ul li .teamInfo time {
    font-size: calc(16vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .ranks .team p {
    font-size: calc(18vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .war .warContent .outer ul li .teamInfo .specs {
    font-size: calc(16vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .war .warContent .outer {
    gap: calc(30vw / 7.5);
  }

  .recommend_mian .intelligence .selectView .war .warContent .outer .check a {
    font-size: calc(18vw / 7.5);
  }
}

.eventName {
  display: flex;
  flex-direction: column;
  gap: 15px;
  margin: 20px 0;
}

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

.eventName ul li {
  white-space: nowrap;
  font-size: 14px;
  display: flex;
  align-items: center;
}

.eventName ul li span,
.eventName ul li a {
  color: #333;
}

.eventName>span,
.eventName p {
  color: #333;
}

@media screen and(max-width:750px) {
  .video .eventName {
    gap: calc(15vw / 7.5);
    margin: calc(20vw / 7.5) 0;
  }

  .video .eventName ul {
    gap: calc(15vw / 7.5);
  }

  .video .eventName ul li {
    font-size: calc(16vw / 7.5);
  }

  .video .eventName>span,
  .video .eventName p {
    font-size: calc(18vw / 7.5);
  }
}