html, body {
  margin: 0 ;
  height: auto;
  overflow-x: hidden;
}

#Wrapper { 
width:100%; 
height:auto; 
margin:0 auto;
}

img{ border:0}

::selection { background:#666666; color:#fff;}
::-moz-selection { background:#666666; color:#fff;}
::-webkit-selection { background:#666666; color:#fff;}


/*index nav begin*/
#MainMenu{  
width:100%;
position:relative;
background-color:#ffffff;
border-top:4px solid #353535;
}


.nav-logo{
display:block;
margin:0 15px 0 15px;
}


ul.nav { 
display:block;
list-style:none; 
margin:0; 
padding:25px 0;
text-align:center;
	 }
	ul.nav li {  display:inline-block ; margin:0; vertical-align:middle;  }

.nav_btn {
	width:140px;
	
	font-family: "Helvetica Neue", Helvetica, Arial, STHeiti, "Microsoft JhengHei", 微軟正黑體, sans-serif;
    display: inline-block;
    font-size: 14px;
    letter-spacing: 1px;
	position: relative;
	color: #222222; 
	text-decoration: none;
	margin:0;
		}
		.nav_btn.active ,
		.nav_btn:hover {
			text-decoration:underline;
		}


/* IE8 */
@media all\0 { 
.nav_btn:after { border: 0px; }
} 
/* IE9 */
@media all and (monochrome:0) { 
.nav_btn:after { border-top: 2px solid #a0a2a3; }
} 

/*IE 10 */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { 
.nav_btn:after { border-top: 2px solid #a0a2a3; }
}

/* IE10 IE11 */
@media all and (-ms-high-contrast:none) {
		.nav_btn:after { bottom: -1px; }
 }
 
 /* FF */ 
.nav_btn:after, x:-moz-any-link, x:default { bottom: 1px; !important	}



 
/*phone menu*/
.menu{	display:none; }
	
.mobile-menu-icon,
.pop-menu-icon {
	margin:0;
	padding:0;
	position:fixed;
	right:15px;
	top:25px;
	z-index:9999;
	}
	
	
	

.sub-nav {
	font-family: "Open Sans",Helvetica,Arial,sans-serif;
	text-transform:uppercase;	
	cursor:pointer;	
	display:inline-block;
	padding:0;
	position:relative;
  }

    .sub-nav ul {  	  
	  margin:80px 0 0 0;
	  padding:0;	
	  list-style-type: none;
    }	
    .sub-nav ul li { 
	width:100%;
	font-size:16px; 
	font-family: "Open Sans",Helvetica,Arial,sans-serif;
	letter-spacing:2px;
	padding:15px 0 ; 
	text-align:center;
	 }	
	  
	 
    .sub-nav ul li a:link , 
	.sub-nav ul li a:visited {
		color:#ffffff;
		text-decoration: none;
		padding:15px 33%;
		}
    .sub-nav ul li a:hover {color:#ffffff;text-decoration: underline;}

.nav-list{ 
    display:none;
	width:100%;
	position:fixed;
	top:0; 
	z-index:9999;
    }
.full-height{ height:100%;}	
/*index nav end*/


	
@media screen and (max-width: 865px) {	

ul.nav { display:none; }
.menu{	
display:block; 
padding:10px 0; 
background-color:#ffffff; 
 }	
.Breadcrumb ul li{ padding:15px 0;  }
	
	}
	
.nav-logo{ margin:0 12px; }	

@media screen and (max-width: 480px) { 
.Breadcrumb{ padding:0 0 0 16px; } 
.HsLogo{ display:none;}
 }
 
 /*GotoTop Begin*/
a.RgoTop{
	position:fixed; 
    bottom:24%; 
    right:11px;
    cursor:pointer;
    display:none;
	z-index:9999;
    }
@media screen and (max-width: 360px) {
a.RgoTop{ bottom:34%;}	
}
/*GotoTop End*/	


/*grid begin*/
.grid{
	display:inline-block;
	width:100%;
	background:#FFFFFF url('../images/grid_bg.jpg') ;	
	}
/*grid End*/

.index-banner{
	display:block;
	width:100%;	
	background-color:#e5e5e5;
	text-align:right;
	        }	
	.index-banner img{
		display:inline-block;
		width:60%;
		max-width:513px;		
		}	
	.container{
		display:block;
		width:1024px;
		height:331px;
		margin:0 auto;
		}
		
	.index-content{
		display:block;
		width:100%;
		max-width:1024px;
		margin:0 auto;
		}
		
.slogon{
	display:inline-block;
	width:40%;
	vertical-align:top;
	margin:12% 0 0 0;
	text-align:center;
	}
.slogon h1{
	display:block;
	margin:0;
	padding:0;
    font-family: "Helvetica Neue", Helvetica, Arial, STHeiti, "Microsoft JhengHei", 微軟正黑體, sans-serif;
	font-size:35px;
	color:#444444;
	text-transform:uppercase;
	font-weight:normal;
	}
.slogon p{
	display:block;
	margin:0;
	padding:0;
	font-family: "Helvetica Neue", Helvetica, Arial, STHeiti, "Microsoft JhengHei", 微軟正黑體, sans-serif;
	color:#818181;
	font-size: 16px;
	color:#666666;
	letter-spacing:4.2px;
	}
	
@media screen and (max-width: 865px) {
	
.index-banner{	text-align:left;     }	
	
.container{
	display:block;
	width:865px;
	height:280px;
	}	
	.index-banner img{
		max-width:433px;		
		}	
.slogon{
	width:38%;
	margin:12% 0 0 5%;
	}
.slogon h1{
	margin:0 0 -2px 0;
	font-size:30px;
	}
.slogon p{	letter-spacing:3px; }

}


@media screen and (max-width: 640px) {
	
	
.container{
	display:block;
	width:100%;
	height:auto;
	text-align:center;
	}	
	.index-banner img{
		max-width:60%;
		margin:0 auto -5.6% auto;		
		}	
.slogon{
	width:100%;
	margin:5% auto;
	text-align:center;
	}
.slogon h1{
	margin:0 0 -2px 0;
	letter-spacing:1px;
	}


}
	
	
@media screen and (max-width: 480px) {
	
	
.container{
	display:block;
	width:100%;
	height:auto;
	text-align:center;
	}	
	.index-banner img{
		max-width:60%;
		margin:0 auto -5.6% auto;		
		}	
.slogon{
	width:100%;
	margin:5% auto;
	text-align:center;
	}
.slogon h1{
	margin:0 0 5px 0;
	letter-spacing:1px;
	line-height:100%;
	}

}	

.index-aside{
	display:block;
	width:86%;
	padding:7% 7% 3.5% 7%;
	}
.left-pic{
	display:inline-block;
	width:30%;
	max-width:251px;
	vertical-align:top;
	}
	.left-pic img{
		display:block;
		width:100%;
		}
		
.right-aside{
	display:inline-block;
	width:53%;
	padding:0 0 1% 0;
	margin:0 0 0 10%;
	vertical-align:top;
	border-bottom:6px solid #fda539;
	}
	.right-aside h3{
			display:block;
			margin:0 0 5% 0;
			padding:0;
			line-height:100%;
			font-size:22px;
			font-family: "Helvetica Neue", Helvetica, Arial, STHeiti, "Microsoft JhengHei", 微軟正黑體, sans-serif;
			color:#1f62b4;
			font-weight:200;				
		    }
		    .right-aside h3 label{	display:block;	}
			
	.right-aside p{
			display:block;
			margin:0 0 20px 0;
			padding:0;
			line-height:150%;
			font-size:14px;
			font-family: "Helvetica Neue", Helvetica, Arial, STHeiti, "Microsoft JhengHei", 微軟正黑體, sans-serif;
			color:#4d4d4d;			
		    }	
			
	.right-aside p:last-child{
		    font-weight:bold;
			color:#999999;			
		    }
			
	.right-aside p a{
		font-family: "Helvetica Neue", Helvetica, Arial, STHeiti, "Microsoft JhengHei", 微軟正黑體, sans-serif;
		display: inline-block;
		color: #1f62b4; 
		text-decoration: none;
		text-decoration:underline;
		margin:0;
			}
			.right-aside p a:active ,
			.right-aside p a:hover {
				text-decoration:none;
				color:#fda539;
			}

			
			
.index-contact{			
	display:table;		
	margin:9% 0;
	padding: 10px 50px;
	font-family: "Helvetica Neue", Helvetica, Arial, STHeiti, "Microsoft JhengHei", 微軟正黑體, sans-serif;
	color:#ffffff;	
	font-size:15px;	
	letter-spacing:2px;
	text-decoration:none;
	text-align:center;	
	background-color:#3c3e3e;
	border-radius:8px;
	-webkit-transition: 0.3s ease-out;
	-moz-transition: 0.3s ease-out;
	-ms-transition: 0.3s ease-out;
	-o-transition: 0.3s ease-out;
	transition: 0.3s ease-out;				
	}
    .index-contact span{ color:#ffc842;	}
	
	.index-contact:hover{ 
		color:#ffc842;
		background-color:#000000;	
		}
		
.bottom-pic{
	width:100%;
	display:block;
	margin:0 7% 8.2% 7%;
	}
	.bottom-pic img{
		display:inline;
		margin:0 0 0 -4px;
		}
	.bottom-pic img:first-child{
		margin:0;
		}	

@media screen and (max-width: 865px) {

.bottom-pic{  width:81.3%;}
.bottom-pic img{ width:50%;	}
.bottom-pic img:nth-child(2){display:none;	}	
	}
		
@media screen and (max-width: 640px) {
	
.index-aside{
	padding:0 7%;
	}
	
.left-pic{	display:none; }
.right-aside{
	display:block;
	width:90%;
	padding:10% 0 5% 0;
	margin:0 auto;
	vertical-align:top;
	border-bottom:6px solid #fda539;
	text-align:left;
	}

	.right-aside h3{ font-size:19px;  }
	
.bottom-pic{
	width:77.6%;
	display:block;
	margin:0 auto 10% auto;
	}
}

@media screen and (max-width: 420px) {

.bottom-pic img{ width:100%;margin:0; }
.right-aside{
	padding:15% 0 0 0;
	}
.bottom-pic{
	margin:0 auto 15% auto;
	}
}	


 /*上下頁*/
.NextBackBox {                         
width:100%;
height:auto;
display:block;
text-align:center;
margin:30px 0 50px 0;
}
.NextType{ 
width:100%;
text-align:center;
font-family: "Open Sans",Helvetica,Arial,sans-serif;
color:#818181;
font-size: 13px;
letter-spacing:2px;
position:relative;
display:block;
}
.NextType a:link { color:#818181;text-decoration: none; margin:0 5px;} 
.NextType a:visited {color:#818181;text-decoration: none} 
.NextType a:hover {
  color:#CCCCCC; 
  text-decoration: underline;
  -webkit-transition: color ease-in-out 0.3s;
  -moz-transition: color ease-in-out 0.3s;
  -o-transition: color ease-in-out 0.3s;
  transition: color ease-in-out 0.3s;
	}
 /*End上下頁*/

/*footer begin*/
.copyright{
	display:block;
	width:100%;
	font-family: "Open Sans",Helvetica,Arial,sans-serif;
	font-size:13px;
	color:#999999;
	text-align:left;
	padding:30px 0 30px 17px;
	background-color:#ededed;
	}
	.copyright img{
		float:right;
		margin:3px 40px 0 0;
		}
/*footer end*/
			
			