@charset "utf-8";

/* 4K 대응 */
@media screen and (min-width: 2000px) {
  html, body {font-size: .5vw !important;}
}

/* 공통 */
.area {position: relative; width: 100%;}

/* 헤더 */
.wrap-header {overflow: auto; position: fixed; left: 0; top: 0; z-index: 100; width: 20rem; height: 100%; padding: 1.2rem; background: #222435;}

.wrap-header .menu .li_1 {padding: 1rem;}
.wrap-header .menu .a_1 {font-family: ppb; font-size: 1.8rem; 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: -.5rem; 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: 1rem;}
.wrap-header .menu .li_2 {position: relative; padding: .2rem 1.5rem;}
.wrap-header .menu .li_2::after {content: ''; position: absolute; left: 0px; top: 1.1rem; width: .5rem; height: .2rem; 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: 1.5rem; 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: -.2rem; width: 0; height: 1px; background: #57ffbb; transition: width .5s;}
.wrap-header .menu .a_2:hover span::before {width: 100%;}

/*.wrap-contents {padding-left: 23rem; padding-right: 2rem; padding-top: 4rem; padding-bottom: 8rem}*/
.wrap-contents {padding-left: 20rem; padding-right: 0; padding-top: 4rem; padding-bottom: 8rem}
.wrap-contents .page-title {display: block; padding: 2rem 0; margin-bottom: 3rem; font-family: ppb; font-size: 3rem; border-bottom: 1px solid #d1d1d1;}

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

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

@media (max-width: 1500px) {
  .sub #_contentBuilder ._objTag,
  .sub #_contentBuilder ._objHtml,
  .sub #_contentBuilder ._objImage,
  .sub #_contentBuilder ._objWidget,
  .sub #_contentBuilder ._objHeading {padding: 0 2rem;}
}

@media (max-width: 1100px) {
  .sub #_contentBuilder ._objTag,
  .sub #_contentBuilder ._objHtml,
  .sub #_contentBuilder ._objImage,
  .sub #_contentBuilder ._objWidget,
  .sub #_contentBuilder ._objHeading {padding: 0 4rem;}
}

@media (max-width: 800px) {
  .sub #_contentBuilder ._objTag,
  .sub #_contentBuilder ._objHtml,
  .sub #_contentBuilder ._objImage,
  .sub #_contentBuilder ._objWidget,
  .sub #_contentBuilder ._objHeading {padding: 0 2rem;}
}

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

.main .objHeading_h2  {margin-left: 0;}

._contentBuilder {overflow:visible !important;}