@charset "UTF-8";

/* ------------------------------------------------------------	
	2507 MW WP Form → CF7 移行
	form.cssは削除してOKにする
------------------------------------------------------------ */
.contact2507 form {
	font-size: 14px;
}
/* タブ */
/* .contact2507 .contact-type {
	border-bottom: 5px solid #003875;
	margin-bottom: 30px;
}
.contact2507 .contact-type .cta-btn {
	width: 96%;
	column-gap: 5px;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	margin-top: 0;
}
.contact2507 .contact-type .cta-btn li {
	margin-bottom: 0;
	position: relative;
	background-color: #003875;
	text-align: center;
	padding: 8px 0;
	border-radius: 10px 10px 0 0;
	transition: .3s;
}
.contact2507 .contact-type .cta-btn li:has(a) {
	padding: 0;
	background-color: #0057b5;
}
.contact2507 .contact-type .cta-btn li:has(a):hover,
.contact2507 .contact-type .cta-btn li:has(a):focus {
	background-color: #146fbe;
	padding: 8px 0;
}
.contact2507 .contact-type .cta-btn li:has(a):hover img,
.contact2507 .contact-type .cta-btn li:has(a):focus img {
	opacity: 1;
}
.contact2507 .contact-type .cta-btn li a {
	display: block;
}
.contact2507 .cta-btn img {
	width: 80%;
	margin: auto;
}


@media (min-width: 40em) {
	.contact2507 .contact-type {
	border-bottom: 7px solid #003875;
	margin-bottom: 40px;
}
	.contact2507 .contact-type .cta-btn {
	width: 100%;
	column-gap: 10px;
}
	.contact2507 .contact-type .cta-btn li {
	padding: 15px 20px;
}
	.contact2507 .contact-type .cta-btn li:has(a) {
	padding: 10px 20px;
}
	.contact2507 .contact-type .cta-btn li:has(a):hover,
	.contact2507 .contact-type .cta-btn li:has(a):focus {
	padding: 15px 20px;
}
	.contact2507 .cta-btn img {
	width: 100%;
}
} */

/* 表スタイル上書き */
.contact2507 #formBox .tbl01 {
	margin: 20px 0;
	width: 100%;
}
.contact2507 #formBox .tbl01 th {
    position: relative;
	padding: .8em;
}
.contact2507 #formBox th.hissu:after {
    content: '必須';
    color: #fff;
	background-color: #46a2d7;
	border-radius: 3px;
	font-size: 11px;
	line-height: 1;
	padding: .5em .75em;
	position: relative;
	top: 8px;
	display: block;
	width: fit-content;
	margin-bottom: 1.2em;
	position: absolute;
	right: .8em;
	top: 10px;
	padding: .5em;
}
.contact2507 #formBox input,
.contact2507 #formBox select,
.contact2507 #formBox textarea {
	/* padding:5px 10px;
	margin:3px 0;
	font-size:1.4rem; */
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
	/* -webkit-transition: all .3s;
	transition: all .3s; */
}
.contact2507 #formBox input,
.contact2507 #formBox textarea {
	padding: .75em;
	font-size: 1.5rem;
	width: 100%;
}
.contact2507 #formBox input::placeholder,
.contact2507 #formBox textarea::placeholder {
	opacity: 0.5;
}
.contact2507 #formBox .wpcf7-list-item label {
	display: flex;
	align-items: center;
	column-gap: .5em;
}
.contact2507 #formBox .wpcf7-form-control-wrap {
	display: block;
}
.contact2507 #formBox .mailcheck {
	margin-top: 5px;
}
/* 注釈 */
.contact2507 #formBox .att { 
	font-size: 1.2rem;
	padding-top: .75em;
	color:#999;
}
/* エラーメッセージ */
.contact2507 #formBox .wpcf7-not-valid-tip {
	font-size: 1.4rem;
	padding-top: .5em;
	color:#C00;
	font-weight: bold;
}

/* 入力箇所の長さ */
.contact2507 #formBox .name,
.contact2507 #formBox .kana,
.contact2507 #formBox .tel {
	width: 60%;
	max-width: 300px;
}
.contact2507 #formBox .zip {
	width: 30%;
	max-width: 150px;
}
/* ラジオ・チェックボックスカスタマイズ */
.contact2507 #formBox .wpcf7-list-item {
	margin: 0;
	display: block;
}
.contact2507 #formBox .wpcf7-list-item:not(.last) {
	margin-bottom: 1em!important;
}
.contact2507 #formBox input[type="checkbox"],
.contact2507 #formBox input[type="radio"] {
	display: none;
}
.contact2507 #formBox .wpcf7-list-item-label {
	display: inline-block;
	position: relative;
	padding-left: 30px;
	margin-right: 15px;
	cursor: pointer;
}
.contact2507 #formBox .wpcf7-list-item-label::before {
	content: "";
	position: absolute;
	left: 0;
	top: -3px;
	width: 20px;
	height: 20px;
	border: 1px solid #999;
	background: #fff;
	border-radius: 4px;
	transition: 0.2s;
}
.contact2507 #formBox .wpcf7-list-item-label::before {
	border-radius: 50%;
}
.contact2507 #formBox input[type="checkbox"] + .wpcf7-list-item-label::before {
	border-radius: 0;
}
.contact2507 #formBox input[type="checkbox"]:checked + .wpcf7-list-item-label::after {
	content: "✔";
	position: absolute;
	left: 4px;
	top: -2px;
	color: #2196F3!important;
}
.contact2507 #formBox input[type="radio"]:checked + .wpcf7-list-item-label::after {
	content: "";
	position: absolute;
	left: 4px;
	top: 1px;
	width: 14px;
	height: 14px;
	background: #2196F3;
	border-radius: 50%;	
}
/* 添付ファイル */
.contact2507 #formBox .upload-file {
	font-size: inherit;
	margin-top: 5px;
}


/* 申し込み日時が過ぎたら押せないように */
.contact2507 #formBox .view_timer.close span {
	color: #ccc;
}
.contact2507 #formBox .view_timer.close .wpcf7-list-item-label::before {
	border-color: #ccc;
}

/* パートナー施工店に質問を表示 */
.contact2507 #formBox .tbl01 .partner-selected {
	margin-top: 1em;
}
.contact2507 #formBox .tbl01 .partner-q {
	border: 2px solid #2a86c6;
}
.contact2507 #formBox .conf-page .tbl01 .partner-q {
	border: none;
}
.contact2507 #formBox .tbl01 .partner-q dt {
	font-weight: bold;
	background-color: #2a86c6;
	color: #fff;
	padding: .75em 1em;
}
.contact2507 #formBox .tbl01 .partner-q dd {
	padding: 1em;
}
.contact2507 #formBox .tbl01 .partner-q dd .q-ttl {
	font-weight: bold;
	font-size: 1.05em;
	margin-bottom: 1em;
}
/* .contact2507 #formBox .tbl01 .partner-q .wpcf7-form-control-wrap {
	margin-left: 1em;
	display: block;
} */
.contact2507 #formBox .partner-selected .partner-q i {
	color: #2a86c6;
}

/* 個人情報同意 */
.contact2507 #formBox .acceptance-box {
    padding: 1.5em;
    margin: 0 auto 20px;
    background: #f5f5f5;
    text-align: center;
}
.contact2507 #formBox .acceptance-box .wpcf7-list-item {
	margin-bottom: 0!important;
}
.contact2507 #formBox .acceptance + .wpcf7-list-item-label {
	font-weight: bold;
	color: #333!important;
	margin: 1em auto 0;
}
/* 個人情報同意（iframe） */
.contact2507 #formBox .privacy-box {
	width: 100%;
	height: 16em;
	overflow-y: scroll;
	border: 1px solid #ccc;
	padding: 1em;
	margin: 2em auto;
	text-align: left;
}
.contact2507 #formBox .privacy-box dt {
	font-weight: bold;
}
.contact2507 #formBox .privacy-box dt span {
	color: #2a86c6;
}
.contact2507 #formBox .privacy-box dd {
	line-height: 1.6;
}
.contact2507 #formBox .privacy-box dd:not(:last-of-type) {
	padding-bottom: 1em;
}
.contact2507 #formBox .privacy-box dd li {
	padding-left: 1em;
	text-indent: -1em;
}
@media only screen and (min-width: 40em) {
	.contact2507 #formBox .privacy-box {
	padding: 2em;
}
}

/* ターンスタイル */
.contact2507 #formBox .wpcf7-turnstile {
	margin: 25px auto 20px;
    text-align: center;
}
.contact2507 #formBox .wpcf7-turnstile input {
	margin-bottom: 0;
	padding-bottom: 0;
}
/* 確認画面なし文 */
.contact2507 #formBox .no-conf {
	background-color: #c00;
	color: #fff;
	font-weight: bold;
	text-align: center;
	padding: .5em 1em;
}
/* 送信ボタン */
.contact2507 #formBox .submit-box {
	margin-top: 20px;
	text-align: center;
}
.contact2507 #formBox .submit-box > p {
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
	gap: 1em;
	margin: auto;
}
/* .contact2507 #formBox .wpcf7-form-control {
	margin: 0;
	width: fit-content;
} */
.contact2507 #formBox input.wpcf7-submit,
.contact2507 #formBox input.previous {
	padding: 1em 2em;
	font-size: inherit;
	font-weight: bold;
	color: #fff;
	background-color: #666;
	border: none;
	border-radius: 0;
	cursor: pointer;
}

.contact2507 #formBox input.previous {
	background-color: #666;
}
.contact2507 #formBox input.wpcf7-submit:hover,
.contact2507 #formBox input.previous:hover {
	opacity: .8;
}
.contact2507 #formBox input.wpcf7-submit:disabled {
	background-color: #666;
	cursor: not-allowed;
}
/* スピナーはボタンの下 */
.contact2507 #formBox .wpcf7-spinner {
	order: 2;
}

/* 確認画面で非表示 */
.contact2507 .conf-page .hidden-conf,
.contact2507 .conf-page .cf-turnstile {
	display: none;
}
/* 確認画面で送信ボタンは青 */
.contact2507 #formBox .conf-page input.wpcf7-submit {
	background-color: #1a66bb!important;
}
/* 送信確認画面 */
.contact2507 #formBox .confirm-lead {
	padding: 0 0 1em;
	font-size: 1.1em;
}
.contact2507 #formBox .submit-box-confirm p {
	flex-direction: row;
	flex-wrap: wrap;
	max-width: 700px;
}
/* 確認画面でスピナーを下に配置 */
.contact2507 #formBox .submit-box-confirm .wpcf7-spinner {
	/* flex-basis: 100%; */
	order: 3;
}

/* 謎の青線エラー */
.wpcf7 form .wpcf7-response-output {
	display: none;
}

@media (min-width: 40em) {
	#formBox .tbl01 th {	
	width: 22%;
}
	#formBox .tbl01 th.hissu::after {	
	position: relative;
	left: 0;
	top: 5px;
}
}

@media (min-width: 40em) {
/* 入力箇所の長さ */
	.contact2507 #formBox .kaisya,
	.contact2507 #formBox .mail,
	.contact2507 #formBox .mailcheck {
	width: 400px;
}
	.contact2507 #formBox .address,
	.contact2507 #formBox textarea {
    width: 100%;
}
/* 個人情報同意 */
	.contact2507 #formBox .acceptance-box {
    padding: 2em 1em;
}
/* 確認画面なし文 */
	.contact2507 #formBox .no-conf {
    padding: 1em 1em;
}
/* 送信ボタン */
	.contact2507 #formBox .submit-box {
    margin: 40px auto 0;
	max-width: 600px;
}
	.contact2507 #formBox .submit-box > p {
	flex-direction: row;
	flex-wrap: wrap;
}
	.contact2507 #formBox .submit-box .wpcf7-form-control {
	width: 100%;
	padding: 1.5em 2em;
	font-size: 1.1em;
}

/* 確認画面 */
	.contact2507 #formBox .conf-page .submit-box .wpcf7-form-control {
	width: calc(50% - 1em / 2);
}
	.contact2507 #formBox .conf-page .wpcf7-previous {
	order: 1;
}
	.contact2507 #formBox .conf-page .wpcf7-submit {
	order: 2;
}	
	.contact2507 #formBox .conf-page .wpcf7-spinner {
	order: 3;
}
}


/* ------------------------------------------------------------	
	送信完了
------------------------------------------------------------ */
.thanks  {
	margin: 4em auto 0;
}
.thanks h3 {
	text-align: center;
	font-size: 22px;
	font-weight: bold;
}
.thanks h3 + p {
	font-size: 14px;
	line-height: 1.7;
	text-align: center;
	margin: 2em auto;
}
.thanks .btn a {
	display: block;
	width: 50%;
	margin: auto;
	background-color: #1a66bb;
	color: #fff;
	font-size: 16px;
	text-align: center;
	text-decoration: none;
	padding: 1em;
}
.thanks .btn a:hover {
	opacity: .8;
}