@charset "utf-8";
* {margin: 0; padding: 0; box-sizing: border-box;}


/* CSS Document */

/* 폰트 */
@font-face {
    font-family: 'NotoT';
    src: url(../font/NotoSansKR/NotoSansKR-Thin.eot);
    src: url(../font/NotoSansKR/NotoSansKR-Thin.eot?#iefix) format('embedded-opentype'),
    	 url(../font/NotoSansKR/NotoSansKR-Thin.woff2) format('woff2'),
		 url(../font/NotoSansKR/NotoSansKR-Thin.woff) format('woff');
}

@font-face {
    font-family: 'NotoL';
    src: url(../font/NotoSansKR/NotoSansKR-Light.eot);
    src: url(../font/NotoSansKR/NotoSansKR-Light.eot?#iefix) format('embedded-opentype'),
    	 url(../font/NotoSansKR/NotoSansKR-Light.woff2) format('woff2'),
		 url(../font/NotoSansKR/NotoSansKR-Light.woff) format('woff');
}

@font-face {
    font-family: 'NotoDL';
    src: url(../font/NotoSansKR/NotoSansKR-DemiLight.eot); 
    src: url(../font/NotoSansKR/NotoSansKR-DemiLight.eot?#iefix) format('embedded-opentype'),
		 url(../font/NotoSansKR/NotoSansKR-DemiLight.woff2) format('woff2'),
		 url(../font/NotoSansKR/NotoSansKR-DemiLight.woff) format('woff');
}

@font-face {
    font-family: 'NotoR';
    src: url(../font/NotoSansKR/NotoSansKR-Regular.eot);
    src: url(../font/NotoSansKR/NotoSansKR-Regular.eot?#iefix) format('embedded-opentype'),
    	 url(../font/NotoSansKR/NotoSansKR-Regular.woff2) format('woff2'),
		 url(../font/NotoSansKR/NotoSansKR-Regular.woff) format('woff');
}

@font-face {
    font-family: 'NotoM';
    src: url(../font/NotoSansKR/NotoSansKR-Medium.eot);
   	src: url(../font/NotoSansKR/NotoSansKR-Medium.eot?#iefix) format('embedded-opentype'),
    	 url(../font/NotoSansKR/NotoSansKR-Medium.woff2) format('woff2'),
		 url(../font/NotoSansKR/NotoSansKR-Medium.woff) format('woff');
}

@font-face {
    font-family: 'NotoB';
    src: url(../font/NotoSansKR/NotoSansKR-Bold.eot);
    src: url(../font/NotoSansKR/NotoSansKR-Bold.eot?#iefix) format('embedded-opentype'),
    	 url(../font/NotoSansKR/NotoSansKR-Bold.woff2) format('woff2'),
		 url(../font/NotoSansKR/NotoSansKR-Bold.woff) format('woff');
}

@font-face {
    font-family: 'NotoBK';
    src: url(../font/NotoSansKR/NotoSansKR-Black.eot);
    src: url(../font/NotoSansKR/NotoSansKR-Black.eot?#iefix) format('embedded-opentype'),
    	 url(../font/NotoSansKR/NotoSansKR-Black.woff2) format('woff2'),
		 url(../font/NotoSansKR/NotoSansKR-Black.woff) format('woff');
}

@font-face {
  font-family: 'S-Core';
  font-weight:100;
  src: url('../font/S-core/S-CoreDream-1Thin.eot');
  src: url('../font/S-core/S-CoreDream-1Thin.eot?#iefix') format('embedded-opentype'),
       url('../font/S-core/S-CoreDream-1Thin.svg#S-CoreDream-1Thin') format('svg'),
       url('../font/S-core/S-CoreDream-1Thin.ttf') format('truetype'),
       url('../font/S-core/S-CoreDream-1Thin.woff') format('woff'),
       url('../font/S-core/S-CoreDream-1Thin.woff2') format('woff2');
}
@font-face {
  font-family: 'S-Core';
  font-weight:200;
  src: url('../font/S-core/S-CoreDream-2ExtraLight.eot');
  src: url('../font/S-core/S-CoreDream-2ExtraLight.eot?#iefix') format('embedded-opentype'),
       url('../font/S-core/S-CoreDream-2ExtraLight.svg#S-CoreDream-2ExtraLight') format('svg'),
       url('../font/S-core/S-CoreDream-2ExtraLight.ttf') format('truetype'),
       url('../font/S-core/S-CoreDream-2ExtraLight.woff') format('woff'),
       url('../font/S-core/S-CoreDream-2ExtraLight.woff2') format('woff2');
}
@font-face {
  font-family: 'S-Core';
  font-weight:300;
  src: url('../font/S-core/S-CoreDream-3Light.eot');
  src: url('../font/S-core/S-CoreDream-3Light.eot?#iefix') format('embedded-opentype'),
       url('../font/S-core/S-CoreDream-3Light.svg#S-CoreDream-3Light') format('svg'),
       url('../font/S-core/S-CoreDream-3Light.ttf') format('truetype'),
       url('../font/S-core/S-CoreDream-3Light.woff') format('woff'),
       url('../font/S-core/S-CoreDream-3Light.woff2') format('woff2');
}
@font-face {
  font-family: 'S-Core';
  font-weight:400;
   src: url('../font/S-core/S-CoreDream-4Regular.eot');
  src: url('../font/S-core/S-CoreDream-4Regular.eot?#iefix') format('embedded-opentype'),
       url('../font/S-core/S-CoreDream-4Regular.svg#S-CoreDream-4Regular') format('svg'),
       url('../font/S-core/S-CoreDream-4Regular.ttf') format('truetype'),
       url('../font/S-core/S-CoreDream-4Regular.woff') format('woff'),
       url('../font/S-core/S-CoreDream-4Regular.woff2') format('woff2');
}
@font-face {
  font-family: 'S-Core';
  font-weight:500;
  src: url('../font/S-core/S-CoreDream-5Medium.eot');
  src: url('../font/S-core/S-CoreDream-5Medium.eot?#iefix') format('embedded-opentype'),
       url('../font/S-core/S-CoreDream-5Medium.svg#S-CoreDream-5Medium') format('svg'),
       url('../font/S-core/S-CoreDream-5Medium.ttf') format('truetype'),
       url('../font/S-core/S-CoreDream-5Medium.woff') format('woff'),
       url('../font/S-core/S-CoreDream-5Medium.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'S-Core';
  font-weight:600;
  src: url('../font/S-core/S-CoreDream-6Bold.eot');
  src: url('../font/S-core/S-CoreDream-6Bold.eot?#iefix') format('embedded-opentype'),
       url('../font/S-core/S-CoreDream-6Bold.svg#S-CoreDream-6Bold') format('svg'),
       url('../font/S-core/S-CoreDream-6Bold.ttf') format('truetype'),
       url('../font/S-core/S-CoreDream-6Bold.woff') format('woff'),
       url('../font/S-core/S-CoreDream-6Bold.woff2') format('woff2');
}
@font-face {
  font-family: 'S-Core';
  font-weight:700;
  src: url('../font/S-core/S-CoreDream-7ExtraBold.eot');
  src: url('../font/S-core/S-CoreDream-7ExtraBold.eot?#iefix') format('embedded-opentype'),
       url('../font/S-core/S-CoreDream-7ExtraBold.svg#S-CoreDream-7ExtraBold') format('svg'),
       url('../font/S-core/S-CoreDream-7ExtraBold.ttf') format('truetype'),
       url('../font/S-core/S-CoreDream-7ExtraBold.woff') format('woff'),
       url('../font/S-core/S-CoreDream-7ExtraBold.woff2') format('woff2');
}
@font-face {
  font-family: 'S-Core';
  font-weight:800;
  src: url('../font/S-core/S-CoreDream-8Heavy.eot');
  src: url('../font/S-core/S-CoreDream-8Heavy.eot?#iefix') format('embedded-opentype'),
       url('../font/S-core/S-CoreDream-8Heavy.svg#S-CoreDream-8Heavy') format('svg'),
       url('../font/S-core/S-CoreDream-8Heavy.ttf') format('truetype'),
       url('../font/S-core/S-CoreDream-8Heavy.woff') format('woff'),
       url('../font/S-core/S-CoreDream-8Heavy.woff2') format('woff2');
}
@font-face {
  font-family: 'S-Core';
  font-weight:900;
  src: url('../font/S-core/S-CoreDream-9Black.eot');
  src: url('../font/S-core/S-CoreDream-9Black.eot?#iefix') format('embedded-opentype'),
       url('../font/S-core/S-CoreDream-9Black.svg#S-CoreDream-9Black') format('svg'),
       url('../font/S-core/S-CoreDream-9Black.ttf') format('truetype'),
       url('../font/S-core/S-CoreDream-9Black.woff') format('woff'),
       url('../font/S-core/S-CoreDream-9Black.woff2') format('woff2');
}

/* 폰트 */



body{font-family:'돋움',Dotum,'굴림',Gulim,Helvetica,sans-serif}
body, input, textarea, select, button, table, h1, h2, h3, h4, h5{font-size:14px; line-height:1.267em}

/* HTML Default */
article, aside, figcaption, figure, footer, header, hgroup, nav, section {display:block}
mark{background:#FF0;color:#000}
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, font, 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, article, aside, hgroup, header, footer, figure, figcaption, nav, section { margin:0; padding:0; border:0; font-size:100%;}
blockquote, q { quotes:none; }
blockquote:before, blockquote:after,q:before, q:after { content:''; }
a {margin:0; padding:0; text-decoration:none;}
button { margin:0; padding:0; border:0; font:inherit; color:inherit; background:transparent; overflow:visible; cursor:pointer; line-height:1; }
button::-moz-focus-inner { margin: -1px; padding: 0; }
table {border-collapse:collapse; border-spacing:0; width:100%;}
h1, h2, h3, h4, h5 {font-weight:normal; font-family:'S-Core';}
img, select, input, button {vertical-align:middle;}
input, select { color:inherit; font:inherit; line-height:100%; }
textarea { resize:vertical; font:inherit; overflow-y:auto; }
html {-webkit-text-size-adjust:none; -moz-text-size-adjust:none; -ms-text-size-adjust:none; text-size-adjust:none;}
.hid, legend, hr {position:absolute; left:-10000%; top:0; overflow:hidden; width:1px; height:1px; font-size:0; line-height:0; text-indent:-10000px;}
caption {visibility:hidden; overflow:hidden; width:0; height:0; font-size:0; line-height:0;}
body {margin:0; padding:0; font-size:14px; word-break:break-all; -webkit-text-size-adjust:none;}
ul, ol, li, figure {list-style-type:none; margin:0; padding:0;}
cite, blockqoute {display:block; font-style:normal;}
figcaption { display:none;}



/* 헤더 */
.intro_wrap{width:100%; min-width:1020px; min-height:960px; font-family:'S-Core'; letter-spacing:-1px;  background:url('../images/bg.png') no-repeat center center;  background-size:cover;}
.intro_wrap .header{height: 90px;} 
.intro_wrap .header .layout {width: 1400px; margin: 0 auto; position: relative; height: 100%;}
.intro_wrap .header h1{margin:0 auto; text-align:center; line-height: 90px;}
.intro_wrap .container{width:1400px; margin:0 auto; border-top:1px solid #ccc;}
.intro_wrap .container h2 {text-align: center;color: #fff;font-size: 25px;padding: 20px 0 10px;text-shadow: 3px 3px 3px #333;}
.intro_wrap .container .con_left {width: 100%;}
.intro_wrap .container .con_right {width: 100%;}


/* link_box */
.intro_wrap .link_box {margin: 10px auto 0;}
.intro_wrap .link_box ul {display: inline-block; margin: 20px auto; width: 100%; box-sizing: border-box;}
.intro_wrap .link_box ul li {float: left;color: #fff;margin-right:2%;font-size: 18px;width: 49%;border: 1px solid #fff;box-sizing: border-box; position: relative;}
.intro_wrap .link_box ul li a {display: block; width: 100%; height: 100%; font-weight: 300; color: #fff; padding: 3px 0px 0px 59px;}
.intro_wrap .link_box ul li::before {content: ''; width: 50px; height: 50px; display: block; background: url(../images/enter_btn.png) center no-repeat; background-size: 50px 50px; position: absolute; right: 50px;}
.intro_wrap .link_box ul li:hover::before {transform: translateX(5px);}
.intro_wrap .link_box ul li:hover::before {
            -webkit-transition: all 0.5s ease; 
            -moz-transition: all 0.5s ease; 
            -o-transition: all 0.5s ease; 
            transition: all 0.5s ease; 
            -ms-transition: all 0.5s ease;
}
.intro_wrap .link_box ul li:last-child {margin-right: 0;}


/*바로가기*/
.list_box{display: flex;align-items: stretch;margin-top: 20px;overflow:hidden;flex-wrap: wrap;gap: 10px;}
.list_box > div{position:relative;width: calc(100%/3 - 6.75px);}
.list_box > div.list01{margin-left:0;}
.list_box > div.list01 {background: linear-gradient(90deg, #5948f5, #7e60f6 )}
.list_box > div.list01 a {background: rgba(50,36,177,0.55);}
.list_box > div.list01 a:hover {background: rgba(50,36,177,0.7);}
.list_box > div.list01 a::before {content: ''; display: block; position: absolute; bottom: 10px; right: 15px; width: 24px; height: 24px; background: url(../images/arrow_01.png) center no-repeat;}

.list_box > div.list02 {background: linear-gradient(90deg, #0470dc, #13c2fc )}
.list_box > div.list02 a {background: rgba(7,63,120,0.55);}
.list_box > div.list02 a:hover {background: rgba(7,63,120,0.7);}
.list_box > div.list02 a::before {content: ''; display: block; position: absolute;  bottom: 10px; right: 15px; width: 24px; height: 24px; background: url(../images/arrow_02.png) center no-repeat;}

.list_box > div.list03 {background: linear-gradient(90deg, #f76b1c, #fab461 )}
.list_box > div.list03 a {background: rgba(187,70,4,0.55);}
.list_box > div.list03 a:hover {background: rgba(187,70,4,0.7);}
.list_box > div.list03 a::before {content: ''; display: block; position: absolute;  bottom: 10px; right: 15px; width: 24px; height: 24px; background: url(../images/arrow_03.png) center no-repeat;}

.list_box > div .list_img {text-align: center; padding: 20px 0 0px;}
.list_box > div h3{padding:7px 0 13px; text-align:center; font-size:22px; color:#fff;}
.list_box > div .list_btn {padding: 0 30px;}
.list_box > div .list_btn a {display: block; width: 100%; padding: 15px 30px; border-radius: 5px; color: #fff; box-sizing: border-box; font-size: 16px;position: relative;}
.list_box > div .list_btn:hover a::before {transform: translateX(5px);}
.list_box > div .list_btn:hover a::before {
            -webkit-transition: all 0.5s ease; 
            -moz-transition: all 0.5s ease; 
            -o-transition: all 0.5s ease; 
            transition: all 0.5s ease; 
            -ms-transition: all 0.5s ease;
}

.list_box > div.list02 {padding: 10px 20px;}
.list_box > div.list02 .tit {text-align: left;font-size: 30px;color: #fff;width: 100%;}
.list_box > div.list02 .tit2 {text-align: left;font-size: 24px;color: #fff;padding: 7px 0 0;}
.list_box > div.list02 ul {display: inline-block;width: 100%;margin: 20px 0 0;}
.list_box > div.list02 ul::after {content: ''; display: block; clear: both;}
.list_box > div.list02 ul li {width: 100%;float: left;font-size: 16px;padding: 0 0 8px 8px;position: relative;margin-bottom: 5px;color: #fff;}
.list_box > div.list02 ul li::before {content: '';display: block;width: 2px;height: 12px;background: #fff;position: absolute;left: 0;top: 3px;}
.list_box > div.list02 ul li span {display: inline-block;color: #fff;}
.list_box > div.list02 ul li span.txt1 {width: 10%;min-width: 65px;}
.list_box > div.list02 ul li span.txt2 {float: right;}

.info_box {width: 100%;padding: 10px 20px;background: rgba(255,255,255,0.98);float: left;}
.info_box .tit {font-size: 30px;color: #005596;float: left;width: 100%;}
.info_box .tit2 {font-size: 24px;color: #005596;padding: 7px 0 0;}
.info_box ul {display: inline-block;width: 100%;margin: 0 auto;}
.info_box ul::after {content: ''; display: block; clear: both;}
.info_box ul li {width: 100%; float: left; font-size: 16px; padding: 0 0 8px 8px; position: relative; margin-bottom: 5px;}
.info_box ul li::before {content: ''; display: block; width: 2px; height: 12px; background: #005596; position: absolute; left: 0; top: 3px;}
.info_box ul li span {display: inline-block; color: #005596;}
.info_box ul li span.txt1 {width: 10%;min-width: 65px;}
.info_box ul li span.txt2 {float: right;}

.info_box2 {width: 32%;float: right;background: rgba(255,255,255,0.98);height: 200px;margin: 30px 0;text-align: center;display: table;vertical-align: middle;border: 5px solid cornflowerblue;}
.info_box2 .img {margin: 25px 0 0;}
.info_box2 .tit{font-size: 21px;padding: 10px 0 10px;background: cornflowerblue;color: #fff;line-height: 1.2;margin-top: 10px;}
.info_box2 .num{font-size: 23px; margin-top: 15px;}


/* 210128 추가*/
.intro_wrap .container .con_right .link_box ul li {width: 100%;}
.intro_wrap .container .con_right h2 {font-size: 25px;}

.con_right .list_box{margin-top: 20px;overflow:hidden;height: auto;}
.con_right .list_box > div{position:relative;width: 90%;padding: 20px 0;}
.con_right .list_box > div.list04 {background: linear-gradient(90deg, #08b58c, #29ffb3 )}
.con_right .list_box > div.list04 a {background: rgba(16,145,114,0.55);}
.con_right .list_box > div.list04 a:hover {background: rgba(16,145,114,0.7);}
.con_right .list_box > div.list04 a::before {content: ''; display: block; position: absolute;  bottom: 10px; right: 15px; width: 24px; height: 24px; background: url(../images/arrow_04.png) center no-repeat;}


.con_right .list_box > div.list05 {width: 100%;background: linear-gradient(90deg, #08b58c, #29ffb3 )}
.con_right .list_box > div.list05 h3 {/* margin-top: 30px; */font-size: 20px;}
.con_right .list_box > div.list05 h3:last-child {font-size: 26px; word-break: keep-all;}
.con_right .list_box > div.list05 p {width: 100%; text-align: center; font-size: 16px;  }
.con_right .list_box > div.list05 p.list_img img {width: 100px;}
.con_right .list_box > div.list05 p.txt {background: rgba(16,145,114,0.55);padding: 10px;color: #fff;border-radius: 5px;width: 50%;margin: 0 auto;}
.con_right .list_box > div.list05 .fB + .fB {margin-top:1rem;}

.con_right .list_box > div .list_img {text-align: center; padding: 20px 0 0px;}
.con_right .list_box > div h3{padding:7px 0 13px; text-align:center; font-size:25px; color:#fff;}
.con_right .list_box > div .list_btn {padding: 0 30px; margin-bottom: 10px;}
.con_right .list_box > div .list_btn a {display: block; width: 100%; padding: 15px 30px; border-radius: 5px; color: #fff; box-sizing: border-box; font-size: 18px;position: relative;}
.con_right .list_box > div .list_btn:hover a::before {transform: translateX(5px);}
.con_right .list_box > div .list_btn:hover a::before {
            -webkit-transition: all 0.5s ease; 
            -moz-transition: all 0.5s ease; 
            -o-transition: all 0.5s ease; 
            transition: all 0.5s ease; 
            -ms-transition: all 0.5s ease;
}
.con_right .info_wrap {margin-left: 20px; border-left: 1px solid #fff; height: 200px; margin: 30px 0 30px 20px;}
.con_right .info_box {width: 90%;min-height: 200px; margin: 0 0 0 5%;}
.con_right .info_box {padding: 30px 25px;}
.con_right .info_box ul {display: inline-block; width: 100%; margin: 0 0; padding: 0 0;}
.con_right .info_box ul::after {content: ''; display: block; clear: both;}
.con_right .info_box ul li {font-size: 16px; padding: 0 0 8px 8px; position: relative; margin-bottom: 5px; width: 100%; line-height: 1.2;}
.con_right .info_box ul li::before {content: ''; display: block; width: 2px; height: 12px; background: #005596; position: absolute; left: 0; top: 3px;}
.con_right .info_box ul li span {display: inline-block; color: #005596;}



@media screen and (max-width:1400px) {	
			
	
	.intro_wrap {min-width:320px;}
	.intro_wrap, .container {-webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -ms-transition:all 0.3s ease; transition:all 0.3s ease;}	
	.intro_wrap .container {width:90%; overflow: auto;}	
    .intro_wrap .header .layout {width: 90%;}
    .list_box {margin-top: 30px;}
    .intro_wrap .link_box ul li a {padding: 3px 0px 0px 30px;}
    .intro_wrap .link_box ul li::before {right: 30px;}

}


@media screen and (min-width:1200px) and (max-width:1399px) {

    .con_right .list_box > div.list05 h3:last-child {font-size: 22px; word-break: keep-all;}
}



@media screen and (max-width:1199px) {		
	.list_box {gap:20px;}	
	.list_box > div{width: calc(50% - 10px);}
	.list_box > div.w100 {width:100%;}
	.list_box > div.list03{margin-left:0;}
    .info_box ul {padding: 0 30px;}
    
    .intro_wrap .container .con_left {width: 100%;}
    .intro_wrap .container .con_right {width: 100%;}
    .con_right .list_box {border: none;  margin-left: 0;}
    .con_right .list_box > div {width: 100%; margin-left: 0;}
     .con_right .info_wrap {border: none; margin-left: 0;}
    .con_right .info_box {margin: 0; width: 100%; height: auto;}
    .con_right .list_box > div {height: auto; min-height: auto;}
    .con_right .list_box > div.list05 {width: 100%;} 
    .info_box .tit {float: none;width: 100%;text-align: center;margin-bottom: 20px;font-size: 24px;}
    .info_box .tit2 {font-size: 18px;}
	.info_box .tit br {display: none; width: 100%;}
    .info_box ul {float: none; width: 100%;}


}

@media screen and (max-width:900px) {
    .list_box > div {width: 100%;padding: 20px 0;height: auto;margin-left: 0;}
    .intro_wrap .link_box ul li a {padding: 3px 0px 0px 20px; font-size: 16px;}
    .intro_wrap .link_box ul li::before {right: 10px;}

}


@media screen and (max-width:720px) {
    .intro_wrap .link_box ul li {width: 100%; margin-right: 0; margin-bottom: 5px;}
    .info_box {padding: 20px 10px; width: 100%;}
    .info_box ul {padding: 10px 20px;}
    .info_box ul li {width: 100%;}
    .info_box2 {width: 100%; margin: 20px 0;}
}


@media screen and (max-width:640px) {
		
	/*상단텍스트*/
	.intro_wrap .container h2{font-size:20px;}
    .info_box {padding: 20px 0; margin: 0 0;}
	.list_box > div h3{font-size:20px;}
    .info_box ul li {font-size: 15px;}
    .intro_wrap .container .con_right h2 {font-size: 20px;}

	.con_right .list_box > div.list05 p.txt {width: 80%;}
}

@media screen and (max-width:480px) {
	

.info_box ul li span.txt1 {width: 10%; min-width: 60px; display: block; margin-bottom: 10px;}
.info_box ul li span.txt2 {float: right;}
}


@media screen and (max-width:380px) {
	
	/*바로가기*/
    
    .intro_wrap .header ul li {font-size: 15px;}
    .intro_wrap .link_box ul li a {padding: 3px 0px 0px 10px; font-variant-caps: 15px;}
    .intro_wrap .link_box ul li::before {right: 0px;width: 40px;height: 40px;background-size: 40px 40px;}
    .intro_wrap .link_box ul li a img {width: 40px;}
    .list_box > div h3 {font-size: 18px;}
    .list_box > div .list_btn a {font-size: 15px;}
    
}