쇼핑몰 홈페이지를 꾸미고 있습니다.

첨부 이미지에 보시면 중앙 스크롤레이어가 카테고리를  가리고 있습니다.

스크롤 레이어를 밑으로  깔고 싶은데 어떻게 해야 하나요? 

스크롤레이어 소스
(첨부파일에 스크립트 소스 있습니다)
<table width="900" border="0" cellspacing="0" cellpadding="0" align="center">
          <tr>
<td height="140" align="center" background="/web/upload/main_bb.gif">
<TABLE width=830 height="120" border=0 align=center cellPadding=0 cellSpacing=0 bgcolor="">
<TBODY>
<TR>
<TD vAlign=top height=120><!-- 부모레이어 -->
<div style="position:relative;left:1px; top:0px;">
<!-- 자식레이어1 -->
<div id=scroll_div onMouseOver=mouse=0 style="width:830px; height:120px; position:absolute;z-index:1; OVERFLOW: hidden;" onMouseOut=mouse=2>
<script language=JavaScript>startText_m();</script></div>
<!-- 부모레이어 끝 -->
      </div></TD>
    </TR>
  </TBODY>
</TABLE></td>
          </tr>

카테고리소스
 <tr onmouseover="javascript:Layer_rollover('{{$image_id}}','{{$cate_image_over}}')" onmouseout="javascript:Layer_rollover('{{$image_id}}','{{$cate_image}}')">
    <td colspan="2">
     <a href="/front/php/category.php?cate_no={{$cate_no}}" onmouseover="javascript:Layer_overload('{{$sub_id}}','show')" onmouseout="javascript:Layer_overload('{{$sub_id}}','hide')">
      <img name='{{$image_id}}' src="{{$cate_image}}" border=0></a></td>
    <td height="20" width="10" style="position:relative">
        <DIV id="{{$sub_id}}" class="submenu" onmouseover="javascript:Layer_overload('{{$sub_id}}','show')" onmouseout="javascript:Layer_overload('{{$sub_id}}','hide')" style="position:absolute; left:-25px; top:0px; visibility:hidden; z-index:1;">
        <table cellpadding="0" cellspacing="0" border="0" width="{{$table_width}}" style="border:5px solid #cccccc" bgcolor="">
  {{$a_3_u5}}
        </table>
      </div>
    </td>
  </tr>