@charset "utf-8";

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	Skip
	
/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
#skip{position:absolute; left:0; top:0; width:100%; margin:0 auto; z-index:999;}
#skip a{display:block; position:absolute; left:0; padding:10px; color:#fff; background:#000;}
#skip a:link,
#skip a:visited,
#skip a:active{top:-10000px;}
#skip a:hover,
#skip a:focus{top:0;}
.hidden{overflow:hidden; position:absolute; line-height:1px; font-size:1px; text-indent:-30000px;}

#ssoIFrm {display:none;}

.layout,
#header,
#header .logo,
#header .logo a,
#header #gnb ul.nav > li > a,
#header .toputil_control,
#header .toputil_control div,
#header .toputil_control a,
#header .search_form,
#header .search_form .form,
#header .search_form .form input[type="text"],
#header .search_form .form input[type="submit"],
#header .search_form .btn_close,
body.sub #visual,
body.sub #visual.sub03 .inner,
body.sub #container .inner,
#lnb,
body.sub #contents,
.innerTop,
.innerTop .satisBox,
#footer,
#footer .layout,
#footer .relate_site,
#footer .relate_site > a,
#footer .relate_site > a:after,
#footer .info,
#footer .info .menu_link,
#footer .info span{transition: all 0.3s ease; -webkit-transition: all 0.3s ease;}

    
#wrap{position: relative; overflow: hidden;}
.layout{position: relative; max-width: 1280px; margin: 0 auto;}
#slide_map{visibility: hidden; opacity: 0; position: fixed; width: 100%; height: 100%; overflow: hidden; top: 90px; right: 0;z-index: 9; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; }

/*header*/
#header{position: relative; left: 0; top: 0; width: 100%; height: 90px; margin-top: 35px; border: none;}
#header .logo{position: absolute; top: 50%; left: 50%; z-index: 51; float: none; width: auto; height: auto; margin-left: -640px; background: none; transform: translateY(-50%);}
#header .logo a{display: inline-block; width: 183px; height: 44px; background: url(../images/layout/logo.svg) no-repeat center center; text-indent: -9999px;}
#header #gnb{position: relative; z-index: 50; width: 100%; height: 90px; padding: 0; overflow: hidden; text-align: left;}
#header #gnb #blind{display: none; position: absolute; width: 100%; height: 0; left: 0; top: 90px; z-index: 1; box-sizing: border-box; background-color: #fff; box-shadow: 0 3px 15px 0 rgba(0, 0, 0, 0.08) inset;}
#header #gnb ul.nav{position: relative; width: auto; max-width: 1280px; padding: 0 0 0 265px; margin: 0 auto; box-sizing: border-box;}
#header #gnb ul.nav > li{position: relative; float: left; width:calc(100% / 6); height: auto; box-sizing: border-box; }
#header #gnb ul.nav > li > a{display: block; height: 90px; font-size: 21px; line-height: 86px; text-align: center; text-decoration: none; color: #2e2e2e; letter-spacing: -0.32px; font-weight: 400;  box-sizing: border-box;}
#header #gnb ul.nav > li > ul{position: relative; padding: 14px 15px 20px; height: auto; opacity: 0; -webkit-opacity:0; background-color: transparent; z-index: 9;}
#header #gnb ul.nav > li > ul:after{content: ""; display: block; position: absolute; width: 1px; height: 100%; background-color: #f3f3f3; left: 0; top: 0;}
#header #gnb ul.nav > li:last-child > ul:before{content: ""; display: block; position: absolute; width: 1px; height: 100%; background-color: #f3f3f3; right: 0; top: 0;}
#header #gnb ul.nav > li > ul > li > a{display: block; padding: 5px 0; color: #010101; text-decoration: none; box-sizing: border-box; font-size: 15px; line-height: 20px; font-weight: 400;}
#header #gnb ul.nav > li > ul >li> ul{display: none;}
#header #gnb > ul > li > a.on,#header #gnb  > ul > li:hover > a,#header #gnb > ul > li:active > a,#header #gnb > ul > li > ul > li:hover> a,#header #gnb > ul > li > ul > li:active> a{color: #004585;}

#header #gnb #blind {display: none !important;}
#header #gnb ul.nav > li > a + ul{display: none !important;}
#header #gnb ul.nav > li > a.on + ul {/* overflow:auto !important; *//* display:block !important; */background-color: #fff;box-shadow: 0 3px 15px 0 rgba(0, 0, 0, 0.1);}


#header .toputil_control{position: absolute; left: 50%; top: -35px; z-index: 50; max-width: 1280px; width: 100%; height: 35px; background-color: #004585; text-align: right; transform: translateX(-50%); -webkit-transform: translateX(-50%);}
#header .toputil_control:after{content: ""; position: absolute; left: -50%; top: 0; display: block; background: #004585; width: 100%; height: 100%; z-index: -1;}
#header .toputil_control:before{content: ""; position: absolute; right: -50%; top: 0; display: block; background: #004585; width: 100%; height: 100%; z-index: -1;}
#header .toputil_control div{display: inline-block; width: auto; height: 100%;margin: 0 auto; }
#header .toputil_control a{position: relative; display: inline-block; float: left; color: #ffffff; text-decoration: none;}
#header .toputil_control a.eng:before,#header .toputil_control a.search_btn_open:before{content: ""; position: absolute; right: 0; top: 0; display: block; width: 1px; height: 100%; background-color: rgba(255,255,255,0.2); cursor: auto;}
#header .toputil_control a:after{content: ""; display: block; clear: both; }
#header .toputil_control a span{display: block; }
#header .toputil_control .eng{padding-right: 17px; vertical-align: top; font-size: 13px; line-height: 35px; box-sizing: border-box;}
#header .toputil_control .search_btn_open{display: inline-block;width: 37px;line-height: 35px;background: url(../images/layout/search_ico.svg) no-repeat center center; text-indent: -9999px;overflow: hidden; color: transparent;}
#header .toputil_control .allmenu_btn_open{display: none;}

#header .search_form{position: absolute;display: none;width: 100%;height: auto;padding: 45px 0;left: 0;top: 90px;box-sizing: border-box;background-color: rgba(0, 69, 133, 0.9);z-index: 999;}
#header .search_form .layout{padding: 0;}
#header .search_form .form{position: relative; width: 100%; max-width: 750px; margin: 0 auto; padding-right: 50px; box-sizing: border-box;}
#header .search_form .form input[type="text"]{display: block; width: 100%; padding: 15px 40px 15px 10px; border: none; color: rgba(255, 255, 255,0.7); border-bottom: 2px solid rgba(255, 255, 255,0.7); vertical-align: middle; box-sizing: border-box; font-size: 20px; font-weight: 400; font-family: 'Noto Sans KR'; background-color: transparent;} 
#header .search_form .form input[type="text"]::placeholder{color: rgba(255, 255, 255,0.7);}
#header .search_form .form input[type="submit"]{ position: absolute; display: block; width: 35px; height: 100%; right: 55px; top: 0; border: none; overflow: hidden; text-indent: -9999px; background:url(../images/layout/search_detail_submit.png) no-repeat center center; cursor: pointer;}
#header .search_form .btn_close{display: block; position: absolute; top: 0; right: 0; width: 35px; height: 100%; border: none; overflow: hidden; text-indent: -9999px; background:url(../images/layout/search_close.png) no-repeat center center; cursor: pointer;}


/*footer*/
#footer{padding: 40px 0; box-sizing: border-box; background-color: #293037; color: #fff; font-size: 14px; z-index:3; }
#footer .layout{position: relative; padding-left: 135px; box-sizing: border-box;}
#footer .layout:before{content: ""; display: block; position: absolute; left: 0; top: 0; width: 120px; height: 60px; background: url(../images/layout/ft_logo.svg) no-repeat center center; background-size: contain;}
#footer .info{ width: calc(100% - 250px);}
#footer .info .menu_link{margin-bottom: 12px;}
#footer .info .menu_link:after{content: ""; display: block; clear: both;}
#footer .info .menu_link li a{text-decoration: none; color: #e2e2e2; font-size: 15px; line-height: 20px;}
#footer .info span{color: #99a3aa; line-height: 20px; font-size: 14px; font-weight: 300;}
#footer .info span.copy{display: block; }

#footer .relate_site{position: absolute;right: 0;top:0;width: 236px;height: 48px;font-family: 'CoreDream';}
#footer .relate_site > a{position: relative;display: block;width: 100%;height: 100%;padding: 0 7%;border: 1px solid rgba(255, 255, 255, 0.8); text-decoration: none;line-height: 46px; color: rgba(255, 255, 255, 0.8);  opacity: 0.8; box-sizing: border-box;}
#footer .relate_site > a:after{content: ""; display: block; position: absolute; width: 20px; height: 15px; right: 18px; top: 50%; margin-top: -7.5px; background: url(../images/layout/relate_ico.svg) no-repeat center center; opacity: 0.8;}
#footer .relate_site > a.on:after{transform: rotate(180deg); }
#footer .relate_site ul{position: absolute; display: none; width: 100%; overflow: auto; background-color: #5c5d5e; z-index: 200; bottom: 48px; box-sizing: border-box; border: none;}
#footer .relate_site ul li{display: block; float: none; width: auto; margin: 0; padding: 7px 7%; border-bottom: 1px solid #000; box-sizing: border-box;}
#footer .relate_site ul li a{width: auto;  height: auto; border: none; color: rgba(209, 209, 209, 0.80); line-height: 19px; text-decoration: none;}

.btn_top {display:none; width:60px; height:60px; background-color:#444; border-radius:50%; -webkit-border-radius:50%; overflow:hidden; position:fixed; right:2%; bottom:35px; z-index:2; color: #fff; font-size: 15px; font-weight: 300; font-family: 'Noto Sans KR'; text-align: center; padding-top: 32px; box-sizing: border-box; opacity: 0.9;}
.btn_top:before{content:""; position: absolute; top: 28%; left: 50%; display: block; width:20px; height: 15px;  background: url(../images/layout/top_btn.svg) no-repeat center center; background-size: contain; transform: translate(-50%,-28%);}



#header #gnb{overflow: visible !important; height: 90px !important;}
#header.active #gnb{}
#header #gnb ul.nav{overflow: visible !important; height: 90px !important;}
#header #gnb #blind{height: 0 !important;}
#header #gnb ul.nav > li > a + ul{display: block !important;}
#header #gnb ul.nav > li > ul{
    opacity: 0 !important; visibility: hidden; display: block !important; width: 100%; height: auto !important; position: absolute; top: 100%; left:-15px;
    transition: all 0.2s linear;
}
#header #gnb ul.nav > li > a.on + ul{opacity: 1 !important; visibility: visible;}
/*Sub*/
.sub{font-size:16px; font-family:'Noto Sans KR','NanumGothic',sans-serif; letter-spacing:-0.2px}

/*Sub header*/
.sub #header .logo{background: none; float: none; height: auto; width: auto; }
.sub #header #gnb{padding: 0; text-align: inherit;}
.sub #header #gnb a{font-weight: 400;}

/*Sub visual*/
body.sub #visual{margin-top: 0; background:url(../images/layout/sub_visual.jpg) no-repeat center center; background-size: cover;}
body.sub #visual .inner {color:transparent; font-size:0; max-width:1280px; height:150px; margin: 0 auto; background:url(../images/layout/sub_visual_txt.png) no-repeat left center !important;}

body.sub #visual.sub02 {background:url(../images/layout/sub_visual02.jpg) no-repeat center center;background-size: cover;}
body.sub #visual.sub03 {background:url(../images/layout/sub_visual03.jpg) no-repeat center center;background-size: cover;}
body.sub #visual.sub04 {background:url(../images/layout/sub_visual04.jpg) no-repeat center center;background-size: cover;}
body.sub #visual.sub05 {background:url(../images/layout/sub_visual05.jpg) no-repeat center center;background-size: cover;}
body.sub #visual.sub06 {background:url(../images/layout/sub_visual06.jpg) no-repeat center center;background-size: cover;}


/*Sub container*/
.sub #lnb{width: 300px;}
.sub #lnb .lnb > li > a{padding:15px 20px 15px 10px; line-height: 1.4;}
.sub #lnb .lnb li a b{top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%);}
.sub #container{max-width: 1280px; width: 100%; margin: 0 auto; font-family:'NanumGothic';}
.sub #container h1, .sub #container h2, .sub #container h3, .sub #container h4, .sub #container h5, .sub #container h6, .sub #container th, .sub #container td, .sub #container input, .sub #container select, .sub #container textarea{font-family:'NanumGothic';}
#contents{width: calc(100% - 360px);}
#contents .conInner .path{display: none;}
.listTable .txPoint a, .listMobile .th02 a{display: block !important;}
.innerTop{max-width: 1440px; margin-bottom: 80px; padding-left: 300px; box-sizing: border-box;}
.innerTop .satisBox{width: 100%;}
.satisBox .infoBox p span span.th01{width: auto; min-width: 143px; }
.satisBox .infoBox p span span.th02{width: auto; min-width: 55px;}
.satisBox .infoBox p span span.th03{width: auto; min-width: 106px;}


@media all and (max-width: 1310px){
    /*sub*/
    #header .logo{left: 30px; margin-left: 0;}
    #header .logo a{width: 165px; height: 40px; background-size: contain;}
    #header #gnb ul.nav{padding: 0 30px 0 25%;}
    #header #gnb ul.nav > li > a{font-size: 20px;}
    
    #header .toputil_control div{padding-right: 30px; box-sizing: border-box;}
    #footer{padding-left: 30px; padding-right: 30px;}
    #footer .layout{padding-right: 0;}
    body.sub #container .inner{padding: 0 30px;}
    body.sub #visual .inner{background-position: center left 30px !important;}
    .innerTop{padding: 0 30px 0 330px; margin-top: 35px;}
    
    /*메인*/
    .layout{padding: 0 25px; box-sizing: border-box;}
    
}


@media all and (max-width: 1024px){
    .btn_top {width: 55px; height: 55px; padding-top: 27px; font-size: 13px; }
    .btn_top:before{width: 17px; height: 12px;}
    
    /*slide_map*/
    .fixed{overflow: hidden;}
    #slide_map{top: 75px;}
    .fixed #slide_map{visibility: visible; opacity: 1; background-color: rgba(0,0,0,0.6); overflow: auto;}
    #slide_map:before{content: ""; position: absolute; display: block; width: 40%; min-width: 280px; height: 100%; right: 0; top: 0; background: #fff;}
    #slide_map .inner{width: 40%; min-width: 280px; position: relative; float: right; padding: 20px; box-sizing: border-box; height: auto; z-index: 10; background-color: #fff;}
    #slide_map .inner .binds{width: auto; height: 100%;}
    #slide_map .inner .binds > ul{width: 100%;}
    #slide_map .inner .binds > ul > li > a{position: relative; display: block; text-decoration: none; border-bottom: 1px solid #d9d9d9; box-sizing: border-box;}
    #slide_map .inner .binds > ul > li > a > span{display: block; font-size: 17px; line-height: 21px; padding: 15px 15px; color: #010101; }
    #slide_map .inner .binds > ul > li > a.on > span,#slide_map .inner .binds > ul > li > a:hover > span,#slide_map .inner .binds > ul > li > a:active > span{color:#004585; font-weight: 500;}
    #slide_map .inner .binds > ul > li > ul{display: none; width: auto; padding: 15px 15px; box-sizing: border-box; background-color: rgba(83, 172, 255, 0.1);}
    #slide_map .inner .binds > ul > li > ul > li{position: relative; padding: 5px 10px 5px 15px; font-size: 15px; line-height: 21px;}
    #slide_map .inner .binds > ul > li > ul > li > a{text-decoration: none; color: #010101;}
    #slide_map .inner .binds > ul > li > ul > li > a:before{content: ""; display: block; position: absolute; width: 3px; height: 3px; background-color: #222; left: 5px; top: 14px; border-radius: 50%; -webkit-border-radius: 50%;}
    #slide_map .inner .binds > ul > li > ul > li > a.on,#slide_map .inner .binds > ul > li > ul > li > a:hover,#slide_map .inner .binds > ul > li > ul > li > ul > li>a:hover, #slide_map .inner .binds > ul > li > ul > li > ul > li>a:active,#slide_map .inner .binds > ul > li > ul > li > ul > li>a.on{color:#004585; }
    #slide_map .inner .binds > ul > li > ul > li > a.on:before,#slide_map .inner .binds > ul > li > ul > li > a:hover:before{background-color:#004585; }
    #slide_map .inner .binds > ul > li > a:after{content: ""; display: block; position: absolute; right: 20px; top: 50%; margin-top: -9px; width: 18px; height: 18px; background: url(../images/layout/mob_gnb_bul.png) no-repeat center center;}
    #slide_map .inner .binds > ul > li > a.on:after{background: url(../images/layout/mob_gnb_bul_on.png) no-repeat center center;}
    #slide_map .inner .binds > ul > li > ul > li > ul{display: none; margin: 10px 0 5px; padding: 7px 7px 7px 20px;background-color: #fff;}
    #slide_map .inner .binds > ul > li > ul > li > ul > li{position: relative; padding: 3px 0;}
    #slide_map .inner .binds > ul > li > ul > li > ul > li > a{text-decoration: none; color: #222; font-size: 14px;} 
    #slide_map .inner .binds > ul > li > ul > li > ul > li > a:before{content: ""; display: block; position: absolute; top: 13px; left: -11px; width: 5px; height: 2px; background: #666;}
    #slide_map .inner .binds > ul > li > ul > li > ul > li > a:hover:before,#slide_map .inner .binds > ul > li > ul > li > ul > li > a:active:before,#slide_map .inner .binds > ul > li > ul > li > ul > li > a.on:before{background-color: #004585;}
    #slide_map .inner .binds > ul > li > ul > li > ul > li > ul{display: none; padding: 3px 0 0; box-sizing: border-box;}
    #slide_map .inner .binds > ul > li > ul > li > ul > li > ul > li{padding: 2px 0; box-sizing: border-box;}
    #slide_map .inner .binds > ul > li > ul > li > ul > li > ul > li > a{color: #010101; text-decoration: none; font-size: 13px;}
    #slide_map .inner .binds > ul > li > ul > li > ul > li > ul > li > a:hover,#slide_map .inner .binds > ul > li > ul > li > ul > li > ul > li > a:active{color:#004585;}
    #slide_map .inner .binds .side_link{position: relative; margin:30px 0 70px; padding:0 0 35px;}
    #slide_map .inner .binds .side_link .eng{position: absolute; display: block; padding: 15px 30px; right: 0; border: 1px solid #ccc; box-sizing: border-box; text-decoration: none; color: #010101; font-size: 16px;}
    
    /*header*/
    .fixed #header{z-index: 9; box-shadow: 0 3px 15px 0 rgba(0, 0, 0, 0.08);}
    #header{position: relative;  height: 75px; margin: 0;}
    #header:after{content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 5px; background-color: #004585;}
    #header .logo{left: 20px;}
    #header .logo a{width: 146px; height: 35px;}
    #header #gnb{display: none;}
    #header .toputil_control{position: relative; left: 0; right: auto; top: auto; width: auto; max-width: inherit; height: auto; transform: translateX(0); -webkit-transform: translateX(0); background-color: transparent;}
    #header .toputil_control:before,#header .toputil_control:after{display: none;}
    #header .toputil_control div{position: relative; padding-right: 0;}
    #header .toputil_control .eng{position: absolute; top: 50%; right: 185px; display: none; padding-right: 0; font-size: 16px; color:#004585; transform: translateY(-50%);}
    #header .toputil_control a.eng:before,#header .toputil_control a.search_btn_open:before{right: -30px; height: 35px; background-color: rgba(0, 69, 133, 0.2);}
    #header .toputil_control .search_btn_open{position: absolute; top: 54%; right: 95px; background: url(../images/layout/search_ico_ta.svg) no-repeat center center; background-size: 19px 20px; transform: translateY(-54%);}
    #header .toputil_control a.search_btn_open:before{display: none;}
    #header .toputil_control .allmenu_btn_open{display: block; z-index: 9; position: relative; right:0; top:0; width: 75px; height: 75px; background:#004585; }
    
    #header .allmenu_btn_open:before {content:""; display:block; width:25px; height:2px; background:#fff; position:absolute; left:50%; top:50%; margin:-10px 0 0 -13px;}
    #header .allmenu_btn_open:after {content:""; display:block; width:25px; height:2px; background:#fff; position:absolute; left:50%; top:50%; margin:8px 0 0 -13px;}
    #header .allmenu_btn_open span {display:block; text-indent:-9999px; overflow:hidden; width:25px; height:2px; background:#fff; position:absolute; left:50%; top:50%; margin:-1px 0 0 -13px;}
    #header .allmenu_btn_open:before, #header .allmenu_btn_open:after, #header .allmenu_btn_open span {
        animation-duration: 0.5s;
        animation-fill-mode: both;
        animation-iteration-count: 1;
        animation-timing-function: ease;
        -webkit-animation-duration: 0.5s;
        -webkit-animation-fill-mode: both;
        -webkit-animation-iteration-count: 1;
        -webkit-animation-timing-function: ease;	 
    }
    
    #header .allmenu_btn_open:before {animation-name:search1; -webkit-animation-name:search1;}
    #header .allmenu_btn_open:after {animation-name:search2; -webkit-animation-name:search2;}
    #header .allmenu_btn_open.on:before {animation-name:search_on1; -webkit-animation-name:search_on1;}
    #header .allmenu_btn_open.on:after {animation-name:search_on2; -webkit-animation-name:search_on2;}
    #header .allmenu_btn_open.on span {animation-name:search_on3; -webkit-animation-name:search_on3;}
    
    @keyframes search1 {
        100% {margin-top:-10px;}
        51% {margin-top:-1px;}
        50% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        0% {transform:rotate(45deg); -webkit-transform:rotate(45deg); margin-top:-1px;}
    }
    @-webkit-keyframes search1 {
        100% {margin-top:-10px;}
        51% {margin-top:-1px;}
        50% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        0% {transform:rotate(45deg); -webkit-transform:rotate(45deg); margin-top:-1px;}
    }
    @keyframes search2 {
        100% {margin-top:8px;}
        51% {margin-top:-1px;}
        50% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        0% {transform:rotate(-45deg); -webkit-transform:rotate(-45deg); margin-top:-1px;}
    }
    @-webkit-keyframes search2 {
        100% {margin-top:8px;}
        51% {margin-top:-1px;}
        50% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        0% {transform:rotate(-45deg); -webkit-transform:rotate(-45deg); margin-top:-1px;}
    }
    @keyframes search_on1 {
        0% {margin-top:-10px;}
        50% {margin-top:-1px;}
        51% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        100% {transform:rotate(45deg); -webkit-transform:rotate(45deg); margin-top:-1px;}
    }
    @-webkit-keyframes search_on1 {
        0% {margin-top:-10px;}
        50% {margin-top:-1px;}
        51% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        100% {transform:rotate(45deg); -webkit-transform:rotate(45deg); margin-top:-1px;}
    }
    @keyframes search_on2 {
        0% {margin-top:8px;}
        50% {margin-top:-1px;}
        51% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        100% {transform:rotate(-45deg); -webkit-transform:rotate(-45deg); margin-top:-1px;}
    }
    @-webkit-keyframes search_on2 {
        0% {margin-top:8px;}
        50% {margin-top:-1px;}
        51% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        100% {transform:rotate(-45deg); -webkit-transform:rotate(-45deg); margin-top:-1px;}
    }
    @keyframes search_on3 {
        50% {width:0; margin-left:0;}
        100% {width:0; margin-left:0;}
    }
    @-webkit-keyframes search_on3 {
        50% {width:0; margin-left:0;}
        100% {width:0; margin-left:0;}
    }

    #header .search_form{top: 75px; padding: 44px 0;}
    #header .search_form .form{max-width: 535px; } 
    #header .search_form .form input[type="text"]{padding: 13px 35px 13px 10px; font-size: 18px; border-radius: 0; -webkit-border-radius: 0;}
    
    /*footer*/
    #footer{padding: 35px 15px; z-index: 2;}
    #footer .layout{padding-left: 0;}
    #footer .layout:before{display: none;}
    #footer .info{width: 100%; }
    #footer .info .menu_link{width: calc(100% - 250px); margin-bottom: 24px;}
    #footer .info .menu_link li{margin-left: 20px;}
    #footer .info .menu_link li:first-child:after{right: -12px;}
    #footer .relate_site{height: 36px; top: -8px;}
    #footer .relate_site > a{line-height: 34px;}
    #footer .relate_site > a:after{width: 18px; height: 14px; margin-top: -7px; background-size: contain;}
    #footer .relate_site ul{bottom: 36px;}
    
    /*sub*/
    body.sub #visual .inner{height: 140px;}
    .sub #lnb{width: 170px;}
    #contents{width: calc(100% - 210px);}
    body.sub #container .inner{padding: 0 15px;}
    
    .innerTop{padding: 0 30px 0 225px; margin-bottom: 50px;}
    .innerTop .satisBox{padding-left: 5%; box-sizing: border-box;}
}
@media all and (max-width: 1000px){
    /*sub*/
    #lnb .lnb li a{padding: 8px 20px 9px 5px;}
    #contents{width: calc(100% - 210px);}
}

@media all and (max-width: 767px){
    
    #header .search_form{padding: 35px 0;}
    
    /*sub*/
    body.sub #visual{height: auto;}
    body.sub #visual .inner{height: 80px; background: none !important;}
    body.sub #container .inner{padding: 0;}
    body.sub #contents .path{display: none;}
    body.sub #contents{width: 100%; position: relative;}
    body.sub #contents .h1{height: auto; margin:-80px 0 0 0; line-height: 80px;}
    body.sub #contents .conInner .path{display: block !important; position: static; top: auto; margin: 16px 0 5px; text-align: right;}
    #contents .conInner{padding:20px 15px 40px 15px !important;}
    .innerTop{padding: 0; margin-bottom: 30px;}
    .innerTop .satisBox{padding-left: 0; margin-top: 0;}
    .satisBox .infoBox{border: none;}
    .satisBox .infoBox p span span.th01{min-width: 115px;}
    .satisBox .infoBox p span span.th02{min-width: 40px;}
    .satisBox .infoBox p span span.th03{min-width: 85px;}
}

@media all and (max-width: 640px){
    .btn_top {width: 50px; height: 50px; padding-top: 25px;}
    /*slide_map*/
    #slide_map{top: 60px;}
    
    /*header*/
    #header{height: 60px;}
    #header:after{height: 3px;}
    #header .logo{left: 15px;}
    #header .logo a{width: 119px; height: 29px; line-height: 27px; font-size: 17px; background-size: contain;}
    #header .logo a span{width: 59px; height: 27px; }
    #header .toputil_control .allmenu_btn_open{width: 60px; height: 60px; background-size: 30px 30px;}
    #header .toputil_control .eng{display: none;}
    #header .toputil_control .search_btn_open{right: 75px;}
    #header .search_form{top: 60px;}
    #header .search_form .form{max-width: 70%; padding-right: 35px;} 
    #header .search_form .form input[type="text"]{font-size: 16px;}
    #header .search_form .form input[type="submit"]{width: 25px; right: 40px; background-size: 75%;}
    #header .search_form .btn_close{width: 25px; right: 0px;background-size: 75%;}
    #header .allmenu_btn_open:before {width:20px; margin:-10px 0 0 -10px;}
    #header .allmenu_btn_open:after {width:20px; margin:8px 0 0 -10px;}
    #header .allmenu_btn_open span {width:20px; margin:-1px 0 0 -10px;}
    
    @keyframes search1 {
        100% {margin-top:-8px;}
        51% {margin-top:-1px;}
        50% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        0% {transform:rotate(45deg); -webkit-transform:rotate(45deg); margin-top:-1px;}
    }
    @-webkit-keyframes search1 {
        100% {margin-top:-8px;}
        51% {margin-top:-1px;}
        50% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        0% {transform:rotate(45deg); -webkit-transform:rotate(45deg); margin-top:-1px;}
    }
    @keyframes search2 {
        100% {margin-top:6px;}
        51% {margin-top:-1px;}
        50% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        0% {transform:rotate(-45deg); -webkit-transform:rotate(-45deg); margin-top:-1px;}
    }
    @-webkit-keyframes search2 {
        100% {margin-top:6px;}
        51% {margin-top:-1px;}
        50% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        0% {transform:rotate(-45deg); -webkit-transform:rotate(-45deg); margin-top:-1px;}
    }
    @keyframes search_on1 {
        0% {margin-top:-8px;}
        50% {margin-top:-1px;}
        51% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        100% {transform:rotate(45deg); -webkit-transform:rotate(45deg); margin-top:-1px;}
    }
    @-webkit-keyframes search_on1 {
        0% {margin-top:-8px;}
        50% {margin-top:-1px;}
        51% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        100% {transform:rotate(45deg); -webkit-transform:rotate(45deg); margin-top:-1px;}
    }
    @keyframes search_on2 {
        0% {margin-top:6px;}
        50% {margin-top:-1px;}
        51% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        100% {transform:rotate(-45deg); -webkit-transform:rotate(-45deg); margin-top:-1px;}
    }
    @-webkit-keyframes search_on2 {
        0% {margin-top:6px;}
        50% {margin-top:-1px;}
        51% {transform:rotate(0deg); -webkit-transform:rotate(0deg); margin-top:-1px;}
        100% {transform:rotate(-45deg); -webkit-transform:rotate(-45deg); margin-top:-1px;}
    }
    
    /*footer*/
    #footer{padding: 0 0 30px; font-size: 13px;}
    #footer .relate_site{position: static; width: 100%; height: auto; transform: translateY(0%);}
    #footer .relate_site > a{padding: 0 15px; line-height: 45px; border: none; border-bottom: 1px solid #4b5056;}
    #footer .relate_site > a:after{right: 15px; width: 16px; height: 12px; margin-top: -6px;}
    #footer .relate_site ul{bottom: 46px;}
    #footer .relate_site ul li{padding: 7px 3%;}
    #footer .info{width: 100%; padding: 0 15px; box-sizing: border-box;}
    #footer .info .menu_link{display: inline-block; width: 100%; margin:20px 0 11px;}
    #footer .info .menu_link li{margin-left: 15px;}
    #footer .info .menu_link li:first-child:after{right: -9px;}
    #footer .info .menu_link li a{font-size: 14px; line-height: 20px;}
    #footer .info span{display: block;  margin-top: 3px; font-size: 13px; line-height: 18px;}
    #footer .info span.addr{margin-top: 0;}
    
    /*메인*/
    .layout{padding: 0 15px;}
    
}

@media all and (max-width: 480px){   
    /*header*/
    #header .search_form .form{max-width: 280px;}
    
    #footer .info span.addr{width: calc(100% - 55px);}
    
    /*sub*/
/*    .satisBox .infoBox span{display: block;}
    .satisBox .infoBox strong{padding-left: 0;}*/

}