@charset "utf-8";

/*Theme Name: 笠原屋根工事店　様
Theme URI: http://infotank.jp/pst/
Description: Infotank-webが制作したテンプレートです。
Version: 1
Author: Dave Shea
*/

@import "css/base.css";
@import "css/typography.css";
@import "css/utility.css";


*{
	text-align: left;
	font-family: Meiryo, "MS PGothic", Osaka, "ヒラギノ角ゴ Pro W3", sans-serif;
}
div#content {width:896px; height:auto; background-color:#FFFFFF; margin: 0 auto 0 auto; }
a { color:#006AD5; text-decoration: none }
a:hover { color:#44A2FF; text-decoration: none }
a:active { color:#006AD5; text-decoration: none }
div#contents {
border-bottom: solid 10px #07178d;
}

/*ヘッダー*/
div#head { border-bottom: solid 10px #07178d; background-color:#FFFFFF; background-image: url(images/bleu_bar01.gif); background-repeat: repeat-x; }
div#headder { 
	width:896px; height:108px; position:relative; margin: 0 auto 0 auto;  }
div#headder a { color:#006AD5; text-decoration: none }
div#headder a:hover { color:#44A2FF; text-decoration: none }
div#headder a:active { color:#006AD5; text-decoration: none }
div#headder h1 {
	position: absolute;
	top: 30px;
	left: 182px;
	font-weight: normal;
	font-size: 12px;
}
.logo01 { position:absolute; top:10px; left:0px; }
.tel { position:absolute; top:20px; right:0px; }
p#navi_01 { background-color:#ececec; font-size:11px; padding:3px; position:absolute; bottom:3px; right:0px; }

/*メイン画像*/
div#main_01 { width: 896px; height: 250px; background-color:#CCCCCC; margin: 0 auto 0 auto; }

/*パンクズリスト*/
div#bread { width:896px; height:30px; font-size:12px; background-color:#f8fafe; margin: 0 auto 0 auto; 
}

/*グローバルナビ*/
div#navi { width: 100%;
           height: 47px;
           background-color: #FFFFFF;
           background-image: url(images/bgline00.jpg);
           background-repeat: repeat-x;
		   }

#navi{
	height: 47px;
	z-index:100;
	position: relative;
}
#menu {
	width: 896px;
	margin: 0 auto 0 auto;
}
#menu ul li{
	float: left;
	
}
#menu ul ul{
	position: absolute;
	top: 47px;
}
* html #menu ul ul{ /*Ie6*/
	margin-left: -137px;
	}
*+html #menu ul ul{ /*Ie7*/
	margin-left: -137px;
	}
#menu ul ul li{
	float: none;
	width:130px;
}
#menu ul ul li a{
	border: #333 solid 1px;
	background-color: #0016a1;
	filter: alpha(opacity=85);
	-moz-opacity:0.85;
	opacity:0.85;
	padding: 10px 10px;
	text-align: center;
	color: #FFF;
	font-size: 11px;
	position:relative;
	text-decoration: none;
	display: block;

}
* html #menu ul ul li a{ /*Ie6*/
	display: inline;
	width: 137px;
	}
*+html #menu ul ul li a{ /*Ie7*/
	display: block;
	width: 110px;
	}
#menu ul ul li a:hover{
	background-color: #ccc;
	padding: 10px 10px;
	display: block;
	color: #000;
}
#menu ul li.parent ul{
	display: none;
}
#menu ul li.parenton ul{
	display: block;
}



div#center {
	clear: both;
	width: 896px;
	margin: 0 auto 0 auto;
}

/*メインコンテンツ*/
div#main_contents { 
	width:896px;
	position: relative;
	}
	
* html div#main_contents { /*Ie6*/
	width:896px;
	position: relative;
	}
*+html div#main_contents { /*Ie7*/
	width:896px;
	position: relative;
	}
	
	
/*左のBOX*/
div#left { float:left; width:383px; height:auto; }
div#left_box { float:left; width:383px; height:230px; padding:10px; background-color:#f8fafe; margin-top:15px; }
div#left_box2 { float:left; width:383px; height:230px; padding:10px; background-color:#f8fafe; margin-top:15px; margin-bottom: 0px; }

/*右のBOX*/
div#right { float:right; width:446px; height:auto; margin-top:15px; }

/*フッター*/
div#foot { 
	height:130px;
	position: relative;
	height: 130px;
	border-top: solid 2px #EEE;
	margin-top: 10px;
	}
div#footer { width:896px; height:130px; background-color:#FFFFFF; 
	margin: 0 auto 0 auto;
	clear: both;
	}

p#navi_02 { width:896px; background-color:#ececec; font-size:11px; padding:2px; position:absolute; bottom:3px; left:0px; }
p#navi_02 span { position:absolute; bottom:0px; right:2px; }
p#navi_03 { position:absolute; bottom:25px; left:2px; font-size:13px; }
p#from { position:absolute; bottom:25px; right:2px; }

/*リンクボックス*/
div#rink_box { 
	clear: both;
	width:1000px; height:auto;
	margin-top:15px;
	}
div#rink_box img{ 
		border: #333 solid 1px;
}




/*---------------------------------------------------------各ページ------------------------------------------------------*/
div#contents_box h2 { font-size:150%; }
div#taitle_top { width:100%; text-align:center; font-size:34px; }
div#taitle_top center { text-align:center; }
div#other_top { width:896px; height:200px; margin: 0 auto 0 auto; }
/*会社概要*/
div#contents_box { width:630px; margin-top:25px; }
table#campayTable1 td{
	padding: 5px 10px;
}
p.mleft_15 {
	padding: 10px 0;
}
.mt15_center { margin-top:15px; text-align:center; }
.m_auto { width:auto; margin: 0 auto 0 auto; }

.auto { width:630px; margin: 0 auto 0 auto ; }

/*商品ページ*/
.center { margin: 0 auto 0 auto; }
div#roof_box { width:720px; height:auto; margin: 20px auto 0 auto; }

p#navi_04 { width:896px; background-color:#f3f8fd; font-size:11px; text-decoration:none; margin: 10px auto 0 auto; }
.font_130 { font-size:130%; margin-top:30px; }
/*わが社の強みページ*/
div#text_box_01 { width:856px; height:auto; border: solid 1px #aeaeae; padding:7px; margin: 15px auto 15px auto; }
div#text_box_02 { width:650px; height:auto; border: solid 1px #aeaeae; padding:7px; margin: 15px auto 15px auto; }
.font_150 { font-size:150%; }
.houkoku { width:150px; font-size:18px; margin-left:30px; float:left; }
.teian { width:150px; font-size:18px; margin-left:30px; float:left; }


div#post53 { width:600px; background-color:#f4f4f4; margin: 20px auto 0 auto; }

/*ブログページ*/
div#oyablog{
}
div#oyablog img{
	margin: 5px;
	border: #EEE solid 1px;
}
div#oyablog h4{
	font-size: 15px;
	border-bottom: dotted 1px #006AD5;
}
div#letter ul li{
	float: left;
}
div#letter ul li img{
	margin: 5px;
	border: #EEE solid 1px;
	padding: 5px;
}
div#letter h4{
	font-size: 15px;
	border-bottom: dotted 1px #006AD5;
}
div.entry {
	margin-bottom: 40px;
}
p.entry-footer {
	margin-top: 20px;
	font-size: 11px;
	clear: both;
}
div#blog_box { width:650px; margin: 10px auto 0 auto;
	overflow: auto;
}
div#content_center {
	width: 897px;
	overflow: auto;
}
div#sidebar { 
	width:250px;
	background-color: #EEEEEE;
	float: right;
	text-align: center;
	padding-bottom: 10px;
	padding-top: 10px;
}
div#sidebar img{ 
	margin-top: 4px;
}
div.sidemain {
	width:630px;
	float: left;
	padding-top: 15px;
}
div#blog_bar { float:left;  width:200px; }

h3#blog_nav01 a { width:168px; height:45px; background-image:url(images/header_sai.jpg); background-repeat:no-repeat; background-position:bottom; text-indent:-9999px; display:block; }
h3#blog_nav01 a:hover { background-image:url(images/header_sai.jpg); background-repeat:no-repeat; background-position: top left; }
h3#blog_nav02 a { width:168px; height:45px; background-image:url(images/header_blog.jpg); background-repeat:no-repeat; background-position:bottom; text-indent:-9999px; display:block; }
h3#blog_nav02 a:hover { background-image:url(images/header_blog.jpg); background-repeat:no-repeat; background-position: top left; }
h3#blog_nav03 a { width:168px; height:45px; background-image:url(images/header_contact.jpg); background-repeat:no-repeat; background-position:bottom; text-indent:-9999px; display:block; }
h3#blog_nav03 a:hover { background-image:url(images/header_contact.jpg); background-repeat:no-repeat; background-position: top left; }



/*お問い合わせページ*/
div#inquiry_box { width:856px; height:150px; margin: 10px auto 0 auto; }
.float_r { float:right; }
.float_l { float:left; }
div#center { text-align:center; }
div#tel_box { border: solid 5px #A25100; }

/*サイトマップページ*/
.pa_l10_b { padding-left:1px; padding-top:1px; border-left: solid 2px #FF0000; }
.pa_l10 { padding-left:1px; padding-top:1px; border-left: solid 2px #FF9900; }

/*施工事例*/

div#jirei {
	overflow: auto;
}
h3.bfaf_h3 {
	 background-image:url(images/bef_back.jpg);
	 background-repeat: no-repeat;
	 padding-left: 30px;
	 height: 40px;
	 padding-top: 7px;
	 margin-bottom: 10px;
}
div.ex_list {
	float: left;
	font-size: 13px;
	width: 145px;
	height: 250px;
	margin: 10px 6px;
	border: #CCC solid 1px;
	padding: 10px 14px 10px 5px;
}
div.ex_listtd{
	width: 150px;
	height: 150px;
	display: block;
	overflow: hidden;
	position: relative;
	border: #EEE solid 3px;
}
img.ex_listimg{
	position: absolute;
	clip: rect(50px 500px 400px 100px);
	left: -200px;
	top: -100px;
}
div.ex_listtd2{
	width: 120px;
	height: 120px;
	display: block;
	overflow: hidden;
	position: relative;
	border: #EEE solid 3px;
	float: left;
	margin-right: 2px;
}
img.ex_listimg2{
	position: absolute;
	clip: rect(10px 400px 400px 10px);
	left: -150px;
	top: -150px;
}
.ex_noimage {
	border: #EEE solid 3px;
	float: left;
	margin-right: 2px;
}
div#bigimg {
	text-align: left;
	margin: 10px 0;
	clear: both;
	float: left;
	width: 470px;
	height: 470px;
}
div#bigimg img{
	border: #EEE solid 3px;
	width: 100%;
}
div#samimg {
	width: 100%;
	height: 130px;
}
table#extable {
	float: right;
	width: 400px;
	margin: 10px auto 50px auto;
	border-collapse: separate;
	border-spacing: 0;
}
table#extable th{
	width: 120px;
	border: #EEE solid 1px;
	font-size: 13px;
	padding: 2px 10px;
	font-weight: normal;
}
table#extable td{
	width: 480px;
	border: #EEE solid 1px;
	font-size: 13px;
	padding: 2px 10px;
}
table#extable2 {
	float: right;
	width: 400px;
	margin: 10px auto 50px auto;
	border-collapse: separate;
	border-spacing: 0;
}
table#extable2 th{
	width: 480px;
	height: 15px;
	background-color: #EEE;
	border: #EEE solid 1px;
	font-size: 13px;
	padding: 2px 10px;
	font-weight: normal;
}
table#extable2 td{
	width: 480px;
	min-height: 30px;
	border: #EEE solid 1px;
	font-size: 13px;
	padding: 2px 10px;
}
div#nextlink {
	clear: both;
	height: 2em;
}
.alignleft {
	 float: left;
	font-size: 13px;
}
.alignright {
	float: right;
	font-size: 13px;
}
/* staff
---------------------*/
div#staff p{
	font-size: 13px;
}
div#staff table img{
	padding-right: 10px;
}
div#staff table{
	border-bottom: #CCCCCC dotted 1px;
}
div#staff table th {
	border-bottom: solid 2px #2349B0;
	padding: 1px 10px;
}
div#staff table td {
	padding: 10px 5px;
}
h3 img{
	margin-bottom: 10px;
}