@import url('/comm/css/font.css'); /* 폰트임 */
@import url('//fonts.googleapis.com/css?family=Sorts+Mill+Goudy&display=swap'); 
@import url('https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Nunito+Sans:400,700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Red+Hat+Text:400,500,700&display=swap');


@font-face { font-family: 'S-CoreDream-2ExtraLight'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-2ExtraLight.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'S-CoreDream-8Heavy'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-8Heavy.woff') format('woff'); font-weight: normal; font-style: normal; }



 @font-face{ font-family:NG; src:url('/font/NanumGothic.eot'); src:local(※), url('/font/NanumGothic.woff') format('woff');}
 @font-face{ font-family:NGEN; src:url('/font/NanumGothicBold.eot'); src:local(※), url('/font/NanumGothicBold.woff') format('woff');}

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;letter-spacing:normal} /* delete vertical-align,font:inherit; */
body,html{width:100%; height:100%; font-size:15px; color:#666; font-family:'Red Hat Text', 'Arial', 'Noto Sans KR', sans-serif;}

*{font-family:'Red Hat Text', 'Arial', 'Noto Sans KR', sans-serif;}
ol,ul,li{list-style:none;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
table {border-collapse:separate;border-spacing:0; font-size:13px;}
table caption {overflow:hidden; font-size:0; line-height:0; font-size:13px;}
tbody,tfoot,thead,tr,th,td {margin:0;line-height:155%;letter-spacing:normal;}
dt{display:block;}
hr{display:none;}
a{cursor:pointer;text-decoration:none;color:#666;}
address{font-style:normal;}
input,select,img{vertical-align:middle;}
input:focus, textarea:focus, button:focus {outline:none;}  /* 크롬에서 커서 클릭시 파란색 테두리 제외*/
.input_search {border:0; background:none; height:20px; width:155px; font-size:12px; color:#909496; font-family:'Red Hat Text', 'Arial', 'Noto Sans KR', sans-serif;;}

/* Web Content Accessibility TTS(Text To Speech) Code */
.blind {position:absolute; top:0px; left:0px; overflow:hidden; display:inline-block !important; width:1px !important; height:1px !important; margin:0 !important; font-size:0 !important; line-height:0 !important;}

/* 바로가기 */
#accessibilityMenu {position:absolute; overflow:hidden; visibility:hidden; font-size:0; line-height:0;}

/* Common */
.line_bg{height:2px; background-color:#f5f5f5}
.img_bor{border:1px solid #ddd}
.ls0 {letter-spacing:0 !important}
.font_eng {font-family:'Red Hat Text', sans-serif !important;}

/* 레이아웃 */
#wrap {position:relative; width:100%; height:100%; min-width:1480px; box-sizing:border-box;}

.header_in .logo a img.megainfo_a{max-width:200px;}
.header_in .logo a img.mo_on{display:none;}
/*.megainfo_a{
    max-width:120px!important;
}*/

/*-------------------------------*/
/*       Hamburger-Cross         */
/*-------------------------------*/

.quick{position:absolute;top:27px; left:10px; z-index:999;}
.quick a.btnMenu_m {display:block; font-size:12px; font-family:'Arial', sans-serif; color:#000; text-align:center; width:70px; height:70px; box-sizing:border-box;  /*padding-top:18px*/}
/*.quick a.btnMenu_m img {display:block; margin:0 auto 5px auto}*/
.quick a.btnMenu_m img {max-width:100%}
.quick a.btnMenu_m .icon{width:23px; height:18px;  background:url('/assets/images/main/asset/menu-icon2.png') center no-repeat; background-size:23px;  display:block; margin:21px auto 0 auto}
.quick a.btnMenu_m .metxt{font-size:12px; padding-top:8px; line-height:100%; color:#000; font-weight:500}
.quick a.btnMenu_m .icon2{width:23px; height:18px;  background:url('/assets/images/main/asset/menu-icon2.png') center no-repeat; background-size:23px;  display:block; margin:17px auto 0 auto}
.quick a.btnMenu_m .metxt2{font-size:12px; padding-top:8px; line-height:100%; color:#fff; font-weight:500}


.m_login {position:absolute; top:13px; right:14px}
.m_login a {display:block; background:url('../img/loginBtn_v3.png') bottom center no-repeat; background-size:28px; width:40px; height:40px; border:1px solid #fff; box-sizing:border-box; border-radius: 100%;}
.m_login img {max-width:100%}


.m_career{position:absolute; top:13px; right:14px;  overflow:hidden;}
.m_career .careerfade {width:50px; position:relative; overflow:hidden;}
.m_career .careerfade .cab{float:left;}
.m_career .one .icon{background: url('../img/career_iw.png') no-repeat;width: 26px;height: 24px; background-size: 26px; text-align:center; margin:0 auto}
.m_career .two .icon{background: url('../img/career_im.png') no-repeat;width: 26px;height: 24px; background-size: 26px; text-align:center; margin:0 auto}
.m_career .caname{color:#fff; text-align:center; font-size:12px; padding-top:4px}
.m_career .two .caname{color:#1fb5a9}

/* 메뉴 : 슬라이드 메뉴 */
#menuArea {max-width:600px; width:600px; height:100%; min-width:300px; position:fixed; left:0; top:0; z-index:999999; overflow-x:hidden;overflow-y:auto; display:none;}
#menuArea .menuList {width:600px; min-height:100%;  /*background:rgba(255,255,255,0.9);*/background:rgba(0,0,0,0.9); position:absolute; right:0; box-sizing:border-box;}
#menuArea .menuList .list {padding:10% 7% 7% 7%}
#menuArea .menuList .list dl { /*border-bottom:1px solid #ddd;*/border-bottom:1px solid rgba(255,255,255,0.3); box-sizing:Border-box; padding:5% 0}
#menuArea .menuList .list dl:first-child {padding-top:0}
#menuArea .menuList .list dl:last-child {border-bottom:0; padding-bottom:0}
#menuArea .menuList .list dl a {font-family:'Roboto','Noto Sans KR', sans-serif; display:block;}
#menuArea .menuList .list dt {margin-bottom:3%}
#menuArea .menuList .list dt a {font-size:20px; /*color:#000;*/color:#fff; font-weight:700; line-height:100%;}
#menuArea .menuList .list dd {position:relative; overflow:hidden;}
#menuArea .menuList .list dd a {font-size:14px; /*color:#666;*/ color:rgba(255,255,255,0.7); float:left; width:33.33%; margin-top:2%; line-height:160%; transition: all 0.3s ease-out;}
#menuArea .menuList .list dd a:hover {color:#1fb5a9; transition: all 0.3s ease-out;}
#menuArea .menuList .list dd a:first-child {margin-top:0}
#menuArea .menuList .list dd a:nth-child(2) {margin-top:0}
#menuArea .menuList .list dd a:nth-child(3) {margin-top:0}

#menuArea .menuList .btnMenu_mClose {cursor:pointer; display:block;width:70px; height:70px; background:#000; box-sizing:border-box; color:#fff; text-align:center; /*padding-top:16px;*/ font-size:14px; font-family:'Roboto', sans-serif;margin-left: 10px;}
#menuArea .menuList .btnMenu_mClose img {display:block; max-width:100%; margin-left: -10px;}

#grayLayer {width:100%; height:100%; background:rgba(0,0,0,0.6); position:fixed; left:0; top:0; z-index:9998; overflow-x:hidden;overflow-y:hidden;display:none;}
#grayLayer > a {display:block;width:100%;height:100%}








/* 푸터 */
#footer {position:relative; /*overflow:hidden;*/ }
.footer_in {width:1480px; padding:0 20px 30px 20px; box-sizing:border-box; margin:2% auto 0 auto; position:relative; }
.foot_info {/*float:left; width:calc(100% - 35%)*/}
.foot_info p.tel {line-height:150%; color:rgba(51,51,51,0.7); letter-spacing:-0.3pt;}
.foot_info p.tel span.lang {font-family:'Roboto', sans-serif; line-height:150%}
.foot_info p.tel span.lang a{font-family:'Roboto', sans-serif; line-height:150%}
.foot_info .com_info {margin:8px 0 15px 0; }
.foot_info .com_info p { line-height:150%; font-family:'Roboto', 'Noto Sans KR', sans-serif;  letter-spacing:-0.3pt; margin-bottom:3px}
.foot_info .com_info p:last-child {margin-bottom:0}
.foot_info .com_info p span {display:inline-block; vertical-align:middle; line-height:150%; font-family:'Roboto', 'Noto Sans KR', sans-serif;}
.foot_info .com_info p span.stit {font-weight:700;  letter-spacing:-0.3pt;}
.foot_info .com_info p img {display:inline-block; vertical-align:middle; line-height:150%;margin-top:-3px; max-width:10px}
.foot_info .copyright {font-family:'Roboto', sans-serif; color:rgba(51,51,51,0.7); line-height:150%; }
.foot_info .copyright a {font-family:'Roboto', sans-serif; color:rgba(51,51,51,0.7); line-height:150%;}

.foot_btn {position:absolute; right:20px; top:30px; width:324px}
.foot_btn > div {float:left; position:relative;}
.foot_btn > div.lang_site {margin-right:10px}
.foot_btn > div > a {font-family:'Arial', sans-serif; font-size:14px; border:1px solid rgba(51,51,51,0.2); color:rgba(51,51,51,0.6); box-sizing:border-box; text-align:left; padding:12px 18px; background:url('./img/select_foot_arrow.png') right 17px center no-repeat; width:157px;}
.foot_btn a {font-size:14px; line-height:100%; display:block; font-family:'Arial', sans-serif;}
.foot_btn ul {display:none; border:1px solid rgba(51,51,51,0.2); box-sizing:border-box; border-bottom:none; padding:12px 18px; background:#fff; position:absolute; top:-151%; width:100%}
.foot_btn ul li {padding-bottom:8px}
.foot_btn ul li:last-child {padding-bottom:0}
.foot_btn ul li a {}

.foot_btn > div.on > a {background-image:url('../../img/select_foot_arrow.png')}
.foot_btn > div.on ul {display:block;}

.foot_link {position:absolute; right:20px; top:87px; width:240px}
.foot_link li {float:left; margin-right:10px; text-align:right;}
.foot_link li:last-child {margin-right:0}
.foot_link li a strong {font-weight:700; color:rgba(51,51,51,0.7); letter-spacing:-0.3pt;}
.foot_link li a {color:rgba(51,51,51,0.7); letter-spacing:-0.3pt;}


/* 게시판 페이징 */
.page_num { position: relative; width: 100%; text-align: center; padding: 15px 0 0 0 }
.page_num ul.pagination { display: inline-block; padding: 0; margin: 0 }
.page_num ul.pagination li { display: inline }
.page_num ul.pagination li a { color: #666; float: left; padding: 6px 12px; text-decoration: none; border: 1px solid #CBCBCB; margin: 0 1px }
.page_num ul.pagination li a.active { background: #000; color: #FFF; border: 1px solid #000 }

/** 에러페이지 **/
#error {position:absolute; border:1px solid #ddd; width:500px; padding:200px 50px 50px 50px; text-align:center; background:url('/img/warning_icon.gif') center 50px no-repeat; left:50%; margin-left:-300px; top:49%; margin-top:-203px; box-shadow:0px 5px 0 #f6f6f6;} /*  -moz-transform:translateY(-49%); -ms-transform:translateY(-49%); -webkit-transform:translateY(-49%); transform:translateY(-49%); */
#error h1 {color:#333; font-family:"NanumGothic", "NG", MalgunGothic, Dotum, Arial, sans-serif; margin:0; letter-spacing:-0.5pt;}
#error h1 span {color:#cc141d;}
#error div {color:#666; font-size:18px; letter-spacing:-0.5pt; margin-top:30px; padding-top:30px; line-height:150%; border-top:1px dashed #ccc;}

.show1400 {display:none;}
.none1400 {display:block;}
.show980 {display:none;}
.none980 {display:none;}
.show768 {display:none;}
.show680 {display:none;}



/*탑 버튼*/
div.topBtn { position:fixed; right:20px; bottom:20px; z-index:999; }
div.topBtn #scroll {display:block; background:url('../../img/top.png') center no-repeat, rgba(0,0,0,0.3); background-size:15px; border-radius: 55px; width:55px; height:55px;}
div.topBtn #scroll:hover{background:url('../../img/top.png') center no-repeat, #6740c9; background-size:15px;  }

div.topBtn2 { position:fixed; right:37px; bottom:20px; z-index:999; }
div.topBtn2 #scroll {display:block; background:url('../../img/top.png') center no-repeat, rgba(0,0,0,0.3); background-size:15px; border-radius: 55px; width:55px; height:55px;}
div.topBtn2 #scroll:hover{background:url('../../img/top.png') center no-repeat, #1fb5a9; background-size:15px;  }

#up_btn {position:fixed; right:20px; bottom:20px; text-align:center; z-index:9998; }
#up_btn a {width:50px; height:50px; padding-top:16px; background:#9f9c9c; display:block; box-sizing:border-box}
#up_btn a:hover {background:#90c31f;}


/*******************************************************************************
	@media 1400px~1600px
*******************************************************************************/
@media all and (max-width:1600px){

#wrap {min-width:1300px}
.footer_in {width:1300px}
.foot_btn {width:290px}
.foot_btn > div > a {width:140px}

}

/*******************************************************************************
	@media 1200px~1400px
*******************************************************************************/
@media all and (max-width:1400px){

.show1400 {display:block;}
.none1400 {display:none;}

#wrap {min-width:auto}

.quick a.btnMenu_m {font-size:1vw}

.quick {position:relative; top:auto; left:auto; overflow:hidden; border-bottom:1px solid #ddd;  }
.quick .btnMenu_m {float:left;}
.quick .logo {text-align:Center; position:absolute; top:0; left:50%; margin-left:-65px}
.quick .logo a {display:inline-block; padding:21px 0}  
.quick .logo a img{max-width:130px}


.quick a.btnMenu_m .icon{margin: 17px auto 0 auto;}

#menuArea {width:80%; max-width:100%}
#menuArea .menuList {width:100%;}
#menuArea .menuList .list {padding:7% 5%}
#menuArea .menuList .list dl {padding:3% 0}
#menuArea .menuList .list dt {margin-bottom:1.5%}
#menuArea .menuList .list dt a {font-size:1.5vw}
#menuArea .menuList .list dd a {font-size:1.2vw}
#menuArea .menuList .btnMenu_mClose {font-size:1vw}









.footer_in {width:100%}

.foot_btn a {font-size:1vw !important}
.foot_btn > div > a {width:140px}
.foot_info p.tel {font-size:1vw}
.foot_info .com_info {margin:1% 0 2% 0}
.foot_info .com_info p {font-size:1vw}
.foot_info .copyright {font-size:1vw}
.foot_link {width:16%; top:65%}
.foot_link li {margin-right:3%}
.foot_link li a {font-size:1vw}
}

/*******************************************************************************
	@media 1024px~1200px
*******************************************************************************/
@media all and (max-width:1200px){

.quick a.btnMenu_m  {font-size:1.2vw}

#menuArea .menuList .btnMenu_mClose {font-size:1.2vw}




.foot_btn {width:250px} 
.foot_btn > div > a {width:120px; padding:10px 12px; background-position:right 12px center}
.foot_btn ul {top:-169%}

}

/*******************************************************************************
	@media 980px~1024px
*******************************************************************************/
@media all and (max-width:1024px){

.quick_box{display:none;}

#menuArea .menuList .list dt a {font-size:2vw}
#menuArea .menuList .list dd a {font-size:1.5vw}




.foot_btn a {font-size:1.4vw !important}
.foot_info p.tel {font-size:1.4vw}
.foot_info .com_info p {font-size:1.4vw}
.foot_info .copyright {font-size:1.4vw}
.foot_link {width:22%}
.foot_link li a {font-size:1.4vw}


}

/*******************************************************************************
	@media 768px~980px
*******************************************************************************/
@media all and (max-width:980px){

.show980 {display:block !important}
.monone{display:none !important;}
#menuArea {width:100%; max-width:100%}


.quick a.btnMenu_m  {font-size:1.5vw}
/*.quick a.btnMenu_m img {width:20px}*/

.foot_btn {width:210px} 
.foot_btn > div > a {width:100px;}


}

/*******************************************************************************
	@media 640px~768px
*******************************************************************************/
@media all and (max-width:768px){

.show768 {display:block !important;} 
.none768 {display:none !important}


.quick {}
.quick a.btnMenu_m {width:60px; height:60px; /*padding:15px 0;*/ font-size:14px}
/*.quick a.btnMenu_m img {width:20px}*/
.quick .logo {margin-left:-50px}
.quick .logo a {padding:18px 0}
.quick .logo a img {width:100px}

.quick a.btnMenu_m .icon{margin:13px auto 0 auto; background-size:20px; width:20px; height:16px}
.quick a.btnMenu_m .metxt{font-size:10px; padding-top:5px}

.m_login {top:12px; right:12px}
.m_login a {width:35px; height:35px; background-size:24px;}

#header .header_in {height:60px !important}
.header_in .logo {/*margin-left:-50px;*/ padding:0}
.header_in .logo a {padding:15px 0; /*display: none;*/}
.header_in .logo a img {width:100px}

.m_career{top:11px;}
.m_career .careerfade{width:40px;}
.m_career .one .icon{background-size:20px; width:20px; height:18px}
.m_career .two .icon{background-size:20px; width:20px; height:18px}
.m_career .caname{font-size:10px;}

.quick a.btnMenu_m .icon2{margin:13px auto 0 auto; background-size:20px; width:20px; height:16px}
.quick a.btnMenu_m .metxt2{font-size:10px}

#menuArea .menuList .list dt a {font-size:14px}
#menuArea .menuList .list dd a {font-size:13px}
#menuArea .menuList .btnMenu_mClose {width:60px; height:60px; /*padding:2% 0;*/ font-size:14px}








.footer_in {padding:10px 3% 15px 3%; overflow:hidden;}
.foot_info {float:none; width:100%; overflow:hidden; }
.foot_btn {position:relative; right:auto; top:auto; width:100%; margin-top:1.5%;}
.foot_btn a {font-size:14px !important}
.foot_btn > div > a {width:100%}
.foot_btn > div {width:49%; display:inline-block;}
.foot_btn > div.lang_site {margin-right:2%}
.foot_btn ul {top:-168%}

.foot_info p.tel {font-size:2vw}
.foot_info .com_info p {font-size:2vw}
.foot_info .copyright {font-size:2vw}
.foot_link {position:relative; right:auto; top:auto; width:100%; margin-bottom:1.5%; overflow:hidden;}
.foot_link li {text-align:left; display:inline-block}
.foot_link li a {font-size:2vw}

.page_num ul.pagination li a{font-size:11px; padding:4px 8px;}


}

/*******************************************************************************
	@media 480px~680px
*******************************************************************************/
@media all and (max-width:680px){

.show680 {display:block !important;}


#header .header_in {height:55px !important} 
.quick a.btnMenu_m {width:55px; height:55px;}
#menuArea .menuList .list dl {padding:20px 0}
#menuArea .menuList .list dt {margin-top:10px}
#menuArea .menuList .list dt a {font-size:14px}
#menuArea .menuList .list dd a {width:50%}
#menuArea .menuList .list dd a {margin-top:6px}
#menuArea .menuList .list dd a:nth-child(3) {margin-top:6px}
#menuArea .menuList .btnMenu_mClose {width:55px; height:55px; }


.m_career{top:10px}
.quick a.btnMenu_m .icon2{margin:11px auto 0 auto}

.foot_btn a {font-size:12px !important}
.foot_info p.tel {font-size:12px}
.foot_info .com_info p {font-size:12px; margin-bottom:0; line-height:180%}
.foot_info .copyright {font-size:12px}
.foot_link li a {font-size:12px}



.m_login {top:9px}



/*탑 버튼*/
div.topBtn{right:15px; bottom:15px;}
div.topBtn #scroll {border-radius:40px; width:40px; height:40px;}

div.topBtn2{right:15px; bottom:15px;}
div.topBtn2 #scroll {border-radius:40px; width:40px; height:40px;}

}

/*******************************************************************************
	@media 480px~640px
*******************************************************************************/
@media all and (max-width:480px){

.quick a.btnMenu_m {font-size:2.4vw}
#menuArea .menuList .btnMenu_mClose {font-size:2.4vw; width:45px; height:45px}


#menuArea .menuList .list dl:nth-child(3) dd a:first-child{margin-top:0}
#menuArea .menuList .list dl:nth-child(3) dd a{width:100%; margin-top:6px}

#menuArea .menuList .list dl:nth-child(5) dd a:first-child{margin-top:0}
#menuArea .menuList .list dl:nth-child(5) dd a{width:100%; margin-top:6px}


.foot_info p.tel span.fspan{display:block;}





}

/*******************************************************************************
	@media 480px~640px
*******************************************************************************/
@media all and (max-width:360px){

.page_num ul.pagination li a{font-size:10px;}
