.equipmentDtl { background-color: #f0f0f0; min-height: 100vh; margin-top: 128rpx; } .equipmentDtl .rate-warp { margin-top: 20rpx; } .equipmentDtl .rate-warp .sm-rate { display: flex; justify-content: space-between; flex-wrap: wrap; padding: 0 24rpx; } .equipmentDtl .rate-warp .sm-rate ._li { background-color: #fff; border-radius: 10rpx; height: 120rpx; display: flex; justify-content: space-between; margin-top: 24rpx; align-items: center; padding: 0 24rpx; width: 296rpx; font-size: 28rpx; color: #666; } .equipmentDtl .rate-warp .sm-rate ._li .right-box { font-size: 32rpx; color: #333; } .equipmentDtl .rate-warp .sm-rate ._li .right-box .line { width: 70rpx; height: 8rpx; background: #eeeeee; border-radius: 4rpx; margin-top: 6rpx; } .equipmentDtl .rate-warp .sm-rate ._li .right-box .line .box { width: 50%; background-color: #BB99F6; height: 100%; border-radius: 12rpx; } .equipmentDtl .rate-warp .big-rate ._li { margin-top: 24rpx; height: 128rpx; display: flex; align-items: center; background-color: #fff; margin: 0 24rpx; border-radius: 10rpx; padding: 0 24rpx; } .equipmentDtl .rate-warp .big-rate ._li .text { font-weight: 500; font-size: 28rpx; color: #333; } .equipmentDtl .rate-warp .big-rate ._li .line { width: 240rpx; margin-left: 90rpx; height: 24rpx; background: #eeeeee; margin-right: 40rpx; border-radius: 12rpx; } .equipmentDtl .rate-warp .big-rate ._li .line .box { width: 50%; background-color: #ffaf53; height: 100%; border-radius: 12rpx; } .equipmentDtl .parts-list { padding: 0 24rpx; margin-top: 24rpx; } .equipmentDtl .parts-list ._ul { display: flex; justify-content: space-between; } .equipmentDtl .parts-list ._li { width: 32%; padding: 30rpx 0; text-align: center; position: relative; background-color: #fff; } .equipmentDtl .parts-list ._li image { width: 60rpx; height: 60rpx; display: block; margin: 0 auto 20rpx; } .equipmentDtl .parts-list .before { width: 30rpx; height: 30rpx; border-radius: 50%; background-color: rgba(204, 204, 204, 0.2); display: block; position: absolute; right: 16rpx; top: 16rpx; } .equipmentDtl .parts-list .before::before { position: absolute; display: block; top: 7rpx; left: 7rpx; width: 19rpx; height: 19rpx; border-radius: 50%; content: " "; background: #cccccc; } .equipmentDtl .parts-list .before.succes { background-color: rgba(63, 191, 49, 0.2); } .equipmentDtl .parts-list .before.succes::before { background: #3FBF31; } .equipmentDtl .echarts { background: #fff; margin: 24rpx 24rpx 0; } .equipmentDtl .echarts .content .text { font-size: 28rpx; font-weight: 700; color: #333; text-align: center; margin-bottom: 40rpx; } .equipmentDtl .echarts .title { font-size: 28rpx; height: 90rpx; line-height: 90rpx; display: flex; padding: 0 24rpx; font-weight: 500; } .equipmentDtl .echarts .title image { width: 40rpx; height: 40rpx; margin-top: 25rpx; margin-right: 16rpx; } .equipmentDtl .equ-img { padding: 24rpx; background-color: #ffffff; position: relative; } .equipmentDtl .equ-img image { width: 100%; height: 395rpx; } .equipmentDtl .equ-img .err-modal { position: absolute; left: 0; right: 0; bottom: 0; top: 0; background: rgba(0, 0, 0, 0.6); text-align: center; display: flex; align-items: center; } .equipmentDtl .equ-img .err-modal image { width: 160rpx; height: 160rpx; margin: 0 auto; } .equipmentDtl .state { display: flex; justify-content: space-between; margin: 24rpx 24rpx 0; } .equipmentDtl .state .state-box { padding: 20rpx; width: 48%; background-color: #fff; display: flex; box-sizing: border-box; border-radius: 10rpx; } .equipmentDtl .state .state-box .text { padding: 12rpx 0; } .equipmentDtl .state .state-box .state-text { font-size: 32rpx; font-weight: bold; margin-top: 5rpx; } .equipmentDtl .state .state-box .label { font-weight: 400; font-size: 28rpx; } .equipmentDtl .state .state-box image { width: 110rpx; height: 110rpx; }