/* ------------- 상단 GNB 영역 ------------- */

#toparea_warp { position:fixed; top: 60px; /*top:50px;*/ width:100%; /*height:80px;*/ min-height:80px; height: auto; z-index:60;  background:#fff; border-bottom:1px solid #ddd; }
#toparea_warp.fixed { position:fixed; margin-top:-10px;  /*transition: .5s; -webkit-transition: .5s; -moz-transition: .5s;*/  background:#fff; /*border-bottom:1px solid #ddd; */}
#toparea_warp.fixed .header_search {   }

#header .header_gnb{border-top:solid 1px #eaeaea; }
#header .gnb { position:relative;  width:100%; height:55px; }
 


/* 로딩 - 메인롤링 */
.wrapper_main_warp div#preloader { position: absolute; left: 0; top: 0; z-index: 30; width: 100%; height: 100%; overflow: hidden; background: #fcfcfc url('../images/loading-gear2.gif') no-repeat center center; }



/* 공통사용 중앙정렬 가이드 */
.guide_contents {  position:relative;  /*width:1280px;*/ width:1366px; margin:0 auto; }
.guide_100p { width:100%; margin:0 auto; min-width:950px;  max-width:2680px; }
.guide_90p { width:90%; margin:0 auto; min-width:950px; max-width:1680px; }



/* 분류페이지 - 상품 할인율 추가 */
 .leftper,
 .leftper2,
 .leftper3 { position:absolute; right:7px; top:7px; z-index:27;  font-family:Tahoma; }
 .leftper .percent,
 .leftper2 .percent2,
 .leftper3 .percent3 { width:40px; height:40px; line-height:40px; border-radius:0px; color:#fff;  background:#343434; text-align:center; display:none;  }
 .leftper .cost,
 .leftper2 .cost2,
 .leftper3 .cost3 { font-size:13px; font-weight:600; display:inline-block !important; }
 .leftper .mark,
 .leftper2 .mark2,
 .leftper3 .mark3 { font-size:9px; font-weight:400; margin-left:1px; display:inline-block !important;}
 .leftper2 {  z-index:28; }
 .leftper3 {  z-index:29; } 
 
/* 상세페이지 - 상품 할인율 추가 */
.detailfer  .leftper,
.detailfer  .leftper2,
.detailfer  .leftper3 { position:absolute; left:-667px; top:31px; width:40px; height:40px; }

@media all and (min-width:1px) and (max-width:1280px) {
.detailfer  .leftper,
.detailfer  .leftper2,
.detailfer  .leftper3 { position:absolute; left:-391px;  }
}



 

 /* 공통 딜레이 타임지정 */ 
.trans2 { transition: .2s; -webkit-transition: .2s; -moz-transition: .2s;   } 
.trans3 { transition: .3s; -webkit-transition: .3s; -moz-transition: .3s;   } 
.trans5 { transition: .5s; -webkit-transition: .5s; -moz-transition: .5s;   } 
.del3s {  transition-delay:0.5s;  }



/* 한스타일 공통 화살표 */
.hannavi_1 { position: absolute; text-align: center; display: block; width: 50px; height: 50px; line-height: 50px; top: 50%; margin-top: -25px; z-index:52; border:1px solid #e9e9e9; color:#111; cursor:pointer;  background: url(../images/bg/bg_white.png) repeat;  opacity:1; }
.hannavi_1_area .hannavi_1 { opacity:0;  border:1px solid #fff; color:#111;  } 
.hannavi_1_area:hover .hannavi_1 { opacity:1; }  
.hannavi_1_area:hover .hannavi_1:hover,
.hannavi_1:hover  {  opacity:1; text-decoration:none; border:1px solid #fff; }
.hannavi_1 .fa {width:50px;height:50px;line-height:50px; text-align:center; display:block;  font-size:30px; }
.hannavi_1.dark {  border:1px solid #111; color:#fff; background: url(../../../../../../han/images/bg/bg_00070.png.html) repeat; }
.hannavi_1:hover .fa { color:#fdf048; }

.hannavi_1.mover_left { left:-20px; }
.hannavi_1.mover_right { right:-20px; }
.hannavi_1_area:hover .hannavi_1.mover_left { left:-1px; }
.hannavi_1_area:hover .hannavi_1.mover_right { right:-1px; }
.hannavi_1_area:hover .hannavi_1.mover_left .fa { color:#fdf048; }
.hannavi_1_area:hover .hannavi_1.mover_right .fa { color:#fdf048; }

.hannavi_1.medium { width: 30px; height: 30px; line-height: 30px; }
.hannavi_1.medium .fa {width:30px;height:30px;line-height:30px; font-size:20px; }
.hannavi_1.medium:hover .fa { color:#fdf048; }

.hannavi_1.medium2 { width: 35px; height:35px; line-height:35px; }
.hannavi_1.medium2 .fa {width:35px;height:35px;line-height:35px; font-size:24px; }
.hannavi_1.medium2:hover .fa { color:#fdf048; }


.hannavi_small { position: absolute; text-align: center; display: block; width: 25px; height: 25px; line-height: 25px; z-index:52;  }
.hannavi_small .fa { line-height: 25px; color:#111; font-size:25px;  opacity:.5; }
.hannavi_small:hover .fa { color:#fdf048; }
.hannavi_1_area:hover .fa  {  opacity:1; }

.hannavi_mini { position:absolute; left:15px;  width:20px; height:20px; line-height:20px; border-radius:0;  opacity:0; text-align:center; text-decoration:none; z-index:52;  -webkit-transition: .2s; -moz-transition: .2s; -ms-transition: .2s; transition: .2s; }
.hannavi_mini.mover_top { top:0px; }
.hannavi_mini.mover_bottom { top:41px; }
.hannavi_mini_area:hover > .mover_top { opacity:1;  top:10px;}
.hannavi_mini_area:hover > .mover_bottom {  opacity:1;  top:31px;  }
.hannavi_mini .fa  { font-size:11px; width:20px;  height:20px; display:block;  line-height:18px; color:#fff;    }
.hannavi_mini:hover { -webkit-transition: 0s; -moz-transition: 0s; -ms-transition: 0s; transition: 0s;  text-decoration:none;  }
.hannavi_mini:hover .fa { color:#fdf048; }

.hannavi_mini2 { position:absolute; top:0px;  width:30px; height:30px; line-height:30px; border-radius:0;  opacity:0; text-align:center; text-decoration:none; z-index:52;  -webkit-transition: .2s; -moz-transition: .2s; -ms-transition: .2s; transition: .2s; }
.hannavi_mini2.mover_left { left:-10px; }
.hannavi_mini2.mover_right { left:41px; }
.hannavi_mini_area:hover > .mover_left {    opacity:1;  left:0px; }
.hannavi_mini_area:hover > .mover_right {    opacity:1;  left:31px;  }
.hannavi_mini2 .fa  { font-size:16px; width:30px;  height:30px; display:block;  line-height:28px; color:#fff;    }
.hannavi_mini2:hover { -webkit-transition: 0s; -moz-transition: 0s; -ms-transition: 0s; transition: 0s; text-decoration:none; cursor:pointer;}
.hannavi_mini2:hover .fa { color:#fdf048; }

.hannavi_mini3 { position:absolute; bottom:4px;  width:20px; height:20px; line-height:20px; border-radius:0;   text-align:center; text-decoration:none; z-index:62;    }
.hannavi_mini3 .fa  { font-size:11px; width:20px;  height:20px; display:block;  line-height:18px; color:#fff;    }
.hannavi_mini3:hover .fa { color:#fdf048; }




/* 한스타일 공통 페이징 */
.hanpage_1 { position: absolute; height: 16px;  width:100%;  display:table; font-size: 0px; line-height: 0;  z-index:10; }
.hanpage_1 a,
.hanpage_1 li { background: none; width: 6px; height: 6px;  border-radius:50%; display: inline-block; cursor: pointer; margin: 0 2px; border:3px solid #ccc;  text-decoration:none;  transition: .2s; -webkit-transition: .2s; -moz-transition: .2s;  }
.hanpage_1 a span { font-size:0; }
.hanpage_1 a:hover { }
.hanpage_1 a.selected {  }
.hanpage_1.top { top:10px; right:10px; width:auto;}

.hanpage_2 { position: absolute; height: 16px;  width:100%;  display:table; font-size: 0px; line-height: 0;  z-index:10; }
.hanpage_2 a,
.hanpage_2 li { background: none; width: 9px; height: 9px;  border-radius:50%; display: inline-block; cursor: pointer; margin: 0 2.5px; border:0px solid #ccc; background-color:#ccc;  text-decoration:none;  transition: .2s; -webkit-transition: .2s; -moz-transition: .2s;  }
.hanpage_2 a span { font-size:0; }
.hanpage_2 a:hover { }
.hanpage_2 a.selected { }
.hanpage_2.top { top:10px; right:10px; width:auto;}

.hanpage_3 { position: absolute; height: 16px;  width:100%;  display:table; font-size: 0px; line-height: 0;  z-index:10; }
.hanpage_3 a,
.hanpage_3 li { background: none; width: 7px; height: 7px;  border-radius:50%; display: inline-block; cursor: pointer; margin: 0 2px; border:0px solid #ccc; background-color:#ccc;  text-decoration:none;  transition: .2s; -webkit-transition: .2s; -moz-transition: .2s;  }
.hanpage_3 a span { font-size:0; }
.hanpage_3 a:hover { }
.hanpage_3 a.selected { }
.hanpage_3.top { top:10px; right:10px; width:auto;}

 




/* 한스타일 공통 슬라이더 */
.carousel_guide { position:relative;	z-index:-1;	display:block; }
.carousel_guide img { width:100%; }
.simple_slide  { position:relative;	width: 100%; height: auto; cursor:pointer;	overflow:hidden; }
.simple_slide ul { position:absolute; width: 100%; height: auto; top:0;	left:0;	z-index:8; }
.simple_slide ul li img { width: 100%; height: auto; display:block; }
 

 

/* 한스타일 공통 H2 */
.h2_han { position:relative; font-family:'GmarketSansMedium'; font-size:27px; line-height:40px; color:#232323; text-align:left;  letter-spacing:0px;   }
.h2_han span { font-family: 'Nanum Gothic'; font-size:14px; line-height:14px;  color:#999; text-align:left; margin-bottom:10px; }
 
.h2_han .morehan { position:relative;  float:right;  font-family:'NEXON Lv2 Gothic '; font-size:15px; line-height:35px; margin-right:40px; }
.h2_han .morehan a { color:#888; text-decoration:none;}
.h2_han .morehan .fa { position:absolute;  font-size:24px; color:#999;  text-indent:8px; margin-top:5px;  }
.h2_han .morehan:hover .fa { color:#111; }

.h2_han_small { font-family:'GmarketSansMedium';  font-size:22px; font-weight:500;  width:auto;  height:40px; line-height:40px;  color:#333; text-align:left; letter-spacing:-.3px;   }
.h2_han_small span { font-family: 'Nanum Gothic'; font-size:13px; color:#b5b5b5; margin-left:7px; letter-spacing:0.5px; }

.h2_han_big { position:relative; font-family:'GmarketSansMedium'; font-size:27px; line-height:40px; color:#232323; text-align:center;  letter-spacing:0px;   }
.h2_han_big span { font-family: 'Nanum Gothic'; font-size:14px; line-height:14px;  color:#999;    display:block; text-align:center; margin-bottom:30px; }
 


/* 한스타일 공통 more */
.more_han {  position: absolute; top:25px; right:2px;  text-align: center; display: block;  width: 36px; height: 36px; line-height: 36px;  border:1px solid #e9e9e9; color:#111; cursor:pointer;  }
.more_han .fa { width:36px;height:36px;line-height:36px; text-align:center; font-size:12px; }
.more_han:hover {  border:1px solid #fff; color:#fff; }
 
.more_han.medium { width: 30px; height: 30px; line-height: 30px; }
.more_han.medium .fa {width:30px;height:30px;line-height:30px; font-size:11px; }


 



/* 공통사용 상하간격 공백 / 100퍼센트 배경패턴 */
.hanblank_1 { position:relative; width:100%; height:1px; display:block; clear:both; } 
.hanblank_2 { position:relative; width:100%; height:2px; display:block; clear:both; } 
.hanblank_5 { position:relative; width:100%; height:5px; display:block; clear:both; } 
.hanblank_10 { position:relative; width:100%; height:10px; display:block; clear:both; }
.hanblank_20 { position:relative; width:100%; height:20px; display:block; clear:both; }
.hanblank_30 { position:relative; width:100%; height:30px; display:block; clear:both; }
.hanblank_40 { position:relative; width:100%; height:40px; display:block; clear:both; }
.hanblank_50 { position:relative; width:100%; height:50px; display:block; clear:both; }
.hanblank_60 { position:relative; width:100%; height:60px; display:block; clear:both; }
.hanblank_70 { position:relative; width:100%; height:70px; display:block; clear:both; }
.hanblank_80 { position:relative; width:100%; height:80px; display:block; clear:both; }
.hanblank_90 { position:relative; width:100%; height:90px; display:block; clear:both; }
.hanblank_100 { position:relative; width:100%; height:100px; display:block; clear:both; }
.hanblank_110 { position:relative; width:100%; height:110px; display:block; clear:both; }
.hanblank_120 { position:relative; width:100%; height:120px; display:block; clear:both; }
.hanblank_130 { position:relative; width:100%; height:130px; display:block; clear:both; }
.hanblank_140 { position:relative; width:100%; height:140px; display:block; clear:both; }
.hanblank_150 { position:relative; width:100%; height:150px; display:block; clear:both; }
.hanblank_160 { position:relative; width:100%; height:160px; display:block; clear:both; }
.hanblank_170 { position:relative; width:100%; height:170px; display:block; clear:both; }
.hanblank_180 { position:relative; width:100%; height:180px; display:block; clear:both; }
.hanblank_190 { position:relative; width:100%; height:190px; display:block; clear:both; }
.hanblank_200 { position:relative; width:100%; height:200px; display:block; clear:both; }
.hanblank_250 { position:relative; width:100%; height:250px; display:block; clear:both; }
.hanblank_300 { position:relative; width:100%; height:300px; display:block; clear:both; }

/*202502 디자인픽스*/
.h2_han_big {font-family:'GmarketSansMedium'; font-weight: 400; font-size: 35px; color:#000; }
.h2_han_big span { font-family: 'GmarketSansMedium'; font-size: 16px; color:#777; line-height: 1; margin-top: 12px; margin-bottom: 50px;}
#toparea_warp{top:50px; padding-top: 10px;}
#toparea_warp.fixed{}