@charset "utf-8";

#wrapper:before{content:'';display:block;position:absolute;width:100%;height:320px;background:url(/nanum/site/builder/skin/main/img/common/svisual1.jpg) no-repeat top center / cover;z-index: -1;}

/* 서브레이아웃공통 */
#container .wsize{display:flex;gap:60px;}
#sidebar{flex-shrink: 0;width:255px;}
#sidebar h2.stit{margin-bottom:30px;display: flex;justify-content: center;align-items: center;height:190px;font-family: 'Elice DX Neolli';font-size:2.7rem;font-weight:700;color:#fff;background: linear-gradient(145deg, #0aecf6, #002eaf);border-radius:15px;}

#sidemenu{margin:25px 0;}
#sidemenu > ul > li{margin-top:-1px;border:1px solid #dadada;border-left:1px solid #fff;border-right:1px solid #fff;}
#sidemenu > ul > li.on{position:relative;border-color:#000;z-index:2;}
#sidemenu > ul > li.on{border:2px solid #1c80d9}
#sidemenu > ul > li > a{padding:15px 25px;display:block;font-weight:500;font-size:1.7rem;line-height:25px;color:#555;}
#sidemenu > ul > li.on > a{display:flex;align-items: center;justify-content: space-between;gap:15px;font-weight:700;color:#000;}
#sidemenu > ul > li.on > a{color:#1c80d9;}
#sidemenu > ul > li.on > a:after{content:'';flex-shrink: 0;display:block;width:7px;height:7px;background:#005aab;border-radius:50%;}
#sidemenu > ul > li div{display:none;padding:23px 29px;background:#f5f5f5;border-top:1px dashed #ccc;}
#sidemenu > ul > li.on div{display:block}
#sidemenu > ul > li div ul{border-bottom:0 none;}
#sidemenu > ul > li div ul li{border:0 none;}
#sidemenu > ul > li div ul li:first-child a{margin-top:0;}
#sidemenu > ul > li div ul li a{display:block;margin-top:15px;font-size:1.4rem;font-weight:500;color:#444;}
#sidemenu > ul > li div ul li.on a{font-weight:700;color:#000;text-decoration:underline;}

#contents{width:100%;}
#cont_head{position:relative;display: flex;flex-direction: column-reverse;justify-content: center;margin-bottom:30px;height:190px;color:#fff;}
#cont_head h3{margin-top:15px;font-family: 'Elice DX Neolli';font-size:3.8rem;font-weight:700;}

#location{position:absolute;top:25px;}
#location,
#location li{display:flex;gap:15px;align-items: center;font-size:1.5rem;font-weight:500;}
#location li{opacity:0.7;}
#location li:not(:first-child):before{content:'';display:block;width:8px;height:2px;background:#fff;}
#location li.home{background:url(/nanum/site/builder/skin/main/img/common/icon_home.png) no-repeat center;text-indent: -9999px;opacity:1}
#location li.home a{display:block;width:18px;}
#location li.now{font-weight:700;opacity:1}


#cont_wrap{min-height:600px}

/********************태블릿********************/
@media all and (max-width:1400px){

#container #sidebar{width:230px;}

}

/********************태블릿********************/
@media all and (max-width:1024px){

#head{background:#fff;}
#head .logo a::before{background-image: url(/data/builder/logo_on.png) !important;}

#wrapper:before{display:none;}	
	
#sidebar{position:fixed;top:60px;left:0;width:100% !important;height:50px;background: linear-gradient(145deg, #002eaf, #0ad3dc);z-index:100;}
#sidebar .stit{display:none !important;}

#sidemenu{margin:0;}
#sidemenu > .tit > a{display:block;padding:0 40px 0 15px;box-sizing:border-box;font-size:1.7rem;line-height:50px;font-weight:600;color:#fff;}
#sidemenu > .tit > a::after{content:'';position:absolute;top:50%;right:15px !important;width:16px;height:16px;margin-top:-8px;background:url(/nanum/site/builder/skin/main/img/common/icon_sidemenu.png) no-repeat;background-size:cover;}
#sidemenu > ul{display:none;position:absolute;top:50px;left:0;width:100%;border:0;background:#fff;box-shadow:5px 5px 20px rgba(0,0,0,0.1);box-sizing:border-box;z-index:20;}
#sidemenu > ul > li > a{padding:1.5vh 15px !important;}
#sidemenu > ul > li.on > a{background-position:right 15px top 50%;}
#sidemenu > ul > li > a::after{right:15px !important;}


	
/* 중간영역 */
#container{margin:110px 0 50px;}
#container .wsize{display:block;padding:0;}
#contents{width:100vw !important;min-height:100vh;padding:0 15px;box-sizing:border-box;}

/* 컨텐츠상단영역 */
#cont_head{display:none !important;}
#cont_wrap{width:100% !important;padding:30px 0;}
	
}

/********************모바일********************/
@media all and (max-width:767px){
	
#location{display:none;}
	
}

/********************웹********************/
@media all and (min-width:1025px) {
	
#sidebar .tit{display:none;}
#sidemenu > ul{display:block !important;}

}
