@charset "utf-8";
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+KR:300,400,500,700&subset=korean");

/*#boxsubmain {width: 1000px; margin: 0 auto;}*/
/* 헤더영역 */
.main_slider button {border: none;}
.renew {font-family: 'Noto Sans KR','맑은 고딕', 'Malgun Gothic','돋움','dotum', sans-serif  !important; }
.renew h1 {margin: 0; padding: 0;}
.renew div {margin: 0; padding: 0; font-family: 'Noto Sans KR','맑은 고딕', 'Malgun Gothic','돋움','dotum', sans-serif  !important;}
.renew ol, .renew ul {float: none; list-style:none; padding: 0; margin: 0; font-family: 'Noto Sans KR','맑은 고딕', 'Malgun Gothic','돋움','dotum', sans-serif  !important;}
.renew a{color:#666; text-decoration:none; padding:0; margin:0; font-family: 'Noto Sans KR','맑은 고딕', 'Malgun Gothic','돋움','dotum', sans-serif  !important;}
.renew a:link    {text-decoration:none; }
.renew a:active    {text-decoration:none; }
.renew a:visited    {text-decoration:none;}
.renew a:hover    {text-decoration:none; }
.renew .header {margin: 0; padding: 0; width: 100%; z-index: 9999; position: relative;}
.renew li {float: none;}
.renew em {font-style: normal;}

.renew .header {width: 1000px; /*margin: 0 auto;*/}
.renew .header .top_header {text-align: right;}
.renew .header .util {display: inline-block; vertical-align: top; padding-top: 5px;}
.renew .header .util li {display: inline-block; vertical-align: top; text-align: center; padding: 0 5px;}
.renew .header .util li a {display: block; font-size: 10px; color: #666; text-align: center;}
.renew .header .header_inner:after {content: ''; display: block; clear: both;}
.renew .header .logo {float: left;}
.renew .header .logo a {display: block;}
.renew .header .gnb {position: relative; float: right; font-size: 0; background: linear-gradient(to top, #1e73a7 40%, #3b8fc8); margin-top: 10px; border: 3px solid #fff; border-radius: 60px; box-sizing: border-box;}
.renew .header .gnb > li {display: inline-block; vertical-align: middle; width: 140px; text-align: center;}


.renew .header .gnb > li > a {display: block; font-size: 14px; font-weight: 500; color: #fff; padding: 10px 0; line-height: 30px; transition: all .3s; position: relative;}
.renew .header .gnb > li > a:before {content: ''; position: absolute; left: 0; top: 0; width: 1px; height: 100%; background: #fff; opacity: .2; box-shadow: 1px 0px 3px 0px #000;}
.renew .header .gnb > li:first-of-type > a:before {display: none;}
.renew .header .gnb .depth2 {padding: 0; position: absolute; left: 20px; top: 45px; border: none; border-top: none;  border-radius: 25px; background: linear-gradient(to top, #a6cc5d 30%, #76a63a); height: 0; opacity: 0; overflow: hidden; box-shadow: 3px 3px 5px 1px rgb(0,0,0,0.2); transition: all .5s;}
.renew .header .gnb > li:nth-of-type(2) .depth2 {left: 0;}
.renew .header .gnb > li:nth-of-type(3) .depth2 {left: 0;}
.renew .header .gnb > li:nth-of-type(4) .depth2 {left: 450px;}
.renew .header .gnb > li:nth-of-type(5) .depth2 {left: 480px;}
.renew .header .gnb .depth2:after {content: ''; display: block; clear: both;}
.renew .header .gnb .depth2 li {float: left; padding: 0 7px; position: relative;}
.renew .header .gnb .depth2 li:before {content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 60%; background: #fff; opacity: .8;}
.renew .header .gnb .depth2 li:first-of-type:before {display: none;}
.renew .header .gnb .depth2 li a {display: block; font-size: 10px; color: #fff; line-height: 25px; transition: all .3s;}
.renew .header .gnb > li:hover > a {color: #d5d200;}
.renew .header .gnb > li:hover .depth2 {height: auto; opacity: 1; overflow: visible; border: 1px solid #cacdd1; border-top: 1px solid transparent; padding: 0 15px;}
.renew .header .gnb .depth2 li a:hover {color: #d5d200;}

/* 본문상단 */
.renew .main_pd {height: 127px; font-size: 0; text-align: center;}
.renew .main_pd:after {content: ''; display: block; clear: both;}
.renew .main_pd li {display: inline-block; vertical-align: top; height: 100%;}
.renew .main_pd li:after {content: ''; display: block; clear: both;}
.renew .main_pd li a {float: left; display: block; height: 100%; background: linear-gradient(to left, #33afcb, #98d8e4);     padding: 7px; font-size: 14px; color: #fff; font-weight: 500; border-radius: 5px; position: relative; width: 20px; transition: all .3s;}
.renew .main_pd li.on a { background: linear-gradient(to left, #1a7bb2, #98d8e4);}
.renew .main_pd li .con {float: left; width: 0; height: 0; overflow: hidden; transition: all .3s;}
.renew .main_pd li .con img {overflow: hidden;}
.renew .main_pd a span {display: block;position: absolute;left: 0px;top: 20px;transform: rotateZ(90deg);white-space: nowrap;z-index: 10;width: 100%; font-size: 12px;}

.renew .main_pd li.on .con {width: auto; height: auto; overflow: visible;} 
.renew .main_pd li.on .con img {overflow: visible;}

/* 푸터영역 */
.renew .footer {width: 1000px; /*margin: 0 auto;*/ position: relative; z-index: 100; padding-bottom: 30px;}
.renew .footer .f_util {padding: 20px 0 10px;}
.renew .footer .f_util:after {content: ''; display: block; clear: both;}
.renew .footer .f_util li {float: left; text-align: center; padding: 0 15px; position: relative;}
.renew .footer .f_util li:before {content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 50%; background: #ddd;}
.renew .footer .f_util li:first-of-type:before {display: none;}
.renew .footer .f_util li a {display: block; font-size: 12px; color: #666; text-align: center;}

/* lnb */
.renew .lnb_wrap {padding: 20px 15px; background: #fff; border-radius: 10px; box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.1);}
.renew .lnb_tit strong {display: block; font-size: 22px; font-weight: 400; color: #666; border-bottom: 1px solid #ddd;}
.renew .lnb_tit em {display: block; font-size: 10px; color: #3b8fc8;}
.renew .lnb {padding: 10px 0 50px;}
.renew .lnb li {border-top: 1px solid #ddd;}
.renew .lnb li:first-of-type {border-top: none;}
.renew .lnb li a {padding-left: 10px; box-sizing: border-box; font-size: 11px; display: block; color: #666; line-height: 26px; position: relative;}
.renew .lnb li a:before {content: ''; position: absolute; left: 0; top: 8px; width: 0; height: 0; border: 5px solid transparent; border-left-color: #1e73a7; transform: translateX(-5px); opacity: 0; transition: all .3s;}
.renew .lnb li.on a {color: #1e73a7;}
.renew .lnb li:hover a {color: #1e73a7;}
.renew .lnb li.on a:before {opacity: 1; transform: translateX(0);}
.renew .lnb li:hover a:before {opacity: 1; transform: translateX(0);}

/* 메인슬라이더 */
.renew .main_slider {padding: 0 20px; font-family: "Arial",굴림 !important;}
.renew .main_slider a {font-family: "Arial",굴림 !important;}
.renew .main_slider .slick-arrow {cursor: pointer; position: absolute; right: auto; left: -3px; top: 50%; margin-top: -45px; text-indent: -9999px; background: url(../images/arrow_prev1.jpg) no-repeat 50% 50%; width: 22px; height: 23px;}
.renew .main_slider .slick-arrow.slick-next {left: auto; right: -3px; background-image: url(../images/arrow_next1.jpg);}

/* 사이트맵 */
.renew .sitemap_page {background: #fff;}
.renew .sitemap_list {overflow: hidden; padding: 50px 0;}
.renew .sitemap_list > li {float: left; width: 20%; text-align: center;}
.renew .sitemap_list strong {font-weight: 400; /*margin: 0 auto;*/ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; width: 80px; height: 80px; box-sizing: border-box; border-radius: 100%; border: 2px solid #062388; color: #fff; font-size: 16px; text-align: center; background: linear-gradient(to top, #01054d, #29bffb);}
.renew .sitemap_list .link_list {text-align: left; padding-top: 20px;}
.renew .sitemap_list .link_list li {margin-top: 10px;}
.renew .sitemap_list .link_list li a {display: block; padding: 0 10px; box-sizing: border-box; position: relative; font-size: 14px; color: #666;}
.renew .sitemap_list .link_list li a:before {content: ''; position: absolute; left: 0; top: 7px; width: 3px; height: 8px; background: #89a6f0;}


