/**
 * 浮梁县人民政府网站 - 移动端头部和底部适配样式
 * Mobile Header & Footer Responsive Styles for Fuliang Government Website
 */

/* ============================================
   移动端基础样式 (≤768px) - Header
   ============================================ */

@media screen and (max-width: 768px) {
    :root {
        --mobile-header-height: 370px;
        --mobile-logo-max-width: 320px;
        --mobile-logo-max-height: 80px;
        --mobile-nav-font-size: 13px;
        --mobile-search-height: 38px;
        --mobile-swiper-height: 500px;
        --mobile-padding: 15px;
        --mobile-font-size: 16px;
        --mobile-title-font: 18px;
        --mobile-content-font: 15px;
        --mobile-footer-icon-height: 40px;
        --mobile-footer-font: 11px;
    }
    #ariaTipText {
        display: none;
    }

    #header header {
        position: relative;
    }

    .headerbg {
        height: var(--mobile-header-height) !important;
    }

    .headerbg .swiper-slide img {
        width: 100%;
        height: var(--mobile-header-height);
        object-fit: cover;
        max-height: var(--mobile-header-height);
    }
    header .container{
        padding-top: 1rem;
    }
    header .container .flex{
        height: 5rem;
        margin-top: 1.5rem;
        flex-direction: column;
    }
    header .container .flex .logo img{
        position: sticky;
    }

    .container {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: var(--mobile-padding) !important;
        padding-right: var(--mobile-padding) !important;
        box-sizing: border-box !important;
    }

    .links .left {
        display: none !important;
    }
    

    .logo {
        width: 100% !important;
        margin-left: 0 !important;
        text-align: center !important;
    }

    .logo img {
        width: auto;
        height: auto;
        max-width: var(--mobile-logo-max-width);
        max-height: var(--mobile-logo-max-height);
    }
    header .container .links .right{
        width: 100%;
        flex-wrap: wrap;
    }
    header .container .links span{
        font-size: 16px !important;
        margin-right: 0px !important;
    }
    header .container .links a{
        padding: 0;
    }
    header .menu {
        width: 100% !important;
        height: auto !important;
        max-height: 120px;
        position: relative !important;
        top: 0 !important;
        right: 0 !important;
        margin-top: 75px !important;
    }

    header .menu ul {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        padding-right: 0 !important;
        margin: auto;
    }

    header .menu ul li {
        width: 30%;
        height: 40px !important;
        margin: 10px 5px !important;
    }

    header .menu ul li a p {
        font-size: 24px !important;
        line-height: 40px !important;
        white-space: nowrap !important;
        text-align: center !important;
    }

    header .menu ul li.has-child ul {
        display: none !important;
    }

    .search {
        width: 100% !important;
        margin-top: 15px !important;
        margin-left: 0 !important;
        margin-bottom: 15px !important;
    }

    .search .box {
        width: 90% !important;
        display: flex !important;
        justify-content: center !important;
    }

    .search .ls_input1 {
        width: 100% !important;
        height: var(--mobile-search-height) !important;
        font-size: var(--mobile-nav-font-size) !important;
        padding: 5px 10px !important;
    }

    .search .ls_input2 {
        width: 30% !important;
        height: var(--mobile-search-height) !important;
        font-size: var(--mobile-nav-font-size) !important;
    }
    header .container .search .box form{
        align-items: center;
    }
    header .container .search button img{
        display: none;
    }

    /* 头部导航2 */
    #header2 header .menu{
        margin-top: -110px !important;
    }
    #header2 header::after{
        top: 40% !important;
        left: 50% !important;
        transform: translate(-50%, -50%);
        width: 340px;
        height: 175px;
    }
    #header2 header .container{
        height: 100%;
        position: relative;
        padding: 0 !important;
        align-content: flex-start;
    }
    #header2 header .container .search{
        position: absolute;
        display: block;
        width: 65% !important;
        bottom: 25%;
        left: 13%;
        height: auto;
    }
    #header2 header .container .search button{
        width: 30% !important;
        justify-content: center;
    }
    #header2 header .container .search input{
        height: 35px !important;
    }
    #header2 header .menu ul li{
        padding:0 !important;
        width: 180px;
    }
}

/* ============================================
   移动端基础样式 (≤768px) - Footer
   ============================================ */

@media screen and (max-width: 768px) {
    footer{
        height: auto;
    }
    #footer,
    footer {
        height: auto !important;
        margin-top: 0 !important;
    }

    #footer .container,
    footer .container {
        width: 100% !important;
        padding: 0 !important;
    }

    footer .links{
        display: none;
    }

    footer .links ul {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        padding: 0 !important;
    }

    footer .links li {
        margin: 5px 10px !important;
        text-align: center !important;
    }

    footer .links a {
        font-size: 12px !important;
        color: white !important;
        white-space: nowrap !important;
    }

    footer .info {
        margin: 20px 0 !important;
        text-align: center !important;
    }

    footer .info > div {
        width: 70% !important;
        margin-bottom: 10px !important;
    }

    footer .info span {
        margin: 0 5px !important;
    }

    footer .info span a {
        font-size: 12px !important;
        color: white !important;
    }

    footer .info p {
        font-size: var(--mobile-footer-font) !important;
        color: white !important;
        line-height: 1.8 !important;
        margin: 5px 0 !important;
        text-align: center !important;
        flex-wrap: wrap;
    }

    footer .info a.banquan {
        font-size: var(--mobile-footer-font) !important;
        color: white !important;
    }

    footer .pic {
        position: relative !important;
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 10px !important;
        margin-top: 15px !important;
    }

    footer .pic a {
        display: inline-block !important;
        margin: 0 !important;
    }

    footer .pic img {
        width: auto !important;
        height: var(--mobile-footer-icon-height) !important;
        max-width: 100% !important;
        object-fit: contain !important;
    }

    footer-links {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
    }

    footer-links a {
        font-size: 12px !important;
        margin: 3px 5px !important;
    }
}

/* ============================================
   小屏幕优化 (<570px) - Header2
   ============================================ */

@media screen and (max-width: 570px) {
    #header2 header{
        padding-bottom: 200px;
    }
    #header2 header .menu{
        margin-top: 100px !important;
    }
    #header2 header .menu ul li{
        width: 130px;
        height: 30px !important;
    }
    #header2 header .menu ul li a p{
        font-size: 18px !important;
    }
    #header2 header .container .search button{
        padding: 12px 0px !important
    }
}

/* ============================================
   小屏幕优化 (<480px) - Header
   ============================================ */

@media screen and (max-width: 480px) {
    #header header{
        padding-bottom: 210px;
    }
    header .menu ul li{
        margin: 5px 5px !important;
        padding: 0;
    }
    header .menu ul li a p {
        font-size: 16px !important;
    }
    header .container .links span{
        font-size: 14px !important;
    }
}

/* ============================================
   小屏幕优化 (<480px) - Header2 (zfzx页面)
   ============================================ */

@media screen and (max-width: 480px) {
    #header2 header{
        height: 1.5rem;
        padding-bottom: 80px;
    }
    #header2 header::after {
        width: 250px;
        top: 40% !important;
        background-size: contain;
    }
    #header2 header .menu{
        margin-top: 0px !important;
    }
    #header2 header .menu ul li {
        width: 100px;
    }
    #header2 header .container .search{
        bottom: 0%;
    }
}

/* ============================================
   超小屏幕优化 (<360px) - Header2 (zfzx页面)
   ============================================ */

@media screen and (max-width: 360px) {
    header .container .links span{
        font-size: 12px !important;
    }
    #header2 header .menu ul li a p{
        font-size: 16px !important;
        line-height: 25px !important;
    }
    #header2 header .menu ul li{
        width: 75px;
    }
    #header2 header .menu{
        max-height: 90px;
    }
}

/* ============================================
   平板设备适配 (769px - 1024px) - Header
   ============================================ */

@media screen and (min-width: 769px) and (max-width: 1024px) {
    .container {
        width: 96% !important;
        padding-left: 2% !important;
        padding-right: 2% !important;
    }

    .logo {
        width: 35% !important;
    }

    .menu ul li a p {
        font-size: 24px !important;
    }

    .search {
        width: 35% !important;
    }
}

/* ============================================
   横屏模式优化 - Header
   ============================================ */

@media screen and (max-width: 768px) and (orientation: landscape) {
    .headerbg .swiper-slide img {
        max-height: 370px;
    }

    header .container {
        padding-top: 1rem;
    }

    header .container .flex {
        height: 5rem;
        margin-top: 1.5rem;
        flex-direction: column;
    }

    header .container .flex .logo img {
        position: sticky;
    }

    .menu {
        top: 0 !important;
    }
}

/* ============================================
   移动端基础样式 (≤768px) - 列表页/详情页通用布局
   ============================================ */

@media screen and (max-width: 768px) {
    /* --- 列表页和详情页主容器适配 --- */
    .sl_main,
    .xl_con {
        width: 100% !important;
        padding-left: var(--mobile-padding) !important;
        padding-right: var(--mobile-padding) !important;
        box-sizing: border-box !important;
    }

    .sl_main {
        display: flex !important;
        flex-direction: column !important;
    }

    /* --- 左侧导航栏适配 --- */
    .sl_main_l,
    .main .nav-left {
        width: 100% !important;
        margin-right: 0 !important;
        margin-bottom: 15px !important;
    }

    .sl_main_l .sl_xx h4,
    .main .nav-left .nav-title {
        height: auto !important;
        line-height: 50px !important;
        font-size: 18px !important;
    }

    .sl_main_l .sl_xx h4 a,
    .main .nav-left .nav-title {
        font-size: 18px !important;
        line-height: 50px !important;
        display: block !important;
        padding: 0;
    }

    .sl_main_l .sl_xx h4,
    .main .nav-left .nav-title {
        position: relative !important;
    }

    .sl_main_l .sl_xx h4::after,
    .main .nav-left .nav-title::after {
        content: '▼' !important;
        position: absolute !important;
        right: 10px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        font-size: 12px !important;
        color: #666 !important;
        transition: transform 0.3s ease !important;
    }

    .sl_main_l .sl_xx h4.expanded::after,
    .main .nav-left .nav-title.expanded::after {
        transform: translateY(-50%) rotate(180deg) !important;
    }

    .sl_ul1,
    .main .nav-left ul {
        display: flex;
        flex-wrap: wrap !important;
        justify-content: center !important;
        padding: 0 !important;
        overflow: hidden !important;
        max-height: 0 !important;
        transition: max-height 0.3s ease !important;
    }

    .sl_ul1.expanded,
    .main .nav-left ul.expanded {
        max-height: 500px !important;
        padding: 5px 0 !important;
    }

    .sl_ul1 li,
    .main .nav-left ul li {
        width: auto !important;
        padding: 8px 12px !important;
        margin: 3px !important;
        background: #F2F6FF !important;
        border-radius: 4px !important;
        height: auto !important;
        line-height: normal !important;
    }

    .sl_ul1 li a,
    .main .nav-left ul li a {
        font-size: 14px !important;
        line-height: normal !important;
        color: #333 !important;
    }

    .sl_ul1 li:hover a,
    .main .nav-left ul li:hover a,
    .main .nav-left ul li.active a {
        color: #AD0204 !important;
    }

    /* 手风琴内容区域 */
    .accordion-content {
        display: flex;
    }

    /* --- 右侧内容区域适配 --- */
    .sl_main_r,
    .main .content-right {
        width: 100% !important;
    }

    /* --- 面包屑导航适配 --- */
    .zf_adr,
    .xl_curpage {
        width: 100% !important;
        height: auto !important;
        line-height: 1.6 !important;
        padding: 10px var(--mobile-padding) !important;
        margin-left: 0 !important;
        font-size: 12px !important;
        background-size: auto 40% !important;
        box-sizing: border-box !important;
    }
    .zf_adr{
        background: url(../images/zf_home.png) no-repeat 5px center;
        padding-left: 25px !important;
    }

    .zf_adr span,
    .zf_adr a,
    .xl_curpage span,
    .xl_curpage a {
        font-size: 12px !important;
    }

    /* --- 列表标题适配 --- */
    .sl_zfwj h4,
    .sl_zfwj h4 > a {
        margin-bottom: 10px !important;
    }

    .sl_zfwj h4 > a {
        font-size: 16px !important;
        line-height: 1.5 !important;
    }

    /* --- 列表项适配 --- */
    .sl_zfwj ul.comlist5 li {
        /* flex-direction: row !important;
        flex-wrap: wrap !important; */
        height: auto !important;
        line-height: 1.8 !important;
        padding: 8px 0 !important;
        border-bottom: 1px dashed #eee;
        padding-left: 10px !important;
    }
    .sl_zfwj ul a{
        display: block;
        width: 70%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .sl_zfwj ul.comlist5 li a {
        width: 75% !important;
        font-size: 14px !important;
        line-height: 1.8 !important;
        display: flex !important;
        align-items: center;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
    }

    .sl_zfwj ul.comlist5 li a strong {
        font-size: 12px !important;
        margin-right: 5px !important;
        white-space: nowrap;
    }

    .sl_zfwj ul.comlist5 li span {
        font-size: 12px !important;
        color: #999 !important;
        margin-left: 0;
    }

    /* --- 分页适配 --- */
    .gl-page.FX_PageDiv {
        padding: 10px 0 !important;
        height: auto !important;
    }

    .Fx_PageDiv2_span1 {
        width: 100% !important;
        text-align: center !important;
        padding: 0 !important;
        float: none !important;
        font-size: 12px !important;
        margin-bottom: 10px;
    }

    .Fx_PageDiv2_span2 {
        width: 100% !important;
        text-align: center !important;
        padding: 0 !important;
        float: none !important;
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
    }

    .Fx_PageDiv2_span2 span,
    .Fx_PageDiv2_span2 strong {
        font-size: 12px !important;
        padding: 2px 6px !important;
        margin: 2px !important;
    }

    /* --- 详情页标题适配 --- */
    .xl_title {
        width: 100% !important;
        padding: 15px !important;
        font-size: 20px !important;
        line-height: 1.5 !important;
        box-sizing: border-box !important;
    }

    /* --- 详情页文档信息适配 --- */
    .xl_doc {
        height: auto !important;
        padding: 10px !important;
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
    }

    .xl_doc span {
        font-size: 12px !important;
        margin: 3px 5px !important;
    }

    /* --- 详情页内容适配 --- */
    .xl_text {
        padding: 0 !important;
    }

    .xl_text .content {
        padding: 10px !important;
    }

    .xl_text .content p,
    .xl_text .content p span {
        font-size: 16px !important;
        line-height: 1.8 !important;
        /* text-indent: 2em !important; */
    }

    .xl_text .content img,
    .xl_text .content iframe {
        max-width: 100% !important;
        width: 100% !important;
        height: auto !important;
    }

    /* --- 详情页信息表格适配 --- */
    .xl-tab1 {
        margin: 15px 0 !important;
        padding: 10px !important;
        border-width: 4px !important;
    }

    .xl-tab1 span {
        width: 100% !important;
        font-size: 12px !important;
        line-height: 2 !important;
    }

    /* --- 附件区域适配 --- */
    .fj {
        font-size: 14px !important;
        padding: 10px !important;
    }

    /* --- 领导信息页适配 --- */
    .main .container {
        width: 100% !important;
        flex-direction: column !important;
    }

    .main .leader-info {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        margin-bottom: 20px !important;
        display: none !important;
    }

    .main .leader-info .photo {
        width: 200px !important;
        height: 240px !important;
        border-width: 12px !important;
        margin: 0 auto !important;
    }

    .main .leader-info .details {
        width: 100% !important;
        text-align: center !important;
    }

    .main .leader-info .details .name {
        font-size: 22px !important;
        margin-top: 20px !important;
        margin-bottom: 10px !important;
    }

    .main .leader-info .details .position {
        font-size: 14px !important;
        margin-bottom: 20px !important;
    }

    .main .leader-intro {
        width: 100% !important;
        padding: 20px !important;
        box-sizing: border-box !important;
    }

    .main .leader-intro .section-title {
        font-size: 16px !important;
        margin-bottom: 15px !important;
    }

    .main .nav-left ul.accordion-content{
        max-height: 100% !important;
    }

    .main .leader-intro .content {
        width: 100% !important;
        padding-top: 20px !important;
    }

    .main .leader-intro .content p,
    .main .leader-intro .content span {
        font-size: 14px !important;
        line-height: 1.8 !important;
    }

    .main .leader-intro .content img {
        max-width: 100% !important;
        height: auto !important;
    }

    /* --- 搜索框在header2中的适配 --- */
    #header2 header .container .search {
        width: 90% !important;
        left: 5% !important;
    }

    #header2 header .container .search input {
        font-size: 14px !important;
        padding: 3px !important;
    }

    #header2 header .container .search button {
        font-size: 14px !important;
        padding: 10px !important;
    }

    /* --- 链接区域适配 --- */
    #header2 header .container .links .right {
        flex-wrap: wrap !important;
        justify-content: left !important;
    }

    #header2 header .container .links .right span {
        font-size: 12px !important;
        margin: 2px 5px !important;
    }
    .xxgk_col {
        margin-top: 40px;
    }
}

/* ============================================
   小屏幕优化 (<570px) - 列表页/详情页
   ============================================ */

@media screen and (max-width: 570px) {
    #header2 header::after{
        top: 30% !important;
    }
    #header2 header {
        padding-bottom: 0px;
    }
    #header2 header .container .search{
        bottom: 25%;
    }
    #header2 header .menu {
        margin-top: -80px !important;
    }
    #header2 header .menu ul{
        padding-left: 0 !important;
    }
    .sl_main_l .sl_xx h4 a,
    .main .nav-left .nav-title {
        font-size: 16px !important;
        line-height: 45px !important;
    }

    .sl_ul1 li a,
    .main .nav-left ul li a {
        font-size: 13px !important;
    }

    .sl_zfwj h4 > a {
        font-size: 15px !important;
    }

    .xl_title {
        font-size: 18px !important;
        padding: 10px !important;
    }

    .xl_doc span {
        font-size: 11px !important;
    }

    .xl_text .content p,
    .xl_text .content p span {
        font-size: 15px !important;
    }

    .main .leader-info .photo {
        width: 160px !important;
        height: 200px !important;
    }

    .main .leader-info .details .name {
        font-size: 20px !important;
    }

    .main .leader-intro .content p,
    .main .leader-intro .content span {
        font-size: 13px !important;
    }
}

/* ============================================
   超小屏幕优化 (<480px) - 列表页/详情页
   ============================================ */

@media screen and (max-width: 480px) {
    :root {
        --mobile-header-height: 400px;
        --mobile-logo-max-width: 260px;
        --mobile-logo-max-height: 70px;
        --mobile-nav-font-size: 11px;
        --mobile-search-height: 42px;
        --mobile-swiper-height: 260px;
        --mobile-padding: 8px;
        --mobile-font-size: 13px;
        --mobile-title-font: 16px;
        --mobile-content-font: 14px;
        --mobile-footer-icon-height: 40px;
        --mobile-footer-font: 11px;
    }
    .sl_ul1 li,
    .main .nav-left ul li {
        width: 17% !important;
        text-align: center !important;
        margin: 2px 0 !important;
    }

    .sl_zfwj ul.comlist5 li a {
        font-size: 13px !important;
        /* width: 70% !important; */
    }

    .xl_title {
        font-size: 16px !important;
    }

    .xl_text .content p,
    .xl_text .content p span {
        font-size: 14px !important;
        /* text-indent: 1.5em !important; */
    }

    .Fx_PageDiv2_span2 span,
    .Fx_PageDiv2_span2 strong {
        padding: 2px 5px !important;
        margin: 1px !important;
    }

    .main .leader-info .photo {
        width: 140px !important;
        height: 170px !important;
        border-width: 8px !important;
    }

    .main .leader-intro {
        padding: 15px !important;
    }

    .main .leader-intro .section-title {
        font-size: 15px !important;
    }
    .main .leader-intro .content img{
        max-width: 60% !important;
    }
}

/* ============================================
   超小屏幕优化 (<360px) - 列表页/详情页
   ============================================ */

@media screen and (max-width: 360px) {
    :root {
        --mobile-header-height: 300px;
        --mobile-logo-max-width: 200px;
        --mobile-logo-max-height: 60px;
        --mobile-nav-font-size: 10px;
        /* --mobile-swiper-height: 140px; */
        --mobile-padding: 6px;
        --mobile-font-size: 12px;
        --mobile-title-font: 15px;
        --mobile-content-font: 13px;
        --mobile-footer-icon-height: 35px;
        --mobile-footer-font: 10px;
    }
    .sl_zfwj h4 > a {
        font-size: 14px !important;
    }

    .sl_zfwj ul.comlist5 li a {
        font-size: 12px !important;
        /* width: 65% !important; */
    }

    .xl_title {
        font-size: 15px !important;
    }

    .xl_text .content p,
    .xl_text .content p span {
        font-size: 13px !important;
    }

    .main .leader-info .photo {
        width: 120px !important;
        height: 150px !important;
    }

    .main .leader-info .details .name {
        font-size: 18px !important;
    }
}

/* ============================================
   平板设备适配 (769px - 1024px) - 列表页/详情页
   ============================================ */

@media screen and (min-width: 769px) and (max-width: 1024px) {
    .sl_main,
    .xl_con {
        width: 96% !important;
        padding-left: 2% !important;
        padding-right: 2% !important;
    }

    .sl_main_l,
    .main .nav-left {
        width: 30% !important;
    }

    .sl_main_r,
    .main .content-right {
        width: 68% !important;
    }

    .main .container {
        width: 96% !important;
    }

    .main .leader-intro {
        width: 100% !important;
    }
}
/* ============================================
    新增：调查问卷/意见征集/在线访谈/咨询投诉
    详情页主体内容移动端适配
   ============================================ */

@media screen and (max-width: 768px) {
    .wrapper,.sl_main{
        width: 100% !important;
    }
    .xl .jcxx {
        margin-top: 0 !important;
    }
    .zxft-tab1-r p.nr,.mt20{
        margin: 0 !important;
    }
    /* --- 调查问卷详情 (index_wjqcshow.html) --- */
    .conent.wrapper .clearfix.mt10.xl.sl_main {
        padding: 0 !important;
    }
    
    .conent.wrapper .clearfix.mt10.xl.sl_main h4#dczj_theme {
        font-size: var(--mobile-title-font) !important;
        line-height: 1.5 !important;
        padding: 10px var(--mobile-padding) !important;
        word-break: break-all !important;
    }
    
    .conent.wrapper .jcxx.clearfix {
        padding: 0 var(--mobile-padding) !important;
        height: auto !important;
    }
    
    .conent.wrapper .jcxx.clearfix span {
        display: block !important;
        font-size: 12px !important;
        line-height: 1.8 !important;
        margin-right: 0 !important;
        margin-bottom: 5px !important;
    }
    
    .conent.wrapper .jcxx .fx.fr {
        float: none !important;
        margin-top: 10px !important;
    }
    
    .conent.wrapper #dczj_htmlContent {
        height: auto !important;
        padding: 0 var(--mobile-padding) !important;
    }
    
    .conent.wrapper #dczj_htmlContent iframe {
        height: 500px !important;
        width: 100% !important;
    }

    /* --- 意见征集详情 (index_yjzjshow.html) --- */
    .conent.wrapper h4#dczj_theme {
        font-size: var(--mobile-title-font) !important;
        line-height: 1.5 !important;
        padding: 10px var(--mobile-padding) !important;
        word-break: break-all !important;
    }
    
    .conent.wrapper .dczj-xl {
        padding: 0 var(--mobile-padding) !important;
    }
    
    .conent.wrapper .dczj-xl h2 {
        padding-left: var(--mobile-padding) !important;
    }
    
    .conent.wrapper .dczj-xl h2 span {
        font-size: 16px !important;
        line-height: 44px !important;
    }
    
    .conent.wrapper .dczj-tab {
        padding: 15px var(--mobile-padding) !important;
        overflow-x: auto !important;
    }
    
    .conent.wrapper .dczj-tab table {
        width: 100% !important;
        min-width: 300px !important;
    }
    
    .conent.wrapper .dczj-tab td {
        padding: 8px !important;
        font-size: var(--mobile-content-font) !important;
    }
    
    .conent.wrapper .dczj-tab td.a1 {
        width: 80px !important;
        white-space: nowrap !important;
    }
    
    .conent.wrapper .dczj-tab td input[type="text"],
    .conent.wrapper .dczj-tab td input[type="submit"],
    .conent.wrapper .dczj-tab td input[type="reset"] {
        width: 100% !important;
        max-width: 200px !important;
        height: 36px !important;
        font-size: 14px !important;
    }
    
    .conent.wrapper .dczj-tab td textarea {
        width: 100% !important;
        min-width: 200px !important;
        height: 100px !important;
        font-size: 14px !important;
    }
    
    .conent.wrapper .dczj-tab #yzm {
        width: 80px !important;
        height: auto !important;
    }
    
    .conent.wrapper .dlan {
        text-align: center !important;
        padding: 10px 0 !important;
    }
    
    .conent.wrapper .dlan input.a1,
    .conent.wrapper .dlan input.a2 {
        width: 45% !important;
        max-width: 140px !important;
        height: 40px !important;
        font-size: 16px !important;
        margin: 5px !important;
    }
    
    .conent.wrapper .dczj-tab p#dczj_opinionResult,
    .conent.wrapper .dczj-tab p#dczj_itemlist {
        font-size: 14px !important;
        line-height: 1.8 !important;
    }

    /* --- 在线访谈详情 (index_zxftshow.html) --- */
    .conent.wrapper .zxft-tab1 {
        padding: 15px var(--mobile-padding) !important;
    }
    
    .conent.wrapper .zxft-tab1 .ftjx {
        height: auto !important;
        /* padding: 15px 0 !important; */
        /* margin-bottom: 15px !important; */
        display: flex;
        align-items: center;
    }
    
    .conent.wrapper .zxft-tab1 .ftjx img {
        width: 100px !important;
        height: 100px !important;
        position: relative !important;
        left: auto !important;
        top: auto !important;
        display: block !important;
        /* margin: 0 auto 10px !important; */
    }
    
    .conent.wrapper .zxft-tab1 .ftjx a {
        flex-direction: column !important;
    }
    
    .conent.wrapper .zxft-tab1 .ftjx p {
        font-size: 18px !important;
        padding-left: 0 !important;
        line-height: 1.5 !important;
    }
    
    .conent.wrapper .zxft-tab1-l,
    .conent.wrapper .zxft-tab1-r {
        width: 100% !important;
        float: none !important;
    }
    
    .conent.wrapper .zxft-tab1-l img,
    .conent.wrapper #zxft_pic_video img {
        width: 100% !important;
        height: auto !important;
        max-width: 460px !important;
        margin: 0 auto !important;
        display: block !important;
    }
    
    .conent.wrapper .zxft-tab1-r .bt {
        font-size: 16px !important;
        line-height: 1.6 !important;
    }
    
    .conent.wrapper .zxft-tab1-r .tab {
        margin-bottom: 10px !important;
    }
    
    .conent.wrapper .zxft-tab1-r .tab strong {
        width: 90px !important;
        font-size: 14px !important;
        line-height: 1.6 !important;
    }
    
    .conent.wrapper .zxft-tab1-r .tab p,
    .conent.wrapper .zxft-tab1-r .tab span {
        width: calc(100% - 100px) !important;
        font-size: 13px !important;
        line-height: 1.6 !important;
    }
    
    .conent.wrapper .zxft-tab1-r p.nr {
        font-size: 13px !important;
        line-height: 1.8 !important;
        text-indent: 2em !important;
    }
    
    /* 嘉宾轮播图 */
    .conent.wrapper .zxftbox02 {
        padding-left: 0 !important;
        height: 190px;
    }
    
    .conent.wrapper .zxftpicbox {
        width: 100% !important;
        padding-top: 0px;
    }
    
    .conent.wrapper .zxftpiclist {
        gap: 5px !important;
    }
    
    .conent.wrapper .zxftpiclist li {
        width: 140px !important;
    }
    
    .conent.wrapper .zxftpiclist li img {
        width: 130px !important;
        height: auto !important;
    }
    
    .conent.wrapper .zxftqh_title a {
        font-size: 12px !important;
    }
    
    /* 访谈实录 */
    .conent.wrapper .zxft-ftsl {
        height: auto !important;
        max-height: 400px !important;
    }
    
    .conent.wrapper .zxft-ftsl-tab {
        padding: 12px var(--mobile-padding) !important;
        font-size: 13px !important;
        line-height: 1.8 !important;
    }
    
    .conent.wrapper .zxft-ftsl-tab strong {
        font-size: 13px !important;
    }
    
    .conent.wrapper .zxft-ftsl-tab p {
        font-size: 12px !important;
    }
    
    /* 第2栏：访谈实录+网友发言 */
    .conent.wrapper .zxft-tab2,
    .conent.wrapper .zxft-tab3 {
        width: 100% !important;
        float: none !important;
    }
    
    .conent.wrapper .zxft-tab2 {
        margin-bottom: 20px !important;
    }
    
    .conent.wrapper .zxft-wyfy {
        height: auto !important;
        max-height: 300px !important;
    }
    
    /* 我的发言表单 */
    .conent.wrapper .zxft-tit1 {
        font-size: 16px !important;
    }
    
    .conent.wrapper .zxft-srxx {
        width: 100% !important;
        margin-top: 10px !important;
    }
    
    .conent.wrapper .zxft-srxx span {
        width: 70px !important;
        font-size: 14px !important;
    }
    
    .conent.wrapper .zxft-srxx input {
        width: calc(100% - 90px) !important;
        max-width: 300px !important;
    }
    
    .conent.wrapper .zxft-srk textarea {
        width: 100% !important;
        max-width: 348px !important;
        height: 100px !important;
    }
    
    .conent.wrapper .zxft-yzm {
        margin: 10px 0 !important;
        display: flex !important;
        align-items: center !important;
        flex-wrap: wrap !important;
    }
    
    .conent.wrapper .zxft-yzm span {
        font-size: 14px !important;
    }
    
    .conent.wrapper .zxft-yzm input {
        width: 120px !important;
        margin: 0 10px !important;
    }
    
    .conent.wrapper .zxft-sub input {
        width: 45% !important;
        max-width: 142px !important;
        height: 40px !important;
        font-size: 16px !important;
    }
    
    .conent.wrapper .comtit {
        position: relative !important;
    }
    
    .conent.wrapper .comtit a {
        font-size: 14px !important;
        padding: 0 10px !important;
        font:caption;
    }
    
    .conent.wrapper .zdsx {
        font-size: 12px !important;
        line-height: 38px !important;
    }
    
    .conent.wrapper .slbtn {
        height: 28px !important;
        line-height: 28px !important;
        font-size: 12px !important;
        width: 70px !important;
    }

    /* --- 咨询投诉详情 (index_zxtsshow.html) --- */
    /* 注意：此页面没有conent wrapper，直接是sl_main */
    .menu a{
        width: 100% !important;
    }
    #header2 header{
        height: 2rem;
    }
    #header2 header::after {
        top: 40% !important;
    }
    body .sl_main {
        width: 100% !important;
        padding-left: var(--mobile-padding) !important;
        padding-right: var(--mobile-padding) !important;
        box-sizing: border-box !important;
    }
    
    body .sl_main .cont-tab {
        padding: 0 !important;
    }
    
    body .sl_main .gl-cont.xl {
        padding: 10px 0 !important;
    }
    
    body .sl_main .layui-elem-field {
        margin: 10px 0 !important;
    }
    
    body .sl_main .layui-elem-field legend {
        font-size: 16px !important;
        padding: 0 10px !important;
    }
    
    body .sl_main .layui-table {
        width: 100% !important;
        margin: 5px auto !important;
    }
    
    body .sl_main .layui-table th,
    body .sl_main .layui-table td {
        padding: 8px 5px !important;
        font-size: 13px !important;
        word-break: break-all !important;
    }
    
    body .sl_main .layui-table th {
        width: 25% !important;
        white-space: nowrap !important;
    }
    
    body .sl_main .layui-table td {
        width: 75% !important;
    }
    
    body .sl_main #content,
    body .sl_main #replycontent {
        font-size: 13px !important;
        line-height: 1.8 !important;
    }
    
    body .sl_main #replycontent p,
    body .sl_main #replycontent span {
        font-size: 13px !important;
        line-height: 1.8 !important;
    }
    
    body .sl_main #replycontent img {
        max-width: 100% !important;
        height: auto !important;
    }
    
    body .sl_main #file {
        font-size: 13px !important;
    }
    
    body .sl_main #score {
        font-size: 13px !important;
    }
    
    /* 咨询投诉页面的右侧内容区域 */
    body .sl_main .right-list-box {
        width: 100% !important;
    }
    
    body .sl_main .Box#lettConBox {
        padding: 0 !important;
    }
}

/* ============================================
   小屏幕优化 (<570px) - 4个详情页
   ============================================ */

@media screen and (max-width: 570px) {
    #header2 header::after{
        width: 300px;
        height: 155px;
    }
    .conent.wrapper .zxft-tab1-r .tab strong {
        width: 80px !important;
        font-size: 13px !important;
    }
    
    .conent.wrapper .zxft-tab1-r .tab p,
    .conent.wrapper .zxft-tab1-r .tab span {
        width: calc(100%) !important;
    }

    .conent.wrapper .zxftpiclist{
        width: auto !important;
    }
    
    .conent.wrapper .zxftpiclist li {
        width: 110px !important;
    }
    
    .conent.wrapper .zxftpiclist li img {
        width: 100px !important;
    }
    
    body .sl_main .layui-table th,
    body .sl_main .layui-table td {
        padding: 6px 3px !important;
        font-size: 12px !important;
    }
    
    body .sl_main #content,
    body .sl_main #replycontent,
    body .sl_main #replycontent p,
    body .sl_main #replycontent span {
        font-size: 12px !important;
    }
}

/* ============================================
   超小屏幕优化 (<480px) - 4个详情页
   ============================================ */

@media screen and (max-width: 480px) {
    .conent.wrapper #dczj_htmlContent iframe {
        height: 400px !important;
    }
    
    .conent.wrapper .dczj-tab td.a1 {
        width: 60px !important;
        font-size: 12px !important;
    }
    
    .conent.wrapper .zxft-tab1 .ftjx p {
        font-size: 15px !important;
    }
    
    .conent.wrapper .zxft-tab1-r .tab strong {
        width: 70px !important;
        font-size: 12px !important;
    }
    
    .conent.wrapper .zxft-tab1-r .tab p,
    .conent.wrapper .zxft-tab1-r .tab span {
        width: calc(100%) !important;
        font-size: 12px !important;
    }
    
    .conent.wrapper .zxft-ftsl-tab {
        padding: 10px var(--mobile-padding) !important;
        font-size: 12px !important;
    }
    
    .conent.wrapper .zxft-sub input {
        font-size: 14px !important;
    }
    
    body .sl_main .layui-elem-field legend {
        font-size: 14px !important;
    }
    
    body .sl_main .layui-table th {
        width: 30% !important;
    }
    
    body .sl_main .layui-table td {
        width: 70% !important;
    }
}