@charset "utf-8";
/* ==========================================================================
   먹튀헌터 portal 테마 - 회원·검색·새글·접속자·FAQ·1:1문의 스킨 공용 (skin 안 각 comu 폴더)
   모든 규칙은 .mz 안에서만 적용 (기본 그누보드 스킨과 섞이지 않게)
   ========================================================================== */
.mz {--mz-g: var(--pt-green, #03c75a); --mz-gd: var(--pt-green-d, #02a94b); --mz-gbg: var(--cm-accent-bg, #e8f9ef); --mz-r: 8px; color: var(--cm-ink-2); font-size: 14px; line-height: 1.6; word-break: keep-all}
.mz *, .mz *:before, .mz *:after {box-sizing: border-box}
.mz a {color: inherit}
:where(.mz) h1, :where(.mz) h2, :where(.mz) h3, :where(.mz) h4 {margin: 0; color: var(--cm-ink); letter-spacing: -0.02em}
:where(.mz) p {margin: 0}
:where(.mz) ul, :where(.mz) ol {margin: 0; padding: 0; list-style: none}
.mz .sound_only {position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0)}

/* ---------- 상자·제목 ---------- */
.mz-card {background: #fff; border: 1px solid var(--cm-line); border-radius: var(--mz-r); box-shadow: 0 1px 2px rgba(0, 0, 0, .03)}
.mz-card + .mz-card {margin-top: 14px}
.mz-card-bd {padding: 22px 24px}
.mz-card-hd {display: flex; align-items: center; gap: 10px; padding: 16px 24px; border-bottom: 1px solid var(--cm-line-2)}
.mz-card-hd h2 {font-size: 16px; font-weight: 800}
.mz-card-hd .fa {display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 8px; background: var(--mz-gbg); color: var(--mz-g); font-size: 14px}
.mz-card-hd small {margin-left: auto; color: var(--cm-faint); font-size: 12.5px}
.mz-lead {margin-bottom: 18px; color: var(--cm-muted); font-size: 14px}
.mz-lead b {color: var(--cm-ink)}

/* ---------- 입력칸 ---------- */
.mz-form {display: flex; flex-direction: column; gap: 18px}
.mz-grid2 {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px}
.mz-field {min-width: 0}
.mz-label {display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-bottom: 7px; color: var(--cm-ink); font-size: 13.5px; font-weight: 700}
.mz-label .req {padding: 1px 6px; border-radius: 4px; background: #fdecec; color: #e5383b; font-size: 10.5px; font-style: normal; font-weight: 800}
.mz-label .opt {padding: 1px 6px; border-radius: 4px; background: var(--cm-line-2); color: var(--cm-muted); font-size: 10.5px; font-style: normal; font-weight: 700}
.mz-help {margin-top: 6px; color: var(--cm-faint); font-size: 12.5px; line-height: 1.55}
.mz-help b {color: var(--cm-ink-2)}
.mz .mz-input {display: block; width: 100%; height: 46px; padding: 0 14px; border: 1px solid #d5d9df; border-radius: 6px; background: #fff; color: var(--cm-ink); font-size: 15px; font-family: inherit; box-shadow: none; transition: border-color .15s, box-shadow .15s}
.mz textarea.mz-input {height: auto; min-height: 140px; padding: 12px 14px; line-height: 1.65; resize: vertical}
.mz select.mz-input {padding-right: 36px; appearance: none; -webkit-appearance: none; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23767680' stroke-width='1.6' d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 14px center}
.mz .mz-input:focus {outline: 0; border-color: var(--mz-g) !important; box-shadow: 0 0 0 3px rgba(3, 199, 90, .14) !important}
.mz .mz-input[readonly] {background: var(--cm-panel-2, #f7f9fc); color: var(--cm-muted)}
.mz .mz-input::placeholder {color: #a8adb5}
.mz-ico-input {position: relative}
.mz-ico-input > .fa {position: absolute; left: 15px; top: 50%; transform: translateY(-50%); color: #a8adb5; font-size: 16px; pointer-events: none}
.mz-ico-input .mz-input {padding-left: 42px}
.mz-ico-input .mz-input:focus + .fa, .mz-ico-input:focus-within > .fa {color: var(--mz-g)}
.mz-inline {display: flex; gap: 8px}
.mz-inline > .mz-input {flex: 1; min-width: 0}
.mz-inline > .mz-btn {flex-shrink: 0}
.mz-msg {display: block; margin-top: 6px; font-size: 12.5px}
.mz-msg:empty {display: none}
.mz input[type=file] {max-width: 100%; font-size: 13px}
.mz-check {display: inline-flex; align-items: center; gap: 8px; cursor: pointer; color: var(--cm-ink-2); font-size: 14px; user-select: none}
.mz-check input {flex: none; width: 18px; height: 18px; margin: 0; accent-color: var(--mz-g); cursor: pointer}
.mz-radios {display: flex; flex-wrap: wrap; gap: 8px 18px}

/* ---------- 버튼 ---------- */
.mz-btn {display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 46px; padding: 0 22px; border: 1px solid transparent; border-radius: 6px; background: var(--cm-ink); color: #fff !important; font-size: 15px; font-weight: 700; font-family: inherit; line-height: 1; white-space: nowrap; cursor: pointer; text-decoration: none !important; transition: background .15s, border-color .15s, color .15s}
.mz-btn:hover {background: #000}
.mz-btn-g {background: var(--mz-g)}
.mz-btn-g:hover {background: var(--mz-gd)}
.mz-btn-line {background: #fff; border-color: #d5d9df; color: var(--cm-ink-2) !important}
.mz-btn-line:hover {background: #f6f7f8; border-color: #b9bec6}
.mz-btn-gline {background: #fff; border-color: var(--mz-g); color: var(--mz-gd) !important}
.mz-btn-gline:hover {background: var(--mz-gbg)}
.mz-btn-red {background: #e5383b}
.mz-btn-red:hover {background: #c92a2d}
.mz-btn-sm {height: 34px; padding: 0 13px; font-size: 13px; border-radius: 6px}
.mz-btn-md {height: 40px; padding: 0 16px; font-size: 14px}
.mz-btn-block {display: flex; width: 100%}
.mz-btn[disabled] {opacity: .55; cursor: default}
.mz-btns {display: flex; justify-content: center; gap: 8px; margin-top: 24px}
.mz-btns .mz-btn {min-width: 140px}
.mz-ibtn {display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: 1px solid var(--cm-line); border-radius: 6px; background: #fff; color: var(--cm-muted) !important; font-size: 14px; cursor: pointer}
.mz-ibtn:hover {border-color: #e5383b; color: #e5383b !important}

/* ---------- 배지·칩·빈 화면 ---------- */
.mz-chip {display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 4px; background: var(--mz-gbg); color: var(--mz-gd) !important; font-size: 11.5px; font-weight: 700; font-style: normal; white-space: nowrap}
.mz-chip.is-gray {background: var(--cm-line-2); color: var(--cm-muted) !important}
.mz-chip.is-red {background: #fdecec; color: #e5383b !important}
.mz-chip.is-blue {background: #eaf2ff; color: #2563eb !important}
.mz-chip.is-dark {background: var(--cm-ink); color: #fff !important}
.mz-empty {padding: 54px 20px; text-align: center; color: var(--cm-faint); font-size: 14px}
.mz-empty > .fa {display: block; margin-bottom: 12px; color: #c9ced6; font-size: 38px}
.mz-empty b {display: block; margin-bottom: 4px; color: var(--cm-ink-2); font-size: 15.5px}
.mz-empty .mz-btn {margin-top: 16px}
.mz-note {display: flex; gap: 8px; padding: 12px 14px; border-radius: 6px; background: var(--cm-panel-2, #f7f9fc); color: var(--cm-muted); font-size: 13px; line-height: 1.6}
.mz-note > .fa {flex: none; margin-top: 3px; color: var(--mz-g)}
.mz-note.is-warn {background: #fff7e6; color: #8a5a00}
.mz-note.is-warn > .fa {color: #e09a00}
.mz-avatar {display: inline-flex; flex: none; width: 40px; height: 40px; border-radius: 50%; overflow: hidden; background: var(--cm-line-2)}
.mz-avatar img {width: 100%; height: 100%; object-fit: cover}
.mz-avatar.is-lg {width: 64px; height: 64px}
.mz-avatar.is-xl {width: 84px; height: 84px}

/* ---------- 탭 ---------- */
.mz-tabs {display: flex; gap: 4px; padding: 4px; border-radius: 8px; background: var(--cm-line-2)}
.mz-tabs a {flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; height: 38px; border-radius: 6px; color: var(--cm-muted); font-size: 14px; font-weight: 700; text-decoration: none}
.mz-tabs a:hover {color: var(--cm-ink)}
.mz-tabs a.on {background: #fff; color: var(--cm-ink); box-shadow: 0 1px 3px rgba(0, 0, 0, .08)}
.mz-tabs a .n {min-width: 20px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--mz-g); color: #fff; font-size: 11px; line-height: 18px; text-align: center}
.mz-pills {display: flex; flex-wrap: wrap; gap: 6px}
.mz-pills a, .mz-pills li > a {display: inline-flex; align-items: center; gap: 5px; height: 34px; padding: 0 14px; border: 1px solid var(--cm-line); border-radius: 17px; background: #fff; color: var(--cm-ink-2); font-size: 13.5px; font-weight: 600; text-decoration: none}
.mz-pills a:hover {border-color: var(--mz-g); color: var(--mz-gd)}
.mz-pills a.on, .mz-pills a#bo_cate_on, .mz-pills a.sch_on {border-color: var(--mz-g); background: var(--mz-g); color: #fff}
.mz-pills a em {font-style: normal; font-weight: 500; opacity: .75}

/* ---------- 페이지 번호 (공용 .pg_wrap 재사용) ---------- */
.mz .pg_wrap {margin-top: 20px}

/* ==========================================================================
   로그인·비밀번호 확인 (머리·꼬리 없는 단독 화면)
   ========================================================================== */
.mz-auth {display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 40px 16px; background: radial-gradient(1000px 500px at 10% -10%, #dff7e9 0%, transparent 60%), radial-gradient(800px 400px at 110% 110%, #e6f1ff 0%, transparent 55%), #f2f4f6}
.mz-auth-box {display: grid; grid-template-columns: 400px 440px; width: 100%; max-width: 840px; overflow: hidden; border-radius: 16px; background: #fff; box-shadow: 0 20px 60px rgba(15, 23, 42, .12)}
.mz-auth-box.is-single {grid-template-columns: minmax(0, 1fr); max-width: 460px}
.mz-auth-brand {position: relative; display: flex; flex-direction: column; padding: 40px 36px; background: radial-gradient(420px 300px at 0% 0%, rgba(3, 199, 90, .28), transparent 70%), linear-gradient(160deg, #10241a 0%, #0b1711 60%, #07100b 100%); color: #fff; overflow: hidden}
.mz-auth-brand:after {content: ""; position: absolute; right: -90px; bottom: -90px; width: 280px; height: 280px; border-radius: 50%; border: 46px solid rgba(3, 199, 90, .12)}
.mz-auth-brand .mz-logo img {max-height: 40px}
.mz-auth-brand .mz-logo b {font-size: 24px; font-weight: 900; letter-spacing: -0.04em}
.mz-auth-copy {margin-top: 46px; font-size: 22px; font-weight: 800; line-height: 1.45; letter-spacing: -0.03em}
.mz-auth-copy small {display: block; margin-top: 12px; font-size: 14px; font-weight: 500; line-height: 1.65; color: #a9bfb2; letter-spacing: 0}
.mz-auth-copy em {color: #3ee28a; font-style: normal}
.mz-auth-points {position: relative; z-index: 1; display: flex; flex-direction: column; gap: 12px; margin-top: auto; padding-top: 36px}
.mz-auth-points li {display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600}
.mz-auth-points .fa {display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 8px; background: rgba(3, 199, 90, .18); color: #3ee28a; font-size: 14px}
.mz-auth-main {padding: 44px 44px 36px}
.mz-auth-main .mz-logo {display: none; margin-bottom: 26px}
.is-single .mz-auth-main .mz-logo {display: inline-block}
.mz-auth-main .mz-logo img {max-height: 36px}
.mz-auth-main h1 {font-size: 26px; font-weight: 900; letter-spacing: -0.04em}
.mz-auth-main .mz-lead {margin: 6px 0 26px}
.mz-auth-form {display: flex; flex-direction: column; gap: 10px}
.mz-auth-form .mz-input {height: 50px; font-size: 15px}
.mz-auth-form .mz-btn {height: 52px; margin-top: 6px; font-size: 16px}
.mz-auth-row {display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 4px; font-size: 13.5px}
.mz-auth-row a {color: var(--cm-muted); text-decoration: none}
.mz-auth-row a:hover {color: var(--cm-ink); text-decoration: underline}
.mz-auth-sep {display: flex; align-items: center; gap: 12px; margin: 26px 0 14px; color: var(--cm-faint); font-size: 12.5px}
.mz-auth-sep:before, .mz-auth-sep:after {content: ""; flex: 1; height: 1px; background: var(--cm-line)}
.mz-auth-foot {display: flex; justify-content: center; gap: 16px; margin-top: 26px; color: var(--cm-faint); font-size: 12.5px}
.mz-auth-foot a {text-decoration: none}
.mz-auth-foot a:hover {color: var(--cm-ink)}
.mz-idchip {display: flex; align-items: center; gap: 10px; margin-bottom: 12px; padding: 12px 14px; border-radius: 8px; background: var(--cm-panel-2, #f7f9fc); border: 1px solid var(--cm-line-2)}
.mz-idchip .mz-avatar {width: 36px; height: 36px}
.mz-idchip span {color: var(--cm-faint); font-size: 12px}
.mz-idchip b {display: block; color: var(--cm-ink); font-size: 15px}
.mz-auth .sns-wrap, .mz-auth #sns_login {margin-top: 16px}

/* ==========================================================================
   가입 단계·약관·정보 입력
   ========================================================================== */
.mz-steps {display: flex; align-items: center; margin-bottom: 18px; padding: 16px 20px; background: #fff; border: 1px solid var(--cm-line); border-radius: var(--mz-r)}
.mz-steps li {display: flex; align-items: center; gap: 9px; color: var(--cm-faint); font-size: 14px; font-weight: 700}
.mz-steps li + li:before {content: ""; width: 48px; height: 2px; margin: 0 14px; border-radius: 2px; background: var(--cm-line)}
.mz-steps li b {display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: var(--cm-line-2); color: var(--cm-faint); font-size: 13px}
.mz-steps li.done b {background: var(--mz-gbg); color: var(--mz-g)}
.mz-steps li.done {color: var(--cm-muted)}
.mz-steps li.on {color: var(--cm-ink)}
.mz-steps li.on b {background: var(--mz-g); color: #fff; box-shadow: 0 0 0 4px rgba(3, 199, 90, .16)}
.mz-steps li.done + li:before, .mz-steps li.on + li.done:before {background: var(--mz-g)}
.mz-agree-all {display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 22px; border: 2px solid var(--mz-g); border-radius: var(--mz-r); background: var(--mz-gbg)}
.mz-agree-all .mz-check {color: var(--cm-ink); font-size: 16px; font-weight: 800}
.mz-agree-all .mz-check input {width: 22px; height: 22px}
.mz-agree-all small {color: var(--cm-muted); font-size: 12.5px}
.mz-term {margin-top: 14px}
.mz-term-hd {display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 20px; border-bottom: 1px solid var(--cm-line-2)}
.mz-term-hd h2 {display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 800}
.mz-term-body {max-height: 220px; overflow-y: auto; padding: 16px 20px; color: var(--cm-ink-2); font-size: 13.5px; line-height: 1.75; white-space: pre-wrap}
.mz-term-body.is-table {white-space: normal}
.mz-table {width: 100%; border-collapse: collapse; font-size: 13.5px}
.mz-table th, .mz-table td {padding: 11px 12px; border: 1px solid var(--cm-line); text-align: left; vertical-align: top}
.mz-table thead th {background: var(--cm-panel-2, #f7f9fc); color: var(--cm-ink); font-weight: 700}
.mz-term-ft {display: flex; justify-content: flex-end; padding: 12px 20px; border-top: 1px solid var(--cm-line-2); background: #fbfcfd}
.mz-me {display: flex; align-items: center; gap: 18px; padding: 22px 24px}
.mz-me-txt {flex: 1; min-width: 0}
.mz-me-txt h2 {font-size: 19px; font-weight: 800}
.mz-me-txt h2 small {margin-left: 6px; color: var(--cm-faint); font-size: 13px; font-weight: 500}
.mz-me-stats {display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 6px; color: var(--cm-muted); font-size: 13px}
.mz-me-stats b {color: var(--cm-ink)}
.mz-me-links {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--cm-line-2)}
.mz-me-links a {display: flex; align-items: center; justify-content: center; gap: 7px; height: 48px; color: var(--cm-ink-2); font-size: 13.5px; font-weight: 600; text-decoration: none}
.mz-me-links a + a {border-left: 1px solid var(--cm-line-2)}
.mz-me-links a:hover {background: #fafbfc; color: var(--mz-gd)}
.mz-me-links a .fa {color: var(--mz-g)}
.mz-me-links a.is-out .fa, .mz-me-links a.is-out:hover {color: #e5383b}
.mz-imgrow {display: flex; align-items: center; gap: 12px; flex-wrap: wrap}
.mz-imgrow img {width: 48px; height: 48px; border-radius: 8px; object-fit: cover; border: 1px solid var(--cm-line)}
.mz-toggle-row {display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 14px 16px; border: 1px solid var(--cm-line); border-radius: 8px}
.mz-toggle-row b {display: block; color: var(--cm-ink); font-size: 14px}
.mz-toggle-row span {color: var(--cm-faint); font-size: 12.5px}
.mz-consent li {padding: 12px 0; border-top: 1px solid var(--cm-line-2)}
.mz-consent li:first-child {border-top: 0; padding-top: 0}
.mz-consent .consent-line {display: flex; align-items: center; gap: 8px; flex-wrap: wrap}
.mz-consent .js-open-consent {margin-left: auto; padding: 4px 10px; border: 1px solid var(--cm-line); border-radius: 5px; background: #fff; color: var(--cm-muted); font-size: 12px; cursor: pointer}
.mz-consent .sub-consents {display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 10px 0 0 26px}
.mz-consent .consent-date {color: var(--cm-faint); font-size: 12px}
.mz-captcha #captcha {display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0}
.mz-captcha #captcha legend {display: none}
.mz-captcha #captcha_img {height: 46px; border: 1px solid var(--cm-line); border-radius: 6px}
.mz-captcha #captcha_key {width: 140px; height: 46px; padding: 0 12px; border: 1px solid #d5d9df; border-radius: 6px; font-size: 16px}
.mz-captcha #captcha_mp3, .mz-captcha #captcha_reload {width: 40px; height: 46px; border: 1px solid var(--cm-line); border-radius: 6px; background-color: #fff}
.mz-captcha #captcha_info {flex-basis: 100%; color: var(--cm-faint); font-size: 12.5px}
.mz-done {padding: 46px 30px; text-align: center}
.mz-done-ico {display: inline-flex; align-items: center; justify-content: center; width: 76px; height: 76px; margin-bottom: 18px; border-radius: 50%; background: var(--mz-gbg); color: var(--mz-g); font-size: 34px}
.mz-done h2 {font-size: 24px; font-weight: 900; letter-spacing: -0.04em}
.mz-done h2 em {color: var(--mz-g); font-style: normal}
.mz-done .mz-lead {margin: 8px 0 22px}
.mz-done-info {display: inline-grid; grid-template-columns: auto auto; gap: 8px 22px; margin: 0 auto; padding: 16px 26px; border-radius: 8px; background: var(--cm-panel-2, #f7f9fc); text-align: left; font-size: 14px}
.mz-done-info dt {color: var(--cm-faint)}
.mz-done-info dd {margin: 0; color: var(--cm-ink); font-weight: 700}
.mz-done-next {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; max-width: 560px; margin: 26px auto 0}
.mz-done-next a {display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 16px 10px; border: 1px solid var(--cm-line); border-radius: 8px; color: var(--cm-ink-2); font-size: 13.5px; font-weight: 700; text-decoration: none}
.mz-done-next a .fa {color: var(--mz-g); font-size: 20px}
.mz-done-next a:hover {border-color: var(--mz-g); background: var(--mz-gbg)}
.mz-narrow {max-width: 560px; margin: 0 auto}
.mz-center-hd {padding: 30px 30px 6px; text-align: center}
.mz-center-hd .mz-done-ico {width: 60px; height: 60px; margin-bottom: 14px; font-size: 26px}
.mz-center-hd h2 {font-size: 20px; font-weight: 800}
.mz-center-hd p {margin-top: 6px; color: var(--cm-muted); font-size: 14px}

/* 동의 자세히보기 창 */
#consentDialog {padding: 0; border: 0; border-radius: 12px}
#consentDialog::backdrop {background: rgba(15, 23, 42, .5)}
#consentDialog .cd-card {min-width: 300px; max-width: 520px; border-radius: 12px; background: #fff}
#consentDialog .cd-head {padding: 18px 20px 12px}
#consentDialog .cd-title {margin: 0; font-size: 17px; font-weight: 800}
#consentDialog .cd-body {max-height: 60vh; overflow-y: auto; padding: 14px 20px; border-top: 1px solid #eceef1; border-bottom: 1px solid #eceef1; font-size: 14px; line-height: 1.7; color: #3a3a42}
#consentDialog .cd-actions {display: flex; justify-content: flex-end; gap: 8px; padding: 12px 20px 18px}
#consentDialog .cd-actions button {height: 38px; padding: 0 16px; border-radius: 6px; font-size: 14px; font-weight: 700; cursor: pointer}
#consentDialog .cd-agree {border: 1px solid #03c75a; background: #03c75a; color: #fff}
#consentDialog .cd-close {border: 1px solid #d5d9df; background: #fff; color: #3a3a42}

/* ==========================================================================
   새 창 (쪽지·포인트·스크랩·프로필·메일)
   ========================================================================== */
body.mz-pop-body {min-width: 0; background: #f2f4f6}
.mz-pop {min-height: 100vh; padding-bottom: 20px}
.mz-pop-hd {position: sticky; top: 0; z-index: 10; display: flex; align-items: center; gap: 10px; height: 58px; padding: 0 18px; background: #fff; border-bottom: 1px solid var(--cm-line)}
.mz-pop-hd > .fa {display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 8px; background: var(--mz-g); color: #fff; font-size: 15px}
.mz-pop-hd h1 {font-size: 17px; font-weight: 800}
.mz-pop-hd h1 small {margin-left: 6px; color: var(--cm-faint); font-size: 12.5px; font-weight: 500}
.mz-pop-x {margin-left: auto; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border: 0; border-radius: 8px; background: transparent; color: var(--cm-muted); font-size: 18px; cursor: pointer}
.mz-pop-x:hover {background: var(--cm-line-2); color: var(--cm-ink)}
.mz-pop-bd {display: flex; flex-direction: column; gap: 12px; padding: 16px 18px 0}
.mz-pop-ft {display: flex; justify-content: center; gap: 8px; padding: 18px 18px 0}
.mz-pop-ft .mz-btn {min-width: 120px; height: 42px; font-size: 14px}
.mz-pop .mz-card-bd {padding: 18px}
.mz-pop-desc {display: flex; align-items: center; gap: 6px; color: var(--cm-faint); font-size: 12.5px}

/* 쪽지 목록 */
.mz-memos > li {position: relative; display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--cm-line-2)}
.mz-memos > li:last-child {border-bottom: 0}
.mz-memos > li.is-new {background: #f4fcf7}
.mz-memos .mz-avatar {position: relative}
.mz-memos .mz-dot {position: absolute; left: 44px; top: 13px; width: 10px; height: 10px; border-radius: 50%; background: #e5383b; border: 2px solid #fff}
.mz-memo-txt {flex: 1; min-width: 0}
.mz-memo-who {display: flex; align-items: center; gap: 8px; font-size: 13px}
.mz-memo-who .sv_wrap, .mz-memo-who .sv_member {font-weight: 700; color: var(--cm-ink)}
.mz-memo-who time {color: var(--cm-faint); font-size: 12px}
.mz-memo-pre {display: block; margin-top: 2px; overflow: hidden; color: var(--cm-ink-2); font-size: 14px; white-space: nowrap; text-overflow: ellipsis; text-decoration: none}
.mz-memos > li.is-new .mz-memo-pre {color: var(--cm-ink); font-weight: 700}
.mz-memo-pre:hover {color: var(--mz-gd); text-decoration: underline}
.mz-memo-view-hd {display: flex; align-items: center; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--cm-line-2)}
.mz-memo-view-hd .who {flex: 1; min-width: 0; font-size: 13px; color: var(--cm-faint)}
.mz-memo-view-hd .who b, .mz-memo-view-hd .who .sv_member {display: block; color: var(--cm-ink); font-size: 15px; font-weight: 700}
.mz-memo-view-hd .acts {display: flex; gap: 6px}
.mz-memo-body {min-height: 160px; padding: 20px 18px; color: var(--cm-ink); font-size: 15px; line-height: 1.8; word-break: break-all}
.mz-memo-nav {display: flex; justify-content: space-between; padding: 10px 18px; border-top: 1px solid var(--cm-line-2); font-size: 13px}
.mz-memo-nav a {color: var(--cm-muted); text-decoration: none}
.mz-memo-nav a:hover {color: var(--mz-gd)}

/* 포인트 */
.mz-point-sum {display: flex; align-items: center; justify-content: space-between; padding: 20px 22px; border-radius: var(--mz-r); background: linear-gradient(135deg, #04c95c, #02a94b); color: #fff}
.mz-point-sum span {font-size: 14px; opacity: .9}
.mz-point-sum b {font-size: 28px; font-weight: 900; letter-spacing: -0.03em}
.mz-point-sum b small {margin-left: 3px; font-size: 15px; font-weight: 700}
.mz-points > li {display: flex; align-items: center; gap: 12px; padding: 13px 16px; border-bottom: 1px solid var(--cm-line-2)}
.mz-points > li:last-child {border-bottom: 0}
.mz-points .tx {flex: 1; min-width: 0}
.mz-points .tx b {display: block; overflow: hidden; color: var(--cm-ink); font-size: 14px; font-weight: 600; white-space: nowrap; text-overflow: ellipsis}
.mz-points .tx span {color: var(--cm-faint); font-size: 12px}
.mz-points .tx .exp {margin-left: 6px}
.mz-points .tx .txt_expired {color: #e5383b}
.mz-points .amt {flex: none; font-size: 15px; font-weight: 800; color: var(--mz-gd)}
.mz-points .is-use .amt {color: #e5383b}
.mz-points-sub {display: flex; justify-content: flex-end; gap: 16px; padding: 12px 16px; background: var(--cm-panel-2, #f7f9fc); border-top: 1px solid var(--cm-line); font-size: 13px; color: var(--cm-muted)}
.mz-points-sub b {color: var(--mz-gd)}
.mz-points-sub b.is-use {color: #e5383b}

/* 스크랩 */
.mz-scraps > li {display: flex; align-items: center; gap: 12px; padding: 13px 16px; border-bottom: 1px solid var(--cm-line-2)}
.mz-scraps > li:last-child {border-bottom: 0}
.mz-scraps .tx {flex: 1; min-width: 0}
.mz-scraps .tx a.t {display: block; overflow: hidden; color: var(--cm-ink); font-size: 14.5px; font-weight: 600; white-space: nowrap; text-overflow: ellipsis; text-decoration: none}
.mz-scraps .tx a.t:hover {color: var(--mz-gd); text-decoration: underline}
.mz-scraps .tx .m {display: flex; align-items: center; gap: 8px; margin-top: 3px; color: var(--cm-faint); font-size: 12px}
.mz-scrap-tit {padding: 14px 16px; border-radius: 8px; background: var(--cm-panel-2, #f7f9fc); color: var(--cm-ink); font-size: 15px; font-weight: 700}

/* 프로필 */
.mz-prof {padding: 26px 20px 20px; text-align: center}
.mz-prof .mz-avatar {margin-bottom: 10px}
.mz-prof h2 {font-size: 19px; font-weight: 800}
.mz-prof h2 .sv_wrap {display: inline}
.mz-prof-chips {display: flex; justify-content: center; gap: 6px; margin-top: 8px}
.mz-prof-dl {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--cm-line-2)}
.mz-prof-dl div {padding: 14px 18px; border-bottom: 1px solid var(--cm-line-2)}
.mz-prof-dl div:nth-child(odd) {border-right: 1px solid var(--cm-line-2)}
.mz-prof-dl div.is-wide {grid-column: 1 / -1; border-right: 0}
.mz-prof-dl dt {color: var(--cm-faint); font-size: 12px}
.mz-prof-dl dd {margin: 2px 0 0; color: var(--cm-ink); font-size: 14px; font-weight: 600; word-break: break-all}
.mz-prof-intro {padding: 16px 18px; color: var(--cm-ink-2); font-size: 14px; line-height: 1.75}
.mz-prof-intro h3 {margin-bottom: 6px; font-size: 13px; color: var(--cm-faint)}

/* ==========================================================================
   전체검색
   ========================================================================== */
.mz-sch-box {padding: 22px 24px}
.mz-sch-form {display: flex; gap: 8px}
.mz-sch-form .mz-input {height: 50px}
.mz-sch-form .sel {flex: none; width: 150px}
.mz-sch-form .kw {position: relative; flex: 1; min-width: 0}
.mz-sch-form .kw .mz-input {padding-right: 60px; border: 2px solid var(--mz-g); font-size: 16px}
.mz-sch-form .kw button {position: absolute; right: 4px; top: 4px; bottom: 4px; width: 50px; border: 0; border-radius: 4px; background: var(--mz-g); color: #fff; font-size: 18px; cursor: pointer}
.mz-sch-opt {display: flex; align-items: center; flex-wrap: wrap; gap: 10px 18px; margin-top: 12px; color: var(--cm-muted); font-size: 13px}
.mz-sch-opt select.mz-input {display: inline-block; width: auto; margin-left: 4px; vertical-align: middle; height: 34px; padding: 0 32px 0 10px; font-size: 13px; background-position: right 10px center}
.mz-seg {display: inline-flex; padding: 3px; border-radius: 6px; background: var(--cm-line-2)}
.mz-seg input {position: absolute; opacity: 0; pointer-events: none}
.mz-seg label {padding: 4px 12px; border-radius: 4px; color: var(--cm-muted); font-size: 12.5px; font-weight: 700; cursor: pointer}
.mz-seg input:checked + label {background: #fff; color: var(--cm-ink); box-shadow: 0 1px 2px rgba(0, 0, 0, .08)}
.mz-sch-sum {display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 14px; margin: 22px 0 12px}
.mz-sch-sum h2 {font-size: 19px; font-weight: 800}
.mz-sch-sum h2 em {color: var(--mz-g); font-style: normal}
.mz-sch-sum span {color: var(--cm-muted); font-size: 13px}
.mz-sch-sum span b {color: var(--cm-ink)}
.mz-sch-boards {margin-bottom: 16px}
.mz-sch-grp + .mz-sch-grp {margin-top: 14px}
.mz-sch-grp .mz-card-hd h2 a {text-decoration: none}
.mz-sch-grp .mz-card-hd .more {margin-left: auto; color: var(--cm-muted); font-size: 12.5px; text-decoration: none}
.mz-sch-grp .mz-card-hd .more:hover {color: var(--mz-gd)}
.mz-sch-list > li {padding: 15px 24px; border-bottom: 1px solid var(--cm-line-2)}
.mz-sch-list > li:last-child {border-bottom: 0}
.mz-sch-list .t {display: flex; align-items: center; gap: 6px}
.mz-sch-list .t a.tit {min-width: 0; overflow: hidden; color: var(--cm-ink); font-size: 15px; font-weight: 700; white-space: nowrap; text-overflow: ellipsis; text-decoration: none}
.mz-sch-list .t a.tit:hover {text-decoration: underline}
.mz-sch-list .t .pop {flex: none; color: var(--cm-faint); font-size: 12px}
.mz-sch-list p {display: -webkit-box; margin-top: 4px; overflow: hidden; color: var(--cm-muted); font-size: 13.5px; line-height: 1.6; -webkit-line-clamp: 2; -webkit-box-orient: vertical}
.mz-sch-list .m {display: flex; align-items: center; gap: 10px; margin-top: 6px; color: var(--cm-faint); font-size: 12px}
.mz-sch-list .m .sv_wrap {display: inline}
.mz .sch_word {padding: 0 1px; border-radius: 2px; background: #fff3a8; color: inherit; font-weight: inherit}

/* ==========================================================================
   새글·현재접속자
   ========================================================================== */
.mz-filter {display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 16px 20px}
.mz-filter .mz-input {width: auto; height: 40px; font-size: 14px}
.mz-filter select.mz-input {min-width: 130px}
.mz-filter .grow {flex: 1; min-width: 160px}
.mz-filter .mz-btn {height: 40px}
.mz-filter small {flex-basis: 100%; color: var(--cm-faint); font-size: 12px}
.mz-newlist > li {display: flex; align-items: center; gap: 12px; padding: 13px 20px; border-bottom: 1px solid var(--cm-line-2)}
.mz-newlist > li:last-child {border-bottom: 0}
.mz-newlist > li:hover {background: #fafbfc}
.mz-newlist .bo {flex: none; width: 96px}
.mz-newlist .bo .mz-chip {max-width: 100%; overflow: hidden; text-overflow: ellipsis}
.mz-newlist .tx {flex: 1; min-width: 0}
.mz-newlist .tx a {display: block; overflow: hidden; color: var(--cm-ink); font-size: 14.5px; font-weight: 500; white-space: nowrap; text-overflow: ellipsis; text-decoration: none}
.mz-newlist .tx a:hover {text-decoration: underline}
.mz-newlist .tx .is-cmt {color: var(--cm-muted)}
.mz-newlist .tx .is-cmt:before {content: "\f0e5"; margin-right: 5px; font-family: FontAwesome; color: var(--cm-faint)}
.mz-newlist .nm {flex: none; width: 110px; overflow: hidden; color: var(--cm-ink-2); font-size: 13px; white-space: nowrap; text-overflow: ellipsis}
.mz-newlist .nm .sv_wrap {display: inline}
.mz-newlist .dt {flex: none; width: 70px; color: var(--cm-faint); font-size: 12.5px; text-align: right}
.mz-newlist .ck {flex: none}
.mz-adminbar {display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 20px; border-bottom: 1px solid var(--cm-line-2); background: #fbfcfd}
.mz-online-hd {display: flex; align-items: center; gap: 10px; padding: 18px 22px}
.mz-online-hd .live {display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 12px; border-radius: 14px; background: var(--mz-gbg); color: var(--mz-gd); font-size: 13px; font-weight: 800}
.mz-online-hd .live i {width: 8px; height: 8px; border-radius: 50%; background: var(--mz-g); animation: mzPulse 1.6s infinite}
@keyframes mzPulse {0% {box-shadow: 0 0 0 0 rgba(3, 199, 90, .5)} 70% {box-shadow: 0 0 0 8px rgba(3, 199, 90, 0)} 100% {box-shadow: 0 0 0 0 rgba(3, 199, 90, 0)}}
.mz-online-hd p {color: var(--cm-muted); font-size: 13px}
.mz-online {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 0 22px 22px}
.mz-online li {display: flex; align-items: center; gap: 12px; min-width: 0; padding: 12px 14px; border: 1px solid var(--cm-line-2); border-radius: 8px; background: #fbfcfd}
.mz-online .tx {flex: 1; min-width: 0}
.mz-online .nm {display: block; overflow: hidden; color: var(--cm-ink); font-size: 14px; font-weight: 700; white-space: nowrap; text-overflow: ellipsis}
.mz-online .nm .sv_wrap {display: inline}
.mz-online .lc {display: block; overflow: hidden; color: var(--cm-faint); font-size: 12px; white-space: nowrap; text-overflow: ellipsis}
.mz-online .lc a {color: var(--mz-gd)}
.mz-online .no {flex: none; color: #c4c9d0; font-size: 11px; font-weight: 700}

/* ==========================================================================
   FAQ
   ========================================================================== */
.mz-faq-top {display: flex; align-items: center; gap: 18px; padding: 24px}
.mz-faq-top .ico {display: inline-flex; flex: none; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 14px; background: var(--mz-gbg); color: var(--mz-g); font-size: 26px}
.mz-faq-top .tx {flex: 1; min-width: 0}
.mz-faq-top h2 {font-size: 18px; font-weight: 800}
.mz-faq-top p {margin-top: 2px; color: var(--cm-muted); font-size: 13.5px}
.mz-faq-top form {flex: none; display: flex; width: 320px}
.mz-faq-top form .mz-input {border-radius: 6px 0 0 6px}
.mz-faq-top form .mz-btn {border-radius: 0 6px 6px 0; padding: 0 16px}
.mz-faq-cats {margin: 14px 0}
.mz-faq > li {border-bottom: 1px solid var(--cm-line-2)}
.mz-faq > li:last-child {border-bottom: 0}
.mz-faq-q {display: flex; align-items: center; gap: 12px; width: 100%; padding: 17px 22px; border: 0; background: transparent; color: var(--cm-ink); font-size: 15px; font-weight: 700; font-family: inherit; text-align: left; cursor: pointer}
.mz-faq-q:hover {background: #fafbfc}
.mz-faq-q .q, .mz-faq-a .a {display: inline-flex; flex: none; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 8px; font-size: 13px; font-weight: 900}
.mz-faq-q .q {background: var(--mz-g); color: #fff}
.mz-faq-q .tt {flex: 1; min-width: 0}
.mz-faq-q .tt p {margin: 0}
.mz-faq-q > .fa {color: var(--cm-faint); transition: transform .2s}
.mz-faq li.on .mz-faq-q > .fa {transform: rotate(180deg); color: var(--mz-g)}
.mz-faq-a {display: none; gap: 12px; padding: 4px 22px 20px 22px}
.mz-faq li.on .mz-faq-a {display: flex}
.mz-faq-a .a {background: var(--mz-gbg); color: var(--mz-g)}
.mz-faq-a .ct {flex: 1; min-width: 0; padding: 14px 16px; border-radius: 8px; background: var(--cm-panel-2, #f7f9fc); color: var(--cm-ink-2); font-size: 14px; line-height: 1.8}
.mz-faq-a .ct img {max-width: 100%; height: auto}
.mz-faq-cta {display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 14px; padding: 18px 22px}
.mz-faq-cta b {display: block; color: var(--cm-ink); font-size: 15px}
.mz-faq-cta span {color: var(--cm-muted); font-size: 13px}
.mz-adm {display: flex; justify-content: flex-end; margin-top: 10px}

/* ==========================================================================
   1:1 문의
   ========================================================================== */
.mz-qa-top {display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-bottom: 12px}
.mz-qa-top .total {color: var(--cm-muted); font-size: 13px}
.mz-qa-top .total b {color: var(--cm-ink)}
.mz-qa-top .acts {display: flex; gap: 6px}
.mz-qa-cats {margin-bottom: 12px}
.mz-qa-sch {display: flex; gap: 6px; margin-bottom: 12px}
.mz-qa-sch select.mz-input {flex: none; width: 120px; height: 40px; font-size: 13.5px}
.mz-qa-sch .mz-input {height: 40px; font-size: 14px}
.mz-qa-sch .mz-btn {height: 40px}
.mz-qalist > li {display: flex; align-items: center; gap: 12px; padding: 15px 20px; border-bottom: 1px solid var(--cm-line-2)}
.mz-qalist > li:last-child {border-bottom: 0}
.mz-qalist > li:hover {background: #fafbfc}
.mz-qalist .st {flex: none; width: 74px}
.mz-qalist .tx {flex: 1; min-width: 0}
.mz-qalist .tx a {display: block; overflow: hidden; color: var(--cm-ink); font-size: 15px; font-weight: 600; white-space: nowrap; text-overflow: ellipsis; text-decoration: none}
.mz-qalist .tx a:hover {text-decoration: underline}
.mz-qalist .tx .m {display: flex; align-items: center; gap: 8px; margin-top: 3px; color: var(--cm-faint); font-size: 12px}
.mz-qalist .ck {flex: none}
.mz-qa-ft {display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 14px}
.mz-qv-hd {padding: 22px 24px; border-bottom: 1px solid var(--cm-line-2)}
.mz-qv-hd .chips {display: flex; gap: 6px; margin-bottom: 8px}
.mz-qv-hd h2 {font-size: 20px; font-weight: 800; line-height: 1.45}
.mz-qv-meta {display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 10px; color: var(--cm-faint); font-size: 12.5px}
.mz-qv-meta b {color: var(--cm-ink-2); font-weight: 600}
.mz-qv-body {padding: 24px; color: var(--cm-ink); font-size: 15px; line-height: 1.85; word-break: break-all}
.mz-qv-body img {max-width: 100%; height: auto}
.mz-qv-files {margin: 0 24px 22px; padding: 12px 14px; border: 1px dashed var(--cm-line); border-radius: 8px}
.mz-qv-files li {display: flex; align-items: center; gap: 8px; padding: 3px 0; font-size: 13.5px}
.mz-qv-files a {color: var(--cm-ink-2)}
.mz-qv-acts {display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-top: 12px}
.mz-qv-acts > div {display: flex; gap: 6px}
.mz-ans {margin-top: 14px; border-color: var(--mz-g); border-width: 1px 1px 1px 4px}
.mz-ans-hd {display: flex; align-items: center; gap: 10px; padding: 16px 22px; border-bottom: 1px solid var(--cm-line-2)}
.mz-ans-hd h3 {flex: 1; min-width: 0; font-size: 16px; font-weight: 800}
.mz-ans-hd time {color: var(--cm-faint); font-size: 12.5px}
.mz-ans-wait {display: flex; align-items: center; gap: 12px; margin-top: 14px; padding: 20px 22px}
.mz-ans-wait .fa {color: #e09a00; font-size: 22px}
.mz-ans-wait b {display: block; color: var(--cm-ink); font-size: 15px}
.mz-ans-wait span {color: var(--cm-muted); font-size: 13px}
.mz-qw .wr_content textarea, .mz-qw textarea#qa_content {width: 100%; min-height: 260px; padding: 12px 14px; border: 1px solid #d5d9df; border-radius: 6px; font-size: 15px; line-height: 1.7; font-family: inherit}
.mz-qw .wr_content textarea:focus, .mz-qw textarea#qa_content:focus {outline: 0; border-color: var(--mz-g); box-shadow: 0 0 0 3px rgba(3, 199, 90, .14)}
.mz-file {display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; padding: 12px 14px; border: 1px dashed #cdd2d9; border-radius: 6px; background: #fbfcfd}
.mz-file + .mz-file {margin-top: 8px}
.mz-rel li {display: flex; align-items: center; gap: 10px; padding: 12px 20px; border-bottom: 1px solid var(--cm-line-2); font-size: 14px}
.mz-rel li:last-child {border-bottom: 0}
.mz-rel li a {flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--cm-ink); text-decoration: none}
.mz-rel li time {color: var(--cm-faint); font-size: 12px}

/* ==========================================================================
   내용 페이지 (사이트 소개·약관)
   ========================================================================== */
.mz-ctt .mz-card-bd {padding: 30px 32px; color: var(--cm-ink-2); font-size: 15px; line-height: 1.9}
.mz-ctt .mz-card-bd h2, .mz-ctt .mz-card-bd h3 {margin: 1.4em 0 .5em; color: var(--cm-ink)}
.mz-ctt .mz-card-bd img {max-width: 100%; height: auto}

/* ==========================================================================
   반응형
   ========================================================================== */
@media (max-width: 1100px) {
    .mz-online {grid-template-columns: repeat(2, minmax(0, 1fr))}
}
@media (max-width: 860px) {
    .mz-auth {align-items: flex-start; padding: 24px 14px; background: #f2f4f6}
    .mz-auth-box, .mz-auth-box.is-single {grid-template-columns: minmax(0, 1fr); max-width: 460px}
    .mz-auth-brand {display: none}
    .mz-auth-main {padding: 30px 22px 26px}
    .mz-auth-main .mz-logo {display: inline-block}
    .mz-card-bd {padding: 18px 16px}
    .mz-card-hd {padding: 14px 16px}
    .mz-grid2 {grid-template-columns: minmax(0, 1fr)}
    .mz-steps {justify-content: center; padding: 12px 10px}
    .mz-steps li {flex-direction: column; gap: 4px; font-size: 12px}
    .mz-steps li + li:before {display: none}
    .mz-steps li + li {margin-left: 26px}
    .mz-agree-all {flex-direction: column; align-items: flex-start; padding: 16px}
    .mz-term-hd, .mz-term-body, .mz-term-ft {padding-left: 16px; padding-right: 16px}
    .mz-me {padding: 18px 16px; gap: 14px}
    .mz-me-links {grid-template-columns: repeat(2, minmax(0, 1fr))}
    .mz-me-links a:nth-child(3) {border-left: 0}
    .mz-me-links a:nth-child(n+3) {border-top: 1px solid var(--cm-line-2)}
    .mz-btns .mz-btn {flex: 1; min-width: 0}
    .mz-done {padding: 34px 18px}
    .mz-done-next {grid-template-columns: minmax(0, 1fr)}
    .mz-sch-box {padding: 16px}
    .mz-sch-form {flex-wrap: wrap}
    .mz-sch-form .sel {width: 100%}
    .mz-sch-list > li {padding: 14px 16px}
    .mz-newlist > li {flex-wrap: wrap; gap: 4px 10px; padding: 12px 16px}
    .mz-newlist .bo {width: auto}
    .mz-newlist .tx {flex-basis: 100%; order: 2}
    .mz-newlist .nm {width: auto; order: 3}
    .mz-newlist .dt {width: auto; order: 4}
    .mz-online {grid-template-columns: minmax(0, 1fr); padding: 0 16px 16px}
    .mz-faq-top {flex-wrap: wrap; padding: 18px 16px}
    .mz-faq-top form {width: 100%}
    .mz-faq-q {padding: 15px 16px}
    .mz-faq-a {padding: 0 16px 16px}
    .mz-faq-cta {flex-direction: column; align-items: flex-start}
    .mz-qalist > li {padding: 13px 16px}
    .mz-qalist .st {width: auto}
    .mz-qv-hd, .mz-qv-body {padding: 18px 16px}
    .mz-qv-files {margin: 0 16px 16px}
    .mz-ctt .mz-card-bd {padding: 22px 18px}
}
@media (max-width: 420px) {
    .mz-pop-hd {padding: 0 12px}
    .mz-pop-bd {padding: 12px 12px 0}
    .mz-prof-dl {grid-template-columns: minmax(0, 1fr)}
    .mz-prof-dl div:nth-child(odd) {border-right: 0}
}
.mz-label-help {color: var(--cm-faint); font-size: 12px; font-weight: 400}
.mz-pills a strong {font-weight: 700}
.mz-pills a .cnt_cmt {margin-left: 3px; font-size: 12px; font-weight: 500; opacity: .75}
/* 필수 칸 별표(default.css .required 의 그림)는 ‘필수’ 표시와 겹쳐 지운다 */
.mz .mz-input.required, .mz-captcha .required, .mz-captcha #captcha_key {background-image: none !important}
.mz select.mz-input.required {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23767680' stroke-width='1.6' d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") !important; background-position: right 14px center !important}
.mz-card-hd .more .fa {display: inline; width: auto; height: auto; background: none; color: inherit; font-size: inherit}