/*=================
  Çì´õ
=================*/
#header {z-index: 9999;}
#header .pcHeader {background: #fff;}
#header .pcHeader::before {content: ''; display: block; position: absolute; width: 100%; height: 1px; background: #e0e0e0; bottom: 0;}
#header .pcHeader .inner {max-width: 172rem; justify-content: space-between; align-items: center; z-index: 1}
#header .pcHeader .logo {width: 27.8rem}
#header .pcHeader .logo a {}
#header .pcHeader .gnb {}
#header .pcHeader .gnb .gnbLst {width: 16rem; transition: 0.4s;}
#header .pcHeader .gnb .gnbLst .gtit {font-size: 2rem; font-weight: 500; display: block; text-align: center; padding: 2.7rem 0; transition: 0.1s;}
#header .pcHeader .lnb {padding: 2rem 0; width: 100%; height: 43rem; background: #fff; display: none;}
#header .pcHeader .lnb::before {content: ''; display: block; position: absolute; width: 0; height: 0.2rem; background: #005596; left: 50%; transform: translateX(-50%); top: 0; transition: 0.4s;}
#header .pcHeader .lnb .lnbLst {}
#header .pcHeader .lnb .lnbLst a {font-size: 1.8rem; display: block; padding: 1rem 0; text-align: center; transition: 0.1s; line-height: 1.5}
#header .pcHeader .lnb .lnbLst a:hover {color: #005596; font-weight: bold;}
#header .pcHeader .util {gap: 0.5rem;}
#header .pcHeader .util .btn {border-radius: 0.2rem; font-size: 1.6rem; line-height: 1;}
#header .pcHeader .util .linkBtn {padding: 0.6rem 1rem; gap: 0.8rem; background: #333; color: #fff; border: 1px solid #333;}
#header .pcHeader .util .langBtn {padding: 0.6rem 0.9rem; color: #333; border: 1px solid #333;}
#header .pcHeader .util .langBtn.on {color: #fff; background: #005596; border: 1px solid #005596;}
#header .pcHeader .lnbBg {height: 43rem; position: absolute; background: #fff; width: 100%; display: none; box-shadow: 0 0.4rem 1rem rgba(0,0,0,0.15);}
#header .pcHeader .lnbBg img {position: absolute; bottom: 0; right: 0; opacity: 0.1;}

#header .pcHeader .gnb.act .gnbLst {width: 19rem}

#header .pcHeader .gnb .gnbLst.on {width: 19rem;}
#header .pcHeader .gnb .gnbLst.on .gtit {font-weight: bold; color: #005596 !important;}
#header .pcHeader .gnb .gnbLst.on .lnb {background: #F9F9F9;}
#header .pcHeader .gnb .gnbLst.on .lnb::before {width: 100%}

#header .pcHeader .gnb .gnbLst.cur .gtit {font-weight: bold; color: #005596 !important;}

#header.on {}
#header.on .pcHeader {background: transparent;}
#header.on .pcHeader::before {background: rgba(255,255,255,0.2);}
#header.on .pcHeader .logo {filter: grayscale(1) brightness(100)}
#header.on .pcHeader .gnb .gnbLst .gtit {color: #fff;}
#header.on .pcHeader .util .langBtn {border: 1px solid #fff; color: #fff;}
#header.on .pcHeader .util .langBtn.on {border: 1px solid #005596;}

#header.act {}
#header.act .pcHeader {background: #fff;}
#header.act .pcHeader::before {background: #e0e0e0;}
#header.act .pcHeader .logo {filter: none;}
#header.act .pcHeader .gnb .gnbLst .gtit {color: #121212;}
#header.act .pcHeader .util .langBtn {border: 1px solid #333; color: #333;}
#header.act .pcHeader .util .langBtn.on {color: #fff}

@media all and (max-width: 880px){
    #header {}
    #header .moHeader {background: #fff;}
    #header .moHeader::before {content: ''; display: block; position: absolute; width: 100%; height: 1px; background: #e0e0e0; bottom: 0; z-index: 1;}
    #header .moHeader .moHead {padding: 2.2rem 0; justify-content: space-between; align-items: center; z-index: 1;}
    #header .moHeader .moHead .logo {}
    #header .moHeader .moHead .logo a {width: 33.8rem;}
    #header .moHeader .moHead .util {gap: 1rem;}
    #header .moHeader .moHead .util .linkBtn {padding: 1.4rem 1.5rem; gap: 0.8rem; background: #333; color: #fff; border: 1px solid #333; font-size: 2.2rem; line-height: 1; border-radius: 0.2rem;}
    #header .moHeader .moHead .util .linkBtn img {width: 1.2rem;}
    #header .moHeader .moHead .util .menuBtn {width: 5.5rem; height: 5.5rem; background: url('../img/ic_head_btn.svg') center/contain no-repeat; flex-shrink: 0;}

    #header .moHeader .moMenu {position: absolute; background: #fff; width: 100%; height: 100vh; top: 0; padding-top: 10rem; display: none;}
    #header .moHeader .langArea {padding: 2.95rem 0; max-width: var(--innerMo); margin: 0 auto; gap: 1rem;}
    #header .moHeader .langArea .langBtn {display: block; width: calc((100% - 1rem) / 2); border: 1px solid #555555; border-radius: 0.2rem; text-align: center; color: #555555; font-size: 2.2rem; padding: 1.5rem 0; line-height: 1;}
    #header .moHeader .langArea .langBtn.on {background: #005596; color: #fff; border: 1px solid #005596}
    #header .moHeader .menuArea {height: calc(100% - 11.3rem);}
    #header .moHeader .menuArea .gnbWrap {width: 22rem; flex-shrink: 0; background: #F4F4F4}
    #header .moHeader .menuArea .gnb {}
    #header .moHeader .menuArea .gnb .gnbLst {font-size: 2.6rem; text-align: center; padding: 2.9rem 0;}
    #header .moHeader .menuArea .gnb .gnbLst.on {font-weight: bold; color: #fff; background: #008C7E; background: linear-gradient(90deg,rgba(0, 140, 126, 1) 0%, rgba(0, 111, 136, 1) 100%);}
    #header .moHeader .menuArea .lnbWrap {width: 100%; border: 1px solid #E0E0E0; border-right: 0; border-bottom: 0;}
    #header .moHeader .menuArea .lnbWrap::after {content: ''; display: block; position: absolute; width: 30rem; height: 28rem; background: url('../img/ic_moHead.png') center/contain; right: 0; bottom: 0;}
    #header .moHeader .menuArea .lnb {display: none}
    #header .moHeader .menuArea .lnb.show {display: block;}
    #header .moHeader .menuArea .lnb .lnbLst {color: #333; font-size: 2.4rem; padding: 2rem 4rem; border-bottom: 1px solid #E0E0E0;}
}

/**¿µ¹® Ãß°¡**/
#header.en .pcHeader .logo {width: 28.3rem;}
#header.en .pcHeader .gnb .gnbLst {height: auto}
#header.en .pcHeader .gnb .gnbLst .gtit {padding: 2rem 0; line-height: 1.2; height: 100%; display: flex; align-items: center; justify-content: center;}
#header.en .pcHeader .lnb {height: 45rem;}
#header.en .pcHeader .lnb .lnbLst a {font-size: 1.7rem;}
#header.en .pcHeader .lnbBg {height: 45rem;}
#header.en .pcHeader .util .btn {font-size: 1.4rem; line-height: 1.2; align-items: baseline;}
#header.en .pcHeader .util .langBtn {padding: 1.45rem 0.9rem;}

@media all and (max-width: 880px){
    #header.en .moHeader .moHead .util .linkBtn {font-size: 1.6rem; line-height: 1.2; padding: 0.65rem 1.6rem; align-items: baseline;}
    #header.en .moHeader .menuArea .gnb .gnbLst {padding: 0; height: 10rem; display: grid; place-items: center;}
}


/*=================
  ǪÅÍ
=================*/
#footer {background: #000817}
#footer .inner {max-width: 172rem; padding: 3.4rem 0; align-items: center;}
#footer .ftLogo {width: 27.8rem; flex-shrink: 0;}
#footer .info {margin-left: 6.3rem; flex-wrap: wrap;}
#footer .info .lst {font-size: 1.8rem; font-weight: 300; color: #fff;}
#footer .info .lst + .lst {padding-left: 1.2rem; margin-left: 1.2rem;}
#footer .info .lst + .lst::before {content: ''; display: block; position: absolute; width: 1px; height: 50%; background: rgba(255,255,255,0.6); left: 0; top: 50%; transform: translateY(-50%);}
#footer .info .lst span {font-weight: 500; padding-right: 0.8rem;}
#footer .linkLst {font-size: 1.5rem; width: 19rem; margin-left: auto; flex-shrink: 0;}
#footer .linkLst .tit {border: 1px solid rgba(241,241,241,0.5); padding: 1.3rem 1.5rem; border-radius: 0.2rem; line-height: 1; color: #fff; width: 100%; cursor: pointer; transition: 0.1s;}
#footer .linkLst .tit::before {content: ''; display: block; position: absolute; width: 1.5rem; height: 1.5rem; background: url('../img/ic_arr_down_w.svg') center/contain no-repeat; right: 1.5rem; top: 50%; transform: translateY(-50%); transition: 0.1s;}
#footer .linkLst .tit.on {color: #212121; background: #fff; border: 1px solid #fff;}
#footer .linkLst .tit.on::before {background: url('../img/ic_arr_down.svg') center/contain no-repeat; transform: translateY(-50%) scaleY(-1);}
#footer .linkLst .lst {position: absolute; background: #fff; width: 100%; padding: 2rem 1.5rem; border: 1px solid #E0E0E0; bottom: calc(100% + 0.5rem); z-index: 99; border-radius: 0.2rem; display: none;}
#footer .linkLst .lst li {color: #555; line-height: 1; }
#footer .linkLst .lst li + li {margin-top: 1.8rem;}
#footer .linkLst .lst li a {display: block; line-height: 1.1;}
#footer .linkLst .lst li a:hover {color: #212121}

@media all and (max-width: 880px){
    #footer {}
    #footer .inner {padding: 6rem 0; flex-direction: column; gap: 3rem;}
    #footer .ftLogo {width: 34.4rem;}
    #footer .info {flex-wrap: wrap; margin: 0; justify-content: center; text-align: center; gap: 1rem 0;}
    #footer .info .lst {font-size: 2rem;}
    #footer .info .lst:nth-child(1) {width: 100%;}
    #footer .info .lst:nth-child(2) {padding: 0; margin: 0;}
    #footer .info .lst:nth-child(2)::before {display: none;}
    #footer .info .lst:nth-child(3) {}
    #footer .info .lst + .lst {}
    #footer .info .lst span {}
    #footer .linkLst {width: 26rem; margin: 0; font-size: 2rem;}
    #footer .linkLst .tit {padding: 1.7rem 1.5rem;}
    #footer .linkLst .lst {}
    #footer .linkLst .lst li {}
    #footer .linkLst .lst li + li {}
}

/**¿µ¹® Ãß°¡**/
#footer.en .ftLogo {width: 28.3rem;}
#footer.en .info .lst:nth-child(1) {width: 100%}
#footer.en .info .lst:nth-child(2) {padding: 0; margin: 0;}
#footer.en .info .lst:nth-child(2)::before {display: none;}

@media all and (max-width: 880px){
    #footer.en .ftLogo {width: 35rem;}
}

/*=================
  ž¹öÆ°
=================*/
#top {position: fixed; right: 3rem; bottom: 10%; z-index: 9999;}
#top a {display: grid; width: 6rem; height: 6rem; border-radius: 0.5rem; border: 1px solid #E0E0E0; place-items: center; background: #fff; box-shadow: 0 0 1rem rgba(0, 0, 0, 0.1);}
#top a img {width: 1.9rem}

@media all and (max-width: 880px){
    #top {right: 0}
}


/*=================
  ¼­ºê »ó´Ü & ³×ºñ°ÔÀ̼Ç
=================*/
#pageTop {background: #008C7E; background: linear-gradient(90deg,rgba(0, 140, 126, 1) 0%, rgba(0, 111, 136, 1) 100%); padding: 11.7rem 0; margin-top: 8.5rem; z-index: 999;}
#pageTop .title {font-size: 4.6rem; font-weight: 800; color: #fff; text-align: center; line-height: 1;}

@media all and (max-width: 880px){
    #pageTop {padding: 12rem 0 21rem; margin-top: 10rem;}
    #pageTop .title {font-size: 5rem; line-height: 1.3;}
    #pageTop .navMo {width: 100%; bottom: 0;}
    #pageTop .navMo .inn {width: 100%; padding: 2.4rem 0; line-height: 1.2}
    #pageTop .navMo .current {font-size: 2.8rem; font-weight: bold; color: #fff; border-top: 1px solid rgba(255, 255, 255, 0.5);}
    #pageTop .navMo .current img {filter: grayscale(1) brightness(100); width: 3.2rem; transition: 0.2s;}
    #pageTop .navMo .current.on {background: #F4F4F4; color: #007088;}
    #pageTop .navMo .current.on img {filter: none; transform: scaleY(-1);}
    #pageTop .navMo .menuWrap {position: absolute; width: 100%; background: #fff; display: none; box-shadow: 0 0.4rem 1rem rgba(0,0,0,0.15);}
    #pageTop .navMo .menuWrap .menu {max-width: var(--innerMo); margin: 0 auto; padding: 3rem 0;}
    #pageTop .navMo .menuWrap .menu .lst {font-size: 2.6rem; color: #333; line-height: 1.5;}
    #pageTop .navMo .menuWrap .menu .lst + .lst {margin-top: 2rem;}
    #pageTop .navMo .menuWrap .menu .lst a {display: block;}
}

#content {padding: 7rem 0 15rem; gap: 7rem}

.navPc {width: 26.3rem; position: sticky; top: 10%; align-self: flex-start; flex-shrink: 0;}
.navPc .navHead {height: 15rem; display: flex; flex-direction: column; justify-content: center; background: #008C7E; background: linear-gradient(90deg,rgba(0, 140, 126, 1) 0%, rgba(0, 111, 136, 1) 100%); border-radius: 1rem; box-shadow: 0.5rem 0.5rem 1rem rgba(0,0,0,0.1);}
.navPc .navHead::before {content: ''; display: block; position: absolute; width: 12.6rem; height: 11.7rem; background: url('../img/nav_bg.png') center/contain no-repeat; right: -1.2rem; bottom: -0.2rem;}
.navPc .navHead .txt {padding: 0 3rem; font-size: 2.8rem; font-weight: 800; color: #fff; overflow-wrap: anywhere; white-space: normal; word-break: break-word; line-height: normal;}
.navPc .navBody {border: 1px solid #e0e0e0; border-radius: 1rem; padding: 1.5rem 1.8rem; box-shadow: 0.5rem 0.5rem 1rem rgba(0,0,0,0.1);}
.navPc .navBody .menu {}
.navPc .navBody .menu .lst {}
.navPc .navBody .menu .lst a {font-size: 1.8rem; line-height: 1.5; padding: 1.65rem 1.2rem; display: block; transition: 0.1s;}
.navPc .navBody .menu .lst a::before {content: ''; position: absolute; display: block; width: 100%; height: 2px; bottom: 0; left: 0; background: #007088; opacity: 0; transition: 0.3s;}
.navPc .navBody .menu .lst + .lst {border-top: 1px solid #e0e0e0}
.navPc .navBody .menu .lst:hover a {font-weight: bold; color: #007088;}
.navPc .navBody .menu .lst:hover a::before {opacity: 1;}
.navPc .navBody .menu .lst.on a {font-weight: bold; color: #007088;}
.navPc .navBody .menu .lst.on a::before {opacity: 1;}

.article {width: 100%}
.article .pageTit {font-size: 2.8rem; font-weight: bold; padding: 1.5rem 0; border-bottom: 1px solid #E0E0E0}

@media all and (max-width: 880px){
    #content {max-width: var(--innerMo);}

    .article {}
    .article .pageTit {font-size: 3.4rem;}
}