@charset "utf-8"; 

/*============================================================
REFORM.CSS

リフォームはテンプレートから切り離された独立したページです
============================================================*/



/*====================
Snavi
====================*/

div#subContents div.linklist dl.snavi dt.reform a:link {
	background-image: url(/common/images/subcontents/im_reform_off.gif);
}

div#subContents div.linklist dl.snavi dt.reform a:visited {
	background-image: url(/common/images/subcontents/im_reform_off.gif);
}

div#subContents div.linklist dl.snavi dt.reform a:hover {
	background-image: url(/common/images/subcontents/im_reform_on.gif);
}



/*============================================
リフォームトップページで使用
============================================*/

/*===================
headerContents
===================*/

div#headerContents img{
vertical-align:bottom;
}

div#headerContents img.bar_header{
margin:0px 0px 10px 0px;
}

div#headerContents h2{
vertical-align:bottom;
margin:0px;
padding:0px;
}

div#headerContents div.reformHead{
background-image:url(../../../realestate/reform/images/bg_main_bar.jpg);
background-position:left top;
background-repeat:no-repeat;
height:20px;
}


/*===================
onlyMainContents
===================*/

div#onlyMainContents{
width:750px;
margin:0px auto 25px auto;
padding:0px 0px 15px 0px;
background-color:#ffffff;
line-height:150%;
}


.red{
color:#ff0000;
}


/*========================
基本的な枠組み
========================*/

div#leftWrapper{
margin:10px 0px 0px 0px;
float:left;
width:540px;
}

div#leftContents{
width:240px;
float:left;
}

div#middleContents{
width:240px;
float:right;
}

div#rightContents{
width:171px;
float:right;
margin:20px 0px 0px 0px;
padding:0px;
}

div#rightContents img{
margin:0px 15px 0px 0px;
}



/*leftBox*/

dl.leftBox{
width:100%;
margin:20px 0px 0px 15px;
padding:0px;
}


/*middleBox*/

dl.middleBox{
margin:20px 0px 0px 0px;
padding:0px;
zoom:100%;
}


/*共通*/

dl.topleftBox dt,dl.topmiddleBox dt{
font-weight:bold;
border-bottom:1px dashed #cccccc;
border-left:5px solid #cccccc;
padding:3px 0px 2px 10px;
width:100%;
height:100%;
}

dl.topleftBox dd,dl.topmiddleBox dd{
margin:0px;
padding:0px 0px 0px 0px;
}

dl.topleftBox dd div ul,dl.topmiddleBox dd div ul{
margin:0px 0px 0px 10px;
padding:0px;
list-style-type:circle;
list-style-position:inside;
}

dl.topleftBox dd div#xmlfeed_reform_information ul li,dl.topmiddleBox dd div#xmlfeed_reform_sumai ul li{
line-height:150%;
margin:0px;
padding:0px 0px 0px 0px;
}



/*============
img
============*/

img.imgRight{
margin:30px 0px 0px 0px;
}




/*============
dl,dt,dd
=============*/



/*==============================================
インテリア探しのお手伝い[/interior]
=============================================*/

div#interiorContents{
margin:14px 12px 10px 6px;
}

p.lead{
color:#666666;
margin:10px 10px 20px 10px;
}

div#interiorContents h2{
margin:0px;
padding:0px;
}

div#interiorContents h3{
border-left:5px solid #77be77;
border-bottom:1px dashed #669933;
padding:0px 0px 2px 5px;
margin:0px 0px 10px 0px;
}

div#interiorContents h3.maker{
border:none;
padding:0px;
margin:0px 0px 23px 0px;
}

p.w460{
width:460px;
margin:0px 0px 20px 10px;
}

p.caution{
text-align:right;
color:#999999;
margin:0px 0px 10px 0px;
}

/*=====================
dl.point
=====================*/

dl.point{
margin:0px 0px 20px 10px;
padding:0px;
}

dl.point dt{
margin:0px 0px 13px 0px;
padding:0px;
}

dl.point dd{
margin:0px 0px 15px 10px;
padding:0px;
}


/*=====================
ul.phList
=====================*/

ul.phList{
margin:0px 0px 26px 0px;
padding:0px;
text-align:left;
}

ul.phList li{
display:inline;
margin:0px 20px 0px 0px;
padding:0px;
}

ul.phList li img{
vertical-align:bottom;
}

ul.phList li.no-margin{
margin:0px;
}


/*=======================
div.makerBox
=======================*/

div.makerBox{
width:100%;
margin:0px 0px 20px 0px;
}

div.makerBox dl{
width:480px;
margin:0px 0px 0px 0px;
display:block;
float:right;
}

div.makerBox dl dt{
margin:0px 0px 7px 0px;
padding:0px 0px 3px 0px;
border-bottom:1px dashed #999999;
}

div.makerBox dl dd{
margin:0px;
padding:0px;
}

img.phLeft{
float:left;
margin:0px 17px 0px 0px;
padding:0px;
vertical-align:bottom;
}


/*===================================
HeaderContents
===================================*/

body.flow div#headerContents{
margin-bottom:17px;
}






/*==============================================
リフォームの流れ[/flow]
=============================================*/

/*===================================
HeaderContents
===================================*/

body.flow div#headerContents{
margin-bottom:17px;
}



/*===================================
onlyMainContents
===================================*/

/*=================
基本
=================*/

div#reformFlowContent{
padding:10px;
}

div#reformFlowContent h3,div#reformFlowContent h4{
margin:0px 0px 0px 0px;
padding:0px 0px 3px 0px;
border-bottom:1px dashed #339966;
}

div#reformFlowContent h4{
margin:0px 0px 10px 0px;
padding:0px 0px 3px 0px;
position:relative;
border-bottom:1px dashed #339966;
}

div#reformFlowContent h3 img,div#reformFlowContent h4 img{
vertical-align:bottom;
}

div#reformFlowContent h4 img.englishTitle{
position:absolute;
left:0px;
top:25px;
}

img.greenLine{
margin:0px 0px 25px 0px;
}

/*=================
div.summaryBox
=================*/

div.summaryBox{
margin:0px 0px 10px 0px;
}

div.summaryBox img{
vertical-align:bottom;
}


/*===================
div.grayBox
===================*/

div.pointBox{
background-color:#f4f4f4;
padding:8px 12px;
margin:0px 0px 20px 0px;
}

div.pointBox ul{
line-height:150%;
margin:8px 0px 0px 12px;
padding:0px;
list-style-type:none;
}

div.pointBox ul li{
margin:0px 0px 5px 0px;
padding:0px 0px 0px 17px;
background-image:url(../../../realestate/reform/flow/images/ic_reform_circle.gif);
background-position:left 0.3em;
background-repeat:no-repeat;
}


/*=======================
div.stepBox
=======================*/

div.stepBox{
}

div.stepBox p{
padding:19px 0px 0px 0px;
margin:0px 0px 0px 2px;
}

div.stepBox img.imgRight{
margin:0px 0px 0px 10px;
}

div.stepBox ul{
margin:16px 0px 0px 9px;
padding:0px;
}

div.stepBox li{
margin:0px 0px 2px 11px;
padding:0px;
}


/*===================================================
トップ以下のページで使用
===================================================*/

/*============================
reformContent
============================*/

div#reformContent{
padding:0px 15px 0px 15px;
}



/*=============================
top AREA
=============================*/
div.topleft {
	margin: 20px 0px 5px 0px;
	padding: 0px;
	width: 355px;
	float: left;
}

div.topleft h3{
	margin: 0px 0px 5px 0px;
	padding: 0px;
}

div.topleft dl{
	margin: 0px;
	padding: 0px;
}

div.topleft dl dt span.event{
	margin: 0px;
	padding: 0px;
	color :#ff0000;
}

div.topleft dl dd{
	margin: 3px 20px 10px 78px;
	padding: 0px;
	font-size: 85%;
}

div.topright {
	margin: 20px 0px 10px 352px;
	padding: 0px;
	width: 352px;
}

p.reform {
    margin: 5px 0px 15px 0px;
	padding: 0px;
	text-align: right;
}



/*====================================
sitenavi AREA
====================================*/
div.sitenavi ul {
    margin: 0px;
	padding: 0px;
}

div.sitenavi ul li{
    margin: 0px;
	padding: 0px;
    display: inline;
    list-style:none;
	width:250px;
}

div.sitenavi ul li img{
    margin: 0px;
	padding: 0px;
}

/*==================================
record
==================================*/
div#record {
	position: absolute;
	top: 60px;
	left: 0px;
	width: 400px;
	margin: 0px;
	padding: 0px;
}

div#record p {
	margin: 0px;
	padding: 0px 0px 0px 10px;
	font-size: 10px;
	color: #ffffff;
}


/*====================================
h2top AREA
====================================*/
h2.main{
    margin: 0px;
	padding: 0px;
}

h3.h3top{
    margin: 0px 0px 0px 0px;
	padding: 20px 0px 10px 0px;
}
/*=====================================
substance AREA
=====================================*/

div.substance {
    margin: 0px;
	padding: 0px 10px 0px 10px;
	background-color: #D6E0E0;
}

/*======================================
leftarea AREA
======================================*/

div.leftarea {
	margin: 0px;
	padding: 0px;
	width: 400px;
	float: left;
}

div.white-left {
	margin: 10px 0px 10px 0px;
	padding: 0px;
	background-color: #ffffff;
}

div.white-left p{
    margin: 0px;
	padding: 15px 15px 15px 15px;
}

div.white-left h5.basic{
    margin: 0px;
	padding: 15px 15px 0px 15px;
}

div.white-left h5.outline{
    margin:0px;
	padding: 2px 2px 0px 2px;
}

div.white-left img.staffbig {
	margin: 0px;
	padding: 0px 5px 5px 15px;
	float: left;	
}

div.white-left img.staff-finish {
	margin: 0px;
	padding: 15px 10px 5px 15px;
	float: left;	
}

/*=======================================
rightarea AREA
=======================================*/

div.rightarea {
	margin: 0px 0px 10px 407px;
	padding: 0px;
	width: 280px;
}

div.white-right {
	margin: 10px 0px 10px 0px;
	padding: 0px;
	background-color: #ffffff;
}

div.white-right p{
    margin: 0px;
	padding: 5px 5px 5px 5px;
    font-size: 80%;
}

div.white-right-nomargin {
	margin: 10px 0px 0px 0px;
	padding: 0px;
	background-color: #ffffff;
}

div.white-right-nomargin p{
    margin: 0px;
	padding: 5px 5px 5px 5px;
    font-size: 80%;
}

/*=========================================
hfepisode AREA
=========================================*/

div.hfepisode{
	margin: 10px 0px 10px 210px;
	width: 500px;
}

div.hfepisode h5{
	margin: 0px 0px 10px 0px;
	padding: 5px 0px 10px 15px;
	border-left:1px solid #cccccc;
	border-bottom:1px solid #cccccc;
}

div.hfepisode p{
	margin: 0px 0px 10px 0px;
	padding: 15px 0px 5px 15px;
	border-left:1px solid #cccccc;
	border-top:1px solid #cccccc;	
}

div.hfepisode p img{
	margin: 0px;
	padding: 0px 10px 0px 0px;
	float: left;
}

/*========================================
episode AREA
========================================*/

div.episode{
    margin: 0px;
	padding: 10px 0px 10px 0px;
}

div.episode p{
    margin: 0px;
	padding: 5px 0px 5px 0px;
}

div.leftside{
	margin: 0px;
	width: 490px;
	height: 125px;
	float: left;
	border-right:1px solid #cccccc;
	border-top:1px solid #cccccc;
}

div.leftside p{
	margin: 0px;
	padding: 10px 10px 10px 0px;
}

div.rightside{
	margin: 0px 0px 0px 500px;
	height: 125px;
	border-left:1px solid #cccccc;
	border-top:1px solid #cccccc;
}

div.rightside img{
	margin: 0px;
	padding: 10px 0px 0px 10px;
}

div.rightside p{
    margin: 0px;
	padding: 4px 0px 4px 10px;
    font-size: 80%;
}

/*========================================
white-point AREA
========================================*/

div.white-point{
    margin: 0px;
	padding: 10px 0px 10px 0px;
}

div.white-point p{
    margin: 0px;
	padding: 10px;
	background-color: #ffffff;
}
div.white-point p img{
    margin: 0px;
	padding: 0px;
	float: left;
}

/*========================================
hfarea AREA 
========================================*/

div.hfleftarea {
	margin: 0px 0px 30px 0px;
	padding: 0px 0px 0px 15px;
	width: 385px;
	float: left;
}

div.hfleftarea dl dt {
	margin: 0px 0px 0px 0px;
	padding: 5px 5px 5px 5px;
	border-top: 1px solid #cccccc;
	border-left: 5px solid #cccccc;
	border-right: 5px solid #cccccc;
	font-weight:bold;
	text-align:center;
}

div.hfleftarea dl dd {
	margin: 0px 0px 30px 20px;
	padding: 5px 10px 5px 10px;
	line-height:　130%;
	border-top: 1px solid #cccccc;
	border-left: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
}

div.hfleftarea dl dd.last {
	margin: 0px 0px 0px 20px;
	padding: 5px 10px 5px 10px;
	line-height:　130%;
	border-top: 1px solid #cccccc;
	border-left: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
}


div.hfleftarea p{
	margin: 0px;
	padding: 10px 0px 10px 0px;
	line-height:　130%;
}

div.hfrightarea{
	margin: 0px 0px 0px 450px;

}

div.hfrightarea p{
	margin: 0px 0px 10px 0px;
	padding: 2px 5px 2px 5px;
}

div.hfrightside{
	margin: 0px 0px 0px 450px;
	padding: 0px 0px 10px 0px;	
}

div.info{
	width: 233px;
	border: 1px solid #bbbbbb;
}

div.hfrightside p{
	margin: 0px;
	padding: 3px 5px 3px 5px;
}


div.hfrightside p.case{
	margin: 30px 0px 0px 0px;
	width: 175px;
	border-left:5px solid #B1B1B1;
	border-bottom:1px solid #B1B1B1; 
}

div.hfrightside img.case{
	margin: 15px 0px 0px 0px;
	padding: 0px;
}

h4.hf{
	margin: 0px;
}

div.hfintroduction {
	margin: 0px 0px 30px 0px;
	width: 440px;
	float: left;
	border-top:1px solid #B1B1B1;
	border-right:1px solid #B1B1B1; 
}

div.hfintroduction p{
	margin: 0px 0px 15px 0px;
	padding: 9px 10px 5px 10px;
}

div.corner {
    margin: 0px 0px 20px 0px;
	padding: 0px;
}

div.corner ul {
    margin: 0px;
	padding: 0px;
}

div.corner ul li{
    margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 4px;
    display: inline;
    list-style:none;
	width:170px;
}

div.corner ul li img{
    margin: 0px;
	padding: 4px 0px 0px 0px;
}


/*==========================================
skyplaza AREA 
==========================================*/

div.skyplazaleftarea {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 15px;
	width: 385px;
	float: left;
}

div.skyplazaleftarea p{
	margin: 0px;
	padding: 10px 0px 10px 0px;
}

div.skyplazarightarea{
	margin: 0px 0px 0px 530px;

}

div.skyplazarightarea img{
	margin: 0px;
	padding: 10px 0px 0px 0px;
}

/*==========================================
skleftarea AREA スカイプラザで使っています。
==========================================*/

div.skleftarea {
	margin: 0px;
	padding: 0px;
	width: 300px;
	float: left;
}

div.skwhite-left {
	margin: 10px 0px 10px 0px;
	padding: 0px;
	background-color: #ffffff;
}

div.skwhite-left p{
	margin: 0px;
	padding: 0px 0px 5px 10px;
	font-size: 80%;
}

div.skwhite-left img.main{
	margin: 10px 10px 10px 10px;
	padding: 0px;
}

div.examplearea {
	margin: 0px;
	padding: 10px;
}

div.examplearea img{
	margin: 0px;
	padding: 0px 0px 0px 1px;;
}



/*===========================================
skrightarea AREA スカイプラザで使っています。
===========================================*/

div.skrightarea {
	margin: 0px 0px 0px 317px;
	padding: 0px;
	width: 370px;
}

div.skrightarea img{
	margin: 10px 0px 0px 0px;
	padding: 0px;
}

div.skrightarea p.gotohf{
	margin: 0px 0px 10px 0px;
	padding: 0px;
	text-align:right;
}

div.skrightarea p.sksmall{
	margin: 0px 0px 0px 0px;
	padding: 0px;
	font-size:80%;
}