html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin:0; padding:0; border:0; font-size:100%;}
html, body { height:100%;}
body {line-height:1;background:#000;}
ol, ul {list-style:none;}
body {-webkit-text-size-adjust:none;}
*:link, *:visited, *:hover, *:active, *:focus {-o-transition:color .20s linear, background-color .20s linear, border-color .20s linear;-webkit-transition:color .20s linear, background-color .20s linear, border-color .20s linear;-moz-transition:color .20s linear, background-color .20s linear, border-color .20s linear;transition:color .20s linear, background-color .20s linear, border-color .20s linear;}
b {font-weight:bold;}

#sBanner {
	background-color:#000;
	color:rgba(255, 255, 255, 0.75);
	background-attachment:fixed;
	background-image:url("images/index.jpg","width:100%");
	
	background-repeat:no-repeat;
	background-size:cover;
	background-position:left top;
	text-align:center;
}
@media screen and (max-width:480px) { #banner {background-position:45% top;background-size:300%;} }
#sHeader {background:#000;border-bottom:1px solid #333;color:rgba(255, 255, 255, 0.15);height:55px;line-height:55px;cursor:default;position:fixed;left:0;top:0;z-index:10001;width:100%;}
#Logo {width:112px; height:46px; margin-left:15px;margin-top:4px;position:absolute; background:url(images/asrock.png) no-repeat;}



@media screen and (max-width: 480px) {
	#Logo {width:240px;}
}
.wrapper {padding:3em 0 2em 0;position:relative;}
.wrapper > .inner {margin:0 auto;}
.wrapper h1 {
	line-height:1.2em;
	padding-top:1em;
	padding-bottom:0.2em;
	color: #b3924b;
	font-size: 36px;
	font-family: "微軟正黑體", Arial;
	font-weight: bold;
}
.wrapper h2 {color:#fff;font:400 2em "Trebuchet MS", arial, helvetica, sans-serif;line-height:1em;text-shadow:2px 2px #eee;padding-top:3em;padding-bottom:0.2em;}
.wrapper h3 {color:#fff;font:400 1.6em "Trebuchet MS", arial, helvetica, sans-serif;line-height:1em;text-shadow:2px 2px #eee;padding:0.5em 0;}

.wrapper li {color:#888;line-height:1.5em;font-size:1.2em;font-family: arial, helvetica, sans-serif;}
.wrapper p {color:#888;line-height:1.5em;font-size:1.2em;font-family: arial, helvetica, sans-serif;padding: 5px 35px 5px 15px;}

.wrapper li {list-style:circle;margin-left:1.2em;}
.wrapper p a, .wrapper li a, .wrapper td a {color:#00f;text-decoration:none}
.wrapper p a:hover, .wrapper li a:hover, .wrapper td a:hover {color:#0aa;}
.wrapper input[type="submit"], .wrapper input[type="reset"], .wrapper input[type="button"], .wrapper button, .wrapper .button {-moz-appearance: none;-webkit-appearance: none;-ms-appearance: none;appearance: none;border-radius: 2.5em;border: 0;cursor: pointer;display: inline-block;font-weight: 700;height: 2.85em;line-height: 2.95em;min-width: 10em;margin:0.5em;padding: 0 1.5em;text-align: center;text-decoration: none;white-space: nowrap;background-color: #555;border:1px solid #666;box-shadow: none;color: #eee !important;}
.wrapper input[type="submit"].icon:before, .wrapper input[type="reset"].icon:before, .wrapper input[type="button"].icon:before, .wrapper button.icon:before, .wrapper .button.icon:before { color: #bbb; }
.wrapper input[type="submit"]:hover, .wrapper input[type="reset"]:hover, .wrapper input[type="button"]:hover, .wrapper button:hover, .wrapper .button:hover { background-color: #777;text-shadow:1px 1px #000; border:1px solid #888; }
.wrapper input[type="submit"]:active, .wrapper input[type="reset"]:active, .wrapper input[type="button"]:active, .wrapper button:active, .wrapper .button:active { background-color: #444;}
@media screen and (max-width: 1280px) {
	.wrapper > .inner {width: 90%;}
}
@media screen and (max-width: 980px) {
	.wrapper > .inner {width: 95%;}
}
@media screen and (max-width: 480px) {
	.wrapper {padding:1em 0;}
	.wrapper > .inner {width: 99%;}
}
table {border-collapse:collapse;border-spacing:0;width:100%;}
table td {font:100 1.2em arial;border-bottom:1px solid #ccc;color:#888;padding:1em;}



.grid-1, .grid-1-1, .grid-2, .grid-3, .grid-5{width:100%;}
.grid-4-1, .grid-4-2{width:50%;float:left;}

.grid-5 .image{
	width:100%;
	max-width: 230px;
	display:block;
	margin: auto;
	
	}
.grid-3 .image{
	width:100%;
	max-width: 960px;
	display:block;
	margin: auto;
	}

.grid-2{
	width:100%;
	margin: 10px 100px 20px 100px;
	}
.grid-2 p{
	width:90%;
	font-family: "微軟正黑體", Arial;	
	}
.grid-1 .image{
	width:100%;
	max-width: 1920px;
	display:block;
	margin: auto;
	
	}
.grid-1-1 .image{
	width:100%;
	max-width: 1920px;
	display:block;
	margin: auto;
	}
.grid-4 .image{
	width:100%;
	max-width: 100px;
	display:block;
	margin: auto;
	}
	
.grid-6 {
	width:100%;
	float:left;
}
.grid-6 .image{
	width:100%;
	max-width: 200px;
	display:block;
	margin: 10px 10px 20px 100px;
	}
.grid-7 {
	width:100%;
	float:left;
}
.grid-7 p{
	color:#ccc;
	font-family: Verdana, Geneva, sans-serif;
	line-height:1em;
	margin: 2px 300px 10px 90px;
	font-size: 12px;
	line-height: 15px;
}	
@media screen and (max-width: 980px) {
	.grid-1, .grid-1-1, .grid-2, .grid-3 {width:100%;}
	.grid-4-1, .grid-4-2 {width:50%;}
}
@media screen and (max-width:736px) {
	.grid-4, .grid-3, .grid-2 {width:100%;}
	.grid-4-1, .grid-4-2 {width:100%;}
	.grid-5 {width:50%;}
}
@media screen and (max-width: 480px) {
	.grid-4-1, .grid-4-2, .grid-4, .grid-3, .grid-2, {width:100%;}
	.grid-5 {width:70%;display:block;margin: auto;}
}

.image {border-radius: 0;border: 0;display: inline-block;position: relative;}
.image img {border-radius: 0;display: block;}
.image.left, .image.right {max-width: 50%;}
.image.left img, .image.right img {width: 100%;}
.image.left {	float: left; padding: 0 1.5em 1em 0; top: 0.25em;}
.image.right {float: right; padding: 0 0 1em 1.5em; top: 0.25em;}

#footer {background-color: #1E2832;color: rgba(255, 255, 255, 0.75);text-align: center;}
#footer .inner {padding: 6em 0 4em 0;	border-top: solid 1px rgba(255, 255, 255, 0.1);margin: 0 auto;width: 75%;font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;}
@media screen and (max-width: 980px) {
	#footer .inner {padding: 5em 0 3em 0;width: 100%;}
}
@media screen and (max-width: 736px) {
	#footer .inner {padding: 3em 0 1em 0;}
}
@media screen and (max-width: 480px) {
	#H2Rsmall {display:none;}
	#footer .inner {padding: 2em 0 0.1em 0;}
}

.transhover {filter:alpha(opacity=50);-moz-opacity:0.5;opacity: 0.5;}

#GoTop {width:80px;height:80px;position:fixed;right:1em;bottom:1em;;z-index:10005;background:url(images/arrow.png);display:none;cursor:pointer;}


.Spec1 {width:80%;margin:0 auto;}
.Spec1 tr td{
	vertical-align:middle;
	background-color:#ccc;
	color:#000;
	border-bottom:1px solid #fff;
	border-right: 1px solid #fff;
	background:-webkit-gradient(linear, left bottom, left top, color-stop(0.39, rgb(189,189,189)), color-stop(0.7, rgb(224,224,224)));
	background:-moz-linear-gradient(center bottom,rgb(189,189,189) 39%,rgb(224,224,224) 70%);
	text-align: center;
	padding: 10px 0 5px 0;
	font-size:12px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	line-height:1.6em;
}
.Spec1 tr td h1{
	color:#000;
	text-align: left;
	padding: 0px 0px 2px 20px;
	font-size:32px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	line-height:1.6em;
	text-shadow:1px 1px #fff;
}
.Spec1 tr:nth-child(even) td{	background-color:#555;color:#f0f0f0;border-bottom:1px solid #444;background:-webkit-gradient(linear,left bottom,left top,color-stop(0.39, rgb(85,85,85)),color-stop(0.7, rgb(105,105,105)));

.Spec1 h2{color:#000;font:400 2em "Trebuchet MS"; text-shadow:2px 2px #ccc; line-height:1em;padding:0.2em auto 1em;padding-top:0.2em;padding-bottom:0.2em;}