/* BASIC css start */
#topBannerNew { overflow: hidden; background: var(--bg-c, #786b63); color: var(--font-c, #f5ede5); }
#topBannerNew,
#topBannerNew .swiper-slide { height: 35px; }
#topBannerNew .swiper-slide { text-align: center; display: flex; flex-flow: row nowrap; align-items: center; justify-content: center; }
#topBannerNew .swiper-slide a { display: block; width: 100%; font-family: 'Pretendard'; font-weight: 300; font-size: 13px; color: inherit; }

#quickTodayView { width: 100%; position: fixed; bottom: 30px; left: 0; transition: .4s; opacity: 0; visibility: hidden; }
#quickTodayView.active { z-index: 10000; opacity: 1; visibility: visible; }
#quickTodayView .btn_close { display: block; width: 50px; height: 55px; background: #fff url(/design/soogee77/dnrweb/close_27x27.gif) no-repeat 50% 50%; text-indent: -50000px; outline: 0; position: absolute; top: 101px; right: 0; }
#quickTodayView .box { height: 142px; padding: 30px 50px 30px 0; background: #fefefe; text-align: center; }
#quickTodayView .content_box { width: 790px; margin: 0 auto; text-align: center; }
#quickTodayView .content_box h2 { padding-bottom: 17px; font-weight: 700; font-size: 19px; color: #e2e2e2; }
#quickTodayView .today-cont .slick-list { width: 694px; margin: 0 auto; }
#quickTodayView .today-cont .slick-prev { display: block; width: 14px; height: 27px; background: url(/design/soogee77/dnrweb/arrow_left_14x27_bcbcbc.gif) no-repeat; border: 0; text-indent: -50000px; outline: 0; position: absolute; top: 32px; left: 0; }
#quickTodayView .today-cont .slick-next { display: block; width: 14px; height: 27px; background: url(/design/soogee77/dnrweb/arrow_right_14x27_bcbcbc.gif) no-repeat; border: 0; text-indent: -50000px; outline: 0; position: absolute; top: 32px; right: 17px; }

#quickScroll { width: 40px; height: 184px; position: fixed; bottom: 30px; right: 30px; z-index: 110; }
#quickScroll a { display: block; width: 40px; height: 40px; background-position: 50%; background-repeat: no-repeat; background-size: 40px auto; text-indent:-50000px; }
#quickScroll a:not(:nth-of-type(1)) { margin-top: 9px; }
#quickScroll a.home { background-image:url(/design/soogee77/dnrweb/quick_home.png); }
#quickScroll a.up { background-image:url(/design/soogee77/dnrweb/quick_scroll-top.png); }
#quickScroll a.kakao { background-image:url(/design/soogee77/dnrweb/quick_kakao.png); }
#quickScroll a.happytalk { background-image:url(/design/soogee77/dnrweb/happytalk_59x59.png); visibility: hidden; }
#quickScroll a[href="#quickTodayView"] { background-image:url(/design/soogee77/dnrweb/quick_today.png); }


#happy10_event { width: 50px; position: absolute; top: 0; left: 0; z-index: 155;  }
#happy10_event .btn_event { display: block; width: 50px; height: 38px; padding-top: 12px; background: #8648d2; font-size: 11px; line-height: 13px; font-weight: 700; color: #fff; }
#happy10_event .btn_favorite { display: block; width: 49px; height: 20px; padding-top: 29px; background: #fff url(/design/soogee77/dnrweb/icon_favorite.gif) no-repeat 50% 8px; border: 1px solid #f3f3f3; border-left: 0; text-align: center; letter-spacing: -1px; }


#quickWide { width: 174px; height: 100%; padding: 0 43px; background: #fff; border-left: 1px solid #d8d8dc; position: fixed; top: 0; right: 0; z-index: 10000; display: none; }
#quickWide .btn_close { display: block; width: 50px; height: 50px; background: #6d6d6d url(/design/soogee77/dnrweb/close_27x27_fff.gif) no-repeat 50% 50%; text-indent: -50000px; outline: 0; position: absolute; top: 0; left: -51px; }
#quickWide > h2 { padding: 28px 0 14px; }
#quickWide form { font-size: 0; line-height: 0; overflow: hidden; }
#quickWide form p { width: 172px; height: 38px; margin-bottom: 7px; background: #fff; border: 1px solid #d7d5d5; position: relative; }
#quickWide form p:last-child { margin-bottom: 14px; }
#quickWide form p label,
#quickWide form p input { display: block; width: 172px; height: 38px; background: #fff; border: 0; font-size: 11px; line-height: 38px; text-indent: 13px; }
#quickWide form p label { color: #a3a3a3; position: absolute; top: 0; left: 0; }
#quickWide form p input { color: #000; }
#quickWide .guide { padding: 0 0 14px; font-size: 13px; line-height: 25px; color: #1e1e1c; }
#quickWide .guide strong { color: #8648d2; }
#quickWide .link a { float: right; display: block; width: 82px; height: 23px; margin-bottom: 5px; background: #fff; border: 1px solid #d7d5d5; text-align: center; font-size: 11px; line-height: 23px; color: #000; }
#quickWide .link a.btn_login { float: left; }
#quickWide form .link a:last-child { float: none !important; clear: both; width: auto; }
#quickWide span.title { font-size: 12px; line-height: 23px; color: #181600; }
#quickWide dl { clear: both; }
#quickWide dl dt { padding: 22px 0 10px; font-weight: 700; font-size: 12px;  } 
#quickWide dl dd { font-size: 0; line-height: 0; }
#quickWide .sns_login dd { position: relative; padding-bottom: 15px; }
#quickWide .sns_login a { display: block; margin-bottom: 5px; }
#quickWide .mypage dd { margin-left: -12px; position: relative; }
#quickWide .mypage dd a { display: inline-block; width: 50px; height: 92px; margin-left: 12px; vertical-align: top; font-size: 11px; line-height: 15px; text-align: center; letter-spacing: -1px; color: #8d9197; }
#quickWide .mypage dd a img { display: block; margin-bottom: 3px; }
#quickWide .mypage dd a:hover { color: #0a0a0a; }
#quickWide .tabs.content_view { height: auto; margin: 30px 0 0; padding: 0; border: 0; }
#quickWide .tabs.content_view > ul { width: 100%; margin: 0 0 18px; padding: 0; list-style: none; font-size: 0; line-height: 0; text-align: center; position: relative; }
#quickWide .tabs.content_view > ul > li { display: inline-block; width: 50%; padding: 0; background: #fff; }
#quickWide .tabs.content_view > ul > li:first-child,
#quickWide .tabs.content_view > ul > li:last-child { padding: 0; }
#quickWide .tabs.content_view > ul > li > a { display: block; height: 18px; padding: 0; background: none; border: 0; border: 1px solid #fff; border-bottom: 1px solid #e1e1e1; font-weight: 700; font-size: 12px; line-height: 18px; color: #1e1e1c; }
#quickWide .tabs.content_view > ul > li > a img { margin-top: 2px; }
#quickWide .tabs.content_view > ul > li.active > a,
#quickWide .tabs.content_view > ul > li.selected > a { padding: 0 !important; background: none !important; border: 1px solid #e1e1e1; border-bottom: 1px solid #fff; color: #1e1e1c; }
#quickWideBank { display: none; }
#quickWideBank dt { padding: 0; font-size: 14px; font-weight: 700; color: #282828; display: none; }
#quickWideBank dd { padding: 0 5px; }
#quickWideBank .name { padding: 7px 5px 10px; font-size: 12px; color: #717171; }
#quickWideBank .name strong { color: #8548d1; }
#quickWideBank ul { padding-bottom: 5px; }
#quickWideBank li { display: inline-block; font-size: 12px; line-height: 22px; color: #717171; }
#quickWideBank li.bank1,
#quickWideBank li.bank3 { width: 194px; }
#quickWideBank li.bank1 strong { color: #ce8615; }
#quickWideBank li.bank2 strong { color: #018eeb; }
#quickWideBank li.bank3 strong { color: #0366b4; }
#quickWideBank li.bank4 strong { color: #4e5666; }
#quickWideBank dd a { display: block; height: 31px; padding-left: 10px; background: url(/design/soogee77/dnrweb/select_arrow_right.gif) no-repeat 100% 50%; border: 1px solid #efefef; font-size: 11px; line-height: 31px; color: #656363; }


#quickWideCS h3 { font-weight: 700; font-size: 12px; color: #060606; }
#quickWideCS .tel { padding: 7px 0; text-align: center; font-weight: 700; font-size: 20px; color: #060606; }
#quickWideCS .tel:before { content: ''; display: inline-block; width: 26px; height: 23px; background: url(/design/soogee77/dnrweb/quick_cs_tel.gif) no-repeat; }
#quickWideCS .time { text-align: center; font-size: 12px; line-height: 18px; color: #a7a7a7; }

#header { display: flex; flex-flow: row wrap; align-items: center; min-height: 60px; padding: 0 12px 0 50px; background:#fff; font-family: 'Pretendard'; position: relative; transition: .4s; opacity: 0; }
#header.active { opacity: 1; }
#header * { font-family: inherit; }

#header .logo { margin: 0 0 0; }

#header .category { position: relative; }
#header .category,
#header .category > ul { display: flex; flex-flow: row wrap; align-items: center; font-family: 'Pretendard'; }
#header .category li,
#header .category li > a,
#header .category li > a > span { font-family: inherit }
#header .category > ul { margin: 0; padding: 0 0 0 8px; }
#header .category > a { padding: 19px 0 0; flex: 0 0 49px; height: 15px; display: flex; flex-flow: column nowrap; justify-content: center; position: absolute; top: 0; left: 0; }
#header .category > a > span,
#header .category > a::before, 
#header .category > a::after { width: 22px; height: 3px; background: #4a4a4a; font-size: 0; line-height: 0; }
#header .category > a::before { content: ''; border-bottom: 1px solid #f1f1f1; }
#header .category > a > span { margin: 1px 0; border-top: 1px solid #f1f1f1; }
#header .category > a::after { content: ''; border-top: 1px solid #f1f1f1; }
#header .category > ul > li { padding: 0 0 0 1px; font-weight: 300; font-size: 13px; color: #646464; }
#header .category > ul > li > a { display: block; padding: 0 12px; }
#header .category > ul > li > a,
#header .category > ul > li > a > span { font-weight: inherit; font-size: inherit; color: inherit; }
#header .category > ul > li > a:hover > span,
#header .category > ul > li.big { color: var(--font-c, #000); }
#header .category > ul > li.big > a:hover > span { font-weight: 400; }
#header .category > ul > li.sub { position: relative; }
#header .category > ul > li.sub > a > span { 
    position: relative;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
}
#header .category > ul > li.sub > a > span::after { content:''; margin: 0 0 0 5px; width: 9px; height: 6px; background: url(/design/soogee77/dnrweb/arrow_9x6.gif) no-repeat 50%; }

#header .category > ul > li.sub > a.active::before { opacity: 1; }
#header .category > ul > li.sub > a.active::after { width: 100%; opacity: 1; }
#header .category > ul > li.sub ul { 
    box-sizing: border-box; 
    min-width: 116px; 
    padding: 11px 5px; 
    background: #fff; 
    border: 1px solid #bfbfbf; 
    text-align: center; 
    white-space: nowrap; 
}
#header .category > ul > li.sub ul li a { display: block; padding: 8px 0; font-weight: 400; font-size: 13px; line-height: 14px; color: #787878; transition: .4s }
#header .category > ul > li.sub ul li a:hover { color: #000; }
#header .category > ul > li.new > a > span::after { content: ''; display: inline-block; vertical-align: top; margin: 2px 0 0 5px; width: 6px; height: 6px; background: #dd1919; border-radius: 3px; }

#header .util { display: flex; flex-flow: row wrap; align-items: center; margin: 0 0 0 auto; }
#header .util li { position: relative; }
#header .util a { display:block; font-size: 14px; color: #000; }
#header .util > li > a { position: relative; }
#header .util > li > a > p { display: inline-block; margin: 0 -3px 0 6px; padding: 0 6px; height: 23px; text-align: center; background: #333; border-radius: 3px; white-space: nowrap; font-size: 12px; line-height: 23px; color: #fff; }

#header .util li.log { padding: 0 11px; }
#header .util li.log > a > span { display: block; width: 17px; height: 20px; background: url(/design/soogee77/dnrweb/member_17x20.png) no-repeat; text-indent: -50000px; }
#header .util li.board > a { font-weight:700; color:#000; }
#header .util li.sub { position: relative; }
#header .util li.sub > a > span { position: relative; }
#header .util li.sub > a.active > span::after { width: calc(100% + 10px); opacity: 1; }
#header .util li.sub ul { 
    box-sizing: border-box; 
    min-width: 106px; 
    padding: 8px 5px; 
    background: #fff; 
    border: 1px solid #e7e7e7; 
    text-align: center; 
}
#header .util li.sub ul li { display: block; background: none; color: #787878; }
#header .util li.sub ul li a,
#header .util li.sub ul li a > span { color: inherit; }
#header .util li.sub ul li a { padding: 7.5px 0; font-weight: 400; font-size: 12px; line-height: 12px; transition: .4s; }
#header .util li.sub ul li a:hover { color: #000; }

#header .util li.cart { padding: 0; margin: 0 3px; }
#header .util li.cart::before { display: none; }
#header .util li.cart a { display: inline-flex; width: 23px; height: 25px; background: url(/design/soogee77/dnrweb/icon_cart_23x25.png) no-repeat 50%; position: relative; }
#header .user_basket_quantity { display: inline-flex; flex-flow: row wrap; justify-content: center; align-items: center; width: 18px; height: 18px; border-radius: 50%; background: #333; font-family: 'Pretendard'; font-size: 12px; color: #fff; position: absolute; top: 10px; left: 10px; }
#header .util li.big { margin-left: 21px; padding: 0; }
#header .util li.big::before { display: none; }
#header .util li.big a { font-weight: 500; font-size: 17px; color: #272727; }
#header .util li.big a::after { content: ''; display: inline-block; vertical-align: top; width: 4px; height: 4px; border-radius: 2px; background: #dd1919; }
#header .util li:not(.big) a { font-family: 'Pretendard'; }

#quickSearch { margin: 0 0 0 22px; flex: 0 0 168px; }
#quickSearch form { background: none; border-bottom: 2px solid #000; position: relative; }
#quickSearch label { padding: 0 0 0 2px; font-size: 13px; color: #777; position: absolute; top: 50%; left: 0; transform: translateY(-50%);  }
#quickSearch input { box-sizing: border-box; padding-right: 20px; width: 100%; height: 31px; border: 0; background: none; font-size: 14px; color: #000; }
#quickSearch a { width: 19px; height: 23px; background: url(/design/soogee77/dnrweb/icon_search_000_19x23.png) no-repeat 50%; font-size: 0; line-height: 0; position: absolute; top: 50%; right: 0; transform: translateY(-50%); }


#header.fixed { box-sizing: border-box; width: 100%; background: #FFFFFFE0; border: 0; 1px 0; position: fixed; top: 0; left: 0; z-index: 10001; }

/* BASIC css end */

