@media (max-width:1255px) {
    .widget-message .item::before {
        top: 61%;
        right: 24px;
    }

    .list-title {
        padding: 0 10px;
    }

    .group-list {
        padding: 10px 10px;
    }
}

@media (max-width:1120px) {
    .navbar .logo {
        font-size: 1.5rem;
    }

    .navbar-info {
        float: left;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        align-content: center;
    }

    .navbar-info .user,
    .navbar-info .time {
        margin-top: 4px;
        margin-bottom: 4px;
        font-size: 0.96rem;
    }
}

@media (max-width:970px) {

    .side-menu__close,
    .side-menu__open,
    .site-side,
    .navbar-right {
        display: none;
    }

    #site-main {
        padding-left: 0;
    }
}

@media (max-width:710px) {
    .widget-message .item {
        margin: 0 0 0 20px;
    }

    .widget-message .title {
        font-size: 1.0rem;
        border-bottom: 0;
        padding: 0;
    }

    .widget-message .item2 .sub .sub-title {
        font-size: 0.8rem;
        text-align: center;
    }

    .widget-message .item2 .sub {
        float: left;
        width: 50%;
        padding: 56px 0 0 0;
    }

    .widget-message .item2 .sub .num {
        font-size: 2.5rem;
        line-height: 1;
        margin: 0;
        padding: 4px 0 0 0;
    }

    .widget-message .item2 .device-web::before,
    .widget-message .item2 .device-mobile::before {
        content: "";
        position: absolute;
        width: 46px;
        height: 43px;
        top: 7px;
        left: 50%;
        transform: translate(-50%);
    }

    .widget-message .num {
        margin: 0;
        padding: 64px 0 0 0;
        font-size: 2.5rem;
        text-align: center;
        line-height: normal;
    }

    .widget-message .item1::before,
    .widget-message .item3::before {
        content: "";
        position: absolute;
        width: 45px;
        height: 41px;
        top: 57px;
        left: 50%;
        transform: translate(-50%);
    }

    .widget-message .item {
        padding: 15px 10px;
    }
}

@media (max-width:570px) {

    .widget-message .item1::before,
    .widget-message .item3::before {
        content: "";
        position: absolute;
        width: 45px;
        height: 41px;
        top: 65px;
        left: 50%;
        transform: translate(-50%);
    }

    .widget-message .num {
        margin: 0;
        padding: 45px 0 0 0;
        font-size: 2.5rem;
        text-align: center;
        line-height: normal;
    }
}