/* ===================================
   版型
   ===================================*/
* {
  box-sizing: border-box;
}
ul {
  padding: 0;  
}
ul a {
  display: inline-block;
  text-decoration: none;
  color: #666;
  font-family: "微軟正黑體",Verdana,Sans-serif;  
  border-radius:5px 5px 5px 5px;
  //margin:3px 0px;  
  
}
/* ===================================
   布局樣式
   ===================================*/
.menu {
  max-width: 150px;  
  margin: 0 auto;
  list-style-type: none;
  background: #dddddd;
  border-radius:10px 10px 10px 10px;	   
}
/* ===================================
   動態效果
   ===================================*/
.drop-down {
  position: relative; 
  background: #FFFFFF;  
}
.submenu {
  position: relative;
  opacity: 0;
  width: 100%;
  z-index: 8;
  transition: opacity 0.5s ease;
}
.submenu-item {
  display: block;
  height: 0px;
  overflow: hidden;
  transition: height 0.5s ease;
}
.drop-down:hover .submenu {
  opacity: 1;
}
.drop-down:hover .submenu-item {
  overflow: visible;
  height: 30px;
}
/* ===================================
   視覺樣式
   ===================================*/
.item {
  background: #dddddd;
  width: 100%;
  height:35px;
  padding: 5px 10px;  
  border-radius:5px 5px 5px 5px;	
  border: 1px solid #555;
  
}
.item:hover {
  background: #00dddd;
}
.submenu-item {
  background: #333;  
  color: #eee;
  width: 100%;
  padding-left: 20px;
  line-height: 30px;
}
.submenu-item:hover {
  //background: #555;
  background: #ffff88;
  color: #3333ff;
}
.now .item {
  //background: #ddd;
  background: #00ff00;
}
.now .submenu {
  opacity: 1;
}
.now .submenu-item {
  background: #555;
  overflow: visible;
  height: 30px;
}