@charset "utf-8";


/************************************************************************
* COMMON *
************************************************************************/
.container{width:100%;position:relative;overflow:hidden;}
.contents{}
.contents.main div[id*='sec-']{padding:120px 0;}
.contents.sub .detail{padding-top:90px;padding-bottom:120px;}
.contents.sub .detail.pt0{padding-top:0 !important;}
.contents.sub .subWrap {padding:160px 0;}

@media screen and (max-width:1280px) {
.contents.main div[id*='sec-']{padding:80px 0;}
.contents.sub .detail{padding-top:70px;padding-bottom:90px;}
}
@media screen and (max-width:960px) {
.contents.main div[id*='sec-']{padding:80px 0;}
.contents.sub .detail{padding-top:60px;padding-bottom:80px;}
}
@media screen and (max-width:767px) {
.contents.main div[id*='sec-']{padding:80px 0;}
.contents.sub .detail{padding-top:50px;padding-bottom:70px;}
.contents.sub .subWrap {padding:140px 0;}
}
@media screen and (max-width:640px) {
.contents.main div[class*='sec-']{padding:80px 0;}
.contents.sub .detail{padding-top:55px;padding-bottom:55px;}
.contents.sub .subWrap {padding:100px 0 120px 0;}
}
@media screen and (max-width:560px) {
.contents.main div[class*='sec-']{padding:80px 0;}
.contents.sub .detail{padding-top:35px;padding-bottom:35px;}
}

.contentsBg{background:#f0f0fa;}
.contentsBg-gray{background:#fbfbfb;}





/************************************************************************
* ul *
*************************************************************************/
.list li{width:100%;line-height:150%;font-weight:400;position:relative;word-wrap:break-word;display:block;word-break:keep-all;}
.list li:last-child{padding-bottom:0 !important;}
.list li b,
.list li u,
.list li a{word-wrap:break-word;display:inline-block;word-break:keep-all;}

.list.type1 li{padding-left:12px;padding-bottom:10px;color:#333;font-size:24px;text-align:left;font-family:'Pretendard-Light'; letter-spacing: -0.02em;}
.list.type1 li:after{width:3px;height:3px;display:block;content:"";position:absolute;top:17px;left:0;background:#333;border-radius:50%;}

.list.type2 li{padding-left:12px;padding-bottom:20px !important;color:#333;font-size:24px;text-align:left;font-family:'Pretendard-Light'; letter-spacing: -0.02em; line-height: 150%;}
/*.list.type2 li:nth-child(odd){font-size:24px;font-family:'Pretendard-Medium';padding-bottom:0px !important;color:#000}*/
.list.type2 li:after{width:3px;height:3px;display:block;content:"";position:absolute;top:17px;left:0;background:#333;border-radius:50%;}

@media screen and (max-width:1500px){
.list.type1 li{font-size:22px;}
.list.type1 li:after{top:16px;}
    
.list.type2 li{font-size:22px;}
.list.type2 li:after{top:17px;left:0;}
}
@media screen and (max-width:1280px){
.list.type1 li{font-size:20px;padding-left:10px;padding-bottom:8px;}
.list.type1 li:after{top:14px;}
    
.list.type2 li{font-size:20px;padding-left:10px;padding-bottom:18px !important;}
.list.type2 li:after{top:14px;}
}
@media screen and (max-width:960px){
.list.type1 li{font-size:19px;}
    
.list.type2 li{font-size:19px;}
}
@media screen and (max-width:640px){
.list.type1 li{font-size:18px;padding-left:10px;padding-bottom:8px;}
.list.type1 li:after{top:13px;}
    
.list.type2 li{font-size:18px;padding-left:10px;padding-bottom:18px !important;}
.list.type2 li:after{top:13px;}
}
@media screen and (max-width:460px){
.list.type1 li{font-size:16px;padding-left:9px; line-height: 120%;}
.list.type1 li:after{top:10px;}
    
.list.type2 li{font-size:16px;padding-left:9px; line-height: 120%;}
.list.type2 li:after{top:10px;}
}










/************************************************************************
* MAIN_CONTENTS *
************************************************************************/
.main div[id*='sec-'] .titBox{padding:0 3%;}
.main div[id*='sec-'] .titBox .type20{font-weight: 300; letter-spacing: 0.02em;transition:all 0.5s ease;}
.main div[id*='sec-'] .titBox h2{font-family:'Pretendard-Bold';transition:all 0.5s ease;}

    @media screen and (max-width:1280px){
    .main div[id*='sec-'] .titBox .type20{font-size: 20px;}
    .main div[id*='sec-'] .titBox h2{margin-top: 5px;}
    }
    @media screen and (max-width:960px){
    .main div[id*='sec-'] .titBox .type20{font-size: 18px;}
    .main div[id*='sec-'] .titBox h2{font-size: 50px;}
    }
    @media screen and (max-width:767px){
    .main div[id*='sec-'] .titBox .type20{font-size: 17px;}
    .main div[id*='sec-'] .titBox h2{font-size: 47px;}
    }
    @media screen and (max-width:640px){
    .main div[id*='sec-'] .titBox .type20{font-size: 16px;}
    .main div[id*='sec-'] .titBox h2{font-size: 42px;}
    }
    @media screen and (max-width:460px){
    .main div[id*='sec-'] .titBox h2{font-size: 38px;}
    }
    @media screen and (max-width:360px){
    .main div[id*='sec-'] .titBox h2{font-size: 34px;}
    }



/* 더보기 버튼 */
.main div[id*='sec-'] button{padding:16px 60px 16px 50px; margin: 0 auto;background:transparent ;border-radius:60px;border:solid 1px #ababab;color:#585858;font-family: "Montserrat" !important;display:flex;justify-content:space-between;box-shadow: 0 2px 20px 0 rgba(255, 255, 255, 0);position: relative;transition:all 0.5s ease;}
.main div[id*='sec-'] button:hover{ border:solid 1px #333;color:#000 !important;box-shadow: 0 2px 20px 0 rgba(255, 255, 255, 0.7); transition:all 0.5s ease;}
.main div[id*='sec-'] button i{width:8px;height:8px;top:3px;left: 10px; background:linear-gradient(-45deg, #119cd8 10% , #008fa3 60%);border-radius: 50px;display:inline-block;position:relative;transition:all 0.5s ease;}
.main div[id*='sec-'] button:hover i{left: 30px;}


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



/************************** Main Title  **************************/
.main #sec-1 .txtBox a{width:160px;padding:12px 40px 12px 30px;background:#000;border-radius:30px;color:#fff;display:flex;justify-content:space-between;transition:all 0.2s ease;}
.main #sec-1 .txtBox a i{width:9px;height:9px;margin-top:6px;border:solid 1px rgba(255,255,255,01);border-width:1px 1px 0 0;display:inline-block;position:relative;}
.main #sec-1 .txtBox a i:after{width:9px;height:1px;background:rgba(255,255,255,1);position:absolute;top:4px;right:0;display:block;content:"";transform:rotate(-45deg);}
.main #sec-1 .txtBox a:hover{padding-right:30px;transition:all 0.2s ease;}

    @media screen and (max-width:960px){
    .main #sec-1 .txtBox a{width:130px;padding:10px 20px !important;}
    }
    @media screen and (max-width:640px){
    .main #sec-1 .txtBox a{width:120px;}
    }
    @media screen and (max-width:560px){
    .main #sec-1 .txtBox{display:block;}
    }


/************************************************************************
* main_product *
************************************************************************/
.main_section04 .WRAP{height:100%;}

.rndBox{width:100%;height:100%;position:relative;}
.rndBox>div{height:60vh;}
.rndBox .rndBox_bg{width:100%;height:80%;position:absolute;left:0;top:0;}
.rndBox .rndBox_bg .swiper-slide{opacity:0;position:absolute;transition:opacity 0.7s linear;display:flex;justify-content:center;z-index:98;}
.rndBox .rndBox_bg .swiper-slide.active{opacity:1;z-index:99;}

.rndBox .rndBox_bg .swiper-slide .textBox{width:50%;padding:3% 3% 0 0;cursor:pointer;display:block;height:auto !important;}
.rndBox .rndBox_bg .swiper-slide .textBox > div{overflow:hidden;}
.rndBox .rndBox_bg .swiper-slide .textBox *{position:relative;opacity:0;}
.rndBox .rndBox_bg .swiper-slide .textBox h1.cTit{padding-top:20%;}

.rndBox .rndBox_bg .swiper-slide .imgBox{padding-top:0%;width:50%;overflow:hidden;}
.rndBox .rndBox_bg .swiper-slide .imgBox img{width:100%;transform:scale(1.1);transition:transform 2s linear;}
.rndBox .rndBox_bg .swiper-slide.active .imgBox img{transform:scale(1);}

.rndBox .rndBox_bg .swiper-slide.active .textBox *{opacity:1;animation:introTextUp 1s;animation-fill-mode:forwards;}
.rndBox .rndBox_bg .swiper-slide.active .textBox *:nth-child(1){animation:introTextUp 1s;}
.rndBox .rndBox_bg .swiper-slide.active .textBox *:nth-child(2){animation:introTextUp 1s 0.3s;}
.rndBox .rndBox_bg .swiper-slide.active .textBox *:nth-child(3){animation:introTextUp 1s 0.6s;}
.swiper {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1;
}
.swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
    bottom: 10px;
    left: 0;
    width: 100%;
}
.swiper-pagination {
    position: absolute;
    text-align: center;
    transition: 0.3s opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10;
}
.rndBox .swiper-pagination{z-index:999; bottom:90px!important;}
.rndBox .swiper-pagination > div{width:45%; display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;position:relative;}
.rndBox .swiper-pagination > div > div.flex{width:100%;display:flex;}
.rndBox .swiper-pagination h4{width:calc(100%/4 - 10px);height:72px;margin:0 5px !important;font-size:0 !important;position:absolute;top:0;left:0;cursor:pointer;position:relative;display:none !important;}

.rndBox .swiper-pagination-bullet{width:calc(100%/4 - 10px);height:60px;margin:5px 5px !important;border:solid 2px #01184a;background:none;position:relative;overflow:hidden;border-radius:0 !important;opacity:1;}
.rndBox .swiper-pagination-bullet font{width:100%;height:100%;font-size:21px;line-height:58px;text-align:center;font-weight:700;color:#01184a;display:block;z-index:999;position:absolute;}
.rndBox .swiper-pagination-bullet::before{content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;z-index:99;}
.rndBox .swiper-pagination-bullet-active font{color:#fff;}
.rndBox .swiper-pagination-bullet-active::before{background-color:#01184a;animation:slide-progress 4s linear forwards;}

@keyframes slide-progress{
	0%{transform:translateX(-100%);}
  100%{transform:translateX(0);}
}

@media screen and (max-width:1500px){
.rndBox .rndBox_bg .swiper-slide .textBox{width:65%;padding:2%;}
.rndBox .rndBox_bg .swiper-slide .textBox h1.cTit{padding-top:18%;}
.rndBox .rndBox_bg .swiper-slide .imgBox{padding-top:10%;width:35%;}

.rndBox .swiper-pagination{height:70px;bottom:180px !important;}
.rndBox .swiper-pagination > div{width:50%;}

.rndBox .swiper-pagination-bullet{width:calc(100%/4 - 8px);height:70px;margin:4px 4px !important;}
.rndBox .swiper-pagination-bullet font{font-size:18px !important;line-height:70px;}
}
@media screen and (max-width:1280px){
.rndBox .rndBox_bg .swiper-slide .textBox{width:70%;padding-left:0;}

.rndBox .rndBox_bg .swiper-slide .textBox h1.cTit{padding-top:18%;}
.rndBox .rndBox_bg .swiper-slide .imgBox{padding-top:10%;width:30%;}

.rndBox>div {
    height: 40vh;
}
.rndBox .swiper-pagination{height:85px;bottom:30px !important;}

.rndBox .swiper-pagination-bullet{width:calc(100%/4 - 6px);height:50px;margin:3px 3px !important;}
.rndBox .swiper-pagination-bullet font{font-size:18px !important;line-height:45px;}
}
@media screen and (max-width:1100px){
}
@media screen and (max-width:1024px){
.rndBox .swiper-pagination{height:55px;bottom:50px !important;}

.rndBox .swiper-pagination-bullet{width:calc(100%/4 - 2px);height:55px;margin:0 1px !important;}
.rndBox .swiper-pagination-bullet font{font-size:20px !important;line-height:55px;}
}
@media screen and (max-width:960px){
.rndBox .rndBox_bg .swiper-slide .textBox{padding-left:3%;}

.rndBox .swiper-pagination{height:50px;bottom:40px !important;}
    .rndBox .swiper-pagination > div {
        width: 100%;
    }
	    .rndBox .rndBox_bg .swiper-slide .imgBox {
        padding-top: 3%;
        width: 30%;
    }
.rndBox .swiper-pagination-bullet{height:50px;}
.rndBox .swiper-pagination-bullet{width:calc(100%/7 - 6px);height:50px;margin:3px 3px !important;}
.rndBox .swiper-pagination-bullet font{font-size:18px !important;line-height:50px;}
}
@media screen and (max-width:860px){
	.rndBox .rndBox_bg .swiper-slide .textBox {
        width: 60%;
    }
	        .rndBox .rndBox_bg .swiper-slide .imgBox {
            padding-top: 0%;
            width: 40%;
        }
	.rndBox .type80{font-size:40px !important;}
.rndBox .swiper-pagination{bottom:80px !important;}
.rndBox .swiper-pagination-bullet{width:calc(100%/3 - 6px);height:40px;margin:2px 2px !important;}
.rndBox .swiper-pagination-bullet font{font-size:16px !important; line-height:38px;}
}
@media screen and (max-width:767px){
.rndBox .rndBox_bg .swiper-slide .textBox{padding-left:2%;}
.rndBox .rndBox_bg .swiper-slide.active .textBox{height:auto !important;}
.rndBox .type80{font-size:45px !important;}
.rndBox .swiper-pagination{bottom:79px !important;}

.rndBox .swiper-pagination-bullet font{font-size:15px !important;}
}
@media screen and (max-width:640px){
.rndBox .rndBox_bg .swiper-slide .textBox font br{display:none;}
.rndBox .type80{font-size:35px !important;}
.rndBox .swiper-pagination{bottom:80px !important;}
.rndBox .rndBox_bg .swiper-slide .textBox {
        width: 50%;
    }
	        .rndBox .rndBox_bg .swiper-slide .imgBox {
            padding-top: 3%;
            width: 50%;
        }
.rndBox .swiper-pagination-bullet font{font-size:14px !important;}
}
@media screen and (max-width:520px){

.rndBox .swiper-pagination{bottom:80px !important;}

.rndBox .swiper-pagination-bullet font{font-size:13px !important;}
}



@media screen and (max-height:767px){
.rndBox .rndBox_bg .swiper-slide .textBox h1.cTit{padding-top:50px;}
}
@media screen and (max-height:680px){
.rndBox .rndBox_bg .swiper-slide .textBox h1.cTit{padding-top:60px;}
}
@media screen and (max-height:640px){
.rndBox .rndBox_bg .swiper-slide .textBox h1.cTit{padding-top:70px;}
}



#sec-1  {
    background: url(/base_1/img/img/1deps_bg.jpg) no-repeat  bottom;
    background-size:cover;
}





/************************** sec-2  **************************/
.main #sec-2{ position: relative;transition:all 0.2s ease;}

.main #sec-2 .banner{position:relative;font-size:0;line-height:0;}
.main #sec-2 .banner .slick-track{display:flex;align-items:center;justify-content:center;padding-bottom:2px;}

.main #sec-2 .button.black {
    color: #000;
    border-color: #000;
}
.main #sec-2 .button {
    width: 210px;
    padding: 20px 30px;
    border-radius: 50px;
    font-size: 18px;
    text-align: left;
    border: solid 2px #000;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: all 0.2s ease;
}

.main #sec-2 .button i {
    width: 25px;
    height: 1px;
    background: #000;
    position: relative;
    transform: translateY(-50%);
    transition: all 0.2s ease;
}

.main #sec-2 .button.black i:after {
    border-color: #000;
}
.main #sec-2 .button i:after {
    width: 7px;
    height: 7px;
    border: solid #000;
    border-width: 1px 1px 0 0;
    position: absolute;
    top: 50%;
    right: 0;
    display: block;
    content: "";
    transform: translateY(-50%) rotate(45deg);
    transition: all 0.2s ease;
}


.main #sec-2 .banner_title{position:absolute;top:38px;left:0;}
.main #sec-2 .banner_list{padding:30px 0 30px 0;overflow:hidden;}
.main #sec-2 .banner_item{display:inline-block;position:relative;}
.main #sec-2 .banner_item + .banner_item{margin-left:25px;padding-left:25px;}
.main #sec-2 .banner_item + .banner_item:before{width:1px;height:9px;display:block;position:absolute;top:0;left:0;bottom:0;margin-top:auto;margin-bottom:auto;border-left:1px dotted #848484;}


.main #sec-2 .banner_item .board_output_1_tr{width: 100%; background: #fff; border:solid 1px #b4b4b4; padding: 5%;border-radius: 30px;position:relative; display: grid; transition:all 0.3s ease;}
/* 테이블 구조를 무시하고 Flex 적용 */
.banner_item table, 
.banner_item tbody {
    display: flex;
    flex-direction: row; /* 좌우로 나열 */
    gap: 15px;           /* 항목 사이 간격 */
    width: 100%;
}

/* tr 요소를 하나의 박스(카드) 형태로 변환 */
.board_output_1_tr {
    display: flex;
    flex-direction: column; /* 카드 안의 아이콘, 제목, 날짜는 위아래로 */
    flex: 1;                /* 동일한 너비 배분 */
    border: 1px solid #ddd; /* 테두리 추가 */
    padding: 15px;
    border-radius: 8px;     /* 모서리 둥글게 */
    background: #fff;
}

/* 내부 td 요소들을 블록화 */
.board_output_1_tr td {
    display: block;
    width: 100% !important;
    padding: 5px 0;
}
.board_output_1_tr img{display:none;}
.board_output_1_tr  .bd_out1{font-size:21px; font-weight:700;}
.board_output_1_tr {font-size:18px; line-height:160%;}

.main #sec-2 .banner_anchor{width: 100%; background: #fff; border:solid 1px #b4b4b4; padding: 7%;border-radius: 30px;position:relative; display: grid; transition:all 0.3s ease;}
.main #sec-2 .banner_anchor:hover{background: #1a33b2; border:solid 1px #119cd8;}
.main #sec-2 .banner_anchor img.Nimg{width:100%;margin:0 auto;display:block;border-radius:30px;aspect-ratio:16 / 9;transition:all 0.3s ease;}
.main #sec-2 .banner_anchor:hover img.Nimg{border-radius:5px;}

.main #sec-2 .banner_anchor .nBox{width: fit-content; background: #1a33b2; color: #fff;padding: 5px 10px; border-radius:50px; font-family: "Manrope", sans-serif !important;font-weight: 500; list-style: 0.02em;transition:all 0.3s ease;}
.main #sec-2 .banner_anchor:hover .nBox{background: #fff; color: #1a33b2; transition:all 0.3s ease;}
.main #sec-2 .banner_anchor .tit{/*white-space: nowrap; overflow: hidden; text-overflow: ellipsis;transition:all 0.2s ease;*/}
.main #sec-2 .banner_anchor .ctxt{/*text-overflow:ellipsis;overflow: hidden;display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient:vertical; -webkit-box-pack: top; */ transition:all 0.3s ease;}
.main #sec-2 .banner_anchor .date{transition:all 0.3s ease;}

.main #sec-2 .banner_anchor:hover .tit,
.main #sec-2 .banner_anchor:hover .ctxt{color: #fff;}
.main #sec-2 .banner_anchor:hover .date{color: rgba(255,255,255,.6);}



.main #sec-2 .banner_control{width:100%;}
.main #sec-2 .slick-arrow,
.main #sec-2 .banner_more{display:inline-block;position:relative;width:100px;height:100px;background:rgba(17,156,216,.1) !important;  border-radius:50%;border:none;vertical-align:middle;transition:all 0.5s ease;}
.main #sec-2 .slick-arrow:hover,
.main #sec-2 .banner_more:hover{background:rgba(17,156,216,.8) !important;}
.main #sec-2 .banner_auto{margin-right:4px;margin-left:4px;}
.main #sec-2 .banner_more{margin-left:4px;}

    @media screen and (max-width:1500px){
    .main #sec-2 .banner{padding:15px 0;}
        
    .main #sec-2 .banner_control .slick-arrow.banner_prev{left:5%;}
    .main #sec-2 .banner_control .slick-arrow.banner_next{right:5%;}
    }
    @media screen and (max-width:1280px){
    .main #sec-2 .banner_anchor img{width:95%;border-radius:20px;}
    }
	@media screen and (max-width:980px){  
    .main #sec-2 .w55{width:100%!important;}    
	.main #sec-2 .w45{width:100%!important;} .main #sec-2 .button {display:none;}
	.main #sec-2 .boardMainBox{margin-top:25px; }
	}
    @media screen and (max-width:767px){
    .main #sec-2 .banner{padding:0;}    
    .main #sec-2 .w55{width:100%!important;}    
	.main #sec-2 .w45{width:100%!important;} 
	.main #sec-2 .banner_item + .banner_item {
    margin-left: 0px;
    padding-left: 0px;
}
.main #sec-2 .banner_item + .banner_item:nth-child(2){margin-top:10px;}
.main #sec-2 .boardMainBox{margin-top:25px; flex-wrap: inherit!important;}
.main #sec-2 .button {display:none;}
    }



/******************************* sec-3 인재채용 / 회사소개 *******************************/
.main #sec-3  {
    background: url(/base_1/img/img/3deps_bg.jpg) no-repeat  bottom;
    background-size:cover;
}



.main #sec-3 .disF .RecruitBox .menu1 {width:100%;margin:25px 30px 0 0; padding:35px 55px;border-radius:20px;  color: #fff; transition:all 0.5s ease;}
.main #sec-3 .disF .RecruitBox .menu2 {width:100%;margin:25px 0 0 30px; padding:35px 55px;border-radius:20px;  color: #fff; transition:all 0.5s ease;}
.main #sec-3 .disF .RecruitBox .right-2 .menu1{background: url(/base_1/img/img/3deps_img1.jpg) no-repeat;}
.main #sec-3 .disF .RecruitBox .left-2 .menu2{background: url(/base_1/img/img/3deps_img2.jpg) no-repeat;}


.main #sec-3 .disF .CompanyBox .s3Logo{width:167px; height: 91px;transition:all 0.5s ease;}
.main #sec-3 .disF .RecruitBox .button:nth-child(2) {
	margin-left:10px;
}
.main #sec-3 .disF .RecruitBox .button {
    width: fit-content;
    padding: 15px 20px;
    border-radius: 10px;
    font-size: 18px;
    text-align: left;
    border: solid 2px #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: all 0.2s ease;
	background: #fff;
}

.main #sec-3 .disF .RecruitBox .button i {
	margin-left:15px;
    width: 25px;
    height: 1px;
    background: #000;
    position: relative;
    transform: translateY(-50%);
    transition: all 0.2s ease;
}

.main #sec-3 .disF .RecruitBox.button .black i:after {
    border-color: #000;
}
.main #sec-3 .disF .RecruitBox .button i:after {
    width: 7px;
    height: 7px;
    border: solid #000;
    border-width: 1px 1px 0 0;
    position: absolute;
    top: 50%;
    right: 0;
    display: block;
    content: "";
    transform: translateY(-50%) rotate(45deg);
    transition: all 0.2s ease;
}


    @media screen and (max-width:1500px) {
    .main #sec-3 .disF .RecruitBox a {width:calc(100%/2.1 - 20px);margin:0 12px;padding:45px 15px;}
    .main #sec-3 .disF .RecruitBox a:hover {border-bottom-right-radius:120px;}
        
    .main #sec-3 .disF .CompanyBox .disF{width:60%;}
    }
    @media screen and (max-width:1280px) {

        
    .main #sec-3 .disF .RecruitBox a {width:calc(100%/2.1 - 25px);margin:0 10px;padding:40px 15px;}
    .main #sec-3 .disF .RecruitBox a:hover {border-bottom-right-radius:100px;}
    .main #sec-3 .disF .RecruitBox a figure{width:120px;height:120px;}
        
    .main #sec-3 .disF .CompanyBox .disF{width:65%;}
    .main #sec-3 .disF .CompanyBox a{width:calc(100%/2.3); margin: 5px 6px;padding: 14px 30px;}
    }
    @media screen and (max-width:1100px) {

    .main #sec-3 .disF .RecruitBox a {width:calc(100%/2.1 - 30px);margin:0 7px;padding:40px 15px;}
    .main #sec-3 .disF .RecruitBox a:hover {border-bottom-right-radius:80px;}
    .main #sec-3 .disF .RecruitBox a figure{width:100px;height:100px;}
     .main #sec-3 .disF .RecruitBox .menu2 {
    width: 100%;
    margin: 25px 0 0 30px;
    padding: 25px 25px;

}   
    .main #sec-3 .disF .CompanyBox .s3Logo{width:140px; height: 76px;}
        
    .main #sec-3 .disF .CompanyBox .disF{width:75%;}
    .main #sec-3 .disF .CompanyBox a{width:calc(100%/2.3); margin: 4px 5px;padding: 12px 25px;}
    }
    @media screen and (max-width:960px) {
    .main #sec-3 .disF .RecruitBox {width:100% !important; }

    .main #sec-3 .disF .RecruitBox a {width:calc(100%/1.1 - 20px);margin:0 5px;}
    .main #sec-3 .disF .RecruitBox a figure{width:90px;height:90px;}
       		.main #sec-3 .disF .RecruitBox .menu1 {
    width: 100%;
    margin: 0;
    padding: 35px 35px;
    border-radius: 20px;
    color: #fff;
    transition: all 0.5s ease;
}
	.main #sec-3 .disF .RecruitBox .menu2 {
    width: 100%;
    margin: 0;
    padding: 35px 35px;
    border-radius: 20px;
    color: #fff;
    transition: all 0.5s ease;
} 
    .main #sec-3 .disF .CompanyBox .s3Logo{width:120px; height: auto}
    .main #sec-3 .disF {padding: 20px 0;}
    .main #sec-3 .disF .CompanyBox .disF{width:70%;}
    .main #sec-3 .disF .CompanyBox a{width:calc(100%/2.3); margin: 3px 4px;padding: 11px 22px;}
    }
    @media screen and (max-width:860px) {
		.main #sec-3 .disF .RecruitBox .menu1 {
    width: 100%;
    margin: 0;
    padding: 35px 35px;
    border-radius: 20px;
    color: #fff;
    transition: all 0.5s ease;
}
	.main #sec-3 .disF .RecruitBox .menu2 {
    width: 100%;
    margin: 0;
    padding: 35px 35px;
    border-radius: 20px;
    color: #fff;
    transition: all 0.5s ease;
}
main #sec-3 .disF .RecruitBox .button {
    width: fit-content;
    padding: 10px 0px;
    border-radius: 10px;
    font-size: 16px;
    text-align: left;
    border: solid 2px #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: all 0.2s ease;
    background: #fff;
}
    .main #sec-3 .disF .RecruitBox a {width:calc(100%/2.1 - 10px);margin:0 5px;}
    .main #sec-3 .disF .RecruitBox a figure{width:80px;height:80px;}
        
    .main #sec-3 .disF .CompanyBox .disF{width:80%;}
    .main #sec-3 .disF .CompanyBox a{width:calc(100%/2.3); margin: 3px 4px;padding: 11px 22px;}
    }
    @media screen and (max-width:767px) {

    .main #sec-3 .disF .RecruitBox a {width:calc(100%/1.4 - 10px);margin:5px 5px;padding:20px 15px;}
    .main #sec-3 .disF .RecruitBox a:hover {border-top-left-radius:50px;border-bottom-right-radius:80px;}
    .main #sec-3 .disF .RecruitBox a figure{width:80px;height:80px;}
    .main #sec-3 .disF .RecruitBox a font{margin-top: 0px !important;}
        
    .main #sec-3 .disF .CompanyBox .disF{width:80%;}
    .main #sec-3 .disF .CompanyBox a{width:calc(100%/1.5); margin: 2px 2px;padding: 11px 22px;}
    }
    @media screen and (max-width:640px) {
		
    .main #sec-3 .disF .RecruitBox a {width:calc(100%/1.2 - 10px);}
    .main #sec-3 .disF .RecruitBox a:hover {border-top-left-radius:40px;border-bottom-right-radius:70px;}
    .main #sec-3 .disF .RecruitBox a figure{width:70px;height:70px;}
        
    .main #sec-3 .disF .CompanyBox .disF{width:90%;}
    .main #sec-3 .disF .CompanyBox a{width:calc(100%/1.4);padding: 10px 20px;}
    }
    @media screen and (max-width:540px) {
    .main #sec-3 {padding:0 !important;}
    .main #sec-3:before{width:100%;height:42%;}
        
    .main #sec-3 .disF .RecruitBox {width:100% !important;}
    .main #sec-3 .disF .RecruitBox a {width:calc(100%/2.3 - 10px);margin:0px;}
    .main #sec-3 .disF .RecruitBox a:hover {border-top-left-radius:40px;border-bottom-right-radius:70px;}
    .main #sec-3 .disF .RecruitBox a figure{width:70px;height:70px;}
        
    .main #sec-3 .disF .CompanyBox {width:70% !important;padding:90px 0 !important; margin: 0 auto;}
    .main #sec-3 .disF .CompanyBox .disF{width:90%;}
    .main #sec-3 .disF .CompanyBox a{width:calc(100%/1.6);padding: 14px 20px;margin: 4px 2px; }
    .main #sec-3 .disF .CompanyBox a font{font-size: 17px !important;}
    }






/******************************* sec-3 *******************************/
.main #sec-3 .txtBox{width:450px;}
.main #sec-3 .txtBox a{width:160px;padding:12px 40px 12px 30px;background:#000;border-radius:30px;color:#fff;display:flex;justify-content:space-between;transition:all 0.2s ease;}
.main #sec-3 .txtBox a i{width:9px;height:9px;margin-top:6px;border:solid 1px rgba(255,255,255,01);border-width:1px 1px 0 0;display:inline-block;position:relative;}
.main #sec-3 .txtBox a i:after{width:9px;height:1px;background:rgba(255,255,255,1);position:absolute;top:4px;right:0;display:block;content:"";transform:rotate(-45deg);}
.main #sec-3 .txtBox a:hover{padding-right:30px;transition:all 0.2s ease;}

.main #sec-3 .boardBox{width:calc(100% - 450px);padding-left:50px;}
.main #sec-3 .b-list{width:100%;border:solid 3px #000;border-left:none;border-right:none;}
.main #sec-3 .b-list a{padding:40px;display:flex;align-items:center;border-bottom:solid 1px #e6e6e6;}
.main #sec-3 .b-list a:last-child{border-bottom:none;}
.main #sec-3 .b-list .dateBox{width:80px;}
.main #sec-3 .b-list .dateBox *{text-align:center;transition:all 0.2s ease;}
.main #sec-3 .b-list .dateBox .date{color:#c3c3c3;}

.main #sec-3 .b-list .conBox{width:calc(100% - 80px);padding-left:50px;}
.main #sec-3 .b-list .conBox *{width:100%;display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;transition:all 0.2s ease;}
.main #sec-3 .b-list .conBox .con{opacity:0.8;}

.main #sec-3 .b-list a:hover{background:#2316cb;transition:all 0.2s ease;}
.main #sec-3 .b-list a:hover *{color:#fff;transition:all 0.2s ease;}

@media screen and (max-width:1700px){
.main #sec-3 .txtBox{width:400px;}
.main #sec-3 .boardBox{width:calc(100% - 400px);padding-left:40px;}
}
@media screen and (max-width:1600px){
.main #sec-3 .txtBox{width:350px;}
.main #sec-3 .boardBox{width:calc(100% - 350px);padding-left:30px;}
}
@media screen and (max-width:1500px){
.main #sec-3 .txtBox{width:300px;}
.main #sec-3 .boardBox{width:calc(100% - 300px);padding-left:20px;}
}
@media screen and (max-width:1280px){
.main #sec-3 .txtBox{width:100%;display:flex;justify-content:space-between;align-items:flex-end;}
.main #sec-3 .txtBox br{display:none;}
.main #sec-3 .txtBox a{width:140px;padding:10px 25px !important;}

.main #sec-3 .boardBox{width:100%;padding-left:0;margin-top:30px;}
.main #sec-3 .b-list{border-width:2px;}
.main #sec-3 .b-list a{padding:35px;padding-left:30px;}
.main #sec-3 .b-list .dateBox{width:70px;}
.main #sec-3 .b-list .conBox{width:calc(100% - 70px);padding-left:40px;}
}
@media screen and (max-width:960px){
.main #sec-3 .txtBox a{width:130px;padding:10px 20px !important;}

.main #sec-3 .b-list a{padding:30px;padding-left:20px;}
.main #sec-3 .b-list .dateBox{width:60px;}
.main #sec-3 .b-list .conBox{width:calc(100% - 60px);padding-left:30px;}
}
@media screen and (max-width:640px){
.main #sec-3 .txtBox a{width:120px;}

.main #sec-3 .b-list a{padding:25px;padding-left:15px;}
.main #sec-3 .b-list .conBox{padding-left:20px;}
.main #sec-3 .b-list .conBox .con{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;white-space:normal;text-overflow:clip;}
}
@media screen and (max-width:460px){
.main #sec-3 .txtBox{display:block;}
.main #sec-3 .b-list a{display:block;padding:20px 15px;}
.main #sec-3 .b-list .dateBox{width:100%;display:flex;justify-content:flex-start;align-items:flex-end;}
.main #sec-3 .b-list .dateBox .date{order:-1;margin-right:3px;font-size:19px !important;font-family:'Pretendard-ExtraBold';color:#000;}
.main #sec-3 .b-list .conBox{width:100%;padding-left:0;margin-top:10px;}
}
@media screen and (max-width:360px){
.main #sec-3 .b-list a{padding:15px 10px;}
}









/************************************************************************
* SUB_CONTENTS *
************************************************************************

/************* 서브타이틀 *************/
.sub_ttl{padding: 0 15px;}

/************* 연혁 *************/

.his{position:relative;}
.his:before,
.his:after{display:none;}

.his>div{margin-bottom:30px;}
.his>div:last-child{margin-bottom:0 !important;}

.his>div .imgBox{width:50%;padding-right:50px;opacity:0; margin-top: 5px; position: relative;}
.his>div .imgBox img{width:90%; border-radius: 20px; position: absolute; right:60px;}
.his>div .txtBox{width:50%;opacity:0;}
.his>div .txtBox .item{width:100%;padding-left:50px;margin-bottom:100px;}
.his>div .txtBox .item .year{}
.his>div .txtBox .item .mulBox{width:100% ; margin-top: 10px;}
.his>div .txtBox .item .month{width:100px; color: #000; font-size: 28px;  margin-top:25px;float:left;}
.his>div .txtBox .item ul{width:calc(100% - 140px);margin-top:29px;float:left;}
.his>div .txtBox .item ul li{margin-bottom:10px;font-size:22px;line-height:130%;color:#848383;font-weight:500;word-wrap:break-word;display:block;word-break:keep-all;}


.his>div:nth-child(even) .imgBox{padding-right:0;padding-left:50px;}
.his>div:nth-child(even) .imgBox img{position: absolute; left:60px; right: auto;}
.his>div:nth-child(even) .txtBox{order:-1;}
.his>div:nth-child(even) .txtBox .item{padding-left:0;padding-right:50px;}
.his>div:nth-child(even) .txtBox .item .year{width: 100%; text-align:right !important;}
.his>div:nth-child(even) .txtBox .item .mulBox{order:-1;width: 100%;}
.his>div:nth-child(even) .txtBox .item .month{text-align:right !important;}
.his>div:nth-child(even) .txtBox .item ul{order:-1;}
.his>div:nth-child(even) .txtBox .item ul li{text-align:right;}

.his>div.in-view .imgBox{animation-name:moveLeft;animation-duration:1s;animation-fill-mode:forwards;}
.his>div.in-view .txtBox{animation-name:moveRight;animation-duration:1s;animation-fill-mode:forwards;animation-delay:0.3s;}
.his>div.in-view:nth-child(even) .imgBox{animation-name:moveRight;animation-duration:1s;animation-fill-mode:forwards;animation-delay:0.3s;}
.his>div.in-view:nth-child(even) .txtBox{animation-name:moveLeft;animation-duration:1s;animation-fill-mode:forwards;}

@media all and (max-width:1500px){
.his>div .imgBox{padding-right:40px;}
.his>div .txtBox .item{padding-left:40px;margin-bottom:60px;}
.his>div .txtBox .item ul li{font-size:20px;}

.his>div:nth-child(even) .imgBox{padding-left:40px;}
.his>div:nth-child(even) .txtBox .item{padding-right:40px;}
}
@media all and (max-width:1280px){
.his>div{margin-bottom:20px;}
    
.his>div .imgBox img{width:80%; border-radius: 15px;}

.his>div .txtBox .item ul li{font-size:19px;}
}
@media all and (max-width:1100px){
.his>div .txtBox .item ul li{font-size:18px;}
}
@media all and (max-width:960px){
.his{width: 92%; margin: 0 auto;}
.his>div{padding-left:40px;margin-bottom:40px;display: flex; flex-direction: column-reverse;}

.his>div .imgBox{width:100%;padding-right:0; margin-top: 0px; }
.his>div .imgBox img{margin-bottom:40px;margin-top:0 !important; position: relative; right:auto; margin-left: 0px;}
.his>div .txtBox{width:100%;}
.his>div .txtBox .item{padding-left:0;margin-bottom:40px;}
.his>div .txtBox .item .month{width:60px; color: #304fee; font-size: 20px; margin-top:1px;float:left;}
.his>div .txtBox .item ul{width:calc(100% - 60px);margin-top:2px;}
.his>div .txtBox .item ul li{padding-bottom:0;font-size:19px;}

    
.his>div:nth-child(even) .imgBox{padding-left:0;}
.his>div:nth-child(even) .imgBox img{margin-bottom:40px;margin-top:0 !important; position: relative; left:0;right:auto; margin-left: 0px; }
.his>div:nth-child(even) .txtBox{order:0;}
.his>div:nth-child(even) .txtBox .item{padding-right:0;}
.his>div:nth-child(even) .txtBox .item .year{text-align:left !important;}
.his>div:nth-child(even) .txtBox .item .month{text-align:left !important;}
.his>div:nth-child(even) .txtBox .item ul{order:0;}
.his>div:nth-child(even) .txtBox .item ul li{text-align:left;}

.his>div.in-view:nth-child(even) .imgBox{animation-name:moveLeft;animation-duration:1s;animation-fill-mode:forwards;}
.his>div.in-view:nth-child(even) .txtBox{animation-name:moveRight;animation-duration:1s;animation-fill-mode:forwards;animation-delay:0.3s;}
}
@media all and (max-width:640px){
.his{width: 95%; margin: 0 auto;}
.his>div{padding-left:30px;}

.his>div .imgBox img{width:99%; border-radius: 10px;}
    
.his>div .txtBox .item{margin-bottom:30px;}
.his>div .txtBox .item .month{width:50px;}
.his>div .txtBox .item ul{width:calc(100% - 50px);}
.his>div .txtBox .item ul li{font-size:18px;}
}
@media all and (max-width:560px){
.his>div .txtBox .item{margin-bottom:20px;}
.his>div .txtBox .item .month{width:100%;}
.his>div .txtBox .item ul{width:calc(100% - 0px);}
.his>div .txtBox .item ul li{font-size:18px;}
}
@media all and (max-width:460px){
.his>div .txtBox .item ul li{font-size:17px;}
}



.history-con-wrap{position:relative;}
.history-percent-bar{width:2px;height:100%;position:absolute;top:0;left:calc(50% - 1px);background:rgba(0,0,0,0.15);}
.history-percent-bar .percent-bar-child{width:100%;height:0;position:absolute;content:"";background-color:#304fee;z-index:1;}
.percent-bar-child .point{width:16px;height:16px;border-radius:50%;display:block;background-color:#304fee;position:absolute;bottom:-16px;left:calc(50% - 8px);content:"";z-index:5;}

@media all and (max-width:1280px){
.percent-bar-child .point{width:14px;height:14px;bottom:-14px;left:calc(50% - 7px);}
}
@media all and (max-width:1100px){
.percent-bar-child .point{width:12px;height:12px;bottom:-12px;left:calc(50% - 6px);}
}
@media all and (max-width:960px){
.history-percent-bar{width:1px;left:30px;}
.percent-bar-child .point{width:10px;height:10px;bottom:-10px;left:calc(50% - 5px);}
}
@media all and (max-width:640px){
.history-percent-bar{width:1px;left:10px;}
}


/*********************** 4. 인재채용 ***********************/

/****  4-1 인재상 ***/
.talentBox {position: relative;padding: 120px 0; overflow: hidden;}


.talentBox .Team.disF{position:relative;}
.talentBox .Team.disF div{width:450px;height:450px;margin:0 20px;border-radius:40px;border:solid 15px #fff;display:flex;align-items:center;justify-content:center;flex-direction:column; transition:all 0.5s ease;}
.talentBox .Team.disF div:first-child{border:solid 10px rgba(11,182,195,.4); transition:all 0.5s ease;}
.talentBox .Team.disF div:nth-child(2){border:solid 10px rgba(0,143,163,.4); transition:all 0.5s ease;}
.talentBox .Team.disF div:last-child{border:solid 10px rgba(0,88,144,.4); transition:all 0.5s ease;}
.talentBox .Team.disF div *{color:#000;}
.talentBox .Team.disF div figure{position: relative;}
.talentBox .Team.disF div figure img{transform: scale(1.0);transition:all 0.5s ease;}
.talentBox .Team.disF div h4{line-height:120% !important; transition:all 0.5s ease;}
.talentBox .Team.disF div:first-child .type24{color:rgba(11,182,195,1) !important;transition:all 0.5s ease;}
.talentBox .Team.disF div:nth-child(2) .type24{color:rgba(0,143,163,1) !important;transition:all 0.5s ease;}
.talentBox .Team.disF div:last-child .type24{color:rgba(0,143,163,1) !important;transition:all 0.5s ease;}
.talentBox .Team.disF div .type18{font-family:'Pretendard-ExtraLight';line-height:120% !important; letter-spacing: -0.03em; color: #777;}
.talentBox .Team.disF div .type18 br.hide{display: block;}

.talentBox .Team.disF div:hover figure img{transform: scale(1.1);}

.talentBox .Team.disF div:first-child:hover {border:solid 15px rgba(11,182,195,.6);}
.talentBox .Team.disF div:first-child:hover h4{color:rgba(11,182,195,1);}

.talentBox .Team.disF div:nth-child(2):hover {border:solid 15px rgba(0,143,163,.6);}
.talentBox .Team.disF div:nth-child(2):hover h4{color: rgba(0,143,163,1);}

.talentBox .Team.disF div:last-child:hover{border:solid 15px rgba(0,88,144,.6);}
.talentBox .Team.disF div:last-child:hover h4{color: rgba(0,88,144,1);}

.talentBox .Team.disF div:hover .type18{color: #000;}
.talentBox .Team.disF div:hover .type24{color:#000 !important;}


    @media screen and (max-width:1600px) {
        .talentBox .Team.disF div{width:430px;height:430px; margin:0 15px;}
    }
    @media screen and (max-width:1500px) {
        .talentBox .Team.disF div{width:420px;height:420px; margin:0 10px;}
        .talentBox .Team.disF div figure img{width: 125px;height: 125px;}
    }
    @media screen and (max-width:1360px) {
        .talentBox .Team.disF div{width:400px;height:400px;}
        .talentBox .Team.disF div figure img{width: 110px;height: 110px;}
        .talentBox .Team.disF div h4{margin-top: 20px !important;}
    }
    @media screen and (max-width:1280px) {
        .talentBox .Team.disF div{width:380px;height:380px;}
        .talentBox .Team.disF div figure {margin-top: -10px;}
        .talentBox .Team.disF div figure img{width: 100px;height: 100px;}

        .talentBox .i_logo{width: 700px; height: auto; bottom:-80px;}
    }
    @media screen and (max-width:1100px) {
        .talentBox .Team.disF div{width:350px;height:350px;}
        .talentBox .Team.disF div figure img{width: 95px;height: 95px;}
        .talentBox .Team.disF div h4{margin-top: 10px !important;}
    }
    @media screen and (max-width:980px) {
        .talentBox .Team.disF div{width:320px;height:320px;}
        .talentBox .Team.disF div:first-child{border:solid 12px rgba(97,182,216,.4);}
        .talentBox .Team.disF div:nth-child(2){border:solid 12px rgba(87,216,195,.4);}
        .talentBox .Team.disF div:last-child{border:solid 12px rgba(97,216,142,.4);}
        .talentBox .Team.disF div figure {margin-top: -20px;}
        .talentBox .Team.disF div figure img{width: 85px;height: 85px;}
        .talentBox .Team.disF div .type18{font-size: 15px !important;}

        .talentBox .i_logo{width: 600px; height: auto; bottom:-70px;}
    }
    @media screen and (max-width:870px) {
        .talentBox .Team.disF div{width:300px;height:300px;}
        .talentBox .Team.disF div figure img{width: 80px;height: 80px;}
    }
    @media screen and (max-width:830px) {
        .talentBox .Team.disF div{width:270px;height:270px;margin:0 -18px;}
        .talentBox .Team.disF div figure {margin-top: -10px;}
        .talentBox .Team.disF div figure img{width: 70px;height: 70px;}
        .talentBox .Team.disF div h4{font-size: 28px !important;}
        .talentBox .Team.disF div .type18{width: 76%; margin: 0 auto;font-size: 14px !important;}
        .talentBox .Team.disF div .type18 br.hide{display: none;}

        .talentBox .i_logo{width: 500px; height: auto; bottom:-56px;}
    }
    @media screen and (max-width:767px) {
        .talentBox .Team.disF div{width:300px;height:300px;margin:0 -15px;}
        .talentBox .Team.disF div:last-child{margin-top:-50px;}
        .talentBox .Team.disF div figure img{width: 65px;height: 65px;}
        .talentBox .Team.disF div h4{font-size:30px !important;}

        .talentBox .i_logo{width: 500px; height: auto; bottom:-55px;}
    }
    @media screen and (max-width:640px) {
        .talentBox .Team.disF div{width:260px;height:260px;}
        .talentBox .Team.disF div:last-child{margin-top:-65px;}
        .talentBox .Team.disF div h4{font-size:26px !important;}

        .talentBox .i_logo{width: 400px; height: auto; bottom:-45px;}
    }
    @media screen and (max-width:540px) {
        .talentBox .Team.disF div{width:230px;height:230px;margin:0 -13px;}
        .talentBox .Team.disF div:first-child{border:solid 10px rgba(97,182,216,.4);}
        .talentBox .Team.disF div:nth-child(2){border:solid 10px rgba(87,216,195,.4);}
        .talentBox .Team.disF div:last-child{border:solid 10px rgba(97,216,142,.4);margin-top:-55px;}
        .talentBox .Team.disF div figure {margin-top: -15px;}
        .talentBox .Team.disF div figure img{width: 56px;height: 56px;}
        .talentBox .Team.disF div .type18{width: 70%; font-size: 13px !important; line-height: 110% !important;}
        .talentBox .Team.disF div:nth-child(2) .type20{width: 60%;}

        .talentBox .i_logo{width: 300px; height: auto; bottom:-30px;}
    }
    @media screen and (max-width:460px) {
        .talentBox .Team.disF div{width:260px;height:260px;}
        .talentBox .Team.disF div:nth-child(2), .talentBox .Team.disF div:last-child{margin-top:-30px !important;}
        .talentBox .Team.disF div figure {margin-top: -5px;}
    }
    @media screen and (max-width:360px) {
        .talentBox .Team.disF div{width:240px;height:240px;}
    }




/****  4-2 채용절차 ***/
.talentBox.c2 {}
.talentBox.c2 h2.stroke3{font-size: 100px !important;line-height: 100%; transition:all 0.5s ease;}
.talentBox.c2 h2.stroke3 br.hide{display: none;}
.talentBox.c2 .type30 br.hide{display: none;}




.processBox{overflow:hidden;position:relative;}
.processBox .bgTxt{font-size:168px;line-height:70%;position:absolute;bottom:0;right:10%;color:#e8e8e8;font-weight:normal;white-space:nowrap;overflow:hidden;text-overflow:clip;}

.processBox .disF .item{width:335px;margin-right:60px; margin: 0 auto;}
.processBox .disF .item:last-child{margin-right:0 !important;}
.processBox .disF .item figure{width:100%;height:335px;border-radius:50%;border:solid 3px rgba(87,216,195,.3);background:#fff;box-shadow:0 0 20px rgba(0,0,0,0.1);padding: 3%;/*display:flex;align-items:center;justify-content:center;*/position:relative;}
.processBox .disF .item figure:after{width:16px;height:16px;background:rgba(87,216,195,1);border:solid 3px #fff;border-radius:50%;position:absolute;top:50%;right:-10px;transform:translateY(-50%);display:block;content:"";}
.processBox .disF .item figure:before{width:8px;height:8px;border:solid #16bdca;border-width:3px 3px 0 0;position:absolute;top:50%;right:-35px;display:block;content:"";transform:translateY(-50%) rotate(45deg);transition:all 0.5s ease;}
.processBox .disF .item:last-child figure:after,
.processBox .disF .item:last-child figure:before{display:none;}

.processBox .disF .item figure span{display: block;}
.processBox .disF .item figure font{text-align:center;line-height:100% !important;color:#000;transition:all 0.5s ease;}
.processBox .disF .item figure font.step{width: fit-content; text-transform:uppercase;color:#fff; background: #b5b5b5; padding: 6px 12px; border-radius: 30px; margin: 0 auto; margin-top: 30px !important; transition:all 0.5s ease;}
.processBox .disF .item figure font.tit.c2{letter-spacing: -0.06em;}

.processBox .disF .item figure.active font.tit{color:#16bdca;}
.processBox .disF .item figure.active font.step{color:#fff !important; background: #333 !important;}
.processBox .disF .item font.type18{color:#666 !important;}


.processBox .disF .item figure svg.circle-border{position:absolute;top: -3%;left: -3%;width: 107%;height:107%;pointer-events:none;opacity:0;}
.processBox .disF .item.active figure svg.circle-border{opacity:1;}
.processBox .disF .item.active figure svg.circle-border circle{ animation: drawBorder 1s linear forwards;stroke-width:1%;}
.processBox .disF .item figure img{width:100%;max-width:80px;display: block; margin: 0 auto; margin-top: 40px;}
.processBox .disF .item font{text-align:center;line-height:120% !important; margin-top: 15px !important;}

.processBox .disF div.active font.step{color:#fff !important; background: #333 !important;}
.processBox .disF div.active font{color:#16bdca;}

@keyframes drawBorder {
  from {
    stroke-dashoffset: 295;
  }
  to {
    stroke-dashoffset: 0;
  }
}

    @media screen and (max-width:1700px) {
    .processBox .disF .item{width:300px;}
    .processBox .disF .item figure{height:300px;}
    }
    @media screen and (max-width:1500px) {
    .processBox .disF .item{width:290px;margin-right:50px;}
    .processBox .disF .item figure{height:290px;}
    .processBox .disF .item figure:before{width:8px;height:8px;border:solid #16bdca;border-width:3px 3px 0 0;right:-40px;}
        
    .processBox .disF .item figure font.step{margin-top: 15px !important;}
    }
    @media screen and (max-width:1400px) {
    .processBox .disF .item{width:280px;margin-right:50px;}
    .processBox .disF .item figure{height:280px;}
    .processBox .disF .item figure:before{width:8px;height:8px;border:solid #16bdca;border-width:3px 3px 0 0;right:-40px;}
        
    .processBox .disF .item figure font.step{margin-top: 15px !important;}
    }
    @media screen and (max-width:1350px) {
    .processBox .disF .item{width:260px;margin-right:40px;}
    .processBox .disF .item figure{height:260px;}
    .processBox .disF .item figure:before{width:8px;height:8px;border:solid #16bdca;border-width:3px 3px 0 0;right:-40px;}
    .processBox .disF .item figure span .type30{font-size: 24px !improtant;}
        
    .processBox .disF .item figure img{max-width:70px;margin-top: 30px;}
    .processBox .disF .item figure font.step{margin-top: 15px !important;}
    }
    @media screen and (max-width:1280px) {
    .processBox{padding-bottom:120px;}
    .processBox .bgTxt{font-size:120px;}

    .processBox .disF .item{width:190px;margin-right:40px;}
    .processBox .disF .item figure{height:190px;}
    .processBox .disF .item figure:after{width:14px;height:14px;right:-8px;}
    .processBox .disF .item figure:before{width:40px;right:-40px;}
    }
    @media screen and (max-width:1180px) {
    .processBox .disF .item{width:170px;margin-right:30px;}
    .processBox .disF .item figure{height:170px;}
    .processBox .disF .item figure:after{border-width:2px;}
    .processBox .disF .item figure:before{width:30px;right:-30px;}
    }
    @media screen and (max-width:1100px) {
    .processBox .bgTxt{font-size:80px;}
    .processBox h3.fcol_dblue{text-align:center;}
    .processBox.bus3 h3.fcol_dblue{text-align:left;}

    .processBox .disF{justify-content:center;}
    .processBox .disF .item{width:228px;margin-right:60px;margin-bottom:30px;}
    .processBox .disF .item:nth-child(n+4){margin-bottom:0 !important;}
    .processBox .disF .item figure{height:228px;}
    .processBox .disF .item figure:before{width:60px;right:-60px;}
    }
    @media screen and (max-width:960px) {
    .processBox{padding-bottom:100px;}
    .processBox .bgTxt{font-size:60px;}

    .processBox .disF .item{width:210px;margin-right:50px;}
    .processBox .disF .item figure{height:210px;}
    .processBox .disF .item figure:before{width:50px;right:-50px;}
    }
    @media screen and (max-width:860px) {
    .processBox .disF .item{width:190px;margin-right:40px;}
    .processBox .disF .item figure{height:190px;}
    .processBox .disF .item figure:before{width:40px;right:-40px;}
    }
    @media screen and (max-width:767px) {
    .processBox{padding-bottom:80px;}
    .processBox .bgTxt{font-size:40px;}

    .processBox .disF .item{width:170px;margin-right:30px;}
    .processBox .disF .item figure{height:170px;}
    .processBox .disF .item figure:after{width:12px;height:12px;}
    .processBox .disF .item figure:before{width:30px;right:-30px;}
    }
    @media screen and (max-width:640px) {
    .processBox{padding-bottom:60px;}

    .processBox .disF .item{width:150px;margin-right:20px;margin-bottom:20px;}
    .processBox .disF .item figure{height:150px;}
    .processBox .disF .item figure:before{width:20px;right:-20px;}
    }
    @media screen and (max-width:560px) {
    .processBox{padding-bottom:40px;}

    .processBox .disF .item{width:120px;}
    .processBox .disF .item figure{height:120px;}
    .processBox .disF .item figure:after{width:10px;height:10px;}
    .processBox .disF .item font{font-size:20px !important;}
    }
    @media screen and (max-width:460px) {
    .processBox .disF .item{width:100px;}
    .processBox .disF .item figure{height:100px;margin-bottom:10px;}
    .processBox .disF .item font{font-size:18px !important;}
    }
    @media screen and (max-width:380px) {
    .processBox .disF .item{width:80px;}
    .processBox .disF .item figure{height:80px;margin-bottom:5px;}
    .processBox .disF .item font{font-size:16px !important;}
    }














.talentBox.c2 .porcess .item{width:calc(100%/4);}
.talentBox.c2 .porcess .item *{text-align:center;}
.talentBox.c2 .porcess .item .sbubble{width:calc(100% - 30px);height:250px;margin:0 auto;}
.talentBox.c2 .porcess .item .sbubble>div{width:100%;max-width:600px;height:100%;padding:30px;color:#131c54;position:relative;border:2px solid #16bdca;border-radius:20px;}/*
.talentBox.c2 .porcess .item .sbubble>div::after{width:0;height:0;content:"";position: absolute;bottom:-13px;left:50%;transform:translateX(-50%);border-left:12px solid transparent;border-right:12px solid transparent;border-top:14px solid white;}
.talentBox.c2 .porcess .item .sbubble>div::before{content:"";position: absolute;bottom:-16px;left:50%;transform:translateX(-50%);border-left:14px solid transparent;border-right:14px solid transparent;border-top:16px solid #16bdca;}*/
.talentBox.c2 .porcess .item .sbubble>div::after{width:14px;height:14px;background:#fff;border:solid #16bdca;border-width:0 2px 2px 0;position:absolute;bottom:-9px;left:50%;display:block;content:"";transform:translateX(-50%) rotate(45deg);}

.talentBox.c2 .porcess .item .sbubble *{color:#131c54;font-family:'Pretendard-Medium';}
.talentBox.c2 .porcess .item .sbubble ul li{list-style:decimal;padding-bottom:10px;font-size:22px;line-height:120%;margin-left:20px;text-align:left;}
.talentBox.c2 .porcess .item .sbubble font{width:100%;height:100%;display:flex;align-items:center;justify-content:center;}

.talentBox.c2 .porcess .item .dot{margin:60px 0 50px 0;position:relative;}
.talentBox.c2 .porcess .item .dot:after{width:50%;height:4px;background:#16bdca;position:absolute;top:8px;left:0;display:block;content:"";z-index:-1;}
.talentBox.c2 .porcess .item .dot:before{width:50%;height:4px;background:#16bdca;position:absolute;top:8px;right:0;display:block;content:"";z-index:-1;}
.talentBox.c2 .porcess .item:first-child .dot:after,
.talentBox.c2 .porcess .item:last-child .dot:before{display:none;}
.talentBox.c2 .porcess .item .dot i{width:20px;height:20px;margin:0 auto;border-radius:50%;background:#fff;border:solid 4px #16bdca;display:block;}
.talentBox.c2 .porcess .item .dot font{color:#959595;text-transform:uppercase;font-family:'Pretendard-SemiBold';}
.talentBox.c2 .porcess .item.active .dot i{background:#16bdca;}

.talentBox.c2 .porcess .item .txtBox .tit{font-family:'Pretendard-Bold';letter-spacing:-0.05em;}
.talentBox.c2 .porcess .item .txtBox .tbgBox{width:calc(100% - 30px);height:215px;padding:30px;margin:0 auto;background:#eff2fb;border-radius:20px;display:flex;align-items:center;justify-content:center;flex-direction:column;}
.talentBox.c2 .porcess .item .txtBox .tbgBox font{font-family:'Pretendard-SemiBold';}
.talentBox.c2 .porcess .item .txtBox .tbgBox .first{padding-bottom:20px;margin-bottom:15px;color:#93a5d9;position:relative;}
.talentBox.c2 .porcess .item .txtBox .tbgBox .first:after{width:10px;height:10px;border:solid #214ccd;border-width:0 3px 3px 0;position:absolute;bottom:0;left:50%;display:block;content:"";transform:translateX(-50%) rotate(45deg);}
.talentBox.c2 .porcess .item .txtBox .tbgBox .last{color:#214ccd;}

@media screen and (max-width:1500px){
.talentBox.c2 .porcess .item .sbubble{width:calc(100% - 20px);}
.talentBox.c2 .porcess .item .sbubble ul li{font-size:20px;margin-left:15px;}

.talentBox.c2 .porcess .item .dot{margin:50px 0 40px 0;}

.talentBox.c2 .porcess .item .txtBox .tit{font-family:'Pretendard-Bold';letter-spacing:-0.05em;}
.talentBox.c2 .porcess .item .txtBox .tbgBox{width:calc(100% - 20px);height:200px;}
}
@media screen and (max-width:1360px){
.talentBox.c2 .porcess .item .sbubble{width:calc(100% - 10px);height:240px;}

.talentBox.c2 .porcess .item .txtBox .tbgBox{width:calc(100% - 10px);}
}
@media screen and (max-width:1300px){
.talentBox.c2 .disF{justify-content:center;}
.talentBox.c2 .porcess .item{width:calc(100%/3);margin-bottom:20px;}
.talentBox.c2 .porcess .item:nth-child(n+4){margin-bottom:0 !important;}

.talentBox.c2 .porcess .item .sbubble{height:200px;}
.talentBox.c2 .porcess .item:nth-child(n+4) .sbubble{display:none;}
.talentBox.c2 .porcess .item .sbubble ul li{padding-bottom:8px;font-size:18px;}

.talentBox.c2 .porcess .item .dot{margin:40px 0 30px 0;}

.talentBox.c2 .porcess .item .txtBox .tbgBox{height:180px;}
}
@media screen and (max-width:960px){
.talentBox.c2 .porcess .item{margin-bottom:10px;}

.talentBox.c2 .porcess .item .sbubble{height:180px;}
.talentBox.c2 .porcess .item .sbubble>div{padding:20px;}
.talentBox.c2 .porcess .item .sbubble ul li{padding-bottom:6px;font-size:17px;}

.talentBox.c2 .porcess .item .dot{margin:30px 0 20px 0;}

.talentBox.c2 .porcess .item .txtBox .tbgBox{height:140px;}
.talentBox.c2 .porcess .item .txtBox .tbgBox .first{padding-bottom:15px;margin-bottom:10px;}
.talentBox.c2 .porcess .item .txtBox .tbgBox .first:after{width:8px;height:8px;}
}
@media screen and (max-width:767px){
.talentBox.c2 .porcess .item .sbubble{height:160px;}
.talentBox.c2 .porcess .item .sbubble>div{border-radius:10px;}
.talentBox.c2 .porcess .item .sbubble>div::after{width:12px;height:12px;bottom:-8px;}
.talentBox.c2 .porcess .item .sbubble ul li{padding-bottom:4px;font-size:16px;margin-left:15px;}

.talentBox.c2 .porcess .item .dot:after{height:3px;top:8px;}
.talentBox.c2 .porcess .item .dot:before{height:3px;top:8px;}
.talentBox.c2 .porcess .item .dot i{width:18px;height:18px;border-width:3px;}

.talentBox.c2 .porcess .item .txtBox .tbgBox{height:120px;border-radius:10px;}
.talentBox.c2 .porcess .item .txtBox .tbgBox .first{padding-bottom:10px;margin-bottom:5px;}
.talentBox.c2 .porcess .item .txtBox .tbgBox .first:after{width:6px;height:6px;border-width:0 2px 2px 0;}
}
@media screen and (max-width:640px){
.talentBox.c2 .porcess .item{width:calc(100%/2);}
.talentBox.c2 .porcess .item:nth-child(n+3) .sbubble{display:none;}
}
@media screen and (max-width:460px){
.talentBox.c2 .porcess .item{width:100%;display:flex;flex-wrap:wrap;margin-bottom:0;padding-bottom:20px;position:relative;}
.talentBox.c2 .porcess .item:after{width:3px;height:100%;background:#16bdca;position:absolute;top:50%;left:10px;transform:translateY(-50%);display:block;content:"";z-index:-1;}

.talentBox.c2 .porcess .item .sbubble{width:calc(100% - 40px);margin:20px 0 0 40px;}
.talentBox.c2 .porcess .item .sbubble>div::after{width:10px;height:10px;border-width:2px 0 0 2px;bottom:auto;top:-7px;left:50%;transform:translate(-50%,0) rotate(45deg);}

.talentBox.c2 .porcess .item .dot{width:20px;order:-1;}
.talentBox.c2 .porcess .item .dot:after,
.talentBox.c2 .porcess .item .dot:before{display:none;}
.talentBox.c2 .porcess .item .dot i{width:20px;height:20px;margin:0 auto;border-radius:50%;background:#fff;border:solid 4px #16bdca;display:block;}
.talentBox.c2 .porcess .item .dot font{display:none;}

.talentBox.c2 .porcess .item .txtBox{width:calc(100% - 20px);padding-left:20px;order:-1;}
.talentBox.c2 .porcess .item .txtBox .tit{font-family:'Pretendard-Bold';letter-spacing:-0.05em;}
.talentBox.c2 .porcess .item .txtBox .tbgBox{width:100%;height:auto;}
}







/****  4-3 복리후생 ***/
.talentBox.c3 h2.stroke3{font-size: 110px !important;transition:all 0.5s ease;}
.talentBox.c3 h2.stroke3 br.hide{display: none;}
.talentBox.c3 .type30 br.hide{display: none;}

.talentBox.c3 .benefits .item{width:calc(100%/4 - 30px);margin:12px;transition:all 0.5s ease; }
.talentBox.c3 .benefits .item .txtBox{width:100%;height: 340px; padding:13% 12%; border:solid 2px #eee; aspect-ratio:16 /6;border-radius: 20px; position: relative;transition:all 0.5s ease;}
.talentBox.c3 .benefits .item:hover .txtBox{border:solid 2px rgba(22,189,202,.85);}
.talentBox.c3 .benefits .item .txtBox .type18{width: fit-content; background: #ddd; color: #fff; padding: 6px 17px;border-radius: 20px;transition:all 0.5s ease;}


.benefits .item .txtBox .ico{width: 90px; height: 90px; bottom:30px; right:30px; position: absolute;transition:all 0.5s ease;}
.benefits .item .txtBox .ico.i1{background: url(/sub4/img/c3ico-01.png) no-repeat center center; }
.benefits .item .txtBox .ico.i2{background: url(/sub4/img/c3ico-02.png) no-repeat center center; }
.benefits .item .txtBox .ico.i3{background: url(/sub4/img/c3ico-03.png) no-repeat center center; }
.benefits .item .txtBox .ico.i4{background: url(/sub4/img/c3ico-04.png) no-repeat center center; }
.benefits .item .txtBox .ico.i5{background: url(/sub4/img/c3ico-05.png) no-repeat center center; }
.benefits .item .txtBox .ico.i6{background: url(/sub4/img/c3ico-06.png) no-repeat center center; }
.benefits .item .txtBox .ico.i7{background: url(/sub4/img/c3ico-07.png) no-repeat center center; }
.benefits .item .txtBox .ico.i8{background: url(/sub4/img/c3ico-08.png) no-repeat center center; }
.benefits .item .txtBox .ico.i9{background: url(/sub4/img/c3ico-09.png) no-repeat center center; }
.benefits .item .txtBox .ico.i10{background: url(/sub4/img/c3ico-10.png) no-repeat center center; }
.benefits .item .txtBox .ico.i11{background: url(/sub4/img/c3ico-11.png) no-repeat center center; }


    @media screen and (max-width:1400px) {
        .talentBox.c3 .benefits .item{width:calc(100%/3 - 30px);margin:12px;}
        .talentBox.c3 .benefits .item .txtBox{height: 320px; padding:11% 10%;}
    }
    @media screen and (max-width:1280px) {
        .talentBox.c3 h2.stroke3{font-size: 95px !important; }
    }
    @media screen and (max-width:1100px) {
        .talentBox.c3 h2.stroke3{font-size: 85px !important; }
        
        .talentBox.c3 .benefits .item{width:calc(100%/3 - 30px);margin:11px;}
        .talentBox.c3 .benefits .item .txtBox{height: 300px;}
        
        .benefits .item .txtBox .ico{width: 84px; height: 84px; background-size: cover !important;}
    }
    @media screen and (max-width:960px) {
        .talentBox.c3 .benefits .item{width:calc(100%/3 - 20px);margin:8px;}
        .talentBox.c3 .benefits .item .txtBox{height: 260px;}
        
        .benefits .item .txtBox .ico{width: 80px; height: 80px; background-size: cover !important;}
    }
    @media screen and (max-width:767px) {
        .talentBox.c3 h2.stroke3{font-size: 100px !important; line-height: 100%; }
        .talentBox.c3 h2.stroke3 br.hide{display: block;}
        .talentBox.c3 .type30 br.hide{display: block;}
        
        .talentBox.c3 .benefits .item{width:calc(100%/2 - 20px);margin:10px;}
        .talentBox.c3 .benefits .item .txtBox{height: 250px;padding:10% 9%;}
        .talentBox.c3 .benefits .item .txtBox .type18{padding: 5px 15px;}
        .talentBox.c3 .benefits .item .txtBox .type24{font-size: 20px !important;transition:all 0.5s ease;}
        
        .benefits .item .txtBox .ico{width: 76px; height: 76px; background-size: cover !important;}
    }
    @media screen and (max-width:640px) {
        .talentBox.c3 h2.stroke3{font-size: 80px !important; }
        
        .talentBox.c3 .benefits .item{width:calc(100%/2 - 15px);margin:7px;}
        .talentBox.c3 .benefits .item .txtBox{height: 230px;}
        .talentBox.c3 .benefits .item .txtBox .type24{font-size: 18px !important;}
        
        .benefits .item .txtBox .ico{width: 70px; height: 70px; background-size: cover !important;}
    }
    @media screen and (max-width:460px) {
        .talentBox.c3 h2.stroke3{font-size: 70px !important;line-height: 90%; }
        
        .talentBox.c3 .benefits .item{width:calc(92%/1 - 0px);margin:6px auto;}
        .talentBox.c3 .benefits .item .txtBox{height: 180px;padding:8% 10%;}
        .talentBox.c3 .benefits .item .txtBox .type18{padding: 4px 12px;}
        
        .benefits .item .txtBox .ico{width: 60px; height: 60px;bottom:20px; right:20px; background-size: cover !important;}
    }
    @media screen and (max-width:360px) {
        .talentBox.c3 h2.stroke3{font-size: 60px !important;}
    }






/*********************** 회사소개 ***********************/

/**** 인사말 ***/
.grBox2 {position: relative;padding: 50px 0 0 0; overflow: hidden;}
.grBox1 {position: relative;padding: 100px 0 0 0; overflow: hidden;}
.grBox {position: relative;padding: 100px 0; overflow: hidden;}
.grBox .txtBox{width:50%; position: relative;z-index: 9;transition:all 0.5s ease;}
.grBox .txtBox h4{letter-spacing: -0.03em; line-height: 130%;}
.grBox .txtBox h4 br.hide{display: block;}
.grBox .txtBox .type22 br.hide{display: block;}

.grBox .txtBox1{width: 40%; padding:35px 55px; background: #393a52; position: relative;z-index: 9;transition:all 0.5s ease;}

    @media screen and (max-width:1500px){
    .grBox {padding: 100px 0;}
    .grBox:after{height: 750px;}
    }
    @media screen and (max-width:1280px){
    .grBox {padding: 80px 0;}
    .grBox:after{height: 650px;}
    .grBox .txtBox:after{width:80px; height: 71px;}
    }
    @media screen and (max-width:1200px){
    .grBox1 {padding: 80px 0 0 0; }
	.grBox1 {padding: 40px 0 0 0; }
    }
    @media screen and (max-width:1100px){
	 .m_fx{flex-direction: column;}
	 .grBox .txtBox1 {width: 100%;}
	 .grBox .txtBox1  br.hide{display: none;}
	 .txtBox  br.hide{display: none;}
	 .grBox .txtBox1 .mt50{margin-top:4px!important;}
	 .grBox .txtBox1 .mt60{margin-top:20px!important;}
    .grBox {padding: 70px 0;}
    .grBox:after{width: 55%; height: 600px;top:12%;left:-25px;}
        
    .grBox .txtBox:after{width:70px; height: 62px;right:1%;}
    }
    @media screen and (max-width:960px){
    .grBox {width: 96%; margin: 0 auto; padding: 40px 0;}
    .grBox:after{width: 60%; height: 500px;top:15%;left:-25px;}
    .grBox .txtBox:after{width:60px; height: 53px;}
        
    .grBox .txtBox h4 br.hide{display: none;}
    }
    @media screen and (max-width:860px){
		.grBox1 {padding: 60px 0 0 0; }
	.grBox2 {padding: 30px 0 0 0; }
    .grBox{justify-content: flex-start !important;}
    .grBox:after{width: 60%; height: 400px;top:18%;left:auto; right: -12%; transform:rotate(-28deg);}
        
    .grBox .txtBox{width: 68%; height: 480px;}
    .grBox .txtBox:after{display: none;}
    .grBox .txtBox .type22{font-size: 18px !important;}
    .grBox .txtBox h4 br.hide{display: block;}
    }
    @media screen and (max-width:640px){
		.grBox1 {padding: 50px 0 0 0; }
	.grBox2 {padding: 20px 0 0 0; }
    .grBox:after{top:30%;}
        
    .grBox .txtBox{width: 90%; height: auto;}
    .grBox .txtBox font{width: 60%;}
    .grBox .txtBox .type22{font-size: 17px !important;}
    }
    @media screen and (max-width:540px){
    .grBox:after{width: 100%; height: 600px;top:20%; ;left:auto; right: -13%; transform:rotate(-15deg); opacity: .2;}
        
    .grBox .txtBox{width: 96%; margin: 0 auto; margin-bottom: 150px;}
    .grBox .txtBox font{width: 100%;}
    .grBox .txtBox .type22{font-size: 16px !important;}
    }
    @media screen and (max-width:460px){    
    .grBox:after{top:25%;}
        
    .grBox .txtBox{margin-bottom: 110px;}
    .grBox .txtBox h4 br.hide{display: none;}
    .grBox .txtBox .type22{font-size: 17px !important;}
    }
    @media screen and (max-width:360px){            
    .grBox .txtBox{margin-bottom: 80px;}
    }


/****  5-2 회사소개 ***/
.companyBox {position: relative; padding-top: 60px !important; overflow: hidden;transition:all 0.5s ease;}
.companyBox .imgBox{}
.companyBox .imgBox img{width: 100%; border-radius: 30px;transition:all 0.5s ease;}
.companyBox font br.hide{display: block;}

    @media screen and (max-width:1280px){            
        .companyBox {width: 96% !important; margin: 0 auto;padding-top: 40px !important;}
        .companyBox .w40 {width: 45% !important;transition:all 0.5s ease;}
        .companyBox .imgBox img{border-radius: 25px;}
    }
    @media screen and (max-width:1180px){       
        .companyBox font br.hide{display: none;}
    }
    @media screen and (max-width:960px){    
        .companyBox .w40 {width: 50% !important;} 
        .companyBox .w50 {width: 45% !important;transition:all 0.5s ease;} 
    }
    @media screen and (max-width:860px){  
        .companyBox {padding-top: 30px !important;}  
        .companyBox .w40 {width: 100% !important;}  
        .companyBox .w50 {width: 94% !important; margin: 0 auto; margin-top: 30px;}  
    }
    @media screen and (max-width:560px){  
        .companyBox {padding-top: 25px !important;} 
        .companyBox .imgBox img{border-radius: 20px;}
    }
    @media screen and (max-width:360px){  
        .companyBox .imgBox img{border-radius: 15px;}
    }



/* 회사모토 */
.MottoBox{padding: 30px 0 80px 0; position: relative;transition:all 0.5s ease;}
.MottoBox .imgBox {width: 100%; border-radius: 30px;transition:all 0.5s ease;}
.MottoBox f1 {font-size: 160px;font-weight: 700; position: absolute; right:-11%; bottom:-28%; letter-spacing: -0.03em;transition:all 0.5s ease;}
.MottoBox h3 br.hide {display: none;}
.MottoBox font br.hide {display: none;}
.MottoBox font br.hide2 {display: block;}

    @media screen and (max-width:1400px){ 
        .MottoBox{padding: 30px 0 60px 0;} 
        .MottoBox f1 {font-size: 130px; right:-1%; bottom:-30%;}
        
        .MottoBox font br.hide {display: block;}
    }
    @media screen and (max-width:1280px){ 
        .MottoBox{padding: 30px 0 40px 0;} 
        .MottoBox f1 {font-size: 110px; right:-1%; bottom:-33%;}
        
        .MottoBox font br.hide {display: block;}
    }
    @media screen and (max-width:1100px){  
        .MottoBox .w25 {width: 100% !important;}
        .MottoBox .w25 .sub_ttl{text-align: center;}
        .MottoBox .w65 {width: 90% !important; margin: 0 auto;}
        
        .MottoBox f1 {font-size: 100px;bottom:-28%;}
    }
    @media screen and (max-width:860px){   
        .MottoBox{padding: 30px 0 20px 0;}        
        .MottoBox f1 {font-size: 80px; bottom:-30%;}
    }
    @media screen and (max-width:767px){   
        .MottoBox{padding: 30px 0 20px 0;}   
        .MottoBox .imgBox {border-radius: 25px;transition:all 0.5s ease;}     
        .MottoBox f1 {font-size: 70px; bottom:-30%;}
    }
    @media screen and (max-width:640px){   
        .MottoBox{padding: 0;}        
        .MottoBox f1 {font-size: 55px; right:0; bottom:-33%;}
    }
    @media screen and (max-width:500px){  
        .MottoBox .imgBox {border-radius: 20px;}    
        
        .MottoBox h3 br.hide {display: block;} 
        
        .MottoBox font br.hide2 {display: none;}
        .MottoBox f1 {font-size: 45px; right:0; bottom:-32%;}
    }
    @media screen and (max-width:460px){  
        .MottoBox .w65 {width: 93% !important;}
        .MottoBox .imgBox {border-radius: 15px;}    
    }
    @media screen and (max-width:400px){  
        .MottoBox font br.hide {display: none;}
        .MottoBox f1 {display: none;}
    }




/****  오시는 길 ***/
.Location{}

.Location .overBox{}
.Location .overBox .over span{width: calc(100% / 3 - 50px); border:2px solid rgba(22, 34, 64, 0.2); border-radius: 20px; padding: 3%; transition:all 0.5s ease;}

.Location .overBox .over span figure{margin-bottom: 30px;}
.Location .overBox .over span figure i{width:59px;height:62px;  overflow:hidden;display:block; }
.main .sec-m3 .partBox .conBox div span i img{width:100%; display:block;transition:all 0.3s ease;}
.Location .overBox .over span .type20{ height: 42px;  font-weight: 700;transition:all 0.5s ease;}
.Location .overBox .over span .addr{color: #000; line-height: 130%; height: 60px; letter-spacing: -0.01em; transition:all 0.5s ease;}
.Location .overBox .over span h2{height: 80px; color: #000; font-weight: 700 !important; line-height: 120% !important; transition:all 0.5s ease;}



.Location .overBox .over span:hover figure{transition:all 0.3s ease;}
.Location .overBox .over span:hover figure i img{margin-top:-140%;transition:all 0.3s ease;}
.Location .overBox .over span:hover .type20{color: #000;}

.Location .mapBox{padding-bottom: 90px; overflow: hidden;}

.Location .mapBox .root_daum_roughmap .wrap_map {height: 94.7%;}


    @media screen and (max-width:1280px){  
        .Location {width: 96%; margin: 0 auto;}
        .Location .overBox .over span{width: calc(100% / 3 - 20px);}
    }
    @media screen and (max-width:1100px){  
        .Location .overBox .over span{width: calc(100% / 3 - 15px);}
    }
    @media screen and (max-width:960px){  
        .Location .overBox .over span{width: calc(100% / 2 - 20px);padding: 2.5% 5% 3.5% 5%; }
        .Location .overBox .over span:nth-child(1){width: 100% !important; margin-bottom: 20px;}
        .Location  .mapBox  .w50{width:100%!important;}
		.Location .mapBox .root_daum_roughmap .wrap_map {height: 400px;}
        .Location .overBox .over span figure{margin-bottom: 15px;}
        .Location .overBox .over span figure i{width:30px;height:30px; }
        .Location .overBox .over span .type20{height: auto; margin-bottom:5px;}
        .Location .overBox .over span .addr{height: auto; }
    }
    @media screen and (max-width:767px){  
        .Location .overBox .over span{width: calc(100% / 2 - 20px);padding: 2.5% 6%; }
        .Location .overBox .over span:nth-child(1){width: 100% !important; margin-bottom: 20px;}
        
        .Location .overBox .over span figure{margin-bottom: 15px;}
        .Location .overBox .over span figure i{width:30px;height:30px; }
        .Location .overBox .over span .type20{height: auto;}
        .Location .overBox .over span .addr{height: auto;}
    }









.catalog_txt{border: solid 1px #838383; border-radius:20px; overflow: hidden;}
.grBox1  .bnjf{
gap: 30px;
justify-content: flex-start;
}
.catalog_1 a{position: relative; margin-bottom:15px;}


.button7.catalog_down {
    background: #fff;
    color: #000;
    font-size: 16px;
    padding: 0 !important;
    padding-left: 25px !important;
    width: 180px;
    border: solid 1px #666 !important;
    text-align: left !important;
    transition: all 0.3s;
    border-radius: 10px;
}

a.button7 {
    color: #fff;
    background: #000;
    border-radius: 30px;
    line-height: 60px;
    text-align: center;
    font-size: 20px;
    display: block;
    cursor: pointer;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
}
.button7.catalog_down:before {
    width: 25px;
    height: 1px;
    background: #000;
    position: absolute;
    top: 50%;
    right: 32px;
    display: block;
    content: "";
    transition: all 0.2s ease;
}

.button7.catalog_down:after {
    width: 10px;
    height: 1px;
    background: #000;
    position: absolute;
    top: calc(50% - 4px);
    right: 32px;
    display: block;
    content: "";
    transform: rotate(45deg);
    transition: all 0.2s ease;
}






    @media screen and (max-width:860px){ 
.bnjf span{width: 46%;}
}