@charset "utf-8";

body {}
.container {width: 100%; max-width: 1400px; margin: 0 auto;}
.container .contents{padding-bottom:140px;}
@media all and (max-width: 1400px) {
  .container {padding: 0 20px;}
}
@media all and (max-width: 760px) {
  .container {padding: 0 45px;}
  .container .contents{padding-bottom:70px;}
}
@media all and (max-width: 500px) {
  .container {padding: 0 25px;}
}

.main #_contentBuilder,
.wrap-sub-visual{margin-top:130px;}
@media all and (max-width: 1400px) {
  .main #_contentBuilder,
  .wrap-sub-visual{margin-top:111px;}
}
@media all and (max-width: 500px) {
  .main #_contentBuilder,
  .wrap-sub-visual{margin-top:96px;}
}

.wrap-fix {position: fixed; top: 0; left: 0; z-index: 200; width: 100%;}

.wrap-top {overflow: hidden; width: 100%; background: #1e2e55; border-bottom: 1px solid #1e2e55; font-size: 0;}
.wrap-top .top-pop {float: left; margin-left: 30px;}
.wrap-top .top-pop ul {display: inline-block;}
.wrap-top .top-pop li {float: left;}
.wrap-top .top-pop a,
.wrap-top .top-pop button {display: block; width: 120px; background: #005ead url('/images/knou/common/arrow-top-pop.png') no-repeat right center; margin-right: 1px; padding-left: 20px; text-align: left; font-size: 16px; color: #fff; line-height: 42px; transition: .4s}
.wrap-top .top-pop button:hover {background-color: #2872e1 !important;}
.wrap-top .top-pop button.arrow-reverse {background: #005ead url('/images/knou/common/arrow-top-pop-reverse.png') no-repeat right center;}
/*JHPARK추가*/
.wrap-top .top-pop a{background:#3992de;width:165px;}
.wrap-top .top-pop a:hover,
.wrap-top .top-pop button:hover {background-color: #2872e1;}
.wrap-top .top-util {float: right; margin-right: 30px;}
.wrap-top .top-util > ul {display: inline-block;}
.wrap-top .top-util > ul > li {float: left;}
.wrap-top .top-info {position: relative; margin-right: 14px; font-size: 16px; font-family: 'Noto DemiLight'; color: #fff;}
.wrap-top .top-info a {position: relative; margin-right: 15px; line-height: 42px; color: rgba(255,255,255,.8);}
.wrap-top .top-info a:hover {color: #fff;}
.wrap-top .top-info a:after {content: ''; position: absolute; left: 0; bottom: -2px; width: 0px; height: 1px; background: #fff; transition: .4s}
.wrap-top .top-info a:hover:after {width: 100%;}
.wrap-top .top-info a:before {content: ''; position: absolute; right: -15px; top: 6px; width: 1px; height: 15px; background: rgba(255,255,255,.3);}
.wrap-top .top-global a {display: block; background: url('/images/knou/common/icon-top-global.png') no-repeat left center; padding-left: 34px;  font-family: 'Mont SemiBold'; font-size: 15px; line-height: 42px; color: #ffb400;}
.wrap-top .top-global span {position: relative;}
.wrap-top .top-global span:after {content: ''; position: absolute; left: 0; bottom: -3px; width: 0; height: 1px; background: #ffb400; transition: .4s}
.wrap-top .top-global a:hover span:after {width: 100%;}
.wrap-top .top-zoom button {display: inline-block; font-size: 14px; color: #fff; line-height: 42px; vertical-align: middle;}
.wrap-top .top-zoom .plus {width: 12px; height: 12px; background: url('/images/knou/common/ico-zoom.png') no-repeat top center; text-indent: -99999px;}
.wrap-top .top-zoom .minus {width: 12px; height: 12px; background: url('/images/knou/common/ico-zoom.png') no-repeat bottom center; text-indent: -99999px;}
.wrap-top .top-zoom .default {margin: 0 9px;}

@media all and (max-width: 760px) {
  .wrap-top .top-util {margin-right: 25px;}
  .wrap-top .top-util .top-zoom {display: none;}
  .wrap-top .top-global:after {display: none;}
  .wrap-top .top-global {margin-right: 0;}
  .wrap-top .top-global a {margin-right: 0;}
}

@media all and (max-width: 501px) {
  .wrap-top .top-util {margin-right: 15px;}
  .wrap-top .top-info {margin-right: 15px;}
  .wrap-top .top-info a {margin-right: 15px; font-size: 16px; line-height: 35px;}
  .wrap-top .top-info:after {top: 10px;}
  .wrap-top .top-global a {padding-left: 35px; font-size: 15px; line-height: 35px; }
  .wrap-top .top-pop {margin-left: 0;}
  .wrap-top .top-pop button{width: 100px; padding-left: 20px; background: #005ead url(/images/knou/common/arrow-top-pop-resize.png) no-repeat right center; font-size: 14px; line-height: 35px;}
  .wrap-top .top-pop a { font-size: 14px; line-height: 35px; width: 155px;}
  .wrap-top .top-zoom button {line-height: 35px;}
}

.wrap-sub-navi .sub-navi .navUl.on {z-index:1;}
