@import url(https://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);
@font-face {
    font-family: 'Arita-buri-SemiBold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/Arita-buri-SemiBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body {
	/*padding:0!important;*/
	font-family: NanumSquare, sans-serif;
    /*font-family: 'Noto Sans Korean';
    font-size: 14px;
    font-weight: 400;*/
    font-size:14px;
}
    body * {
        word-break: keep-all !important;
    }

.direct-popup .visible-popups > .each > .bottom {
    font-size: 16px;
}

#unit1066 #daumRoughmapContainer1624445499325 {width:100% ! important;}
#unit1066 #daumRoughmapContainer1624445527877 {width:100% ! important;}
#unit1066 #daumRoughmapContainer1624445573933 {width:100% ! important;}
#unit2291 #daumRoughmapContainer1624611519687 {width:100% ! important;}
#unit7165 .intro_04 {line-height:1.8; font-size:20px;}
#unit7165 .intro_04 li {text-indent:-20px; padding-left:20px;}

#top-header {
    height:100%;
}
#top {
    width: 90%;
    margin: auto;
    height: 100px;
    position: relative;
    border-bottom: 1px solid #ddd;
}
#top-quickmenu { margin: 0; overflow: hidden; width: auto; float: right; }
#top-quickmenu ul { float:right; }
#top-quickmenu ul li { display:inline-block; padding:0px 10px 0px 10px; line-height:1; }
#top-quickmenu ul li { border-right:1px solid #000; }
#top-quickmenu ul li:last-child { border:0px; }
#top-quickmenu ul li a { color:#000; transition:all 0.3s ease; text-decoration:none; font-size:16px; font-weight:bold; }
#top-quickmenu ul li a:hover { /*color:#333;*/ }
#top-header-left {
    /*width: 20%;*/
    width: fit-content;
    top: 50%;
    transform: translate(0, -50%);
}
#top-header-left img {
    max-height:56px;
    object-fit:contain;
}
#top-header-right { display: flex; top: 50%; white-space: nowrap; text-align: right; float: right; transform: translate(0, -50%); width: fit-content; justify-content: flex-end; align-items: center; padding-top: 5px; }

#dimodePage #top, #dimodePage #footer {
    display: none !important;
}

.all-menu-text {
    display: inline-block;
    /*top: 20px;*/
    margin: 0;
    position: relative;
    color: #999;
}
#top-header-right img {
    position: relative;
    /*top: 20px;*/
}
#all-menus {
    margin-left: 3px;
    /*position: relative;
    top: 50%;
    transform: translate(0, -50%);*/
}
.container-fluid {
    padding: 10px 0 !important;
    position: relative;
    height: 100%;
}

#bottom .container { width: 1600px; }
#bottom { background:#000; }
#footer .container { width: 1600px; position:relative; }

#bottom { padding:10px 0px; margin-top:40px;}
#bottom a, #bottom p { color:#B7B7B7; font-size:14px; text-decoration:none; margin-bottom:0px;  }
#bottom span { color: #B7B7B7; position:relative; margin-left:5px; margin-right:5px; top:-2px; font-size:10px; }
#bottom img { margin-left:20px; }

#footer { padding:60px 0px; background-color:#000; margin-top:150px; }
#footer * { color:#fff; }
#footer p { font-size:17px; font-weight:600; text-align:center;}
#footer p a { text-decoration:none; }
#footer p:last-child { margin-bottom:0px; }
#footer p span { position:relative; margin-left:5px; margin-right:5px; font-size:14px; top:-2px; }
#footer hr { width:40px; border:1px solid #777; margin:20px 0px; }

.no-subul-li  { float:left; border-bottom:none!important; width:33.333%; text-align:center!important;}
.no-subul-li > a {width: auto!important; ; }
#menubar .dept3 { display: inline-block; margin: 0px 0px 0px 20px; padding: 0px; width: 80%; text-align: left; vertical-align:middle; }
#menubar .dept3 li { display: inline-block; padding: 0px 14px 0px 0px; color: #424242; font-size: 17px; line-height: 35px; }
#menubar .dept3 a { color:#333!important; text-decoration:none; }
#menubar .dept3 a:hover { color:#00A9E0!important; transition:0.2s all; }
#menubar li { list-style:none; }
#menubar { background: #fff; width: 100%; position: fixed; left: 0px; z-index: 500; text-align: left; box-shadow: rgba(113, 113, 113, 0.28) 0px 0px 5px 0px; border-bottom: 1px solid #ddd !important; padding: 35px 0px; display: none; top: 124px; transition:.2s all; }
#menubar .row { padding:0; }
#menubar > div > div > li > a { vertical-align:middle; display: inline-block; padding: 5px 20px; text-decoration: none; font-size: 18px; color: #0c6ab3; border-radius: 5px; font-weight: 400; min-width: 100px; text-align: center; width:165px;     word-break: keep-all; vertical-align:middle; }
#menubar > div > div > li { padding: 5px 0; list-style: none; text-align: left; border-bottom: 1px solid #dcdcdc; }
#menubar > div > div > li > a:hover { color:#1F4860; transition: 0.4s all; }

.depth1 { text-align: center; position: absolute; z-index: 100; width: 90%; height: 73px; /*overflow:hidden;*/ transition: all 0.3s ease; margin-top: 15px; justify-content: center; display:flex;}
/*.depth1.active { height:700px; }*/
.depth1 > li { float:left; padding:15px 0px; position:relative; vertical-align:top; width:13%; text-align:center; height:auto;white-space:nowrap;}
.depth1 > li > a { color:#000; text-decoration:none; font-size:20px; font-weight:600; }

#gnb {
    width: 70%;
}
#gnb > ul > li > a:after {
    opacity: 0;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center;
}

    #gnb > ul > li > a:after {
        content: "";
        position: absolute;
        top: 0px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        width: 35px;
        height: 4px;
        background: #4c5a74;
        -webkit-transition: 300ms;
        transition: 300ms;
    }

/*#gnb > ul > li.active > a:after,*/
#gnb > ul > li:hover a:after {
    opacity: 1;
    -webkit-transform: scale(1) translateX(-50%);
    -ms-transform: scale(1) translateX(-50%);
    transform: scale(1) translateX(-50%);
}

.gnb2 { height:0px;	background:rgba(245,245,245); width:100%; position:absolute; top:100px; left:0px; z-index:99; overflow:hidden; /*border-bottom:1px solid #ddd;*/ }
.depth2 { list-style:none; margin-top:30px; /*height:600px;*/ border-left:1px solid #ddd; transition:all 0.2s ease; white-space:nowrap; }
/*.depth1 > li.active > .depth2, .depth2:hover { background:rgba(225,225,225,0.7); }*/
/*.depth1 > li:last-child  .depth2 { border-right:1px solid #ddd; }*/
.depth2 > li { text-align:left; padding:2px 0px; }
/*.depth2 > li > a { color:#555; text-decoration:none; font-size:14px; font-family:'nanumsquare'; letter-spacing:-1px; }
    .depth2 > li > a:hover,
    .depth2 > li:hover > a {color:#0c6ab3; font-weight:600;}*/

/*#gnb > .depth1 > li[tabindex='7']  .depth3 { display:none;}*/
.depth3 { list-style:none; padding-left:5px; }
.depth3 li { text-align:left; }
.depth3 li a { font-size:14px; text-decoration:none; color:#777; text-decoration:none; transition:all 0.2s ease; }
.depth3 li a:hover { color:#003d61; }

.snb { text-align:center; margin-top:30px; margin-bottom:15px;  }
.snb li:first-child { border-left:0px; }
.snb li:last-child { border-right:0px; }
.snb li { display:inline-block; padding:0px 15px; border-left:1px solid #ddd; border-right:1px solid #ddd; }
.snb li a { color:#777; text-decoration:none; transition:all 0.3s ease; font-size:16px;  font-weight:600;  }
.snb li a:hover { color:#333; }

.snb2 { text-align:center; margin-bottom:20px; }
.snb2 li a { color:#777; font-size:14px; }
.snb2 li { display:inline-block; padding:0px 10px; border-right:1px solid #ddd; }
.snb2 li.active a { font-weight:600; }
.snb2 li:last-child { border:0px; }

.top-btn { position:absolute; right:90px; top:-60px; cursor:pointer; z-index:1;  }
.all-menu { cursor:pointer; }

.subal {width: 220px;/*padding: 18px 10px;*/ background-color: #fff;color: #fff; position: relative;left: 50%; z-index: 9999!important; visibility: hidden;
    -webkit-transform: translateX(-50%);-ms-transform: translateX(-50%);transform: translateX(-50%);opacity: 0;top: 30px;-webkit-transition: opacity .2s ease-in-out,top .2s ease-in-out;
    -moz-transition: opacity .2s ease-in-out,top .2s ease-in-out;-o-transition: opacity .2s ease-in-out,top .2s ease-in-out;transition: opacity .2s ease-in-out,top .2s ease-in-out;
    word-break: keep-all; /*border-radius:5px;*/ box-shadow: rgba(104, 103, 103, 1.0) 0px 0px 5px; }
/*.subal:before {
    content: '';position: absolute; left: 50%;top: -8px;
    border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid #fff;-webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);transform: translateX(-50%); -webkit-transition: opacity .2s ease-in-out;-moz-transition: opacity .2s ease-in-out;
    -o-transition: opacity .2s ease-in-out; transition: opacity .2s ease-in-out; }*/
.subal li { height:auto; text-align:center; font-size:17px; padding:12px 10px; line-height:normal; font-weight:bold;}
.subal a { text-decoration:none; color:#555; }
.subal li:hover { background:#81a2d5; transition:.3s all; }
.subal li:hover a { color:#fff; transition:.3s all; }



/*»çÀÌÆ®¸Ê*/
.site-map {background: white; transition: 0.3s all; width: 100%;position: fixed;top:0;left:0;z-index: 998; top:0px;  height:0; overflow:hidden; }
.site-map h1 { text-align:center; letter-spacing: 50px; margin-left: 50px; margin-bottom:20px; margin-top:40px;  }
.site-map .container-fluid { position:relative; }
.site-map i.fa-times { position:absolute; top:50px; right:25px; font-size:45px; cursor:pointer; z-index:2; }
.site-map .depth3 {padding-left: 30px;}
.site-map .depth3 > a {color: #555 !important;}
.site-map .navbar-nav{position: relative;left: 50%; transform: translate(-50%);}
.site-map .navbar-nav > li {padding:25px 30px;text-align: left !important;border-right: 1px solid #F2F2F2;}
.site-map .navbar-nav > li:first-child {border-left: 1px solid #F2F2F2;}
.site-map .navbar-nav > li > a {padding: 10px 0px;color: black;font-size: 20px; cursor: inherit;}
.site-map .navbar-nav > li  > ul >  li >  a {font-size: 18px;color: black;line-height: 1.7; }
.site-map .navbar-nav > li  > ul >  li > ul > li > a { font-size:16px; line-height: 1.7; color:#555; }
.site-map hr {margin: 5px 0px 20px 0px;border: 2px solid #0c6ab3;width: 65px;}
.nav > li > a:focus, .nav > li > a:hover {background:none!important;}

.depth3-nav { margin:5px auto 25px; text-align:right; padding:0px 15px; }
#dLabel { padding:4px 8px; }
.depth3-nav .dropdown-menu { 
    left:inherit;
    right:15px; 
    font-size:15px; 
}

@media(max-width:1620px)
{
		#bottom .container { width:100%; }
		#footer .container { width:100%; }
}

@media (max-width:1645px) and (min-width:1200px) {
    #top-header-left {
        width: 18%;
        /*width: fit-content;*/
        top: 50%;
        transform: translate(0, -50%);
    }
    #gnb { width:75%;  }
    #top-header-right { width:fit-content; }
    .depth1 > li > a, #top-quickmenu ul li a { font-size: 15px; }
    #top-header-left img {
        /*height: 56px !important;
        width: 234px !important;
        max-width: unset;
        max-height: unset;*/
    }
    .gnb2 { top:101px; }
    .depth1 { height: 60px; width: 85%; }
    .depth2 { margin-top:38px; padding-left:0px; }
    .depth2 > li > a { font-size:13px; }
}


@media (max-width:1199px) and (min-width:992px) {
    #gnb { /*width:100%;*/width:70%;}
    #top-header-left { 
        /*margin-top:-35px; width:25%;*/
        width: 17%;
        /*width: fit-content;*/
    }
        #top-header-left img {
            /*height: 56px !important;
            width: 234px !important;
            max-width: unset;
            max-height: unset;*/
        }
    #top { /*padding-bottom:81px; padding-top:50px;*/width:100%; }
    .depth1 { /*height:45px; margin-top:10px;*/ }
    .depth1 > li {width:12%;}
    #top-quickmenu ul li { padding: 0px 5px 0px 5px; }
    .depth1 > li > a, #top-quickmenu ul li a { font-size: 15px; }
    .depth2 { margin: 17px 0px; }
    .gnb2 { top:132px; }
    #top-header-right {padding-top:2px;}
    
}

@media (max-width:991px) and (min-width:768px) {
    #top { 
        /*padding-bottom:44px;*/
        width: 95%;
    }
    #top-quickmenu { /*margin-top:15px;*/ }
    #top-header-right { width: 20%; padding-top: 5px; }
    #top-header-left { /*margin-top:-30px;*/ width: 25%; padding: 0; }
    #gnb { margin-top:0; /*width:100%;*/ width:75%; }
    .depth1 {
        height: 45px;
        /*margin-top: 40px;*/
    }
    .depth1 > li > a { font-size:14px; }
    .gnb2 { top:100px; border-bottom:0px; }
    .depth2 { padding-left:5px; margin-top:14px; }
    .depth2 > li > a { font-size:15px; }
    #top-header-left img {
        /*height: 56px !important;
        width: 234px !important;
        max-width: unset;
        max-height: unset;*/
    }
}


@media(max-width:767px)
{
    #top { border-bottom:1px solid #ddd;height:60px;width:100%; }
    #top .container-fluid { padding:0px; }
    #top-header-left { padding-top:0; width:45%; }
        #top-header-left a img {
            height: 40px;
        }
    #top-header-right {
        height: 100%;
        padding: 0;
        justify-content: flex-start;
    }
    #bottom .container { width:100%; }
    #footer .container { width:100%; }

    #bottom a, #bottom p { font-size:12px; }
    .all-menu { display:none; }
    .top-btn { top:-45px; width:40px; right:20px; }

    #footer { padding-top:45px; padding-bottom:30px; }
    #footer p { word-break:keep-all; font-size:11px; margin-bottom:0px;  }
    #footer hr { margin:10px 0px; }
    .mm-menu { background:#5079af; color:#fff; font-weight:600; }
    .mm-menu .mm-navbar a, .mm-menu .mm-navbar>* { color:#fff; font-weight:600; }
    .mm-menu.mm-offcanvas { width:60%; }
    .mm-menu .mm-listview > li .mm-next:after { border-color:#fff; }
    .my-menu-login { padding:10px 20px; text-align:right; boreder-bottom:2px solid #fff; }
    .my-menu-login a { display:inline-block !important; font-size:16px !important; border:0px !important; box-shadow:none !important;  color:#fff !important; }
    .mm-listview > li > a, .mm-listview > li > span { font-size:16px; }

    #top-header-right img {
        top: 50%;
        transform: translate(0, -50%);
    }
    .gnb2 { border-bottom:0px; }
    
    #top-quickmenu { margin-top:5px; margin-bottom:-5px; }
    #top-quickmenu ul li { padding:0px 4px 0px 3px; }
    #top-quickmenu ul li a { font-size:12px;  }
    #top-quickmenu img { width:22px; }
}

@media(max-width:500px) {
    #top-header-left {
        width: 60%;
    }
}