@charset "utf-8";

/*------ text setting ------*/

/*-- reset styles --*/

* {margin:0;padding:0}
body {font:62.5%/1.5 arial,helvetica,clean,sans-serif}
a {text-decoration:none;outline:none}
a:hover {text-decoration:underline}
ul,ol {list-style:none}
img,abbr {border:0}
h1,h2,h3,h4,h5,h6,strong {font-weight:normal}
em,address,dfn {font-style:normal}
table {border-collapse:collapse;border-spacing:0}

/*-- general styles --*/

#wrap {
	color:#ccc
}

/*------ common styles ------*/

#breadCrumb .nav li {
	display:inline
}

#mainNav .nav a {
	display:block;
}

#wrap,
#main {
	position:relative
}

#header .logo,
#mainNav,
#breadCrumb {
	position:absolute
}

#footer .company-info {
	float:left
}

#footer .copyright {
	float:right
}

/*------ layout ------*/

body {
	background:transparent url(../images/design/base-bg.png) 0 0
}

#wrap {
	width:950px;
	margin:49px auto 0
}

/*-- header --*/

#header .logo {
	z-index:1;
}

/*-- mainNav --*/

#mainNav {
	z-index:1;
	width:202px;
	margin:113px 0 0 25px;
	padding-bottom:50px;
	background:transparent url(../images/design/mainNav-bg1.png) center bottom no-repeat
}

#mainNav .nav {
	padding-top:28px;
	background:transparent url(../images/design/mainNav-bg2.png) center 0 no-repeat
}

#mainNav .nav > li {
	float:left;
	margin-top:20px;
	padding-top:20px;
	border-top:1px solid #cab4a4
}

#mainNav .nav > li:first-child {
	padding-top:0;
	border:0;
}

#mainNav .nav a {
	width:193px;
	margin-left:3px;
	text-indent:-999em;
	background:transparent url(../images/design/mainNav.png) 0 0 no-repeat
}

#mainNav .about > a {
	height:18px;
	background-position:0 0
}

#mainNav .about:hover > a,
#mainNav .about.current > a {
	height:18px;
	background-position:right 0
}

#mainNav .news > a {
	height:16px;
	background-position:0 -18px
}

#mainNav .news:hover > a,
#mainNav .news.current > a {
	height:16px;
	background-position:right -18px
}

#mainNav .product > a {
	height:16px;
	background-position:0 -34px
}

#mainNav .product:hover > a,
#mainNav .product.current > a {
	height:16px;
	background-position:right -34px
}

#mainNav .faq > a {
	height:22px;
	background-position:0 -50px
}

#mainNav .faq:hover > a,
#mainNav .faq.current > a {
	height:22px;
	background-position:right -50px
}

#mainNav .contact > a {
	height:17px;
	background-position:0 bottom
}

#mainNav .contact:hover > a,
#mainNav .contact.current > a {
	height:17px;
	background-position:right bottom
}

#mainNav .nav .subNav {
	padding-top:6px
}

#mainNav .nav .subNav li {
	clear:right;
	padding-top:9px;
	padding-right:8px
}

#mainNav .nav .subNav a {
	float:right;
	height:14px;
	background:transparent url(../images/design/mainNav-sub.png) 0 0 no-repeat
}

#mainNav .subNav .item1 a {
	width:61px;
	background-position:-19px 0
}

#mainNav .subNav .item1 a:hover,
#mainNav .subNav .item1.current a {
	background-position:right 0
}

#mainNav .subNav .item2 a {
	width:61px;
	background-position:-19px -23px
}

#mainNav .subNav .item2 a:hover,
#mainNav .subNav .item2.current a {
	background-position:right -23px
}

#mainNav .subNav .item3 a {
	width:54px;
	background-position:-26px -46px
}

#mainNav .subNav .item3 a:hover,
#mainNav .subNav .item3.current a {
	background-position:right -46px
}

#mainNav .subNav .item4 a {
	width:54px;
	background-position:-26px -69px
}

#mainNav .subNav .item4 a:hover,
#mainNav .subNav .item4.current a {
	background-position:right -69px
}

#mainNav .subNav .item5 a {
	width:41px;
	background-position:-39px -92px
}

#mainNav .subNav .item5 a:hover,
#mainNav .subNav .item5.current a {
	background-position:right -92px
}

#mainNav .subNav .item6 a {
	width:80px;
	background-position:0 bottom
}

#mainNav .subNav .item6 a:hover,
#mainNav .subNav .item6.current a {
	background-position:right bottom
}

/*-- main --*/

#main {
	padding-top:55px
}

#main h2.title {
	position:absolute;
	top:-49px;
	right:0;
	width:661px;
	height:48px;
	padding:56px 0 0 16px;
	background:transparent url(../images/design/title-bg-trans.png);
}

#main #contents {
	min-height:600px;
	padding:0 0 62px 276px;
	background:transparent url(../images/design/main-bg.png) 0 0 repeat-y
}

#main > .dividing {
	width:253px;
	height:4px;
	background:transparent url(../images/design/main-dividing.png) 0 bottom no-repeat
}

#main > .dividing hr {
	display:none
}

/*-- latest news --*/

#latestNews {
	position:relative;
	overflow:hidden;
	width:828px;
	height:25px;
	margin-top:40px;
	padding:1px 0 0 122px;
	background:transparent url(../images/design/latestNews-bg-trans.png);
	color:#999;
	font-size:1.2em
}

#latestNews dt {
	display:none
}

#latestNews dd {
	position:absolute;
	margin-top:3px
}

#latestNews .date {
	margin-right:6px
}

#latestNews a {
	color:#999
}

/*-- breadCrumb --*/

#breadCrumb {
	z-index:1;
	top:26px;
	right:13px;
	color:#999;
	font-size:1.1em;
	text-transform:uppercase
}

#breadCrumb .nav li {
	margin-right:3px;
	padding-left:11px;
	background:transparent url(../images/icon/gray-arrow.png) 0 4px no-repeat
}

#breadCrumb .nav li:first-child {
	background:none
}

#breadCrumb .nav a {
	color:#747474;
	text-decoration:underline
}

/*-- footer --*/

#footer {
	clear:both;
	height:58px;
	padding:8px 28px 0 4px;
	color:#666;
	font-family:verdana,arial,"新細明體";
	text-transform:capitalize
}

#footer a {
	color:#666;
	text-decoration:underline
}

#footer .company-info {
	font-size:1.2em
}

#footer .company-info .tel {
	margin-left:10px
}

#footer .copyright {
	font-size:1.1em
}

#footer a.sitemap {
	margin-left:4px;
	color:#f90
}

/*-- etc --*/

#adorn-box {
	position:absolute;
	top:-49px;
	right:0
}

.hiddenInfo {display:none}

.web-design {
	position:absolute;
	visibility:hidden
}

/* access key */

.acckey {position:absolute;visibility:hidden}

/* clear float */

* html .clearfix {height:1%}
*+html .clearfix {display:inline-block}
.clearfix:after {content:".";display:block;height:0;clear:both;visibility:hidden}