답변 드리겟습니다.

모바일에서 레이어가 겹쳐 보이는 현상은 높이 값이 따로 지정 되어 있지 않은 경우에서 

<li></li> 엘리먼트가 float:left; 라는 정렬의 속성을 가지고 있기 때문에 감싸고 있는 레이어의 높이가 알 수가 없게 됩니다.

default.css의 min-height(최소 높이) 값이 240px 로 가져 가는 것이기 때문에 그만큼의 높이가 인식 되게 되는것이구요.

원인은 이렇하구요

해결 방법은 여러 가지가 있습니다.

가장 간단한 방법은 고정으로 높이 값을 가져 가시는 방법 이 있구요 ex) height:400px; or min-height:400px;

또하나는 지금 있는 css 속성 ul도 괜찮고 상위에 div 도 괜찮고요 이 들 중에 속성에다가 overflow : hidden; 이라는 속성을 추가 해주시면

해당 컨텐츠가 들어가는 높이 만큼 자동으로 잡히게 됩니다.

그외에 방법들은 조금만 검색 하시면 얻을 수 있을 듯 합니다.

답변이 도움이 되셨기를 바랍니다.

수고하세요.