*{margin:0; padding:0;}

*{box-sizing : border-box}
*{-moz-box-sizing : border-box}

html{height:100%;} 

body{
	height:100%; 
	margin: 0px;
	padding: 0px;
	color: #333333;
	font-family:Arial,sans-serif;
	background:#fafafa url(img/bg_pagebody.png) repeat-x;
}

body > #container{ height:auto; }

/*--------------------------------------------------- clearfix */

.clearfix:after {
	content: ".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}

/* for IE7 */
.clearfix {
	display:inline-block;
	zoom: 1;
}

/*Hides from IE-mac \*/
* html.clearfix{height:1%;}
.clearfix{display:block;}
/*End hide from IE-mac */

div.clearFloat{
	clear:both;}

/*------------------------------------- basc tags decorations */

p{
	font-size:0.85em;
	line-height:1.5em;
}
p.cap{
	font-size:1em;
	font-weight:bold;
	margin-top:10px;
}

p.space{
	margin-top:20px;
	clear:both;
}
p.spaceBottom10{
	margin-bottom:10px;
}
p.spaceBottom50{
	margin-bottom:30px;
}

p.txtCenter{
	text-align:center;
}

p.note{
	color:#666666;
	font-size:8pt;
}

p.right{
	float:right;
}

p.indexTop{
	margin-left:40px;
}

span{
	color:#ff9900;
	font-weight:bold;
}


img { border:none;}
img.right {
	float:right;
	margin-left:20px;
}
img.left {float:left;}

a:visited, a:link{
	color:#ff9900;
}

a:hover, a:active{
	color: #ff3300;
}

h1{
	color:#4F6273;
	font-size:9pt;
	font-weight:normal;
	margin:0 auto;
	padding:30px 0 0 200px;
}


h3{
	clear:both;
	font-size:13pt;
	margin:0 auto;
	padding:0 0 0 0;
}


ul{ list-style:none;}


/* -------------------------------------------------- container */
#container{
	width:800px;
	height:100%;
    min-height:100%; 
	margin:0px auto 0px auto;
	background-color:#ffffff;
	background: url(img/contents_bg.png) repeat-y;
	}

#index-extend{
	width:900px;
	margin:0px auto 0px auto;
}
#container_index{
	width:800px;
	margin:0px auto 0px auto;
	background-color:#ffffff;
	background: url(img/contents_bg.png) repeat-y;
	}

/* --------------------------------------------------- header */

#header{
	width:800px;
	margin:0px auto;
	padding:0 0 0 0;
}

img#logo{
	float:left;
	margin-top:10px;
	margin-left:10px;
}

#header_body{
	float:right;
	width:260px;
	margin-right:10px;
}

ul.header_menu{
	float:left;
	margin:5px 0 0 7px;
	height:20px;
}

ul.header_menu li{
	font-size:8.5pt;
	margin:0 0 0 0;
	padding:0 4px 0 10px;
	background: url(../../../img/common/list-bg.png) no-repeat;
	}


ul.header_menu a, ul.header_menu a:visited{
	color:#737373;
}
ul.header_menu a:hover{
	color: #ff9900;
}


/* ------------------------------------------------------- menu */
#top-menu{
	float:left;
	margin-bottom:20px;
}

ul#menu{
	clear:both;
	width:800px;
	height:35px;
	margin:0 auto;
	overflow:hidden;
	position: relative;
}
ul#menu li a {
	height: 35px;
	position: absolute;
	overflow: hidden;
	padding: 35px 0 0 0;
	text-indent: -100em;
	text-decoration: none;
	top: 0;
	width: 108px;}

html>body ul#menu li a{
	height: 0;
}


li#home a{
	background: transparent url(img/menu_home.png) no-repeat 0 0;
	left: 0px;
}

li#merit a{
	background: transparent url(img/menu_merit.png) no-repeat 0 0;
	left: 50px;
}
li#function a{
	background: transparent url(img/menu_function.png) no-repeat 0 0;
	left: 158px;
}

li#operation a{
	background: transparent url(img/menu_operation.png) no-repeat 0 0;
	left: 266px;
}
li#package a{
	background: transparent url(img/menu_package.png) no-repeat 0 0;
	left: 374px;
}
li#faq a{
	background: transparent url(img/menu_faq.png) no-repeat 0 0;
	left: 482px;
}
li#case a{
	background: transparent url(img/menu_case.png) no-repeat 0 0;
	left: 590px;
}

li#company a{
	background: transparent url(img/menu_company.png) no-repeat 0 0;
	left: 698px;
}

li#home a:hover,
li#merit a:hover,
li#function a:hover,
li#operation a:hover,
li#package a:hover,
li#faq a:hover,
li#case a:hover,
li#company a:hover{
	background-position:0px -35px;
}

/* -------------------------------------------------------- menu active page */

li#home_on a{
	background: transparent url(img/menu_home_on.png) no-repeat 0 0;
	left: 0px;
}

li#merit_on a{
	background: transparent url(img/menu_merit_on.png) no-repeat 0 0;
	left: 50px;
}
li#function_on a{
	background: transparent url(img/menu_function_on.png) no-repeat 0 0;
	left: 158px;
}

li#operation_on a{
	background: transparent url(img/menu_operation_on.png) no-repeat 0 0;
	left: 266px;
}
li#package_on a{
	background: transparent url(img/menu_package_on.png) no-repeat 0 0;
	left: 374px;
}
li#faq_on a{
	background: transparent url(img/menu_faq_on.png) no-repeat 0 0;
	left: 482px;
}
li#case_on a{
	background: transparent url(img/menu_case_on.png) no-repeat 0 0;
	left: 590px;
}
/* ----------------------------------------------------------------- contents */
div.contents{
	clear:both;
	width:740px;
	margin:10px auto 50px auto;
	background-color:#ffffff;
}

div.contents_case{
	clear:both;
	width:680px;
	margin:0px auto 40px auto;
	background-color:#ffffff;
}

div.contents_case h2{
	padding:0 0 0 10px;
	margin:0 auto 20px auto;
	font-size:1.5em;
	border-left:4px solid #ff9900;
}

div.contents h2{
	padding:0 0 0 10px;
	font-size:1.2em;
	border-left:4px solid #ff9900;
}


div#aboutRounding{
	width:680px;
	margin:10px auto;
	padding:10px;
}

div#aboutRounding img.right{
	margin-left:0px;
}

div#media{
	width:400px;
	float:right;
	background-color:#f5f5f5;
	}


/* ------------------------------------------------------- cautions */
div.caution{
	width:740px;
	margin:5px auto;
	background-color:#f8f8f8;
	clear:both;
}

div.caution p{
	margin:10px;
	padding:10px 0px 10px 0px;
	color:#666666;
	font-size:0.8em;
}


/* ---------------------------------------------------------- index */
div#topPage{
	width:900px;
	margin:0 auto;
	padding:0 0 0 0;
	height:460px;
	overflow:hidden;
	clear:both;
	background:url(img/banner.png) no-repeat;
}
div#topPage h2{	
	text-indent:-100em;
	}
	
div#topPage img{
	width:740px;
	margin:340px 80px 0 80px;	
	}
	
p.subTitle{
	font-size:1.1em;
	color:#ff6600;
	font-weight:bold;
	margin:0 0 5px 0;
	}

/* ---------------------------------------------------------- merit */

div.merit_right{
	width:360px;
	margin:0 auto 10px auto;
	float:right;
}

div.merit_left{
	width:360px;
	margin:0 auto 10px auto;
	float:left;
}

div.meritBottom{
	clear:both;
	width:740px;
	margin:0 auto;
	padding-top:30px;
}


/* ---------------------------------------------------------- package */

ul#package{
	float:right;
	margin:10px 0px;
	width:370px;
	border:1px solid #ff9900;
}

ul#package p.note{
	font-size:9pt;
	color:#666666;
}

ul#package li{
	padding:10px;
	border-bottom:1px solid #ff9900;
}

ul#package li.line_a{
	border-bottom:none;
}

div#packageNote{
	width:370px;
	float:right;
}


p#systemRrequires{
	clear:both;
	margin:0 auto 8px auto;
	font-weight:bold;
	font-size:1.2em;
	border-bottom:1px solid #ff9900;
	}

div#requires_right{
	float:right;
	width:360px;
}

div#requires_left{
	float:left;
	width:360px;
}

ul.requires{
	font-size:12px;
	margin-top:5px;
	}

ul.requires li{
	margin-bottom:5px;
	background:url(../../../img/common/list-bg.png) no-repeat;
	padding-left:15px;
}

div.contents#packageTitle{
	margin:10px auto 20px auto;
}


/*---------------------------------------------------------- FAQ */
p.q{
	color:#ff9900;
	margin-top:30px;
	font-weight:bold;
}

/*---------------------------------------------------- Case Study */
table.caseStudy {
	height:auto;
	border-collapse:collapse;
	font-size:1em;
}

table.caseStudy td{
	border:none;
	border-color:none;
	padding:0 0 0 0;
	background-color:#ffffff;
}

table.caseStudy td.text{
	border:none;
	border-color:none;
	padding:8px 8px 30px 8px;
	background-color:#ffffff;
}


/* --------------------------------------------------- How to buy */
div.howtobuyStep{
	clear:both;
	}
div.howtobuyStep#top{
	margin-top:20px;
}

/* --------------------------------------------------- About Costdown */
div.costdown{
	margin:10px auto;
	border:1px solid #ccc;
	padding:15px;
	}

h3.costdown{
	margin:0 auto 10px auto;
	border-bottom:1px solid #333;
	padding-bottom:3px;
}

span.costdownSub{
	font-weight:bold;
	font-size:1.1em;
	color:#FF6600;
}



/* ------------------------------------------ Get Acrobat Reader */
div#adobe{
	border:1px solid #cccccc;
	background-color:#f5f5f5;
	margin: 30px auto 0px auto;
}
div#adobe img{
	float:right;
	margin:10px;
}	

div#adobe p{
	margin:10px;
	font-size:85%;
}

/* ---------------------------------------------------- Download */

ul#download-doc {
	margin:10px auto;
}

ul#download-doc li{
	margin-bottom:5px;
	background:url(../../../img/common/list-bg.png) no-repeat;
	padding-left:15px;
}



/* --------------------------------------------------- gotoContact */
div#gotoContact{
	clear:both;
	width:280px;
	height:80px;
	margin:0 auto 10px auto;
}


/* ----------------------------------------------------- gotoNext */
div#gotoNext{
	clear:both;
	display:block;
	text-align:right;
	width:740px;
	margin:0 auto;
}

/* --------------------------------------------------- backToTop */
.backToTop{
	clear:both;
	display:block;
	text-align:right;
	width:740px;
	margin:0 auto;
}

.backToTop a{
	font-size:9pt;
	border-left:1px solid #ccc;
	padding-left:5px;
	margin-left:5px;
}

.backToTop a.noBorder{
	border-left:none;
	padding-left:0px;
	margin-left:0px;
}

/* --------------------------------------------------- footer */
#footer{
	clear:both;
	width:800px;
	margin:10px auto;
	text-align:center;
	border-top:1px solid #cccccc;
}

#footer p{
	font-size:75%;
	color:#aaa;
}