@charset "UTF-8";

/* form */
#form {
	width: auto;
	background-color: #d6efdb;
	padding: 100px 0 185px;
}
#form h1 {
	width: 590px;
	height: 124px;
	margin: 0 auto 50px;
}

/* #form #form-inner-tel */
#form #form-inner-tel {
	max-width: 1000px;
	background-color: #009966;
	color: #fff;
	border-radius: 10px;
	padding: 50px;
	margin: 0 auto 80px;
}
#form #form-inner-tel h2 {
	font-size: 36px;
	letter-spacing: 0.1em;
	text-align: center;
	margin-bottom: 1em;
}
#form #form-inner-tel .txt {
	font-size: 16px;
	text-align: center;
	letter-spacing: 0.1em;
	margin-bottom: 20px;
}
#form #form-inner-tel div {
	position: relative;
	width: 586px;
	border: 1px solid #fff;
	border-radius: 10px;
	padding: 20px;
	margin: 0 auto;
}
#form #form-inner-tel div:after {
	position: absolute;
	top: 25px;
	left: 50px;
	content: '';
	width: 100px;
	height: 73px;
	background: url(../images/icon_tel.png) no-repeat;
}
#form #form-inner-tel div .tel {
	font-size: 36px;
	letter-spacing: 0.1em;
	margin-left: 164px;
	margin-bottom: 16px;
}
#form #form-inner-tel div .time {
	font-size: 28px;
	letter-spacing: 0.1em;
	margin-left: 164px;
}

/* #form #form-inner-web */
#form #form-inner-web {
	max-width: 1000px;
	background-color: #f39800;
	color: #fff;
	border-radius: 10px;
	padding: 60px 50px;
	margin: 0 auto 80px;
}
#form #form-inner-web h2 {
	font-size: 36px;
	letter-spacing: 0.1em;
	text-align: center;
	margin-bottom: 0.5em;
}
#form #form-inner-web .txt{
	font-size: 16px;
	text-align: center;
	letter-spacing: 0.1em;
	line-height: 1.5;
	margin-bottom: 20px;
}
#form #form-inner-web div {
	max-width: 850px;
	background-color: #fbeebe;
	color: #221715;
	padding: 50px;
	margin: 0 auto;
}

#form .agreement_text {
	width: 100%;
	font-size: 18px;
	text-align: center;
	letter-spacing: 0.1em;
	margin-bottom: 1.2em;
}
#form .agreement {
	font-size: 18px;
	text-align: center;
	letter-spacing: 0.1em;
	margin-bottom: 45px;
}

#form .btn {
	width: auto;
}
#form .btn a {
	display: block;
	position: relative;
	width: 580px;
	font-size: 30px;
	letter-spacing: 0.1em;
	text-align: center;
	background-color: #e5c36d;
	color: #836d41;
	border: 3px solid #f39800;
	border-radius: 10px;
	padding: 25px;
	margin: 0 auto;
	cursor: default;
	-webkit-transition: all 0.5s;
	transition: all 0.5s;
}
#form .btn a::after {
	position: absolute;
	top: 1em;
	right: 6em;
	content: '';
	width: 0.65em;
	height: 0.65em;
	border-top: 2px solid #836d41;
	border-right: 2px solid #836d41;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	-webkit-transition: all 0.5s;
	transition: all 0.5s;
}

/* active */
#form .btn.active a {
	background-color: #f39800;
	color: #000;
	border: 3px solid #f39800;
	cursor: pointer;
}
#form .btn.active a::after {
	border-top: 2px solid #000;
	border-right: 2px solid #000;
}
#form .btn.active a:hover {
	color: #f39800;
	background-color: #fff;
}
#form .btn.active a:hover::after {
	border-top: 2px solid #f39800;
	border-right: 2px solid #f39800;
}

/* back */
#form .btn.back a {
	background-color: #ccc;
	color: #333;
	border: 3px solid #808080;
	cursor: pointer;
}
#form .btn.back a::after {
	right: auto;
	left: 6em;
	border-top: 2px solid #333;
	border-right: 0;
	border-left: 2px solid #333;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
#form .btn.back a:hover {
	background-color: #fff;
}


/* error */
#form .error {
	color: #ff0000;
	margin: 0.5em 0;
}
#form .agreement_text + .error {
	text-align: center;
	margin: 1em 0;
}

/* btnArea */
ul.btnArea li {
	margin-bottom: 30px;
}
ul.btnArea li:last-child {
	margin-bottom: 0;
}


/* inputTable */
.inputTable {
	width: 100%;
	max-width: 660px;
	margin: 0 auto;
}
.inputTable th {
	width: 260px;
	font-size: 18px;
	text-align: left;
	vertical-align: top;
	letter-spacing: 0.1em;
	padding-top: 0.8em;
}
.inputTable tr:last-child th {
	padding-left: 55px;
}
.inputTable td {
	font-size: 16px;
	line-height: 1.5em;
	padding-bottom: 2.5em;
}
.inputTable td li {
	display: inline-block;
	padding-top: 0.5em;
}
.inputTable td input[type="text"] {
	width: 300px;
	border: 2px solid #f39800;
	border-radius: 5px;
	padding: 12px;
}
.inputTable td input[type="radio"] {
	border: 2px solid #f39800;
}

.inputTable td label {
	width: 150px;
}
.inputTable td select {
	width: auto;
	border: 2px solid #f39800;
	border-radius: 5px;
	padding: 10px;
}
.inputTable td span {
	display: inline-block;
	color: #808080;
	font-size: 12px;
	letter-spacing: 0.1em;
	margin-top: 0.75em;

}
.inputTable td.email input[type="text"]:nth-of-type(1) {
	margin-bottom: 1.25em;
}
.inputTable td input[type="number"] {
	width: 260px;
	border: 2px solid #f39800;
	border-radius: 5px;
	padding: 12px;
	margin-right: 10px;
}
.inputTable td textarea {
	width: 300px;
	height: 195px;
	line-height: 1.4em;
	text-align: left;
	border: 2px solid #f39800;
	border-radius: 5px;
	padding: 12px;
}

/* listTable */
.listTable {
	width: 100%;
	max-width: 700px;
	border-collapse: collapse;
	margin: 0 auto;
}
.listTable th {
	width: 260px;
	line-height: 1.5em;
	font-size: 18px;
	text-align: left;
	vertical-align: top;
	letter-spacing: 0.1em;
	border-bottom: 1px solid #f39800;
	padding: 1em 0 0.5em;
}
.listTable td {
	line-height: 1.5em;
	font-size: 18px;
	border-bottom: 1px solid #f39800;
	padding: 1em 0 0.5em;
}



/* 768px以下 */
@media screen and (min-width:1px) and (max-width: 768px) {

	/* form */
	#form {
		width: 100%;
		padding: 15.625vw 0 12.5vw;
	}
	#form h1 {
		width: 93.75vw;
		height: auto;
		margin: 0 auto 6.25vw;
	}
	#form h1 img {
		width: 100%;
	}

	/* #form #form-inner-tel */
	#form #form-inner-tel {
		max-width: 93.75vw;
		padding: 4.6875vw;
		margin: 0 auto 12.5vw;
	}
	#form #form-inner-tel h2 {
		line-height: 1.4em;
		font-size: 5.625vw;
		letter-spacing: 0.1em;
	}
	#form #form-inner-tel .txt {
		line-height: 1.4em;
		font-size: 4.375vw;
	}
	#form #form-inner-tel div {
		width: 84.375vw;
		padding: 4.6875vw;
		margin: 0;
	}
	#form #form-inner-tel div:after {
		top: 5vw;
		left: 4.6875vw;
		width: 15.625vw;
		height: 11.40625vw;
		background: url(../images/icon_tel.png) no-repeat;
		background-size: contain;
	}
	#form #form-inner-tel div .tel {
		font-size: 5vw;
		margin-left: 18.75vw;
		margin-bottom: 3.125vw;
	}
	#form #form-inner-tel div .time {
		font-size: 4.375vw;
		margin-left: 18.75vw;
	}
	/* #form #form-inner-web */
	#form #form-inner-web {
		width: auto;
		max-width: none;
		padding: 4.6875vw 1.5625vw;
		margin: 0 1.5625vw 12.5vw;
	}
	#form #form-inner-web h2 {
		line-height: 1.4em;
		font-size: 5.625vw;
	}
	#form #form-inner-web.confirm h2 {
		font-size: 5.625vw;
	}
	#form #form-inner-web.complete h2 {
		font-size: 5.625vw;
	}

	#form #form-inner-web .txt{
		font-size: 3.75vw;
		text-align: left;
		margin-bottom: 1em;
		padding: 0 1.5625vw;
	}
	#form #form-inner-web div {
		max-width: none;
		padding: 4.6875vw 1.5625vw;
	}
	
	#form .agreement_text {
		line-height: 1.4em;
		width: 93.75vw;
		font-size: 4.375vw;
		margin: 0 auto 1.2em;
	}
	#form .agreement {
		font-size: 5vw;
		margin-bottom: 2em;
	}

	#form .btn a {
		width: 93.75vw;
		font-size: 6.25vw;
		padding: 7.8125vw;
	}
	#form .btn a::after {
		top: 9.375vw;
		right: 1em;
	}

	/* inputTable */
	.inputTable th {
		display: block;
		width: 100%;
		font-size: 4.375vw;
		padding-bottom: 0.8em;
	}
	.inputTable tr:last-child th {
		padding-left: 0;
	}
	.inputTable td {
		display: block;
		width: 100%;
		font-size: 4.375vw;
		line-height: 1.5em;
		padding-bottom: 6.25vw;
	}
	.inputTable td li {
		display: block;
	}
	.inputTable td input[type="text"] {
		width: 100%;
		padding: 3.125vw;
	}
	.inputTable td label {
		width: 100%;
	}
	.inputTable td span {
		font-size: 4.375vw;
	}

	.inputTable td input[type="number"] {
		width: 59.375vw;
		padding: 3.125vw;
		margin-right: 3.125vw;
	}
	.inputTable td textarea {
		width: 100%;
		height: 56.25vw;
	}

	/* listTable */
	.listTable,
	.listTable tr,
	.listTable th,
	.listTable td,
	.listTable tbody {
		display: block;
	}
	.listTable {
		max-width: 75vw;
	}
	.listTable th {
		width: 100%;
		font-size: 4.375vw;
		border-bottom: 1px dashed #f39800;
	}
	.listTable td {
		width: 100%;
		font-size: 4.375vw;
		padding: 0.5em 0 1em;
	}

}