.news{padding:50px 0; background-color:#f8f8f8; background-image:url('');}
.news-title{padding-bottom:28px;}
.news-title>b{display:block; font-size:38px; line-height:1; color:#989898;}
.news-title>b>u{position:relative; text-decoration:none; padding-right:8px; color:#f20f0f;}
.news-title>b>i{font-style:normal; display:inline-block; position:relative;}
.news-title>b>u:before{position:absolute; left:100%; top:50%; width:48px; height:8px; content:''; opacity:0.2; background:#f20f0f;}
.news-title>p{font-size:38px; line-height:1; margin:12px 0 0;}
.news-title>p>b{display:inline-block; padding-right:4px;}
.news-content{display:block; margin:0 -8px;}
.news-content:after{display:block; content:''; clear:both;}
.news-item{float:left; width:33.333%; padding:8px;}
.news-item>a>ins{float:right; background:#f8f8f8; text-align:center; margin-left:18px; transition:.4s;}
.news-item>a>ins>i{font-style:normal; display:block; font-size:28px;}
.news-item>a>ins>u{text-decoration:none; display:block; padding:2px 8px; font-size:14px; background:rgba(0,0,0,0.06);}
.news-item:first-child>a>ins{position:absolute; top:18px; left:0;}
.news-item:first-child>a>ins,
.news-item>a:hover>ins{color:#fff; background:#f20f0f;}
.news-item>a>img{display:block; width:100%; height:328px; object-fit:cover;}
.news-item>a>h2{position:absolute; left:18px; bottom:18px; right:18px; padding:28px 18px; background:#fff;}
.news-item>a{display:block; background:#fff; position:relative; padding:28px; overflow:hidden;}
.news-item:first-child>a{padding:0;}
.news-item>a>h3{display:block; height:24px; margin-bottom:18px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.news-item>a>p{display:block; height:21px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#686868;}
.news-item>a>u{display:inline-block; height:21px; margin-top:16px; color:#f20f0f;}
.news-item>a>u>b{transition:.2s; font-weight:normal; font-size:14px; display:inline-block; color:#181818; padding-right:6px;}
.news-item>a>u>i{transition:.2s; font-size:18px; display:inline-block; vertical-align:middle;}
.news-item>a:hover{transform:translateY(-2px); box-shadow:0 2px 8px rgba(0,0,0,0.18);}
.news-item>a:hover>u>b{transform:translateX(4px); color:#f20f0f;}
.news-item>a:hover>u>i{transform:translateX(8px);}
.news-more{text-align:center; font-size:0; margin-top:18px;}
.news-more>a{display:inline-block; overflow:hidden; position:relative; background:#fff; border-radius:3px; padding:12px 38px;}
.news-more>a:after{position:absolute; z-index:1; left:100%; top:100%; content:''; width:0; height:0; border-radius:50%; transition:0.6s; transform:translate(-50%,-50%); background:#f20f0f;}
.news-more>a>u{position:relative; z-index:2; display:inline-block; text-decoration:none; font-size:16px;}
.news-more>a>i{position:relative; z-index:2; font-size:18px; transition:0.3s; margin-left:8px;}
.news-more>a:hover{color:#fff; box-shadow:0 2px 8px rgba(0,0,0,0.18);}
.news-more>a:hover:after{width:500px; height:500px;}
.news-more>a:hover>i{color:#fff; transform:translateX(8px);}
@media(max-width:1200px){
.news{padding:30px 0;}
.news-item{width:50%;}
.news-item:last-child{display:none;}
}
@media(max-width:767px){
.news{padding:18px 0;}
.news-content{margin:0;}
.news-title{padding-bottom:16px;}
.news-title>b{font-size:28px;}
.news-title>b>u{padding-right:4px;}
.news-title>b>u:before{width:38px; height:6px;}
.news-title>p{font-size:28px; margin:8px 0 0;}
.news-title>p>b{padding-right:2px;}
.news-item{width:100%; padding:4px;}
.news-item:last-child{display:block;}
.news-item>a{padding:12px;}
.news-item>a>img{height:228px;}
.news-item>a>h2{left:8px; bottom:8px; right:8px; padding:12px 8px; font-size:16px;}
.news-item>a>ins{margin-left:8px;}
.news-item>a>ins>u{font-size:12px; padding:2px 6px;}
.news-item:first-child>a>ins{top:8px; margin-left:8px;}
.news-more{margin-top:8px;}
.news-more>a{padding:8px 28px;}
.news-more>a>u{font-size:14px;}
.news-more>a>i{font-size:16px; margin-left:6px;}
.news-more>a:hover:after{width:400px; height:400px;} 
.news-more>a:hover>i{transform:translateX(4px);}
}