.center {text-align:center}
.inner {
width: 100%;
max-width: 1680px;
margin: 0 auto;
position: relative;
}

.sub_banner{padding: 110px 20px 110px 80px; background-size: cover;}
.sub_banner.company {background:url('../img/company/banner01.png') no-repeat center;}
.sub_banner.community {background:url('../img/company/banner02.png') no-repeat center;}
.sub_banner.contact {background:url('../img/company/banner03.png') no-repeat center; margin-top: 65px !important;}
.sub_banner.product {background:url('../img/company/banner04.png') no-repeat center;}

.tab-menu{width: 100%; margin: 50px 0;}
.tab-menu ul{display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.tab-menu ul li{width: 24%; text-align: center; border-bottom: 1px solid #656565; box-sizing: border-box; padding-bottom: 10px; transition: 0.2s; margin-top: 10px;}
.tab-menu.product ul li{width: 19%;}
.tab-menu ul li a{transition: 0.2s; color: #656565;}
.tab-menu ul li:hover,
.tab-menu ul li.on{border-bottom: 1px solid #f42717;}
.tab-menu ul li:hover a,
.tab-menu ul li.on a{color: #f42717;}

.sub_company h2{color: #656565;}

.sub_company .text01 {padding:80px 0px; color: #343b6e; word-break: keep-all;}

.fir-banner{background-image: url(../img/company/sub-banner.png); background-repeat: no-repeat; background-size: cover; background-position: center; padding: 100px 20px; text-align: center; margin: 100px 0;}

.sub_company .overview ul {display:flex; flex-wrap: wrap; padding:50px 0px 100px; position: relative;}
.sub_company .overview ul::after{content: ""; position: absolute; width: 80%; height: 1px; background-color: #acacac; top: 38%; left: 50%; transform: translateX(-50%); z-index: -1;}
.sub_company .overview ul li {width:calc(33.3% - 20px); margin-right:20px; text-align: center;}
.sub_company .overview ul li:last-child {margin-right:0px}
.sub_company .overview ul li > div img{display: inline;}
.sub_company .overview ul li h3 {padding-top:20px}
.sub_company .overview ul li p{color: #656565;}

.sec-banner{padding: 140px 20px; background-image: url(../img/company/about-bg.png); background-repeat: no-repeat; background-size: cover; background-position: center; margin: 50px 0 100px;}
.sec-banner ul{display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
.sec-banner ul li{padding: 20px 0; display: flex; width: 25%; justify-content: center;}
.sec-banner ul li img{margin-right: 20px;}
.sec-banner ul li:not(:first-child){border-left: 1px solid #fff; box-sizing: border-box;}


.history{background-image: url(../img/sub/history-bg.png); background-repeat: no-repeat; background-size: cover;  background-position: center center;}
.history .history-ctt{margin-top: 20px;}
.history .history-ctt > ul{display: flex;}
.history .history-ctt > ul > li{margin-right: 20px; cursor: pointer; color: #f42717; transition: 0.2s;}
/* .history .history-ctt > ul > li:hover,
.history .inner .history-ctt > ul > li.on{color: #f42717;} */

.history .history-ctt .tab-list{ margin-bottom: 100px;}
.history .history-ctt .tab-list ul{display: none;}
.history .history-ctt .tab-list ul:nth-child(1){display: flex;}
.history .history-ctt .tab-list{width: auto;  overflow-x: scroll; margin-top: 40px;  position: relative;}
.history .history-ctt .tab-list > ul{width: auto; height: 300px;}
.history .history-ctt .tab-list > ul:nth-child(1){min-width: 4000px; display: flex;}
.history .history-ctt .tab-list > ul:nth-child(2){min-width: 2500px;}
.history .history-ctt .tab-list > ul:nth-child(3){min-width: 2500px;}
.history .history-ctt .tab-list > ul::before{content: ""; width: 4000px; border-top: 1px solid #acacac; left: 0; position: absolute; top: 4px; z-index: 2;}
.history .history-ctt .tab-list > ul:nth-child(2):before {width: 2500px;}
.history .history-ctt .tab-list > ul:nth-child(3):before {width: 2500px;}

.history .history-ctt .tab-list > ul > li:not(:last-child){margin-right: 80px;}
.history .history-ctt .tab-list > ul > li .dot{width: 8px; height: 8px; background-color: #f42717; border-radius: 100%; position: relative; z-index: 3;}
.history .history-ctt .tab-list > ul > li p:nth-child(2){color: #f42717; padding: 20px 0 10px;}
.history .history-ctt .tab-list > ul > li p{padding: 5px 0;}

.history .history-ctt .tab-list::-webkit-scrollbar{width: 100%; height: 6px; background: #b6b6b6; border-radius: 20px;}
.history .history-ctt .tab-list::-webkit-scrollbar-thumb{background: #000; border-radius: 20px;}

.certifi-ctt{margin: 50px 0 150px;}
.certifi-ctt .certifi_item{width: 100%;}
.certifi-ctt .certifi_item .item{text-align: center;}

.certifi-ctt .slick-next{right: 0 !important; bottom: 50%; background-image: url(../img/company/arrow-next.png); background-repeat: no-repeat; width: 25px; height: 30px; background-size: cover; border: none; font-size: 0;}
.certifi-ctt .slick-prev{left: 0 !important; bottom: 50%; background-image: url(../img/company/arrow-prev.png); background-repeat: no-repeat; width: 25px; height: 30px; background-size: cover; border: none; font-size: 0;}

.certifi-ctt .slick-next:hover,
.certifi-ctt .slick-prev:hover{display: none;}
.certifi-ctt .slick-next::before,
.certifi-ctt .slick-prev::before{display: none;}

/*.slick-slide{padding: 0 100px;}*/
.slick-slide .item img{display: inline-block !important;}


/* 카달로그 */
.catalog-wrap{margin: 100px 0 150px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
.catalog-wrap .cata-title-txt p:nth-child(2){padding: 20px 0 50px;}
.catalog-wrap .title-img{width: 50%; margin-right: 40px; box-shadow: 0px 3px 10px #eee;}
.catalog-wrap .title-img img{width: 100%;}
.catalog-wrap .text01{padding: 0 0 20px;}
.catalog-wrap .cata-title-txt{width: 40%;}

.catalog-wrap a{background-color: #f42717; display: inline-block; color: #fff; padding: 15px 20px;}
.catalog-wrap a img{display: inline-block; margin-right: 50px;}
@media screen and (max-width: 1800px){
    .inner {padding: 0px 20px; }
    .sub_banner{margin-left: 0 !important;}

}
@media screen and (max-width: 1600px){
    /* .sub_company{padding: 0 20px;} */
}

@media screen and (max-width: 1400px){
    .sub_company .overview ul li > div{width: 70%; margin: 0 auto;}
    .sub_company .overview ul li > div img{width: 100%; }

    .sec-banner{padding: 100px 20px;}
    .sec-banner ul li{width: 50%;}
    .sec-banner ul li:nth-child(3){border-left: 0; margin-top: 20px;}
    .sec-banner ul li:nth-child(4){margin-top: 20px;}
}

@media screen and (max-width:1200px){

    .sub_company .overview ul::after{top: 35%;}

    .catalog-wrap .title-img{width: 60%; margin-right: 0px;}
    .catalog-wrap .cata-title-txt{width: 100%; text-align: center; margin-top: 40px;}
}

@media screen and (max-width:1024px){
    .sub_company .overview ul::after{top: 30%;}

    
}

@media screen and (max-width: 900px){

}

@media screen and (max-width:768px){
    .tab-menu.product ul{justify-content: flex-start;}
    .tab-menu.product ul li{width: 33.3333%;}
    /* .sub_company .overview ul{padding: 20px 0;} */
    .sub_company .overview ul li {width:100%; margin-right: 0;}
    .sub_company .overview ul li:not(:last-child){margin-bottom: 40px;}
    .sub_company .overview ul li > div{width: 60%; margin: 0 auto;}
    .sub_company .overview ul::after{display: none;}

    .sec-banner{padding: 50px 20px;}
    .sec-banner ul li{width: 100%;}
    .sec-banner ul li:nth-child(2){border-left: 0;}
    .sec-banner ul li:nth-child(4){border-left: 0;}
    .sec-banner ul li{border-top: 1px solid #fff; margin-top: 20px;}
    .sec-banner ul li:first-child{border-top: 0; margin-top: 0px;}

    .history .inner .history-ctt > ul{flex-direction: column;}

    .catalog-wrap .title-img{width: 100%;}
}

@media screen and (max-width:600px){
    .sub_banner{padding: 100px 20px 100px 40px;}

    .history .history-ctt > ul{flex-direction: column;}
}

@media screen and (max-width:480px){
    .sub_banner{padding: 90px 20px 90px 20px;}

}