.work { margin-bottom: 20rpx; background-color: white; .workHead { display: flex; justify-content: space-between; align-items: center; padding: 20rpx; .wH-left { display: flex; justify-content: space-between; align-items: center; .avatar { width: 80rpx; height: 80rpx; border-radius: 50%; overflow: hidden; } .wH-left-user { margin-left: 18rpx; .nickname { max-width: 320rpx; font-size: 30rpx; font-weight: bold; color: #000; } .time { margin-top: 4rpx; font-size: 26rpx; color: rgba(0, 0, 0, 0.6); } } } .wH-right { display: flex; align-items: center; .wH-right-btn { text-align: center; margin-right: 30rpx; .img { width: 27rpx; height: 32rpx; } .text { font-size: 26rpx; color: rgba(0, 0, 0, 0.74); } } } } .workContent { font-size: 0px; .videoBox { position: relative; width: 100%; height: 422rpx; .maskBg { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); } .maskImg { z-index: 10; width: 215rpx; height: 215rpx; position: absolute; top: 0px; right: 0px; left: 0px; bottom: 0px; margin: auto; } .play { position: absolute; left: 50%; top: 40%; width: 90rpx; height: 90rpx; transform: translate(-50%); } .cover { width: 100%; height: 100%; } } .video { width: 100%; height: 422rpx; } } .workFooter { .mange { margin-top: 15rpx; display: flex; justify-content: space-between; align-items: center; padding: 14rpx 20rpx 30rpx; .mangeL { display: flex; align-items: center; .mangeL-box { display: flex; align-items: center; margin-right: 30rpx; .icon { width: 44rpx; height: 44rpx; } .icon-name { margin-left: 10rpx; font-size: 28rpx; } } } } } }