(CSS) 메뉴배경 색상과 드롭다운 배경 색상을 각각 다르게 주고 싶습니다. 채택완료

<div style="float:left">                                   <ul class="menu">                                       <li1><a href="#">ABOUT</a>                                         <ul class="sub">                                            <li><a href="#">ABOUT KOTEKA</a></li>                                            <li><a href="#">CORE TECH</a></li>                                            <li><a href="#">PRODUCTS</a></li>                                            <li><a href="#">NOTICE</a></li>                                            <li><a href="#">CONTACT</a></li>                                            <li><a href="#">SHOP</a></li>                                         </ul>                                         </li1>                                        <li2><a href="#">CORE</a>                                        <ul class="sub">                                            <li><a href="#">ABOUT KOTEKA</a></li>                                            <li><a href="#">CORE TECH</a></li>                                            <li><a href="#">PRODUCTS</a></li>                                            <li><a href="#">NOTICE</a></li>                                        </ul>                                        </li2>                                        <li3><a href="#">PRODUCTS</a>                                        <ul class="sub">                                            <li><a href="#">ABOUT KOTEKA</a></li>                                            <li><a href="#">CORE TECH</a></li>                                            <li><a href="#">PRODUCTS</a></li>                                        </ul>                                        </li3>                                        <li4><a href="#">NOTICE</a>                                        <ul class="sub">                                            <li><a href="#">ABOUT KOTEKA</a></li>                                            <li><a href="#">CORE TECH</a></li>                                            <li><a href="#">PRODUCTS</a></li>                                            <li><a href="#">NOTICE</a></li>                                        </ul>                                        </li4>                                        <li5><a href="#">SHOP</a>                                        </li5>                                                                                                                                                           </ul>                                </div>​

​ul.menu li1{  float: left; width: 100px; height: 40px; background-color:#ef3e36; position: relative; }ul.menu li2{  float: left; width: 95px; height: 40px; background-color:#ef3e36; position: relative; }ul.menu li3{  float: left; width: 130px; height: 40px; background-color:#ef3e36; position: relative; }ul.menu li4{  float: left; width: 105px; height: 40px; background-color:#ef3e36; position: relative; }ul.menu li5{  float: left; width: 80px; height: 40px; background-color:#ef3e36; position: relative; }ul.menu li1 a{ display: block; width: 100%; height:40px; line-height: 40px; text-indent: 10px; font-weight: bold; color:#FFF; text-decoration: none; background-color:#ef3e36;  }ul.menu li2 a{ display: block; width: 100%; height:40px; line-height: 40px; text-indent: 10px; font-weight: bold; color:#FFF; text-decoration: none; background-color:#ef3e36;  }ul.menu li3 a{ display: block; width: 100%; height:40px; line-height: 40px; text-indent: 10px; font-weight: bold; color:#FFF; text-decoration: none; background-color:#ef3e36;  }ul.menu li4 a{ display: block; width: 100%; height:40px; line-height: 40px; text-indent: 10px; font-weight: bold; color:#FFF; text-decoration: none; background-color:#ef3e36;  }ul.menu li5 a{ display: block; width: 100%; height:40px; line-height: 40px; text-indent: 10px; font-weight: bold; color:#FFF; text-decoration: none; background-color:#ef3e36;  }ul.menu li1 a:hover{ background-color:#F90; text-decoration:underline;  }ul.menu li2 a:hover{ background-color:#F90; text-decoration:underline;   }ul.menu li3 a:hover{ background-color:#F90; text-decoration:underline;  }ul.menu li4 a:hover{ background-color:#F90; text-decoration:underline;  }ul.menu li5 a:hover{ background-color:#F90; text-decoration:underline;  }ul.menu li1 ul.sub{ position: absolute; width:200px; }ul.menu li2 ul.sub{ position: absolute; width:200px; }ul.menu li3 ul.sub{ position: absolute; width:200px; }ul.menu li4 ul.sub{ position: absolute; width:200px; }ul.menu li5 ul.sub{ position: absolute; width:200px; }ul.menu{ zoom: 1; }ul.menu:after{ height: 0; visibility: hidden; content: "."; display: block; clear: both; }​​