@charset "utf-8";
/* CSS Document */

/* common.cssに依存するスタイル（カテゴリー別で背景、色のみを変更）
----------------------------------------------------------------------------------------------------------------------------------------------------------*/

/* グローバルナビゲーション*/
/*アクティブの場合*/
#gNavIn li.toSolution a {
	background:url("../images/btn_gnav02_solution_active.png") no-repeat left top;
	}

/*カテゴリータイトル*/
#categoryTitleOut {
	background:url("../images/bg_solution01.png") repeat-x center top;
	}

/*カテゴリートップのメニュー一覧（ボタン色）*/
#categoryMenuList li h2 {
	background:url("../images/btn_solution00_arrow.png") no-repeat right center;
	}


/* 説明3カラム
----------------------------------------------------------------------------------------------------------------------------------------------------------*/
.col3 {
	margin:0px -16px 20px auto;
	padding:0px 0px 0px 0px;
	clear:both;
	width:721px;
	}
.col3 li {
	margin:0px 16px 0px auto;
	display:inline;
	float:left;
	*display: inline;
	*zoom: 1;
	width:224px;
	}	



/* 説明1カラム（写真左 コピー右）
----------------------------------------------------------------------------------------------------------------------------------------------------------*/
.col2_lphoto_rcopy {
	margin:0px auto 20px auto;
	padding:0px 0px 20px 0px;
	border-bottom:1px dotted #CCCCCC;
	clear:both;
	}
.col2_lphoto_rcopy figure {
	margin:0px auto 0px auto;
	padding:0px 0px 0px 0px;
	float:left;
	width:218px;
	}
.col2_lphoto_rcopy figure img {
	width:218px;
	}
.col2_lphoto_rcopy p {
	float:right;
	width:472px;
	}
.col2_lphoto_rcopy p a {
	color:#198CD2;
	text-decoration:underline;
	}
.btnAfterservice {
	background: url(../images/btn_common02.png) no-repeat 0 7px;
	text-indent: 10px;
}
	
	
/* 説明1カラム（写真右 コピー左）
----------------------------------------------------------------------------------------------------------------------------------------------------------*/
.col2_rphoto_lcopy {
	margin:0px auto 20px auto;
	padding:0px 0px 20px 0px;
	border-bottom:1px dotted #CCCCCC;
	clear:both;
	}
.col2_rphoto_lcopy figure {
	margin:0px auto 0px auto;
	padding:0px 0px 0px 0px;
	float:right;
	width:218px;
	}
.col2_rphoto_lcopy figure img {
	width:218px;
	}
.col2_rphoto_lcopy p {
	float:left;
	width:472px;
	}
.col2_rphoto_lcopy p a {
	color:#198CD2;
	text-decoration:underline;
	}
	
/* 説明1カラム（写真右／写真左　キャプション付き）
----------------------------------------------------------------------------------------------------------------------------------------------------------*/
.col2 {
	margin: 0 0 20px 0;
}
.col2_left {
	float:left;
}
.col2_right {
	float:right;
}
.col2 p {
	margin: 5px 0 10px 0;
}
	
/* ソリューションコラム
----------------------------------------------------------------------------------------------------------------------------------------------------------*/
.solution_column {
	clear:both;
	margin:0 auto 38px;
	padding:15px;
	background:url("../images/bg_solutionclm.png") repeat scroll left top;
	/*ドロップシャドウ*/
	box-shadow: 0px 1px 2px #999999;
	-moz-box-shadow: 0px 1px 2px #999999;
	-o-box-shadow: 0px 1px 2px #999999;
	-ms-box-shadow: 0px 1px 2px #999999;
	filter: progid:DXImageTransform.Microsoft.Shadow(color=#aaaaaa, direction=0, strength=1, enabled=true),
			 progid:DXImageTransform.Microsoft.Shadow(color=#aaaaaa, direction=90, strength=1, enabled=true),
			 progid:DXImageTransform.Microsoft.Shadow(color=#aaaaaa, direction=180, strength=3, enabled=true),
			 progid:DXImageTransform.Microsoft.Shadow(color=#aaaaaa, direction=270, strength=1, enabled=true);
}

.solution_column figure img {
	width:672px;
	padding:0 0 10px 0;
	}

.solution_column p {
	width:515px;
	}

.solution_column p img {
	margin:20px auto 0;
	}
	
	
/* メッセージ
----------------------------------------------------------------------------------------------------------------------------------------------------------*/
.solutionMessage {
	margin:0px auto 20px auto;
	padding:0px 0px 0px 0px;
	border-bottom:1px dotted #CCCCCC;
	clear:both;
	}
.messageCopy {
	width:522px;
	}
.typeA .messageCopy  {
	float:right;
	}
.typeB .messageCopy  {
	float:left;
	}
.solutionMessage span {
	font-size:85%;
	font-weight:bold;
	padding:6px 13px 4px 13px;
	}
	
.solutionMessage figure {
	margin:0px auto 0px auto;
	padding:0px 0px 0px 0px;
	width:160px;
	}
.solutionMessage figure img {
	width:160px;
	}
.typeA figure {
	float:left;
	}
.typeB figure {
	float:right;
	}	

/* スタッフ アイコン（背景色違い）*/
.staffMarkBlue {
	background-color:#A8C5DB;
	}
.staffMarkOrange {
	background-color:#FFCC92;
	}
.staffMarkGreen {
	background-color:#B5F192;
	}


/* ステップ
----------------------------------------------------------------------------------------------------------------------------------------------------------*/
.stepBox {
	margin:30px auto 20px auto;
	padding:0px 0px 0px 0px;
	clear:both;
	}
.step {
	margin:0px auto 0px auto;
	padding:0px 0px 0px 0px;
	}
.stepNumber {
	margin:0px auto 0px auto;
	padding:0px 0px 0px 0px;
	float:left;
	width:130px;
	}
.step p.iconStep {
	margin:0px auto 0px auto;
	padding:13px 0px 13px 0px;
	width:130px;
	height:74px;
	background:url("../images/icon_step01.png") no-repeat center top;
	text-align:center;
	font-size:146.5%;
	font-family: 'Average Sans', sans-serif;
	line-height:170%;
	letter-spacing: 0.15em;
	color:#FFFFFF;
	}
.step p.iconStep span {
	display:block;
	font-size:220%;
	font-weight:bold;
	}	
	
.stepCopy {
	margin:0px auto 0px auto;
	padding:0px 0px 0px 0px;
	float:right;
	width:560px;
	}
.stepCopy h3 {
	margin:4px 20px 0px auto;
	display:inline;
	}
.stepMark {
	display:inline;
	margin:0px 0px 0px auto;
	position:relative;
	}
.stepMarkRed , .stepMarkGreen {
	margin:0px 8px 0px auto;
	font-size:77%;
	padding:6px 16px 4px 16px;
	position:relative;
	top:-4px;	
	}
.stepMarkRed {
	background-color:#F3DCD6;
	border:1px solid #E1A798;
	}
.stepMarkGreen {
	background-color:#DBECD8;
	border:1px solid #81A67E;
	}
.stepCopy p {
	margin-top:12px;
	}
.stepArrow {
	clear:both;
	margin:0px auto 0px auto;
	padding:0px 0px 0px 0px;
	text-align:left;
	height:59px;
	background:url("../images/arrow_step01.png") no-repeat left center;
	}


/* 納入事例
----------------------------------------------------------------------------------------------------------------------------------------------------------*/
.solutionIntroduction {
	margin:4px 0px 0px 0px;
	padding:0px 0px 0px 0px;
	position:relative;
	}

.introductionCopy {
	float:right;
	width:228px;
}

.introductionCopy .btnkadomaru_Tate {
	margin:22px auto 0px auto;
	}
/*サムネイル切り替え*/
div.g-inner {
	float:left;
	position:relative;
	width:460px;
	height:409px;
}
#view {
	position: absolute;
	width:460px;
	height:330px;
	top:0;
	left:0;
	overflow:hidden;
}
#view p {
	position: absolute;
	width:460px;
	height:330px;
	top:0;
	left:0;
}
#thumbBtn {
	position:absolute;
	top:340px;
	left:0;
}
/*キャプション入れる場合
#caption {
	position:absolute;
	top:464px;
	left:0px;
	list-style:none;
}*/
#thumbBtn {
	margin-right:-10px;
	width: 470px;
}
#thumbBtn li {
	margin:0px 10px 0px 0px;
	padding: 0px 0px 0px 0px;
	float:left;
	text-align:left;
	width: 84px;
	cursor:pointer;
	list-style:none;
}
#thumbBtn li img {
	width:84px;
}
#thumbBtn li.active {
	opacity:0.7;
	filter:alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}

/* 内装の施工 カラム（コピーのみ ボーダーあり）
----------------------------------------------------------------------------------------------------------------------------------------------------------*/
.col_copy_border {
	margin:0px auto 20px auto;
	padding:0px 0px 0px 0px;
	border-bottom:1px dotted #CCCCCC;
	clear:both;
	}
.col_rcopy {
	float:right;
	margin-bottom:15px;
	width:472px;
	}
	
/* 表組み 4列
----------------------------------------------------------------------------------------------------------------------------------------------------------*/
.sec_4table {
	clear:both;
	margin:0px 0px 10px auto;
	padding:0px 0px 0px 0px;
	border-top:1px solid #CCCCCC;
	width:100%;
	font-size:108%;
	line-height:150%;
	}
.sec_4table , .sec_4table th , .sec_4table td {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	}
.sec_4table th {
	margin:0px 0px 0px 0px;
	padding:20px 0px 20px 0px;
	border-bottom:1px solid #CCCCCC;
	font-weight:bold;
	width:16%;
	text-align:center;
	}
.sec_4table td {
	margin:0px 0px 0px 0px;
	padding:20px 0px 20px 3%;
	border-bottom:1px solid #CCCCCC;
	width:28%;
	}	
.sec_4table_blue {
	background:#D0EAFA;
	}
.sec_4table_gray {
	background:#F1F1F1;
	}
.sec_4table_rborder {
	border-right:1px solid #CCCCCC;
	}
.sec_4table_center {
	text-align:center;
	}
.sec_4table td span {
	font-size: 85%;
	line-height: 1.0em;
}

/* プロジェクトマネジメント
----------------------------------------------------------------------------------------------------------------------------------------------------------*/

.management_1 {
	text-align:center;
	margin:-13px 10px 0 0;
	padding:15px ;
}
.management_2 {
	float:left;
	margin:0 15px;	
	widht:100%;
}
.management_3 {
	padding:15px 0px 0px 0px;
}
.management_4 {
	float:right;
}
.management_5 {
	padding:10px 0px 0px 0px;
}
.management_5 li{
	margin:0;
}
.management_6 {
	margin: 0px 0px 40px 0px;
	padding: 0 0 25px;
}
.management_7 {
	text-align:center;
	margin: 10px 0px 15px 0px;
}