/* 自定义从大变小的淡入动画 */
    @keyframes zoomInFromTop {
        0% {
            opacity: 0;
            transform: translateY(-100px);
        }

        100% {
            opacity: 1;
            transform: translateY(0px);
        }
    }

    .animate__zoom-in-from-top {
        animation-name: zoomInFromTop;
        animation-fill-mode: both;
    }

    /* 自定义从大变小的淡入动画 */
    @keyframes zoomInFromBottom {
        0% {
            opacity: 0;
            transform: translateY(100px);
        }

        100% {
            opacity: 1;
            transform: translateY(0px);
        }
    }

    .animate__zoom-in-from-bottom {
        animation-name: zoomInFromBottom;
        animation-fill-mode: both;
    }

    /* 自定义从大变小的淡入动画 */
    @keyframes zoomInFromBottomX2 {
        0% {
            opacity: 0;
            transform: translateY(200px);
        }

        100% {
            opacity: 1;
            transform: translateY(0px);
        }
    }

    .animate__zoom-in-from-bottomx2 {
        animation-name: zoomInFromBottomX2;
        animation-fill-mode: both;
    }

    @keyframes zoomInFromLarge {
        0% {
            opacity: 0;
            width: 1000px;
            transform: translateX(200px);
        }

        100% {
            opacity: 1;
            width: 682px;
            transform: scaleX(1) translateX(0px);
        }
    }

    .animate__zoom-in-from-large {
        animation-name: zoomInFromLarge;
        animation-fill-mode: both;
    }

    @keyframes zoomInFromLeft {
        0% {
            opacity: 0;
            transform: translateX(-240px);
        }

        100% {
            opacity: 1;
            transform: translateX(0px);
        }
    }

    .animate__zoom-in-from-left {
        animation-name: zoomInFromLeft;
        animation-fill-mode: both;
    }
    @keyframes zoomInWordToRight {
        0% {
            width: 0px;
        }

        100% {
            width: 120px;
        }
    }
    .animate__zoom-in-word-to-right{
        animation-name: zoomInWordToRight;
        animation-fill-mode: both;
    }

    @keyframes zoomInFromRightMicro {
        0% {
            opacity: 0;
            transform: translateX(50px);
        }

        100% {
            opacity: 0.8;
            transform: translateX(0px);
        }
    }

    .animate__zoom-in-from-right-micro {
        animation-name: zoomInFromRightMicro;
        animation-fill-mode: both;
    }

    @keyframes zoomInFromScaleX0 {
        0% {
            opacity: 0;
            transform: scaleX(0);
        }

        100% {
            opacity: 1;
            transform: scaleX(1);
        }
    }

    .animate__zoom-in-from-scalex0 {
        animation-name: zoomInFromScaleX0;
        animation-fill-mode: both;
    }

    @keyframes zoomInFromRight {
        0% {
            opacity: 0;
            transform: translateX(240px);
        }

        100% {
            opacity: 1;
            transform: translateX(0px);
        }
    }

    .animate__zoom-in-from-right {
        animation-name: zoomInFromRight;
        animation-fill-mode: both;
    }