.container { background: #fafafa; box-sizing: border-box; min-height: 100vh; padding: 0 27rpx 140rpx; } .form-box { background: #fff; height: 294rpx; margin: 0 27rpx; } .form-box .title { border-bottom: 1px solid #eee; color: #666; font-size: 26rpx; padding: 18rpx 24rpx 30rpx; } .input-box { background: #eee; border-radius: 9rpx; height: 90rpx; margin: 60rpx 30rpx 0; position: relative; } .input-box input { box-sizing: border-box; display: block; font-size: 32rpx; height: 90rpx; line-height: 90rpx; padding: 0 28rpx; width: calc(100% - 97rpx); } .placeholder { color: #999; } .input-box .btn { align-items: center; display: flex; height: 90rpx; justify-content: center; position: absolute; right: 0; top: 0; width: 97rpx; } .input-box .btn image { height: 43rpx; width: 45rpx; } .title-tip { border-bottom: 1px solid #f2f2f2; color: #666; font-size: 26rpx; line-height: 80rpx; padding-left: 14rpx; } .list { background: #fff; } .item { border-radius: 18rpx; box-shadow: 0 0rpx 9rpx 4rpx hsla(0,0%,80%,.75); padding: 14rpx 20rpx 14rpx 14rpx; } .item .top { align-items: center; display: flex; } .item .l { align-items: flex-end; color: #666; font-size: 30rpx; } .item .index,.item .l { display: inline-flex; } .item .index { color: #999; } .item .code { color: #333; display: inline-flex; font-size: 33rpx; line-height: 44rpx; } .item .indate { color: #999; font-size: 22rpx; } .item .r { display: inline-flex; padding: 14rpx; } .item .radio { border: 5rpx solid #666; border-radius: 50%; display: block; height: 31rpx; margin-right: 10rpx; width: 31rpx; } .item.active { box-shadow: 0 0rpx 9rpx 4rpx rgba(255,102,0,.4); } .item.active .code { color: #f60; } .item.active .radio { border-color: #f60; position: relative; } .item.active .radio::after { background: #f60; border-radius: 50%; content: ""; display: block; height: 15rpx; left: 50%; position: absolute; top: 50%; transform: translate(-50%,-50%); width: 15rpx; } .item.item-notavailable .code { color: #999; } .item .location { color: #666; font-size: 22rpx; line-height: 33rpx; margin: 10rpx 0 2rpx; } .item.item-notavailable .location { color: #999; } .scan-btn-unavailable { opacity: .5; }