@charset "utf-8";
/* ========================================
   响应式自适应样式 - 完整移动端适配
   ======================================== */

/* ========== 全局基础响应式 ========== */
@media (max-width: 1200px) {
  .container {
    max-width: 100%;
    padding: 0 15px;
  }
  
  .w-820, .w-830 {
    width: 65%;
  }
  
  .w-770 {
    width: 60%;
  }
  
  .w-400, .w-420, .w-440 {
    width: 32%;
  }
  
  .w-340, .w-320, .w-300 {
    width: 32%;
  }
  
  .w-550 {
    width: 45%;
  }
}

@media (max-width: 992px) {
  .container {
    padding: 0 10px;
  }
  
  .w-820, .w-830, .w-770 {
    width: 60%;
  }
  
  .w-400, .w-420, .w-440, .w-550 {
    width: 38%;
  }
  
  .w-340, .w-320, .w-300 {
    width: 38%;
  }
  
  .flex-between {
    flex-wrap: wrap;
    gap: 20px;
  }
}

/* ========== 移动端全局样式 (<=768px) ========== */
@media (max-width: 768px) {
  body {
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
  }
  
  .container {
    width: 100% !important;
    padding: 0 10px !important;
    max-width: 100% !important;
  }
  
  .row {
    margin: 0 !important;
    width: 100% !important;
  }
  
  .col-md-8, .col-md-4 {
    width: 100% !important;
    padding: 0 !important;
  }
  
  .w-820, .w-830, .w-770,
  .w-400, .w-420, .w-440,
  .w-340, .w-320, .w-300,
  .w-550, .w-750, .w-766 {
    width: 100% !important;
    margin: 0 !important;
  }
  
  .flex-between {
    flex-direction: column;
    gap: 15px;
  }
  
  .m-t-55 {
    margin-top: 25px !important;
  }
  
  .m-t-30 {
    margin-top: 15px !important;
  }
  
  .m-t-20 {
    margin-top: 10px !important;
  }
  
  .comTit {
    margin-bottom: 12px !important;
  }
  
  .comTit .titOne {
    font-size: 16px !important;
  }
  
  .comTit a {
    font-size: 12px !important;
  }
}

/* ========== 小屏手机样式 (<=576px) ========== */
@media (max-width: 576px) {
  .container {
    padding: 0 8px !important;
  }
  
  .comTit .titOne {
    font-size: 15px !important;
  }
  
  .m-t-55 {
    margin-top: 20px !important;
  }
}

/* ========== 超小屏手机样式 (<=480px) ========== */
@media (max-width: 480px) {
  .container {
    padding: 0 6px !important;
  }
  
  .comTit .titOne {
    font-size: 14px !important;
  }
}

/* ========== 移动端导航菜单 ========== */
@media (max-width: 768px) {
  .mobile_header {
    display: flex !important;
    position: sticky;
    top: 0;
    z-index: 1000;
  }
  
  .mainmenu {
    display: none !important;
  }
  
  .mobile_menu {
    position: fixed;
    top: 56px;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    z-index: 999;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  .header_menu {
    grid-template-columns: repeat(3, 1fr);
    grid-auto-flow: row;
    gap: 8px;
    padding: 15px;
  }
  
  .header_menu_item a {
    padding: 12px 8px;
    font-size: 14px;
  }
}

/* ========== 首页模块响应式 ========== */
@media (max-width: 768px) {
  .inModOne {
    padding: 12px !important;
  }
  
  .inOne_ul {
    flex-wrap: wrap;
    gap: 8px;
    padding-bottom: 15px !important;
    margin-bottom: 15px !important;
  }
  
  .inOne_ul li {
    width: calc(25% - 6px) !important;
    margin-bottom: 0 !important;
  }
  
  .inOne_ul li a {
    width: 100% !important;
  }
  
  .inOne_ul li img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1;
  }
  
  .inOne_ul li .name {
    font-size: 11px !important;
    margin-top: 4px !important;
  }
  
  .index-list-option {
    margin-bottom: 10px !important;
  }
  
  .index-list-option .label {
    width: 50px !important;
    height: 24px !important;
    line-height: 24px !important;
    font-size: 12px !important;
  }
  
  .index-list-option a {
    font-size: 11px !important;
    margin-left: 6px !important;
  }
  
  .inModTop {
    flex-direction: column !important;
    gap: 15px !important;
  }
  
  .inSlide {
    width: 100% !important;
  }
  
  .inSlide .swiper {
    width: 100% !important;
    height: 180px !important;
  }
  
  .inSlide .swiper-slide a {
    width: 100% !important;
    height: 180px !important;
  }
  
  .inSlide .swiper-slide img {
    width: 100% !important;
    height: 180px !important;
  }
  
  .inTwoTxt {
    width: 100% !important;
    font-size: 12px !important;
    padding: 0 12px !important;
    height: 30px !important;
    line-height: 30px !important;
  }
  
  .inModTwo {
    width: 100% !important;
    padding: 12px !important;
  }
  
  .inTitle_ul li .title {
    font-size: 14px !important;
  }
  
  .inTitle_ul li .type {
    font-size: 12px !important;
  }
  
  .inTwo_ul li .text {
    font-size: 13px !important;
  }
  
  .inTwo_ul li .date {
    font-size: 12px !important;
  }
}

@media (max-width: 576px) {
  .inOne_ul li {
    width: calc(33.33% - 6px) !important;
  }
  
  .inSlide .swiper {
    height: 160px !important;
  }
  
  .inSlide .swiper-slide a,
  .inSlide .swiper-slide img {
    height: 160px !important;
  }
  
  .inTwoTxt {
    font-size: 11px !important;
    height: 28px !important;
    line-height: 28px !important;
  }
  
  .inTitle_ul li .title {
    font-size: 13px !important;
  }
  
  .inTwo_ul li .text {
    font-size: 12px !important;
  }
}

@media (max-width: 480px) {
  .inOne_ul li {
    width: calc(50% - 4px) !important;
  }
  
  .inSlide .swiper {
    height: 150px !important;
  }
  
  .inSlide .swiper-slide a,
  .inSlide .swiper-slide img {
    height: 150px !important;
  }
  
  .index-list-option .label {
    width: 45px !important;
    height: 22px !important;
    line-height: 22px !important;
    font-size: 11px !important;
  }
  
  .index-list-option a {
    font-size: 10px !important;
    margin-left: 4px !important;
  }
}

/* ========== 直播列表响应式 ========== */
@media (max-width: 768px) {
  .box1 {
    padding: 0 !important;
  }
  
  .ul_b {
    padding: 10px !important;
  }
  
  .ul_b h2 {
    font-size: 15px !important;
  }
  
  .box2_ {
    flex-wrap: wrap;
    gap: 5px !important;
  }
  
  .box2_ li {
    padding: 6px 12px !important;
    font-size: 13px !important;
  }
  
  .matchb {
    padding: 0 10px !important;
  }
  
  .hotmatch {
    margin-bottom: 10px !important;
    border-radius: 8px !important;
    overflow: hidden;
  }
  
  .hotmatch .items-center {
    padding: 10px !important;
    flex-wrap: wrap;
    gap: 8px;
  }
  
  .hotmatch .status {
    width: auto !important;
    min-width: 60px;
    order: 1;
  }
  
  .hotmatch .status p {
    font-size: 11px !important;
    padding: 3px 8px !important;
  }
  
  .hotmatch .sj {
    width: auto !important;
    font-size: 12px !important;
    order: 2;
  }
  
  .hotmatch .bt {
    width: 100% !important;
    font-size: 12px !important;
    order: 3;
    margin-bottom: 5px !important;
  }
  
  .hotmatch .zd {
    flex: 1 !important;
    font-size: 13px !important;
    text-align: right !important;
    order: 4;
  }
  
  .hotmatch .zdlogo {
    width: 35px !important;
    height: 35px !important;
    order: 5;
  }
  
  .hotmatch .zdlogo img {
    width: 100% !important;
    height: 100% !important;
  }
  
  .hotmatch .bf {
    font-size: 18px !important;
    font-weight: bold;
    order: 6;
  }
  
  .hotmatch .kdlogo {
    width: 35px !important;
    height: 35px !important;
    order: 7;
  }
  
  .hotmatch .kdlogo img {
    width: 100% !important;
    height: 100% !important;
  }
  
  .hotmatch .kd {
    flex: 1 !important;
    font-size: 13px !important;
    text-align: left !important;
    order: 8;
  }
  
  .zdbf, .kdbf {
    display: none !important;
  }
  
  .streamBox {
    padding: 8px 10px !important;
  }
  
  .streamTop {
    display: none !important;
  }
  
  .streamBtm {
    display: flex !important;
    gap: 8px;
  }
  
  .streamBtm a {
    flex: 1;
    text-align: center;
  }
  
  .streamBtm p {
    padding: 8px 12px !important;
    font-size: 12px !important;
  }
  
  .viewMore {
    display: none !important;
  }
  
  .more {
    margin-bottom: 30px !important;
  }
  
  .more a {
    font-size: 13px !important;
  }
}

@media (max-width: 576px) {
  .hotmatch .zd,
  .hotmatch .kd {
    font-size: 12px !important;
  }
  
  .hotmatch .bt {
    font-size: 11px !important;
  }
  
  .hotmatch .sj {
    font-size: 11px !important;
  }
  
  .hotmatch .zdlogo,
  .hotmatch .kdlogo {
    width: 30px !important;
    height: 30px !important;
  }
  
  .hotmatch .bf {
    font-size: 16px !important;
  }
  
  .streamBtm p {
    padding: 6px 10px !important;
    font-size: 11px !important;
  }
}

/* ========== 篮球资讯模块响应式 ========== */
@media (max-width: 768px) {
  .method-box li .text {
    font-size: 13px !important;
  }
  
  .method-box li .date {
    font-size: 12px !important;
  }
  
  .item-img-one {
    width: 100% !important;
    height: auto !important;
    margin-bottom: 10px !important;
  }
  
  .item-img-one img {
    width: 100% !important;
    height: auto !important;
  }
  
  .item-img-one .text {
    width: 100% !important;
    height: 100% !important;
    font-size: 13px !important;
  }
  
  .flex-wrap-between {
    width: 100% !important;
    gap: 8px;
  }
  
  .item-img-two {
    width: calc(50% - 4px) !important;
    height: auto !important;
  }
  
  .item-img-two img {
    width: 100% !important;
    height: auto !important;
  }
  
  .item-img-two .text {
    width: 100% !important;
    height: 100% !important;
    font-size: 12px !important;
  }
  
  .item-one-box li {
    margin-bottom: 12px !important;
    padding-bottom: 12px !important;
    border-bottom: 1px solid #f0f0f0;
  }
  
  .item-one-box .left {
    width: 100% !important;
  }
  
  .item-one-box .img {
    width: 100% !important;
    margin-top: 8px !important;
  }
  
  .item-one-box .img img {
    width: 100% !important;
    height: auto !important;
  }
  
  .item-img-three li img {
    width: 100% !important;
    height: auto !important;
  }
}

@media (max-width: 576px) {
  .method-box li .text {
    font-size: 12px !important;
  }
  
  .method-box li .date {
    font-size: 11px !important;
  }
  
  .item-img-two {
    width: 100% !important;
  }
}

/* ========== 体育直播模块响应式 ========== */
@media (max-width: 768px) {
  .index-option-box {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
  }
  
  .index-option-box li {
    width: 100% !important;
  }
  
  .index-option-box li img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1;
  }
  
  .index-option-box li .name {
    font-size: 12px !important;
    margin-top: 4px !important;
  }
}

@media (max-width: 576px) {
  .index-option-box {
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }
  
  .index-option-box li .name {
    font-size: 11px !important;
  }
}

@media (max-width: 480px) {
  .index-option-box {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ========== 热词推荐模块响应式 ========== */
@media (max-width: 768px) {
  .inSeven_ul li {
    padding: 8px 0 !important;
  }
  
  .inSeven_ul li .score {
    width: 22px !important;
    height: 22px !important;
    line-height: 22px !important;
    font-size: 12px !important;
  }
  
  .inSeven_ul li .text {
    font-size: 13px !important;
  }
  
  .inSeven_ul li .date {
    font-size: 11px !important;
  }
}

@media (max-width: 576px) {
  .inSeven_ul li .score {
    width: 20px !important;
    height: 20px !important;
    line-height: 20px !important;
    font-size: 11px !important;
  }
  
  .inSeven_ul li .text {
    font-size: 12px !important;
  }
  
  .inSeven_ul li .date {
    font-size: 10px !important;
  }
}

/* ========== 视频模块响应式 ========== */
@media (max-width: 768px) {
  .inMod-four-img {
    width: 100% !important;
    margin-bottom: 15px !important;
  }
  
  .inMod-four-img img {
    width: 100% !important;
    height: auto !important;
  }
  
  .inMod-four-img .play {
    width: 50px !important;
    height: 50px !important;
  }
  
  .inMod-four-img .play img {
    width: 100% !important;
    height: 100% !important;
  }
  
  .inMod-four-img .info {
    font-size: 13px !important;
  }
  
  .inModSeven {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }
  
  .inModSeven li {
    width: 100% !important;
  }
  
  .inModSeven li img {
    width: 100% !important;
    height: auto !important;
  }
  
  .inModSeven li .play {
    width: 40px !important;
    height: 40px !important;
  }
  
  .inModSeven li .play img {
    width: 100% !important;
    height: 100% !important;
  }
  
  .inModSeven li .info {
    font-size: 12px !important;
  }
}

@media (max-width: 576px) {
  .inModSeven {
    grid-template-columns: repeat(1, 1fr);
  }
}

/* ========== 体育资讯模块响应式 ========== */
@media (max-width: 768px) {
  .index-three-box {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  
  .index-three-box li {
    width: 100% !important;
  }
  
  .index-three-box li img {
    width: 100% !important;
    height: auto !important;
  }
}

@media (max-width: 576px) {
  .index-three-box {
    grid-template-columns: repeat(1, 1fr);
  }
}

/* ========== 推荐资讯模块响应式 ========== */
@media (max-width: 768px) {
  .index-ranking {
    width: 100% !important;
    margin-bottom: 12px !important;
  }
  
  .index-ranking li {
    padding: 10px !important;
  }
  
  .index-ranking li .num {
    width: 22px !important;
    height: 22px !important;
    line-height: 22px !important;
    font-size: 12px !important;
  }
  
  .index-ranking li .right {
    font-size: 13px !important;
  }
}

@media (max-width: 576px) {
  .index-ranking li .num {
    width: 20px !important;
    height: 20px !important;
    line-height: 20px !important;
    font-size: 11px !important;
  }
  
  .index-ranking li .right {
    font-size: 12px !important;
  }
}

/* ========== 文章列表页响应式 ========== */
@media (max-width: 768px) {
  .infoOne_ul li {
    padding: 15px 0 !important;
    flex-direction: column;
  }
  
  .infoOne_ul li a {
    flex-direction: column;
  }
  
  .infoOne_ul li img {
    width: 100% !important;
    height: auto !important;
    margin-bottom: 10px !important;
  }
  
  .infoOne_ul li .right {
    width: 100% !important;
    margin-left: 0 !important;
  }
  
  .infoOne_ul li .title {
    font-size: 15px !important;
    margin-top: 8px !important;
  }
  
  .infoOne_ul li .text {
    font-size: 13px !important;
    margin-top: 8px !important;
    line-height: 1.6 !important;
  }
  
  .infoOne_ul li .date {
    font-size: 11px !important;
  }
}

@media (max-width: 576px) {
  .infoOne_ul li .title {
    font-size: 14px !important;
  }
  
  .infoOne_ul li .text {
    font-size: 12px !important;
  }
}

/* ========== 文章详情页响应式 ========== */
@media (max-width: 768px) {
  .content_box_hd h3 {
    font-size: 18px !important;
    line-height: 1.5 !important;
  }
  
  .content_box_hd_info {
    flex-wrap: wrap;
    gap: 8px;
  }
  
  .content_box_hd_info li {
    font-size: 12px !important;
  }
  
  .content_box_bd {
    font-size: 15px !important;
    line-height: 1.8 !important;
    padding: 15px 0 !important;
  }
  
  .content_box_bd img {
    max-width: 100% !important;
    height: auto !important;
  }
  
  .tags ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  
  .tags ul li {
    margin: 0 !important;
  }
  
  .tags ul li a {
    padding: 5px 12px !important;
    background: #f5f5f5;
    border-radius: 4px;
    font-size: 12px !important;
  }
  
  .list-news .comTit {
    margin-bottom: 12px !important;
  }
  
  .info1_ul li {
    flex-direction: column;
    padding: 12px 0 !important;
  }
  
  .info1_ul li .article-thumb {
    width: 100% !important;
    margin-bottom: 10px !important;
  }
  
  .info1_ul li .article-thumb img {
    width: 100% !important;
    height: auto !important;
  }
  
  .info1_ul li .right {
    width: 100% !important;
  }
  
  .info1_ul li .right .title h5 {
    font-size: 14px !important;
  }
  
  .info1_ul li .right .text {
    font-size: 13px !important;
    line-height: 1.6 !important;
  }
  
  .info1_ul li .right .date {
    font-size: 11px !important;
  }
}

@media (max-width: 576px) {
  .content_box_hd h3 {
    font-size: 16px !important;
  }
  
  .content_box_hd_info li {
    font-size: 11px !important;
  }
  
  .content_box_bd {
    font-size: 14px !important;
  }
  
  .info1_ul li .right .title h5 {
    font-size: 13px !important;
  }
  
  .info1_ul li .right .text {
    font-size: 12px !important;
  }
}

@media (max-width: 480px) {
  .content_box_hd h3 {
    font-size: 15px !important;
  }
  
  .content_box_bd {
    font-size: 13px !important;
  }
}

/* ========== 球队列表页响应式 ========== */
@media (max-width: 768px) {
  .qlist {
    margin-left: -10px !important;
  }
  
  .qlist a {
    width: calc(33.33% - 10px) !important;
    margin-left: 10px !important;
    margin-bottom: 10px !important;
  }
  
  .qlist .img-show img {
    width: 100% !important;
    /* height: auto !important; */
  }
  
  .qlist .img-detail {
    font-size: 13px !important;
    line-height: 1.4 !important;
    height: auto !important;
  }
  
  .xxk ul {
    height: auto !important;
    flex-wrap: wrap;
    gap: 5px;
    padding: 10px !important;
  }
  
  .xxk li {
    padding: 8px 15px !important;
    font-size: 13px !important;
  }
}

@media (max-width: 576px) {
  .qlist a {
    width: calc(33% - 10px) !important;
  }
  
  .qlist .img-detail {
    font-size: 12px !important;
  }
  
  .xxk li {
    padding: 6px 12px !important;
    font-size: 12px !important;
  }
}

@media (max-width: 480px) {
  .qlist a {
    width: calc(33% - 8px) !important;
    margin-left: 8px !important;
  }
}

/* ========== 球员列表页响应式 ========== */
@media (max-width: 768px) {
  .gameOne_ul {
    margin-top: 15px !important;
  }
  
  .gameOne_ul li {
    width: 100% !important;
    margin-bottom: 10px !important;
  }
  
  .gameOne_ul li img {
    width: 50px !important;
    height: 50px !important;
  }
  
  .gameOne_ul li .name a {
    font-size: 13px !important;
  }
  
  .gameOne_ul li .type {
    font-size: 11px !important;
  }
  
  .gameOne_ul li .date {
    font-size: 11px !important;
  }
  
  .gameOne_ul li .click {
    width: 50px !important;
    height: 26px !important;
    line-height: 26px !important;
    font-size: 11px !important;
  }
}

@media (max-width: 576px) {
  .gameOne_ul li img {
    width: 45px !important;
    height: 45px !important;
  }
  
  .gameOne_ul li .name a {
    font-size: 12px !important;
  }
}

/* ========== 视频列表页响应式 ========== */
@media (max-width: 768px) {
  .luxiangtuijian .index_video_list_qh li {
    width: 100% !important;
    margin-bottom: 12px !important;
  }
  
  .luxiangtuijian .index_video_list_qh li a {
    flex-direction: row !important;
  }
  
  .luxiangtuijian .index_video_list_qh li a .ico {
    width: 120px !important;
  }
  
  .luxiangtuijian .index_video_list_qh li a .ico img {
    width: 120px !important;
    height: 80px !important;
  }
  
  .luxiangtuijian .index_video_list_qh li a .nr {
    width: calc(100% - 120px) !important;
  }
  
  .luxiangtuijian .index_video_list_qh li a .nr p {
    font-size: 13px !important;
  }
  
  .shipintuijian .index_video_list_qh li {
    width: 100% !important;
    margin-bottom: 12px !important;
  }
}

@media (max-width: 576px) {
  .luxiangtuijian .index_video_list_qh li a .ico {
    width: 100px !important;
  }
  
  .luxiangtuijian .index_video_list_qh li a .ico img {
    width: 100px !important;
    height: 70px !important;
  }
  
  .luxiangtuijian .index_video_list_qh li a .nr {
    width: calc(100% - 100px) !important;
  }
}

/* ========== 直播详情页响应式 ========== */
@media (max-width: 768px) {
  .match_bj {
    height: auto !important;
    padding: 20px 10px !important;
  }
  
  .match_bg {
    height: auto !important;
  }
  
  .score {
    flex-direction: column;
    gap: 15px;
  }
  
  .scoreleft, .scoreright {
    width: 100% !important;
  }
  
  .score_name {
    width: 100% !important;
  }
  
  .league_name {
    padding-top: 20px !important;
    font-size: 13px !important;
  }
  
  .match_score > div {
    font-size: 24px !important;
  }
  
  .match_status {
    width: 120px !important;
    font-size: 14px !important;
  }
  
  .scoreleft h1, .scoreright h1 {
    font-size: 16px !important;
    margin-top: 8px !important;
  }
  
  .scoreleft .image_container,
  .scoreright .image_container {
    width: 60px !important;
    height: 60px !important;
  }
  
  .scoreleft .image_container img,
  .scoreright .image_container img {
    width: 40px !important;
    height: 40px !important;
  }
  
  .signa ul li {
    padding: 8px 15px !important;
    font-size: 13px !important;
  }
  
  .fixscotc p {
    font-size: 13px !important;
  }
}

@media (max-width: 576px) {
  .match_score > div {
    font-size: 20px !important;
  }
  
  .match_status {
    width: 100px !important;
    font-size: 12px !important;
  }
  
  .scoreleft h1, .scoreright h1 {
    font-size: 14px !important;
  }
}

/* ========== 分页响应式 ========== */
@media (max-width: 768px) {
  .pagination {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 5px;
  }
  
  .pagination > li > a,
  .pagination > li > span {
    padding: 5px 10px !important;
    font-size: 13px !important;
  }
}

@media (max-width: 576px) {
  .pagination > li > a,
  .pagination > li > span {
    padding: 4px 8px !important;
    font-size: 12px !important;
  }
}

/* ========== 页脚响应式 ========== */
@media (max-width: 768px) {
  footer {
    padding: 20px 10px !important;
  }
  
  .footer-content {
    font-size: 12px !important;
  }
  
  .footer-content p {
    margin-bottom: 8px !important;
  }
}

@media (max-width: 576px) {
  footer {
    padding: 15px 8px !important;
  }
  
  .footer-content {
    font-size: 11px !important;
  }
}

/* ========== 友情链接响应式 ========== */
@media (max-width: 768px) {
  .Friendly_Links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  
  .Friendly_Links li {
    margin: 0 !important;
  }
  
  .Friendly_Links li a {
    padding: 5px 10px !important;
    font-size: 12px !important;
  }
}

/* ========== 面包屑导航响应式 ========== */
@media (max-width: 768px) {
  .breadcrumb {
    padding: 10px 0 !important;
    font-size: 12px !important;
  }
  
  .breadcrumb li {
    margin-bottom: 0 !important;
  }
  
  .breadcrumb li a,
  .breadcrumb li a span {
    font-size: 12px !important;
  }
}

@media (max-width: 576px) {
  .breadcrumb {
    font-size: 11px !important;
  }
  
  .breadcrumb li a,
  .breadcrumb li a span {
    font-size: 11px !important;
  }
}

/* ========== 搜索框响应式 ========== */
@media (max-width: 768px) {
  .search {
    display: none !important;
  }
  
  .mobile_search {
    display: block !important;
    padding: 10px !important;
    background: #fff;
  }
  
  .mobile_search input {
    width: 100% !important;
    padding: 10px 15px !important;
    border: 1px solid #e0e0e0;
    border-radius: 25px;
    font-size: 14px !important;
  }
}

/* ========== 移动端固定底部导航 ========== */
@media (max-width: 768px) {
  .footer-fixed {
    display: block !important;
  }
  
  body {
    padding-bottom: 60px !important;
  }
}

/* ========== 回到顶部按钮响应式 ========== */
@media (max-width: 768px) {
  .gotoptop_icon {
    display: none !important;
  }
}

/* ========== 标签云响应式 ========== */
@media (max-width: 768px) {
  .tags h2 {
    font-size: 15px !important;
  }
  
  .tab-content .tags a {
    display: inline-block;
    padding: 5px 10px !important;
    margin: 4px !important;
    background: #f5f5f5;
    border-radius: 4px;
    font-size: 12px !important;
  }
}

@media (max-width: 576px) {
  .tab-content .tags a {
    padding: 4px 8px !important;
    font-size: 11px !important;
  }
}

/* ========== 选项卡导航响应式 ========== */
@media (max-width: 768px) {
  .tab-nav {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
  }
  
  .tab-nav-item {
    padding: 10px 20px !important;
    font-size: 14px !important;
  }
  
  .info_option {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
  }
  
  .info_option a {
    padding: 12px 15px !important;
    font-size: 14px !important;
  }
}

/* ========== 图片容器响应式 ========== */
@media (max-width: 768px) {
  .article-thumb {
    width: 100% !important;
  }
  
  .article-thumb img {
    width: 100% !important;
    height: auto !important;
  }
}

/* ========== 侧边栏响应式 ========== */
@media (max-width: 768px) {
  .white-bg {
    padding: 12px !important;
    margin-bottom: 15px !important;
  }
  
  .section-tit .name {
    font-size: 15px !important;
  }
  
  .method-box li {
    padding: 8px 0 !important;
  }
}

@media (max-width: 576px) {
  .white-bg {
    padding: 10px !important;
  }
  
  .section-tit .name {
    font-size: 14px !important;
  }
}

/* ========== 无数据提示响应式 ========== */
@media (max-width: 768px) {
  .no-data {
    padding: 30px 15px !important;
    font-size: 13px !important;
  }
  
  .wuwu {
    margin: 30px 0 !important;
    min-height: auto !important;
  }
  
  .wuwu img {
    width: 80px !important;
  }
}

/* ========== 表单元素响应式 ========== */
@media (max-width: 768px) {
  input[type="text"],
  input[type="password"],
  input[type="email"],
  textarea {
    font-size: 14px !important;
    padding: 10px 12px !important;
  }
  
  button,
  input[type="submit"] {
    padding: 10px 20px !important;
    font-size: 14px !important;
  }
}

/* ========== 模态框响应式 ========== */
@media (max-width: 768px) {
  .layui-layer {
    width: 90% !important;
    left: 5% !important;
  }
}

/* ========== 加载动画响应式 ========== */
@media (max-width: 768px) {
  .loading {
    padding: 20px !important;
  }
  
  .loading-spinner {
    width: 30px !important;
    height: 30px !important;
  }
}

/* ========== 横屏适配 ========== */
@media (max-width: 900px) and (orientation: landscape) {
  .inSlide .swiper {
    height: 150px !important;
  }
  
  .inSlide .swiper-slide a,
  .inSlide .swiper-slide img {
    height: 150px !important;
  }
  
  .mobile_menu {
    top: 56px !important;
  }
}

/* ========== 高分辨率屏幕适配 ========== */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .logo img {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
  }
  
  .hotmatch .zdlogo img,
  .hotmatch .kdlogo img {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
  }
}

/* ========== 打印样式 ========== */
@media print {
  .mobile_header,
  .mobile_menu,
  .mainmenu,
  .footer-fixed,
  .gotoptop_icon,
  .search {
    display: none !important;
  }
  
  body {
    padding: 0 !important;
  }
  
  .container {
    width: 100% !important;
    max-width: none !important;
  }
}

/* ========== 平滑过渡动画 ========== */
@media (max-width: 768px) {
  * {
    -webkit-tap-highlight-color: transparent;
  }
  
  a, button {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
  }
  
  .hotmatch {
    transition: transform 0.2s ease;
  }
  
  .hotmatch:active {
    transform: scale(0.98);
  }
}

/* ========== 辅助功能 ========== */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

@media (max-width: 768px) {
  .hidden-mobile {
    display: none !important;
  }
  
  .visible-mobile {
    display: block !important;
  }
}

@media (min-width: 769px) {
  .hidden-mobile {
    display: block !important;
  }
  
  .visible-mobile {
    display: none !important;
  }
}

/* ========== 问答列表页响应式 ========== */
@media (max-width: 768px) {
  .wenda-list-item {
    padding: 12px 0 !important;
  }
  
  .wenda-list-item .question-title {
    font-size: 14px !important;
    line-height: 1.5 !important;
  }
  
  .wenda-list-item .answer-count {
    font-size: 12px !important;
  }
  
  .wenda-list-item .date {
    font-size: 11px !important;
  }
}

@media (max-width: 576px) {
  .wenda-list-item .question-title {
    font-size: 13px !important;
  }
}

/* ========== 问答详情页响应式 ========== */
@media (max-width: 768px) {
  .wenda-content {
    font-size: 15px !important;
    line-height: 1.8 !important;
  }
  
  .wenda-content img {
    max-width: 100% !important;
    height: auto !important;
  }
  
  .wenda-answer {
    padding: 15px 0 !important;
  }
  
  .wenda-answer .answer-text {
    font-size: 14px !important;
    line-height: 1.7 !important;
  }
}

@media (max-width: 576px) {
  .wenda-content {
    font-size: 14px !important;
  }
  
  .wenda-answer .answer-text {
    font-size: 13px !important;
  }
}

/* ========== 热门列表响应式 ========== */
@media (max-width: 768px) {
  .reci-item {
    padding: 10px 0 !important;
  }
  
  .reci-item .title {
    font-size: 14px !important;
  }
  
  .reci-item .count {
    font-size: 12px !important;
  }
}

@media (max-width: 576px) {
  .reci-item .title {
    font-size: 13px !important;
  }
}

/* ========== 集锦列表响应式 ========== */
@media (max-width: 768px) {
  .jijin-grid li {
    padding: 10px 0 !important;
  }
  
  .jijin-grid li .title {
    font-size: 14px !important;
  }
  
  .jijin-grid li .date {
    font-size: 11px !important;
  }
}

@media (max-width: 576px) {
  .jijin-grid li .title {
    font-size: 13px !important;
  }
}

/* ========== 集锦详情页响应式 ========== */
@media (max-width: 768px) {
  .jijin-video-container {
    width: 100% !important;
  }
  
  .jijin-video-container video {
    width: 100% !important;
    height: auto !important;
  }
}

/* ========== 球员详情页响应式 ========== */
@media (max-width: 768px) {
  .qiuyuan-profile {
    flex-direction: column !important;
    gap: 15px !important;
  }
  
  .qiuyuan-profile .player-photo {
    width: 100px !important;
    height: 100px !important;
  }
  
  .qiuyuan-profile .player-info {
    width: 100% !important;
  }
  
  .qiuyuan-profile .player-name {
    font-size: 18px !important;
  }
  
  .qiuyuan-stats {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }
}

@media (max-width: 576px) {
  .qiuyuan-profile .player-name {
    font-size: 16px !important;
  }
}

/* ========== 球队详情页响应式 ========== */
@media (max-width: 768px) {
  .qiudui-header {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }
  
  .qiudui-header .team-logo {
    width: 80px !important;
    height: 80px !important;
    margin-bottom: 10px !important;
  }
  
  .qiudui-header .team-name {
    font-size: 18px !important;
  }
  
  .qiudui-info-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }
}

@media (max-width: 576px) {
  .qiudui-header .team-name {
    font-size: 16px !important;
  }
}

/* ========== 联赛详情页响应式 ========== */
@media (max-width: 768px) {
  .liansai-header {
    padding: 15px !important;
  }
  
  .liansai-header .league-logo {
    width: 60px !important;
    height: 60px !important;
  }
  
  .liansai-header .league-name {
    font-size: 16px !important;
  }
  
  .liansai-standings {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  .liansai-standings table {
    min-width: 600px;
  }
}

@media (max-width: 576px) {
  .liansai-header .league-name {
    font-size: 14px !important;
  }
}

/* ========== 电视直播列表响应式 ========== */
@media (max-width: 768px) {
  .tv-item {
    padding: 10px 0 !important;
  }
  
  .tv-item .channel-name {
    font-size: 14px !important;
  }
  
  .tv-item .channel-desc {
    font-size: 12px !important;
  }
}

@media (max-width: 576px) {
  .tv-item .channel-name {
    font-size: 13px !important;
  }
}

/* ========== 电视直播详情响应式 ========== */
@media (max-width: 768px) {
  .tv-player {
    width: 100% !important;
  }
  
  .tv-player video {
    width: 100% !important;
    height: auto !important;
  }
}

/* ========== 录像列表响应式 ========== */
@media (max-width: 768px) {
  .luxiang-grid li {
    padding: 10px 0 !important;
  }
  
  .luxiang-grid li .title {
    font-size: 14px !important;
  }
  
  .luxiang-grid li .date {
    font-size: 11px !important;
  }
}

@media (max-width: 576px) {
  .luxiang-grid li .title {
    font-size: 13px !important;
  }
}

/* ========== 录像详情响应式 ========== */
@media (max-width: 768px) {
  .luxiang-video-container {
    width: 100% !important;
  }
  
  .luxiang-video-container video {
    width: 100% !important;
    height: auto !important;
  }
}

/* ========== 直播列表页响应式 ========== */
@media (max-width: 768px) {
  .live-date-selector {
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    padding: 10px 0 !important;
  }
  
  .live-date-selector a {
    padding: 8px 15px !important;
    font-size: 13px !important;
    margin-right: 8px !important;
  }
}

/* ========== 标签列表页响应式 ========== */
@media (max-width: 768px) {
  .tag-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  
  .tag-cloud a {
    padding: 6px 12px !important;
    font-size: 13px !important;
    background: #f5f5f5;
    border-radius: 4px;
  }
}

@media (max-width: 576px) {
  .tag-cloud a {
    padding: 5px 10px !important;
    font-size: 12px !important;
  }
}

/* ========== 摘要列表页响应式 ========== */
@media (max-width: 768px) {
  .summary-item {
    padding: 12px 0 !important;
  }
  
  .summary-item .title {
    font-size: 14px !important;
  }
  
  .summary-item .content {
    font-size: 13px !important;
    line-height: 1.6 !important;
  }
}

@media (max-width: 576px) {
  .summary-item .title {
    font-size: 13px !important;
  }
  
  .summary-item .content {
    font-size: 12px !important;
  }
}

/* ========== 视频播放页响应式 ========== */
@media (max-width: 768px) {
  .video-player-container {
    width: 100% !important;
  }
  
  .video-player-container video {
    width: 100% !important;
    height: auto !important;
  }
  
  .video-title {
    font-size: 16px !important;
  }
  
  .video-description {
    font-size: 14px !important;
    line-height: 1.7 !important;
  }
}

@media (max-width: 576px) {
  .video-title {
    font-size: 14px !important;
  }
  
  .video-description {
    font-size: 13px !important;
  }
}

/* ========== 用户中心响应式 ========== */
@media (max-width: 768px) {
  .user-menu {
    display: block !important;
  }
  
  .user-menu ul {
    display: flex;
    flex-direction: column;
    gap: 5px;
  }
  
  .user-menu ul li a {
    padding: 12px 15px !important;
    font-size: 14px !important;
    display: block;
  }
  
  .user-content {
    width: 100% !important;
    padding: 15px !important;
  }
}

@media (max-width: 576px) {
  .user-menu ul li a {
    padding: 10px 12px !important;
    font-size: 13px !important;
  }
}

/* ========== 登录/注册页响应式 ========== */
@media (max-width: 768px) {
  .login-form,
  .register-form {
    width: 100% !important;
    padding: 20px !important;
  }
  
  .login-form h2,
  .register-form h2 {
    font-size: 20px !important;
  }
  
  .login-form input,
  .register-form input {
    padding: 12px 15px !important;
    font-size: 14px !important;
  }
  
  .login-form button,
  .register-form button {
    padding: 12px 20px !important;
    font-size: 14px !important;
  }
}

@media (max-width: 576px) {
  .login-form,
  .register-form {
    padding: 15px !important;
  }
  
  .login-form h2,
  .register-form h2 {
    font-size: 18px !important;
  }
}

/* ========== 表格响应式 ========== */
@media (max-width: 768px) {
  table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  table th,
  table td {
    padding: 8px 10px !important;
    font-size: 13px !important;
    white-space: nowrap;
  }
}

@media (max-width: 576px) {
  table th,
  table td {
    padding: 6px 8px !important;
    font-size: 12px !important;
  }
}

/* ========== 评论区域响应式 ========== */
@media (max-width: 768px) {
  .comment-list {
    padding: 0 !important;
  }
  
  .comment-item {
    padding: 12px 0 !important;
  }
  
  .comment-item .avatar {
    width: 40px !important;
    height: 40px !important;
  }
  
  .comment-item .comment-content {
    width: calc(100% - 50px) !important;
  }
  
  .comment-item .username {
    font-size: 13px !important;
  }
  
  .comment-item .text {
    font-size: 14px !important;
    line-height: 1.6 !important;
  }
  
  .comment-item .date {
    font-size: 11px !important;
  }
}

@media (max-width: 576px) {
  .comment-item .username {
    font-size: 12px !important;
  }
  
  .comment-item .text {
    font-size: 13px !important;
  }
}

/* ========== 侧边栏模块响应式 ========== */
@media (max-width: 768px) {
  .sidebar-box {
    margin-bottom: 15px !important;
  }
  
  .sidebar-box .box-title {
    font-size: 15px !important;
    padding: 10px !important;
  }
  
  .sidebar-box .box-content {
    padding: 10px !important;
  }
}

@media (max-width: 576px) {
  .sidebar-box .box-title {
    font-size: 14px !important;
  }
}

/* ========== 广告位响应式 ========== */
@media (max-width: 768px) {
  .ad-banner {
    margin: 10px 0 !important;
  }
  
  .ad-banner img {
    width: 100% !important;
    height: auto !important;
  }
}

/* ========== 空白占位符响应式 ========== */
@media (max-width: 768px) {
  .spacer {
    height: 10px !important;
  }
}

/* ========== 特殊布局类响应式 ========== */
@media (max-width: 768px) {
  .float-left,
  .float-right {
    float: none !important;
  }
  
  .text-center-mobile {
    text-align: center !important;
  }
  
  .hidden-mobile-inline {
    display: none !important;
  }
}
