@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@font-face { font-family: 'yg-jalnan'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face {
    font-family: 'GmarketSans';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'GmarketSans';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}
@font-face {
    font-family: 'GmarketSans';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'BMDOHYEON';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/BMDOHYEON.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0;padding: 0;border: 0;font: inherit;vertical-align: baseline;}

html {font-size:10px;}
br {opacity:0;}
.cB::after {content:''; display:block; clear:both;}

body {background:#eaebef url(../images/bg.jpg) no-repeat 50% 0; -webkit-text-size-adjust: none;font-family: 'GmarketSans', 'Malgun gothic', '맑은고딕', sans-serif;font-size: 1.6rem;font-weight: 400; line-height: 1;}


.dv_wrap {width:1400px; margin:0 auto;}
@media all and (max-width:1400px){
    .dv_wrap  {width:100%; padding:0 15px; box-sizing:border-box;}
}

h3 {margin:70px 0px 50px 0px;  text-align:center;}
p.copy  {font-size:3.0rem; font-weight:300; text-align:center; line-height:4.6rem; font-family:'Noto Sans KR';}
p.copy span {background:#0089b2; color:#fff; display:inline-block; padding:0 10px;}
@media all and (max-width:1000px){
    h3 {margin:40px 0px 30px 0px;}
    p.copy  {font-size:2.0rem; line-height:3.0rem;}
    p.copy br {display:none;}
    p.copy span {display:inline;}
}
@media all and (max-width:600px){
    h3 img {max-width:70%;} 
}

.obtn {text-align:center; margin-top:50px;}
.obtn a {display:inline-block; width:490px; margin:0 30px; opacity: 0.95; border-radius: 20px; padding:25px 0px 25px 0px; box-sizing:border-box; transition:all .3s; margin-bottom:10px;}
.obtn a:hover {box-shadow:5px 5px 5px rgba(0,0,0,0.3);}
.obtn a span {font-family: 'BMDOHYEON'; font-size:2.1rem; position:relative; line-height:5.7rem; display:inline-block;}
.obtn a br {display:none;}
.obtn a:nth-child(1) {background-color: #1b3355; }
.obtn a:nth-child(1):hover span{color:#fff;}
.obtn a:nth-child(1) span {padding:0 30px 0 75px; color:#fff!important;}
.obtn a:nth-child(1) span::before {content:''; display:inline-block; width:87px; height:44px; position:absolute; top:6px; left:0; background:url(../images/bicon_01.png) no-repeat 0 50%;}
.obtn a:nth-child(1) span::after {content:''; display:inline-block; width:15px; height:23px; position:absolute; top:15px; right:0; background:url(../images/a01.png) no-repeat 0 50%;}
.obtn a:nth-child(2) {background-color: #fff; color:#333!important;}
.obtn a:nth-child(2):hover span{color:#333!important;}
.obtn a:nth-child(2) span {padding:0 30px 0 50px;}
.obtn a:nth-child(2) span::before {content:''; display:inline-block; width:87px; height:57px; position:absolute; top:0; left:0; background:url(../images/bicon_02.png) no-repeat 0 50%;}
.obtn a:nth-child(2) span::after {content:''; display:inline-block; width:15px; height:23px; position:absolute; top:15px; right:0; background:url(../images/a02.png) no-repeat 0 50%;}
@media all and (max-width:600px){
    .obtn {margin-top:30px;}
    .obtn a {width:49%; padding:20px 15px 20px 15px; margin:0; text-align:left;}
    .obtn a br {display:inline-block;}
    .obtn a span {padding-left:0!important; line-height:3rem; font-size:2.1rem; padding-right:0!important; width:100%; box-sizing:border-box;}
    .obtn a span::before {display:none!important;}
	.obtn a span::after{  right:-5px!important; background-size:70%!important;}
    .obtn a:nth-child(1) {float:left; }
    .obtn a:nth-child(2) {float:right;}
}
@media all and (max-width:500px){
    .obtn a span {line-height:2.2rem; font-size:1.6rem;} 
	
}
@media all and (max-width:400px){
	.obtn a span {padding-bottom:15px!important;} 
	.obtn a span::after{ top:88%!important; bottom:5px; right:-5px!important; background-size:70%!important;}
}

.point {margin-top:30px; text-align:center;}
.point span {color:#ff0000;padding:15px 20px 10px 20px; border-radius:30px; background-color:#fff; display:inline-block; line-height:2.0rem;}

.section2 {position:relative; margin-top:100px;}
.section2 .loca .loca_info {border:15px solid #354f7d; padding:50px; width:60%; box-sizing:border-box;}
.section2 .loca .loca_info h4 {font-size:4.3rem; font-family: 'yg-jalnan'; margin-bottom:30px; height:43px; overflow:hidden; line-height:7.0rem;}
@media screen and (-webkit-min-device-pixel-ratio: 0){
    .section2 .loca .loca_info h4 { line-height:4.3rem;}
}

.section2 .loca .loca_info dl dt {font-size:2.2rem; line-height:4.0rem; padding-left:45px; position:relative; margin-top:20px; font-weight:600;}
.section2 .loca .loca_info dl dd {line-height:2.6rem; font-size:1.8rem; font-weight:400; margin-top:5px; color:#333;}
.section2 .loca .loca_info dl dt::before {content:''; display:block; width:40px; height:40px; position:absolute; top:0; left:0;}
.section2 .loca .loca_info dl dt.add::before {background:url(../images/i01.png) no-repeat 0 -2px;}
.section2 .loca .loca_info dl dt.tra::before {background:url(../images/i02.png) no-repeat 0 -2px;}
.section2 .loca .loca_info dl dt.info::before {background:url(../images/i03.png) no-repeat 0 -2px;}
.section2 .loca .loca_info dl dt.info2::before {background:url(../images/i04.png) no-repeat 0 -2px;}

.tra_incon li {margin-top:3px;}
.tra_incon li strong {display:inline-block; border-radius:5px; color:#fff; padding:3px 10px 0px 10px; font-weight: normal; line-height:2.6rem; }
.tra_incon li:nth-child(1) strong {background-color:#4182ec;}
.tra_incon li:nth-child(2) strong {background-color:#669933;}
.tra_incon li:nth-child(3) strong {background-color:#cc6600;}
.tra_incon li:nth-child(4) strong {background-color:#9933cc;}
.tra_incon li:nth-child(5) strong {background-color:#3366cc;}

.bult li {position:relative; padding-left:10px;}
.bult li:before {content:''; display:block; width:5px; height:5px; background:#333; position:absolute; top:8px; left:0; border-radius:50%; }

.inmap {position:absolute; top:300px; right:0; padding:20px 0px 0px 20px; width:50%; box-sizing:border-box;}
.inmap::before {content:''; display:block; width:60%; height:360px; background-color:#354f7d; position:absolute; top:0; left:0;}
.inmap .root_daum_roughmap {border:1px solid #354f7d; width:100%;}
.wrap_controllers {display:none;}
.map_border {display:none;}


.organization h4 {position:absolute; top:40px; left:55%; font-size:2.5rem; font-family: 'yg-jalnan'; margin-bottom:30px; height:52px; overflow:hidden; line-height:7.0rem; background:url(../images/arrow_bg.png) no-repeat right 0; padding:0 50px 0px 30px; color:#fff;}
@media screen and (-webkit-min-device-pixel-ratio: 0){
    .organization h4 {line-height:5.6rem; }
}

.organization ul.chart {position:absolute; top:50px; right:50px; width:400px;}
.organization ul.chart li {text-align:center;}
.organization ul.chart li a {font-weight:600; text-shadow:1px 1px 1px rgba(0,0,0,0.5); color:#fff; display:block; position:relative; }
.organization ul.chart li a span {color:#fff; box-sizing:border-box;}
.organization ul.chart li a:hover span{color:#fff!important;}
.organization ul.chart li.c01 > a {width:60%; margin:0 auto;}
.organization ul.chart li.c01 > a span{border-radius:50px; background-color:#00a0e9; padding:25px 0px 20px 0px; font-size:2.4rem; display:block;box-sizing:border-box;  box-shadow:3px 3px 3px rgba(0,0,0,0.2);  border:1px solid #fff;}
.organization ul.chart li.c01 > a::after {content:''; display:block; width:2px; height:20px; background:#333; margin-left:calc(50% - 1px);}

.organization ul.chart li.c02 {float:left; width:44%; }
.organization ul.chart li.c03 {float:right; width:44%; }
.organization ul.chart li.c02 > a, .organization ul.chart li.c03 > a {display:block; width:100%;}
.organization ul.chart li.c02 > a span, .organization ul.chart li.c03 > a span{border-radius:50px; background-color:#89c240; padding:20px 0 15px 0; font-size:1.6rem; display:block;box-sizing:border-box;  box-shadow:3px 3px 3px rgba(0,0,0,0.2); border:1px solid #fff;}
.organization ul.chart li.c02 > a::before, .organization ul.chart li.c03 > a::before {content:''; display:block; width:2px; height:20px; background:#333; margin-left:calc(50% - 1px);}
.organization ul.chart::after {content:''; display:block; width:56%; height:2px; background:#333; position:absolute; top:90px; left:22%;}

.organization .inset {position:absolute; top:230px; right:60px; font-size:1.4rem; color:#ff0000;}

@media all and (max-width:1300px){
    .section2 .loca .loca_info {padding:50px 60px 30px 30px; }
    .inmap {width:45%;}
    .organization ul.chart {position:absolute; top:80px; right:0; width:35%;}
	.organization .inset {color:#ff0000; width:35%; top:260px; right:0px; text-align:center;}
}
@media all and (max-width:700px){
    body { background:#eaebef url(../images/bg_mo.jpg) no-repeat 50% 0; background-size:100%;}
    .section2 {margin-top:50px;}
    .section2 .loca .loca_info {padding:30px; width:100%;}
    .section2 .loca .loca_info h4 {font-size:3.3rem;}

    .inmap {width:100%; position:relative; top:0; right:0; left:0; padding:0 15px 15px 15px;}
    .inmap::before {content:''; display:block; width:100%; height:375px; background-color:#354f7d; position:absolute; top:0; left:0;}

    .organization h4 {position:relative; top:0; left:0; background:none; color:#333; padding:0; margin-top:40px; font-size:3.3rem; }
    .organization ul.chart {position:relative; top:0; left:0; right:0; width:100%;}
	.organization .inset {position:relative; top:0; left:0; width:100%; margin-bottom:10px;}
    .section2 .loca .loca_info dl dd {font-size:1.6rem;}
}

@media all and (max-width:480px){
    .section2 .loca .loca_info {padding:20px; border:5px solid #354f7d;}
    .inmap {padding:0 5px 5px 5px;}
    .inmap::before {height:365px;}

}

p.copyright {margin:50px 0; text-align:center; font-size:1.4rem;}