.navbar-fixed::after {
  clear: both;
  content: "";
  display: block;
  
}
.navbar-fixed{transition: all .5s;}
.navbar-fixed.is-hidden {
  -webkit-transform: translateY(-100%);
      -ms-transform: translateY(-100%);
          transform: translateY(-100%);
		  transition: all .5s;
}


#hamburger{display: none;}
.navmenu{ float:right;}

.nav-menu{
	overflow-y:visible;
	margin: 0 auto;
	 margin-right:40px;
}
.nav-menu li{
	float: left;
	width:6vw;
	height: 70px;
	line-height:70px;
	text-align: center;margin:0; padding:0; position:relative
}

.nav-menu li i{ position:absolute; top:100%; left:50%;}
.nav-menu li a{
	color: #666;
	background: #fff; display:block; letter-spacing:2px;transition: all .3s;
}
.nav-menu li a:hover,.nav-menu li a.current{
	color: #fff;
	background: #38ae00;transition: all .3s;
}
.nav-menu li .second-nav{
	padding:0; 
	display: none;
	position: relative;
}
.nav-menu li .second-nav li{
	position: relative;
	width: 100%;
	height: 2.5vw;
	line-height: 2.5vw;
}

	
.nav-menu li .second-nav li a{
	height: 2.5vw;
	line-height: 2.5vw;
    color: #666;
	background: #fff;transition: all .3s;
}
.nav-menu li .second-nav li a:hover{
	height: 2.5vw;
	line-height: 2.5vw;
    color: #fff;
	background: #38ae00;
	transition: all .3s;
}
@media (min-width: 1921px){
.nav-menu li{
	width:5vw;
}
.nav-menu li .second-nav li{

	height: 2vw;
	line-height: 2vw;
}
.nav-menu li .second-nav li a{
	height: 2vw;
	line-height: 2vw;
    color: #666;
	background: #fff;transition: all .3s;
}
.nav-menu li .second-nav li a:hover{
	height: 2vw;
	line-height: 2vw;
    color: #fff;
	background: #38ae00;
	transition: all .3s;
}
	}
.nav-menu li .second-nav li .third-nav{
	/*position: absolute;*/
	height: 200px;
	display: none;
	margin-left: 100%;
	margin-top: -40px;
}
.nav-menu li.pro{ width: 80px;  margin:0; padding:0;text-align:center; margin:0 auto;  }
.nav-menu li.pro img{ width:32px; height:32px; margin:0; padding:0;  border-radius:32px;overflow:hidden;}

.attr-nav{position:absolute; right:0; top:50%; padding:0; transform: translate(0, -50%);}
.attr-nav>ul{padding:0;list-style:none;display:inline-block}
.attr-nav>ul>li{float:left;display:block}
.attr-nav>ul>li>a{color:#6f6f6f;display:block;padding:0 0;position:relative}
.attr-nav>ul>li>a span.badge{position:absolute;top:50%;margin-top:-15px;right:5px;font-size:10px;padding:0;width:15px;height:15px;padding-top:2px}
.attr-nav>ul>li i.vip{ width:18px; position:relative; margin:0 auto;  text-align:center; padding:0 0; line-height:16px; cursor:pointer;  }
.attr-nav>ul>li i.vip img{ width:18px; height:18px; }

.attr-nav>ul>li>a span.badge,nav.navbar .share ul>li>a:focus,nav.navbar .share ul>li>a:hover,ul.cart-list>li.total>.btn{background-color:#f43438}
.badge{display:inline-block;min-width:10px;padding:3px 7px;font-size:12px;font-weight:700;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:middle;background-color:#777;border-radius:10px}
.dropdown,.dropup{position:relative}
.dropdown-toggle:focus{outline:0}
.dropdown-menu{position:absolute;top:60px;left:-53px;z-index:1000;display:none; padding:5px 10px;font-size:14px;text-align:left;list-style:none;background-color:#fff;-webkit-background-clip:padding-box;background-clip:padding-box;border-radius:4px;border:none;}
.dropdown-menu .arrow-up { position:absolute; top:-8px; left:50%; margin-left:-4px;
 width: 0; 
 height: 0; 
 border-left: 8px solid transparent; /* left arrow slant */
 border-right: 8px solid transparent; /* right arrow slant */
 border-bottom: 8px solid #fff; /* bottom, add background color here */
 font-size: 0;
 line-height: 0;
}
.dropdown-menu li{ padding:5px 0; text-align:center;}
dropdown-menu li a{background:#fff; color:#333;transition: all .3s;}
.dropdown-menu li a:hover{ background:#38ae00; color:#FFF;transition: all .3s;}



@media (max-width: 768px) {
	.navmenu{float:none;width: 100%;}
	.attr-nav{ position:absolute; right:60px;}
	.dropdown-menu{position:absolute;top:45px;}

	 #menu_list { float:none; background:#FFF; }
   
   
   .nav-menu{
	width:100%;
	margin: 0 auto;
	margin-right:0;background: #fff;
}
.nav-menu li{
	float: none;
	width: 100%;
	height:auto;
	line-height:40px;
	text-align: center;margin:0 0; padding:5px 0;
}
.nav-menu li .second-nav li{margin:0; padding:0;}
.nav-menu li .second-nav li a{
	height: 45px;
	line-height: 45px;
    color: #666;
	background: #ebebeb;
}
.nav-menu li.pro{ width: 100%;  margin:0; padding:0;text-align:center; margin:0 auto;  }
.nav-menu li.pro img{ width:32px; height:32px; margin:0; padding:0;  border-radius:32px;overflow:hidden;}
  #hamburger {display:block;position:absolute; right:0; top:0;
		padding:13px 20px;
    }
	.hamburger .line{
  width: 20px;
  height: 1px;
  background-color: #868686;
  display: block;
  margin: 6px auto;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.hamburger:hover{
  cursor: pointer;
}

#hamburger.is-active{
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  -webkit-transition-delay: 0.6s;
  -o-transition-delay: 0.6s;
  transition-delay: 0.6s;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#hamburger.is-active .line:nth-child(2){
  width: 0px;
}

#hamburger.is-active .line:nth-child(1),
#hamburger.is-active .line:nth-child(3){
  -webkit-transition-delay: 0.3s;
  -o-transition-delay: 0.3s;
  transition-delay: 0.3s;
}

#hamburger.is-active .line:nth-child(1){
  -webkit-transform: translateY(6px);
  -ms-transform: translateY(6px);
  -o-transform: translateY(6px);
  transform: translateY(6px);
}

#hamburger.is-active .line:nth-child(3){
  -webkit-transform: translateY(-8px) rotate(90deg);
  -ms-transform: translateY(-8px) rotate(90deg);
  -o-transform: translateY(-8px) rotate(90deg);
  transform: translateY(-8px) rotate(90deg);
}
#menu_list{ height:100%; padding:80px 20px;}
   #menu_list .list a{ background:none;border-bottom:none; width:100%; font-size:15px; margin:0; padding:0;}
   #menu_list .list a:hover{background:none;border-bottom:none;}
      #menu_list .list a span{ display:block}
	  #menu_list li.vip .arrow-up { position:absolute; top:-8px; left:50%; margin-left:-8px;
 width: 0; 
 height: 0; 
 border-left: 8px solid transparent; /* left arrow slant */
 border-right: 8px solid transparent; /* right arrow slant */
 border-bottom: 8px solid #38ae00; /* bottom, add background color here */
 font-size: 0;
 line-height: 0;
}
#menu_list li.vip{ margin:0 auto; text-align:center; }

#menu_list li.vip .menulayer{width:180px; padding:10px 10px; background:#38ae00;  color:#FFF; position:absolute;top:46px; left:-80px; z-index:3000;border-radius:3px; text-align:center;}
	#menu_list li.vip .menulayer a{ color:#FFF; border-bottom:none; }
	#menu_list li.vip .menulayer p{ width:50%; }


	}
@media (orientation : landscape) { /*　　这是匹配横屏的状态，横屏时的css代码　　*/
.nav-menu{
	 max-height:270px;overflow-y:scroll; 
}
} 
@media (min-width: 768px) {
	.nav-menu{overflow-y:visible}
	}
@media all and (orientation : portrait){ /*　　这是匹配竖屏的状态，竖屏时的css代码　　*/

} 