/* @import url(//cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css); */
@import url(https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css);
/* body{font-famliy:'NanumSquare',san-serif;font-size:15px;line-height:1.5;}*/
body{font-famliy:'Dotum',san-serif;font-size:13px;line-height:1.5;letter-spacing:-0.5px;}

/* 레이아웃설정 폰트 적용 */
#layout_body * {font-family:"Dotum"}

/* Dotum 인경우 */
#cus_gnb_bcate_wrap > li > a > .title {letter-spacing:-1.3px !important}
#cus_gnb_bcate_wrap {padding-left:4px !important;}


@font-face {
    font-family: 'Roboto' !important;
    unicode-range: U+0030-0039; /* Only Number */
    font-style: normal;
} 



.tac {text-align:center}
.pwrap {text-align:left;background-color:#F6F2EA;padding-left:65px;}
.w100p {width:100%;}
.c_pre {white-space:pre-line;padding-top:10px;}
.pl20 {padding-left:20px}
.pt30 {padding-top:30px}
.blue_t {font-weight:bold;text-align:center;color:#2A8BC5;padding-bottom:20px;padding-top:40px;}

#layout_config {padding-bottom:20px;}
.brw0 {border-right-width:0 !important;}
.bbw0 {border-bottom-width:0 !important;}
.bbw1 {border-bottom-width:1px !important;}

.dv3 {width:100%;}
.dv3 > li {float:left;width:calc(100% / 3);box-sizing:border-box;}
.dv4 {width:100%;}
.dv4 > li {float:left;width:calc(100% / 4);box-sizing:border-box;}

/* page navi */
.page_catalog .navi_title {font-weight:bold;
    background-image:url('/data/skin/hair2000_pc/images_extend/catalog/ico_home.png');background-repeat:no-repeat;background-position-y:center;;
    padding-left:23px;color:#000000;font-size:15px;letter-spacing:-1px;margin-bottom:5px}

/* 최상단 TOP */
.gex_wrap_header {display:table;width:1100px;height:140px;margin:0 auto;box-sizing:border-box;vertical-align:middle}
.gex_wrap_header:after {content:''; display:block; clear:both; }
.gex_wrap_header > .td1 {display:table-cell;width:400px;text-align:left;}
.gex_wrap_header > .td1 .header-top-telbar-wrap {margin-top:22px;}
.gex_wrap_header > .td1 .v-bt {vertical-align:bottom}
.gex_wrap_header > .td2 {display:table-cell;width:360px;vertical-align:bottom;padding-bottom:10px;text-align:center;}
.gex_wrap_header > .td2 h1 {margin-bottom:10px;}
.gex_wrap_header > .td2 form input[name='search_text'] {border:3px solid #ffa722;height:34px;line-height:34px;width:310px}
.gex_wrap_header > .td3 {display:table-cell;vertical-align:top;text-align:right;}
.gex_wrap_header > .td3 .top_sns {float:right}
.gex_wrap_header > .td3 .top_sns li {float:left;padding:2px 8px 8px 8px}
.gex_wrap_header > .td3 > ul.top_util {margin-top:10px;background-color:#F0F0F0;padding:2px 7px 2px 7px;border-radius:5px;font-size:12px;display:inline-block;position:absolute;right:0}
.gex_wrap_header > .td3 > ul.top_util > li {float:left;height:18px;line-height:18px;text-align:center;}
.gex_wrap_header > .td3 > ul.top_util > li:after {content:'|';padding-left:3px;padding-right:3px;}
.gex_wrap_header > .td3 > ul.top_util > li:last-child:after {content:'';padding-left:0px;padding-right:0px;}
.gex_wrap_header > .td3 > ul.top_util:after {content:''; display:block; clear:both; }
.gex_wrap_header > .td3 > ul.top_util a {color:#7C7C7C;}
.gex_wrap_header > .td3 > .user_info {padding-top:5px;padding-bottom:5px;font-size:13px;margin-top:35px;}
.gex_wrap_header > .td3 > .user_info .user-hi {color:#ed6942}
.gex_wrap_header > .td3 > .user_info:after {content:''; display:block; clear:both; }
.gex_wrap_header > .td3 > ul.add_util {font-size:12px;color:#5A5A5A;font-weight:bold;display:inline-block;margin-bottom:10px;margin-bottom:3px}
.gex_wrap_header > .td3 > ul.add_util > li {float:left;text-align:right;}
.gex_wrap_header > .td3 > ul.add_util > li > a {padding-left:0px;padding-right:0px;}

/* 중단 박스 TOP */
.gex_wrap_cate {
	display:block;width:1100px;margin:0 auto;box-sizing:border-box;height:36px;line-height:36px;vertical-align:middle;background-color:#ffa722; 
	
}
.gex_wrap_cate > div.telarea {float:left;padding:0 13px;font-size:14px;color:#ffffff;font-weight:bold;height:36px;line-height:36px;}
.gex_wrap_cate > ul.menus {float:left;margin-left:20px;height:36px;line-height:36px;}
.gex_wrap_cate > ul.menus > li {float:left;color:#ffffff;letter-spacing:0.2px}
.gex_wrap_cate > ul.menus > li > a {color:#ffffff;font-weight:bold;font-size:11px;letter-spacing:-1px;height:36px;line-height:36px;}

.gex_wrap_cate > ul.menus > li:after {content:'|';padding-left:3px;padding-right:3px;font-weight:normal;}
.gex_wrap_cate > ul.menus > li:last-child:after {content:'';padding-left:0px;padding-right:0px;}
.gex_wrap_cate > .search-frm {text-align:right;padding-right:10px}
.gex_wrap_cate > .search-frm > form input[type='text'] {width:200px;height:18px;border:solid 1px #d5d5d5}

/* 공통푸터 */
#layout_footer {border-top:1px solid #cccccc;margin-top:0px;padding-top:20px;padding-bottom:20px;}
#layout_footer:after {content:''; display:block; clear:both; }
#layout_footer .area1 {width:1100px;margin:0 auto;display:table;box-sizing:border-box;font-size:12px;margin-bottom:12px;}
#layout_footer .area1 > div {display:table-cell;text-align:center;vertical-align:middle;}
#layout_footer .area1 > div.link_info {text-align:left;padding-left:10px}
#layout_footer .area1 ul.foot_util_link {margin:0 auto;margin-bottom:8px;display:inline-block}
#layout_footer .area1 ul.foot_util_link:after {content:''; display:block; clear:both; }
#layout_footer .area1 ul.foot_util_link > li {float:left;font-weight:bold;color:#797979;font-size:13px;text-shadow:0.3px 0.3px #d0d0d0;}
#layout_footer .area1 ul.foot_util_link > li:after {content:'/';padding-left:7px;padding-right:7px;}
#layout_footer .area1 ul.foot_util_link > li:last-child:after {content:'';padding-left:0;padding-right:0;}
#layout_footer .area1 ul.foot_util_link a {color:#7C7C7C;}
#layout_footer .area1 .foot_util_infotxt {color:#666666}
#layout_footer .area1 > div.add_link {vertical-align:top}
#layout_footer .area2 {width:1100px;margin:0 auto;box-sizing:border-box;}
#layout_footer .area2 > ul > li {float:left;width:20%;text-align:center;}
#layout_footer .area2 > ul > li img {border:1px solid #e5e5e5;}

/* a메인전용 푸터 */
#layout_topBar_custom {display:table;width:1100px;margin:0 auto;box-sizing:border-box;border-left:3.5px solid #ffa722;border-right:3.5px solid #ffa722;}
#layout_topBar_custom:after { content:''; display:block; clear:both; }

/* .layout_topBar_custom_foot {	width:1100px;margin:0 auto;box-sizing:border-box;height:3.5px;margin-bottom:5px;	background-color:#F16522;	}*/

#layout_topBar_custom.sub > .next2 {width:720px;}
#layout_topBar_custom.sub > .next2 > ul > li {
    float:left;width:20%;box-sizing:border-box;border:2px solid #470825;text-align:center;background-color:#D693B4;height:30px;line-height:26px;
}
#layout_topBar_custom.sub > .next2 > ul > li:nth-child(even) { background-color:#470825; }
#layout_topBar_custom.sub > .next2 > ul > li a {
    font-weight:bold;color:#ffffff;font-size:13.5px;
	text-shadow: -1px 0 #470825, 0 1px #470825, 1px 0 #470825, 0 -1px #470825;
	-webkit-text-stroke: 0.2px #470825;font-family:'맑은고딕';
}
#layout_topBar_custom.sub > .sub_cate {margin:0 auto;text-align:center;padding-top:5px}
#layout_topBar_custom.sub > .sub_cate > .sub_cate_inner {
    width:95%;height:120px;margin:0 auto;margin:5px 10px 0 7px;padding:-3px;border:4px solid #EED1A1;border-radius:10px;box-sizing:border-box;
}
#layout_topBar_custom.sub > .sub_cate > .sub_cate_inner > .scr_catelist {
    width:100%;height:100%;overflow:auto;z-index:0;padding:7px;border:1px solid #ab771f;border-radius:8px;box-sizing:border-box;
}

/*
.mid_ban_wrap .titles {background: url('/data/skin/hair2000_origin/image/sub01/tit.gif') no-repeat;
    height: 50px;padding:24px 0 0 60px;
}
.mid_ban_wrap .titles h2 {display: inline-block;font-size:18px;letter-spacing:-3;font-weight:bold;}
.mid_ban_wrap .titles h3 {display: inline-block;color:#874C5A;font-weight: normal;font-size: 12px;}
.mid_ban_wrap .titles h3:before {content:'|';padding-right:7px;}
.mid_ban_wrap .naviagator {
    position:absolute;right:0;top:36px;
    color:#2f2f2f;line-height:27px;text-align:right;float:right;
}
.mid_ban_wrap .naviagator .navi_line img {height:0.5px;width:400px;}
.mid_ban_wrap .naviagator h2 {display: inline-block;font-size:11px;}
.mid_ban_wrap .naviagator h3 {display: inline-block;font-size: 12px;font-weight:bold;}
.mid_ban_wrap .naviagator h3:before {content:'>';padding-right:3px;;font-weight:normal}



.mid_ban_wrap .submenus {display:block;margin-top:7px;border:3px solid #b3dcee;border-radius:10px;height:60px;line-height:60px;color:#42A8E9;text-align:center;font-size:12px;}
.mid_ban_wrap .submenus:after {content:''; display:block; clear:both; }
*/



/* 
main
*/
.mid_ban_wrap .main_mid_bans img {width:100%;border:1px solid #dedede;border-bottom-width:0}
.mid_ban_wrap .img-brd-wid1 img {border-bottom-width:1px}
.mid_ban_wrap:after {clear:both; display:block; content:'';}

/* 공통뎁스 */
.category_depth {margin-top:20px;}

/* 회원부 */
.join_step li.active {border-color: #ff8d0f; color:#ff8d0f}

/* 공통 > 버튼 */
.btn_chg {border:1px solid #ff8d0f; background:#ff8d0f; color:#fff;}

/* 페이징 */
.paging_navigation a, .paging_navigation a.on {border-width:0}


/* 왼쪽 전체오버 */
/* 중단 좌측메뉴 */
#cus_gnb_bcate_wrap {padding:7px 4px 7px 10px;box-sizing:border-box;margin:7px 6px;}
#cus_gnb_bcate_wrap > li {position:relative;padding-bottom:5px;padding-top:5px;}
#cus_gnb_bcate_wrap > li:after { width:100%;padding:0;font-size:1px;letter-spacing:-6.5px;color:#a3a3a3;position:absolute;bottom:-4px;left:0;}
#cus_gnb_bcate_wrap > li:last-child:after {content:''}
#cus_gnb_bcate_wrap > li > a {width:100%;height:100%;display:inline-block}
#cus_gnb_bcate_wrap > li > a > .title {color:#4E4E4E;font-weight:bold;font-weight:900;display:inline-block;	margin-bottom:1px;margin-left:3px;font-size:15px;}
#cus_gnb_bcate_wrap > li > a > .desc { font-size:10px;color:#9f9f9f;margin-left:3px;padding-bottom:1px;letter-spacing:-0.4px; }
#cus_gnb_bcate_wrap > li {position:relative;}
#cus_gnb_bcate_wrap > li div.cus_cate_dynamic_wrap {position:absolute;top:-5px;left:150px;left:212px;;border:2px solid #FF903C;padding:6px 6px 9px 6px;background-color:#ffffff;z-index:100}
#cus_gnb_bcate_wrap > li div.cus_cate_dynamic_wrap .all_view {height:26px;line-height:26px;text-align:center;font-size:13px;margin-bottom:7px}
#cus_gnb_bcate_wrap > li div.cus_cate_dynamic_wrap .all_view a {width:100%;height:100%;background-color:#FF903C;display:inline-block;font-weight:bold;color:#ffffff}
#cus_gnb_bcate_wrap > li div.cus_cate_dynamic_wrap ol > li {height:25px;line-height:25px;white-space:nowrap;padding:1px 5px 0px 10px;font-size:12px}

/* 이미지로 조정시 */
#cus_gnb_bcate_wrap {padding:0;box-sizing:border-box;margin:0;padding-left:0 !important;}
#cus_gnb_bcate_wrap > li {padding-top:0;padding-bottom:0;}



/* 메인화면용 */
.main_brand {
overflow-y: auto; /* 세로 스크롤만 자동으로 나타나게 */
}
.main_brand .main_brand_inner {
    display: block;
    clear: both;
    content: '';
    box-sizing: border-box;
    background-color: #f8f2da;
    border: 1px solid #bfbfbf;
    border-left-width: 0;
    border-right-width: 0;
    height: 180px;
    padding: 18px 15px;
    margin-bottom: 10px;
    overflow-x: hidden; /* 가로 스크롤 방지 */
}

.main_brand .main_brand_inner ul {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr)); /* 한 줄에 8개 */
    gap: 5px; /* gap 크기 줄이기 */
    box-sizing: border-box;
    font-size: 0;
    height: 100%; /* 부모 요소에 맞게 높이 조정 */
    
    padding: 0;
    list-style: none;
    width: 100%; /* 부모 크기 넘지 않도록 */
}

.main_brand .main_brand_inner ul li {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    margin: 0px;
    width: 100%;
    height: 27px;
    overflow: hidden; /* 넘치는 텍스트 숨기기 */
}

.main_brand .main_brand_inner ul li > a {
    display: flex;
    align-items: center;
    justify-content: left;
    width: 100%;
    height: 100%;
    padding: 3px 9px;
    font-size: 13px;
    background-color: #ffffff;
    box-sizing: border-box;
    border: 1px solid #bfbfbf;

    /* 긴 텍스트 ... 처리 */
    flex: 1; 
    min-width: 0;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    
    /* 긴 단어 처리 */
    word-break: break-all; /* 띄어쓰기 없는 단어도 강제 줄바꿈 */
	display:inline-block !important;
}



