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

body{
	margin:0;
	padding:0;
	font-family: "Meiryo","MS P Gothic","Osaka",Verdana,Arial, Helvetica, sans-serif;
	font-size:75%;
	line-height:160%;
	background:#53b2ff url("../img/body_bg.gif") 50% 0 repeat;
	color:#333333;
}

img{
	border:0;
	vertical-align:top;
}
h1{
	margin:0;
	padding:0 0 0;
	font-size:100%;
	line-height:100%;
	width:181px;
	height:53px;
	overflow:hidden;
}
	h1 a{
		display:block;
		height:53px;
		background:url("../img/header_logo.gif") repeat-x;
		text-indent:-9050px;
		outline:none;
	}
h2{
	margin:0 0 0;
	padding:0;
	font-size:100%;
	line-height:100%;
	clear:both;
}

h3{
	margin:20px 0 0;
	padding:0;
	font-size:100%;
	line-height:100%;
	clear:both;
}
.toppage h3{
	
}
h4{
	margin:20px 0 0;
	padding:0;
	font-size:100%;
	line-height:100%;
	clear:both;
}
h5{
	margin:8px 0 10px;
	padding:0;
	font-size:100%;
	line-height:100%;
	clear:both;
}
p{
	margin:1.4ex 0;
}

form{
	margin:0;
	padding:0 0;
}

fieldset{
	margin:10px 0 20px;
}

legend{
	color:#666699;
}


pre{
	line-height:100%;
	font-family:"ＭＳ ゴシック", "Osaka－等幅";
}



a:link		{color:#0088ff;text-decoration:none;}
a:visited	{color:#a000a0;text-decoration:none;}
a:hover		{color:#ff3300;text-decoration:underline;}
a:active	{color:#ff3300;text-decoration:underline;}



.root{
	margin:0;
	padding:47px 0 0;
	background:url("../img/root_bg.gif") 50% 0 repeat-x;
	text-align:center;
}
	.header{
		width:818px;
		margin:0 auto;
		padding:0;
		position:relative;
		text-align:left;
		overflow:hidden;
		height:201px;
	}
		.toppage .header{
			height:467px;
		}
		
		
		.hmenu{
			position:absolute;
			height:53px;
			overflow:hidden;
			top:0;
			left:296px;
			margin:0;
			padding:0;
			list-style-type:none;
			width:489px;
		}
			.hmenu-demo{
				width:132px;
				height:53px;
				float:left;
			}
			.hmenu-demo a{
				display:block;
				height:53px;
				background:url("../img/header_btn_demo.gif") repeat-x;
				text-indent:-9540px;
				outline:none;
			}
			.hmenu-intro{
				width:132px;
				height:53px;
				float:left;
			}
				.hmenu-intro a{
					display:block;
					height:53px;
					background:url("../img/header_btn_introduction.gif") repeat-x;
					text-indent:-9540px;
					outline:none;
				}
			.hmenu-download{
				padding-left:2px;
				width:223px;
				height:53px;
				float:left;
			}
				.hmenu-download a{
					display:block;
					height:53px;
					background:url("../img/header_btn_download.gif") repeat-x;
					text-indent:-8920px;
					outline:none;
				}

		.header-swf{
			background:url("../../img/index_mainswf_bg.gif") no-repeat;
			width:800px;
			height:360px;
			padding:7px 9px 11px;
		}
		.gmenu{
			background:url("../img/gmenu_bg.gif") no-repeat;
			width:818px;
			height:139px;
			padding:8px 0 0 21px;
			margin:0;
			list-style-type:none;
		}
		.gmenu li{
			margin:0;
			padding:0 4px 0 0;
			width:126px;
			height:120px;
			float:left;
			overflow:hidden;
		}
		.gmenu li a{
			display:block;
			height:110px;
			text-indent:-9450px;
			outline:none;
		}
		.gmenu01 a{background:url("../img/gmenu01.gif") repeat-x;}
		.gmenu02 a{background:url("../img/gmenu02.gif") repeat-x;}
		.gmenu03 a{background:url("../img/gmenu03.gif") repeat-x;}
		.gmenu04 a{background:url("../img/gmenu04.gif") repeat-x;}
		.gmenu05 a{background:url("../img/gmenu05.gif") repeat-x;}
		.gmenu06 a{background:url("../img/gmenu06.gif") repeat-x;}
		.gmenu li a:link{background-position:0 0px;}
		.gmenu li a:visited{background-position:0 0px;}
		.gmenu li a:hover{background-position:0 -110px;}
		.gmenu li a:active{background-position:0 -110px;}


	.main{
		width:740px;
		margin:0 auto;
		text-align:left;
		background:url("../img/main_bg.gif") 50% 7px repeat-y;
	}

		.toppage .main{
			background-position:50% -4px;
		}
		.canvas{
			margin:0 0 0;
			background:url("../img/content_bg.gif") 0 0 no-repeat;
			padding:5px 15px;
		}
		
			.canvas-leadtxt{
				float:left;
				padding:0 0 1em 25px;
			}
			.canvas-leadtxt h3{
				margin:5px 0 15px;
			}
			.canvas-headerimg{
				display:block;
				float:right;
				padding:0 0 1em;
			}
		
		.content{
			clear:both;
			width:620px;
			padding:0 45px 0;
			margin:0 auto;
			text-align:left;
		}
			.content-left{
				padding:10px 0 10px 0;
				width:240px;
				float:left;
			}
			.content-right{
				float:right;
				padding:10px 0 10px 0;
				width:360px;
				float:right;
			}
			
			.useful-box{
				background:url("../img/case_useful_bg.gif") no-repeat;
				margin-bottom:20px;
			}
				.useful-box-head{
					float:left;
					width:202px;
				}
				.useful-box-body{
					float:right;
					width:380px;
					padding:18px 20px 5px 0;
				}
				.useful-box-foot{
					clear:both;
					background:url("../img/case_useful_footer.gif") no-repeat;
					height:8px;
				}
			
			.case-footer-btnL{
				float:left;
				width:274px;
				padding:10px 0 30px 20px;
				text-align:center;
			}
			.case-footer-btnR{
				float:right;
				width:274px;
				padding:10px 20px 30px 0px;
				text-align:center;
			}
			
			
		.footer{
			clear:both;
			width:620px;
			margin:0 auto;
			padding-bottom:25px;
			background:url("../img/footer_bg.gif") no-repeat;
		}
			.fmenu{
				text-align:center;
				padding:30px 0 10px;
			}
			.footer-copy{
				width:620px;
				height:20px;
			}
				.footer-copy a{
					display:block;
					height:20px;
					background:url("../img/footer_txt_copy.gif") repeat-x;
					text-indent:-9300px;
					outline:none;
				}


.clear{clear:both;}
hr.clear{visibility:hidden;}
.caution{color:#ff3300;}
.note{color:#0033ff;}






.bordered-table,
.bordered-table td,
.bordered-table th{
	border:1px solid #cccccc;
	border-collapse:collapse;
	border-spacing:0;
}

.bordered-table{
	margin:1ex 10px;
	width:600px;
}
.bordered-table thead th{
	background:#e3f2ff;
	text-align:center;
	white-space:nowrap;
}
.bordered-table tbody th{
	font-weight:normal;
	vertical-align:top;
	background:#e3f2ff;
	text-align:left;
	white-space:nowrap;
	padding-left:1ex;
	padding-right:1ex;
}

.bordered-table tbody td{
	padding-left:1ex;
	padding-right:1ex;
	vertical-align:top;
}



.splitter{
	width:620px;
	height:26px;
	background:url("../img/splitter_line01.gif") no-repeat;
	margin:4ex auto;
}

.em-box{
	border:2px solid #82ab48;
	margin:0 10px;
	background:#f9ffe9;
}
.em-box p{
	margin:0.7ex 10px;
}


.centered-btn{
	clear:both;
	text-align:center;
	margin:4ex auto;
}




.index-caselist{

}
	.index-caselist-head{
		
	}
	.index-caselist-body{
		width:740px;
		height:601px;
		background:url("../../img/index_caselist_bg.gif") no-repeat;
		position:relative;
	}
	.index-caselist-body ul{
		position:absolute;
		margin:0;
		padding:0;
		left:27px;
		top:15px;
		list-style-type:none;
	}
	.index-caselist-body li{
		position:absolute;
		margin:0;
		padding:0;
		width:217px;
		height:220px;
	}
		.index-caselist-body li a{
			display:block;
			height:220px;
			text-indent:-9900px;
			outline:none;
		}
		.index-btn-case01{top:0;left:0;}
		.index-btn-case02{top:0;left:234px;}
		.index-btn-case03{top:0;left:468px;}
		.index-btn-case04{top:238px;left:0;}
		.index-btn-case05{top:238px;left:234px;}
		.index-btn-case06{top:238px;left:468px;}
		.index-btn-case01 a{background:url("../../img/index_btn_case01.gif") repeat-x;}
		.index-btn-case02 a{background:url("../../img/index_btn_case02.gif") repeat-x;}
		.index-btn-case03 a{background:url("../../img/index_btn_case03.gif") repeat-x;}
		.index-btn-case04 a{background:url("../../img/index_btn_case04.gif") repeat-x;}
		.index-btn-case05 a{background:url("../../img/index_btn_case05.gif") repeat-x;}
		.index-btn-case06 a{background:url("../../img/index_btn_case06.gif") repeat-x;}
		.index-caselist-body li a:link		{background-position:0 0px;}
		.index-caselist-body li a:visited	{background-position:0 0px;}
		.index-caselist-body li a:hover		{background-position:0 -220px;}
		.index-caselist-body li a:active	{background-position:0 -220px;}
	

.index-abilities{
	background:url("../../img/index_ability_bg.gif") 0 100% no-repeat;
	margin:10px 0;
	width:620px;
}
	.index-ability-left{
		float:left;
		width:305px;
		margin:0 0;
	}
	.index-ability-right{
		float:right;
		width:305px;
		margin:0 0;
	}
		.index-ability-head{
			margin:0;
			padding:0;
			width:305px;
			height:22px;
			overflow:hidden;
		}
		.index-ability-head img{
			display:block;
		}
		.index-ability-img{
			float:left;
			padding:5px 0 5px 10px;
			width:115px;
		}
		.index-ability-body{
			float:right;
			padding:5px 10px 5px 0;
			width:160px;
		}

.footer-link{
	margin:0 10px 10px;
	padding:1ex 20px;
	background:url("../../img/link_arrow01.gif") 0 50% no-repeat;
}

/* Snazzy Borders - http://www.cssplay.co.uk/boxes/snazzy.html */
#xsnazzy { 
  background:transparent; 
  margin:1em; padding:0; 
  width:700px;
}
#xsnazzy .h, #xsnazzy p { 
  margin:0; 
  padding:10px 15px; 
  line-height:2em; 
}
#xsnazzy .h { font-size:1.5em; color:#60c8d8; padding-bottom:0; font-weight:bold; }
#xsnazzy .xtop, #xsnazzy .xbottom {display:block; background:transparent; font-size:1px; }
#xsnazzy b { display:block; overflow:hidden; }
#xsnazzy .xb1, #xsnazzy .xb2, #xsnazzy .xb3 {height:1px; }
#xsnazzy .xb2, #xsnazzy .xb3, #xsnazzy .xb4 {background:#f2f9fd; border-left:1px solid #c8ebf9; border-right:1px solid #c8ebf9; }
#xsnazzy .xb1 { margin:0 5px; background:#c8ebf9; }
#xsnazzy .xb2 { margin:0 3px; border-width:0 2px; }
#xsnazzy .xb3 { margin:0 2px; }
#xsnazzy .xb4 { height:2px; margin:0 1px; }
#xsnazzy .xboxcontent { display:block; background:#f2f9fd; border:0 solid #c8ebf9; border-width:0 1px; }