/* pages/buy/buy.wxss */ .buy-container { width: 100%; height: 100%; background-color: #F7F7F7; } .header { width: 100%; height: 120rpx; background-color: #fff; display: flex; justify-content: space-between; align-items: center; } .info { display: flex; justify-content: flex-start; align-items: center; } .img { width: 80rpx; height: 80rpx; border-radius: 50%; margin: 0 20rpx 0 30rpx; } .headimg { width: 100%; height: 100%; border-radius: 50%; } .name { font-size: 30rpx; font-weight: bold; color: #333333; } .span { padding-right: 30rpx; } .count { font-size: 48rpx; font-weight: bold; color: #333333; } .unit { font-size: 26rpx; font-weight: 400; color: #333333; padding-left: 12rpx; } .title { width: 100%; height: 114rpx; text-indent: 30rpx; line-height: 114rpx; font-size: 30rpx; font-weight: bold; color: #333333; } .chose-pay-type { width: 100%; min-height: 302rpx; } .pay-type { width: 690rpx; margin: 0 auto; min-height: 302rpx; display: flex; justify-content: center; flex-wrap: wrap; } .pay-item { width: 280rpx; height: 302rpx; background: #FFFFFF; border-radius: 20rpx; border: 2rpx solid #DDDDDD; position: relative; margin-left: 40rpx; margin-top: 20rpx; } .pay-item-active { border: 2rpx solid #45A6B5; } .pay-item-nomargin { margin-left: 0; } .p-title { margin-top: 40rpx; font-size: 30rpx; font-weight: bold; color: #333333; text-align: center; } .p-title-flex { margin-top: 40rpx; display: flex; justify-content: center; align-items: center; } .sub-title { font-size: 30rpx; font-weight: bold; color: #333333; margin-left: 5rpx; } .light-text { width: 36rpx; height: 36rpx; background: #45A6B5; border-radius: 4rpx; font-size: 26rpx; font-weight: 400; color: #FFFFFF; margin-right: 5rpx; } .p-prise { margin-top: 40rpx; text-align: center; } .saleprice { font-size: 20rpx; font-weight: 400; color: #333333; margin-right: 5rpx; } .onceprice { width: 100%; height: 40rpx; font-size: 20rpx; font-weight: 400; color: #999999; position: relative; } .oncepricetext { display: inline-block; width: 150rpx; height: 40rpx; line-height: 40rpx; margin-left: 70rpx; } .line { position: absolute; width: 150rpx; height: 1rpx; background-color: #999; top: 20rpx; left: 60rpx; } .p-tag { font-size: 26rpx; font-weight: bold; color: #333333; } .p-num { font-size: 60rpx; font-weight: bold; color: #333333; } .tips { font-size: 26rpx; font-weight: 400; color: #45A6B5; text-align: center; margin-top: 20rpx; } .mark { width: 40rpx; height: 40rpx; background: #45A6B5; border-radius: 0px 17rpx 0px 4rpx; position: absolute; top: 0; right: 0; } .discount { width: 50rpx; height: 30rpx; background: #45A6B5; border-radius: 10rpx 0px 2rpx 0px; position: absolute; top: 0; left: 0; font-size: 16rpx; color: #FFFFFF; } .wxpay { width: 690rpx; height: 104rpx; margin: 48rpx auto 0; background: #FFFFFF; border-radius: 20rpx; display: flex; justify-content: space-between; align-items: center; } .wxpaypng { width: 64rpx; height: 64rpx; margin-left: 30rpx; margin-right: 18rpx; } .check-icnon { width: 40rpx; height: 40rpx; border-radius: 50%; background: var(--maincolor); margin-right: 32rpx; } .pay-btn { width: 690rpx; height: 80rpx; margin: 0 auto; background: var(--maincolor); border-radius: 10rpx; font-size: 30rpx; font-weight: 400; color: #FFFFFF; margin-top: 160rpx; } .s-tips { font-size: 26rpx; font-weight: 400; color: #333333; text-align: center; margin-top: 20rpx; } .wrapper { height: 100%; } .model { width: 540rpx; height: 208rpx; background: #FFFFFF; border-radius: 24rpx; } .top-title { font-size: 34rpx; font-weight: bold; color: #333333; text-align: center; height: 118rpx; line-height: 118rpx; border-bottom: 1rpx solid #DDDDDD; box-sizing:border-box; } .btn { width: 270rpx; height: 90rpx; box-sizing: border-box; font-size: 34rpx; color: #333333; } .cancel-btn { font-weight: 400; } .confirm-btn { border-left: 1rpx solid #DDDDDD; font-weight: bold; }