/* ==========================================================
   공용 헤더(모바일)/푸터 스타일 — 메인 페이지와 같은 모양을 FAQ·가이드 페이지에서 재사용
   메인(index.html)의 푸터·언어선택 규칙을 그대로 가져오고, 모바일 헤더/메뉴 규칙은 site.css 에서 가져옴.
   ========================================================== */
#mHeader,#mHeader *,#nav,#nav *,footer#footer,footer#footer *,.chrome-bg{margin:0;padding:0;box-sizing:border-box;}
#mHeader,#nav,footer#footer{font-family:inherit;line-height:1.2;letter-spacing:0;text-align:left;}
#mHeader a,#nav a{text-decoration:none;}
#mHeader h1{font-size:inherit;font-weight:inherit;border:0;padding:0;margin:0;line-height:0;}
#mHeader{display:none;background:#fff;height:60px;text-align:center;position:fixed;top:0;left:0;width:100%;border-bottom:1px solid #f1f1f1;z-index:10;direction:ltr;}
#mHeader .btn_menu{display:block;text-indent:-9999em;overflow:hidden;white-space:nowrap;width:20px;height:17px;background:url(/suyu/images/m/btn_menu.png) no-repeat center/100% 100%;position:absolute;top:21px;left:20px;}
#mHeader .logo{display:inline-block;vertical-align:middle;margin-top:18px;}
#mHeader .logo img{display:block;height:25px;width:auto;}
#nav{background:#fff;width:295px;height:100%;position:fixed;left:-295px;top:0;z-index:100;transition:left .25s ease;direction:ltr;}
#nav.open{left:0;}
#nav ul{height:100%;overflow-y:auto;list-style:none;}
#nav ul li a{display:block;height:53px;line-height:53px;border-bottom:1px solid #e0e0e0;padding-left:45px;font-weight:700;font-size:15px;color:#333;}
#nav ul li a[aria-current]{color:#1a4d8f;}
#nav .btn_close{display:none;text-indent:-9999em;overflow:hidden;white-space:nowrap;background:url(/suyu/images/m/btn_close.png) no-repeat center/100% 100%;width:20px;height:20px;position:absolute;right:-40px;top:20px;}
#nav.open .btn_close{display:block;}
#mHeader.menu-open .hdr-lang{visibility:hidden;}
.chrome-bg{display:none;z-index:99;position:fixed;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.6);}
.chrome-bg.open{display:block;}
@media (max-width:1365px){
  #mHeader{display:block;}
  .langbar{display:none !important;}
  body.has-chrome{padding-top:86px;}
}
/* 푸터: 본문(860px) 밖으로 화면 전체 폭 */
body.has-chrome{padding-bottom:0 !important;}
html{overflow-x:hidden;overflow-x:clip;}
footer#footer.footer_bar{width:100vw;margin-left:calc(50% - 50vw);margin-top:70px;}
/* 아랍어(RTL) 페이지도 메인과 같이 푸터는 왼쪽→오른쪽 배치, 항목마다 방향을 격리해 구분선(|)이 제자리에 오게 함 */
[dir=rtl] footer#footer.footer_bar .footer_inner{direction:ltr;}
[dir=rtl] footer#footer.footer_bar .footer_meta>*{unicode-bidi:isolate;direction:ltr;}
/* ---- 아래: 메인 페이지 인라인 스타일(푸터·언어 선택)과 동일 ---- */

		/* 이미지 안에 있는 텍스트를 검색엔진/스크린리더용으로 노출 (화면에는 보이지 않음) */
		.sr-only{
		  position:absolute !important;
		  width:1px; height:1px;
		  padding:0; margin:-1px;
		  overflow:hidden;
		  clip:rect(0,0,0,0);
		  white-space:nowrap;
		  border:0;
		}

		/* =========================
		   FOOTER BAR (이미지 느낌)
		   - 글자 전부 흰색 통일
		   - 구분선/카피만 톤 다운
		   - 모바일 하단 고정버튼(.btn_bottom) 겹침 방지
		   ========================= */

		footer#footer.footer_bar{
		  background:#3C454E;
		  padding: 22px 0 16px;
		  color: rgba(255,255,255,.92); /* 기본 텍스트 흰색 통일 */
		}

		/* 기존 footer에 걸린 img 관련 스타일 영향 차단 */
		footer#footer.footer_bar img{ display:none !important; }

		footer#footer.footer_bar img.footer_logo{
		  display:block !important;
		}

		/* footer 안의 모든 텍스트/링크를 강제로 통일 (TEL만 튀는 문제 해결) */
		footer#footer.footer_bar,
		footer#footer.footer_bar *{
		  color: rgba(255,255,255,.92) !important;
		}

		footer#footer.footer_bar .footer_inner{
		  max-width: 1200px;
		  margin: 0 auto;
		  padding: 0 26px;
		  display:flex;
		  align-items:center;
		  justify-content:space-between;
		  gap: 24px;
		}

		footer#footer.footer_bar .footer_brand{
		  min-width: 320px;
		}

		/* 좌측 로고 텍스트 */
		footer#footer.footer_bar .brand_ko{
		  font-size: 24px;
		  font-weight: 700;
		  letter-spacing: 4px;
		  line-height: 1.3;
		}

		footer#footer.footer_bar .brand_en{
		  margin-top: 6px;
		  font-size: 10px;
		  letter-spacing: 2px;
		  opacity: .65; /* 흰색은 유지하되 톤만 살짝 낮춤 */
		}

		/* 우측 주소/전화/FAX */
		footer#footer.footer_bar .footer_meta{
		  flex:1;
		  min-width:0;
		  text-align:right;
		  font-size: 15px;
		  line-height: 1.8;
		  white-space: normal;
		  font-weight: 600;
		}

		/* 라벨(주소/TEL/FAX) */
		footer#footer.footer_bar .footer_meta .k{
		  font-weight: 800;
		}

		/* 구분선만 살짝 옅게 */
		footer#footer.footer_bar .footer_meta .sep{
		  margin: 0 10px;
		  color: rgba(255,255,255,.55) !important;
		}

		/* 링크(전화) 밑줄 제거 */
		footer#footer.footer_bar .footer_meta a{
		  text-decoration:none;
		  font-weight: 700;
		}

		/* 언어 선택(푸터) */
		footer#footer.footer_bar .langsel{display:inline-block;position:relative;vertical-align:baseline;}
		footer#footer.footer_bar .langsel summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:5px;font-weight:700;color:inherit;}
		footer#footer.footer_bar .langsel summary::-webkit-details-marker{display:none;}
		footer#footer.footer_bar .langsel svg{display:block;}
		footer#footer.footer_bar .langsel ul{list-style:none;margin:0;padding:6px;position:absolute;right:0;bottom:calc(100% + 6px);z-index:20;min-width:200px;background:#fff;border-radius:6px;box-shadow:0 4px 14px rgba(0,0,0,.3);text-align:left;}
		footer#footer.footer_bar .langsel li a{display:block;padding:6px 12px;color:#222 !important;font-weight:600;font-size:14px;white-space:nowrap;border-radius:4px;}
		footer#footer.footer_bar .langsel li a:hover{background:#eef2f7;color:#1a4d8f !important;}
		@media (max-width: 900px){footer#footer.footer_bar .langsel ul{right:auto;left:0;}}

		/* 언어 선택(헤더 우측 지구본) */
		#header .hdr-lang{position:absolute;right:24px;top:0;height:100px;display:flex;align-items:center;z-index:12;}
		#mHeader .hdr-lang{position:absolute;right:14px;top:0;height:60px;display:flex;align-items:center;z-index:12;}
		.hdr-langsel{position:relative;}
		.hdr-langsel summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;color:#fff;}
		.hdr-langsel summary::-webkit-details-marker{display:none;}
		.hdr-langsel summary svg{display:block;filter:drop-shadow(0 1px 2px rgba(0,0,0,.45));}
		.hdr-langsel summary:hover,.hdr-langsel[open] summary{background:rgba(255,255,255,.22);}
		/* 사이트 전역 *{color:#333} 이 svg 와 그 자식에 직접 적용되므로 아이콘 색을 명시 */
		#header .hdr-langsel summary svg,#header .hdr-langsel summary svg *{color:#fff;}
		#mHeader .hdr-langsel summary svg,#mHeader .hdr-langsel summary svg *{color:#333;}
		#mHeader .hdr-langsel summary{color:#333;}
		#mHeader .hdr-langsel summary svg{filter:none;}
		#mHeader .hdr-langsel summary:hover,#mHeader .hdr-langsel[open] summary{background:#eef2f7;}
		.hdr-langsel ul{list-style:none;margin:0;padding:6px;position:absolute;right:0;top:100%;margin-top:8px;z-index:30;min-width:200px;background:#fff;border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,.25);text-align:left;}
		.hdr-langsel li a{display:block;padding:8px 12px;color:#222;font-size:14px;font-weight:600;line-height:1.3;white-space:nowrap;border-radius:4px;text-decoration:none;letter-spacing:0;}
		.hdr-langsel li a:hover{background:#eef2f7;color:#1a4d8f;}
		.hdr-langsel li a[aria-current]{color:#1a4d8f;background:#f1f6fb;}
		/* 위의 #mHeader * {margin:0;padding:0} 가 더 우선이라 목록 간격이 사라지므로 아이디 선택자로 다시 지정 */
		#mHeader .hdr-langsel ul{padding:6px;margin:8px 0 0;}
		#mHeader .hdr-langsel li a{padding:8px 12px;line-height:1.3;}

		/* 카피는 한 단계만 옅게 */
		footer#footer.footer_bar .footer_copy{
		  margin-top: 14px;
		  text-align:center;
		  font-size: 11px;
		  letter-spacing: 1px;
		  color: rgba(255,255,255,.70) !important;
		}

		/* ========== 모바일 ========== */
		@media (max-width: 900px){
		  footer#footer.footer_bar .footer_inner{
			flex-direction: column;
			align-items:flex-start;
			gap: 10px;
		  }
		  footer#footer.footer_bar .footer_meta{
			text-align:left;
			white-space: normal;
			line-height: 1.8;
		  }
		}
		/* ===== footer_brand 로고 이미지 버전 ===== */
		footer#footer.footer_bar .footer_brand{
		  min-width: 320px;           /* 기존 레이아웃 유지 */
		  display:flex;
		  align-items:center;
		}

		footer#footer.footer_bar .footer_logo_link{
		  display:inline-flex;
		  align-items:center;
		  line-height: 0;             /* 이미지 주변 여백 방지 */
		}

		footer#footer.footer_bar .footer_logo{
		  width: 320px;               /* 원본 320*61 */
		  height: 61px;
		  display:block;
		  object-fit: contain;
		  /* 배경이 어두우면 로고가 어두울 수 있어서 약간 선명하게 */
		  filter: brightness(1.05) contrast(1.05);
		}

		/* 1200px 폭에서 우측 메타가 너무 길면 깨지므로, 공간 분배 안정화 */
		footer#footer.footer_bar .footer_meta{
		  flex: 1;
		  min-width: 0;
		}

		/* ===== 모바일 최적화 ===== */
		@media (max-width: 900px){
		  footer#footer.footer_bar .footer_brand{
			min-width: 0;
			width: 100%;
		  }
		  footer#footer.footer_bar .footer_logo{
			width: 260px;             /* 모바일에서 살짝 축소 */
			height: auto;
			max-width: 100%;
		  }
		}

		@media (max-width: 420px){
		  footer#footer.footer_bar .footer_logo{
			width: 220px;
		  }
		}


		/* 하단 고정 버튼(.btn_bottom) 겹침 방지 */
		@media (max-width: 768px){
		  footer#footer.footer_bar{
			padding-bottom: 94px; /* 95px에서 조금 넉넉하게 */
		  }
		}

		
[dir=rtl] footer#footer.footer_bar{margin-left:0;margin-right:calc(50% - 50vw);}

/* 모바일 하단 고정 버튼 — 메인(site.css)과 동일 */
.btn_bottom{display:none;position:fixed;bottom:0;left:0;width:100%;overflow:hidden;z-index:10;direction:ltr;margin:0;padding:0;}
.btn_bottom a{display:block;float:left;width:25%;background:#323232;margin:0;padding:0;}
.btn_bottom a:last-child{background:#1680c4;}
.btn_bottom a img{display:block;width:100%;height:auto;aspect-ratio:187/156;}
@media (max-width:767px){.btn_bottom{display:block;}}