@charset "utf-8";
/* CSS Document */

#contact .form-area .cont-wrap { margin-bottom: 120px; }
#contact .form-area h2 { margin-bottom: 24px; }
#contact .form-area .summary { margin-bottom: 40px; }

/*入力欄 *****************************************************************/
#contact .form-list {
	justify-content: space-between; padding: 16px 0; border-top: 2px solid var(--color-be); }
#contact .form-list .item-title { width: 160px; padding-top: 10px; font-weight: bold; }
#contact .form-area .required {
	vertical-align: top; padding-left: 4px; font-size: var(--font-size-sml); color: red; }
#contact .form-list .sub-text {
	width: 96px; padding-top: 14px; font-size: var(--font-size-sml); color: #aaa; }
#contact .form-list .item-input { width: calc(98% - 256px); }
/*input関連*/
select, input, textarea {
	width: 100%; padding: 12px; background: var(--color-be); border: 1px solid #b1a8a3; outline: none; border-radius: var(--border-radius-s); font-family: "Montserrat", "Noto Sans JP", sans-serif; font-size: 1.6rem; }
input:-webkit-autofill {
	box-shadow: 0 0 0px 100px var(--color-be) inset; -webkit-text-fill-color: inherit!important; }
select { max-width: 200px; padding-left: 6px; }
input[type="tel"] { max-width: 200px; }
textarea { height: 160px; }
::placeholder { color: #b1a8a3; }

/*個人情報保護方針のチェックボックス --------------------*/
#contact .form-list.policy .item-title { width: 100%; margin-bottom: 8px; }
#contact .form-list.policy .item-summary { font-size: var(--font-size-03); }
#contact .form-list.policy .item-input { width: 100%; margin-top: 24px; }
input[type="checkbox"] {
	width: 15px; height: 15px; margin-right: 12px; accent-color: var(--color-font-reg); translate: 2px 2px; }

/*ボタン --------------------*/
#contact .form-area .btn-area { gap: 0 8px; margin-top: 48px; }
#contact .form-area .button {
	width: 100%; max-width: 200px; border-radius: var(--border-radius-s); cursor: pointer; }
#contact .form-area .button.arw-link { position: relative; }
#contact .form-area .button.arw-link::after {
	position: absolute; top: 50%; translate: 0 -50%; }

input[type="submit"],
input[type="button"] {
	background: none; border: none; text-align: left; cursor: pointer; }
input[type="submit"] { padding-right: 20px; padding-left: 16px; }

/*送信ボタン*/
#contact .form-area .button.submit-btn { background: var(--color-or); }
#contact .form-area .button.submit-btn::after { right: 10px; }
#contact .form-area .button.back-btn { background: #ddd; }
/*戻るボタン*/
#contact .form-area .button.back-btn input[type="button"] { padding-left: 32px; }
#contact .form-area .button.back-btn::after { left: 10px; scale: -1 1; }

/*エラー・確認・サンクス --------------------*/
#contact.error .error-text { color: red; }
#contact.check .form-list:last-child { border-bottom: 2px solid var(--color-be); }
#contact.check .form-list .item-title { width: 200px; padding-top: 0; }
#contact.check .form-list .item-input { width: calc(98% - 200px); }


@media (max-width: 767px) {
	#contact .form-list { flex-wrap: wrap; }
	#contact .form-list .item-title,
	#contact.check .form-list .item-title { width: 70%; margin-bottom: 2px; padding-top: 0; }
	#contact .form-list .sub-text { width: 30%; padding-top: 3px; text-align: right; }
	#contact .form-list .item-input,
	#contact.check .form-list .item-input { width: 100%; }
	input[type="tel"] { max-width: unset; }
	
}