@charset "utf-8";
/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) { .MAIN_step_AA{width: 100%; float: left; padding: 0PX; position: relative; min-height:450px; margin-top: 50px; }
.MAIN_step_AA::before { width: 100%; float: left; height: 5px; background-color: #f7f7f7; position: absolute; top:25px; left: 0px; content: ""; }
.MAIN_step_AA .contents-container { position: relative; margin-top: -8px; }
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) { .MAIN_step_AA{width: 100%; float: left; padding: 0PX; position: relative; min-height:450px; }
}
/**** 모바일 ****/
@media only all and (max-width:767px) { .MAIN_step_AA{width: 100%; float: left; padding: 0PX; position: relative; height:1000px; margin-top: 0px; padding-top: 200px; padding-bottom: 100px; overflow: hidden}
.MAIN_step_AA::before { display: none; }
.MAIN_step_AA .contents-container { position: relative; height: 100%; margin-top: -8px; }
}
/**** 모바일2 ****/
@media only all and (max-width:400px) { ; }
/* 구분 //end -----------------------------------*/



.MAIN_step_AA .contents-container video { width: 100%; float: left; }
/* 구분 -----------------------------------*/
.MAIN_step_AA .contents-container .tit_box{width: 25%; float: left; position: absolute; left: 0px; top: 0px; }
/**** 모바일 ****/
@media only all and (max-width:767px) { .MAIN_step_AA .contents-container .tit_box{ top: -200px; }
}



 
.MAIN_step_AA  .tit_box.apply-box { width: 100%; float: left; padding-top: clamp(0px, 11.719vw, 130px); padding-left: 30px; }
.MAIN_step_AA   .tit_box div .tit { width: 100%; float: left; font-size: calc(var(--tit-lg-size) * 0.9); font-family:var(--ff-ko6)!important; font-weight: normal; color: #0b1e1e; margin-bottom: clamp(10px, 1.563vw, 150px); }
.MAIN_step_AA div  .tx1 { width: 100%; float: left; font-size: var(--tx-sm-size); color: #666; margin: 0px 0 clamp(10px, 3.125vw, 40px); line-height: 130%; }
.MAIN_step_AA  div .contact { width: 100%; float: left; font-size:calc(var(--tx-sm-size) * 1.2); font-weight: bold; display: flex; align-items: center; margin-bottom:20px; color: #222; line-height: 130%; }
.MAIN_step_AA  div  .contact img { display: inline-block; width: 30px; height: 30px; background: #3d4855; border-radius: 50%; color: white; font-style: normal; font-size: 14px; line-height: 20px; text-align: center; margin-left: 5px; }
.MAIN_step_AA   div .phone { width: auto; float: left; font-size: calc(var(--tit-lg-size) * 0.9); font-weight: bold; color:var(--primary); margin-top: 0; letter-spacing: -0.5px; }
/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {  }
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {  }
/**** 모바일 ****/
@media only all and (max-width:767px) { .MAIN_step_AA  .tit_box>div {     width: 100%; float: left; position: relative; padding-left: 130px; }
.MAIN_step_AA   .tit_box>div .tit { position: absolute; left: 0px; top: 10px; }
.MAIN_step_AA   .tit_box>div .contact { position: absolute; left: 0px; top: -5px; }
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {  }
/* 구분 //end -----------------------------------*/



/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {  }
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {  }
/**** 모바일 ****/
@media only all and (max-width:767px) {  }
/**** 모바일2 ****/
@media only all and (max-width:400px) {  }
/* 구분 //end -----------------------------------*/






/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) { .MAIN_step_AA .process-container {
   display: grid; grid-template-columns:20px  clamp(100px, 35.156vw, 450px)  80px  auto  80px  auto  80px  auto  80px; gap: 0px; width: 100%; float: left; margin: 0 auto; padding-right:80px; }
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) { .MAIN_step_AA.process-container {
   display: grid; grid-template-columns:20px  clamp(200px, 35.156vw, 250px)  50px  auto  50px  auto  50px  auto  50px; gap: 0px; width: 100%; float: left; margin: 0 auto; padding-right:80px; }
}
/**** 모바일 ****/
@media only all and (max-width:767px) { .MAIN_step_AA .process-container {
   display: grid; grid-template-rows:0px  80px  0px  auto  0px  auto  0px  auto  0px; gap: 0px; width: 100%; float: left; height: 100%; margin: 0 auto; }
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {  }
/* 구분 //end -----------------------------------*/


/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) { .MAIN_step_AA .step {
      text-align: center; color: #aaa; transition: all 0.5s ease; filter: grayscale(100%); position: relative; z-index: 9999; }
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) { .MAIN_step_AA  .step {
      text-align: center; color: #aaa; transition: all 0.5s ease; filter: grayscale(100%); position: relative; z-index: 9999; -webkit-transform: scale(0.8); transform: scale(0.7); }
}
/**** 모바일 ****/
@media only all and (max-width:767px) { .MAIN_step_AA  .step { height: 200px!important; width: 100%; float: left; text-align: center; color: #aaa; transition: all 0.5s ease; filter: grayscale(100%); position: relative; z-index: 9999; margin-top: -130px; }
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {  }
/* 구분 //end -----------------------------------*/

/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) { .MAIN_step_AA .step .step_in{width:300px; float: left; position: absolute; left: 50%; transform: translateX(-50%); z-index: 9999; }
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {  }
/**** 모바일 ****/
@media only all and (max-width:767px) { .MAIN_step_AA .step .step_in{width:250px; height: 300px; float: left; z-index: 9999; margin-left: 20%; }
}
/**** 모바일2 ****/
@media only all and (max-width:400px) { }
/* 구분 //end -----------------------------------*/


/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) { .MAIN_step_AA .step  .step_in .um{     width: 80px; height: 80px; border-radius: 100%; background-color: var(--primary); display: flex; justify-content: center; align-items: center; flex-direction: column; color: #fff; font-size: 14px; font-weight: 700; position:absolute; left:50%; transform: translateX(-50%); top: 0PX; }
.MAIN_step_AA  .step  .step_in .um:before { content: ""; width:10px; height: 10px; border-radius: 100%; background-color: var(--primary); opacity: 0.2; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; position: absolute; transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -o-transition: all 0.5s; }
.MAIN_step_AA .step.active  .step_in .um:before { content: ""; width:110px; height: 110px; border-radius: 100%; background-color: var(--primary); opacity: 0.2; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; position: absolute; }
.MAIN_step_AA .step  .step_in .um em { olor: #fff; font-size:24px; font-weight: 700; width: 100%; float: left; text-align: center; }
.MAIN_step_AA   .step  .step_in .imgbox { width: 100%; height: 250px; float: left; transition: all 0.5s ease; display: flex; justify-content: center; align-items: center; margin-top:80px; }
.MAIN_step_AA .step  .step_in .imgbox img { width: 100%; }
.MAIN_step_AA .step  .step_in .txbox { margin-top: 10px; font-size: var(--tx-sm-size); font-weight: 700; }
.MAIN_step_AA .step  .step_in .txbox em { color: var(--primary); }
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) { }
/**** 모바일 ****/
@media only all and (max-width:767px) { .MAIN_step_AA .step  .step_in .um{     width: 80px; height: 80px; border-radius: 100%; background-color: var(--primary); display: flex; justify-content: center; align-items: center; flex-direction: column; color: #fff; font-size: 14px; font-weight: 700; position:absolute; left:10px; top: 80PX; -webkit-transform: scale(0.8); transform: scale(0.8); }
.MAIN_step_AA  .step  .step_in .um:before { content: ""; width:10px; height: 10px; border-radius: 100%; background-color: var(--primary); opacity: 0.2; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; position: absolute; transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -o-transition: all 0.5s; }
.MAIN_step_AA .step.active  .step_in .um:before { content: ""; width:110px; height: 110px; border-radius: 100%; background-color: var(--primary); opacity: 0.2; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; position: absolute; }
.MAIN_step_AA .step  .step_in .um em { olor: #fff; font-size:24px; font-weight: 700; width: 100%; float: left; text-align: center; }
.MAIN_step_AA   .step  .step_in .imgbox { width: 100%; height: 190px; float: left; transition: all 0.5s ease; display: flex; justify-content: center; align-items: center; }
.MAIN_step_AA .step  .step_in .imgbox img { width: 100%; }
.MAIN_step_AA .step  .step_in .txbox { margin-top: 10px; font-size: var(--tx-sm-size); font-weight: 700; }
.MAIN_step_AA .step  .step_in .txbox em { color: var(--primary); }
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {  }
/* 구분 //end -----------------------------------*/


.step.active { color: #000; filter: grayscale(0%); }
/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) { .MAIN_step_AA  .bar {
      width: 0; height: 4px; background: #ff6859; transition: width 1s ease; margin-top:35px; position: relative; margin-left: 10px; }
.MAIN_step_AA  .bar:before { content: "\ebb5"; font-family: unicons-line; position: absolute; top: 200px; left: 50%; margin-left: -25px; width: 50px; font-size: 50px; color: #ccc; opacity: 0; }
.MAIN_step_AA  .bar.full:before { content: "\ebb5"; font-family: unicons-line; position: absolute; top: 200px; left: 50%; margin-left: -25px; width: 50px; font-size: 50px; color: #ccc; opacity: 1; }
.MAIN_step_AA  .bar.bar0:before { display: none; }
.MAIN_step_AA  .bar.bar0.full:before { display: none; }
.MAIN_step_AA .bar.full { width: 100%; }
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) { ; }
/**** 모바일 ****/
@media only all and (max-width:767px) { .MAIN_step_AA  .bar {
      width: calc(100% - 50px); height: 0; border-left: 4px solid var(--primary); transition:height 1s ease; margin-top:0px; position: relative; margin-left: 50px; }
.MAIN_step_AA  .bar:before { content: "\ebe9"; font-family: unicons-line; position: absolute; top:45%; left: 80%; margin-left: -25px; width: 50px; font-size: 50px; color: #ccc; opacity: 0; }
.MAIN_step_AA  .bar.full:before { content: "\ebe9"; font-family: unicons-line; position: absolute; top:45%; left: 80%; width: 50px; font-size: 50px; color: #ccc; opacity: 1; }
.MAIN_step_AA  .bar.bar0:before { display: none; }
.MAIN_step_AA  .bar.bar0.full:before { display: none; }
.MAIN_step_AA .bar.full { height: 100%; }
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {  }
/* 구분 //end -----------------------------------*/


 .MAIN_step_AA   .circle { width: 20px; height: 20px; border-radius: 50%; background: var(--primary); flex-shrink: 0; }
/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) { .MAIN_step_AA .intro {
      display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0px; margin-right: 0px; margin-top: 27px; }
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) { }
/**** 모바일 ****/
@media only all and (max-width:767px) { .MAIN_step_AA .intro { gap: 0px; margin-left: 0px; margin-top: 0px; width: 100%; float: left; margin-left: 42px; }
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {  }
/* 구분 //end -----------------------------------*/



  .MAIN_step_AA  .intro-label { font-size: 12px; color: #444; margin-top: 5px; }


.bar4{display: none}