@charset "utf-8";

/*
		commonForm
	1. core
	2. confList

———————————————————- */

/* core	*/

input[type="reset"],
input[type="button"],
input[type="submit"],
input[type="text"],
input[type=date],
input[type=file],
input[type=time],
input[type=number],
input[type=email],
select,
textarea {
	padding: 0 .3rem;
	border:1px solid #191816;
	font-size:15px;
	font-weight:bold;
	margin: 0;
	font-family: 'Lucida Grande','Hiragino Kaku Gothic ProN','Meiryo', sans-serif;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background:#FFF;
}

input[type="button"],
input[type="submit"],
input[type="reset"] {
	background: #666;
	border:1px solid #666;
	border-radius:5px;
	font-weight:bold;
	font-family: 'Lucida Grande','Hiragino Kaku Gothic ProN','Meiryo', sans-serif;
	text-align:center;
	margin:.5em auto;
	cursor:pointer;
	-webkit-appearance: none;
	width: 40%;
	line-height:2em;
	font-size:20px;
	color:#FFF;
}

input[type="submit"]:disabled{color:#999;}

select::-ms-expand {display: none;}

select{
	position: relative;
	background:#FFF;
	padding-right:1.2em;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

select.backRed,
textarea.backRed,
input[type="text"].backRed,
input[type="email"].backRed,
input[type="number"].backRed{
	border:1px solid #F00;
	background:#FDC5C6;
}

.arrow{position: relative;}

.arrow:after{
	font-family:'FontAwesome';
	content: '\f0d7';
	position:absolute;
	right:5px;
	top:-.8rem;
	text-align:center;
	line-height:2em;
	color:#355018;
	width:1rem;
	height:1rem;
	padding:.6rem;
	pointer-events: none;
	z-index:3;
}

.arrow:before{
	content: '';
	position:absolute;
	right:1px;
	top:-9px;
	width:3rem;
	height:2.75rem;
	pointer-events: none;
	z-index:2;
}

form{
	width: 100%;
	margin: 0 auto;
	background:#FFF;
	padding: 0;
}

.required:after{
	content: ' ※必須';
	color:#F00;
	font-size: 10px;
}

.any:after{
	content: '';
	color:#999;
	font-size: 10px;
}

.length1{
	width: 100%;
}

.length2{
	width: 70%;
}

.length3{
	width: 48%;
}

.length4{
	width: 35%;
}

.length5{
	width: 4em;
}

.length6{
	width: 5em;
}

.mb>input[type=number],
.mb>input[type=text],
.mb>label{
	margin-bottom: 10px;
}

/* confList */

.confList{
	width: 80%;
	margin:0 auto;
	padding: 5px;
	border-bottom:1px dashed #804000;
}

.confList:nth-child(7){
	border-bottom: none;
}

.confList>dt{
	width: 30%;
}

.confList>dd{
	width: 70%;
}

.thx{
	width: 80%;
	margin:50px auto 0;
	background: #FFF;
	margin-bottom: 200px;
	padding: 20px;
}

.empty{
	width: 80%;
	margin:30px auto 30px;
	padding: 20px;
}

.empty>p{
	font-size: 16px;
	margin-bottom: 1em;
}

@media screen and (max-width: 1000px) {
	form{
		width: 95%;
		margin: 10px auto 0;
	}
	
	input[type="button"],
	input[type="submit"],
	input[type="reset"] {
		width: 45%;
		font-size:16px;
	}
}

/* 縦長の場合 */
@media only screen and (max-width: 1000px) and (orientation : portrait) {
	.length2,
	.formHalf,
	.confList,
	.confList>dt,
	.confList>dd{
		width: 100%;
	}
}
/* 横長の場合 */
@media only screen and (max-width: 1000px) and (orientation : landscape) {
	.formHalf{
		width: 80%;
	}
}