@charset "UTF-8";
body {	line-height:1;	margin: 0;	padding: 0;	line-height:18px;	color:#CCC;	font-size: 14px;}
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
a{text-decoration:none; outline: none; /* for Firefox */ hlbr:expression(this.onFocus=this.blur()); /* for IE */}
a:hover { text-decoration:none; }
legend, caption, hr { display:none; }
em { font-style:normal; }
img { vertical-align:middle;border:0;}
html,body{	position:relative;	height:100%;}
#wrap{position:relative;height:100%; min-width:960px;}
body.main{background-color: #d6dae0;}
body.feature{background-image:url(images/background.jpg);background-repeat: no-repeat;}
body.keyfunction{background-color: #dfeaf1;background-position: 50% -300px;background-repeat: no-repeat;}
body.spec{background-color: #e9efed;background-position: 50% -300px;background-repeat: no-repeat;}
body.media{background-color: #f0ebe3;background-position: 50% -300px;background-repeat: no-repeat;}
img{background: transparent;-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE8 */   
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);   /* IE6 & 7 */      
zoom: 1;}


/* header */
#header {position:absolute;height:60px;top:0;left:0;width:100%;background: url(images/header_bg.png) repeat-x;z-index:9999;}
#header #logo{position:absolute; top:10px; left:17px;}
#header #navi{position:absolute; top:0; right:0; }
#header #navi ul {margin-top:28px;font-weight:700;}
#header #navi ul li{float:left;display:block;padding:0 8px 0 8px;}
#header #navi ul li a{font-size:18px;color:#777;height:20px;display:block;*line-height:24px;}
#header #navi ul .feature a:hover{ color:#333; }
#header #navi ul .keyfunction a:hover{ color:#333; }
#header #navi ul .media {font-size:16px; color:#ccc;}
#header #navi ul .media a:hover{ color:#333; }
#header #navi ul .spec { padding-right:32px; }
#header #navi ul .spec a:hover{ color:#333; }

#contetnts {position:relative;height:100%; }
#cotent-body {	position:relative;	min-height:60px;	height:100%;}
#cotent-body #arrow{position:absolute;top:25%;width:100%;z-index:999; margin-top:100px;left:0;}
#cotent-body #arrow #prev{	position:absolute;	left:2%;}
#cotent-body #arrow #next{	position:absolute;	right:2%;}
#header #navi .feature .over{color:#333;}
#header #navi .keyfunction .over{color:#333;}
#header #navi .media .over{color:#333;}
.feature .over{color:#5e6eb2;}

.ftitle1{font-family:'PFSquareSansProMedium';font-size:17px;color:#444;}

/*main*/
#main-container{ height:100%; position:relative; width:990px; margin:0 auto; text-align:left;}
#main-div{float:left;height:80px;}
#main-img1{	width:100%;	height:537px; background: url(images/index_img1.png) 50% 0 no-repeat;	position: absolute;	z-index:1;	top:80px;}
#main-img2{	width:722px; height:329px; margin:50px 134px;position: absolute;	z-index:999; top:200px;}


/* feature contents*/
#feature-div{float:left;height:80px;}
#feature-img1{	width:689px;	height:335px;	position: absolute;	z-index:111;	top:250px;	right: 0px;}
#feature-img2{	width:851px;	height:384px;	position: absolute;	top:180px;	right: 20px;}
#feature-text{	position:absolute;	top:120px;	left:100px;	text-align:left;}
	
#feature-text h1{	font-size:36px;	color:#fff;	font-weight: 700;	line-height:42px;}
#feature-text h2{	font-size:15px;	color:#FFF;	font-weight:normal;	padding-top:10px;	padding-left: 4px;}

#keyfeature-div{position:absolute; top:50%;left:50%;margin-left:-563px;width:100%;margin-top:-320px;}
#keyfeature-text{	position:absolute;	top:150px;	left:50px;	text-align:left;	line-height:28px;	font-size:15px;	}
#keyfeature-text ul { }
#keyfeature-text ul li{  }
#keyfeature-text ul li .over{ color:#FFF; font-weight:700;;}
#keyfeature-text ul li a{color:#CCC;}
#keyfeature-text ul li a:hover{	color:#CCC;}

#keyfeature-img-1{	position:absolute;	top:250px;	left:250px;	z-index:999;}
#keyfeature-img-1S{	position:absolute;	top:80px;	left:400px;	z-index:111;}
#keyfeature-img-2{	position:absolute;	top:250px;	left:650px;	z-index:999;}
#keyfeature-img-2S{	position:absolute;	top:320px;	left:120px;	z-index:111;}
#keyfeature-img-3{	position:absolute;	top:250px;	left:620px;	z-index:999;}
#keyfeature-img-3S{	position:absolute;	top:80px;	left:220px;	z-index:111;}
#keyfeature-img-4{	position:absolute;	top:250px;	left:250px;	z-index:999;}
#keyfeature-img-4S{	position:absolute;	top:80px;	left:450px;	z-index:111;}
#keyfeature-img-5{	position:absolute;	top:250px;	left:600px;	z-index:999;}
#keyfeature-img-5S{	position:absolute;	top:150px;	left:200px;	z-index:111;}
#keyfeature-img-6{	position:absolute;	top:250px;	left:300px;	z-index:999;}
#keyfeature-img-6S{	position:absolute;	top:150px;	left:350px;	z-index:111;}

#media-div{	position:relative;	width:853px; padding:0px;	top:100px;	margin:0px 68px;}
#media-img1{position:absolute; top:0px;left:470px;}
#media-img2{position:absolute; top:0px;left:470px;}
#media-img3{position:absolute; top:0px;left:470px;}

#media-menu{position:relative;top:80px; padding:0px;}
#media-menu ul {height:130px;}
#media-menu ul li{	float:left;	display:block;	width:284px;	position:relative;	margin-top:30px;}
#media-menu ul li.last{margin:0 0 0 0;}
#media-menu ul li:hover{color:#222 !important; }
#media-menu ul li p{	display:block;	position: absolute;	left:153px;	top:0px;	margin:0px 5px 0px 3px;}
#media-menu ul li .feature_demo{margin-top: -10px;}
#media-menu ul li p .title{	font-family:'Arial';	font-size:12px;	color:#FFF;	font-weight:bold;}
#media-menu ul li p .subtitle{font-family:'Arial'; font-size:12px;color:#777777; }
#media-menu ul li p .subtitle a{float:left;display:block; width:108px;vertical-align:middle;font-size:11px; line-height:13px;}

/* footer */
#footer {position:relative;	bottom:50px;}

#footer #copyright {width:940px;text-align:center;color:#f2f2f2;text-decoration:none;font:normal normal 12px/100% "微軟正黑體",Verdana, Geneva, sans-serif;margin:10px auto;}
#footer #copyright a{text-decoration:none;color:#f2f2f2;}
#footer #copyright a:hover{text-decoration:underline;}