@charset "utf-8";


html{font-size: 16px;/*user-select: none;*/}

/* icon */
.icon-arr-wh{width: 32px;height:32px}
.icon-arr-down{width: 40px;height:40px}
.icon-search{width:20px;height:20px;}
.icon-arr-page{width:42px;height:42px; }
.icon-cs,
.icon-chat,
.icon-ask,
.icon-download,.icon-call,
.icon-share{width:22px;height:22px;}

.icon-expand{ line-height: 30px;border-radius:16px}
.icon-expand:hover{width: 82px;font-size: 14px;text-indent: 14px;}
/* modal */

.modal-content{border-radius: 1rem;padding:2em 1.111em}
.modal-full .modal-dialog{margin:0}
.modal-full .modal-content{ min-height:100vh; border: 0;border-radius: 0}
button.close-blue{font-size: 1.5rem}
.modal-alert-ft{margin: 1.5em -1.111em -2em;border-radius:0 0 1rem 1rem;}

/* typo */
.display-3{font-size: 1.75rem !important;}
h3.display-3{margin-bottom: 1.75rem !important;}
h3.display-3.snd{margin-top: 4rem;}
h4, .h4{font-size: 1.25rem}
h5, .h5{font-size: 1.25rem}
/* pagination */

/* nav */
[class^=nav-] a{font-size: 0.9rem;}

.nav-pills{display: flex;position: static;flex-wrap: nowrap; width:100vw;overflow: scroll; margin:1em 0 2em; transform: none ;margin-left: -15px}
.nav-pills>li{width: auto ; white-space: nowrap; margin-bottom: 6px;border-bottom: 1px solid rgba(0,0,0,.12);padding-left:1em}
.nav-pills>li:last-child{padding-right: 1em;}
.nav-pills a{ padding:8px 0; font-size: 1rem;text-align: center;white-space: nowrap;border-radius: 0 !important;}
.nav-pills .active{position: relative;z-index:1;border-bottom:2px solid #111}
.nav-pills .nav-link.active{background-color: transparent !important;color: #111;font-weight: 700;}

.nav-cate{display: block; overflow-y: auto;margin:0 -20px 30px;padding:5px 20px;font-size:12px; white-space: nowrap;text-align: center}
.nav-cate>li{display: inline-block;width: auto}
.brand-lnb-wrap{margin:-26px 0 0; font-size: 1rem;}
.brand-lnb li a{padding:1em 0;font-size:13px}
.nav-brand{ margin:0 -15px 30px;padding:0 10px}
.nav-brand li{padding:0 2px}
.nav-brand img{height:32px}

/* form */
.btn{padding:12px 24px;border-width: 1px}
.btn-icon{padding: 12px !important;}
.btn-icon>span{margin-right: 2rem;}
.btn-icon-only{padding:8px !important;}
.form-control{-webkit-appearance: none;}
.custom-select{padding: 0.5rem;}

.cs-write .custom-file-label::before{width:calc(100% - 6em - 6px) }
.cs-write .custom-file-label::after{width:6rem;}
/* swiper */
.container .swiper-container{margin:0 -15px;padding:0 15px}
.swiper-button-wrap{justify-content: center;margin: 2.5rem 0}

/* layout */
#hd{height: 60px;box-shadow:0 0 20px rgba(0,0,0,.05)}
#hd h1{position: absolute;top:14px;left:1rem;z-index: 200;}
#hd h1 img{height:32px}
.gnb-open #hd h1,.body-transparent.gnb-open #hd h1{filter:none !important}
#acc{display:none;position: fixed; top:auto;bottom:0;right:0;z-index:110; width:100vw;padding:1.5rem; background:#fff;animation:acc-open .33s both}
#acc>a{position: relative; width: 25%;padding:0 5px;margin:0;font-size:12px;text-align: center;color: #B2B2B2;font-size: 1.125rem;}
/* #acc>a+a{border-left:1px solid #eee;} */
/*#acc>a+a::before{content: "";position: absolute;left: 0;top: 50%;width: 1px;height: 1rem;background-color: #DDDDDD;transform: translate(-50%, -50%);}*/
#acc>a+a::before{content: unset;}
.gnb-open #acc{display: flex;}
#acc .language{display: none;}
@keyframes acc-open{
	0%{transform:translate(100vw,0);}
	100%{transform:none}
}

#menu-mypage{top:0}
#gnb{display: none;position: fixed;top: 0;right:0;bottom: 0;z-index: 110;width:100vw;margin: 0; background: #fff;transform:translate(100vw,0);transition:.3s}
/*#gnb>ul{overflow-y: auto;position: absolute;top:60px;left:0;right:0;bottom:42px; padding:15px 30px;}*/
#gnb>ul{overflow-y: auto;position: absolute;top:60px;left:0;right:0;bottom:160px; padding:15px 30px;}
#gnb>ul:hover{box-shadow:inset 0 4px 4px -2px rgba(0,0,0,.05)}
#gnb>ul li{display: block; margin:0}
#gnb>ul a{ padding:10px 0;}
#gnb>ul a:after{}
#gnb ul h6{font-size:1.5rem}
#gnb ul ul a{padding:5px 0 5px 15px; font-size:1.125rem;color:#666666}
#gnb ul ul ul a{padding:4px 0 4px 40px;font-size:.95em;opacity:.6}
#gnb ul ul ul a:before{ display: none !important}
#gnb a[data-toggle]:before,#gnb li .active>a:before{content:'';float: right;margin-top: -3px; font-family:'xeicon';transition:.4s}
#gnb .open>a[data-toggle]:before{transform:scale(1,-1)}
#gnb .active>ul{display: block}
#gnb li .active a:before{content:'';}
#gnb>ul>li:nth-child(2)>a:before{color:#333}
/*
#gnb>ul>li:nth-child(2) ul{display:block !important}
*/
#sitemap{display:none !important}
.nav-open{overflow:hidden}
.nav-open #hd:after{content:'';position:fixed;top:0;bottom:0;left:0;right:0;background:#000;opacity:0;transition: .3s}
.gnb-open #hd:after{opacity:.5}
#btn-tel{bottom:0;right:32px;width: 80px; line-height:32px;font-size:12px}
#ft{padding:30px 10px 0;font-size:14px;overflow: hidden;}
#ft>div{padding-left: 0;padding-right: 0;}
#ft img{margin-bottom:20px;max-width: 30vw;}
#ft>*>.row>*{margin-bottom:30px;}
#ft h1+.row>*,
.ft-mn{padding-bottom: 15px; border-bottom:1px solid rgb(255,255,255,0.12)}
.ft-mn+.row{margin-top: 2rem;padding-bottom: 15px;}
.ft-mn>li>a{width: 5em;}
.ft-mn>li:first-child li:nth-child(4),
.ft-mn>li:last-child li:nth-child(3){padding-left: 0;}
.ft-mn>li:first-child li:nth-child(4)::after,
.ft-mn>li:last-child li:nth-child(3)::after{display: none;}
.ft-mn ul li+li::before{display: none;}

/* slide */
.swiper-button-next:after,.swiper-button-prev:after{font-size:24px}
.swiper-button-next{right:.5em}
.swiper-button-prev{left:.5em}

/* index */
#index{height:auto}
#index .btn{font-size: 1rem;padding: 0.8em 2.5rem;}
#index>.swiper-wrapper{display: block}
#index>*>.swiper-slide:not(#index-visual), #index-visual .swiper-slide{height: auto !important;min-height:100vh}
#index>*>.swiper-slide:not(#index-visual){justify-content: flex-start;padding:90px 0 30px}
#index #index-footer{height: auto;min-height:auto !important;padding : 0 !important;border-top: 1px solid #E5E5E5;}
#index-visual .swiper-pagination{position: absolute; top:auto;bottom:2rem;left:50%;transform: translateX(-50%); width: 220px;height: 2px;}
#index h2,
#index-business h3{font-size: 2.5em}
#index h2+p{margin:12px 0 40px;font-size: 1.125rem;}
#index-nav{display:none}
#index-visual p{font-size: 1.28rem;}
#index-visual h2{font-size: 2.28rem;}
#index-visual [class^=swiper-button]{display: none;}
#index-reference{background-color: #F8F8F8;}
#index-reference-slide{margin-top: 0;}
#index-reference-slide .swiper-slide a>div{padding:1rem}
#index-reference-slide h3{top:1rem;left:1rem}
.index-reference-pagination{position: relative;margin-top: 3.75rem;}
.index-reference-nav{justify-content:flex-end;margin-top: 12px;}
.index-reference-nav .icon-arr-page{width:42px ;height: 42px;}
#index-business h2{position: static}
.swiper-pagination{position: relative;height: 2px !important;background-color: rgba(0,0,0,.1);}
.swiper-pagination-progressbar-fill{background-color: #111 !important;margin-bottom: 12px;}
#index-business h2{font-size:1.5rem}
#index-business p>br{display: none;}
#index-business-nav{display: flex;position: static;flex-wrap: nowrap; width:100vw;overflow: scroll; margin:1em 0 2em; transform: none ;margin-left: -15px;}
#index-business-nav>li{width: auto ; white-space: nowrap; margin-bottom: 6px;border-bottom: 1px solid rgba(0,0,0,.12);}
#index-business-nav a{margin:0 0 -1px -1px;padding:8px 1em; font-size: 1.142rem;text-align: center;white-space: nowrap;}
#index-business-nav .active{position: relative;z-index:1}
#index-business h4{margin:1.5em 0 0;font-size: 1.25rem;}
#index-business p{margin:.5em 0 1em;}
#index-business img{display: block;max-height:60vh; margin:0 auto}
#index-about{background-position: left 40px bottom;background-size: 120vw auto;}
#index-about .container-xl{padding-left: 0;padding-right: 0;}
#index-about .row{flex-direction: column-reverse;margin:0}
#index-about .col-lg-6:first-child{padding:0 }
#index-about ul{display: flex;justify-content: space-between;margin : 2.5rem 0 4.325rem;}
#index-about li+li{margin-left: 0;}
#index-about h3{font-size: 2.75rem}
#index-news h2 ,
#index-news h2+p{text-align: center;}
#index-news ul{margin:0 0 20px 0}
#index-news li a{padding: 28px 0}
#index-news li:first-child a{padding-top: 10px;}
#index-news h3{margin-bottom:0;font-size:20px}
#index-news li p{margin:5px 0 0}
#index-news li img{box-shadow:none}
#index-news li .row>*:first-child{width:100%;margin-bottom: 1em}
#index-news li .row>*:nth-child(2){width:70%}
#index-news li .row>.news-thumb{display: none;}
#index-news .row .btn{display: none;}
#index-partners>div {padding-bottom: 100px;}
aside.contact-talk{display: none;}
div.icon_shop{width: 50px;right: 20px;bottom: calc(env(safe-area-inset-bottom) + 95px);}
/*div.icon_shop{display: none;}*/
#index-inquiry .index-inquiry-layout {
    padding-top: 140px;
    padding-bottom: 6rem;
}
#index-inquiry .index-inquiry-visual{
    width:100vw;
    max-width:none;
    height:280px;
    flex-basis:280px;
    margin-right:calc(50% - 50vw);
    margin-left:calc(50% - 50vw);
    border-radius:0;
}
#index-inquiry .index-inquiry-visual-content{
    box-sizing:border-box;
    width:min(491px, calc(100% - 40px));
    margin:0 auto;
    padding-top:50px;
}
#index-inquiry .index-inquiry-visual-accent{width:65px;height:7px;flex-basis:7px;}
#index-inquiry .index-inquiry-visual-title{
    margin-top:33px;
    font-size:35px;
    line-height:48.4px;
}
#index-inquiry .index-inquiry-visual-description{
    width:100%;
    margin-top:10px;
    padding:0 20px;
    font-size:15px;
    line-height:24.7px;
}
#index-inquiry .index-inquiry-visual-meta{
    flex-direction:row;
    justify-content:center;
    width:100%;
    gap:24px;
    margin-top:31px;
    font-size:13px;
    line-height:24.7px;
    white-space:nowrap;
}
#index-inquiry .index-inquiry-visual-meta p{gap:8px;}
/* sub */
.partners li{flex: 0 0 50%;max-width:50%;padding: 4px;}
/* board */
.page-container{padding:100px 0 60px;}
.page-hd{ position: relative;padding-bottom: 30px;}
.page-hd .icon-arr-down{display: none;}
.page-hd h2{font-size: 3rem;line-height: 1.1;}
.page-hd h2+a{display: inline-block; margin-top: 28px;font-size: 18px;font-weight: 700;;}
.page-hd h2+a i{display: inline-block; margin-left: 5px;}
.page-hd h2+a.open i{transform: rotate(180deg);}
.page-hd h2 ~ ul{display: none; position: absolute;margin-top: 12px; padding: 1rem;z-index: 10; background: #FFF;box-shadow: 0px 10px 10px #0000000F;border: 1px solid #DDDDDD;border-radius: 5px;animation: fadeIn 0.3s both;line-height: 1.7;}
.page-visual{ height:26vh;min-height: 200px;}
.page-visual>img{object-fit: cover;}
.page-visual+.contents{margin-top: 40px;}
.contents .category-absolute{position: absolute; margin-top: -60px;}

.board-search{margin-bottom: 30px}
.board-list .cont{margin-bottom: 10px;}
.board-card .cont>a,
.board-card .cont>div.a{display: block; padding:20px;}
.board-card:not(.v2) .cont .h3{margin-bottom: 3rem;}
.board-thumb .cont{padding:20px;}
.board-thumb img{margin-top: 20px;}
.board-thumb .down{text-align: right;}
.board-gallery{padding-bottom:40px}
.board-gallery>div+div{padding-top: 40px;}
.board-gallery h4{overflow: hidden; white-space: nowrap; text-overflow: ellipsis}
.board-detail .detail-header{padding: 0 0 20px;}
.board-detail .detail-header h1{font-size: 1.75rem;}
.board-detail .detail-cont{padding:30px 0}
.board-navi .col-lg-5{flex: 0 0 41.666667%; max-width: 41.666667%;}
.board-navi .button{padding: 1em 0}
.board-navi a i{font-size: 1.75rem;}
.board-navi p{display:none}
.board-navi a span.thumb{display: none;}
.newsletter-list{padding-top: 40px;}
.newsletter-list .board-gallery>div+div{padding-top: 0 !important;}
.newsletter-list .board-gallery>div:nth-child(n+3){margin-top: 40px;}


.detail-reference{padding: 0 20px 20px;margin-bottom: 30px;}
.detail-reference dl{margin-top: 20px;}
.detail-reference dt p{display: inline-block;margin-right: 1rem;padding-bottom: 0.8rem;}
.detail-reference dd{padding-left: calc(0.5rem + 3px);}
.detail-contact>* {display: flex;justify-content: space-between;margin-top: 0.5em;}
.detail-contact>*:last-child>button{width: calc(50% - 4px);}
/* product사업분야 */
.product-location{top:75px;padding: 0 15px}
.product-location>div>a{pointer-events: none;}
#prodCont h4{font-size: 1.5rem !important;margin-bottom: 20px !important;}
.product-detail .swiper-slide-active  {opacity:1;}
#prodCont h4>.swiper-nav,
#prodCont .product-section-heading>.swiper-nav{display: none;}
#prodCont .swiper-nav{position: relative;text-align: right;padding-top: 14px;}
#prodCont .swiper-nav-page{position: relative;margin-top: calc(40px - 0.5rem);}
#prodCont .swiper-nav .icon-arr-page{width: 42px;height: 42px;}

.product-img span{ padding:30px}
.product-summary>div{padding-top:2rem;}
.product-summary .summary-tit{padding-bottom: 17px;margin-bottom: 24px;}
.product-summary .summary-spec dt{width: 6em;}
.product-summary .btn-wrap{margin-top: calc(40px - 1rem);}
.product-summary .btn-wrap>.btn{min-width: calc(50% - 4px);}
.product-list-heading{margin-bottom:1.75rem;}
.product-summary .btn-icon-only{display: none;}
.product-nav{padding-top:70px}
.product-location.active{top:70px}
.product-nav .nav-tabs a{ margin:0; padding:1rem 0;margin-right: 1rem;font-size: 1.125rem;}
#prodCont {padding-top: 120px;}
#prodCont>div{padding-top: 48px !important;}
.cs-btn{display: flex;justify-content: space-between; position: fixed; bottom:0;right: 0; padding:20px 16px;width: 100%; background-color: #fff;z-index: 5;}
.cs-btn>a,.cs-btn>button{display: flex;justify-content: space-between; width: calc(50% - 4px);}

/* About */
#about h3{font-size:1.75rem;padding-left: 0;padding-right: 0;}
#about-1{display: flex;justify-content: center;flex-direction: column; background-image:  url("../img/about/bg-mo.jpg");background-position: 50% 50% ;height:100vh;padding-top: 0; }
#about h2{margin:0 1em .5em; font-size:1.75rem;}
#about-1 p{font-size:1.1rem;line-height: 1.7;}
#about-2 ul{ margin:0 10px 0 50%}
#about-2 img{margin-top: 40px;margin-bottom: 70px;}
#about-2 .img1 {text-align: right;}
#about-2 .img1 img{max-width: 66vw;}
#about-3 h4{margin:.4em 1em;font-size: 1.1rem}
#about-4{overflow: hidden;}
#about-4,
#about-4.eng{padding:40px 15px;height: auto}
#about-4 ul{margin-top: 35px;}
#about-4 li:first-child{display:none}
#about-4 li>*{ padding:15px 15px 90px;border-width: 1px;height: 270px;}
#about-4 h4{font-size: 14px}
#about-4 small{font-size:11px}
#about-4 img{bottom:0;right:10px;width:40%}
#about-4 footer{ height: auto;padding:25vh 0; opacity: 1;pointer-events: auto}
#about-4 .about-pagination{margin-top: 20px;filter: invert(1);}
#about-4 .about-nav{position: relative;display: flex;justify-content: flex-end;margin-top: 12px;}
#about-4 .about-nav [class^=swiper-button]{position: relative;left: auto;right: auto;margin-top: 0;width: auto;margin-right: 10px;}
#about-4 .about-nav [class^=swiper-button]::after{display: none;}
#about-5 h4{font-size: 1.5rem;margin-bottom: 0;}
.sect-logo{margin: 1rem 0;}
.sect-logo p{line-height: 1.75;}
.logo-box{height:11rem;padding:1rem 3rem;margin: 1rem 0;}
.logo-box .sys-img{max-width: 50vw;}
#about-5 h5{margin:0 0 0.5rem 0;font-size:1.25rem}
#about-5 h5 br{display: none;}
.color-box{margin-top: 40px;}
.color-box h5{font-size:1.125rem !important}
.color-box>*{padding: 20px !important; margin:0;margin-bottom: 12px;}
.color-box img{display: none;}
.color-box p span{display: block;font-size:0.875rem !important}

.about-history>div:first-child{line-height: 1;}
/* width: calc(4rem * 2); */
.about-history>div:first-child {display: inline-block;white-space: nowrap;}
.about-history .year{ top:60px;padding-top: 1rem; font-size:4rem;font-family: 'Pretendard'; font-weight: 700;background-color: #fff;z-index: 2;}
.about-history>div:last-child {padding-top: 4rem;}
.history-cont ul{padding-bottom: 4rem;}
.history-cont li{padding-left: 2rem;}
#vision1 img{max-width: 50vw;}
.contect1>div:not(:first-child){margin-top: 1.5rem;}
.contect2 .desc-line{margin-top: 2rem}
#patentModal .modal-content{padding:2rem 1rem}
.root_daum_roughmap .wrap_map{height:100vw !important;}
.contect-road>div:last-child{margin-top: 2rem;}
.contect-showroom-detail {margin-top: 50px; padding-top:30px;}

/* esg  */
.esg-box{padding:20px 10px;margin-top:2rem;}
.esg-box>div{flex-wrap: wrap;}
.esg-box>div>div{padding-left: 10px;padding-right: 10px;width:48%;margin-bottom: 10px;}
.esg-vision-box{padding: 40px 10px;font-size: 2.6rem;}
#esg-vision {margin-top: 1.5rem;}
#esg-vision a+div{padding:0 0  1.5rem;}
#esg-vision a+div>div:first-child{text-align: center;}
.recruit-box{margin-top: 2rem;}
.recruit-box>div{padding: 20px !important;}
.recruit-box>div>div{align-items: center;}
.recruit-box>div img{max-width: 15vw;}
.recruit-benefit {margin-top:2rem;}
.board-card.recruit-process{padding-bottom:30px;}
.recruit-process>div{margin-top: 1.5rem;}
.esg-recruit-bn{height: 60vw;}
.esg-recruit-bn .d-flex{flex-direction: column;justify-content: space-around !important;}

/* CS */
#cs-ask p.h1{padding-top: 5rem}
#cs-ask .form-group {margin-bottom: 1.5rem;}
#cs-ask .form-group .col{padding-left: 0;padding-right: 0;}
#cs-ask .form-group .check-group{flex-wrap: wrap;}
.cscenter>div>div{height: 300px; max-height: 45vw;padding: 1.5rem;margin-bottom: 1rem;}
.cs-map{margin-top: 5rem;}
.cs-map h3+p{font-size: 1rem; margin-bottom: 1rem;}
.cs-snd{margin-top: 4rem;}
.cs-service>div {margin-bottom: 1rem}
.cs-service>div>div{padding:  1.5rem;}
.cs-service dl dt{font-size: 1.2rem;margin-top: 2rem;}
.cs-location li span{width: 25px;height: 31px;font-size: 1rem; padding-top: 0.2em;transform: translateY(-30%);}
.cs-location li.active span{transform: scale(1.35) translateY(-30%) !important;}
.location-list{bottom:0;right: 0;width:50vw; transform: translate(0 , 3rem); padding: 1rem;}

#faq [class*=faq-]::before {top: 1.5rem;left: 1rem;line-height: 1.75rem;font-size: 1.25rem;width: 1.75rem;height: 1.75rem;}
#faq .faq-q,
#faq .faq-a {padding: 1.5rem 1.5rem 1.5rem 4rem;}

/* modal */
#newsLetterModal {top: 60px; height: calc(100% - 60px);}
#newsLetterModal>.body{width: 100%;}
#newsLetterModal .subscribe-body{ padding:40px 0 40px 20px;}
#newsLetterModal .form-group{margin-top: 20px;}
#newsLetterModal .info-text{text-align: right;margin-top: 0.5rem;}

/* 임시 */
#channelio{ bottom:0;right:0;width:32px;height:32px;}

/* Safari 9.0+ (iOS Only) */
@supports (-webkit-text-size-adjust:none) and (not (-ms-accelerator:true)) and (not (-moz-appearance:none)) {
	#btn-back{display:flex;position: absolute;}
}

#ch-shadow-root-wrapper{display: none}


.btn-f{
	position: relative;
	top: 15px;
}