#CatNavi {
  -webkit-transition: none;
  -moz-transition: none;
  -o-transition: none;
  transition: none;
  -webkit-transform-style: preserve-3d;
  overflow: hidden;
  margin: 0 auto;
  width: 100%;
  max-height: 0;
  position:relative;
z-index:999!important;
}



#CatNavi.show {
  max-height: 2000px;
  background:#fff;
  -webkit-transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  transition: 1s;

  
}

#CatNavi li {
  font-size: 100%;
  position: relative;
  overflow: hidden;
  margin-bottom:0;
}


#CatNavi li a {
  position: relative;
  display: block;
  padding: 10px;
  z-index: 20;
  overflow: hidden;
  color: #222222;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}
#CatNavi li a:hover {color:#ff7c2b} 
#CatNavi li ul {
  min-width: 210px;
  background: #fff;
  display:none;
  margin:0;
  border-bottom:3px solid #ff7c2b;
}

#CatNavi li ul li {
  font-size: 100%;
  position: relative;
  overflow: hidden;
}

#CatNavi li ul.show li {
  overflow: visible;
}

#CatNavi li ul li a {
  display: block;
  background: #fff;

}

#CatNavi ul li ul li a {
  background: #fff;
}

#CatNavi ul li ul li ul li a {
  background: #cbcbc9;
}

#CatNavi .touch-button {
  position: absolute;
  z-index: 999;
  top: 0;
  right: 0;
  width: 20px;
  height: 45px;
  display: inline-block;
  text-align: center;
}

#CatNavi .touch-button:hover {
  cursor: pointer;
}

#CatNavi .touch-button .navicon {
  position: relative;
  top: 10px;
  font-size: 12px;
  color: #ff7c2b;
}
html.touch #CatNavi .touch-button .navicon {font-size: 16px;}

#CatNavi li.CatLevel1:hover>a,#CatNavi li.CatLevel2:hover>a{color:#ff7c2b}



@media all and (min-width: 860px) {

#CatNavi {overflow: visible;}
html.touch #CatNavi .touch-button {width:30px;background:#efefef}
html.touch #CatNavi .touch-button .navicon {font-size:16px;margin-left:5px}
#CatNavi li.CatLevel1 ul { display:none;}
#CatNavi li.CatLevel1.item-with-ul{padding-right:15px}
#CatNavi li.CatLevel1.item-with-ul:last-child {border-bottom:none}
html.touch #CatNavi li.CatLevel1.item-with-ul{padding-right:30px}
  #CatNavi li.item-with-ul {
    position: relative;
    list-style: none;
    float: left;
    display: block;
    overflow: visible;
	
  }
 #CatNavi li.CatLevel1:hover {background:#fff}
    #CatNavi li {
    position: relative;
    list-style: none;
    float: left;
    display: block;
    overflow: visible;
  }
 #CatNavi li.CatLevel2:hover .touch-button {
-moz-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
}
#CatNavi a.Current, #CatNavi a.CurrentParent {letter-spacing:1px;color:#ff7c2b;}
  #CatNavi li a {
    border-left: 1px solid #efefef;
    border-bottom: none;
  }

  #CatNavi li > ul {
    position: absolute;
    top: auto;
    left: 0;
  }

  #CatNavi li > ul li {
    width: 100%;
  }

  #CatNavi li ul li > ul {
    margin-left: 100%;
    top: 0;
  }

  #CatNavi li ul li a {
    border-bottom: 1px solid #ccc;
  }

  #CatNavi li ul.open {
    display: block;

    visibility: visible;
    z-index: 999;
  }

  #CatNavi li ul.open li {
    overflow: visible;
    max-height: 100px;
  }

  #CatNavi li ul.open ul.open {
    margin-left: 100%;
    top: 0;
  }


  .menu-button {
    display: none;
  }
 
}

@media all and (max-width: 860px) {
.nav-outer {padding:0!important}
.menu-button .touch-button {display:none}
.menu-button {
		color: #444;
		height: 40px;
		line-height: 40px;
		font-size:18px;
		padding: 0 80px 0 20px;
		margin-top:7px;
		display: inline-block; 
		text-align:left;
		font-weight:bold;
		cursor:pointer;
-moz-transition: all 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;-ms-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out;transition:all 0.5s ease-in-out;
	}
.menu-button .ui-icon{margin:3px 10px 0 0;font-size:24px;}
.menu-button.active.ui-icon{color:#ff7c2b}
.menu-button .touch-button .navicon {
  font-size: 16px;
  position: relative;
  top: 1em;
  color: #666;
}
#CatNavi li a {font-size:18px;padding:10px 0 10px 20px}
#CatNavi li a:hover ,#CatNavi li.CatLevel1:hover>a,#CatNavi li.CatLevel2:hover>a {color:#ff7c2b} 
#CatNavi li.CatLevel1 {background:#bbb}
html.touch #CatNavi .touch-button 
html.touch #CatNavi .touch-button ,#CatNavi .touch-button {
  position: absolute;
  z-index: 999;
  top: 0;
  right: 0;
  width: 55px;
  background:#efefef;
  height: 48px;
  display: inline-block;
  text-align: center;
}
#CatNavi .touch-button .navicon { top: 10px;font-size: 16px;}
 .touch-button.active .navicon  { -moz-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
-o-transform: rotate(-180deg);
-webkit-transform: rotate(-180deg);
transform: rotate(-180deg);}
#CatNavi li ul {
  border-top:none;
  border-bottom:none;
  z-index: 99999;
}
#CatNavi li ul li a {
  display: block;
  background: #ddd;
}
#CatNavi ul li ul li a {background: #efefef;}

#CatNavi .CatLevel2 a {padding:10px 0 10px 20px;color:#333}
#CatNavi .CatLevel3 a {padding:10px 0 10px 40px;color:#555}
#CatNavi a.Current, #CatNavi a.CurrentParent {font-weight:bold;}
}


@media all and (max-width: 600px) {
#CatNavi .touch-button{width:55px!important;}

}



