@charset "utf-8";

/* html5doctor.com Reset Stylesheet v1.6.1 Last Updated: 2010-09-17
----------------------------------------------------------------------- */
html,body,div,object,iframe,
h1,h2,h3,h4,h5,h6,
p,blockquote,pre,
abbr,address,cite,code,
del,dfn,em,img,ins,kbd,q,samp,
small,strong,sub,sup,var,
b,i,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary,
time,mark,audio,video{
	margin:0;
	padding:0;
	font-size:12px;
	font-weight:normal;
	font-style:normal;
	border:0;
	outline:0;
	vertical-align:baseline;
	background:transparent;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
	display:block;
}
blockquote,q{
	quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content:'';
	content:none;
}
a{
	margin:0;
	padding:0;
	vertical-align:baseline;
	background:transparent;
}

/* change colours to suit your needs */
ins{
	background-color:#ff9;
	color:#000;
	text-decoration:none;
}
mark{
	background-color:#ff9;
	color:#000; 
	font-style:italic;
	font-weight:bold;
}
del{
	text-decoration: line-through;
}
abbr[title],
dfn[title]{
	border-bottom:1px dotted;
	cursor:help;
}
/* change border colour to suit your needs */
hr{
	display:block;
	height:1px;
	border:0;
	border-top:1px solid #ccc;
	margin:1em 0;
	padding:0;
}
input, select{vertical-align:middle;}


li,dt,dd{
	list-style-type:none;
}
img,a img{
	vertical-align:bottom;
	-ms-interpolation-mode:bicubic;
}
label,label input{
	cursor:pointer;
}
table{
	border-collapse:collapse;
	border-spacing:0;
}
tr,td{
	text-align:left;
}
a,:focus{
	outline:0;
}
optgroup { font-style:normal; }

optgroup option{
	padding:0 0 0 10px;
}
/* スマートフォン用リセット
----------------------------------------------------------------------- */
html{
	line-height:1.4;
	-webkit-text-size-adjust:none;
}
/* body
----------------------------------------------------------------------- */
body{
	font-family:sans-serif;
	color:#444;
	background:url(../img/body.png) 0 0 repeat;
}

.float_l{ float:left !important;}
.float_r{ float:right !important;}
/* ヘッダー
----------------------------------------------------------------------- */
header{
	height:48px;
	
	border-top:3px solid #00469d;
	border-bottom:1px solid #bbb;
	
	background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,#fff), color-stop(70%,#eee), color-stop(70%,#e4e4e4), color-stop(100%,#eee));
}
#logo{
	padding:9px 0 0 10px;
	float:left;
}
h1{
	padding:12px 0 0 8px;
	font-size:10px;
	float:left;
	width:95px;
}
h1.h1_long{
	padding-top:8px;
	line-height:1.2;
}
/* ヘッダー右側ナビゲーション
----------------------------------------------------------------------- */
nav{
	float:left;
	padding-left:15px;
}
nav ul{
	padding:10px 0;
}
nav li{
	height:32px;
	border-left:1px solid #ccc;
	float:right;
}
nav a{
	width:50px;
	height:27px;
	padding:5px 0 0 27px;
	font-size:10px;
	line-height:1.2;
	display:block;
	text-decoration:none;
	color:#444;
	
	border-left:1px solid #fff;
	
	background-image:url(../img/nav.png);
	background-repeat:no-repeat;
	-webkit-background-size:23px 234px;
}
#nav-back{
	background-position:1px 5px;
}
#nav-friend{
	background-position:1px -38px;
}
#nav-search{
	background-position:1px -81px;
}
#nav-pc{
	width:46px;
	padding:5px 0 0 31px;
	background-position:4px -123px;
}
/* 申し込みフロー
----------------------------------------------------------------------- */
#flow {
	width:100%;
	height:25px;
	border-bottom:1px solid #bbb;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f7f7f7), color-stop(50%,#efefef), color-stop(50%,#e0e0e0), color-stop(100%,#d6d6d6));
}
#flow li {
	width:20%;
	font-size:10px;
	color:#777;
	float:left;
	line-height:1.1;
	text-align:center;
	text-shadow:1px 1px 0 rgba(255,255,255,0.8);
}
#detail #flow li:nth-child(1) ,
#select #flow li:nth-child(2) ,
#option #flow li:nth-child(2) ,
#input #flow li:nth-child(3) ,
#pay #flow li:nth-child(4) ,
#complete #flow li:nth-child(5) {
	color:#fff;
	text-shadow:1px 1px 0 rgba(0,0,0,0.20);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8b771), color-stop(50%,#f6a44b), color-stop(50%,#f4830d), color-stop(100%,#f4830d));
}
#flow span{
	height:18px;
	padding:7px 0 0 0;
	background:url(../img/flow.png) right 0 no-repeat;
	-webkit-background-size:8px 50px;
	display:block;
}
/*#flow li:last-child span{
	padding:7px 0 0 0;
}
#flow li:nth-child(2) span,
#flow li:nth-child(3) span{
	height:23px;
	padding:2px 2px 0 0;
}*/
#select #flow li:nth-child(1) span,
#option #flow li:nth-child(1) span,
#input #flow li:nth-child(2) span,
#pay #flow li:nth-child(3) span,
#complete #flow li:nth-child(4) span{
	background:url(../img/flow.png) right -25px no-repeat;
}
#complete #flow li:nth-child(5) span{
	background:none;
}
#flow li:last-child span {
	background:none;
}



/* contents
----------------------------------------------------------------------- */
h2{
	width:60%;
	padding:4px 0 1px 10px;
	
	color:#fff;
	font-size:14px;
	font-weight:bold;
	border-top:1px solid #00469d;
	
	text-shadow:1px 1px 1px rgba(0,0,0,0.20);
	
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#005bab), color-stop(100%,#2a81cd));
	
	-webkit-border-radius:0;
	-webkit-border-top-right-radius:5px;
	
	-webkit-box-shadow:inset 0 1px 0 #92ce62;
}
#contents{
	overflow:hidden;
	clear:both;
}
.wrap01,
.wrap02,
.wrap03{
	padding:9px;
	overflow:hidden;
}
.wrap01{
	background:#fff;
	border-top:3px solid #00469d;
}
.wrap02{
	background:#fff;
}
.wrap03{}



/* よく使う形のリンク
----------------------------------------------------------------------- */
.link{
	background:#fff;
	clear:both;
}
.link a{
	padding:10px 0 10px 15px;
	overflow:hidden;
	font-size:16px;
	font-weight:bold;
	color:#444;
	text-decoration:none;
	border-top:1px solid #aaa;
	background:url(../img/arrow01.png) right center no-repeat;
	-webkit-background-size:23px 13px;
	display:block;
}



/* フッター手前のボタンが2つ横並びになるやつ
----------------------------------------------------------------------- */
.btn-2column{
	padding:25px 9px 20px 9px;
	overflow:hidden;
	background:#fff;
}
.btn-2column li{
	width:49%;
	margin:0 2% 0 0;
	float:left;
}
.btn-2column .tel{
	width:100%;
	margin:0 0 7px 0;
}
.btn-2column li:last-child{
	margin:0 0 0 0;
	float:right;
}
.btn-2column a{
	padding:8px 0;
	font-size:13px;
	text-align:center;
	border:1px solid #aaa;
	background:#fff;
	-webkit-border-radius:10px;
	
	color:#444;
	font-weight:bold;
	text-decoration:none;
	display:block;
}



/* 電話問い合わせモーダルウインドウ
----------------------------------------------------------------------- */
#facebox {
	width:100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	text-align: left;
}
#facebox .popup2 {
	padding:10px 15px 15px 15px;
	background: #fff;
	margin:0 20px;
	-webkit-border-radius:10px;
	-webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.75);
}
#facebox .loading {
	text-align: center;
}
#facebox_overlay {
	position: fixed;
	top: 0px;
	left: 0px;
	height:100%;
	width:100%;
	display:none !important;
}
.facebox_hide {
	z-index:-100;
}
.facebox_overlayBG {
	background-color: #000;
	z-index: 99;
}
#facebox .title {
	padding:0 0 3px 0;
	font-size:18px;
	text-align:center;
	font-weight:bold;
	border-bottom:1px solid #aaa;
}
#facebox .content {
	font-size:14px;
	padding:7px 0;
}
#facebox .txt span {
	font-weight:bold;
	color:#f00;
}
#facebox .call,
#facebox .close {
	padding:8px 0;
	margin:7px 0 0 0;
	color:#fff;
	font-size:18px;
	text-decoration:none;
	text-align:center;
	font-weight:bold;
	display:block;
	-webkit-border-radius:8px;
	text-shadow:1px 1px 1px rgba(0, 0, 0, 0.20);
}
#facebox .call {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #79be7f), color-stop(50%, #36ac40), color-stop(50%, #009e0e), color-stop(100%, #009a0c));
	border:1px solid #00830a;
}
#facebox .close {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e18185), color-stop(50%, #d7646a), color-stop(50%, #cc2724), color-stop(100%, #bf2321));
	border:1px solid #a31e1c;
}
/* 見積金額＆次へボタン
----------------------------------------------------------------------- */
#bottomnav{
	padding:15px 9px;
	border-top:1px solid #aaa;
}
#estimate{
	padding:9px 0;
	margin:0 0 10px 0;
	text-align:center;
	font-size:14px;
	font-weight:bold;
	border:1px solid #fff;
	-webkit-border-radius:10px;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#fff), color-stop(100%,#eee));
}
#estimate span{
	padding:0 0 0 8px;
	font-size:24px;
	color:#f00;
}
#next a{
	padding:8px 0;
	color:#fff;
	font-size:16px;
	text-decoration:none;
	text-align:center;
	font-weight:bold;
	display:block;
	-webkit-border-radius:8px;
	text-shadow:1px 1px 1px rgba(0, 0, 0, 0.20);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8b771), color-stop(50%,#f6a44b), color-stop(50%,#f4830d), color-stop(100%,#f4830d));
	border:1px solid #ef7400;
}
/* ソーシャルメディアボタン
----------------------------------------------------------------------- */
.btn-sns{
	padding:0 0 20px 9px;
	overflow:hidden;
	background:#fff;
}
.btn-sns li{
	height:20px;
	padding:0 8px 0 0;
	float:left;
}



/* このページの先頭へ
----------------------------------------------------------------------- */
#pagetop{
	padding:0 10px 0 0;
	overflow:hidden;
	background:#fff;
	border-bottom:3px solid #00469d;
}
#pagetop a{
	padding:6px 10px 4px 10px;
	color:#fff;
	text-decoration:none;
	font-size:10px;
	font-weight:bold;
	border-top:1px solid #00469d;
	float:right;
	
	text-shadow:1px 1px 1px rgba(0,0,0,0.20);
	
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#005bab), color-stop(100%,#2a81cd));
	
	-webkit-border-radius:0;
	-webkit-border-top-right-radius:5px;
	-webkit-border-top-left-radius:5px;
	
	-webkit-box-shadow:inset 0 1px 0 #92ce62;
}


/* フッター
----------------------------------------------------------------------- */
#copyright {
    padding: 15px 3px;
    text-align: center;
}
#footernav1{
	padding:10px 10px 0 10px;
	overflow:hidden;
}
#footernav1 li{
	margin:0 1% 0 0;
	width:32.5%;
	float:left;
}
#footernav1 li:last-child{
	margin:0 0 0 0;
	width:33%;
}
#footernav1 a{
	padding:8px 0 8px 30px;
	font-size:10px;
	line-height:1;
	color:#444;
	background:#fff;
	text-decoration:none;
	white-space:nowrap;
	display:block;
	border:1px solid #aaa;
	-webkit-border-radius:3px;
	
	background-image:url(../img/nav.png);
	background-repeat:no-repeat;
	-webkit-background-size:23px 234px;
}
#footernav1 .history{
	background-position:3px -210px;
}
#footernav1 .mailmag{
	background-position:4px -168px;
}
#footernav1 .friend{
	background-position:3px -42px;
}
#footernav2{
	padding:15px 10px 0 10px;
	overflow:hidden;
}
#footernav2 div{
	float:left;
}
#footernav2 div:first-child{
	padding:0 15px 0 0;
}
#footernav2 .title{
	font-size:12px;
	font-weight:bold;
}
#footernav2 .txt{
	font-size:9px;
}
#footernav2 ul{
	overflow:hidden;
}
#footernav2 li{
	float:left;
	font-size:10px;
}
#footernav2 li:first-child{
	padding:0 4px 0 0;
	margin:0 4px 0 0;
	border-right:1px solid #999;
}
#footernav2 a{
	color:#444;
}
#footernav3{
	padding:15px 10px 0 10px;
	overflow:hidden;
}
#footernav3{
	text-align:center;
}
#footernav3 dt,
#footernav3 dd{
	display:inline;
}
#footernav3 span{
	font-weight:bold;
}
#footernav3 span:after{
	padding:0 3px;
	content:'/';
}


/* メンテお知らせ 20120629*/
.notice {
		width:100%; 
		background-color:#EEEEEE; 
		border:1px solid #ccc;
		font-size:12px;
		padding:3px 2px 0 2px;
		margin-bottom:5px;
		font-weight:bold;
}



/* メニュー
----------------------------------------------------------------------- */
.menuBtn{
	position:absolute;
	top:8px;
	right:13px;
}
#spMenuOverlay{
	display: none;
	position: fixed;
	width: 100%;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(0,0,0,0.5);
	z-index: 9998;
}
#spMenu{
	display: block;
	position: fixed;
	width: 85%;
	top: 0;
	right: 0;
	bottom: 0;
	background: #6d594e;
	z-index: 9999;
	opacity: 0;
	padding: 0;
	overflow: hidden;
	-webkit-transform: translate3d(100%, 0, 0);
	-moz-transform: translate3d(100%, 0, 0);
	transform: translate3d(100%, 0, 0);
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	transition: all 0.25s ease-in-out;
}
#spMenu.open{
	opacity: 1;
	-webkit-transform: translate3d(0%, 0, 0);
	-moz-transform: translate3d(0%, 0, 0);
	transform: translate3d(0%, 0, 0);	
}
#container.noScroll{
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	overflow: hidden;
}
#spMenu .inner{
	background-color:#fff;
	height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#spMenu .close{
	text-align:right;
	padding:10px 20px 10px 0;
}
#spMenu nav p{
	font-size:15px;
	text-align:center;
	background-color:#005bab;
	color:#fff;
	padding:5px;
	margin:0;	
}
#spMenu nav{
	margin:0;
	padding:0;
	width:100%;
}
#spMenu nav ul{
	margin-bottom:10px;
}
#spMenu nav li{
	float:none;
	border:none;
	padding-left:15px;
	border-bottom:1px dotted #ccc;
}
#spMenu nav li a{
	display:block;
	background:url(../img/menu_arrow02.png) no-repeat left 10px;
	background-size:8px auto;
	font-size:14px !important;
	margin:0;
	padding:8px 0 5px 15px;
	width:100%;
	height:auto;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
#spMenu nav ul.big li{
	padding-left:10px;
}
#spMenu nav ul.big li a{
	background:url(../img/menu_arrow.png) no-repeat left 9px;
	background-size:12px auto;
	padding-left:18px;
}