@charset "utf-8";

body , .wrapper{ color:#333;}


/*a 鏈結字*/
a { color:#333;}
a:hover, a:focus { color:#000; text-decoration:none; }


/*====================================================================*/

.menu-wrap{ position:relative; }
.menu-header{ display:none; color:#CDB369; padding:20px 10px; margin-bottom:20px; border-bottom:1px solid #CDB369; }
/*手機板上滑出內容時出現的叉叉，在title 右側 / 'X' close icon */
.menu-close {
	display:none;
	position: absolute;
	z-index: 1;
	right: 10px;
	top: 8px;
	height: 50px;
	width: 50px;
	display:block;
	
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	color: transparent;
}
.menu-close:after, .menu-close:before {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	bottom: auto;
	right: auto;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	-o-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
	height: 22px;
	width: 4px;
	background-color:#CDB369;
}
.menu-close:after {
	-webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
	-moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);
	-ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
	-o-transform: translateX(-50%) translateY(-50%) rotate(45deg);
	transform: translateX(-50%) translateY(-50%) rotate(45deg);
}
.menu-close:before {
	-webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
	-moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
	-ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
	-o-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
	transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}
/* End 手機板上滑出內容時出現的叉叉 */

.menu-trigger{ 
	display:none; 
	background: #222; 
	color:#CDB369; 
	text-align:center; 
	padding: .5em 0;
	font-size: 1.1em;
	margin-top: 0;
}
a.menu-trigger:hover{ color:#CDB369; }
a.menu-trigger:focus{ color:#CDB369; } 

.menu-list li{ display:inline-block; position:relative; }

.menu-list li ul , .menu-list li ul ul{
	position:absolute;
	width:100%;
	
	visibility: hidden;
	opacity: 0;
	-webkit-transition: opacity 0.5s ease;
	transition: opacity 0.5s ease;
	display:none;
}
.menu-list li ul{  top:100%; left:0; }
.menu-list li ul ul{ top:0; left:100%;}

.menu-list li:hover > ul{
	/* visibility: visible;
	opacity: 1; */
}

.menu-list li a{ position:relative; display:block; padding:5px 10px; background:#222; color:#CDB369 !important; }
.menu-list li ul li , .menu-list li ul ul li{ display:block; width:100%; color:#CDB369 !important; }


.submenu-button{
	display:none;
	position:absolute;
	z-index:3;
	top:3px;
	right:5px;
	width:55px;
	height:44px;
	/*border-left:1px solid rgba(255,255,255,0.8);*/
	cursor:pointer;
	
}
.submenu-button:before{
	position:absolute;
	z-index:4;
	top:50%;
	left:50%;
	width:10px;
	height:10px;
	/*
	border-top:1px solid rgba(255,255,255,1);
	border-right:1px solid rgba(255,255,255,1);
	*/
	border-top: #CDB369 1px solid;
	border-right: #CDB369 1px solid;
	margin-top:-5px;
	margin-left:-5px;
	content:"";
	transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	-o-transform:rotate(45deg);
	
}

.menu-wrap.show{ display:block; }



@media only screen and (max-width: 960px) {
	.menu-trigger , .menu-header , .menu-close{ display:block; color: #CDB369 !important; }

	/*.menu-list{ display:block; }*/
	.menu-list li{ display:block; }
	.submenu-button{ display:block;}
	.menu-list li a{ padding-right:65px; }
	.menu-list li ul , .menu-list li ul ul{ 
		position:relative; 
		top:0; 
		left:0; 
		visibility: visible;
		opacity: 1;
		display:none;
		-webkit-transition: none;
		transition:none;
	}
	
	.menu-list li ul li a{ padding-left:25px; }
	.menu-list li ul li ul li a{ padding-left:41px; }
	.menu-list li ul li ul li ul li a{ padding-left:56px; }
	
	.menu-wrap{
		position: fixed;
		z-index: 1000;
		top: 0;
		left:0;
		width: 100%;
		height: 100%;
		background:#222;
		
		overflow-x: hidden;
		overflow-y: auto;
		/* display:none; */
		/* opacity:0; */
		visibility: hidden; 
	
		/*Force Hardware Acceleration */
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		
		-webkit-transform: translateZ(0);
		-moz-transform: translateZ(0);
		-ms-transform: translateZ(0);
		-o-transform: translateZ(0);
		transform: translateZ(0);
		
		-webkit-transform: translateX(-100%);
		-moz-transform: translateX(-100%);
		-ms-transform: translateX(-100%);
		-o-transform: translateX(-100%);
		transform: translateX(-100%);

		-webkit-transition: -webkit-transform 0s 0s, visibility 0s 0.5s;
		-moz-transition: -moz-transform 0s 0s, visibility 0s 0.5s;
		transition: transform 0s 0s, visibility 0s 0.5s;
		
	}
	/*mobile 選單開啟*/
	.menu-wrap.is-open {
		/* opacity:1; */
		visibility: visible;
		-webkit-transform: translateX(0);
		-moz-transform: translateX(0);
		-ms-transform: translateX(0);
		-o-transform: translateX(0);
		transform: translateX(0);
		-webkit-transition: -webkit-transform 0.5s 0s, visibility 0s 0s;
		-moz-transition: -moz-transform 0.5s 0s, visibility 0s 0s;
		transition: transform 0.5s 0s, visibility 0s 0s;
		
		/* display:block; */
	}

}

@media (min-width: 768px) {
	.menu-trigger, .menu-wrap { display: none !important; }
}

@media (max-width: 767px) {
	/*.header-dec { display: none; }*/
}