@charset "euc-kr";

/*
   ¾ÆÀÌµð/ºñ¹Ð¹øÈ£ Ã£±â MEXX ½ºÅ²
   ´ë»ó : /russel/member/find_id.asp, find_id_result.asp, find_pw.asp, find_pw_new.asp
*/

#mexx .title-wrap { justify-content: center; padding-top: 70px; }
#mexx .sub-header-title, .mexx-sub-title { font-size: 28px; margin-bottom: 36px; }

.sub-header { padding: 120px 0 40px; background: var(--mexx-color-bg); border: 0; box-shadow: none; text-align: center; }
.sub-header .sub-header-back { display: none; }
.sub-header .title-wrap { text-align: center; }
.sub-header .sub-header-title { margin: 0; color: var(--mexx-color-navy); font-family: inherit; font-size: 32px; font-weight: 700; letter-spacing: -.5px; }

.find-cont { padding-bottom: 0; }
.find-wrap { width: 460px; }

.find-method-tabs { margin: 0 0 28px; }
.find-method-tabs button { flex: 1; height: 54px; background: var(--mexx-color-bluegray5); color: var(--mexx-color-bluegray0); font-size: 14px; font-weight: 300; border-bottom: 0; }
.find-method-tabs button.is-active { background: var(--mexx-color-navy); color: var(--mexx-color-white); font-weight: 500; border-bottom: 0; }

.find-field { margin-top: 16px; }
.find-page .auth-field label { margin-bottom: 10px; color: var(--mexx-color-navy); font-size: 14px; font-weight: 500; }
.find-page .input-basic { padding: 0 16px; border: 1px solid var(--mexx-color-gray5); border-radius: 3px; color: var(--mexx-color-navy); }
.find-page .input-basic::placeholder { color: var(--mexx-color-gray4); }
.find-page .input-basic:focus { border-color: var(--mexx-color-navy); }
.find-page .input-basic.has-error { border-color: var(--mexx-color-orange); }
.find-page .input-basic.is-disabled { border-color: var(--mexx-color-gray6); background: var(--mexx-color-gray6); color: var(--mexx-color-gray4); }
.find-help { margin-top: 10px; color: var(--mexx-color-gray3); font-size: 14px; }
.find-page .auth-error { margin-top: 6px; color: var(--mexx-color-orange); font-size: 12px; letter-spacing: -.24px; }

.find-timer { color: var(--mexx-color-gray4); }
.find-cert-btn { font-weight: 400; font-size: 14px; border-radius: 5px; }
.find-page .btn-gray { border-color: var(--mexx-color-navy); background: var(--mexx-color-white); color: var(--mexx-color-navy) !important; }

.find-page .btn-blue { border-color: var(--mexx-color-navy); background: var(--mexx-color-navy); color: var(--mexx-color-white) !important; }
.find-page .btn-line { border-color: var(--mexx-color-navy); background: var(--mexx-color-bg); color: var(--mexx-color-navy) !important; }
.find-page .btn-blue.is-disabled, .find-page .btn-line.is-disabled, .find-page .btn-gray.is-disabled, .find-page .btn-blue:disabled, .find-page .btn-line:disabled, .find-page .btn-gray:disabled { border-color: var(--mexx-color-gray6); background: var(--mexx-color-gray6); color: var(--mexx-color-gray4) !important; }

.find-submit { height: 58px; border-radius: 58px; font-size: 16px; font-weight: 400; }
.find-submit.btn-blue:not(.is-disabled):not(:disabled) { background: var(--mexx-color-navy); border-color: var(--mexx-color-navy); }

.find-result-icon { display: none; }
.find-result p { color: var(--mexx-color-navy); font-weight: 400; }
.find-id-list { border-color: var(--mexx-color-border); border-radius: 5px; }
.find-id-list li { border-top-color: var(--mexx-color-border); }
.find-id-list .rdo-ui { background: var(--mexx-color-gray5); width: 16px; height: 16px; }
.find-id-list .rdo-ui:after { width: 6px; height: 6px; }
.find-id-list .rdo-row input:checked + .rdo-ui { background: var(--mexx-color-navy); }
.find-id-list .rdo-row input:focus-visible + .rdo-ui { box-shadow: 0 0 0 3px rgba(5, 23, 48, .16); }
.find-id-list .rdo-row input:checked ~ .rdo-txt { color: var(--mexx-color-navy); }

.find-action {border-radius: 5px;height: 58px;border-radius: 58px;}

.find-password-guide { background: var(--mexx-color-bg-gray); border-radius: 12px; }
.find-password-guide strong { color: var(--mexx-color-navy); font-weight: 600; }
.find-input-check.is-active { color: var(--mexx-color-navy); }

@media (max-width: 767px) {
	#mexx .title-wrap { padding-top: 40px; }
	#mexx .sub-header-title, .mexx-sub-title { font-size: 24px; margin-bottom: 32px; }

	.find-cont { padding: 0 20px; }
	.find-form { padding: 0; }
	.find-result { padding: 0; }
	.find-result p { font-size: 12px; }
	.find-actions { padding: 0; }

	.find-method-tabs button { height: 40px; font-size: 12px; }
	.find-page .auth-field label { font-size: 12px; }
	.find-page .input-basic { height: 42px; line-height: 40px; }
	.find-help { font-size: 12px; }
}
