/* kpln.css 2007.8.21 */

/*============目次============
　最終更新日：2012/11/02
　1.レイアウト
　2.見出し
　3.図面サンプル
　4.事例ページ
　5.よくあるご質問
　6.見積/体験版請求フォーム
　7.オリジナルパーツ作成
============================*/

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


/*===========================
■1.レイアウト
============================*/

/* 製品説明 背景白 */
.Cont_white {
width: 550px;
background-color: #FFFFFF;
margin-left: 17.5px; margin-right: 17.5px;
}

/* 上余白15px */
DIV.Top15 {
margin-top: 15px;
}

/* 左右余白10px */
DIV.LR10 {
margin-left: 10px; margin-right: 10px;
}

/* コンテンツ　ページ送り枠 */
.Cont_turn_frame {
width: 100%;
text-align: left;
}

/* コンテンツ　ページ送り 前へ */
.Cont_turn_prev {
float: left;
width: 33%;
text-align: left;
}

/* コンテンツ　ページ送り 次へ */
.Cont_turn_next {
float: right;
width: 33%;
text-align: right;
}

/* コンテンツ　ページ送り 事例トップへ */
.Cont_turn_index {
float: left;
width: 33%;
text-align: center;
}

/* 赤丸のリンク <a class="GoRed"> */
a.GoRed {
	background: url(/common/img/tool/go_mark_red.gif) no-repeat 0 1px;
	padding-left: 16px;
	min-height: 16px;
	display: inline-block;
	margin: 0 5px 0 0;
}

/* 白丸のリンク <a class="GoWhite"> */
a.GoWhite {
	background: url(/common/img/tool/go_mark_siro.gif) no-repeat 0 1px;
	padding-left: 16px;
	min-height: 16px;
	display: inline-block;
	margin: 0 5px 0 0;
}

/*===========================
■2.見出し
============================*/

/* 拡大ページ見出し1 */
H1.MidashiBig {
font-size: 112.5%; text-align: center; color: #FFFFFF; margin-bottom: 10px; margin-top: 10px;
}


/*===========================
■3.図面サンプル
============================*/

/* 図面サンプル　見出し */
H1.sample_zoom {
	font-size: 112.5%;
	color: #FFFFFF;
	background-color: #330099;
	text-align: center;
	margin: 20px 10px;
	padding: 3px 5px;
}

IMG.line_on {
	border: 1px solid #CCCCCC;
}


/*===========================
■4.事例ページ
frame_case：社名ありの事例
frame_case_etc：社名なしの事例
============================*/

/* 事例 背景ブルー */
.frame_case,
.frame_case_etc {
width: 570px;
background-color: #DEE7F1;
}

.frame_case H3 {
margin: 20px 10px 10px 10px;
padding: 5px;
color: #003366;
background-color: #E0E9CB;
overflow: auto;
}

.frame_case_etc H3 {
margin: 10px;
color: #2256BE;
}

.frame_case H3 IMG {
margin-left: 5px;
margin-right: 10px;
}

.frame_case_etc H3 IMG {
margin-right: 10px;
}

.intro_case {
width: 550px;
margin: 0px 10px 0px 10px;
}

.intro_case_l {
width: 430px;
margin: 10px 10px 0px 0px;
float: left;
}

.intro_case_r {
width: 110px;
margin: 10px 0px 0px 0px;
padding: 0;
float: right;
/*
overflow: auto;
*/
}


.intro_case P{
margin-left: 10px;
margin-right: 10px;
}

.intro_case_l .company {
width: 410px;
border: solid 1px #99B4D5;
background-image: url(product/img/case/bk_comp.gif);
background-repeat: repeat-x;
font-weight: bold;
color: #003366;
padding: 5px 10px 5px 10px;
margin-bottom: 10px;
}

.frame_case_etc .cont_case {
width: 550px;
background-color: #FFFFFF;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 20px;
border: dotted 1px #A6CCE6;
}

.frame_case .cont_case {
width: 550px;
background-color: #FFFFFF;
margin: 0px 10px 20px 10px;
padding-top: 5px;
border: 0;
}

.frame_case .cont_case DIV.sample {
width: 520px;
background-color: #DEE7F1;
margin: 10px 10px 20px 10px;
border: dashed 1px #AAC1DB;
text-align: center;
font-size: 75%;
color: #006699;
padding: 5px;
}

.frame_case .cont_case DIV.sample IMG{
text-align: center;
margin: 5px;
}
.cont_case P,
.cont_case P.intro{
margin: 10px 15px 10px 15px;
}

.cont_case P.intro{
color: #2256BE;
}

.cont_case P.ques{
color: #006699;
}

/* 事例 目次　case_list */
.case_list{
	width: 570px;
}

.case_list DIV.thumb{
	width: 120px;
	margin-right: 10px;
	float: left;
}

.case_list DIV.caption{
	width: 440px;
	float: right;
}

.case_list DIV.caption h3{
	color: #003366;
	background-color: #DEE7F1;
	font-size: 87.5%;
	padding: 5px 10px;
	margin: 0 0 10px 0;
	border-bottom: 1px solid #99B4D5;
}

.case_list DIV.caption P{
	padding: 0px 10px;
	margin: 0 0 5px 0;
}


/*===========================
■5.よくあるご質問
============================*/

UL.qa_list{
 list-style-type: none;
 margin-left: 5px;
 margin-right: 15px;
 margin-bottom: 20px;
 padding: 0px;
}

UL.qa_list LI{
 background: url("img/tool/list_yaji_s.gif") no-repeat;
 padding-left: 15px;
 margin-bottom: 5px;
}

DIV.qa UL{
 width: 560px;
 list-style-type: none;
 margin: 20px 15px 0 5px;
 padding: 0px;
}

DIV.qa UL LI.q{
 background: url("img/tool/q.gif") no-repeat;
 padding-left: 28px;
 padding-bottom: 10px;
 margin-bottom: 5px;
 font-weight: bold;
}

DIV.qa UL LI.a{
 background: url("img/tool/a.gif") no-repeat;
 padding-left: 28px;
 padding-bottom: 10px;
 margin-bottom: 15px;
 border-bottom: 1px solid #999999;
}


/*===========================
■6.見積/体験版請求フォーム
============================*/


DIV.fr_caution {
 margin-top: 5px;
 padding: 5px 10px;
 border: 1px solid #FF0000;
}



/*===========================
■7.オリジナルパーツ作成
============================*/

.orgparts {
	float: left;
	margin-bottom: 20px;
}

.orgparts p {
	margin: 5px;
	padding: 0;
}



