css 设置 animation 时单位用 rem，在苹果手机浏览器看，动画内设置的长度和动画外的宽度不一致，请问怎么解决？

.line-jumen{
                left: 8.8rem; 
                top: 3.23rem; 
                width: 1.82485rem; //这里宽度显示正常
                opacity: 0; 
                transform: rotate(202deg);
                animation: linejumen 20s linear;
                @keyframes linejumen {
                    0%{
                        opacity: 0;
                        width: 0;
                    }
                    59%{
                        opacity: 1;
                        width: 0;
                    }
                    60%{
                        opacity: 1;
                        width: 1.82485rem;//这里显示会比上面的宽度窄许多
                    }
                    100%{}
                }
            }

同样的长度单位，为什么会这样？