/* BASIC css start */
.header_wrap{margin:0 auto; padding:0 10px; width:100%; max-width: 1000px; box-sizing:border-box}
.header_box{width:100%; background-color: #ffffff;}
.header_box.active{position: fixed; top: 0; left:0; z-index:9;}
.header_top{padding:12px 0; }
.header_top .header_wrap{display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap:20px; width: 100%;}
.header_top .gnb_wrap {grid-column: 1; }
.header_top .logo{grid-column: 2;}
.header_top .menu_tools {grid-column: 3; display: flex; justify-content: flex-end;}

.header_top .cata_menu_wrap{position:relative}
.header_top .gnb_wrap .all_cata{display: flex; align-items: center; gap:0 14px; background-color: transparent; font-size: var(--basic_font_size); color: var(--main_black); border:none}
.header_top .gnb_wrap .all_cata span{visibility: visible;}
.header_top .gnb_wrap .all_cata .all_cata_icon{display: flex; flex-direction: column; justify-content: space-between; gap: 6px; width:22px; height: 18px;}
.header_top .gnb_wrap .all_cata .all_cata_icon span{display: block; width:100%; height: 2px; background-color: var(--main_black);}

.header_top .cata_menu_inner{position: fixed; top:0; left:-100%; z-index:99; width:100%; height: 100vh; background-color:#ffffff; transition: transform .3s;  }
.header_top .cata_menu_inner.active{ transform: translateX(100%);}
.header_top .cata_menu_inner .cata_menu_top{padding:12px 10px; display: flex; justify-content: center; }
.header_top .cata_menu_inner .cata_menu_top .cata_menu_top_logo{width:140px; height: 34px; display: flex;}
.header_top .cata_menu_inner .cata_menu_top .cata_menu_top_logo img{width:100%;}
.header_top .cata_menu_inner .close_btn{position: absolute; top:12px; right:10px; z-index:1; background-color: transparent; border:none;}
.header_top .cata_menu_inner .close_btn i img{display:block;}
.header_top .cata_menu_inner .search_wrap{margin-top:12px; position:relative; padding:0 10px;}
.header_top .cata_menu_inner .search_wrap .MS_search_word{padding:0 48px 0 20px; width:100%; height: 40px; border: 1px solid var(--line_color); border-radius: var(--radius_5); box-sizing: border-box;  }
.header_top .cata_menu_inner .search_wrap .btn_search{position: absolute; top:50%; right:16px; z-index:1; transform: translateY(-50%);}
.header_top .cata_menu_inner .cata_menu{padding:18px 0 22px; }
.header_top .cata_menu_inner .cata_menu a{ padding:10px 24px; display: flex; align-items: center; gap: 4px; font-size: var(--basic_font_size); line-height: 1; color: var(--sub_black);  box-sizing: border-box; transition: backgound-color .3s; }
/* .header_top .cata_menu_inner .cata_menu a:hover{color: var(--main_color); background-color: #f5f5f5; } */
.header_top .cata_menu_inner .cata_menu a span{display: flex; align-items: center; gap: 4px;}
.header_top .cata_menu_inner .cata_menu a span::before{display: block; width:24px; aspect-ratio: 1/1;}
.header_top .cata_menu_inner .cata_menu li:nth-child(1) a span::before{content: url("/design/nhmelchi/new_images/icons/24_jukbang_anc.svg");}
.header_top .cata_menu_inner .cata_menu li:nth-child(2) a span::before{content: url("/design/nhmelchi/new_images/icons/24_premium_anc.svg");}
.header_top .cata_menu_inner .cata_menu li:nth-child(3) a span::before{content: url("/design/nhmelchi/new_images/icons/24_namhae_anc.svg");}
.header_top .cata_menu_inner .cata_menu li:nth-child(4) a span::before{content: url("/design/nhmelchi/new_images/icons/24_seafood.svg");}
.header_top .cata_menu_inner .cata_menu li:nth-child(5) a span::before{content: url("/design/nhmelchi/new_images/icons/24_namhae_product.svg");}


.header_top .logo{width:140px; height: 34px; display: flex;}
.header_top .logo img{width:100%;}

.header_top .top_menu{padding:0 10px;  display: flex; justify-content: space-between; gap:0 10px; background-color: #f6f7fb;}
.header_top .top_menu li{width:calc((100% - (10px * 3)) / 4);}
.header_top .top_menu a{padding:20px 4px; display: flex; flex-direction: column; align-items: center; gap:6px;  font-size: var(--mini_font_size); color: var(--main_black);}
@media(max-width:420px){
  .header_top .top_menu{gap:0 8px;}
  .header_top .top_menu li{width:calc((100% - (8px * 3)) / 4);}
  .header_top .top_menu a i{width:28px;}
}
.header_top .menu_tools .quicks_cart{position:relative; padding-right: 10px;}
.header_top .menu_tools .quicks_cart .user_basket_quantity{position: absolute; top:-6px; right:0px; display: block; padding:2px 5px; border-radius:20px; font-size:12px; color: #ffffff; background-color: var(--main_color); }

.header_bottom .header_bottom_inner{width:100%; border-top:1px solid var(--line_color); border-bottom:1px solid var(--line_color); background-color: #ffffff;}
.header_bottom .gnb{margin:0 -10px; padding:0 10px; display: flex; align-items: center; gap: 0 28px; overflow-x:auto; -ms-overflow-style: none; scrollbar-width: none;}
.header_bottom .gnb::-webkit-scrollbar{display: none;}  


.header_bottom .gnb li{flex-shrink: 0;}
.header_bottom .gnb li a{padding:12px 0;  display:flex; align-items: center; height: 100%; line-height: 1; font-size: var(--mini_font_size); color: var(--main_black); font-weight: 500;}


/* BASIC css end */