@import '../../../theme/theme.less';
.main{
    background-color: rgb(255, 255, 255);
    width: 100%;
    .head{
        width: 100%;
        height: 380rpx;
        position: relative;
        .img{
            width: 120rpx;
            height: 120rpx;
            position: absolute;
            top: 20rpx;
            left: 20rpx;
            border: 14rpx solid white;
            border-radius: 50%;
            z-index: 10;
        }
        .card{
            width: 82%;
            height: 300rpx;
            position: absolute;
            top: 80rpx;
            left: 70rpx;
            background-color: @theme;
            border-radius: 40rpx;
            box-shadow: 5px 5px 5px rgba(104, 103, 103, 0.6);
            .totle{
                height: 150rpx;
                line-height: 150rpx;
                padding-left: 100rpx;
                font-size: 36rpx;
                color: white;
                text{
                    font-size: 60rpx;
                    color: rgb(44, 44, 44);
                }
            }
            .detail{
                margin-top: 20rpx;
                display: flex;
                flex-direction: row;
                text-align: center;
                .item{
                    flex: 1;
                    display: flex;
                    flex-direction: column;
                    .value{
                        font-size: 32rpx;
                        color: rgb(63, 63, 63);
                    }
                    .name{
                        color: white;
                        font-size: 20rpx;
                        margin-top: 7rpx;
                    }
                }
            }
        }
        .card-hover{
            // width: calc(82% + 2px);
            // height: calc(300rpx + 2px);
            box-shadow: 3px 3px 3px rgba(104, 103, 103, 0.6);
        }
    }
    .body{
        padding-top: 50rpx;
        padding-bottom: 50rpx;
    }
}