.vtop{
vertical-align:top
}
.vmid{
vertical-align:middle
}
.vbtm{
vertical-align:bottom
}
#body1{
padding:2;
margin:2;
}
#page{
border:1px solid #004080;
background:#fff;
width:682px;
padding:2;
margin:2;
}
#page2{
border:1px solid #004080;
background:#fff;
width:682px;
font-size:0.8em;
color:#666;
text-align:center;
}
#banner{
background:url('img/CanvasTop.png') repeat-x left top;
border-bottom:1px solid #fff;
letter-spacing:2px;
text-align:left;
}
#banner h1{
font-size:24px;
color:#fff;
margin:0;
padding:10px 20px;
text-align:left;
vertical-align:middle;
}
#banner h2{
font-size:16px;
color:#fff;
margin:-20px 0 0 0;
padding:10px 20px;
vertical-align:middle;
}
#banner table{
margin:6px 10px 6px 10px;
}
#banner th{
color:#fff;
height:0px;
font-size:1px;
text-align:left;
vertical-align:middle;
}
#banner td{
color:#fff;
height:26px;
text-align:left;
vertical-align:middle;
}

/******************************************************
W3Cのデバッガで確認したところ、ひとつのページにおいて、
同名の識別子が複数存在してはならないようですので、上部の
メニューと、左側メニューでIDを"menu1","menu2"と別々にい
たしました。
(Jun.11,'09)
*******************************************************/

#menu1,#menu2,#menu3{
	border-collapse:collapse;
	background:#ecf5ff;
	width:100%;
	font-size:13px;
}
#menu1 td,#menu2 td,#menu3 td{
	border:1px solid #004080;
	border-right-width:0;
	background:#4169e1;
	height:20px;
	font-size:13px;
	width:16%;
	letter-spacing:1px;
	text-align:center;
}
#menu1 a,#menu2 a,#menu3 a{
	color:#f0f8ff;
	font-weight:bold;
	font-size:13px;
	width:100%;
	text-decoration:none;
}
#menu1 a:hover,#menu2 a:hover,#menu3 a:hover{
	color:#ffff00;
}

/**************************/

#left{
width:140px;
float:left;
margin-bottom:20px;
text-align:left;
}

#left h2{
background:url('img/menu1.png') repeat-x left top;
font-size:1em;
margin:0;
padding:4px 10px;
color:#fff;
}

#left h3{
background:url('img/menu1_2.png') repeat-x left top;
font-size:1em;
margin:0;
padding:4px 10px;
color:#fff;
}

#left ul{
list-style-type:none;
margin:0;
padding:0;
}
#left li{
border-bottom:1px solid #777;
font-weight:normal;
margin:0;
padding:4px 10px;
font-size:1em;
}
#left li a{
width:100%;
text-decoration:none;
color:#696969;
}
#left li a:hover{
color:#4682b4;
}
#right{
width:520px;
float:right;
padding:0 0 10px 0;
text-align:left;
}
#right a{
font-size:13px;
color:#4e71a9;
}
#right a:hover{
font-size:13px;
color:#ced5e5;
}
#right h2{
clear:both;
background:url('img/midasi1.png') no-repeat left top;
color:#fff;
margin:0 10px 0 0;
padding:6px 0 10px 10px;
font-size:13px;
}
#right h3{
font-size:13px;
color:#000000;
margin:0 0 4px 0;
padding:6px 10px 2px 0;
}
#right p{
clear:both;
font-weight:normal;
margin:0 10px 13px 0;
padding:0 6px;
font-size:13px;
line-height:120%;
}
#right img.left{
float:left;
margin-right:0.8em;
margin-bottom:0.5em;
}
#right img.right{
float:right;
margin-left:0.8em;
margin-bottom:0.5em;
}
#right th{
color:#666;
background:#fff;
height:14px;
font-size:13px;
text-align:left;
}
#right td{
color:#666;
background:#fff;
height:14px;
font-size:13px;
}
#right2 th{
color:#666;
background:#fff;
height:16px;
font-size:13px;
width:33%;
}
#right2 td{
color:#666;
background:#fff;
height:16px;
font-size:13px;
text-align:left;
width:33%;
vertical-align:top;
}
#right3{
width:520px;
float:right;
padding:0 10px 0 0;
text-align:left;
}
#right3 a{
font-size:13px;
color:#4e71a9;
}
#right3 h3{
font-size:15px;
color:#666;
margin:0 0 0 0;
padding:0 0 0 0;
}
#right3 th{
color:#666;
background:#fff;
font-size:13px;
}
#right3 td{
color:#666;
background:#fff;
font-size:13px;
text-align:none;
}
#pagetop{
padding:20px 10px 0 0;
text-align:right;
}
#copyright{
clear:both;
border-top:1px solid #004080;
color:#666;
padding:3px 10px;
text-align:center;
font-size:13px;
}
#main{
clear:both;
background:#fff;
width:680px;
}

/***** (Jun.5,'09)                          *****/

/***** 見出し(H3)(製品タイトル) *****/

#right h3.spec{
	border-top: 1px solid #666;
	border-left: 1px solid #FFF;
	border-right: 1px solid #FFF;
	border-bottom: 1px solid #666;
	/*color:#666;*/
	background:#ecf5ff;
	/*width:90%;*/
	font-size:13px;
	padding:5px 5px 5px 10px;
	margin:10px 10px 10px 0px;
}

/***** テーブル(製品仕様) *****/

#table_spec table {
	width:470px;
	/*width:510px;*/
	border-collapse: collapse;
	border-spacing: 0;
	border-top: 1px solid #666;
	border-left: 1px solid #666;
	border-right: 1px solid #666;
	border-bottom: 1px solid #666;
	/*background: #fff;*/
	}
#table_spec th {
	padding: 5px;
	border-right: 1px solid #666;
	border-bottom: 1px solid #666;
	background: #ecf5ff;
	color: #666;
	font-size: 12px;
	font-weight: normal;
	text-align: center;
	}
#table_spec td {
	padding: 5px;
	border-right: 1px solid #666;
	border-bottom: 1px solid #666;
	font-size: 12px;
	color: #666;
	text-align: center;
	}

/***** テーブル(開発例紹介)*****/

#table_dev table {
	width:510px;
	margin:0px 10px 0px 0px;
	border-collapse: collapse;
	border-spacing: 0;
	border-top: 1px solid #004080;
	border-left: 1px solid #FFF;
	border-right: 1px solid #FFF;
	border-bottom: 1px solid #004080;
	/*background: #fff;*/
	}
#table_dev td {
	padding: 5px 0px 5px 5px;
	border-right: 1px solid #FFF;
	border-bottom: 1px solid #004080;
	/*font-size: 12px;*/
	color: #666;
	margin: 1px;
	}
#table_dev ul{
	padding:0px 0px 0px 5px;
	margin:5px 0px 20px 5px;
}
#table_dev li{
	padding:0px 0px 0px 0px;
	margin:2px 0px 2px 5px;
}
#table_dev h3{
	border-top: 1px solid #666;
	border-left: 1px solid #FFF;
	border-right: 1px solid #FFF;
	border-bottom: 1px solid #666;
	background:#ecf5ff;
	/*width:100%;*/
	font-size:13px;
	padding:5px 0px 5px 10px;
	margin:10px 0px 10px 0px;
}

/***** 水平線 *****/
hr {
	color: #004080;
	background-color: #004080;
	height: 1px;
	border: 0px;
	margin:0px 10px 0px 0px;
	padding:0px;
}

#right h4{
	font-size:12px;
	color:#666666;
	margin:0 0 4px 0;
	padding:10px 10px 10px 0;
}
#right img.left2{
	float:left;
	margin-right:0.8em;
	margin-bottom:0.5em;
	margin-left:10px;
}
#right img.right2{
	float:right;
	margin-right:20px;
	margin-bottom:0.5em;
	margin-left:0.8em;
}