@charset "utf-8";

/* 상단 */
.header-wrap { max-width:2000px; padding-bottom:137px; margin:0 auto; }
#header_warp { border-bottom:1px solid #e5e5e5; }
#header .header-main { position:relative; padding:13px 0 0; }
.header-inner { display:flex; align-items:end; position:static; }

#header .header-fixed { position:absolute; width:100%;  }
#header.fixed .header-fixed { position:fixed; left:0; top:0; background:#fff; border-bottom:1px solid #e5e5e5; z-index:190; }

/* 로고 */
#header h1.top-logo { display:inline-block; margin:29px auto 22px; padding:0; }
#header h1.top-logo-fixed { display:none; }
#header h1.top-logo a { display:block; position:relative; line-height:1; }
#header h1.top-logo a::after { content:""; position:absolute; top:0; left:0; width:100%; height:100%; z-index:100;}
#header h1.top-logo svg { width:80px; height:auto; }
#header h1.top-logo embed { width:80px; height:auto; }

/* 헤더 고정 */
#header.fixed .top-logo-fixed { display:inline-block; }
#header.fixed .top-logo-base { display:none; }
#header.fixed .header-inner { align-items:center; }
#header.fixed .top-account > ul:first-child { display:none; }
#header.fixed .header-center { padding-top:28px; }
#header.fixed .header-main-right { padding:0; }

/* 회원메뉴 */
#header .header-right { margin-left:auto; }
#header .top-account > ul:first-child > li { display:inline-block; vertical-align:top; position:relative; }
#header .top-account > ul:first-child > li a { position:relative; padding:0 10px; color:#969696; font-size:14px; font-weight:300; }
#header .top-account > ul:first-child > li a::before { content:''; position:absolute; left:0; top:6px; height:10px; border-left:1px solid #c4c4c4; }
#header .top-account > ul:first-child > li:first-child a::before { display:none; }
#header .top-account > ul:first-child > li:last-child a { padding-right:0; }

/* 서브 뎁스메뉴 보더 */
#header .sub_menu_box.layer_type { float:left; }
#header .sub_menu_box.layer_type ul > li > ul { padding:13px 0; border:1px solid #cacaca; }
#header .sub_menu_box.layer_type ul > li > ul > li > ul { padding:0; }
/* 서브메뉴 최상위(0뎁스) */
#header .sub_menu_box .sub_depth0 { padding:0; font-size:0; vertical-align:top; border:0; }
#header .sub_menu_box .sub_depth0 > li { display:block; float:left; position:static; vertical-align:top; }
#header .sub_menu_box .sub_depth0 > li.active .sub-menu-wrap,
#header .add-cate > li:hover .sub-menu-wrap { display:block; }
#header .sub_menu_box .sub_depth0 > li > a { display:block; padding:0; line-height:40px; color:#161616; font-size:15px; font-weight:500; text-align:left; }
#header .sub_menu_box .sub_depth0 > li > a.active { background:none; color:#666; }
/* 서브메뉴 1뎁스 */
#header .sub_menu_box .sub_depth1 > li { min-width:103px; padding:0 28px; border-right:1px solid #e7e7e7; }
#header .sub_menu_box .sub_depth1 > li:first-child { padding-left:0; }
#header .sub_menu_box .sub_depth1 > li > a { display:block; padding:0; color:#161616; font-size:15px; font-weight:500; }
#header .sub_menu_box .sub_depth1 > li > a:hover { background:none; }
#header .sub_menu_box .sub_depth1 > li > a.active { background:none; }
/* 서브메뉴 2뎁스 CSS */
#header .sub_menu_box .sub_depth2 li { position:relative; }
#header .sub_menu_box .sub_depth2 li a { display:block; padding:3px 0; color:#161616; font-size:13px; font-weight:500; }
#header .sub_menu_box .sub_depth2 li a:hover { background:none; }
#header .sub_menu_box .sub_depth2 li a.active { background:none; }
/* 서브메뉴 3,4뎁스 CSS */
#header .sub_menu_box .sub_depth3 li { position:relative; }
#header .sub_menu_box .sub_depth3 li a { display:block; padding:3px 0; color:#757575; font-size:12px; font-weight:500; }
#header .sub_menu_box .sub_depth3 li a:hover { background:none; }
#header .sub_menu_box .sub_depth3 li a.active { background:none; }

/* 서브 레이어 타입 */
#header .sub_menu_box.layer_type a:hover,
#header .sub_menu_box.layer_type a.active { color:#b2b2b2; font-weight:400; }
#header .sub_menu_box.layer_type .sub_menu0 > li > a { position:relative; margin:0 25px; padding:0 0 13px; }
#header .sub_menu_box.layer_type .sub_menu0 > li > a::before { content:''; position:absolute; bottom:0; left:50%; width:0px; height:2px; background:#161616; transform:translateX(-50%); transition:all .3s; }
#header .sub_menu_box.layer_type .sub_menu0 > li:hover > a::before { content:''; width:100%; transition:all .3s; }
#header .sub_menu_box.layer_type .sub_menu0 > li > a:hover,
#header .sub_menu_box.layer_type .sub_menu0 > li > a.active { color:#161616; }
#header .sub_menu_box.layer_type .sub_menu0 > li > a img { max-width:100%; }
#header .sub_menu_box.layer_type .sub-menu-wrap,
#header .add-cate .sub-menu-wrap { display:none; position:absolute; top:100%; left:0; width:100%; padding:46px 0 46px 130px; background:#fff; border-top:1px solid #e5e5e5; z-index:100; box-sizing:border-box; }
#header .sub_menu_box.layer_type .sub_depth1,
#header .add-cate .sub-menu-wrap ul { display:flex; position:static; width:100%; margin:0 auto; background:#ffffff; z-index:100; }
#header .sub_menu_box.layer_type .sub_depth2 { display:inline-block; position:static; min-width:128px; background:#ffffff; border:0; vertical-align:top; padding-right:25px; }
#header .sub_menu_box.layer_type .sub_depth3 { display:block; position:static; background:#ffffff; border:0; }
#header .sub_menu_box.layer_type .sub_depth4 { display:none; background:#ffffff; }

#header .header-center { margin-left:20px; }

#category { display:flex; }
#category .add-cate { display:flex; align-items:center; }
#category .add-cate > li > a { display:block; position:relative; padding:0 0 13px; margin:0 25px; line-height:40px; color:#161616; font-size:15px; font-weight:500; }
#category .add-cate > li > a::before { content:''; position:absolute; bottom:0; left:50%; width:0px; height:2px; background:#161616; transform:translateX(-50%); transition:all .3s; }
#category .add-cate > li:hover > a::before { content:''; width:100%; transition:all .3s; }
#category .add-cate .sub-menu-wrap ul { display:flex; }
#category .add-cate .sub-menu-wrap ul li { margin-right:20px; }

#category .add-cate2 { display:flex; align-items:center; position:relative; }
#category .add-cate2::before { content:''; position:absolute; left:0; top:13px; height:12px; border-left:1px solid #c4c4c4; }
#category .add-cate2 a { display:block; padding:0 25px 13px; line-height:40px; color:#9c9c9c; font-size:16px; font-weight:500; }
#header .sub_menu_box.layer_type #category_new { /*padding-left:25px;*/ }

.header-main-right { display:flex; justify-content:end; align-items:center; padding:25px 0 27px; }
.header-main-right li { position:relative; margin:0 11px; }
.header-main-right li:last-child { margin-right:0; }
.header-main-right li.mypage { background:url('../img/top_mypage_icon.png') no-repeat center; }
.header-main-right li.basket { background:url('../img/top_cart_icon.png') no-repeat right center; }
.header-main-right li.basket .count { display:block; position:absolute; top:6px; left:50%; transform:translateX(-50%); padding:0; color:#161616; font-size:12px; text-align:center; }
.header-main-right li.basket .count em { font-weight:500; }
.header-main-right li a { display:block; width:22px; height:24px; }
.header-main-right li p { text-indent:-9999px; font-size:0; }
/* 검색 */
#header .top_search { width:234px; float:none; position:absolute; top:-20px; right:11px; background:transparent; border:0; z-index:110; }/* 총너비 */
#header .top_search .top_text_cont { position:relative; width:234px; height:40px; text-align:left; background:#f5f5f5; border-radius:20px; }
#header .top_search .top_text_cont::before { content:""; position:absolute; top:0; right:14px; width:39px; height:100%; background:url("../img/top_search_btn.png") no-repeat 50%; }
#header .top_search .top_text_cont input.top_srarch_text { display:inline-block; vertical-align:top; width:calc(100% - 53px); height:100%; padding:0 0 0 20px; margin:0; color:#a8a8a8; font-size:14px; border:0; background:none; box-sizing:border-box; }
#header .top_search .top_text_cont .btn_top_srarch { width:39px; height:100%; position:absolute; top:0; right:14px; border-left:0; opacity:0; }
#header .top_search .search_cont { display:block; width:323px; margin:13px 0 0; font-size:0; border:1px solid #757575; background:#fff; }
#header .top_search .search_cont .search-drop-box { display:flex; }
#header .top_search .search_cont .recent_box { position:relative; float:none; width:50%; padding:23px 20px 45px; box-sizing:border-box; border-right:1px solid #e7e7e7; }
#header .top_search .search_cont .hot-keyword { width:50%; padding:23px 20px; box-sizing:border-box; }
#header .top_search .search_cont .recent_box dl { padding:0; }
#header .top_search .search_cont .recent_box dd { padding:0; }
#header .top_search .search_cont .recent_box dd ul { margin:0; }
#header .top_search .search_cont .recent_box dl dd li { height:24px; margin:0; padding:3px 0; }
#header .top_search .search_cont .recent_box li span { padding:0; }
#header .top_search .search_cont .recent_box dt,
#header .top_search .search_cont .hot-keyword dt { padding-bottom:8px; color:#000; font-size:15px; font-weight:400; }
#header .top_search .search_cont .hot-keyword dd { height:24px; padding:3px 0; color:#757575; font-size:14px; font-weight:300; }
#header .top_search .search_cont .hot-keyword dd a { height:auto; }
#header .top_search .search_cont .hot-keyword a { display:block; width:100%; }
#header .top_search .recent_box li a { width:78%; height:auto; padding:0; color:#757575; font-size:14px; font-weight:300; }
#header .btn_top_search_del { width:21px; height:21px; }
#header .btn_top_search_all_del { position:absolute; right:20px; bottom:15px; }
#header .btn_top_search_all_del strong { color:#757575; font-size:13px; font-weight:300; border-bottom:1px solid #757575; }
#header .seach_top_all { height:40px; border-top:1px solid #e7e7e7; background:#fff; }
#header .seach_top_all button { padding-top:5px; }
#header .seach_top_all strong { color:#757575; font-size:14px; font-weight:300; }

/* 배너추가 */
#header .subaddmenu { padding:0 !important; border:0 !important; }
#header .subaddmenu li a,
#header .subaddmenu li a:hover { display:block; padding:3px 0; color:#161616; font-size:15px; background:none; font-weight: 500; }
#header .subaddmenu li a.tit-red { color:#c50000; }

@media (max-width:1650px) {
  #category .add-cate li a,
  #header .sub_menu_box.layer_type .sub_menu0 > li > a { margin:0 15px; }
  #category .add-cate2 li a { padding:0 15px 13px; }
}

@media (max-width:1500px) {
  #category .add-cate li a,
  #header .sub_menu_box.layer_type .sub_menu0 > li > a { margin:0 12px; }
  #category .add-cate2 li a { padding:0 12px 13px; }
}

@media (max-width:1350px) {
  #header.fixed .header-center { margin-left:10px; }
  #category .add-cate li a,
  #header .sub_menu_box.layer_type .sub_menu0 > li > a { margin:0 10px; }
  #category .add-cate2 li a { padding:0 10px 13px; }
}

@media (max-width:1300px) {
  #category .add-cate li a,
  #header .sub_menu_box.layer_type .sub_menu0 > li > a { margin:0 9px; }
  #category .add-cate2 li a { padding:0 9px 13px; }
}

@media (max-width:1220px) {
  #header.fixed .header-fixed { width:1220px; }
  #category .add-cate li a,
  #header .sub_menu_box.layer_type .sub_menu0 > li > a { margin:0 7px; }
  #category .add-cate2 li a { padding:0 7px 13px; }
}