@charset "utf-8";
/* CSS Document */

html, body { 
	height:100%; /* needed for container min-height */
}
body {
	color:#000000;
	font:normal normal 16px/100% "微軟正黑體", Arial, Helvetica, sans-serif;
	margin:0;
	padding:0;
}
a:link, a:visited, a:active {
	color:#2c7ec2;
	text-decoration:none;
}
a:hover{
	text-decoration:underline;
}
a,area {
	outline: none; /* for Firefox */
	hlbr:expression(this.onFocus=this.blur()); /* for IE */
}
img {
	border:none;
}
#wrapper {
	 position:relative;
	 height:auto !important;
	 height:100%;
	 min-height:100%; 
}
#header-wrapper,
#content-wrapper,
#footer-wrapper {
	width:100%;
}
.header,
.content,
.footer {
	width:1200px;
	margin:0 auto;
}
.content {
	*margin-top:70px;
}
#header-wrapper{
	height:70px;
	height:110px\9;
	position:fixed;
	top:0;
	z-index:999;
	border-bottom:1px solid #183d67;
	background: #418ec6; /* Old browsers */
	background: -moz-linear-gradient(top,  #418ec6 0%, #184d8c 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#418ec6), color-stop(100%,#184d8c)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #418ec6 0%,#184d8c 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #418ec6 0%,#184d8c 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #418ec6 0%,#184d8c 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #418ec6 0%,#184d8c 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#418ec6', endColorstr='#184d8c',GradientType=0 ); /* IE6-9 */
}
.header {
	height:70px;
	width:980px;
	z-index:999;
	position:relative;
}
#content-wrapper {
	background:url(../i/bg_banner.jpg) top center no-repeat;
	margin-top:70px;
	
	z-index:-99;
}
.banner {
	height: 360px;
	width: 960px;
	position: relative;
	margin: 0 auto;
}
.banner h1 {
	color:#FFFFFF;
	font-size:2.4em;
	line-height:100%;
	position:absolute;
	top:75px;
	left:0px;
	text-shadow:-1px -1px 0px #333333;
}
.banner ul {
	list-style:none;
	margin:0;
	padding:0;
	position:absolute;
	top:160px;
	left:5px;
	text-shadow:0 0 5px #111111;
	color:#FFFFFF;
}
.banner ul li {
	font-size:18px;
	font-weight:bold;
	line-height:140%;
}
.banner a.btnPosition {
	position:absolute;
	top:275px;
	left:390px;
}
.banner img.intropic {
	position:absolute;
	right:-10px;
	top:85px;
}
.feature, .device, .followus {
	background: url(../i/bg-module-top-shadow.png) top center no-repeat;
	height: 500px;
	padding-top: 40px;
}
.feature h1, .device h1, .followus h1, .gc_mobile h1 {
	line-height:100%;
	text-align:center;
}
.intro {
	background: none;
	height: 470px;
	padding-top: 30px;
}
.intro h1 {
	line-height:100%;
	text-align:center;
}
.intro .introBody {
	width:945px; margin:30px 127px;
}
.intro .introfunc {
	width:200px; margin-right:30px;
}
.intro .introfunc img{
	width:200px;
	height:135px;
}
.intro .introfunc h3{
	text-align:center; margin:0px; padding:0px;
}
.intro .introfunc p{
	font-size:12px; line-height:24px; color:#666; text-align:justify;
}
.gc_mobile {
	background: url(../i/bg-module-top-shadow.png) top center no-repeat;
	height: 520px;
	padding-top: 60px;
	position:relative;
}
.gc_mobile .mobileDL {
	position:absolute;right:145px;top:300px;width:283px;height:405px;
}
.gc_mobile .mobileDL2 {
	position:absolute;right:105px;top:175px;width:235px;height:405px;
}

.gc_mobile p{
	margin:30px 0px 70px 120px; line-height:24px;width:930px;
}
.gc_mobile .mobileBody {
	margin:30px 0px 30px 127px;
}
.gc_mobile .mobilefunc {
	width:125px; margin-right:30px; text-align:center;
}
.gc_mobile .mobilefunc h3 {
	text-align:center; margin:0px; padding:0px;margin:10px 0px;
}
.gc_mobile .mobilefunc p {
	font-size:12px; line-height:24px; color:#666; margin:0;width:120px; text-align:justify;
}
.gc_mobile .mobilefunc2 {
	width:330px; margin-right:20px; text-align:center;
}
.gc_mobile .mobilefunc2 h3 {
	text-align:center; margin:0px; padding:0px;margin:10px 0px;
}
.gc_mobile .mobilefunc2 p {
	font-size:12px; line-height:20px; color:#666; margin:0; width:320px; text-align:justify;
}

.device p{
	 margin:20px 120px; line-height:24px;
}
.basecampDL {
	width:555px;
	margin-bottom:80px;
}
.device .deviceBody {
	 margin:30px 200px;
}
.device .deviceBody img {
	 width:562px;
	 height:263;
}
.menu {
	position:relative;
	z-index:3;
	margin-top:35px;
}
.menu, .menu a{
	color:#ffffff;
	display:block;
	font-weight:bold;
	height:30px;
	text-decoration:none;
}

.menu a {
	font-size:18px;
	line-height:30px;
	text-align:center;
	padding:0 18px;
	float:left;
	text-shadow:1px 1px 1px #003366;
	margin:0 3px;
}
.menu a:hover, .menu a.current {
	color:#2c7ec2;
	border-radius:20px;
	background-color:#efefef;
	box-shadow:-1px -1px 0px #003366;
	text-shadow:1px 1px 1px #ffffff;
}
.menu a:active {
	color:#1365a8;
	text-shadow:none;
}
.submenu {
	position:absolute;
	top:71px;
	left:0px;
	z-index:4;
	background-color:#ffffff;
	width:100%;
	text-align:left;
	box-shadow:-1px 1px 3px #999;
}
.submenu a {
	font-size:14px;
	font-weight:bold;
	line-height:40px;
	text-align:center;
	padding-right:20px;
	z-index:5;
}
#footer-wrapper {
	background-color:#444444;
	position:fixed;
	bottom:0;
}

.footer {
	color:#CCCCCC;
	font-size:12px;
	line-height:40px;
	text-align:right;
}
.footer a:link,.footer a:visited, .footer a:hover, .footer a:active {
	color:#CCCCCC;
}

.float-left {
	float:left;
}
.float-right {
	float:right;
}
clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
.clearfix {
	display: inline-block;
}
html[xmlns] .clearfix {
	display: block;
}
* html .clearfix {
	height: 1%;
}

/*naoki*/

#content-wrapper .garmin_connect{background:url(../i/bg_banner_connect.jpg) no-repeat;}
#content-wrapper .garmin_adventures{background: url(../i/bg_banner_basecamp.jpg) no-repeat;}