/*스크롤바*/
body::-webkit-scrollbar { width: 10px; height:0px;}
body::-webkit-scrollbar-thumb { height: 25%; background: #595959; }
body::-webkit-scrollbar-track { background: rgba(0,0,0,0.0); }

/* 공용 */
.mt10 {margin-top:10px;}
.mt20 {margin-top:20px;}
.mt40 {margin-top:40px;}
.mt80 {margin-top:80px;}
.mb10 {margin-bottom:10px;}
.mb80 {margin-bottom:80px;}
.mtb20 {margin:20px 0;}
.mtb30 {margin:30px 0;}
.mbr {display: none;}
.pbr {display: block;}
.db {display: block;}
.of_h {overflow:hidden;}
.fc_gray {color:#b6b6b6; padding-left: 24px; padding-right: 80px;}
.img_box img {width:100%; display:block;}
.bg_color1 {background-color:#f8f8f8;}
#main {width: 100%; min-height:calc(100vh - 334px); position: relative;}
.tl {text-align:left !important;}
.br_540 {display:none;}
.dp_f {display:flex;}
@media screen and (max-width: 959px) {
	.wb {height:320px;}
}
.wb {width:100%; height:330px; background-color:#fff; position:absolute; top:-330px; left:0; }
 
.col12 {width:12%;}
.col38 {width:38%;}
@media screen and (max-width: 959px) {
	.col12 {width:100%;}
	.col38 {width:108%;}
}
/*-----------------------------------------*/
/* header */
/* h_active: 헤더 활성화 */
/* is-open: 메뉴 선택(드롭다운) */
/* .header{ width: 100%; height:60px; position: fixed; top: 0;left: 0; z-index: 999;} */
.header .header_inner {width:100%; height:100%; padding:0 20px; display: flex; justify-content: space-between;align-items:center;}
.header .header_inner .logo_wrap a {width:140px; height:59px; display:block; background: url(../images/logo/header_logo.png) no-repeat; background-size:contain; filter:invert(1) grayscale(100%) brightness(2); transition:0.01s; z-index:3; position:relative;}
.header .header_inner .menu_right_box {z-index:3; position:relative;}
/* CR-017(모양 B): 오른쪽 묶음을 가로로 — 제품 검색 칸 뒤에 스마트 스토어 작은 알약 버튼(수아 사진 값). 휴대폰은 아래 959px 구간에서 원래대로 숨김 */
.header .header_inner .menu_right_box {display:flex; align-items:center; gap:12px;}
.header .header_inner .menu_right_box .store_btn {display:inline-flex; align-items:center; gap:6px; height:40px; /* CR-017 보완2: 제품 검색 칸과 같은 높이(32→40) */ padding:0 12px 0 10px; box-sizing:border-box; border:1px solid rgba(255,255,255,.75); border-radius:999px; color:#fff; font-size:13px; font-weight:600; white-space:nowrap; text-decoration:none;}
.header.h_active .header_inner .menu_right_box .store_btn {color:#333; border-color:#9D9D9D;}
.header.sub .header_inner .menu_right_box .store_btn {color:#333; border-color:#9D9D9D;} /* CR-017 보완1(태양 F-2): 흰 배경 머리글에서도 보이게 — 검색 칸이 .sub 를 따로 맞춘 방식과 같게 */
/* SEC-08(수아 명세 ①): 로그아웃 버튼 — 옆의 스마트 스토어 버튼과 같은 알약(테두리·글자 크기·높이 40px).
   1300px 이상은 아이콘+글자(가로 91px), 960~1299px 는 아이콘만(40px) — 좁은 PC 에서 머리글이 붐비지 않게(수아 실측표).
   959px 이하는 .menu_right_box 자체가 숨겨지므로 휴대폰에서는 이 버튼이 안 보인다(아래 휴대폰 메뉴 버튼이 대신한다) */
.header .header_inner .menu_right_box .logout_btn {display:inline-flex; align-items:center; gap:6px; height:40px; padding:0 12px 0 10px; box-sizing:border-box; border:1px solid rgba(255,255,255,.75); border-radius:999px; color:#fff; font-size:13px; font-weight:600; white-space:nowrap; text-decoration:none;}
/* 6-3 6번(대표님 승인 10/1): reset.css 가 span 에 검정(#000)을 직접 걸어 로그아웃 글자만 버튼 색(흰색·#333)을 못 물려받았다 → 글자는 버튼 색을 따름(스마트 스토어와 같은 색) */
.header .header_inner .menu_right_box .logout_btn .logout_txt {color:inherit;}
.header.h_active .header_inner .menu_right_box .logout_btn {color:#333; border-color:#9D9D9D;}
.header.sub .header_inner .menu_right_box .logout_btn {color:#333; border-color:#9D9D9D;}
@media screen and ( max-width:1299px ){
	/* 글자를 접고 아이콘만 남긴다. 마우스를 올리면 title 로 '로그아웃'이 뜨고, 화면 읽기용 이름(aria-label)도 그대로다 */
	.header .header_inner .menu_right_box .logout_btn {width:40px; padding:0; gap:0; justify-content:center;}
	.header .header_inner .menu_right_box .logout_btn .logout_txt {display:none;}
}
/* SEC-08: 휴대폰 ≡ 메뉴 맨 아래 로그아웃 — 메뉴 제목 줄과 헷갈리지 않게 테두리 있는 버튼 모양.
   .nav_header_m 안에만 있는 줄이라 미디어쿼리 없이도 휴대폰 메뉴에서만 보인다(방문자 머리글 규칙은 건드리지 않는다) */
.header .header_inner .nav_header_m ul.lang_list li.logout_li {border:0;}
.header .header_inner .nav_header_m ul.lang_list li.logout_li .logout_btn_m {display:flex; align-items:center; justify-content:center; box-sizing:border-box; width:100%; height:52px; margin:10px 0 4px; border:1px solid #CFCFCF; border-radius:10px; color:#333; font-size:15px; font-weight:600; text-decoration:none;}
/* SEC-08: 로그인 화면 안내 두 가지(수아 명세 ①) — 파란 상자는 자동 로그아웃된 뒤에만, 회색 한 줄은 늘 보인다 */
.login .login_note {box-sizing:border-box; width:100%; margin:12px 0 0; padding:11px 14px; border-radius:8px; font-size:14px; line-height:1.55;}
.login .login_note.info {background:#EEF4FD; color:#074EAD; border:1px solid #C3D6F3;}
.login .auto_logout_note {margin:12px 0 0; color:#888; font-size:13px; line-height:1.55; text-align:center;}
/* SEC-17(수아 명세 ui-step3-visible.md ②): 로그인·비밀번호 바꾸기 창 빨간 안내 상자 — 모양은 파란 상자(.info)와 같은 규칙, 색만 빨강 */
.login .login_note.error {background:#FDEDEC; color:#B3261E; border:1px solid #F2B8B5; text-align:left; word-break:keep-all;}
.login .login_note[hidden] {display:none;}
/* SEC-07 화면(SEC-17 벌, 수아 명세 sec33 ③ ⓑ): 비밀번호 바꾸기 창 — 제목 20px 굵게 · 아이디 14px 회색 · 도움말 13px 회색 · 돌아가기 회색 밑줄 */
.login .pwchg_title {margin:6px 0 4px; font-size:20px; font-weight:700; text-align:center; color:#222;}
.login .pwchg_who {margin:0 0 18px; font-size:14px; color:#6B7280; text-align:center;}
.login .pwchg_who b {color:#333; font-weight:600;}
.login .pwchg_help {margin:8px 0 0; font-size:13px; line-height:1.5; color:#6B7280; text-align:left;}
.login .pwchg_back {margin:14px 0 0; text-align:center;}
.login .pwchg_back a {font-size:14px; color:#6B7280; text-decoration:underline; text-underline-offset:3px;}
.login .pwchg_help[hidden], .login .pwchg_back[hidden] {display:none;}
/* SEC-07 화면(SEC-17 벌, 수아 명세 sec33 ③ ⓐ): PC 메뉴판 입구 — 메뉴가 펼쳐진 동안만, 로그아웃 오른쪽 끝에 맞춰 26px 아래(자리는 js_top.jsp 스크립트) */
.header .header_inner .nav_header > ul > .pwchg_entry {display:none; position:fixed; z-index:5;}
.header .header_inner .nav_header > ul.is-open > .pwchg_entry {display:block;}
.header .header_inner .nav_header > ul > .pwchg_entry a {display:inline-flex; align-items:center; gap:6px; padding:6px 4px; font-size:15px; font-weight:500; color:#333; text-decoration:none; white-space:nowrap;}
/* 휴대폰 ≡ 메뉴: 로그아웃 바로 위 같은 모양 버튼, 버튼 사이 8px · 사이트 메뉴가 링크 뒤에 붙이는 + 표시는 버튼이라 뺀다 */
.header .header_inner .nav_header_m ul.lang_list li.pwchg_li .pwchg_btn_m {gap:8px; margin-bottom:0;}
.header .header_inner .nav_header_m ul.lang_list li.pwchg_li + li.logout_li .logout_btn_m {margin-top:8px;}
.header .header_inner .nav_header_m ul.lang_list li.logout_li a::after {content:none;}
/* SEC-09(C5): 올릴 수 없는 파일 안내 — 첨부 칸 바로 아래 빨간 상자(수아 명세 ui-step3-visible.md ③).
   모양은 ②(로그인 안내 .login_note)와 **같은 규칙**을 쓰고 색만 빨강 계열로 바꿨다 — 명세가 '②와 같은 모양' 이라 했다.
   화면 네 곳(게시판 글쓰기·글 고치기·갤러리 관리·계약)이 함께 쓴다. 알림창 대신 이 상자로 모아 보여 준다 */
.file_note {box-sizing:border-box; width:100%; margin:12px 0 0; padding:11px 14px; border-radius:8px; font-size:14px; line-height:1.55; text-align:left;}
.file_note.warn {background:#FDF1F0; color:#B3261E; border:1px solid #F4C9C5;}
.file_note .file_note_allow {display:block; margin:2px 0 0; color:#8A4B45;}
.header .header_inner .store_link_m {display:none;}
/* CR-028: 휴대폰 돋보기 묶음·검색 칸은 PC 에선 안 보임. 머리글 안의 hidden 은 아래 display 규칙보다 늘 이긴다(닫힌 검색 칸·숨긴 돋보기) */
.header .header_inner .m_search_group, .header .header_inner .m_search_box {display:none;}
/* CR-027: 제품명 자동완성 후보 목록(수아 사진 s10-after-pc) — 폭 360px, 검색 칸 6px 아래. 오른쪽 끝을 오른쪽 묶음(스마트 스토어 버튼) 끝에 맞춤
   (사진처럼 검색 칸 왼쪽에 맞추면 960~1920px 화면에서 53~60px 가 화면 밖으로 나감 — 실측). 휴대폰 목록은 아래 959px 규칙 */
.header .header_inner .srch_suggest {position:absolute; right:0; top:calc(100% + 6px); width:360px; box-sizing:border-box; padding:6px; background:#fff; border:1px solid #E2E2E2; border-radius:14px; box-shadow:0 14px 32px rgba(0,0,0,.16); z-index:20; text-align:left;}
.header .header_inner .srch_suggest_m {display:none;}
.header .header_inner .srch_suggest .srch_sg_row {display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:10px; text-decoration:none; color:#222;}
.header .header_inner .srch_suggest .srch_sg_row:hover, .header .header_inner .srch_suggest .srch_sg_row[aria-selected="true"] {background:#F2F5FA;}
.header .header_inner .srch_suggest .srch_sg_row img, .header .header_inner .srch_suggest .srch_sg_noimg {flex:none; width:32px; height:32px; border-radius:6px; object-fit:cover; background:#F1F3F6;}
.header .header_inner .srch_suggest .srch_sg_txt {display:flex; flex-direction:column; min-width:0; line-height:1.35;}
.header .header_inner .srch_suggest .srch_sg_tit {font-size:13px; font-weight:500; color:#222; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.header .header_inner .srch_suggest .srch_sg_cat {font-size:11.5px; color:#888; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.header .header_inner .srch_suggest .srch_sg_more {display:block; margin-top:4px; padding:9px 10px 7px; border-top:1px solid #EFEFEF; font-size:12px; color:#999; text-align:center; text-decoration:none;}
.header .header_inner .srch_suggest .srch_sg_more:hover, .header .header_inner .srch_suggest .srch_sg_more[aria-selected="true"] {background:#F2F5FA; color:#555;}
.header .header_inner [hidden] {display:none !important;}
.header .header_inner .nav_header {z-index:2;}
.header .header_inner .nav_header > ul { display:flex;}
.header .header_inner .nav_header > ul > li { width:130px; text-align:center; position:relative; overflow:hidden;}
.header .header_inner .nav_header > ul > li > ul.sub_menu {opacity: 0; position: absolute; display:flex; flex-direction:column; z-index:5000; width:100%; transform:translateY(-10px);}
.header .header_inner .nav_header > ul > li > ul.sub_menu > li {height:40px; line-height:40px;}
.header .header_inner .nav_header > ul > li > ul.sub_menu > li > a {font-size:16px; display:block;}
.header .header_inner .nav_header > ul.is-open > li {overflow: initial;}
.header .header_inner .nav_header > ul.is-open > li > ul.sub_menu {opacity:1; transform:translateY(0); transition:transform .3s ease,opacity .2s linear; transition-delay: .2s; padding-top:16px;}
.header .header_inner .nav_header > ul.is-open > .sub_menu_bg {opacity:1; transform:scaleY(1); visibility:visible; transition:transform .25s ease,opacity 0ms,visibility 0ms;}
.header .header_inner .nav_header > ul.is-open > li:hover > a.main_menu:after {width:100%; left:0;}
.header .header_inner .menu_right_box .search_box {width: 160px; height: 40px; border: 1px solid #9d9d9d; /*background-color:#f5f5f5;*/ box-sizing: border-box; border-radius: 50px; padding:0 15px; display: flex; align-items: center;}
.header .header_inner .menu_right_box .search_box input {width: 100%; height: 38px; border: none; box-sizing: border-box; display: inline-block; font-size: 15px; background: transparent; filter:invert(1) grayscale(100%) brightness(2);}
.header .header_inner .menu_right_box .search_box .search_button { width: 40px; height: 40px; margin-right: 0; border: 0; background-color: transparent; text-align: center; line-height: 45px; }
.header .header_inner .menu_right_box .search_box .search_button:before {content: ""; width: 40px; height: 40px; display: block; background: url(../images/common/icon_search.svg) no-repeat center; filter:invert(1) grayscale(100%) brightness(2);}

.header{ width: 100%; height:70px; position: fixed; top: 0;left: 0; z-index: 9; /*background-color:#fff;*/}
/* .header .header_inner .logo_wrap {padding: 40px 18px 12px; background-color: #074ead;} */
.header .header_inner .nav_header > ul > li > a.main_menu {height:70px; line-height:70px; font-size:19px; font-weight:600; display:block; filter:invert(1) grayscale(100%) brightness(2);}
.header .header_inner .nav_header > ul > .sub_menu_bg {opacity: 0; position: absolute; left:0; width:100%; height:330px; z-index:-1; background-color: #fff; transition: transform .25s ease,opacity .25s linear .1s,visibility 0ms linear .1s; transform-origin: top center; transform: translateY(-330px);}
/* CR-009(C-1): PC 메뉴판에 옅은 그림자·윗선·아래 둥근 모서리 — "떠 있는 층"처럼 (내려오는 움직임은 위 규칙 그대로) */
.header .header_inner .nav_header > ul > .sub_menu_bg {box-shadow:0 14px 32px rgba(0,0,0,0.22), 0 2px 6px rgba(0,0,0,0.08); border-top:1px solid #ECECEC; border-radius:0 0 16px 16px;}
.header .header_inner .nav_header > ul > li.active > a {font-weight:700;}

@media screen and ( max-width:1440px ){
	.header .header_inner .nav_header > ul > li { width:100px;}
	.header .header_inner .nav_header > ul > li > a.main_menu {font-size:17px;}
}
@media screen and ( max-width:1200px ){
}
@media screen and ( max-width:959px ){
	.header {height:60px;}
	.header .header_inner {background-color:#fff; box-shadow: rgba(149, 157, 165, 0.15) 0px 3px 6px 0px; /*flex-direction:row-reverse;*/}
	.header .header_inner .nav_header > ul { display:none;}
	.header .header_inner .logo_wrap a {width:124px; height:52px; z-index:1;}
	.header .header_inner .menu_right_box {display: none; align-items: center; z-index:3; position:relative;}
	.header .header_inner .menu_right_box .search_box {display:none;}
	/* CR-017: 휴대폰 머리글 스마트 스토어 작은 링크 — ≡ 버튼 왼쪽, 세로 가운데 */
	.header .header_inner {position:relative;}
	.header .header_inner .store_link_m {display:inline-flex; align-items:center; position:absolute; right:52px; top:50%; transform:translateY(-50%); color:#333; font-size:12.5px; font-weight:600; white-space:nowrap; text-decoration:none;}
	/* CR-028: 돋보기 + 스마트스토어를 한 묶음으로 링크가 있던 자리(≡ 왼쪽 52px·세로 가운데)에. 묶음 안의 링크는 제자리 흐름으로(모양은 CR-017 그대로).
	   z-index 를 두지 않는다 — ≡ 메뉴 판(.nav_header_m z-index 2)이 열리면 묶음을 덮어야 한다(CR-017 F-3 교훈) */
	.header .header_inner .m_search_group {display:flex; align-items:center; gap:6px; position:absolute; right:52px; top:50%; transform:translateY(-50%);}
	.header .header_inner .m_search_group .store_link_m {position:static; transform:none;}
	.header .header_inner .m_search_toggle {display:flex; align-items:center; justify-content:center; width:34px; height:34px; padding:0; border:0; background:transparent; color:#333; cursor:pointer;}
	/* CR-028: 펼친 검색 칸 — 머리글 아래 새 줄(수아 사진 .x-searchbox-m 값): 흰 알약 44px, 좌우 16px, 테두리 #CFCFCF, 그림자 */
	.header .header_inner .m_search_box {position:absolute; left:16px; right:16px; top:calc(100% + 8px); height:44px; box-sizing:border-box; background:#fff; border:1px solid #CFCFCF; border-radius:999px; align-items:center; padding:0 6px 0 16px; box-shadow:0 8px 20px rgba(0,0,0,.12);}
	.header .header_inner .m_search_box:not([hidden]) {display:flex;}
	.header .header_inner .m_search_box input {flex:1; min-width:0; height:40px; border:0; outline:0; font-size:14px; background:transparent; color:#222;}
	.header .header_inner .m_search_box .m_search_submit {display:flex; align-items:center; justify-content:center; width:36px; height:36px; padding:0; border:0; background:transparent; color:#111; cursor:pointer;}
	/* CR-027: 휴대폰 후보 목록(수아 사진 s10-after-m) — 펼친 검색 칸(머리글 8px 아래·높이 44px) 8px 아래, 좌우 16px */
	.header .header_inner .srch_suggest_m {left:16px; right:16px; width:auto; top:calc(100% + 60px);}
	.header .header_inner .srch_suggest_m:not([hidden]) {display:block;}
}
@media screen and ( max-width:479px ){
	.header .header_inner {padding: 0 16px;}
}
/* 헤더 블러 */
.pre-scrim {opacity:0;z-index:1;visibility:hidden;display:block;position:fixed;top:0;bottom:0;left:0;right:0;transition:opacity .2s,visibility 0s linear .25s}
.pre-scrim.is-open{/*transform:scaleY(1); */opacity:1;visibility:visible;transition:opacity .8s ease,visibility 0s;}
@supports not (backdrop-filter:blur(4px)){.pre-scrim{background-color:hsla(0,0%,7%,.36)}}
@supports (backdrop-filter:blur(4px)) or (-webkit-backdrop-filter:blur(4px)){.pre-scrim{background-color:hsla(0,0%,7%,.36);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);}}

/* header h_active */
.header.h_active {box-shadow: rgba(149, 157, 165, 0.15) 0px 3px 6px 0px; transition: all ease-in-out .3s;}
.header.h_active .header_inner {filter:none;}
.header.h_active .header_inner .logo_wrap a{filter:none;}
.header.h_active .header_inner .nav_header > ul > li > a.main_menu {filter:none;}
.header.h_active .header_inner .nav_header > ul > li:hover > a.main_menu {/*color:#031aba;*/ font-weight:700;}
.header.h_active .header_inner .nav_header > ul > li > a.main_menu:after {height:3px; background:#000; content:''; position:absolute; left:50%; bottom:0; transition: all ease-in-out .3s; width:0;}
.header.h_active .header_inner .nav_header > ul > li > ul.sub_menu > li > a:hover { font-weight:500;}
.header.h_active .header_inner .menu_right_box .search_box input { filter: none;}
.header.h_active .header_inner .menu_right_box .search_box .search_button:before  { filter: none;}

/* sub header */
.header.sub {box-shadow: rgba(149, 157, 165, 0.15) 0px 3px 6px 0px}
.header.sub .header_inner {background-color:#fff;}
.header.sub .header_inner .logo_wrap a{filter:none;}
.header.sub .header_inner .nav_header > ul > li > a.main_menu { filter:none;}
.header.sub .header_inner .menu_right_box .search_box input { filter: none;}
.header.sub .header_inner .menu_right_box .search_box .search_button:before  { filter: none;}

/* nav_header_m*/
.nav_header_m {
	display:none;
}

@media screen and (max-Width: 959px) {
	.header .header_inner .logo_wrap a{filter:none;}
	.nav_header_m {display: block; position: relative; top: 0px; right: 0px; z-index: 2; -webkit-user-select: none; user-select: none;}
	.nav_header_m input {display: block; width: 20px; height: 20px; position: absolute; top: -3px; left: -3px; cursor: pointer; opacity: 0; /*hide this */ z-index: 2; /* and place it over the hamburger */ -webkit-touch-callout: none; }
	.nav_header_m span {
		display: block; width: 20px; height: 2px; margin-bottom: 5px; position: relative; background: #000; border-radius: 3px; z-index: 1; transform-origin: 4px 0px; 
		transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0), background 0.5s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.55s ease; /*filter: invert(1) grayscale(100%) brightness(2);*/}
	.nav_header_m span.bar1 {transform-origin: 0% 0%;}
	.nav_header_m span.bar2 {transform-origin: 0% 100%;}
	.nav_header_m input:checked ~ span {opacity: 1; transform: rotate(45deg) translate(5px, -2px); background: #232323;}
	.nav_header_m input:checked ~ span.bar2 {opacity: 0; transform: rotate(0deg) scale(0.2, 0.2);}
	.nav_header_m input:checked ~ span.bar3 {transform: rotate(-45deg) translate(2px, 1px);}
	.nav_header_m input:checked ~ ul.lang_list {transform:translate(-105%, 0);}
	.nav_header_m .lang_list {position: absolute; top:-20px; left:64px; width: 300px; height:100vh; padding: 60px 19px; background: #fff; list-style-type: none; -webkit-font-smoothing: antialiased; transform-origin: 0% 0%; transform: none; transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0); overflow:auto;}
	.nav_header_m .lang_list > li > a {padding: 12px 0; font-size: 16px; font-weight:500; display:block;}
	.nav_header_m .lang_list > li.active > a {font-weight:700; border-bottom:1px solid #000;}
	.nav_header_m .lang_list > li.active > .sub_menu a:hover {font-weight:600;}
	.nav_header_m .lang_list li a:not(:only-child)::after {content:"+"; float:right;}
	.nav_header_m .lang_list li.active a:not(:only-child)::after {content:"-";}
	.nav_header_m .lang_list li .sub_menu li {padding: 10px; font-size: 14px;}
	.nav_header_m .lang_list .sub_menu {display:none; background-color:rgba(0,0,0,.035);}
	/* CR-006(B-2 1안): 휴대폰 메뉴 — 세부 항목을 처음부터 모두 펼쳐 2열로 보인다(≡ → 인사말 두 번이면 이동). 분류 제목은 누르지 않아도 된다.
	   하위가 하나뿐인 분류(m_single, 시공사례)는 세부 목록을 숨기고 제목이 바로 이동. 스마트 스토어처럼 하위 없는 링크는 그대로 */
	.nav_header_m .lang_list {padding-top:56px;}
	.nav_header_m .lang_list > li.sub_menu_toggle > a.main_menu {padding:12px 0 8px; font-weight:700; font-size:16px; pointer-events:none;}
	.nav_header_m .lang_list > li.sub_menu_toggle > a.main_menu::after {content:none;}
	.nav_header_m .lang_list > li.sub_menu_toggle > .sub_menu {display:grid; grid-template-columns:1fr 1fr; gap:6px; background:none; padding:0 0 10px;}
	.nav_header_m .lang_list > li.sub_menu_toggle > .sub_menu > li {padding:0;}
	.nav_header_m .lang_list > li.sub_menu_toggle > .sub_menu > li > a {display:block; padding:9px 12px; background:#F3F3F3; border-radius:8px; font-size:14px;}
	.nav_header_m .lang_list > li.m_single > .sub_menu {display:none;}
	.nav_header_m .lang_list > li.m_single > a.main_menu {pointer-events:auto;}
	body.scrim-open {position:fixed;}
}

@media screen and (max-Width: 479px) {
	.nav_header_m input:checked ~ ul.lang_list {transform:translate(-109%, 0);}
}

/* nav_header_m h_active*/
@media screen and (max-Width: 959px) {
	.header.h_active .nav_header_m span {filter: none;}
}
/*-----------------------------------------*/
/*.footer*/
.footer { width:100%; height:auto; position:relative; padding-bottom:50px; background-color:#fff;}
.footer .footer_list { width:100%; height:100%; text-align:center;}
.footer .footer_list li { margin-bottom:20px; }
.footer .footer_list li:last-child { margin-bottom:0px; }
.footer .footer_list li .f_info {padding-right: 15px; margin-right: 15px; position: relative; display: inline-block; position: relative; color:#fff;}
.footer .footer_list li .f_info:last-child {padding:0; margin:0;}
.footer .footer_list li .f_info:not(:last-child):after {position: absolute; right: 0; top:50%; width: 1px; height: 0.8rem; margin-top: -.4rem; background: #929292; content: ''}
.footer .footer_list li .f_info span {color:#929292; margin-right:10px;}
.footer .footer_list li .f_info a { font-size:14px; font-weight:500; letter-spacing:0.5px; line-height:1.6;color:#fff; cursor: pointer;}
.footer .footer_list li p { font-size:14px; font-weight:500; letter-spacing:0.5px; line-height:1.6;color:#fff;}
.footer .footer_list li .copy {color: #929292;}
.footer .foot_label {width:100%; height:50px; display:block; background-color:#074ead; margin-bottom:50px;}
.footer .foot_label span {width:252px; height:50px; display:block; background:url("../images/logo/faran_logo.png") no-repeat; margin: 0 auto;}

@media screen and (max-Width: 780px){
	.footer{padding-bottom:30px;}
	.footer p { font-size:12px; font-weight:400; letter-spacing:-0.01px;}
	.footer .foot_label {height:40px; margin-bottom:30px;}
	.footer .footer_list > li { margin-bottom:15px; }
	.footer .foot_label span {background-size:200px; width:200px;}
}

/* footer sub */
.footer.sub {background-color:#202020;}
.footer.sub {padding-top:50px;}
.footer.sub .f_logo_wrap {width:180px; height:117px; display:block; background:url("../images/logo/foot_logo.png") no-repeat; margin:0 auto 30px auto; background-size:contain; filter:invert(1);}
.footer.sub .foot_label {display:none;}
@media screen and (max-Width: 959px) {
	.footer.sub .f_logo_wrap {width:150px; height:98px;}
}
@media screen and (max-Width: 479px){
	.footer.sub .f_logo_wrap {width:130px; height:85px;}
}

/* CR-039: 누르면 전화·메일로 가는 번호·주소 — 글자 모양은 그대로, 얇은 밑줄만(수아 시안 tel-loc·telas-as) */
a.tel_link {color:inherit; font:inherit; letter-spacing:inherit; line-height:inherit; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px;}
a.tel_link.tel_blue {color:#1d4ed8;}
a.tel_link.tel_light {color:#ffd8a8;}
.tel_hint {font-size:.85em; color:#666;}
.footer .footer_list li .f_info a.tel_link {font-size:inherit; font-weight:inherit; letter-spacing:inherit; line-height:inherit;} /* 바닥글 스마트스토어 링크 규칙(14px·500)이 번호 글자 크기를 바꾸지 않게 */


/* CR-037(2차 9번 · 📷 승인 cr037 · 수아 docs/design/ui-step2-round2-preview.md §2): 관리자로 로그인했을 때만(머리글에 로그아웃 버튼이 있을 때 · :has) —
   1100 이하에서 큰 메뉴 폭 100px 고정 → 글자만큼 · 검색 칸 160 → 132 · 1040 이하 스마트 스토어 글자 숨김(가방 그림만 · aria-label 그대로) · 1000 이하 메뉴 여백 7px
   → 로그아웃 버튼이 화면 밖(1199px)으로 밀리던 것이 1100·1040·960 모두 화면 안. 작은 메뉴 링크는 줄바꿈 없음("홈페이지 내용 관리" 한 줄). 손님 화면·1440 은 그대로 · :has() 모르는 옛 브라우저는 지금 모양 */
@media (max-width:1100px){
	.header:has(.logout_btn) .nav_header > ul > li {width:auto !important;}
	.header:has(.logout_btn) .nav_header > ul > li > a.main_menu {padding:0 10px !important;}
	.header:has(.logout_btn) .search_box {width:132px !important;}
}
@media (max-width:1040px){
	.header:has(.logout_btn) .store_btn {font-size:0 !important; padding:0 10px !important; gap:0 !important;}
	.header:has(.logout_btn) .store_btn svg {width:18px; height:18px;}
}
@media (max-width:1000px){
	.header:has(.logout_btn) .nav_header > ul > li > a.main_menu {padding:0 7px !important;}
}
.header:has(.logout_btn) .nav_header > ul > li > ul.sub_menu > li > a {white-space:nowrap;}