/* BASIC css start */
/********************************* header *********************************/

/* 상단 고정관련 애니메이션 */
#header.fixHeader1{position:fixed;top:-70px;left:0;z-index:99; min-width:1200px;}
#header.fixHeader2{position:fixed;top:48px;left:0;z-index:99; padding:0 30px; margin-bottom:4px; background: #fff;background-color: rgba( 255,255,255,0.95 ); min-width:1200px;}
#header.fixHeader2 .logoArea_right .btLogin > div a{height:53px;}
#header.fixHeader2 .logoArea_right .btLogin{height:53px}

/* 전체카테고리 와이드일때 */
#header #allCate.hasWide{ position: absolute;top: 92px;left: 30px;width: calc(100% - 60px);padding: 40px;background: rgba(255,255,255,0.96);box-sizing: border-box;box-shadow: 0px 5px 13px 5px rgba(27, 27, 27, 0.17);}
#header #allCate.hasWide h1 {display:block !important}

/* 전체카테고리 와이드아닐때 */
#header.fixHeader2 #allCate.hasWide,
#header #allCate { box-shadow: 0px 4px 5px 0px rgba(56, 56, 56, 0.08);left: 0;width: 100%;top: 58px;padding: 29px 40px 44px 40px;border-top: 1px solid #eee;background: #fff;background-color: rgba( 255,255,255,0.95 );}
#header.fixHeader2 #allCate.hasWide h1,
#header #allCate h1 {display:none !important}


/* 탑라인 */
#topLine_wrap {position:relative;height:51px;}
#topLine{position: fixed;top: 0;left: 0;width: 100%;min-width:1200px; background:#fff;background-color: rgba( 255, 255, 255, 0.9 ); padding:12px 30px;z-index: 99999;box-sizing: border-box;border-bottom: 1px solid #eee;}

#topLine .topLine_bloc { max-width:1600px;margin:0 auto;}

/* 소셜 */
.topLine_bloc > .follow {width:650px;}
.topLine_bloc > .follow li { cursor:pointer;position: relative;width: 28px;float:left;margin-right:3px;}
.topLine_bloc > .follow li a  {background:#eee; width:24px;border-radius:5px;}
.topLine_bloc > .follow li i {font-size:14px;line-height:24px;color:#333;}


#topLine .btHome {opacity:0;visibility:hidden;position:absolute;left:30px;text-align:center;top:19px;z-index:99;width: 18px;height: 18px;font-size:12px;color:#888}

#topLine a {display:inline-block;font-size:12px;letter-spacing:-0.5px;color:#555;font-weight:400; text-align:center; cursor:pointer;}
#topLine a:hover{color:#535353;}
#topLine.fixTopLine {background: #fff;background-color: rgba( 255,255,255,0.95 );}
#topLine.fixTopLine a {}
#topLine .left {float:left;}
/* world */
#topLine .worldver { position:relative;display:inline-block;}
#topLine .worldver div { position: absolute;left: -8px;top: 1px;opacity: 0;visibility: hidden;padding-top: 25px;}
#topLine .worldver:hover div { opacity:1;visibility:visible;}
#topLine .worldver div ul { background: #fff;padding: 6px 9px 6px 9px;width: 82px;box-shadow: 0px 7px 5px rgba(45,45,45,0.22);}
#topLine .worldver > a { display:inline-block;position:relative;padding-right:12px;font-family:lato;font-size:10px;letter-spacing:1px;}
#topLine .worldver > a:after { content: "";position: absolute;right: 8px;top: 4px;width: 1px;height: 11px;background: #dcdcdc;}
#topLine .worldver a img { vertical-align:middle !important;margin-right:4px;}
#topLine .worldver div a { text-align: left;display: BLOCK;position: relative;font-family: lato;font-size: 10px;letter-spacing:0.5px;height: 25px;line-height: 25px;border-bottom: 1px solid #f5f5f5;}
#topLine .worldver div img { margin-right: 10px;}
#topLine .worldver div a:last-child { border-bottom:0;}


#topLine .right {float:right;padding-top:4px;}
#topLine .right > li {display:inline-block;position:relative;padding-left:20px;}
#topLine .right > li:after {content: "";position: absolute;left:8px;top: 4px;width: 1px;height: 11px;background: #dcdcdc;}
#topLine .right > li.first:after {content:"";display:none;}
#topLine .right > li img {vertical-align:middle !important;margin-left:4px;margin-top:-2px;opacity:0.8;}
#topLine .right > li.btn_join {position:relative;}
#topLine .right > li.btn_join .ani {position: absolute;left:9px;min-width:52px;bottom: -23px;text-align: center;padding: 1px 6px;background:#ccc; border-radius: 5px;letter-spacing: 1px;color: #fff;font-family: lato;z-index:99;}

#topLine.fixTopLine {}
#topLine.fixTopLine .left{padding-left:25px;}
#topLine.fixTopLine .btHome {transition-delay:0.5s;opacity:1;visibility:visible;}

/* 탑라인 우측 서브메뉴 */
#topLine .right > li:hover > .subMenu {visibility:visible;opacity:1;top:13px;}
#topLine .subMenu { position: absolute;width: 145px;padding: 15px 20px;margin: 20px 0 0;box-shadow: 0 0 5px 2px rgba(90,90,90,0.1);box-sizing: border-box;background: #fff;right: -37px;top: 15px;z-index: 999;visibility:hidden;opacity:0;}
#topLine .subMenu::after { position: absolute;top: -4px;right: 53px;width: 3px;height: 4px;box-shadow: 0 0 7px 2px rgba(195,195,195,0.1); display: block;z-index: -1;content: "";}
#topLine .subMenu li {display: block; line-height: 26px; border-bottom: 1px solid #ececec; padding:0 2px;}
#topLine .subMenu li:last-child {border:0;margin:0;}
#topLine .subMenu li,
#topLine .subMenu li a {-webkit-transition:all 0.2s;-moz-transition:all 0.2s;-o-transition:all 0.2s;transition:all 0.2s;}
#topLine .subMenu li:hover a {padding-left:2px;color:#666;}


/* 로고라인 */

#top_logo { width:100%;height:auto; text-align:center; }
#top_logo .logo_center { }
#top_logo .logo_center .logo {  }
#top_logo .logo_center .logo a { font-family: Open Sans,'맑은 고딕','Malgun Gothic';color: #333;letter-spacing: 2.4px;font-weight: 400;font-size: 25px;line-height: 5em;}
#top_logo .logo_center .logo a img { margin-top:26px; }

#header_wrap{position:relative; width:100%;min-width:1200px;height:58px;z-index:9999;margin-top:-1px;}
#header{ text-align:center; border-top:1px solid #eee; position:relative; width:100%; padding:0px 30px 0; box-sizing:border-box; z-index:100; background:#fff;  box-shadow: 0 2px 5px 0 rgba(0,0,0,0.1)}
#header .logoArea{padding:0; box-sizing:border-box; transition:.4s ease-in-out; max-width:1600px; margin:0 auto;position:relative;}
#header .logoArea:after{content:""; clear:both; display:block;}
#header .logoArea .logo{display:inline-block; vertical-align:middle;}
#header .logoArea .logo a{display:block; color:#434343; letter-spacing:0.4px; font-weight:600; font-size:24px;line-height:74px;}
#header .logoArea .logo a.one {display:none;}
#header .logoArea .logo a span{font-family: Poppins;}


#header .logoArea_left {display:inline;}
#header .logoArea_left .leftIcon { position:absolute;top:0;left:0; }


#header .logoArea_right{position:absolute;right:0;top:0; font-size:0; line-height:0; letter-spacing:0;}
#header .logoArea_right .rightIcon{position:relative; display:inline-block; vertical-align:middle; text-align:center; padding:11px 18px; font-size:13px; cursor:pointer;}
#header .logoArea_right .rightIcon:before{content:""; width:1px; height:20px; top:19px;left:0px; background:#ececec; position:absolute;}
#header .logoArea_right .rightIcon a{position:relative;}
#header .logoArea_right .rightIcon a img{opacity:0.95;}
#header .logoArea_right .rightIcon i{font-size:19px;line-height:36px;text-align:center; color:#5b5b5b; *color:#bcbab8; transition: .1s ease-in-out;}
#header .logoArea_right .rightIcon:first-child:before{background:transparent;}
#header .logoArea_right .rightIcon:last-child{padding-right:0;}
#header .logoArea_right .rightIcon i:hover{color:#988d81;}

/* 검색영역 */
.headerSearch {    position: absolute;right:5px;top: 13px;width: 190px;z-index: 101;box-sizing: border-box;border-radius: 2px;display: none;background: #f5f5f5;border-radius: 17px;}
.headerSearch > ul {text-align:Center;}
.headerSearch input {display:inline-block;width:100%;border:0 !important;height:30px !important;line-height:30px !important;box-sizing:border-box;padding:5px !important;padding-left:15px !important;background:transparent; font-size:14px;}
.headerSearch .btn_search {position:absolute; right:5px; top:4px;cursor:pointer;}
.headerSearch .btn_search i {  font-size: 19px;padding: 2px 8px 0 0;border-radius: 15px;color: #484848;}


/* 카테고리 */
#header .category{ display:inline-block; vertical-align:middle; position:relative; text-align:center; box-sizing:border-box; font-size:0; line-height:0; letter-spacing:0;}
#header .category > ul{display:inline-block; vertical-align:middle;}
#header .category > ul > li{position:relative; display:inline-block; vertical-align:middle; position:relative;}
#header .category > ul > li > a { position: relative;display: block;padding: 20px 30px;font-size: 14px;line-height: 18px;height: 18px;color: #555; font-weight:bold; visibility: visible;letter-spacing: 0px;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;}
#header .category:hover > ul > li > a {opacity:0.55;}
#header .category:hover > ul > li:hover > a {opacity:1;}
#header .category > ul > .cate1 + .etc{position:relative; padding-left:25px;}
#header .category > ul > .cate1 + .etc:before{content:""; position:absolute;left:12px;top:22px;height:15px; width:1px; background:#ddd;}

/* 말풍선 중분류 */
#header .category .sub-category{ position:absolute;text-align:left; top:68px; left:calc(50% - 70px); -webkit-transition:all 0.2s ease-in-out; -moz-transition:all 0.2s ease-in-out; -o-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;opacity:0;visibility:hidden; background:transparent;z-index:99;}
#header .category > ul > li:hover .sub-category{top:58px; opacity:1; -webkit-transition:all 0.2s ease-in-out; -moz-transition:all 0.2s ease-in-out; -o-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;visibility:visible;}
#header .category .sub-category ul{background:#fff; border:1px solid #eee; min-width:190px; padding:14px 20px 10px; box-sizing:border-box; position:relative; box-shadow: 0 0 5px 2px rgba(195,195,195,0.1);}
#header .category > ul > li .sub-category ul::after { position: absolute;top: -4px;right: 53px;width: 3px;height: 4px;box-shadow: 0 0 7px 2px rgba(195,195,195,0.1); display: block;z-index: -1;content: "";}
#header .category .sub-category li{display:block; padding:0; cursor:pointer; border-radius:0px; box-sizing:border-box; -webkit-transition:all 0.2s ease-in-out; -moz-transition:all 0.2s ease-in-out; -o-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;}
#header .category .sub-category li:first-child{ border-left:0;}
#header .category .sub-category li a{position:relative; display:inline-block; line-height:28px; padding:0 2px; font-size:14px; color:#787878; text-decoration:none; box-sizing:border-box;}

#header .category .position > li:hover .sub-category{display:block;opacity:1;}
#header .category > ul > li .st{display:none;}
#header .category   .position > li:hover .sub-category .st{display:block;}
.sub-category .st{position:absolute;right:0px;top:0px;}

#header .category .sub-category li.over{background:#efefef; padding-left:4px;}
#header .category .sub-category li.over a{color:#535353;}


/* 전체카테고리 아이콘 */
#header .category > ul > li > a#btn-allCate{display:block; position:absolute;left:-30px;top:-12px; width:24px;height:24px; padding:0; margin:0;text-align:center;}
#header .category > ul > li > a#btn-allCate:before{background:#fff;}
#header .category > ul > li > a#btn-allCate.hvr-rectangle-in{background:#f7f7f7;}
#btn-allCate .iconBox{position:relative; margin:20px 0 0 0; width:40px; height:58px; overflow:hidden;}
#btn-allCate .iconBox img{position: absolute;left:3px;top:0px;z-index:33}
#btn-allCate .iconBox img.close{z-index: 32;}
#btn-allCate .icon{position:absolute;top:0;left:0; width:21px;height:1px;border:1px solid #444;background:#444; border-radius: 10px;  display:block;line-height:0;font-size:0; transform: rotate(0deg);}
#btn-allCate .line1{top:0;}
#btn-allCate .line2{top:6px}
#btn-allCate .line3{top:12px}

/* 전체카테고리 내용 */
#allCate{ display: none;position: absolute;top: 92px;left: 30px;width: calc(100% - 60px);padding: 40px;background: rgba(255,255,255,0.96);box-sizing: border-box;box-shadow: 0px 5px 13px 5px rgba(27, 27, 27, 0.17);}
#allCate:after{content:""; display:block; clear:both;}
#allCate h1{display: block;font-size: 15px;font-weight: 200;letter-spacing: 0.4px;line-height: 17px;padding-bottom: 18px;border-bottom: 1px solid #e2e2e2;margin-bottom: 17px;color: #777777;;}
#allCate .cateArea{float:left; width:60%; max-height:350px;}
#allCate .cateArea .mCSB_inside > .mCSB_container{padding-right:1%}
#allCate .cateArea ul{font-size:0; line-height:0; letter-spacing:0;text-align:left;}
#allCate .st{display:none;}

/* 단락별 마우스 오버시 타이틀 색상변화 */
#allCate .cateArea:hover h1,
#allCate > div > div:hover > h1 {color:#3a3a3a;}

/* 대분류 */
#allCate .position > li{display:inline-block;vertical-align:top; width:20%; margin-bottom:13px;}
#allCate .position li .cName{ display: block; text-decoration: underline; font-size: 14px;line-height: 22px;font-weight: 500;position: relative;z-index: 1;color: #6f6767;}
#allCate .position li .cName i:first-child {display:inline-block;line-height: 21px;color:#008160}

/* 삼선 내에서 li.etc 는 보이지 않습니다. */
#allCate .position > li.etc{display:none !important;}

/* 중분류 */
#allCate .sub-category{padding:14px 2px;}
#allCate .sub-category > ul > li{position:relative;cursor:pointer;	}

#allCate .sub-category > ul > li > a{display:inline-block; font-size:12px; line-height:23px;}
#allCate .position li .sub-category > ul > li i {display:inline-block;opacity:1;visibility:visible;width:15px;color:#ccc;line-height: 21px}
#allCate .position li:hover .sub-category > ul > li i {}	
#allCate .sub-category > ul > li:hover > a{opacity:1;padding-left:2px;}
#allCate .position > li:hover .cName i {opacity:1;visibility:visible;width:16px;}	


/* 트랜지션 */
#allCate .position li .cName,
#allCate .position li:hover .cName,
#allCate .position > li:hover .cName i,
#allCate .position > li .cName i,
#allCate .position li .sub-category > ul > li i{-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}

/* 우측 */
#allCate .banArea{ float: right; text-align:left; width:40%;font-size: 0;line-height: 0;letter-spacing: 0;padding-left:4%;box-sizing: border-box;height:350px;}
#allCate .banArea > div{display:inline-block; vertical-align:top;}
#allCate .banArea h1{margin-bottom:20px;}
#allCate .banArea .leftArea{ width:100%}
#allCate .banArea .leftArea > div {width:calc(100% / 3);float:left;padding-right: 30px;box-sizing: border-box;}
#allCate .banArea .leftArea > div > ul > li > a{display:block; font-size:12px; line-height:26px;-webkit-transition:all 0.2s ease-in-out; -moz-transition:all 0.2s ease-in-out; -o-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;transition-timing-function:ease; -webkit-transition-timing-function:ease;}
#allCate .banArea .leftArea > div > ul > li > a:hover{margin-left:4px;}


/* 전체카테고리 이벤트배너 */
#allCate .banArea .rightArea{ width:37%;float: right;box-sizing: border-box;height: 350px;overflow: hidden;}
#allCate .banArea .rightArea .listEvent_wrap {position:relative;display: block;margin-bottom: 8px;position: relative;}
#allCate .banArea .rightArea .listEvent_wrap:last-child {margin-bottom:0;}
#allCate .banArea .rightArea .listEvent {cursor:pointer;position:relative;}
#allCate .banArea .rightArea .listEvent img {max-width:100%;}
#allCate .banArea .rightArea .listEvent a{ display: block;width: 100%;color: rgba(255, 255, 255, 0.8);font-size: 13px;font-weight: 300;text-align: center;box-sizing: border-box;padding: 18px;letter-spacing: 0;position: absolute;bottom: 0;left: 0;background: rgba(72,72,72,0.7);}
#allCate .banArea .rightArea .mCSB_inside > .mCSB_container {padding-right:7%}


#todayWrap { display:none; }


/* BASIC css end */