main{overflow: hidden;}
._service{}
._service .s1{padding: 180px 0;box-sizing: border-box;}
._service .s1 .wrap{display: flex;align-items: center;justify-content: center;}


._service .s1 .txtBx{text-align: center;}
._service .s1 .txtBx .top{display: flex;flex-direction: column;align-items: center;gap:35px;}
._service .s1 .txtBx .top ._line{width: 2px;height: 90px;background-color: var(--red);margin: 0 auto;}
._service .s1 .txtBx .top > div{overflow: hidden;}
._service .s1 .txtBx .top span{font-size: 40px;font-weight: 700;color: var(--red);font-family: 'helvetica-lt-pro';display: block;}


._service .s1 .txtBx .center{padding-bottom: 80px;}
._service .s1 .txtBx .center h3{
    font-size: 80px;
    font-weight: 700;
    line-height: 1.2;
    font-family: 'helvetica-lt-pro';
    letter-spacing: -0.03em;
}
._service .s1 .txtBx .center h3 span{
    background-image: linear-gradient(to right, #fff 0%, #4d4d4f 0%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}


._service .s1 .txtBx .bottom > div{padding-bottom: 40px;}
._service .s1 .txtBx .bottom > div:last-child{padding-bottom: 0;}
._service .s1 .txtBx .bottom p{font-size: 20px;font-weight: 500;color: #fff;line-height: 1.3;text-align: center;letter-spacing: -0.025em;}
._service .s1 .txtBx .bottom p span {
    background-image: linear-gradient(to right, #e60021 0%, #fff 0%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 700;
}

._service .s1 .txtBx .bottom p br.br_820{display: none;}

@media screen and (max-width: 1680px) {
    ._service .s1 .txtBx .top span{font-size: clamp(32px, 32 / 1440 * 100vw, 40px);}
    ._service .s1 .txtBx .center h3{font-size: clamp(70px, 70 / 1440 * 100vw, 80px);}
    /* ._service .s1 .txtBx .bottom p{font-size: clamp(22px, 22 / 1440 * 100vw, 24px);} */
}
@media screen and (max-width: 1440px) {
    /* ._service .s1 .txtBx .top{padding-bottom: 50px;} */
    ._service .s1 .txtBx .center h3{font-size: clamp(65px, 65 / 1280 * 100vw, 70px);}
    /* ._service .s1 .txtBx .bottom p{font-size: clamp(20px, 20 / 1280 * 100vw, 22px);} */
}
@media screen and (max-width: 1280px) {
    ._service .s1 .txtBx .center{padding-top: 30px;}
    ._service .s1 .txtBx .top span{font-size: clamp(26px, 26 / 1024 * 100vw, 32px);}
    ._service .s1 .txtBx .center h3{font-size: clamp(55px, 55 / 1024 * 100vw, 65px);}
    ._service .s1 .txtBx .bottom p{font-size: clamp(18px, 18 / 1024 * 100vw, 20px);}
}
@media screen and (max-width: 1024px) {
    ._service .s1{padding: 120px 0;}
    /* ._service .s1 .txtBx .top{padding-bottom: 30px;} */
    ._service .s1 .txtBx .center{padding-bottom: 40px;}
    ._service .s1 .txtBx .center h3{font-size: clamp(40px, 40 / 820 * 100vw, 55px);}
}
@media screen and (max-width: 820px) {
    ._service .s1{padding: 100px 0;}
    ._service .s1 .txtBx .top ._line{height: 60px;}
    ._service .s1 .txtBx .top{gap: 20px;}
    ._service .s1 .txtBx .center {padding-top: 20px;}
    ._service .s1 .txtBx .top span{font-size: clamp(20px, 20 / 500 * 100vw, 26px);}
    ._service .s1 .txtBx .center h3{font-size: clamp(35px, 35 / 500 * 100vw, 40px);}
    ._service .s1 .txtBx .bottom p{font-size: clamp(16px, 16 / 1024 * 100vw, 18px);word-break: keep-all;}
    ._service .s1 .txtBx .bottom p br{display: none;}
    ._service .s1 .txtBx .bottom p br.br_820{display: block;}
}
@media screen and (max-width: 500px) {
    ._service .s1 .txtBx .top span{font-size: clamp(16px, 16 / 360 * 100vw, 20px);}
    /* ._service .s1 .txtBx .center h3{font-size: clamp(24px, 24 / 360 * 100vw, 34px);} */
    ._service .s1 .txtBx .bottom p{font-size: clamp(14px, 14 / 360 * 100vw, 16px);}
    ._service .s1 .txtBx .center h3{font-size: clamp(30px, 30 / 360 * 100vw, 35px);}
}
@media screen and (max-width: 360px) {
    ._service .s1 .txtBx .bottom p br.br_820{display: none;}
    ._service .s1 .txtBx .top ._line {
        height: 40px;
    }
}





._service .s2 .cont .row .wrap{display: flex;align-items: center;justify-content: space-between;padding: 60px 0;box-sizing: border-box;}
._service .s2 .cont .row{border-bottom: 1px solid rgba(255, 255, 255, 0.2);cursor: pointer;transition: background-color 0.25s ease-in-out;}
._service .s2 .cont .row:last-child{border-bottom: none;}
._service .s2 .cont .row .front{opacity: 1;
     /* transition: opacity 0.3s ease-in-out; */
    }
._service .s2 .cont .row .front h2{font-size: 40px;font-weight: 700;color: #fff;font-family: 'helvetica-lt-pro';}
._service .s2 .cont .row .back{}
._service .s2 .cont .row .arrowBx{}
._service .s2 .cont .row:hover{background-color: #fff;}
._service .s2 .cont .row:hover .front h2{color: #000;}
._service .s2 .cont .row .arrowBx i{
    font-size: 50px;
    color: #fff;
    transition: color 0.3s ease-in-out;
}
._service .s2 .cont .back{
    position: absolute;width: 100%;
    display: flex;align-items: flex-end;justify-content: space-between;
    opacity: 0; overflow: hidden;
    /* transition: opacity 0.3s ease-in-out; */
    /* background-color: #fff; */
    padding: 5px;
    box-sizing: border-box;
}
._service .s2 .cont .back .left h3{
    font-size: 35px;
    font-weight: 700;
    color: var(--red);
    font-family: 'helvetica-lt-pro';
    padding-bottom: calc(5/35*1em);
}
._service .s2 .cont .back .left > div{
    display: flex;align-items: center;gap: 10px;
    font-size: 16px;
    font-weight: 400;
    /* color: #000; */
    color: rgba(0, 0, 0, 0.6);
    font-family: 'helvetica-lt-pro';
    padding-top: 25px;
    padding-bottom: calc(5/16*1em);
    flex-wrap: wrap;
}

._service .s2 .cont .back .right{
    font-size: 20px;
    font-weight: 600;
    color: #000;
    line-height: 1.5;
    letter-spacing: -0.04em;
    text-align: right;   
}

@media screen and (max-width: 1680px) {
    ._service .s2 .cont .row .front h2{font-size: clamp(32px, 32 / 1440 * 100vw, 40px);}
    ._service .s2 .cont .row .arrowBx i{font-size: clamp(42px, 42 / 1440 * 100vw, 50px);}

    ._service .s2 .cont .back .left h3{font-size: clamp(28px, 28 / 1440 * 100vw, 35px);}
    ._service .s2 .cont .back .right{font-size: clamp(18px, 18 / 1440 * 100vw, 20px);}
}
@media screen and (max-width: 1440px) {
    ._service .s2 .cont .row .wrap{padding: 40px 0;}
    ._service .s2 .cont .row .front h2{font-size: clamp(26px, 26 / 1280 * 100vw, 32px);}
    ._service .s2 .cont .row .arrowBx i{font-size: clamp(36px, 36 / 1280 * 100vw, 42px);}
    ._service .s2 .cont .back .right{font-size: clamp(16px, 16 / 1280 * 100vw, 18px);}
}
@media screen and (max-width: 1280px) {
    ._service .s2 .cont .back .left > div{font-size: clamp(14px, 14 / 1024 * 100vw, 16px);}
    ._service .s2 .cont .back .right {font-size: clamp(14px, 14 / 1024 * 100vw, 16px);}
}
@media screen and (max-width: 1024px) {
    ._service .s2 .cont .row .front, ._service .s2 .cont .arrowBx{display: none;}
    ._service .s2 .cont .back{position: unset;opacity: 1;}
    ._service .s2 .cont .row .back{flex-direction: column;align-items: flex-start;gap: 20px;}
    ._service .s2 .cont .row .back .right{text-align: left;}
    ._service .s2 .cont .back .left > div {font-size: clamp(16px, 16 / 1024 * 100vw, 18px);}
    ._service .s2 .cont .back .right {font-size: clamp(16px, 16 / 1024 * 100vw, 18px);}
    ._service .s2 .cont .back{max-width: 95%;}

    /* 1024px 이하에서 hover 효과 제거 */
    ._service .s2 .cont .row:hover{background-color: transparent;}
    ._service .s2 .cont .row:hover .front h2{color: #fff;}

    ._service .s2 .cont .back .left > div{color: rgba(255, 255, 255, 0.5);}
    ._service .s2 .cont .back .right{color: #fff;}
}
@media screen and (max-width: 820px) {
    ._service .s2 .cont .back .left h3 {font-size: clamp(24px, 24 / 500 * 100vw, 28px);}
    ._service .s2 .cont .back .left > div {font-size: clamp(14px, 14 / 500 * 100vw, 16px);}
    ._service .s2 .cont .back .right {font-size: clamp(14px, 14 / 500 * 100vw, 16px);}
}
@media screen and (max-width: 500px) {
    ._service .s2 .cont .row .back .right br{display: none;}
}
@media screen and (max-width: 360px) {
    ._service .s2 .cont .back .left h3{font-size: clamp(20px, 20 / 280 * 100vw, 24px);}
}



._service .s3{padding-top: 180px;box-sizing: border-box;}
._service .s3 .cont{display: flex;align-items: flex-start;justify-content: space-between;}
._service .s3 .cont .left{}
._service .s3 .cont .left > div{overflow: hidden;}
._service .s3 .cont .left p{
    font-size: 36px;color: #fff;font-weight: 700;font-family: 'helvetica-lt-pro';
    line-height: 1.3;
}
._service .s3 .cont .left span{
    font-size: 20px;font-weight: 600;color: #aaaaaa;
    line-height: 1.4166666;
    letter-spacing: -0.025em;
    padding-top: 25px;
    display: block;
}
/* ._service .s3 .cont .right{width: 100%;} */
._service .s3 .cont .right .swiperBx{display: flex;gap: 70px;}
._service .s3 .cont .right .swiperBx .swiperGroup{width: 100%;position: relative;}
._service .s3 .cont .right .swiper{max-width: 425px;border-radius: 10px;}
._service .s3 .cont .right .swiper .imgBx{position: relative;width: 100%;border-radius: 10px;overflow: hidden;}
._service .s3 .cont .right .swiper .imgBx::before{
    content: '';display: block;width: 100%;padding-bottom: calc(340/425*100%);
}
._service .s3 .cont .right .swiper .imgBx img{
    position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;
}
._service .s3 .cont .right .swiperBx .swiperGroup .txtArea{
    font-size: 16px;font-weight: 400;color: #fff;
    line-height: 1.625;
    letter-spacing: -0.025em;
    padding-top: 25px;
    text-align: center;
}
._service .s3 .cont .right .swiper.n1{}
._service .s3 .cont .right .swiper.n2{}

.swiper{margin: unset;}

._service .s3 .cont .right .swiperBx .swiperGroup .pagination{
    display: flex;
    gap: 15px;
    /* margin-top: 12px; */
    justify-content: flex-end;
    position: absolute;
    top: -7%;
    right: 0;
}

/* 점 스타일 */
._service .s3 .cont .right .swiperBx .swiperGroup .pagination .swiper-pagination-bullet{
    width:12px; height:12px; border-radius:50%;
    background:rgba(255,255,255,.2); /* 비활성 */
    opacity:1;
    transition:background-color .2s, transform .2s;
}
._service .s3 .cont .right .swiperBx .swiperGroup .pagination .swiper-pagination-bullet-active{
    background:#cccccc; /* 활성 */
}



._service .s4{padding-top: 180px;box-sizing: border-box;}
._service .s4 .cont .titBx{}
._service .s4 .cont .titBx > div{overflow: hidden;}
._service .s4 .cont .titBx p{font-size: 36px;font-weight: 700;color: #fff;font-family: 'helvetica-lt-pro';line-height: 1.3;}
._service .s4 .cont .titBx span{font-size: 20px;font-weight: 600;color: #aaaaaa;
    line-height: 1.3;
    letter-spacing: -0.025em;
    padding-top: 25px;
    display: block;
}

._service .s4 .cont .sponsorBx{display: flex;align-items: flex-start;justify-content: center;gap: 20px;padding-top: 70px;}
._service .s4 .cont .sponsorBx .row{max-width: 385px;width: 100%;border: 1px solid #fff;padding: 60px 40px;box-sizing: border-box;background-color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* gap: 90px; */
    border-radius: 10px;
    min-height: 465px;
}
._service .s4 .cont .sponsorBx .row .imgBx{
    min-height: 5em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
._service .s4 .cont .sponsorBx .row .txtBx{}
._service .s4 .cont .sponsorBx .row .txtBx p{
    font-size: 22px;font-weight: 700;color: #000;padding-top: 90px;
}
._service .s4 .cont .sponsorBx .row .txtBx span{
    font-size: 16px;font-weight: 400;color: #444444;
    line-height: 1.5;
    letter-spacing: -0.025em;
    padding-top: 25px;
    display: block;
    word-break: keep-all;
}
._service .s4 .cont .sponsorBx .row .txtBx span br{display: none;}
/* ._service .s4 .cont .sponsorBx .row .txtBx{
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease-in-out;
} */
._service .s4 .cont .sponsorBx .row .txtBx.active{max-height: 300px;}


._service .s4 .banner{
    padding: 29.5px 0;box-sizing: border-box;
    background-color: var(--red);
    margin-top: 170px;
}
._service .s4 .banner h4{
    font-size: 40px;font-weight: 700;color: #fff;font-family: 'helvetica-lt-pro';
}
._service .s4 .banner > div{display: flex;align-items: center;justify-content: center;gap: 35px;}
._service .s4 .banner .center{position: relative;font-size: 16px;}
._service .s4 .banner .center .txt{
    display: flex;align-items: center;gap: .9em;
    flex-direction: column;
    font-size: 1em;font-weight: 700;color: #fff;font-family: 'helvetica-lt-pro';
    position: absolute;
    top: 50%;left: 50%;transform: translate(-50%, -50%);
    white-space: nowrap;
}
._service .s4 .banner .center img{width: 11.5em;height: 11.5em;animation: rotate 10s linear infinite;}
._service .s4 .banner .center .txt i{font-size: 2.5em;rotate: -35deg;}
._service .s4 .banner .right{display: flex;align-items: center;}

@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(-360deg);
    }
}


@media screen and (max-width: 1680px) {
    ._service .s3 .cont .left p, ._service .s4 .cont .titBx p{
        font-size: clamp(32px, 32 / 1440 * 100vw, 36px);
    }
    /* ._service .s3 .cont{flex-direction: column;} */
    ._service .s3 .cont .left span, ._service .s4 .cont .titBx span{font-size: clamp(18px, 18 / 1440 * 100vw, 20px);}




    ._service .s4 .cont .sponsorBx .row {padding: 40px;min-height: 390px;}
    ._service .s4 .cont .sponsorBx .row .txtBx p{padding-top: 60px;}

    ._service .s4 .banner h4{font-size: clamp(32px, 32 / 1440 * 100vw, 40px);}
}
@media screen and (max-width: 1600px) {
    ._service .s3 .cont .right .swiperBx{gap: 40px;}
    ._service .s3 .cont .right .swiper{max-width: clamp(385px, 385 / 1440 * 100vw, 425px);}
    ._service .s3 .cont .right .swiperBx .swiperGroup .txtArea{word-break: keep-all;}
    ._service .s3 .cont .right .swiperBx .swiperGroup .txtArea{font-size: clamp(14px, 14 / 1440 * 100vw, 16px);}
    /* ._service .s3 .cont .right .swiperBx .swiperGroup .txtArea br{display: none;} */
    ._service .s3 .cont .right .swiperBx .swiperGroup .pagination .swiper-pagination-bullet{width: clamp(10px, 10 / 1440 * 100vw, 12px);height: clamp(10px, 10 / 1440 * 100vw, 12px);}
    ._service .s3 .cont .right .swiperBx .swiperGroup .pagination .swiper-pagination-bullet-active{width: clamp(10px, 10 / 1440 * 100vw, 12px);height: clamp(10px, 10 / 1440 * 100vw, 12px);}
    ._service .s3 .cont .right .swiperBx .swiperGroup .pagination{gap: clamp(10px, 10 / 1440 * 100vw, 15px);}

}
@media screen and (max-width: 1440px) {
    ._service .s3 .cont{flex-direction: column;gap: 100px;}
    ._service .s3 .cont .right .swiper{max-width: clamp(580px, 580 / 1280 * 100vw, 850px);}
    ._service .s3 .cont .right .swiperBx .swiperGroup .txtArea{font-size: 16px;}
    ._service .s3 .cont .right .swiperBx .swiperGroup .pagination{top: -5%;}

    ._service .s3 .cont .right{width: 100%;}
    ._service .s3 .cont .right .swiperBx .swiperGroup .pagination{width: 98.5%;}
    
    ._service .s3 .cont .left p, ._service .s4 .cont .titBx p {
        font-size: clamp(28px, 28 / 1280 * 100vw, 32px);
    }


    ._service .s4 .cont .sponsorBx .row .txtBx p{font-size: clamp(20px, 20 / 1280 * 100vw, 22px);}

    ._service .s4 .cont .sponsorBx .row .imgBx {min-height: 3em;}
    ._service .s4 .cont .sponsorBx .row .imgBx img{max-height: 3em;}



    ._service .s4 .banner .center{font-size: 15px;}
}
@media screen and (max-width: 1280px) {
    ._service .s3 .cont .right .swiper{max-width: clamp(460px, 460 / 1024 * 100vw, 580px);}

    ._service .s3 .cont .left span, ._service .s4 .cont .titBx span {
        font-size: clamp(16px, 16 / 1024 * 100vw, 18px);
    }

    ._service .s4 .cont .sponsorBx .row {padding: 25px;}
    ._service .s4 .cont .sponsorBx .row .imgBx img:not(._height) {max-height: 1.7em;}

    ._service .s4 .banner h4{font-size: clamp(28px, 28 / 1024 * 100vw, 32px);}

}
@media screen and (max-width: 1024px) {
    ._service .s3{padding-top: 120px;}
    ._service .s3 .cont .right .swiperBx .swiperGroup .pagination {width: 95.5%;}
    ._service .s3 .cont .right .swiper{max-width: clamp(350px, 350 / 820 * 100vw, 460px);}
    ._service .s3 .cont .right .swiperBx .swiperGroup .txtArea{font-size: clamp(14px, 14 / 820 * 100vw, 16px);}
    ._service .s3 .cont .right .swiperBx .swiperGroup .pagination .swiper-pagination-bullet{width: clamp(8px, 8 / 820 * 100vw, 10px);height: clamp(8px, 8 / 820 * 100vw, 10px);}
    ._service .s3 .cont .right .swiperBx .swiperGroup .pagination .swiper-pagination-bullet-active{width: clamp(8px, 8 / 820 * 100vw, 10px);height: clamp(8px, 8 / 820 * 100vw, 10px);}
    ._service .s3 .cont .right .swiperBx .swiperGroup .pagination{gap: clamp(8px, 8 / 820 * 100vw, 10px);}


    ._service .s4{padding-top: 120px;}
    ._service .s4 .cont .sponsorBx{flex-wrap: wrap;}
    ._service .s4 .cont .sponsorBx{min-height: unset;}
    ._service .s4 .cont .sponsorBx .row .txtBx{max-height: unset;overflow: visible;}

    ._service .s4 .cont .sponsorBx .row{max-width: unset;
        width: calc((100% - 20px) / 2);
        min-height: 335px;
        padding: 40px;
    }
    ._service .s4 .cont{padding-bottom: 100px;}

}
@media screen and (max-width: 820px) {
    ._service .s3{padding-top: 100px;}
    ._service .s3 .cont .right .swiperBx{flex-direction: column;gap: 80px;}
    ._service .s3 .cont .right .swiper{max-width: unset;}
    ._service .s3 .cont .right .swiperBx .swiperGroup .pagination{width: 100%;}

    /* ._service .s3 .cont .left span, ._service .s4 .cont .titBx span{font-size: clamp(16px, 16 / 820 * 100vw, 18px);} */


    ._service .s4{padding-top: 100px;}
    ._service .s4 .cont .sponsorBx .row{
        /* max-width: unset; */
        width: 100%;
        min-height: unset;
    }


    ._service .s4 .banner > div {flex-direction: column;gap: 10px;}
    ._service .s4 .banner .center {font-size: clamp(13px, 13 / 500 * 100vw, 15px);}
}
@media screen and (max-width: 500px) {
    ._service .s3 .cont .left p, ._service .s4 .cont .titBx p {
        font-size: clamp(24px, 24 / 360 * 100vw, 28px);
    }
    ._service .s3 .cont .left span, ._service .s4 .cont .titBx span{font-size: clamp(14px, 14 / 360 * 100vw, 16px);}
    ._service .s3 .cont .right .swiperBx .swiperGroup .txtArea br{display: none;}


    ._service .s4 .cont .sponsorBx .row .txtBx p{padding-top: 40px;}
    ._service .s4 .cont .sponsorBx .row .imgBx img:not(._height) {
        max-height: 1.4em;
    }
    ._service .s4 .cont .sponsorBx .row .imgBx img {
        max-height: 2.5em;
    }

    ._service .s4 .banner h4{font-size: clamp(24px, 24 / 360 * 100vw, 28px);}
    ._service .s4 .banner .center{font-size: clamp(10px, 10 / 360 * 100vw, 13px);}
    ._service .s4 .banner .right img{width: clamp(42px, 42 / 360 * 100vw, 54px);}
}
@media screen and (max-width: 360px) {
    ._service .s3 .cont .left p, ._service .s4 .cont .titBx p {
        font-size: clamp(22px, 22 / 280 * 100vw, 24px);
    }
    ._service .s1 .txtBx .center h3 {
        font-size: clamp(24px, 24 / 280 * 100vw, 34px);
    }
    ._service .s3 .cont .left span br, ._service .s4 .cont .titBx span br{display: none;}


    ._service .s4 .cont .sponsorBx .row .txtBx p{font-size: clamp(18px, 18 / 280 * 100vw, 20px);}
    ._service .s4 .cont .sponsorBx .row .txtBx span{font-size: clamp(14px, 14 / 280 * 100vw, 16px);}
    ._service .s4 .cont .sponsorBx .row{padding: 25px;}
    ._service .s4 .cont .sponsorBx .row .txtBx p {padding-top: 30px;}


    ._service .s4 .banner h4{font-size: clamp(22px, 22 / 280 * 100vw, 24px);}

}