.boxtopic{font-size:20px; font-family: "microsoft yahei", "微软雅黑", tahoma, arial, helvetica, stheiti}
.boxtopic .box{max-width:1200px; margin:0 auto}
.anmt3,.topiclist a,.topiclist img,.topiclist span,.topiclist em:after{transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease}

.banner{background: #18222e no-repeat center center}
.banner.xf .box{padding-top:100px}
.banner .box{height:500px; position:relative; box-sizing: border-box; padding-top:160px}
.banner .box>b{font-size:2.4em; color:#fff; max-width:686px; display:block}
.banner .box>p{font-size:1em; padding-top:30px; line-height:2em; color:#fff}

.boxtopic .tit{padding:1.8em 0 1em}
.boxtopic .tit b{color:#000; font-weight: normal; font-size:1.2em; line-height:1em; display:inline-block; position: relative; padding:0 1em .8em 0; border-bottom:1px solid #dcdcdc; margin-bottom:.5em}
.boxtopic .tit b:after{content:''; position: absolute; left:0; bottom:-1px; width:2em; height:3px; background-color:#f90}

.topiclist{display: flex; flex-wrap: wrap; margin-bottom:2em}
.topiclist li{float: left; width:32%; margin:0 0 2%; text-align:center}
.topiclist li:nth-child(3n-1){margin:0 2% 2%}
.topiclist li a{display:flex; flex-wrap: wrap; position: relative; background-color:#fff;}
.topiclist li a i{display: block; width:100%; height:220px; overflow:hidden}
.topiclist li a i img{display: block; width:100%; height:100%; object-fit:cover}
.topiclist li a span{width:calc(100% - 48px); line-height:48px; color:#333}
.topiclist li a em{width:48px; height:48px; line-height:48px; text-align: center; display: block;background-color:#f90; color:#fff;}
.topiclist li a em:after{content:'\e65f'; font-family:iconfont_dg; display: block;}
.topiclist li a:hover{box-shadow: rgba(0,0,0,.1) 0 .5em 1em}
.topiclist li a:hover span{color:#f90}
.topiclist li a:hover i img{transform: scale(1.05)}
.topiclist li a:hover em:after{margin-left:10px}