
.about_box {margin-top: 30px;}

.about_box ul li:nth-child(n+2) {margin-top: 5%;}

.about_box .about_item .info_item{width: 49%; color: #666; line-height: 28px; order: 1;}
.about_box .about_item .pic_item{width: 46%; order: 2;}
.about_box .about_item .pic_item .pic{padding-bottom: 65%; border-radius: 20px;}


.about_box .about_item:nth-child(even) .info_item{order: 3;}


.about_content{margin-top: 30px; color: #666; line-height: 28px;}

.con_imgs {width: 100%; margin-top: 30px;}

.con_imgs li {width: 32%; margin-right: 2%;}
.con_imgs li:nth-child(3n){margin-right: 0;}
.con_imgs li .pic{padding-bottom: 65%; border-radius: 12px;}
.con_imgs li .pic img{height: 100% !important;}

@media (max-width: 980px) {
    .about_box{margin-top: 15px;}
    .about_box ul li:nth-child(n+2){margin-top: 24px;}
    .about_box .about_item{flex-direction: column;}
    .about_box .about_item .info_item{width: 100%; order: 3; margin-top: 15px;}
    .about_box .about_item .pic_item{width: 100%;}

    .about_content{margin-top: 24px;}
    .con_imgs{margin-top: 20px; flex-direction: column;}
    .con_imgs li{width: 100%; margin-right: 0;}
    .con_imgs li:nth-child(n+2){margin-top: 16px;}
}

.about_honor {
    background: #111111;
    padding: 55px 0;
    margin-top: 5%;
}

.about_honor ul {
    justify-content: space-between;
}

.about_honor ul li {
    width: 22.5%;
    flex-direction: column;
    align-items: center;
    justify-content: unset;
    position: relative; padding-bottom: 15px;
}
.about_honor ul li::before{
    position: absolute; content: ''; bottom: 0; height: 2px; left: 50%; width: 0; background: #fff; transition: all 0.5s ease;
}

.about_honor ul li .honor_icon {
    width: 100%;
    height: 120px;
    position: relative;
    overflow: hidden;
}

.about_honor ul li .honor_icon img {
    display: block; margin: 0 auto; width: auto; height: 100%;
}

.about_honor ul li .honor_title {
    font-weight: 400;
    font-size: 18px;
    color: #FFFFFF;
    line-height: 1.5;
    height: 3em;
    text-align: center;
    font-style: normal;
    text-transform: uppercase;
    margin-top: 15px;
}

.about_honor ul li .honor_info {
    font-weight: 400;
    font-size: 16px;
    color: #FFFFFF;
    line-height: 28px;
    text-align: center;
    font-style: normal;
    text-transform: capitalize;
    margin-top: 10px;
}

.about_honor ul li:hover::before{
    width: 100px; margin-left: -50px;
}
.about_honor ul li:hover .honor_icon img{animation: swing 0.5s;}

@media (max-width: 1450px) {
    .about_honor ul li .honor_icon{height: 110px;}
}
@media (max-width: 1300px) {
    .about_honor ul li .honor_icon{height: 90px;}
    .about_honor ul li .honor_info{margin-top: 14px;}
}
@media (max-width:1100px) {
    .about_honor ul{flex-wrap: wrap;}
    .about_honor ul li{width: 48%;}
    .about_honor ul li:nth-child(n+3){margin-top: 24px;}
    .about_honor ul li .honor_title{height: auto;}
}
@media (max-width:980px) {
    .about_honor{margin: 30px 0 0; padding: 30px 0;}
    .about_honor ul li{width: 100%; padding-bottom: 0;}
    .about_honor ul li::before{height: 0;}
    .about_honor ul li .honor_icon{height: 76px;}
    .about_honor ul li:nth-child(n+2){margin-top: 20px;}
    .about_honor ul li .honor_info{margin-top: 10px;}
}


/* about_comment */
.about_comment {
    margin-top: 5%; margin-bottom: 5%;
}
.about_comment .web_th{
    text-transform: uppercase;
}


.comment_ul{margin-top: 3%;}
.comment_ul li{ width: 49%; height: auto;}

.comment_ul li:nth-child(n+3){margin-top: 30px;}


.comment_wrap{position: relative; padding-bottom: 34px; flex: 1;}
.comment_wrap::before{position: absolute; left: 12%; bottom: 0;  border-bottom: 0; border-top: 34px solid #fff; border-left: 34px solid transparent; border-right: 34px solid transparent; content: ''; transition: all 0.5s ease;}
.comment_wrap .comment_div{background: #fff; border-radius: 30px; padding: 10px 40px 90px; height: 100%; position: relative; transition: all 0.5s ease;}
.comment_wrap .comment_div::before,
.comment_wrap .comment_div::after{display: block; width: 110px; height: 110px; background-repeat: no-repeat; background-position: center; background-size: 100% auto; content: ''; transition: all 0.5s ease;}
.comment_wrap .comment_div::before{background-image: url(../img/fh-1.png); margin-bottom: -20px;}
.comment_wrap .comment_div::after{background-image: url(../img/fh-2.png); position: absolute; right: 40px; bottom: 10px;}
.comment_wrap .comment_div .title{ font-family: 'Times-Bold';
    font-weight: bold; font-size: 48px; line-height: 1.5;}
.comment_wrap .comment_div .brief{color: #666; line-height: 28px; margin-top: 10px;}

.about_comment ul li .comment_avatar{
    height: 118px; width: 118px;
    margin-left: 8%;
    margin-top: 2%;
}
.about_comment ul li .comment_avatar img{display: block; border-radius: 50%; width: 100%; height: 100%;}
.about_comment ul li:hover .comment_div{background: rgba(var(--comColorRgb), 0.12);}
.about_comment ul li:hover .comment_wrap::before{border-top-color: rgba(var(--comColorRgb), 0.12);}
.about_comment ul li:hover .comment_wrap .comment_div::before{background-image: url(../img/fh-1_h.png)}
.about_comment ul li:hover .comment_wrap .comment_div::after{background-image: url(../img/fh-2_h.png)}
.about_comment ul li:hover .comment_avatar{animation: swing 0.5s;}

@media (max-width: 1550px) {
    .comment_wrap .comment_div .title{font-size: 44px;}
}
@media (max-width: 1450px) {
    .comment_wrap .comment_div .title{font-size: 42px;}
}
@media (max-width: 1300px) {
    .comment_wrap .comment_div .title{font-size: 38px;}
    .comment_wrap .comment_div::before,
    .comment_wrap .comment_div::after{width: 90px; height: 90px;}
    .comment_wrap .comment_div{padding: 10px 30px 80px; border-radius: 24px;}
    .about_comment ul li .comment_avatar{width: 100px; height: 100px;}
    .comment_wrap{padding-bottom: 28px;}
    .comment_wrap::before{border-top-width: 28px; border-left-width: 28px; border-right-width: 28px;}
}
@media (max-width: 1200px) {
    .comment_wrap .comment_div .title{font-size: 34px;}
}
@media (max-width:980px) {
    .about_comment{margin-top: 30px; margin-bottom: 0;}
    .comment_wrap .comment_div .title{font-size: 24px;}
    .comment_ul{flex-direction: column;}
    .comment_ul li{width: 100%;}
    .comment_ul li:nth-child(n+2){margin-top: 24px !important;}
    .comment_wrap .comment_div{padding: 0px 18px 56px; border-radius: 20px;}
    .comment_wrap .comment_div::before,
    .comment_wrap .comment_div::after{width: 70px; height: 70px; right: 20px;}
    .comment_wrap .comment_div::before{margin-bottom: -10px;}
    .comment_wrap .comment_div::after{bottom: 2px;}
    .comment_wrap{padding-bottom: 22px;}
    .comment_wrap::before{border-top-width: 22px; border-left-width: 22px; border-right-width: 22px; left: 50px;}
    .about_comment ul li .comment_avatar{width: 80px; height: 80px; left: 20px;}
}