/* 产品列表 */


.pics ul {
    display: flex;
    flex-wrap: wrap;
}

.pics ul li {
    width: 50%;
    padding: 4px;
}

.pics ul li a {
    display: block;
    position: relative;
}

.pics a {
    display: block;
    position: relative;
}

.pics a i {
    display: block;
    overflow: hidden
}

.pics a i img {
    width: 100%;
}

.pic-li-detail {
    font: 400 12px/20px '微软雅黑';
    color: #5a5a5a;
}

.pic-li-font {
    overflow: hidden;
    margin: 5px 0 0;
}

.pic-li-name {
    font: bold 14px/24px '微软雅黑';
    color: #1a1919;
}

@media (min-width: 1200px) {
    article {
        padding-bottom: 100px;
    }

    .pics {
        padding: 45px;
    }


    .pics ul li {
        width: 33.3%;
        padding: 15px 15px;
    }

    .pics a {
        height: 554px;
        overflow: hidden;
    }

    .pics a i {
        height: 475px;
        overflow: hidden;
        /* transition: 0.3s; */
    }

    .pics a i img {
        /* transition: 0.3s; */
    }

    .pic-li-detail {
        font: 400 14px/24px '微软雅黑';
    }

    .pic-li-font {
        overflow: hidden;
        margin: 24px 0 0;
        padding: 0 100px 0 0;
        background: url(../images/pic_arrow2.png) no-repeat right center;
    }

    .pic-li-name {
        font: bold 16px/30px '微软雅黑';
    }


    .pics a:hover i {
        border: 4px solid #ff0000;
    }

    .pics a:hover .pic-li-font {
        background-image: url(../images/pic_arrow.png);
    }

}


/* 产品详情 */
.pic-er {}

.pic-er-left {
    border: 2px solid #fff;
}

.pic-er-left i {
    display: block;
}

.pic-er-left i img {
    width: 100%;
}

.pic-er-right {
    padding: 10px 0 10px;
    color: #000;
}

.pic-er-info-title {
    width: 120px;
    padding: 0 10px;
    background: #e60012;
}

.pic-er-info-title span {
    display: block;
    font: 400 18px/36px '微软雅黑';
    color: #fff;
    background: url(../images/pic_er_arrow.png) no-repeat right center;
}

.pic-er-font {


    margin: 10px 0 0;
    padding: 15px;
    background: #fff;
}

.pic-er-p {
    font: 400 14px/24px '微软雅黑';
    color: #1a1919;
}

.pic-er-name {
    margin: 0 0 10px;
    font: bold 16px/30px "微软雅黑";
    color: #1a1919;
}

.pic-er-detail-title {
    width: 120px;
    margin: 10px 0 10px;
    padding: 0 10px;
    background: #e60012;
}

.pic-er-detail-title span {
    display: block;
    font: 400 18px/36px '微软雅黑';
    color: #fff;
    background: url(../images/pic_er_arrow.png) no-repeat right center;
}

.pic-er-detail p {
    font: 400 18px/30px '微软雅黑';
    color: #000;
}

.pic-er-detail p img {
    width: 100%;
}

@media (min-width: 1200px) {
    .pic-er {}

    .pic-er-line {
        display: flex;
        justify-content: space-between;

    }

    .pic-er-left {
        width: 535px;
        border: 10px solid #fff;
    }

    .pic-er-right {
        width: 500px;
        background: url(../images/pic_er_circle.png) no-repeat 0 0;
    }

    .pic-er-info-title {
        width: 180px;
        padding: 0 20px;
        background: #e60012;
    }

    .pic-er-info-title span {
        display: block;
        font: 400 24px/44px '微软雅黑';
        color: #fff;
        background: url(../images/pic_er_arrow.png) no-repeat right center;
    }

    .pic-er-font {
        height: 695px;
        overflow: auto;
        margin: 15px 0 0;
        padding: 40px 50px;
        background: #fff;
    }

    .pic-er-p {
        padding: 0 0 0 15px;
        font: 400 16px/36px '微软雅黑';
        color: #fff;
    }

    .pic-er-name {
        margin: 0 0 20px;
        font: bold 18px/30px "微软雅黑";
        color: #1a1919;
    }

    .pic-er-p {

        font: 400 14px/36px '微软雅黑';
        color: #1a1919;
    }



    .pic-er-detail-title {
        width: 180px;
        margin: 75px 0 15px;
        padding: 0 20px;
        background: #e60012;
    }

    .pic-er-detail-title span {
        display: block;
        font: 400 24px/44px '微软雅黑';
        color: #fff;
        background: url(../images/pic_er_arrow.png) no-repeat right center;
    }

    .pic-er-detail p {
        font: 400 16px/30px '微软雅黑';
/*         color: #fff; */
    }

    .pic-er-detail p img {
        width: 100%;
    }
}