@charset "UTF-8"; 
/*메인*/
.main_visual { background: url('../img/bg.jpg') no-repeat 100%; text-align: center; padding-top: 28.4rem; padding-bottom: 17.5rem; } 
.under_line { display: inline-block; position: relative; z-index: 2; } 
.under_line:after { content: ''; background-color: #B4CDFF; display: inline-block; position: absolute; bottom: -2px; height: 30%; width: 100%; left: 0px; z-index: -1; } 
.main_visual_txt1 { font-size:9.4rem; font-weight: 700;letter-spacing: -1.88px }
.main_visual_txt1 p { line-height: 100%; } 
.main_visual_txt2 { font-weight: 500; font-size: 2.6rem; margin-top: 3rem; margin-bottom: 7rem; letter-spacing: -1.56px}

.btn-blue { height: 8.3rem; font-size: 2.4rem; font-weight: 700; padding: 0.5rem 5rem; display: flex; align-items: center; } 
.btn-blue img { margin-left: 2rem; } 

.btn-ww { font-size: 2.4rem; font-weight: 700; padding: 0.5rem 3rem; display: flex; align-items: center; border: 3px solid #0024B8; color:var(--primary); margin-top: 4rem; background-color: #fff; letter-spacing: -0.56px}
.btn-ww:hover { color:var(--primary); background-color: #f5f5f5; } 
.btn-ww img { margin-left: 2rem; } 
.padd_st1 { padding-top: 18rem; padding-bottom: 18rem; } 
.padd_st2 { padding-top: 16.5rem; padding-bottom: 15.5rem; } 
.main_ico { justify-content: space-between; text-align: center; padding-left: 4rem; } 
.main_ico li { padding: 0rem 1rem; font-size: 2.6rem; font-weight: 700; flex:1 } 

.main_con2 { margin-top:8.8rem; font-size: 2.6rem; font-weight: 700; text-align: center; } 
.main_con3 { display: flex; flex-wrap: wrap; gap: 3rem; margin-top: 10rem; } 
.main_con3 > li { background-color:#fff; border-radius: 2rem; width: calc((100% - 9rem) / 4); padding: 4rem 1.5rem; position: relative; } 
.main_con3_num { position: absolute; top: -24px; background-color: #0024B8; color: #fff; display: inline-block; width: 6rem; height: 6rem; line-height: 6rem; font-size: 2.4rem; left: calc(50% - 3rem); } 
.main_con3_txt1 { font-size: 3rem; font-weight: 700; margin-bottom:1.6rem; } 
.main_search_wr { width:100%; max-width: 73rem; margin: 6rem auto 4rem; } 
.main_search { box-shadow: 0 0 0px 3px #0024b8 inset; background-color: #fff; border-radius: 50px; display: flex; overflow: hidden; align-items: center; padding-left: 4rem; } 
.main_search .form-control { 
 border: 0px; 
 } 
.main_search .btn { border: #0024B8 3px solid; 
 height: 8rem; 
 padding: 0.5rem 4rem; 
 font-size: 2.4rem; 
 margin-right: -1px; 
 } 
.main_txt2 { font-size: 2.6rem; font-weight: 500; letter-spacing: -1.4px}

/*브랜드*/
.brand_txt1 { font-size:2.4rem; margin-top: 4.8rem; font-weight:500}
.brand_top { padding: 12.8rem 2rem; } 

.flow_banner { 
 overflow: hidden; 
 display: flex; 
 width: 100%; 
 max-width: 2500px; 
 /* background: #000; */
 margin-bottom: 13rem; 
 } 

.flow_banner .list { 
 display: flex; 
 } 

.flow_banner .list > li { 
 padding: 10px; 
 width: 180px; 
 } 
@keyframes flowRolling { 
 0% { transform: translateX(0); } 
 100% { transform: translateX(-100%); } 
 } 
 .box_st_wrap { display: flex; gap: 3rem; flex-wrap: wrap; margin-top: 8.4rem; } 
 .box_st1 { border-radius: 3rem; background-color: #fff; padding: 5rem; flex:1 } 
.box_st1 li { margin-bottom: 1rem; } 
.box_st1 .tit_h2 { margin-bottom: 3.5rem; }

.box_st2 li{margin-bottom: 1.5rem;}

.slider-wrapper { 
 display: flex; 
 align-items: center; 
 gap: 80px; 

 margin: 70px auto; 
 } 

.image-box { 
 position: relative; 
 overflow: hidden; 
 flex:1
 } 

.slide { 
 position: absolute; 
 top: 0; 
 left: 0; 
 width: 100%; 
 height: 100%; 
 opacity: 0; 
 transition: opacity 1s ease-in-out; 
 } 

.slide.active { 
 opacity: 1; 
 } 

.slide img { 
 width: 100%; 
 height: 100%; 
 object-fit: contain; 
 } 

.text-list { 
 list-style: none; 
 padding: 0; flex:1
 } 

.text-list li { 
 color: #888; 
 font-size: 2.6rem; 
 margin-bottom: 10px; 
 cursor: pointer; 
 transition: color 0.3s; 
 display: flex; 
 align-content: center; 
 align-items: center; 
 } 
 .text-list li .dot { 
 border: #fff 15px solid; 
 border-radius: 15rem; 
 width: 38px; 
 height: 38px; 
 display: inline-block; 
 background: #0024B8; 
 margin-right: 1rem; 
 flex-shrink: 0; 
 } 

.text-list li.active { color: #0024B8; font-weight: bold; } 
 .text-list li.active .dot { border: #DDE1EF 15px solid; } 

.brand_wr2 { background: url('../img/bg2.jpg') no-repeat; background-size: cover; padding: 16rem 2rem; } 
.brand_wr2 > div { max-width: 1390px; margin: 0 auto; } 
.brand_box2 { gap: 3rem; display: flex; margin-top: 7rem; } 
.brand_box2 li { border-radius: 3rem; background-color: #fff; padding: 7rem 2.2rem; width: calc((100% - 6rem) / 3); } 

.brand_wr3 { margin-top: 10rem; } 

/*서비스안내*/
.service_top { background: url('../img/service_bg.jpg') no-repeat center bottom; background-size: cover; padding-top: 16.8rem; padding-bottom: 10rem; } 
.service_box { gap: 6rem; display: flex; margin-top: 13rem; flex-wrap: wrap; } 
.service_box > div { width: calc((100% - 6rem) / 2); margin-bottom: 8rem; } 
.service_box dl { } 
.service_box dt { font-weight: 700; 
 font-size: 3.4rem; 
 margin-top: 4rem; 
 margin-bottom: 3rem; 
 } 
.service_box dd { 
 font-size: 2.6rem; 
 font-weight: 400;
 margin-bottom: 1rem; 
 } 
 .service_box dd span { color:#0024B8 } 
 
 .service_box2 { gap: 3rem; display: flex; margin-top: 5rem; flex-wrap: wrap; justify-content: center; } 
.service_box2 li { font-weight: 700;
 width: calc((100% - 6rem) / 3); 
 /* margin-bottom: 8rem; */
 font-size: 2.4rem; 
 color: #273983; 
 text-align: center; 
 border-radius: 1.6rem; 
 background-color: #fff; 
 padding: 5rem 2.2rem; 
 box-shadow: 0 0px 22px rgba(3,19,87,0.3); 
 } 
.service_txt { margin-top: 8rem; } 
 .service_box3 { font-size: 2.4rem; margin-bottom: 10rem; } 
 .service_box3 li { margin-bottom: 3rem; } 

 /*과정 및 사례*/
 .progress_top { background: url('../img/progress_bg.jpg') no-repeat center bottom; background-size: cover; padding-top: 16.8rem; padding-bottom: 10rem; } 
.progress_box1 { margin-top: 5rem; 
 display: flex; 
 justify-content: center; 
 } 
.progress_box1 li { 
 padding: 1rem; 
 } 
.progress_box1 li:nth-child(2n) { margin-top: 8rem; } 
.progress_li { font-size: 2.4rem; margin-top: 8rem; } 
.progress_li li { background: url('../img/progress_img8.png') no-repeat; background-size: 42px; padding-left: 5rem; padding-bottom: 1.5rem; padding-top: 1.5rem; } 
.progress_txt1 { margin-top: 5rem; } 

.faq{margin-top: 8rem;}
.textarea_txt{font-size: 0.85em;}

/*faq*/
/* faq */
.aaccordion {
    overflow-anchor: none;
}

 .faq_st  {margin-top: 5rem;}
.faq_st .accordion_tit {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: auto;
    vertical-align: middle;
    box-sizing: content-box;
    margin-top: 0;
    padding: 0rem;
}



.faq_st .faq_wrap{}


.faq_st .card-header:hover {
    background-color: #fcfcfc;
}
.faq_st .faq_wrap{margin-bottom: 2rem;}
.faq_st .faq-header{background-color: #f5f5f5;border-radius: 3rem;padding: 2.8rem 4.5rem;}

.faq_st .card-body {
    padding: 3rem 3.6rem 3rem 3rem;
    background-image: url(../images/faq_line.png);
    background-repeat: no-repeat;
    background-size: 0.4rem 100%;
    background-color: rgba(225, 225, 225, 0.2);
    line-height: 1.6;
}
.faq_st .faq_q{font-size: 4rem;margin-right: 4rem;font-weight: 700;}
.faq_st .faq_tit{font-size: 2.8rem; font-weight: 700;  }
.faq_st .faq_sub_tit{font-size: 2rem;color:#6C757D;font-weight: 500;margin-top: 0.5rem;}
.faq_st .faq-body{display: flex;padding: 4rem 4rem 2rem;font-size: 2.2rem;line-height: 1.4;}
.faq_st .faq-body .faq_a{font-size: 3rem; font-weight: 700;  color:#6C757D ; margin-right: 2rem;}

.faq_st .accordion_tit[aria-expanded="false"] .btn_accordion{ transform:rotate(180deg);}
.faq_st .accordion_tit[aria-expanded="true"] .btn_accordion{ transform:rotate(0deg);}
.faq_st .btn_accordion{flex-shrink: 0;}
/*반응형 max 1200 xl*/
@media (max-width: 1199.98px) { 
 .main_visual { padding-top: 22.4rem; 
 padding-bottom: 12.5rem; } 
 .main_visual_txt1 { font-size: 7.4rem; } 
 .main_visual_txt2 { font-size: 2rem; } 
 .main_ico { padding-left: 0rem; } 
 .main_ico li { font-size: 2rem; } 

 .padd_st1 { padding-top: 12rem; padding-bottom: 12rem; } 
.padd_st2 { padding-top: 10rem; padding-bottom: 10rem; } 
.main_con3_txt1 { font-size: 2.5rem; } 
.btn-ww { font-size: 2rem; } 
.main_con2 { margin-top: 4rem; font-size: 2rem; } 



/*브랜드*/
.text-list li { font-size: 2rem; line-height: 1.2; } 
 } 


/*반응형 max 992px lg*/
@media (max-width: 991.98px) { 
 /*서비스*/
.service_box { margin-top: 5rem; gap: 3rem; } 
.service_box > div { width: calc((100% - 3rem) / 2); } 
/*과정*/
.progress_box1 { flex-wrap: wrap; } 
.progress_box1 li { width: 33.333%; } 
.progress_box1 li:nth-child(2n) { margin-top: 0rem; } 
.progress_li li { font-size: 2rem; } 

/*faq*/
.faq_st .faq_tit{font-size: 2.4rem;}
.faq_st .faq-body{font-size: 2rem;}
.faq_st .faq_q{font-size: 3rem;}
 } 




/*반응형 max 767px md*/
@media (max-width: 767.98px) { 
 .form-control { font-size: 1.5rem; } 
 .main_visual { padding: 17rem 2rem; background-size: cover; } 
 .main_visual_txt2 { font-size: 1.6rem; } 
 .btn-blue { height: 6rem; font-size: 2rem; padding: 0.5rem 3rem; } 
 .main_visual_txt1 { font-size: 9vw; } 
 .padd_st1 { padding-top: 6rem; padding-bottom:6rem; } 
 .padd_st2 { padding-top: 5rem; padding-bottom:5rem; } 
 .main_ico { margin-top: 4rem; } 
 .main_ico li { font-size: 1.5rem; } 
 .main_con2 { margin-top: 2rem; font-size: 1.6rem; } 
 .main_con2 > div { margin-bottom: 3rem; } 
 .main_con3 > li { width: calc((100% - 3rem) / 2); } 
 .main_con3_num { width: 4rem; 
 height: 4rem; 
 line-height: 4rem; 
 font-size: 2rem; 
 left: calc(50% - 2rem); top: -18px; } 
 .main_con3 { margin-top:5rem; } 
 .main_con3_txt1 { font-size: 2rem; } 
 .btn-ww { font-size: 1.8rem; height: 5rem; border: 2px solid #0024B8; padding: 0.5rem 3rem; margin-top: 2rem; } 
 .main_txt2 { font-size: 1.8rem; } 
 .main_search_wr { 
 margin: 3rem auto 2rem; 
 } 
 .main_search .btn { 
 height: 6rem; 
 border: #0024B8 2px solid; 
 font-size: 1.8rem; 
 padding: 0.5rem 2rem; 
 } 
.main_search { padding-left: 3rem; } 

/*브랜드*/
.flow_banner .list > li { 
 padding: 10px; 
 width: 80px; 
 } 
 .slider-wrapper { flex-direction: column; margin: 30px auto; gap: 40px; } 
 .text-list li { font-size: 1.7rem; } 
 .brand_top { padding: 5rem 2rem; } 
 .brand_txt1 { font-size: 1.6rem; margin-top: 2.8rem; } 
 .flow_banner { margin-bottom: 5rem; } 
 .box_st1 { padding: 3rem 2rem; } 
 .box_st1 img { width:35px; } 
 .box_st1 .tit_h2 { margin-bottom: 2.5rem; } 
 .box_st_wrap { margin-top: 4rem; flex-direction: column; } 
 .brand_wr2 { padding-top: 6rem; padding-bottom: 6rem; } 
 .brand_box2 { flex-direction: column; margin-top: 3rem; gap: 1.5rem; } 
 .brand_box2 li { width: 100%; padding: 3rem 2.2rem; border-radius: 2rem; } 
 .brand_wr3 { margin-top: 5rem; } 
 .brand_wr3 > div{margin-bottom: 1rem;}

 /*서비스*/
.service_top { padding-top: 12rem; background-position-x: 65%; } 
.service_box { margin-top: 5rem; gap: 3rem; } 
.service_box > div { width:100%; margin-bottom: 3rem; } 
.service_box img { width:50px; } 
.service_box dt { font-size: 2.2rem; margin-top: 2rem; } 
.service_box dd { font-size: 1.6rem; } 
 .service_box2 { gap: 1rem; margin-top: 3rem; } 
 .service_box2 li { 
 width: 100%; 
 font-size: 1.8rem; 
 padding: 3rem 2.2rem; 
 } 
.service_txt { margin-top: 4rem; } 
.service_box3 { font-size: 1.6rem; margin-bottom:3rem; } 

/*과정*/
.progress_top { padding-top: 12rem; background-position-x: 65%; } 
.progress_box1 { margin-top: 2rem; } 
.progress_box1 li { width: 50%; padding: 0.5rem; } 
.progress_li li { font-size: 1.6rem; 
 background-size: 22px; 
 padding: 0.5rem 0rem 0.5rem 3rem; } 
 .progress_li { margin-top: 3rem; } 

 .faq_st .btn_accordion img{ width: 20px;}
 } 


/*반응형 max 576px sm*/
@media (max-width: 575.98px) { 
 .main_con3 > li { width: 100%; } 

 /*faq*/
 .faq{margin-top: 5rem;}
.faq_st{margin-top: 2rem;}
.faq_st .faq_tit{font-size: 1.8rem;}
.faq_st .faq-header{padding: 1.8rem 1.5rem 1.8rem 2rem; border-radius: 2rem;}
.faq_st .faq_sub_tit{font-size: 1.5rem;}
.faq_st .faq-body{font-size: 1.6rem;}
.faq_st .faq_q{font-size: 2.2rem; margin-right: 1rem;}
.faq_st .faq-body .faq_a{font-size: 2.2rem; margin-right: 1rem;}
.faq_st .faq-body {padding: 1.5rem;}
.faq_st .faq_wrap{margin-bottom: 1rem;}
 } 

@media (max-width:380px) { 

 } 



