css 126라인

#gnbWrap {width:1000px; margin : 0 auto;}

를

#gnbWrap {width:1000px; margin : 0 auto;position:relative}

로 빨간 부분을 추가하시면 됩니다.

에구 그리하면 배경이미지가 깨지는구나

대강 메뉴가

<ul id="gnbWrap" class="over2dth">

<li style="margin-bottom: 35px;">

<a href="../info/01_beautyline.php" class="gnb1">병원소개</a>

<ul style="height: 0px;">

<ul style="height: 0px;">

<li style="margin-bottom: 35px;">

이런 구조로 나가는데요

<ul id="gnbWrap" class="over2dth">

<li style="margin-bottom: 35px;">

<a href="../info/01_beautyline.php" class="gnb1">병원소개</a>

<div style="height: 0px;">

<ul class="sub1" style="height: 0px;">

<li style="margin-bottom: 35px;">

첫 ul을 div로 바꾸시고요 (이게 html을 정상으로 사용하는 겁니다)

하위 ul에 구분할 수 있게 클라스 명을 넣은 다음에

css에 .sub1{width:1000px; margin : 0 auto;}을 추가 하시면 될겁니다.

첫번째 댓글에 단 

#gnbWrap {width:1000px; margin : 0 auto;position:relative}

이건 무시하시고요.

==========================

추가하면 <div> 로 바꾸시면 나중에 닫는 부분도 </ul>을  </div>로 바꾸셔야 합니다.

2. 이 높이가 처음 로딩시엔 얇게 설정해놓았는데 메뉴에 마우스오버한 후엔 그림과 같이 너무 벌어져버려요

이 부분은 js문제입니다.

메뉴쪽에 마우스를 올렸을때 첫번째 li에 margin-bottom:85px을 잡아주는거 까지는 문제가 없는데 문제는 마우스가 벗어날때 

margin-bottom:35px을 잡아주는군요.

35가 안잡히게 하시면 똑같은 공간을 보실 수 있을겁니다.