/* BASIC css start */
/* 아이품고 PC 공통 헤더 — 전체 교체용
   기존 헤더 CSS와 이전 ipo-seo-menu 추가 CSS를 모두 지우고 적용합니다.
   최근 수정한 HTML 및 기존 JS와 함께 사용합니다. PC 1280px 전용입니다. */

#hdWrap {
  --header-ink: #222;
  --header-muted: #777;
  --header-line: #eaeaea;
  --header-soft: #f7f7f7;
  min-width: 1280px;
  font-size: 16px;
  background: #fff;
  color: var(--header-ink);
  font-family: Pretendard, "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  -webkit-font-smoothing: antialiased;
}
#hdWrap *, #hdWrap *::before, #hdWrap *::after { box-sizing: border-box; }
#hdWrap a { color: inherit; text-decoration: none; }
#hdWrap a:focus-visible { outline: 2px solid #333; outline-offset: 3px; }
#hdWrap ul, #hdWrap dl, #hdWrap dd, #hdWrap p { margin: 0; padding: 0; }
#hdWrap ul { list-style: none; }
#hdWrap img { vertical-align: middle; border: 0; }

/* 상단 안내 */
#hdWrap .top_banner { min-width: 1280px; background: #272727; }
#hdWrap .top_banner.show { display: block; }
#hdWrap .top_banner .head_inner { position: relative; width: 1280px; margin: 0 auto; }
#hdWrap .top_banner .head_inner a { display: block; }
#hdWrap .top_banner .head_inner p {
  height: 36px; margin: 0 auto; color: #fff;
  text-align: center; font-size: 14px; font-weight: 400;
  line-height: 36px; letter-spacing: .1px;
}
#hdWrap .top_bnr_area {
  min-width: 1280px;
  background: url("/design/kichmom/djds/top/top_bnr_bg.jpg") center top;
}
#hdWrap .top_bnr_area .tb_box { position: relative; width: 1280px; margin: 0 auto; }

/* 로그인·회원 메뉴 */
#hdWrap .basic_area { min-width: 1280px; background: #fff; }
#hdWrap .basic_area .ba_box { position: relative; width: 1280px; height: 38px; margin: 0 auto; }
#hdWrap .basic_area .top_menu { position: absolute; top: 0; right: 0; }
#hdWrap .basic_area .top_menu_left { position: absolute; top: 0; left: 0; }
#hdWrap .basic_area .ba_box ul { display: flex; align-items: center; gap: 18px; }
#hdWrap .basic_area .ba_box li { position: relative; float: none; padding: 0; margin: 0; line-height: 38px; }
#hdWrap .basic_area .ba_box li::before { content: none; }
#hdWrap .basic_area .ba_box a { display: inline-block; color: #767676; font-size: 14px; font-weight: 400; }
#hdWrap .basic_area .ba_box a:hover { color: #222; }
#hdWrap .basic_area .top_menu_left img { max-height: 16px; margin-right: 5px; }
#hdWrap .basic_area .top_menu_left .cline { display: none; }
#hdWrap .basic_area .balloon::before,
#hdWrap .basic_area .balloon::after { display: none; }
#hdWrap .basic_area .cart_num {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 20px; height: 20px; margin-left: 4px; padding: 0 4px;
  border-radius: 10px; background: #222; color: #fff; font-size: 14px; line-height: 1;
}

/* 로고와 검색창 */
#hdWrap .menu_area { min-width: 1280px; height: 112px; background: #fff; }
#hdWrap .menu_area .ma_box { position: relative; width: 1280px; height: 100%; margin: 0 auto; }
#hdWrap .menu_area .top_logo { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#hdWrap .menu_area .top_logo a { display: block; }
#hdWrap .menu_area .top_logo img { display: block; width: 210px; max-height: 64px; height: auto; object-fit: contain; }
#hdWrap .menu_area .top_search { position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
#hdWrap .search-form { position: relative; }
#hdWrap .search-form form { margin: 0; }
#hdWrap .search-form fieldset {
  position: relative; width: 264px; height: 42px; margin: 0; padding: 0;
  border: 1px solid #e5e5e5; border-radius: 3px; background: #fafafa;
}
#hdWrap .search-form fieldset:focus-within { border-color: #555; background: #fff; }
#hdWrap .search-form legend {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap;
}
#hdWrap .search-form input:not([type="hidden"]) {
  display: block; width: calc(100% - 42px); height: 40px; margin: 0;
  padding: 0 12px; border: 0; border-radius: 0; outline: none;
  background: transparent; color: #222; font: inherit; font-size: 14px;
}
#hdWrap .search-form input::placeholder { color: #888; }
#hdWrap .search-form fieldset > a {
  position: absolute; top: 0; right: 0; display: flex;
  align-items: center; justify-content: center; width: 40px; height: 40px;
}
#hdWrap .search-form img.search_btn { display: block; width: 18px; height: 18px; margin: 0; object-fit: contain; }
#hdWrap #top_category .top_search { margin-left: 16px; }
#hdWrap #top_category .top_search fieldset { width: 200px; }

/* 내비게이션 — 모든 메뉴 동일한 크기·색상·두께 */
#hdWrap #tcat_wrap { position: relative; height: 57px; padding: 0; z-index: 100; }
#hdWrap #tcat_fixed { width: 100%; min-width: 1280px; z-index: 100; }
#hdWrap #tcat_top_line { width: 100%; background: #fff; border-top: 1px solid #eee; border-bottom: 1px solid #e5e5e5; }
#hdWrap #tcat_area { position: relative; height: 55px; }
#hdWrap #top_category { position: relative; width: 1280px; margin: 0 auto; z-index: 6; }
#hdWrap #top_category .navigation { display: flex; align-items: stretch; gap: 10px; height: 55px; }
#hdWrap #drop-down { display: flex; align-items: stretch; flex: 1; min-width: 0; }
#hdWrap #drop-down > li { position: relative; float: none; height: 55px; padding: 0; margin: 0; }
#hdWrap #drop-down > .first { flex: 0 0 36px; margin-right: 6px; }
#hdWrap #drop-down > .first > a {
  position: relative; display: block; width: 36px; height: 55px; background: none;
}
#hdWrap #drop-down > .first > a::before {
  content: ""; position: absolute; left: 8px; top: 20px;
  width: 20px; height: 2px; background: #222;
  box-shadow: 0 6px 0 #222, 0 12px 0 #222;
}
#hdWrap #drop-down > .first > a:hover { background: #f7f7f7; }
#hdWrap #drop-down > .board,
#hdWrap #drop-down > .board.ipo-seo-menu {
  display: flex; align-items: stretch; justify-content: space-between;
  flex: 1; min-width: 0; padding: 0; gap: 2px;
}
#hdWrap #drop-down > .board > a,
#hdWrap #drop-down > .board.ipo-seo-menu > a {
  position: relative; display: inline-flex; flex: 0 0 auto;
  align-items: center; justify-content: center;
  height: 55px; padding: 0 3px; gap: 0;
  color: #222; font-size: 16px; font-weight: 500;
  line-height: 1.4; letter-spacing: -.35px; white-space: nowrap;
}
#hdWrap #drop-down > .board > a::before { content: none; display: none; }
#hdWrap #drop-down > .board > a > img { display: none; }
#hdWrap #drop-down > .board > a::after {
  content: ""; position: absolute; left: 3px; right: 3px; bottom: 0;
  height: 2px; background: #222; transform: scaleX(0);
  transform-origin: center; transition: transform .18s ease;
}
#hdWrap #drop-down > .board > a:hover,
#hdWrap #drop-down > .board > a:focus-visible { color: #111; font-weight: 500; }
#hdWrap #drop-down > .board > a:hover::after,
#hdWrap #drop-down > .board > a:focus-visible::after { transform: scaleX(1); }
#hdWrap #drop-down > .board > a p,
#hdWrap #drop-down > .board > a span { font: inherit; color: inherit; }
/* 최저가 쇼핑: 기존 1.5초 깜빡임 유지 */
@keyframes ipo-header-blink {
  0%, 100% { color: #222; }
  50% { color: #e74174; }
}
#hdWrap #drop-down > .board > a .blink {
  animation: ipo-header-blink 1.5s step-end infinite;
}
#hdWrap #top_category .navigation .board_right {
  position: relative; display: flex; float: none;
  align-items: center; flex: 0 0 auto; height: 55px; padding-left: 0;
}
#hdWrap #top_category .navigation .board_right::before {
  content: none; display: none;
}
#hdWrap #top_category .navigation .board_right a {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  height: 55px; padding: 0 3px; line-height: 1.4; letter-spacing: -.35px;
  color: #222; font-size: 16px; font-weight: 500; white-space: nowrap;
}
#hdWrap #top_category .navigation .board_right a::after {
  content: ""; position: absolute; left: 3px; right: 3px; bottom: 0;
  height: 2px; background: #222; transform: scaleX(0);
  transform-origin: center; transition: transform .18s ease;
}
#hdWrap #top_category .navigation .board_right a:hover,
#hdWrap #top_category .navigation .board_right a:focus-visible { color: #111; font-weight: 500; }
#hdWrap #top_category .navigation .board_right a:hover::after,
#hdWrap #top_category .navigation .board_right a:focus-visible::after { transform: scaleX(1); }
/* 기존 퀸스클럽 GIF: 43px → 28px */
#hdWrap #top_category .navigation .board_right .ico_vip {
  display: block; position: absolute; width: 28px; height: 28px;
  top: -20px; right: 50%; margin-right: -14px; z-index: 1;
  background: url(/design/kichmom/10276/vip.gif) center / contain no-repeat;
  pointer-events: none;
}
#hdWrap #top_category .navigation .board_right > img {
  display: block; position: absolute; width: 28px; height: auto;
  top: -20px; right: 50%; margin-right: -14px;
}

/* 퀸스클럽을 다른 메뉴와 같은 영역에 배치 */
#hdWrap #drop-down > .board > a.b_queens {
  overflow: visible;
}

#hdWrap #drop-down > .board > a.b_queens .ico_vip {
  display: block;
  position: absolute;
  top: -20px;
  left: 50%;
  width: 28px;
  height: 28px;
  transform: translateX(-50%);
  background: url("/design/kichmom/10276/vip.gif")
              center / contain no-repeat;
  pointer-events: none;
}



/* 전체 카테고리 — 기존 hover JS가 display를 제어합니다. */
#hdWrap #drop-down #smenu {
  display: none; position: absolute; top: 55px; left: 0;
  width: 1280px; height: auto; max-height: calc(100vh - 72px);
  overflow-y: auto; padding: 30px; z-index: 9999;
  background: #fff; border: 1px solid #e5e5e5;
  box-shadow: 0 12px 24px rgba(0,0,0,.055); text-align: left;
}
#hdWrap #drop-down #smenu::after { content: ""; display: block; clear: both; }
#hdWrap #drop-down > .first:focus-within #smenu { display: block !important; }
#hdWrap #smenu .ttcat_wrap {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 28px 20px; float: left; width: calc(100% - 214px);
}
#hdWrap #smenu .ttcat_wrap .ttcat { float: none; width: auto; min-width: 0; min-height: 0; margin: 0; }
#hdWrap #smenu .ttcat_title { min-height: 33px; margin: 0 0 10px; padding: 0 0 10px; border-bottom: 1px solid #eee; }
#hdWrap #smenu .ttcat_title a { display: block; padding: 0; color: #222; font-size: 14px; font-weight: 600; line-height: 22px; }
#hdWrap #smenu .ttcat dd a { display: block; padding: 4px 0; color: #777; font-size: 14px; font-weight: 400; line-height: 20px; }
#hdWrap #smenu .ttcat a:hover { color: #111; text-decoration: underline; text-underline-offset: 3px; }
#hdWrap #smenu .bn_wrap { float: right; width: 184px; margin: 0; padding-left: 22px; border-left: 1px solid #eee; }
#hdWrap #smenu .bn_list_main { display: block; width: 100%; margin: 0; }
#hdWrap #smenu .bn_list_main > span { display: block; margin-bottom: 14px; color: #888; font-size: 14px; font-weight: 500; letter-spacing: 0; overflow-wrap: anywhere; }
#hdWrap #smenu .bn_list_main ul li {
  display: block; position: relative; float: none; width: 100%; height: auto;
  margin: 0; padding: 0; background: transparent; text-align: left;
}
#hdWrap #smenu .bn_list_main ul li a {
  display: block; padding: 10px 0; color: #444;
  font-size: 14px; font-weight: 400; line-height: 20px;
}
#hdWrap #smenu .bn_list_main ul li a:hover { color: #111; text-decoration: underline; text-underline-offset: 3px; }
#hdWrap #smenu .bn_list_main ul .mellowand a img { display: none; }
#hdWrap #smenu .bn_01, #hdWrap #smenu .bn_02 { display: block; width: 100%; height: auto; margin-top: 16px; }
#hdWrap #smenu .bn_01 img, #hdWrap #smenu .bn_02 img { width: 100%; height: auto; }
#hdWrap #crossl { display: none; }

/* 기존 보조 요소 */
.loc-navi dd { text-align: left; padding-top: 15px; background: #fff; margin-top: 1px; }
.loc-navi dd a { font-size: 14px; color: #555; }
.loc-navi .ico_map { display: inline-block; width: 14px; padding-top: 8px; margin-right: 5px; }
.view_gr { width: 1280px; height: 40px; margin: -38px auto 0; text-align: right; }
.view_gr a { position: relative; z-index: 999; line-height: 40px; font-size: 14px; padding: 0 20px; font-weight: 500; color: #555; }
/* 타 영역이 참조할 수 있는 기존 브랜드 변수 보존 */
:root { --main-color: #e74174; }
@media (prefers-reduced-motion: reduce) {
  #hdWrap *, #hdWrap *::before, #hdWrap *::after { animation: none !important; transition: none !important; }
}

/* BASIC css end */