@charset "utf-8"; 

/*.layout {position:relative; max-width:130rem; width:100%; margin:0 auto;}

@media (max-width:1340px) {.layout {padding:0 3rem;}
}
@media (max-width:768px) {.layout {padding:0 2.4rem;}
}*/


body {position:relative; top:0; width:auto; height:100%; overflow:visible}
body.fix {position:fixed; width:100%; height:auto; overflow:hidden;}

.mo-show {display:none;}

.scroll-ani {opacity:0;}

::placeholder {font-style:normal !important;}

::-webkit-scrollbar {width:6px; height:6px;}
::-webkit-scrollbar-thumb {border-radius:50px; background-color:#e0e0e0;}
::-webkit-scrollbar-track {background-color:transparent;}

html {scrollbar-width:thin; scrollbar-color:#e0e0e0 transparent;}

/*::selection {background-color:#00a287; color:#fff;}*/

#header {position:fixed; top:0; left:0; z-index:10; width:100%; transition:0.1s;}/* margin-top:30px*/
#header::before {position:absolute; bottom:0; left:0; opacity:0; width:100%; height:1px; background-color:#efefef; pointer-events:none; transition:0.24s; content:"";}
#header.scroll,
#header.on {background-color:#fff;}
#header.scroll::before,
#header.on::before {opacity:1;}
#header.scroll .header_logo img,
#header.on .header_logo img {transform:translateY(-50%); width:180px;padding-top:20px}
#header.scroll #gnb .gi_dep01 > a,
#header.scroll .header_btn,
#header.on #gnb .gi_dep01 > a,
#header.on .header_btn {color:#222;}
#header.scroll .lang__box,
/*#header.on .lang__box {border:1px solid #e0e0e0; background-color:#fff;}*/
#header.scroll .nav_bg::before {position:absolute; bottom:0; left:0; width:100%; height:1px; background-color:#efefef; pointer-events:none; transition:0.24s; content:"";}
#header .header_wrap {display:flex; justify-content:space-between; align-items:center; height:95px; padding:0 20px}
#header.scroll .header_wrap,
#header.on .header_wrap {padding:0 20px}


#header .header_logo {width:230px; height:70px; overflow:hidden;}
#header .header_logo img {transition:0.4s;}
#header .header_menu {display:flex; align-items:center; padding-top:30px}/*justify-content:center; align-items:center; gap:0 20px*/
#header.scroll .header_menu,
#header.icon_scroll .header_menu{padding-top:0}
#header .header_btn {color:#fff; transition:0.24s; margin:0 20px}


/* 회사소개서 다운 */
.btn_down{transition:all .3s; display:none}
.btn_down li{display:inline-block; border-radius:100px}
.btn_down li a{color:#fff}
.btn_company{background:#0060bf url("../img/common/icon_down.png") no-repeat 88% center; padding:10px 50px 10px 25px}
.btn_axis{background:#3c455c url("../img/common/icon_down.png") no-repeat 88% center; padding:10px 50px 10px 25px; margin-left:5px; border:1px solid rgba(255, 255, 255, 0.5); bax-sizing:border-box}


.search__wrap{display:none}


/*스크롤시 회사소개서 다운 버튼보임  */
#header.scroll .btn_down{padding-top:0; display:block}
/*#header.on  .btn_down*/


/* 전체메뉴보기 */
.all_menu_open{display:block; width:32px; height:28px; background:url(../img/common/memu_all.png) center no-repeat; text-indent:-9999px; margin:30px 20px 0 0; transition:all .3s}

/* 롤오버시 간격조정 */
#header.scroll .all_menu_open,
#header.on  .all_menu_open{background:url(../img/common/memu_all_on.png) center no-repeat;}


#header #gnb {margin:0 3rem;}
#header #gnb .gl_dep01 {display:flex; gap:0 120px;}
#header #gnb .gl_dep02 {display:flex; position:absolute; bottom:0; left:50%; transform:translate(-50%, 100%); opacity:0; visibility:hidden; pointer-events:none; transition:opacity 0.3s;}
#header #gnb .gl_dep02.active {opacity:1; visibility:visible; pointer-events:all;}
#header #gnb .gl_dep02.active .gi_dep02::before {height:100%;}
/*#header #gnb .gl_dep03 {margin-top:2.4rem;}*/
#header #gnb .gi_dep01 {display:flex; justify-content:center; align-items:center; height:95px; padding-top:40px; box-sizing:border-box; transition:all .3s } 


/* 롤오버시 간격조정 */
#header.scroll  #gnb .gi_dep01,
#header.on  #gnb .gi_dep01{padding-top:12px}


#header #gnb .gi_dep01.on > a::before,
#header #gnb .gi_dep01.active > a::before {opacity:1;}
#header #gnb .gi_dep01 > a {position:relative; font-size:20px; font-weight:500; color:#fff; line-height:1.3333333333; text-align:center; transition:0.3s;}
#header #gnb .gi_dep01 > a::before {position:absolute; bottom:-28px; left:-30%; opacity:0; width:160%; height:4px; background-color:#ff3c00; transition:0.14s; content:"";}
#header #gnb .gi_dep02 {position:relative; min-width:200px; padding:20px; text-align:left;  transition:background-color 0.3s; text-align:center }
/*.eng #header #gnb .gi_dep02 {width:20rem;}*/
#header #gnb .gi_dep02:hover {background-color:#f4f6f9;}
#header #gnb .gi_dep02:hover > a {text-underline-offset:3px; text-decoration:underline;}
#header #gnb .gi_dep02.active > a {text-underline-offset:3px;}/* text-decoration:underline;*/
#header #gnb .gi_dep02::before {position:absolute; top:0; left:0; width:1px; height:0; background-color:#f2f2f2; transition:height 0.4s; content:"";}
#header #gnb .gi_dep02 > a {font-size:17px; font-weight:500;line-height:30px;}
#header #gnb .gi_dep03:last-child {margin-bottom:0;}
#header #gnb .gi_dep03:hover > a,
#header #gnb .gi_dep03.active > a {color:#222; text-underline-offset:3px; text-decoration:underline;}
#header #gnb .gi_dep03 > a {position:relative; font-size:14px; font-weight:500; color:#6a6a6a; line-height:28px; transition:0.14s; padding-left:10px}
#header #gnb .gi_dep03 > a::before{position:absolute; left:0; top:10px; opacity:1; width:3px; height:2px; background-color:#ff3c00; transition:0.14s; content:"";}


#header #gnb .nav_bg {position:absolute; top:95px; left:0; z-index:-1; width:100%; height:0; background-color:#fff; transition:0.4s;}

.sub #header {background-color:#fff;}
.sub #header .header_logo img {transform:translateY(-50%);}
.sub #header #gnb .gi_dep01 > a,
.sub #header .header_btn {color:#222;}
.sub #header .lang__box {border:1px solid #e0e0e0; background-color:#fff;}

#all_menu {/*display:flex;*/ position:fixed; top:0; left:0; opacity:0; z-index:20; width:100%; height:100vh; height:calc(var(--vh, 1vh) * 100); overflow:hidden; visibility:hidden; background-color:#0060bf; pointer-events:none; transition:opacity 0.34s;}
#all_menu.on {opacity:1; visibility:visible; pointer-events:auto;}
#all_menu .all_menu_top {display:flex; justify-content:space-between; align-items:center; position:absolute; top:0; left:0; width:100%; height:12rem; padding:0 6rem;}
#all_menu .all_menu_logo {height:auto; overflow:hidden;}

#all_menu .all_menu_close {width:26px; height:26px; background:url("../img/common/memu_all_close_w.png") no-repeat center; text-indent:-9999px}

#all_menu .all_menu_left {display:flex; flex-direction:column; justify-content:flex-end; max-width:30%; width:56rem; padding:6rem; background:url(/html/images/common/allmenu_bg.jpg) no-repeat center/cover; color:#fff;}
#all_menu .all_menu_contact {padding-bottom:2.4rem; margin-bottom:2.4rem; border-bottom:1px solid rgba(255, 255, 255, 0.4);}
#all_menu .all_menu_contact-item {display:flex; margin-bottom:1.2rem; font-size:1.6rem; line-height:2rem;}
#all_menu .all_menu_contact-item:last-child {margin-bottom:0;}
#all_menu .all_menu_contact-item strong {flex-shrink:0; width:7rem;}
#all_menu .all_menu_contact-item a {color:#fff;}
#all_menu .all_menu_copy {opacity:0.6; font-size:1.6rem; line-height:2rem;}
#all_menu .all_menu_right {flex-grow:1; padding:10rem; padding-top:14rem;}
#all_menu .L_dep01 {height:100%; overflow:auto; scrollbar-width:thin; scrollbar-color:#e0e0e0 transparent;}
#all_menu .L_dep01::-webkit-scrollbar {width:4px; height:4px;}
#all_menu .L_dep01::-webkit-scrollbar-thumb {border-radius:50px; background-color:#e0e0e0;}
#all_menu .L_dep02 {display:flex; flex-wrap:wrap; flex-grow:1; gap:15px 0;}
#all_menu .L_dep03 {margin-top:10px;}
#all_menu .I_dep01 {display:flex; padding:4rem 0; border-bottom:1px solid rgba(255, 255, 255, 0.5);}
#all_menu .I_dep01:last-child {border-bottom:none;}
#all_menu .I_dep01:hover > a,
#all_menu .I_dep01.active > a {color:#00ffd2;}
#all_menu .I_dep01 > a {width:25rem; height:100%; font-size:24px; font-weight:500; color:#fff; line-height:1.25; transition:0.14s;}
#all_menu .I_dep02 {width:25%; padding-right:1.4rem;}
#all_menu .I_dep02 > a {font-size:18px; font-weight:400; color:#fff; line-height:1.3333333333;}
#all_menu .I_dep03 {position:relative; padding-left:10px; margin-bottom:10px;}
#all_menu .I_dep03 ::before{content:""; position:absolute; top:8px; left:0; width:5px; height:2px; background:rgba(255, 255, 255, 0.6)}
#all_menu .I_dep03:last-child {margin-bottom:0;}
#all_menu .I_dep03:hover > a,
#all_menu .I_dep03.active > a {color:#00ffd2; text-underline-offset:3px; text-decoration:underline;}
#all_menu .I_dep03 > a {font-size:1.5rem; font-weight:400; color:rgba(255, 255, 255, 0.9); line-height:1; transition:0.14s;}


.all_btn{display:flex; align-items:center; margin-bottom:20px}
.all_btn li:last-child{margin-left:5px} 
.all_btn li a{color:#fff; border:2px solid rgba(255, 255, 255, 0.5); background: url("../img/common/icon_down.png") no-repeat 88% center; padding:5px 50px 5px 25px; font-size:20px}


/* footer */

.footer{width:100%;padding:40px 0 65px 0; background:#3c455c}
.footer ul{position:relative; display:block; width:1600px; min-height:90px; margin:0 auto; padding:0 50px 0 255px; box-sizing:border-box; background:url(../img/common/ci_trans.png) left top no-repeat; background-size:152px}
.footer li{margin-bottom:10px; color:#fff; font-size:14px}
.footer li{line-height:22px}
.footer li.top{position:absolute; width:70px; height:70px; top:-50px; right:0; background:url(../img/common/icon_top.png) center no-repeat  #27314a; transition:all 0.3s; text-indent:-9999px}
.footer li.top:hover{cursor:pointer; background:url(../img/common/icon_top.png) center 5px no-repeat #ff3c00;}



@media (max-width:1640px) {
#all_menu .all_menu_left {max-width:28%; width:42rem; padding:4rem;}
#all_menu .all_menu_right {padding:12rem 6rem 8rem;}
    
.footer ul{width:90%; padding:0 100px 0 180px} 
}


@media (max-width:1440px) {
    
#all_menu .all_menu_top {padding:0 4rem; height:10rem;}
#all_menu .I_dep01 > a {width:20rem;}
#all_menu .I_dep02 {width:33.3333333333%;}
    

#all_menu .all_menu_logo img {width:180px;}/*transform:translateY(-50%);*/
#all_menu .all_menu_left {display:none;}
#all_menu .all_menu_right {padding:10rem 4rem 6rem;}
}

@media (max-width:1250px) {
 /*#header .header_wrap {padding:0 3rem;}*/
 #header .btn_down{display:none} 
 #header #gnb .gl_dep01 {gap:6rem;}
	
/*스크롤시 회사소개서 다운 버튼 안보임   */
#header.scroll .btn_down,
#header.on  .btn_down{display:none}
	
}


@media (max-width:768px) { 
#header #gnb {display:none;}
#header .header_wrap {padding:0;  height:70px; }   /*align-items:flex-start; */
#header .header_logo {width:200px; height:60px}
#header .header_menu{padding-top:20px}
#header.on .header_btn,
#header.scroll .header_btn{margin:0}
#header.scroll .header_logo img, 
#header.on .header_logo img{padding-top:10px}
    
    
#all_menu .all_menu_top {padding:0 2.4rem;}
#all_menu .all_menu_right {padding:10rem 2.4rem 4rem;}
#all_menu .L_dep02 {flex-direction:column; gap:2px 0px}
#all_menu .I_dep02 {position:relative; padding-left:10px}  
#all_menu .I_dep02::before{content:""; position:absolute; top:11px; left:0; width:4px; height:4px; border-radius:4px; background:#fff}
#all_menu .I_dep02 > a{font-size:16px}
#all_menu .I_dep02 a:hover{color:#00ffd2}

    
#all_menu .I_dep01 {display:block; padding:2.4rem 1rem;}
#all_menu .I_dep01:first-child {padding-top:1rem;}
#all_menu .I_dep01 > a {display:inline-block; width:auto; margin-bottom:10px; } /*font-size:2.8rem;*/
#all_menu .I_dep02 {width:100%;}
#all_menu .I_dep03 > a{font-size:14px}
#all_menu .I_dep03:last-child {margin-bottom:0.8rem;}
/*#all_menu .I_dep03 > a {font-size:2rem;}*/
    
.all_menu_open{margin:30px 30px 0 0}
 
.footer ul{min-height:90px; margin:0 auto; padding:60px 0 20px 0; }
}

    

@media (max-width:640px) {
    
.footer{padding:30px 0 20px 0}
.footer li{line-height:20px}
.footer li.top{display:none} 
    
}

@media (max-width:500px) {
#all_menu .all_menu_top{padding:10px 20px 20px 20px; height:9rem}	
#all_menu .all_menu_logo img {width:160px}
}


@media (max-width:430px) {
.all_btn li a{border:1px solid rgba(255, 255, 255, 0.5); background:none; padding:5px 25px; font-size:16px; box-sizing:border-box}
}

@media (max-width:340px) {
	
#all_menu .all_menu_right{padding:8rem 2.4rem 4rem}	
	
.all_btn{display:block}
.all_btn li{width:100%; display:block}
.all_btn li a{display:block; width:100%; height:100%; padding:10px; box-sizing:border-box}
.all_btn li:last-child{margin-left:0; margin-top:5px}
}