@charset "utf-8";

/* 공통 */
.area {position: relative; width: 100%; max-width: 1500px; margin: 0 auto;}

/* 헤더 */
.wrap-header {overflow: auto; position: fixed; left: 0; top: 0; z-index: 100; width: 200px; height: 100%; padding: 12px; background: #222435;}
._contentBuilder {overflow: visible !important;}

.wrap-header .menu .li_1 {padding: 10px;}
.wrap-header .menu .a_1 {font-family: ppb; font-size: 18px; text-align: left; color: #fff;}
.wrap-header .menu .a_1._active,
.wrap-header .menu .a_1:hover {color: #57ffbb;}
.wrap-header .menu .a_1 span {position: relative;}
.wrap-header .menu .a_1 span::before {content: ''; position: absolute; left: 0; bottom: -5px; width: 0; height: 1px; background: #57ffbb; transition: width .5s;}
.wrap-header .menu .a_1:hover span::before {width: 100%;}

.wrap-header .menu .ul_2 {margin-top: 10px;}
.wrap-header .menu .li_2 {position: relative; padding: 2px 15px;}
.wrap-header .menu .li_2::after {content: ''; position: absolute; left: 0px; top: 1.5rem; width: 5px; height: 2px; background: rgba(255,255,255,.5);}
.wrap-header .menu .li_2._active::after,
.wrap-header .menu .li_2:hover::after {background: #57ffbb;}
.wrap-header .menu .a_2 {font-family: ppm; font-size: 15px; text-align: left; color: rgba(255,255,255,.5);}
.wrap-header .menu .a_2._active,
.wrap-header .menu .a_2:hover {color: #57ffbb;}
.wrap-header .menu .a_2 span {position: relative;}
.wrap-header .menu .a_2 span::before {content: ''; position: absolute; left: 0; bottom: 2px; width: 0; height: 1px; background: #57ffbb; transition: width .5s;}
.wrap-header .menu .a_2:hover span::before {width: 100%;}

.wrap-contents {padding-left: 230px; padding-right: 20px; padding-bottom: 80px}
.wrap-contents .page-title {display: block; padding: 20px 0; margin-bottom: 40px; font-family: ppb; font-size: 30px; border-bottom: 1px solid #d1d1d1;}

/* 푸터 */
.wrap-footer {display: none; padding: 20px; border-top: 1px solid #d1d1d1; font-family: ppm; font-size: 15px; text-align: center;}

/* 서브 컨텐츠 리셋 */
.sub #_contentBuilder ._objTag,
.sub #_contentBuilder ._objHtml,
.sub #_contentBuilder ._objImage,
.sub #_contentBuilder ._objWidget,
.sub #_contentBuilder ._objHeading {max-width: 1500px; margin-left: auto !important; margin-right: auto !important; height: auto !important; min-height: 25px !important; z-index: auto !important;}
.sub #_contentBuilder ._objHeading {width: 100% !important;}
.sub #_contentBuilder .full-width {max-width: none;}

@media screen and (max-width: 1900px) {
	.wrap-header {display: none;}
	.wrap-contents {padding-left: 20px;}
}