@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(https://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);

@font-face {
 font-family: 'NanumSquare';
 font-weight: 700;
 src: url('../_font/NanumSquareR.eot');
 src: url('../_font/NanumSquareR.eot?#iefix') format('embedded-opentype'),
      url('../_font/NanumSquareR.woff') format('woff'),
      url('../_font/NanumSquareR.ttf') format('truetype');
}

body{ min-width : 1400px;}

/* reset style [start] */
html, body, div, span, object, iframe,
h1, h3, h4, h5, h6, h7, p, blockquote, pre,
a, abbr, address, big, cite, code,
del, dfn, em, font, img, ins, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td
{margin: 0;
padding: 0;
border:0;
line-height: 1.5em;
font-size: 13px;
LIST-STYLE-TYPE: none;
list-style:none;
word-break: break-all;
font-family:'맑은고딕', 'Malgun Gothic', '나눔고딕', 'nanumgothic', '돋움', Verdana; color:#555; font-size:13px;
}


#accessibility { display:none}/*웹접근성_ 반복메뉴건너뛰기*/
/* 일반적으로 accessibility라는 클래스를 두어 html에서 디자인상 감추고 싶은 부분을 지정한다 */

/*html {overflow-x:hidden;}*/
body,div,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,form,fieldset,caption,label,input,textarea,button,select,iframe,object,header,footer,nav,hgroup,section,article,aside{margin:0;padding:0;}
img,a,span,abbr,address,pre,code,del,em,strong,sub,sup{margin:0;padding:0;}

br {letter-spacing:normal;}


input,textarea,select,button {font-size:12px;}
button {background: none repeat scroll 0 0 #FFF; border: medium none;cursor: pointer; margin: 0;padding: 0;vertical-align: middle;}
legend {margin:0;padding:0;display:none;}
img{border:0 none; /*vertical-align:top;*/}
input {vertical-align:middle;line-height:16px;}
textarea,select {vertical-align:middle;}
ul,ol,li,dl,dt,dd{list-style:none;vertical-align:top; list-style-position: inside;}
a{text-decoration:none;color:#555;}
a:hover,a:active,a:focus{color:#e57a33;}

/* vertical-align: baseline; outline: 0; ie 외 브라우저 포커싱 사라지는 문제로 제거 */

/*body {overflow-y:scroll; overflow-x:hidden;} */




/*기존있던 css */

/* tables still need 'cellspacing="0"' in the markup */
table {border-spacing:0; overflow:hidden;} /* border-collapse: collapse; ff에서 border="0" 인 경우 문제 발생 */
address,caption,cite,code,dfn,em,strong,th,var {font-style:normal;} /* font-weight:normal */

a {text-decoration:none;}
a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:none;}

 
caption{position:absolute; left:-10000px; width:1px; height:1px; overflow:scroll;}

/* 헤딩태그와 필드셋은 웹접근성(만)을 위한 대표적인 태그로 일반적으로는 감춘다. */

#png img {_filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);}

/*********CUSTOM**********/

/* 정렬 */
.fl{float:left;}
.fr{float:right;}
.cb{clear:both;}
.oh{overflow:hidden;}

/* 숨김 */
.hid{position:absolute; left:-10000px; width:1px; height:1px; overflow:scroll;}
h1, h2{position:absolute; left:-10000px; width:1px; height:1px; overflow:scroll;}

/* 가운데 맞춤 & 여백 */
#wrap, #middle, #bottom, #s_middle{width:100%;}

/* 퀵메뉴 */
.quick{position:fixed; top:50%; right:0;   margin-right : calc( ( 100% - 1400px ) / 2 - 70px);  z-index:999; margin-top:-160px;}
.quick > ul > li{height:60px; line-height:30px;}
.quick > ul > li > a > span{ display:inline-block;vertical-align:middle;  }
.quick > ul > li:nth-child(3) > a > span{font-size:16px; line-height:24px;}
.quick > ul > li > a > span > img, .quick > ul > li > span > img{vertical-align:middle;background:#fff; padding:12px;  border-top:1px solid #ddd; border-left:1px solid #ddd; border-right:1px solid #ddd;}
.quick > ul > li.quick07 > span:first-child > img {background:none; border:none;}
.quick > ul > li:last-child > a > span > img{background:#d9d9d9;}

.quick .hover01, .quick .hover02, .quick .hover03, .quick .hover04, .quick .hover05, .quick .hover06{background:url(../img/quick_hoverbg.png) no-repeat 5px 20px; background-color:#f26600; width:63px; display:inline-block; color:#fff; border-radius:30px 0 0 30px; padding:3px 0 9px 32px; line-height:16px; margin-top:-1px; display:none;}
.quick .hover07 {line-height:48px; height:48px; background-color:#d9d9d9; width:200px; display:inline-block; color:#fff; border-radius:30px 0 0 30px; padding:3px 0 9px 10px; margin-top:-1px; display:none;}
.quick .hover07{position:absolute; left:-210px; top:1px;}
.quick .hover06{position:absolute; left:-95px; top:61px;}
.quick .hover01{position:absolute; left:-120px; top:121px; width:88px;  background-color:#79bc3b; border-radius:50px 0 0 50px;}
.quick .hover02{position:absolute; left:-95px; top:181px;}
.quick .hover03{position:absolute; left:-95px; top:241px;}
.quick .hover04{position:absolute; left:-95px; top:301px;}
.quick .hover05{position:absolute; left:-95px; top:360px; background-color:#665d54;}


/* 상단 */
.tmenu_wrap, .logo_wrap{width:1400px; margin:0 auto; overflow:hidden;}
.tmenu_left{float:left;}
.tmenu_right{float:right;}
.tmenu_left > ul > li, .tmenu_right > ul > li{display:inline-block; padding:5px 10px;}
.tmenu_right > ul > li{padding-right:0;}
.tmenu_left > ul > li{border-right:1px solid #ddd;}
.tmenu_left > ul > li:last-child{border-right:none;}
.tmenu_left > ul > li:nth-child(1){background:url(../img/top_ico01.png) no-repeat 5px 5px; padding-left:30px;}
.tmenu_left > ul > li:nth-child(2){background:url(../img/top_ico02.png) no-repeat 5px 5px; padding-left:30px;}
.tmenu_left > ul > li:nth-child(3){background:url(../img/top_ico03.png) no-repeat 5px 5px; padding-left:30px;}


.tmenu_right > ul > li{background:url(../img/gray_blit.png) no-repeat left 15px;}
.tmenu_right > ul > li:nth-child(1){background:url(../img/top_ico04.png) no-repeat 5px 5px; padding-left:30px;}

.logo_wrap{text-align:center; position:relative; padding:20px 0; background:url('/_css/images/main_top_bg15.png') no-repeat center  center;}
.logo_wrap > div:nth-child(1){position:absolute; left:0; top:10px; text-align:left;}
.logo_wrap > div:nth-child(1) > div:nth-child(1) > span:nth-child(1){font-size:14px;}
.logo_wrap > div:nth-child(1) > div:nth-child(1) > span:nth-child(2){font-size:14px; font-weight:600; color:#222;}

.logo_wrap > div:nth-child(1) > div:nth-child(2) > div:nth-child(1){font-size:14px; color:#d66600; font-weight:600;}
.logo_wrap > div:nth-child(1) > div:nth-child(2) > div:nth-child(2) > span{font-size:29px; font-weight:600;}

.logo_wrap > div:nth-child(3){position:absolute; right:0; top:30px; text-align:right;}
.logo_wrap > div:nth-child(3) > ul > li{display:inline-block;}


/* 검색 */
.logo_wrap .search {height:auto; position:relative; top:10px; right:0; overflow:hidden; width:260px; padding-bottom:12px;}
.logo_wrap .search input{background:#ececec; height:28px; color:#555; border:none;}
.logo_wrap .search input.input_box{width:98%; box-sizing:border-box; padding-right:25px; padding-left:10px;}
.logo_wrap .search input.search_btn{background:url(../img/top_.png) no-repeat right 3px;border:none;width:20px;height:20px;margin-left:-30px; position:absolute; top:3px; cursor:pointer;}


/* 하단 */
#bottom{background:#555953; padding:45px 0; position:relative;}
#bottom > div{width:1400px; margin:0 auto;}
#bottom > div > ul{width:680px;}
#bottom > div:nth-child(1){margin-bottom:15px; width:1400px; padding-left:0px;} 
#bottom > div:nth-child(2){width:1400px; padding-left:300px; box-sizing:border-box} 

#bottom > div:nth-child(1) > ul > li, #bottom > div:nth-child(2) > ul > li{color:#fff; display:inline-block;}
#bottom > div:nth-child(1) > ul > li > a{font-size:14px; color:#fff; }
#bottom .customer > ul{width:250px;}
#bottom > div.customer{position:absolute; right: calc( ( 100% - 1400px ) / 2 + 30px ); top:45px; width:250px; border-left:1px solid #aaaca9;}
#bottom .customer > ul > li{color:#fff; line-height:18px;}
#bottom > div:nth-child(2) > ul > li:last-child{color:#c6c6c6; padding-top:5px;}
#bottom .customer > ul{padding-left:40px;}
#bottom .customer > ul > li:nth-child(2) > span:nth-child(1){font-size:30px; color:#fff; font-weight:600;}
#bottom .customer > ul > li:nth-child(2) > span:nth-child(2){font-size:18px; color:#fff;}
#bottom .customer > ul > li:nth-child(3){font-size:24px; color:#fff;}

#bottom > div.b_logo{position:absolute; left: calc( ( 100% - 1400px ) / 2 ); top:75px; width:125px;}
/*
@media screen and (max-width: 1550px) {
/* 퀵메뉴
.quick{display:none;}
}

@media screen and (max-width: 1450px) {
.tmenu_wrap, .logo_wrap{width:96%;}	
#bottom > div{width:96%; padding-left:3%;}
#bottom > div.customer{width:auto; right:0; padding-right:3%;}

#bottom > div:nth-child(1), #bottom > div:nth-child(2){width:calc( 100% - 220px ); padding-left:190px;}
#bottom > div.b_logo{left: 0; width:170px; padding-left:1%; top:70px;}
#bottom > div.b_logo > img{width:95%; }
}

@media screen and (max-width: 1300px) {
#bottom > div > ul{width:600px;}
#bottom > div:nth-child(2) > ul > li:last-child{display:block;}
}

@media screen and (max-width: 1200px) {
#bottom > div > ul{width:550px;}

.logo_wrap > div:nth-child(3){top:5px;}
.logo_wrap > div:nth-child(3) > ul{width:300px;}
}

@media screen and (max-width: 1100px) {
#bottom > div.b_logo{display:none;}
#bottom > div:nth-child(1), #bottom > div:nth-child(2){width:96%; padding-left:3%;}
}

@media screen and (max-width: 950px) {
#bottom .customer{display:none;}
#bottom > div > ul{width:100%;}
}

@media screen and (max-width: 850px) {
.tmenu_wrap{width:100%;}	
.tmenu_left, .tmenu_right{float:none; text-align:center;}
.tmenu_right{border-top:1px solid #ddd; background:#f5f5f5;}

.logo_wrap > div:nth-child(1) > div:nth-child(1) > span{letter-spacing:-1px; font-size:13px;}
.logo_wrap .search {width:200px;}
}

@media screen and (max-width: 750px) {
.logo_wrap > div:nth-child(1){display:none;}
.logo_wrap{text-align:left;}

.logo_wrap > div:nth-child(3){top:30px;}
.logo_wrap > div:nth-child(3) > ul{width:430px;}

#bottom > div{padding-left:0;}
#bottom > div > ul{text-align:center;}
}

@media screen and (max-width: 700px) {
.logo_wrap > div:nth-child(3){top:5px;}
.logo_wrap > div:nth-child(3) > ul{width:300px;}
}

@media screen and (max-width: 450px) {
.logo_wrap{display:none;}

#bottom{padding:25px 0;}
#bottom > div > ul{line-height:14px;}
#bottom > div:nth-child(1) > ul > li > a{font-size:13.5px;}
#bottom > div > ul > li{font-size:12.5px;}

}

@media screen and (max-width: 350px) {
	
.tmenu_left > ul > li {padding:5px 5px;}
.tmenu_left > ul > li > a{font-size:12.5px; letter-spacing:-0.9px;}

} */