@charset "urf-8";

body {font-family:'Noto Sans KR','Malgun Gothic', dotum, sans-serif;font-size:15px;}
/*============== font ===============*/
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 100;
	src:url(/fonts/NotoSansKr/NotoSansKR-Thin.woff2) format('woff2'),
		url(/fonts/NotoSansKr/NotoSansKR-Thin.woff) format('woff'),
		url(/css/fonts/NotoSansKr/NotoSansKR-Thin.otf) format('opentype');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 300;
    src:url(/css/fonts/NotoSansKr/NotoSansKR-Light.woff2) format('woff2'),
        url(/css/fonts/NotoSansKr/NotoSansKR-Light.woff) format('woff'),
        url(/css/fonts/NotoSansKr/NotoSansKR-Light.otf) format('opentype');
    }
@font-face {
	 font-family: 'Noto Sans KR';
	 font-style: normal;
	 font-weight: 400;
	 src:url(/css/fonts/NotoSansKr/NotoSansKR-Regular.woff2) format('woff2'),
     url(/css/fonts/NotoSansKr/NotoSansKR-Regular.woff) format('woff'),
     url(/css/fonts/NotoSansKr/NotoSansKR-Regular.otf) format('opentype');
}
@font-face {
	 font-family: 'Noto Sans KR';
	 font-style: normal;
	 font-weight: 500;
	 src:url(/css/fonts/NotoSansKr/NotoSansKR-Medium.woff2) format('woff2'),
     url(/css/fonts/NotoSansKr/NotoSansKR-Medium.woff) format('woff'),
     url(/css/fonts/NotoSansKr/NotoSansKR-Medium.otf) format('opentype');
}
@font-face {
	 font-family: 'Noto Sans KR';
	 font-style: normal;
	 font-weight: 700;
	 src: url(/css/fonts/NotoSansKr/NotoSansKR-Bold.woff2) format('woff2'),
     url(/css/fonts/NotoSansKr/NotoSansKR-Bold.woff) format('woff'),
     url(/css/fonts/NotoSansKr/NotoSansKR-Bold.otf) format('opentype');
}
@font-face {
	 font-family: 'Noto Sans KR';
	 font-style: normal;
	 font-weight: 900;
	 src:url(/css/fonts/NotoSansKr/NotoSansKR-Black.woff2) format('woff2'),
     url(/css/fonts/NotoSansKr/NotoSansKR-Black.woff) format('woff'),
     url(/css/fonts/NotoSansKr/NotoSansKR-Black.otf) format('opentype');
}

.raj {font-family: 'Rajdhani', sans-serif;}

/*==================== GNB PC ====================*/
/* 메인메뉴 */
#gnb{position:relative}
#gnb h2{position:absolute;font-size:0;line-height:0;overflow:hidden}
#gnb .gnb_wrap{margin:0 auto;position:relative}
#gnb #gnb_1dul {font-size:1.083em;padding: 0;background:#253dbe;zoom:1;
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
-moz-box-shadow:  0 1px 3px rgba(0,0,0,0.3);
box-shadow: 0 1px 3px rgba(0,0,0,0.3)}
#gnb ul:after {display:block;visibility:hidden;clear:both;content:""}
#gnb .gnb_1dli{float:left;line-height:50px;padding:0 15px;position:relative;}
#gnb .gnb_1dli:hover{background:#1a30a7;
-webkit-transition: background-color 2s ease-out;
-moz-transition: background-color 0.3s ease-out;
-o-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;}

.gnb_1dli .bg{display:inline-block;width:10px;height:10px;overflow:hidden;background:url(../img/gnb_bg2.gif) no-repeat 50% 50%;text-indent:-999px}
.gnb_1da {display:inline-block;font-weight:bold;color:#fff;text-decoration:none;}
.gnb_2dli{border-top:1px solid #253dbe}
.gnb_2dli:first-child{border:0}
.gnb_2dul {display:none;position:absolute;top:50px;min-width:140px;background:#1a30a7;padding: 0;
-webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.1);
-moz-box-shadow:  0 1px 5px rgba(0,0,0,0.1);
box-shadow: 0 1px 5px rgba(0,0,0,0.1);}
.gnb_2da {display:block;padding:0 10px;line-height:40px;color:#c3cbf7;text-align:left;text-decoration:none}
a.gnb_2da:hover{background:#0e2080;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;}

.gnb_1dli_air .gnb_2da {}
.gnb_1dli_on .gnb_2da {}
.gnb_2da:focus, .gnb_2da:hover {color:#fff}
.gnb_1dli_over .gnb_2dul {display:block;left:0}
.gnb_1dli_over2 .gnb_2dul {display:block;right:0}
.gnb_wrap .gnb_empty {padding:10px 0;width:100%;text-align:center;line-height:2em;color:#fff}
.gnb_wrap .gnb_empty a{color:#fff;text-decoration:underline}
.gnb_wrap .gnb_al_ul .gnb_empty, .gnb_wrap .gnb_al_ul .gnb_empty a{color:#555}

#gnb .gnb_menu_btn{background:#4158d1;color:#fff;width:50px;height:50px;border:0;vertical-align:top;font-size:18px}
#gnb .gnb_close_btn{background:#4158d1;color:#fff;width:50px;height:50px;border:0;vertical-align:top;font-size:18px;position:absolute;top:-50px;left:0}
#gnb .gnb_mnal{padding:0}

#gnb_all{display:none;position:absolute;width:100%;z-index:99;}
#gnb_all .gnb_al_ul:after {display:block;visibility:hidden;clear:both;content:""}
#gnb_all .gnb_al_ul{background:#fff;border:1px solid #4158d1;padding:20px;
-webkit-box-shadow: 0 2px 5px rgba(0,0,0,0.2);
-moz-box-shadow:  0 2px 5px rgba(0,0,0,0.2);
box-shadow: 0 2px 5px rgba(0,0,0,0.2);}
#gnb_all .gnb_al_li{background:#fff;float:left;min-width:20%;padding:5px }
#gnb_all .gnb_al_li .gnb_al_a{font-size:1.083em;padding:10px;display:block;position:relative;margin-bottom:10px;background: #eff1f9;border-bottom: 1px solid #dee2f1;font-weight: bold;color:#243071}
#gnb_all .gnb_al_li li {padding-left:10px;line-height:2em}
#gnb_all .gnb_al_li li i{color:#9ca6cc}
#gnb_all .gnb_al_li li a{color:#555}
/*==================== SUB LNB ====================*/
/*sub-visual*/
#sub-visual {
    background: #142244;
    background: -moz-linear-gradient(top,  #142244 0%, #2f2c3f 100%);
    background: -webkit-linear-gradient(top,  #142244 0%,#2f2c3f 100%);
    background: linear-gradient(to bottom,  #142244 0%,#2f2c3f 100%);
    height:350px;

}
#sub-visual.sub-bg1 {
    background-image:
    url(/images/sub-bg1.jpg);
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
}
#sub-visual.sub-bg2 {
    background-image:
    url(/images/sub-bg2.jpg);
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
}
#sub-visual.sub-bg3 {
    background-image:
    url(/images/sub-bg3.jpg),
    linear-gradient(to bottom, rgba(41, 49, 68, 1), rgba(56, 112, 145, 1));
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
}
#sub-visual.sub-bg4 {
    background-image:
    url(/images/sub-bg4.jpg),
    linear-gradient(to bottom, rgba(25, 26, 60, 1), rgba(52, 56, 115, 1));
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
}
#sub-visual.sub-bg5 {
    background-image:
    url(/images/sub-bg5.jpg),
    linear-gradient(to bottom, rgba(45, 41, 68, 1), rgba(70, 43, 70, 1));
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
}

#sub-visual h1 {
    color:#fff;
    font-size:44px;
    font-weight:400;
    padding-top:144px;
    text-align:center;
    opacity:0;
    margin-left:-30px;
    animation: subtit-ani ease 1.5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}
#sub-visual h1.black {
    color:#000;
}

/*==================== sitemap ====================*/

/*==================== footer ====================*/
#footer { background:#333; padding:30px 20px; text-align:center; font-size:15px; line-height:1.6;}
#footer a {color:#BBB;}
#footer .copyright_sns { width:100%;}
#footer .copyright_sns ul li {display: inline-block; padding-right:6px;}
#footer .copyright_sns ul li:last-child {padding-right:0;}
#footer .copyright_sns ul li a {display:block; color:#FFF; width:42px; height:42px; font-size:17px; padding-top:10px; border-radius:30px; background-color:rgba(255,255,255,.1);}
#footer .copyright_sns ul li a:hover {background-color:rgba(255,255,255,.3);}
#footer .copyright_logo {width:100%;}
#footer .footer_util {width:100%;}
#footer .footer_util li {display:inline-block; padding-right:2px;}
#footer .footer_util li a {display:block; color:#BBB; font-size:14px; border:1px solid #A0A0A0; padding:3px 10px;}
#footer .footer_util li a:hover {background:#999; border:1px solid #999; color:#FFF;}
#footer .footer_copyright {width:100%; padding:20px 0;}
#footer .footer_copyright li {color:#DDD; display:inline-block; padding-right:20px;}
#footer .footer_copyright li:last-child {padding-right:0;}
#footer .footer_copyright li:nth-last-child(2) {padding-right:0;}
#footer .copy_end {width:100%;padding-top:5px;}

/*sticky footer*/
/* html, body {height: 100%;margin: 0;} */
/* .wrapper {min-height: calc(100% - 323px);} */
/* .footer,.push {height: 50px;} */


/*==================== amimation ====================*/
@keyframes subtit-ani {
    0% {
		opacity: 0;
		margin-left:-30px;
    }
    100% {
		opacity: 1;
		margin-left:0;
    }
}



/*==================== 모바일 GNB ====================*/

.clearfix{*zoom:1;}
.clearfix:after{clear:both; display:block; content:"";}
.blind{overflow:hidden;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0}
.text-ellipsis{overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.trans200{-webkit-transition:all 0.2s;-moz-transition:all 0.2s;-o-transition:all 0.2s;-ms-transition:all 0.2s;transition:all 0.2s}
.trans300{-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s}
.trans400{-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s}
.trans500{-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;-ms-transition:all 0.5s;transition:all 0.5s}
.material-icons{line-height:initial; color:inherit;}
.clearfix {*zoom: 1;}
.blind {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 1px;
    font-size: 0;
    line-height: 0;
}
/* GNB Mobile :: OPEN BUTTON */
.nav-open-btn{
	position:fixed; top:68px; right:-2%; margin-top:-16px; z-index:9998;
	opacity:0;filter:Alpha(opacity=0);
	visibility:hidden;
}
.nav-open-btn .line {
	display:block; width:30px; height:3px; background-color:#0190d6; margin: 4px 0;
	-webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
 }

.nav-open-btn.active{margin-top:-18px}
.nav-open-btn.active .line{background-color:#fff;}
.nav-open-btn.active .line:nth-child(2), .nav-open-btn.active .line:nth-child(4){opacity: 0;}
.nav-open-btn.active .line:nth-child(1){
  -webkit-transform: translateY(7px) rotate(45deg);
  -ms-transform: translateY(7px) rotate(45deg);
  -o-transform: translateY(7px) rotate(45deg);
  transform: translateY(7px) rotate(45deg);
}
.nav-open-btn.active .line:nth-child(3){
  -webkit-transform: translateY(-7px) rotate(-45deg);
  -ms-transform: translateY(-7px) rotate(-45deg);
  -o-transform: translateY(-7px) rotate(-45deg);
  transform: translateY(-7px) rotate(-45deg);
}

#gnbM{
	display:block;
	overflow-y:auto;
	position:fixed;
	top:0px;
	right:-82%;
	width:80%;
	height:100%;
	max-width:280px;
	background-color:#2ea7df;
	z-index:999;
	box-shadow:-2px 1px 11px rgba(0, 0, 0, .3);
	transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);
	-webkit-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);
	-oz-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);
	-ms-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);		/* gnb OPEN 속도 */
	visibility:hidden;
}
#gnbM.open{
	right:0px;
	visibility:hidden;
}
#gnbM #navigation{margin-top:80px;}	/* Header 높이값 */
/* GNB Mobile :: 1차 */
#gnbM #navigation > li{border-bottom:1px solid rgba(255,255,255,0.33);}
#gnbM #navigation > li.active{background-color:#2299d0;}
#gnbM #navigation > li > a {position:relative; display:block; padding:20px 15px; color:#fff; font-size:18px;  }
#gnbM #navigation > li.active > a{color:#fff;}
#gnbM #navigation > li.has-2dep > a{}
#gnbM #navigation > li.has-2dep.active > a{}
#gnbM #navigation > li .gnb-icon{position:absolute; top:50%; right:10px; margin-top:-14px;}
#gnbM #navigation > li .gnb-icon i{font-size:24px;}
/* GNB Mobile :: 2차 */
#gnbM #navigation > li .gnb-2dep{display:none; padding:15px 0; background-color:#2f2f2f; box-shadow:inset 0px 3px 9px rgba(0, 0, 0, .3);}
#gnbM #navigation > li .gnb-2dep > li{}
#gnbM #navigation > li .gnb-2dep > li > a{display:block; color:#fff; font-size:15px; padding:10px 15px; opacity:0.7;filter:Alpha(opacity=70);}
#gnbM #navigation > li .gnb-2dep > li.active > a{opacity:1.0;filter:Alpha(opacity=100);}
/* GNB Mobile :: 3차 */
#gnbM #navigation > li .gnb-2dep > li > .gnb-3dep{display:none; padding:5px 17%; background-color:#aaa; border-top:1px dotted #ddd;}
#gnbM #navigation > li .gnb-2dep > li > .gnb-3dep > li > a{display:block; padding:10px 0; font-size:13px; color:#fff;}
#gnbM #navigation > li .gnb-2dep > li > .gnb-3dep > li > a:before{display:inline-block; content:"-"; margin-right:5px;}

/* -------- Mobile Side Bar -------- */
#topMenuBar{display:none; position:relative;}
#topMenuBar .depth1-tit{overflow:hidden; width:100%; font-weight:500;}
#topMenuBar .depth1-tit a{position:relative; display:block; height:55px; color:#333; padding:0 3%; background-color:#fff; border-bottom:1px solid #cfcfcf;}
#topMenuBar .depth1-tit a span{display:inline-block; line-height:55px; font-size:18px; position:relative;}
#topMenuBar .depth1-tit a span:after{display:inline-block; content:""; width:100%; height:1px; position:absolute; bottom:-1px; left:0; background-color:#00538f;}
#topMenuBar .depth1-tit a .arrow{position:absolute; top:50%; right:2%; margin-top:-10px;}
#topMenuBar .depth1-tit a.open .arrow{transform:rotate(-180deg); margin-top:-14px;}
#topMenuBar .top-menu-list{display:none; width:100%; position:absolute; top:56px; left:0px; z-index:99; background-color:#fff;}
#topMenuBar .top-menu-list li{width:100%; }
#topMenuBar .top-menu-list li a{display:block; height:45px; line-height:45px; padding:0 3%; font-size:16px; border-bottom:1px solid rgba(0,0,0,0.3); color:#333; text-align:left;}
#topMenuBar .top-menu-list li:first-child a{border-top:1px solid rgba(255,255,255,0.3);}
#topMenuBar .gnb-3dep{display:none;}
.nav-open-btn .line {
    display: block;
    width: 30px;
    height: 3px;
    background-color: #fff;
    margin: 4px 0;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

/*sub-lnb*/
.sub-lnb{width:100%;margin-top:-65px;}
.sub-lnb ul {width:1300px;background:#fff;text-align:center;height:65px;margin:0 auto;border-top:4px solid #007dc6;border-bottom: 1px solid #dadbda; max-width:100%;}
.sub-lnb ul li {display:inline-block;}
.sub-lnb ul li a{transition:all .4s;font-size:16px;color:#212126;font-weight:500;height: 61px;line-height: 61px;padding:0 20px;display:inline-block;}
.sub-lnb ul li a:hover {color:#007dc6}
.sub-lnb ul li.active a {color:#32c2c4;border-bottom:1px solid #32c2c4}
/*사이트맵*/
.site-map .site-map-wrap {width:100%;min-height:280px;}
.site-map .site-map-wrap ul {float:left;height:280px;width:calc(20% - 6px);margin-right:3px;margin-left:3px;border:1px solid #cbd2da}
.site-map .site-map-wrap ul li {padding:8px 20px;}
.site-map .site-map-wrap ul h1 + li {padding-top:20px;}
.site-map .site-map-wrap ul li a {font-size:15px;color:#555}
.site-map .site-map-wrap ul li a:hover {font-size:15px;color:#111}
.site-map .site-map-wrap ul h1 {height:54px;line-height:54px;font-size:16px;font-weight:600;color:#fff;text-align:center;width: calc(100% + 2px);margin: -1px;}
.list1 h1,.list4 h1 {background:#8cc33b}
.list2 h1,.list5 h1 {background:#2aa8e2}
.list3 h1 {background:#f5953f}
.list1,.list2,.list3,.list4,.list5 {margin-top:-100px;opacity:0;}
.list1 {
    animation: slidedown ease 2s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}
.list2 {
    animation: slidedown2 ease 2s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}
.list3 {
    animation: slidedown3 ease 2s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}
.list4 {
    animation: slidedown4 ease 2s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}
.list5 {
    animation: slidedown5 ease 2s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}


/*======================== 미디어쿼리 ========================*/

@media all and (max-width:1220px){
    /*서브*/
    #sub_contents {padding-left:20px;padding-right:20px;}
    #sub_contents .container {padding:0;}
    .page-tit {width:100%;font-size:20px;padding:15px 0;margin: 0 auto 25px;}
    /*GNB*/
    #gnb .container > ul > li > a {font-size:19px;}


}

@media (max-width: 1024px){
    /*GNB*/
    #gnb.main-gnb .container {padding:0;}
    #gnb.main-gnb .container > ul > li > a {font-size:18px;font-weight:400;}

}


@media all and (max-width:768px){
    /*서브상단*/
    #sub-visual {height:300px;}
    #sub-visual h1 {font-size:33px;padding-top:118px;}
    /*사이트맵*/
    .site-map .site-map-wrap ul {width:calc(33.3333% - 6px);margin-bottom:6px;}
}
@media all and (max-width:550px){
    /*사이트맵*/
    .site-map .site-map-wrap ul {width:calc(50% - 6px);}
}
@media screen and (max-width:480px) {
     /*서브상단*/
     #sub-visual {height:180px;}
     #sub-visual h1 {font-size:26px;padding-top:98px;}
     .sub-lnb ul li a {font-size:14px;}
     .sub-lnb {margin-top:0}
     .sub-lnb ul {width: 100%;height: auto;padding: 10px 0px;}
    .sub-lnb li {word-break: keep-all;padding:0 7px;}
    .sub-lnb ul li a{height: 30px;line-height:26px;padding: 0;}
     /*사이트맵*/
     .site-map .site-map-wrap ul {width:100%;height:auto;padding-bottom:10px;margin-left:0;margin-right:0;}

    
}