#bodycontent { width: 1100px !important;}
#bodycon {  padding-bottom: 20px; width: 1400px !important; margin: 0 auto;}
#bodycon #left {width: 300px;height: auto !important;  float: left !important;}
#bodycon #center {  height: auto !important;   width: 1080px;}

.ny_prototal { width:100%; overflow:hidden;}
.ny_prolist { width:31.3%; margin:0 1%; float:left; margin-bottom:2%; overflow:hidden;}
.ny_propic { position:relative; overflow:hidden;}
.ny_propic a {
    height: 256px;
    display:flex;
    align-items: center;
    justify-content: center;
}
.ny_propic a img { width:100%; }
.ny_propic a:before { content:''; width:0%; height:0%; background-color:rgba(0 ,0,0,0.3); position:absolute; z-index:2; top:0; display:block; transition: all 0.3s;}
.ny_propic span { width:60px; height:60px; display: none; position:absolute; z-index:3; left:50%; margin-left:-30px; top:39%; border: solid 1px #fff; border-radius:60px; font-size:14px; color:#fff; line-height:60px; text-align:center; box-sizing:border-box;}
.ny_prolist:hover .ny_propic a:before { width:100%; height:100%;}
.ny_prolist:hover .ny_propic span { display:block;}

.ny_protil { width:100%; background:#f5f5f5; margin-top:0.8%; position:relative; overflow:hidden;}
.ny_protil a { height:45%; padding:3% 4% 4% 5%; font-size:16px; position:relative; z-index:2; display:block;}
.ny_protil span { 
    display:block; 
    width:67px; 
    height:12px; 
    background:url(../images/20200522095054_1768699360.png); margin-top:3%;
}
.ny_prolist:hover .ny_protil span { background-position:0px -12px; transition:all 0.3s;}
.ny_prolist:hover .ny_protil a { color:#fff;}
.ny_protil:before { width:0; height:100%; content:""; display: block; position:absolute; left:0; bottom:0; background:#f5811a; transition: all 0.3s;}
.ny_prolist:hover .ny_protil:before { width:100%;}
.clear{clear:both;}