@charset "UTF-8";
@import "base.css";
@import "fonts.css";

/*==========================================================================*/
/*//////////////////////////////////////////////////////////////////////////*/
/*//////                                                              //////*/
/*//////  Copyright (C) 2009 株式会社フリーセル All Rights Reserved.  //////*/
/*//////                                                              //////*/
/*//////////////////////////////////////////////////////////////////////////*/
/*                                                                          */
/*    base.css  --> スタイルの初期設定を行うため、変更しないで下さい。      */
/*    fonts.css --> フォントの初期設定を行うため、変更しないで下さい。      */
/*                                                                          */
/*==========================================================================*/

/*==========================================================================*/
/*                           Common-Setting                                 */
/*==========================================================================*/

/* 基本タグのフォントサイズを指定（12px -> 120% or 1.2em ） */
h1,h2,h3,h4,h5,h6,input,button,textarea,p,blockquote,table,pre,address,ul,ol,dl{font-size: 135%}

h3{
background:url(../img/sec_h3bg.jpg) no-repeat 0 0;
font-size:170%;
font-weight:bold;
margin:0 0 20px}

h3.note{margin:0}

h3 span{
background:url(../img/sec_h3bg2.jpg) no-repeat 0 100%;
display:block;
padding:15px 20px 12px 25px}

h4{
background:url(../img/sec_h4bg.jpg) no-repeat 0 0;
font-size:150%;
font-weight:bold;
margin:0 0 20px}

h4.note,
h4.note span{
background:none;
border:none;
padding:0}

h4 span{
background:url(../img/sec_h4bg2.jpg) no-repeat 0 100%;
display:block;
padding:10px 10px 10px 25px}

h5{
background:url(../img/sec_h5bg.jpg) no-repeat 0 3px;
border-bottom:1px dotted #ccc;
font-size:130%;
font-weight:bold;
margin:0 0 20px;
padding:1px 0 5px 15px}

a{color:#000;text-decoration:underline}
a:hover,
a:active{text-decoration:none}

ul{margin:0 0 20px}

li{
background:url(../img/icon03.jpg) no-repeat 0 4px;
padding:0 0 0 10px}

dl{margin:0 0 20px}
dt{font-weight:bold}
dd{}

table{
border:3px solid #ccc;
border-top:5px solid #6e6e6e;
margin:0 0 20px;
width:100%}

th{
background:#F4FBFD;
border-bottom:2px solid #ccc;
padding:8px 5px;
white-space:nowrap;
width:1%}

.mailform th{
font-weight:bold;
white-space:normal;
width:150px}

td{
border-bottom:2px solid #ccc;
border-left:2px solid #ccc;
padding:8px 5px}

.mailform td ul li,
.mailform td ol li{
background:none}

td ul.note{margin:0}

table.col{border:2px solid #ccc}

table.col th.top{
background:url(../img/sec_tableBg.jpg) repeat;
color:#fff;
border-left:2px solid #ccc}

div.banner{
margin:0 0 20px;
text-align:center}

iframe,
div.lead,
div.fig{margin:0 0 20px}

p,
div.adr{margin:0 0 20px}

img{vertical-align:bottom}

/*==========================================================================*/
/*                            Container                                     */
/*==========================================================================*/

body {
background:url(../img/com_bodyBg2.jpg) repeat-x 50% 0 #FCF9F1;
color: #333;
text-align: center}

#index{background:url(../img/com_bodyBg.jpg) repeat-x 50% 0 #FCF9F1}

#wrapper{
background:url(../img/com_bodyBg2.jpg) repeat-x 50% 0 #FCF9F1;
margin:0 auto;
width:900px}

#index #wrapper{background:url(../img/com_bodyBg.jpg) repeat-x 50% 0 #FCF9F1}

#main:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#main{
display:inline-block;
margin:0 auto;
text-align:left}

/*\*/
*html #main{height:1%}
#main{display:block}
/**/

.pageTop{
clear:both;
margin:0 0 20px;
text-align:right}

.pageTop a{
background:url(../img/pageTop.jpg) no-repeat 0 5px;
font-size:115%;
padding:0 0 0 15px}

/*==========================================================================*/
/*                               Header                                     */
/*==========================================================================*/

#header{
background:url(../img/com_headBg.jpg) no-repeat 0 106px;
height:336px;
margin:0 0 20px;
position:relative}

#index #header{
background:none;
height:456px}

#header h1{
color:#fff;
font-size:90%;
text-align:right;
position:absolute;
top:2px;
right:0}

#header #headLogo{
position:absolute;
top:25px;
left:0}

#header h2{
color:#333;
font-weight:bold;
font-size:200%;
text-align:left;
position:absolute;
top:203px;
left:20px}

#index #header h2{
top:106px;
left:0}

#header ul:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#header ul{
display:inline-block;
margin:0;
position:absolute}

/*\*/
*html #header ul{height:1%}
#header ul{display:block}
/**/

#header ul li{
background:none;
float:left;
margin:0;
padding:0}

#header ul#headLink{
top:75px;
right:0}

#header ul#gNav{
bottom:0;
left:0}

#header #headInq{
position:absolute;
top:17px;
right:0}

/*==========================================================================*/
/*                              Footer                                      */
/*==========================================================================*/

#footer{background:url(../img/com_footBg.gif) repeat-x}

#footer #footerCont{
background:url(../img/com_footBg.gif) repeat-x;
margin:0 auto;
padding:25px 0;
text-align:left;
width:900px}

/*==========================================================================*/
/*                            Navigation                                    */
/*==========================================================================*/

#navi{
float:right;
width:220px}

#navi dl,
#navi ul,
#navi div{margin:0 0 10px}

#navi ul.banner li,
#navi ul.banner2 li{
background:none;
margin:0 0 10px;
padding:0}

#navi ul.banner2{
background:url(../img/com_sideBannerBg.jpg) repeat;
_height:1%;
padding:5px;
text-align:center}

#navi ul.banner2 li.lastChild{margin:0}

#navi dl.menu{
background:url(../img/com_sideMenuBg.jpg) repeat;
padding:5px}

#navi dl.menu dd{background:#fff}

#navi dl.menu dd.firstChild{border-bottom:1px dotted #999}

#navi dl.menu dd a{
background:url(../img/icon02.gif) no-repeat 8px 12px;
color:#282828;
display:block;
font-size:90%;
font-weight:bold;
padding:5px 5px 5px 15px;
text-decoration:none}

#navi dl.menu dd a:hover{color:#FFB916}

#navi ul.menu2{
border:1px solid #ccc;
border-bottom:none}

#navi ul.menu2 li{
background:url(../img/com_sideMenuListBg.jpg) no-repeat 50% 0;
border-bottom:1px solid #ccc;
padding:0}

#navi ul.menu2 li a{
background:url(../img/com_sideMenuListBg2.jpg) no-repeat 10px 10px;
display:block;
padding:5px 10px 5px 25px}

#navi ul.menu2 li a:hover{color:#FEC642}

/*==========================================================================*/
/*                             Contents                                     */
/*==========================================================================*/

#content{
float:left;
margin:0 20px 0 0;
width:660px}

#main .topicPath{
margin:0 0 5px;
text-align:right}

#main .topicPath li{
background:url(../img/nav.gif) no-repeat 0 4px;
display:inline;
font-size:85%;
margin:0 0 0 4px;
padding:0 0 0 10px}

#main .topicPath li.firstChild{
background:none;
margin:0;
padding:0}

/* sec
------------------------------------------------------------------------*/

#content .bg01,
#content .bg03,
#content .bg07,
#content .bg08,
#content .bg15,
#content .bg17{
background:url(../img/sec_pict01.jpg) no-repeat 100% 0;
min-height:190px;
_height:190px;
padding:0 180px 0 0}

#content .bg03{background:url(../img/sec_pict03.jpg) no-repeat 100% 0}
#content .bg07{background:url(../img/sec_pict07.jpg) no-repeat 100% 0}
#content .bg08{background:url(../img/sec_pict09.jpg) no-repeat 100% 0}
#content .bg15{background:url(../img/sec_pict15.jpg) no-repeat 100% 0}
#content .bg17{background:url(../img/sec_pict17.jpg) no-repeat 100% 0}

#content .bg02,
#content .bg16,
#content .bg18{
background:url(../img/sec_pict02.jpg) no-repeat 0 0;
min-height:190px;
_height:190px;
padding:0 0 0 180px}

#content .bg16{background:url(../img/sec_pict16.jpg) no-repeat 0 0;margin:0 0 20px}
#content .bg18{background:url(../img/sec_pict18.jpg) no-repeat 0 0;margin:0 0 20px}

#content .bg04{
background:url(../img/sec_pict04.jpg) no-repeat 100% 0;
min-height:380px;
_height:380px;
padding:20px 0 0 0}

#content .bg04 p{padding:0 280px 0 0}

#content .bg05{
background:url(../img/sec_pict05.jpg) no-repeat 100% 0;
margin:0 0 20px;
min-height:265px;
_height:265px;
padding:0 185px 0 0}

#content .bg06{
background:url(../img/sec_pict06.jpg) no-repeat 0 0;
margin:0 0 20px;
min-height:210px;
_height:210px;
padding:0 0 0 270px}

#content .bg09{
background:url(../img/sec_pict10.jpg) no-repeat 100% 0;
min-height:240px;
_height:240px;
padding:0 230px 0 0}

#content .bg10{
background:url(../img/sec_pict11.jpg) no-repeat 100% 0;
min-height:330px;
_height:330px;
padding:0 230px 0 0}

#content .bg11{
background:url(../img/sec_pict12.jpg) no-repeat 100% 0;
min-height:160px;
_height:160px;
padding:0 230px 0 0}

#content .bg12{
background:url(../img/sec_pict14.jpg) no-repeat 100% 0;
min-height:530px;
_height:530px;
padding:0 240px 0 0}

/* RCの家
************************/

#content .rc dl{
background:url(../img/sec_dlBg01.jpg) no-repeat 0 0;
padding:18px 235px 0 20px}

#content .rc dl.dl02{background:url(../img/sec_dlBg02.jpg) no-repeat 0 0}
#content .rc dl.dl03{background:url(../img/sec_dlBg03.jpg) no-repeat 0 0}
#content .rc dl.dl04{background:url(../img/sec_dlBg04.jpg) no-repeat 0 0}

#content .rc dl dd{
background:url(../img/sec_dlBg00.jpg) no-repeat 0 100%;
margin:0 -235px 0 -20px;
padding:20px 235px 25px 20px}

#content ul.banner:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#content ul.banner{display:inline-block;}

/*\*/
*html #content ul.banner{height:1%}
#content ul.banner{display:block}
/**/

#content ul.banner li{
background:none;
float:left;
padding:0}

#content ul.banner li.firstChild{margin:0 10px 0 0}

/* 木造の家
************************/

#content h5.note{
background:none;
border:none;
padding:0}

/* 施工実績
************************/

#content .case:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#content .case{
background:#F0F0F0;
border:#ccc;
display:inline-block;
margin:0 0 20px;
padding:10px}

/*\*/
*html #content .case{height:1%}
#content .case{display:block}
/**/

#content .case ul{
float:left;
margin:0}

#content .case ul.big{
border-right:1px dotted #999;
margin:0 15px 0 0;
padding:0 15px 0 0}

#content .case ul.big li{display:none}

#content .case ul.big li.li01,
#content .case ul.big li.li03,
#content .case ul.big li.li06,
#content .case ul.big li.li09,
#content .case ul.big li.li15,
#content .case ul.big li.li21,
#content .case ul.big li.li24{display:block}

#content .case ul.small:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#content .case ul.small{
display:inline-block;
width:280px}

/*\*/
*html #content .case ul.small{height:1%}
#content .case ul.small{display:block}
/**/

#content .case ul li{
background:none;
padding:0}

#content .case ul.small li{
float:left;
margin:0 10px 10px 0}

/* faq
************************/

#content .faq{
background:url(../img/sec_pict13.jpg) no-repeat 100% 0;
padding:20px 0 0}

#content .faq ul li{
background:url(../img/sec_faqAll01.jpg) no-repeat 0 0;
margin:0 0 5px;
padding:0 0 2px 45px}

#content .faq ul li.li02{background:url(../img/sec_faqAll02.jpg) no-repeat 0 0}
#content .faq ul li.li03{background:url(../img/sec_faqAll03.jpg) no-repeat 0 0}
#content .faq ul li.li04{background:url(../img/sec_faqAll04.jpg) no-repeat 0 0}
#content .faq ul li.li05{background:url(../img/sec_faqAll05.jpg) no-repeat 0 0}
#content .faq ul li.li06{background:url(../img/sec_faqAll06.jpg) no-repeat 0 0}
#content .faq ul li.li07{background:url(../img/sec_faqAll07.jpg) no-repeat 0 0}
#content .faq ul li.li08{background:url(../img/sec_faqAll08.jpg) no-repeat 0 0}
#content .faq ul li.li09{background:url(../img/sec_faqAll09.jpg) no-repeat 0 0}
#content .faq ul li.li10{background:url(../img/sec_faqAll10.jpg) no-repeat 0 0}

#content .faq dl dt{
background:url(../img/sec_faq01.jpg) no-repeat 0 0;
margin:0 0 10px;
padding:12px 10px 12px 70px}

#content .faq dl dd{
background:url(../img/sec_faq02.jpg) no-repeat 0 10px;
padding:10px 10px 3px 70px}

#content .sign{text-align:right}

/* flow
************************/

#content dl.flow{
background:url(../img/sec_flowBg01.jpg) no-repeat 0 0;
_height:1%;
padding:10px 20px 0}

#content dl.flow dt{margin:0 0 10px}

#content dl.flow dd{
background:url(../img/sec_flowBg02.jpg) no-repeat 0 100%;
margin:0 -20px;
padding:0 20px 90px}

#content dl.flow.lastChild dd{
background:none;
border-bottom:1px solid #ccc;
padding:0 20px 10px}

/* map
************************/

#content ul.show:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#content ul.show{
background:url(../img/sec_showBg.jpg) repeat-y 50% 0;
display:inline-block;}

/*\*/
*html #content ul.show{height:1%}
#content ul.show{display:block}
/**/

#content ul.show li{
background:none;
float:left;
padding:0;
width:320px}

#content ul.show li.firstChild{margin:0 20px 0 0}

#content ul.show li h4{
background:url(../img/sec_h4bg_show.jpg) no-repeat 0 0;
font-size:110%}

#content ul.show li h4 span{background:url(../img/sec_h4bg_show2.jpg) no-repeat 0 100%}

#content ul.show li .pic{margin:0 0 20px}

/* サイトマップ
************************/

#content ul.sitemap li{
background:url(../img/icon04.jpg) no-repeat 0 4px;
margin:0 0 5px;
padding:0 0 0 15px}

#content ul.sitemap li.note{
background:none}

#content ul.sitemap li ul{
height:1%;
margin:0}

#content ul.sitemap li ul li{
background:url(../img/icon03.jpg) no-repeat 0 4px}

/* index
------------------------------------------------------------------------*/

#index #content h3,
#index #content h3 span,
#index #content h4,
#index #content h4 span{
background:none;
border:none;
padding:0}

#index #content .h301 ul:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#index #content .h301 ul{display:inline-block;}

/*\*/
*html #index #content .h301 ul{height:1%}
#index #content .h301 ul{display:block}
/**/

#index #content .h301 ul li{
background:none;
float:left;
margin:0;
padding:0}

#index #content .h301 ul.pickUp{background:url(../img/ind_h301bg.jpg) no-repeat 100% 0}

#index #content .h301 ul.pickUp li{width:220px}

#index #content .h301 ul.pickUp li dl{
margin:0;
position:relative}

#index #content .h301 ul.pickUp li dl dt{height:55px}

#index #content .h301 ul.pickUp li dl dd{
font-size:90%;
padding:0 90px 0 0}

#index #content .h301 ul.pickUp li dl dd.note{padding:0}

#index #content .h301 ul.pickUp li dl dd ul{margin:0}

#index #content .h301 ul.pickUp li dl dd ul li{
background:url(../img/icon01.gif) no-repeat 0 3px;
margin:0 0 5px;
padding:0 0 0 15px}

#index #content .h301 ul.pickUp li dl dd.link{
padding:0;
position:absolute;
top:151px;
right:20px}

#index #content .h401{
background:url(../img/ind_h401bg.jpg) no-repeat 0 0;
min-height:285px;
_height:325px;
text-align:right;
padding:40px 0 0 280px;
position:relative}

#index #content .h401 .link{
position:absolute;
top:150px;
left:1px}

#index #content .h401 ul li{
background:none;
float:left;
text-align:left;
padding:0;
width:185px}

#index #content .h401 ul li.li01{margin:0 10px 0 0}

#index #content .h401 ul li dl{margin:0}

#index #content .h401 ul li dl dd{font-size:90%}

#index #content .h303 .sectionH4{
background:url(../img/ind_h303bg.jpg) no-repeat 0 0;
min-height:220px;
_height:220px;
position:relative}

#index #content .h303 .sectionH4 dl{
margin:0;
position:absolute;
top:150px;
left:170px}

#index #content .h303 .sectionH4 dl dt{
font-size:90%;
margin:0 0 5px}

#jqtab {
	width: 662px;
	height: 72px;
	background:url(../img/sec_eq_bg.jpg) 0 0 repeat;
}
#jqtab p{ 	
	float: left;
	padding-left: 10px;
}

.eq_banner01 a,
.eq_banner02 a{
	width: 315px;
	height: 60px;
	display: block;
	text-indent: -9999px;
	outline: none;
}
.eq_banner01 a{
	background:url(../img/sec_eqBanner01_off.jpg) 0 0 repeat;
}
.eq_banner02 a{
	background:url(../img/sec_eqBanner02_off.jpg) 0 0 repeat;
}
.eq_banner01 a:hover{
	background:url(../img/sec_eqBanner01_on.jpg) 0 0 repeat;
}
.eq_banner02 a:hover{
	background:url(../img/sec_eqBanner02_on.jpg) 0 0 repeat;
}

.eq_banner01 a.tabSelected{
	background:url(../img/sec_eqBanner01_on.jpg) 0 0 repeat;
}
.eq_banner02 a.tabSelected{
	background:url(../img/sec_eqBanner02_on.jpg) 0 0 repeat;
}

.earthquake { clear: both;}

.earthquake h3 { margin: 30px 0 15px 0;}
.earthquake h4 { margin: 25px 0 15px 0;}

.earthquake p{ margin: 0 0 5px 10px;}

.eq_banner {}
.eq_banner p {
	float: left;
	padding-left: 10px;
}

.report { 
	width: 640px;
	margin: 15px 0 0 10px;
	background:url(../img/sec_report02.jpg) 0 0 repeat;}

.report dt { 
	height: 25px;
	background:url(../img/sec_report01.jpg) no-repeat;
	padding: 25px 0 0 50px;
	font-size: 110%;
	font-weight: bold;
}

.report dd { 
	line-height: 1.6em;
	padding: 10px 15px 40px 20px;
	background:url(../img/sec_report03.jpg) 0 bottom no-repeat;
}