@charset "UTF-8";
/* ============================================================
 * 阪神精工 お問い合わせフォーム（Contact Form 7）
 * 2026-11 見積No.546
 * お問い合わせページ（/contact/・/contact-test/）でのみ読み込み
 * 2026-10-31 修正：入力欄16px（iPhoneの自動拡大防止）、空のエラー枠・余白を非表示
 * ============================================================ */

/* ---------- 必須／任意バッジ（必須は既存の .cot01 を使用） ---------- */
.hansei-badge--optional {
	display: inline-block;
	padding: 0 6px;
	border-radius: 3px;
	background: #6b6b6b; /* 白文字とのコントラスト比 5.3:1 */
	color: #fff;
	font-size: 0.8em;
	line-height: 1.6;
	font-weight: normal;
}

/* ---------- 補足テキスト ---------- */
.hansei-contact .hansei-note,
.hansei-contact .hansei-th-note {
	margin: 0.4em 0 0;
	font-size: 0.85em;
	line-height: 1.6;
	color: #444;
}
.hansei-contact .hansei-th-note {
	display: inline-block;
	font-weight: normal;
}
.hansei-contact [hidden] {
	display: none !important;
}

/* ---------- 希望の連絡方法（ラジオボタン） ---------- */
.hansei-contact .wpcf7-radio .wpcf7-list-item {
	margin: 0 1.5em 0 0;
}
.hansei-contact .wpcf7-radio label {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	min-height: 44px; /* タップしやすい高さ */
	cursor: pointer;
}
.hansei-contact .wpcf7-radio input[type="radio"] {
	width: 1.2em;
	height: 1.2em;
	margin: 0;
}

/* ---------- 添付ファイル ---------- */
/* JS 有効時：ファイル欄は見えなくする（display:none にすると送信されないため、視覚的に隠すだけ） */
.hansei-files.is-enhanced input[type="file"] {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}
/* JS 無効時：4つのファイル欄を縦に並べる */
.hansei-files__inputs .wpcf7-form-control-wrap {
	display: block;
	margin-bottom: 0.5em;
}
.hansei-files.is-enhanced .hansei-files__inputs .wpcf7-form-control-wrap {
	margin-bottom: 0;
}

.hansei-files__add {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0.6em 1.4em;
	border: 2px solid #1a4c8b;
	border-radius: 6px;
	background: #fff;
	color: #1a4c8b;
	font-size: 1em;
	font-weight: bold;
	cursor: pointer;
}
.hansei-files__add:hover {
	background: #eef3fa;
}
.hansei-files__add:focus-visible,
.hansei-files__remove:focus-visible {
	outline: 3px solid #f0a000;
	outline-offset: 2px;
}
.hansei-files__add:disabled {
	border-color: #999;
	color: #595959;
	background: #f2f2f2;
	cursor: not-allowed;
}

.hansei-files__count {
	margin: 0.6em 0 0;
	font-size: 0.9em;
	color: #333;
}
.hansei-files__count:empty,
.hansei-files__msg:empty {
	display: none;
}

.hansei-files__list {
	margin: 0.6em 0 0 !important;
	padding: 0 !important;
	list-style: none !important;
}
.hansei-files__item {
	display: flex;
	align-items: center;
	gap: 0.8em;
	margin: 0 0 0.5em !important;
	padding: 0.5em 0.6em;
	border: 1px solid #ccc;
	border-radius: 6px;
	background: #fafafa;
	list-style: none !important;
}
.hansei-files__item::before {
	content: none !important; /* テーマのリスト装飾を打ち消す */
}
.hansei-files__thumb,
.hansei-files__icon {
	flex: 0 0 56px;
	width: 56px;
	height: 56px;
	border-radius: 4px;
}
.hansei-files__thumb {
	object-fit: cover;
	background: #ddd;
}
.hansei-files__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #1a4c8b;
	color: #fff;
	font-size: 0.75em;
	font-weight: bold;
	word-break: break-all;
}
.hansei-files__info {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
}
.hansei-files__name {
	overflow-wrap: anywhere;
	line-height: 1.4;
}
.hansei-files__size {
	font-size: 0.85em;
	color: #555;
}
.hansei-files__remove {
	flex: 0 0 auto;
	min-width: 64px;
	min-height: 44px;
	padding: 0 0.8em;
	border: 1px solid #b00020;
	border-radius: 4px;
	background: #fff;
	color: #b00020;
	font-size: 0.9em;
	cursor: pointer;
}
.hansei-files__msg {
	margin: 0.6em 0 0;
	padding: 0.5em 0.8em;
	border-left: 4px solid #b00020;
	background: #fdecee;
	color: #8a0018;
	font-size: 0.9em;
}

@media (max-width: 600px) {
	.hansei-files__add {
		width: 100%;
	}
}

/* ============================================================
 * 2026-10-31 追加
 * ============================================================ */

/* ---------- 入力文字を16pxに（iPhoneは16px未満だと入力時に画面が拡大されるため） ---------- */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 input[type="number"],
.wpcf7 select,
.wpcf7 textarea {
	font-size: 16px !important;
	line-height: 1.5;
}
/* 入力例（プレースホルダー）は少し小さく、薄すぎない色に */
.wpcf7 input::placeholder,
.wpcf7 textarea::placeholder {
	font-size: 14px;
	color: #767676; /* 白背景とのコントラスト比 4.5:1 */
	opacity: 1;
}

/* ---------- 空のエラー表示を出さない ---------- */
.hansei-files__msg[hidden],
.wpcf7-not-valid-tip:empty,
.wpcf7-response-output:empty {
	display: none !important;
}

/* ---------- 添付ボタン上の空白（ファイル欄の改行）を詰める ---------- */
.hansei-files.is-enhanced .hansei-files__inputs br {
	display: none;
}
.hansei-files.is-enhanced .hansei-files__inputs,
.hansei-files.is-enhanced .hansei-files__inputs p {
	margin: 0 !important;
	padding: 0 !important;
}
.hansei-files.is-enhanced .hansei-files__inputs .wpcf7-form-control-wrap {
	display: inline;
}

/* ============================================================
 * 2026-11-02 追加：個人情報の同意チェックを大きく
 * （「私はロボットではありません」と同程度の大きさ・押しやすさに）
 * ============================================================ */
.wpcf7-acceptance .wpcf7-list-item {
	margin: 0;
}
.wpcf7-acceptance label {
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	min-height: 48px; /* 指で押しやすい高さ */
	cursor: pointer;
}
.wpcf7-acceptance input[type="checkbox"] {
	-webkit-appearance: none;
	appearance: none;
	flex: 0 0 28px;
	width: 28px;
	height: 28px;
	margin: 0;
	border: 2px solid #555;
	border-radius: 4px;
	background: #fff center / 20px 20px no-repeat;
	cursor: pointer;
}
/* チェック時：サイトの緑＋白いチェックマーク */
.wpcf7-acceptance input[type="checkbox"]:checked {
	border-color: #019900;
	background-color: #019900;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4 10.5l4 4 8-9' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.wpcf7-acceptance input[type="checkbox"]:focus-visible {
	outline: 3px solid #f0a000;
	outline-offset: 2px;
}