| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120 |
- page {
- background: #F7F8F9;
- }
- .back-top {
- background: #131D55;
- height: 400rpx;
- width: 100vw;
- position: absolute;
- z-index: -11;
- top: 0;
- }
- .avatar {
- width: 72rpx;
- height: 72rpx;
- border-radius: 50%;
- background: #fff;
- margin-left: 44rpx;
- margin-right: 20rpx;
- }
- .data {
- width: 694rpx;
- height: 328rpx;
- background: #0089FD;
- border-radius: 8rpx;
- margin: 0 auto;
- margin-top: 32rpx;
- color: #fff;
- padding: 40rpx 50rpx;
- }
- .data .data-box {
- width: 240rpx;
- }
- .shu {
- width: 2rpx;
- height: 71rpx;
- opacity: 0.5;
- border-left: 1rpx solid #FFFFFF;
- }
- .data .nums {
- font-size: 48rpx;
- font-family: Helvetica-Bold, Helvetica;
- font-weight: bold;
- color: #FFFFFF;
- margin-bottom: 16rpx;
- }
- .data .unit {
- font-size: 26rpx;
- font-family: Helvetica-Bold, Helvetica;
- font-weight: bold;
- color: #FFFFFF;
- margin-left: 18rpx;
- }
- .data .text {
- font-family: PingFangSC-Regular, PingFang SC;
- font-weight: 400;
- color: #FFFFFF;
- line-height: 22rpx;
- }
- .func {
- width: 694rpx;
- height: 600rpx;
- background: #FFFFFF;
- box-shadow: 0px 4rpx 14rpx 0rpx rgba(0, 0, 0, 0.02);
- border-radius: 8rpx;
- margin: 0 auto;
- margin-top: 20rpx;
- position: relative;
- }
- .func .icon {
- width: 64rpx;
- height: 64rpx;
- margin-right: 38rpx;
- }
- .func .title {
- font-size: 36rpx;
- font-family: PingFangSC-Medium, PingFang SC;
- font-weight: 500;
- color: #2A3245;
- }
- .func .text {
- font-size: 30rpx;
- color: #A3A8B3;
- margin-right: 12rpx;
- }
- .func .num {
- font-size: 36rpx;
- color: #2A3245;
- }
- .func-line {
- width: 590rpx;
- height: 200rpx;
- margin: 0 auto;
- border-bottom: 1px solid #dee2e9;
- }
- .func-shu {
- height: calc(100% - 120rpx);
- border-left: 1rpx solid #E1E5ED;
- position: absolute;
- top: 60rpx;
- left: 50%;
- }
- .func-line-right {
- width: 240rpx;
- }
|