@charset "utf-8";
@import url(https://fonts.dsoft.co.kr/NanumBarunGothic/NanumBarunGothic.css);
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:300,400,700&subset=korean');
@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic:400,700,800&subset=korean');
@import url('https://fonts.googleapis.com/css?family=Do+Hyeon');

html{ padding:0; margin:0 }
body{ padding:0; margin:0;
	user-select : none;
	-ms-user-select : none;
	-webkit-user-select : none;
}
a{ color:inherit; text-decoration:none }

/* 커스텀 라디오 적용 (크롬에만 적용됨) */
input[type=radio]{ width:15px; height:15px; margin:0 5px 0 0; visibility: hidden }
input[type=radio]:before{ content:''; display:inline-block; width:15px; height:15px; background:url(/images/custom_radio.png) no-repeat 0 0; background-size:cover; font-size:12px; visibility: visible; cursor:pointer }
input[type=radio]:checked:before{ background-position-x:-15px }

/* 커스텀 체크박스 적용 (크롬에만 적용됨) */
input[type=checkbox]{ display:none }
input[type=checkbox] + label{ vertical-align:middle }
input[type=checkbox] + label:before{
	content:''; display:inline-block; width:15px; height:15px; margin:-3px 5px 0 0; background:url(/images/custom_checkbox.png) no-repeat 0 0; background-size:cover; font-size:12px;
	vertical-align:middle; visibility: visible; cursor:pointer
}
input[type=checkbox]:checked + label:before{ background-position-x:-15px }

.WRAPPER{ width:1250px; margin:0 auto; box-sizing:border-box }
.LET{ display:none }

.ASIDE{ width:1024px; margin:0 auto; overflow:hidden }
.ASIDE > aside{ float:left; width:200px; margin-top:16px }
.ASIDE .WRAPPER{ width:800px; margin:0 0 32px 214px }

.PAGING{ padding:12px 0; font-size:0; text-align:center; -ms-user-select:none; -webkit-user-select:none }
.PAGING > a{ display:inline-block; min-width:20px; height:20px; padding:3px 2px 1px 2px; margin:2px; border:solid 1px #CCC; color:#999; text-align:center; vertical-align:middle; font:500 16px/normal NanumBarunGothic; cursor:pointer }
.PAGING > a:hover{ border-color:#06C; color:#06C }
.PAGING > a.ON{ background:#06C; border-color:#06C; color:#FFF; cursor:default }
.PAGING > a.GOTO{ font-size:0; background:url(/images/iconset_pagenavigator.png) no-repeat }
.PAGING > a.GOTO.F{ background-position:0 0 }
.PAGING > a.GOTO.P{ background-position:-24px 0 }
.PAGING > a.GOTO.N{ background-position:-48px 0 }
.PAGING > a.GOTO.L{ background-position:-72px 0 }
.PAGING > a.GOTO.F:hover{ background-position:-96px 0 }
.PAGING > a.GOTO.P:hover{ background-position:-120px 0 }
.PAGING > a.GOTO.N:hover{ background-position:-144px 0 }
.PAGING > a.GOTO.L:hover{ background-position:-168px 0 }

.SIDEPANEL{
	position : absolute;
	width : 120px;
	z-index : 9999
}
.SIDEPANEL.L{
	right : 50%;
	top : 224px;
	margin-right : 520px
}
.SIDEPANEL.R{
	left : 50%;
	top : 224px;
	margin-left : 520px;
	display:none;
	
}
.SIDEPANEL.FIX{
	position : fixed;
	top : 8px !important;
}

body.MAIN > .SIDEPANEL{
	top : 809px;
}
body.MAIN > .SIDEPANEL.L{
	margin-right : 633px;
}
body.MAIN > .SIDEPANEL.R{
	margin-left : 633px;
}

.SIDEPANEL > .TODAYGOODS{ border:solid 1px #CCC; background-color:#FFF }
.SIDEPANEL > .TODAYGOODS > h2{ padding:12px 0; margin:0; text-align:center; font:normal 11px/normal Dotum }
.SIDEPANEL > .TODAYGOODS > h2 > span{ margin-left:6px; color:#dd0505; font-weight:bold }
.SIDEPANEL > .TODAYGOODS > ul{ padding:0; margin:4px }
.SIDEPANEL > .TODAYGOODS > ul > li{ width:110px; height:110px; margin-bottom:5px; list-style:none }
.SIDEPANEL > .TODAYGOODS > ul > li > a{ display:block; height:110px; text-align:center; font-size:0; line-height:110px }
.SIDEPANEL > .TODAYGOODS > ul > li > a > img{ max-width:110px; max-height:110px; vertical-align:middle }
.SIDEPANEL > .TODAYGOODS > ul > li.NORECORD{ padding:8px; height:auto; text-align:center; color:#999; font:normal 11px/20px Dotum; box-sizing:border-box }
.SIDEPANEL > .TODAYGOODS > ul > li:last-child{ margin-bottom:0 }
.SIDEPANEL > .BUTTONS > button{ width:100%; height:26px; padding:0; margin-top:2px; border:0; background-color:#E9E9E9; font:normal 10px/26px NanumBarunGothic; outline:0 }
.SIDEPANEL > .BUTTONS > button:hover{ background-color:#E6A0A0; color:#FFF; cursor:pointer }

.SIDEPANEL > .SEARCHCARS{
	background-color : #FFF;
	border : solid 1px #CCC;
}
.SIDEPANEL > .SEARCHCARS > h2{
	padding : 12px 0;
	margin : 0;
	text-align : center;
	font : bold 12px/normal Dotum
}
.SIDEPANEL > .SEARCHCARS > select{
	display : block;
	width : 110px;
	height : 28px;
	margin : 0 auto 4px auto;
	border : solid 1px #CCC;
	font-size : 12px;
	color : #555;
}
.SIDEPANEL > .SEARCHCARS > button[type=submit]{
	display : block;
	width : 110px;
	height : 36px;
	padding : 0;
	margin : 0 auto 4px auto;
	background-color : #008348;
	border : 0;
	color : #FFF;
	font-family : 'Noto Sans KR';
	font-weight : 400;
	font-size : 12px;
	outline : 0;
	cursor : pointer;
}

/* 상단 메뉴*/

header {position:relative; padding:0;  }

header > #HEADER_MENU{ height: 34px; line-height: 34px; border-bottom: 1px solid #ededed; background: #fff; position: relative; z-index: 1;}
header > #HEADER_MENU > div > .top-menu-left {float:left}
header > #HEADER_MENU > div > .top-menu-left > a {border-left: 1px solid #ededed;}
header > #HEADER_MENU > div > .top-menu-left > a.home {padding: 10px 12px 9px 11px; }
header > #HEADER_MENU > div > .top-menu-left > a.home > img {vertical-align:middle;}
header > #HEADER_MENU > div > .top-menu-left > a.bookmark {font-size: 12px; padding: 0 12px 0 9px; color: #282828; letter-spacing: -0.4px}
header > #HEADER_MENU > div > .top-menu-left > a.bookmark > img {vertical-align:-2px; margin-right:5px;}
header > #HEADER_MENU > div > .top-menu-left > a.top-sns {padding:8px 5px;}
header > #HEADER_MENU > div > .top-menu-left > a.top-sns > img {vertical-align:middle;}
header > #HEADER_MENU > div > .top-menu-right {float:right} 
header > #HEADER_MENU > div > .top-menu-right > a{ font-size:12px; padding: 0 10px; color: #34384b;letter-spacing: -1px; cursor:pointer }

header > div.HEADER_MAIN {position:relative; background:#FFF; display:block; height:auto;}
header > div.HEADER_MAIN > #MAINLOGO { padding: 36px 0 32px 0px; text-align: center; }
header > div.HEADER_MAIN > #MAINLOGO > a{ display:inline-block; height:100% }
header > div.HEADER_MAIN > #MAINLOGO > a > img{border: none; vertical-align: top; }
header > div.HEADER_MAIN > #MAINSEARCH_FORM{  position: absolute; top: 36px; right: 0px;}
header > div.HEADER_MAIN > #MAINSEARCH_FORM > div{border: 1px solid #abadb5; }
header > div.HEADER_MAIN > #MAINSEARCH_FORM > div > legend { visibility: hidden; position: absolute; left: -9999px; top: -9999px;  width: 0; height: 0; line-height: 0;
}
header > div.HEADER_MAIN > #MAINSEARCH_FORM > div > img {vertical-align: middle;}
header > div.HEADER_MAIN > #MAINSEARCH_FORM > div > #MAINSEARCH_STRING{vertical-align: middle; width: 208px; height: 43px; line-height: 43px; padding: 0 0 0 7px; border: 0; font-size: 12px;  color: #2b2b2b; }
header > div.HEADER_MAIN > #MAINSEARCH_FORM > div > button[type=submit]{  margin:0; border:0; background-color:#FFF;; vertical-align:middle; font-size:0; }

header > .HEADER_MAIN > #BANNER_HEADER{
	position : absolute;
	left : 0;
	top : 30px;
	width : 317px;
	height : 60px;
	font-size : 0;
}
header > .HEADER_MAIN > #BANNER_HEADER > a{
	display : inline-block;
	width : auto;
	max-width : 317px;
	height : 100%;
	font-size : 0;
}
header > .HEADER_MAIN > #BANNER_HEADER > a > img{
	max-width : 100%;
	max-height : 100%;
}



header > nav{
	width: 100%;
	z-index: 70;
	background : #35374c;
	min-height : 50px;
	letter-spacing : -0.4px;
}
header > nav > .WRAPPER {position:relative;}
header > nav > .WRAPPER > div.cate{
	position : relative;
	z-index : 70;
}
header > nav > .WRAPPER > div.cate > ul{
	padding : 0;
	margin : 0;
	text-align : center;
}
header > nav > .WRAPPER > div.cate > ul > li{
	display : inline-block;
	position : relative;
	margin : 0 32px;
	z-index : 10;
}
header > nav > .WRAPPER > div.cate > ul > li > a{
	display : block;
	height : 50px;
	padding : 0;
	line-height : 50px;
	color : #FFF;
	font-size : 15px;
	text-decoration : none;
	font-weight : normal;
	letter-spacing : 1px;
}
header > nav > .WRAPPER > div.cate > ul > li > div.sub_cate{
	display : none;
	position : absolute;
	top : 50px;
	left : -20px;
	width : 150px;
	border : solid 1px #D9D9D9;
	border-top : none;
	padding : 0;
	background : #FFF;
}
header > nav > .WRAPPER > div.cate > ul > li > div.sub_cate > ul{
	padding : 20px;
	margin : 0;
	text-align : left;
}
header > nav > .WRAPPER > div.cate > ul > li > div.sub_cate > ul > li{
	padding : 0;
	margin-bottom : 6px;
	list-style : none;
}
header > nav > .WRAPPER > div.cate > ul > li > div.sub_cate > ul > li:last-child{
	margin-bottom : 0;
}
header > nav > .WRAPPER > div.cate > ul > li > div.sub_cate > ul > li > a{
	display : block;
	padding : 0;
	font-size : 12px;
	color : #404040;
}
header > nav > .WRAPPER > div.cate > ul > li > div.sub_cate > ul > li > a:hover{
	color : #046db7;
	transition : color 0.25s ease-in-out;
}
header > nav > .WRAPPER > div.cate > ul > li:hover{
	z-index : 100;
}
header > nav > .WRAPPER > div.cate > ul > li:hover > a{
	color : #D1D1D4;
}
header > nav > .WRAPPER > div.cate > ul > li:hover > div.sub_cate{
	display : block;
}

aside > div{ margin-bottom:16px }
aside > div.ASIDE_TITLE{ font-size:0; background-color:#C40 }
aside > div > p.ASIDE_MENU_TITLE{ padding:12px 16px; margin:0; background-color:#9E5F4D; color:#FFF }
aside > div > ul{ padding:0; margin:0 }
aside > div > ul > li{ background-color:#9E7F6D; border-bottom:solid 1px #AE8F6D; color:#DDD; font:normal 12px/normal Dotum }
aside > div > ul > li > a{ display:block; padding:10px 16px }
aside > div > ul > li > a:hover{ background-color:#7E5F4D; color:#FFF; cursor:pointer }

nav.GLOBALNAVIGATOR{  }
nav.GLOBALNAVIGATOR > .WRAPPER{ padding:4px 0; margin-bottom:0; text-align:right }
nav.GLOBALNAVIGATOR > .WRAPPER > a{ font:normal 11px/normal Dotum; color:#666; cursor:pointer }
nav.GLOBALNAVIGATOR > .WRAPPER > a:after{ content:'>'; padding:0 6px; color:#999; cursor:default }
nav.GLOBALNAVIGATOR > .WRAPPER > a:last-child{ font-weight:bold }
nav.GLOBALNAVIGATOR > .WRAPPER > a:last-child:after{ display:none }

/* 오른쪽 고정*/
aside {text-align:center; position: fixed;right:0; bottom:0; top:0; z-index:100; background:#fff; width:204px; border-left:1px solid #c7c7c7; padding-top:20px;}
aside > ul.quick_util {margin: 20px auto 0; padding:0; display: table;}
aside > ul.quick_util > li { display: inline-block; list-style:none; width: 74px; height: 30px; line-height: 30px; text-align: center;  font-size: 14px; letter-spacing: -1px; color: #454545; margin: 0 4px 7px; border: 1px solid #d0d0d0;}
aside > ul.quick_util > li:last-child {width:158px}
aside > div.right-info {text-align: left; padding: 0 0 0 24px; letter-spacing: -1px;}
aside > div.right-info > div{margin-top:24px;}
aside > div.right-info > div > h3 {padding:14px 0 0 0; margin-bottom:8px; font-size:13px; color:#1a1d2c; position:relative;}
aside > div.right-info > div > h3:before { content: ""; position: absolute; top: 0; left: 0; width: 17px; border-top: 1px solid #cbcbcd; }
aside > div.right-info > div > strong {color:#1a1d2c; font-size:24px; font-family: Arial,'Malgun Gothic', Verdana, Dotum, AppleGothic, sans-serif; font-weight: bold;}
aside > div.right-info > div > p {padding:9px 0 0 0; color: #707070; font-size:12px; line-height:17px; font-family: '돋움',Dotum,'Malgun Gothic',Verdana,AppleGothic,sans-serif; margin:0; }
aside > ul.right-btn-wrap {position: absolute; left:-53px; top:267px; z-index:10; margin: 0;  padding: 0;}
aside > ul.right-btn-wrap > li {list-style:none; position:relative; margin:0;  padding:0; display:block; font-size:0;}
aside > ul.right-btn-wrap > li.right-home {width: 53px; height:51px; width: 53px; height: 51px; background-color: #4d7bcc;}
aside > ul.right-btn-wrap > li.right-home > a {padding-top:16px; display:block;}
aside > ul.right-btn-wrap > li.right-home > a > img {margin:0; padding:0;}
aside > ul.right-btn-wrap > li > span {visibility:hidden; opacity:0; font-size:12px; position: absolute; top:50%; margin-top: -13px; right: 60px; height: 25px; line-height: 25px; padding: 0 10px; border: 1px solid #ddd; background: #fff; z-index: 5; white-space: nowrap;}
aside > ul.right-btn-wrap > li:hover > span {visibility:visible;}
aside > ul.right-btn-wrap > li > p {cursor:pointer; margin:0; padding:0;}
aside > ul.right-btn-wrap > li > p > img {margin:0; padding:0;}
aside > ul.right-btn-wrap > li.quick_toggle > p.right-quick-close {display:none;}
aside > ul.right-btn-wrap > li.quick_toggle > p.right-quick-open {display:block;}
aside > ul.right-btn-wrap > li.quick_toggle.on > p.right-quick-close {display:block;}
aside > ul.right-btn-wrap > li.quick_toggle.on > p.right-quick-open {display:none;}




footer{background: #fff; padding-bottom: 50px;  border-top: 1px solid #000;  margin-top: 60px; }
footer > #FOOTER_MENU{ padding: 21px 0 19px; border-bottom: 1px solid #c9c9c9; font-size:0; text-align: center}
footer > #FOOTER_MENU > a{font-size: 14px; display: inline-block; padding: 0 18px; position: relative; font-family: '돋움',Dotum,'Malgun Gothic',Verdana,Dotum,AppleGothic,sans-serif;}
footer > #FOOTER_MENU > a:after {content: ""; position: absolute; top: 0; left: 0; height: 13px; border-left: 1px solid #cad3e2;}
footer > #FOOTER_MENU > a:first-child:after{border-left:0;}
footer > .bottom-info {width: 100%; border-bottom: 1px solid #c9c9c9; padding: 36px 0 28px; margin-bottom: 20px;}
footer > .bottom-info > div {font-size:0; overflow: hidden; position: relative;}
footer > .bottom-info > div > div {display: table-cell;padding-left: 30px; border-left: 1px solid #e5e5e5;}
footer > .bottom-info > div > div:first-child {border-left: 0; padding-left: 0;}
footer > .bottom-info > div > div > h3 { height: 13px; padding-bottom: 12px;}
.bottom-info > div > div > strong {margin-top:2px; font-size:29px; color:#1a1d2c; line-height:1.2; font-family: 'Myriad Pro','Malgun Gothic', Verdana, Dotum, AppleGothic, sans-serif;}
.bottom-info > div > div > strong > img {vertical-align:-3px;}
.bottom-info > div > div > p {margin:0; padding:0; margin-top 5px; letter-spacing -1px; line-height:17px; color:#686868; font-size:13px; font-family: '돋움',Dotum,'Malgun Gothic',Verdana,AppleGothic,sans-serif;}
.bottom-info > div > div > ul {margin:0; padding:0;}
.bottom-info > div > div > ul > li {margin-top: 2px; font-size: 29px; color: #1a1d2c; line-height: 1.2; font-family: 'Myriad Pro','Malgun Gothic', Verdana, Dotum, AppleGothic, sans-serif; font-weight:bold; list-style:none;}
.bottom-info > div > div > ul.bottom_notice {margin:0; padding:0;}
.bottom-info > div > div > ul.bottom_notice > li {line-height: 19px; font-size: 13px; position:relative; list-style:none; ont-family: '돋움',Dotum,'Malgun Gothic',Verdana,Dotum,AppleGothic,sans-serif;}
.bottom-info > div > div > ul.bottom_notice > li:before{content: ""; position: absolute; top: 50%; left: -6px; height: 2px; border-left: 1px solid #b0b0b0;}
.bottom-info > div > div > ul.bottom_notice > li > a {color: #414141; letter-spacing: -1px;}
.bottom-info > div > div > ul.bottom_notice > li > span {color: #a8a8a8; font-size: 12px; float: right; margin-right: 30px;}
.bottom-info > div > div > ul.quick_menu {display:table; margin:0; padding:0; font-size:0;}
.bottom-info > div > div > ul.quick_menu > li {display:inline-block; margin-left: 13px; text-align: center;}
.bottom-info > div > div > ul.quick_menu > li:first-child {margin-left:0;}
.bottom-info > div > div > ul.quick_menu > li > a > p {margin:0; padding:0; margin-top: 7px; font-size:13px; font-weight: bold; color: #414141;}

footer > address{ clear: both; padding: 6px 0 0;  color: #585858; line-height: 18px; text-align: left; font-size :0}
footer > address > span{position:relative; display : inline-block; padding:0 15px 0 0; font-size:12px; font-family:'돋움',Dotum,'Malgun Gothic',Verdana,Dotum,AppleGothic,sans-serif; color:#585858; line-height: 18px;  font-style:normal;}
footer > address > span > strong{ font-weight:normal; color:#666 }
footer > .FOOTER_COPYRIGHT{ color:#666; font:normal 12px/normal Dotum }

@media (max-width:1240px){
	#PANEL_LEFT{ position:fixed; left:0; top:0 !important; bottom:0; right:auto; padding:10px; margin-left:-115px; background-color:#FFF; border-right:solid 1px #CCC; transition:margin-left .25s ease-in-out }
	#PANEL_LEFT > .DIRECTIONS{ border:0 }
	#PANEL_LEFT:hover{ margin-left:0 }
	
	#PANEL_RIGHT{ position:fixed; left:auto; top:0 !important; bottom:0; right:0; padding:10px; margin-right:-115px; background-color:#E9E9E9; border-left:solid 1px #CCC; transition:margin-right .25s ease-in-out }
	#PANEL_RIGHT:hover{ margin-right:0 }
}

@media (max-width:1053px){
	.WRAPPER{ width:calc(100% - 12px) }
}