.opacityBox {
    width: 1200px;
    height: 1260px;
    margin: 0 auto;
    border-top: 5px solid #d99489;
    margin-top: 258px;
    background-color: #faeee2;
    opacity: 0.85;
}

.ItemBox {
    width: 1104px;
    height: 1180px;
    background: #ffffff;
    margin: 0 auto;
    padding: 16px;
    box-sizing: border-box;
}

.listRight ul {
    display: none;
}

.listLeft ul li {
    width: 150px;
    height: 44px;
    background-color: #ffffff;
    border: solid 1px #e9bc8f;
    font-size: 18px;
    line-height: 44px;
    text-align: center;
    margin: 10px 0 10px 10px;
}

.hover {
    background: url(../images/active1.png) no-repeat transparent !important;
    border: none !important;
    width: 156px !important;
}

.hover a {
    color: #cb644b !important;
}

.listLeft ul li a {
    color: #484848;
}

.listRight {
    width: 62%;
    float: right;
    background: #fff;
    margin: 15px 15px 15px 0;
    padding: 20px;
    box-sizing: border-box;
    height: 260px;
}

.listRight ul {
    width: 100%;
}

.listRight ul li {
    font-size: 18px;
    line-height: 18px;
    width: 100%;
}

.listRight ul li a {
    color: #505050;
    display: inline-block;
    width: 100%;
    overflow: hidden;
    height: 38px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.listRight ul li a:hover {
    color: #3783d8;
}

.fwgkList ul li {
    display: inline-block;
    margin: 26px 10px;
    width: 190px;
    height: 44px;
    background-color: #fffbf6;
    text-align: center;
    line-height: 44px;
    font-size: 18px;
}

.fwgkList ul li:hover {
    background: url(../images/active2.png) no-repeat transparent;
    line-height: 54px;
    height: 52px;
    margin: 20px 10px;
}

.fwgkList ul li:hover a {
    color: #c75438;
}

.fwgkList ul li a {
    color: #5a5a5a;
}

.bottom .content {
    width: 1200px !important;
}

/* ========== 响应式适配（移动端） ========== */
@media screen and (max-width: 1200px) {
    /* 隐藏半透明遮罩层，避免遮挡内容 */
    .opacityBox {
        display: none !important;
    }

    /* 将绝对定位的容器改为相对定位，恢复文档流 */
    #container > div[style*="position: absolute"] {
        position: relative !important;
        width: 100% !important;
    }

    /* ItemBox 宽度自适应，高度自动 */
    .ItemBox {
        width: 95% !important;
        margin: 0 auto !important;
        padding: 10px !important;
        display: block !important;
        float: none !important;
        height: auto !important;
    }

    .ItemBox::after {
        content: "";
        display: block;
        clear: both;
    }

    /* 左右浮动的区块改为上下排列，宽度 100% */
    .ItemBox > div[style*="float: left"],
    .ItemBox > div[style*="float: right"] {
        width: 100% !important;
        margin: 0 0 20px 0;
    }

    /* 标题背景图自适应 */
    .ItemBox div[style*="background: url"] {
        background-position: left center !important;
        width: 100% !important;
        height: 50px !important;
    }

    .background_div{
        margin-top: 0 !important;
    }

    /* 左侧菜单区（listLeft）改为弹性布局，菜单项换行 */
    .listLeft {
        width: 100% !important;
        float: none !important;
    }

    .listLeft ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
        padding: 0;
    }

    .listLeft ul li {
        width: auto !important;
        min-width: 120px;
        margin: 0 !important;
        font-size: 14px !important;
        white-space: nowrap;
    }

    /* 激活状态样式适配 */
    .hover {
        width: auto !important;
        background-size: 100% 100% !important;
        min-width: 120px;
    }

    /* 右侧内容区（listRight）宽度 100%，高度自动，文字允许换行 */
    .listRight {
        width: 100% !important;
        float: none !important;
        margin: 10px 0 !important;
        height: auto !important;
        min-height: 200px;
        padding: 15px !important;
    }

    .listRight ul li {
        font-size: 14px !important;
        line-height: 1.5 !important;
        white-space: normal;
    }

    .listRight ul li a {
        height: auto !important;
        word-break: break-word;
        line-height: 1.4;
        padding: 4px 0;
    }

    /* 服务公开按钮区域自适应 */
    .fwgkList ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
        padding: 0;
    }

    .fwgkList ul li {
        width: auto !important;
        min-width: 130px;
        margin: 5px !important;
        font-size: 14px !important;
        white-space: nowrap;
    }

    .fwgkList ul li:hover {
        margin: 5px !important;
        line-height: 44px;
        height: 44px;
    }
}

/* 手机屏幕进一步优化 */
@media screen and (max-width: 768px) {
    .item_list_parent{
        margin-bottom: 0 !important;
        margin-top: 0 !important;
    }
    .item_list{
        height: auto !important;
    }
    body {
        background-size: 100% auto !important;
    }

    .listLeft ul li {
        min-width: 100px;
        font-size: 12px !important;
    }

    .hover {
        min-width: 100px;
    }

    .fwgkList ul li {
        min-width: 110px;
        font-size: 12px !important;
    }

    .listRight ul li {
        font-size: 13px !important;
    }
}

/* 超小屏（宽度 ≤ 480px） */
@media screen and (max-width: 480px) {
    .item_list{
        margin-top: 0 !important;
    }
    
    .listLeft ul li {
        width: 100% !important;
        text-align: center;
    }

    .fwgkList ul li {
        width: 100% !important;
        margin: 5px 0 !important;
    }
}