@charset "utf-8";
/* CSS Document */

#honor { margin: 0 auto; padding: 60px 0; }
#honor>.title { text-align: center; margin: 0 auto; padding: 50px 0; }
#honor>.title>h3 { font-size: 4rem; font-weight: normal; color: #333; margin: 0 auto; }

#honor>.item { display: block; margin: 0 auto; padding: 50px 0; }
#honor>.item .box-l { width: 25%; text-align: left; }
#honor>.item .box-l>.title { display: block; }
#honor>.item .box-l>.title>i { display: block; padding-bottom: 10px; }
#honor>.item .box-l>.title>i>img { height: 60px; width: auto; opacity: .3; }
#honor>.item .box-l>.title>h3 { font-size: 4rem; font-weight: normal; color: #333; margin: 0 auto; }
#honor>.item .box-l>.more { padding-top: 15px; }
#honor>.item .box-l>.more>a { display: inline-block; padding: 8px 20px; border: 1px solid #ddd; font-size: 1.4rem; color: #999; transition: all .35s; }
#honor>.item .box-l>.more>a>i { margin-left: 10px; float: right; color: rgba(0,175,110,1); font-size: 1.8rem; transition: all .35s; }
#honor>.item .box-l>.more>a:hover { background: rgba(97,86,75,1); padding-right: 30px; border: 1px solid #fff; color: #fff; }
#honor>.item .box-l>.more>a:hover i { color: #fff; transform: translateX(10px); }

#honor>.item .box-r { width: 75% !important; }
#honor>.item .container { width: 100%; }
#honor>.item .container>.list { margin: 0 auto; padding: 10px 0; overflow: hidden; }
#honor>.item .container>.list>ul { display: block; margin: 0 auto; padding: 0; }
#honor>.item .container>.list>ul>li { width: 22.75%; float: left; margin-right: 3%; }
#honor>.item .container>.list>ul>li:nth-child(4n) { margin-right: 0; }
#honor>.item .container>.list>ul>li .img { position: relative; width: 100%; height: 250px; 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>.item .container>.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); content: '\e626'; opacity: 0; transition: all .35s; }
#honor>.item .container>.list>ul>li .img:before { position: absolute; z-index: 2; left: 0; top: 0; width: 100%; height: 100%; background: url("../img/logo.png") no-repeat; background-position: 50% 50%; background-size: 180px auto; opacity: .2; content: ''; }
#honor>.item .container>.list>ul>li .img>img { width: auto; max-width: 80%; max-height: 100%; }
#honor>.item .container>.list>ul>li .tit { font-size: 1.4rem; line-height: 2.4rem; padding: 30px 0; color: #666; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: all .35s; }
#honor>.item .container>.list>ul>li:hover .img:after { opacity: 1; transform: scale(1.1); }
#honor>.item .container>.list>ul>li:hover .tit { color: rgba(0,175,110,1); transform: translateY(-4px); }

#honor>.item .box-r { border-bottom: 1px solid #ddd; }
#honor>.item:last-child .box-r { border-bottom: 0; }

@media only screen and (max-width: 1280px) {
#honor>.item { padding: 30px 0; }
#honor>.item .box-l { width: 100%; float: none; text-align: center; padding-bottom: 20px; }
#honor>.item .box-l>.title>i { display: none; }
#honor>.item .box-l>.title { float: left; }
#honor>.item .box-l>.title>h3 { font-size: 3rem; }
#honor>.item .box-l>.more { float: right; padding-top: 0; }
#honor>.item .box-l>.more>a { padding: 8px 16px; font-size: 1.2rem; }
#honor>.item .box-l>.more>a>i { font-size: 1.6rem; }
#honor>.item .box-r { width: 100% !important; float: none; }
}

@media only screen and (max-width: 1200px) {
}


@media only screen and (max-width: 980px) {
#honor { padding: 20px 0; }
#honor>.title { padding: 10px 0; }
#honor>.title>h3 { font-size: 3.2rem; }

#honor>.item .box-l>.title>h3 { font-size: 3.2rem; }
#honor>.item { padding: 20px 5%; }
#honor>.item .container>.list>ul>li { width: 48%; margin-right: 0; }
#honor>.item .container>.list>ul>li:nth-child(even) { float: right; }
#honor>.item .container>.list>ul>li:nth-child(4n) { margin-right: 2% !important; }
#honor>.item .container>.list>ul>li:nth-child(2n) { margin-right: 0 !important; }
#honor>.item .container>.list>ul>li .tit { padding: 20px 10px; }
}

@media only screen and (max-width: 860px) {
}

@media only screen and (max-width: 640px) {
#honor>.title>h3 { font-size: 2.8rem; }
#honor>.item .box-l>.title>h3 { font-size: 2.8rem; }
}

@media only screen and (max-width: 520px) {
#honor>.title>h3 { font-size: 2.4rem; }
#honor>.item .box-l>.title>h3 { font-size: 2.4rem; }
#honor>.display { padding: 30px 0; }

#honor>.item .container>.list>ul>li .img { height: 110px; line-height: 110px; }
#honor>.item .container>.list>ul>li .tit { padding: 10px; }
}