@charset "UTF-8";

/* 全体を囲うもの */
.contactform-box {
	form {
		margin-bottom: 40px;
	}

	.form-navi {
		/* 送信・確認ボタン 大枠 */
		display: flex;
		justify-content: center;
		gap: 0 25px;


		/* 送信・確認ボタン */
		.input-submit {
			display: inline-block;
			font-size: 125%;
			/* 20px */
			font-weight: bold;
			line-height: 1.5;
			text-decoration: none !important;
			color: #ffffff;
			background-color: #66a930;
			clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%);
			border: none;
			padding: 14px 50px;
			position: relative;
			transition: .3s;
			cursor: pointer;

			&:hover {
				opacity: 0.6;
			}
		}
	}
}



#content table.formtable {
	th {
		font-weight: bold;
		padding: 15px 25px;
	}

	td {
		padding-block: 15px;
	}


	.input-text,
	.input-tel,
	.input-email,
	textarea,
	select {
		width: 100%;
		padding: 5px 10px;
		box-sizing: border-box;
	}

	.input-text[name="grade"] {
		width: auto;
	}

	.input-text:focus,
	textarea:focus,
	.input-text[disabled] {
		background-color: #f8f7f7;
	}

	.input-text.name1,
	.input-text.name2,
	.input-text.kana1,
	.input-text.kana2,
	.input-text.ins01,
	.input-text.ins02,
	.input-text.cal,
	.input-text.word,
	.input-text.roomnum,
	.input-text.old,
	.input-text.zipcode1,
	.input-text.zipcode2,
	.input-text.nowjob2 {
		width: auto;
	}


	.input-text[readonly] {
		background-color: #ededed;
	}

	.message:after {
		display: none;
	}


	/* 必須・任意の項目 */
	&:not(.confirm) th:after {
		content: "※";
		display: inline-block;
		vertical-align: middle;
		font-weight: bold;
		line-height: 1.5;
		color: #e60039;
		font-weight: bold;
		margin-left: 5px;
	}
}



.error-top {
	padding: 10px 15px;
	border: 1px solid #E60012;
}

.error {
	color: #E60012;
}

textarea {
	vertical-align: middle;
}


@media print,
all and (min-width: 751px) {

	.message-text {
		margin-bottom: 40px;
	}

	.formError.inline {
		margin: 0 10px 10px;
	}

	.formError.inline .formErrorContent {
		min-width: 80px;
	}


	#content table.formtable {
		margin-bottom: 60px;

		th {
			min-width: 100px;
			width: 300px;
			text-align: left;
		}

		select {
			width: auto;
		}
	}
}



@media only screen and (max-width: 750px) {

	.message-text {
		margin-bottom: 25px;
	}

	.formError.inline {
		margin: 10px;
	}


	.contactform-box .form-navi .input-submit {
		margin-right: 5px;
		padding: 12px 35px 12px 30px;
		font-size: 112.5%;
		background-size: 20px 2px;
	}

	.contactform-box .form-navi .input-submit:last-child {
		margin-right: 0;
	}


	#content table.formtable {
		margin-bottom: 35px;

		.input-text,
		textarea,
		select {
			border: 1px solid #dddce0;
		}


		select {
			width: auto;
		}

		.input-text.name1,
		.input-text.name2,
		.input-text.kana1,
		.input-text.kana2,
		.input-text.ins01,
		.input-text.ins02,
		.input-text.cal,
		.input-text.word,
		.input-text.roomnum,
		.input-text.old,
		.input-text.zipcode1,
		.input-text.zipcode2,
		select {
			/*width: 75%;*/
			max-width: 75%;
			margin-bottom: 10px;
		}

		.input-text.zipcode1,
		.input-text.zipcode2 {
			width: auto;
		}

		.input-text.age {
			width: auto;
		}

		/* 必須・任意の項目 */
		&:not(.confirm) th {
			padding-left: 60px;
			position: relative;
		}



		&.sp-tblock {
			border: none;

			tr {
				th {
					display: block;
					padding: 5px 15px;
					border: none;
				}

				td {
					display: block;
					padding: 20px 15px;
					border: none;
				}


				&:last-child {

					th,
					td {
						border-bottom: none;
					}
				}
			}
		}
	}


}