.pinrow-wrap .spu-content { display: block; overflow: hidden; margin: 20rpx auto; padding: 20rpx 20rpx 30rpx; box-sizing: border-box; position: relative; display: flex; } .pinrow-wrap .spu-img { width: 240rpx; height: 240rpx; border-radius: 10rpx; } .pinrow-wrap .item-top { position: relative; } .pinrow-wrap .spu-content .item-bottom { flex: 1; box-sizing: border-box; margin-left: 20rpx; display: flex; flex-direction: column; justify-content: space-between; } .pinrow-wrap .spu-content .spu-title { color: #333; font-size: 30rpx; height: 32rpx; width: 400rpx; margin-bottom: 12rpx; font-weight: bold; position: relative; } .pinrow-wrap .spu-content .spu-title .span { width: 100%; height: 40rpx; position: absolute; left: 0; top: -4rpx; line-height: 40rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0; } .pinrow-wrap .spu-content .spu-desc { font-size: 26rpx; line-height: 26rpx; color: #999; position: relative; width: 400rpx; height: 26rpx; margin-bottom: 12rpx; } .pinrow-wrap .spu-content .spu-desc .em { width: 100%; height: 32rpx; position: absolute; left: 0; top: -2rpx; line-height: 32rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .pinrow-wrap .spu-content .spu-price { display: flex; align-items: flex-end; font-size: 26rpx; line-height: 26rpx; overflow: hidden; margin-top: 10rpx; } .pinrow-wrap .spu-content .spu-price .sale-price { font-family: 'DIN'; color: #ff758c; margin-right: 12rpx; } .pinrow-wrap .spu-content .spu-price .sale-price .span { font-size: 46rpx; line-height: 42rpx; margin: 0; font-weight: bold; } .pinrow-wrap .spu-content .spu-price .market-price { font-family: DIN; text-decoration: line-through; color: #999; margin-right: 20rpx; } .pinrow-wrap .spu-content .spu-count { margin-top: auto; font-size: 24rpx; color: #999; margin-bottom: 10rpx; } .pinrow-wrap .spu-content .spu-count .pin-tag { display: inline-block; font-size: 22rpx; padding: 0 6rpx; margin-bottom: 10rpx; border: 0.1rpx solid #ff5344; vertical-align: middle; color: #ff5344; border-radius: 4rpx; } .pinrow-wrap .spu-content .add-cart, .pinrow-wrap .spu-content .add-cart-disabled { width: 160rpx; height: 60rpx; padding: 0; margin: 0; position: absolute; right: 20rpx; bottom: 20rpx; display: flex; align-items: center; justify-content: center; background: linear-gradient(90deg, #ff5041 0%, #ff695c 100%); color: #fff; border-radius: 30rpx; font-size: 26rpx; font-weight: bold; } .pinrow-wrap .spu-content .add-cart-disabled { background: #ccc; } .pinrow-wrap .spu-play { position: absolute; left: 120rpx; top: 95rpx; width: 100rpx; height: 100rpx; margin-left: -50rpx; } .pinrow-wrap .spu-play .img { width: 100%; height: 100%; } .pinrow-wrap .mask { background: rgba(255, 255, 255, 0.5); width: 300rpx; height: 240rpx; position: absolute; left: 25rpx; top: 30rpx; } .pinrow-wrap .act-end { position: absolute; height: 60rpx; border-radius: 10rpx; background: rgba(0, 0, 0, 0.5); color: #fff; font-size: 28rpx; text-align: center; line-height: 60rpx; left: 130rpx; top: 120rpx; padding: 0 12rpx; margin-left: -45rpx; } .pin-more { text-align: center; padding-bottom: 20rpx; font-size: 24rpx; display: flex; align-items: center; justify-content: center; }