@charset "utf-8";
@import url(//cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css);  /* font-family: 'NanumSquare'; */
@font-face {
    font-family: 'Pretendard';
    src: url('//cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('//cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('//cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('//cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('//cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('//cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('//cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}


html,body { font-family:'NanumSquare','Pretendard', "Apple SD Gothic Neo", "Malgun Gothic", Sans-serif; }
body {overflow-y:visible;overflow-x:auto;}
#doc {overflow:hidden;position:relative;background:#fff;min-width:360px; z-index:8999;min-width:360px;opacity:0;-webkit-transition: opacity 0.3s ease-out;-moz-transition: opacity 0.3s ease-out;-o-transition: opacity 0.3s ease-out;transition: opacity 0.3s ease-out;}
#doc.show{ transition-delay:0s; opacity:1;}
	@media only screen and (max-width:1200px){
		
	}
	@media only screen and (max-width:999px){
		
	}
	@media only screen and (max-width:680px){
		
	}
	@media only screen and (max-width:480px){
		
	}	
	

/*=======================================================
  css default
=========================================================*/
.div-cont {text-align:left;margin:0 auto; max-width:1210px; padding:0 20px; box-sizing:border-box;}
.div-cont:after {clear:both;content:"";display:block;}
	@media only screen and (max-width:1210px){
		
	}
	@media only screen and (max-width:999px){
		
	}
	@media only screen and (max-width:680px){
		.div-cont{padding:0 20px;}
	}
	@media only screen and (max-width:480px){
		
	}

.layer-ovclick{position:fixed;z-index:2600;width:100%;height:100%;left:0;top:0;background:rgba(0,0,0,0.8);cursor:pointer }
	



/*=======================================================
    z-index default
=========================================================*/
#header-wrap{position:fixed;z-index:2005;}
#container-wrap{position:relative;z-index:1005;}
#footer-wrap{position:relative;z-index:1007; }


/*=======================================================
    #header-wrap 
=========================================================*/
#header-wrap {left:0; width:100%; top:0; min-width:360px; box-sizing:Border-box;}
#header-wrap:after{position:absolute;left:50%; top:0; width:20000px;margin-left:-10000px;height:100%; box-sizing:border-box;z-index:-1;-webkit-transition: box-shadow 0.5s ease-out, background 0.5s ease-out;-moz-transition: box-shadow 0.5s ease-out, background 0.5s ease-out;-o-transition: box-shadow 0.5s ease-out, background 0.5s ease-out;transition: box-shadow 0.5s ease-out, background 0.5s ease-out;display:block; content:"";}
#header-wrap.fix:after{/* background:#fff;border-bottom:1px solid #dedede;box-shadow: 0 0 8px rgba(0, 0, 0, 0.1)  ; -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.1)  ; -moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.1)  ; */ }

#header{position:relative; z-index:5001;height:100px;}

#header .bt-mnall{position:absolute;z-index:4599; width:70px; height:70px; top:50%;margin-top:-35px; right:20px;border-radius:6px; background:url(/skins/img/layout/bt-mnall.png) no-repeat center center #000; background-size:90% auto;}
#header .bt-mnall.active{background-image:url(/skins/img/layout/bt-mnclose.png)}	
	
	@media only screen and (max-width:1210px) {
		#header .bt-mnall{width:60px;height:60px;}
	}
	@media only screen and (max-width:999px) {
		#header{height:70px;}
		#header .bt-mnall{width:42px;height:42px; top:14px; margin-top:0; border-radius:3px; }
	}
	
	@media only screen and (max-width:680px) {
		#header .bt-mnall{width:34px;height:34px; top:18px;}
	}
	@media only screen and (max-width:480px) {
		
	}
	
	
	
	/* ======================================================
	   #mainNavi-wrap 
	=========================================================*/
	@media only screen and (min-width:1000px) {
		#mainNavi-wrap{position:relative; z-index:4300;width:100%; min-width:320px;left:0;top:0;box-sizing:border-box;height:0; display:none;}
		#mainNavi{position:fixed;width:100%; box-sizing:border-box;overflow-y:auto;overflow-x:hidden;left:0;top:0;padding:70px;min-height:768px;height:100%;display:flex;align-items: center; justify-content: center;}
		
		.topmenu{width:100%;}
		.topmenu:after {display:block;content:"";clear:both;}
		.topmenu .mn_l1:nth-child(n+2){margin-top:40px;}
		.topmenu .mn_a1 {font-size:80px;line-height:1.2em;width:100%;display:block;color:#ccc;font-weight:900; padding:0 10px;box-sizing:border-box; letter-spacing:0;text-align:center; text-transform:uppercase; }
		.topmenu .mn_a1:hover{color:#fff}
		.topmenu .over .mn_a1{color:#b989ff}
	}
	@media only screen and (max-width:999px) {
		#mainNavi-wrap{position:relative; z-index:4300; width:100%; min-width:320px;left:0;top:0;box-sizing:border-box;height:0;display:none;}
		#mainNavi{position:fixed;width:300px; background:#fff; box-sizing:border-box;overflow-y:auto;overflow-x:hidden;right:-300px;top:0;padding:30px;min-height:768px;height:100%;display:flex;align-items: center; justify-content: center;-webkit-transition:right .6s cubic-bezier(.77,0,.175,1);-moz-transition:right .6s cubic-bezier(.77,0,.175,1);transition:right .6s cubic-bezier(.77,0,.175,1)}
		#mainNavi.open{right:0}
		.topmenu{width:100%;}
		.topmenu:after {display:block;content:"";clear:both;}
		.topmenu .mn_l1:nth-child(n+2){margin-top:30px;}
		.topmenu .mn_a1 {font-size:24px;line-height:1.2em;width:100%;display:block;color:#333;font-weight:900; padding:0 10px;box-sizing:border-box; letter-spacing:0;text-align:center; text-transform:uppercase; }
		.topmenu .mn_a1:hover{color:#b989ff}
		.topmenu .over .mn_a1{color:#b989ff}
	}
	@media only screen and (max-width:680px) {
		.topmenu .mn_a1 {font-size:22px;}
		.topmenu .mn_l1:nth-child(n+2){margin-top:25px;}
	}
	@media only screen and (max-width:480px) {
		.topmenu .mn_a1 {font-size:20px;}
		.topmenu .mn_l1:nth-child(n+2){margin-top:20px;}
	}


	

/* ======================================================
   #container-wrap 
=========================================================*/
#container-wrap{}
#container-wrap #contents{ min-height:580px;}
	@media only screen and (max-width:1210px) {
		
	}
	@media only screen and (max-width:999px) {
		
	}
	
	@media only screen and (max-width:680px) {
		
	}
	@media only screen and (max-width:480px) {
		
	}


/* ======================================================
   .top-btn 
=========================================================*/
.top-btn{ z-index:2004;right:-60px;width:60px;height:60px; text-align:center; background:url(/skins/img/layout/top-btn.png) no-repeat center center rgba(0,0,0,0.2);background-size:80% auto; overflow:hidden;border-radius:100%; bottom:20px; text-transform:uppercase; color:#fff; font-size:13px; font-weight:500; position:fixed;-webkit-transition: right 0.3s ease-out;-moz-transition: right 0.3s ease-out;-o-transition: right 0.3s ease-out;transition: right 0.3s ease-out; }
.top-btn.over{right:20px;}
.top-btn:hover{background-color:#333 !important;}
	@media only screen and (max-width:1210px) {
		.top-btn{width:50px;height:50px; right:-50px;}
		.top-btn.over{right:20px;}
	}
	@media only screen and (max-width:999px) {
		.top-btn{width:40px;height:40px; right:-40px; bottom:15px;}
		.top-btn.over{right:15px;}
	}
	@media only screen and (max-width:680px) {
		.top-btn{width:30px;height:30px; right:-30px;}
	}
	@media only screen and (max-width:480px) {

	}





/* ======================================================
    #footer-wrap 
=========================================================*/
#footer-wrap{background:#000; padding:50px 0; margin-top:120px; }

#footer{position:relative;}
.f-info{line-height:1.3em; font-size:0;}
.f-info p{display:inline-block;vertical-align:top; font-size:18px; color:#ccc; letter-spacing:-0.02em; line-height:1.3em; font-weight:400;font-family:'dotum';}
.f-info p span{font-weight:700; color:#fff;}
.f-info p:nth-child(1){display:block; margin-bottom:5px}
.f-info p:nth-child(n+3){margin-left:12px}

.f-copy{margin-top:30px;font-size:14px; color:#ccc; letter-spacing:-0.02em; line-height:1.3em; font-weight:400;}
.f-copy span{font-weight:700; color:#fff;}

.f-sns{position:absolute;right:20px; top:0}
.f-sns ul:after{display:block; content:"";clear:both;}
.f-sns li{float:left;}
.f-sns li:nth-child(n+2){margin-left:24px;}
.f-sns li a{display:block;width:42px; height:42px; background-size:100% auto !important;}

.f-sns li.kakao a{background:url(/skins/img/layout/f-sns01.png) no-repeat center center;}
.f-sns li.insta a{background:url(/skins/img/layout/f-sns02.png) no-repeat center center;}
.f-sns li.facebook a{background:url(/skins/img/layout/f-sns03.png) no-repeat center center;}
.f-sns li.blog a{background:url(/skins/img/layout/f-sns04.png) no-repeat center center;}
.f-sns li.nshop a{background:url(/res/img/icons/n_shop.png) no-repeat center center;}
	@media only screen and (max-width:1210px) {
		#footer-wrap{margin-top:100px;}
		.f-sns li:nth-child(n+2){margin-left:20px;}
		.f-sns li a{width:38px;height:38px;}

		.f-copy{margin-top:25px;}
	}
	@media only screen and (max-width:999px) {
		#footer-wrap{margin-top:80px;}
		#footer{text-align:center;}
		.f-sns{position:relative; right:auto; top:auto}
		.f-sns ul{text-align:center; font-size:0;}
		.f-sns li{display:inline-block;vertical-align:top; float:none;}
		.f-sns li:nth-child(n+2){margin-left:16px;}
		.f-sns li a{width:34px;height:34px;}

		.f-info{margin-top:30px;}

		.f-copy{margin-top:20px;}
	}
	
	@media only screen and (max-width:680px) {
		#footer-wrap{margin-top:60px;}
		#footer-wrap{padding:40px 0}

		.f-sns li a{width:30px;height:30px;}

		.f-info p{font-size:13px;}
		.f-info p:nth-child(n+3){margin-left:8px}
		.f-info p:nth-child(4){margin-left:0; display:block; margin-top:5px;}

		.f-copy{font-size:13px; margin-top:15px;}
	}
	@media only screen and (max-width:480px) {
		#footer-wrap{margin-top:40px;}
	}