
   .oragne{background:#ff7c00!important;color:#fff!important;}
   .orange > a{background:#ff7c00;color:#fff!important;}
   .orange:hover{background:#fff;color:#44372D!important;}
    .orange li{background:#DDDBCC;top:0;clear: both;width: 100%;}
   .orange{display: block;width: 100%;padding:0;float:left;font-size:14px;
    /*position:relative;*/
  box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;border-top:1px solid #61554b;}  
  .orange a{width: 100%;display:block;padding:15px 20px 15px 19px;color: #D1CEBF;
   text-decoration:none;
   box-sizing:border-box;
   -moz-box-sizing:border-box;
   -webkit-box-sizing:border-box;
   -o-transition: all .3s ease-in-out;
   -webkit-transition: all .3s ease-in-out;
   -moz-transition: all .3s ease-in-out;
   transition: all .3s ease-in-out;}
   
   
   
   .dark{
   background: #463a2e!important;}
   
   .dark li{top:0;clear: both;width: 100%;}
   .dark{display: block;width: 100%;padding:0;float:left;font-size:14px;
         box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;border-top:1px solid #61554b;}
  
  
  
  .dark a{width: 100%;display:block;padding:15px 20px 15px 19px;color: #D1CEBF;
   text-decoration:none;
   box-sizing:border-box;
   -moz-box-sizing:border-box;
   -webkit-box-sizing:border-box;
   -o-transition: all .3s ease-in-out;
   -webkit-transition: all .3s ease-in-out;
   -moz-transition: all .3s ease-in-out;
   transition: all .3s ease-in-out;}
 
   .dark.active > a{background:#ff7c00;color:#fff!important;}
   .dark:hover > a{color: #44372D;background: #fff;} 
  


ul.vertical-nav, ul.vertical-nav li {
	list-style: none;
	font-family: 微軟正黑體 !important;
}
ul.vertical-nav {
	height:200px;
	background: #463a2e;
	width:230px;
}
/* 選單 li 之樣式 */
			ul.vertical-nav li {
	/*	position: relative;*/
		
          width:100%;
}
/* 選單 li 裡面連結之樣式 */
	ul.vertical-nav li a {
	display: block;
	padding: 12px 20px;
	color: #FFF;
	-o-transition: all .3s ease-in-out;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}
/* 特定在第一層，以左邊灰線分隔 */
			ul.vertical-nav > li > a {
/*	border-bottom: 1px solid #CCC;	*/
			}
ul.vertical-nav > li > a:hover {
	color: #463a2e;
	background: #fff
}
/* 特定在第一層 > 第二層或以後下拉部分之樣式 */
	ul.vertical-nav ul {
	display: none;
	position: absolute;
	left: 100%;
	margin: 0;z-index: 9999 !important;
}
/* 當第一層選單被觸發時，指定第二層顯示 */
	ul.vertical-nav li:hover > ul {
	display: block;
	height:1200px;
	top:0px;
	background:#DDDBCC;
	left:229px;/*把ul.navigation li的relative拿掉，設這個LEFT*/z-index: 9999 !important;
}
/* 特定在第二層或以後下拉部分 li 之樣式 */
			ul.vertical-nav ul li {
/*	border-bottom: 1px solid #DDD;*/
			}
/* 特定在第二層或以後下拉部分 li （最後一項不要底線）之樣式 */
			ul.vertical-nav ul li:last-child {
	border-bottom: none;
}
/* 第二層或以後選單 li 之樣式 */
	ul.vertical-nav ul a {
	width: 130px;
	padding: 10px 12px;
	color: #666;
}
ul.vertical-nav ul a:hover {
/*background: #CCC;	*/
			}
/* 第三層之後，上一層的選單觸發則顯示出來（皆為橫向拓展） */
			ul.vertical-nav ul li:hover > ul {
	display: block;
	position: absolute;
	top: 0;
	left: 100%;
	height:1200px;
	z-index: 9999 !important;

}
/* 箭頭向下 */
			.arrow-bottom {
	/*display: inline-block;*/
	float:right;
	margin-top: 5px;
	margin-left: 12px;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 5px solid #fff;
	width: 4px;
	height: 4px;
}
/* 箭頭向右 */
	.arrow-right {
	/*display: inline-block;*/
	margin-right: 2px;
	float:right;
	margin-top: -24px;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 5px solid #666;
	width: 4px;
	height: 4px;
}
.nav_thi {
	background:#fff !important;
	list-style:none;
	width:500px;
	text-align: left;
	z-index: 9999!important;
	
}
.nav_thi li {
	float:left;
	z-index: 9999!important;
	height:1000px;
	/*border:1px solid #DEDEDE;*/
}
.pro_list2 {
	display:inline-block;
	width:230px;
	height:230px;
	overflow: hidden;
	border-bottom:1px solid #EFEBE1;
	border-right:1px solid #EFEBE1;
	border-left:1px solid #fff;
	border-top:1px solid #fff;
	
	padding:0;
	z-index: 9999 !important;
	margin:0;
	margin-top: -4px;
}

.pro_list2_more {
	display:inline-block;
	width:230px;
	height:230px;
overflow: hidden;
color :#fff;
	background: #ab9b88;
	padding:0;
	z-index: 9999 !important;
	margin:0;
	margin-left: -4px;	
	padding-top: 80px;
	padding-left: 80px;
	font-size: 20px;
	font-weight: bold;
	margin-top: -4px;

}
.pro_list2_more:hover{background:#6b6156;
	-o-transition: all .3s ease-in-out;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
	text-decoration: underline;
}
.pro_list2:nth-child(even){margin-left: -4px;	
	border-bottom:1px solid #EFEBE1;
	border-right:1px solid #fff;
	border-left:1px solid #fff;
	border-top:1px solid #fff;}

.pro_list2:hover {
	border:1px solid #BAA878;
	box-sizing:border-box;
	text-decoration:none;
	-o-transition: color .20s linear;
	-webkit-transition: color .20s linear;
	-moz-transition: color .20s linear;
	transition:  color .20s linear;
}
.pro_list2 img {
	position: relative;
	margin-left:50px;
	margin-top: -20px;
}
.pro_list2 img:hover {
	z-index: 9999;
}
.pro_list2 h5 {
	font-size:1em;
	font-weight:bold;
	text-align:left;
	line-height:1.2em;
	margin-top:20px;
}
.pro_list2:hover h5 {
	text-decoration:underline;
	color:#BAA878;
	-webkit-transition: color .20s linear;
	-moz-transition: color .20s linear;
	transition:  color .20s linear;
}
.pro_list2 p {
	font-size:1em;
	font-weight:bold;
	text-align:center;
	line-height:1.2em;
}
.image-container {
	text-align: center;
}
.image-container img {
	top:30px;
/*	left:25px;*/
}
.image-container p {
	padding-top:0px;
	font-weight:bold;
	text-align:center;
}
.image-container:hover p{
	color:#FF7900;
	text-align:center;
	font-weight:bold;
}

.image-container:hover .arrow-right {
	/*display: inline-block;*/
	margin-right: 2px;
	float:right;
	margin-top: -24px;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 5px solid #FF7900;
	width: 4px;
	height: 4px;
}
