/* CSS Document */

#honor { margin-top: 100px; }
#honor .list { margin: 0 auto; padding: 0px 0; overflow: hidden; }
#honor .list>ul { display: block; margin: 0 auto; padding: 0; }
#honor .list>ul>li { width: 22.75%; float: left; margin-right: 3%; }
#honor .list>ul>li:nth-child(4n) { margin-right: 0; }
#honor .list>ul>li .img { position: relative; width: 100%; height: 250px; box-sizing: border-box; background: #fff; overflow: hidden; border: 1px solid #ddd; padding: 10px 0; text-align: center; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; overflow: hidden; line-height: 230px; }
#honor .list>ul>li .img:after { position: absolute; z-index: 8; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,91,97,.3); font-family: iconfont; font-size: 4.6rem; color: rgba(255,255,255,1); font-family: 'iconfont_kf'; content: '\e648'; opacity: 0; transition: all .35s; }
#honor .list>ul>li .img:before { position: absolute; z-index: 2; left: 0; top: 0; width: 100%; height: 100%; background: url("../images/logo.png") no-repeat; background-position: 50% 50%; background-size: 180px auto; opacity: .2; content: ''; }
#honor .list>ul>li .img>img { width: auto; max-width: 80%; max-height: 100%; }
#honor .list>ul>li .tit { font-size: 1.6rem; line-height: 2.4rem; padding: 30px 0; color: #666; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: all .35s; }
#honor .list>ul>li:hover .img:after { opacity: 1; transform: scale(1.1); }
#honor .list>ul>li:hover .tit { color: rgba(0,169,157,1); transform: translateY(-4px); }

@media only screen and (max-width:991.98px) {
#honor .list>ul>li { width: 48%; margin-right: 0; }
#honor .list>ul>li:nth-child(even) { float: right; }
#honor .list>ul>li:nth-child(4n) { margin-right: 2% !important; }
#honor .list>ul>li:nth-child(2n) { margin-right: 0 !important; }
#honor .list>ul>li .tit { padding: 20px 10px; }
}

@media only screen and (max-width:575.98px) {
#honor .list>ul>li .img { height: 110px; line-height: 110px; }
#honor .list>ul>li .tit { padding: 10px; }
}