/* kpln.css */

/*============目次============
　最終更新日：2010/08/06
　1. クラス
　2. 上書きスタイル
　3. 追加スタイル
============================*/

/*===========================
■ClearFix
============================*/
.Section:after,
.ClearFix:after {
	content: ".";
	display: block;
	visibility: hidden;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
	clear: both;
}

.Section,
.ClearFix {
	display: inline-block;
	zoom: 100%;
}

/*===========================
■1. 上書きスタイル
============================
#ContentArea内は760px幅
============================*/

.kpln #ContentArea H2 {
	font-size: 120%;
	color: #000000;
	font-weight: normal;
	width: 760px;
	height: 32px;
	line-height: 30px;
	display: block;
	background: url(img/bg_h2.jpg) no-repeat left top;
	margin: 0 0 10px 0;
	padding: 0 15px;
}

.kpln #ContentArea H3 {
	font-size: 100%;
	color: #666666;
	height: 40px;
	background: url(img/icon_h3.gif) no-repeat left top;
	margin: 0 0 10px 0;
	padding: 8px 0 0 45px;
}

.kpln #ContentArea H3.optimage {
	font-size: 100%;
	color: #000000;
	height: 30px;
	background: none;
	margin: 0 0 10px 0;
	padding: 0;
}

.kpln #ContentArea H3.optimage IMG{
	margin: 0 20px 0 0;
	padding: 0;
	vertical-align: middle;
}

.kpln #ContentArea H3.download {
	font-size: 100%;
	color: #000000;
	height: 30px;
	background: none;
	margin: 0 0 10px 0;
	padding: 0;
}

.kpln #ContentArea .txtbox {
	width: 370px;
	margin: 0 0 10px 0;
	padding: 0;
}

.kpln #ContentArea .NaviBlock {
	color: #000000;
	height: 34px;
	margin: 0;
	padding: 0;
	float:right;
}

.kpln #ContentArea .NaviBlock UL{
	display: inline;
	margin: 0;
	padding: 0;
}

.kpln #ContentArea .NaviBlock UL LI{
	float: left;
	font-size: 90%;
	font-weight: bold;
	line-height: 33px;
	list-style-type: none;
	margin: 0;
	padding: 0;
	background: url(img/navi/navi_bk.jpg) repeat-x;
	border-right: 1px solid #CCCCCC;
}

.kpln #ContentArea .NaviBlock UL LI.first{
	background: url(img/navi/navi_left.jpg) no-repeat left top;
	border-right: 1px solid #CCCCCC;
}

.kpln #ContentArea .NaviBlock UL LI.last{
	background: url(img/navi/navi_right.jpg) no-repeat right top;
	border-right: none;
}

.kpln #ContentArea .NaviBlock UL LI A{
	float: left;
	margin: 0;
	padding: 0 10px;
	color: #000000;
	text-decoration: none;
}

.kpln #ContentArea .NaviBlock UL LI A:hover{
	color: #1433D9;
	text-decoration: none;
}


/*===========================
■2. 追加スタイル
============================
#ContentArea内は760px幅
============================*/

/* communication cycle example */

.cycle-outside {
 background: url(img/cycle_top.jpg) no-repeat center top;
 padding-top: 10px;
 margin: 0 10px 30px 0;
 float: left;
}
.cycle-inside {
 background: url(img/cycle_bottom.jpg) no-repeat center bottom;
 padding-bottom: 10px;
}

.cycle2-outside {
 background: url(img/cycle2_top.jpg) no-repeat center top;
 padding-top: 10px;
 margin-bottom: 30px;
 float: left;
}
.cycle2-inside {
 background: url(img/cycle2_bottom.jpg) no-repeat center bottom;
 padding-bottom: 10px;
}

.cycle-outside,
.cycle-inside {
 width: 270px;
 background-color: #FFECC4;
}

.cycle2-outside,
.cycle2-inside {
 width: 200px;
 background-color: #FFECC4;
}

#ContentArea .cycle-inside P,
#ContentArea .cycle2-inside P {
 margin: 0 10px;
}

#ContentArea .cycle-inside IMG,
#ContentArea .cycle2-inside IMG {
 margin: 0 5px 0 0;
}


.AreaLeft {
	width: 370px;
	float: left;
}

.AreaRight {
	width: 370px;
	float: right;
}

.Cap_c {
	text-align: center;
}

DIV.optimage {
	border: 2px dashed #D2DCF0;
	padding: 5px 10px;
}