page{ height: auto; overflow: auto; background: #FF6F03; background-image: url('https://s3.cn-northwest-1.amazonaws.com.cn/iformall-net/cimg/bargindetailbg.jpg'); background-size: cover; background-repeat: no-repeat; } .bargainDetail { padding: 0 33rpx 0; } .listitem .fl { width: 180rpx; height: 180rpx; border-radius:10rpx; } .listitem .icon { width: 140rpx; height: 116rpx; position: absolute; top: 12rpx; right: 0; } .title{ display: block; font-size: 30rpx; color: #333; height: 40rpx; line-height: 40rpx; padding-top: 20rpx; } .help{ display: block; text-align: center; font-size: 28rpx; height: 40rpx; line-height: 40rpx; margin-top: 47rpx; } .help text{ color: red; } .listitem .ri { margin-left: 26rpx; width: 305rpx; } .ri text { display: block; text-align: left; } .ri .txt01 { width: 100%; color: rgba(51, 51, 51, 1); line-height: 44rpx; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .ri .txt02 { width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-size: 24rpx; color: rgba(140, 140, 140, 1); } .ri .txt03 { width: 100%; font-size: 24rpx; text-decoration: line-through; color: rgba(140, 140, 140, 1); } .ri .txt04 { width: 100%; font-size: 24rpx; color: rgba(255, 50, 50, 1); line-height: 44rpx; } .money { display: inline-block !important; font-size: 50rpx; font-weight: 500; color: rgba(255, 50, 50, 1); } .listitem { position: relative; padding: 31rpx 20rpx; border-radius: 15rpx; background: #fff; margin-bottom: 30rpx; margin-top:20rpx; } .progress { width: 519rpx; padding: 30rpx 84rpx; /* height: 136rpx; */ background: #fff; border-radius: 15rpx; margin: 0 auto; } .progesstext { margin-bottom: 13rpx; } .progesstext>text { font-size: 24rpx; color: rgba(51, 51, 51, 1); } .progesstext text text { color: #FF3535; } .time { margin-top: 20rpx; font-size: 24rpx; color: #333; text-align:center; } .time text { font-size: 30rpx; color: #fff; display: inline-block; width: 40rpx; text-align: center; height: 40rpx; line-height: 40rpx; background: rgba(51, 51, 51, 1); border-radius: 10rpx; margin: 0 4px; } .head{ width:10%; height: 90rpx; position: relative; } .head image{ width: 70rpx; border-radius:10rpx; } .head text{ width: 70rpx; position: absolute; bottom: 0; left: 0; right: 0; font-size: 20rpx; background: #ED3F2E; color: #fff; text-align: center; border-radius: 20rpx; } .text{ width: 87%; padding-left: 3%; display: inline-block; height: 90rpx; line-height: 90rpx; font-size: 26rpx; } .text01{ width: 100rpx; margin-right: 6rpx; height: 76rpx; line-height: 76rpx; } .text01 text{ width: 100rpx; float: left; height: 90rpx; line-height: 90rpx; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .text02{ display: inline-block; } .text03{ width: 240rpx; text-align: right; font-size:24rpx; height: 76rpx; line-height: 76rpx; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .person{ border-bottom: 1px solid #F0CDB3; padding-bottom: 31rpx; padding-top: 31rpx; } .text02 text:nth-of-type(2){ color: #FF3535; text-align: left; } .people{ border-radius:16rpx; background: #FFEADA; margin-top: 30rpx; padding:0 20rpx; margin-bottom: 165rpx; } .btns{ padding:33rpx; position: fixed; left: 0; right: 0; bottom: 0; z-index: 100; /* background: #fff; */ } .btns button{ width: 320rpx!important; height: 95rpx; border-radius:48rpx; text-align: center; } .btns .fl{ color: #fff; background:#FFAF02; box-shadow:0px 8px 8px 1px rgba(255,169,2,0.32); } .goback{ position: fixed; right: 50rpx; top: 60rpx; width:100rpx!important; height:100rpx; z-index: 100; background:rgba(255,255,255,1); line-height: 95rpx; border:1rpx solid rgba(227,227,227,1); border-radius:50%; } .goback image{ position: absolute; width: 60rpx; left: 0; right: 0; top: 0; bottom: 0; margin: auto; } .btns .fl text{ display: block; font-size: 30rpx; line-height: 34rpx; } .btns .fl text:nth-of-type(1){ margin-top: 12rpx; } .btns .fr{ font-size: 30rpx; color: #fff; line-height: 95rpx; width: 256rpx; background:linear-gradient(90deg,rgba(229,54,40,1) 0%,rgba(243,75,30,1) 99%); box-shadow:0px 8px 8px 1px rgba(204,26,13,0.32); } .helpDiscount{ display: block; width: 200rpx; height: 200rpx; border-radius:50%; font-size: 26rpx; text-align: center; line-height: 200rpx; margin: 30rpx auto 0; color: #fff!important; } .helpDiscount image{ display: block; width: 200rpx; height: 200rpx; } .helpDiscount::after{ border: none; } .success{ margin-top: 50rpx; } .success image{ display: block; width: 74rpx; height: 74rpx; margin: 0 auto; } .success text{ display: block; text-align: center; font-size:30rpx; line-height: 30rpx; color:rgba(51,51,51,1); } .btns01{ position: fixed; left: 0; right: 0; bottom: 0; padding: 30rpx 0; } .btns01 button{ color:rgba(254,254,254,1); width:650rpx; height:85rpx; line-height: 85rpx; background:linear-gradient(90deg,rgba(236,59,45,1) 0%,rgba(248,98,52,1) 100%); box-shadow:0px 8px 8px 1px rgba(246,93,51,0.32); border-radius:43rpx; } .fail{ height:166rpx; background:rgba(226,226,226,1); border-radius:10rpx; font-size:30rpx; text-align: center; line-height: 166rpx; color:rgba(51,51,51,1); margin: 20rpx auto 0; } .status{ width: 520rpx; margin: 40rpx auto 0; } .status button{ display: block; width: 520rpx; height: 95rpx; line-height: 95rpx; text-align: center; border: none; } button::after{ border: none; } .status button:nth-of-type(1){ background:linear-gradient(90deg,rgba(236,59,45,1) 0%,rgba(248,98,52,1) 100%); border:1px solid rgba(236,59,45,1); border-radius:48rpx; margin-bottom: 38rpx; color: #fff; } .status button:nth-of-type(2){ background:#fff; border:1px solid rgba(190,190,190,1); border-radius:48rpx; color: #333; }