.cc__animation__scale-in {
  position: absolute;

  transform: scale(0);
  opacity: 0;
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;

  z-index: 99992;
  width: 100%;

  &--left {
    transform-origin: top left;
    left: 0;
  }

  &--right {
    transform-origin: top right;
    right: 0;
  }

  &--show {
    opacity: 1;
    transform: scale(1);
  }
}
.cc__animation__scale-in {
  position: absolute;

  transform: scale(0);
  transform-origin: top;
  opacity: 0;
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;

  z-index: 99992;
  width: 100%;

  &--left {
    transform-origin: top left;
    left: 0;
  }

  &--right {
    transform-origin: top right;
    right: 0;
  }

  &--middle {
    transform-origin: top center;
  }

  &--show {
    opacity: 1;
    transform: scale(1);
  }
}
Fix middle-animation by setting transform-origin
Fix middle-animation by setting transform-origin
