<ul id="m_menu">
  <li><a href="#" class="m">메뉴1</a>
    <ul>
      <li><a href="#" class="m">메뉴1_1</a>
        <ul>
          <li><a href="#">메뉴1_1_1</a></li>
          <li><a href="#">메뉴1_1_2</a></li>
        </ul>
      </li>
      <li><a href="#" class="m">메뉴1_2</a>
        <ul>
          <li><a href="#">메뉴1_2_1</a></li>
          <li><a href="#">메뉴1_2_2</a></li>
        </ul>
      </li>
      <li><a href="#" class="m">메뉴1_3</a>
        <ul>
          <li><a href="#">메뉴1_3_1</a></li>
          <li><a href="#">메뉴1_3_2</a></li>
        </ul>
      </li>
    </ul>
  </li>
  <li><a href="#" class="m">메뉴2</a>
    <ul>
      <li><a href="#">메뉴2_1</a></li>
      <li><a href="#">메뉴2_2</a></li>
      <li><a href="#">메뉴2_3</a></li>
    </ul>
  </li>
  <li><a href="#" class="m">메뉴3</a>
    <ul>
      <li><a href="#">메뉴3_1</a></li>
      <li><a href="#">메뉴3_2</a></li>
      <li><a href="#">메뉴3_3</a></li>
    </ul>
  </li>
</ul>

* {
  margin: 0;
  padding: 0;
}
li {
  list-style: none;
}
a {
  font-family: "굴림", sans-serif;
  color: #999;
  font-size: 0.9em;
  text-decoration: none;
}
#m_menu{
  position: absolute;
  width: 50%;
  height: 100%;
  background: #262626;            
}
#m_menu a{
  display: block;
  padding: 20px;
  border-top: 1px solid #2e2e2e;
  border-bottom: 1px solid #2e2e2e;            
}
#m_menu a.m{            
  background: #111; 
  font-weight: bold;
}
#m_menu a.m.on{
  color: #ff6600;            
}
#m_menu ul a{            
  background: #3a3a3a;
  text-indent: 20px;
}
#m_menu li ul{
  display: none;
} 
#m_menu li ul.on{
  display: block;
}