@charset "utf-8";
header{
	background-color: #FFF;
	position: absolute;
	top: 0px;
	width: 100%;
	z-index: 999;
}
	#nav
		{
	position: relative;
	width: 90%;
	max-width: 1500px;
	min-width: 320px;
	margin-right: auto;
	margin-left: auto;
	font-family: "微軟正黑體", "新細明體", Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #552C0D;
	z-index: 999;
	background-color: #FFF;
}
#s_logo{
	position: absolute;
	top: -2000px;
	z-index: 3;
	
}
.b_logo{
	position: absolute;
	left: 0px;
	top: 30px;
	z-index: 2;
}	

			#nav > a
			{
				display: none;text-decoration: none;
			}

			#nav li
			{
				position: relative;
			}
				#nav li a
				{
	color: #fff;
	display: inline-block;
	text-decoration: none;
				}
				#nav li a:active
				{
				
				}

			
			/* first level */

			#nav > ul
			{
	text-align: right;	float: right;		
			}
			.clearfix{width: 100%; padding-right:70px;}
			
				#nav > ul > li
				{
	display: inline-block;

	padding-top: 10px;
	padding-right: 17px;
	padding-bottom: 30px;
	padding-left: 17px;
				}
					#nav > ul > li > a
					{
						height: 100%;
						font-size: 16px;
	                    color: #552C0D;
						
						text-align: center;
					}
						#nav > ul > li:not( :last-child ) > a
						{
							
						}
						#nav > ul > li > a:hover{filter: alpha(opacity=70);opacity:0.70;}
						
						#nav .active 
						{
							
	background-image: url(../images/all/menu_line.gif);
	background-repeat: repeat-x;
	background-position: center bottom;
						}


				/* second level下拉選單 */

				#nav li ul
				{
	display: none;
	position: absolute;
	top: 100%;
	color: #552c0d;
	font-family: "微軟正黑體", "新細明體", Arial, Helvetica, sans-serif;
	line-height: 2.5em;
	font-size: 14px;
	text-align: center;
	background-color: #FFF;
	border: 1px solid #e4e4e4;
	padding-top: 1em;
	padding-right: 1.5em;
	padding-bottom: 1em;
	padding-left: 1.5em;
	width: 100%;margin-left: -20px; margin-top:-20px;
				}
					#nav li:hover ul
					{
						display: block;
						left: 0;
						right: 0;background-color: #fff;
					}
						#nav li:not( :first-child ):hover ul
						{
							left: -1px;
						}
						#nav li ul a
						{
							color: #552c0d;
							font-family: "微軟正黑體", "新細明體", Arial, Helvetica, sans-serif;
	line-height: 1.5em;
	font-size: 14px;
						}
							#nav li ul li a:hover,
							#nav li ul:not( :hover ) li.active a
							{
							filter: alpha(opacity=70);opacity:0.70;	
							}

.clearfix2{
	color: #666;
	font-family: "微軟正黑體","新細明體",Arial,Helvetica,sans-serif;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: normal;
	font-size: 14px;
	letter-spacing: 0.075em;
	outline: 0px none;
	padding-top: 20px;
	padding-right: 4px;
	padding-bottom: 0px;
	padding-left: 4px;
}

.clearfix2.withcart{
	padding-right: 80px;
	
}
#nav ul.clearfix2 li{
	float: right;
	padding-top: 16px;
	padding-right: 5px;
	padding-bottom: 20px;
	padding-left: 5px;

}
#nav ul.clearfix2 li a{color: #666;font-size: 14px;}
#nav ul.clearfix2 input{
	color: #666;
	font-size: 14px;
	font-family: "微軟正黑體", "新細明體", Arial, Helvetica, sans-serif;
	background-color: #FFF;
	vertical-align: middle;
	height: 22px;
	width: 123px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: none;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #e4e4e4;
	border-right-color: #e4e4e4;
	border-bottom-color: #e4e4e4;
	border-left-color: #e4e4e4;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	margin-top: -5px;
	padding-left: 10px;
}
#nav ul.clearfix2 input:nth-of-type(2){
	color: #fff;
	width: 34px;
	height: 26px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: none;
	border-top-color: #e4e4e4;
	border-right-color: #e4e4e4;
	border-bottom-color: #e4e4e4;
	border-left-color: #e4e4e4;
	background-image: url(../images/svg/Search.svg);
	background-repeat: no-repeat;
	background-position: center center;
	font-size: 0px;
	cursor: pointer;
	background-size: 50%;	-webkit-border-radius: 0px;
	  -moz-border-radius: 0px;
	  border-radius: 0px;margin-top: -5px; 
}
#nav ul.clearfix2 input:nth-of-type(2):hover{
filter: alpha(opacity=70);opacity:0.70;
}
#nav ul.clearfix2 br{
	display: none;

}
#nav ul.clearfix3{
	display: none;
	visibility: hidden;

}
#nav ul.clearfix2 li img{
	display: none;
	visibility: hidden;
}

/*google 10吋(橫)*/
@media (max-width: 1280px) {
#nav
		{
	position: relative;
	width: 95%;}

	 }
/*ipad(橫)*/
@media (max-width: 1100px) { 

#nav > ul > li {
    display: inline-block;
    padding: 10px 11px 25px!important;
}
.b_logo{top:35px}
.b_logo img{
	height: 85px;
}
}
@media (max-width: 960px) { 

.b_logo img:nth-of-type(2){width: 0%;}}
@media (max-width: 867px) {#s_logo img{
	width: 100px;
}}
@media (max-width: 800px) {#nav
		{
	position: relative;
	width: 98%;} }
@media (max-width: 768px) {
	header{ position: absolute!important;background-color: #FFE43B!important;box-sizing:border-box!important;border: 1px none #F4F4F4!important;}
.clearfix2{position: relative!important;visibility: visible!important;box-sizing:border-box!important;}
.clearfix > li{padding: 20px 0px 20px!important;box-sizing:border-box!important;}
	#s_logo{
	position: absolute!important;
	top: -2000px!important;
	z-index: 3!important;
		}
	#nav
		{
	position: relative!important;
	width: 100%!important;}
	.b_logo img{
	margin-left: 0px!important;
}
	.menu_bg{
	background: rgba(0,0,0,0.7)!important;
	background-repeat: repeat!important;
	position: fixed!important;
	z-index: -1!important;
	height: 100%!important;
	width: 100%!important;
	visibility: hidden;
}
	#nav ul.clearfix2 li img{
	display: inline-block!important;
	visibility: visible!important;
}
#nav ul.clearfix2 input:nth-of-type(2):hover{
filter: alpha(opacity=100)!important;opacity:1.00!important;background-color: #fff!important;
}

	#nav ul.clearfix2 li{
	font-size: 20px!important;
	color: #573c3c!important;
	padding-top: 15px!important;
	padding-right: 0px!important;
	padding-bottom: 0px!important;
	padding-left: 0px!important;
}
	#nav ul.clearfix2 br{
	display: inherit;

}

#nav ul.clearfix2 input{
	color: #666;
	font-size: 16px;
	font-family: "微軟正黑體", "新細明體", Arial, Helvetica, sans-serif;
	background-color: #FFF;
	vertical-align: middle;
	height: 40px;
	width: 75%;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: none;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #ffe43b;
	border-right-color: #ffe43b;
	border-bottom-color: #ffe43b;
	border-left-color: #ffe43b;
	margin-top: 0px; 
	padding-left: 15px;
}
#nav ul.clearfix2 input:nth-of-type(2){
	color: #fff;
	width:15%;
	height:44px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: none;
	border-top-color: #ffe43b;
	border-right-color: #ffe43b;
	border-bottom-color: #ffe43b;
	border-left-color: #ffe43b;
	background-image: url(../images/svg/Search.svg);
	background-repeat: no-repeat;
	background-position: center center;
	font-size: 0px;
	cursor: pointer;
	background-size: auto 50%;margin-top: 0px; 
}
#nav ul.clearfix2 li a{
	color: #FFF;
	background-color: #c0a600;
	width: 35%;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	font-size: 16px;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-top: 10px;
	margin-right: 10px;
	margin-left: 10px;
	margin-bottom: 25px;
}
		
	.clearfix2,.clearfix{
	background-color: #ffe43b;
	width:100%;
	text-align: left;
	padding-right: 2%;
	padding-left: 2%;
	box-sizing:border-box;
	float: left;
}

.clearfix2{
	padding-top: 90px;
}
	.b_logo{
	position: absolute;
	left: 0px;
	top: 0px;
	text-align: center;
	width: 100%;
	background-color: #FFF;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #e8e8e8;
}	
.b_logo img {
	height: 65px;
	margin-top: 5px;
}

#nav ul.clearfix2 span{
	display: none;
	visibility: hidden;
}
		#nav ul.clearfix span:after
			{
				width: 0;
				height: 0;
				border: 0.313em solid transparent; /* 5 */
				border-bottom: none;
				border-top-color: #573c3c;
				content: '';
				vertical-align: middle;
				display: inline-block;
				position: relative;
				right: -0.313em; /* 5 */
			}

			html
			{
				 /* 12 */
			}

			#nav
			{
				position: relative;
				top: auto;
				left: auto;
			}
				#nav > a
				{
	width: 3.125em; /* 50 */
	height: 3.125em; /* 50 */
	text-align: left;
	text-indent: -9999px;
	position: absolute;
	z-index: 3;
	left: 10px;
	top: 10px;
	background-image: url(../images/svg/opener.svg);
	background-repeat: no-repeat;
	background-position: center center;
	font-size: 16px;
				}
					
					#nav > a:after
					{
						top: 60%;
					}

				#nav:not( :target ) > a:first-of-type,
				#nav:target > a:last-of-type
				{
					display: block;
				}

			/* first level */

			#nav > ul
			{
	height: auto;
	display: none;
	text-align: center;		
			}
				#nav:target > ul
				{
					display: block;
				}
				#nav > ul > li
				{
					width: 100%;
					padding: 15px 0px 15px !important;
					float: none;
				}
				#nav ul.clearfix > li{
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #d3c359;
}
					#nav > ul > li > a
					{
						height: auto;
						text-align: left;
						padding: 0 0.833em; font-size: 18px;
							display: inline-block;
	width:80%;
	text-align: center;
					}
						#nav > ul > li:not( :last-child ) > a
						{
							border-right: none;font-size: 18px;
						
						}


				/* second level 下拉選單*/

				#nav li ul
				{
	position: absolute;
	padding: 1.25em;
	background-color: #573c3c;
	margin-top: 15px;
	color: #FFF;
	display: none;
	height: 0px;
	width: 0px;
	z-index: -1;
	top: -2000px;
				}
				#nav li ul a{
	color: #FFF;
	font-size: 16px;
	padding-top: 5px;
	padding-bottom: 5px;
}
				
		#nav ul.clearfix3{
	background-color: #c0a600;
	float: left;
	visibility: visible;
	width:100%;
	padding-right: 2%;
	padding-left: 2%;
	box-sizing:border-box;
	color: #FFF;
	overflow: hidden;
}
#nav ul.clearfix3 a{
	color: #FFF;

}
#nav ul.clearfix3 li:nth-of-type(1){
	border-top-style: none;
}
#nav ul.clearfix3 li{
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #d8c861;
}
#nav ul.clearfix3 li span:before{
	
	background-image: url(../images/svg/manu_map.svg);
	width: 30px;
	height: 30px;
	content: '';
	display: inline-block;
	position: relative;
	background-size: auto 80%;
	background-repeat: no-repeat;
	background-position: center center;
	vertical-align: middle;
	top: -3px;
}
#nav ul.clearfix3 li:nth-of-type(2) span:before{
	background-image: url(../images/svg/manu_mail.svg);
	background-size: auto 50%;
	top: -2px;
	left: -2px;
}

#nav ul.clearfix3 li:nth-of-type(3) span:before{
	background-image: url(../images/svg/manu_phone.svg);
	background-size: auto 70%;
	top: -2px;
	left: -2px;
}


.clearfix2.withcart{
	padding-right:0px;
	
}



		}
@media (max-width: 414px) {
	#nav ul.clearfix2 li a{
		margin-right: 5px;
margin-left: 5px;
		}
	}