page { background-color: #ededed; } .content { padding: 50rpx 0; .backGround { position: relative; width: 650rpx; height: 400rpx; line-height: 150rpx; color: #ffffff; font-size: 60rpx; margin: auto; border-radius: 50rpx; overflow: hidden; image { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%; height: 100%; } } // .payHistory { // position: absolute; // right: 100rpx; // top: 500rpx; // font-size: 25rpx; // color: #07c160; // } .orderList { position: relative; text-align: center; margin: auto; .firstPayInfo { position: relative; width: 550rpx; height: 200rpx; border: 1px dashed #9f9b88; border-radius: 30rpx; background-color: #f7f7f7; margin: 50rpx auto; overflow: hidden; .saleInfo { font-size: 45rpx; margin-top: 25rpx; .salePrice { font-size: 55rpx; color: #ff0000; font-weight: 600; margin-right: 10rpx; } .price { font-size: 42rpx; text-decoration: line-through; } } .validInfo { margin-top: 15rpx; .day { font-size: 40rpx; color: #ff0000; font-weight: 600; } } .firstCharge { position: absolute; top: 28rpx; right: -50rpx; width: 200rpx; height: 40rpx; font-size: 25rpx; transform: rotate(45deg); background-color: red; color: #ffffff; } } .payInfo { width: 650rpx; background-color: #ffffff; border-radius: 25rpx; margin: 50rpx auto; padding-bottom: 40rpx; .continue { text-align: left; padding: 25rpx; margin-bottom: 20rpx; .grey { margin-left: 15rpx; font-size: 23rpx; color: #a3a3a3; } } .infoBox { display: flex; justify-content: space-between; align-items: center; flex-flow: row wrap; padding: 0 25rpx; .item { width: 180rpx; height: 180rpx; background-color: #f2f5fa; border-radius: 20rpx; padding: 20rpx; margin-bottom: 30rpx; box-sizing: border-box; border: 5rpx solid #f2f5fa; transition: all 0.4s; &.active { border: 5rpx solid #666666; } .remainDays { font-size: 38rpx; font-weight: 600; margin-bottom: 10rpx; .days { font-size: 28rpx; margin-left: 10rpx; } } .salePrice { font-size: 25rpx; margin-bottom: 10rpx; .lightHigh { color: #ff0000; } } .price { font-size: 22rpx; text-decoration: line-through; color: #727272; } } } } .btn { display: inline-block; margin-top: 20rpx; border-radius: 30rpx; } } }