.bind-user { &-header { height: 315rpx; padding: 60rpx 20rpx 0; background: linear-gradient(360deg, #FFFFFF 0%, #FFBF60 99%); color: #FFFFFF; } .header-name { margin-left: 20rpx; .label1{ width: 120rpx; height: 28rpx; line-height: 28rpx; text-align: center; background-color: #ffa848; border-radius: 20rpx; font-size: 22rpx; border: 1px solid #ffffff; margin-bottom: 10rpx; } } .header-card { padding: 20rpx; border-radius: 20rpx; font-size: 28rpx; } .card-left { background: #78f7eb; } .card-right { background: #de8585; } } .bind-main { position: absolute; top: 180rpx; width: 100vw; &-content{ padding: 30rpx 20rpx; box-sizing: border-box; .top { // height: 259rpx; background-color: #FFF6EC; padding: 3% 4%; .account { display: flex; justify-content: space-between; color: #000000; font-size: 30rpx; .text { color: #A55822; display: flex; } .line { position: relative; padding: 0 0 0 20rpx; &::before { position: absolute; top: 7rpx; left: 10rpx; content: ""; width: 3rpx; height: 30rpx; border-radius: 9rpx; background-color: #A55822; } } } .money { width: auto; height: 60rpx; margin: 20rpx 0; color: #FF2A2A; font-size: 42rpx; align-items: center; .text1 { font-size: 25rpx !important; color: #FF2A2A !important; margin-right: 10rpx; } } .line1 { position: relative; &::before { position: absolute; top: -10rpx; left: 0; content: ""; width: 660rpx; height: 1rpx; background-color: #FFBF60; } } .divide { color: #A55822; font-size: 30rpx; margin-top: 50rpx; display: flex; justify-content: space-between; } } .my-data { padding: 0 40rpx; box-sizing: border-box; background-color: #ffffff; margin-bottom: 40rpx; border-radius: 20rpx; &-total { padding: 40rpx 0; box-sizing: border-box; background-color: #ffffff; } } } // &-list{ // background: #FFFFFF; // min-height: 900rpx; // border-radius: 30rpx; // padding: 0 0 30rpx 0; // box-sizing: border-box; // } }