.list{display:flex}
.article{padding:20px 0 30px;display:flex;flex-wrap:wrap;}
.article .left{width:328px;flex-shrink:0;height:200px;position:relative}
.article .left .warp{height:200px;overflow:hidden;width:100%;padding:10px;border:1px solid transparent}
.article .left:hover .warp{border:1px solid #445295;height:auto;position:absolute;z-index:1;background:#fff}
.article .right{display:inline-block;width:658px;padding-left:10px;flex-shrink:0}
.article .right>.warp{display:inline-block;width:213px}
.article .tap{display:inline-block;width:auto;padding:0 20px;height:24px;border-radius:6px;background:#445295;color:#fff;text-align:center;margin-bottom:10px;line-height:24px}
.article ul{padding-bottom:10px}
.article .left .grapic{display:flex}
.article .left .grapic>a{margin-right:5px}
.article .left .grapic>div{display:flex;flex-direction:column}
.article .left .grapic img{width:120px;height:82px;display:inline-block}
.article .left .grapic>div>a{color:#7a59c2;font-weight:700;margin-bottom:6px}
.article .left .grapic>div>span{color:#999;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:30px;width:190px;height:60px}
.article .left .up li,.article .right>.warp li{width:47%;display:inline-block;overflow:hidden;color:#666;font-size:14px;white-space:nowrap;padding-left:10px;position:relative;line-height:30px}
.article .right>.warp li{width:100%;line-height:32px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;float:left}
.article .left .up li::before,.article .right>.warp li::before{content:'';width:4px;height:4px;border-radius:50%;background:#62addb;position:absolute;top:50%;left:2px;transform:translateY(-50%)}
.article .left .down li{line-height:30px;color:#666;display:flex;align-items:center}
.article .left .down li i{width:32px;display:inline-block;height:32px;background:#d1d1d1;border-radius:50%;line-height:32px;text-align:center;color:#fff;font-size:24px;transform:scale(.5);flex-shrink:0}
.article .left .down li:nth-of-type(1) i{background:#c083ec}
.article .left .down li:nth-of-type(2) i{background:#e878a5}
.article .left .down li:nth-of-type(3) i{background:#71b5de}
.article .left .down li a{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:80%}
.article li a:hover{color:#2c74ab;text-decoration:underline}