

/* 各タグのマージン・パッディングの初期化
--------------------------------------------------*/
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin: 0px;
	padding: 0px;
}

/* テーブルのセルのボーダーを隣のセルのボーダーとくっつけて1本に初期化 */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* フォームをグループ化した時の初期線とイメージのリンク時に出る線の初期化 */
img {
	border: 0;
}

/* リストの初期化 */
ol,ul {
	list-style: none;
}
/* テキスト位置がセンタリングされるのを初期化 */
caption,th {
	text-align: left;
}

/* hタグのサイズと太字を初期化 */
h1,h2,h3,h4,h5,h6 {
	font-size: 100%;
	font-weight: normal;
}

.txtC { text-align: center; }
.mt40 { margin-top: 40px; }


/* 基本設定 (基本的に変更しない部分だけ設定)
--------------------------------------------------*/
body {
	font-size: 62.5%; /* フォントサイズの基本値化 10px=1em */
	font-family:
	"ＭＳ Ｐゴシック",
	MS P Gothic ,
	Osaka,
	"ヒラギノ角ゴ Pro W3",
	Hiragino Kaku Gothic Pro;
	color:#5A5A5A;
}

html { overflow-y: scroll; } /* Firefox huck lint minus point */

table {
	width: 100%;
	font-size: 100%;
	text-align: center;
}
table table {
	width: auto;
	text-align: left;
}

/* クリアフィックス - CLEAR FIX -
-------------------------------------------------*/
.c-fix:after {
  content: ".";  /* 新しい要素を作る */
  display: block;  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}

.c-fix { min-height: 1px; }

* html .c-fix {
  height: 1px;
  /*\*//*/
  height: auto;
  overflow: hidden;
  /**/
}

.c-fix { zoom:
 100%; }

.c-both { clear: both; } 


/* CSS Document */


body{
	background: url(img/img01.gif);
}
.headLayout {
	background: url(img/img02.gif) repeat-x;
	border-bottom: 1px solid #CCCCCC;
	padding: 0 0 10px 0;
	height: 56px;
}
.headLayout .headIn {
	width: 835px;
	margin: 0 auto;
}
.headLayout div.logo {
	float: left;
	padding: 21px 0 0 10px;
	font-size: 0px;
}
.headLayout h1 {
	float: left;
	padding: 25px 0 0 10px;
	font-size: 12px;
	line-height: 130%;
	text-align: left;
}
.headLayout .btn {
	float: right;
	padding: 15px 5px 0 0;
	font-size: 0px;
}

/*--------------------------------------------------------------
グローバルナビ
--------------------------------------------------------------*/
.headNavi {
	clear: both;
	background: url(img/img03.gif) repeat-x;
	background-color: #F4F7F8;
	border-top: 1px solid #FFFFFF;
	height: 41px;
}
.headNavi .navi {
	width: 825px;
	height:41px;
	margin: 0 auto;
	background: url(img/img04.gif) no-repeat right bottom;
}
.headNavi li {
	float: left;
	background: url(img/img04.gif) no-repeat left bottom;
	padding: 0 1px 0 4px;
	height: 41px;
}
.headNavi a:link ,
.headNavi a:active ,
.headNavi a:visited ,
.headNavi a:hover {
	color: #004EA4;
	text-decoration: none;
	display: block;
	line-height: 41px;
	font-size: 12px;
	font-weight: bold;
}
.headNavi a:hover {
	background: url(img/img05.gif) repeat-x;	
}
.headNavi a.on:link ,
.headNavi a.on:active ,
.headNavi a.on:visited ,
.headNavi a.on:hover {
	background: url(img/img05.gif) repeat-x!important;;	
}
.headNavi .home{width:70px; text-align:center;}
.headNavi .feature{width:130px; text-align:center;}
.headNavi .optimize{width:135px; text-align:center;}
.headNavi .example{width:150px; text-align:center;}
.headNavi .network{width:135px; text-align:center;}
.headNavi .intro{width:170px; text-align:center;}

/*--------------------------------------------------------------
コンテンツ枠設定/コンテンツ共通設定
--------------------------------------------------------------*/
.content {
	background: url(img/img06.gif) repeat-x left top;
	clear: both;
}
.content .contentIn , 
.topContent .contentIn {
	width: 835px;
	margin: 0 auto;
}
.topContent .contentIn {
	background: url(img/img07.gif) repeat-y center top;
}
.content .contentIn {
	background: url(img/img08.gif) repeat-y center top;
}
.content .contentTtl {
	padding: 10px 0 30px 0;
	margin: 0 auto;
	background: url(img/img09.gif) no-repeat center bottom;
	text-align: center;
	background-color: #FFFFFF;
}
.leftColumn  {
	width: 185px;
	float: left;
	padding: 0 0 0 5px;
	text-align: left;
}
.leftColumn .leftNavi {
	padding: 3px 0 8px 0;
}
.leftColumn .leftNavi li {
	background: url(img/img10.gif) no-repeat 11px center;
	padding: 5px 0 5px 22px;
	font-size: 1.2em;
}
.leftColumn a:link ,
.leftColumn a:active ,
.leftColumn a:visited {
	text-decoration: none; color: #005FAD;
}
.leftColumn a:hover {
	text-decoration: underline; color: #005FAD;
}

/*--------------------------------------------------------------
コンテンツ共通項目
--------------------------------------------------------------*/

.rightColumn {
	float: right;
	width: 580px;
	padding: 30px 40px 30px 25px;
	text-align: left;
}
.rightColumn h3 {
	font-size: 0px;
	padding: 0 0 15px 0;
}
.rightColumn .reed {
	padding: 2px 0 15px 20px;
	font-size: 1.4em;
	font-weight: bold;
	color: #0072B6;
	background: url(img/img11.gif) no-repeat;
}
.rightColumn .column .reed span {
	font-weight: normal;
	color: #666666;
}

.rightColumn .textBox {
	border: 3px solid #DBEAFF;
	padding: 13px;
	font-size: 1.2em;
	line-height: 135%;
	background: #F2F6FC;
}
.rightColumn .column {
	clear: both;
	padding: 40px 0 0 0;
}

.content .contentIn .rightColumn .textBox strong {
	color: #0072B6;
	margin: 0 0 3px 0;
}

/*--------------------------------------------------------------
導入について
--------------------------------------------------------------*/
.value {
	width: 580px;
	font-size: 1.2em;
	line-height: 1.4em;
	/*color: #000000;*/
}
.alart {
	font-size: 1em;
	color: #CC0000;
	font-face: monospace;
}
form table {
	width: 575px;
	margin: 0px;
	font-size: 1.2em;
	line-height: 1.4em;
}
form #main th {
	width: 150px;
	color: #0067a6;
	border-right: 4px solid #DDDDDD;
	border-top: 1px solid #FFFFFF;
	border-bottom: 1px solid #FFFFFF;
	background-color: #EAEAEA;
	padding: 5px 6px 5px 0;
	text-align: right;
}
form #main td {
	border-top: 1px solid #FFFFFF;
	border-bottom: 1px solid #FFFFFF;
	background-color: #EEEEEE;
	padding: 5px 8px;
}
textarea {
	width: 100%;
	font-size: 1.2em;
	font-family: monospace;
}
form table td label {
	line-height: 1.5em;
	margin-right: 10px;
}
form table td label input {
	margin-right: 5px;
}

/*--------------------------------------------------------------
ページトップへ / バナーエリア / 相互リンクエリア
--------------------------------------------------------------*/
.pageTop {
	background: url(img/img29.gif) repeat-x left top;
	padding: 2px 0 0 0;
	text-align: right;
	margin: 20px 0 0 0;
	clear: both;
}

.bannerTop {
	background: url(img/img30.gif) no-repeat center 10px;
	padding: 17px 0 0 0;
	line-height: 125%;
	clear: both;
}
.banner {
	background: url(img/img31.gif) no-repeat center 10px;
	padding: 27px 0 0 0;
	clear: both;
	width: 835px;
}
.bannerIn {
	background: url(img/img32.gif) repeat-y center top;
	padding: 8px 30px 8px 25px;
	line-height: 125%;
}
.bannerText {
	font-size: 1.2em;
	line-height: 130%;
	text-align: center;
}


.mutualLinkTop {
	background: url(img/img26.gif) no-repeat center top;
	padding: 7px 10px 0 10px;
	line-height: 125%;
	clear: both;
}
.mutualLink {
	clear: both;
	background: url(img/img27.gif) no-repeat center top;
	padding: 7px 0 0 0;
	width: 835px;
}
.mutualLinkIn {
	padding: 4px 10px 0 10px;
	line-height: 125%;
	background: url(img/img28.gif) repeat-y center top;
	text-align: center;
}
.mutualLinkIn ul {
	line-height: 135%;
	padding: 3px 3px;
}
.mutualLinkIn ul li {
	display: inline;
	margin-right: 10px;
}
.mutualLinkIn ul li.linkC:before,
.mutualLinkIn ul li.linkR:before {
	/*content: "|";*/
}
.mutualLinkIn ul li a {
	color: #666666;
}
.mutualLinkIn ul li a:visited {
	color: #999999;
}





/*--------------------------------------------------------------
フッター
--------------------------------------------------------------*/
.footer {
	height: 134px;
	background: url(img/img18.gif) repeat-x;
	clear: both;
}
.footer .footerIn {
	width: 825px;
	margin: 0 auto;
	background: url(img/img19.gif) no-repeat center top;
	padding: 30px 0 0 0;
	text-align: left;
}
.footer .company {
	background: url(img/img42.gif) no-repeat;
	width: 608px;
	float: left;
}
.footer p {
	padding: 0 7px;
	font-size: 0px;
}

.footer .company ul {
	padding: 6px 7px;
	border-top: none;
	border-right: 1px solid #A9CEE6;
	border-bottom: 1px solid #A9CEE6;
	border-left: 1px solid #A9CEE6;
}

.footer .company li {
	margin: 0 0 2px 0;
}
.footer .linkCopy {
	float: right;
	text-align: right;
	width: 210px;
}
.footer .link {
	color: #FFFFFF;
	font-size: 12px;
	line-height: 135%;
}

.footer a:link ,
.footer a:active ,
.footer a:visited {
	text-decoration: none; color: #FFFFFF;
}
.footer .link a:hover {
	text-decoration: underline; color: #FFFFFF;
}

.footer .copyright {
	color: #A9CEE6;
	font-size: 10px;
	line-height: 135%;
	font-family: Geneva, Arial, Helvetica, sans-serif;
}
