/* MQLフォーム エラー表示スタイル（/interview, /adviser, /adviserm 専用） */
/* TOKITA-842 */

/* エラー対象の入力要素（input/select/textarea） */
.mql-input-error {
	border: 1px solid #e74c3c !important;
	background-color: #fff6f6 !important;
	border-radius: 4px !important;
}

/* チェックボックス・ラジオのエラー時ラベル枠 */
.mql-choice-error {
	outline: 1px solid #e74c3c;
	outline-offset: 2px;
	border-radius: 4px;
}

/*
 * 行コンテナ末尾に追加されるエラーメッセージ
 * - パターン1（ラベル/入力欄が縦積み）/ パターン2（横並び）どちらでも
 *   常に行コンテナの下に独立行として表示されるよう、幅100%で1行占有させる
 */
.mql-field-error-message {
	display: block;
	width: 100%;
	flex-basis: 100%;
	margin-top: 4px;
	color: #e74c3c;
	font-size: 12px;
	line-height: 1.4;
	text-align: left;
}

/* 同一フィールド内に複数エラーがあった場合の間隔 */
.mql-field-error-message + .mql-field-error-message {
	margin-top: 2px;
}