@charset "utf-8";
/* CSS Document */
/*職人倶楽部2009 index*/


/*header*/

#bgheader {
	background:url(../img/img003.gif) left top repeat-x
}
	#header {
		margin:0 auto;
		height:80px;
		width:900px;
		text-align:left;
		background:url(../img/img001.jpg) left top no-repeat;
	}
		#header-box {
			position:relative;
			width:870px;
			left:30px;
			top:0px;
			}
			#header-box-img{
				position:absolute;
				top:0;
				left:30px;
				width:136px;
				z-index:2;
				}
			#header-text {
				position:absolute;
				top:5px;
				left:166px;
				}
				#header-p {
					font-size:11px;
					color:#888888;
					}
			#header-map {
				position:absolute;
				top:45px;
				right:0;
				width:130px;
				z-index:2;
				}
			#header-tanka{
				position:absolute;
				top:0px;
				left:-52px;
				width:90px;
				z-index:1;
				}	
				

.modern {/*モダンブラウザ:MacIE5：IE7:用flaot解除により背景表示可能*/
　　overflow: hidden;
	}
.modern:after {
    content: "";
    display: block;
    clear: both;
    height: 1px;
　　overflow: hidden;
}
				/*\*/
				* html .modern {
				    height: 100%;
			　       overflow: visible;
					}
				/*IE5～6対策*/

#bgwrapper {
	width:100%;
	background:url(../img/img002.jpg) left top repeat-x;
	}
	#container-bg {
		margin: 0 auto;
		width:900px;
		background:url(../img/img006.gif) left top repeat-y;
			}
		#container {
			text-align:left;
			margin: 0 auto;
			width:900px;
			background:url(../img/img003.jpg) left top no-repeat;
			}
			#main {
				float:right;
				width:860px;
				margin-bottom:15px;
				}
				.main-box {/*main内のマージン確保で利用*/
					margin:20px 30px 10px 20px;
					}
				.primary-left {/*左エリア*/
					float:left;
					width:540px;
					}
					.primary-box {/*背景パターン*/
						background:url(../img/img028.gif) left top repeat-y;
						overflow:hidden;/*背景パターンのoverflow除去*/
						}
						#margin-top{
							margin-top:5px;
							}
					.h2-yane {/*屋根（recommend）告見出し*/
						background:url(../img/img032.gif) left top no-repeat;
						font-weight:bolder;
						padding:6px 30px 5px 60px;
						color:#0c3882
						}
					.h2-gai {/*外壁（recommend）告見出し*/
						background:url(../img/img063.gif) left top no-repeat;
						font-weight:bolder;
						padding:6px 30px 5px 60px;
						color:#0c3882
						}
					.h2-top {
						background:url(../img/img006.jpg) left top no-repeat;
						font-weight:bolder;
						padding:14px 13px 13px 30px;
						color:#24567c;
						}
					.p-mini {/*primary-box内で小文字として使用*/
						font-size:1.1em;
						padding:10px 25px 10px 25px;
						color:#000000;
						}
					.primary-container {/*底背景*/
						background:url(../img/img027.gif) left bottom no-repeat;
						padding:0px 25px 15px 25px;
						}
						.primary-container h3 {
							background:url(../img/img026.gif) left top no-repeat;
							padding:2px 0 0 32px;
							margin-top:12px;
							margin-bottom:6px;
							color:#0b64b0;
							}
						.primary-container p {/*pの位置を微調整*/
							margin-bottom:15px;
							padding-left:5px;
							}
						.span01 {/*spanで使用*/
							background:url(../img/img046.gif) right top no-repeat;
							display:block;
							padding-right:35px;
							padding-top:5px;
							text-align:right;
							}
						.ul-top {/*実績紹介で使用：位置を微調整*/
							margin-top:5px;
							margin-bottom:15px;
							padding:5px 5px 5px 15px;
							height:9em;
							overflow:auto;
							}
							.kan {
								background:url(../img/img025.gif) left top no-repeat;
								padding-left:73px;
								}
							.mitu {
								background:url(../img/img024.gif) left top no-repeat;
								padding-left:73px;
								}
							.seko {
								background:url(../img/img023.gif) left top no-repeat;
								padding-left:73px;
								}
						.ul-top-sub {/*更新履歴で使用*/
							margin-top:5px;
							padding:5px 5px 5px 15px;
							height:6em;
							overflow:auto;
							}
							
						/*実績一覧:result_allで使用*/
							#bg_result {
								background:url(../img/img064.gif) right top no-repeat
								}
							.result_ul{
								margin:10px 0;
								}
								.result_ul li {
									margin-bottom:10px;
									background-color:#ff3399;
									padding:2px 0px 2px 100px;
									}
									#genba {
										background:url(../img/img029.jpg) left top no-repeat
										}
									#coment {
										background:url(../img/img028.jpg) left top no-repeat
										}
									#sekou {
										background:url(../img/img030.jpg) left top no-repeat
										}
									.result_li_img li{
										display:inline;
										margin-left:2px;
											width:102px;
											height:82px;
										/*background-color:#0066FF;
										border:1px solid #CCCC66;
											width:102px;
											height:82px;*/
										}
										.result_li_img li a {
											display:bolok;
											width:102px;
											height:82px;
											border:1px solid #000066;
											}
										.result_li_img li a:hover {
											border:1px solid #ff0066;
											width:102px;
											height:82px;
											}
							
				
				/*右エリア*/			
				.primary-right {
					float:right;
					width:250px;
					}
					#toi {/*問合せフォームボタン*/
						width:250px;
						}
						#toi span a{
							display:block;
							width:100%;
							padding-top:53px;
							height: 0 !important;
							height /**/:53px;
							overflow:hidden;
							background-image:url(../img/img019.gif);
							}
							#toi01 a { background-position:0px 0px;} 							
						 	#toi01 a:hover { background-position:0px -53px;}
						
						.p-padding {/*primary-right内のP ul制御*/
							padding:10px;
							}
					.primary-right-box {
						background:#ffffff url(../img/img022.gif) center bottom no-repeat;
						margin-bottom:15px;
						padding-bottom:8px;/*4pxのbottom背景表示調整*/
						}
						.h3-top {/*見出し背景微調整*/
							background:url(../img/img020.gif) center top no-repeat;
							font-weight:bolder;
							padding:7px 5px 5px 21px;
							font-size:14px;
							color:#ffffff;
							font-weight:normal;
							}
						.primary-right-box img {
							margin-top:10px;
							}
							#recom-001 {/*リフォーム術ボタン*/
								height:177px;
								margin-top:2px;
								}
								#recom-001 li a {
									display:block;
									width:100%;
									height: 0 !important;
									height /**/:59px;
									padding-top: 59px;
									overflow:hidden;
									background-image:url(../img/img021.gif);	
									}
									#recom-001a a { background-position:0px 0px;} 
									#recom-001b a { background-position:0px -59px;} 							
									#recom-001c a { background-position:0px -118px;}
						
									#recom-001a a:hover{ background-position:0px -177px;} 
									#recom-001b a:hover{ background-position:0px -236px;} 							
									#recom-001c a:hover{ background-position:0px -295px;}
							#result-bana {/*施工実績バナー*/
								height:86px;
								margin-top:2px;
								}
								#result-bana li a {
									display:block;
									width:100%;
									height: 0 !important;
									height /**/:86px;
									padding-top: 86px;
									overflow:hidden;
									background-image:url(../img/img033.jpg);	
									}
									#result-bana-a a { background-position:0px 0px;} 
						
									#result-bana-a a:hover{ background-position:0px -86px;} 
			
							#result-navi {/*施工実績別ボタン*/
								height:120px;
								margin-top:2px;
								}
								#result-navi li a {
									display:block;
									width:100%;
									height: 0 !important;
									height /**/:30px;
									padding-top: 30px;
									overflow:hidden;
									background-image:url(../img/img073.gif);	
									}
									#result-navia a { background-position:0px 0px;} 
									#result-navib a { background-position:0px -30px;} 							
									#result-navic a { background-position:0px -60px;}
									#result-navid a { background-position:0px -90px;}
								
									#result-navia a:hover{ background-position:0px -120px;} 
									#result-navib a:hover{ background-position:0px -150px;} 							
									#result-navic a:hover{ background-position:0px -180px;}
									#result-navid a:hover{ background-position:0px -210px;}
										
			/*サイドナビゲーション*/
			#left {
				float:left;
				width:40px;
				margin-bottom:15px;
				}
				#globalnavi-sub {
					margin-top:43px;
					}
					#sub-navi {
						width:40px;
						height:646px;
						}
						#sub-navi li {
							width:40px;
							}
							#sub_navi li a{
								display:block;
								width:100%;
								padding-top:160px;
								height: 0 !important;
								height /**/:160px;
								overflow:hidden;
								background-image: url(../img/img036.gif);
								}
							 	#snavi01 a { background-position:40px 0;}
								#snavi02 a { background-position:40px -160px;}
								#snavi03 a { background-position:40px -320px;}
								#snavi04 a { background-position:40px -480px;} 							
												
							 	#snavi01 a.stay { background-position:0px 0;}
								#snavi02 a.stay { background-position:0px -160px;}
								#snavi03 a.stay { background-position:0px -320px;}
								#snavi04 a.stay { background-position:0px -480px;} 							

							 	#snavi01 a:hover { background-position:0px 0;}
								#snavi02 a:hover { background-position:0px -160px;}
								#snavi03 a:hover { background-position:0px -320px;}
								#snavi04 a:hover { background-position:0px -480px;} 							
			
			.page-up {/*page-up機能　及びmain,leftのfloaクリア*/
				clear:both;
					position:relative;
				}	
				.page-up-box {
					position:absolute;
					top:-113px;
					right:-4px;	
					}	
					.page-up p {
						width:30px;
						}
						.page-up p a {
							display:block;
							width:100%;
							height: 0 !important;
							height /**/:103px;
							padding-top:103px;
							overflow:hidden;
							background-image:url(../img/img033.gif);
							}
							#pageup01 a { background-position:0 0;} 							
							#pageup01 a:hover { background-position:-30px 0px;}
			
			#bottom {
				padding-left:60px;
				padding-right:30px;
				}
				#bottom-box {/*背景に「ご連絡お問合せ先」設置*/
					width:810px;
					padding-top:38px;
					margin-bottom:15px;
					background:url(../img/img029.gif) center top no-repeat;
					}
					.bottom-box-img {
						float:left;
						margin-right:20px;
						}
					.bottom-box-text {/*右側に回りこむテキスト群*/
						padding-left:5px;
						}
						.bottom-box-text h3 {
							font-weight:bolder;
							padding-bottom:5px;
							}
						
			/*メインナビゲーション*/
				#globalnavi {
						position:relative;
						background:url(../img/img013.gif) left top no-repeat;
						width:860px;
						height:55px;
					}
					#top_navi{
						position:absolute;
						top:10px;
						left:73px;
						width:695px;
						height:40px;
						}
						#top_navi li{
							float:left;
							width:139px;
							}
							#top_navi li a {
								display:block;
								width:100%;
								height: 0 !important;
								height /**/:40px;
								padding-top:40px;
								overflow:hidden;
								background-image: url(../img/img015.gif);
								}
									/*オフマウス*/
									#nav01 a {background-position:	0		0;}
									#nav02 a {background-position:	-139px 	0;}
									#nav03 a {background-position:	-278px	0;}
									#nav04 a {background-position:	-417px	0;}
									#nav05 a {background-position:	-556px	0;} 
									/*選択済み*/
									#nav01 a.stay {background-position:	0		-40px;}
									#nav02 a.stay {background-position:	-139px 	-40px;}
									#nav03 a.stay {background-position:	-278px	-40px;}
									#nav04 a.stay {background-position:	-417px	-40px;}
									#nav05 a.stay {background-position:	-556px	-40px;}
									/*オンマウス*/
									#nav01 a:hover {background-position:	0		-80px;}
									#nav02 a:hover {background-position:	-139px 	-80px;}
									#nav03 a:hover {background-position:	-278px	-80px;}
									#nav04 a:hover {background-position:	-417px	-80px;}
									#nav05 a:hover {background-position:	-556px	-80px;}
	
/*footer*/
#bgfooter {
	height:211px;
	background:url(../img/img009.gif) left top repeat-x;
}
	#footer {
		margin: 0 auto;
		width:900px;
		height:100%;
		background:url(../img/img010.gif) left top repeat-y;
		}
		#footer-box {
			padding-top:85px;
			background:url(../img/img011.gif) left top no-repeat;
			padding-left:60px;
			padding-right:30px;
			}
			#footer-main {/*白背景のＳＥＯ用文字列box*/
				margin-right:10px;
				margin-left:195px;
				}
				.footer-p {
					font-size:10px;
					line-height:1.5;
					}
				#f-navibox {
					margin-top:10px;
					width:810px;
					}
					#f-nabi-right {
						float:right;
						width:130px;
						}
					#f-nabi-left {/*フッターナビ*/
						float:left;
						width:679px;
						font-size:10px;
						text-align:left;
						padding-top:5px;
						}
						#f-nabi-left li {
							display:inline;
							}
							#f-nabi-left li a {
								font-size:12px;
								}
					#f-navi-bottom {/*copyright テキスト*/
						clear:both;
						width:810px;
						text-align:center;
						}
						#f-navi-bottom p {
							font-size:10px;
							}


