/**
 * @description 雪花屏代码，基于ant-design修改
 **/
.first-loading-wrp {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100vh;
    min-height: 100vh;
    background: hsla(0, 0%, 100%, .8);
}

.first-loading-wrp>p {
    font-size: 13px;
    color: #1890ff;
    font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
    margin: 2px 0;
    margin-left: 10px;
}

.dot-loader:not(:required) {
    position: relative;
    display: inline-block;
    width: 5px;
    height: 5px;
    margin-bottom: 30px;
    overflow: hidden;
    text-indent: -9999px;
    background: transparent;
    border-radius: 100%;
    box-shadow: #f86 -14px -10px 0 5px,
        #fc6 14px -10px 0 5px,
        #6d7 14px 10px 0 5px,
        #4ae -14px 10px 0 5px;
    transform-origin: 50% 50%;
    animation: dot-loader 4s infinite ease-in-out;
}

@keyframes dot-loader {
    0% {
        box-shadow: #f86 -14px -10px 0 5px,
            #fc6 14px -10px 0 5px,
            #6d7 14px 10px 0 5px,
            #4ae -14px 10px 0 5px;
    }

    8.33% {
        box-shadow: #f86 14px -10px 0 5px,
            #fc6 14px -10px 0 5px,
            #6d7 14px 10px 0 5px,
            #4ae -14px 10px 0 5px;
    }

    16.67% {
        box-shadow: #f86 14px 10px 0 5px,
            #fc6 14px 10px 0 5px,
            #6d7 14px 10px 0 5px,
            #4ae -14px 10px 0 5px;
    }

    25% {
        box-shadow: #f86 -14px 10px 0 5px,
            #fc6 -14px 10px 0 5px,
            #6d7 -14px 10px 0 5px,
            #4ae -14px 10px 0 5px;
    }

    33.33% {
        box-shadow: #f86 -14px -10px 0 5px,
            #fc6 -14px 10px 0 5px,
            #6d7 -14px -10px 0 5px,
            #4ae -14px -10px 0 5px;
    }

    41.67% {
        box-shadow: #f86 14px -10px 0 5px,
            #fc6 -14px 10px 0 5px,
            #6d7 -14px -10px 0 5px,
            #4ae 14px -10px 0 5px;
    }

    50% {
        box-shadow: #f86 14px 10px 0 5px,
            #fc6 -14px 10px 0 5px,
            #6d7 -14px -10px 0 5px,
            #4ae 14px -10px 0 3px;
    }

    58.33% {
        box-shadow: #f86 -14px 10px 0 5px,
            #fc6 -14px 10px 0 5px,
            #6d7 -14px -10px 0 5px,
            #4ae 14px -10px 0 5px;
    }

    66.67% {
        box-shadow: #f86 -14px -10px 0 5px,
            #fc6 -14px -10px 0 5px,
            #6d7 -14px -10px 0 5px,
            #4ae 14px -10px 0 5px;
    }

    75% {
        box-shadow: #f86 14px -10px 0 5px,
            #fc6 14px -10px 0 5px,
            #6d7 14px -10px 0 5px,
            #4ae 14px -10px 0 5px;
    }

    83.33% {
        box-shadow: #f86 14px 10px 0 5px,
            #fc6 14px -10px 0 5px,
            #6d7 14px 10px 0 5px,
            #4ae 14px 10px 0 5px;
    }

    91.67% {
        box-shadow: #f86 -14px 10px 0 5px,
            #fc6 14px -10px 0 5px,
            #6d7 14px 10px 0 5px,
            #4ae -14px 10px 0 5px;
    }

    100% {
        box-shadow: #f86 -14px -10px 0 5px,
            #fc6 14px -10px 0 5px,
            #6d7 14px 10px 0 5px,
            #4ae -14px 10px 0 5px;
    }
}