.soldier-scan-result .wrapper { position: relative; } .soldier-scan-result .wrapper .panel { height: 360rpx; position: relative; overflow: hidden; } .soldier-scan-result .wrapper .panel::after { content: ''; width: 140%; height: 360rpx; position: absolute; left: -20%; top: 0; border-radius: 0 0 50% 50%; background-image: linear-gradient(135deg, #168BFF 0%, #1664FF 100%); } .soldier-scan-result .wrapper .info-header { position: absolute; top: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 30rpx 24rpx 40rpx 24rpx; width: 100%; box-sizing: border-box; } .soldier-scan-result .wrapper .info-header .title { display: flex; align-items: center; font-size: 36rpx; color: #fff; } .soldier-scan-result .wrapper .info-header .title view { margin-left: 12rpx; } .soldier-scan-result .wrapper .info-header .subtitle { margin-top: 10rpx; font-size: 26rpx; color: #fff; opacity: 0.6; } .soldier-scan-result .info-box { position: relative; margin: -180rpx 24rpx 24rpx 24rpx; padding: 16rpx 0; background-color: #fff; border-radius: 16rpx; } .soldier-scan-result .info-box .item { display: flex; align-items: center; justify-content: space-between; height: 96rpx; padding: 24rpx; box-sizing: border-box; } .soldier-scan-result .info-box .item label { margin-right: 24rpx; font-size: 34rpx; color: #333; } .soldier-scan-result .info-box .item text { flex: 1; font-size: 30rpx; color: #999; text-align: right; } .soldier-scan-result button { margin: 40rpx 24rpx; border-radius: 8rpx; font-size: 36rpx; background-color: #1677FF; }