https://developer.mozilla.org/ko/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing
위쪽 경계가 겹치는 블럭들의 margin-top이 한개로 동작하는 현상
즉 내부 블럭의 margin-top이 외부 블럭의 margin-top처럼 동작함
이유 : 없음
inline-block으로 배치를 하면 블럭들 사이에 여백이 생김.
어떠한 요소에도 포함되지않는 그냥 생기는 것.
결론: inline-block는 쓰지말고 flex, grid만 쓰자