.haibao{
    display: flex;
    flex-wrap: wrap;
}
.haibao li{
    width: 225px;
height: 127px;
margin-bottom: 12px;
border-radius: 4px;
position: relative;
overflow: hidden;
}
.haibao li:not(:nth-child(3n)){
 margin-right:12px ;
}
.haibao li img{
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0;
}
.haibao li  .bt{
    width: 100%;
    padding: 12px;
    position: absolute;
    bottom: 0;
    font-weight: bold;
font-size: 18px;
color: #FFFFFF;
    background: linear-gradient( 180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.7) 100%);
}
.commoin_ul{
    display: flex;
}
.commoin_ul li:not(:nth-child(5n)){
    margin-right:21px ;
}
.commoin_ul li img{
    width: 223px;
    height: 126px;
    border-radius: 4px;
    margin-bottom: 16px; 
}
.commoin_ul li {
    width: 223px;
}
.commoin_ul li .t{
height: 48px;
font-weight: bold;
font-size: 18px;
color: #222222;
margin-bottom: 9px;
width: 100%;
}
.commoin_ul li .time{
    font-size: 14px;
color: #A7A7A7;
}
.fa{
    display: flex;
}
.fa .fa_left{
    margin-right:20px ;
}
.fa_ul{
  width: 595px;  
}
.fa_ul li{
    width: 100%;
    margin-bottom:12px ;
    display: flex;
}
.fa_ul li img{
    width: 182px;
height: 103px;
border-radius: 4px;
margin-right: 12px;
}
.fa_ul li .text_li{
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.fa_ul li .text_li .title{
    font-size: 18px;
color: #222222;
line-height: 24px;
}
.fa_ul li .text_li  .time{
    font-size: 14px;
color: #A7A7A7;
}
.fa_img_div{
    display: flex;
    flex-wrap: wrap;

}
.fa_img_div img:not(:nth-child(2n)){
    margin-right: 12px;
}
.fa_img_div img{
    width: 286px;
height: 161px;
border-radius: 4px;
margin-bottom: 12px;
cursor: pointer;
}