@import url("base.css");

#contents {
	padding-bottom:40px;
}


/* イントロ
-----------------------------------*/
#intro {
	width:708px;
	border:1px solid #8BD3E5;
	border-top:0px;
	background-color:#F7F7F7;
	padding:0px 10px 17px 10px;
	margin-bottom:24px;
}


/* ページトップ
-----------------------------------*/
.pagetop_area_wide {
	width:50px;
	text-align:right;
	padding:7px 0px 8px 680px;
}

a.bt_pagetop {
	width:50px;
	height:15px;
	display:block;
	background-image:url(../img/flow/bt_pagetop.gif);
	background-position:top left;
	background-repeat:no-repeat;
}
a.bt_pagetop:hover {
	background-position:top right;
}


/* STEP 1
-----------------------------------*/
#step1 {
	width:730px;
	padding-bottom:10px;
	background-image:url(../img/flow/box_bg.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step1 .head {
	width:730px;
	height:88px;
}

#step1 .head .icon_area {
	float:left;
	width:83px;
	height:88px;
}

#step1 .head .cover_area {
	float:left;
	width:647px;
	height:50px;
	background-image:url(../img/flow/step1_cover.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step1 .head .text_area {
	float:left;
	width:362px;
	height:38px;
	background-color:#F7F7F7;
}

#step1 .head .right_area {
	float:left;
	width:285px;
	height:38px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step1_head_right.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step1 .inner {
	width:690px;
	height:192px;
	border:1px solid #8BD3E5;
	border-top:0px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step1_bg.jpg);
	background-position:top right;
	background-repeat:no-repeat;
	margin-left:10px;
	padding-left:19px;
}

#step1 .inner .photo {
	float:left;
	width:130px;
	padding-top:17px;
}

#step1 .inner .photo img {
	padding:1px;
	border:1px solid #D9D9D9;
}

#step1 .inner .info {
	float:left;
	width:560px;
	line-height:20px;
	padding-top:17px;
}

a.bt_arch {
	width:200px;
	height:37px;
	display:block;
	margin-top:10px;
	background-image:url(../img/flow/bt_arch.gif);
	background-position:top left;
	background-repeat:no-repeat;
}
a.bt_arch:hover {
	background-position:top right;
}


/* STEP 2
-----------------------------------*/
#step2 {
	width:730px;
	padding-bottom:10px;
	background-image:url(../img/flow/box_bg.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step2 .head {
	width:730px;
	background-color:#FFFFFF;
}

#step2 .head .arrow_area {
	float:left;
	width:564px;
	height:43px;
	background-image:url(../img/flow/arrow_down.gif);
	background-position:center center;
	background-repeat:no-repeat;
}

#step2 .head .pagetop_area {
	float:left;
	width:50px;
	height:28px;
	padding-top:15px;
	padding-left:33px;
	text-align:right;
}

#step2 .head .icon_area {
	float:left;
	width:83px;
	height:97px;
	padding-top:14px;
}

#step2 .head .cover_area {
	float:left;
	width:647px;
	height:29px;
	background-image:url(../img/flow/step2_cover.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step2 .head .text_area {
	float:left;
	width:362px;
	height:39px;
	background-color:#F7F7F7;
}

#step2 .head .right_area {
	float:left;
	width:285px;
	height:39px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step2_head_right.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step2 .inner {
	width:690px;
	height:162px;
	border:1px solid #8BD3E5;
	border-top:0px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step2_bg.jpg);
	background-position:top right;
	background-repeat:no-repeat;
	margin-left:10px;
	padding-left:19px;
}

#step2 .inner .photo {
	float:left;
	width:130px;
	padding-top:17px;
}

#step2 .inner .photo img {
	padding:1px;
	border:1px solid #D9D9D9;
}

#step2 .inner .info {
	float:left;
	width:560px;
	line-height:20px;
	padding-top:17px;
}


/* お気軽にご相談下さい
-----------------------------------*/
#consult {
	float:right;
	width:280px;
	background-image:url(../img/flow/box_bg.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#consult .head {
	width:280px;
	background-color:#FFFFFF;
}

#consult .head .pagetop_area {
	float:right;
	width:50px;
	height:28px;
	padding-top:15px;
	padding-left:33px;
	text-align:right;
}

#consult .head .arrow_area {
	float:right;
	width:180px;
	height:43px;
	background-image:url(../img/flow/arrow_down.gif);
	background-position:center center;
	background-repeat:no-repeat;
}

#consult .inner {
	width:235px;
	padding:9px 12px 0px 12px;
	border:1px solid #E7B98A;
	border-bottom:0px;
	background-color:#FFFFFF;
	margin:10px 0px 0px 10px;
}

#consult .inner .text {
	width:228px;
	padding-left:7px;
}

#consult .inner .number {
	width:228px;
	padding:5px 0px 0px 7px;
	font-size:11px;
}


/* STEP 3
-----------------------------------*/
#step3 {
	float:left;
	width:410px;
	padding-bottom:10px;
	background-image:url(../img/flow/box_bg.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step3 .head {
	width:410px;
	background-color:#FFFFFF;
}

#step3 .head .arrow_area {
	float:left;
	width:244px;
	height:43px;
	background-image:url(../img/flow/arrow_down.gif);
	background-position:center center;
	background-repeat:no-repeat;
}

#step3 .head .icon_area {
	float:left;
	width:83px;
	height:111px;
}

#step3 .head .cover_area {
	float:left;
	width:327px;
	height:29px;
	background-image:url(../img/flow/step3_cover.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step3 .head .text_area {
	float:left;
	width:250px;
	height:39px;
	background-color:#F7F7F7;
}

#step3 .head .right_area {
	float:left;
	width:77px;
	height:39px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step3_head_right.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step3 .inner {
	width:370px;
	border:1px solid #8BD3E5;
	border-top:0px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step3_bg.gif);
	background-position:bottom right;
	background-repeat:no-repeat;
	margin-left:10px;
	padding-left:19px;
	padding-bottom:29px;
}

#step3 .inner .photo {
	float:left;
	width:130px;
	padding-top:17px;
}

#step3 .inner .photo img {
	padding:1px;
	border:1px solid #D9D9D9;
}

#step3 .inner .info {
	float:left;
	width:240px;
	line-height:20px;
	padding-top:17px;
}


/* STEP 3 - お気軽にご相談の間
-----------------------------------*/
#step3_space {
	float:left;
	width:40px;
	height:220px;
	padding-top:43px;
}

#step3_space .arrow {
	width:40px;
	height:220px;
	background-image:url(../img/flow/arrow_left.gif);
	background-position:center center;
	background-repeat:no-repeat;
}


/* STEP 4
-----------------------------------*/
#step4 {
	float:left;
	width:410px;
	background-image:url(../img/flow/box_bg.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step4 .head {
	width:410px;
	background-color:#FFFFFF;
}

#step4 .head .arrow_area {
	float:left;
	width:244px;
	height:43px;
	background-image:url(../img/flow/arrow_down.gif);
	background-position:center center;
	background-repeat:no-repeat;
}

#step4 .head .icon_area {
	float:left;
	width:83px;
	height:106px;
}

#step4 .head .cover_area {
	float:left;
	width:327px;
	height:29px;
	background-image:url(../img/flow/step4_cover.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step4 .head .text_area {
	float:left;
	width:250px;
	height:34px;
	background-color:#F7F7F7;
}

#step4 .head .right_area {
	float:left;
	width:77px;
	height:34px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step4_head_right.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step4 .inner {
	width:370px;
	line-height:17px;
	font-size:11px;
	border:1px solid #8BD3E5;
	border-top:0px;
	border-bottom:0px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step4_bg.gif);
	background-position:bottom right;
	background-repeat:no-repeat;
	margin-left:10px;
	padding-left:19px;
}

#step4 .inner .photo {
	float:left;
	width:130px;
	padding-top:17px;
}

#step4 .inner .photo img {
	padding:1px;
	border:1px solid #D9D9D9;
}

#step4 .inner .info {
	float:left;
	width:240px;
	font-size:12px;
	line-height:20px;
	padding-top:17px;
}

#step4 .inner .font_red {
	color:#F84A0E;
}


/* STEP 5
-----------------------------------*/
#step5 {
	width:730px;
	padding-bottom:10px;
	background-image:url(../img/flow/box_bg.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step5 .head {
	width:730px;
	background-color:#FFFFFF;
}

#step5 .head .arrow_area {
	float:left;
	width:132px;
	height:43px;
	background-image:url(../img/flow/arrow_down.gif);
	background-position:center right;
	background-repeat:no-repeat;
}

#step5 .head .center_area {
	float:left;
	width:465px;
	height:43px;
	background-image:url(../img/flow/step5_head_center.jpg);
	background-position:top left;
	background-repeat:no-repeat;
}

#step5 .head .pagetop_area {
	float:left;
	width:50px;
	height:28px;
	padding-top:15px;
	text-align:right;
}

#step5 .head .icon_area {
	float:left;
	width:83px;
	height:110px;
}

#step5 .head .cover_area {
	float:left;
	width:647px;
	height:31px;
	background-image:url(../img/flow/step5_cover.jpg);
	background-position:top left;
	background-repeat:repeat-y;
}

#step5 .head .text_area {
	float:left;
	width:362px;
	height:36px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step5_text_bg.jpg);
	background-position:top right;
	background-repeat:no-repeat;
}

#step5 .head .right_area {
	float:left;
	width:285px;
	height:36px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step5_head_right.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step5 .inner {
	width:690px;
	height:162px;
	border:1px solid #8BD3E5;
	border-top:0px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step5_bg.jpg);
	background-position:top right;
	background-repeat:no-repeat;
	margin-left:10px;
	padding-left:19px;
}

#step5 .inner .photo {
	float:left;
	width:130px;
	padding-top:17px;
}

#step5 .inner .photo img {
	padding:1px;
	border:1px solid #D9D9D9;
}

#step5 .inner .info {
	float:left;
	width:560px;
	line-height:20px;
	padding-top:17px;
}


/* STEP 6
-----------------------------------*/
#step6 {
	width:730px;
	padding-bottom:10px;
	background-image:url(../img/flow/box_bg.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step6 .head {
	width:730px;
	background-color:#FFFFFF;
}

#step6 .head .arrow_area {
	float:left;
	width:564px;
	height:43px;
	background-image:url(../img/flow/arrow_down.gif);
	background-position:center center;
	background-repeat:no-repeat;
}

#step6 .head .pagetop_area {
	float:left;
	width:50px;
	height:28px;
	padding-top:15px;
	padding-left:33px;
	text-align:right;
}

#step6 .head .icon_area {
	float:left;
	width:83px;
	height:110px;
}

#step6 .head .cover_area {
	float:left;
	width:647px;
	height:29px;
	background-image:url(../img/flow/step6_cover.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step6 .head .text_area {
	float:left;
	width:362px;
	height:38px;
	background-color:#F7F7F7;
}

#step6 .head .right_area {
	float:left;
	width:285px;
	height:38px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step6_head_right.gif);
	background-position:top right;
	background-repeat:repeat-y;
}

#step6 .inner {
	width:690px;
	line-height:20px;
	border:1px solid #8BD3E5;
	border-top:0px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step6_bg.jpg);
	background-position:bottom right;
	background-repeat:no-repeat;
	margin-left:10px;
	padding-left:19px;
	padding-bottom:27px;
}



/* STEP 7
-----------------------------------*/
#step7 {
	width:730px;
	padding-bottom:10px;
	background-image:url(../img/flow/box_bg.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step7 .head {
	width:730px;
	background-color:#FFFFFF;
}

#step7 .head .arrow_area {
	float:left;
	width:564px;
	height:43px;
	background-image:url(../img/flow/arrow_down.gif);
	background-position:center center;
	background-repeat:no-repeat;
}

#step7 .head .pagetop_area {
	float:left;
	width:50px;
	height:28px;
	padding-top:15px;
	padding-left:33px;
	text-align:right;
}

#step7 .head .icon_area {
	float:left;
	width:83px;
	height:110px;
}

#step7 .head .cover_area {
	float:left;
	width:647px;
	height:29px;
	background-image:url(../img/flow/step7_cover.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step7 .head .text_area {
	float:left;
	width:362px;
	height:38px;
	background-color:#F7F7F7;
}

#step7 .head .right_area {
	float:left;
	width:285px;
	height:38px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step7_head_right.gif);
	background-position:top right;
	background-repeat:repeat-y;
}

#step7 .inner {
	width:690px;
	border:1px solid #8BD3E5;
	border-top:0px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step7_bg.jpg);
	background-position:top right;
	background-repeat:no-repeat;
	margin-left:10px;
	padding-left:19px;
	padding-bottom:16px;
}

#step7 .inner .photo {
	float:left;
	width:130px;
	padding-top:17px;
}

#step7 .inner .photo img {
	padding:1px;
	border:1px solid #D9D9D9;
}

#step7 .inner .info {
	float:left;
	width:560px;
	line-height:20px;
	padding-top:17px;
}


/* STEP 8
-----------------------------------*/
#step8 {
	width:730px;
	padding-bottom:10px;
	background-image:url(../img/flow/box_bg.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step8 .head {
	width:730px;
	background-color:#FFFFFF;
}

#step8 .head .arrow_area {
	float:left;
	width:564px;
	height:43px;
	background-image:url(../img/flow/arrow_down.gif);
	background-position:center center;
	background-repeat:no-repeat;
}

#step8 .head .pagetop_area {
	float:left;
	width:50px;
	height:28px;
	padding-top:15px;
	padding-left:33px;
	text-align:right;
}

#step8 .head .icon_area {
	float:left;
	width:83px;
	height:110px;
}

#step8 .head .cover_area {
	float:left;
	width:647px;
	height:29px;
	background-image:url(../img/flow/step8_cover.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step8 .head .text_area {
	float:left;
	width:362px;
	height:38px;
	background-color:#F7F7F7;
}

#step8 .head .right_area {
	float:left;
	width:285px;
	height:38px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step8_head_right.gif);
	background-position:top right;
	background-repeat:repeat-y;
}

#step8 .inner {
	width:690px;
	border:1px solid #8BD3E5;
	border-top:0px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step8_bg.jpg);
	background-position:top right;
	background-repeat:no-repeat;
	margin-left:10px;
	padding-left:19px;
	padding-bottom:5px;
}

#step8 .inner .photo {
	float:left;
	width:130px;
	padding-top:17px;
}

#step8 .inner .photo img {
	padding:1px;
	border:1px solid #D9D9D9;
}

#step8 .inner .info {
	float:left;
	width:560px;
	line-height:20px;
	padding-top:17px;
}


/* STEP 9
-----------------------------------*/
#step9 {
	width:730px;
	padding-bottom:10px;
	background-image:url(../img/flow/box_bg.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step9 .head {
	width:730px;
	background-color:#FFFFFF;
}

#step9 .head .arrow_area {
	float:left;
	width:564px;
	height:43px;
	background-image:url(../img/flow/arrow_down.gif);
	background-position:center center;
	background-repeat:no-repeat;
}

#step9 .head .pagetop_area {
	float:left;
	width:50px;
	height:28px;
	padding-top:15px;
	padding-left:33px;
	text-align:right;
}

#step9 .head .icon_area {
	float:left;
	width:83px;
	height:110px;
}

#step9 .head .cover_area {
	float:left;
	width:647px;
	height:29px;
	background-image:url(../img/flow/step9_cover.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#step9 .head .text_area {
	float:left;
	width:362px;
	height:38px;
	background-color:#F7F7F7;
}

#step9 .head .right_area {
	float:left;
	width:285px;
	height:38px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step9_head_right.jpg);
	background-position:top right;
	background-repeat:repeat-y;
}

#step9 .inner {
	width:690px;
	border:1px solid #8BD3E5;
	border-top:0px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/step9_bg.jpg);
	background-position:top right;
	background-repeat:no-repeat;
	margin-left:10px;
	padding-left:19px;
	padding-bottom:27px;
}

#step9 .inner .photo {
	float:left;
	width:130px;
	padding-top:17px;
}

#step9 .inner .photo img {
	padding:1px;
	border:1px solid #D9D9D9;
}

#step9 .inner .info {
	float:left;
	width:560px;
	line-height:20px;
	padding-top:17px;
}


/* 着工から完成まで
-----------------------------------*/
#comp {
	width:730px;
	padding:10px 0px 10px 10px;
	background-image:url(../img/flow/box_bg.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#comp .inner {
	width:671px;
	border:1px solid #ABDA4D;
	background-color:#F7F7F7;
	padding:17px 19px 26px 19px;
}

#comp .inner .box {
	float:left;
	width:151px;
	line-height:15px;
	font-size:11px;
}

#comp .inner .arrow {
	float:left;
	width:22px;
	height:154px;
	background-image:url(../img/flow/arrow_right.gif);
	background-position:center center;
	background-repeat:no-repeat;
}


/* アフターサービス
-----------------------------------*/
#after {
	width:730px;
	padding-bottom:10px;
	background-image:url(../img/flow/box_bg.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#after .head {
	width:730px;
	background-color:#FFFFFF;
}

#after .head .icon_area {
	float:left;
	width:83px;
	height:89px;
}

#after .head .cover_area {
	float:left;
	width:647px;
	height:52px;
	background-image:url(../img/flow/after_cover.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#after .head .text_area {
	float:left;
	width:362px;
	height:37px;
	background-color:#F7F7F7;
}

#after .head .right_area {
	float:left;
	width:285px;
	height:37px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/after_head_right.jpg);
	background-position:top right;
	background-repeat:repeat-y;
}

#after .inner {
	width:690px;
	height:160px;
	border:1px solid #EDB329;
	border-top:0px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/after_bg.jpg);
	background-position:top right;
	background-repeat:no-repeat;
	margin-left:10px;
	padding-left:19px;
}


/* 保証制度
-----------------------------------*/
#guarantee {
	width:730px;
	padding-bottom:10px;
	background-image:url(../img/flow/box_bg.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#guarantee .head {
	width:730px;
	background-color:#FFFFFF;
}

#guarantee .head .icon_area {
	float:left;
	width:83px;
	height:89px;
}

#guarantee .head .cover_area {
	float:left;
	width:647px;
	height:52px;
	background-image:url(../img/flow/guarantee_cover.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#guarantee .head .text_area {
	float:left;
	width:362px;
	height:48px;
	background-color:#F7F7F7;
}

#guarantee .head .right_area {
	float:left;
	width:285px;
	height:48px;
	background-color:#F7F7F7;
	background-image:url(../img/flow/guarantee_head_right.gif);
	background-position:top right;
	background-repeat:repeat-y;
}

#guarantee .inner {
	width:663px;
	line-height:20px;
	border:1px solid #FEDE58;
	border-top:0px;
	background-color:#F7F7F7;
	margin-left:10px;
	padding:0px 23px 29px 23px;
}

a.bt_details {
	width:200px;
	height:37px;
	display:block;
	margin-top:9px;
	background-image:url(../img/flow/bt_details.gif);
	background-position:top left;
	background-repeat:no-repeat;
}
a.bt_details:hover {
	background-position:top right;
}


/* 受賞暦
-----------------------------------*/
#winning1 {
	width:690px;
	border:1px solid #D9D9D9;
	background-color:#F7F7F7;
	margin-top:8px;
	padding:15px 19px 20px 19px;
}

#winning1 .photo {
	float:left;
	width:246px;
}

#winning1 .text {
	float:right;
	width:444px;
	line-height:20px;
}


#winning2 {
	width:690px;
	border:1px solid #D9D9D9;
	background-color:#F7F7F7;
	margin-top:25px;
	padding:15px 19px 20px 19px;
}

#winning2 .photo {
	float:left;
	width:190px;
}

#winning2 .text {
	float:right;
	width:500px;
	line-height:20px;
	padding-bottom:15px;
}

#winning2 .cm_area {
	float:left;
	width:190px;
	padding:10px;
	color:#777777;
	background-color:#E6E3DA;
}

#winning2 .cm_area .cm_text {
	width:190px;
	padding-top:5px;
}