@charset "utf-8";

 * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

 body { margin:0; }
 body, input { font-family:'微軟正黑體','正黑體'; }
 a { text-decoration:none; }
 table { border-collapse:collapse; }
 
 h3>a { color:inherit; }

.banner { min-height:13.27vw; heig ht:239px;
 background:#f4f0e5 url(img/banner2.png) 50% 0% no-repeat; 
 border-bottom:3px solid #b9ac95; margin-bottom:2em;
 animation-name:bannerBg; animation-duration:60s; animation-iteration-count:infinite; animation-timing-function:linear; }

@keyframes bannerBg
{
 from{ background-position-y:0%; }
 to{ background-position-y:100%; }
}

/*
紅: #a2242f

*/

 h1 { background-color:#2425204c; height:60px; margin:0; padding:0; }
 h1>div { width:1300px; max-width:100%; margin:auto; }
 h1 a {  }
 h1>div img { margin:10px; }
.banner div>div { width:1300px; max-width:100%; margin:auto; }
 aside>nav { background-color:#fff; }
 nav>h6, section>h6 { position:absolute; right:100vw; }

#logo { margin:70px 0 20px 20px; }

.menu a { display:block; width:230px; }
.menu>a { display: block; font-size:1.6em; text-align: left; color:#000000; height: 80px; padding:0.5em 0 0.5em 0.5em;
 border-bottom:1px solid #cccccc; }
.menu>a:hover, .menu>a:focus, .menu>a:active {
 background: -webkit-linear-gradient(270deg, #fff 0%, rgba(244, 240, 229, 1) 100%);
 background: -moz-linear-gradient(180deg, #fff 0%, rgba(244, 240, 229, 1) 100%);
 background: linear-gradient(180deg, #fff 0%, rgba(244, 240, 229, 1) 100%);}
 .menu>a.act {
 background: -webkit-linear-gradient(270deg, #fff 0%, #dfd4b3 100%);
 background: -moz-linear-gradient(180deg, #fff 0%, #dfd4b3 100%);
 background: linear-gradient(180deg, #fff 0%, #dfd4b3 100%);}.menu>a:before { content:'‧';  }
.menu>a>small { display:block; font-size:0.625em; color:#900; padding-left:0.625em; }
.menu>div { disp lay:none; background-color:#f4f0e5; line-height:250%; height:0; overflow:hidden;font-size: 1.3em; }
.menu>a:hover+div, .menu>div:hover, .menu>a:active+div, .menu>div:active, .menu>a:focus+div, .menu>div a:focus, .menu>div.act { display:block; height:auto; }

.menu>div>a { text-align: center; border-bottom:1px solid #888; color: #000; }
.menu>div>a.act { background-color:#fed; }
.menu>div>a:hover, .menu>div>a:active { background-color:#fdc; }

 main>aside { user-select:none; }
 main>aside>a { display:block; margin-top:20px; }

 body>main { width:1300px; max-width:100%; margin:auto; position:relative; }
 body>main>aside { display:inline-block; height:100%; float:left; margin-right: 20px; }
 main>section { display:flow-root; }
 
 body>footer { min-height:120px; background-color:#b9ac95; color:#fff; padding:2em 0; clear: both;
 text-align:center; line-height: 150%; }
 
 tr[onclick] { cursor:pointer; }
 
.lang { float:right; border:1px solid #888; margin:0.2em; color:#444; } 
 
/* home */

.home~section>h3 { position:relative; color:#6D6149; text-align:left; font-size:2.3em; line-height:1; }
.home~section>h3:before { display: inline-block; height: 1em;
 content:' '; border-left:12px #a2242f solid; margin-right:0.5em; vertical-align: bottom; }
.home~section>h3:after { content:' '; display:block; position:relative; bottom:-0.5em; border-bottom:1px solid #b9ac95; }

#homeBanner { display: flow-root; max-width:1034px; }
#homeBanner img { width:100%; max-width:90vw; margin: auto; display: block; }

.homeVideo {}
.homeVideo iframe { float:left; max-width:90vw; max-height:68vw; }
.homeVideo a { display:block; border-top:1px solid #ccc; height:50px; color:#444; line-height:50px; }
.homeVideo a h3 { margin:0; font-weight:normal; }
.homeVideo article a:before { content:url(img/ico_yt.png); float:left; margin:0 1em; }


.homeNews article { border-bottom:1px solid #ccc; }
.homeNews time { display:inline-block; width:7em; text-align:center; color:#a2242f; }
.homeNews a { display:block; color:#444; }
.homeNews d { width:5em; border-radius:0.8em; color:#fff; padding:0.1em 0.5em; }

.srv>a { display:inline-block; width:300px; height:170px;
 margin:0 40px 30px 0; padding:120px 0 0 20px;
 color:#fff; font-size:1.8em; }
.srv>a:hover { color:#ffff98; }


.partner { text-align:center; background:#f4f0e5; }
.partner>div { width:1300px; max-width: 100vw; margin:auto; }
.partner>div>div { display:inline-block; width:190px; max-width:40vw; height:100px; margin:0.7em; text-align:center; line-height:100px; background-color:#fff; }
.partner>div>div>img { max-width:90%; vertical-align:middle; }



/* page */
 aside+article { display:flow-root; }
 section>h2, article>h2 { font-size:2.25em; font-weight:400; line-height:2em; color:#6D6149; margin-top:0; padding-left:1em; background:linear-gradient(#ffffff, #f4f0e5); border-bottom:#b9ac95 solid 1px; }
 
 article { line-height:200%; }
 article>h3 { color: #990000; font-weight:normal; font-size: 1.5em; }
 article>h4 { color: #0D3B47; }
 article img { max-width:90vw; }
 
/* form */
 article form .sn { display: inline-block; width:1.7em; font-size:2.5em; line-height: 100%; border-left:0.2em solid #f84; text-align:right; margin-right:0.5em; } 
 article form>div { margin:2em 0; padding-bottom:1em; border-bottom:1px solid #888; } 
 article form label { color:#900; font-size: 1.5em; }
 article form nobr label { color:#000; }
 article form label>* { font-size:1em; }
 article form>div>label { line-height:2; border-left:0.2em solid #a2242f; padding-left:0.5em; }

 article form select { display:block; padding:0.2em; margin:0.5em 0; }
 article form input, article form textarea
{ display:block; border:#b9ac95 1px solid; border-radius:5px;
 width: 100%; padding: 0.2em; font-size: 1.5em; color:#444;
}
 article form input:focus, article form textarea:focus { background-color:#fff3f0; }
 article form input[type=radio], article form input[type=checkbox] 
 { display:inline; width:0.5em; height:0.5em; }
 article form input[type=number], article form input[type=date], article form input[type=time]
, article form input[type=datetime], article form input[type=email], article form select  { width:50%; }
 
 article form input[type="submit"], article form input[type="reset"]
 { display:inline-block; width:6em; border:#a2242f 1px solid; margin:0.1em 1em 0.1em 0; }
 article form input[type="submit"] { background:#a2242f; color:#fff; }
 article form input[type="reset"] { background:#fff; color:#a2242f; }
 
 
 form abbr { color:red; }
 
/* video */
.videos {}
.videos img { cursor: pointer; }
.videos article { display:inline-block; width:330px; line-height:100%; margin-right:17px; margin-bottom:1em; }
.videos article h3 { display:block; color:black; font-size:1em; margin:0.5em 0; }
.video article {  }


/* news */

.newsL { width:100%; }
.newsL a { color:inherit; }
.newsL tr { border-bottom:#888 1px solid; }
.newsL th { padding:0.5em; background-color:#eee; text-align:left; }
.newsL td { padding:0.5em; }
.newsL td:nth-child(1) { width:5em; color:#04F; }
.newsL td:nth-child(3) { color:#a2242f; }

.news { font-size:1.25em; }
.news .ti { display:block; border-bottom:1px solid #ccc; font-size:1.1em; }
.news time { color:#a2242f; }
.news article>h3 {  color:#000; font-size:1.5em; }
.news section>h4 { width:4em; border-bottom:2px solid #a2242f; margin-bottom:0; }

 ul>a { display:list-item; color:#028; }

 .back { display:block; width:5em; border:1px solid #ccc; margin:0 auto; padding:0.4em;
 text-align:center; color:#888; }


.donate {}
.donate th, .donate td { padding:0.5em 1em;}
.donate th { background:#eee; }


#goTop { position:fixed; z-index:1; right:20px; bottom:-100px;
 padding: 10px 20px; background-color: rgba(255,255,255,0.5); border:1px solid #888;
 text-align: center; color:#444;
 animation-name:closeBtn; animation-duration: 0.5s; }
#goTop.show { bottom:20px; animation-name: showBtn; animation-duration: 0.5s;}
#goTop:hover { background-color: rgba(255,255,255,1); }
#goTop>div { text-align:center; font-size:3em; margin-top:-10px; line-height:1; }

@keyframes showBtn
{
    from { bottom:-100px;}
    to { bottom:20px; }
}

@keyframes closeBtn
{
    from { bottom:20px; }
    to { bottom:-100px;}
}

/* mobile */

@media screen and (max-width:1300px)
{
	
}

@media screen and (max-width:800px)
{
	h1 a { text-align: center; }
	#logo { width: 50vw; margin-top: 1em; }
	body>main>aside { position:absolute; z-index:1; left:-280px;
	border-right: 12px double #888; background-color:#fff; padding-right:56px;
	animation-name:closeMenu; animation-duration:0.5s; 
	}
	body>main>aside:hover { left:0px; animation-name:showMenu; animation-duration:2s; }
	.menu>div { display:block; }
	main>aside~* { margin-left:2em; }
	main>section { text- align:center; }
	.srv>a { margin:0.5em 0.2em; }
	
	article form { text-align:left; }
	article form input:not([type]), article form input[type=text], article form input[type=number], article form input[type=date], article form input[type=time], article form input[type=datetime], article form input[type=email], article form textarea, article form select  { width:95%; }

	.newsL th, .newsL td { display:block; width:auto !important; text-align:center; padding:0.1em; }

	.homeVideo>section { clear: both; }

	@keyframes showMenu
	{
		from { left:-280px;}
		to { left:0px; }
	}

	@keyframes closeMenu
	{
		from { left:0px; }
		to { left:-280px;}
	}

}