/* BASIC css start */
.hdTop { width:100%; border-bottom: 1px solid #e5e5e5; } 
.hdTop .realtop { display: flex; width: 96%; min-width: 1280px; max-width: 1600px; margin:0 auto; padding: 17px 0; justify-content: space-between; } 
.hdTop .hdLeft { overflow:hidden; } 
.hdTop .hdLeft a { font-size: 16px; color: #777777; font-weight: bold; font-family: "맑은 고딕",'Malgun Gothic',sans-serif; margin-right: 33px; } 
.hdTop .hdLeft a:nth-child(1){color:#0029ff;}
.hdTop .hdLeft a:nth-child(2){color:#d80c0c;}
.hdTop .hdLeft a:nth-child(3){color:#ffb606;}



#header { margin:0 auto; position:absolute;top:0;left:0;right:0; z-index:100 }
#header.headerFix { position:fixed;top:0;left:0;right:0; }

#header .headerBox { width:1200px;height:127px;margin:0 auto; position:relative; }
#header .headerBox .logoArea { text-align:center; z-index:10;margin:0 auto;}
#header .headerBox .logoArea .logo a { font-size:48px; color:#2c2c2c; }
#header .headerBox .logoArea .logo a img{width:150px;}

#header .headerTop { position:relative; }
#header .headerTop .hdBoard { float:left;}
#header .headerTop .hdBoard li { position:relative; float:left; padding:20px 20px 0 0; }
#header .headerTop .hdMenu {float:right; position:relative;}
#header .headerTop .hdMenu li { position:relative; float:left; padding:20px 0 0 20px; }
#header .headerTop .hdMenu li a { font-size:12px; }
#header .headerTop .hdMenu li a:hover { text-decoration:underline; }

/* 카테고리 */
#header .headerBottom .cateWrap {position: relative; text-align:center;}
#header .headerBottom .cateWrap a:hover { border-bottom:1px solid #2d2d2d }
#header .headerBottom .cateWrap .tmenu {position: relative;display: inline-block; padding:0 16px;}
#header .headerBottom .cateWrap .tmenu a { font-size:16px; line-height:60px; }
#header .headerBottom .cateWrap .tmenu .depth2 { display:none; position: absolute;background: rgba(255,255,255,0.8);top:52px;left: 50%;width: 110px;margin-left: -55px;padding: 10px 0; z-index: 97;text-align:center;}
#header .headerBottom .cateWrap .tmenu .depth2 li a {font-size: 13px; line-height: 26px; }
#header .headerBottom .cateWrap .tmenu .depth2 li a:hover { color:#2d2d2d; }

/* 상단 고정 */
#headerFix { display:none; position:fixed; top:0; left:0; right:0; z-index:200;background:rgba(255,255,255,0.9); }
#headerFix .headerGnb {position:relative;min-width:1200px;width:1200px;margin:0 auto;}
#headerFix .headerGnb .logoArea { position:absolute; left:0; top:5px; z-index:10}
#headerFix .headerGnb .logoArea .logo a { font-size:40px; color:#2e2e2e; }

/* 상단 고정 - 카테고리 */
#headerFix .headerGnb .cateWrap {position: relative; text-align:right; }
#headerFix .headerGnb .cateWrap:after {content:"";display:block;clear:both;}
#headerFix .headerGnb .cateWrap a:hover { border-bottom:1px solid #2d2d2d }
#headerFix .headerGnb .cateWrap .tmenu {position: relative;display: inline-block; padding:0 15px;}
#headerFix .headerGnb .cateWrap .tmenu a { font-size:16px; line-height:62px; }
#headerFix .headerGnb .cateWrap .tmenu .depth2 { display:none; position: absolute;background:rgba(255,255,255,0.9);top:62px;left: 50%;width: 110px;margin-left: -55px;padding: 10px 0; z-index: 97;text-align:center;}
#headerFix .headerGnb .cateWrap .tmenu .depth2 li a {font-size: 14px; line-height: 26px; }
#headerFix .headerGnb .cateWrap .tmenu .depth2 li a:hover { color:#2d2d2d; }

#headerFix .headerGnb .searchOpen { width:50px; height:50px; text-align:center; }
#headerFix .headerGnb .searchArea { display:none; position:fixed; top:80px; left:0; right:0; width:100%; height:80px; background-color: #fff; z-index:10; }
#headerFix .headerGnb .search { position:relative; width:45%; margin:0 auto; border-bottom:2px solid #2e2e2e;padding:10px 0 0; }
#headerFix .headerGnb .search input { width: 100%; height:44px; margin: 0 95px 0 0; border:none; font-size:20px; }
#headerFix .headerGnb .search .btnSch { position:absolute; top:8px; right:4px; color:#2e2e2e; font-size:30px }
#headerFix .headerGnb .search .searchClose { position:absolute; top:0; right:-50px; line-height:55px; font-size:24px; background-color:#fff; }

/* 우측 퀵 버튼 */
.rightQuick { position:fixed;top: 35%;right:23px; z-index:110; display:block; width:48px;text-align:center; }
.rightQuick i { vertical-align:top; margin:6px 0;color:#2c2c2c; font-size:24px;transition:all .4s ease-out }
.rightQuick span.txt { font-size:15px;opacity:0;position:absolute;top:7px;left:-34px; transition:all .4s ease-out}
.rightQuick li:hover span.user_basket_quantity,
.rightQuick li:hover i { opacity: 0.3; }
.rightQuick li:hover span.txt { opacity: 1; }
.rightQuick li { position:relative; }
.rightQuick .cart span.user_basket_quantity {position:absolute; top:0;right:6px;background:#2c2c2c;border-radius:50%; color:#fff;width:18px;height:18px;line-height:18px;}
.rightQuick li a.searchOpen { font-size:24px;cursor:pointer;vertical-align:top; }
.rightQuick .searchArea { display:none; position:fixed; top:0; left:0; right:0; width:100%; height:100%; background:rgba(255,255,255,0.9); z-index:10;padding:10px 0 0; }
.rightQuick .search { position:relative; width:45%; margin:10% auto 0; border-bottom:2px solid #2e2e2e;padding:10px 0 0; }
.rightQuick .search input { width: 100%; height:44px; margin: 20% 0 0 0; border:none; font-size:20px;  background:transparent; }
.rightQuick .search .btnSch { position:absolute; bottom:10px; right:4px; color:#2e2e2e; font-size:30px; }
.rightQuick .search .searchClose { position:absolute; top:0; right:50%; font-size:24px; }
.rightQuick .search i { opacity: 1 !important; }

.dn{display:none !important;}
/* BASIC css end */

