@charset "UTF-8";
/*
	Filename: contact
	Version: 1.0.1
*/
/*-----------------------------------------------------
	#contact
------------------------------------------------------*/
#contact {
	position: relative;
	height: auto;
  margin-top: 198px;
}
#contact p {
	margin-bottom: 50px;
	font-size: 20px;
	font-weight: 700;
}
.formArea {
	padding: 80px;
	border: 1px solid #1a1a1a;
}
.formArea table {
	width: 100%;
	margin-bottom: 10px;
}
.formArea th {
	display: block;
	width: 100%;
	margin-bottom: 10px;
	font-size: 16px;
	font-weight: 700;
	text-align: left;
}
.formArea td {
	display: block;
	width: 100%;
	margin-bottom: 30px;
}
.required_red {
	margin-left: 5px;
	font-size: 12px;
	font-weight: 700;
	color: #AD1707;
}
::-webkit-input-placeholder {
	font-size: 20px;
	font-weight: 700;
  color: #C7C7C7;
}
::-moz-placeholder {
  font-size: 20px;
	font-weight: 700;
  color: #C7C7C7;
}
:-ms-input-placeholder {
  font-size: 20px;
	font-weight: 700;
  color: #C7C7C7;
}
.formArea input[type="text"] {
	width: 100%;
	padding: 15px;
	background: #F5F5F5;
	border: none;
	border-radius: 2px;
	-webkit-transition: all .3s;
	transition: all .3s;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 20px;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.formArea textarea {
	width: 100%;
	height: 632px;
	padding: 15px;
	background: #F5F5F5;
	border: none;
	border-radius: 2px;
	-webkit-transition: all .3s;
	transition: all .3s;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 20px;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.formArea input[type="text"]:focus, .formArea textarea:focus {
	border: 1px solid #1a1a1a;
}
.formArea input.error[type="text"], .formArea textarea.error {
	border: 1px solid #AD1707;
}
.selectbtn select {
	width: 100%;
	padding-right: 1em;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	border: none;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
}
.selectbtn select::-ms-expand {
  display: none;
}
.selectbtn.select_arrow {
	position: relative;
	border-radius: 2px;
	background: #F5F5F5;
}
.selectbtn.select_arrow::before {
	position: absolute;
	top: 13px;
	right: 10px;
	width: 36px;
	height: 36px;
	content: '';
	pointer-events: none;
	background: url("../img/common/expand_more.png") no-repeat center center;
	background-size: cover;
}
.selectbtn.select_arrow select {
	padding: 15px;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 20px;
	color: #1a1a1a;
}
.check {
	width: 100%;
	max-width: 476px;
	margin: 0 auto 15px;
	padding: 5px 10px 6px;
	border: 1px solid #1a1a1a;
	border-radius: 2px;
}
.check label {
	cursor: pointer;
}
.check label a {
	border-bottom: 1px solid #1a1a1a;
}
.formArea input[type="checkbox"]  {
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.formArea input[type="checkbox"] {
	cursor: pointer;
	padding-left: 30px;/*label手前にチェックボックス用の余白を開ける*/
	vertical-align: middle;
	position: relative;
}
.formArea input[type="checkbox"]::before,
.formArea input[type="checkbox"]::after {
	content: "";
	display: block; 
	position: absolute;
}
.formArea input[type="checkbox"]::before {
	background-color: #fff;
	border-radius: 2px;
	border: 1px solid #1a1a1a;
	width: 20px;
	height: 20px;
	transform: translateY(-50%);
	top: 50%;
	left: 5px;
}
.formArea input[type="checkbox"]:checked::before {
	background: #1a1a1a;
	border: 1px solid #1a1a1a;
}
.formArea input[type="checkbox"]::after {
	border-bottom: 3px solid #fff;
	border-left: 3px solid #fff;
	opacity: 0;
	height: 6px;
	width: 11px;
	transform: rotate(-45deg);
	top: -5px;
	left: 10px;
}
.formArea input[type="checkbox"]:checked::after {
	opacity: 1;
}
.formArea .link_btn_01{
	width: 100%;
	max-width: 476px;
	margin: 50px auto 0;
	padding: 20px 16px;
	background: #1a1a1a;
	background-color: #d6d6d6;
	color: #fff;
	cursor: pointer;
	transition: .3s;
	border: none;
}
.formArea .link_btn_01:hover {
	background-color:#000;
	color:#FFF;
}
.error {
	color: #AD1707;
}

.formArea .able {
	width: 100%;
	max-width: 476px;
	margin: 50px auto 0;
	padding: 20px 16px;
	background: #1a1a1a;
	border-radius: 2px;
	color: #fff;
	cursor: pointer;
	transition: .3s;
}



@media screen and (max-width: 1040px) {
	#contact p {
		font-size: 18px;
	}
}

@media screen and (max-width: 750px) {
	#contact {
		margin-top: 158px;
	}
	#contact p {
		font-size: 14px;
	}
	.formArea {
		padding: 50px 20px;
	}
	::-webkit-input-placeholder {
		font-size: 16px;
	}
	::-moz-placeholder {
		font-size: 16px;
	}
	:-ms-input-placeholder {
		font-size: 16px;
	}
	.formArea input[type="text"] {
		font-size: 16px;
	}
	.formArea textarea {
		font-size: 16px;
	}
	.selectbtn.select_arrow select {
		font-size: 16px;
	}
	.check {
		padding: 5px 5px 6px;
	}
	.check label {
		font-size: 12px;
	}
	.formArea input[type="checkbox"]::after {
		top: -3px;
		left: 10px;
	}
}