@import url('sub.css'); 

/**** S:: 사업분야 공통 ****/
.business {display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:60px;}
.business__media {width:calc((100% - 60px) / 2);}
.businessSwiper {position:relative; width:100%; padding-bottom:50px;}
.businessSwiper .swiper-slide {overflow:hidden; border-radius:var(--borderR15); aspect-ratio:75/46;}
.businessSwiper .swiper-slide img {display:block; width:100%; height:auto; object-fit:cover;}

.businessSwiper__pager {position:absolute; width:100%; bottom:12px; display:flex; align-items:center; justify-content:center; gap:10px; z-index:2;}
.businessSwiper__bullet {display:block; width:8px; height:8px; position:relative; border-radius:var(--borderAll); overflow:hidden;}
.businessSwiper__bar {display:none; width:40px; height:8px; background:rgba(34,34,34,0.15); position:relative; }
.businessSwiper__barOn {display:block; width:0; height:8px; background:var(--main); border-radius:var(--borderAll);}
.businessSwiper__dot {display:block; width:8px; height:8px; border-radius:var(--borderAll); background:rgba(34,34,34,0.15);}

.businessSwiper__bullet.swiper-pagination-bullet-active {width:40px; background:transparent;}
.businessSwiper__bullet.swiper-pagination-bullet-active .businessSwiper__dot {display:none;}
.businessSwiper__bullet.swiper-pagination-bullet-active .businessSwiper__bar {display:block;}
.businessSwiper__bullet.swiper-pagination-bullet-active .businessSwiper__barOn {animation:businessSwiperFill 4s linear forwards;}

.business__copy {width:calc((100% - 60px) / 2); align-self:center; transform:translateY(-15px);}
.business__head {padding:0 0 25px; border-bottom:1px solid var(--border);}
.business__title {margin:0; color:var(--black); font-weight:700; line-height:1.33; }
.business__lead {margin:8px 0 0; color:var(--black); font-weight:600; line-height:1.5; word-break:normal;}
.business__list {padding:25px 0 0;}
.business__list li {position:relative; padding:0 0 0 10px; margin:0 0 3px; color:var(--basic); line-height:1.67; word-break:normal;}
.business__list li::before {content:""; position:absolute; left:0; top:13px; width:3px; height:3px; border-radius:50%; background:var(--black);}
.business__list li:last-child {margin:0;}
.business__meta {margin:60px 0 0; border:1px solid rgba(3,78,162,0.2); border-radius:var(--borderR15); background:rgba(3,78,162,0.1); padding:15px 25px; display:flex; align-items:center; justify-content:space-between; gap:20px;}
.business__metaLabel {display:flex; align-items:center; gap:8px; color:var(--black); font-weight:600; line-height:1;}
.business__count {display:flex; align-items:center; color:var(--black); font-weight:700; line-height:1; gap:0 5px;}
.business__count .business__countPlus {margin-left:5px;}

@keyframes businessSwiperFill {from {width:0;} to {width:100%;}}


/**** E:: 사업분야 공통 ****/

/*******************************************************************************
    @media 1350px
*******************************************************************************/
@media all and (max-width:1350px){
.business {gap:40px;}
.business__media {width:calc((100% - 40px) / 2);}
.business__copy {width:calc((100% - 40px) / 2);}
.business__meta {margin:40px 0 0;}

}


/*******************************************************************************
    @media 1230px
*******************************************************************************/
@media all and (max-width:1230px){
.business__meta {flex-direction:column; align-items: flex-start; padding:20px; gap:10px;}
.business__count {width:100%; justify-content:flex-end; text-align:right;}

}

/*******************************************************************************
    @media  ~980px               
*******************************************************************************/
@media all and (max-width:980px){

.business {gap:30px;}
.business__media {width:calc((100% - 30px) / 2);}
.business__copy {width:calc((100% - 30px) / 2);}
.business__copy {align-self:flex-start; transform:translateY(0);}
.business__head {padding:0 0 20px;}
.business__list {padding:20px 0 0;}
.business__list li::before {top:11px;}
.business__meta {margin:30px 0 0; padding:15px;}

}

/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px){

.business {gap:30px 0;}
.business__media, .business__copy {width:100%;}
.businessSwiper {padding-bottom:30px;}
.businessSwiper__pager {bottom:10px;}
.businessSwiper__bullet {width:5px; height:5px;}
.businessSwiper__dot {width:5px; height:5px;}
.businessSwiper__bullet.swiper-pagination-bullet-active {width:30px;}
.businessSwiper__bar {width:30px; height:5px;}
.businessSwiper__barOn {height:5px;}
.businessSwiper__dot {width:5px; height:5px;}
.business__list li::before {top:9px;}

.business__metaLabel {gap:5px;}
.business__metaLabel svg {width:15px; height:auto;}

}

/*******************************************************************************
    @media ~480px             
*******************************************************************************/
@media all and (max-width:480px){


}