@charset "utf-8";
#hd .hd-wr .hd-nav ul > li > a {color:#fff !important;}
#hd.scrolled .hd-wr .hd-nav ul > li > a,
#hd.open .hd-wr .hd-nav ul > li > a {color:#000 !important;}

.colorA {color:#00448F;}
.colorB {color:#009389;}

.blend-multiply{ mix-blend-mode: multiply;}

/*공통*/
.sub-hd {position:relative;height:655px;}
.sub-hd .sub-hd_tit {display:flex; width:100%;height:calc(100% - 96px);flex-flow: column;align-items: center;justify-content: center;}
.sub-hd .sub-hd_tit span {font-size:24px;color:#fff;}
.sub-hd .sub-hd_tit h1 {font-family:Roboto-Bold;font-size:48px;color:#fff;margin-top:20px;}

.sub-hd .sub-nav {width:100%;height:97px;border-top: 1px solid #E1E1E1;text-align: center;}
.sub-hd .sub-nav ul {display:block;height:100%;}
.sub-hd .sub-nav ul li {display:inline-block;width:267px;height:100%;border-right:1px solid #E1E1E1;margin-left:-2px;}
.sub-hd .sub-nav ul li a {height:100%;display:flex;align-items:center;justify-content:center;font-weight:bold;font-size:24px;color:#fff;;}
.sub-hd .sub-nav ul li:first-of-type {border-left: 1px solid #E1E1E1;margin-left:0;}
.sub-hd .sub-nav ul li.on {background:#00448F;}

.sub-top {padding:100px 0 50px;border-bottom:1px solid #E1E1E1;}
.sub-top .sub-title {text-align: center;}
.sub-top .sub-title h2 {font-family: NanumSquareEB;font-size:48px;color:#000;}

.sub-wr {padding: 70px 0;overflow: hidden;}

@media (max-width:1280px) {
    .sub-hd {height:500px;}
    .sub-hd .sub-nav {height:76px;}
    .sub-hd .sub-hd_tit {height:calc(100% - 76px);}
    .sub-hd .sub-hd_tit span {margin-top: 30px;}
    .sub-hd .sub-nav ul li {width:200px;height:76px;}
    .sub-hd .sub-nav ul li a {}
    .sub-hd .sub-nav ul li.on {height:75px;}

    .sub-top {padding: 100px 0 80px;}
    .sub-top .sub-title h2 {font-size:36px;}
}

@media (max-width:768px) {
    .sub-hd {height:250px;}
    .sub-hd .sub-hd_tit {height:calc(100% - 50px);}
    .sub-hd .sub-hd_tit span {font-size:12px;}
    .sub-hd .sub-hd_tit h1 {font-size:32px;margin-top:10px;}

    .sub-hd {}
    .sub-hd .sub-nav {height:50px;}
    .sub-hd .sub-nav ul li {width:100px;height:50px;}
    .sub-hd .sub-nav ul li a {font-size:11px;}
    .sub-hd .sub-nav ul li.on {height:49px;}

    .sub-top {padding:50px 0 30px;}
    .sub-top .sub-title h2 {font-size:24px;}
}

/*menu10*/
.sub-con {max-width:1300px;padding-bottom:60px;margin: 0 auto;}
.sub-con:after {content:'';display:block;clear:both;}
.sub-con .con-half {float:left;width:50%;vertical-align: top;}
.sub-con .menu10-logo {text-align: center;}
.sub-con .menu10-logo img {max-width:506px;width:100%;}

.sub-con .menu10-text {}
.sub-con .menu10-text .m10-text_tit {position:relative;display:inline-block;font-family: NanumSquareEB;font-size:24px;color:#000;}
.sub-con .menu10-text .m10-text_tit:before {content:'';position:absolute;width:7px;height:7px;left:-10px;top:-5px;background:#00448F;border-radius:50%;}
.sub-con .menu10-text p {font-size:18px;line-height:1.7;color:#000;margin-top:20px;}

.menu10-intro {position:relative;padding:90px 0 50px;border-top:1px solid #e1e1e1;text-align: center;}
.menu10-intro img {width:100%;max-width:907px;}

.menu10-intro .blend-circle {position:absolute;border-radius: 50%;z-index: -1;}
.menu10-intro .c01 {width:60px;height:60px;right:10%;top:-30px;background:#009389;z-index: 1}
.menu10-intro .c02 {width:172px;height:172px;left:2%;bottom:-11%;background:#E1E1E1}

.invisible-mobile {display:inline-block;}
.visible-mobile {display:none;}

@media (max-width:1280px) {
    .sub-wr {padding: 60px 20px 75px;}
    .sub-con .con-half {float:none;width:100%;text-align: center;}
    .sub-con .menu10-text {margin-top:90px;}
    .menu10-intro {padding: 80px 20px 100px;}
    .invisible-mobile {display:inline-block;}
    .visible-mobile {display:none;}
}

@media (max-width:768px) {
    .sub-wr {padding: 50px 15px;}
    .sub-con {padding-bottom:50px;}
    .sub-con .menu10-logo img {max-width:230px;}
    .sub-con .menu10-text {margin-top:50px;}
    .sub-con .menu10-text .m10-text_tit {font-size:18px;}
    .sub-con .menu10-text p {font-size:12px;margin-top:10px;}
    .invisible-mobile {display:none;}
    .visible-mobile {display:inline-block;}

    .menu10-intro {padding:50px 0;}
    .menu10-intro .c01 {width:38px;height:38px;top:-21px;}
    .menu10-intro .c02 {width:156px;height:156px;left:-25%;}
}

/*menu20*/
.menu20-member {max-width:1300px;margin:0 auto;}
.menu20-member:after {content:'';display: block;clear: both;}
.menu20-member ul {}
.menu20-member ul li {float:left;width:50%;max-height:383px;margin-bottom:100px;}
.menu20-member ul li .img-wr {display:table-cell;width:50%;text-align: right;overflow: hidden;}
.menu20-member ul li .img-wr img {width:100%;max-width:300px;}
.menu20-member ul li .text-wr {position:relative;display:table-cell;width:50%;height:100%;padding:10px 0 0 30px;vertical-align: top;}
.menu20-member ul li .text-wr .m20-position {position:relative;font-weight: bold;font-size:18px;color:#009389;}
.menu20-member ul li .text-wr .m20-position:before {content:'';display:block;position:absolute;width:5px;height:5px;left:-0.5em;top:-0.2em;border-radius:50%;background:#009389;}
.menu20-member ul li .text-wr .m20-name {font-weight: bold;font-size:36px;color:#000;margin-top:10px;}
.menu20-member ul li .text-wr .m20-info {position: absolute;left:30px;bottom:0;width:100%;}
.menu20-member ul li .text-wr .m20-info p {font-size:18px;line-height:1.7;color:#666;}
.menu20-member ul li .text-wr .m20-info .m20-email {font-family: Roboto-Ragular;font-size:18px;color:#999;margin-top:10px;}
.menu20-member ul li .text-wr .m20-info .m20-email span {position:relative;}
.menu20-member ul li .text-wr .m20-info .m20-email span:first-of-type {margin-right:30px;}
.menu20-member ul li .text-wr .m20-info .m20-email span:first-of-type:after {content:'';position:absolute;width:2px;height:15px;top:55%;transform:translateY(-50%);right:-15px;background:#999;}


.menu20-organization {position:relative;border-top:1px solid #e1e1e1;text-align: center;margin-bottom:80px;}
.menu20-organization .org-tit {font-family:NanumSquareEB;font-size:48px;color:#00448F;padding:100px 0;}
.menu20-organization img {max-width:1166px;width:100%;}
.menu20-organization .blend-circle {position:absolute;border-radius: 50%;z-index: -1;}
.menu20-organization .c01 {width:60px;height:60px;right:10%;top:-30px;background:#009389;z-index: 1;}
.menu20-organization .c02 {width:172px;height:172px;left:2%;bottom:-11%;background:#E1E1E1}

@media (max-width:1280px) {
    .menu20-member ul li {margin-bottom:40px;}
    .menu20-member ul li .img-wr {}
    .menu20-member ul li .img-wr img {}
    .menu20-member ul li .text-wr {padding:10px 0 0 20px}
    .menu20-member ul li .text-wr .m20-position {font-size:14px;}
    .menu20-member ul li .text-wr .m20-name {font-size:24px;}
    .menu20-member ul li .text-wr .m20-info {left:20px;}
    .menu20-member ul li .text-wr .m20-info p {font-size:12px;}
    .menu20-member ul li .text-wr .m20-info .m20-email {font-size:12px;}
    .menu20-member ul li .text-wr .m20-info .m20-email span:first-of-type {margin-right:20px;}
    .menu20-member ul li .text-wr .m20-info .m20-email span:first-of-type:after {width:2px;height:10px;top:50%;transform:translateY(-50%);right:-10px;}

    .menu20-organization {margin-bottom:20px;}
    .menu20-organization .org-tit {font-size:36px;}
}

@media (max-width:768px) {
    .menu20-member ul {max-width:500px;margin: 0 auto;}
    .menu20-member ul li {width:100%;height:100%;margin-bottom:40px;}
    .menu20-member ul li .img-wr {}
    .menu20-member ul li .text-wr {min-height:166.59px;padding: 5px 0 0 15px;}
    .menu20-member ul li .text-wr .m20-position:before {width:4px;height:4px;left:-0.3em;top:-0.2em;border-radius:50%;background:#009389;}

    .menu20-member ul li .text-wr .m20-name {font-size:20px;}
    .menu20-member ul li .text-wr .m20-info {left:15px;}
    .menu20-member ul li .text-wr .m20-info p {font-size:11px;line-height:1.4;word-break: keep-all;}
    .menu20-member ul li .text-wr .m20-info .m20-email {font-size:11px;margin-top:5px;}
    .menu20-member ul li .text-wr .m20-info .m20-email span:first-of-type {display:block;color:#555;}
    .menu20-member ul li .text-wr .m20-info .m20-email span:first-of-type:after {display:none;}

    .menu20-organization .org-tit {font-size:24px;padding: 50px 0 40px;}
    .menu20-organization .c01 {width:38px;height:38px;}
    .menu20-organization .c02 {width:100px;height:100px;left:-16%;bottom:16%}
}
