@charset "utf-8";
/* CSS Document */

/* reset:start */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
/* reset:end */

/* clearFix:start */
.clearFix:before,
.clearFix:after {
    content: " ";
    display: table;
}

.clearFix:after {
    clear: both;
}
/* clearFix:end */

html{
	font-size:62.5%;
	-webkit-text-size-adjust: 100%;
}
body{
	font-family:"游ゴシック, ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#333;
	background:#fff;
}
a:hover{
	opacity:0.8;
}
	a.on:hover,
	a.off:hover{
		opacity:1;
	}
input,
select{
	font-size:1.6em;
}
label{
	cursor:pointer;
}
	label input{
		cursor:pointer;
	}
sup{
	font-size:0.5em;
	vertical-align:super;
}
#wrapper{
	position:relative;
	z-index:1;
	width:100%;
}
#header{
	position:absolute;
	top:0;
	left:0;
	z-index:2;
	width:100%;
	background:url("../img/common/header_bg.png");
}
	#header .box{
		position:relative;
		margin:0 auto;
		width:960px;
		height:60px;
	}
		#header .box .logo{
			position:absolute;
			top:13px;
			left:0;
			z-index:2;
		}
		#header .box .dev{
			position:absolute;
			top:15px;
			left:0;
			z-index:1;
			width:960px;
			font-size:2.8em;
			font-weight:bold;
			text-align:center;
			color:#f00;
		}
		#header .box .btns{
			position:absolute;
			top:11px;
			right:0;
			z-index:2;
			text-align:right;
		}
			#header .box .btns a{
				display:inline-block;
				margin-left:10px;
				padding:0 10px 0 20px;
				font-size:1.4em;
				font-weight:bold;
				color:#009e96;
				text-decoration:none;
				line-height:32px;
				background:url("../img/common/header_link_arrow.png") no-repeat 11px 13px #fff;
				border:1px solid #ccc;
				border-radius:3px;
			}
	#header .box2{
		position:relative;
		margin:0 auto;
		width:960px;
		height:53px;
	}
		#header .box2 .plan{
			padding-top:15px;
			font-size:2.4em;
			font-weight:bold;
		}
#contents{
	position:relative;
	z-index:1;
}
	#contents .boxL{
		float:left;
	}
	#contents .boxR{
		float:right;
	}
#footer{
	position:relative;
	z-index:1;
	height:70px;
	background:#fff;
}
	#footer .copyright{
		margin-top:18px;
		font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
		font-size:1.4em;
		text-align:center;
	}

#modal{
	display:none;
	position:absolute;
	top:0;
	left:0;
	z-index:2;
	width:100%;
}
	#modal #modal-bg{
		position:relative;
		top:0;
		left:0;
		width:100%;
		background:#000;
		opacity:0.8;
	}
	#modal .modal-win{
		position:absolute;
		display:none;
	}
		#modal .modal-win dt{
			padding-left:34px;
			font-size:2.8em;
			font-weight:bold;
			line-height:72px;
			color:#fff;
			background:#009e96;
			border-radius:3px 3px 0 0;
		}
		#modal .modal-win dd.content{
			background:#fff;
		}
		#modal .modal-win dd.footer{
			padding:17px 0 13px;
			background:#d8d9d8;
			border-radius:0 0 3px 3px;
		}
			#modal .modal-win dd.footer .btn{
				display:block;
				margin:0 auto;
				width:262px;
				font-size:2.1em;
				font-weight:bold;
				color:#fff;
				text-align:center;
				text-decoration:none;
				line-height:49px;
				background:#ff9900;
				border:2px solid #fff;
				border-radius:3px;
			}
		#modal .modal-win .close{
			position:absolute;
			top:-23px;
			right:-23px;
		}
		#modal .modal-house-detail{
			width:854px;
		}
			#modal .modal-house-detail dd.content{
				padding:20px 38px 29px 25px;
			}
				#modal .modal-house-detail dd.content .text{
					font-size:1.6em;
					font-weight:bold;
				}
				#modal .modal-house-detail dd.content .text2{
					margin-top:18px;
					padding-left:10px;
					font-size:1.6em;
					font-weight:bold;
					line-height:36px;
					background:#f1f1f1;
				}
				#modal .modal-house-detail dd.content .input-box{
					line-height:36px;
				}
					#modal .modal-house-detail dd.content .input-box .input-title{
						float:left;
						width:84px;
						font-size:1.8em;
						font-weight:bold;
						color:#fff;
						text-align:center;
						background:#009e96;
						border-radius:3px;
					}
					#modal .modal-house-detail dd.content .input-box .input-value{
						float:left;
						padding-left:14px;
					}
						#modal .modal-house-detail dd.content .input-box .input-value select{
							padding:0 8px;
							height:36px;
							line-height:36px;
							background:#fff;
							background:-moz-linear-gradient(top, #ddd, #fff 10%, #fff);
							background:-webkit-gradient(linear, left top, left bottom, from(#ddd), color-stop( 0.1, #fff ), to(#fff));
							border:1px solid #cccccc;
							border-radius:3px;
						}
						#modal .modal-house-detail dd.content .input-box .input-value input{
							padding:0 8px;
							height:34px;
							line-height:34px;
							background:#fff;
							background:-moz-linear-gradient(top, #ddd, #fff 10%, #fff);
							background:-webkit-gradient(linear, left top, left bottom, from(#ddd), color-stop( 0.1, #fff ), to(#fff));
							border:1px solid #cccccc;
							border-radius:3px;
						}
				#modal .modal-house-detail dd.content .input-box1{
					margin-top:20px;
					line-height:41px;
				}
					#modal .modal-house-detail dd.content .input-box1 .input-value select{
						margin-right:6px;
						padding:0 8px;
						height:41px;
						line-height:41px;
					}
						#modal .modal-house-detail dd.content .input-box1 .input-value select.select1{
							padding-left:16px;
							width:62px;
						}
						#modal .modal-house-detail dd.content .input-box1 .input-value select.select2{
							padding-left:12px;
							width:82px;
						}
				#modal .modal-house-detail dd.content .input-box2{
					margin-top:17px;
				}
					#modal .modal-house-detail dd.content .input-box2 .input-value p{
						float:left;
						margin-right:8px;
						padding-right:6px;
						border-right:1px dotted #bdbdbd;
					}
					#modal .modal-house-detail dd.content .input-box2 .input-value p.last{
						margin-right:0;
						padding-right:0;
						border-right:none;
					}
					#modal .modal-house-detail dd.content .input-box2 .input-value .input-name{
						display:inline-block;
						margin-right:8px;
						font-size:1.4em;
						font-weight:bold;
						color:#009e96;
					}
					#modal .modal-house-detail dd.content .input-box2 .input-value .input-unit{
						display:inline-block;
						height:30px;
						margin-left:5px;
						line-height:30px;
						font-size:1.4em;
						font-weight:bold;
						vertical-align:top;
					}
					#modal .modal-house-detail dd.content .input-box2 .input-value input{
						width:47px;
						text-align:right;
					}
				#modal .modal-house-detail dd.content .input-box3{
					
				}
					#modal .modal-house-detail dd.content .input-box3 .boxL{
						float:left;
						margin-top:15px;
						padding-bottom:11px;
						width:384px;
						border-bottom:1px solid #cccccc;
					}
					#modal .modal-house-detail dd.content .input-box3 .boxR{
						float:right;
						margin-top:15px;
						padding-bottom:11px;
						width:384px;
						border-bottom:1px solid #cccccc;
					}
					#modal .modal-house-detail dd.content .input-box3 .input-value .input-name{
						display:inline-block;
						margin-right:8px;
						font-size:1.4em;
						font-weight:bold;
						color:#009e96;
					}
					#modal .modal-house-detail dd.content .input-box3 .input-value .input-unit{
						display:inline-block;
						height:30px;
						margin-left:5px;
						line-height:30px;
						font-size:1.4em;
						font-weight:bold;
						vertical-align:top;
					}
					#modal .modal-house-detail dd.content .input-box3 .input-value .input-unit2{
						display:inline-block;
						margin-left:5px;
						font-size:1.4em;
						font-weight:bold;
						vertical-align:top;
					}
					#modal .modal-house-detail dd.content .input-box3 .input-value input{
						padding:0 8px;
						width:47px;
						text-align:right;
					}
					#modal .modal-house-detail dd.content .input-box3 .input-value img{
						vertical-align:middle;
					}
					#modal .modal-house-detail dd.content .input-box3 .input-value a{
						margin-left:8px;
						vertical-align:middle;
					}
		#modal .modal-roof-type{
			width:854px;
		}
			#modal .modal-roof-type ul{
				padding:24px 0 23px 44px;
			}
			#modal .modal-roof-type li{
				float:left;
				padding-right:21px;
			}
				#modal .modal-roof-type li.last{
					padding-right:0;
				}
			#modal .modal-roof-type li a{
				display:block;
				padding-top:28px;
				width:170px;
				height:164px;
				color:#333;
				text-decoration:none;
				border:3px solid #fff;
				border-radius:28px;
			}
				#modal .modal-roof-type li a.on{
					border-color:#009e96;
				}
			#modal .modal-roof-type li a .img{
				text-align:center;
			}
			#modal .modal-roof-type li a .text{
				margin-top:18px;
				font-size:1.6em;
				font-weight:bold;
				text-align:center;
			}
		#modal .modal-loan{
			width:854px;
		}
			#modal .modal-loan dd.content{
				padding:32px 32px 15px 32px;
			}
				#modal .modal-loan dd.content .box{
					margin-bottom:18px;
				}
					#modal .modal-loan dd.content .box.box1{
						margin-bottom:0px;
					}
				#modal .modal-loan dd.content .boxtext{
					margin:5px 0 15px;
					font-size:1.3em;
				}
				#modal .modal-loan dd.content .boxL{
					float:left;
					padding-right:32px;
					width:241px;
				}
				#modal .modal-loan dd.content .boxC{
					float:left;
					width:241px;
				}
				#modal .modal-loan dd.content .boxR{
					float:right;
					width:246px;
				}
				#modal .modal-loan dd.content .name{
					font-size:1.6em;
					font-weight:bold;
					color:#009e96;
				}
					#modal .modal-loan dd.content span.name{
						display:inline-block;
						width:65px;
						font-size:1.5em;
						line-height:42px;
						text-align:right;
					}
				#modal .modal-loan dd.content .input{
					margin-top:5px;
				}
					#modal .modal-loan dd.content .input span{
						font-size:1.8em;
						font-weight:bold;
						line-height:42px;
					}
					#modal .modal-loan dd.content span.input{
						margin-top:0;
						display:inline-block;
						width:172px;
						text-align:right;
					}
				#modal .modal-loan dd.content input{
					padding:0 8px;
					width:163px;
					height:40px;
					line-height:40px;
					background:#fff;
					background:-moz-linear-gradient(top, #ddd, #fff 10%, #fff);
					background:-webkit-gradient(linear, left top, left bottom, from(#ddd), color-stop( 0.1, #fff ), to(#fff));
					border:1px solid #ccc;
					border-radius:3px;
				}
					#modal .modal-loan dd.content input.sizeS{
						width:148px;
					}
						#modal .modal-loan dd.content input.sizeS-2{
							width:100px;
						}
					#modal .modal-loan dd.content input.sizeL{
						width:193px;
					}
					#modal .modal-loan dd.content input.sizeLL{
						width:241px;
					}
						#modal .modal-loan dd.content input.sizeLL-2{
							width:175px;
						}
				#modal .modal-loan dd.content select{
					padding:0 8px;
					width:181px;
					height:42px;
					line-height:42px;
					background:#fff;
					background:-moz-linear-gradient(top, #ddd, #fff 10%, #fff);
					background:-webkit-gradient(linear, left top, left bottom, from(#ddd), color-stop( 0.1, #fff ), to(#fff));
					border:1px solid #ccc;
					border-radius:3px;
				}
					#modal .modal-loan dd.content select.sizeL{
						width:100%;
					}
				#modal .modal-loan dd.content .unit{
					display:inline-block;
					width:48px;
					text-align:right;
				}
					#modal .modal-loan dd.content .unitS{
						width:28px;
					}
				#modal .modal-loan dd.content .boxLink{
					float:left;
					margin-top:15px;
					width:100%;
					text-align:right;
				}
					#modal .modal-loan dd.content .boxLink span{
						display:inline-block;
						padding-left:17px;
						line-height:16px;
						background:url("../img/common/icon_link_arrow.png") no-repeat left center;
					}
					#modal .modal-loan dd.content .boxLink a{
						font-size:1.4em;
						color:#ff9900;
					}
				#modal .modal-loan dd.content .subtitle{
					margin:12px 0;
					line-height:29px;
				}
					#modal .modal-loan dd.content .subtitle .maintext{
						font-size:2.1em;
						font-weight:bold;
						color:#009e96;
					}
					#modal .modal-loan dd.content .subtitle a{
						display:inline-block;
						margin-left:22px;
						padding:0 7px;
						font-size:1.4em;
						font-weight:bold;
						text-decoration:none;
						color:#fff;
						background:#009e96;
						border-radius:4px;
						vertical-align:top;
					}
					#modal .modal-loan dd.content .subtitle .subtext{
						margin-left:10px;
						font-size:1.4em;
						font-weight:bold;
					}
						#modal .modal-loan dd.content .subtitle .subtext span{
							font-weight:normal;
						}
				#modal .modal-loan dd.content .text{
					margin-top:25px;
					margin-bottom:12px;
					font-size:1.6em;
					font-weight:bold;
					color:#009e96;
				}
				#modal .modal-loan dd.content .subbox{
					margin-bottom:10px;
				}
			#modal .modal-loan dd.footer{
				padding:15px 0 18px;
				text-align:center;
			}
				#modal .modal-loan dd.footer .btn1{
					display:inline-block;
					margin-right:12px;
					width:112px;
					font-size:1.8em;
					font-weight:bold;
					color:#fff;
					text-align:center;
					text-decoration:none;
					line-height:49px;
					background:#676767;
					border:2px solid #fff;
					border-radius:3px;
				}
				#modal .modal-loan dd.footer .btn2{
					display:inline-block;
					width:252px;
					font-size:1.8em;
					font-weight:bold;
					color:#fff;
					text-align:center;
					text-decoration:none;
					line-height:49px;
					background:#ff9900;
					border:2px solid #fff;
					border-radius:3px;
				}
		#modal .modal-roof-detail{
			width:854px;
		}
			#modal .modal-roof-detail dd.content{
				padding:32px 32px 15px 32px;
				height:400px;
			}
				#modal .modal-roof-detail dd.content .text{
					font-size:1.6em;
					font-weight:bold;
				}
				#modal .modal-roof-detail dd.content table{
					margin-top:10px;
					width:100%;
				}
				#modal .modal-roof-detail dd.content table th{
					font-size:1.4em;
					text-align:center;
					line-height:24px;
					background:#f1f1f1;
				}
				#modal .modal-roof-detail dd.content table td{
					padding:7px 0;
					font-size:1.6em;
					font-weight:bold;
					line-height:32px;
					border-bottom:1px solid #e2e2e2;
					vertical-align:middle;
				}
					#modal .modal-roof-detail dd.content table .col1{
						width:120px;
					}
					#modal .modal-roof-detail dd.content table .col2{
						width:312px;
					}
					#modal .modal-roof-detail dd.content table .col3{
						width:143px;
					}
					#modal .modal-roof-detail dd.content table .col4{
						width:143px;
					}
					#modal .modal-roof-detail dd.content table .name{
						display:inline-block;
						width:80px;
						line-height:40px;
						color:#fff;
						text-align:center;
						background:#009e96;
						border-radius:3px;
					}
					#modal .modal-roof-detail dd.content table .unit{
						margin-left:5px;
						line-height:40px;
					}
					#modal .modal-roof-detail dd.content table input{
						padding:0 8px;
						width:82px;
						height:38px;
						line-height:38px;
						text-align:right;
						background:#fff;
						background:-moz-linear-gradient(top, #ddd, #fff 10%, #fff);
						background:-webkit-gradient(linear, left top, left bottom, from(#ddd), color-stop( 0.1, #fff ), to(#fff));
						border:1px solid #ccc;
						border-radius:3px;
						vertical-align:middle;
					}
					#modal .modal-roof-detail dd.content table select{
						padding:0 8px;
						width:60px;
						height:40px;
						font-size:0.8em;
						line-height:40px;
						background:#fff;
						background:-moz-linear-gradient(top, #ddd, #fff 10%, #fff);
						background:-webkit-gradient(linear, left top, left bottom, from(#ddd), color-stop( 0.1, #fff ), to(#fff));
						border:1px solid #ccc;
						border-radius:3px;
						vertical-align:middle;
					}
					#modal .modal-roof-detail dd.content table a{
						margin-left:10px;
					}
					#modal .modal-roof-detail dd.content table img{
						vertical-align:middle;
					}
			#modal .modal-roof-detail dd.footer{
				padding:15px 0 18px;
				text-align:center;
			}
				#modal .modal-roof-detail dd.footer a{
					display:inline-block;
					width:252px;
					font-size:1.8em;
					font-weight:bold;
					color:#fff;
					text-align:center;
					text-decoration:none;
					line-height:49px;
					background:#ff9900;
					border:2px solid #fff;
					border-radius:3px;
				}
		#modal .modal-setting{
			width:854px;
		}
			#modal .modal-setting dd.content{
				padding:15px 29px 25px 25px;
			}
				#modal .modal-setting dd.content .text{
					padding-left:14px;
					line-height:44px;
					background:#f1f1f1;
				}
					#modal .modal-setting dd.content .text b{
						margin-right:42px;
						font-size:1.6em;
						font-weight:bold;
					}
					#modal .modal-setting dd.content .text span{
						font-size:1.4em;
					}
				#modal .modal-setting dd.content .subtext{
					margin-bottom:10px;
					padding:10px 27px 0;
					font-size:1.5em;
					line-height:20px;
				}
					#modal .modal-setting dd.content .subtext .boxL{
						float:left;
						width:420px;
					}
					#modal .modal-setting dd.content .subtext .boxR{
						float:right;
						width:300px;
					}
				#modal .modal-setting dd.content .table1{
					margin:5px 0 0;
					width:100%;
				}
					#modal .modal-setting dd.content .table1 th{
						padding:15px 0 0 27px;
						font-size:1.8em;
						font-weight:bold;
						color:#148aab;
						text-align:left;
						line-height:36px;
						vertical-align:top;
					}
					#modal .modal-setting dd.content .table1 td{
						padding:15px 0 0;
						text-align:left;
						line-height:36px;
						vertical-align:top;
					}
					#modal .modal-setting dd.content .table1 input{
						padding:0 8px;
						height:34px;
						line-height:34px;
						background:#fff;
						background:-moz-linear-gradient(top, #ddd, #fff 10%, #fff);
						background:-webkit-gradient(linear, left top, left bottom, from(#ddd), color-stop( 0.1, #fff ), to(#fff));
						border:1px solid #ccc;
						border-radius:3px;
					}
					#modal .modal-setting dd.content .table1 .col2{
						width:196px;
					}
						#modal .modal-setting dd.content .table1 .col2 input{
							padding:0 8px;
							width:47px;
						}
					#modal .modal-setting dd.content .table1 .col3{
						width:287px;
						line-height:24px;
					}
						#modal .modal-setting dd.content .table1 .col3 input{
							padding:0 8px;
							width:47px;
						}
					#modal .modal-setting dd.content .table1 .name{
						margin-right:15px;
						font-size:1.6em;
						font-weight:bold;
					}
					#modal .modal-setting dd.content .table1 .unit{
						margin-left:12px;
						font-size:1.8em;
						font-weight:bold;
					}
					#modal .modal-setting dd.content .table1 .cost_text{
						font-size:1.2em;
						font-weight:bold;
						line-height:24px;
					}
				#modal .modal-setting dd.content .table2{
					margin-top:13px;
					width:100%;
				}
					#modal .modal-setting dd.content .table2 th{
						background:#f1f1f1;
						border-top:1px solid #ccc;
						border-bottom:1px solid #ccc;
						vertical-align:middle;
					}
					#modal .modal-setting dd.content .table2 td{
						border-top:1px solid #ccc;
						border-bottom:1px solid #ccc;
						vertical-align:top;
					}
					#modal .modal-setting dd.content .table2 .col1{
						padding-left:16px;
						width:35px;
					}
						#modal .modal-setting dd.content .table2 .col1 span{
							display:inline-block;
							width:35px;
							font-size:1.2em;
							text-align:center;
							color:#fff;
							line-height:23px;
							background:#db1414;
							border-radius:3px;
						}
					#modal .modal-setting dd.content .table2 .col2{
						padding:19px 25px 19px 0;
						font-size:1.6em;
						font-weight:bold;
						text-align:right;
						line-height:25px;
					}
					#modal .modal-setting dd.content .table2 .col3{
						padding:12px 0 12px 24px;
						width:443px;
						text-align:left;
					}
						#modal .modal-setting dd.content .table2 .col3 input{
							padding:0 8px;
							width:433px;
							height:34px;
							line-height:34px;
							background:#fff;
							background:-moz-linear-gradient(top, #ddd, #fff 10%, #fff);
							background:-webkit-gradient(linear, left top, left bottom, from(#ddd), color-stop( 0.1, #fff ), to(#fff));
							border:1px solid #ccc;
							border-radius:3px;
						}
							#modal .modal-setting dd.content .table2 .col3.post input{
								padding:0 8px;
								width:167px;
							}
							#modal .modal-setting dd.content .table2 .col3.post span{
								display:inline-block;
								width:65px;
								font-size:1.6em;
								font-weight:bold;
								text-align:center;
								line-height:36px;
							}
							#modal .modal-setting dd.content .table2 .col3.tel input{
								padding:0 8px;
								width:100px;
							}
							#modal .modal-setting dd.content .table2 .col3.tel span{
								display:inline-block;
								width:40px;
								font-size:1.6em;
								font-weight:bold;
								text-align:center;
								line-height:36px;
							}
			#modal .modal-setting dd.footer{
				text-align:center;
			}
				#modal .modal-setting dd.footer a{
					display:inline-block;
					width:262px;
					font-size:2.1em;
					color:#fff;
					font-weight:bold;
					text-align:center;
					text-decoration:none;
					line-height:49px;
					background:#ff9900;
					border:2px solid #fff;
					border-radius:4px;
				}


.btn-bg{
	box-shadow:0 1px 1px rgba(0,0,0,.1);
	background:linear-gradient(#fefefe,#f3f3f3);
}
.btn-bg.on{
	box-shadow:1px 1px 1px rgba(0,0,0,0.3) inset;
}
input.off,
select.off{
	background:#eee !important;
	box-shadow:1px 1px 1px rgba(0,0,0,0.3) inset !important;
}
a.unlink{
	cursor:default;
}