page { background-color: #EDF1F4; } .orderDetail { height: 100vh; display: flex; flex-direction: column; } .main-box { flex: 1; overflow-x: auto; } .head { min-height: 190rpx; background: linear-gradient(180deg, #1784FF 0%, #54CAFF 100%); } .state-text { font-size: 36rpx; font-weight: 800; color: #FFFFFF; padding: 52rpx 0 0 32rpx; } .explain-text { font-size: 22rpx; font-weight: 500; color: #FFFFFF; padding: 10rpx 0 0 32rpx; } .state-img { width: 86rpx; height: 86rpx; background: linear-gradient(180deg, #54CAFF 0%, #0772FF 100%); border-radius: 20rpx 20rpx 20rpx 20rpx; opacity: 1; } .cur-state { font-size: 22rpx; font-weight: 500; color: #FFFFFF; text-align: center; } .line-box { width: 65rpx; } .line { width: 35rpx; height: 0rpx; opacity: 1; border: 1rpx solid #FFFFFF; margin-bottom: 30rpx; } .floor-2 { position: relative; top: -50rpx; height: 80rpx; background-color: #EDF1F4; border-radius: 50rpx; } .make-info { width: 686rpx; /* height: 470rpx; */ background: #FFFFFF; border-radius: 20rpx 20rpx 20rpx 20rpx; opacity: 1; margin: auto; } .order-info-box { position: relative; top: -80rpx; } .make-time { display: inline-block; padding: 6rpx 16rpx; font-size: 22rpx; font-weight: 500; color: #6B738B; background-color: #F5F7FB; } .chunk { height: 1rpx; } .time-date { font-size: 48rpx; font-weight: bold; color: #1C274C; } .time-hour { font-size: 48rpx; font-weight: bold; display: inline-block; } .site { font-size: 30rpx; font-weight: 800; color: #1A1A1A; padding-top: 16rpx; } .user-info { font-size: 26rpx; font-weight: 500; color: #6B738B; } .wire { width: 686rpx; height: 0rpx; opacity: 1; border: 1rpx solid rgba(164, 169, 183, 0.2); } .bz-title { color: #A4A9B7; } .user-remark { color: #1C274C; border-top: 1rpx solid rgba(164, 169, 183, 0.20); } .phone-img { width: 30rpx; height: 30rpx; margin-right: 32rpx; } /* 订单信息 */ .orders-box { width: 686rpx; background: #FFFFFF; border-radius: 20rpx 20rpx 20rpx 20rpx; opacity: 1; margin: auto; } .order-each-img { width: 120rpx; height: 120rpx; background: #D9D9D9; border-radius: 20rpx 20rpx 20rpx 20rpx; opacity: 1; } .order-each-title { font-size: 30rpx; font-weight: bold; color: #1C274C; white-space: normal; } .types{ width: 84rpx; height: 27rpx; border-radius: 4rpx; background-color: #1677FF; color: #fff; } .unit-money { color: #FF9600; font-size: 22rpx; } .order-price { color: #FF9600; font-size: 30rpx; } .order-number { margin-top: 42rpx; color: #A4A9B7; font-size: 22rpx; } .quantity { color: #A4A9B7; font-size: 22rpx; display: inline-block; float: right; position: relative; top: 10rpx; } .discount{ height: 32rpx; background: #2C2B31; color: #F6E0B9; border-radius: 5rpx; } .ticket-img { width: 30rpx; height: 26rpx; } .font { font-size: 26rpx; font-weight: 500; color: #1C274C; } .ticket-price { color: #FF9600; font-size: 26rpx; } .total-t { text-align: right; font-size: 22rpx; color: #A4A9B7; } .total-price { font-size: 32rpx; color: #1C274C; } .order-odd { width: 622rpx; background: #FFFFFF; border-radius: 20rpx 20rpx 20rpx 20rpx; opacity: 1; margin: auto; } .copk { padding: 3rpx 8rpx; border-radius: 4rpx 4rpx 4rpx 4rpx; opacity: 1; border: 1rpx solid #62CB81; font-size: 20rpx; font-weight: 500; color: #62CB81; } .order-color { font-size: 24rpx; font-weight: 500; color: #1C274C; } .odd-text { color: #A4A9B7; font-size: 24rpx; } .cotto { height: 160rpx; } .order-btn-box { width: 750rpx; background: #FFFFFF; opacity: 1; flex-shrink: 0; box-sizing: border-box; } .image-box { display: flex; align-items: center; flex-wrap: wrap; } .upload { width: 212rpx; height: 212rpx; border-radius: 20rpx; } .images-box{ position: relative; margin: 0 24rpx 24rpx 0; } .images-box:nth-of-type(3n) { margin-right: 0; } .del{ position: absolute; width: 26rpx; height: 26rpx; right: 0; top: -13rpx; z-index: 10; } .settle-box{ width: 686rpx; height: 936rpx; position: relative; box-sizing: border-box; padding: 70rpx 64rpx; } .settle-bg{ position: absolute; left: 0; top: 0; width: 100%; height: 98%; } .settle-title{ background: linear-gradient(to right, #E93423, #EE7F31); width: 188rpx; height: 68rpx; margin: 0 auto; color: #fff; } .settle{ position: relative; z-index: 10; } .num-box{ flex-wrap: wrap; } .num{ height: 64rpx; width: 270rpx; margin: 0 16rpx 16rpx 0; background: #F5F7F9; box-sizing: border-box; padding: 0 16rpx; } .num:nth-of-type(2n){ margin-right: 0; } .refund{ color: #FF9600; }