@charset "utf-8";
/* CSS Document */
@font-face{
	font-family: custom-sans-serif;
	src: local("微軟正黑體"), local("Microsoft JhengHei");
	unicode-range: U+4E00-9FFF;
}
@font-face{
	font-family: custom-sans-serif;
	src: local(Calibri), local(Verdana) ;
	unicode-range: U+00-024F;
}

body{padding:0; margin:0; text-align:center; webkit-text-size-adjust:none; font-size:90%; font-family:微軟正黑體,custom-sans-serif; width:100%; overflow-x:hidden;}
a{color:#666; text-decoration:none; noFocusline:expression(this.onFocus=this.blur()); outline:0;}
a:hover{color:#39c; text-decoration:none;}
a:focus{-moz-outline-style:none;}	
h1,h2,h3,h4,h5,h6,p{padding:0; margin:0; word-wrap:break-word; overflow:hidden; font-weight:normal;}
ul,li{list-style-type:none; padding:0; margin:0;}
dl,dd,dt{padding:0; margin:0;}

.txtLeft{text-align:left;}
.txtRight{text-align:right;}
.txtCenter{text-align:center;}
.floatLeft,.image-left{float:left;margin-right:15px;}
.floatRight,.image-right{float:right; margin-left:15px;}
.floatClear{clear:both; height:1px;}
.clearfix:after{clear:both; display:block; visibility:hidden; height:0; content:".";}
img{border:none;}

.wrapper{background:#fff;}
.container{max-width:1200px; margin:0 auto; text-align:left;}
.mainbox{background:#0398dc; border-bottom:#0398dc 1px solid; box-shadow:#ccc 0 10px 10px;}
.mainimg{padding-top:1px; margin:0 auto; width: 100%;}
.mainimg img{width: 100%;}



/*header*/
#header{max-width:1200px; height:100px; position:relative; margin:0 auto;}
#header .logo{ width:100%; position:absolute; text-align:left; padding-top:0.5em;}
#header .logo img{ height:70px;  border-bottom:10px solid #f1bd20; padding-bottom:6px; padding-right:80px;}

#header .toplink{position:absolute; text-align:right; bottom:20px; color:#666; right:0;}
#header .toplink i{background:#f1bd20; color:#fff;  padding:0.5em; font-size:1.3em; transition:all 0.2s ease;}
#header .toplink a{margin-left:1px;}
#header .toplink a:hover i{background:#0398dc;}
#header .toplink span{ padding:0 1em;}
#header .toplink-phone{ display:none;}




#top-bar{ width:100%; height:60px; background:#0398dc; position:fixed;top:-65px; z-index:99999999999999999999999; filter:alpha(opacity=90);opacity:0.9}



/*footer*/
.footer{background:url(../images/bg-footer.gif) repeat-x top #f2f2f2; text-align:center; padding:50px 0 0 0; color:#333; width:100%;box-shadow:#ccc 0 10px 10px;}
.footer .container{text-align:center;}
.footer .info{color:#333; border-bottom:#fff 1px dashed;}
.footer .info h2{font-family:微軟正黑體; font-size:2em; }
.footer .info h3{font-family:微軟正黑體;  font-size:1em; padding-bottom:10px; letter-spacing:3px; padding-bottom:10px;}

.footer .info .add{padding-bottom:30px; max-width:650px; margin:0 auto !important;}
.footer .info .add:after{clear:both; display:block; visibility:hidden; height:0; content:".";}
.footer .info .add li{float:left;}
.footer .info .add i{width:35px; height:35px; background:#999; color:#fff; border-radius:15px; font-size:0.9em; padding:3px; line-height:2em; margin-right:5px;}
.footer .info .add li.sp{padding:0 15px; color:#666; font-size:10px;}
.footer .nav2{max-width:700px; margin:0 auto; padding:1.5em 0; }
.footer .nav2:after{clear:both; display:block; visibility:hidden; height:0; content:".";}
.footer .nav2 li{float:left; padding:0 0.5em;}
.footer .nav2 li.sp{color:#666; vertical-align:middle; padding:0 4px !important;}
.footer .ftnav{color:#999; font-size:0.8em; padding-bottom:5px;}
.footer .ftnav:after{clear:both; display:block; visibility:hidden; height:0; content:".";}
.footer .ftnav .title{width:95px; float:left;}
.footer .ftnav .txt{float:left;}
.footer .ftnav span{padding:0 15px; color:#666; font-size:10px;}
.copyright{font-family:Verdana, Geneva, sans-serif; font-size:10px; text-transform:uppercase;background:#01497f; padding:10px; font-size:0.8em; color:#fff;}
.copyright span{padding:0 15px; color:#fff; font-size:10px;}
.copyright a{ color:#fff;}

.f-banner{background:#005ea6; text-align:center; padding:30px 0 10px 0; color:#333; width:100%;}
.f-banner img{ padding:0 10px; width:200px; height:auto;}




@media screen and (max-width: 1024px) {
	.container{max-width:none; width:95%;}

}

@media screen and (max-width: 960px) {
	#header .toplink{right:1.5em;}

}


@media screen and (max-width: 768px) {
	.footer .info h2{font-size:1.3em;}
	.footer .info .add li.sp{display:none;}
	.footer .info .add li{width:100%; padding:0.5em 0;}


}
@media screen and (max-width: 650px) {
	#header{ position:fixed; z-index:99999; width:100%; height:80px;  background:rgba(255,255,255,0.8); border-bottom:10px solid #f1bd20; }
	#header .logo img{ height:60px;  border-bottom:0px solid #f1bd20;  padding-right:0px; padding-left:10px;}
	.menubg{ height:80px; width:100%; clear:both; position:relative;}
	#header .toplink strong{ display:none;}
	.menu2{ display:block;}		
	#header .toplink{ display:none;}
	#header .toplink-phone{position:absolute; text-align:right; bottom:20px; color:#666; right:1em; display:block;}
	#header .toplink-phone i{background:#f1bd20; color:#fff;  padding:0.5em; font-size:1.3em; transition:all 0.2s ease;}
	#header .toplink-phone a{margin-left:1px;}
	#header .toplink-phone a:hover i{background:#0398dc;}
	#header .toplink-phone span{ padding:0 1em;}

	
}

@media screen and (max-width: 600px) {
	.footer .nav2 li{float:none;}
	
}

@media screen and (max-width: 480px) {
	body, html{height:100%; position:relative; }	
	.wrapper{position:absolute; right:0; width:100%;}
	#header .logo img{ height:50px;  }



}

@media screen and (max-width: 460px) {
	
	#header .logo img{ height:60px;  }
	
	

}


@media screen and (max-width: 400px) {
	
	#header .logo img{ height:50px;  }
	
	

}