css 문의드립니다~

1번에서 2번으로 되게 하고 싶은데 스타일을 어떻게 줘야할지 모르겠어서 문의드립니다~

 

도와주세요! o. 0

 

<div style="width:100%; height:37px;  background:url(/data/skin/streetgirl/main/topmenu_bkl.jpg) repeat-x;">
 <div class="li_left" style="position:relative; ">
  <ul style="z-index:1; ">
   <li class="DB_main m1"><a href="#"><img src="/data/skin/streetgirl/main/topmenu_01.jpg" border=0 onmouseover="this.src='/data/skin/streetgirl/main/topmenu_01_over.jpg'" onmouseout="this.src='/data/skin/streetgirl/main/topmenu_01.jpg'"></a>
    <div class="DB_sub" style="z-index:2; position:absolute; ">
     <ul>
      <li style="padding-left:27px; text-align:left; " class="top01">
       <dl>
        <dt><a href="/page/index?tpl=company%2Fceo.html">1</a></dt>
       </dl>
      </li>
      <li style="padding-left:8px; text-align:left; ">
       <dl>
        <dt><a href="/page/index?tpl=company%2Fhealth.html">2</a></dt>
        <dd><a href="/page/index?tpl=company%2Fhealth.html">3</a></dd>
        <dd><a href="/page/index?tpl=company%2Fhealth.html">4</a></dd>
        <dd><a href="/page/index?tpl=company%2Fhealth.html">5</a></dd>
       </dl>
      </li>
      <li style="padding-left:23px; text-align:left; ">
       <dl>
        <dt><a href="/page/index?tpl=company%2Fpeople1.html">6</a></dt>
        <dd><a href="/page/index?tpl=company%2Fpeople1.html">7</a></dd>
        <dd><a href="/page/index?tpl=company%2Fpeople2.html">8</a></dd>
       </dl>
      </li>
      <li style="padding-left:50px; text-align:left; ">
       <dl>
        <dt><a href="/page/index?tpl=etc%2Fglobal.html">9</a></dt>
       </dl>
      </li>
      <li style="padding-left:49px; text-align:left; ">
       <dl>
        <dt><a href="/page/index?tpl=company%2Fhyublyuk.html">10</a></dt>
       </dl>
      </li>
     </ul>
    </div>  
   </li>
  </ul>
 </div>
</div>