.list{ display: flex; flex-wrap: wrap; padding: 40rpx 40rpx 200rpx; .item{ width: 210rpx; height: 210rpx; border-radius: 8rpx; overflow: hidden; position: relative; margin-right: 20rpx; margin-bottom: 20rpx; &:nth-of-type(3n){ margin-right: 0; } .img{ width: 100%; height: 100%; } .shade{ position: absolute; z-index: 99; width: 100%; height: 100%; left: 0; top: 0; background-color: rgba(0,0,0,.5); font-size: 30rpx; color: #FFFFFF; display: flex; justify-content: center; align-items: center; } .check{ width: 40rpx; height: 40rpx; position: absolute; top: 12rpx; left: 12rpx; } } } .footer { position: fixed; z-index: 99; bottom: 0; left: 0; width: 750rpx; background-color: #fff; box-shadow: 0rpx -1rpx 0rpx 0rpx #EEEEEE; font-weight: 400; .footer_wrap{ display: flex; align-items: center; justify-content: space-between; height: 100rpx; padding: 0 40rpx; } .check_wrap{ display: flex; align-items: center; .check{ width: 40rpx; height: 40rpx; margin-right: 18rpx; } } .down_btn{ width: 480rpx; text-align: center; height: 72rpx; line-height: 70rpx; background: #B08771; border-radius: 8rpx; color: #fff; } } .param_modal{ padding: 30rpx 40rpx 12rpx; .title{ text-align: center; font-size: 30rpx; } .line{ height: 150rpx; display: flex; justify-content: space-between; align-items: center; border-bottom: 1rpx solid #E5E5E5; .check{ width: 40rpx; height: 40rpx; } .name{ font-size: 30rpx; color: #111111; } .desc{ font-size: 26rpx; color: #777777; margin-top: 20rpx; } } .submit{ margin-top: 100rpx; width: 100%; height: 88rpx; background: #B08771; border-radius: 8rpx; display: flex; justify-content: center; align-items: center; font-weight: 500; font-size: 32rpx; color: #FFFFFF; } }