@charset "utf-8";

/* MEMBER-REGISTER-UI v1.0.0 - 일반·간편가입 공통 시각 규칙 */
.member-register {
	--member-register-primary:#51453e;
	--member-register-primary-dark:#3f3732;
	--member-register-soft:#f8f3f0;
	--member-register-border:#e3d9d2;
	--member-register-text:#3f3732;
	--member-register-muted:#756a63;
	width:100%;
	max-width:1140px;
	padding-top:28px;
	padding-bottom:48px;
	color:var(--member-register-text);
	font-size:16px;
}

.member-register .member-register-hero {
	padding:34px 38px;
	border-radius:18px;
	background:linear-gradient(135deg,var(--member-register-primary-dark),var(--member-register-primary));
	box-shadow:0 14px 34px rgba(63,55,50,.16);
	color:#fff;
}

.member-register .member-register-eyebrow {
	display:block;
	margin-bottom:9px;
	color:#e8ddd5;
	font-size:13px;
	font-weight:800;
	letter-spacing:.12em;
}

.member-register .member-register-hero h2 {
	margin:0;
	color:#fff;
	font-size:30px;
	font-weight:800;
	line-height:1.35;
}

.member-register .member-register-hero p {
	margin:11px 0 0;
	color:#f4eeea;
	font-size:16px;
	line-height:1.65;
}

.member-register .member-register-progress {
	display:grid;
	grid-template-columns:repeat(3,1fr);
	margin:22px 0 28px;
	padding:0;
	list-style:none;
}

.member-register .member-register-progress li {
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	min-height:48px;
	border-top:1px solid var(--member-register-border);
	border-bottom:1px solid var(--member-register-border);
	background:#faf8f6;
	color:#8b7f77;
	font-size:14px;
}

.member-register .member-register-progress li:first-child {
	border-left:1px solid var(--member-register-border);
	border-radius:10px 0 0 10px;
}

.member-register .member-register-progress li:last-child {
	border-right:1px solid var(--member-register-border);
	border-radius:0 10px 10px 0;
}

.member-register .member-register-progress li span {font-weight:800}
.member-register .member-register-progress li.is-done {background:#f3ebe6;color:#6b5c53}
.member-register .member-register-progress li.is-active {background:var(--member-register-primary);color:#fff}
.member-register .member-register-progress li.is-active strong {font-weight:800}
.member-register .member-register-spacer {height:28px}

.member-register .member-register-social-entry {
	margin-bottom:22px;
	padding:20px 24px;
	border:1px solid var(--member-register-border);
	border-radius:14px;
	background:#fff;
	box-shadow:0 7px 20px rgba(81,69,62,.06);
}

.member-register .member-register-card {
	overflow:hidden;
	margin-bottom:22px;
	border:1px solid var(--member-register-border);
	border-radius:16px;
	background:#fff;
	box-shadow:0 9px 25px rgba(81,69,62,.07);
}

.member-register .member-register-section-head {
	display:flex;
	align-items:center;
	gap:14px;
	padding:21px 25px;
	border-bottom:1px solid #e4ebf0;
	background:#faf8f6;
}

.member-register .member-register-section-head>span {
	display:flex;
	align-items:center;
	justify-content:center;
	flex:0 0 42px;
	height:42px;
	border-radius:11px;
	background:#f0e8e3;
	color:var(--member-register-primary);
	font-size:14px;
	font-weight:800;
}

.member-register .member-register-section-head h3 {
	margin:0;
	color:var(--member-register-primary-dark);
	font-size:21px;
	font-weight:800;
	line-height:1.35;
}

.member-register em {color:#bd5555;font-style:normal}

.member-register .member-register-section-head p {
	margin:4px 0 0;
	color:var(--member-register-muted);
	font-size:14px;
	line-height:1.5;
}

.member-register .member-register-section-body {padding:25px}

.member-register .member-register-role-option {
	display:flex;
	align-items:flex-start;
	gap:13px;
	height:100%;
	min-height:118px;
	margin:0;
	padding:21px;
	border:2px solid #dce4ea;
	border-radius:13px;
	background:#fff;
	cursor:pointer;
	transition:border-color .18s ease,background-color .18s ease,box-shadow .18s ease,transform .18s ease;
}

.member-register .member-register-role-option:hover {
	border-color:#9eafbd;
	box-shadow:0 8px 20px rgba(81,69,62,.08);
	transform:translateY(-1px);
}

.member-register .member-register-role-option.is-selected {
	border-color:var(--member-register-primary);
	background:var(--member-register-soft);
	box-shadow:0 9px 22px rgba(81,69,62,.12);
}

.member-register .member-register-role-option input[type="radio"] {
	flex:0 0 auto;
	width:19px;
	height:19px;
	margin-top:2px;
	accent-color:var(--member-register-primary);
}

.member-register .member-register-role-copy strong {
	display:block;
	color:var(--member-register-primary-dark);
	font-size:17px;
	font-weight:800;
	line-height:1.45;
}

.member-register .member-register-role-copy small {
	display:block;
	margin-top:8px;
	color:var(--member-register-muted);
	font-size:14px;
	line-height:1.55;
}

.member-register .form-group {margin-bottom:20px}
.member-register .col-form-label {padding-top:14px;color:#344b5f;font-size:16px;font-weight:700}

.member-register .form-control {
	height:52px;
	padding:12px 15px;
	border:1px solid var(--member-register-border);
	border-radius:10px;
	background:#fff;
	color:var(--member-register-text);
	font-size:16px;
}

.member-register textarea.form-control {height:auto;min-height:150px;line-height:1.65}
.member-register .form-control::placeholder {color:#9caab7;opacity:1}
.member-register .form-control:focus {border-color:var(--member-register-primary);box-shadow:0 0 0 3px rgba(81,69,62,.12)}
.member-register .form-control[readonly] {background:#f3f6f8;color:#64798b}
.member-register .form-text {margin-top:7px;color:var(--member-register-muted)!important;font-size:14px;line-height:1.5}
.member-register .member-register-field-message {margin-top:6px;color:#bd5555;font-size:14px}
.member-register .input-group>.form-control {height:52px}
.member-register .input-group-append .btn {border-radius:0 10px 10px 0}

.member-register .member-register-agreement {
	margin-bottom:10px;
	padding:18px;
	border:1px solid #e0e7ed;
	border-radius:10px;
	background:#faf8f6;
}

.member-register .member-register-agreement-head {
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:16px;
}

.member-register .member-register-agreement-head .custom-control {flex:1 1 auto}

.member-register .member-register-policy-toggle {
	flex:0 0 auto;
	min-height:38px;
	padding:7px 10px;
	color:var(--member-register-primary);
	font-size:14px;
	font-weight:700;
	text-decoration:none;
}

.member-register .member-register-policy-toggle:hover,
.member-register .member-register-policy-toggle:focus {
	color:var(--member-register-primary-dark);
	text-decoration:underline;
	box-shadow:none;
}

.member-register .custom-control {min-height:27px;padding-left:2rem}
.member-register .custom-control-label {cursor:pointer;color:#31475b;font-size:16px;line-height:1.55}
.member-register .custom-control-label::before,
.member-register .custom-control-label::after {top:.12rem;left:-2rem;width:1.3rem;height:1.3rem}
.member-register .custom-control-input:checked~.custom-control-label::before {border-color:var(--member-register-primary);background-color:var(--member-register-primary)}
.member-register .custom-control-input:focus~.custom-control-label::before {box-shadow:0 0 0 3px rgba(81,69,62,.12)}

.member-register .member-register-policy-preview,
.member-register .member-register-policy-panel {
	margin:14px 0 0;
	padding:14px 16px;
	border:1px solid #dfe7ed;
	border-radius:9px;
	background:#fff;
	color:#536779;
	font-size:14px;
	line-height:1.65;
}

.member-register .member-register-policy-panel strong {
	display:block;
	margin-bottom:5px;
	color:var(--member-register-primary-dark);
	font-weight:800;
}

.member-register .member-register-policy-content {white-space:normal;word-break:keep-all;overflow-wrap:anywhere}
.member-register .member-register-policy-content>:last-child {margin-bottom:0}
.member-register .member-register-policy-panel.is-collapsed .member-register-policy-content {max-height:calc(1.65em * 3);overflow:hidden}
.member-register .member-register-policy-panel.is-expanded {border-color:#cbd9e3;box-shadow:0 5px 15px rgba(63,55,50,.06)}
.member-register .member-register-policy-panel.is-expanded .member-register-policy-content {max-height:none!important;overflow:visible!important}

.member-register .member-register-privacy-preview>div {
	display:grid;
	grid-template-columns:90px minmax(0,1fr);
	gap:12px;
	padding:3px 0;
}

.member-register .member-register-privacy-preview dt {margin:0;color:var(--member-register-primary-dark);font-weight:800}
.member-register .member-register-privacy-preview dd {margin:0;min-width:0}

.member-register .member-register-agree-all {
	margin-top:18px;
	padding:18px 20px 18px 52px;
	border:1px solid #d2dee7;
	border-radius:11px;
	background:#f3ebe6;
}

.member-register .member-register-membership-note {
	margin:18px 0 0;
	padding:18px 20px;
	border:1px solid #d7e1e8;
	border-left:4px solid var(--member-register-primary);
	border-radius:11px;
	background:#f8f3f0;
}

.member-register form>.member-register-membership-note {margin:4px 0 22px}
.member-register .member-register-membership-note strong {color:var(--member-register-primary-dark);font-size:16px}
.member-register .member-register-membership-note p {margin:6px 0 0;color:#6b5c53;font-size:14px;line-height:1.6}

.member-register .member-register-cert-actions {display:flex;flex-wrap:wrap;gap:8px}
.member-register .member-register-captcha #captcha {margin:0}
.member-register .member-register-captcha #captcha_key {height:46px;border:1px solid var(--member-register-border);border-radius:8px;font-size:17px}
.member-register .member-register-captcha #captcha_img {border-radius:6px}
.member-register .member-register-captcha #captcha_info {display:block;margin-top:8px;color:var(--member-register-muted);font-size:13px}

.member-register .btn {
	min-height:52px;
	padding:12px 18px;
	border-radius:10px;
	font-size:16px;
	font-weight:700;
}

.member-register .btn-primary {border-color:var(--member-register-primary)!important;background:var(--member-register-primary)!important;color:#fff!important}
.member-register .btn-primary:hover,
.member-register .btn-primary:focus {border-color:var(--member-register-primary-dark)!important;background:var(--member-register-primary-dark)!important;color:#fff!important;box-shadow:0 8px 20px rgba(63,55,50,.18)!important}
.member-register .btn-basic {border:1px solid #cbd6df;background:#fff;color:var(--member-register-primary)}
.member-register .btn-basic:hover,
.member-register .btn-basic:focus {border-color:var(--member-register-primary);background:var(--member-register-soft);color:var(--member-register-primary-dark)}
.member-register .btn-outline-primary {border-color:var(--member-register-primary);color:var(--member-register-primary);background:#fff}
.member-register .btn-outline-primary:hover {background:var(--member-register-primary);color:#fff}
.member-register .member-register-actions {margin-top:2px}
.member-register .member-register-actions .btn {height:56px;font-size:17px}

@media (min-width:992px) and (max-width:1199.98px) {
	.member-register {max-width:960px}
}

@media (min-width:768px) and (max-width:991.98px) {
	.member-register {max-width:720px}
}

@media (min-width:576px) and (max-width:767.98px) {
	.member-register {max-width:540px}
}

@media (max-width:767.98px) {
	.member-register {padding-top:14px;padding-bottom:34px;font-size:16px}
	.member-register .member-register-hero {padding:27px 22px;border-radius:14px}
	.member-register .member-register-hero h2 {font-size:25px}
	.member-register .member-register-hero p {font-size:15px}
	.member-register .member-register-progress {margin:17px 0 22px}
	.member-register .member-register-progress li {gap:4px;font-size:12px}
	.member-register .member-register-progress li span {font-size:11px}
	.member-register .member-register-section-head {padding:18px}
	.member-register .member-register-section-head h3 {font-size:19px}
	.member-register .member-register-section-body {padding:18px}
	.member-register .member-register-role-option {min-height:104px;padding:18px}
	.member-register .col-form-label {padding-top:0;padding-bottom:8px}
	.member-register .member-register-agreement {padding:15px}
	.member-register .member-register-agreement-head {align-items:flex-start;gap:10px}
	.member-register .member-register-policy-toggle {min-height:34px;padding:5px 4px;font-size:13px}
	.member-register .member-register-policy-preview {padding:13px 14px}
	.member-register .member-register-privacy-preview>div {grid-template-columns:78px minmax(0,1fr);gap:9px}
	.member-register .member-register-agree-all {padding:17px 16px 17px 49px}
	.member-register .member-register-social-entry {padding:16px}
	.member-register .member-register-captcha #captcha {display:flex;flex-wrap:wrap;align-items:center;gap:5px}
	.member-register .member-register-captcha #captcha_info {flex:0 0 100%}
}
