.info { width: 650upx; // height: 218upx; background: rgba(255, 255, 255, 0.3); margin: 65rpx 0 0 0; padding: 0 40upx 16upx 40upx; border-radius: 15upx; .item { font-size: 30upx; display: flex; justify-content: space-between; align-items: center; margin-top: 40upx; margin-bottom: 10upx; .rz { margin-left: 10upx; font-size: 28rpx; background-color: #558bf2; width: 60upx; border-radius: 40upx; padding: 0upx 20upx 4upx 20upx; } } .gray { color: #fff; } /deep/ .u-input__content__field-wrapper__field { color: #fff !important; } .resend { color: #558bf2; font-size: 14px; } } .fl-card { box-shadow: 0 1px 5px #bba7a7, 0 2px 2px #7c6969, 0 3px 1px -2px #645050; background: #fff; border-radius: 6upx; padding: 8upx; } .u-badge--success { background-color: #829f8c !important; } .u-badge--not-dot { padding: 2px 4px !important; } .row { display: flex; flex-wrap: wrap; justify-content: flex-start; /* 将子元素左对齐 */ } .justify-center { justify-content: center; } .items-center { align-items: center; } .relative { position: relative; } .absolute { position: absolute; } .justify-between { justify-content: space-between; } .justify-around { justify-content: space-around; } .font-12 { font-size: 12px; } .font-16 { font-size: 16px; } .font-18 { font-size: 18px; } .font-600 { font-weight: 600; } .fl-my-sm { margin: 8px 0; } .text-center { text-align: center; } .text-left { text-align: left; } .text-right { text-align: right; } .flex, .row { display: flex; flex-wrap: wrap; } @media (min-width: 0) { .flex > .col, .flex > .col-0, .flex > .col-1, .flex > .col-2, .flex > .col-3, .flex > .col-4, .flex > .col-5, .flex > .col-6, .flex > .col-7, .flex > .col-8, .flex > .col-9, .flex > .col-10, .flex > .col-11, .flex > .col-12, .flex > .col-auto, .flex > .col-grow, .flex > .col-shrink, .flex > .col-xs, .flex > .col-xs-0, .flex > .col-xs-1, .flex > .col-xs-2, .flex > .col-xs-3, .flex > .col-xs-4, .flex > .col-xs-5, .flex > .col-xs-6, .flex > .col-xs-7, .flex > .col-xs-8, .flex > .col-xs-9, .flex > .col-xs-10, .flex > .col-xs-11, .flex > .col-xs-12, .flex > .col-xs-auto, .flex > .col-xs-grow, .flex > .col-xs-shrink, .row > .col, .row > .col-0, .row > .col-1, .row > .col-2, .row > .col-3, .row > .col-4, .row > .col-5, .row > .col-6, .row > .col-7, .row > .col-8, .row > .col-9, .row > .col-10, .row > .col-11, .row > .col-12, .row > .col-auto, .row > .col-grow, .row > .col-shrink, .row > .col-xs, .row > .col-xs-0, .row > .col-xs-1, .row > .col-xs-2, .row > .col-xs-3, .row > .col-xs-4, .row > .col-xs-5, .row > .col-xs-6, .row > .col-xs-7, .row > .col-xs-8, .row > .col-xs-9, .row > .col-xs-10, .row > .col-xs-11, .row > .col-xs-12, .row > .col-xs-auto, .row > .col-xs-grow, .row > .col-xs-shrink { width: auto; min-width: 0; max-width: 100%; } .flex > .col, .flex > .col-0, .flex > .col-1, .flex > .col-2, .flex > .col-3, .flex > .col-4, .flex > .col-5, .flex > .col-6, .flex > .col-7, .flex > .col-8, .flex > .col-9, .flex > .col-10, .flex > .col-11, .flex > .col-12, .flex > .col-auto, .flex > .col-grow, .flex > .col-shrink, .flex > .col-xs, .flex > .col-xs-0, .flex > .col-xs-1, .flex > .col-xs-2, .flex > .col-xs-3, .flex > .col-xs-4, .flex > .col-xs-5, .flex > .col-xs-6, .flex > .col-xs-7, .flex > .col-xs-8, .flex > .col-xs-9, .flex > .col-xs-10, .flex > .col-xs-11, .flex > .col-xs-12, .flex > .col-xs-auto, .flex > .col-xs-grow, .flex > .col-xs-shrink { height: auto; min-height: 0; max-height: 100%; } .col, .col-xs { flex: 10000 1 0%; } .col-0, .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col-auto, .col-xs-0, .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-auto { flex: 0 0 auto; } .col-grow, .col-xs-grow { flex: 1 0 auto; } .col-shrink, .col-xs-shrink { flex: 0 1 auto; } .row > .col-0, .row > .col-xs-0 { height: auto; width: 0%; } .row > .offset-0, .row > .offset-xs-0 { margin-left: 0%; } .row > .col-1, .row > .col-xs-1 { height: auto; width: 8.3333%; } .row > .offset-1, .row > .offset-xs-1 { margin-left: 8.3333%; } .row > .col-2, .row > .col-xs-2 { height: auto; width: 16.6667%; } .row > .offset-2, .row > .offset-xs-2 { margin-left: 16.6667%; } .row > .col-3, .row > .col-xs-3 { height: auto; width: 25%; } .row > .offset-3, .row > .offset-xs-3 { margin-left: 25%; } .row > .col-4, .row > .col-xs-4 { height: auto; width: 33.3333%; } .row > .offset-4, .row > .offset-xs-4 { margin-left: 33.3333%; } .row > .col-5, .row > .col-xs-5 { height: auto; width: 41.6667%; } .row > .offset-5, .row > .offset-xs-5 { margin-left: 41.6667%; } .row > .col-6, .row > .col-xs-6 { height: auto; width: 50%; } .row > .offset-6, .row > .offset-xs-6 { margin-left: 50%; } .row > .col-7, .row > .col-xs-7 { height: auto; width: 58.3333%; } .row > .offset-7, .row > .offset-xs-7 { margin-left: 58.3333%; } .row > .col-8, .row > .col-xs-8 { height: auto; width: 66.6667%; } .row > .offset-8, .row > .offset-xs-8 { margin-left: 66.6667%; } .row > .col-9, .row > .col-xs-9 { height: auto; width: 75%; } .row > .offset-9, .row > .offset-xs-9 { margin-left: 75%; } .row > .col-10, .row > .col-xs-10 { height: auto; width: 83.3333%; } .row > .offset-10, .row > .offset-xs-10 { margin-left: 83.3333%; } .row > .col-11, .row > .col-xs-11 { height: auto; width: 91.6667%; } .row > .offset-11, .row > .offset-xs-11 { margin-left: 91.6667%; } .row > .col-12, .row > .col-xs-12 { height: auto; width: 100%; } .row > .offset-12, .row > .offset-xs-12 { margin-left: 100%; } .row > .col-all { height: auto; flex: 0 0 100%; } } @media (min-width: 600px) { .flex > .col-sm, .flex > .col-sm-0, .flex > .col-sm-1, .flex > .col-sm-2, .flex > .col-sm-3, .flex > .col-sm-4, .flex > .col-sm-5, .flex > .col-sm-6, .flex > .col-sm-7, .flex > .col-sm-8, .flex > .col-sm-9, .flex > .col-sm-10, .flex > .col-sm-11, .flex > .col-sm-12, .flex > .col-sm-auto, .flex > .col-sm-grow, .flex > .col-sm-shrink, .row > .col-sm, .row > .col-sm-0, .row > .col-sm-1, .row > .col-sm-2, .row > .col-sm-3, .row > .col-sm-4, .row > .col-sm-5, .row > .col-sm-6, .row > .col-sm-7, .row > .col-sm-8, .row > .col-sm-9, .row > .col-sm-10, .row > .col-sm-11, .row > .col-sm-12, .row > .col-sm-auto, .row > .col-sm-grow, .row > .col-sm-shrink { width: auto; min-width: 0; max-width: 100%; } .flex > .col-sm, .flex > .col-sm-0, .flex > .col-sm-1, .flex > .col-sm-2, .flex > .col-sm-3, .flex > .col-sm-4, .flex > .col-sm-5, .flex > .col-sm-6, .flex > .col-sm-7, .flex > .col-sm-8, .flex > .col-sm-9, .flex > .col-sm-10, .flex > .col-sm-11, .flex > .col-sm-12, .flex > .col-sm-auto, .flex > .col-sm-grow, .flex > .col-sm-shrink { height: auto; min-height: 0; max-height: 100%; } .col-sm { flex: 10000 1 0%; } .col-sm-0, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-auto { flex: 0 0 auto; } .col-sm-grow { flex: 1 0 auto; } .col-sm-shrink { flex: 0 1 auto; } .row > .col-sm-0 { height: auto; width: 0%; } .row > .offset-sm-0 { margin-left: 0%; } .row > .col-sm-1 { height: auto; width: 8.3333%; } .row > .offset-sm-1 { margin-left: 8.3333%; } .row > .col-sm-2 { height: auto; width: 16.6667%; } .row > .offset-sm-2 { margin-left: 16.6667%; } .row > .col-sm-3 { height: auto; width: 25%; } .row > .offset-sm-3 { margin-left: 25%; } .row > .col-sm-4 { height: auto; width: 33.3333%; } .row > .offset-sm-4 { margin-left: 33.3333%; } .row > .col-sm-5 { height: auto; width: 41.6667%; } .row > .offset-sm-5 { margin-left: 41.6667%; } .row > .col-sm-6 { height: auto; width: 50%; } .row > .offset-sm-6 { margin-left: 50%; } .row > .col-sm-7 { height: auto; width: 58.3333%; } .row > .offset-sm-7 { margin-left: 58.3333%; } .row > .col-sm-8 { height: auto; width: 66.6667% !important; } .row > .offset-sm-8 { margin-left: 66.6667%; } .row > .col-sm-9 { height: auto; width: 75%; } .row > .offset-sm-9 { margin-left: 75%; } .row > .col-sm-10 { height: auto; width: 83.3333%; } .row > .offset-sm-10 { margin-left: 83.3333%; } .row > .col-sm-11 { height: auto; width: 91.6667%; } .row > .offset-sm-11 { margin-left: 91.6667%; } .row > .col-sm-12 { height: auto; width: 100%; } .row > .offset-sm-12 { margin-left: 100%; } } @media (min-width: 1024px) { .flex > .col-md, .flex > .col-md-0, .flex > .col-md-1, .flex > .col-md-2, .flex > .col-md-3, .flex > .col-md-4, .flex > .col-md-5, .flex > .col-md-6, .flex > .col-md-7, .flex > .col-md-8, .flex > .col-md-9, .flex > .col-md-10, .flex > .col-md-11, .flex > .col-md-12, .flex > .col-md-auto, .flex > .col-md-grow, .flex > .col-md-shrink, .row > .col-md, .row > .col-md-0, .row > .col-md-1, .row > .col-md-2, .row > .col-md-3, .row > .col-md-4, .row > .col-md-5, .row > .col-md-6, .row > .col-md-7, .row > .col-md-8, .row > .col-md-9, .row > .col-md-10, .row > .col-md-11, .row > .col-md-12, .row > .col-md-auto, .row > .col-md-grow, .row > .col-md-shrink { width: auto; min-width: 0; max-width: 100%; } .flex > .col-md, .flex > .col-md-0, .flex > .col-md-1, .flex > .col-md-2, .flex > .col-md-3, .flex > .col-md-4, .flex > .col-md-5, .flex > .col-md-6, .flex > .col-md-7, .flex > .col-md-8, .flex > .col-md-9, .flex > .col-md-10, .flex > .col-md-11, .flex > .col-md-12, .flex > .col-md-auto, .flex > .col-md-grow, .flex > .col-md-shrink { height: auto; min-height: 0; max-height: 100%; } .col-md { flex: 10000 1 0%; } .col-md-0, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md-auto { flex: 0 0 auto; } .col-md-grow { flex: 1 0 auto; } .col-md-shrink { flex: 0 1 auto; } .row > .col-md-0 { height: auto; width: 0%; } .row > .offset-md-0 { margin-left: 0%; } .row > .col-md-1 { height: auto; width: 8.3333%; } .row > .offset-md-1 { margin-left: 8.3333%; } .row > .col-md-2 { height: auto; width: 16.6667%; } .row > .offset-md-2 { margin-left: 16.6667%; } .row > .col-md-3 { height: auto; width: 25%; } .row > .offset-md-3 { margin-left: 25%; } .row > .col-md-4 { height: auto; width: 33.3333%; } .row > .offset-md-4 { margin-left: 33.3333%; } .row > .col-md-5 { height: auto; width: 41.6667%; } .row > .offset-md-5 { margin-left: 41.6667%; } .row > .col-md-6 { height: auto; width: 50%; } .row > .offset-md-6 { margin-left: 50%; } .row > .col-md-7 { height: auto; width: 58.3333%; } .row > .offset-md-7 { margin-left: 58.3333%; } .row > .col-md-8 { height: auto; width: 66.6667%; } .row > .offset-md-8 { margin-left: 66.6667%; } .row > .col-md-9 { height: auto; width: 75%; } .row > .offset-md-9 { margin-left: 75%; } .row > .col-md-10 { height: auto; width: 83.3333%; } .row > .offset-md-10 { margin-left: 83.3333%; } .row > .col-md-11 { height: auto; width: 91.6667%; } .row > .offset-md-11 { margin-left: 91.6667%; } .row > .col-md-12 { height: auto; width: 100%; } .row > .offset-md-12 { margin-left: 100%; } } @media (min-width: 1440px) { .flex > .col-lg, .flex > .col-lg-0, .flex > .col-lg-1, .flex > .col-lg-2, .flex > .col-lg-3, .flex > .col-lg-4, .flex > .col-lg-5, .flex > .col-lg-6, .flex > .col-lg-7, .flex > .col-lg-8, .flex > .col-lg-9, .flex > .col-lg-10, .flex > .col-lg-11, .flex > .col-lg-12, .flex > .col-lg-auto, .flex > .col-lg-grow, .flex > .col-lg-shrink, .row > .col-lg, .row > .col-lg-0, .row > .col-lg-1, .row > .col-lg-2, .row > .col-lg-3, .row > .col-lg-4, .row > .col-lg-5, .row > .col-lg-6, .row > .col-lg-7, .row > .col-lg-8, .row > .col-lg-9, .row > .col-lg-10, .row > .col-lg-11, .row > .col-lg-12, .row > .col-lg-auto, .row > .col-lg-grow, .row > .col-lg-shrink { width: auto; min-width: 0; max-width: 100%; } .flex > .col-lg, .flex > .col-lg-0, .flex > .col-lg-1, .flex > .col-lg-2, .flex > .col-lg-3, .flex > .col-lg-4, .flex > .col-lg-5, .flex > .col-lg-6, .flex > .col-lg-7, .flex > .col-lg-8, .flex > .col-lg-9, .flex > .col-lg-10, .flex > .col-lg-11, .flex > .col-lg-12, .flex > .col-lg-auto, .flex > .col-lg-grow, .flex > .col-lg-shrink { height: auto; min-height: 0; max-height: 100%; } .col-lg { flex: 10000 1 0%; } .col-lg-0, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-auto { flex: 0 0 auto; } .col-lg-grow { flex: 1 0 auto; } .col-lg-shrink { flex: 0 1 auto; } .row > .col-lg-0 { height: auto; width: 0%; } .row > .offset-lg-0 { margin-left: 0%; } .row > .col-lg-1 { height: auto; width: 8.3333%; } .row > .offset-lg-1 { margin-left: 8.3333%; } .row > .col-lg-2 { height: auto; width: 16.6667%; } .row > .offset-lg-2 { margin-left: 16.6667%; } .row > .col-lg-3 { height: auto; width: 25%; } .row > .offset-lg-3 { margin-left: 25%; } .row > .col-lg-4 { height: auto; width: 33.3333%; } .row > .offset-lg-4 { margin-left: 33.3333%; } .row > .col-lg-5 { height: auto; width: 41.6667%; } .row > .offset-lg-5 { margin-left: 41.6667%; } .row > .col-lg-6 { height: auto; width: 50%; } .row > .offset-lg-6 { margin-left: 50%; } .row > .col-lg-7 { height: auto; width: 58.3333%; } .row > .offset-lg-7 { margin-left: 58.3333%; } .row > .col-lg-8 { height: auto; width: 66.6667%; } .row > .offset-lg-8 { margin-left: 66.6667%; } .row > .col-lg-9 { height: auto; width: 75%; } .row > .offset-lg-9 { margin-left: 75%; } .row > .col-lg-10 { height: auto; width: 83.3333%; } .row > .offset-lg-10 { margin-left: 83.3333%; } .row > .col-lg-11 { height: auto; width: 91.6667%; } .row > .offset-lg-11 { margin-left: 91.6667%; } .row > .col-lg-12 { height: auto; width: 100%; } .row > .offset-lg-12 { margin-left: 100%; } } @media (min-width: 1920px) { .flex > .col-xl, .flex > .col-xl-0, .flex > .col-xl-1, .flex > .col-xl-2, .flex > .col-xl-3, .flex > .col-xl-4, .flex > .col-xl-5, .flex > .col-xl-6, .flex > .col-xl-7, .flex > .col-xl-8, .flex > .col-xl-9, .flex > .col-xl-10, .flex > .col-xl-11, .flex > .col-xl-12, .flex > .col-xl-auto, .flex > .col-xl-grow, .flex > .col-xl-shrink, .row > .col-xl, .row > .col-xl-0, .row > .col-xl-1, .row > .col-xl-2, .row > .col-xl-3, .row > .col-xl-4, .row > .col-xl-5, .row > .col-xl-6, .row > .col-xl-7, .row > .col-xl-8, .row > .col-xl-9, .row > .col-xl-10, .row > .col-xl-11, .row > .col-xl-12, .row > .col-xl-auto, .row > .col-xl-grow, .row > .col-xl-shrink { width: auto; min-width: 0; max-width: 100%; } .flex > .col-xl, .flex > .col-xl-0, .flex > .col-xl-1, .flex > .col-xl-2, .flex > .col-xl-3, .flex > .col-xl-4, .flex > .col-xl-5, .flex > .col-xl-6, .flex > .col-xl-7, .flex > .col-xl-8, .flex > .col-xl-9, .flex > .col-xl-10, .flex > .col-xl-11, .flex > .col-xl-12, .flex > .col-xl-auto, .flex > .col-xl-grow, .flex > .col-xl-shrink { height: auto; min-height: 0; max-height: 100%; } .col-xl { flex: 10000 1 0%; } .col-xl-0, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-auto { flex: 0 0 auto; } .col-xl-grow { flex: 1 0 auto; } .col-xl-shrink { flex: 0 1 auto; } .row > .col-xl-0 { height: auto; width: 0%; } .row > .offset-xl-0 { margin-left: 0%; } .row > .col-xl-1 { height: auto; width: 8.3333%; } .row > .offset-xl-1 { margin-left: 8.3333%; } .row > .col-xl-2 { height: auto; width: 16.6667%; } .row > .offset-xl-2 { margin-left: 16.6667%; } .row > .col-xl-3 { height: auto; width: 25%; } .row > .offset-xl-3 { margin-left: 25%; } .row > .col-xl-4 { height: auto; width: 33.3333%; } .row > .offset-xl-4 { margin-left: 33.3333%; } .row > .col-xl-5 { height: auto; width: 41.6667%; } .row > .offset-xl-5 { margin-left: 41.6667%; } .row > .col-xl-6 { height: auto; width: 50%; } .row > .offset-xl-6 { margin-left: 50%; } .row > .col-xl-7 { height: auto; width: 58.3333%; } .row > .offset-xl-7 { margin-left: 58.3333%; } .row > .col-xl-8 { height: auto; width: 66.6667%; } .row > .offset-xl-8 { margin-left: 66.6667%; } .row > .col-xl-9 { height: auto; width: 75%; } .row > .offset-xl-9 { margin-left: 75%; } .row > .col-xl-10 { height: auto; width: 83.3333%; } .row > .offset-xl-10 { margin-left: 83.3333%; } .row > .col-xl-11 { height: auto; width: 91.6667%; } .row > .offset-xl-11 { margin-left: 91.6667%; } .row > .col-xl-12 { height: auto; width: 100%; } .row > .offset-xl-12 { margin-left: 100%; } }