page { background-color: #fafafa; } .list { padding: 20rpx; } .case-box { background-color: #fff; border-radius: 12rpx; box-shadow: 0 2px 8px 0 rgba(35,24,21,.1); margin-bottom: 20rpx; padding: 20rpx 30rpx; } .top { border-bottom: 1px dashed #ddd; display: flex; justify-content: space-between; padding-bottom: 20rpx; } .case-img { height: 120rpx; overflow: hidden; text-align: center; width: 120rpx; } .case-img image { border-radius: 10rpx; height: 100%; } .case-info { display: inline-flex; width: 510rpx; } .case-text-box { width: 100%; } .case-title { display: flex; justify-content: space-between; } .case-title-text { font-size: 34rpx; font-weight: 700; } .case-text,.case-title-text { color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .case-text { font-size: 28rpx; } .case-status { width: 160rpx; } .status { background-color: #e7f3ff; border-radius: 30rpx; color: #f55054; font-size: 32rpx; margin-bottom: 10rpx; padding: 8rpx 15rpx; text-align: center; } .status2 { background-color: #fff7ec; color: #bb5912; margin-bottom: 0; } .bottom { color: #f55054; line-height: 45rpx; margin-top: 10rpx; } .bottom image { height: 38rpx; margin-top: -5rpx; vertical-align: middle; width: 45rpx; } .btn-box { border-top: 1px dashed #ddd; font-size: 0; padding-top: 15rpx; } .btn { border-radius: 10rpx; color: #fff; display: inline-block; font-size: 32rpx; line-height: 60rpx; margin-right: 2%; text-align: center; width: 32%; } .btn1 { background-color: #f55054; } .btn2 { background-color: #56b6de; } .btn3 { background-color: #d70715; margin-right: 0; }