.world 클래스

• 스크롤이 된다는것은 문서의 크기가 브라우저 크기보다 크다는것.
• 하지만 스크롤이 되면 일반적으로 콘텐츠가 위에서 아래로 내려가지 않는다.. 앞에 그대로 있다.
• 제일 최상단인 world 요소는 position : fixed 로 위치해 있다.
• position : fixed가 아니면 스크롤이 위로 올라갈 거임;;

.world {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  perspective: 1000px;
}

.stage 클래스

• stage요소가 존재하는 이유 : 캐릭터들을 동적으로 추가할 위치 및 캐릭터와 벽을 감싸는 div
• transform-style : preserve-3d perspective로 최상단에 3d 공간을 확보하고, 중간요소에는 이 3d영역을 전파 하기 위해 transform: preserved-3d를 준다. 제일 아래 영역도 3d를 먹는다.

.stage {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  transform-style: preserve-3d;
}

.house 클래스

• 애초에 default 가 꽉차게 사이즈를 가져가고 스크롤에따라 transform으로 멀게 한다.

.wall 클래스

• 모든 벽들(6개)은 position:aboslute 로 포갠다.

.wall-left, wall-right 클래스