.bg { position: relative; width: 100%; min-height: 100%; background-color: #f3f3f3; } form { position: relative; } button::afrer { border: 0; } .button { border: 0; margin: 0; padding: 0; background: 0; position: static; } .orders-main { padding-top: 26rpx; padding-bottom: 100rpx; } .order { padding: 0 20rpx; background-color: #fff; margin-bottom: 20rpx; } .orders-tabs { position: fixed; top: -1rpx; left: 0rpx; width: 100%; height: 91rpx; background-color: #fff; border-bottom: 1rpx solid #dddddd; z-index: 99999; } .orders-tab { width: 25%; height: 90rpx; float: left; line-height: 90rpx; text-align: center; font-size: 28rpx; color: #4c4c4c; } .orders-tab__border { position: absolute; width: 25%; height: 4rpx; bottom: 0; background-color: #86a7da; transition: left 0.4s; -webkit-transition: left 0.4s; } .order-title { height: 90rpx; line-height: 90rpx; font-size: 28rpx; } .order-title__left { margin-top: 20rpx; display: block; width: 44rpx; height: 44rpx; float: left; border-radius: 100%; } .order-title__name { float: left; width: 375rpx; color: #999999; font-size: 28rpx; } .order-title__right { color: #999999; float: right; } .order-main { width: 710rpx; height: 200rpx; background-color: #fcfcfc; } .order-main__left { width: 200rpx; height: 200rpx; display: block; float: left; } .order-main__right { position: relative; width: 490rpx; height: 200rpx; float: right; } .order-info__title { color: #4c4c4c; font-size: 24rpx; line-height: 36rpx; padding-top: 5rpx; height: 72rpx; -webkit-line-clamp: 2; } .order-info__type { padding-top: 12rpx; font-size: 24rpx; color: #bbbbbb; } .order-info__price { position: absolute; bottom: 16rpx; left: 0; font-size: 24rpx; color: #bbb; } .order-info__point { color: #bbbbbb; } .order-info__count { position: absolute; bottom: 16rpx; right: 0; font-size: 28rpx; color: #eab86a; } .order-allprice { padding-top: 20rpx; height: 70rpx; line-height: 70rpx; text-align: right; color: #4c4c4c; font-size: 24rpx; border-bottom: 1rpx solid #eeeeee; } .order-allprice text { color: #eab86a; font-size: 28rpx; } .order-btn { height: 108rpx; } .order-btn__black { float: right; width: 158rpx; height: 58rpx; border: 1rpx solid #cccccc; font-size: 28rpx; color: #4c4c4c; text-align: center; line-height: 58rpx; margin-top: 20rpx; margin-left: 20rpx; border-radius: 5rpx; } .order-btn__red { float: right; width: 158rpx; height: 58rpx; border: 1rpx solid #eab86a; font-size: 28rpx; color: #eab86a; text-align: center; line-height: 58rpx; margin-top: 20rpx; margin-left: 20rpx; border-radius: 5rpx; } .orders-no { padding-top: 250rpx; } .orders-no__icon { display: block; width: 204rpx; height: 258rpx; margin: 0 auto; } .orders-no__text { text-align: center; font-size: 28rpx; margin-top: 25rpx; color: #cccccc; } .address { padding-top: 30rpx; padding-bottom: 30rpx; border-bottom: 1rpx solid #eeeeee; } .address-top { width: 100%; padding-left: 56rpx; box-sizing: border-box; } .address-head { width: 42rpx; height: 42rpx; float: left; border-radius: 100%; margin-top: 20rpx; } .address-userInfo { float: left; width: 300rpx; font-size: 28rpx; color: #4c4c4c; } .address-name { width: 300rpx; line-height: 44rpx; font-size: 28rpx; color: #4c4c4c; } .address-cope { float: right; width: 160rpx; height: 48rpx; line-height: 48rpx; text-align: center; margin-top: 10rpx; font-size: 24rpx; color: #b9c9e2; border: 1rpx solid #b9c9e2; } .address-icon { float: left; display: block; width: 32rpx; height: 38rpx; margin-right: 24rpx; } .address-right { float: right; width: 652rpx; } .address-text { width: 100%; line-height: 40rpx; font-size: 28rpx; color: #4c4c4c; } .address-textname { float: left; width: 335rpx; } .address-main { width: 100%; margin-top: 20rpx; } .address-texttel { width: 250rpx; } .address-more { -webkit-line-clamp: 2; font-size: 28rpx; color: #4c4c4c; } .orders-input { display: block; margin: 110rpx 20rpx 0; background-color: #fff; width: 710rpx; height: 80rpx; line-height: 80rpx; text-align: center; font-size: 28rpx; color: #4c4c4c; } .orders-bottom { height: 100rpx; background: #ffffff; display: flex; width: 100%; justify-content: space-around; position: fixed; bottom: 0; left: 0; z-index: 999; border-top: 1rpx solid #cccccc; } .orders-prev { height: 62rpx; width: 198rpx; text-align: center; line-height: 62rpx; border: #cccccc solid 1rpx; border-radius: 10rpx; color: #5a8dd2; margin-top: 18rpx; font-size: 28rpx; /* flex: 0.5; */ } .orders-prev1 { height: 62rpx; width: 198rpx; text-align: center; line-height: 62rpx; border: #cccccc solid 1rpx; border-radius: 10rpx; color: #999; margin-top: 18rpx; font-size: 28rpx; /* flex: 0.5; */ } .orders-center { background: #eeeeee; height: 62rpx; width: 198rpx; text-align: center; line-height: 62rpx; border-radius: 10rpx; /* color: #5a8dd2; */ font-size: 28rpx; margin-top: 19rpx; /* flex: 0.5; */ } .orders-next { height: 62rpx; width: 198rpx; text-align: center; line-height: 62rpx; border: #cccccc solid 1rpx; border-radius: 10rpx; color: #5a8dd2; margin-top: 18rpx; font-size: 28rpx; /* flex: 0.5; */ } .orders-next1 { height: 62rpx; width: 198rpx; text-align: center; line-height: 62rpx; border: #cccccc solid 1rpx; border-radius: 10rpx; color: #999; margin-top: 18rpx; font-size: 28rpx; /* flex: 0.5; */ }