translate3d 在ios14的safari中无效？

ios13中原生safari有效。ios14.2中的移动版chrome和微信内置浏览器有效，原生safari下 translate3d 无效。上动画代码。请问是否有解决方案

.animate {
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
}
.animate.animate_delay-fast {
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
}
.fade-in-up {
    position: relative;
    opacity: 0;
}

@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}
@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
}