/* CSS Document */

/* --------------------------------------------------------------------------------------

目次

1.　フロート解除

2.　サイドメニュー＆バナー

3.キーパー財務　製品情報　コンテンツ構成

4.テーブル

5.キーパー財務　製品情報　機能のメニュー

6.キーパー給与　製品情報　機能のメニュー

7.キーパー経営羅針盤

--------------------------------------------------------------------------------------- */


/* --------------------------------------------------------------------------------------
 float解除
--------------------------------------------------------------------------------------- */

br.clr {
	clear: both;
	font-size: 0px;
	line-height: 0px;
}

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

/*--------------------------------------------------------------------------------------- */

div#container div.box {
	margin: 0;
	padding: 0;
	
	}


strong.red {
	color: #ff0000;
	}
strong.blue {
	color: #15509f;
	}

/* ---- 

2.サイドメニュー＆バナー　財務

　-------------------- */

#container div.side_prod .cs_menu {
	font-family:"メイリオ","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	margin-bottom: 20px;
	}

#container div.side_prod h2.bar {
	margin: 0;
	padding: 0;
	height: 33px;
	}
	
#container div.side_prod h3.cs_cate {
	margin: 0;
	padding: 0;
	height: 31px;
	cursor:pointer;
	}



.box div.box_wrap div.side_prod {
	margin: 0 0 20px 0;
	width: 170px;
	float: right;
	}

#container div.side_prod ul.menu {
	margin-bottom: 0;
	padding: 0;
	}
	
	
#container div.side_prod ul.menu li.voice {
	font-size: 12px;
	vertical-align: middle;
	width: 169px;
	height: 32px;
	line-height: 1.2em;
	padding: 0;
	/*_padding: 0 0 2px 0; IE6調整用*/
	_margin: 0 0 -2px 0;/* IE6調整用*/
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	}
	
#container div.side_prod ul.menu li.voice a {
	padding: 12px 0 3px 8px;
	_padding: 8px 0 0px 4px;/* IE6調整用*/
	_margin: 0 0 -2px 0;/* IE6調整用*/
	display: block;
	width: 165px;
	_width: 169px;/* IE6調整用*/
	height: 18px;
	_height: 34px;/* IE6調整用*/
	border-left: 4px solid #ccdefd;
	/*border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;*/
	}

#container div.side_prod ul.menu li.voice a:hover {
	padding: 12px 0 3px 8px;
	_padding: 8px 0 0px 4px;/* IE6調整用*/
	_margin: 0 0 -2px 0;/* IE6調整用*/
	display: block;
	background: #f5f5f5;
	width: 157px;
	_width: 169px;/* IE6調整用*/
	height: 18px;
	_height: 34px;/* IE6調整用*/
	color: #0f1b7a;
	text-decoration: none;
	vertical-align: middle;
	border-left: 4px solid #9ec2ff;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	_border-bottom: none;/* IE6調整用*/
	_border-right: none;/* IE6調整用*/
	}
	
#container div.side_prod ul.menu li.voice02 {
	font-size: 12px;
	vertical-align: middle;
	width: 169px;
	height: 47px;
	line-height: 1.2em;
	padding: 0;
	/*_padding: 0 0 2px 0; IE6調整用*/
	_margin: 0 0 -2px 0;/* IE6調整用*/
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	}
	
#container div.side_prod ul.menu li.voice02 a {
	padding: 12px 0 3px 8px;
	_padding: 8px 0 0px 4px;/* IE6調整用*/
	_margin: 0 0 -2px 0;/* IE6調整用*/
	display: block;
	width: 165px;
	_width: 169px;/* IE6調整用*/
	height: 33px;
	_height: 49px;/* IE6調整用*/
	border-left: 4px solid #ccdefd;
	/*border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;*/
	}

#container div.side_prod ul.menu li.voice02 a:hover {
	padding: 12px 0 3px 8px;
	_padding: 8px 0 0px 4px;/* IE6調整用*/
	_margin: 0 0 -2px 0;/* IE6調整用*/
	display: block;
	background: #f5f5f5;
	width: 157px;
	_width: 169px;/* IE6調整用*/
	height: 33px;
	_height: 49px;/* IE6調整用*/
	color: #0f1b7a;
	text-decoration: none;
	vertical-align: middle;
	border-left: 4px solid #9ec2ff;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	_border-bottom: none;/* IE6調整用*/
	_border-right: none;/* IE6調整用*/
	}
	
/* ---- 

サイドメニュー＆バナー　給与

　-------------------- */


#container div.side_prod ul.menu_kpk {
	margin-bottom: 0;
	padding: 0;
	}
	
	
#container div.side_prod ul.menu_kpk li.voice {
	font-size: 12px;
	vertical-align: middle;
	width: 169px;
	height: 32px;
	line-height: 1.2em;
	padding: 0;
	/*_padding: 0 0 2px 0; IE6調整用*/
	_margin: 0 0 -2px 0;/* IE6調整用*/
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	}
	
#container div.side_prod ul.menu_kpk li.voice a {
	padding: 12px 0 3px 8px;
	_padding: 8px 0 0px 4px;/* IE6調整用*/
	_margin: 0 0 -2px 0;/* IE6調整用*/
	color: #1a6932;
	display: block;
	width: 165px;
	_width: 169px;/* IE6調整用*/
	height: 18px;
	_height: 34px;/* IE6調整用*/
	border-left: 4px solid #67a479;
	/*border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;*/
	}

#container div.side_prod ul.menu_kpk li.voice a:hover {
	padding: 12px 0 3px 8px;
	_padding: 8px 0 0px 4px;/* IE6調整用*/
	_margin: 0 0 -2px 0;/* IE6調整用*/
	display: block;
	background: #f5f5f5;
	width: 157px;
	_width: 169px;/* IE6調整用*/
	height: 18px;
	_height: 34px;/* IE6調整用*/
	color: #1a6932;
	text-decoration: none;
	vertical-align: middle;
	border-left: 4px solid #1a6932;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	_border-bottom: none;/* IE6調整用*/
	_border-right: none;/* IE6調整用*/
	}
	
.box div.box_wrap div.side_prod div.bnr {
	margin-bottom: 20px;
	}

.box div.box_wrap div.side_prod div.bnr p {
	margin-bottom: 10px;
	}



/* ---- 

3.キーパー財務　製品情報　コンテンツ構成

　-------------------- */

h4.prodttl {
	font-size: 130%;
	background: url(../seihin/keeperzaimu/image/kpz_ttl001.gif) no-repeat;
	padding: 18px 0px 20px 10px;
	margin: 20px 0 10px 0;
	}
	
div.prodbox {
	margin: 10px 0 50px 0;
	text-align: center;
	}
	
div.prodbox p {
	width:550px;
	padding: 0 0 0 5px;
	text-align: left;
	}
	
div.prodbox p.big_ph img {
	padding: 0 0 0 0;
	margin-left: -15px;
	text-align: left;
	}
	
h5.prodttl {
	font-size: 120%;
	text-align: left;
	padding: 8px 0 8px 10px;
	margin-bottom: 10px;
	background: url(../seihin/keeperzaimu/image/kpz_ttl002.gif) no-repeat;
	color: #ffffff;
	}

	
div.prodbox p.prod_img {
	text-align: center;
	}

p.midashi {
	font-size: 120%;
	margin-top: 10px;
	}

h5.kpz,
h6.kpz {
	font-size: 120%;
	margin: 10px 0 10px 0;
	border-bottom: solid #666 1px;
	text-align: left;
	padding: 10px 0 5px 5px;
	width: 545px;
	}
	
	
/*プロオプション　導入コンテンツ*/	

p strong.pro {
	font-size: 170%;
	line-height: 1.2em;
	}
	
/*給与用タイトル*/	

h5.prodttl_kpk {
	font-size: 120%;
	text-align: left;
	padding: 8px 0 8px 10px;
	margin-bottom: 10px;
	background: url(../seihin/keeperkyuyo/image/kpk_ttl002.gif) no-repeat;
	color: #ffffff;
	}
	
	
/* ---- 

4.テーブル

　-------------------- */

div.prodbox table {
	width: 540px;
	font-size: 100%;
	margin: 10px 0 20px 0;
	text-align: left;
	border: 1px solid #cccccc;
	border-collapse: collapse;
	}

div.prodbox table span {
	font-size: 85%;
	color: #ff0000;
}

	
div.prodbox table th {
	padding: 5px 8px;
	background-color: #defff1;
	border: 1px solid #cccccc;
}

div.prodbox table td.op {
	text-align: center;
}

div.prodbox table td.op02 {
	text-align: left;
}

div.prodbox table td {
	width: 30%;
	padding: 5px 8px;
	text-align: center;
	border: 1px solid #cccccc;
}

p.caution {
	color: #ff0000;
	}
	
div.prodbox p strong.cau {
	font-size: 120%;
}

/* ---- テーブル02 -------------------- */

div.prodbox table.chart01 {
	width: 540px;
	font-size: 12px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	line-height: 1.3em;
	}

div.prodbox table.chart01 td{
	text-align: left;
	width: 25%;
	padding: 3px;
	}

/* ---- テーブル03 -------------------- */

div.prodbox table.chart02 {
	width: 540px;
	border: 1px solid #cccccc;
	}

div.prodbox table.chart02 th{
	text-align: left;
	background-color: #efefef;
	padding: 8px 0 8px 6px;
	}

div.prodbox table.chart02 td{
	text-align: left;
	width: 360px;
	}

div.prodbox p.price {
	text-align: center;
	font-size: 150%;
	font-weight: bold;
	}
	
div.prodbox p.price span{
	text-align: center;
	font-size: 70%;
	font-weight: bold;
	}

/* ---- テーブル 給与----01---------------- */

div.prodbox table.kpk01 {
	width: 550px;
	font-size: 12px;
	margin: 0 0 0 5px;
	_margin: 0 0 0 0;/*IE6用*/
	padding: 0 0 0 0;
	line-height: 1.3em;
	}
div.prodbox table.kpk01 th{
	text-align: left;
	width: 11%;
	/*padding-left: 5px;*/
	text-align: center;
	background-color: #efefef;
	}
	
div.prodbox table.kpk01 td{
	padding: 3px;
	width: 18%;
	text-align: center;
	font-size: 110%;
	}
	
div.prodbox table.kpk01 td.cell{
	text-align: left;
	width: 35%;
	padding: 3px;
	text-align: left;
	}


/*-----02-------------------*/

div.prodbox table.kpk02 {
	width: 540px;
	font-size: 12px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	line-height: 1.3em;
	}
div.prodbox table.kpk02 th {
	text-align: left;
	/*padding-left: 5px;*/
	background-color: #efefef;
	width: 15%;
	}
	
div.prodbox table.kpk02 td {
	text-align: left;
	width: 15%;
	padding: 3px;
	text-align: center;
	font-size: 100%;
	}
	
div.prodbox table.kpk02 td.cell02 {
	text-align: left;
	padding: 3px;
	font-size: 100%;
	width: 50%;
	}
	
/* ---- テーブル03 -------------------- */

div.prodbox table.chart01_kpk {
	width: 540px;
	font-size: 12px;
	margin: 0 0 30px 0;
	padding: 0 0 0 0;
	line-height: 1.3em;
	}

div.prodbox table.chart01 td{
	text-align: left;
	width: 25%;
	padding: 3px;
	}


/* ---- 

5.キーパー財務　製品情報　機能のメニュー

　-------------------- */

ul.kpz_prodnav {
	text-align: center;
	clear: both;
	margin: 0 0 30px 15px;
	}
	
ul.kpz_prodnav li {
	float: left;
}

p.kpz_contact {
	/*text-align: center;*/
	padding: 0 0 0 32px;
	}
	
div.kpz_link p a:hover img,
p.kpz_btn a:hover img {
	opacity: 0.6;
	filter: alpha(opacity=60);
}

div.kpz_link {
	clear: both;
	width: 550px;
	margin: 0;
	}
	
div.kpz_link p {
	float: left;
	width: 245px;
	padding-left: 18px;
	}
	
	
/* ---- 

6.キーパー給与、オプション

　-------------------- */

div.op_box {
	margin: 0 0 20px 40px;
	width: 480px;
	line-height: 1.3em;
	}
	
p.op_link {
	margin: 0;
	padding: 0 0 0 20px;
	width: 430px;
	}

p.op_link a {
	font-weight: bold;
	}

h5.prodttl_kpk02 {
		font-size: 120%;
	margin: 10px 0 10px 0;
	border-bottom: solid #666 1px;
	text-align: left;
	padding: 10px 0 5px 5px;
	width: 545px;
}

/* ---- 

7.キーパー経営羅針盤

　-------------------- */


div.pro_box {
	width: 550px;
	text-align: left;
	margin: 0 0 20px 0;
	padding: 0;

}

/* ---- タイトル下テキスト　--------- */

p.rsbsub {
	width: 560px;
	}
/* ---- 

セットアップ

　-------------------- */

div.pro_box p.pro_txt {
	margin: 0;
	padding: 0;
	text-align: left;
	float: left;
	width: 240px;
	}


div.pro_box p.pro_img {
	margin: 0;
	padding: 0;
	text-align: right;
	float: right;
	width: 300px;
	}

/* ---- 

事前準備

　-------------------- */

div.pro_box02 {
	width: 550px;
	text-align: left;
	margin: 0 0 20px 0;
	padding: 0;

}

div.pro_box02 p.pro_txt {
	margin: 0;
	padding: 0;
	text-align: left;
	float: left;
	width: 140px;
	}


div.pro_box02 p.pro_img {
	margin: 0;
	padding: 0;
	text-align: right;
	float: right;
	width: 400px;
	}

div.pro_box03 {
	width: 550px;
	text-align: right;
	margin: 0 0 20px 0;
	padding: 0;
}

div.mainbox p.pro_img_c{
	text-align: center;
}

div.mainbox p.free_img {
	width: 550px;
	text-align: right;
	margin: 0 0 20px 0;
	padding: 0;
}