/* BASIC css start */
/* hdTop scoll시 */
.hdTop.hdScroll{ position:fixed; }
.hdBan{position:fixed; top:0px;}


#rightWings { display:none }
.minSizeWrap { position:relative; width:1200px; margin:0 auto; }
#hdWrap {position: relative;top: 0;left: 0;right: 0;z-index:100;height: 260px;background: #fff;}

/* 최상단 영역  */
#hdWrap .hdTop {position:fixed;top:60px;left:0;right:0;z-index: 101;border-bottom: 1px solid #dfdfdf; background: #f7f7f7; letter-spacing: -0.5px; }
#hdWrap .hdTop .listWrap {float:left;-webkit-transition:all 0.3s ease;transition:all 0.3s ease;}
#hdWrap .hdTop .listWrap .list {float:left;}
#hdWrap .hdTop .listWrap .link {position: relative;display:block;padding: 0 10px;height: 37px;line-height: 37px;}
#hdWrap .hdTop .listWrap .list:first-child .link { padding-left:0; }
#hdWrap .hdTop .listWrap .link:hover {  }
#hdWrap .hdTop .listWrap .user_basket_quantity {width: 16px;height: 16px;line-height: 16px;text-align: center;font-size:11px;display: inline-block;}

/* 최상단 왼쪽 */
#hdWrap .hdTop .ht_left {float:left;}
#hdWrap .hdTop .ht_left .ht_home {display:none; position:absolute; left:0; top:0; } 
#hdWrap .hdTop .ht_left .ht_home a {display:block;width: 50px;height:50px;line-height:50px;font-size:22px;text-align:center;}
#hdWrap .hdTop .ht_left .joinPoint { display: inline-block; position: absolute; top: 36px; left: 50%; margin-left: -32px; width: 63px; height: 16px;  line-height: 13px;   padding-top: 4px;
    text-align: center;   font-size: 11px;    -webkit-animation: joinPointAni 3s;    -webkit-animation-iteration-count: infinite;    -webkit-animation-timing-function: ease-in-out;    color: #fff;
    background: #000;    border-radius: 100px;}

#hdWrap .hdTop .ht_left .joinPoint:before {content: "";position:absolute;top: -5px;left:50%;margin-left: -2px;border-style: solid;border-width: 0 5px 6px;border-color: #000 transparent;}

/* 최상단 오른쪽 */
#hdWrap .hdTop .ht_right {float:right; }


@-webkit-keyframes joinPointAni {
  0%  { -webkit-transform: scale(1) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg); }
  5%  { -webkit-transform: scale(1) rotate(0deg) translateX(0px) translateY(-2px) skewX(0deg) skewY(0deg); }
  10% { -webkit-transform: scale(1) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg); }
  15% { -webkit-transform: scale(1) rotate(0deg) translateX(0px) translateY(-2px) skewX(0deg) skewY(0deg); }
  20% { -webkit-transform: scale(1) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg); }
  100%{ -webkit-transform: scale(1) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg); }
}

/* 중앙 로고 영역  */
#hdWrap .hdMid {text-align:center;}
#hdWrap .hdMid:after {content:"";display:block;clear:both;}
#hdWrap .hdMid .hd_logo {position: relative;width: 200px;text-align: center;top: 137px; transition:all 0.3s ease;-webkit-transition:all 0.3s ease;font-size: 42px;font-weight: 700;}


/* 카테고리, 전체메뉴 */
#hdWrap .hdBtm {position:fixed;top: 210px;left:0;right:0;height: 49px;transition:all 0.3s ease;-webkit-transition:all 0.3s ease;  border-top: 1px solid #dfdfdf;border-bottom: 1px solid #dfdfdf;}

/* 전체보기버튼 */
#hdWrap .hdBtm .menuArea {position:absolute;top:0;left:0;}
#hdWrap .hdBtm .cartArea {position:absolute;top:0;right:0;}
#hdWrap .hdBtm .menuArea a {display:block;width: 50px;height: 50px;line-height:50px;text-align: center;     }
#hdWrap .hdBtm .cartArea a {display:block; width: 50px;height: 50px; line-height:50px; text-align: center;background: #092749; color: #fff;}
#hdWrap .hdBtm .menuArea a:hover { }
#hdWrap .hdBtm .menuArea i { font-size: 26px; vertical-align:middle; line-height:50px; }



/* 전체보기 레이어 */
#hdWrap .hdBtm .allMenu {display:none;position:absolute;top: 0px;left:0;}
#hdWrap .hdBtm .allMenu #btn-allMenuClose {position:relative;width: 52px;height: 49px;font-size: 22px;color:#000;text-align:center;line-height: 52px;background: #fff;cursor:pointer;z-index:99;border: 1px solid #000;border-bottom: 1px solid #fff;}
#hdWrap .hdBtm .allMenu #btn-allMenuClose i{line-height:49px; }
#hdWrap .hdBtm .allMenu .allMenuBx {position:absolute;top: 50px;left:0;right:0;width: 1200px;background: #fff;border: 1px solid #000;z-index: 98;}
#hdWrap .hdBtm .allMenu .allMenuBx .allMenuInner {padding: 50px; ;overflow:hidden;}
#hdWrap .hdBtm .allMenu .allMenuBx .allMenuInner .allMenuList { width:80%; float:left; *zoom:1;}
#hdWrap .hdBtm .allMenu .allMenuBx .allMenuInner .allMenuList:after { display:block; clear:both; content:'' }

#hdWrap .hdBtm .allMenu .allMenuBx .allMenuInner .allMenuList dl { }

#hdWrap .hdBtm .allMenu .allMenuBx .allMenuInner dl dt {margin-bottom: 4px;}
#hdWrap .hdBtm .allMenu .allMenuBx .allMenuInner dl dt a {padding-left:5px;font-size:13px;height:30px;line-height:30px; font-weight:bold; }
#hdWrap .hdBtm .allMenu .allMenuBx .allMenuInner dl dd a {display: block;padding: 3px 0 3px 5px;color: #777;}
#hdWrap .hdBtm .allMenu .allMenuBx .allMenuInner dl dd a:hover {background:#eaeaea; color:#111;}
#hdWrap .hdBtm .allMenu .allMenuBx .allMenuInner .boardList {padding-left:5px;height:44px;border-top: 1px solid #ddd;}
#hdWrap .hdBtm .allMenu .allMenuBx .allMenuInner .boardList a {display:inline-block;margin-right:35px;height:44px;line-height:44px;}

.allCommList{width:20%; float:left;}
.allCommList ul li:nth-child(1){margin-bottom:10px; line-height:1.6em;}
.allCommList ul li{padding:3px 0;  line-height:1.4em; }


/* 카테고리 */
#hdWrap .hdBtm .cateWrap {text-align:left;margin: 0 0px 0 50px; max-width:900px; position: relative; float:left; }
#hdWrap .hdBtm .cateWrap:after {content:"";display:block;clear:both;}
#hdWrap .hdBtm .cateWrap a {font-size: 13px; }
#hdWrap .hdBtm .cateWrap a:hover { }
#hdWrap .hdBtm .cateWrap .tmenu {position: relative;padding: 17px 32px;display: inline-block;}
#hdWrap .hdBtm .cateWrap .tmenu .depth2 { display:none; position: absolute;background: #fff;top: 49px;left: 50%;width: 118px;margin-left: -60px;padding: 10px 0;z-index: 97;border: 1px solid #dfdfdf;
    border-top: 0;}
#hdWrap .hdBtm .cateWrap .tmenu .depth2 li a { display: block; font-size: 13px; line-height: 24px; }
#hdWrap .hdBtm .cateWrap .tmenu .depth2 li a:hover {background:#eaeaea; color:#111; border-bottom: 0 }


/* 카테고리 우측 메뉴 */
.cate_right{max-width:200px; float:right;}
.cate_right ul li{padding:17px 30px 17px 0px; float:left;}
.cate_right ul li:nth-child(3){padding:17px 0px !important;}
.cate_right ul li a{font-size:13px;}

/* 상단고정*/
#hdWrap.headerFix { height: 110px;-webkit-box-shadow: 0 1px 4px 0 rgba(168,168,168,0.2);-moz-box-shadow: 0 1px 4px 0 rgba(168,168,168,0.2);box-shadow: 0 1px 4px 0 rgba(168,168,168,0.2); }
#hdWrap.headerFix .hdBtm {position:fixed;top: 97px;left:0;right:0;z-index: 99;    background: #fff;}
#hdWrap.headerFix .ht_left .listWrap {}
#hdWrap.headerFix .snsArea, #hdWrap.headerFix .searchArea { display:none; }
#hdWrap.headerFix .hdMid .hd_logo {top: 0px;}
#hdWrap.headerFix .hdMid .hd_logo img{    width: 120px;} 
#hdWrap.headerFix .hdTop { background: #fff; position:fixed; }


/* 우측 메뉴 */
#fxedMenu { margin-top:-110px; position:fixed; top:50%; right:10px; z-index:100 }
#fxedMenu .rightMenu { width:44px }
#fxedMenu .rightMenu li { position:relative }
#fxedMenu .rightMenu li a { display:block; margin-top:-1px; width:40px; height:40px; font-size:22px; color:#383838; text-align:center; line-height:40px;  }
#fxedMenu .rightMenu li .tx { display:none; position:absolute; top:12px; right:43px; width:90px; text-align:right }
#fxedMenu .rightMenu li:hover .tx { display:block }
#fxedMenu .search { display:none;     position: absolute;  top: 0px;  right: 0px;  background-color: #e3e3e3;  width: 210px;  height: 44px;  z-index: 10;  border-radius: 100px; }
#fxedMenu .search input { width:140px; height:44px; border:none; background:none; padding-left:10px; font-size:13px; color:#000; }
#fxedMenu .search .btn_search {     position: absolute;  top: -9px;  left: 135px;  font-size: 20px;  color: #000; }
#fxedMenu .search .btn_searchClose { position:absolute; top:-9px; right:4px;  font-size:20px;/* background-color:#fff; */}

#header .searchArea { position:absolute; top:12px; right:0; width:204px; height:40px; border-bottom:1px solid #000 }
#header .searchArea .search { position:relative; width:204px; height:40px }
#header .searchArea .search input { padding-left:10px; width:164px; height:39px; line-height:40px; border:none; background:#fff }
#header .searchArea .search a { display:block; position:absolute; top:0; right:0; width:30px; height:40px; text-indent:-9999em; background:url(//image.makeshop.co.kr/makeshop/d3/basic_simple/common/btn_search.gif) 0 0 no-repeat }


/* BASIC css end */

