.proTopBox { position: relative; margin: 15px 12px; } .proTopBoxpg { position: absolute; overflow: hidden; width: 100%; height: 90px; background: url(../../assets/img/zspg.jpg); background-size: 100% 90px; } .proTopBoxxy { position: absolute; overflow: hidden; width: 100%; height: 90px; background: url(../../assets/img/zsxy.jpg); background-size: 100% 90px; } .proCenterBox { position: absolute; top: 50%; left: 50% ; width: 95%; height: 140px; transform: translate(-50%, 50%); /* margin: 70px 0 15px 10px; */ border-radius: 6px; background: rgba(248, 253, 255, 1); box-shadow: 1px 1px 3px rgb(202, 201, 201); } .proCenterInfo { display: flex; padding-top: 20px; } .proCenterImg { width: 45px; height: 45px; padding-right: 10px; padding-left: 15px; } .proCenterFont { font-family: PingFangSC-Regular, PingFang SC; font-size: 14px; font-weight: 500; line-height: 25px; height: 25px; color: #09a4fa; } .proCenterFlex { display: flex; align-items: center; flex-direction: column; padding-top: 15px; } .proCenterFlexImg { width: 20px; height: 12px; padding-top: 3px; padding-right: 10px; padding-left: 15px; } .proCenterFlexFont { font-family: PingFangSC-Regular, PingFang SC; font-size: 12px; font-weight: 400; line-height: 25px; height: 25px; color: #09a4fa; } .shadow { -webkit-box-shadow: rgb(189, 189, 189) 0 0 3px; -moz-box-shadow: rgb(189, 189, 189) 0 0 3px; box-shadow: rgb(189, 189, 189) 0 0 3px; } .proListBox { height: 127px; margin: 15px 20px; border-radius: 3px; } .proAreaBox { display: flex; align-items: center; justify-content: space-between; padding: 10px; } .proArea { font-family: PingFangSC-Regular; font-size: 16px; font-weight: 500; line-height: 25px; height: 25px; padding: 3px 17px; color: #fff; border-radius: 4px; background: #09a4fa; } .proTitleBox { font-family: PingFangSC-Regular, PingFang SC; font-size: 15px; font-weight: 600; line-height: 20px; overflow: hidden; height: 20px; margin-left: 10px; padding-left: 7px; white-space: nowrap; text-overflow: ellipsis; color: #252525; border-left: 3px solid #09a4fa; } .proDateBox { display: flex; flex-direction: row-reverse; padding-right: 10px; }