@charset "utf-8";

body {font-family:'notosans', sans-serif; font-weight:300; }

.wrap {max-width:1200px; margin:0 auto;}

/*본문바로가기*/
#skipNavWrap { overflow: hidden; position: relative; width: 100%; z-index: 1000; }
#skipNavWrap a { display: block; font-size: 0; width: 1px; height: 1px; line-height: 0; margin: 0 -1px -1px 0; overflow: hidden; text-align: center; font-weight:300 !important;}
#skipNavWrap a:focus, #skipNavWrap a:hover, #skipNavWrap a:active {width: auto; padding:15px 0; background: #333; color: #fff; font-size: 13px; font-weight: bold;}

#header .top {background:#f0f0f0; line-height:50px; overflow:hidden;}
#header .top div div {float:left; text-transform:uppercase; color:#666;}
#header .top div div span {font-weight:500;}
#header .top_right {float:right;}
#header .top_right li { float:left; }
#header .top_right li:first-child a { color:#666; display:inline-block; padding-right:25px;}
#header .top_right li.sitemap a,
#header .top_right li.search a { text-indent:-9999px; font-size:0; width:50px; height:50px; display:inline-block; vertical-align:top;}
#header .top_right li.sitemap a {background:#333 url('../img/layout/top_icon1.png') no-repeat center;}
#header .top_right li.search a {background:#0c4da2 url('../img/layout/top_icon2.png') no-repeat center;}
#header .top_right li.search input {width:200px; line-height:46px; height:46px; padding:0 10px; border:2px solid #0c4da2; vertical-align:top;}

#header .gnb { position:relative; padding-top:15px; height:65px;}
h1.logo {float:left; display:inline-block;}
h1.logo a {background:url('../img/layout/logo.png') no-repeat left center; padding:8px 0 3px 200px; display:inline-block; font-size:13.5px; color:#444; font-weight:400; }
h1.logo div {display:inline-block; line-height:20px; }
h1.logo div span { font-size:20px; font-weight:500; color:#111; display:block; letter-spacing:-1.3px;}
h1.logo .logo_txt {display:inline-block; text-indent:-9999px; font-size:0;}
#header .gnb ul.depth1 { float:right; }
#header .gnb ul.depth1 > li {float:left; }
#header .gnb ul.depth1 > li > a {display:inline-block; font-size:20px; padding:10px 40px 25px;}
#header .gnb ul.depth1 > li:last-child > a {font-size:18px; font-weight:500; background:url('../img/layout/navi_icon.gif') no-repeat left center; padding:10px 0 10px 40px; margin-left:50px; }
#header .Snb { display:none; position:absolute; top:80px; left:0; width:100%; z-index:200;}
#header .Snb .title {float:left; width:30%; padding-top:30px; }
#header .Snb .title h2 {color:#0e4194; border-top:2px solid #0e4194; background:#f3f4f8; display:inline-block; padding:5px 0 10px; font-weight:500;}
#header .Snb .title span {color:#0e4194; font-weight:400; }
#header .Snb .title .txt {position:absolute; top:80px; left:0; background:#f3f4f8; display:inline-block;}
#header .Snb .depth2 {padding-top:20px; float:left; width:70%;}
#header .Snb .depth2 li {display:inline-block; width:33%; padding:3px 5px; box-sizing:border-box; }
#header .Snb .depth2 li a {display:block; padding:10px 20px; font-size:16px; background:#fff;}
#header .Snb .depth2 li a.on, #header .Snb .depth2 li a:hover {background:#0e4194; color:#fff; }

#header .gnb_bg {background:url('../img/layout/navi_bg.gif') repeat-y top center; position:absolute; top:130px; left:0; width:100%; z-index:199; border-top:1px solid #ddd;}

@media all and (max-width:1023px) {
  #header {display:none;}
}

/*사이트맵*/
.sitemap_wrap { display:none; position:absolute; top:0; left:0; width:100%; height:100%; z-index:200 }
#sitemap {position:relative; margin:130px auto 0; max-width:1200px; width:100%; background:#fff; border:3px solid #0c4da2; }
#sitemap > ul {overflow:hidden;}
#sitemap > ul > li {float:left; width:25%; border-left:1px dashed #999; box-sizing:border-box; }
#sitemap > ul > li:first-child {border-left:0; }
#sitemap > ul > li > a {display:block; text-align:center; font-size:16px; font-weight:500; background:#dbe7f7; padding:7px 0;}
#sitemap .depth2 {padding:10px 15px; min-height:158px; }
#sitemap .depth2 li a { display:inline-block; padding:5px 0; border-bottom:1px solid #fff;}
#sitemap .depth2 li a:hover { border-bottom:1px solid #0c4da2; color:#0c4da2;}
.sitemap_wrap .close {max-width:1200px; margin:5px auto 0; text-align:right;}
.sitemap_wrap .close a {display:inline-block; padding:5px 10px; color:#fff; background:#0c4da2; }
#sitemap_bg { position:absolute; top:0; left:0; width:100%; height:100%; opacity:0.6; background:#000;z-index:-1;}
.hidden-scrolling {overflow-y:hidden;}

#footer {border-top:1px solid #ddd; padding:20px 0; margin-top:40px;}
#footer .f_logo {display:inline-block; float:left; margin-right:60px; padding:15px 0; }
#footer .f_logo a {display:inline-block; text-indent:-99999px; background:url('../img/layout/f_logo.gif') no-repeat left center; width:185px; height:50px; }
#footer .address {color:#555; display:inline-block; padding:15px 0; font-size:15.1px;}
#footer .address span {display:block; font-size:12px; color:#777; margin-top:10px;}
#footer .btn {float:right; display:inline-block;}
#footer .btn a {border:1px solid #444; background:#555; display:block; padding:5px 10px; margin:5px 0;}
#footer .btn a span{ background:url('../img/layout/f_arrow.gif') no-repeat right center; width:130px; color:#fff; display:inline-block; font-weight:200;}

@media all and (max-width:1023px) {
  #footer .wrap {width:98%; margin:0 auto;}
  #footer .f_logo {display:none;}
}

@media all and (max-width:768px) {
  #footer .btn {float:none; display:block;}
  #footer .btn a {display:inline-block;}
}

/*모바일*/
.no-scrolling {position:fixed; width:100%; height:100%;}
#mobile_head {display:none;}
#mobile_navi {position:fixed; top:0; left:0; width:100%; border:1px solid #ff0000;}
.Mnavi_wrap { position:fixed; top:0; left:0; display:none; width:100%; height:100%; background:#fff; z-index:999; overflow-y:auto; text-align:left;}
.Mnavi_wrap.open {display:block;}
.Mnavi_header ul {overflow:hidden;background:#0e4194; padding:10px 2%;}
.Mnavi_header li { width:50%; float:left; }
.Mnavi_header li.Mclose {text-align:right; cursor:pointer; line-height:52px;}
.Mnavi_wrap .ect {overflow:hidden; background:#0d387e; font-family:sans-serif; border-top:1px solid #154ba3; }
.Mnavi_wrap .ect li {float:left; width:50%; border-left:1px solid #154ba3; box-sizing:border-box; }
.Mnavi_wrap .ect li:first-child { border:0; }
.Mnavi_wrap .ect li a {display:block; color:#fff; line-height:40px; text-align:center; font-size:13px; letter-spacing:-0.5px; }
.amList > ul > li > a {display:block; border-top:1px dashed #ccc; font-size:16.7px; line-height:45px; padding:0 15px; font-weight:400;}
.amList > ul > li > a[target="_blank"] {padding-right:0 !important; background:none !important;}
.amList > ul > li > a[target="_blank"] span {padding-right:18px; background:url('../img/layout/header_blank.gif') no-repeat center right;}
.amList .mDepth2 {display:none; border-left:1px solid #becee9; border-top:1px solid #becee9; overflow:hidden; }
.amList .mDepth2 > li {/*float:left; width:33.33%; border-right:1px solid #becee9;*/ border-bottom:1px solid #becee9; background:#e7f0ff; box-sizing:border-box;}
.amList .mDepth2 > li > a {display:block; text-align:center; line-height:40px; font-size:15px;}
.amList .mDepth3 {display:none; overflow:hidden; background:#eee; padding:5px 0; }
.amList .mDepth3 li { float:left; width:44%; margin:0 3%; line-height:30px; background:url('../img/layout/Mdepth3_dot.gif') no-repeat center left; padding-left:10px; box-sizing:border-box;}
.amList .mDepth3 li a {display:block;}

@media all and (max-width:1023px) {
  #mobile_head {display:block; text-align:center; position:relative; padding:20px 0; border-bottom:1px solid #eee; height:50px;}
  #mobile_head h1.logo {padding-left:10px;}
  #mobile_head > a { position:absolute; text-indent:-9999px; font-size:0; width:50px; height:50px; display:inline-block; vertical-align:top;}
  #mobile_head a.m_navi {background:#333 url('../img/layout/top_icon1.png') no-repeat center; right:10px;}
  #mobile_head a.search_btn {background:#0c4da2 url('../img/layout/top_icon2.png') no-repeat center; right:10px;}

  #mobile_head .search_on {position:absolute; top:90px; left:0; z-index:201; width:100%;}
  #mobile_head .search_on input {border:3px solid #0c4da2; font-size:15px; line-height:50px; height:50px; padding:0 10px; width:90%; box-sizing:border-box;}
  #mobile_head .search_on a {background:#0c4da2 url('../img/layout/top_icon2.png') no-repeat center; text-indent:-9999px; font-size:0; width:10%; height:50px; display:inline-block; vertical-align:top;}

}

@media all and (max-width:480px) {
  #mobile_head h1 a { background-size:175px; padding:8px 0 3px 180px; }
  h1.logo div {line-height:18.5px;}
  h1.logo div span {font-size:19.5px;}
}

/*서브*/
.location {background:url('../img/layout/sub_bg.gif') no-repeat top center; margin-bottom:20px;}
.location .wrap {position:relative; height:125px;}
.location .wrap h3 { position:absolute; font-size:40px; font-weight:500; top:30px; left:0; }
.location .loca {position:absolute; top:50px; right:0;}
.location .loca > li {display:inline-block; font-size:13.5px; color:#4d4d4d; background:url('../img/layout/arrow.gif') no-repeat center left; padding:3px 5px 3px 15px;}
.location .loca > li:first-child {background:none; padding-left:0; }
.location .loca > ul {display:inline-block; vertical-align:middle; margin-left:10px;}
.location .loca > ul li {float:left; padding:0 2px;}

@media all and (max-width:1023px) {
  .location .wrap h3 { font-size:35px; top:15px; }
  .location .loca {top:80px; left:5px; right:auto;}
}

@media all and (max-width:480px) {
  .location .wrap h3 { font-size:30px; letter-spacing:-1px; }
  .location .loca {top:60px;}
}

#container > .wrap {overflow:hidden;}
.subnavi { width:16%; margin-right:4%; float:left; }
.subnavi .depth_2 > li:first-child > a {margin-top:0;}
.subnavi .depth_2 > li > a {display:block; border:1px solid #ccc; padding:7px 15px; margin:10px 0;}
.subnavi .depth_2 > li.on > a, .subnavi .depth_2 > li > a:hover {border:1px solid #0e4194; background:#0e4194 url('../img/layout/arrow2.gif') no-repeat 92% center; color:#fff;}
.subnavi .depth_3 { display:none; }
.subnavi .depth_2 > li.on > .depth_3 {display:block;}
.subnavi .depth_3 > li > a {display:block; border-bottom:1px dashed #ccc; padding:7px 15px;}

#contents { width:80%; float:right; line-height:25px; }

@media all and (max-width:1023px) {
  .location .wrap { width:98%; margin:0 auto; }
  .subnavi {display:none;}
  #contents { width:98%; float:none; margin:0 auto; }
}