@charset "utf-8";

@font-face {
 font-family: ng;
 font-style: normal;
 font-weight: 100;
 src: url('../../font/NanumGothic.eot');
 src: local(nbg), url('../../font/NanumGothic.woff') format('woff');
}

@font-face {
 font-family: ng;
 font-style: normal;
 font-weight: 300;
 src: url('../../font/NanumGothicBold.eot');
 src: local(nbg), url('../../font/NanumGothicBold.woff') format('woff');
}

@font-face {
 font-family: ng;
 font-style: normal;
 font-weight: 500;
 src: url('../../font/NanumGothicExtraBold.eot');
 src: local(nbg), url('../../font/NanumGothicExtraBold.woff') format('woff');
}

@font-face {
 font-family: ns;
 font-style: normal;
 font-weight: 100;
 src: url('../../font/NanumSquareR.eot');
 src: local(nbg), url('../../font/NanumSquareR.woff') format('woff');
}

@font-face {
 font-family: ns;
 font-style: normal;
 font-weight: 300;
 src: url('../../font/NanumSquareB.eot');
 src: local(nbg), url('../../font/NanumSquareB.woff') format('woff');
}

@font-face {
 font-family: ns;
 font-style: normal;
 font-weight: 500;
 src: url('../../font/NanumSquareEB.eot');
 src: local(nbg), url('../../font/NanumSquareEB.woff') format('woff');
}

/* reset Style */
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,
form,fieldset,legend,input,textarea,button,select,img,div,header,section,nav {margin: 0; padding: 0;}
img,fieldset {border: 0;}
ul,ol {list-style: none;}
img,input,select {vertical-align: middle;}
em, address {font-style: normal;}
table {border-collapse: collapse; border-spacing: 0px; empty-cells: show; table-layout: fixed;}
caption {visibility: hidden; width: 0; height: 0; margin: 0; padding: 0; font-size: 0; line-height: 0;}
h1, h2, h3, h4, h5, h6, strong {font-weight: 300;}
a:focus, input:focus, textarea, button, div, li {outline: none;}

/* Default Style */
body, input, button {font-family: ng, Verdana, Dotum, AppleGothic, sans-serif; -webkit-font-smoothing: antialiased;}
body{color:#fff; line-height:1; -webkit-text-size-adjust: none;}
input[type="text"]:disabled {background: #f5f5f5;}
* {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
*:focus {outline:none;}
button, button:focus, button:active {padding: 0;} 
button i {position: relative; font-style: normal; font-weight: 100;}
button {cursor: pointer; border: 0;}
button:disabled {cursor: default;}
input[type=text]::-ms-clear {display: none;}
select, input {height: 33px; padding: 0 10px; margin: 2px 0; border: 1px solid #cdcdcd; background: #fff; font-weight: 100;}
select::-ms-expand {background-color:transparent; border:0;}

.clear:after {content: ""; display: block; clear: both; height: 0; font-size: 0; visibility: hidden;}
.txt_left {text-align: left;}
.txt_center {text-align: center;}
.txt_right {text-align: right;}

table {width:100%; border-bottom:1px solid #cdcdcd; font-size: 14px; line-height: 20px;}
th, td {border-bottom:1px solid #e2e2e2; border-left:1px solid #e2e2e2; padding: 10px 15px;}
th:first-child, td:first-child {border-left:none;}
thead th {font-weight:300; color:#111; text-align:center; border-top:2px solid #333; background-color:#f2f4f6;}
tbody.nohead tr:first-child th, tbody.nohead tr:first-child td {border-top:2px solid #333;}
tbody th {padding:0; font-weight:300; color:#111; background-color:#eaf3ef;}
tbody td {font-weight: 100; font-size: 13px;}
tbody tr.total td {font-weight: 500; color: #111;}
.bl {border-left:1px solid #e2e2e2!important;}

/* Link Style */
a {color:inherit; text-decoration:none; -webkit-tap-highlight-color:transparent;}

/* 바로가기 */
#skipnavigation a{position:absolute;left:-3000%}
#skipnavigation a:focus{display:inline-block;top:0;left:0;z-index:9999;width:20%;height:30px;background:#000;line-height:30px;color:#fff;text-align:center}

/* layout */
html,body,wrap{width:100%; margin:0 auto}
body {min-height:100%; background:#fff; color:#666; font-weight:100; font-size:14px; font-family: ng, Verdana, Dotum, AppleGothic, sans-serif; letter-spacing: -0.03em;}

#wrap {min-width: 1400px; position: relative; overflow: hidden; width: 100%; padding-top: 72px;}
.header {width: 100%; position: absolute; height: 72px; overflow: hidden; top: 0; left: 0; background: url(../img/header_bg.gif) repeat-x 0px 70px #fff; z-index: 10;}
.header.hd_over {box-shadow: 0 0 4px rgba(0,0,0,.4)}
.header .header_inner {position: relative; width: 1200px; margin: 0 auto; padding: 0;}
.header .header_inner .logo {position: absolute; top: 15px; left: 0;}
.header .header_inner .logo a {display: block; width: 180px; height: 39px; background: url(../img/eco_logo.jpg) no-repeat center 0; text-indent: -99999px; line-height: 0; font-size: 0;}

.header .header_inner .gnb_wrap {position: absolute; left: 220px; top: 26px;}
.header .header_inner .gnb_wrap .menu>li {float: left; position: relative;}
.header .header_inner .menu>li> h3 {margin-bottom: 28px;}
.header .header_inner .menu>li> h3 a {display: block; color: #111; font-size: 18px; font-family:'ns'; font-weight: 300; padding: 0 38px}
.header .header_inner .menu .list {padding: 20px;}
.header .header_inner .menu .list:before {content: ''; display: block; width: 1px; height: 9999px; background: #f0f0f0; position: absolute; top: 46px; left: 0;}
.header .header_inner .gnb_wrap:after {content: ''; display: block; width: 1px; height: 9999px; background: #f0f0f0; position: absolute; top: 46px; right: 0;}
.header .header_inner .menu .list li {margin-bottom: 10px; text-align: left;}
.header .header_inner .menu .list a {line-height: 18px; font-size: 13px; }
.header .header_inner .menu .list a:hover {color: #111; font-weight: 500;}

.header .header_inner .utility {position: absolute; right: 0; top: 30px;}
.header .header_inner .utility>li {float: left; position: relative;}
.header .header_inner .utility>li>a {display: block; padding-left: 18px; color: #999; font-size: 12px; font-weight: 500;}

#footer {width: 100%; height: 150px; position: relative; border-top: 1px solid #e2e2e2; font-size: 12px; }
#footer .footer_inner {width: 1000px; position: relative; margin: 0 auto; padding: 40px 0 0 230px;}
#footer .footer_inner .flogo {position: absolute; left: 0; top: 40px; width: 180px; height: 39px; background: url(../img/footer_logo.jpg) no-repeat;}
#footer .footer_inner .flogo span {display: inline-block; overflow: hidden; position: absolute; width: 1px; height: 1px; font-size: 0; line-height: 0; text-indent: -9999px;}
#footer .footer_inner .finfo li {position: relative; float: left; padding-left: 11px; margin-left: 11px;}
#footer .footer_inner .finfo li:before {content: ""; position: absolute; left: 0; top: 1px; width: 1px; height: 11px; background: #8e8e8e;}
#footer .footer_inner .finfo li:first-child {padding-left: 0; margin-left: 0;}
#footer .footer_inner .finfo li:first-child:before {display: none;}
#footer .footer_inner .addr {padding: 10px 0 20px 0;}
#footer .footer_inner .copy {color: #999;}
#footer .footer_inner .portal {position: absolute; right: 0; top: 40px;}
#footer .footer_inner .portal button {position: relative; width: 186px; height: 27px; color: #666; border: 1px solid #e2e2e2; text-align: left; padding: 0 10px; border-radius: 5px; background: #fff;}
#footer .footer_inner .portal button span {display: inline-block; font-size: 13px; font-weight: 100; line-height: 26px; position: relative; width: 100%;}
#footer .footer_inner .portal button span:after {content: ""; position: absolute; right: 0; top: 8px; width: 27px; height: 9px; background: url(../img/icon_go.jpg) no-repeat;}

.tab_area {position: relative; margin: 0 auto; max-width: 1200px;}
.tabs {display: flex; flex-wrap: wrap;}
.tabs label {order: 1; display: block; padding:13px 0px; text-align:center; cursor: pointer; background: #fff; color: #111; border: 1px solid #cdcdcd; transition: background ease 0.5s; font-size: 15px;}
.tabs label.bln {border-left: none;}
.tabs .tab {order: 99; flex-grow: 1; width: 100%; display: none; background: #fff; margin-top: 40px;}
.tabs input[type="radio"] {display: none;}
.tabs input[type="radio"]:checked + label {background: #007e9d; color: #fff;}
.tabs input[type="radio"]:checked + label + .tab {display: block;}

.tabs.ty01 label {width: 25%;}

.list_ty01 {font-size: 15px;}
.list_ty01 li {font-weight: 300; line-height: 20px; display: block; overflow: hidden; margin-bottom: 10px;}
.list_ty01 li em {width: 21px; height: 21px; display: block; float: left; background: #649b14; color: #fff; text-align: center; font-size: 12px; margin-right: 10px; border-radius: 5px;}

.list_ty02 {list-style-type: decimal; padding-left: 45px; margin-bottom: 10px;}
.list_ty02 li {font-size: 13px; font-weight: 100; line-height: 24px;}

.list_ty03 {margin: 8px 30px 8px; display: block; overflow: hidden;}
.list_ty03 li {font-size: 13px; font-weight: 100; position: relative; padding-left: 10px; margin-bottom: 0; line-height: 21px;}
.list_ty03 li:before {content: "-"; position: absolute; left: 0; top: 0; display: block; width: 20px;}

.list_ty04 {font-size: 15px;}
.list_ty04 li {font-weight: 300; line-height: 20px; display: block; overflow: hidden; margin-bottom: 10px; position: relative; padding-left: 12px;}
.list_ty04 li:before {content: ""; position: absolute; left: 0; top: 8px; display: block; width: 3px; height: 3px; background-color: #333;}

.list_ty04 p {line-height: 22px; font-size: 14px; font-weight: 100; margin-top: 5px;}

.list_ty05 {display: block; overflow: hidden;}
.list_ty05 li {font-size: 13px; font-weight: 100!important; position: relative; padding-left: 10px; margin-bottom: 0; line-height: 20px;}
.list_ty05 li:before {content: "-"; position: absolute; left: 0; top: 0; display: block; width: 20px;}

.list_ty06 {list-style-type: decimal; padding-left: 45px; margin-bottom: 10px;}
.list_ty06 li {font-size: 13px; font-weight: 300; line-height: 24px;}

.bul_ty01 {display: block; position: relative; padding-left: 15px;}
.bul_ty01:before {position: absolute; top: 0; left: 0; content: "※"; color: #de7708; font-weight: 300;}

.table_ty01 {margin: 15px 0; padding: 0 32px}
.table_ty01 .txt {font-size: 14px; display: block; margin-bottom: 8px; color: #00a4cd; font-weight: 300;}
.table_ty02 {}
.table_ty02 .txt2 {font-size: 13px; display: block; margin-bottom: 8px; color: #666; font-weight: 300; text-align: right;}