@keyframes example{
  0% {
    top:0;
    left: 0;
  }
  25% {
    top:0;
    left: 67%;
  }
  50% {
    top: 67%;
    left: 67%;
  }
  75%{
    top: 67%;
    left: 0;
  }
  100% {
    top: 0;
    left: 0;
  }
}

.box{
  position: relative;
  width: 100px;
  height: 100px;
  background: red;
  animation-name: example;
  animation-duration: 4s;
  animation-delay: 2s;
  animation-iteration-count: infinite; 
  animation-fill-mode: both; 
}
.wrapper{
  width: 300px;
  height: 300px;
  border:1px solid black;
/*   tranform: translateY(-100%); */
}