._contents.replai{ padding-top: 0; }
._tit em{ display: inline-block; font-size: 20px; letter-spacing: -0.05em; padding: calc(10 / 20 * 1em) calc(16 / 20 * 1em); box-sizing: border-box; border-radius: 20px; background-color: #c01640; color: #fff; font-weight: 600; margin-bottom: 1em; }

@media screen and (max-width: 1440px){
    ._tit em{ font-size: 16px; }
}

@media screen and (max-width: 1440px){
    ._tit em{ font-size: max(calc(16/1440*100vw),14px); }
}


.replai .s_cover{ height: 100vh; position: relative; box-sizing: border-box; text-align: center; }
.replai .s_cover .bg{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 0; }
.replai .s_cover .bg img{ width: 100%; height: 100%; object-fit: cover; }
.replai .s_cover .covers{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; }
.replai .s_cover .covers.filter{ z-index: 5; }
.replai .s_cover .covers.filter span{ backdrop-filter: invert(1); background-color: unset; }
.replai .s_cover .covers span{ width: 45%; height: 50%; display: block; background-color: #000; }
.replai .s_cover .covers span:first-of-type{ transform-origin: 100% 100%; margin-left: auto; }
.replai .s_cover .txt{ width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; font-size: 90px; letter-spacing: -0.05em; line-height: calc(120 / 90); font-weight: 600; color: #fff; z-index: 3; position: relative; }
.replai .s_cover .txt strong{ overflow: hidden; display: block; }


@media screen and (max-width: 1280px){
    .replai .s_cover .txt{ font-size: 60px; }
}

@media screen and (max-width: 820px){
    .replai .s_cover .txt{ font-size: 35px; }
}

@media screen and (max-width: 500px){
    .replai .s_cover .txt{ font-size: 28px; }
}



.replai .s_ico_card{ padding: 150px 0; }

@media screen and (max-width: 1024px){
    .replai .s_ico_card{ padding: 80px 0; }
}


.replai .s_chart{ background-color: #efefef; padding: 150px 0; }
.replai .s_chart .flx{ display: flex; justify-content: space-between; margin-top: 65px; }
.replai .s_chart .flx .chartArea{ width: calc(740 / 1600 * 100%); padding: calc(35 / 1600 * 100%) calc(50 / 1600 * 100%); box-sizing: border-box;  }
.replai .s_chart .flx .chartArea .subtitle{ font-size: 24px; letter-spacing: -0.05em; font-weight: 700; padding-bottom: 30px; border-bottom: 1px solid #dddddd; margin-bottom: 35px; line-height: 1.4; display: block; }

.replai .s_chart .flx .chartArea.shadow{ box-shadow: 0 0 20px rgba(0,0,0,0.2); }
.replai .s_chart .flx .chartArea .s_flx{ display: flex; padding-bottom: 40px; border-bottom: 1px solid #dddddd; margin-bottom: 40px; box-sizing: border-box; }
.replai .s_chart .flx .chartArea .s_flx .bx{ width: 50%; box-sizing: border-box; }
.replai .s_chart .flx .chartArea .s_flx .bx .badge > li{ margin-right: 5px; }
.replai .s_chart .flx .chartArea .bx small{ font-size: 20px; font-weight: 600; letter-spacing: -0.05em; color: #c01640; line-height: 1.4; }
.replai .s_chart .flx .chartArea .bx b{ display: block; width: 25px; height: 2px; background-color: #c01640; margin-top: 15px; }
.replai .s_chart .flx .chartArea .bx > p{ font-size: 18px; letter-spacing: -0.05em; margin-top: 20px; line-height: 1.4; }
.replai .s_chart .flx .chartArea .bx .badge{ display: flex; margin-top: 10px; }
.replai .s_chart .flx .chartArea .bx .badge > li{ margin-right: 25px; display: flex; align-items: center; }
.replai .s_chart .flx .chartArea .bx .badge > li span{ border-radius: 13px; font-size: 14px; letter-spacing: -0.05em; color: #777777; background-color: #e7e7e7; padding: 6px 14px; box-sizing: border-box; display: block; }
.replai .s_chart .flx .chartArea .bx .badge > li em{ font-size: 14px; letter-spacing: -0.05em; color: #777777; margin-left: 5px; display: block; }
.replai .s_chart .flx .chartArea .bx .swWrap{ width: 100%; }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw{ width: 100%; padding-bottom: 150px; }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn{ display: flex; justify-content: center; margin-top: 50px;  }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .lbx{ position: relative; padding: 0 25px; box-sizing: border-box; display: flex; align-items: center; }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .line{ width: 80px;  display: flex; align-items: center; justify-content: center; }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .line em{ display: block; width: 100%; height: 1px; background-color: #7f7f7f;  }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .rbx{ position: relative; padding: 0 25px; box-sizing: border-box; }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .circle{ width: 140px; height: 140px; border-radius: 50%; background-color: #c01640; display: flex; align-items: center; justify-content: center; box-sizing: border-box; padding: 10px; }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .square{ padding: 30px 20px; box-sizing: border-box; border-radius: 20px; color: #fff; background-color: #c01640; }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .square ol{ display: block; }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .square ol li{ margin-bottom: 5px; line-height: 1.4; font-size: 16px; letter-spacing: -0.05em; margin-right: 0; }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .square ol li:last-of-type{ margin-bottom: 0; }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .square ol li i{ margin-right: 5px; }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn p{ position: absolute; left: 50%; top: calc(100% + 25px); transform: translateX(-50%); text-align: center; width: 100%; line-height: 1.4; font-size: 18px; letter-spacing: -0.05em; }

.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn ol{ display: flex; align-items: center; justify-content: center; }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn ol li{ position: relative; margin-right: 5px; }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn ol li .ico{ width: 66px; height: 66px; border-radius: 50%; background-color: #f0f0f0; display: flex; align-items: center; justify-content: center; box-sizing: border-box; padding: 10px; }
.replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn ol li span{ position: absolute; top: calc(100% + 10px); left: 50%; transform: translateX(-50%); font-size: 16px; letter-spacing: -0.05em; color: #555555; text-align: center; width: 100%; display: block; }
.replai .s_chart .flx .chartArea .bx .swWrap .swiper-pagination-bullet{ width: 10px; height: 5px; border-radius: 10px; background-color: #777777; margin: 0 2px; opacity: 1; transition-duration: 0.4s; }
.replai .s_chart .flx .chartArea .bx .swWrap .swiper-pagination-bullet-active{ background-color: #c01640; width: 60px; }

.replai .s_chart .flx .arrow{ width: calc(113 / 1600 * 100%); padding: 0 10px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; }

.replai .s_chart .flx .arrow i{ font-size: 40px; color: #000; display: block; margin: 0 -0.3em; animation: opacity 0.8s infinite alternate; }
.replai .s_chart .flx .arrow i:nth-of-type(2){ animation-delay: 0.2s; }
.replai .s_chart .flx .arrow i:nth-of-type(3){ animation-delay: 0.3s; }

@keyframes opacity {
    0%{ opacity: 0.2; }
    100%{ opacity: 1; }
}

.replai .s_chart .note{ font-size: 14px; letter-spacing: -0.05em; line-height: 1.4; color: #777777; display: block; margin-top: 13px; }

@media screen and (max-width: 1440px){
    .replai .s_chart .flx .chartArea .subtitle{ font-size: 20px; }
    .replai .s_chart .flx .chartArea .bx small{ font-size: 18px; }
    .replai .s_chart .flx .chartArea .bx > p{ font-size: 16px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn p{ font-size: 16px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn ol li .ico{ width: 55px; height: 55px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .line{ width: 60px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .square{ padding: 20px 15px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .square ol li{ font-size: 14px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn ol li span{ font-size: 14px; }
}

@media screen and (max-width: 1280px){
    .replai .s_chart .flx .chartArea .subtitle{ padding-bottom: 15px; margin-bottom: 15px; }
    .replai .s_chart .flx .chartArea .s_flx{ padding-bottom: 20px; margin-bottom: 20px; }
    .replai .s_chart .flx .chartArea .bx .badge > li{ margin-right: 10px; }
    .replai .s_chart .flx .chartArea .bx .badge > li span{ padding: 6px 10px; font-size: 12px; }
    .replai .s_chart .flx .chartArea .bx > p{ font-size: 14px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn ol{ flex-wrap: wrap; }
    /* .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn ol li{ margin-bottom: 30px; } */
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn ol li span{ top: calc(100% + 5px); }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .lbx{ padding: 0 10px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .line{ width: 30px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .rbx{ padding: 0 10px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .square{ padding: 15px 10px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn p{ font-size: 14px; }
}

@media screen and (max-width: 1024px){
    .replai .s_chart{ padding: 80px 0; }
    .replai .s_chart .flx{ flex-direction: column; margin-top: 40px; }
    .replai .s_chart .flx .chartArea{ width: 100%; padding: 25px; }
    .replai .s_chart .flx .arrow{ width: 100%; }
    .replai .s_chart .flx .arrow{ transform: rotate(90deg); padding: 30px 0; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw{ padding-bottom: 100px; }
    .replai .s_chart .flx .chartArea .subtitle{ font-size: 18px; }
    
}

@media screen and (max-width: 500px){
    .replai .s_chart .flx .chartArea .s_flx{ flex-direction: column; }
    .replai .s_chart .flx .chartArea .s_flx .bx{ width: 100%; margin-bottom: 20px; }
    .replai .s_chart .flx .chartArea .s_flx .bx:last-of-type{ margin-bottom: 0; }
    .replai .s_chart .flx .chartArea .bx small{ font-size: 16px; }
    .replai .s_chart .flx .chartArea .bx b{ margin-top: 10px; }
    .replai .s_chart .flx .chartArea .bx > p{ margin-top: 10px; }
    .replai .s_chart .flx .chartArea > .bx .badge{ margin-top: 5px; flex-direction: column; }
    .replai .s_chart .flx .chartArea > .bx .badge > li{ margin-right: 0; margin-bottom: 5px; }
    .replai .s_chart .flx .arrow i{ font-size: 30px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw{ padding-bottom: 50px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn{ flex-direction: column; margin-top: 20px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .line{ width: 100%; padding: 20px 0; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .line em{ width: 1px; height: 30px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn p{ position: static; transform: translateX(0); margin-top: 10px; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .lbx{ flex-direction: column; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .lbx .icon{ min-height: 153px; display: flex; flex-direction: column; justify-content: center; align-items: center; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .circle{ margin: 0 auto; }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn ol li span{ position: static; margin-top: 5px; text-align: center; transform: translateX(0); }
    .replai .s_chart .flx .chartArea .bx .swWrap .vocsw .inn .square{ min-height: 140px; display: flex; flex-direction: column; justify-content: center; }
}


.replai .s_certi{ padding: 130px 0; }
.replai .s_certi .certiarea{ margin-top: 55px; }
.replai .s_certi .certiarea > ul{ width: 100%; display: flex; gap: 25px; }
.replai .s_certi .certiarea > ul li{ position: relative; }
.replai .s_certi .certiarea > ul li .thumb{ width: 100%; border: 1px solid #dddddd; box-sizing: border-box; overflow: hidden; }
.replai .s_certi .certiarea > ul li span{ font-size: 18px; letter-spacing: -0.05em; margin-top: 20px; display: block; text-align: center; font-weight: 600; }

@media screen and (max-width: 1280px){
    .replai .s_certi .certiarea{ margin-top: 40px; }
    .replai .s_certi .certiarea > ul{ gap: 15px; }
    .replai .s_certi .certiarea > ul li span{ font-size: 16px; margin-top: 15px; }
}

@media screen and (max-width: 1024px){
    .replai .s_certi{ padding: 80px 0; }
}

@media screen and (max-width: 820px){
    .replai .s_certi .certiarea > ul{ flex-wrap: wrap; justify-content: center; gap: 0; }
    .replai .s_certi .certiarea > ul li{ width: 32%; margin-right: 1%; margin-bottom: 30px; }
    .replai .s_certi .certiarea > ul li:nth-of-type(3){ margin-right: 0; }
    .replai .s_certi .certiarea > ul li span{ font-size: 14px; }
}

@media screen and (max-width: 500px){
    .replai .s_certi .certiarea > ul li{ width: 49%; }
    .replai .s_certi .certiarea > ul li:nth-of-type(2n){ margin-right: 0; }
    .replai .s_certi .certiarea > ul li:nth-of-type(3){ margin-right: 1%; }
    .replai .s_certi .certiarea > ul li span{ margin-top: 10px; }
}


.replai .s_card{ padding: 160px 0; }

@media screen and (max-width: 1024px){
    .replai .s_card{ padding: 80px 0; }
}


.replai .s_bubbles{ padding-top: 145px; position: relative; overflow: hidden; color: #fff; padding-bottom: 250px; }
.replai .s_bubbles .bg{ width: 100%; height: 100%; box-sizing: border-box; position: absolute; left: 0; top: 0; z-index: 0; }
.replai .s_bubbles .bg img{ width: 100%; height: 100%; object-fit: cover; }
.replai .s_bubbles .wrap{ position: relative; z-index: 1; }
.replai .s_bubbles .bubWrap{ position: relative; margin-top: 140px; }
.replai .s_bubbles .bubWrap .maincircle .mainbub .circle._1{ width: calc(300 / 500 * 100%); }
.replai .s_bubbles .bubWrap .maincircle .mainbub .circle._2{ width: 100%; }
.replai .s_bubbles .bubWrap .maincircle .mainbub .circle svg{ width: 100%; }
.replai .s_bubbles .bubWrap .maincircle{ width: 500px; height: 500px; border-radius: 50%; position: relative; display: flex; align-items: center; justify-content: center; margin: 0 auto; }
.replai .s_bubbles .bubWrap .maincircle::after{ content: ''; display: block; width: 130%; height: 130%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(50px); background-color: rgba(255,255,255,0.2); z-index: -1; border-radius: 50%; }
.replai .s_bubbles .bubWrap .maincircle .mainbub{ width: calc(220 / 500 * 100%); height: calc(220 / 500 * 100%); }
.replai .s_bubbles .bubWrap .maincircle .center{ width: 100%; height: 100%; border-radius: 50%; background-color: #c01640; color: #fff; font-size: 30px; letter-spacing: -0.05em; line-height: calc(36 / 30); font-weight: 600; text-align: center; box-shadow: 0 0 15px rgba(0,0,0,0.2); display: flex; align-items: center; justify-content: center; }
.replai .s_bubbles .bubWrap .maincircle .center strong{ display: block; }
.replai .s_bubbles .bubWrap .maincircle .circle{ position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.replai .s_bubbles .bubWrap .maincircle .obj{ position: absolute; border-radius: 50%; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 16px; letter-spacing: -0.05em; font-weight: 500; color: #000; }
.replai .s_bubbles .bubWrap .maincircle .obj._1{ width: calc(50 / 500 * 100%); height: calc(50 / 500 * 100%); background-color: #fff; top: calc(135 / 500 * 100%); left: calc(110 / 500 * 100%); }
.replai .s_bubbles .bubWrap .maincircle .obj._2{ width: calc(115 / 500 * 100%); height: calc(115 / 500 * 100%); background-color: #932aff; top: calc(120 / 500 * 100%); right: calc(-38 / 500 * 100%); color: #fff; }
.replai .s_bubbles .bubWrap .maincircle .obj._3{ width: calc(130 / 500 * 100%); height: calc(130 / 500 * 100%); background-color: #a5a5a5; bottom: calc(77 / 500 * 100%); left: calc(-30 / 500 * 100%); }
.replai .s_bubbles .bubWrap .maincircle .obj._4{ width: calc(90 / 500 * 100%); height: calc(90 / 500 * 100%); background-color: #fff; bottom: calc(48 / 500 * 100%); right: calc(15 / 500 * 100%); }

.replai .s_bubbles .bubWrap .bublist{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.replai .s_bubbles .bubWrap .bublist li{ position: absolute; width: 120px; height: 120px; }
.replai .s_bubbles .bubWrap .bublist li .inn{ width: 100%; height: 100%; display: flex; display: flex; align-items: center; justify-content: center; flex-direction: column; border: 1px dashed rgba(255,255,255,0.3); border-radius: 50%; padding: 15px; box-sizing: border-box;  }
.replai .s_bubbles .bubWrap .bublist li:nth-of-type(2n) .inn{ animation: updown 2s ease-in-out infinite; }
.replai .s_bubbles .bubWrap .bublist li:nth-of-type(2n-1) .inn{ animation: updown 3s ease-in-out infinite; }
.replai .s_bubbles .bubWrap .bublist li:nth-of-type(1) .inn{  }
.replai .s_bubbles .bubWrap .bublist li:nth-of-type(2) .inn{ animation-delay: 0.2s; }
.replai .s_bubbles .bubWrap .bublist li:nth-of-type(3) .inn{ animation-delay: 0.6s; }
.replai .s_bubbles .bubWrap .bublist li:nth-of-type(4) .inn{ animation-delay: 0.4s; }
.replai .s_bubbles .bubWrap .bublist li:nth-of-type(5) .inn{  }
.replai .s_bubbles .bubWrap .bublist li:nth-of-type(6) .inn{ animation-delay: 0.1s; }

@keyframes updown{
    0%{ transform: translateY(-5%); }
    50%{ transform: translateY(5%); }
    100%{ transform: translateY(-5%); }
}

.replai .s_bubbles .bubWrap .bublist li span{ font-size: 14px; letter-spacing: -0.05em; margin-top: 10px; text-align: center; display: block; text-align: center; }
.replai .s_bubbles .bubWrap .bublist li:nth-of-type(1){ top: 13px; left: calc(113 / 1600 * 100%); }
.replai .s_bubbles .bubWrap .bublist li:nth-of-type(2){ top: 130px; left: calc(340 / 1600 * 100%); }
.replai .s_bubbles .bubWrap .bublist li:nth-of-type(3){ top: 405px; left: calc(210 / 1600 * 100%); }
.replai .s_bubbles .bubWrap .bublist li:nth-of-type(4){ top: 18px; right: calc(200 / 1600 * 100%); }
.replai .s_bubbles .bubWrap .bublist li:nth-of-type(5){ top: 270px; right: calc(326 / 1600 * 100%); }
.replai .s_bubbles .bubWrap .bublist li:nth-of-type(6){ top: 470px; right: calc(134 / 1600 * 100%); }

@media screen and (max-width: 1280px){
    .replai .s_bubbles{ padding-bottom: 200px; }
    .replai .s_bubbles .bubWrap{ margin-top: 70px; }
    .replai .s_bubbles .bubWrap .maincircle{ width: 400px; height: 400px; }
    .replai .s_bubbles .bubWrap .maincircle .center{ font-size: 24px; }
    .replai .s_bubbles .bubWrap .bublist li{ width: 100px; height: 100px; }

    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(1){ left: 0; }
    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(2){ left: 8%; top: 150px; }
    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(3){ left: 5%; }
    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(4){ right: 5%; }
    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(5){ right: 10%; }
    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(6){ right: 0%; top: 400px; }
}

@media screen and (max-width: 820px){
    .replai .s_bubbles{ padding-top: 100px; }
    .replai .s_bubbles .bubWrap .maincircle{ width: 300px; height: 300px; }
    .replai .s_bubbles .bubWrap .maincircle .center{ font-size: 18px; }
    .replai .s_bubbles .bubWrap .maincircle .obj{ font-size: 14px; }
    .replai .s_bubbles .bubWrap .bublist li{ width: 80px; height: 80px; }
    .replai .s_bubbles .bubWrap .bublist li span{ margin-top: 5px; font-size: 12px; }
    .replai .s_bubbles .bubWrap .bublist li img{ width: 30px; }

    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(1){ left: 12%; top: -40px; }
    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(2){ left: -10px; top: 70px; }
    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(3){ left: 0; top: 275px; }
    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(4){ right: 2%; top: -14px; }
    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(5){ right: 25%; top: 300px; }
    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(6){ right: 0%; top: 280px; }
}

@media screen and (max-width: 500px){
    .replai .s_bubbles .bubWrap .maincircle{ width: 200px; height: 200px; }
    .replai .s_bubbles .bubWrap .maincircle .center{ font-size: 14px; }
    .replai .s_bubbles .bubWrap .maincircle .obj{ font-size: 12px; }  
    .replai .s_bubbles .bubWrap .maincircle .obj._4{ width: calc(120 / 500 * 100%); height: calc(120 / 500 * 100%); }
    .replai .s_bubbles .bubWrap{ margin-top: 120px; }

    .replai .s_bubbles .bubWrap .bublist li{ width: 60px; height: 60px; padding: 0 10px; }
    .replai .s_bubbles .bubWrap .bublist li img{ width: 25px; }

    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(1){ left: 30%; top: -100px; }
    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(2){ left: 0%; top: -20px; }
    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(3){ left: 0%; top: 200px; }
    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(5){ right: 0; top: 180px; }
    .replai .s_bubbles .bubWrap .bublist li:nth-of-type(6){ right: 30%; top: 240px; }
}


.replai .s_chart.pipe .chartArea{ padding: 90px 10px; box-sizing: border-box; margin-top: 80px; }

.replai .s_chart .pipeline{ width: 100%; max-width: 1370px; margin: 0 auto; display: flex; }
.replai .s_chart .pipeline .arrow > div{ width: 3.6em; }
.replai .s_chart .pipeline .arrow{ display: flex; align-items: center; justify-content: center; }
.replai .s_chart .pipeline .col3 .arrow > div{ width: 10px; }
.replai .s_chart .pipeline .col4 .arrow > div{ width: 20px; }

/* 아이콘 크기지정 */
.replai .s_chart .pipeline .col1 .rail__items li .icon img{ height: 20px; }
.replai .s_chart .pipeline .col2 .rail__items li .icon img{ height: 30px; }
.replai .s_chart .pipeline .col2 .rail__items.white li .icon img{ height: 64px; }

.replai .s_chart .pipeline .col2 .rail__items .diagram .obj img{ height: 30px; }
.replai .s_chart .pipeline .col2 .rail__items .diagram .obj._4 img{ height: 40px; }

.replai .s_chart .pipeline .col3 .rail__items li .icon img{ height: 20px; }
.replai .s_chart .pipeline .col4 .rail__items li .icon img{ height: 40px; }

/* 열 너비 지정 */
.replai .s_chart .pipeline .col1{ width: calc(234 / 1370 * 100%); }
.replai .s_chart .pipeline .col2{ width: calc(438 / 1370 * 100%); }
.replai .s_chart .pipeline .col3{ width: calc(220 / 1370 * 100%); }
.replai .s_chart .pipeline .col4{ width: calc(180 / 1370 * 100%); }
.replai .s_chart .pipeline .arr{ width: calc(97 / 1370 * 100%); }


/* 공통 */
.replai .s_chart .pipeline .arr .bx{ height: 120px; margin-bottom: 20px; display: flex; align-items: center; justify-content: center; }
.replai .s_chart .pipeline.mob{ display: none; }
.replai .s_chart .pipeline .arr .bx:last-of-type{ margin-bottom: 0; }
.replai .s_chart .pipeline .rail__group{ margin-bottom: 20px; }
.replai .s_chart .pipeline .rail__group:last-of-type{ margin-bottom: 0; }
.replai .s_chart .pipeline .rail__group .rail__title{ width: 45px; background-color: #c01640; color: #fff; display: flex; justify-content: center; align-items: center; writing-mode: vertical-lr; text-align: center; border-radius: 15px; flex-shrink: 0; }
.replai .s_chart .pipeline .rail__group .rail__items li{ width: 100%; height: 120px; display: flex; flex-direction: column; justify-content: center; background-color: #f4f4f4; border-radius: 15px; margin-bottom: 20px; padding: 20px 0; box-sizing: border-box; }
.replai .s_chart .pipeline .rail__group .rail__items.white li{ background-color: #fff; }
.replai .s_chart .pipeline .rail__group .rail__items.purple li{ background-color: #fff; box-shadow: 0 0 8px rgba(147, 42, 255, 0.2); }
.replai .s_chart .pipeline .rail__group .rail__items.pink li{ background-color: #fff; box-shadow: 0 0 8px rgba(192, 22, 64, 0.2); height: 260px; justify-content: flex-start; }
.replai .s_chart .pipeline .rail__group .rail__items li:last-of-type{ margin-bottom: 0; }
.replai .s_chart .pipeline .rail__group .rail__items li .icons{ display: flex; justify-content: center; gap: 5px; }
.replai .s_chart .pipeline .rail__group .rail__items li .icon{ display: block;  text-align: center; }
.replai .s_chart .pipeline .rail__group .rail__items li .icon em{ font-size: 14px; letter-spacing: -0.05em; color: #444444; margin-top: 10px; display: block; }
.replai .s_chart .pipeline .rail__group .rail__items li .icon p{ font-size: 14px; letter-spacing: -0.05em; margin-top: 8px; }
.replai .s_chart .pipeline .rail__group .rail__items li small{ font-size: 14px; letter-spacing: -0.05em; color: #444444; margin-top: 10px; display: block; text-align: center; padding: 0 10px; box-sizing: border-box; }
.replai .s_chart .pipeline .rail__group .rail__items li > strong{ font-size: 14px; letter-spacing: -0.05em; font-weight: 600; text-align: center; display: block; }
.replai .s_chart .pipeline .flex{ display: flex; }



.replai .s_chart .pipeline .col1 .rail__group{ display: flex; justify-content: space-between; }
.replai .s_chart .pipeline .col1 .rail__group .rail__items{ width: 100%; padding-left: calc(10 / 234 * 100%); box-sizing: border-box; }
.replai .s_chart .pipeline .col2 .rail__group > .rail__items li{ height: 260px; display: block; position: relative; }

.replai .s_chart .pipeline .col2 .flex{ margin-bottom: 20px; }
.replai .s_chart .pipeline .col2 .flex .rail__items{ width: calc(220 / 438 * 100%); }
.replai .s_chart .pipeline .col2 .flex .rail__items.white{ width: calc(125 / 438 * 100%); }
.replai .s_chart .pipeline .col2 .flex .rail__items.white li{ justify-content: flex-start; padding: 0; }
.replai .s_chart .pipeline .col2 .rail__group .rail__items li .icons{ gap: calc(23 / 220 * 100%); margin-top: 12px; }


.replai .s_chart .pipeline .col2 .arrow{ width: calc(95 / 438 * 100%); }
.replai .s_chart .pipeline .col2 .diagram{ position: relative; height: 100%; display: flex; align-items: center; justify-content: center; }
.replai .s_chart .pipeline .col2 .diagram .obj{ position: absolute; display: block; text-align: center; }
.replai .s_chart .pipeline .col2 .diagram .obj em{ display: block; font-size: 14px; letter-spacing: -0.05em; color: #444444; margin-top: 10px; }
.replai .s_chart .pipeline .col2 .diagram .obj._1{ left: calc(27 / 438 * 100%); top: calc(40 / 220 * 100%); }
.replai .s_chart .pipeline .col2 .diagram .obj._2{ left: calc(27 / 438 * 100%); top: calc(150 / 220 * 100%); }
.replai .s_chart .pipeline .col2 .diagram .obj._3{ left: calc(185 / 438 * 100%); top: calc(30 / 220 * 100%); }
.replai .s_chart .pipeline .col2 .diagram .obj._4{ left: calc(336 / 438 * 100%); top: calc(90 / 220 * 100%); }
.replai .s_chart .pipeline .col2 .diagram .ar1{  }
.replai .s_chart .pipeline .col2 .diagram .ar2{ position: absolute; left: calc(278 / 438 * 100%); bottom: calc(170 / 220 * 100%); }
/* width: calc(106 / 438 * 100%); */


.replai .s_chart .pipeline .col3 .arrow{ margin-top: -5px; margin-bottom: -5px; }
.replai .s_chart .pipeline .col3 .rail__group .rail__items li .icons{ gap: calc(30 / 220 * 100%); margin-top: 12px; }

.replai .s_chart .pipeline .col3 .rail__group .rail__items.pink li{ text-align: center; }
.replai .s_chart .pipeline .col3 .rail__group .rail__items.pink li > img{ margin: 0 auto; margin-top: 35px; width: calc(156 / 220 * 100%); padding-bottom: 5px; display: block;  }
.replai .s_chart .pipeline .col3 .rail__group .rail__items.pink li > p{ font-size: 14px; letter-spacing: -0.05em; margin-top: 35px; }


.replai .s_chart .pipeline .col4 .rail__group .rail__items li{ height: 150px; }
.replai .s_chart .pipeline .col4 .rail__group .flex{ height: 100px; align-items: center; justify-content: center; gap: 20px; }
.replai .s_chart .pipeline .col4 .rail__group .flex .bx{ display: flex; align-items: center; justify-content: center; }
.replai .s_chart .pipeline .col4 .rail__group .flex .bx small{ font-size: 14px; letter-spacing: -0.05em; margin: 0 5px; display: block; }
.replai .s_chart .pipeline .col4 .rail__group .rail__items li .icon{ margin-top: 24px; }


.replai .s_chart .pipeline .arr._2 .block{ display: flex; flex-direction: column; justify-content: flex-end; height: 260px; }
.replai .s_chart .pipeline .arr._2 .block .inn{ padding-bottom: 20px; padding-top: 10px; }
.replai .s_chart .pipeline .arr._2 .block .inn b{ font-size: 14px; letter-spacing: -0.05em; text-align: center; display: block; margin: 10px 0; }

.replai .s_chart .pipeline .arr._3{ display: flex; align-items: flex-end; justify-content: center; }


/* 모바일버전 */
.replai .s_chart .pipeline.mob .col1{ width: 100%; display: flex; }
.replai .s_chart .pipeline.mob .col2{ width: 100%; }
.replai .s_chart .pipeline.mob .col3{ width: 100%; }
.replai .s_chart .pipeline.mob .col4{ width: 100%; }
.replai .s_chart .pipeline.mob .arr{ width: 100%; display: flex; }
.replai .s_chart .pipeline.mob .arr .bx{ margin-bottom: 0; width: 33.33%; height: 80px; }
.replai .s_chart .pipeline.mob .arrow > div{ width: 16px; }

.replai .s_chart .pipeline.mob .rail__group{ margin-bottom: 0; width: 100%; }
.replai .s_chart .pipeline.mob .rail__group .rail__items li{ margin-bottom: 0; }

.replai .s_chart .pipeline.mob .col1 .rail__group{ display: block; }
.replai .s_chart .pipeline.mob .col1 .rail__group:nth-of-type(1){ width: calc(120 / 400 * 100%); }
.replai .s_chart .pipeline.mob .col1 .rail__group:nth-of-type(2){ width: calc(280 / 400 * 100%); padding-left: calc(20 / 400 * 100%); box-sizing: border-box; }
.replai .s_chart .pipeline.mob .col1 .rail__group:nth-of-type(2) .rail__items{ display: flex; gap: calc(20 / 280 * 100%); }
.replai .s_chart .pipeline.mob .rail__group .rail__title{ writing-mode: unset; width: auto; font-size: 16px; padding: 14px 10px; box-sizing: border-box; text-align: center; }
.replai .s_chart .pipeline.mob .col1 .rail__group .rail__items{ padding: 0; margin-top: 10px; }
.replai .s_chart .pipeline.mob .rail__group .rail__items li{ height: 102px; }


.replai .s_chart .pipeline.mob .col2 .rail__group{ width: 100%; display: flex; }
.replai .s_chart .pipeline.mob .col2 .rail__group > .rail__items{ width: calc(260 / 400 * 100%); }
.replai .s_chart .pipeline.mob .col2 .rail__group > .rail__items li{ height: 407px; }
.replai .s_chart .pipeline.mob .col2 .rail__group .flex{ display: block; width: calc(140 / 400 * 100%); padding-left: calc(20 / 400 * 100%); box-sizing: border-box; margin-bottom: 0; }
.replai .s_chart .pipeline.mob .col2 .rail__group .flex .rail__items{ width: 100%;}
.replai .s_chart .pipeline.mob .col2 .rail__group .flex .rail__items.rail__items:first-of-type li{ height: 206px; display: block; }
.replai .s_chart .pipeline.mob .col2 .rail__group .rail__items li .icons{ display: block; }
.replai .s_chart .pipeline.mob .col2 .rail__group .rail__items li .icons{ margin-top: 0; }
.replai .s_chart .pipeline.mob .col2 .rail__group .rail__items li .icons .icon{ margin-top: 30px; }
.replai .s_chart .pipeline.mob .col2 .rail__group .flex .rail__items.rail__items:last-of-type li{ height: 120px; align-items: center; justify-content: center;  }
.replai .s_chart .pipeline.mob .col2 .rail__group .flex .rail__items.rail__items:last-of-type li .icons .icon{ margin-top: 0; }
.replai .s_chart .pipeline.mob .col2 .rail__group .flex .arrow{ width: 100%; height: 80px; }
.replai .s_chart .pipeline.mob .col2 .diagram{ width: 100%; max-width: 120px; margin: 0 auto; }
.replai .s_chart .pipeline.mob .col2 .diagram .obj._1{ left: 0; transform: translateX(-50%); top: 30px; }
.replai .s_chart .pipeline.mob .col2 .diagram .obj._2{ left: auto; right: 0; transform: translateX(50%); top: 30px; }
.replai .s_chart .pipeline.mob .col2 .diagram .obj._3{ left: auto; right: 0; transform: translateX(43%); top: 180px; width: 80px; }
.replai .s_chart .pipeline.mob .col2 .diagram .obj._4{ right: auto; left: 0; top: auto; bottom: 25px; width: 75px; }
.replai .s_chart .pipeline.mob .col2 .diagram .ar1{ padding-bottom: 53px; }
.replai .s_chart .pipeline.mob .col2 .diagram .ar2{ left: 100%; top: auto; bottom: 30px; width: 100px; }

.replai .s_chart .pipeline.mob .arr._2 .bx{ padding-left: calc(20 / 400 * 100%); width: calc(140 / 400 * 100%); box-sizing: border-box; }
.replai .s_chart .pipeline.mob .arr._2 .block{ flex-direction: row; align-items: center; justify-content: center; height: auto; width: calc(260 / 400 * 100%); gap: 20px; }
.replai .s_chart .pipeline.mob .arr._2 .block .inn{ display: flex; align-items: center; justify-content: center; padding: 0; gap: 10px; }


.replai .s_chart .pipeline.mob .col3 .rail__group{ display: flex; }
.replai .s_chart .pipeline.mob .col3 .rail__group .rail__items.pink{ width: calc(260 / 400 * 100%); }
.replai .s_chart .pipeline.mob .col3 .rail__group .rail__items.pink li{ height: 220px; }
.replai .s_chart .pipeline.mob .col3 .rail__group .arrow{ width: calc(30 / 400 * 100%); margin-left: -4px; margin-right: -4px; }
.replai .s_chart .pipeline.mob .col3 .rail__group .arrow > div{ width: 30px; }
.replai .s_chart .pipeline.mob .col3 .rail__group .rail__items.purple{ width: calc(120 / 400 * 100%); }
.replai .s_chart .pipeline.mob .col3 .rail__group .rail__items.purple li{ height: 220px; justify-content: flex-start; }
.replai .s_chart .pipeline.mob .col3 .rail__group .rail__items li .icons{ display: block; }
.replai .s_chart .pipeline.mob .col3 .rail__group .rail__items li .icons .icon{ margin-top: 14px; line-height: 1.2; }
.replai .s_chart .pipeline.mob .col3 .rail__group .rail__items.pink li > img{  width: 90%; max-width: 156px; margin: 0 auto; margin-top: 30px; }
.replai .s_chart .pipeline.mob .col3 .rail__group .rail__items.pink li > p{ margin-top: 30px; }

.replai .s_chart .pipeline.mob .arr._3{ justify-content: flex-start; }
.replai .s_chart .pipeline.mob .arr._3 .bx{ width: calc(150 / 400 * 100%); }

.replai .s_chart .pipeline.mob .col4 .rail__group{ display: flex; }
.replai .s_chart .pipeline.mob .col4 .rail__group .rail__items{ width: calc(150 / 400 * 100%); }
.replai .s_chart .pipeline.mob .col4 .rail__group .rail__items li{ height: auto; padding: 27px 0; box-sizing: border-box; }
.replai .s_chart .pipeline.mob .col4 .rail__group .flex{ width: calc(100 / 400 * 100%); flex-direction: column; justify-content: center; align-items: center; }
.replai .s_chart .pipeline.mob .col4 .rail__group .flex .bx{ display: block; width: 100%; }
.replai .s_chart .pipeline.mob .col4 .arrow{ width: 100%; }
.replai .s_chart .pipeline.mob .col4 .arrow > div{ width: calc(50 / 100 * 100%); }
.replai .s_chart .pipeline.mob .col4 .rail__group .flex .bx small{ text-align: center; font-size: 14px; padding: 10px 0; }
.replai .s_chart .pipeline.mob .col4 .rail__group .flex{ height: auto; }


@media screen and (max-width: 1280px){
    .replai .s_chart.pipe .chartArea{ padding: 40px 10px; }
    .replai .s_chart .pipeline .arrow > div{ width: 2.1em; }
    .replai .s_chart .pipeline .rail__group .rail__title{ width: 30px; font-size: 14px; border-radius: 10px; }
    .replai .s_chart .pipeline .arr{ width: calc(62 / 1370 * 100%); }
    .replai .s_chart .pipeline .col2{ width: calc(549 / 1370 * 100%); }

    .replai .s_chart .pipeline .col2 .diagram .obj._1{ left: calc(17 / 438 * 100%); }
    .replai .s_chart .pipeline .col2 .arrow{ width: calc(62 / 438 * 100%); }
    .replai .s_chart .pipeline .col2 .flex .rail__items{ width: calc(240 / 438 * 100%); }
    .replai .s_chart .pipeline .col2 .flex .rail__items.white{ width: calc(135 / 438 * 100%); }
    .replai .s_chart .pipeline .col2 .diagram .ar2{ left: calc(258 / 438 * 100%); }
    .replai .s_chart .pipeline .col4 .arrow > div{ width: 11px; }
}

@media screen and (max-width: 1024px){
    .replai .s_chart .pipeline{ display: none; }
    .replai .s_chart .pipeline.mob{ display: block; }
    .replai .s_chart.pipe .chartArea{ max-width: 440px; margin: 0 auto; padding: 40px 20px; box-sizing: border-box; margin-top: 40px; }
    .replai .s_chart .pipeline .rail__group .rail__items li small{ padding: 0 5px; }
}

@media screen and (max-width: 400px){
    .replai .s_chart .pipeline .col2 .rail__items .diagram .obj img{ height: 25px; }
    .replai .s_chart .pipeline .col2 .rail__items li .icon img{ height: 25px; }
    .replai .s_chart .pipeline .col2 .rail__items .diagram .obj._4 img{ height: 30px; }
    .replai .s_chart .pipeline .col2 .rail__items.white li .icon img{ height: 40px; }
    .replai .s_chart .pipeline.mob .rail__group .rail__title{ font-size: 12px; padding: 10px 0; }
    .replai .s_chart .pipeline .rail__group .rail__items li small{ font-size: 12px; }
    .replai .s_chart .pipeline.mob .col2 .diagram{ max-width: 70px; }
    .replai .s_chart .pipeline.mob .col2 .diagram .obj._1{ top: 40px; }
    .replai .s_chart .pipeline.mob .col2 .diagram .obj._2{ top: 40px; }
    .replai .s_chart .pipeline.mob .col2 .diagram .obj._3{ width: 60px; top: 142px;  }
    .replai .s_chart .pipeline.mob .col2 .diagram .obj._4{ bottom: 30px; width: 45px; }
    .replai .s_chart .pipeline .col2 .diagram .obj em{ font-size: 12px; margin-top: 5px; }
    .replai .s_chart .pipeline .rail__group .rail__items li .icon em{ font-size: 12px; margin-top: 5px; }
    .replai .s_chart .pipeline.mob .rail__group .rail__items li{ padding: 20px 5px; box-sizing: border-box; }
    .replai .s_chart .pipeline.mob .col2 .rail__group .rail__items li .icons .icon{ margin-top: 10px; }
    .replai .s_chart .pipeline.mob .col2 .rail__group .flex .rail__items.rail__items:first-of-type li{ height: 166px;  }
    .replai .s_chart .pipeline.mob .col2 .rail__group .flex .rail__items.rail__items:last-of-type li{ height: 60px; }
    .replai .s_chart .pipeline.mob .col2 .rail__group > .rail__items li{ height: 312px; }
    .replai .s_chart .pipeline.mob .col2 .diagram .ar2{ width: 50px; }
    .replai .s_chart .pipeline .rail__group .rail__items li > strong{ font-size: 12px; }
    .replai .s_chart .pipeline.mob .col3 .rail__group .rail__items.pink li > p{ font-size: 12px; }
    .replai .s_chart .pipeline .rail__group .rail__items li .icon p{ font-size: 12px; }
    .replai .s_chart .pipeline.mob .col4 .rail__group .flex .bx small{ font-size: 12px; }
}