/* BASIC css start */
/* 이벤트 배너 */
#topBnr{display: none;width:100%}
#topBnr .topWrap{position: relative;}
#xbtn{position: absolute; top: 50%; transform: translateY(-50%); right: 10px;}
#xbtn img{width: 13px;}

/* 상단 */
#header {width: 100%;}
#header.fix{position: fixed; top: 0; z-index: 100; border-bottom: 1px solid #e6e6e6 !important;}
#header .header_top {position: relative; background: #fff; z-index:11; padding: 0 15px; font-size: 0; text-align: center;}
#header .header_top div {display: inline-block; font-size: 12px; vertical-align: middle;}
#header .header_top div a img{width: 100%;}

#header .header_top .menu {position: absolute; top: 50%; width: 24px; left: 17px; transform: translateY(-50%);}
#header .header_top .allmenu_btn {width: 100%;}
#header .header_top .logo {/*width: 117px;*/ height:100%;}
#header .header_top .logo img {vertical-align: middle; height:60.72px; width:auto; }
#header .header_top .basket {position: absolute; top: 50%; width: 27px; right: 50px; transform: translateY(-50%);}
#header .header_top .basket a {position: relative;}
#header .header_top .basket a span { position: absolute; top: 7px; right: -9px; width: 20px; height: 14px; line-height: 13px; border-radius: 8px; color: #fff; font-size: 10px; font-family: 'Lato', sans-serif; vertical-align: bottom; background: #955251;}
#header .header_top .search{position: absolute; top: 50%; transform: translateY(-50%); width: 25px; right: 14px; }

#header .header_top .brand_list_wrap{width:30px; height:26px;  }
#header .header_top .brand_list_wrap .btn_brand{display:block; width:26px; height:26px; font-size:0; overflow:hidden; text-indent:-100px;  background:url(/design/posteam/aura/m/btn_rnd_arrow_up_dw.png) center no-repeat; background-size:100%; margin-left:4px; -ms-transform: rotate(180deg); transform: rotate(180deg);}
#header .header_top .brand_list_wrap ul.sub_menu{display:none; position:absolute; left:50%; transform: translateX(-50%); top:60px; padding:10px; border:1px solid #e5e5e5; border-radius:6px; background:#FFF;  }
#header .header_top .brand_list_wrap.open .btn_brand{ -ms-transform: rotate(0); transform: rotate(0);}
#header .header_top .brand_list_wrap.open .sub_menu{display:block;}
#header .header_top .brand_list_wrap.open .sub_menu{display:block;}
#header .header_top .brand_list_wrap .sub_menu {
  display: none;
  position: absolute;
  left: 50%;
  top: 60px;
  transform: translateX(-50%);
  width: max-content;
  min-width: 220px;
  max-width: calc(100vw - 24px);
  max-height: calc(100vh - 100px);
  padding: 10px 8px;
  box-sizing: border-box;
  border: 1px solid #e5e5e5;
  border-radius: 10px;
  background: #fff;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);

  /* Firefox */
  scrollbar-width: thin;
  scrollbar-color: #bbb transparent;
}

#header .header_top .brand_list_wrap.open .sub_menu {
  display: block;
}

#header .header_top .brand_list_wrap .sub_menu li {
  display: block;
  width: 100%;
}

#header .header_top .brand_list_wrap .sub_menu li a {
  display: block;
  width: 100%;
  padding: 10px 18px;
  box-sizing: border-box;
  text-align: center;
  white-space: nowrap;
}

#header .header_top .brand_list_wrap .sub_menu li:last-child a {
  border-bottom: 0;
}

/* Chrome, Edge, Safari */
#header .header_top .brand_list_wrap .sub_menu::-webkit-scrollbar {
  width: 6px;
}

#header .header_top .brand_list_wrap .sub_menu::-webkit-scrollbar-track {
  background: transparent;
}

#header .header_top .brand_list_wrap .sub_menu::-webkit-scrollbar-thumb {
  background: #bdbdbd;
  border-radius: 999px;
}

#header .header_top .brand_list_wrap .sub_menu::-webkit-scrollbar-thumb:hover {
  background: #8f8f8f;
}
#header .header_top .brand_list_wrap .sub_menu li a{display:block; width:100%; text-align:left; color:#111; font-size:17px; padding:10px 20px; box-sizing:border-box;  white-space: nowrap;  font-weight:600;}
#header .header_top .brand_list_wrap .sub_menu li a span {display: inline-block;margin-top:8px; font-size: 15px; color:#5b5b5b; font-weight:500;letter-spacing: 0.3px;}


#header .header_menu {overflow-x: auto; overflow-y: hidden; border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; background:#fff;}
#header .header_menu::-webkit-scrollbar {display: none;}
#header .header_menu ul {display: flex; justify-content: inherit;}
#header .header_menu ul li {flex-shrink: 0; padding: 15px 12px; line-height:1;}
#header .header_menu ul li a {font-family:'Montserrat',sans-serif; font-size:13px; color:#000;}
#header .header_menu ul li.active a {font-weight:700; color:#014781;}


/* 메뉴 */
#close_btn{padding: 8px;width: 20px;height: 20px; position: absolute; top: calc(50% - 18px); /*9px;*/ right: 7px;}
#close_btn img {width:95%}

#menuWrap{ position: fixed; width:100%; height:100%; background: #fff; top: 0; z-index: 1001; display:none; overflow-x: auto;}
#menuWrap .closeBox{position: absolute; right: 13px; top: 15px; z-index: 100000;}
#menuWrap .closeBox img{width: 22px;}
#menuWrap .menuIn{padding: 100px 30px;}
#menuWrap .menuIn .snsBox{}
#menuWrap .menuIn .snsBox ul{text-align: center;}
#menuWrap .menuIn .snsBox ul li{display: inline-block; margin: 0px 5px;}
#menuWrap .menuIn .snsBox ul li a img{width: 50px;}
#menuWrap .menuIn .menu_middle{padding-top: 35px;}
#menuWrap .menuIn .menu_middle:after{content: ''; display: block; clear: both}
#menuWrap .menuIn .menu_middle .middle_text, #menuWrap .menuIn .menu_middle .middle_icon{text-align: center;}
#menuWrap .menuIn .menu_middle .middle_text li{float:left; width: calc(100%/3 - 10px); height:40px; line-height: 40px; margin: 5px 5px; border: 1px solid #e6e6e6; box-sizing: border-box;}
#menuWrap .menuIn .menu_middle .middle_text li a{display: block;
    font-family: "맑은 고딕",'Malgun Gothic',sans-serif;
    color: #333;}
#menuWrap .menuIn .menu_middle .middle_text li a img{padding: 20px 0 10px; margin:0 auto; display: block;}

.m_banner{text-align:center; padding: 25px 0;}
.m_banner img{width: 92%;}

/* 슬라이드 메뉴 안 컨텐츠*/
/*
#menuWrap .menuIn .menu_contents{padding-top: 24px; display: flex;}
#menuWrap .menuIn .menu_contents .a_menu, #menuWrap .menuIn .menu_contents .a_center{width: 100%;}
#menuWrap .menuIn .menu_contents .a_menu ul, #menuWrap .menuIn .menu_contents .a_center ul{line-height: 35px;}
#menuWrap .menuIn .menu_contents .a_menu > ul{text-align: center;}
#menuWrap .menuIn .menu_contents .a_menu > ul > li > a{ display: block; padding: 7px 0; font-size: 1.8em; color: #4c4c4c; font-family: 'Noto Sans KR', sans-serif;}
#menuWrap .menuIn .menu_contents .a_menu > ul > li .sub_menu{display:none; background: #323232; padding: 20px 32px;}
#menuWrap .menuIn .menu_contents .a_menu > ul > li .sub_menu:after{content: ''; display: table; clear: both}
#menuWrap .menuIn .menu_contents .a_menu > ul > li .sub_menu li{ line-height: 16px; margin-bottom: 20px;}
#menuWrap .menuIn .menu_contents .a_menu > ul > li .sub_menu li:last-of-type{margin-bottom: 0px;}
#menuWrap .menuIn .menu_contents .a_menu > ul > li .sub_menu li a{color: #cccccc; font-family: 'NanumBarunGothic', sans-serif;}
*/


#menuWrap {position:fixed; width:100%; height:100%; left:0; bottom:0;overflow-y:auto; -webkit-overflow-scrolling: touch; z-index:999999; display:none; background: #fff;}
#menuWrap .asideTop {position:relative; text-align:right; background: #0f4c81;}

#menuWrap .search {height:35px; position:relative; left:0; right:0; padding-right:45px; text-align:center; border-bottom: 1px solid #fff; padding: 20px;}
#menuWrap .search .searchBox {width:100%;}
#menuWrap .search .searchBox input {width: 100%; height: 37px; border: 0px none; margin-top: 6px; font-size: 15px; padding: 0; font-family: roboto;border-radius: 50px; text-indent: 15px;line-height: 37px;}
#menuWrap .search .btn_search {width: 45px; height: 42px; line-height: 50px;   position: absolute; bottom: 7px;  right: 23px; color: #fff; text-align: center;;}
#menuWrap .search .btn_search img{width: 23px; vertical-align: inherit;}

#menuWrap nav li {border-bottom:1px solid #ededed; position:relative;}
#menuWrap nav li a {display: block; height: 45px; line-height:45px; padding:0 0 0 20px; margin-right: 40px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; color: #000;}
#menuWrap nav li .fa {position: absolute; top:0; right: 0; width: 40px; text-align: center; height: 45px; line-height:45px;}
#menuWrap nav li > ul {background-color:#fafafa; display:none; border-top:1px solid #ededed;}
#menuWrap nav li > ul > li {border-bottom:0px none; border-top:1px solid #ededed;}
#menuWrap nav li > ul > li:first-child {border-top:0px none;}
#menuWrap nav li > ul > li a {padding:0 40px 0 30px; margin: 0;font-size: 14px;color: #787878 !important;}
#menuWrap nav li > ul > li > ul {border-top:0px none; border-top:1px solid #ccc;}
#menuWrap nav li > ul > li > ul > li {border-bottom:0px none;}
#menuWrap nav li > ul > li > ul > li a {padding:0 0 0 40px; margin: 0; background-color: #DDDDDD;}
#menuWrap nav li.no-line{margin-top:0 !important; border-bottom:0 !important;}

#menuWrap nav li.plan{padding: 25px 10px; box-sizing:border-box; font-size:0;  }
#menuWrap nav li.plan > a{display:inline-block; vertical-align:top; width:calc(50% - 5px); height:auto;  margin:0 0 10px 10px; padding:0; position:relative; }
#menuWrap nav li.plan a:nth-child(odd){margin-left:0;}
#menuWrap nav li.plan > a img{display:block; width:100%; }
#menuWrap nav li.plan > a em{position:absolute; bottom:0; left:0; display:block; text-align:center; width:100%; padding:10px 13px; line-height:1.2; background:rgba(255,255,255,0.7); color:#000; font-size:15px; box-sizing:border-box;  }


#menuWrap .asideBottom {text-align: center;padding: 12px; background: #fafafa;}
#menuWrap .asideBottom ul{margin-top: -5px;display: inline-block; width: 100%;}
#menuWrap .asideBottom ul li{ text-align: center; width: 22%; display: inline-block;}
#menuWrap .asideBottom ul li a{display: block; height: 45px;}
#menuWrap .asideBottom ul li p{font-size: 12px; }
#menuWrap .asideBottom ul li img{}
#menuWrap .asideBottom ul li{}
#menuWrap .asideBottom ul li.ico01 a{background:url('/design/posteam/supermarket/mimg/ham_ico01.png') no-repeat;background-position: center;background-size: 23px;}
#menuWrap .asideBottom ul li.ico02 a{background:url('/design/posteam/supermarket/mimg/ham_ico02.png') no-repeat;background-position: center;background-size: 25px;}
#menuWrap .asideBottom ul li.ico03 a{background:url('/design/posteam/supermarket/mimg/ham_ico03.png') no-repeat;background-position: center;background-size: 23px;}
#menuWrap .asideBottom ul li.ico04 a{background:url('/design/posteam/supermarket/mimg/ham_ico04.png') no-repeat;background-position: center 13px; background-size: 33px;}

#menuWrap h1 {padding: 5px 20px; /*20px 20px 13px;*/}    
#menuWrap h1 a{color:#fff !important; display: block; text-align: center; font-size: 26px;  font-family: roboto; font-weight: 900; letter-spacing: 5px;line-height: 7px;}
#menuWrap h1 a img{/*width: 117px;*/ height:60.72px; }

/* //카테고리 */

/* BASIC css end */