@charset "utf-8";

/* Form */
/* ============================================ */
input,
select,
textarea {
	width: 100%;
	height: 4rem;
	padding: 0.5rem 1rem;
	border-radius: 0.5rem;
	border: 0.1rem solid #CCCCCC;
	background-color: #E8F0FE;
	box-sizing: border-box;
}

input:hover,
select:hover,
button:hover,
textarea:hover {
	cursor: pointer;
}

input:focus,
select:focus,
textarea:focus {
	border: 0.2rem solid #2A5BA2;
}

.select {
	display: inline-block;
	position: relative;
	width: 100%;
	background-color: rgba(255, 255, 255, 0);
}

.select::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	z-index: 0;
	width: 3rem;
	height: 100%;
}

.select::after {
	content: "";
	position: absolute;
	top: 0;
	right: 1rem;
	bottom: 0;
	z-index: 1;
	width: 2rem;
	height: 2rem;
	margin: auto 0;
	background-size: 100% auto;
	background-repeat: no-repeat;
	background-image: url("../../img/www/icon/form-pulldown.png");
}

.select select {
	position: relative;
	z-index: 1;
}

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

.select optgroup {
	font-weight: bold;
}

input[type="radio"],
input[type="checkbox"] {
	display: none;
}

.radio {
	display: inline-block;
	position: relative;
	cursor: pointer;
	width: auto;
	padding-left: 5rem;
	line-height: 4rem;
	box-sizing: border-box;
}

.radio::before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 4rem;
	height: 4rem;
	margin-top: 0;
	border-radius: 50%;
	background-color: #E8F0FE;
	border: 0.1rem solid #CCCCCC;
}

.radio.selected::before {
	background-color: #FFFFFF;
}

.radio::after {
	content: "";
	display: block;
	position: absolute;
	top: 0.5rem;
	left: 0.5rem;
	width: 3rem;
	height: 3rem;
	opacity: 0;
	border-radius: 50%;
	background-color: #2A5BA2;
}

input[type="radio"]:checked + .radio::after {
	opacity: 1;
}

.check {
	display: inline-block;
	position: relative;
	cursor: pointer;
	width: auto;
	padding-left: 5rem;
	line-height: 4rem;
	box-sizing: border-box;
}

.check::before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 4rem;
	height: 4rem;
	margin-top: 0;
	border-radius: 0.5rem;
	border: 0.1rem solid #CCCCCC;
	background-color: #E8F0FE;
}

.check.selected::before {
	background-color: #FFFFFF;
}

.check::after {
	content: "";
	display: block;
	position: absolute;
	top: 0.2rem;
	left: 1.5rem;
	width: 1rem;
	height: 3rem;
	opacity: 0;
	border-right: 0.5rem solid #2A5BA2;
	border-bottom: 0.5rem solid #2A5BA2;
	transform: rotate(45deg);
}

input[type="checkbox"]:checked + .check::after {
	opacity: 1;
}

textarea {
	height: 15rem;
}

button {
	width: 100%;
	padding: 1rem 0;
	color: #FFFFFF;
	font-size: 2rem;
	font-weight: bold;
	text-align: center;
	border-radius: 10rem;
	background: #FF962C;
	border: 0.2rem solid #FF962C;
}

button small {
	display: block;
	line-height: 1.4;
}

:-ms-input-placeholder {
	color: #CCCCCC;
}

::placeholder {
	color: #CCCCCC;
}

.error-message {
	color: #FC1313;
	font-weight: bold;
}

@media all and (min-width: 750px) {

	input,
	select,
	textarea {
		height: 5rem;
		padding: 1rem 1.5rem;
	}

	.radio {
		padding-left: 6rem;
		line-height: 5rem;
	}

	.radio::before {
		width: 5rem;
		height: 5rem;
	}

	.radio::after {
		width: 4rem;
		height: 4rem;
	}

	.check {
		padding-left: 6rem;
		line-height: 5rem;
	}

	.check::before {
		width: 5rem;
		height: 5rem;
	}

	.check::after {
		top: 0;
		width: 2rem;
		height: 4rem;
	}

	textarea {
		height: 30rem;
	}

	button {
		padding: 2rem 0;
		font-size: 2.8rem;
	}

}

/* List */
/* ============================================ */
.inquiry form > ul {
	margin-bottom: 2rem;
}

.inquiry form > ul > li {
	padding: 1rem 0;
	border-top: 0.1rem solid #CCCCCC;
}

.inquiry form > ul > li:nth-last-of-type(1) {
	border-bottom: 0.1rem solid #CCCCCC;
}

.inquiry dl > dt {
	margin-bottom: 0.5rem;
}

.inquiry dl > dt > p {
	margin-top: 0.5rem;
	color: #707070;
	font-size: 1.4rem;
}

.inquiry dl > dt .clearfix > p {
	line-height: 3rem;
}

.inquiry dl > dt .clearfix > p:nth-of-type(1) {
	float: left;
	font-weight: bold;
}

.inquiry dl > dt .clearfix > p:nth-of-type(2) {
	float: left;
	margin-left: 1rem;
	color: #FC1313;
	font-weight: bold;
}

.inquiry dl > dd > div:nth-of-type(n+2) {
	margin-top: 0.5rem;
}

.inquiry dl > dd .width-75-50 {
	width: 75%;
}

.inquiry .list-col1-1 > li {
	margin-bottom: 0.5rem;
}

.inquiry .list-col1-1 > li:nth-last-of-type(1) {
	margin-bottom: 0;
}

.inquiry .list-col1-2 > li {
	margin-bottom: 0.5rem;
}

.inquiry .list-col1-2 > li:nth-last-of-type(1) {
	margin-bottom: 0;
}

.inquiry .list-col2-2 {
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: flex-start;
	align-items: flex-start;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}

.inquiry .list-col2-2 > li {
	width: calc((100% - 1.1rem) / 2);
	margin-right: 1rem;
	margin-bottom: 0.5rem;
}

.inquiry .list-col2-2 li:nth-of-type(2n) {
	margin-right: 0;
}

.inquiry .list-col2-2 > li:nth-last-of-type(1),
.inquiry .list-col2-2 > li:nth-last-of-type(2) {
	margin-bottom: 0;
}

.inquiry .list-o2,
.inquiry .list-o3 {
	display: none;
}

.inquiry .button {
	max-width: 60rem;
	margin: 0 auto;
}

@media all and (min-width: 750px) {

	.inquiry form > ul {
		margin-bottom: 4rem;
	}

	.inquiry form > ul > li {
		padding: 2rem 0;
	}

	.inquiry dl {
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: flex-start;
		justify-content: flex-start;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
	}

	.inquiry dl > dt {
		width: 25rem;
		margin-bottom: 0;
	}

	.inquiry dl > dt > p {
		margin-top: 1rem;
	}

	.inquiry dl > dt .clearfix > p:nth-of-type(2) {
		float: left;
	}

	.inquiry dl > dd {
		width: calc(100% - 25rem);
		padding-left: 4rem;
	}

	.inquiry dl > dd > div:nth-of-type(n+2) {
		margin-top: 1rem;
	}

	.inquiry dl > dd .width-75-50 {
		width: 50%;
	}

	.inquiry .list-col1-1 > li {
		margin-bottom: 1rem;
	}

	.inquiry .list-col1-2 > li {
		width: calc((100% - 2.1rem) / 2);
		margin-right: 2rem;
		margin-bottom: 1rem;
	}

	.inquiry .list-col2-2 > li {
		width: calc((100% - 2.1rem) / 2);
		margin-right: 2rem;
		margin-bottom: 1rem;
	}

}