@charset "UTF-8";
/* =========================================================================
 * en-override.css — 영문(locale=en) 전용 보정
 *
 * 로드 위치 : WEB-INF/jsp/include/includeTaglib.jsp, includeSimple.jsp 에서
 *             locale.language eq 'en' 일 때만, 모든 CSS 뒤에.
 * 원칙      : 선택자를 전부 body.en 하위로 한정 → 국문 화면에는 영향 없음.
 *             값은 새로 만들지 않고 프로젝트가 이미 갖고 있던 의도를 따른다.
 * 배경      : 국·영문이 같은 JSP + 같은 css_ko 를 쓰는데, 레이아웃 수치가
 *             전부 한글 글자수 기준이라 영문에서 넘치거나 겹친다.
 * ========================================================================= */

/* -------------------------------------------------------------------------
 * G1. 영단어가 중간에서 잘림
 *     css_ko/reset.css:27  body{ word-break:break-all }  ← 한글용
 *     영문 원본 스타일시트  css_en/reset.css:59 는 keep-all 이었다. 그 의도를 복원.
 *     증상: "Arti/cle 29", "gui/delines", 푸터 "Yuse/ong-gu"  (전 페이지)
 * ------------------------------------------------------------------------- */
body.en,
body.en .pink-wtwobox > div,
body.en .txt.bka {
	word-break: keep-all;
	overflow-wrap: break-word;
}

/* -------------------------------------------------------------------------
 * G2. 헤더 우측 유틸(Login·Institution Login·Sign Up·Korean)이 두 줄로 밀림
 *     layout2022Device.css:595 의 .en .menulist{padding:0 60px} 는 한글 GNB 기준.
 *     영문 라벨(Introduction/Registration/Preparation)이 길어 1440px에서 약 66px 모자란다.
 *     실측: 메뉴 콘텐츠 폭 1112px + 유틸 320px > 컨테이너 → 마지막 항목이 개행.
 * ------------------------------------------------------------------------- */
@media (min-width: 1172px) {
	.en [class^="head"] .menu .menulist { padding: 0 38px; }
	.en [class^="head"] [class^='lev']  { padding-left: 38px; }
	.en [class^="head"] .menu .menulist.suport { padding: 0 6px; }
	.en [class^="head"] .menu .menulist.bar    { padding: 0 8px; }
}

/* -------------------------------------------------------------------------
 * P1. 카드 고정높이(350px) 밖으로 본문이 넘쳐 다음 섹션과 겹침
 *     common.css:11688 / device-width.css:979
 *         [class^='design-base-box-'] { height:350px }        ← 한글 글자수 기준
 *     영문은 2~3배 길어 최대 114px 넘친다(intro/topcit 개발배경·특징·주관부서).
 *     레거시가 이미 쓰던 관례(.en-css-ver → height:auto, common.css:14156~)를
 *     영문 전역으로 넓힌 것. min-height 로 남겨 한 줄 카드 높이는 그대로 맞춘다.
 * ------------------------------------------------------------------------- */
.en [class^='design-base-box-'] {
	height: auto;
	min-height: 350px;
}
.en [class^='design-base-box-'] > ul > li:not(.tit) {
	text-align: left;
	word-spacing: 0;
}

/* P1-a. 카드를 담은 swiper 는 Swiper JS 가 wrapper 에 인라인 height 를 박는다.
 *       카드가 커지기 전 값(350px)으로 굳어 컨테이너가 같이 잘리므로 풀어준다.
 *       본문(.article) 안으로만 한정 — 서브탭(depth2-box)은 subBanner, 메인 배너
 *       (#content1 .banner)는 home 에 있고 home 엔 .article 자체가 없어 안 걸린다.
 *       id="article" 이 있는 페이지와 class 만 있는 페이지가 섞여 있어 클래스로 잡는다. */
.en .article .swiper-wrapper { height: auto !important; }
.en .article .swiper-slide   { height: auto; }

/* -------------------------------------------------------------------------
 * P2. 표 셀이 nowrap 이라 글자가 옆 칸 위로 넘어감
 *     .table-box table 은 table-layout:fixed + td{white-space:nowrap}.
 *     한글은 컬럼폭 안에 들어가지만 영문은 최대 152px 침범한다(intro/question).
 *     줄바꿈만 허용하면 colgroup 폭은 손대지 않고 해결된다.
 * ------------------------------------------------------------------------- */
.en .table-box table td,
.en .table-box table th { white-space: normal; }

/* -------------------------------------------------------------------------
 * P3. 이용약관(site/terms) 영문 페이지 전체가 백지
 *     약관 본문은 DB(menuVO.content)에서 온다.
 *     국문 콘텐츠는 overlayScrollbars 초기화가 블록주석으로 막혀 있는데
 *     영문 콘텐츠에는 그대로 살아 있고 sizeAutoCapable:false 라서
 *     .docform(os-host) 높이가 0 으로 접힌다 → 본문 3200px 이 통째로 안 보임.
 *     ※ 근본 수정은 DB 영문 콘텐츠에서 그 <script> 를 국문과 같이 제거하는 것.
 *       여기서는 접힌 래퍼를 되살려 화면부터 정상화한다.
 * ------------------------------------------------------------------------- */
.en .docform.os-host,
.en .docform .os-padding,
.en .docform .os-viewport,
.en .docform .os-content {
	position: static !important;
	height: auto !important;
	max-height: none !important;
	overflow: visible !important;
}
.en .docform .os-scrollbar { display: none !important; }