﻿@charset "utf-8";

*{-webkit-print-color-adjust: exact;} /*設定列印背景圖*/
html,body {
	height:100%;
	margin:0 auto;
	padding:0;
	min-width:990px;
 }

sub, .info-box sub{
    vertical-align: sub !important;
    font-size: 70% !important;
}
sup, .info-box sup{
	vertical-align: super !important;
    font-size: 70% !important;
	}

main {
  display: block;
}
body{
	font:62.5%/1 "微軟正黑體", Arial, Helvetica, sans-serif;
	-webkit-text-size-adjust:100%;
	-ms-text-size-adjust:100%;
	text-size-adjust:100%;
	min-width:990px;
	
}
body.font-size-s {
    font-size:56.3%;
}
body.font-size-l {
	font-size:68.8%;
}
a {
	color:#c93f1f;
	text-decoration:none;
	-webkit-transition:all 0.3s ease;
	   -moz-transition:all 0.3s ease;
	     -o-transition:all 0.3s ease;
	        transition:all 0.3s ease;
}
a:hover,
a:focus {
	text-decoration: none;
	color: #6C0;
}
/* a, button, textarea, select, input {
	-webkit-appearance:none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-border-radius: 0;
	   -moz-border-radius: 0;
			border-radius: 0;*/
 
img {
	border: none;
	vertical-align: middle;
	max-width:100%;
	height:auto
}
.clearfix:after {
    content: ".";
    display: block;
     height: 0;
    clear: both;
    visibility: hidden;
}
.clear{
	width:0; height:0; clear:both}
/** Layout **/
#wrapper {
	position: relative;
	float:left;
	width: 100%;
	margin: 0 auto;
	padding:0;
}
.hide-panel {
	display:none;
}



.sr-only {
	position:absolute;
	width:1px;
	height:1px;
	padding:0;
	margin:-1px;
	overflow:hidden;
	clip:rect(0,0,0,0);
	border:0;
}
.sr-only-focusable {
    position:fixed;
	top:1px;
	left:1px;
	color:#000;
	opacity:0;
	z-index:9999;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
	color:#FFF;
	font-size:1.2em;
	padding:5px 10px;	
	opacity:1;
	background:#6C0;
}
.acKey, .acKey a {
	color: transparent;
	font-size:1.2em;
	background:transparent
}

.acKey:hover, .acKey:focus, .acKey a:hover, .acKey a:focus {
	background:#fff; color:#F00}

.container {
	width: 100%;
	padding:0 8px;
	margin: 0 auto;
	max-width:1166px;
	min-width:990px;
	position:relative
}

.fff-bg{
	background-color:#fff}
.row {
    margin-right: -10px;
    margin-left: -10px;
}
.left-part { float:left; }
.right-part { float:right; }
 
 

.font-black { color:#000;}
.font-blue { color:#00aad9;}
.font-green { color:#59b300;}
.font-yellow { color:#f39800;}
.font-orange { color:#eb6100;}
.font-red { color: #d23d2a;}

.ellipsis{
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;}
	
	
/** header **/
#header {
	width:100%;
	margin: 0 auto;
	position:fixed;
	z-index:10;
	top:1px;
	margin-top:-1px;
	transition:all 0.8s;
 }

#inside #header{
	max-width:none}
#header.fixed{
	top:-110px;}
		
#header.sp-fix {
	position:absolute;
	left:0;
	top:0;
	z-index:999;
	background:#FFF;
	-webkit-box-shadow: 0 2px 7px rgba(0%,0%,0%,0.3);
	   -moz-box-shadow: 0 2px 7px rgba(0%,0%,0%,0.3);
	        box-shadow: 0 2px 7px rgba(0%,0%,0%,0.3);
}  
/*#header:hover{
	top:0 !important}*/

/* ----- topHead ----- */
#topHead {
	position:relative;
	width:100%;
	margin: 0 auto;
	background:#fff;
	height:108px;
}
#topHead .logo {
	float:left;
	margin:10px;
	margin-top:24px
}
#topHead .logo a {
	float:left;
	display:block;
	width:274px;
	height:61px;
	font-size:0;
	background: url(../images/head-logo-202309.png) no-repeat  ;
	background-position:left center;
	background-size:auto 61px;
	
}
#topHead .logo a:hover, #topHead .logo a:focus{
	opacity:0.7;} 
 
 
 
/* ----- addon ----- */
.addon {
	    float: right;
    margin-top: 17px;
    margin-right: 15px;
    position: absolute;
    right: 0;
    bottom: 19px;
}
.addon > ul {
	float:right;
	list-style:none;
}
.addon > ul > li {
	float:left;
	color:#000;
	/*font-size:1.3em;*/
	line-height:22px;
	text-align:left;
}
.addon > ul > li span {
 	display: inline-block;
	width:3px;
	height:22px;
 	margin:0 8px;
	vertical-align: top;
	color:#b3b3b3
}
.addon > ul > li a {
	color:#333;
	vertical-align:top;
	font-size:1.5em;	
}
.addon > ul > li a.acKey {
	color: transparent;
	margin:0;	
}
.addon > ul > li a:hover,
.addon > ul > li a:focus {
	color:#F90;
}
.addon > ul > li a.btn-rss {
	color:#FFF;
	padding:0 5px;
	background:#bc5020;	
	-webkit-border-radius:4px;
	   -moz-border-radius:4px;
            border-radius:4px;
}
.addon > ul > li a.btn-rss:hover,
.addon > ul > li a.btn-rss:focus {
	background:#E15315;
}
.addon .textsize a {
	display: inline-block;
	border:1px solid #999;
	margin:0 -1px 0 0;
}
.addon .textsize a i {
	display:block;
	width:20px;
	height:20px;
	font-size:0;	
	vertical-align:top;
}
.addon .textsize a:hover,
.addon .textsize a:focus,
.addon .textsize a:active {
	background: #F4F4F4;
}
.addon .textsize a.ts-on {
	background: #999;
}
.addon .textsize a i.sizeS {
	background: url(../images/textsize-minus.png) 50% 50%;
}
.addon .textsize a.ts-on i.sizeS {
	background:#999 url(../images/textsize-minus-on.png) 50% 50%;
}
.addon .textsize a i.sizeM {
	background: url(../images/textsize.png) 50% 50%;
}
.addon .textsize a.ts-on i.sizeM {
	background:#999 url(../images/textsize-on.png) 50% 50%;
}
.addon .textsize a i.sizeL {
	background: url(../images/textsize-plus.png) 50% 50%;
}
.addon .textsize a.ts-on i.sizeL {
	background:#999 url(../images/textsize-plus-on.png) 50% 50%;
}


@media screen and (min-width: 991px) {
	.addon {		
		width:510px;
	}  
}
#addon-sp {
	float:left;
	width:100%;
}
#addon-sp > ul {
	float:left;
	width:100%;
	list-style:none;
}
#addon-sp > ul > li {
	float:left;
	width:25%;	
}
#addon-sp > ul > li span {
	display:none;
}
#addon-sp > ul > li a {
	float:left;
	width:100%;
	height:100%;
	color:#FFF;
	font-size:1.5em;
	text-align:center;
	vertical-align:middle;
	padding:15px 0;
	background:#216315;
	box-sizing:border-box;
	border-right: 1px solid rgba(255,255,255,.5);
}
#addon-sp > ul > li a.btn-rss {
	background:#F39800;	
	border-right: none;
}
#addon-sp > ul > li a:hover,
#addon-sp > ul > li a:focus {
	color:#216315;
	background: #A3D900;	
}

/* ----- target-menu ----- */
#target-menu-sp {
	float:left;
	width:100%;
	background:#FFF;
}
@media screen and (min-width: 991px) {}
	#target-menu {
		display:inherit;
		float:right;
		width:246px;
		margin-top:10px;
	}  

.language {
	float:left;
	width:100%;
}
.language ul {
	float:left;
	width:100%;
	list-style:none;
}
.language ul li {
	float:left;
	width:33.33333%;
	border-right:1px solid #FFF;
	box-sizing:border-box;
}
.language ul li:last-child {
	border:none;
}
.language ul li a {
	float:left;
	width:100%;
	color: #53a653;
	font-size:1.5em;
	text-align:center;
	background:#acd598;
	margin:0;
	padding:0;
}
.language ul li a:hover {
	color:#FFF;
	background:#45C5F4;
}
.language ul li a.on,
.language ul li a:hover on {
	color:#FFF;
	background:#53a653;
}
.language ul li a span {
	display:block;
	padding-top:28px;
	margin:10px 0;
}
.language ul li a span,
.language ul li a.on span,
.language ul li a:hover span {
	background-position:50% 0;
	background-repeat:no-repeat;
}
.language ul li a span.lan1 {
	background-image: url(../images/icon-language1.png);
}
.language ul li a.on span.lan1,
.language ul li a:hover span.lan1 {
	background-image: url(../images/icon-language1-on.png);
}
.language ul li a span.lan2 {
	background-image: url(../images/icon-language2.png);
}
.language ul li a.on span.lan2,
.language ul li a:hover span.lan2 {
	background-image: url(../images/icon-language2-on.png);
}
.language ul li a span.lan3 {
	background-image: url(../images/icon-language3.png);
}
.language ul li a.on span.lan3,
.language ul li a:hover span.lan3 {
	background-image: url(../images/icon-language3-on.png);
}
.language ul li a span.lan4 {
	background-image: url(../images/icon-language4.png);
}
.language ul li a.on span.lan4,
.language ul li a:hover span.lan4 {
	background-image: url(../images/icon-language4-on.png);
}
.language ul li a span.lan5 {
	background-image: url(../images/icon-language5.png);
}
.language ul li a.on span.lan5,
.language ul li a:hover span.lan5 {
	background-image: url(../images/icon-language5-on.png);
}
@media screen and (max-width: 420px) {
	.language ul li a {
		font-size:1.2em;		
	}
}
@media screen and (min-width: 991px) {	
	.language {
		width:auto;
	}
	.language ul {
		display:inherit;
		width:auto;
	}
	.language ul li {
		width:auto;
		border:none;
		margin:0 2px 0 0;
	}
	.language ul li a {
		width:60px;
		height:55px;
		font-size:1.2em;		
	}
	.language ul li a span {
		margin:8px 0 0 0;
	}
	.language ul li a span,
	.language ul li a.on span,
	.language ul li a:hover span {
		background-position: 50% 0;
	}
}


/* ----- top-navs ----- */
.top-navs{float:right; margin-top:20px; position:relative; margin-right:15px} 
.top-navs form {
	display:inline-block
 }
#topHead .container{
	position:relative;
	height:108px;}
	
.top-navs a, .top-navs input{
	vertical-align:middle}
	
.top-navs .search-txt {
	position:relative;
    float:left;
	width: 153px;
	height:34px;
	padding:0 10px;
 	box-sizing:border-box;
	font-size:1.4em;
	color: #ccc;
	border:#b3b3b3 1px solid;
	border-radius:17px;
	font-family:"微軟正黑體", Helvetica, sans-serif;
}


.top-navs .search-btn {
	display: inline-block;
	width:31px;
	height:31px;
	background: url(../images/head-top-search.png) center no-repeat  ;
	background-size:contain;
	margin: 0;
	margin-right:6px;		
	border:none;
	text-indent:-9999px;
	cursor:pointer;
	margin-left:10px
}
.top-navs  .search-btn:hover, .top-navs  .search-btn:focus {
	background: url(../images/head-top-search-on.png) center no-repeat  ;
	background-size:contain;

}

.top-navs .acKey:focus{
	color:#393 !important}
	
.top-navs a{
	display:inline-block;
	width:30px;
	height:27px;
	margin-left:10px;
	background-position:center;
	background-size:contain;
	background-repeat:no-repeat;
	font-size:0;} 
.top-navs a.acKey{
	font-size:1.5em;
	position:absolute;
	left:-40px;
	top:5px;}	
.top-navs #sitemap{
	background-image: url(../images/head-top-sitemap.png) }
.top-navs #sitemap:hover, .top-navs #sitemap:focus, .top-navs #sitemap.unit-now{
	background-image: url(../images/head-top-sitemap-on.png) }	
	
.top-navs #links{
	background-image: url(../images/head-top-link.png)}
.top-navs #links:hover, .top-navs #links:focus, .top-navs #links.unit-now{
	background-image: url(../images/head-top-link-on.png)}	
	
.top-navs #home{
	background-image:url(../images/head-top-home.png)}
.top-navs #home:hover, .top-navs #home:focus, .top-navs #home.unit-now{
	background-image:url(../images/head-top-home-on.png)}	
	
.top-navs a.Language{
	font-size:1.3em;
	font-family:"Arial Black", Arial black, Arial, Gadget, sans-serif, Helvetica, sans-serif;
	font-weight:bold;
	color:#fff;
	background-color:#cacaca;
	text-align:center;
	line-height:30px;
	width:30px;
	height:30px;
	margin-left:4px ;
 	border-radius:50%;
	}

.top-navs a.Language:first-child{
	margin-left:12px}	
.top-navs a.Language.on{background-color:#8cc63f;} 

.top-navs a.Language:hover, .top-navs a.Language:focus{
	background-color:#666}	
	
#topHead .top-img-1{
	width:153px;
	height:68px;
	background-image:url(../images/head-topimg-1a.png);
	background-position:center top;
	background-size:contain;
	background-repeat:no-repeat;
	position:absolute;
	bottom:0;
	left:336px;
	overflow:hidden;
	-webkit-animation-name:housemove;
	animation-name:housemove;
	-webkit-animation-duration: 2s;
  	animation-duration: 2s;
	-webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
	}
	
@keyframes housemove{
	0%{ height:0px;}
	100%{ height:68px;}
	}
@-webkit-keyframes housemove{
	0%{ height:0px;}
	100%{ height:68px;
	}
}
	
	
#topHead .top-img-1:hover{
	background-image:url(../images/head-topimg-1a.gif);}
		
 

#topHead .top-img-2{
	width:49px;
	height:46px;
	position:absolute;
	bottom:0;
	left:507px;
	background:url(../images/head-topimg-car.png) center bottom no-repeat;
	background-size:contain;
	-webkit-animation-name:carmove;
	animation-name:carmove;
	-webkit-animation-duration: 5s;
  	animation-duration: 5s;
	-webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
 }
@keyframes carmove{
	0%{ left:650px;}
	100%{ left:507px;}
	}
@-webkit-keyframes carmove{
	0%{ left:650px;}
	100%{ left:507px;}}
	}


/** main **/
#main {
	width: 100%;
	margin: 0 auto;
}


/** footer **/
#footer {
	position:relative;
	width: 100%;
	margin:0 auto;
	background:#53a653;
}


/* ----- goTop ----- */

 

#goTop {
	position: fixed;
	display:none;
	right:20px;
	bottom:20px;
	width:50px;
	height:50px;
	text-indent:-9999px;
	background-image:url(../images/gotop.png)  ;
	background-repeat:no-repeat;
	background-size:30px auto;
	background-position:center 45%;
	z-index:30;
	cursor:pointer;
	background-color:rgba(0,0,0,.3);
	border-radius:50%
}
#goTop:hover, #goTop:focus {
	background-color:#F30
}

.sec-pad{
	padding:67px 8px}
/*圖片效果*/
.pic-zoom-in{
	width:100%;
	height:100%;
	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
	transition:all 0.5s}
	
.pic-zoom-in:hover{
	transform:scale(1.1);}	
	
.over-hid{
	overflow:hidden}
	
/*footer*/	

.tail-sitemap-wp{
	background-color:#4d4d4d;
	padding:50px 0;
	color:#fff;
 	line-height:1.8;
	text-align:center;
	
	}	 
.tail-sitemap-wp a{ color:#fff}	
.tail-sitemap-wp dl{
	display: table-cell;
    /* float: left; */
    vertical-align: top;
    /* width: calc(100% / 8); */
    padding: 0 8px;
    text-align: left;
    box-sizing: border-box;
	}
.tail-sitemap-wp dl:nth-child(3),
.tail-sitemap-wp dl:nth-child(5){
	width:12%;
}
	
 
	
.tail-sitemap-wp dl dt{
	font-size:1.7em;
	line-height:1.2;
	font-weight:bold;
	padding-bottom:8px;
	border-bottom:1px dashed #ccc;
	margin-bottom:15px}
	
.tail-sitemap-wp dl dd{
	color:#ccc;
	line-height:1.5;
	margin-bottom:10px;
	font-size:1.5em;}

.tail-sitemap-wp dl dd a:focus, .tail-sitemap-wp dl dd a:hover{
	 
	font-weight:bold}
	
.tail-sitemap-wp dl a:hover , .tail-sitemap-wp dl a:focus{
	color:#FF6}		
	
/*---------socil-----------*/	

.tail-sitemap-wp  .social {
    height: 50px;
    margin: 0 auto;
    display: block;
    text-align: center;
    width: 100%;
    margin: 0px auto 50px auto;
}
	
.tail-sitemap-wp  .social li {
	width:50px;height: 50px;
	margin:0 7px;
    display: inline-block;
    position: relative;
}
	
 
.tail-sitemap-wp  .social li a { 
	width:50px;height: 50px; 
	display:block; text-indent:-9999em; 
 	background-size: cover; 
	transition:all 0.5s;
	background-position:center;
  	background-repeat:no-repeat !important;
  	border-radius:50%;
	background-color:#808080
	}
	
.tail-sitemap-wp  .social li a:hover{	transform: scale(1.1) }	
.tail-sitemap-wp  .social li a:active { transform: scale(0.9);transition:all 0s }

.tail-sitemap-wp  .social li a.icon-fb{ background-image:url(../images/foot-icon-fb.png)	}
.tail-sitemap-wp  .social li a.icon-fb:hover, 
.tail-sitemap-wp  .social li a.icon-fb:focus{ background-color:#3b5998}

.tail-sitemap-wp  .social li a.icon-tt{  background-image:url(../images/foot-icon-tt.png)	}
.tail-sitemap-wp  .social li a.icon-tt:hover,
.tail-sitemap-wp  .social li a.icon-tt:focus{ background-color:#55acee}

.tail-sitemap-wp  .social li a.icon-gg{  background-image: url(../images/foot-icon-gg.png)}
.tail-sitemap-wp  .social li a.icon-gg:hover, 
.tail-sitemap-wp  .social li a.icon-gg:focus{background-color:#dc4e41}

.tail-sitemap-wp  .social li a.icon-pp{ background-image:url(../images/foot-icon-pp.png) }
.tail-sitemap-wp  .social li a.icon-pp:hover, 
.tail-sitemap-wp  .social li a.icon-pp:focus{ background-color:#cb2027}

/*版權區*/

.copy-right{
	background:#fff;
	padding:30px 0}
	
.copy-right .A2:hover, .copy-right .A2:focus{
	transform:scale(0.9)}
	
.copy-right .A2, .copy-right .add-txt{
	float:left}
.copy-right .add-txt{
	width:52%;
	padding-left:23px;
	font-size:1.5em;
	line-height:1.5;
	color:#000;
	margin-top:-5px}
	
@media screen and (max-width: 1033px) {	
.copy-right .add-txt{
	width:48%;} 
}
	
.copy-right .add-txt .g-txt{
	color:#557f13}	
	
.copy-right .add-txt a{
	color:#000;}
	
.copy-right .add-txt a:hover, .copy-right .add-txt a:focus{
	color: #F60;}
	
.copy-right .unit-box{
	float:right}	
	
.copy-right .unit-box h4, .copy-right .unit-box strong{
    color: #000;
    font-size: 1.5em;
    line-height: 1;
    padding-right: 5px;
    background: #fff;
    position: relative;
    z-index: 2;
    width: auto;
    display: inline-block;
}	
		
.copy-right .unit-box .unit{
	display:inline-block;}

.copy-right .unit-box .unit:last-child{
	margin-left:25px}
									
.copy-right .unit-box .logo-box{
	padding-top:15px;
	border-top:1px solid #ccc;
	margin-top:-3px}
	
.logo-box a{
	display:block;
	transition:0.4s}
		
.logo-box a:hover, .logo-box a:focus, .logo-box a:active{
	transform:scale(0.9);
	opacity:0.7
	}
	
		
/*最下方*/	
#footer .gray-bg{
	background:#edede8;
	padding:30px 0;
	font-size:1.5em}
	
.gray-bg, .gray-bg a{
	color:#808080;
	/*font-size:1.5em*/
	}	
	
.gray-bg a:hover, .gray-bg a:focus{
	color:#F60;
 	}	
	
.clear-page p{
	text-indent:0 !important;
	margin-bottom:5px !important}	