@charset "utf-8";
/* 푸터 배경 공통 (kr/en/jpn/chn + recruit) — 2026-09-24
   흰 바탕 위에 /images/bg_foot1.png (위 네이비 → 아래 초록 세로 그라데이션, 3763x695, 불투명도 약 15% 원본 그대로).
   → 아주 옅은 파랑→연두 배경이 되므로 기존 흰 글자·흰 선을 네이비(#10213f) 계열로 바꾼다.
   세로 그라데이션이라 푸터 크기에 맞춰 늘려도(100% 100%) 모양이 변하지 않는다.
   각 언어 style*.css 의 #_footer 규칙 뒤에 로드한다. */
#_footer {background: #ffffff url(/images/bg_foot1.png) center top / 100% 100% no-repeat !important;}

/* 글자: 흰색 → 네이비 */
#_footer .foot_menu > ul > li > a,
#_footer .foot_menu > ul > li ul li a,
#_footer .auth em,
#_footer .sns em,
#_footer .Newsletter em,
#_footer .Newsletter ul li span,
#_footer p.copyright,
#_footer .scroll_top span,
#_footer .company_policy ul > li > a,
.company_policy ul > li > a {color: #10213f !important;}
#_footer .foot_menu > ul > li ul li a:hover,
#_footer .company_policy ul > li > a:hover {color: #1f5baa !important;}
/* 메뉴 제목 밑줄·정책 링크 구분자: 어두운 청회색(#4e7081) → 옅은 네이비 */
#_footer .foot_menu > ul > li > a {border-bottom-color: rgba(16, 33, 63, .2) !important;}
#_footer .company_policy ul > li > span,
.company_policy ul > li > span {color: rgba(16, 33, 63, .35) !important;}
/* TOP 버튼: 흰 테두리·흰 화살표 → 네이비 */
#_footer .scroll_top {border-color: #10213f !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1.5 7.5 7 2l5.5 5.5' fill='none' stroke='%2310213f' stroke-width='1.6'/%3E%3C/svg%3E") !important;}

/* ── [2026-09-24b] 푸터 정리 ─────────────────────────────────────────────
   - 첫 열: 제품 → 법적고지 (예전 하단 정책 링크 줄 .company_policy 를 이 열로 옮기고 줄은 삭제 — 마크업 쪽 변경)
   - 오른쪽(Authentication / Network Services / Newsletter): Pretendard, 제목을 왼쪽 열 제목과 같은 형식
     (같은 크기·색, 아래 옅은 선)으로 맞춰 따로 놀지 않게. 인증 로고 뒤 남색 띠(ul.mark 배경 #01324b) 제거
   - TOP 버튼 테두리 제거
   - 저작권 줄: 페이지 가운데, 언어별 글꼴 SemiBold (#_footer.hu_lang_{kr|en|jpn|chn})
   - 높이: PC 기준 이전보다 50px 낮게 (위아래 padding 조정, 아래 값) */
@font-face {font-family: 'Pretendard'; font-weight: 400; font-style: normal; font-display: swap; src: url('/font/Pretendard-Regular.woff2') format('woff2');}
@font-face {font-family: 'Pretendard'; font-weight: 600; font-style: normal; font-display: swap; src: url('/font/Pretendard-SemiBold.woff2') format('woff2');}
@font-face {font-family: 'Pretendard JP'; font-weight: 600; font-style: normal; font-display: swap; src: url('/font/PretendardJP-SemiBold.woff2') format('woff2');}
@font-face {font-family: 'Sarasa Gothic SC HU'; font-weight: 600; font-style: normal; font-display: swap; src: url('/font/SarasaGothicSC-SemiBold-subset.woff2') format('woff2');}

/* 메뉴 줄의 빈 칸(<li></li>, kr 에만 있음)이 130px 을 차지해 오른쪽 열이 아래로 밀리던 것 방지 */
#_footer .foot_menu > ul > li:not(:has(*)) {display: none;}

/* 오른쪽 열 */
#_footer .right, #_footer .right * {font-family: 'Pretendard', 'Noto Sans KR', sans-serif;}
#_footer.hu_lang_chn .right, #_footer.hu_lang_chn .right * {font-family: 'Pretendard', 'Sarasa Gothic SC HU', 'Microsoft YaHei', sans-serif;}
#_footer .right {width: 300px;}
#_footer .auth, #_footer .Newsletter {margin: 0 0 18px;}
#_footer .Newsletter {margin-bottom: 0;}
#_footer .auth em, #_footer .Newsletter em {display: block; font-size: 17px; font-weight: 600; line-height: 1;
	padding-bottom: 10px; margin-bottom: 12px; border-bottom: 1px solid rgba(16, 33, 63, .2);}
#_footer .Newsletter em:empty {display: none;}
#_footer .auth ul, #_footer .Newsletter ul {margin-top: 0;}
#_footer .mark, #_footer ul.mark {background: none !important;}
#_footer .mark li {margin: 0 8px 0 0;}
/* Network Services(.sns) 블록은 2026-09-24 마크업에서 삭제 */
/* 뉴스레터: float(230x40 고정) 이라 열 높이에 안 잡혀 저작권 줄과 겹쳤다 → 그리드 (1줄 국가 선택 / 2줄 이메일 + SEND) */
#_footer .Newsletter ul li {float: none; width: 100%; height: auto; margin: 0; display: grid; grid-template-columns: 1fr 64px; gap: 6px;}
#_footer .Newsletter ul li select {grid-column: 1 / -1; height: 32px;}
#_footer .Newsletter ul li input {height: 32px !important; margin: 0 !important; padding: 0 8px !important; min-width: 0;}
#_footer .Newsletter ul li button {width: 100%; height: 32px; margin: 0; border: 0; border-radius: 3px;}
#_footer .Newsletter select,
#_footer .Newsletter input {border: 1px solid rgba(16, 33, 63, .3) !important; border-radius: 3px; color: #10213f; background: #fff;}

/* TOP 버튼 테두리 제거 */
#_footer .scroll_top {border: 0 !important;}

/* 저작권 줄: 가운데 + 언어별 SemiBold */
#_footer .foot_address {clear: both; float: none; width: 100%; text-align: center;}
#_footer p.copyright {float: none; display: block; margin: 30px 0 0; font-weight: 600; text-align: center;}
/* 두 번째 줄(채용 푸터의 관리자 문의 안내 등)은 바로 아래에 */
#_footer p.copyright + p.copyright {margin-top: 4px;}
#_footer.hu_lang_kr p.copyright, #_footer.hu_lang_en p.copyright {font-family: 'Pretendard', 'Noto Sans KR', sans-serif;}
#_footer.hu_lang_jpn p.copyright {font-family: 'Pretendard JP', 'Pretendard', 'Meiryo', sans-serif;}
#_footer.hu_lang_chn p.copyright {font-family: 'Sarasa Gothic SC HU', 'Microsoft YaHei', 'PingFang SC', sans-serif;}

/* 높이: PC(1025px~) 모든 언어·모든 페이지 350px, padding 없음, 내용은 세로 가운데 (2026-09-24 확정.
   400px 고정 → 여백 15px 가변을 거쳐 결정). min-height 라서 평소엔 항상 350px 이고,
   화면이 좁아 내용이 넘칠 때만 잘리지 않고 늘어난다 (뉴스레터 입력칸이 잘리면 안 됨) */
@media screen and (min-width: 1025px) {
	#_footer {box-sizing: border-box; height: auto; min-height: 350px; padding: 0 !important;
		display: flex; flex-direction: column; justify-content: center;}
	#_footer > .inner {flex: 0 0 auto;}
	/* 왼쪽 여백 축소: 본문 1200 폭 대신 1400 폭. 좁은 화면에서는 양옆 100px(TOP 버튼 자리)을 남기고 줄어든다 */
	#_footer > .inner {width: min(1400px, calc(100% - 200px)); max-width: none;}
	#_footer .scroll_top {right: -90px;}
	/* 메뉴 5칸(130+20) + 오른쪽 280 = 1030px → 화면 1230px 이상 한 줄 */
	#_footer .foot_menu > ul > li {margin-right: 20px;}
	#_footer .right {width: 280px;}
}
/* 1025~1279px: 메뉴 칸을 118+12 로 좁혀 5칸 650 + 280 = 930px → 화면 1130px 까지 한 줄 (그보다 좁으면 오른쪽 열이 아래로) */
@media screen and (min-width: 1025px) and (max-width: 1279px) {
	#_footer .foot_menu > ul > li {width: 118px; margin-right: 12px;}
}

/* 클릭(포커스) 시 bootstrap a:focus 의 검정 둥근 테두리 제거 */
#_footer a:focus, #_footer a:active, #_footer button:focus, #_footer select:focus, #_footer input:focus {outline: none; box-shadow: none;}
/* 입력칸은 테두리 대신 선 색으로 포커스 표시 */
#_footer select:focus, #_footer input:focus {border-color: #1f5baa !important;}

/* 태블릿·모바일(~1024px): 높이 축소 (2026-09-24 요청). 위아래 padding 을 2/3 줄임 (태블릿 35→12px, 모바일 30→10px),
   오른쪽 블록 위 간격 35→20px, 저작권 줄 위 간격 30→16px */
@media screen and (max-width: 1024px) {
	#_footer {padding: 12px 0 !important;}
	#_footer .right {margin-top: 20px !important;}
	#_footer p.copyright {margin-top: 16px;}
}
/* 모바일(~767px): 레이아웃 압축 (2026-09-24). 위아래 여백 12px(0 이면 제목이 푸터 윗선에 붙는다),
   메뉴 5칸을 3열 격자로 촘촘히, 인증 로고와 뉴스레터를 한 줄에 나란히, 저작권 11px, TOP 은 저작권 줄 오른쪽 */
@media screen and (max-width: 767px) {
	#_footer {padding: 12px 0 !important;}
	#_footer > .inner {padding: 0 14px;}
	#_footer .foot_menu > ul {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 14px;}
	#_footer .foot_menu > ul > li,
	#_footer .foot_menu > ul > li:nth-child(-n + 3) {width: auto; margin: 0 !important;}
	#_footer .foot_menu > ul > li > a {font-size: 13px; padding-bottom: 6px;}
	#_footer .foot_menu > ul > li ul {margin-top: 6px;}
	#_footer .foot_menu > ul > li ul li a {font-size: 12px; line-height: 17px;}
	/* 띄어쓰기 없는 긴 항목(chn 拒绝擅自收集电子邮箱地址 등)이 옆 칸으로 넘치지 않게 */
	#_footer .foot_menu > ul > li a {overflow-wrap: anywhere; word-break: break-word;}
	#_footer.hu_lang_chn .foot_menu > ul > li a, #_footer.hu_lang_jpn .foot_menu > ul > li a {word-break: break-all;}
	#_footer .right {width: 100%; margin-top: 14px !important; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 14px; align-items: start;}
	#_footer .auth, #_footer .Newsletter {float: none; margin: 0;}
	#_footer .Newsletter:not(:has(select)) {display: none;}
	#_footer .auth em, #_footer .Newsletter em {font-size: 13px; padding-bottom: 6px; margin-bottom: 8px;}
	#_footer .mark li {margin: 0 6px 0 0;}
	#_footer .mark li:last-child {margin-right: 0;}
	#_footer .mark li img {width: 32px !important; height: auto;}
	#_footer .Newsletter ul li {grid-template-columns: 1fr 48px; gap: 4px;}
	#_footer .Newsletter ul li select,
	#_footer .Newsletter ul li input,
	#_footer .Newsletter ul li button {height: 28px !important; font-size: 12px;}
	#_footer p.copyright {margin-top: 12px; padding: 0 44px; font-size: 11px; line-height: 16px;}
	#_footer .scroll_top {top: auto; bottom: 0; right: 14px; width: 36px; height: 36px; padding-top: 18px;}
}
