@charset "utf-8";

.header-action,
.header-menu { display:none; }

#top { position:relative; border-bottom:1px solid #ddd; }
#top .inner { position:relative; }

/* 하단 */
#bottom .link-site,
#bottom .f-link,
#bottom .f-menu { display:none !important; }

#bottom .f-btm { justify-content:end; }

/* 탑 */
.head-brand { width:100%; display:flex; justify-content:space-between; padding:1rem 0; }
.btn-navi { display:inline-flex; align-items:center; min-height:2.5rem; padding:.25rem .75rem 0; background:transparent; border-radius:.6rem; font-size:1.0625rem; font-weight:700; color:#1e2124; transition:.4s; }
.btn-navi::before { display:flex; content:''; width:1.25rem; height:1.25rem; background:no-repeat center/cover;}
.btn-navi.all::before { background-image:url(/images/icon/ico_all.svg); }

@media (max-width: 1024px) {
	header { border-bottom:1px solid #CDD1D5; }
	.header-util { display:none; }
	.header-menu { display:block; }
	.header-menu .btn-navi.mobile { display:block; }
	.searchbox { display:none; }
	.header-menu > a.pc{display:none;}
}

/* 타이틀 */
#toparea .title { height:3.25rem; padding:0 0 0 4rem; background:url(/images/inc/logo.png) no-repeat; background-size:auto 3.25rem; display:flex; flex-direction:column; word-break:keep-all; }
#toparea .title a { display:inline-flex; flex-direction:column; }
#toparea .title span { position:relative; top:-1px; font-size:1.25rem; line-height:1.5rem;}
#toparea .title strong{font-size:1.75rem;line-height:1.75rem;}


/* 메뉴 */
#menu { position:absolute; bottom:0; right:13%; max-width:calc(87.5rem - 16.25rem); width:100%; z-index:99; margin:0 auto; }
#topMenu { display:flex; justify-content:end; overflow:visible !important; }

#topMenu > li { position:relative; text-align:center; display:inline-block; }
#topMenu > li > a:link,
#topMenu > li > a:visited { position:relative; vertical-align:middle; padding:0 2.5rem; height:4.75rem; line-height:4.75rem; color:#111; font-size:1.5rem; font-weight:700; letter-spacing:-1px; word-break:keep-all; display:block; }
#topMenu > li > a:active,
#topMenu > li > a:focus,
#topMenu > li > a:hover,
#topMenu > li > a.select { color:#284394; }

#topMenu > li > a:link::before,
#topMenu > li > a:visited::before { position:absolute; left:50%; bottom:0; content:''; width:0; border-bottom:3px solid #284394; text-align:center; transition:0.3s; transform:translate(-50%, 0); display:block; z-index:100; }
#topMenu > li > a:active::before,
#topMenu > li > a:focus::before,
#topMenu > li > a:hover::before { width:100%; }

#topMenu > li > a:link > ul::before,
#topMenu > li > a:visited > ul::before { position:absolute; left:50%; bottom:0; content:''; width:0; border-bottom:3px solid #284394; text-align:center; transition:0.3s; transform:translate(-50%, 0); display:block; z-index:100; }
#topMenu > li > a:active > ul::before,
#topMenu > li > a:focus > ul::before,
#topMenu > li > a:hover > ul::before { width:100%; }

.menubox{display:none;}
@media (max-width:1440px){
	#menu { right:0; }
}

@media (max-width:1170px){
	#menu { right:0; top:4rem; }
}

@media (min-width:1025px) and (max-width:1280px){
	#topMenu > li > a:link,
	#topMenu > li > a:visited { font-size:1.25rem; }
}

@media (max-width:1024px){
	#menu { display:none; }
}



/* 서브 레이아웃 */
#container.sub > .inner { display:flex; justify-content:space-between; flex-wrap:wrap; margin-top:2rem;  }
#sLeft { width:18.75rem; margin-bottom:1rem;  }
#sRight { width:calc(100% - 18.75rem - 3.75rem); margin-bottom:6.25rem; }

@media (max-width: 1024px) {
	#sLeft { width:100%; margin-bottom:1rem;  }
	#sRight { width:100%; }
	
}


/* 서브 비주얼 */
.svisible * { box-sizing: border-box; }
.svisible { position: relative; max-width: 100%; width: 100%; padding:0; background:none; }
.svisible .pic { position: relative; border-radius: 12px; overflow: hidden; margin-bottom: 16px; }
.svisible .pic1 { position: relative; padding-top:125%; }
.svisible .pic img { position: absolute; top:0; right:-80px; height:100%; object-fit:cover; }
.svisible .pic2 { display:none; }

.svisible .name-box { position: absolute; bottom: 0; left:0; width:100%; padding:64px 24px 24px; word-break:keep-all; background: linear-gradient(rgba(41, 40, 40, 0), rgb(26, 25, 25)); color:#fff; line-height: 1; }
.svisible .name-box .txt { font-size:125%; margin-bottom: 8px; }
.svisible .name-box .name { font-size:175%; font-weight: 700; }

.svisible .info-list { padding:24px; background: linear-gradient(rgba(0,0,0,.0),rgba(0,0,0,.05)); border-radius:12px; border:1px solid #ddd; }
.svisible .info-list span { display: inline-block; width:68px; text-align: justify; text-align-last: justify; text-justify: inter-character; }

@media (max-width:1024px){
	.svisible { display: flex; align-items: start; }
	.svisible .pic { max-width: 160px; width:100%; margin-right: 16px; }
	.svisible .pic1 { width:100%; }
	.svisible .pic img { right:-45px; }
	.svisible .info-list { display: block; width:100%; }
	.svisible .name-box  {padding: 48px 16px 16px;}
	.svisible .name-box .txt { font-size: 100%; }
	.svisible .name-box .name { font-size:150%; }

}
@media (max-width:768px){
	.svisible { flex-direction: column; align-items: center; }

}








/* leftMenu */
.leftMenu { width:100%; margin-top:2.5rem; }
.leftMenu ul { display:flex; flex-direction:column; }

.leftMenu .depth2 > li {}
.leftMenu .depth2 > li > a.on { color:#398D7D; font-weight:700; }
.leftMenu .depth2 > li > a.on::before { width:100%; }

.leftMenu .depth2 > li > a { position:relative; display:flex; justify-content:space-between; align-items:center; width:100%; padding:1rem 1.6rem; font-size:1.125rem; border-bottom:.1rem solid #CDD1D5; transition:.4s ease-in; text-align: center; }
.leftMenu .depth2 > li > a::before { position:absolute; left:0; bottom:-.1rem; content:''; width:0; height:.2rem; background:#398D7D; transition:.4s ease-in; }


.leftMenu .depth2 > li > a:hover { background:#F6ECF0; }
.leftMenu .depth2 > li > a:focus { background:#EFDCE4; }
.leftMenu .depth2 > li > a:hover::before,
.leftMenu .depth2 > li > a:active::before { width:100%; }


.leftMenu .depth2 .on > a { color:#398D7D; font-weight:700; }
.leftMenu .depth2 .on > a::before { width:100%; }
.leftMenu .depth2 .on .depth3 { display:block; }

@media (max-width: 1024px) {
	.leftMenu ul { flex-direction:row; }
	.mbr-lnb .leftMenu > ul > li.on { width:100%; }
	.leftMenu .depth2 > li > a { min-height:4rem; }
}




/* 페이지 타이틀 및 패스 */
.sub .page-title,
.sub .sns-list { position:relative; display:flex; }

.sub .page-title { position:relative; align-items:flex-end; justify-content:space-between; padding:0.5rem 0 0.5rem; margin-bottom:2.5rem; }
.sub .page-title::after { position:absolute; left:0; bottom:0; content:''; width:100%; height:.25rem; background:url(/namgucl/wsvr/img/inc/line.png) repeat-x; opacity:.7; }
.sub .page-title h2 { color:#222325; font-size:2.25rem; font-weight:700; margin-bottom:0.25rem !important; }

.sub .path { display:flex; align-items:center; padding-left:0.125rem; color:#777; }
.sub .path span { display:flex; font-size:0; width:1rem; height:1rem; background:url(/namgucl/wsvr/img/icon/ico_angle.svg) no-repeat center/contain; transform:rotate(-90deg); margin:.5rem; }

@media (max-width: 1023px) {
	
}

@media (max-width: 768px) {
	
}