.deep {
    display: flex;
}
.deep .right {
    width: 45%;
    background: red;
    background: url(../deep-images/j_y_j_x_c_t_2.png) no-repeat;
    background-size: 100% 34.5625rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}
.deep .right .title {
    margin-top: 3.75rem;
    margin-left: 3.125rem;
}

.right-img {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    width: 100%;
    justify-content: flex-start;
    margin-top: 2.5rem;
}
.first-line {
    display: flex;
    flex-direction: column;
}
.sec-line {
    display: flex;
    flex-direction: column;
}
.blue-item {
    width: 17.8125rem;
    height: 10.3125rem;
    background: url(../deep-images/j_y_j_x_b_j_1.png) no-repeat;
    background-size: 100%;
}
.red-item {
    width: 18.8125rem;
    height: 12.3125rem;
    background: url(../deep-images/j_y_j_x_b_j_2.png) no-repeat;
    background-size: 100%;
}
.yellow-item {
    width: 17.8125rem;
    height: 10.1875rem;
    background: url(../deep-images/j_y_j_x_b_j_3.png) no-repeat;
    background-size: 100%;
}
.last-item {
    width: 14.6875rem;
    height: 15.625rem;
    background: url(../deep-images/j_y_j_x_b_j_4.png) no-repeat;
    background-size: 100%;
}

.right-img .item {
    padding: 1.25rem;
    cursor: pointer;
}

.right-img .item-img {
    height: 3.75rem;
    width: 3.75rem;
}

.right-img .item-text {
    font-size: 1.25rem;
    font-weight: bold;
    color: #FFFFFF;
    margin-top: 1.25rem;
}

.right-img .item-line {
    width: 6.25rem;
    height: 4px;
    background-color: rgba(255,255,255,.6);
    margin-top: 0.5rem;
}

.deep .left {
    width: 55%;height: 640px;object-fit: cover
}

@media screen and (max-width: 1000px){
    .deep {
        display: flex;
        flex-direction: column;
    }
    .deep .left {
        width: 100%;
        height: 12.5rem;
    }
    .deep .right {
        width: 100%;
        padding: 2rem;
        background: url(../deep-images/j_y_j_x_c_t_2.png) no-repeat;
        background-size: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
    }
    .deep .right {

    }
    .deep .right .right-img {
        width: 100%;
        flex-direction: column;
    }
    .deep .right-img .first-line{
        width: 100%;
    }
    .deep .right-img  .sec-line{
        width: 100%;
    }
    .deep .item {
        width: 100%;
        height: 10rem;
    }
    .deep .right .title {
        margin: 0;
        width: 15rem;
    }
}