/* 새 회원 틀 — 로그인 단추 조각(W-313 · W-423)                                           assets/mem.css
   (W-423 · 원장님 2026-10-11 「아이콘의 저작권 문제 없도록」) 단추 = 각 회사가 내려 준 **공식 단추 그림 파일**(assets/brand/ · 출처는 그 폴더의 읽어보세요.txt)
     카카오 kakao_login_kr_medium.svg · 네이버 NAVER_login_Light_KR_green_narrow_H48.png · 구글 Theme=Light, Show text=Yes, Shape=Pill ….svg
   🔴 그림은 비율 그대로 줄이거나 키우기만 — 폭만 정하고 높이는 저절로(자르기 · 색 필터 · 둥근 가림 · 가로로 늘이기 없음). 세 단추 모두 높이 48px 이 되는 폭 · 세로로 쌓음.
   우리가 그린 색 바탕 · 말풍선 · N · G 는 없습니다. */
.ssm-login { flex: 1 1 100%; min-width: 0; }
.ssm-login__bs { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.ssm-b { box-sizing: border-box; display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; max-width: 100%; min-height: 48px; margin: 0; padding: 0; border: 0; background: none; font-size: 1.0625rem; font-weight: 700; line-height: 1.2; color: #16294a; text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.ssm-b[hidden] { display: none; }
.ssm-b__img { display: block; max-width: 100%; height: auto; }
.ssm-b--kakao .ssm-b__img { width: 234px; }    /* 224 × 46 → 48px 높이 */
.ssm-b--naver .ssm-b__img { width: 210px; }    /* 840 × 192 → 48px 높이 */
.ssm-b--google .ssm-b__img { width: 216px; }   /* 180 × 40 → 48px 높이 */
.ssm-b__t { padding: 0 16px; }                  /* 그림 파일이 없을 때만 나오는 글자 */
.ssm-b:focus-visible, .ssm-chadd:focus-visible { outline: 3px solid #16294a; outline-offset: 3px; border-radius: 4px; }
.ssm-keep { display: flex; align-items: center; gap: 8px; min-height: 48px; margin: 6px 0 0; font-size: 1rem; line-height: 1.4; cursor: pointer; }
.ssm-keep[hidden], .ssm-note[hidden] { display: none; }
.ssm-keep__c { flex: 0 0 auto; width: 22px; height: 22px; margin: 0; accent-color: #16294a; }
.ssm-login .ssm-old { margin: 8px 0 0; font-size: .9375rem; line-height: 1.5; color: #4a5362; }
.ssm-login .ssm-note { margin: 8px 0 0; font-size: 1rem; font-weight: 700; color: #8f5218; }

/* ---------- (W-314) 로그인 페이지 · 내 정보 · 가림막의 단추 묶음 · 로그아웃 물음 ---------- */
.ssm-pg { max-width: 560px; margin: 0 0 24px; font-size: 1.0625rem; line-height: 1.6; word-break: keep-all; }
.ssm-pg [hidden] { display: none !important; }
.ssm-pg__lead { margin: 0 0 14px; }
.ssm-pg__who { margin: 0 0 4px; font-size: 1.25rem; color: #16294a; }
.ssm-pg__via { margin: 0 0 14px; color: #1d2533; }
.ssm-pg__acts { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.ssm-pg__m, .ssm-leave__m { margin: 0 0 10px; font-weight: 700; color: #8f5218; }
.ssm-pg__m:empty, .ssm-leave__m:empty { display: none; }
.ssm-pg__s { margin: 0 0 14px; font-size: 1rem; color: #4a5362; }
.ssm-pg__done { margin: 0 0 16px; padding: 12px 14px; border: 2px solid #16294a; border-radius: 12px; font-weight: 700; color: #16294a; }
.ssm-pg__wait { margin: 0 0 14px; color: #4a5362; }
.ssm-btn { box-sizing: border-box; display: inline-flex; flex: 1 1 200px; align-items: center; justify-content: center; min-height: 52px; margin: 0; padding: 0 16px; border: 2px solid #16294a; border-radius: 12px; background: #fff; color: #16294a; font-family: inherit; font-size: 1.0625rem; font-weight: 700; line-height: 1.2; text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.ssm-pg a.ssm-btn { text-decoration: none; }
.ssm-btn--main, .ssm-pg a.ssm-btn--main { background: #16294a; color: #fff; }
.ssm-btn:disabled { opacity: .55; cursor: default; }
.ssm-btn:focus-visible, .ssm-more > summary:focus-visible, .ssm-gnote__b:focus-visible, .ssm-leave__box:focus-visible, .ssm-ask:focus-visible { outline: 3px solid #8f5218; outline-offset: 2px; }
/* (W-421) 카카오톡 채널 = 「병원 소식 받기 (선택)」 카드 — 로그인 회사와 헷갈리지 않게 테두리 · 제목으로 떼어 놓음 */
.ssm-ch { margin: 4px 0 14px; padding: 14px; border: 2px solid #ddd6c9; border-radius: 14px; background: #f6f3ed; }
/* (W-423) 카카오 공식 「채널 추가」 단추 그림(채널 추가_Large.svg 123 × 46) — 비율 그대로 · 높이 48px 이 되는 폭 */
.ssm-chadd, .ss-body .ssm-pg a.ssm-chadd { display: inline-flex; align-items: center; min-height: 48px; margin: 0; padding: 0; border: 0; background: none; color: #16294a; font-weight: 700; text-decoration: none; }
.ssm-chadd__img { display: block; width: 128px; max-width: 100%; height: auto; }
.ssm-ch__h, .ss-body .ssm-pg .ssm-ch__h { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 6px; padding: 0; border: 0; font-size: 1.125rem; font-weight: 800; line-height: 1.4; color: #16294a; }
.ssm-ch__opt { font-weight: 400; color: #4a5362; }
.ssm-ch__t { margin: 0 0 12px; font-size: 1rem; color: #1d2533; }
/* (W-421) 이름 옆 회사 칩 — 회사 점(.ssm-dot · 테마 ss.css · W-423 공식 아이콘형 그림)과 「네이버 로그인」 */
.ssm-pg__who { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.ssm-chip { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 0 12px 0 5px; border: 1.5px solid #16294a; border-radius: 999px; background: #fff; color: #16294a; font-size: 1rem; font-weight: 700; line-height: 1.2; white-space: nowrap; }
.ssm-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ssm-more, .ss-body details.ssm-more { margin: 14px 0 0; padding: 0; border: 2px solid #ddd6c9; border-radius: 14px; background: #fff; }
.ssm-more > summary, .ss-body details.ssm-more > summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 10px; min-height: 52px; padding: 8px 14px; list-style: none; font-size: 1.0625rem; font-weight: 400; line-height: 1.5; color: #1d2533; cursor: pointer; }
.ssm-more > summary::-webkit-details-marker { display: none; }
.ssm-more > summary::after, .ss-body details.ssm-more > summary::after, .ss-body details.ssm-more[open] > summary::after { content: none; }   /* 테마의 「펼치기 ▾」 대신 아래 「자세히 ▾」 알약 하나만 */
.ssm-more__t { flex: 1 1 200px; }
.ssm-more__b { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 4px; min-height: 40px; padding: 0 12px; border: 1px solid #16294a; border-radius: 999px; color: #16294a; font-weight: 700; white-space: nowrap; }
.ssm-more[open] > summary .ssm-more__b span { display: inline-block; transform: rotate(180deg); }
.ssm-more__in, .ss-body details.ssm-more > .ssm-more__in { margin: 0; padding: 4px 14px 8px; }
.ssm-more__in p { margin: 0 0 12px; }
/* 테마 본문(.ss-body a = 글 속 링크 꼴 · 위아래 -10px)이 단추에 닿지 않게 */
.ss-body a.ssm-btn { min-height: 52px; margin: 0; text-decoration: none; }
.ss-body a.ssm-b, .dx-veil a.ssm-b { min-height: 48px; margin: 0; text-decoration: none; }   /* (W-423) 공식 단추 그림 — 색 · 글자는 그림 안 */
.ss-body .ssm-pg .ssm-h { margin: 16px 0 8px; font-size: 1.125rem; }
.ss-body .ssm-sess { padding-left: 0; }
.ssm-h { margin: 16px 0 8px; font-size: 1.125rem; color: #16294a; }
.ssm-sess { margin: 0 0 12px; padding: 0; list-style: none; }
.ssm-sess__i { margin: 0 0 6px; padding: 10px 12px; border: 1px solid #ddd6c9; border-radius: 10px; }
.ssm-sess__i.is-here { border-color: #16294a; }
.ssm-sess__i span { color: #4a5362; }
.ssm-leave__box, .ssm-ask { margin: 0 0 14px; padding: 14px; border: 2px solid #16294a; border-radius: 14px; background: #fff; }
.ssm-leave__box p { margin: 0 0 10px; }
.ssm-ask { flex: 1 1 100%; text-align: left; font-size: 1.0625rem; line-height: 1.55; color: #1d2533; }
.ssm-ask__h { margin: 0 0 6px; font-size: 1.125rem; font-weight: 800; color: #16294a; }
.ssm-ask__t { margin: 0 0 12px; }
.ssm-ask__acts { display: flex; flex-wrap: wrap; gap: 8px; }
/* 아이폰의 카카오톡 아닌 앱 안 — 구글 단추 자리 */
.ssm-gnote { box-sizing: border-box; flex: 0 0 auto; width: 100%; max-width: 340px; padding: 8px 12px; border: 1px solid #747775; border-radius: 12px; background: #fff; color: #1F1F1F; }
.ssm-gnote__t { margin: 0 0 6px; font-size: 1rem; font-weight: 700; line-height: 1.4; }
.ssm-gnote__b { min-height: 44px; margin: 0; padding: 0 14px; border: 2px solid #16294a; border-radius: 10px; background: #fff; color: #16294a; font-family: inherit; font-size: 1rem; font-weight: 700; cursor: pointer; }
.ssm-gnote__m { margin: 6px 0 0; font-size: .9375rem; font-weight: 700; color: #8f5218; word-break: break-all; }
.ssm-gnote__m:empty { display: none; }
/* [가림막] · 전후 사례의 비회원 화면 — 「로그인 · 회원가입」 링크 자리의 단추 묶음 */
.ssm-veil { margin: 12px 0 0; text-align: left; }
.ssm-veil__t { margin: 0 0 8px; font-size: 1rem; line-height: 1.5; }
.ssm-veil .ssm-keep, .ssm-veil .ssm-note { color: inherit; }
/* 메뉴 · 꼬리줄의 「로그인」 한 줄 — 자리 · 크기는 테마(ss.css)의 그 줄 모양을 그대로 따름 */
/* W-421 완료 */
/* W-423 완료 */

/* 감독 10/11: 「병원 소식 받기」 카드 머리의 카카오톡 심볼(공식 파일 · 비율 그대로 24px · 자르기 · 색 · 둥근 가림 없음) */
.ssm-ch__mk { flex: none; width: 24px; height: auto; }
