@media only screen and (min-width: 996px) {
    .main_body {
        max-width: 1750px;
        padding: 0 75px;
        margin: 20px auto;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .main_left {
        width: 250px;
    }
    .main_left ul li {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 20px;
        height: 45px;
        cursor: pointer;
        border-bottom: 1px solid #efefef;
        background-color: var(--main-color-white);
    }
    .main_left ul li:hover {
        background-color: var(--main-color);
    }
    .main_left ul li:hover i {
        color: var(--main-color-white);
    }
    .main_left ul li i {
        transition: var(--main-transition);
    }
    .main_left ul li:hover .r_img {
        display: none;
    }
    .main_left ul li:hover .s_img {
        display: block;
    }
    .main_left ul li:hover span {
        color: var(--main-color-white);
    }
    .main_left ul li:last-child {
        border: none;
    }
    .L_nav_left {
        display: flex;
        align-items: center;
    }
    .L_nav_left img {
        width: 25px;
    }
    .L_nav_left span {
        display: block;
        color: #666;
        font-size: 16px;
        margin-left: 10px;
    }
    .s_img {
        display: none;
    }
    .main_left_drop {
        display: none;
    }
    .main_left_drop a {
        display: block;
        height: 40px;
        padding-left: 40px;
        font-size: 14px;
        line-height: 40px;
        color: var(--main-color-666);
        background-color: #e9eaee;
        border-bottom: 1px solid #ccc;
    }
    .main_left_drop a:hover {
        background-color: #e9eaee !important;
        color: var(--main-color) !important;
        border-bottom: 3px solid var(--main-color) !important;
    }
    .main_left_selected {
        background-color: var(--main-color) !important;
        color: var(--main-color-white) !important;
    }
    .main_left_selected span {
        color: var(--main-color-white) !important;
    }
    .main_left_selected i {
        color: var(--main-color-white);
    }
    .main_left_selected .r_img {
        display: none;
    }
    .main_left_selected .s_img {
        display: block;
    }
    .rroo {
        transform: rotate(180deg);
    }
    .main_right {
        width: calc(100% - 290px);
        background-color: var(--main-color-white);
        border-radius: 5px;
    }
    .main_right_title {
        height: 55px;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        padding-left: 20px;
        line-height: 55px;
        font-size: 16px;
        background-color: #e9eaee;
    }
    .main_right_box {
        padding: 20px;
    }
    .main_right_box .layui-tab-brief>.layui-tab-title .layui-this {
        color: var(--main-color) !important;
    }
    .main_right_box .layui-tab-brief>.layui-tab-title .layui-this::after {
        border-color: var(--main-color) !important;
    }
    .main_right_box .layui-tab-item img {
        max-width: 100%;
        display: block;
        margin: 0 auto;
    }
    .main_right_box .layui-timeline-axis {
        color: var(--main-color);
    }
    .main_right_box .layui-timeline-item p {
        font-size: 16px;
        font-weight: bold;
        color: #484848;
    }
    .main_left ul li:nth-child(1) {
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
    }
    .main_left ul li:last-child {}
    .main_left li:nth-last-of-type(1) {
        border-bottom: none !important;
    }
    .main_left ul {
        padding-bottom: 3px;
        background: #fff;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        border-radius: 5px;
    }
}

@media only screen and (max-width: 996px) {
    .main_body {
        padding: 30px 15px;
        margin: 20px auto;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .main_left {
        width: 100%;
    }
    .main_left ul li {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 20px;
        height: 45px;
        cursor: pointer;
        border-bottom: 1px solid #efefef;
        background-color: var(--main-color-white);
    }
    .main_left ul li:hover {
        background-color: var(--main-color);
    }
    .main_left ul li:hover i {
        color: var(--main-color-white);
    }
    .main_left ul li i {
        transition: var(--main-transition);
    }
    .main_left ul li:hover .r_img {
        display: none;
    }
    .main_left ul li:hover .s_img {
        display: block;
    }
    .main_left ul li:hover span {
        color: var(--main-color-white);
    }
    .main_left ul li:last-child {
        border: none;
    }
    .L_nav_left {
        display: flex;
        align-items: center;
    }
    .L_nav_left img {
        width: 25px;
    }
    .L_nav_left span {
        display: block;
        color: #666;
        font-size: 16px;
        margin-left: 10px;
    }
    .s_img {
        display: none;
    }
    .main_left_drop {
        display: none;
    }
    .main_left_drop a {
        display: block;
        height: 40px;
        padding-left: 40px;
        font-size: 14px;
        line-height: 40px;
        color: var(--main-color-666);
        background-color: #e9eaee;
        border-bottom: 1px solid #ccc;
    }
    .main_left_drop a:hover {
        background-color: var(--main-color) !important;
        color: var(--main-color-white) !important;
    }
    .main_left_selected {
        background-color: var(--main-color) !important;
        color: var(--main-color-white) !important;
    }
    .main_left_selected span {
        color: var(--main-color-white) !important;
    }
    .main_left_selected i {
        color: var(--main-color-white);
    }
    .main_left_selected .r_img {
        display: none;
    }
    .main_left_selected .s_img {
        display: block;
    }
    .rroo {
        transform: rotate(180deg);
    }
    .main_right {
        width: 100%;
        background-color: var(--main-color-white);
        border-radius: 5px;
    }
    .main_right_title {
        height: 55px;
        padding-left: 20px;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        line-height: 55px;
        font-size: 16px;
        background-color: #e9eaee;
    }
    .main_right_box {
        padding: 20px;
    }
    .main_right_box .layui-tab-brief>.layui-tab-title .layui-this {
        color: var(--main-color) !important;
    }
    .main_right_box .layui-tab-brief>.layui-tab-title .layui-this::after {
        border-color: var(--main-color) !important;
    }
    .main_right_box .layui-tab-item img {
        max-width: 100%;
        display: block;
        margin: 0 auto;
    }
    .main_right_box .layui-timeline-axis {
        color: var(--main-color);
    }
    .main_right_box .layui-timeline-item p {
        font-size: 16px;
        font-weight: bold;
        color: #484848;
    }
}