@charset "UTF-8";
/* ==========================================================
   WHOMI TRANS - 언어 토글 / 언어별 폰트 / RTL
   ========================================================== */

/* ---------- 언어 토글 ---------- */
.lang_toggle { position:relative; line-height:1; }
.lang_toggle_btn { display:inline-flex; align-items:center; gap:6px; height:36px; padding:0 12px; font-size:14px; font-weight:700; color:#1e2a4a; white-space:nowrap; border-radius:8px; background-color:#eef2fa; transition:background-color 0.15s; }
.lang_toggle_btn:hover,
.lang_toggle.open .lang_toggle_btn { background-color:#e2e9f7; }
.lang_toggle_btn:before { content:''; display:inline-block; width:16px; height:16px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232f6fd6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M2 12h20'/%3E%3Cpath d='M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z'/%3E%3C/svg%3E") center center / contain no-repeat; }
.lang_toggle_btn:after { content:''; display:inline-block; width:0; height:0; border-left:4px solid transparent; border-right:4px solid transparent; border-top:5px solid #1e2a4a; transition:transform 0.15s; }
.lang_toggle.open .lang_toggle_btn:after { transform:rotate(180deg); }

.lang_toggle_menu { display:none; position:absolute; top:calc(100% + 10px); right:0; z-index:100; box-sizing:border-box; width:236px; padding:18px 10px 10px; text-align:left; border:1px solid #e6eaf2; border-radius:14px; background-color:#fff; box-shadow:0 12px 32px rgba(15,30,70,0.14); }
.lang_toggle.open .lang_toggle_menu { display:block; }
.lang_toggle_ttl { padding:0 12px 10px; font-size:12px; font-weight:700; letter-spacing:0.08em; color:#9aa3b5; }
.lang_toggle_menu li + li { margin:0 !important; }
.lang_toggle_menu a { display:flex; align-items:center; gap:12px; padding:11px 12px; border-radius:8px; color:#1e2a4a; transition:background-color 0.15s; }
.lang_toggle_menu a:hover,
.lang_toggle_menu a:focus-visible { background-color:#f2f6fd; outline:0; }
.lang_toggle_radio { flex:none; box-sizing:border-box; width:16px; height:16px; border:1.5px solid #7d8698; border-radius:50%; }
.lang_toggle_menu a.on .lang_toggle_radio { border:2px solid #2350b5; box-shadow:inset 0 0 0 2.5px #fff; background-color:#2350b5; }
.lang_toggle_code { flex:none; width:22px; font-size:11px; font-weight:700; color:#8a93a6; }
.lang_toggle_name { font-size:15px; font-weight:700; }

@media screen and ( max-width:1023px ) {
    .lang_toggle_menu { position:static; width:100%; margin-top:8px; padding:12px 4px 4px; box-shadow:none; }
    .lang_toggle_menu a { padding:9px 8px; }
}

/* ---------- 한국어 외 페이지: 카카오톡 채널 숨김 ---------- */
.lang_hide { display:none !important; }

/* ---------- 언어별 폰트 ---------- */
html[lang="zh-CN"] body, html[lang="zh-CN"] body * { font-family:'Noto Sans SC', 'Noto Sans KR', sans-serif; }
html[lang="ja"] body, html[lang="ja"] body * { font-family:'Noto Sans JP', 'Noto Sans KR', sans-serif; }
html[lang="vi"] body, html[lang="vi"] body * { font-family:'Noto Sans', 'Noto Sans KR', sans-serif; }
html[lang="ar"] body, html[lang="ar"] body * { font-family:'Noto Sans Arabic', 'Noto Sans KR', sans-serif; }

/* ---------- 아랍어 RTL ----------
   기존 레이아웃(슬라이더·절대배치)은 좌→우 구조를 유지하고,
   문단 단위로 아랍어 텍스트 방향(우→좌)을 적용 */
html[dir="rtl"] body { direction:ltr; }
html[dir="rtl"] body :is(h1, h2, h3, h4, h5, h6, p, li, dt, dd, th, td, label, strong, b, span, i, em, a, button, input, textarea) { unicode-bidi:plaintext; }
html[dir="rtl"] .lang_toggle_menu a { unicode-bidi:normal; }

/* ---------- 외국어 텍스트 길이 대응 ---------- */
@media screen and ( min-width:1025px ) {
    html:not([lang="ko"]) .service_b01 li { height:auto; min-height:500px; }
}