@charset "utf-8";


/* Font 
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
	@font-face {
		font-family:'NanumMyeongjo';
		font-style:normal;
		font-weight:400;
		src:url('/tpl/webfont/NanumMyeongjo.eot');
		src:url('/tpl/webfont/NanumMyeongjo.eot?#iefix') format('eot'),
				url('/tpl/webfont/NanumMyeongjo.woff') format('woff'), 
				url('/tpl/webfont/NanumMyeongjo.ttf') format('truetype');
	}
	@font-face {
		font-family:'NotoSansKR';
		font-style:normal;
		font-weight:100;
		src:url('/tpl/webfont/NotoSansKR-Thin.eot');
		src:url('/tpl/webfont/NotoSansKR-Thin.eot?#iefix') format('eot'),
				url('/tpl/webfont/NotoSansKR-Thin.woff') format('woff'), 
				url('/tpl/webfont/NotoSansKR-Thin.otf') format('opentype');
	}
	@font-face {
		font-family:'NotoSansKR';
		font-style:normal;
		font-weight:300;
		src:url('/tpl/webfont/NotoSansKR-Light.eot');
		src:url('/tpl/webfont/NotoSansKR-Light.eot?#iefix') format('eot'),
				url('/tpl/webfont/NotoSansKR-Light.woff') format('woff'), 
				url('/tpl/webfont/NotoSansKR-Light.otf') format('opentype');
	}
	@font-face {
		font-family:'NotoSansKR';
		font-style:normal;
		font-weight:400;
		src:url('/tpl/webfont/NotoSansKR-Regular.eot');
		src:url('/tpl/webfont/NotoSansKR-Regular.eot?#iefix') format('eot'),
				url('/tpl/webfont/NotoSansKR-Regular.woff') format('woff'), 
				url('/tpl/webfont/NotoSansKR-Regular.otf') format('opentype');
	}
	@font-face {
		font-family:'NotoSansKR';
		font-style:normal;
		font-weight:500;
		src:url('/tpl/webfont/NotoSansKR-Medium.eot');
		src:url('/tpl/webfont/NotoSansKR-Medium.eot?#iefix') format('eot'),
				url('/tpl/webfont/NotoSansKR-Medium.woff') format('woff'), 
				url('/tpl/webfont/NotoSansKR-Medium.otf') format('opentype');
	}
	@font-face {
		font-family:'NotoSansKR';
		font-style:normal;
		font-weight:700; 
		src:url('/tpl/webfont/NotoSansKR-Bold.eot');
		src:url('/tpl/webfont/NotoSansKR-Bold.eot?#iefix') format('eot'),
				url('/tpl/webfont/NotoSansKR-Bold.woff') format('woff'), 
				url('/tpl/webfont/NotoSansKR-Bold.otf') format('opentype');
	}
	@font-face {
		font-family:'NotoSansKR';
		font-style:normal;
		font-weight:900;
		src:url('/tpl/webfont/NotoSansKR-Black.eot');
		src:url('/tpl/webfont/NotoSansKR-Black.eot?#iefix') format('eot'),
				url('/tpl/webfont/NotoSansKR-Black.woff') format('woff'), 
				url('/tpl/webfont/NotoSansKR-Black.otf') format('opentype');
	}


/* Reset 
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
	html,body{margin:0; padding:0; width:100%; min-width:320px; height:100%;}
	body,div,section,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button{margin:0; padding:0; box-sizing:border-box;}
	article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary{display:block;}
	fieldset,img {border:0 none;}
	dl,ul,ol,menu,li {list-style:none;}
	blockquote, q {quotes:none;}
	blockquote:before, blockquote:after,q:before, q:after {content:''; content:none;}
	img,input,select,textarea,button {vertical-align:middle;}
	body{background:#fff; overflow-y:scroll; *overflow-y:; -webkit-text-size-adjust:none;}
	body,th,td,input,select,textarea,button,pre{font-weight:300; font-size:14px; line-height:1.5; font-family:'NotoSansKR', 'Malgun Gothic', '맑은 고딕', sans-serif; color:#58595b;}
	h1,h2,h3,h4,h5,h6{font-weight:normal;}
	a{box-sizing:border-box; text-decoration:none; font-weight:300; font-size:14px; color:#58595b; transition:.3s all linear;}
	a:active, a:hover {text-decoration:none;}
	address,caption,cite,code,dfn,em,var {font-style:normal; font-weight:normal;}
	table{table-layout:fixed; border-collapse:collapse; border-spacing:0;}
	caption{text-align:left;}
	fieldset{border:0 none;}
	hr{display:none;}
	abbr,acronym{border:0 none;} 
	abbr[title], dfn[title] {border-bottom:1px dotted #000000; cursor: help;}
	em{font-style:normal;}

	/* form */
	input:focus, button:focus, select:focus, textarea:focus{outline:0;}
	input[type="text"], input[type="password"],input[type="image"],select,textarea{display:inline-block; vertical-align:middle; -webkit-appearance:none; -moz-appearance:none; -o-appearance:none; appearance:none; margin:0; padding:0; min-height:28px; border:0 none; box-sizing:border-box; border-radius:0; outline:0; border:1px solid #ddd;}
	input[type="text"], input[type="password"]{padding:0 10px; height:35px; vertical-align:middle;}
	input[type="radio"]{width:15px; height:15px; background:#fff;}
	input[type="checkbox"]{width:15px; height:15px; background:#fff; border:1px solid #ddd;}
	input[type="image"]{border:0 none;}
	button{-webkit-appearance:none; -moz-appearance:none; appearance:none; margin:0; padding:0; box-sizing:border-box; border:0 none; background-color:transparent; cursor:pointer;}
	select{padding:0 26px 0 10px; height:35px; background:#fff url('/images/basic_blue/common/select_arrow.png') no-repeat right 30px center;}
	select::-ms-expand{display:none;}
	textarea{padding:10px; min-height:80px;}
	label{line-height:35px;}


/* Common 
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
	/* 마크업에만 보이게 */
	.hidden{width:0; height:0; margin:0; padding:0; text-indent:-9999em; overflow:hidden; line-height:0; font-size:0;}
	
	/* 말줄임 */
	.ellipsis{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

	/* 더보기 */
	.btn-more{display:inline-block; padding:2px 12px 3px; letter-spacing:-0.2px; line-height:1; font-weight:400; font-size:16px; color:#58595b; border:1px solid #58595b;}
	.btn-more.white{font-weight:300; color:#fff; border-color:#fff; opacity:0.5;}
	.btn-more img{position:relative; margin:0 0 0 10px;}

	/* 바로가기 투명 링크 */
	.btn-transp{position:absolute; top:0; left:0; display:block; width:100%; height:100%; text-indent:-9999em; overflow:hidden;}


/* Layout
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */	
	#wrapper{margin:0 auto; width:100%; min-width:320px; height:100%;}


/* Header
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
	#header{z-index:996; position:fixed; top:0; left:50%; margin-left:-50%; width:100%; height:50px; background:#E6E7E8;}
	#header > div{padding:0;}

	#header h1{z-index:999; float:left; padding:11px 20px; height:50px;}
	#header h1 a{display:block;}
	#header h1 img{width:132px; max-height:29px;}

	.nav-btn{z-index:999; display:block; position:absolute; top:17px; right:20px; width:20px; height:18px; cursor:pointer;}
	.nav-btn span{position:absolute; left:50%; display:block; margin-left:-10px; width:20px; height:2px; background:#797e83; transition:.2s all linear;}
	.nav-btn span:nth-child(1){top:0;}
	.nav-btn span:nth-child(2){top:8px;}
	.nav-btn span:nth-child(3){top:16px;}
	
	.nav-btn.nav-close{position:fixed;}
	.nav-btn.nav-close span:nth-child(1){top:50%; transform:rotate(45deg);}
	.nav-btn.nav-close span:nth-child(2){margin-left:0; width:0;}
	.nav-btn.nav-close span:nth-child(3){top:50%; transform:rotate(-45deg);}

	.nav-bg{z-index:997; display:none; position:fixed; top:0; width:100%; height:100%; background:rgba(0,0,0,0.7);}

	#nav{z-index:998; display:none; position:fixed; display:block; padding:50px 0 0px; width:100%; background:#e7e7e8;}

	.util-menu{padding:0 20px 20px; border-bottom:1px solid #eee;}
	.util-menu a{display:inline-block; margin-top:5px; font-size:14px; color:#555;}
	.util-menu li:first-child a{color:#7AC143;}
			
	.navigation{border-bottom:1px solid #d2d3d4;}
	.navigation .main-menu{display:block; padding:0 20px; width:100%; line-height:36px; font-weight:500; font-size:16px; color:#797e83; border-top:1px solid #d2d3d4;}
	.navigation .active .main-menu{color:#58595b;}

	.navigation .sub-menu{display:none; padding-bottom:20px;}
	.navigation .sub-menu a{display:block; padding:0 20px; line-height:26px; font-size:14px; color:#58595b;}
	.navigation .sub-menu a:before{content:""; display:inline-block; margin:0 5px 0 0; width:4px; height:1px; vertical-align:middle; background:#888;}

	.language{margin:15px 20px; line-height:0; font-size:0;}
	.language li{position:relative; display:inline-block; margin-left:20px; line-height:0; font-size:0;}
	.language li:first-child{margin-left:0;}
	.language li:after{content:""; display:block; position:absolute; bottom:0; left:0; width:100%; height:1px; background:#fff; transition:.1s all linear; transform:scaleX(0);}
	.language li:hover:after,
	.language li.active:after{transform:scaleX(1);}

	.language li a{margin-bottom:3px; line-height:18px; font-size:13px; font-weight:300; color:#fff;}
	.language li.active a{font-weight:700;}

	.go-mall{display:block; padding:0 0px; color:#fff;}
	.go-mall img{margin-top:-3px;}
	
	
	.bg_gray {width:100%; background:#58595b; padding:15px 0px 1px 0px; }
	.bg_gray h3 {padding-left:20px;}
	.bg_gray h3 a {color:#fff; font-size:16px; }

/* Footer
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
	#footer{padding:30px 20px; background:#e6e7e8;}
	.foot-logo{width:150px; margin:0 auto 30px;}

	.foot-info{margin-bottom:20px; text-align:center;}
	.foot-info span,
	.foot-info p,
	.foot-info a{letter-spacing:-0.2px; line-height:1.6; font-weight:400; font-size:12px; color:#7c7d7e;}
	.foot-info strong{font-weight:700;}
	.foot-info span{display:block;}
	.foot-info a:hover{text-decoration:underline;}
	.foot-info p{margin-top:12px;}

	.foot-menu{margin-bottom:20px; text-align:center; line-height:0; font-size:0;}
	.foot-menu li{display:inline-block; margin-left:8px; padding-left:8px; border-left:1px solid #9fa0a1;}
	.foot-menu li:first-child{margin-left:0; padding-left:0; border-left:0;}
	.foot-menu li a{line-height:14px; font-weight:400; font-size:12px; color:#333;}

	.foot-sns-menu{text-align:center; line-height:0; font-size:0;}
	.foot-sns-menu li{display:inline-block; margin-left:14px;}
	.foot-sns-menu li:first-child{margin-left:0;}

	@media all and (max-width:360px){
		.foot-menu li{display:block; margin-left:0; padding-left:0; border-left:0;}
		.foot-menu li a{line-height:1.6;}
	}

/* Popup
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
	#popup{z-index:9999; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); transition:.5s all;}
	.popup-box{position:absolute; top:0; left:0; bottom:0; right:0; margin:auto; width:300px; height:340px; overflow:hidden; background:#fff; border-radius:10px;}
	.popup-box .img-area{width:100%; height:287px; overflow:hidden;}
	.popup-box .img-area img{width:100%;}
	.popup-box .btn-area{line-height:0; font-size:0; border-top:1px solid #ddd;}
	.popup-box .btn-area a{display:inline-block; width:100%; height:50px; text-align:center; font-weight:400; line-height:49px; font-size:14px;}
	/* .popup-box .btn-area a:first-child{border-right:1px solid #ddd;} */