@charset "utf-8";

@font-face {
    font-family: 'Chosunilbo_myungjo';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/Chosunilbo_myungjo.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

div#wrap {
    overflow: hidden;
}
/* base */
::selection{background:rgba(117,61,23,.35); color:#fff;}
body{font-size:16px; word-break:keep-all;}
th[data-view="file"] + td ul li a{line-height:1em;}
ul li:last-child{margin-right:0;}

.wrap{width:1200px; margin:0 auto;}
.wrapper{width:1400px; margin:0 auto; }
/* common */
.m_call{display:none; position:absolute;}
.m_call img{height:21px;}
.m_call a{display:flex; align-items: center; justify-content: center; width:40px; height:40px; background:#805649; border-radius:50%;}

/* popup */
.layerPop{overflow:hidden; border:1px solid #353535; border-radius:14px;}
.layerPop .btn button{font-size:13px;}
.layerPop .btn{padding:13px 10px; background:#353535; text-align:left;}
.layerPop .btn button:last-child{float:right; margin:0 12px 0 0;}

.quick{visibility: hidden; opacity:0; position:fixed;top:40%;right:10px;z-index:50; background: #fff;transition: all 0.3s ease-out 0.3s;border: 1px solid #bbb;}
.quick img{display:block;width:36px;margin:0 auto;transition:all 0.4s ease-out 0s;}
.quick span{color:#6e3e30}
.quick ul li{border-bottom:1px solid #eee;}
.quick ul li:last-child{border:none;}
.quick ul li p{margin-top:4px;font-weight:500;font-size:14px;text-align:center;}
.quick ul li a{display:block;padding:16px 15px;transition: all 0.4s ease-out 0s;}
.quick > a{display:block; margin:0 10px; padding:7px 0; background:#6e3e30; font-size:12px; color:#fff; text-align:center;}
.moved .quick{opacity:1; visibility: visible;}


/* header */
#header{position:relative; z-index:81;}
#header:before{content:''; display:block; position:absolute; left:0; bottom:0; width:100%; height:1px; background-color:#ddd;}

#header h1{position:absolute; top:50%; left:50%; transform: translate(-50%, -50%);}
#header h1 a{display:block;}
#header h1 img{height:50px;}
#header .header_top{position:relative; height:90px; border-bottom:1px solid #ddd; text-align:center;}
#header .area_util{float:right; margin-top:30px;}
#header .area_util li{position:relative; float:left; padding:0 20px;}
#header .area_util ul li:before{content:''; position:absolute; display:block; left:-1.5px; margin-top:-1.5px; top:50%; width:3px; height:3px; background:#aaa; border-radius:50%}
#header .area_util ul li:first-child:before{display:none;}
#header .header_bottom{position:relative; height:60px; max-width:1600px; margin:0 auto;}

#header .btn_menu{display:none;}
#header .btn_menu{position:absolute;top: 28px; right:20px; z-index:9999; width:23px;height: 16px; font-size:0px; transition:all 0.3s ease 0s;}
#header .btn_menu > span{display:block; position:absolute; left:0px; width:100%;height: 1px; background:#000;}
#header .btn_menu > span:nth-of-type(1){top:0;}
#header .btn_menu > span:nth-of-type(2){top:50%;margin-top: 0; transition:background 0.3s ease 0s;}
#header .btn_menu > span:nth-of-type(3){top:100%;}
#header .btn_menu > span:nth-of-type(1),
#header .btn_menu > span:nth-of-type(3){transition:all 0.3s ease; transition-property:top, transform; transition-delay:0.3s, 0s;}
#header .btn_menu.active{position:fixed; top:25px; transform:rotate(180deg);}
#header .btn_menu.active > span:nth-of-type(1){top:10px; transform:rotate(-45deg);}
#header .btn_menu.active > span:nth-of-type(2){background:transparent;}
#header .btn_menu.active > span:nth-of-type(3){top:10px; transform:rotate(45deg);}
#header .btn_menu.active > span:nth-of-type(1),
#header .btn_menu.active > span:nth-of-type(3){background:#fff; transition-delay:0s, 0.3s;}
#header .btn_close{position:fixed; opacity:0; visibility:hidden; top:0px; left:0px; z-index:99; width:-webkit-calc(100% - 320px); width:100%; height:-webkit-calc(100vh - -0px * 1); height:calc(100vh - -0px * 1); background:#000; font-size:0; transition:all 0.3s ease-out 0s;}
.active #header .btn_close{opacity:0.4; visibility:visible;}

#header nav{--sizeBg:340px;}
#header nav .gnb{text-align:center;}
#header nav .gnb > li{float:left; padding: 0 26px;}

#header nav .gnb > li:after{content:""; position:absolute; opacity:0.28; top:8px; right:0; width:1px; height:15px; background:#fff;}
#header nav .gnb > li:last-child:after{background:none;}
#header nav .gnb > li > a{line-height: 60px; display:inline-block; font-size:16px; color:#222; font-weight:400;}
#header nav .gnb > li:hover > a{color:#775e5b}
#header nav .gnb > li > a.on, .sub #header nav .gnb > li > a.on{}
#header nav .gnb:after{content:''; display:block; clear:both;}
#header .gnb .sub_menu.v1 li{float:left; width:45%; text-align:left;}

#header .snb_wrap_bg{z-index:1; display:none; position:absolute; overflow:hidden; top:150px; width:100%; height:var(--sizeBg); background:#fff; border-top:1px solid #ececec; box-shadow:3px 53px 25px 0px rgba(0, 0, 0, 0.05);}
#header .gnb li:hover .snb_wrap{display:block;}

.snb_wrap{opacity:0; visibility:hidden; display:none; z-index:9; position:absolute; top:60px; left:0; width:100%; height:var(--sizeBg); background:#fff;}
.snb_wrap:before{content:''; position:absolute; left:-50%; top:0; display:block; width:50%; height:var(--sizeBg); background:#fff}
.snb_wrap:after{content:''; position:absolute; right:-50%; top:0; display:block; width:50%; height:var(--sizeBg); background:#fff}
.snb_wrap .inr{width:1400px;  height:var(--sizeBg);}
.snb_wrap .gnb_text {box-sizing:border-box; float: left; width: 470px; height: 100%; padding:30px 70px; background: #f5f5f5; text-align: left;}
.snb_wrap .gnb_text h2{margin-bottom:10px; color:#6e3e30; font-size:25px; font-weight:500}
.snb_wrap .gnb_text b{display:block; font-size:18px; margin-bottom:10px; font-weight:500; color:#111;}
.snb_wrap .gnb_text p{line-height:1.8; font-size:15px; word-break:keep-all;}
.snb_wrap .sub_menu{box-sizing: border-box; float: left;width: auto;height: 100%;padding-top: 40px;padding-left: 70px;}
.snb_wrap .sub_menu li{display:flex; gap:5px 20px;}
.snb_wrap .sub_menu li a{flex:none;}
.snb_wrap .gnb_img{float: right;width:400px; height: 100%; background-position:50% 50%; background-size:cover;}
.snb_wrap.active .sub_menu{/* display:block; */}
.snb_wrap.active{display: block;}
.sub_menu_depth03{flex:auto; display:flex; flex-wrap:wrap; align-items:center; gap:5px 20px;}

#area_menu.active{visibility:visible; opacity:1; -webkit-transform: translateX(0); transform: translateX(0); width:100%; transition:all 1s ease;}
#area_menu{visibility:hidden; opacity:0; position:fixed; top:0; right:0; bottom:0; width:0; height:100%; background: #f5f1ee url(../../images/main/mark_w.svg) no-repeat bottom right; background-size: 300px; text-align:left; z-index:900; -webkit-transform: translateX(100%); transform: translateX(100%); transition:all 1s ease; overflow: hidden;}
#area_menu .inr{margin:0 auto;}

#area_menu #menu_wrap{position: absolute; top: 50%; width: 50%; right:0; transform: translateY(-50%)}
#area_menu #menu_wrap .list{position: relative; margin: 0 auto;}
#area_menu #menu_wrap .list > li{position: relative; box-sizing:border-box; color: #fff;}
#area_menu #menu_wrap .list{padding-right: 5%;}
#area_menu #menu_wrap .list > li{position:relative; display: flex; justify-content: flex-start; align-items: flex-start; position: relative;  text-align: left; margin:20px 0}
#area_menu.active #menu_wrap .list > li:hover > ul{display:block;}

#area_menu #menu_wrap .list > li > a{display:block; font-size:28px; letter-spacing:-1px;color: #222; word-break:keep-all; transition:all 0.3s ease; opacity:0;font-weight: 500;}
#area_menu.active #menu_wrap .list > li > a{opacity:1;}
#area_menu #menu_wrap .list > li:last-child{margin:0;}
#area_menu #menu_wrap .list > li:hover > a{color:#7f5d41;}
#area_menu #menu_wrap .list > li .sub_menu{display:block; opacity:0;}
#area_menu.active #menu_wrap .list > li .sub_menu{z-index: 30; display:none; opacity:1; position:absolute; left:0; top:10px; left: 240px; width:65%}
#area_menu #menu_wrap .list > li .sub_menu > li{}
#area_menu #menu_wrap .list > li .sub_menu > li > a{position:relative; display:block; margin-bottom:20px; padding-left:15px; font-size:16px; font-weight:400; line-height:1em; color:#333; transition:all 0.3s ease;}
#area_menu #menu_wrap .list > li .sub_menu > li > a:hover{color:#7f5d41;}
#area_menu .img{position:absolute; top:0; left:0; width:45%; height:100%; background:url(../../images/main/img_allmenubg.jpg) no-repeat; background-size:cover; background-position:50%}
#area_menu #menu_wrap .group-depth03 .box{padding-left:15px;}
#area_menu #menu_wrap .list > li .sub_menu.group-depth03 > li > a{margin-bottom:10px; font-weight:500;}
#area_menu #menu_wrap .list > li .sub_menu.group-depth03 > li .box{margin-bottom:20px;}
#area_menu #menu_wrap .list > li .sub_menu.group-depth03 > li .box a{font-size:14px; color:#555;}

.btn_all_menu{position:absolute; right:0; top:0; width:60px; height:60px; background:#4e403c; cursor:pointer;  display:inline-block;}
.btn_all_menu > em{display:inline-block; padding:0 28px 0 0; font-size:12px; font-weight:500; color:#fff;}
.btn_all_menu > span{display:block; position:absolute; left:17px; width:25px; height:1px; background:#fff;}
.btn_all_menu > span:nth-of-type(1){top: 20px;}
.btn_all_menu > span:nth-of-type(2){top: 29px;}
.btn_all_menu > span:nth-of-type(3){top:38px;}
.btn_all_menu > span:nth-of-type(1),
.btn_all_menu > span:nth-of-type(2){transition:all 0.3s ease; transition-property:top, transform; transition-delay:0.3s, 0s;}

.btn_all_menu.active{z-index:999; background:none;}
.btn_all_menu.active > span:nth-of-type(1){top:8px; transform:rotate(45deg);-webkit-transform:rotate(45deg); background:#111}
.btn_all_menu.active > span:nth-of-type(2){top:8px; transform:rotate(-45deg);-webkit-transform:rotate(-45deg); background:#111}
.btn_all_menu.active > span:nth-of-type(3){opacity:0; transition:0.3s}

/* mobile-menu */
.mobile_header{background:#008790; color:#333; text-align:center; padding:35px 0 10px 0;}
.btn_menu{position:absolute; z-index:90; width:20px; height:14px; right:10px; top: 50%; transform: translateY(-50%);}
.btn_menu{display:none;}
.btn_menu span{display:block; width:20px; height:1px; background:#745522; text-align:center;}
.btn_menu span:nth-child(1){margin-top:0;}
.btn_menu span:nth-child(2){margin-top:5px;}
.btn_menu span:nth-child(3){/* margin-top:5px; */}

.m_area_util{display:none;}

/* footer */
#footer{position:relative; z-index:1; padding:50px 0; background:#111;}
#footer > .wrapper{position:relative; display:flex; align-items: center;}
#footer h1{margin-right:50px;}
#footer h1 img{height:70px;}

#footer .menu li{display:inline-block;}
#footer .menu li a{display:block; padding:0 12px; color:#fff; font-size:15px;}
#footer .menu li:last-child a{padding-right:0}
#footer .menu{overflow:hidden; margin-bottom:10px; padding-top:10px;}

#footer .info li{float:left; margin-right:15px; margin-bottom:9px; font-size:15px; color:#8b8a8b}
#footer .info li:first-child{width:100%}
#footer .info li:first-child b{display:block; width:100%; color:#fff;}
#footer .info{overflow:hidden;}
#footer .info li *{display:inline-block; color:#8b8a8b}
#footer .info li em{opacity:0.4; margin-right:4px; font-weight:bold;}
#footer .info li p{font-weight:300;}
#footer .info li:nth-child(3){clear:both;}
#footer .info li:nth-child(2)~li{}

#footer .cpright{position:absolute; right:0; text-align:right;}
#footer .cpright span{display:block; color:#555;}
#footer .cpright span a{color:#555;}
#footer .cpright span em{font-weight:bold;}
#footer .cpright{}

#footer .sns img{height:18px}
#footer .sns{}
#footer .sns li{display:inline-block; margin-left:18px; }
#footer .sns li a{display:flex; align-items: center; justify-content: center;}

@media all and (min-width:1279px){
	#header nav .gnb > li ul.sub_menu{ box-sizing: border-box; padding-top: 40px;padding-left: 70px; width:40%;}

	#header nav .gnb > li ul.sub_menu.active{display:block; transition-delay:0.1s;}
	#header nav .gnb > li.active .snb_wrap{opacity:1; visibility:visible; top:60px; z-index:10; transition-delay:0s, 0s, 0s;}
	#header nav .gnb > li ul.sub_menu > li > a{display:block; position:relative; padding:0px; background:#fff; font-size:16px; color:#333; text-align:left; transition:all 0.3s ease 0s;}
	#header nav .gnb > li ul.sub_menu > li > a:hover{color:#111;}
	#header nav .gnb > li ul.sub_menu > li:first-child > a{border-top-width:0px;}
	#header nav .gnb > li ul.sub_menu .box{flex:auto;}
	#header nav .gnb > li ul.sub_menu.group-depth03.active{display:flex;}
	#header nav .gnb .sub_menu_depth03 a{display:block; font-size:15px; color:#777;}
	#header nav .gnb .group-depth03{display:flex; flex-direction:column; gap:10px 0;}
	#header nav .gnb .group-depth03 > li > a{flex:none; width:15%;}


	a[data-link="call"]{cursor:auto; pointer-events:none;}
}



@media screen and (max-width:1919px){
 
}

@media screen and (max-width:1679px){
}

@media screen and (max-width:1535px){
	
	#header .header_bottom{width:98%;}

	.snb_wrap .gnb_img{width:300px;}
	.snb_wrap .gnb_text{padding:30px 40px;}
}

@media screen and (max-width:1420px){
	.area_recommend .btn,
	.area_signature .btn,
	.wrapper{width:96%;}
	
	#header .gnb{text-align:left;}
	.snb_wrap .gnb_text{width:33%; padding: 30px;}
	#header .gnb .sub_menu{width:33%; box-sizing:border-box;}

	.snb_wrap .inr{width:100%;}
	

}

@media screen and (max-width:1365px){
	#header .header_bottom{text-align:center;}
}

@media screen and (max-width:1279px){
	.wrap{width:96%;}

	body,
	p,
	li,
	a{font-size:15px;}

	#header nav .gnb > li{}
	#header nav .gnb > li > a{font-size:14px; margin:0;}
	#header .gnb .sub_menu li a{font-size:14px;}
	
	.snb_wrap:before,
	.snb_wrap:after{display:none;}
	
	#header .btn_menu,
	#header .btn_close{display:block;}
	
	#header .header_top{height:60px;}
	#header h1 img{height:35px;}
	#header .area_util{position:absolute; opacity:0; visibility:hidden; top:50px; left:40px; z-index:999; margin-top:0; transition:all 0.1s ease;}	

	body.active #header .area_util ul{display:flex;}
	body.active #header .area_util ul li{position:relative; padding-left:0; margin-right:15px; padding-right:15px;}
	body.active #header .area_util ul li a{color:#fff;}
	body.active #header .area_util ul li:before{content:''; position:absolute; display:block; left:-15px; margin-top:-1.5px; top:50%; width:3px; height:3px; background:#aaa; border-radius:50%}
	body.active #header .area_util ul li:first-child:before{display:none;}

	.snb_wrap{opacity:1; display:block; position: static; height:auto; visibility: inherit; background:none}
	.snb_wrap .inr{width:100%; height:auto;}
	.snb_wrap .gnb_img{display:none;}
	.snb_wrap .sub_menu{float:none; width:100%; padding:15px 25px; }
	.snb_wrap .sub_menu li{margin:0 0}
	.snb_wrap .gnb_text{display:none;}

	#header .header_bottom{height:0;}
	.btn_all_menu{display:none;}
	#header .nav_wrap {box-sizing: border-box; overflow-y:scroll; position:fixed; top:0px; right:-100%; z-index:998; width:80%; height:100%; padding: 30px 40px; margin:0; background:#202020;}
	#header .nav_wrap.active{right:0px; box-shadow:-5px 0px 15px rgba(0,0,0,0.1); transition:all 0.5s ease-out 0s;}

	#header nav {box-sizing: border-box; overflow-y:scroll; position:fixed; top:0px; right:-100%; z-index:998; width:100%; height:100%; padding: 30px 40px; margin:0; background:#202020;}
	#header nav.active{right:0px; box-shadow:-5px 0px 15px rgba(0,0,0,0.1); transition:all 0.5s ease-out 0s;}

	#header nav .gnb > li{float:none; display:block; width:100%;}
	#header nav .gnb{width:100%; margin-top:70px; overflow-y:auto;  box-sizing: border-box;}
	#header nav .gnb > li{padding:0;}
	#header nav .gnb > li > a{position:relative; line-height:1; display:block; padding:17px 0; font-size:18px; color:#fff; text-align:left; transition:all 0.3s ease 0s;}
	#header nav .gnb > li > a:before,
	#header nav .gnb > li > a:after{content:''; display:block; position:absolute;top: 19px; width:6px; height:1px; background:#999; transition:all 0.3s ease 0s;}
	#header nav .gnb > li > a:before{top: 11px; right:20px; transform:translateY(8px) translateX(-7px) rotate(45deg);}
	#header nav .gnb > li > a:after{right:23px; transform:translateY(0px) translateX(0px) rotate(-45deg);}
	#header nav .gnb > li > a.active:before{transform:translateY(8px) translateX(-7px) rotate(-45deg);}
	#header nav .gnb > li > a.active:after{transform:translateY(0px) translateX(0px) rotate(45deg);}

	#header nav .gnb > li:after{display:none;}

	#header nav .gnb > li ul.sub_menu{display:none;padding: 8px 0; background:none}
	#header nav .gnb > li ul > li > a{display:block;padding: 2px 0; text-align:left; color:#999}
	#header nav .gnb > li ul li.active a{}
	#header .gnb .sub_menu{width:100%; height:auto;}
	#header .gnb .sub_menu.v1 li{float:none; width:100%; text-align:left;}
	#header nav .gnb > li:hover > a{color:#fff;}
	#header nav .gnb .group-depth03 > li{display:block;}
	#header nav .gnb .group-depth03 > li > a{color:#c1c1c1; font-weight:500;}
	#header nav .gnb .group-depth03 > li .box{border-bottom:1px solid rgba(255,255,255,0.1); margin-bottom:10px; padding-bottom:10px;}
	#header nav .gnb .sub_menu_depth03{display:flex !important; flex-wrap:wrap; gap:3px 10px;}
	#header nav .gnb .sub_menu_depth03 li{flex:0 1 calc((100% / 3) - 10px);}
	#header nav .gnb .sub_menu_depth03 li a{flex:auto; line-height:1.2;}

	body.active #header .area_util{opacity:1; visibility:visible;transition: all 0.3s ease 0.1s;}

	#footer .cpright{position:static;}
	#footer > .wrapper{}

}

@media all and (min-width:1024px){
	
	a[data-link="call"]{cursor:auto; pointer-events:none;}
	

}

@media all and (max-width:1023px){
	.wrapper {width: 90%;}
}


@media all and (max-width:767px){
	.wrap{width:90%;}

	body,
	p,
	li,
	a{font-size:14px;}
	
	#header nav{width:100%;}
	#header nav .gnb > li > a{padding: 11px 0; font-size:15px;}
	#header nav .gnb > li > a.active{font-weight:700;}
	
	#header{position:fixed;width: 100%; background: #fff;}
	#header .header_top{border-bottom:0}
	.m_call{display:block; top:10px;}

	#footer{}
	#footer h1{margin-right:0; text-align:center;}
	#footer h1 img{height:50px;}
	#footer .info{margin-top:15px; text-align: center;}
	#footer .info li{float:none; display:inline-block; margin:0 5px; font-size: 14px;}
	#footer .info li:first-child{display:none;}
	#footer .menu{padding-top:5px;}
	#footer .menu li a{padding:5px 8px; font-size:12px;}
	#footer div:last-child span{padding:14px 0; font-size:12px;}
	#footer ul:last-child{padding-bottom:10px;}
	#footer ul:last-child li{margin:0 0 8px;width: 100%;}
	#footer ul:last-child li em{display:block; margin:0 0 3px;}
	#footer ul:last-child li:nth-child(4){float:left; width:100%; clear:none;}	
	#footer .cpright{margin-top:15px; text-align:center;}

	#footer > .wrapper{display:block;}

	.quick{opacity:1; visibility: visible; box-sizing: border-box; width:100%; bottom:0; top:auto; right:0; padding-bottom:0; border:0;border-top:1px solid #ddd; }
	.quick ul{display:flex;}
	.quick ul li{width:50%; border-bottom:0}
	.quick ul li{border-right:1px solid #ddd;}
	.quick ul li a{padding:10px;}
	.quick ul li:nth-child(3){display:none;}
	.quick ul li p{display:none;}
	.quick img{width:25px;}

}

@media screen and (max-width:620px){
	#header nav .gnb .sub_menu_depth03 li{flex:0 1 calc((100% / 2) - 10px);}
}

@media all and (max-width:375px){
	body,
	p,
	li,
	a{font-size:13px;}

	#header .nav_wrap.active{width:100%;}
	#header nav{width:100%;}

}

@media all and (max-width:359px){

}