我这段 CSS3 Animation 代码为什么不能加载两段？

我想实现一个动画效果，分两段完成。前半部分是先快后慢进入画面，后一半是匀速离开画面。先执行前者，结束后再执行后者，两段都结束后会不断重复这一过程。代码大概是这样的：

@keyframes over { from { left: -100px; } to { left: calc(50% - 50px); } } @keyframes down { from { left: calc(50% - 50px); } to { left: calc(100% + 100px); } } .move { position: absolute; animation: over 1s ease-in-out infinite, down 1s linear infinite; } 

我发现总是只能执行后半部分的动画，搜索到的答案都是加个 "," 分割即可，请问我这段代码有什么问题呢？