.postage{ position: relative; padding: 20rpx 0; color: #848799; } .postage::before{ content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 165rpx; background: linear-gradient(to bottom, #fd7428 0%,#fc8f4a 100%); z-index: -1; } .tips{ padding: 15rpx 20rpx; width: 92%; margin: 0 auto; background-color: #ffd900; color: #786700; border-radius: 10rpx; box-sizing: border-box; font-size: 26rpx; } .tabs, .rechargeGear{ width: 92%; margin: 20rpx auto; } .tabs-title{ display: flex; justify-content: space-between; align-items: center; height: 90rpx; line-height: 90rpx; background-color: #fff; border-top-left-radius: 10rpx; border-top-right-radius: 10rpx; } .tabs-title-item{ display: flex; justify-content: center; align-items: center; width: 50%; } .tabs-title-item__icon{ width: 40rpx; height: 40rpx; margin-right: 10rpx; } .tabs-title-item__text{} .tabs-title-item.active{ position: relative; color: #fe7124; } .tabs-title-item.active::before{ content: ""; position: absolute; bottom: 0; left: 15%; right: 10%; height: 6rpx; background-color: #fe7124; } .tabs-content__tips{ display: flex; height: 80rpx; align-items: center; } .tabs-content__tips-text{ font-size: 26rpx; } .tabs-content__tips-add{ width: 40rpx; height: 40rpx; margin-left: 50rpx; } .tabs-content,.rechargeGear-footer{ padding: 30rpx 30rpx 50rpx 30rpx; background-color: #fff; border-bottom-left-radius: 10rpx; border-bottom-right-radius: 10rpx; } .btn-rechargeNow{ width: 85%; padding: 22rpx; margin: 0 auto 30rpx; background-color: #fe7124; background: linear-gradient(to right, #ff7a21 0%,#feb25a 100%); text-align: center; color: #fff; border-radius: 10rpx; } .btn-rechargeNow:active{ opacity: .8; } .rechargeNow-tips{ text-align: center; font-size: 26rpx; } /* 充值挡位 */ .rechargeGear-title{ height: 84rpx; line-height: 84rpx; background-color: #fff; color: #1e242e; padding-left: 30rpx; border-top-left-radius: 10rpx; border-top-right-radius: 10rpx; } .rechargeGear-content{ display: flex; flex-wrap: wrap; justify-content: space-between; background-color: #fff; box-sizing: border-box; padding: 0 30rpx; } .rechargeGear-content__item{ width: 30%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 20rpx 0; border: 1rpx solid #fe7124; border-radius: 10rpx; color: #fe7124; background-color: #fff; margin-bottom: 30rpx; } .rechargeGear-content__item.active{ background-color: #fe7124; color: #fff; } .faceValue{ margin-bottom: 10rpx; } .price{ font-size: 24rpx; } .card-no{ padding: 20rpx 0; font-size: 40rpx; color: #2b2b2b; } .border-top-radius{ border-top-left-radius: 10rpx; border-top-right-radius: 10rpx; }