@charset "utf-8";
/* ===================================================================

 file name  :form.css
 style info :共通のスタイル指定（フォーム）

=================================================================== */

/* form-area 
----------------------------------------------------------------------------*/
div.form-area{
	margin:0 auto;
}

input,
select,
textarea{	outline:none;}
/* --- class styles ----------------------------------------------- */
.textbox,
textarea{
	border:1px solid #e0e0e0;
	padding:4px 5px;
	-webkit-appearance: none; 
	border-radius:0;
	font-size:13px;
	font-family: "ＭＳ Ｐゴシック","MS PGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Arial,Osaka,Sans-Serif;
}
textarea{
	height:80px;
}

.checkbox,
.radio{
	margin-right:5px;
}

select{
	width:142px;
}

textarea{
	line-height:1.5;
}
textarea.type02{
	height:158px;
}

/*paddingをマイナス*/
.ipt-w40{ width:30px;}
.ipt-w120{ width:110px;}
.ipt-w140{ width:130px;}
.ipt-w500{ width:490px;}

.ml5{margin-left:5px;}
.mr5{margin-right:5px;}
.ml10{margin-left:10px;}
.mr10{margin-right:10px;}


.req{
	background:url(../images/common/ico_req.png) no-repeat 50% 50%;
	width:6px;
	height:8px;
	/background-position:50% 0px;
	/height:13px;
	overflow:hidden;
	text-indent:-9999px;
	padding:0 4px;
	display:inline-block;
	/display:inline;
	zoom:1;
}


/* カスタムセレクトボックス ----------------------------------------------- */
#main .customSelect {
	font-size:13px;
	width: 135px;
	padding:2px 0 1px 5px;
	background:url(../images/common/ico_select.png) right 50% no-repeat;
	border:1px solid #e0e0e0;
}
#main .customSelectInner{
	width: 135px !important;
}


/* パーツ内のbtn（住所検索） ------------------------------------------- */
.btn-parent{
	position:relative;
	zoom:1;
	overflow:hidden;
}
.btn-parent input.zip02{
	margin-right:12px;
}
.btn-parent .btn-detail{
	position:absolute;
	top:50%;
	zoom:1;
	margin-top:-0.9em;
}
.btn-parent .btn-detail a{
	background:#525252;
	padding:0.4em 10px;
	display:block;
	color:#FFF;
	line-height:1;
	text-decoration:none;
	height:100%;
}
.btn-parent .btn-detail a:hover{
	background:#063f67;
}



/* msg 
--------------------------------------------------------------------- */
#main .msg{
	margin-bottom:2em;
	background:#FFF2F2;
	border:1px solid #FFC7C8;
	padding:1em 1em 0 1em;
	font-size:109%;
}
#main .msg h3{
	padding: 0;
	margin: 0;
	margin-bottom:1em;
	font-size:125%;
}
#main .msg p{
	margin-bottom:1em;
	color: #FF0000;
}
#main .complete{
	background:#E5F5FF;
	border:1px solid #A7CCFF;
}

/* mainform 
--------------------------------------------------------------------- */


/* send-btns 
--------------------------------------------------------------------- */
#main ul.send-btns{
	width:312px;
	margin:0 auto;
}
#main ul.send-btns li{
	float:left;
}
#main ul.send-btns li.right{
	float:right;
}
#main ul.send-btns li input{
	-webkit-appearance: none;
	width:150px;
	padding:0.5em 0;
	display:block;
	text-align:center;
	color:#FFF;
	border:none;
	cursor:pointer;
	font-size:150%;
	line-height:1.1;
	background: rgb(77,194,190); /* Old browsers */
	background: -moz-linear-gradient(top,  rgb(77,194,190) 0%, rgb(60,173,170) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(77,194,190)), color-stop(100%,rgb(60,173,170))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgb(77,194,190) 0%,rgb(60,173,170) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgb(77,194,190) 0%,rgb(60,173,170) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgb(77,194,190) 0%,rgb(60,173,170) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgb(77,194,190) 0%,rgb(60,173,170) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4dc2be', endColorstr='#3cadaa',GradientType=0 ); /* IE6-9 */
}
#main ul.send-btns li.hover input{
	background: #019792;
}

/* ==========================================================================
   smartPhone
 ========================================================================== */
@media screen and (max-width: 640px){
	
/* --- class styles ----------------------------------------------- */
	input{box-sizing:border-box; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
	.textbox,
	textarea{
		font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo","ＭＳ Ｐゴシック","MS P Gothic",sans-serif;
		padding:3px 5px;
		box-sizing:border-box;
		-moz-box-sizing:border-box;
		-webkit-box-sizing:border-box;
		-webkit-appearance: none;
		 border-radius:0;
		 font-size:10px;
	}
	textarea{
		height:95px;
	}
	textarea.type02{
		height:125px;
	}

	.checkbox,
	.radio{
		margin-right:3px;
		border:1px solid #dadada;
	}

	select{
		width:48.2%;
	}


	.ipt-w40{ width:50px;}
	.ipt-w120{ width:42.8%;}
	.ipt-w140{ width:48.2%;}
	.ipt-w500{ width:100%;}
	
	.ml5,
	.ml10,
	.mr10{margin:0;}
	.mr5{ margin-right:3px;}

	.mb5sp{ margin-bottom:5px;}
	.mr5sp{ margin-left:5px;}

	.right{
		float:right;
	}

	.req{
		background:url(../images/common/ico_req_sp.png) no-repeat 50% 50%;
		background-size:5px 5px;
		width:5px;
	}

	
	
	/* カスタムセレクトボックス ----------------------------------------------- */
	#main .customSelect {
		font-size:10px;
		padding:4px 0 4px 5px;
		width: 48.2%;
		background:url(../images/common/ico_select_sp.png) right 50% no-repeat;
		background-size:20px 42px;
		box-sizing:border-box;
		-moz-box-sizing:border-box;
		-webkit-box-sizing:border-box;
	}
	#main .customSelectInner{
		width: 100% !important;
	}

	/* パーツ内のbtn（住所検索など） ------------------------------------------- */
	.btn-parent input{
		margin-right:0;
	}
	.btn-parent .btn-detail{
		right:0;
		margin-top:-1.2em;
		position:static;
		display:inline-block;
	}
	.btn-parent .btn-detail a{
		padding:0.6em 15px;
	}
	.btn-parent .btn-detail a:hover{
		background:#525252;
	}


	/* msg 
	--------------------------------------------------------------------- */
	#main .msg{
		font-size:84%;
	}


	/* send-btns 
	--------------------------------------------------------------------- */
	#main ul.send-btns{
		width:300px;
	}
	#main ul.send-btns li input{
		width:144px;
		padding:1em 0;
		font-size:117%;
		border-radius:0;
		-webkit-appearance: none;
	}

}