/* =========================================================================
   Contact Form 7 の見た目調整
   CF7 は入力欄を <span class="wpcf7-form-control-wrap"> で包むため、
   そのままでは静的サイトのレイアウト（grid / flex）が崩れる。
   ここで包み要素を透明化し、元のデザインに揃えている。
   ========================================================================= */

/* 包み要素をレイアウトに影響させない */
.cn-form .wpcf7-form-control-wrap {
	display: block;
	width: 100%;
}

/* フォーム全体の並び（静的サイトの <form> のインラインスタイル相当） */
.cn-form .wpcf7-form {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

/* 資料請求ページのフォームはカード状 */
.cn-form--download .wpcf7-form {
	border-radius: 24px;
	box-shadow: 0 2px 8px rgba(16, 21, 15, 0.06);
	padding: 40px;
}

/* CF7 が段落を挿入した場合に余白が二重にならないようにする */
.cn-form .wpcf7-form > p {
	margin: 0;
}

/* --- ラジオ・チェックボックス ------------------------------------------ */
.cn-form .wpcf7-radio,
.cn-form .wpcf7-checkbox,
.cn-form .wpcf7-acceptance {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.cn-form .wpcf7-list-item {
	margin: 0;
}

/* ピル型のラジオボタン（お問い合わせ種別） */
.cn-form .cn-pills .wpcf7-list-item label {
	display: flex;
	align-items: center;
	gap: 8px;
	border: 1px solid #E6EEE8;
	border-radius: 999px;
	padding: 12px 16px;
	font-size: 15px;
	cursor: pointer;
	background: #fff;
}

.cn-form .cn-pills .wpcf7-list-item input:checked + .wpcf7-list-item-label {
	font-weight: 700;
	color: #14713A;
}

/* 個人情報の同意チェック */
.cn-form .cn-agree .wpcf7-list-item label {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	font-size: 15px;
	cursor: pointer;
}

.cn-form .cn-agree input[type="checkbox"] {
	margin-top: 8px;
}

/* --- 送信ボタン --------------------------------------------------------- */
.cn-form input[type="submit"] {
	width: auto;
	height: 64px;
	padding: 0 32px;
	border: none;
	border-radius: 999px;
	font-family: inherit;
	font-weight: 700;
	font-size: 16px;
	color: #fff;
	cursor: pointer;
	align-self: flex-start;
}

.cn-form--contact input[type="submit"] {
	background: #E08700;
}

.cn-form--download input[type="submit"] {
	background: #14713A;
	align-self: stretch;
}

.cn-form input[type="submit"]:hover {
	opacity: 0.9;
}

.cn-form input[type="submit"]:disabled {
	opacity: 0.5;
	cursor: default;
}

/* 送信中のスピナー位置 */
.cn-form .wpcf7-spinner {
	margin: 0 0 0 12px;
	vertical-align: middle;
}

/* --- バリデーション表示 ------------------------------------------------- */
.cn-form .wpcf7-not-valid-tip {
	display: block;
	margin-top: 6px;
	padding-left: 16px;
	font-size: 13px;
	font-weight: 700;
	color: #B3261E;
}

.cn-form .wpcf7-not-valid {
	border-color: #B3261E;
}

.cn-form .wpcf7-response-output {
	margin: 0;
	padding: 16px 24px;
	border-width: 1px;
	border-radius: 20px;
	font-size: 15px;
	line-height: 1.8;
}

.cn-form form.sent .wpcf7-response-output {
	border-color: #14713A;
	background: #F1F8F3;
	color: #14713A;
}

.cn-form form.invalid .wpcf7-response-output,
.cn-form form.unaccepted .wpcf7-response-output,
.cn-form form.failed .wpcf7-response-output {
	border-color: #B3261E;
	background: #FDF2F1;
	color: #B3261E;
}
