@charset "utf-8";

@import "base.css";
@import "webfont.css";

/* skipnav */
.skipnav {position:relative;z-index:13569}
.skipnav a {position:absolute;top:-30px;left:0;display:inline-block;padding:0 20px;background:#000;color:#fff;line-height:30px;font-size:12px}
.skipnav a:focus {top:0}

/* header */
.header{position:absolute;top:0;left:0;width:100%;font-weight:300;color:#fff;z-index:100}
.header_wrap{display:flex;justify-content:space-between;align-items:center;text-align:center;max-width:1920px;margin:0 auto;padding:0 60px;}
.logo_link {display:block;width:156px;height:47px;background:url(../images/Logo_kmet_wh.png) no-repeat;background-size:156px 47px}
.gnb>li{display:inline-block;position:relative}
.gnb_link{display:block;padding:0 40px;font-size:18px;font-weight:bold;line-height:160px;transition:all 0.3s ease-out}
.gnb_link:hover{color:var(--point)}
.snb{position:relative;z-index:60}
.snb_item{display:inline-block}
.snb_item~.snb_item{margin-left:10px}
.snb_cape{overflow:hidden;display:flex;align-items:center;justify-content:center;}
.snb_cape li{display:flex;}
.snb_cape li a{display:block;padding:5px 15px;height:32px;line-height:22px;font-weight:500;font-size:14px;border-radius:20px;background:var(--point);color:var(--white);}
.snb_cape li a i {margin-left:5px;font-weight:300;}
.btn-menu{position:relative;width:34px;height:22px;padding:6px}
.btn-menu_line{display:block;position:absolute;right:6px;height:3px;background:#fff}
.btn-menu_line-bottom{bottom:6px;width:16px}
.btn-menu_line-top{top:6px;width:22px}
.logo{position:relative;z-index:40}
.lnb{display:none;position:absolute;top:130px;left:0;width:100%;background:#fff;text-align:center;transition:all 0.3s ease-out}
.lnb:before{content:'';position:absolute;left:0;top:0;width:100%;height:1px;background:var(--lightgray)}
.lnb:after{content:'';position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--lightgray)}
.lnb_wrap{display:flex;max-width:1400px;margin:0 auto}
.lnb_box{flex:1;position:relative;padding:30px 0;border-right:1px solid var(--lightgray)}
.lnb_box:last-child{border-right:0}
.lnb_box:after{content:'';position:absolute;top:-1px;left:50%;width:0;height:2px;background:var(--point);transition:all 0.3s ease-out;z-index:5}
.lnb_box:hover:after{width:160px;margin-left:-80px}
.lnb_title{margin-bottom:20px;font-size:20px;font-weight:500;color:#000}
.lnb_list>li~li{margin-top:10px}
.lnb_list>li a{color:#333}
.lnb_list>li:hover a{font-weight:600;color:var(--point)}
.lnb_list>li a i {margin-left:5px;font-size:14px;font-weight:300;}
.lnb_tab{font-size:9px}
.header.active .lnb{display:block}
.header.active,.header.sub-white{background:#fff;color:#000}
.header.white{background:#fff}
.header.white .snb_item{color:#000}
.header.white .logo_link,.header.active .logo_link, .header.sub-white .logo_link{background-image:url(../images/logo_KMET.png)}
.header.white .btn-menu_line,.header.active .btn-menu_line,.header.sub-white .btn-menu_line{background:#000}

/* footer */
.footer{background-color:#fff;border-top:1px solid var(--lightgray)}
.footer_inner{display:flex;max-width:1920px;margin:0 auto;padding:50px 10px;justify-content:space-between;}
.footer_box{position:relative;}
.footer_logo{display:inline-block;margin-bottom:30px}
.footer_info{font-size:16px;line-height:28px}
.footer_info .copyright {font-size:14px;}

/* btn-top */
.btn-top {position:absolute;right:0;top:0;display:inline-block;height:70px;width:70px;border:1px solid var(--point);background-color:#fff;background-position:50%;background-repeat:no-repeat;transition:all 0.5s ease-in-out;overflow:hidden;cursor:pointer;}
.btn-top_icon {display:inline-block;position:relative;width:70px;height:70px;background:url(../images/icon/icon_top.svg) no-repeat 50% 50%;z-index:10;transition:all 0.3s linear}
.btn-top:before {content:"";position:absolute;bottom:-70px;width:100%;height:100%;margin-left:-1px;margin-bottom:-1px;border:1px solid transparent;background-color:var(--point);transition:all 0.3s linear;}
@media (hover:hover){
.btn-top:hover .btn-top_icon{background-image:url(../images/icon/icon_top_white.svg)}
.btn-top:hover:before {bottom:0}
}
@media screen and (max-width:1439px) {
.header_wrap {padding:0 40px}
.gnb_link{padding:0 20px}
.modal-open .header_wrap{padding-right:40px}
}
@media screen and (max-width:1023px) {
.header_wrap{padding:30px 20px}
.logo_link{width:54px;height:54px;background:url(../images/Logo_kmet_mo_wh.png) no-repeat;background-size:54px 54px}
.header.white .logo_link{width:54px;height:54px;background:url(../images/Logo_kmet_mo.png) no-repeat;background-size:54px 54px}
.gnb{display:none}
.snb{line-height:19px}
.snb_item~.snb_item{margin-left:10px}
.snb_contact,.snb_lang{font-size:12px}
.snb_lang:after{width:4px;height:9px;margin-top:-4px;background-size:4px 9px}
.modal-open .header_wrap{padding-right:20px}
.modal-open .btn-menu.on .btn-menu_line-top{top:8px}
.modal-open .btn-menu.on .btn-menu_line-bottom{width:14px}
.footer_inner{flex-direction:column;}
.footer_logo{margin-bottom:25px;line-height:1}
.footer_logo img{width:70%}
.btn-top{margin-top:-200px;}
}
@media screen and (max-width:767px) {
.modal-open .header_wrap{padding-right:20px}
.gnb_link{padding:0 20px}
.footer{padding-top:50px}
.footer_inner{padding:30px 10px;}
.footer_logo{display:none}
.footer_info{font-size:14px;line-height:24px}
.footer_info span {display:block;margin-left:0 !important;}
}	

/* sitemap */
.sitemap{position:fixed;overflow-y:scroll;top:0;left:0;width:100%;height:100vh;background:#fff;color:#000;opacity:0;visibility:hidden;transition:all 0.3s ease-out;z-index:-1}
.sitemap.active{visibility:visible;opacity:1;z-index:11}
.sitemap_wrap{display:flex;align-items:center;max-width:1920px;height:100%;margin:0 auto;padding:0 20px;}
.sitemap_box{flex:1;}
.sitemap_slogan{font-size:2.2vw;font-weight:900;line-height:1.2;letter-spacing:0;text-align:left;text-transform:uppercase}
.sitemap_item{overflow:hidden;color:var(--black);}
.sitemap_title{display:block;padding:20px 25px;font-size:36px;font-weight:bold;cursor:pointer;}
.sitemap_list{display:none;}
.sitemap_list>li{display:block;padding:10px 25px;font-size:20px;font-weight:bold;color:#999}
.sitemap_list>li:hover{color:#000}
.sitemap_list>li i {margin-left:5px;font-size:14px;font-weight:300;}
.sitemap_item.active .sitemap_list>li a{color:var(--black)}
.sitemap_item.active .sitemap_title {color:var(--black);}
@media screen and (max-width:1023px) {
.sitemap_wrap{flex-direction:column;align-items:flex-start;overflow-y:auto;height:calc(100% - 85px);margin-top:150px;padding:0 20px;}
.sitemap_box{flex:none;width:100%;}
.sitemap_box~.sitemap_box{margin-top:50px;}
.sitemap_title{font-size:30px}
.sitemap_list{background:#eee;padding:20px 25px;}
.sitemap_slogan{font-size:2vw}
.sitemap_slogan span{overflow:hidden;display:block;position:relative;font-size:7vw;font-weight:bold;line-height:1.2; -webkit-text-stroke:1px #000;color:transparent}
.sitemap_slogan span:nth-child(1):before{content:'KMET';display:block;font-size:7vw;font-weight:bold;line-height:1.2;transition-delay:0.2s}
.sitemap_slogan span:nth-child(2):before{content:'(유)한국기계설비기술';display:block;font-size:7vw;font-weight:bold;line-height:1.2;transition-delay:0.4s}
.sitemap_slogan span:nth-child(3):before{content:'';display:block;font-size:7vw;font-weight:bold;line-height:1.2;transition-delay:0.6s}
.sitemap_slogan span:before{overflow:hidden;position:absolute;top:0;left:0;height:0;transition:height 0.3s ease-out;color:#000}
.sitemap_slogan.active span:before{height:100%}
.modal-open .sitemap_slogan span:before{height:100%;color:#000}
}

/* popup */
.popup {display:none;overflow-x:hidden;overflow-y:auto;position:fixed;top:0;right:0;bottom:0;left:0;z-index:50}
.dimmed{position:absolute;top:0;left:0;bottom:0;right:0;background:rgba(0,0,0,0.5)}
.popup-dark{background:rgba(0,0,0,0.7)}
.popup-main{display:block}
.popup_wrap{display:flex;gap:30px;min-height:100%;padding:50px 0;justify-content:center;align-items:center}
.popup_wrap-fit{padding:0}
.popup_inner{overflow:hidden;flex-basis:900px;z-index:10}
.popup_box{padding:60px;background:#fff}
.popup_header{position:relative;padding-right:30px;padding-bottom:36px;border-bottom:1px solid var(--lightgray)}
.popup_content {position:relative}
.popup_category{margin-bottom:10px;font-weight:bold;color:var(--point)}
.popup_title{display:-webkit-box;overflow:hidden;max-height:68px;font-size:30px;font-weight:500;line-height:34px;text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.popup_imagewrap{padding:58px;text-align:center}
.popup_image{display:inline-block;height:calc(65vh - 116px);max-height:650px;border:1px solid var(--lightgray);text-align:center}
.popup_image img{max-height:100%}
.popup_form{overflow-Y:scroll;overflow-x:hidden;max-height:calc(100vh - 310px)}
.popup_form::-webkit-scrollbar{width:2px}
.popup_form::-webkit-scrollbar-thumb{background:#333}
.popup_form::-webkit-scrollbar-track{background:#d8d8d8}
.popup_buttons{display:flex;justify-content:space-between;align-items:center;position:absolute;top:50%;left:50%;width:100%;transform:translate3d(-50%, -50%, 0);z-index:10}
.popup_direction{width:25px;height:25px;margin-top:-12px;background-position:50%;background-repeat:no-repeat}
.popup_direction-prev{margin-left:5px;border-right:3px solid var(--lightgray);border-bottom:3px solid var(--lightgray);transform:rotate(135deg)}
.popup_direction-prev:after{content:none}
.popup_direction-next{margin-right:5px;border-right:3px solid var(--lightgray);border-bottom:3px solid var(--lightgray);transform:rotate(-45deg)}
.popup_direction-next:after{content:none}
.popup_footer{display:flex;justify-content:space-between;align-items:center;padding:13px;background:var(--white);font-size:20px;}
.popup_todaycheck{font-weight:300}
.popup_todaycheck .icon-form{vertical-align:text-top}
.popup_todayclose{width:17px;height:17px}
.btn-todayclose img{width:17px;height:17px}
.btn-close{position:absolute;top:0;right:0;cursor:pointer}
.btn-close img{width:17px;height:17px}
.modal-open{overflow:hidden}
.modal-open .btn-menu.on .btn-menu_line-top{top:10px;transform:rotate(-45deg)}
.modal-open .btn-menu.on .btn-menu_line-bottom{bottom:9px;width:22px;transform:rotate(45deg)}


/* btn */
.buttons{margin-top:58px;text-align:center}
.btn{display:inline-block;text-align:center;line-height:1.8;transition:all 0.3s ease-out}
.btn-link{overflow:hidden;position:relative;width:220px;line-height:58px;border:1px solid #999;color:#666;font-weight:500; text-align:center}
.btn-link:before{content:'';position:absolute;top:50%;left:50%;width:100%;height:0;padding-bottom:25%;border-radius:0%;background:var(--point);transform:translate3d(-50%,-50%,0) scale3d(0,0,1);z-index:-1}
.btn-link:after{content:'';display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:var(--point);opacity:0;transition:opacity 0.3s ease-out;z-index:-1}
.btn-link:hover:before{transition:transform 0.4s cubic-bezier(0.1, 0, 0.3, 1);transform:translate3d(-50%,-50%,0) scale3d(1,1,1)}
.btn-link:hover:after{opacity:1;transition-duration:0.01s;transition-delay:0.3s}
.btn-link:hover,.btn-link.active{border-color:var(--point);color:#fff;background:var(--point)}
.btn-link i { margin-left:25px}
.btn-large{width:280px;line-height:75px}
.btn-submit{overflow:hidden;position:relative;width:280px;border:1px solid var(--point);color:var(--point)}
.btn-submit:before{content:'';position:absolute;top:50%;left:50%;width:110%;height:0;padding-bottom:110%;border-radius:50%;background:var(--point);transform:translate3d(-50%,-50%,0) scale3d(0,0,1);z-index:-1}
.btn-submit:after{content:'';display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:var(--point);opacity:0;transition:opacity 0.3s ease-out;z-index:-1}
.btn-submit:hover:before{transition:transform 0.4s cubic-bezier(0.1, 0, 0.3, 1);transform:translate3d(-50%,-50%,0) scale3d(1,1,1)}
.btn-submit:hover:after{opacity:1;transition-duration:0.01s;transition-delay:0.3s}
.btn-submit:hover{color:#fff;animation:text 0.5s cubic-bezier(0.4, 0, 0, 1)}
.btn-submit.active{background-color:var(--point);color:#fff}
.btn-register:before,.btn-register:after{z-index:0}
.btn-register>span{position:relative;z-index:10}
.btn-secondary{border:1px solid #999;color:#666;font-weight:500}
.btn-cancel{border:1px solid var(--lightgray);color:#666}
.btn-list{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:60px;height:60px;border:1px solid var(--point);background:url(../images/icon/icon_all.svg) no-repeat 50% 50%;text-indent:-999em}
@media (hover:hover){
.btn-list:hover{background:var(--point) url(../images/icon/icon_all_white.svg) no-repeat 50% 50%}
}
@keyframes arrow {0%{transform:translateX(0px)}100%{transform:translateX(10px)}}
@media screen and (max-width:1023px) {
.buttons{margin-top:40px}
.btn-link{width:100%;line-height:48px;border-color:var(--point);background:var(--point);color:var(--white)}
.btn-submit{background:var(--point);color:var(--white)}
}


/* sub */
.content{padding-top:385px}
.content_wrap{position:relative;padding:60px 0;background-color:#fff;z-index:5}
.content_header{text-align:center}
.content_title{margin-bottom:30px;font-size:44px;font-weight:600;text-align:center;color:#000}
.content_title-large{margin-bottom:60px}
.content_title-fit{margin-bottom:0}
.content_title+div{overflow:hidden;max-width:1920px;margin:0 auto}
@media screen and (max-width:1439px) {
.content_wrap{padding-left:20px;padding-right:20px}
.content_title+div{overflow:visible}
}
@media screen and (max-width:1023px) {
.content{padding-top:250px}
.content_wrap{padding-top:40px}
.content_title{font-size:32px;line-height:1.25}
.content_title-large{margin-bottom:20px}
.content_title+div{overflow:visible}
}
@media screen and (max-width:767px) {
.content_wrap{padding-top:30px;padding-left:20px;padding-right:20px}
.content_title{margin-bottom:20px;font-size:28px}
.content_title-large{margin-bottom:325px}
}

/* subvisual */
.subvisual{position:fixed;top:0;left:0; width:100%; height:450px;color:#fff;text-align:center;animation:subvisual_bg 5s ease both;}
.subvisual_title{position:relative;overflow:hidden;padding-top:38px;font-size:56px;font-weight:bold;line-height:1.5;transition-delay:0.3s;}
.subvisual_desc{margin-top:20px;transition-delay:0.5s;}
.subvisual-company {background-image:url(../images/bg_cpmpany.png)}
.subvisual-business {background-image:url(../images/bg_business.png)}
.subvisual-work {background-image:url(../images/bg_work.png)}
.subvisual-news {background-image:url(../images/bg_news.png)}
.subvisual-cape {background-image:url(../images/bg_cape.jpg)}
.subvisual-contact {background-image:url(../images/bg_contact.jpg)}
.subvisual-cape {background-repeat:no-repeat;background-position:50% 0;background-size:cover;}
@keyframes subvisual_bg { 0% {-webkit-transform:translate(-0%,-0%) scale(1.3);transform:translate(-0%,-0%) scale(1.3);}100% {-webkit-transform:translate(-0%,-0%) scale(1); transform:translate(-0%,-0%) scale(1);}}
@media screen and (max-width:767px) {
.subvisual-company{background-image:url(../images/bg_company_mo.jpg);}
.subvisual-business{background-image:url(../images/bg_business_mo.png);}
.subvisual-work{background-image:url(../images/bg_work_mo.png);}
.subvisual-news{background-image:url(../images/bg_news_mo.png);}
.subvisual-cape {background-image:url(../images/bg_cape_mo.jpg)}
.subvisual-contact {background-image:url(../images/bg_contact_mo.jpg)}	
}
@media screen and (max-width:1023px) {
.subvisual{position:absolute;height:250px;padding:0 20px}
.subvisual_title{margin-bottom:5px;padding-top:40px;font-size:40px}
.subvisual_description{font-size:16px}
}

/* breadcrumb */
.breadcrumb{position:relative}
.breadcrumb:after{position:absolute;top:0;right:0;width:50%;height:100%;background:#fff;content:'';z-index:-1}
.breadcrumb_wrap{display:flex;max-width:1400px;margin:0 auto;font-weight:400;background-color:#fff}
.breadcrumb_menu{position:relative;height:74px}
.breadcrumb_btn{display:block;overflow:hidden;position:relative;width:345px;padding:0 60px 0 30px;font-weight:400;line-height:74px;white-space:nowrap;text-overflow:ellipsis;box-sizing:border-box;color:#000}
.breadcrumb_btn:before{position:absolute;top:50%;left:0;width:1px;height:22px;margin-top:-11px;background-color:var(--lightgray);content:''}
.breadcrumb_btn:after{position:absolute;top:50%;right:30px;width:12px;height:8px;margin-top:-4px;background:url(../images/icon/icon_dropdown.svg) no-repeat 50%;transition:all 0.3s ease-out;content:''}
.breadcrumb_btn.active:after{transform:rotate(180deg);color:var(--point)}
.breadcrumb_list{display:none;position:absolute;top:74px;left:0;z-index:10;width:100%;padding:20px 30px;border:1px solid var(--lightgray);background:var(--white);box-sizing:border-box}
.breadcrumb_list>li~li{margin-top:15px}
.breadcrumb_list>li a{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;min-height:22px;color:#666;line-height:22px;overflow:hidden;text-overflow:ellipsis}
.breadcrumb_list>li:hover a{font-weight:600;color:var(--point)}
.breadcrumb_list>li:hover a{font-weight:600;color:var(--point)}
.btn-home{display:block;position:relative;width:84px;height:74px;text-indent:-999em}
.btn-home:before{position:absolute;top:50%;left:50%;width:20px;height:20px;margin-top:-10px;margin-left:-10px;background:url(../images/icon/icon_home.svg) no-repeat 50%;content:''}
@media screen and (max-width:1280px) {
.breadcrumb{border-bottom:1px solid var(--lightgray)}
.breadcrumb_menu{width:50%;height:50px}
.breadcrumb_menu-home,
.breadcrumb_menu:first-child{display:none}
.breadcrumb_btn{width:100%;max-width:none;min-width:auto;padding:0 50px 0 20px;line-height:50px;font-size:16px;}
.breadcrumb_btn:after{right:20px;margin-top:-2px}
.breadcrumb_btn.active:after{margin-top:-4px}
.breadcrumb_list{top:50px;padding:18px 20px}
.breadcrumb_list>li a{min-height:22px;line-height:18px}
.breadcrumb_list>li:hover a{font-weight:400}
}

/* tab */
.tab{display:flex;margin-top:50px;text-align:center}
.tab a{flex:1 0 25%;padding:10px;border:1px solid var(--lightgray);font-size:18px;font-weight:500;}
.tab.type1 a{flex:1 0 15%}
.tab-more a{flex:1}
.tab a~a{margin-left:-1px}
.tab a:hover{background:var(--gray);color:#fff}
.tab a.active {border-color:var(--point);background:var(--point);color:#fff}
@media screen and (max-width:1280px) {
.tablewrap::-webkit-scrollbar{height:4px;border-radius:2px;background:var(--lightgray)}
.tablewrap::-webkit-scrollbar-thumb{border-radius:2px;background:var(--point);background-clip:padding-box}
.business .tablewrap{position:relative;overflow-x:auto;padding-bottom:20px}
.business .tablequick{display:block}
}
@media screen and (max-width:1023px) {
.tablewrap{position:relative;overflow-x:auto;padding-bottom:20px}
.tablewrap .tbl{width:1010px}
}
@media screen and (max-width:767px) {
.tablewrap{overflow-x:auto;padding-bottom:20px}
.tablewrap::-webkit-scrollbar{height:4px;border-radius:2px;background:var(--lightgray)}
.tablewrap::-webkit-scrollbar-thumb{border-radius:2px;background:var(--point);background-clip:padding-box}
.tablewrap .tbl{width:820px}
}

.titTab { display:flex;flex-wrap:wrap;justify-content:center;align-items:center; margin-bottom:30px}
.titTab ul li { display:inline-block;}
.titTab ul li + li { margin:0 0.5rem 0.5rem 0;}
.titTab ul li a {display:inline-block;position:relative;padding:10px 40px;font-size:16px;font-weight:500;border-radius:25px;border:1px solid var(--lightgray);background:var(--lightgray);}
.titTab ul li a:hover,.titTab ul li a:focus {background:var(--gray);color:#fff}
.titTab ul li a.active {border-color:var(--point);background:var(--point);color:#fff}
@media screen and (max-width:767px) {
.titTab ul li + li { margin:0 0.3rem 0.3rem 0;}	
.titTab ul li a {padding:10px 20px;}
}

/* title */
.title{margin-bottom:50px;font-size:32px;font-weight:600;text-align:center}
.title-small{font-size:24px}
.title-fit{margin-bottom:5px}
@media screen and (max-width:1023px) {
.title{margin-bottom:20px;font-size:28px}
.title-fit{margin-bottom:15px}
.title-small{font-size:18px}
}
@media screen and (max-width:767px) {
.title{font-size:22px}
}

/* info */
.info{text-align:center}
.info_title{font-size:24px;font-weight:600}
.info_description{margin-top:22px;line-height:1.77}
.info_image{margin-top:70px;background-repeat:no-repeat;background-size:cover;background-position:50% 50%}
.info_image-fit{margin-top:30px}
.info_caption{margin-top:-100px;padding:145px 0;background:#f9f9f9;font-size:20px;line-height:1.6;text-align:left}
.info_image-way{height:645px;background-image:url(../images/company/full_bg.jpg)}
@media screen and (max-width:1023px) {
.info_image-fit{margin-top:0}
.info_caption{margin:-40px -40px 0;padding:65px 40px 60px;font-size:16px}
.info_description{margin-top:20px}
}
@media screen and (max-width:767px) {
.info_title{font-size:16px;text-align:left}
.info_description{text-align:left}
.info_image{margin-top:20px}
.info_image-way{height:auto;padding-top:100%}
}

/* item */
.item{margin-top:100px}
.item-small{margin-top:100px}
.item-xsmall{margin-top:60px}
.item-bg{padding:110px 0 118px;background-color:#f9f9f9}
.item-bgsmall{padding:45px 0;background-color:#f9f9f9}
.item-fit{margin:0}
.item-line{margin-top:100px;padding-top:80px;border-top:1px solid #999}
@media screen and (max-width:1439px) {
.item-bg{padding-left:40px;padding-right:40px}
.item-bgsmall{margin:0 -40px;padding:45px 40px}
}
@media screen and (max-width:1023px) {
.item{position:relative;margin-top:60px}
.item-line{padding-top:60px}
.item-xsmall{margin-top:40px}
.item-small{margin-top:50px}
.item-fit{margin-top:0}
.item-bg{padding:60px 40px}
}
@media screen and (max-width:767px) {
.item-bg,.vision,.info_image-large,.activity{margin-left:-20px;margin-right:-20px}
.item-bg{padding-left:20px;padding-right:20px}
}

.item-slider{padding:125px 0 140px}
@media screen and (max-width:1280px) {
.item-slider{padding:80px 0}
}

/* inner */
.inner~.inner{margin-top:110px;padding-top:110px;border-top:1px solid #999}
.inner-small{padding-top:50px}
.inner-line{border-top:1px solid #333}
.inner-margin{margin-top:100px}
.inner~.inner-small{padding-top:50px}
@media screen and (max-width:1023px) {
.inner-small{padding:35px 15px 0}
.inner-margin{margin-top:50px}
.inner~.inner{margin-top:60px;padding-top:55px}
.inner~.inner-small{padding:35px 0 0}
}

/* box */
.box{display:flex}
.box_title{flex-basis:28%;flex-shrink:0;font-size:32px;font-weight:700;line-height:1.25}
.box_title-large{flex-basis:30%;font-size:36px}
.box_title-large-full{flex-basis:100%;font-size:36px}
.box_wrap{flex-grow:1}
.box_wrap .btn-link {display:block;margin-top:20px;}
.box_inner~.box_inner {margin-top:40px;padding-top:40px;border-top:1px solid var(--lightgray)}
.box_inner~.box_inner-large {margin-top:50px;padding-top:50px}
.box_inner-fit{padding-top:0 !important;border-top:0 none !important}
.box .icons-fit{margin-top:0;}
.box-line{padding-top:55px;border-top:1px solid #333}
.box_title span{display:block;position:relative;padding-left:222px;font-size:24px;font-weight:600}
.box_title span:before{content:'';position:absolute;top:11px;left:0;width:180px;height:1px;background:#000}
.box_title-small{font-size:20px;line-height:1.7}
.box_title-xsmall-full{flex-basis:100%;font-size:18px;font-weight:400;line-height:1.55}
@media screen and (max-width:1439px) {
.box_title{flex-basis:22%;padding-right:20px}
.box_title-large-full{flex-basis:100%}
.box_title span{padding-left:90px}
.box_title span:before{top:8px;width:60px}
}
@media screen and (max-width:1023px) {
.box{display:block}
.box_title{flex-basis:100%;margin-bottom:20px;padding-right:0;font-size:26px;font-weight:600;text-align:center}
.box_title br{display:none}
.box_title-small{font-size:20px;text-align:left}
.box_inner{position:relative}
.box_inner~.box_inner{margin-top:40px;padding-top:40px}
.business-overview .box_title{text-align:left}
}
@media screen and (max-width:767px) {
.box{flex-wrap:nowrap;flex-direction:column;gap:20px;}
.box_title{margin-bottom:15px;font-size:22px;flex-basis:100%;padding-right:0;}
}
@media screen and (max-width:767px) {
.box_title span{font-size:18px}
}

/* textbox */
.textbox{position:relative;padding-left:50px}
.textbox_number{position:absolute;top:7px;left:0;font-size:16px;color:var(--point);font-weight:600}
.textbox_number-fit{top:2px}
.textbox_number-fit+.textbox_subtitle{position:relative;top:-1px;font-weight:600}
.textbox_title{font-size:24px;font-weight:600;color:var(--point)}
.textbox_subtitle{font-size:20px;font-weight:500}
.textbox_subtitle~.black{margin-top:8px}
.textbox_subtitle~.black~.list{margin-top:20px}
.textbox_title~.textbox_subtitle{margin-top:3px}
.textbox .list{margin-top:10px}
.textbox .list~.textbox_subtitle{margin-top:25px}
.textbox_title small{position:relative;display:inline-block;padding-left:10px;font-size:18px;font-weight:300}
.textbox_title small:before{content:':';position:absolute;top:0;left:0}
.textbox-fit{padding-left:0}
.textbox-fit .textbox_title{margin-bottom:8px;color:#333}
@media screen and (max-width:1023px) {
.textbox{padding-left:40px}
.textbox-fit{padding-left:0}
.textbox_number{top:1px}
.textbox_number-fit{top:0}
.textbox_number-fit+.textbox_subtitle{top:-3px;}
.textbox_title{font-size:18px}
.textbox_title small{display:block;margin-top:10px;padding-left:0;font-size:16px}
.textbox_title small:before{content:none}
.textbox_subtitle{margin-bottom:10px;font-size:18px}
}
@media screen and (max-width:767px) {
.textbox{padding-left:0}
.textbox_number-fit+.textbox_subtitle{top:-3px;padding-left:30px}  
}

/* list */
.list>li{position:relative;padding-left:15px;color:var(--darkgray);text-align:left}
.list>li:before{content:'';position:absolute;left:0;top:10px;width:5px;height:5px;border-radius:50%;background:var(--lightgray)}
.list>li~li{margin-top:10px}
.list small{font-size:16px;color:var(--gray)}
.list-small>li~li{margin-top:6px}
.list-black>li{color:var(--black)}
.list-black strong{font-weight:600}
@media screen and (max-width:1023px) {
.list>li{padding-left:10px}
.list>li:before{width:3px;height:3px}
.list small{line-height:30px}
}

/* flex */
.flex{display:flex}
.flex_item{flex-basis:50%;margin-left:80px}
@media screen and (max-width:767px) {
.flex{flex-direction:column}
.flex_item~.flex_item{margin-top:20px}
}

/* icons */
.icons{display:flex}
.icons>li{flex:1;padding:0 30px;border-right:1px solid var(--lightgray);text-align:center}
.icons>li:last-child{border-right:0 none}
.icons_icon{padding-top:14px}
.icons_icon .ico{display:flex;align-items:center;justify-content:center;}
.icons_icon .ico img {vertical-align:middle;height:64px}
.icons_title{display:block;margin:26px 0 6px;font-size:20px;font-weight:500;line-height:1.4}
.icons_title-fit{margin:0}
.icons_title-small{font-size:18px;font-weight:300;color:#666}
.icons_description{margin-top:10px;color:var(--darkgray)}
.icons p{margin-top:10px}
.icons-fit>li{padding:0 20px}
.icons-large .icons_title{margin-bottom:18px;font-size:22px}
.icons-box{padding:26px 0;border:1px solid var(--lightgray)}
.icons-box-large{padding:50px 0}
@media screen and (max-width:1023px) {
.icons{flex-wrap:wrap;justify-content:center}
.icons-box{padding:26px 0 0}
.icons-box-large{padding:30px 0}
.icons>li{flex:0;flex-basis:50%;margin-top:20px;padding:0 20px 50px;border-right:0 none}
.icons_title{margin:25px 0 20px;font-size:18px}
.icons_icon{padding-top:0}
.icons-four>li{flex-basis:50%}
}
@media screen and (max-width:767px) {
.icons{display:block}
.icons>li{padding-bottom:40px;border-right:0 none;border-bottom:1px solid var(--lightgray)}
.icons>li~li{margin-top:40px}
.icons>li:last-child{padding-bottom:0;border-bottom:none}
.icons-fit>li{padding:0 15px 40px}
.icons-box>li:nth-child(n+5){margin-top:0;margin-bottom:0;border-bottom:0 none}
.icons-box>li:nth-child(4n):after{content:none}
.icons_icon{padding-top:0}
.icons_title{margin:20px 0 15px;font-size:16px;font-weight:600}
.icons-box{padding:30px 20px}
.icons-large .icons_title{font-size:16px}
.icons>li br {display:none}
}

/* factory */
.factory_icon {width:200px;height:200px;border-radius:50%;background:#E4E7F4;line-height:200px;margin-bottom:20px;display:inline-flex;align-items:center;justify-content:center;}
.factory_icon img{vertical-align:middle;height:100px;}

/* icon */
.icon{position:relative;display:inline-block;width:60px;height:60px;border:1px solid var(--lightgray);border-radius:50%;background-color:var(--gray);text-indent:-999em;transition:all 0.3s ease-out}
.icon:before{content:'';position:absolute;top:50%;left:50%;background-repeat:no-repeat;background-position:50% 50%}
.icon-link:before{width:15px;height:15px;margin-top:-7px;margin-left:-7px;background-image:url(../images/icon/icon_link.svg)}
.icon-download:before{width:24px;height:21px;margin-top:-10px;margin-left:-12px;background-image:url(../images/icon/icon_download.svg)}
.icon-download-gray:before{background-image:url(../images/icon_download_gray.svg)}
.icon-download-white{background-color:var(--point)}
.icon-download-white:before{background-image:url(../images/icon/icon_download_white.svg)}
.icon-download:hover{background:var(--point)}
.icon-download:hover:before{background-image:url(../images/icon/icon_download_white.svg)}
.icon-download:hover{background:var(--point);}
.icon-download:hover:before{background-image:url(../images/icon/icon_download_white.svg)}
.icon-dropdown:before{width:10px;height:12px;margin-top:-4px;margin-left:-5px;background-image:url(../images/icon/icon_right_gray.svg);background-size:10px 12px;background-position:54% 50%;transform-origin:50% 50%;transform:rotate(90deg);}
.ico{display:block;height:52px}
.ico img{vertical-align:middle}
@media screen and (max-width:1023px) {
.icon-download,
.icon-link{background:var(--point) !important}
.icon-download:before{background-image:url(../images/icon/icon_download_white.svg)}
.icon-link:before{background-image:url(../images/icon/icon_link_white.svg)}
}

/* accordion */
.accordion~.accordion{margin-top:40px}
.accordion_link{display:block;position:relative;padding:34px 36px;border-top:1px solid var(--lightgray);font-weight:500}
.accordion_link:before{content:'';position:absolute;top:-1px;left:0;width:0;height:1px;background:var(--point);transition:all 0.5s ease-out}
.accordion_link:after{content:'';display:block;clear:both}
.accordion_text{display:flex;justify-content:space-between;align-items:center;padding-right:120px}
.accordion_title{display:block;padding-right:30px;font-size:24px;word-break:break-all}
.accordion_title small{display:block;margin-top:15px;font-size:18px;font-weight:300}
.accordion_info{flex-shrink:0;flex-basis:250px;text-align:right;}
.accordion_category{font-size:16px;font-weight:400;color:#333}
.accordion_date{font-weight:300;color:#999}
.accordion_category~.accordion_date{position:relative;margin-left:16px;padding-left:16px}
.accordion_category~.accordion_date:before{content:'';display:block;position:absolute;top:2px;left:0;width:1px;height:15px;background:var(--lightgray)}
.accordion_icon{display:inline-block;position:absolute;top:50%;right:36px;width:60px;height:60px;margin-top:-30px;margin-left:0}
.accordion_content{display:none;padding:30px 36px 30px;background:var(--lightgray);}
.accordion_content table th{background:#fff}
.accordion_link.active .accordion_title,
.accordion_link.active~.accordion_content{display:block}
.accordion_link.active:before {width:100%}
.accordion_link.active .icon-dropdown:before{margin-top:-6px;background-image:url(../images/icon/icon_right_white.svg);transform:rotate(270deg)}
.accordion_link.active .icon{background:var(--point)}
.accordion-small .accordion_title{font-size:inherit;font-weight:600}
@media (hover:hover) {
@media screen and (min-width:1024px) {
.accordion_link:hover:before{width:100%}
.accordion_link:hover .accordion_title{color:var(--point)}
.accordion_link:hover .icon{background:var(--point)}
.accordion_link:hover .icon-download-gray:before{background-image:url(../images/icon/icon_download_white.svg)}
.accordion_link:hover .icon-dropdown:before{background-image:url(../images/icon/icon_right_white.svg)}
.accordion_link:hover .icon-link:before{background-image:url(../images/icon/icon_link_white.svg)}
}
}
@media screen and (max-width:1023px) {
.accordion_link{display:flex;justify-content:space-between;align-items:center;padding:20px 0}
.accordion_link:after{content:none}
.accordion-small .accordion_link{padding:18px 0}
.accordion_text{flex-basis:calc(100% - 60px);flex-direction:column;align-items:flex-start;gap:8px;padding-left:15px;padding-right:0}
.accordion_title{font-size:18px;line-height:22px}
.accordion_title-sub{display:block;-webkit-box-orient:unset;-webkit-line-clamp:unset}
.accordion_title.on{white-space:unset;overflow:unset;text-overflow:unset}
.accordion-small .accordion_title{font-size:18px}
.accordion_title small{margin-top:0;font-size:16px}
.accordion_info{flex-basis:auto}
.accordion_icon{flex-basis:60px;position:static;margin-top:0}
.accordion_content{position:relative;padding:15px 15px 30px}
.accordion_category,
.accordion_date{display:inline-block;font-size:12px}
}
@media screen and (max-width:767px) {
.accordion-long .accordion_title{display:block;text-overflow:inherit;white-space:inherit}
}

.pagination{margin-top:100px;text-align:center}
.pagination>a{display:inline-block;width:35px;height:35px;margin:0 6px;border-radius:50%;font-size:16px;line-height:35px}
.pagination>a.active{background-color:var(--point);color:#fff}
.pagination>a.pagination_btn{margin:0;width:24px;background-repeat:no-repeat;background-position:50%;text-indent:-999em}
.pagination>a.pagination_btn-first{background-image:url(../images/icon/icon_pager-first.svg)}
.pagination>a.pagination_btn-prev{margin-right:30px;background-image:url(../images/icon/icon_pager-prev.svg)}
.pagination>a.pagination_btn-last{background-image:url(../images/icon/icon_pager-last.svg)}
.pagination>a.pagination_btn-next{margin-left:30px;background-image:url(../images/icon/icon_pager-next.svg)}
@media screen and (max-width:1023px) {
.pagination{margin-top:60px}
}
@media screen and (max-width:767px) {
.pagination{margin-top:40px}
.pagination>a{width:28px;height:28px;margin:0;font-size:14px;line-height:28px}
.pagination>a.pagination_btn-prev{margin-right:0}
.pagination>a.pagination_btn-next{margin-left:0}
}

/* split */
.split{display:flex;flex-wrap:wrap;justify-content:space-between;gap:60px}
.split>li{flex-basis:calc(50% - 30px)}
.split>li.style2 {flex-basis:calc(30% - 10px)}
.split_title{margin-bottom:20px;padding-bottom:32px;border-bottom:1px solid var(--lightgray);font-size:24px;font-weight:500}
.split_title-fit{;padding:32px 0;border-bottom:0 none;background:var(--lightgray); text-align:center;border-radius:10px;}
.split_title strong{font-weight:700}
.split_title small{display:block;font-size:18px;font-weight:300}
.split_figure{margin-bottom:15px}
.split_description{color:#666}
.split_button{margin-top:40px}
@media screen and (max-width:1280px) {
.split{gap:30px;margin-top:20px}
.split_title{margin-bottom:15px;padding-bottom:17px;font-size:18px}
.split_title small{display:block;margin-left:10px;font-size:14px}
.split_figure img{width:100%}
.split_button{margin-top:20px}
}
@media screen and (max-width:767px) {
.split{flex-direction:column;}		
.split>li, .split>li.style2{flex-basis:100%}	
}

/* profile */
.profile{display:flex;align-items:center;background-color:#f9f9f9}
.profile_wrap{flex-grow:1;flex-basis:50%}
.profile_wrap-right{padding:0 8% 0 0}
.profile_wrap-right .profile_title{margin-bottom:40px}
.profile_wrap-right p {padding:18px 0 22px;}
@media screen and (max-width:1439px) {
.profile{margin:0 -40px}
.profile_title{margin-bottom:20px}
.profile_list>li{padding:14px 0 12px}
.profile_wrap-right{padding:30px 40px 40px}
}
@media screen and (max-width:1280px) {
.profile{display:block}
.profile_wrap-left img{width:100%}
}
@media screen and (max-width:767px) {
.profile_title{font-size:22px}
}

/* history */
.history_wrap{position:relative;padding-left:50%}
.history_wrap:before{content:'';position:absolute;top:16px;bottom:158px;left:calc(50% + 3px);width:1px;background:#dadada}
.history_line{content:'';position:absolute;top:16px;left:calc(50% + 3px);width:1px;max-height:calc(100% - 74px);height:0;background:var(--point)}
.history_inner{position:relative}
.history_year{position:absolute;top:4px;right:calc(100% + 100px);font-size:70px;color:#eee;font-weight:900;line-height:1;white-space:nowrap;transition:all 0.3s ease-out}
.history_inyear{margin-top:80px}
.history_number{margin-bottom:15px;font-size:24px;font-weight:600;transition:all 0.3s ease-out}
.history_list>li{position:relative;padding-bottom:38px;padding-left:100px}
.history_list>li:last-child{padding-bottom:100px}
.history_list>li:before,.history_list>li:after{content:'';display:inline-block;position:absolute;border-radius:50%;transition:all 0.5s ease-out;transition-delay:0.5s}
.history_list>li:before{content:'';height:7px;width:7px;left:0;top:16px;background-color:#857c7a;z-index:1}
.history_list>li:after{content:'';height:15px;width:15px;left:-4px;top:12px}
.history_list>li.active:before{background:var(--point)}
.history_list>li.current:after{background:var(--lightgray)}
.history_list>li.active:last-child {color:#000}
.history_list>li.active .history_year{color:var(--point)}
.history_list>li.active .history_number{color:var(--point)}
.history_item:last-child .history_list>li:last-child{padding-bottom:0}
.history_description{color:var(--darkgray)}
@media screen and (max-width:1023px) {
.history_wrap{padding-left:0}
.history_wrap:before{left:3px;bottom:50px;}
.history_year{position:relative;left:0;top:0;right:auto;padding-bottom:20px;font-size:50px; margin-top:20px; }
.history_number{margin-bottom:10px;font-size:18px}
.history_list>li{padding-left:40px;padding-bottom:30px}
.history_list li:first-child{margin-top:90px}
.history_list li:last-child{padding-bottom:0}
.history_list>li:before{top:10px}
.history_list>li:after{top:6px}
.history_inyear{margin-top:70px}
.history_line{left:3px}
}

/*  vision */
.vision{height:335px;padding-top:105px;background:url(../images/company/img_ideology_visionbg.jpg) 50% no-repeat;text-align:center;color:#fff;box-sizing:border-box}
.vision_title{font-size:32px;font-weight:600}
.vision_description{margin-top:10px;font-size:36px;font-weight:600}
@media screen and (max-width:1439px) {
.vision{height:auto;padding:80px 20px}
}
@media screen and (max-width:1023px) {
.vision{padding:50px 20px;margin-left:-40px;margin-right:-40px}
.vision_title,.vision_description{font-size:22px}
}
@media screen and (max-width:767px) {
.vision{padding:60px 20px}
.vision_title{font-size:22px}
.vision_description{font-size:24px;line-height:34px}
}

/* principle */
.principle{display:flex;justify-content:space-between;gap:30px}
.principle>li{position:relative;text-align:center}
.principle_title{margin-top:20px;font-size:22px;font-weight:500;text-align:center}
@media screen and (max-width:1023px) {
.principle{flex-wrap:wrap;align-items:center;}
.principle>li{flex-basis:33.333%;}
.principle_title{margin-top:15px;font-size:18px}
}
@media screen and (max-width:767px) {
.principle{display:block}
.principle_image img{width:100%}
.principle li:last-child .principle_title{margin-bottom:0}
}

/* employee */
.employee{display:flex;justify-content:space-between;margin-top:-10px;padding:0 60px;text-align:center}
.employee_icon {width:200px;height:200px;border-radius:50%;background:rgb(243 243 243);line-height:200px; margin-bottom:20px}
.employee_icon img{vertical-align:middle;height:100px;}
.employee_title{margin:20px 0;font-size:22px;font-weight:500}
@media screen and (max-width:1280px) {
.employee{margin-top:0;padding:0}
.employee_icon{width:160px;height:160px;line-height:160px}
}
@media screen and (max-width:1023px) {
.employee_title{margin-top:20px;font-size:18px}
.employee{flex-direction:column}
.employee_icon{height:184px;width:184px;margin:0 auto;line-height:184px}
.employee_title{margin:20px 0 40px 0;font-size:16px}
.employee li:last-child .employee_title{margin-bottom:0; }
}


/* corevalue */
.corevalue{margin-top:-10px}
.corevalue_wrap{position:relative;width:560px;height:560px;margin:0 auto;background:url(../images/company/bg_ideology.gif) 50% no-repeat}
.corevalue_logo{position:absolute;left:50%;top:50%;width:153px;height:53px;transform:translate(-50%, -50%)}
.corevalue_item{position:absolute;width:180px;height:180px;padding-top:60px;border-radius:50%;background-color:var(--point);color:#fff;text-align:center;box-sizing:border-box}
.corevalue_item-best{left:0;top:0}
.corevalue_item-accountability{left:0;bottom:0}
.corevalue_item-innovation{right:0;top:0}
.corevalue_item-integrity{right:0;bottom:0}
.corevalue_ko{font-size:24px;font-weight:500}
.corevalue_en{opacity:.8}
.corevalue_list{position:absolute;display:inline-block;width:345px;top:45px;text-align:left}
.corevalue_list li{display:inline-block}
.corevalue_item-best .corevalue_list{left:-380px;text-align:right}
.corevalue_item-best .corevalue_list li{ }
.corevalue_item-accountability .corevalue_list{left:-380px;text-align:right}
.corevalue_item-innovation .corevalue_list{top:55px;left:200px}
.corevalue_item-integrity .corevalue_list{top:55px;left:200px;text-align:left}
@media screen and (max-width:1280px) {
.corevalue{margin-top:0}
.corevalue_wrap{width:100%;height:auto;background:unset}
.corevalue_inner{flex-shrink:0;height:90px;width:90px;padding:22px 5px 0;border-radius:50%;background:#250088}
.corevalue_item-best .corevalue_inner{padding-top:14px}
.corevalue_logo{display:none}
.corevalue_item{display:flex;align-items:center;position:static;width:auto;height:auto;padding:40px 20px 40px 0;background-color:unset;border-radius:unset;border-top:1px solid #e6e6e6}
.corevalue_list{position:static;flex-grow:1;margin-left:15px}
.corevalue_list li{display:block}
.corevalue_list li br{display:none}
.corevalue_item-best .corevalue_list li{text-align:left}
.corevalue_ko{font-size:18px}
.corevalue_en{font-size:12px;line-height:1.2}
}

/* company :location */
.location_button{margin-top:60px;text-align:center}
.location_button a{margin:0 10px}
.location{margin:40px 0}
@media screen and (max-width:1023px) {
.location_map{margin-bottom:40px}
.location_button{margin-top:40px;display:flex;justify-content:space-between}
.location_button a{flex-basis:49%;margin:5px 0}
}
@media screen and (max-width:767px) {
.address .icons_icon{position:absolute;left:20px;top:50%;transform:translateY(-50%);width:35px}
.address .icons_title{margin:0;font-size:16px}
.address .icons>li{position:relative;padding:30px 0 30px 80px;text-align:left;font-size:16px}
.address .icons>li{margin-top:0}
.address .icons>li:last-child{border-bottom:1px solid var(--lightgray)}
.address .icons_description{margin-top:0}
}

.maparea{position:relative;width:100%;max-width:1920px;height:560px;margin:50px auto;}
.root_daum_roughmap .cont {display:none !important}
.maparea .location-btn {position: absolute;bottom:-3rem;right:4rem;z-index: 2;display:flex;flex-direction:column;align-items:center;justify-content:center;width:8rem;height:8rem;border-radius:50%;background:var(--point) ;color:#fff;transition:all 0.4s ease-in-out;}
.maparea .location-btn i {font-size:3rem;}
.maparea .location-btn span {font-size:1.4rem;font-weight:600; line-height:1.5;letter-spacing:-0.05em;}
@media screen and (min-width: 813px) and (max-width: 1399px){
.maparea{margin:40px 0 30px;width: 100%;height: 560px;}
}
@media screen and (max-width: 812px){
.maparea{margin:30px 0 30px;}
.maparea  .location-btn {width:3rem;height:3rem;bottom:-1rem;right:1rem;}
.maparea  .location-btn i {font-size:2rem;}
.maparea  .location-btn span {font-size:1rem;}
}

