@charset "utf-8";
/* layout.css는 전체적인 레이아웃 스타일을 정의합니다. */ 

#skipToContent a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skipToContent a:focus, 
#skipToContent a:active {width:200px;height:50px;background:#21272e;color:#fff;font-size:14px;font-weight:bold;text-align:center;text-decoration:none;line-height:50px}

.contain {width:1400px; margin:0 auto;}
.contain:after {content:""; display:block; clear:both;}

/* header */
#header {position:absolute; width:100%; z-index:100; background:#fff;}
#header .contain {position:relative; height:100px;}
#header.header-hover {background:#fff;}
#header.header-hover #gnb > ul > li > a {color:#2c2c2c;} 
#header.header-hover #gnb > ul > li {color:##1ca1e4;}
#header.header-hover #gnb > ul {color:#1ca1e4; font-weight:500;}
#header.header-hover #gnb > ul > li:hover:after {transform: scaleX(1);}
#header.header-hover #gnb > ul.active {background:#fff; color:#2c2c2c;}
#header.header-hover #gnb > ul > li.active > a, 
#header.header-hover #gnb > ul > li:hover > a {color:#00aaad;} 

.sitelogo {position:absolute; top:50%; left:0; margin-top:-25px; z-index:5;}

#gnb {position:relative; height:100px; text-align:right;}
#gnb > ul {display:inline-block; display:flex; justify-content:center; margin-left:270px;}
#gnb > ul > li {float:left; position:relative; height:100px; z-index:1; padding-left:90px;}
#gnb > ul > li > a {font-family: 'NanumSquare', sans-serif; display:block; height:100px; position:relative; text-align:center; font-size:20px; line-height:100px; font-weight:700; color:#242424; letter-spacing:-0.04em; z-index:5;}

#gnb .submenu {height:0; overflow:hidden; position:absolute; left:50px; width:100%; text-align:center; z-index:15;}
#gnb .submenu > ul {position:relative; padding:15px 0;}
#gnb .submenu > ul > li {font-size:16px; }
#gnb .submenu > ul > li > a {display:block; font-weight:400; color:#fff; padding:5px 0;}
#gnb .submenu > ul > li:last-child >a {padding-bottom:15px;}

.submenu-txt {display:none; position:absolute;  padding:5px;left:350px; top:125px; z-index:2; color:#fff; font-size:20px; font-weight:bold;}
.submenu-txt a { font-family:'NanumSquare', sans-serif; position:relative; display:inline-block; }
.submenu-txt a span {position:relative; display:block; width:100%; height:0; padding-bottom:100%; overflow:hidden;}
.submenu-bg {display:none; position:absolute; top:100px; left:0; width:100%; background-color:#00aaad;}

#sub #header {background-color:#fff; position:relative;}
#sub #header #gnb > ul > li > a {color:#242424; font-weight:700;}
#gnb > ul > li.active > a {color:#00aaad !important;}

.select-mb {position:absolute; right:0; top:33px;} 
.custom-select {display:inline-block; vertical-align:middle; position:relative; z-index:10;}
.custom-select .select-hidden {display:none;}
.custom-select .select-input {position:relative; color:#454545; border:1px solid #ddd; font-weight:400; border-radius:5px; padding:0 30px 0 10px; height:30px; font-family:'Titillium Web', sans-serif; font-size:15px; line-height:28px; letter-spacing:0; overflow:hidden; white-space:nowrap; cursor:pointer; background: url("../images/bbs/selects.png") right 7px center no-repeat; z-index:2;}
.custom-select .select-options {display:none; position:absolute; color:#242424; margin-top:-1px; left:0; width:100%; max-height:460px; font-size:14px; line-height:1.5em; letter-spacing:-.03em; background:#fff; border:1px solid #ddd; overflow:auto;}
.custom-select .select-options li {text-align:center; width:100%; font-family:'Titillium Web', sans-serif; letter-spacing:0; margin-right:0; padding:10px 10px; cursor:pointer; transition:.2s;}
.custom-select .select-options li:hover {background:#f2f2f2}
.custom-select .select-options li.selected {background:#f2f2f2}
.custom-select.active .select-input {border-color:#ff5500;}


 /* main */ 
.main-visual {position:relative; width:100%; min-width:1300px; line-height:0; overflow:hidden; z-index:1;}
.main-visual:before {content:""; position:absolute; top:0; left:0; width:100%; height:100vh; background-image:linear-gradient(#000, transparent); opacity:0; z-index:40;}
.main-visual .item {position:relative; width:100%; z-index:1;}
.main-visual .img {display:block; position:relative; height:100vh; background-repeat:no-repeat; background-position:center center; -webkit-background-size:cover; background-size:cover; overflow:hidden;}
.main-visual .caption {position:absolute; top: 50%; left: 0; width: 100%; padding: 0 30px; text-align: center; z-index: 45; transform: translateY(-45%); color: #fff;}
.main-visual .caption .tit {display:inline-block;padding:65px;background:rgba(0,170,173,0.8); font-family:'NanumSquare', sans-serif; font-size:42px; line-height:1.333em; letter-spacing:-.03em; font-weight:800;}
.main-visual .caption .smalltit {display:block;font-size:24px; font-weight:500;color:rgba(255,255,255,0.8);}

.main-inner .doc-cnt {margin-top:100px;}
.main-info {display:flex; justify-content:center; flex-wrap:wrap; margin-bottom:75px;}
.main-info:nth-child(even) {flex-direction: row-reverse;}
.main-info:last-child {margin-bottom:0;}
.main-info:nth-child(even) .txts {text-align:right; padding-right:40px;}
.main-info:nth-child(even) .more {margin-right:-120px;}
.main-info .img {position:relative; width:50%; z-index:-1;}
.main-info .txts {width:50%; padding-left:40px;}
.main-info .txts li {position: relative; padding-left: 15px;}
.main-info .txts li:before {position: absolute; content: '·'; left: 0; top: 0;}
.main-info .txts .number {font-family:'S-CoreDream'; font-size:60px; color:#ededed; font-weight:800; letter-spacing:-.03em; line-height:1.3em;}
.main-info .txts .tit {font-family:'NanumSquare', sans-serif; font-size:30px; color:#242424; font-weight:800; letter-spacing:-.03em; line-height:1.1em; padding:25px 0 15px 0;}
.main-info .txts .txt {font-size:18px; color:#454545; letter-spacing:-.03em; line-height:1.667em;}
.main-info .txts .more {margin-top:115px; margin-left:-120px;}

.main-recruit {display:flex; flex-wrap:wrap; justify-content:space-between; gap: 30px 0; background:#f2faff; padding:100px 260px;}
.main-recruit .tit {font-family:'NanumSquare', sans-serif; font-size:40px; color:#242424; font-weight:800; letter-spacing:-.03em; line-height:1.3em;}
.main-recruit .txt {font-size:18px; color:#454545; font-weight:500; letter-spacing:-.03em; line-height:1.667em; margin:15px 0 40px 0;}
.main-recruit .btn {display:inline-block; font-size:18px; color:#00aaad; border:2px solid rgba(0, 170, 173, 0.5); font-weight:500; letter-spacing:-.03em; width:180px; line-height:50px; border-radius:30px; text-align:center;}
.main-recruit .btn:hover {background:#00aaad; color:#fff;}
.main-recruit .recruit-ico ul {display:flex;}
.main-recruit .recruit-ico ul li {width:calc(33.3333% - 30px); font-size:20px; color:#fff; margin-left:30px; padding:30px 60px; border-radius:10px; text-align:center; }
.main-recruit .recruit-ico ul li .s-txt {padding-top:10px;}
.main-recruit .recruit-ico ul li:first-child {background:#3dc490;}
.main-recruit .recruit-ico ul li:last-child {background:#4284db;}
.main-recruit .recruit-ico ul li:nth-child(2) {background:#42b9db;}

.main-information {display:flex; margin-bottom:100px;}
.main-infos {position: relative; width:50%; background:rgba(0, 0, 0, 0.8); color:#fff; margin-right:-450px; padding:100px 10px 0 50px; z-index:10;}
.main-infos .tit {padding:40px 0 30px 0;}
.main-infos .inner {font-size:16px; letter-spacing:-.03em; line-height:1.750em;}
.main-infos .map-img {position: absolute; bottom: 0; left: 0; width: 100%;}
.root_daum_roughmap .cont {display: none;}

/* sub */
.sub-visual {position:relative; display:table; table-layout:fixed; width:100%; min-width:1300px; height:300px; background-color:#fff; background-position:50% 50%; background-repeat:no-repeat;}
.sub-visual .cell {display:table-cell; vertical-align:middle; width:100%; height:100%;}
.sub-visual .in {text-align:center;}
.sub-visual h3 {font-family:'NanumSquare', sans-serif; position:relative; font-size:35px; line-height:1.4em; color:#fff; letter-spacing:-1px; margin-top:15px;}
.sub-visual p {font-size:18px; line-height:1.3em; color:#fff; letter-spacing:0.3em; font-weight:400;}
.sub-visual.bg1 {background-image:url("../images/common/sv1.jpg");}
.sub-visual.bg2 {background-image:url("../images/common/sv2.jpg");}
.sub-visual.bg3 {background-image:url("../images/common/sv3.jpg");}
.sub-visual.bg4 {background-image:url("../images/common/sv4.jpg");}
.sub-visual.bg5 {background-image:url("../images/common/sv5.jpg");}



.lnb {position:relative; width:100%; min-width:1300px; text-align:center; z-index:1;}
.lnb:after {content:""; position:absolute; bottom:0; left:0; width:100%; height:1px; background:#ddd;}
.lnb .contain {padding:0; width:1200px;}
.lnb ul {position:relative; display:table; table-layout:fixed; width:100%; z-index:2;}
.lnb ul li {position:relative; display:table-cell; vertical-align:middle; max-width:50%; width:auto !important; background:#fff; z-index:1;}
.lnb ul li a {font-weight:bold; display:block; position:relative; width:100%; height:60px; color:#242424; font-family: 'NanumSquare', sans-serif; border:1px solid #ddd; border-right:0; font-size:18px; line-height:58px; z-index:1;}
.lnb ul li a:after {content:""; position:absolute; top:0; left:0; width:100%; height:100%; border-right:0;}
.lnb ul li:last-child a {border-right:1px solid #ddd;}
.lnb ul li.active {z-index:2;}
.lnb ul li.active + li a {border-left:0;}
.lnb ul li.active a {border-color:#009fa8; background:#009fa8; color:#fff;}

.performance-list {display:flex; justify-content:center; margin:0 -10px; margin-bottom:60px;}
.performance-list li {padding:0 10px;}
.performance-list li.active a {background-color:#1ca1e4; color:#fff;}
.performance-list li a {display:block; text-align:center; font-size:20px; font-weight:500; color:#1ca1e4; letter-spacing:-.03em; width:200px; height:60px; line-height:60px; border-radius:30px; border:1px solid #1ca1e4;}

#contArea {width:1200px; margin:0 auto;}
#contArea.wide {max-width:none;} 

.real-cont {padding-bottom:100px;}
.sub-title {text-align:center; padding:55px 0 60px;}
.sub-title h2 {font-size:30px; position:relative;padding-bottom:30px; font-weight:500;}
.sub-title h2:after {content:"";  position:absolute; bottom:-1px; left:50%; margin-left:-25px; width:50px; height:3px; background:#009fa8;}


/* footer */
#footer {padding-top:30px; position:relative; width:100%; min-width:1300px; background:#454545; color:#9e9e9e; line-height:1.571em;}
#footer .contain {position:relative; display:flex; font-size:15px; letter-spacing:-.03em; line-height:1.600em; padding-bottom:15px;}
#footer .contain.bd {border-top:1px solid rgba(255, 255, 255, 0.5);}
#footer address {font-style:normal; font-weight:300;}
.foot-logo {position:absolute; top:50%; left:0; transform:translateY(-50%); z-index:5;}
.foot-info .foot-link {display:inline-block; font-weight:400;}
.foot-info {font-size:14px; padding-top:15px;}
.foot-info div {width:1400px; border-bottom:1px solid #ccc; margin:0 auto;}
.foot-info .foot-link a {margin-right:20px; display:block; font-size:15px; color:#cccbcb;}
.foot-info span {position:relative;}
.foot-info .foot-after {padding-right:12px; font-size:14px; letter-spacing:-.03em; line-height:1.600em;}
a.pop_privacy {padding-right:25px;}
.go-top {position:absolute; right:0; bottom:30px;}
.foot-link {color:#ddd;}
.foot-link span img {padding-top:5px; padding-right:2px;}