@media (max-width: 1024px) {
    html {
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }

    body {
        min-width: 0;
        max-width: 100vw;
        padding-bottom: env(safe-area-inset-bottom);
        overflow-x: hidden;
    }

    .default_container,
    .box-width,
    .vod-detail,
    .so-detail,
    .header,
    .content_box,
    .showlist-wrap,
    .public-topbox {
        max-width: 100vw;
        overflow-x: hidden;
    }

    img,
    video,
    iframe,
    embed,
    object {
        max-width: 100%;
    }

    .header,
    .header.fixed,
    .highlight {
        position: sticky;
        top: 0;
        left: 0;
        width: 100%;
        height: auto;
        min-height: 56px;
        padding: 10px 12px;
        box-sizing: border-box;
        background: rgba(20, 20, 20, .96);
        backdrop-filter: blur(12px);
    }

    .header.flex,
    .header .header-left,
    .header .header-left.flex {
        display: flex;
        align-items: center;
        min-width: 0;
    }

    .header {
        flex-wrap: wrap;
        gap: 10px;
    }

    .header-left {
        width: 100%;
        gap: 10px;
    }

    .logo {
        flex: 0 0 auto;
    }

    .logo-brand {
        margin: 0;
        display: flex;
        align-items: center;
    }

    .logo-brand img {
        height: 26px;
        max-width: 118px;
        object-fit: contain;
    }

    .header .header_right {
        flex: 1 1 auto;
        min-width: 0;
    }

    .so-search {
        width: 100%;
        height: 38px;
        margin: 0;
        border-radius: 20px;
    }

    .header input {
        width: 100%;
        min-width: 0;
        margin-left: 8px;
        font-size: 14px;
    }

    .search-hot,
    .header .margin em {
        display: none;
    }

    .header .sllogo {
        width: 42px;
        flex: 0 0 42px;
    }

    .header > .flex {
        width: 100%;
        height: 48px;
        overflow-x: auto;
        overflow-y: hidden;
        justify-content: flex-start;
        gap: 8px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .header > .flex::-webkit-scrollbar {
        display: none;
    }

    .header .margin {
        height: 42px;
        padding: 0 8px;
        flex: 0 0 auto;
    }

    .header .margin .icon-title {
        width: 42px;
        height: 42px;
        border-radius: 21px;
        background: rgba(255, 255, 255, .08);
    }

    .header .margin i {
        font-size: 20px;
    }

    .header .margin .avataruser {
        width: 34px;
        height: 34px;
        margin-top: 4px;
    }

    .drop-content,
    .hot-search-list {
        left: 0;
        right: 0;
        top: 48px;
        width: calc(100vw - 24px);
        max-width: none;
        margin: 0 auto;
        box-sizing: border-box;
    }

    .leftheader_left_header_box {
        position: sticky !important;
        top: 124px;
        left: 0 !important;
        width: 100%;
        height: auto;
        min-height: 0;
        margin-top: 0;
        z-index: 900;
        background: #141414;
        direction: ltr;
    }

    .leftheader_left_header_box .leftheader_navlist_wrap,
    .leftheader_left_header_box .leftheader_navlist_wrap .leftheader_nav_area_box {
        height: auto;
        overflow-x: auto;
        overflow-y: hidden;
        direction: ltr;
        padding: 0 12px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .leftheader_left_header_box .leftheader_navlist_wrap .leftheader_nav_area_box::-webkit-scrollbar {
        display: none;
    }

    .leftheader_left_nav_box {
        display: flex;
        width: max-content;
        min-width: 100%;
        padding: 0;
        text-align: left;
        gap: 18px;
    }

    .leftheader_left_nav_box .leftheader_link_item,
    .leftheader_left_nav_box .leftheader_link_item:hover,
    .leftheader_left_nav_box .leftheader_current_item {
        height: 44px;
        line-height: 44px;
        font-size: 15px;
        font-weight: 500;
        white-space: nowrap;
        animation: none;
    }

    .leftheader_left_nav_box .leftheader_current_item {
        color: #59Ceff;
    }

    .default_container,
    .box-width,
    .ad-container {
        width: auto;
        margin-left: 12px;
        margin-right: 12px;
    }

    .default_container.flex.between {
        flex-direction: column;
        flex-wrap: wrap;
        width: auto;
    }

    .vod-detail .default_container.flex.between {
        display: flex;
    }

    .ad-container {
        display: block;
        padding-bottom: 12px;
    }

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

    .ad img {
        height: auto;
        min-height: 58px;
        object-fit: cover;
    }

    .content_box {
        height: auto;
        min-height: 430px;
        padding-bottom: 22px;
    }

    .content_box::after {
        height: 180px;
    }

    .content_box .left-mask {
        width: 100%;
        background-image: linear-gradient(180deg, rgba(20,20,20,.12), rgba(20,20,20,.82));
    }

    .content_box .info_wrap {
        left: 0;
        right: 0;
        bottom: 138px;
        padding: 0 4px;
    }

    .content_box .info_wrap .info_title h3 {
        max-width: 100%;
        font-size: 26px;
        margin-bottom: 10px;
    }

    .content_box .info_wrap .info_type,
    .content_box .info_wrap .info_in,
    .content_box .info_wrap .info_ins {
        width: 100%;
        max-width: 100%;
        font-size: 13px;
    }

    .content_box .info_wrap .info_ins p {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .content_box .info_wrap .info_bottom .play_btn {
        width: 126px;
        height: 42px;
        font-size: 14px;
    }

    .focus_list {
        left: 12px;
        right: 12px;
        bottom: 12px;
    }

    .focus_wrap {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .focus_wrap::-webkit-scrollbar {
        display: none;
    }

    .focus_wrap_box,
    .focus_wrap_box.active {
        display: flex;
        column-gap: 10px;
        width: max-content;
    }

    .focus_wrap_box .focus_item {
        width: 118px;
        flex: 0 0 118px;
    }

    .focus_wrap .pic img {
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .focus_wrap .title {
        margin-top: 6px;
        font-size: 12px;
    }

    .focus_list .swiper_prev,
    .focus_list .swiper_next {
        display: none;
    }

    .rb {
        margin-top: 18px;
    }

    .rb_horizontal .rb_wrap,
    .rb_vertical .rb_wrap,
    .topic-box {
        --show-num: 3;
    }

    .rb_wrap .rb_top {
        align-items: flex-start;
        margin-bottom: 12px;
        gap: 10px;
    }

    .rb_wrap .rb_top .rb_top_left {
        min-width: 0;
        display: block;
    }

    .rb_wrap .rb_top .rb_top_left .rb_title,
    .ant-tabscontent .title-name span,
    .play-detail .title {
        font-size: 22px;
        line-height: 30px;
    }

    .rb_wrap .rb_top .rb_top_left .rb_split {
        display: none;
    }

    .rb_wrap .rb_top .rb_top_left .rb_type {
        width: calc(100vw - 24px);
        margin-top: 8px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .rb_wrap .rb_top .rb_top_left .rb_type::-webkit-scrollbar {
        display: none;
    }

    .rb_wrap .rb_top .rb_top_left .rb_list {
        width: max-content;
        column-gap: 18px;
        font-size: 14px;
    }

    .rb_wrap .rb_top .rb_top_right .change_page {
        display: none;
    }

    .rb_wrap .rb_wrap_list {
        column-gap: 10px;
    }

    .rb_wrap>.rb_wrap_list .rb_item,
    .topic-list-box {
        width: calc((100% - 20px) / 3);
        margin-bottom: 20px;
    }

    .rb_wrap>.rb_wrap_list .rb_item .rb_pic,
    .rb_wrap>.rb_wrap_list .rb_item .rb_pic a > img,
    .topic-pic,
    .topic-pic img {
        border-radius: 6px;
    }

    .rb_pic a > img:hover,
    .cover:hover .topic-pic img {
        transform: none;
    }

    .rb_wrap>.rb_wrap_list .rb_item .rb_pic .right_top .right_top_pf,
    .rb_wrap>.rb_wrap_list .rb_item .rb_pic .right_top .right_top_type {
        padding: 2px 4px;
        font-size: 10px;
    }

    .rb_wrap>.rb_wrap_list .rb_item .rb_pic .total_num {
        height: 32px;
        padding: 12px 6px 6px 0;
        font-size: 11px;
    }

    .rb_wrap>.rb_wrap_list .rb_item .rb_simple_info .simple_title {
        margin-top: 6px;
        font-size: 14px;
        line-height: 20px;
    }

    .rb_wrap>.rb_wrap_list .rb_item .rb_simple_info .simple_ins {
        font-size: 12px;
        line-height: 16px;
    }

    .vod-detail,
    .so-detail {
        padding-top: 0;
    }

    .detail-bg,
    .detail-bg .selectBg {
        height: 300px;
        background-size: cover;
    }

    .vod-detail .left,
    .vod-detail .right,
    .row75,
    .row25,
    .row8,
    .row2 {
        width: 100%;
        margin-right: 0;
    }

    .vod-detail .left.flex {
        align-items: flex-start;
        flex-wrap: wrap;
        width: auto;
    }

    .vod-detail .flex-auto {
        flex: 1 1 auto;
        width: auto;
        min-width: 0;
    }

    .detail-pic {
        width: 120px;
        height: 170px;
        margin-right: 14px;
        flex: 0 0 120px;
    }

    .detail-pic-img {
        height: 170px;
    }

    .s-top-info h1 {
        float: none;
        width: auto;
        font-size: 24px;
        line-height: 32px;
        white-space: normal;
        word-break: break-all;
    }

    .s-top-info-detail .item {
        line-height: 24px;
        font-size: 13px;
    }

    .desc-txt {
        line-height: 24px;
        font-size: 14px;
    }

    .btn {
        padding: 8px 16px;
    }

    .score {
        width: 100%;
        height: auto;
        padding: 18px 0;
        margin-top: 16px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-start;
        gap: 12px;
        background: none;
        box-shadow: none;
        text-align: left;
    }

    .score .rating-box {
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .score .rating-box .text-branch {
        font-size: 28px;
    }

    .score .rating-box .text-muted {
        flex: 0 0 auto;
    }

    .score #rating {
        flex: 0 0 auto;
    }

    .score .qrcode,
    .score > div:has(img[width="140"]) {
        display: none;
    }

    .score > div > p.text-muted {
        display: none;
    }

    .rating-box,
    .mt-gbook-media,
    .feed-header,
    .feed-user-info {
        flex-wrap: wrap;
    }

    .content_playlist {
        gap: 8px;
    }

    .content_playlist li,
    .playbox li {
        width: calc((100% - 16px) / 3);
        height: 38px;
        line-height: 38px;
        margin: 0;
        font-size: 13px;
    }

    .detail-play {
        max-height: none;
        margin-right: 0;
    }

    .player {
        position: relative;
        top: 0;
        right: auto;
        bottom: auto;
        left: auto;
        overflow: visible;
    }

    .player-left,
    .playerstyle .player-left {
        width: 100%;
        height: auto;
        margin-right: 0;
        padding-bottom: 56.25%;
    }

    .player-right {
        position: relative;
        top: auto;
        right: auto;
        float: none;
        width: 100%;
        height: auto;
        margin-top: 12px;
    }

    .plist-body {
        width: auto;
        margin: 0 12px;
    }

    .playerstyle .player-details-box .player-vod-no1 {
        height: auto;
        max-height: none;
    }

    .video-footer-panel {
        position: relative;
    }

    .m-search {
        min-height: 170px;
        padding-top: 112px;
    }

    .m-search-case {
        top: 38px;
        left: 12px;
        right: 12px;
        width: auto;
        height: 60px;
        margin-left: 0;
        padding: 8px 46px 8px 0;
    }

    .m-search-case .input {
        width: 100%;
        font-size: 24px;
        line-height: 44px;
    }

    .m-search-card ul {
        display: flex;
        overflow-x: auto;
        gap: 18px;
        -webkit-overflow-scrolling: touch;
    }

    .m-search-card ul li {
        float: none;
        flex: 0 0 auto;
        margin-right: 0;
    }

    .typetag,
    .new_category_tag dd,
    .showlist-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .new_category_tag dt {
        position: static;
        margin-bottom: 10px;
    }

    .new_category_tag dd {
        margin-left: 0;
        white-space: nowrap;
    }

    .new_category_tag a,
    .typetag .item {
        margin-right: 8px;
    }

    .mt-page li {
        margin: 0 2px 6px;
    }

    .mt-page li a {
        padding: 7px 10px;
    }

    .topic-title-a h2 {
        font-size: 20px;
    }

    .public-topbox {
        margin: 20px 12px;
    }

    .top-box .title {
        font-size: 28px;
    }

    .videoshot-box,
    .app-w {
        width: 100% !important;
    }

    .videoshot-box-br {
        margin: 0 0 12px;
        padding: 14px;
    }

    .pop-box,
    .mac_msg_jump,
    .msg_bg,
    .mac_pop {
        width: calc(100vw - 24px) !important;
        max-width: 400px;
        box-sizing: border-box;
    }

    .pop-content-box {
        padding: 24px 18px;
    }

    .comment_face_box {
        width: calc(100vw - 48px);
        box-sizing: border-box;
    }
}

@media (max-width: 640px) {
    .header,
    .header.fixed,
    .highlight {
        padding: 8px 10px;
    }

    .leftheader_left_header_box {
        top: 112px;
    }

    .default_container,
    .box-width,
    .ad-container {
        margin-left: 10px;
        margin-right: 10px;
    }

    .content_box {
        min-height: 390px;
    }

    .content_box .info_wrap {
        bottom: 118px;
    }

    .content_box .info_wrap .info_title h3 {
        font-size: 22px;
    }

    .focus_wrap_box .focus_item {
        width: 104px;
        flex-basis: 104px;
    }

    .rb_horizontal .rb_wrap,
    .rb_vertical .rb_wrap,
    .topic-box {
        --show-num: 2;
    }

    .rb_wrap>.rb_wrap_list .rb_item,
    .topic-list-box {
        width: calc((100% - 10px) / 2);
    }

    .rb_vertical .rb_wrap>.rb_wrap_list .rb_item .rb_pic a > img {
        aspect-ratio: 16 / 9;
    }

    .vod-detail .left.flex {
        display: block;
        width: 100%;
    }

    .vod-detail .flex-auto {
        flex: none;
        width: auto;
    }

    .detail-pic {
        float: left;
        width: 110px;
        height: 156px;
        margin-right: 12px;
        margin-bottom: 8px;
        flex: none;
    }

    .detail-pic-img {
        height: 156px;
    }

    .s-top-info h1 {
        font-size: 22px;
        line-height: 30px;
    }

    .s-top-info-detail .desc-txt {
        clear: both;
        padding-top: 8px;
    }

    .relativecontent {
        overflow: visible;
    }

    .relativecontent .content_detail .playbtn {
        position: static;
        margin-top: 14px;
    }

    .content_detail .playbtn a {
        margin-bottom: 8px;
    }

    .ant-tabscontent {
        height: auto;
        line-height: 32px;
    }

    .ant-tabscontent .title-name span,
    .play-detail .title {
        font-size: 20px;
    }

    .content_playlist li,
    .playbox li {
        width: calc((100% - 8px) / 2);
    }

    .player-right .title {
        padding: 0 12px;
    }

    .player-details-box .intro-details {
        padding: 0 12px;
    }

    .m-search-case .input {
        font-size: 20px;
    }

    .mt-gbook-list .mt-media-bd,
    .at-feed-stream-comment-list {
        padding: 14px;
    }
}

@media (max-width: 380px) {
    .logo-brand img {
        max-width: 96px;
    }

    .header .sllogo {
        width: 36px;
        flex-basis: 36px;
    }

    .rb_wrap>.rb_wrap_list .rb_item .rb_pic .right_top {
        display: none;
    }

    .content_playlist li,
    .playbox li {
        font-size: 12px;
    }
}