.sub .s1 .rect {
    background: #f3fbfe;
}
.sub .s1 .txt .tab a.on {
    background: linear-gradient(to left, #5caad8 0%, #74e2c5 100%, #000 100%);
}
.sub .s1 .txt .tab a:not(.on):hover {
    color: #74e2c5;
}

.sap br.all {
    display: block !important;
}
.sap br.pcOnly {
    display: block !important;
}
.sap br.mbOnly {
    display: none !important;
}
@media screen and (max-width: 820px) {
    .sap br.pcOnly {
        display: none !important;
    }
    .sap br.mbOnly._820 {
        display: block !important;
    }
    .sap br._820gone, .sap br._820gone._500, .sap br._820gone._820, br._820gone.all, br._820gone._360 {
        display: none !important;
    }
}
@media screen and (max-width: 500px) {
    .sap br.mbOnly._500 {
        display: block !important;
    }
    .sap br._500gone, .sap br._500gone._500, .sap br._500gone._820, br._500gone.all, br._500gone._360 {
        display: none !important;
    }
}
@media screen and (max-width: 360px) {
    .sap br.mbOnly._360 {
        display: block !important;
    }
    .sap br._360gone, .sap br._360gone._500, .sap br._360gone._820, br._360gone.all {
        display: none !important;
    }
}

.sap .sec_titBx {
    font-family: 'Pretendard';
    font-weight: 700;
    font-size: 48px;
    line-height: calc(64/48*1em);
    letter-spacing: -0.03em;
    color: #222;
    text-align: center;
    padding-bottom: calc(70/48*1em);
    word-break: keep-all;
}
.sap .sec_titBx b {
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(to right, #5caad8 0%, #74e2c5 100%);
}
.sap .sec_titBx span {
    display: inline-block;
    font-size: 22px;
    font-weight: 400;
    letter-spacing: -0.03em;
    color: #555;
    padding-top: calc(30/22*1em);
    line-height: calc(36/22*1em);
}
@media screen and (max-width: 1400px) {
    .sap .sec_titBx {
        font-size: clamp(44px, 48 / 1440 * 100vw, 48px);
    }
}
@media screen and (max-width: 1280px) {
    .sap .sec_titBx {
        font-size: clamp(38px, 44 / 1280 * 100vw, 44px);
    }
    .sap .sec_titBx span {
        font-size: clamp(20px, 22 / 1280 * 100vw, 22px);
    }
}
@media screen and (max-width: 1024px) {
    .sap .sec_titBx {
        font-size: clamp(34px, 38 / 1024 * 100vw, 38px);
    }
    .sap .sec_titBx span {
        font-size: clamp(18px, 20 / 1024 * 100vw, 20px);
        max-width: 500px;
        word-break: keep-all;
    }
    .sap .sec_titBx span br {
        display: none;
    }
}
@media screen and (max-width: 820px) {
    .sap .sec_titBx {
        font-size: clamp(34px, 38 / 820 * 100vw, 38px);
    }
}
@media screen and (max-width: 500px) {
    .sap .sec_titBx {
        font-size: clamp(28px, 34 / 500 * 100vw, 34px);
    }
    .sap .sec_titBx p br {
        display: none;
    }
    .sap .sec_titBx span {
        font-size: clamp(16px, 18 / 1024 * 100vw, 18px);
    }
}
@media screen and (max-width: 360px) {
    .sap .sec_titBx {
        font-size: clamp(20px, 28 / 360 * 100vw, 28px);
    }
}

.sap *:has(> .bg_gradient_obj) {
    position: relative;
}
.sap *:has(> .bg_gradient_obj) > *:not(.bg_gradient_obj) {
    position: relative;
    z-index: 1;
}
.sap .bg_gradient_obj {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
}
.sap .bg_gradient_obj .obj {
    width: 50vw; height: 50vw;
    max-width: 500px;
    max-height: 500px;
    position: absolute;
    border-radius: 50%;
    overflow: hidden;
    filter: blur(100px);
}
.sap .bg_gradient_obj .obj._1 {
    top: 3%; left: -5%;
}
.sap .bg_gradient_obj .obj._2 {
    bottom: 3%; right: -10%;
    transform: translateY(50%);
}
.sap .bg_gradient_obj .obj canvas {
    width: 100%; height: 100%;
    display: block;
}

.solution .s2 {
    background: #f3fbfe;
    --s2_pd: 70px;
    position: relative;
    padding-bottom: 150px;
}
.solution .s2::before {
    content: '';
    display: block;
    width: 100%; height: 3px;
    background: #f3fbfe;
    position: absolute;
    top: 0; left: 0;
    transform: translateY(-50%);
    z-index: 1;
}
.solution .s2 .inner {
    width: 100%;
    display: flex; flex-direction: column; align-items: center;
    padding-top: 50px;
}
.solution .s2 .cont {
    display: flex;
    width: 100%;
}
.solution .s2 .cont .side {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.solution .s2 .cont .side .item {
    position: relative;
    width: calc(300/20*1em); height: calc(130/20*1em);
    background-image: linear-gradient(120deg, #5caad8 0%, #74e2c5 100%);
    border-radius: 24px;
    font-family: 'Pretendard';
    font-size: 20px;
    font-weight: 600;
    letter-spacing: -0.03em;
    color: #555555;
    text-align: center;
    line-height: calc(30/20*1em);
    transition: color 0.4s;
    cursor: pointer;
}
.solution .s2 .cont .side .item::before {
    content: '';
    background: #fff;
    width: 100%; height: 100%;
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%) scaleX(0.985) scaleY(0.97);
    border-radius: 23px;
    transition: opacity 0.4s;
}
.solution .s2 .cont .side .item .item_inner {
    position: relative;
    z-index: 1;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    width: 100%; height: 100%;
    gap: calc(5/20*1em);
}
.solution .s2 .cont .side .item .item_inner .icon {
    width: calc(30/20*1em); height: calc(30/20*1em);
    transition: filter 0.5s;
}
.solution .s2 .cont .side .item .item_inner .icon img {
    transition: filter 0.3s;
}
.solution .s2 .cont .side .item.act {
    color: #fff;
}
.solution .s2 .cont .side .item.act::before {
    opacity: 0;
}
.solution .s2 .cont .side .item.act .item_inner .icon {
    filter: brightness(5);
}
.solution .s2 .cont .side .item.act .item_inner .icon img {
    filter: brightness(0) saturate(100%) invert(1);
}
@media screen and (min-width: 821px) {
    .solution .s2 .cont .side .item:hover {
        color: #fff;
    }
    .solution .s2 .cont .side .item:hover::before {
        opacity: 0;
    }
    .solution .s2 .cont .side .item:hover .item_inner .icon {
        filter: brightness(5);
    }
    .solution .s2 .cont .side .item:hover .item_inner .icon img {
        filter: brightness(0) saturate(100%) invert(1);
    }
}
.solution .s2 .cont .item_viewer {
    flex-grow: 1;
    position: relative;
}
.solution .s2 .cont .item_viewer._mo {
    display: none;
}
.solution .s2 .cont .item_viewer .viewer_inner {
    width: 100%;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    text-align: center;
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    transition: opacity 0.4s;
}
.solution .s2 .cont .item_viewer .viewer_inner.act {
    opacity: 1;
}
.solution .s2 .cont .item_viewer .viewer_tit {
    display: flex; flex-direction: column; align-items: center;
    font-size: 36px;
    padding-bottom: calc(65/36*1em);
}
.solution .s2 .cont .item_viewer .viewer_tit b {
    font-family: 'Pretendard';
    font-weight: 700;
    letter-spacing: -0.045em;
    color: #222;
    padding-bottom: calc(15/36*1em);
}
.solution .s2 .cont .item_viewer .viewer_tit:not(:has(p)) b {
    line-height: 1.4;
    padding-bottom: 0;
}
.solution .s2 .cont .item_viewer .viewer_tit p {
    font-family: 'Pretendard';
    font-size: 18px;
    font-weight: 400;
    letter-spacing: -0.045em;
    color: #555;
}
.solution .s2 .cont .item_viewer .viewer_cont {
    display: flex; flex-direction: column; align-items: center;
}
.solution .s2 .cont .item_viewer .viewer_cont .viewer_item {
    display: flex; flex-direction: column; align-items: center;
}
.solution .s2 .cont .item_viewer .viewer_cont .viewer_item .dot {
    width: 12px; height: 12px;
    background: linear-gradient(to right, #74e2c5 0%, #5caad8 100%);
    border-radius: 50%;
}
.solution .s2 .cont .item_viewer .viewer_cont .viewer_item p {
    font-family: 'Pretendard';
    font-size: 22px;
    font-weight: 500;
    letter-spacing: -0.03em;
    color: #555;
    padding-top: calc(20/22*1em);
    line-height: calc(34/22*1em);
}
.solution .s2 .cont .item_viewer .viewer_cont .viewer_item + .viewer_item {
    margin-top: calc(50/22*1em);
}

@media screen and (max-width: 1440px) {
    .solution .s2 .cont .side .item {
        font-size: clamp(18px, 18 / 1440 * 100vw, 20px);
    }
}
@media screen and (max-width: 1280px) {
    .solution .s2 {
        padding-bottom: 100px;
    }
    .solution .s2 .cont .side .item {
        font-size: clamp(16px, 16 / 1280 * 100vw, 18px);
    }
    .solution .s2 .cont .item_viewer .viewer_inner {
        padding: 0 20px;
        box-sizing: border-box;
    }
    .solution .s2 .cont .item_viewer .viewer_tit {
        font-size: clamp(32px, 32 / 1280 * 100vw, 36px);
    }
    .solution .s2 .cont .item_viewer .viewer_cont .viewer_item p {
        font-size: clamp(18px, 18 / 1280 * 100vw, 22px);
        word-break: keep-all;
    }
    .solution .s2 .cont .item_viewer .viewer_cont .viewer_item p br {
        display: none;
    }
}
@media screen and (max-width: 1024px) {
    .solution .s2 .cont .side .item {
        font-size: clamp(14px, 14 / 1024 * 100vw, 16px);
    }
    .solution .s2 .cont .item_viewer .viewer_inner {
        padding: 0 15px;
    }
    .solution .s2 .cont .item_viewer .viewer_tit {
        font-size: clamp(28px, 28 / 1024 * 100vw, 32px);
    }
    .solution .s2 .cont .item_viewer .viewer_cont .viewer_item p {
        font-size: clamp(16px, 16 / 1024 * 100vw, 18px);
    }
}
@media screen and (max-width: 820px) {
    .solution .s2 .inner {
        padding-top: 30px;
    }
    .solution .s2 .cont {
        flex-direction: column;
    }
    .solution .s2 .cont .side {
        display: none;
        flex-direction: row;
        gap: 10px;
    }
    .solution .s2 .cont .side .item {
        word-break: keep-all;
    }
    .solution .s2 .cont .side .item .item_inner {
        padding: 10px;
        box-sizing: border-box;
    }
    .solution .s2 .cont .side .item .item_inner .txt br {
        display: none;
    }
    /* .solution .s2 .cont .side .item {
        width: calc(150/14*1em); height: calc(65/14*1em);
    } */
    .solution .s2 .cont .item_viewer {
        flex-grow: 0;
        width: 100%;
        /* height: 550px; */
    }
    .solution .s2 .cont .item_viewer._pc {
        display: none;
    }
    .solution .s2 .cont .item_viewer._mo {
        display: block;
    }
    .solution .s2 .cont .item_viewer .viewer_inner {
        max-width: 500px;
        margin: 0 auto;
        height: 100%;
        position: relative;
        opacity: 1;
        transform: none;
        left: 0;
        top: 0;
        align-items: center;
        justify-content: center;
    }
    .solution .s2 .cont .item_viewer .viewer_cont {
        width: 100%;
    }
    .solution .s2 .cont .item_viewer .viewer_tit {
        font-size: clamp(23px, 23 /820 * 100vw, 32px);
        padding-bottom: calc(30/23*1em);
        text-align: center;
    }
    .solution .s2 .cont .item_viewer .viewer_cont .viewer_item {
        gap: 10px;
    }
    .solution .s2 .cont .item_viewer .viewer_cont .viewer_item + .viewer_item {
        margin-top: 20px;
    }
    .solution .s2 .cont .item_viewer .viewer_cont .viewer_item .dot {
        flex-shrink: 0;
    }
    .solution .s2 .cont .item_viewer .viewer_cont .viewer_item p {
        font-size: clamp(14px, 14 /820 * 100vw, 18px);
        padding-top: 0;
    }
    .solution .s2 .cont .item_viewer._mo .swiper-wrapper {
        align-items: stretch;
    }
    .solution .s2 .cont .item_viewer._mo .swiper-slide {
        height: auto;
    }
    .solution .s2 .cont .item_viewer._mo .navi {
        width: 100%;
        display: flex;
        justify-content: space-between;
        padding-top: 20px;
    }
    .solution .s2 .cont .item_viewer._mo .swiper-pagination {
        display: flex; align-items: center;
        gap: 5px;
    }
    .solution .s2 .cont .item_viewer._mo .swiper-pagination .swiper-pagination-bullet {
        display: block;
        width: 10px;
        height: 10px;
        background: #ddd;
        opacity: 1;
        border-radius: 50%;
    }
    .solution .s2 .cont .item_viewer._mo .swiper-pagination .swiper-pagination-bullet-active {
        background: #5caad8;
    }
}
@media screen and (max-width: 500px) {
    .solution .s2 .cont .item_viewer .viewer_tit {
        font-size: clamp(20px, 20 / 500 * 100vw, 23px);
    }
    .solution .s2 .cont .item_viewer .viewer_tit p {
        font-size: clamp(14px, 14 / 500 * 100vw, 16px);
    }
    .solution .s2 .cont .item_viewer .viewer_cont .viewer_item p {
        font-size: clamp(14px, 14 / 500 * 100vw, 16px);
    }
}

.solution .s3 {
    margin-top: 250px;
    padding-bottom: 150px;
}
.solution .s3 .block {
    position: relative;
}
.solution .s3 .block + .block {
    margin-top: 250px;
}
.solution .s3 .block .obj {
    position: absolute;
    width: 50vw; height: 50vw;
    max-width: 500px;
    max-height: 500px;
    border-radius: 50%;
    overflow: hidden;
    filter: blur(150px);
}
.solution .s3 .block._1 .obj {
    top: 50%; left: -10%;
    transform: translateY(-50%);
}
.solution .s3 .block._2 .obj {
    bottom: 0; right: -10%;
    transform: translateY(50%);
}
.solution .s3 .block .obj canvas {
    width: 100%; height: 100%;
    display: block;
}
.solution .s3 .block .wrap {
    display: flex; align-items: center; justify-content: space-between;
    gap: 130px;
    position: relative;
    z-index: 1;
}
.solution .s3 .block .txt {
    flex-shrink: 0;
}
.solution .s3 .block .txt .tit {
    font-family: 'Pretendard';
    font-weight: 700;
    font-size: 48px;
    line-height: calc(64/48*1em);
    letter-spacing: -0.03em;
    color: #222;
    padding-bottom: calc(55/48*1em);
}
.solution .s3 .block .txt .list_txt {
    display: flex; flex-direction: column;
}
.solution .s3 .block .txt .list_txt .item {
    display: flex;
    font-size: 22px;
}
.solution .s3 .block .txt .list_txt .item + .item {
    margin-top: calc(20/22*1em);
}
.solution .s3 .block .txt .list_txt .item .icon {
    display: flex; align-items: center; justify-content: center;
    width: calc(38/22*1em); height: calc(38/22*1em);
    flex-shrink: 0; border-radius: calc(6/22*1em); background: linear-gradient(120deg, #5caad8 0%, #74e2c5 100%);
    overflow: hidden;
}
.solution .s3 .block .txt .list_txt .item dl {
    display: flex; flex-direction: column;
    padding-left: calc(15/22*1em);
}
.solution .s3 .block .txt .list_txt .item dl dt {
    font-family: 'Pretendard';
    font-size: inherit;
    font-weight: 500;
    letter-spacing: -0.03em;
    color: #323232;
    line-height: calc(38/22*1em);
    word-break: keep-all;
}
.solution .s3 .block .txt .list_txt .item dl dd {
    font-family: 'Pretendard';
    font-size: 17px;
    font-weight: 400;
    letter-spacing: -0.03em;
    color: #797979;
    line-height: calc(28/17*1em);
    word-break: keep-all;
}
.solution .s3 .block .img {
    max-width: 50%;
    flex-grow: 1;
    display: flex; align-items: center; justify-content: center;
}
@media screen and (max-width: 1280px) {
    .solution .s3 {
        margin-top: 200px;
    }
    .solution .s3 .block + .block  {
        margin-top: 200px;
    }
    .solution .s3 .block .wrap {
        gap: 40px
    }
    .solution .s3 .block .txt .tit {
        font-size: clamp(38px, 38 / 1280 * 100vw, 48px);
    }
    .solution .s3 .block .txt .list_txt .item {
        font-size: clamp(20px, 20 / 1280 * 100vw, 22px);
    }
}
@media screen and (max-width: 1024px) {
    .solution .s3 {
        margin-top: 150px;
    }
    .solution .s3 .block + .block  {
        margin-top: 150px;
    }
    .solution .s3 .block .txt .tit {
        font-size: clamp(30px, 30 / 1024 * 100vw, 38px);
    }
    .solution .s3 .block .txt .list_txt .item {
        font-size: clamp(18px, 18 / 1024 * 100vw, 20px);
    }
    .solution .s3 .block .txt .list_txt .item dl dd {
        font-size: calc(16/18*1em);
    }
}
@media screen and (max-width: 820px) {
    .solution .s3 {
        margin-top: 100px;
        padding-bottom: 100px;
    }
    .solution .s3 .block + .block {
        margin-top: 100px;
    }
    .solution .s3 .block .wrap {
        flex-direction: column-reverse;
        align-items: flex-start;
    }
    .solution .s3 .block .img {
        width: 100%;
        align-self: flex-end;
        max-width: none;
    }
    .solution .s3 .block._2 .img {
        width: 100%;
        order: 1;
        max-width: none;
    }
}
@media screen and (max-width: 500px) {
    .solution .s3 .block .txt .tit {
        font-size: clamp(25px, 25 / 500 * 100vw, 34px);
        word-break: keep-all;
    }
    .solution .s3 .block .txt .list_txt .item {
        font-size: clamp(16px, 16 / 500 * 100vw, 18px);
    }
    .solution .s3 .block .txt .list_txt .item dl dd {
        font-size: calc(14/16*1em);
        word-break: keep-all;
    }
    .solution .s3 .block .txt .list_txt .item dl dd br {
        display: none;
    }
}
@media screen and (max-width: 360px) {
    .solution .s3 {
        margin-top: 80px;
    }
    .solution .s3 .block + .block {
        margin-top: 70px;
    }
}



.ace_ez .s2 {
    background: #f3fbfe;
    --s2_pd: 70px;
    position: relative;
    padding-bottom: 150px;
}
.ace_ez .s2::before {
    content: '';
    display: block;
    width: 100%; height: 3px;
    background: #f3fbfe;
    position: absolute;
    top: 0; left: 0;
    transform: translateY(-50%);
    z-index: 1;
}
.ace_ez .s2 .inner {
    padding-top: 50px;
    display: flex; align-items: center; justify-content: space-between;
}
.ace_ez .s2 .inner .sec_titBx {
    text-align: left;
}
.ace_ez .s2 .inner .circleWrap {
    position: relative;
    width: 867px;
}
.ace_ez .s2 .inner .circleWrap:before {
    content: '';
    display: block;
    padding-top: calc(810/867*100%);
}
.ace_ez .s2 .inner .circleWrap .small_circle {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: calc(684/810*100%);
    height: calc(684/810*100%);
    animation: rolling_circle 10s infinite linear;
}
.ace_ez .s2 .inner .circleWrap .small_circle img {
    width: 100%; height: 100%;
    object-fit: contain;
}
.ace_ez .s2 .inner .circleWrap .big_circle {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: calc(684/810*100%);
    height: calc(684/810*100%);
    animation: rolling_circle 18s infinite linear;
}
@keyframes rolling_circle {
    0% {
        transform: translate(-50%, -50%) rotate(0deg);
    }
    100% {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}
.ace_ez .s2 .inner .circleWrap .big_circle img {
    width: 100%; height: 100%;
    object-fit: contain;
}
.ace_ez .s2 .inner .circleWrap .txtWrap {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 100%; height: 100%;
}
.ace_ez .s2 .inner .circleWrap .txtWrap b {
    position: absolute;
    left: 50%; top: 50%;
    transform: translate(-50%, -50%);
    font-family: 'Pretendard';
    font-weight: 700;
    font-size: 40px;
    letter-spacing: -0.045em;
    color: #000;
    padding-bottom: calc(20/40*1em);
}
.ace_ez .s2 .inner .circleWrap .txtWrap .item {
    position: absolute;
    left: 50%; top: 50%;
    transform: translate(-50%, -147%) rotate(0deg);
    transform-origin: center 150%;
    width: calc(300/28*1em);
    height: calc(300/28*1em);
    font-family: 'Pretendard';
    font-weight: 700;
    font-size: 28px;
    letter-spacing: -0.03em;
    color: #000;
    padding: 1px;
    box-sizing: border-box;
    border-radius: 50%;
}
.ace_ez .s2 .inner .circleWrap .txtWrap .item::before {
    content: '';
    background: linear-gradient(120deg, #5caad8 0%, #74e2c5 100%);
    width: 100%; height: 100%;
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    transition: .4s;
}
.ace_ez .s2 .inner .circleWrap .txtWrap dl {
    z-index: 1;
    width: 100%; height: 100%;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    text-align: center;
    box-sizing: border-box;
    position: relative;
    background: #fff;
    transition: .4s;
    border-radius: 50%;
}
.ace_ez .s2 .inner .circleWrap .txtWrap dl > * {
    position: relative;
    z-index: 2;
}
.ace_ez .s2 .inner .circleWrap .txtWrap .item:nth-child(2) {
    transform: translate(-50%, -145%) rotate(117deg);
}
.ace_ez .s2 .inner .circleWrap .txtWrap .item:nth-child(2) dl {
    transform: rotate(-117deg);
}
.ace_ez .s2 .inner .circleWrap .txtWrap .item:nth-child(2)::before {
    transform: translate(-50%, -50%) rotate(-117deg);
}
.ace_ez .s2 .inner .circleWrap .txtWrap .item:nth-child(3) {
    transform: translate(-50%, -145%) rotate(243deg);
}
.ace_ez .s2 .inner .circleWrap .txtWrap .item:nth-child(3) dl {
    transform: rotate(-243deg);
}
.ace_ez .s2 .inner .circleWrap .txtWrap .item:nth-child(3)::before {
    transform: translate(-50%, -50%) rotate(-243deg);
}
.ace_ez .s2 .inner .circleWrap .txtWrap dl dt {
    padding-bottom: calc(30/28*1em);
    transition: .4s;
}
.ace_ez .s2 .inner .circleWrap .txtWrap dl dd {
    font-family: 'Pretendard';
    font-size: 18px;
    line-height: calc(32/18*1em);
    letter-spacing: -0.03em;
    color: #555;
    transition: .4s;
}

.ace_ez .s2 .inner .circleWrap .txtWrap .item.act dl {
    background: transparent;
}
.ace_ez .s2 .inner .circleWrap .txtWrap .item.act dl dt {
    color: #fff;
}
.ace_ez .s2 .inner .circleWrap .txtWrap .item.act dl dd {
    color: #fff;
}
@media screen and (max-width: 1440px) {
    .ace_ez .s2 {
        padding-bottom: 120px;
    }
    .ace_ez .s2 .inner .circleWrap {
        width: 680px;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap b {
        font-size: 35px;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap .item {
        font-size: 23px;
    }
}
@media screen and (max-width: 1280px) {
    .ace_ez .s2 {
        padding-bottom: 80px;
    }
    .ace_ez .s2 .inner .circleWrap {
        width: 580px;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap b {
        font-size: 30px;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap .item {
        font-size: 20px;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap dl dd {
        font-size: 16px;
    }
}
@media screen and (max-width: 1024px) {
    .ace_ez .s2 .inner .circleWrap {
        width: 480px;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap b {
        font-size: 25px;
        padding-bottom: 0;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap .item {
        font-size: 17px;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap dl dd {
        font-size: 14px;
    }
}
@media screen and (max-width: 820px) {
    .ace_ez .s2 .inner {
        flex-direction: column;
        padding-top: 30px;
    }
    .ace_ez .s2 .inner .sec_titBx {
        text-align: center;
    }
    .ace_ez .s2 .inner .circleWrap {
        margin-top: 50px;
        width: 100%;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap b {
        font-size: clamp(20px, 30 / 820 * 100vw, 30px);
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap .item {
        font-size: clamp(16px, 23 / 820 * 100vw, 23px);
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap dl dd {
        font-size: clamp(14px, 18 / 820 * 100vw, 18px);
    }
}
@media screen and (max-width: 500px) {
    .ace_ez .s2 .inner {
        padding-top: 0;
    }
    .ace_ez .s2 .inner .circleWrap {
        margin-top: 0;
    }
    .ace_ez .s2 .inner .circleWrap::before {
        display: none;
    }
    .ace_ez .s2 .inner .circleWrap .small_circle {
        display: none;
    }
    .ace_ez .s2 .inner .circleWrap .big_circle {
        display: none;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap {
        position: relative;
        transform: none;
        top: 0; left: 0;
        display: flex; flex-direction: column; align-items: center;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap b {
        position: relative;
        left: 0; top: 0;
        transform: none;
        padding-bottom: calc(30/30*1em);
        font-size: clamp(20px, 30 / 500 * 100vw, 30px);
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap .item {
        position: relative;
        transform: none;
        left: 0; top: 0;
        transform-origin: center 150%;
        width: 100%;
        height: calc(270/30*1em);
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap .item::before {
        transform: translate(-50%, -50%) rotate(0deg) !important;
        border-radius: 20px !important;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap .item + .item {
        margin-top: calc(20/30*1em);
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap .item:nth-child(2) {
        transform: none;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap .item:nth-child(2) dl {
        transform: none;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap .item:nth-child(3) {
        transform: none;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap .item:nth-child(3) dl {
        transform: none;
    }
    .ace_ez .s2 .inner .circleWrap .txtWrap dl {
        border-radius: 19px;
    }
}


.ace_ez .s3 {
    margin-top: 250px;
    padding-bottom: 150px;
}
.ace_ez .s3 .cont {
    display: flex; flex-direction: column;
    gap: 30px;
}
.ace_ez .s3 .cont .block {
    display: flex; justify-content: space-between; align-items: center;
    position: relative;
}
.ace_ez .s3 .cont .block > *:not(.dots) {
    flex: 1;
}
.ace_ez .s3 .cont .block .gray {
    display: flex; justify-content: flex-end;
}
.ace_ez .s3 .cont .block .gray p {
    display: flex; align-items: center;
    background: #f2f7f8;
    border-radius: calc(22/20*1em);
    width: calc(520/20*1em);
    height: calc(200/20*1em);
    font-family: 'Pretendard';
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.03em;
    color: #555;
    line-height: calc(34/20*1em);
    padding: calc(15/20*1em) calc(40/20*1em);
    box-sizing: border-box;
}
.ace_ez .s3 .cont .block .dots {
    padding: 0 40px;
    display: flex;
    gap: 3px;
}
.ace_ez .s3 .cont .block .dots div {
    width: 8px; height: 8px;
    background: linear-gradient(139deg, #5caad8 0%, #74e2c5 100%);
    border-radius: 50%;
}
.ace_ez .s3 .cont .block .dots div:nth-child(1) {
    animation: dot_ani 1.7s infinite;
}
.ace_ez .s3 .cont .block .dots div:nth-child(2) {
    animation: dot_ani 1.7s .3s infinite;
}
.ace_ez .s3 .cont .block .dots div:nth-child(3) {
    animation: dot_ani 1.7s .6s infinite;
}
@keyframes dot_ani {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
.ace_ez .s3 .cont .block .color .color_inner {
    font-size: 30px;
    background: linear-gradient(120deg, #5caad8 0%, #74e2c5 100%);
    border-radius: calc(22/30*1em);
    box-sizing: border-box;
    width: calc(580/30*1em);
    height: calc(300/30*1em);
    position: relative;
    padding: 1px;
}
.ace_ez .s3 .cont .block .color .color_inner .color_cont {
    display: block;
    width: 100%; height: 100%;
    background: #fff;
    border-radius: calc(21/30*1em);
    transition: .4s;
    position: relative;
    height: 100%;
    padding: calc(15/30*1em) calc(50/30*1em);
    box-sizing: border-box;
}
.ace_ez .s3 .cont .block .color .color_cont .icon {
    width: calc(50/30*1em); height: calc(50/30*1em);
    position: absolute;
    top: calc(70/30*1em); right: calc(65/30*1em);
    transform: translate(50%, -50%);
    transition: .4s;
}
.ace_ez .s3 .cont .block .color .color_cont .icon img {
    width: 100%; height: 100%;
    object-fit: contain;
    transition: .4s;
}
.ace_ez .s3 .cont .block .color .color_cont dl {
    height: 100%;
    display: flex; flex-direction: column; justify-content: center;
}
.ace_ez .s3 .cont .block .color .color_cont dl dt {
    font-family: 'Pretendard';
    font-weight: 700;
    font-size: inherit;
    letter-spacing: -0.03em;
    color: #fff;
    padding-bottom: calc(30/30*1em);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(to right, #5caad8 0%, #74e2c5 100%);
    /* transition: .4s; */
}
.ace_ez .s3 .cont .block .color .color_cont dl dd {
    display: flex;
    flex-direction: column;
    gap: calc(5/30*1em);
}
.ace_ez .s3 .cont .block .color .color_cont dl dd .item {
    display: flex;
    align-items: flex-start;
    gap: calc(10/20*1em);
    line-height: calc(30/20*1em);
    font-family: 'Pretendard';
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.03em;
    color: #222;
    transition: .4s;
    word-break: keep-all;
}
.ace_ez .s3 .cont .block .color .color_cont dl dd .item > span {
    transform: translateY(calc(-2/20*1em));
}

.ace_ez .s3 .cont .block .color .color_inner.act .color_cont {
    background: transparent;
}
.ace_ez .s3 .cont .block .color .color_inner.act dl dd .item {
    color: #fff;
}
.ace_ez .s3 .cont .block .color .color_inner.act .icon {
    filter: brightness(5);
}
.ace_ez .s3 .cont .block .color .color_inner.act .icon img {
    filter: brightness(0) saturate(100%) invert(1);
}
@media screen and (max-width: 1440px) {
    .ace_ez .s3 .cont .block .color .color_inner {
        font-size: clamp(25px, 30 / 1440 * 100vw, 30px);
    }
    .ace_ez .s3 .cont .block .color .color_cont dl dd .item {
        font-size: calc(20/30*1em);
    }
}
@media screen and (max-width: 1280px) {
    .ace_ez .s3 {
        margin-top: 180px;
    }
    .ace_ez .s3 .cont .block .gray p {
        font-size: clamp(18px, 20 / 1280 * 100vw, 20px);
    }
    .ace_ez .s3 .cont .block .dots {
        padding: 0 15px;
    }
    .ace_ez .s3 .cont .block .color .color_inner {
        font-size: clamp(23px, 25 / 1280 * 100vw, 25px);
    }
}
@media screen and (max-width: 1024px) {
    .ace_ez .s3 {
        margin-top: 120px;
        padding-bottom: ;
    }
    .ace_ez .s3 .cont {
        align-items: center;
        gap: 60px;
    }
    .ace_ez .s3 .cont .block {
        flex-direction: column;
        align-items: center;
        gap: 15px;
        width: 100%;
        max-width: 600px
    }
    .ace_ez .s3 .cont .block > :not(.dots) {
        width: 100%;
    }
    .ace_ez .s3 .cont .block .gray p {
        justify-content: center;
        text-align: center;
        width: 100%;
        font-size: clamp(16px, 18 / 1024 * 100vw, 18px);
    }
    .ace_ez .s3 .cont .block .dots {
        flex-direction: column;
    }
    .ace_ez .s3 .cont .block .color .color_inner {
        /* font-size: clamp(20px, 23 / 1024 * 100vw, 23px); */
        height: auto;
        width: 100%;
    }
    .ace_ez .s3 .cont .block .color .color_inner .color_cont {
        padding: calc(40/30*1em) calc(45/30*1em);
    }
}
@media screen and (max-width: 820px) {
    .ace_ez .s3 {
        padding-bottom: 100px;
    }
    .ace_ez .s3 .cont .block .gray p {
        font-size: clamp(16px, 20 / 820 * 100vw, 20px);
    }
    .ace_ez .s3 .cont .block .color .color_inner {
        font-size: clamp(22px, 25 / 820 * 100vw, 25px);
    }
}
@media screen and (max-width: 500px) {
    .ace_ez .s3 .cont .block .gray p {
        font-size: clamp(14px, 16 / 500 * 100vw, 16px);
        padding: calc(30/14*1em);
        word-break: keep-all;
    }
    .ace_ez .s3 .cont .block .dots div {
        width: 5px; height: 5px;
    }
    .ace_ez .s3 .cont .block .color .color_inner {
        font-size: clamp(20px, 22 / 500 * 100vw, 22px);
        word-break: keep-all;;
    }
    .ace_ez .s3 .cont .block .color .color_inner .icon {
        display: none;
    }
}
@media screen and (max-width: 360px) {
    .ace_ez .s3 {
        margin-top: 100px;
        padding-bottom: 80px;
    }
    .ace_ez .s3 .cont {
        gap: 30px;
    }
    .ace_ez .s3 .cont .block .gray p br {
        display: none;
    }
    .ace_ez .s3 .cont .block .color .color_inner {
        font-size: clamp(18px, 20 / 360 * 100vw, 20px);
    }
    .ace_ez .s3 .cont .block .color .color_inner dl dt {
        line-height: 1.4;
    }
}

.ace_ez .s4 {
    background: #f3fbfe;
    position: relative;
    z-index: 1;
    padding: 150px 0;
}
.ace_ez .s4 .change {
    position: relative;
    user-select: none;
}
.ace_ez .s4 .changeBox {
    position: relative;
    /* overflow: hidden; */
}
.ace_ez .s4 .changeBox::before {
    content: '';
    display: block;
    padding-bottom: calc(488/1440*100%);
}
.ace_ez .s4 .changeBox .before, .ace_ez .s4 .changeBox .after {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
}
.ace_ez .s4 .changeBox .before img, .ace_ez .s4 .changeBox .after img {
    width: 100%; height: 100%;
    object-fit: contain;
}
.ace_ez .s4 .changeBox .before img.mb, .ace_ez .s4 .changeBox .after img.mb {
    display: none;
}
.ace_ez .s4 .changeBox .after {
    z-index: 1;
    clip-path: inset(0 0 0 50%);  /* 기본값: 왼쪽 50%부터 보임 */
}
.ace_ez .s4 .changeBox .line {
    position: absolute;
    top: 0;
    left: 50%;  /* 기본값: 중앙 */
    transform: translateX(-50%);
    width: 3px; height: calc(530/488*100%);
    background: linear-gradient(to top, #5caad8 0%, #74e2c5 100%);
    z-index: 2;
    pointer-events: none;
}
.ace_ez .s4 .controlBox {
    position: relative;
    padding-top: 20px;
}
.ace_ez .s4 .controlBox .controler {
    position: absolute;
    top: 20px;
    left: 50%;  /* 기본값: 중앙 */
    border-radius: 50%;
    width: calc(60/18*1em); height: calc(60/18*1em);
    background: linear-gradient(to right, #5caad8 0%, #74e2c5 100%);
    transform: translateX(-50%);
    cursor: grab;
    z-index: 3;
    font-size: 18px;
}
.ace_ez .s4 .controlBox .controler:active {
    cursor: grabbing;
}
.ace_ez .s4 .controlBox .controler .arrWrap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%; height: 100%;
    gap: calc(5/18*1em);
    font-size: inherit;
    letter-spacing: -0.045em;
    color: #fff;
}
@media screen and (max-width: 1280px) {
    .ace_ez .s4 {
        padding: 120px 0;
    }
    .ace_ez .s4 .controlBox .controler {
        font-size: clamp(16px, 18 / 1280 * 100vw, 18px);
    }
}
@media screen and (max-width: 1024px) {
    .ace_ez .s4 {
        padding: 100px 0;
    }
    .ace_ez .s4 .controlBox .controler {
        font-size: clamp(14px, 16 / 1024 * 100vw, 16px);
    }
}
@media screen and (max-width: 820px) {
    .ace_ez .s4 {
        padding: 80px 0;
    }
    .ace_ez .s4 .controlBox .controler {
        font-size: clamp(12px, 14 / 820 * 100vw, 14px);
    }
    .ace_ez .s4 .change {
        max-width: calc(500/820*100vw);
        margin: 0 auto;
    }
    .ace_ez .s4 .changeBox::before {
        display: none;
    }
    .ace_ez .s4 .changeBox .before {
        position: relative;
    }
    .ace_ez .s4 .changeBox .before img.pc, .ace_ez .s4 .changeBox .after img.pc {
        display: none;
    }
    .ace_ez .s4 .changeBox .before img.mb, .ace_ez .s4 .changeBox .after img.mb {
        display: block;
    }
    .ace_ez .s4 .changeBox .line {
        height: calc(515/488*100%);
    }
}
@media screen and (max-width: 500px) {
    .ace_ez .s4 {
        padding: 60px 0;
    }
    .ace_ez .s4 .controlBox .controler {
        font-size: clamp(10px, 12 / 500 * 100vw, 12px);
    }
    .ace_ez .s4 .change {
        max-width: calc(350/500*100vw);
        margin: 0 auto;
    } 
}
@media screen and (max-width: 360px) {
    .ace_ez .s4 .change {
        max-width: calc(300/360*100vw);
        margin: 0 auto;
    } 
    .ace_ez .s4 .changeBox .line {
        height: calc(545/488*100%);
    }
}

.ace_ez .s5 {
    margin-top: 150px;
    margin-bottom: 150px;
}
.ace_ez .s5 .inner + .inner {
    margin-top: 250px;
}
.ace_ez .s5 .inner .top {
    display: flex;
    justify-content: center;
    gap: calc(53/1440*100%);
}
.ace_ez .s5 .inner .top .item {
    width: calc(320/20*1em); height: calc(170/20*1em);
    border-radius: calc(22/20*1em);
    font-family: 'Pretendard';
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: #222;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-align: center;
    background: linear-gradient(to right, #f3f3f3 0%, #f3f3f3 100%);
    transition: background .4s, color .4s;
}
.ace_ez .s5 .inner .top .item b {
    padding-bottom: calc(15/20*1em);
}
.ace_ez .s5 .inner .top .item p {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: -0.03em;
    color: #555;
    line-height: calc(24/16*1em);
    transition: .4s;
}
@media screen and (min-width: 821px) {
    .ace_ez .s5 .inner .top .item:hover {
        color: #fff;
    }
    .ace_ez .s5 .inner .top .item:hover p {
        color: #fff;
    }
}
.ace_ez .s5 .inner .bottom {
    margin: 0 auto;
    margin-top: 65px;
}
.ace_ez .s5 .inner._1 .bottom svg {
    width: 100%;
}
.ace_ez .s5 .inner._2 .bottom {
    max-width: 1230px;
}
.ace_ez .s5 .inner._2 .cont .bottom .chart_tit {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.ace_ez .s5 .inner._2 .cont .bottom .chart_tit b {
    font-family: 'Pretendard';
    font-weight:600;
    font-size: 40px;
    letter-spacing: -0.03em;
    color: #222;
    padding-bottom: calc(15/40*1em);
}
.ace_ez .s5 .inner._2 .cont .bottom .chart_tit .selectBox {
    pointer-events: none;
    position: absolute; right: 0; top: 0;
    align-items: center;
    border: 2px solid #ccc;
    border-radius: calc(30/16*1em);
    box-sizing: border-box;
    cursor: pointer;
    display: flex;
    font-family: 'Pretendard';
    font-weight: 500;
    font-size: 20px;
    letter-spacing: -0.045em;
    color: #666;
    padding: calc(12/20*1em) calc(27/20*1em);
    width: calc(210/20*1em);
}
.ace_ez .s5 .inner._2 .cont .bottom .chart_tit .selectBox input {
    background: none;
    border: none;
    color: inherit;
    cursor: pointer;
    font-size: inherit;
    letter-spacing: inherit;
    padding: 0;
    width: 100%;
}
.ace_ez .s5 .inner._2 .cont .bottom .chart_tit .selectBox i {
    align-items: center;
    display: flex;
    font-size: calc(18/20*1em);
    justify-content: center;
    transition: .4s;
}
.ace_ez .s5 .inner._2 .cont .bottom .chart_tit .selectBox.active i {
    transform: scaleY(-1);
}
.ace_ez .s5 .inner._2 .cont .bottom .chart_tit .selectBox .optWrap {
    cursor: pointer;
    display: none;
    left: 0;
    padding-bottom: 10px;
    padding-top: 2px;
    position: absolute;
    text-align: center;
    top: 100%;
    width: 100%;
}
.ace_ez .s5 .inner._2 .cont .bottom .chart_tit .selectBox .optWrap ul {
    background: #dfdede;
    border-radius: calc(7/16*1em);
    max-height: 150px;
    overflow-y: auto;
    padding: 5px 0;
    width: 100%;
}
.ace_ez .s5 .inner._2 .cont .bottom .chart_tit .selectBox .optWrap ul::-webkit-scrollbar {
    width: 2px;
}
.ace_ez .s5 .inner._2 .cont .bottom .chart_tit .selectBox .optWrap ul::-webkit-scrollbar-thumb {
    background: #f6ad3c;
    border-radius: 10px;
}
.ace_ez .s5 .inner._2 .cont .bottom .chart_tit .selectBox .optWrap ul li span {
    align-items: center;
    cursor: pointer;
    display: flex;
    font-size: calc(14/16*1em);
    justify-content: center;
    padding: calc(11/14*1em) 0;
    transition: .4s;
    width: 100%;
}
.ace_ez .s5 .inner._2 .cont .bottom .chart_tit .selectBox .optWrap ul li:hover span {
    background: #aaa;
}
.ace_ez .s5 .inner._2 .cont .bottom .chart {
    height: 540px;
    margin-top: 40px;
}
@media screen and (max-width: 1440px) {
    .ace_ez .s5 .inner._2 .cont .bottom .chart {
        height: calc(540/1440*100vw);
    }
    .ace_ez .s5 .inner + .inner {
        margin-top: 200px;
    }
}
@media screen and (max-width: 1280px) {
    .ace_ez .s5 .inner + .inner {
        margin-top: 120px;
    }
    .ace_ez .s5 .inner .top {
        gap: 20px
    }
    .ace_ez .s5 .inner .top .item {
        padding: 0 calc(15/20*1em);
    }
    .ace_ez .s5 .inner .top .item p {
        word-break: keep-all;
    }
    .ace_ez .s5 .inner .top .item p br{
        display: none;
    }
}
@media screen and (max-width: 1024px) {
    .ace_ez .s5 {
        margin-top: 120px;
        margin-bottom: 120px;
    }
    .ace_ez .s5 .inner._2 .cont .bottom .chart {
        height: 400px;
    }
    .ace_ez .s5 .inner._2 .cont .bottom .chart_tit b {
        font-size: clamp(36px, 40 / 1024 * 100vw, 40px);
    }
    .ace_ez .s5 .inner._2 .cont .bottom .chart_tit .selectBox {
        font-size: clamp(16px, 20 / 1024 * 100vw, 20px);
    }
}
@media screen and (max-width: 820px) {
    .ace_ez .s5 .inner .top {
        flex-wrap: wrap;
    }
    .ace_ez .s5 .inner .top .item {
        width: calc(100% / 2 - 10px);
        box-sizing: border-box;
    }
    .ace_ez .s5 .inner .top .item {
        font-size: clamp(18px, 20 / 820 * 100vw, 20px);
        padding: 0 calc(20/20*1em);
    }
    .ace_ez .s5 .inner._1 .bottom {
        overflow-x: auto;
    }
    .ace_ez .s5 .inner._1 .bottom svg {
        width: calc(1280/820*100vw);
    }
    .ace_ez .s5 .inner._2 .cont .bottom .chart_tit {
        flex-direction: column;
        align-items: center;
    }
    .ace_ez .s5 .inner._2 .cont .bottom .chart_tit b {
        font-size: clamp(28px, 36 / 820 * 100vw, 36px);
    }
    .ace_ez .s5 .inner._2 .cont .bottom .chart_tit .selectBox {
        position: relative;
        right: auto;
        top: auto;
        margin-top: 10px;
        font-size: clamp(14px, 16 / 820 * 100vw, 16px);
    }
    .ace_ez .s5 .inner._2 .cont .bottom .chart {
        height: 300px;
        margin-top: 30px;
    }
}
@media screen and (max-width: 500px) {
    .ace_ez .s5 {
        margin-top: 80px;
        margin-bottom: 80px;
    }
    .ace_ez .s5 .inner + .inner {
        margin-top: 80px;
    }
    .ace_ez .s5 .inner .top {
        flex-direction: column;
    }
    .ace_ez .s5 .inner .top .item {
        width: 100%;
    }
    .ace_ez .s5 .inner .top .item p {
        font-size: clamp(14px, 16 / 500 * 100vw, 16px);
    }
    .ace_ez .s5 .inner._1 .bottom svg {
        width: calc(1024/500*100vw);
    }
    .ace_ez .s5 .inner._2 .cont .bottom .chart {
        height: 250px;
        margin-top: 20px;
    }
}
@media screen and (max-width: 360px) {
    .ace_ez .s5 .inner._2 .cont .bottom .chart_tit {
        text-align: center;
    }
    .ace_ez .s5 .inner._2 .cont .bottom .chart_tit b {
        font-size: clamp(24px, 28 / 360 * 100vw, 28px);
    }
    .ace_ez .s5 .inner._2 .cont .bottom .chart {
        height: 280px;
    }
}


.qsa .s2 {
    background: #f3fbfe;
    --s2_pd: 70px;
    position: relative;
    padding-top: 50px;
    padding-bottom: 100px;
}
.qsa .s2::before {
    content: '';
    display: block;
    width: 100%; height: 3px;
    background: #f3fbfe;
    position: absolute;
    top: 0; left: 0;
    transform: translateY(-50%);
    z-index: 1;
}
.qsa .s2 .inner {
    position: relative;
    z-index: 1;
}
@media screen and (max-width: 820px) {
    .qsa .s2 {
        padding-top: 30px;
        padding-bottom: 80px;
    }
}



.qsa .ace_ez .s3 .cont .block .gray p {
    flex-direction: column; align-items: flex-start; justify-content: center;
}
.qsa .ace_ez .s3 .cont .block .gray p span {
    display: flex;
    align-items: flex-start;
    gap: calc(10 / 20 * 1em);
    text-align: left;
}
.qsa .ace_ez .s3 .cont .block .gray p span::before {
    content: '‣';
    transform: translateY(calc(-2/20*1em));
}
.qsa .ace_ez .s3 .cont .block > * > * {
    position: relative;
}
.qsa .ace_ez .s3 .cont .block > * > * > em {
    position: absolute;
    top: 100%; left: 50%;
    transform: translateX(-50%);
}
.qsa .ace_ez .s3 .cont .block .gray p em {
    font-family: 'Pretendard';
    font-weight: bold;
    font-size: 20px;
    letter-spacing: -0.03em;
    color: #666;
    padding-top: calc(30/20*1em);
}
.qsa .ace_ez .s3 .cont .block .color .color_cont dl dt {
    line-height: calc(44/30*1em);
    padding-bottom: calc(25/30*1em);
}
.qsa .ace_ez .s3 .cont .block .color .color_inner em {
    font-family: 'Pretendard';
    font-weight: bold;
    font-size: 30px;
    letter-spacing: -0.03em;
    color: #222;
    padding-top: calc(30/30*1em);
}
@media screen and (max-width: 1024px) {
    .qsa .ace_ez .s3 .cont .block > * > * > em {
        display: none;
    }
}

.qsa .s4 {
    margin-top: 250px;
    padding-bottom: 150px;
}
.qsa .bg_gradient_obj .obj._2 {
    bottom: 35%;
}
.qsa .s4 .inner .block {
    display: flex; align-items: center;
}
.qsa .s4 .inner .block:nth-child(even) {
    flex-direction: row-reverse;
}
.qsa .s4 .inner .block + .block {
    margin-top: 250px;
}
.qsa .s4 .inner .block .txt {
    width: 50%;
    word-break: keep-all;
}
.qsa .s4 .inner .block .txt dl {
    display: flex; flex-direction: column;
}
.qsa .s4 .inner .block .txt dl dt {
    font-family: 'Pretendard';
    font-weight: 700;
    font-size: 48px;
    line-height: calc(64/48*1em);
    letter-spacing: -0.03em;
    color: #222;
    padding-bottom: calc(20/48*1em);
}
.qsa .s4 .inner .block .txt dl dd {
    font-family: 'Pretendard';
    font-weight: 500;
    font-size: 22px;
    line-height: calc(36/22*1em);
    letter-spacing: -0.03em;
    color: #555;
    padding-bottom: calc(60/22*1em);
}
.qsa .s4 .inner .block .txt .txtList {
    display: flex; flex-direction: column;
}
.qsa .s4 .inner .block .txt .txtList p {
    font-family: 'Pretendard';
    font-size: 20px;
    line-height: calc(34/20*1em);
    letter-spacing: -0.03em;
    color: #555;
    display: flex;
    align-items: flex-start;
    gap: calc(10 / 20 * 1em);
}
.qsa .s4 .inner .block .txt .txtList p::before {
    content: '‣';
    transform: translateY(calc(-2/20*1em));
}
@media screen and (max-width: 1440px) {
    .qsa .s4{
        margin-top: 150px;
    }
    .qsa .s4 .inner .block .txt {
        width: 70%;
    }
}
@media screen and (max-width: 1280px) {
    .qsa .s4 {
        margin-top: 100px;
    }
    .qsa .s4 .inner .block .txt {
        width: 95%;
    }
    .qsa .s4 .inner .block .txt dl dt {
        font-size: clamp(38px, 48 / 1280 * 100vw, 48px);
    }
    .qsa .s4 .inner .block .txt dl dd {
        font-size: clamp(18px, 20 / 1280 * 100vw, 20px);
    }
    .qsa .s4 .inner .block .txt .txtList p {
        font-size: clamp(16px, 18 / 1280 * 100vw, 18px);
    }
    .qsa .s4 .inner .block + .block {
        margin-top: 180px;
    }
}
@media screen and (max-width: 1024px) {
    .qsa .s4 {
        margin-top: 50px;
    }
    .qsa .s4 .inner .block + .block {
        margin-top: 120px;
    }
    .qsa .s4 .inner .block .txt dl dt {
        font-size: clamp(30px, 38 / 1024 * 100vw, 38px);
    }
    .qsa .s4 .inner .block .txt dl dd {
        font-size: clamp(16px, 18 / 1024 * 100vw, 18px);
    }
    .qsa .s4 .inner .block .txt dl dd p br {
        display: none;
    }
    .qsa .s4 .inner .block .txt .txtList p br {
        display: none;
    }
}
@media screen and (max-width: 820px) {
    .qsa .s4 .inner .block {
        flex-direction: column !important;
        gap: 40px;
    }
    .qsa .s4 .inner .block:nth-child(3) {
        gap: 20px
    }
    .qsa .s4 .inner .block + .block {
        margin-top: 100px;
    }
    .qsa .s4 .inner .block .txt {
        z-index: 1;
    }
    .qsa .s4 .inner .block:nth-child(1) .img {
        transform: translateX(15%);
    }
    .qsa .s4 .inner .block:nth-child(2) .img {
        transform: translateX(-5%);
    }
    .qsa .s4 .inner .block:nth-child(3) .img {
        transform: translateX(10%);
    }
}
@media screen and (max-width: 500px) {
    .qsa .s4 {
        margin-top: 0px;
        padding-bottom: 100px;
    }
    .qsa .s4 .inner .block + .block {
        margin-top: 80px;
    }
    .qsa .s4 .inner .block .txt dl dt {
        font-size: clamp(28px, 30 / 500 * 100vw, 30px);
    }
    .qsa .s4 .inner .block .txt dl dd {
        font-size: clamp(14px, 16 / 500 * 100vw, 16px);
    }
    .qsa .s4 .inner .block .txt .txtList p {
        font-size: clamp(14px, 16 / 500 * 100vw, 16px);
    }
}
@media screen and (max-width: 360px) {
    .qsa .s4 .inner .block + .block {
        margin-top: 60px;
    }
    .qsa .s4 .inner .block .txt dl dt {
        font-size: clamp(22px, 28 / 360 * 100vw, 28px);
    }
}

.conversion .sub.digital {
    overflow: visible;
}
.conversion .sub.digital .s2 {
    background: #f3fbfe;
    --s2_pd: 70px;
    position: relative;
    padding-bottom: 150px;
}
.conversion .sub.digital .s2::before {
    content: '';
    display: block;
    width: 100%; height: 3px;
    background: #f3fbfe;
    position: absolute;
    top: 0; left: 0;
    transform: translateY(-50%);
    z-index: 1;
}
.conversion .sub.digital .s2 .efflist li {
    padding: 2px;
    background: linear-gradient(120deg, #5caad8, #74e2c5);
}
.conversion .sub.digital .s2 .efflist li.on {
    background: linear-gradient(120deg, #74e2c5, #5caad8);
}
.conversion .sub.digital .s2 .efflist li .inn dl dt {
    display: inline-block;
}
.conversion .sub.digital .s2 .iconList ul {
    padding-top: 70px;
    display: flex;
    justify-content: space-between;
}
.conversion .sub.digital .s2 .iconList ul li {
    display: flex; flex-direction: column; align-items: center;
    font-size: 18px;
    text-align: center;
}
.conversion .sub.digital .s2 .iconList ul li .icon {
    width: 160px; height: 160px;
    background: #dcf1f9;
    border-radius: 50%;
    overflow: hidden;
    position: relative;
}
.conversion .sub.digital .s2 .iconList ul li .icon img {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    object-fit: contain;
}
.conversion .sub.digital .s2 .iconList ul li span {
    font-family: 'Pretendard';
    font-weight: 600;
    font-size: inherit;
    line-height: calc(24 / 18*1em);
    color: #222;
    padding-top: calc(20/18*1em);
}
.conversion .s2 .plusWrap {
    display: flex; align-items: center;
    background: #dcf1f9;
    border-radius: calc(46/18*1em);
    margin-top: calc(44/18*1em);
    padding: 0 calc(30/18*1em);
    font-size: 18px;
}
.conversion .s2 .plusWrap .item:has(p) {
    width: 100%;
    flex: 1;
}
.conversion .s2 .plusWrap .item p {
    font-family: 'Pretendard';
    font-weight: 500;
    font-size: inherit;
    line-height: calc(24/18*1em);
    letter-spacing: -0.03em;
    color: #222;
    text-align: center;
}
.conversion .s2 .plusWrap .item span {
    font-size: calc(30/18*1em);
    display: flex;
    align-items: center; justify-content: center;
    width: calc(92/30*1em); height: calc(92/30*1em);
    border-radius: 50%;
    background: #a4dae0;
    color: #fff;
}
@media screen and (max-width: 1440px) {
    .conversion .sub.digital .s2 .iconList ul li .icon {
        width: calc(160/1440*100vw);
        height: calc(160/1440*100vw);
    }
    .conversion .sub.digital .s2 .iconList ul li .icon img {
        width: calc(65/140*100%);
    }
}
@media screen and (max-width: 1280px) {
    .conversion .s2 .plusWrap {
        font-size: clamp(16px, 18/1280*100vw, 18px);
    }
}
@media screen and (max-width: 1024px) {
    .conversion .sub.digital .s2 {
        padding-bottom: 100px;
    }
    .conversion .sub.digital .s2 .iconList ul {
        padding-top: 30px;
    }
    .conversion .sub.digital .s2 .iconList ul li {
        font-size:  16px;
    }
    .conversion .s2 .plusWrap .item span {
        font-size: calc(25/18*1em);
    }
}
@media screen and (max-width: 820px) {
    .conversion .sub.digital .s2 .efflist ul li {
        width: calc(50% - 5px);
    }
    .conversion .sub.digital .s2 .iconList ul {
        padding-top: 50px;
        flex-wrap: wrap;
        gap: 30px 10px;
    }
    .conversion .sub.digital .s2 .iconList ul li {
        font-size: clamp(16px, 18 / 820 * 100vw, 18px);
        width: calc(100% / 4 - (10px * 3 / 4));
    }
    .conversion .s2 .plusWrap {
        font-size: clamp(16px, 18 / 820 * 100vw, 18px);
        flex-direction: column; align-items: center;
        padding: calc(30/18*1em);
        gap: calc(20/18*1em);
    }
    .conversion .s2 .plusWrap .item:has(p) {
        flex: auto;
        width: 100%;
        padding: calc(25/18*1em) 0;
        background: #f3fbfe;
        border-radius: 22px;
    }
    .conversion .s2 .plusWrap .item span {
        font-size: calc(20/18*1em);
    }
}
@media screen and (max-width: 500px) {
    .conversion .sub.digital .s2 .efflist ul {
        gap: 10px 5px
    }
    .conversion .sub.digital .s2 .efflist li .inn {
        height: 250px;
    }
    .conversion .sub.digital .s2 .iconList ul li {
        font-size: clamp(14px, 16 / 500 * 100vw, 16px);
        word-break: keep-all;
    }
    .conversion .sub.digital .s2 .iconList ul li .icon {
        width: calc(70/16*1em); height: calc(70/16*1em);
    }
    .conversion .s2 .plusWrap {
        font-size: clamp(14px, 16 / 500 * 100vw, 16px);
    }
}
@media screen and (max-width: 360px) {
    .conversion .sub.digital .s2 .iconList ul {
        padding-top: 30px;
    }
    .conversion .sub.digital .s2 .iconList ul li {
        font-size: clamp(12px, 14 / 360 * 100vw, 14px);
    }
    .conversion .sub.digital .s2 .efflist ul {
        max-width: 100%;
        flex-direction: column;
    }
    .conversion .sub.digital .s2 .efflist ul li {
        width: 100%;
    }
    .conversion .sub.digital .s2 .efflist li .inn {
        width: 100%;
        height: auto;
    }
    .conversion .sub.digital .s2 .efflist li .inn > p {
        padding-top: calc(10/14*1em);
    }
}

.conversion .s3 {
    margin: 250px 0;
}
.conversion .s3 .swiperBox .swiper {
    overflow: visible;
}
.conversion .s3 .swiperBox .swiper-slide {
    padding: calc(50/36*1em) calc(65/36*1em);
    border: 1px solid #dddddd;
    border-radius: calc(25/36*1em);
    background: #fff;
    font-size: 36px;
    box-sizing: border-box;
    word-break: keep-all;
    height: auto;
}
.conversion .s3 .swiperBox .swiper-slide .title {
    display: flex; align-items: flex-start; justify-content: space-between;
    padding-bottom: calc(30/36*1em);
}
.conversion .s3 .swiperBox .swiper-slide .title p {
    font-family: 'Pretendard';
    font-weight: 700;
    font-size: inherit;
    line-height: 1.4;
    letter-spacing: -0.03em;
    color: #222;
    padding-right: 1em;
}
.conversion .s3 .swiperBox .swiper-slide .title .star {
    display: flex; align-items: center;
    font-family: 'Pretendard';
    font-weight: 500;
    font-size: calc(30/36*1em);
    letter-spacing: -0.045em;
    line-height: calc(50/30*1em);
}
.conversion .s3 .swiperBox .swiper-slide .title .star span {
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(to left, #5caad8 0%, #74e2c5 100%);
}
.conversion .s3 .swiperBox .swiper-slide .subTitle {
    font-family: 'Pretendard';
    font-weight: 600;
    font-size: 24px;
    line-height: 1.4;
    letter-spacing: -0.03em;
    color:  #010101;
    padding-bottom: calc(35/24*1em);
}
.conversion .s3 .swiperBox .swiper-slide .txt {
    font-family: 'Pretendard';
    font-weight: 500;
    font-size: 20px;
    line-height: calc(32/20*1em);
    letter-spacing: -0.03em;
    color: #555;
}
.conversion .s3 .swiperBox .pageWrap {
    padding-top: 70px;
    display: flex; flex-direction: column;
    align-items: center;
}
.conversion .s3 .swiperBox .pageWrap .progress {
    width: 100%; height: 4px;
    max-width: 550px;
    background: #e8e8e8;
    border-radius: calc(2/4*1em);
    overflow: hidden;
}
.conversion .s3 .swiperBox .pageWrap .progress .bar {
    height: 100%;
    background: #222;
    border-radius: calc(2/4*1em);
}
.conversion .s3 .navi {
    display: flex; align-items: center; justify-content: center;
    gap: 20px;
    padding-top: 30px;
    font-size: 30px;
}
.conversion .s3 .navi .arr {
    font-size: calc(24/30*1em);
    color: #222222;
    letter-spacing: -0.045em;
    cursor: pointer;
    transition: opacity 0.3s ease;
}
.conversion .s3 .navi .arr:hover {
    opacity: 0.6;
}
.conversion .s3 .navi .swiper-pagination {
    position: static;
    width: auto;
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: 'Pretendard';
    font-size: inherit;
    font-weight: 700;
    letter-spacing: -0.03em;
    padding-bottom: calc(5/30*1em);
}
.conversion .s3 .navi .swiper-pagination .fraction-current {
    color: #222;
    width: calc(37/30*1em);
    text-align: center;
}
.conversion .s3 .navi .swiper-pagination .fraction-divider {
    color: #d8e2e5;
    text-align: center;
}
.conversion .s3 .navi .swiper-pagination .fraction-total {
    color: #d8e2e5;
    width: calc(37/30*1em);
    text-align: center;
}
@media screen and (max-width: 1440px) {
    .conversion .s3 {
        margin: 200px 0;
    }
    .conversion .s3 .swiperBox .swiper-slide {
        font-size: clamp(33px, 36 / 1440 * 100vw, 36px);
    }
    .conversion .s3 .swiperBox .swiper-slide .txt {
        font-size: clamp(18px, 20 / 1440 * 100vw, 20px);
    }
}
@media screen and (max-width: 1280px) {
    .conversion .s3 {
        margin: 150px 0;
    }
    .conversion .s3 .swiperBox .swiper-slide {
        font-size: clamp(30px, 33 / 1280 * 100vw, 33px);
    }
    .conversion .s3 .swiperBox .swiper-slide .txt br {
        display: none;
    }
}
@media screen and (max-width: 1024px) {
    .conversion .s3 .swiperBox .swiper-slide {
        font-size: clamp(25px, 30 / 1024 * 100vw, 30px);
    }
    .conversion .s3 .swiperBox .swiper-slide .subTitle {
        font-size: clamp(22px, 24 / 1024 * 100vw, 24px);
    }
    .conversion .s3 .swiperBox .pageWrap {
        padding-top: 40px;
    }
    .conversion .s3 .navi {
        font-size: clamp(24px, 28 / 1024 * 100vw, 28px);
    }
}
@media screen and (max-width: 820px) {
    .conversion .s3 {
        margin: 100px 0;
    }
    .conversion .s3 .swiperBox .swiper-slide {
        font-size: clamp(25px, 30 / 820 * 100vw, 30px);
        padding: calc(40/36*1em) calc(50/36*1em);
    }
}
@media screen and (max-width: 500px) {
    .conversion .s3 .swiperBox .swiper-slide {
        font-size: clamp(18px, 25 / 500 * 100vw, 25px);
        padding: calc(30/30*1em) calc(40/30*1em);
    }
    .conversion .s3 .swiperBox .swiper-slide .title {
        flex-direction: column-reverse;
        gap: 10px;
    }
    .conversion .s3 .swiperBox .swiper-slide .title p {
        padding-right: 0;
    }
    .conversion .s3 .swiperBox .swiper-slide .title .star {
        align-self: center;
    }
    .conversion .s3 .swiperBox .swiper-slide .subTitle {
        font-size: clamp(16px, 22 / 500 * 100vw, 22px);
    }
    .conversion .s3 .swiperBox .swiper-slide .txt {
        font-size: clamp(14px, 18 / 500 * 100vw, 18px);
    }
    .conversion .s3 .navi {
        font-size: clamp(20px, 24 / 500 * 100vw, 24px);
    }
}
@media screen and (max-width: 360px) {
    .conversion .s3 {
        margin: 80px 0;
    }
    /* .conversion .s3 .swiperBox .swiper-slide {
        font-size: clamp(20px, 22 / 360 * 100vw, 22px);
    } */
    /* .conversion .s3 .swiperBox .swiper-slide .subTitle {
        font-size: clamp(16px, 18 / 360 * 100vw, 18px);
    } */
    /* .conversion .s3 .swiperBox .swiper-slide .txt {
        font-size: clamp(14px, 16 / 360 * 100vw, 16px);
    } */
}


.conversion .s4 .inner {
    display: flex; justify-content: space-between;
    padding-bottom: 250px;
}
.conversion .s4 .inner .sec_titBx {
    flex-shrink: 0;
    text-align: left;
    margin-right: calc(40/30*1em);
}
.conversion .s4 .inner .blockWrap {
    width: 100%;
    max-width: 800px;
}
.conversion .s4 .inner .blockWrap .block {
    font-size: 30px;
    margin-bottom: calc(68/30*1em);
    box-sizing: border-box;
    display: flex;
}
.conversion .s4 .inner .blockWrap .block + .block {
    padding-top: calc(68/30*1em);
    border-top: 1px solid #dddddd;
}
.conversion .s4 .inner .blockWrap .block dt {
    width: calc(325/30*1em);
    flex-shrink: 0;
    font-family: 'Pretendard';
    font-weight: 700;
    font-size: inherit;
    line-height: calc(44/30*1em);
    letter-spacing: -0.03em;
    color: #222;
}
.conversion .s4 .inner .blockWrap .block dd {
    display: flex; flex-direction: column;
    font-size: 22px;
    font-weight: 500;
    font-family: 'Pretendard';
    letter-spacing: -0.03em;
    color: #555;
    word-break: keep-all;
}
.conversion .s4 .inner .blockWrap .block dd p {
    display: flex;
    align-items: flex-start;
    gap: calc(10/22*1em);
    line-height: calc(36/22*1em);
}
.conversion .s4 .inner .blockWrap .block dd p::before {
    content: '‣';
    transform: translateY(calc(-2/22*1em));
}
@media screen and (max-width: 1440px) {
    .conversion .s4 .inner .blockWrap {
        width: auto;
        max-width: none;
    }
    .conversion .s4 .inner .blockWrap .block {
        font-size: clamp(24px, 30 / 1440 * 100vw, 30px);
    }
    .conversion .s4 .inner .blockWrap .block dd {
        font-size: clamp(20px, 22 / 1440 * 100vw, 22px);
    }
}
@media screen and (max-width: 1280px) {
    .conversion .s4 .inner {
        padding-bottom: 180px;
    }
    .conversion .s4 .inner .blockWrap .block dd {
        font-size: clamp(18px, 20 / 1280 * 100vw, 20px);
    }
}
@media screen and (max-width: 1024px) {
    .conversion .s4 .inner {
        padding-bottom: 80px;
    }
    .conversion .s4 .inner .blockWrap {
        width: 50%;
    }
    .conversion .s4 .inner .blockWrap .block {
        flex-direction: column;
    }
    .conversion .s4 .inner .blockWrap .block dt {
        width: 100%;
        margin-bottom: calc(20/30*1em);
    }
}
@media screen and (max-width: 820px) {
    .conversion .s4 .inner {
        flex-direction: column;
    }
    .conversion .s4 .inner .blockWrap {
        width: 100%;
    }
}
@media screen and (max-width: 500px) {
    .conversion .s4 .inner .blockWrap .block {
        font-size: clamp(20px, 22 / 500 * 100vw, 22px);
    }
    .conversion .s4 .inner .blockWrap .block dd {
        font-size: clamp(16px, 18 / 500 * 100vw, 18px);
    }
}
@media screen and (max-width: 360px) {
    .conversion .s4 .inner {
        padding-bottom: 60px;
    }
    .conversion .s4 .inner .blockWrap .block {
        font-size: clamp(18px, 20 / 360 * 100vw, 20px);
    }
    .conversion .s4 .inner .blockWrap .block dd {
        font-size: clamp(14px, 16 / 360 * 100vw, 16px);
    }
}


.conversion .s5 {
    padding-bottom: 150px;
}
.conversion .s5 .inner .cont {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    background: #f7f7f7;
    padding: 65px;
    box-sizing: border-box;
    border-radius: 22px;
}
.conversion .s5 .inner .cont .img {
    width: 100%;
}
.conversion .s5 .inner .cont .img img {
    width: 100%;
    object-fit: contain;
}
@media screen and (max-width: 1024px) {
    .conversion .s5 .inner .cont {
        padding: 40px;
    }
}
@media screen and (max-width: 820px) {
    .conversion .s5 {
        padding-bottom: 100px;
    }
    .conversion .s5 .inner .cont {
        padding: 30px;
        overflow-x: auto;
    }
    .conversion .s5 .inner .cont .img {
        width: calc(1024/820*100vw);
    }
}
@media screen and (max-width: 500px) {
    .conversion .s5 .inner .cont .img {
        width: 800px;
    }
}
@media screen and (max-width: 360px) {
    .conversion .s5 .inner .cont .img {
        width: 650px;
    }
}



.ito .s2 {
    background: #f3fbfe;
    --s2_pd: 70px;
    position: relative;
    padding-top: 50px;
    padding-bottom: 150px;
}
.ito .s2::before {
    content: '';
    display: block;
    width: 100%; height: 3px;
    background: #f3fbfe;
    position: absolute;
    top: 0; left: 0;
    transform: translateY(-50%);
    z-index: 1;
}
.ito .s2 .inner .cont {
    width: 100%;
    display: flex; align-items: center; justify-content: center;
}
.ito .s2 .inner .cont .img {
    mix-blend-mode: darken;
}
.ito .s2 .inner .cont .mo {
    display: none;
}
@media screen and (max-width: 1440px) {
    .ito .s2 .inner .cont .img {
        width: calc(1200/1440*100vw);
    }
}
@media screen and (max-width: 1024px) {
    .ito .s2 {
        padding-bottom: 100px;
    }
}
@media screen and (max-width: 820px) {
    .ito .s2 {
        padding-top: 0px;
    }
    .ito .s2 .inner .cont .img {
        display: flex; justify-content: center;
    }
    .ito .s2 .inner .cont .pc {
        display: none;
    }
    .ito .s2 .inner .cont .mo {
        display: block;
    }
}
@media screen and (max-width: 500px) {
    .ito .s2 {
        padding-bottom: 80px;
    }
}
@media screen and (max-width: 360px) {
    .ito .s2 {
        padding-bottom: 60px;
    }
}

.ito .s3 {
    margin-top: 250px;
}
.ito .s3 .inner {
    display: flex; flex-direction: column; align-items: center;
}
.ito .s3 .circleWrap {
    position: relative;
    display: inline-flex; align-items: center; justify-content: center;
    gap: calc(40/24*1em);
    font-size: 24px;
    padding: calc(30/24*1em);
    box-sizing: border-box;
    border-radius: calc(155/24*1em);
    background: #eff9fa;
}
.ito .s3 .circleWrap .circleItem {
    width: calc(250/24*1em);
    height: calc(250/24*1em);
    border-radius: 50%;
    background: linear-gradient(to left, #5caad8 0%, #74e2c5 100%);
    display: flex; align-items: center; justify-content: center;
    position: relative;
    padding: calc(25/24*1em);
    box-sizing: border-box;
}
.ito .s3 .circleWrap .circleItem .innerCircle {
    background-image: url('/asset/img/sub/sap/ito/s3_circle.png');
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
}
.ito .s3 .circleWrap .circleItem .innerCircle p {
    font-family: 'Pretendard';
    font-weight: 600;
    font-size: inherit;
    letter-spacing: -0.03em;
    color: #222;
    line-height: calc(32/24*1em);
    text-align: center;
}
@media screen and (max-width: 1280px) {
    .ito .s3 {
        margin-top: 180px;
    }
    .ito .s3 .circleWrap {
        font-size: clamp(20px, 24 / 1280 * 100vw, 24px);
    }
}
@media screen and (max-width: 1024px) {
    .ito .s3 {
        margin-top: 120px;
    }
    .ito .s3 .circleWrap {
        font-size: clamp(16px, 20 / 1024 * 100vw, 20px);
        gap: calc(30/24*1em)
    }
}
@media screen and (max-width: 820px) {
    .ito .s3 {
        margin-top: 100px;
    }
    .ito .s3 .circleWrap {
        flex-wrap: wrap;
        width: 90%;
        max-width: 500px;
        font-size: clamp(18px, 20 / 820 * 100vw, 20px);
    }
    .ito .s3 .circleWrap .circleItem {
        width: calc(100% / 2 - (30/24*1em / 2));
        position: relative;
        height: auto;
    }
    .ito .s3 .circleWrap .circleItem::before {
        content: '';
        display: block;
        padding-top: 100%;
    }
    .ito .s3 .circleWrap .circleItem .innerCircle {
        position: absolute;
        top: 50%; left: 50%;
        transform: translate(-50%, -50%);
        width: 90%;
    }
}
@media screen and (max-width: 500px) {
    .ito .s3 .circleWrap {
        width: 100%;
        max-width: none;
        border-radius: 50px;
        font-size: clamp(16px, 18 / 500 * 100vw, 18px);
    }
}


.ito .s4 {
    margin: 250px 0;
}
.ito .s4 .cont {
    width: 100%;
    display: flex; align-items: center; justify-content: center;
}
.ito .s4 .circleWrap {
    position: relative;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 28px;
    width: calc(685/28*1em); height: calc(545/28*1em);
    margin-bottom: 117px;
}
.ito .s4 .circleWrap .centerCircle {
    width: calc(280/28*1em); height: calc(280/28*1em);
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
}
.ito .s4 .circleWrap .centerCircle::before {
    content: '';
    display: block;
    width: 100%; height: 100%;
    background: linear-gradient(to left, #5caad8 0%, #74e2c5 100%);
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%) scale(1.05);
    border-radius: 50%;
    z-index: -1;
    filter: blur(calc(20/28*1em));
}
.ito .s4 .circleWrap .centerCircle p {
    width: 100%; height: 100%;
    border-radius: 50%;
    background: #fff;
    display: flex; align-items: center; justify-content: center;
    text-align: center;
    box-sizing: border-box;
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    font-family: 'Pretendard';
    font-weight: 700;
    font-size: inherit;
    letter-spacing: -0.03em;
    color: #222;
    line-height: calc(36/28*1em);
    text-align: center;
}
.ito .s4 .circleWrap .outerCircle {
    width: calc(540/28*1em); height: calc(540/28*1em);
    border-radius: 50%;
    border: 1px solid #ddd;
    position: relative;
    display: flex; align-items: center; justify-content: center;
}
.ito .s4 .circleWrap .outerCircle .item {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    height: 100%;
    display: flex; justify-content: center; align-items: flex-start;
}
.ito .s4 .circleWrap .outerCircle .item .inner {
    width: calc(150/20*1em); height: calc(150/20*1em);
    background: #f1f7f8;
    border-radius: 50%;
    transform: translateY(-50%);
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    font-size: calc(20/28*1em);
    font-family: 'Pretendard';
    font-weight: 700;
    letter-spacing: -0.03em;
    color: #222;
    text-align: center;
}
.ito .s4 .circleWrap .outerCircle .item:nth-child(1) {
    transform: translate(-50%, -50%) rotate(-50deg);
}
.ito .s4 .circleWrap .outerCircle .item:nth-child(1) .inner {
    transform: translateY(-50%) rotate(50deg);
}
.ito .s4 .circleWrap .outerCircle .item:nth-child(2) {
    transform: translate(-50%, -50%) rotate(90deg);
}
.ito .s4 .circleWrap .outerCircle .item:nth-child(2) .inner {
    transform: translateY(-50%) rotate(-90deg);
}
.ito .s4 .circleWrap .outerCircle .item:nth-child(3) {
    transform: translate(-50%, -50%) rotate(210deg);
}
.ito .s4 .circleWrap .outerCircle .item:nth-child(3) .inner {
    transform: translateY(-50%) rotate(-210deg);
}
.ito .s4 .circleWrap .outerCircle .item .inner > span {
    padding-top: calc(5/20*1em);
}
.ito .s4 .circleWrap .outerCircle .item .txt {
    position: absolute;
    white-space: nowrap;
    font-family: 'Pretendard';
    font-weight: 500;
    font-size: 18px;
    letter-spacing: -0.03em;
    color: #555;
    line-height: calc(28/20*1em);
    text-align: center;
}
.ito .s4 .circleWrap .outerCircle .item:nth-child(1) .txt {
    right: 100%; top: 50%;
    transform: translateY(-50%);
    text-align: right;
    padding-right: calc(30/20*1em);
}
.ito .s4 .circleWrap .outerCircle .item:nth-child(2) .txt {
    left: 100%; top: 50%;
    transform: translateY(-50%);
    text-align: left;
    padding-left: calc(30/20*1em);
}
.ito .s4 .circleWrap .outerCircle .item:nth-child(3) .txt {
    left: 50%; top: 100%;
    transform: translateX(-50%);
    text-align: center;
    padding-top: calc(30/20*1em);
}
.ito .s4 .circleWrap .outerCircle .item .tag {
    display: flex; align-items: center;
    font-size: 18px;
    padding-top: calc(15/18*1em);
}
.ito .s4 .circleWrap .outerCircle .item .tag span {
    font-family: 'Pretendard';
    font-weight: 600;
    font-size: inherit;
    letter-spacing: -0.03em;
    color: #222;
    text-align: center;
    padding: calc(7/18*1em) calc(25/18*1em);
    border: 1px solid #ddd;
    border-radius: calc(7/18*1em);
}
.ito .s4 .circleWrap .outerCircle .item .tag em {
    display: flex; align-items: center;justify-content: center;
    width: calc(45/18*1em);
    color: #56c3f9;
}
.ito .s4 .circleWrap .outerCircle .item .tag em i:nth-child(1) {
    transform: translateX(calc(8/18*1em));
}
.ito .s4 .circleWrap .outerCircle .item .tag em i:nth-child(3) {
    transform: translateX(calc(-8/18*1em));
}
@media screen and (max-width: 1440px) {
    .ito .s4 .circleWrap {
        font-size: clamp(20px, 26 / 1440 * 100vw, 26px);
    }
    .ito .s4 .circleWrap .outerCircle .item .txt {
        font-size: clamp(16px, 18 / 1440 * 100vw, 18px);
    }
    .ito .s4 .circleWrap .outerCircle .item .tag {
        font-size: clamp(16px, 18 / 1440 * 100vw, 18px);
    }
}
@media screen and (max-width: 1280px) {
    .ito .s4 {
        margin: 150px 0;
    }
    .ito .s4 .circleWrap {
        font-size: clamp(18px, 20 / 1280 * 100vw, 20px);
    }
    .ito .s4 .circleWrap .outerCircle .item .txt {
        font-size: clamp(14px, 16 / 1280 * 100vw, 16px);
    }
    .ito .s4 .circleWrap .outerCircle .item .tag {
        font-size: clamp(14px, 16 / 1280 * 100vw, 16px);
    }
}
@media screen and (max-width: 1024px) {
    .ito .s4 {
        margin: 120px 0;
    }
    .ito .s4 .circleWrap {
        font-size: clamp(16px, 18 / 1024 * 100vw, 18px);
        flex-direction: column; align-items: center;
        height: auto;
        gap: calc(30/18*1em);
        margin-bottom: 0;
    }
    .ito .s4 .circleWrap .centerCircle {
        position: relative;
        top: 0; left: 0;
        transform: none !important;
        flex-shrink: 0;
    }
    .ito .s4 .circleWrap .outerCircle {
        flex-direction: column;
        border: none;
        gap: calc(30/18*1em);
        height: auto;
    }
    .ito .s4 .circleWrap .outerCircle .item {
        position: relative;
        top: 0; left: 0;
        transform: none !important;
    }
    .ito .s4 .circleWrap .outerCircle .item .inner {
        transform: none !important;
        width: calc(180/20*1em); height: calc(180/20*1em);
    }
    .ito .s4 .circleWrap .outerCircle .item:nth-child(3) .txt {
        top: 50%; right: 100%; left: auto;
        transform: translateY(-50%) translateX(0);
        padding-top: 0;
        padding-right: calc(30/18*1em);
    }
}
@media screen and (max-width: 820px) {
    .ito .s4 .circleWrap {
        width: 100%;
        max-width: 600px;
        font-size: clamp(20px, 24 / 820 * 100vw, 24px);
        margin-bottom: 0;
    }
    .ito .s4 .circleWrap .outerCircle {
        width: 100%;
    }
    .ito .s4 .circleWrap .outerCircle .item {
        width: 100%; height: auto;
    }
    .ito .s4 .circleWrap .outerCircle .item .inner {
        width: 100%; height: auto;
        border-radius: 20px;
        padding: calc(30/18*1em);
        gap: calc(10/18*1em);
        font-size: inherit;
    }
    .ito .s4 .circleWrap .outerCircle .item .txt {
        position: relative;
        top: 0 !important; left: 0 !important; right: auto !important;
        transform: none !important;
        text-align: center !important;
        padding: 0 !important;
        font-size: clamp(18px, 20 / 820 * 100vw, 20px);
        display: flex; flex-direction: column; align-items: center;
    }
    .ito .s4 .circleWrap .outerCircle .item .tag {
        font-size: clamp(16px, 18 / 820 * 100vw, 18px);
    }
}
@media screen and (max-width: 500px) {
    .ito .s4 .circleWrap .outerCircle .item {
        box-sizing: border-box;
    }
    .ito .s4 .circleWrap .outerCircle .item .inner {
        padding: calc(30/18*1em) calc(20/18*1em);
    }
    .ito .s4 .circleWrap .outerCircle .item .txt {
        word-break: keep-all;
        white-space: normal;
        font-size: clamp(16px, 18 / 500 * 100vw, 18px);
    }
    .ito .s4 .circleWrap .outerCircle .item .txt br {
        display: none;
    }
    .ito .s4 .circleWrap .outerCircle .item .tag {
        font-size: clamp(14px, 16 / 500 * 100vw, 16px);
    }
}
@media screen and (max-width: 360px) {
    .ito .s4 {
        margin: 80px 0;
    }
    .ito .s4 .circleWrap .outerCircle .item .inner {
        padding: calc(30/18*1em) calc(15/18*1em);
    }
    .ito .s4 .circleWrap .outerCircle .item .txt {
        font-size: clamp(14px, 16 / 360 * 100vw, 16px);
    }
    .ito .s4 .circleWrap .outerCircle .item .tag {
        font-size: clamp(12px, 14 / 360 * 100vw, 14px);
    }
}


.ito .s5 {
    padding-bottom: 150px;
}
.ito .s5 .inner .block {
    display: flex; align-items: center; justify-content: space-between;
}
.ito .s5 .inner .block + .block {
    margin-top: 250px;
}
.ito .s5 .inner .block:nth-child(even) {
    flex-direction: row-reverse;
}
.ito .s5 .inner .block .img {
    max-width: 50%;
}
.ito .s5 .inner .block .txt {
    flex-shrink: 0;
}
.ito .s5 .inner .block .txt .sec_titBx {
    text-align: left; align-items: flex-start;
    padding-bottom: 0;
}
@media screen and (max-width: 1280px) {
    .ito .s5 .inner .block + .block {
        margin-top: 150px;
    }
    .ito .s5 .inner .block .img {
        max-width: 40%;
    }
    /* .ito .s5 .inner .block .txt .sec_titBx {
        font-size: clamp(30px, 36 / 1280 * 100vw, 36px);
    } */
}
@media screen and (max-width: 1024px) {
    .ito .s5 .inner .block + .block {
        margin-top: 120px;
    }
    .ito .s5 .inner .block .img {
        max-width: 35%;
    } 
    /* .ito .s5 .inner .block .txt .sec_titBx {
        font-size: clamp(28px, 34 / 1024 * 100vw, 34px);
    } */
    .ito .s5 .inner .block .txt .sec_titBx span {
        font-size: clamp(16px, 18 / 1024 * 100vw, 18px);
    }
}
@media screen and (max-width: 820px) {
    .ito .s5 {
        padding-bottom: 100px;
    }
    .ito .s5 .inner .block {
        flex-direction: column !important; align-items: flex-start !important;
    }
    .ito .s5 .inner .block + .block {
        margin-top: 130px;
    }
    .ito .s5 .inner .block .img {
        align-self: center;
        width: 100%;
        max-width: 500px;
    }
    .ito .s5 .inner .block:nth-child(1) .img {
        transform: translateX(3.5%);
    }
    .ito .s5 .inner .block:nth-child(2) .img {
        transform: translateX(-3.5%);
    }
    .ito .s5 .inner .block .txt {
        width: 100%;
    }
    .ito .s5 .inner .block .txt .sec_titBx {
        width: 100%;
        /* font-size: clamp(28px, 36 / 820 * 100vw, 36px); */
        padding-top: calc(70/30*1em);
    }
    .ito .s5 .inner .block .txt .sec_titBx span {
        width: 100%;
        font-size: clamp(16px, 24 / 820 * 100vw, 24px);
        max-width: none;
    }
}
@media screen and (max-width: 500px) {
    /* .ito .s5 .inner .block .txt .sec_titBx {
        font-size: clamp(24px, 28 / 500 * 100vw, 28px);
    } */
    .ito .s5 .inner .block .txt .sec_titBx span {
        font-size: clamp(14px, 16 / 500 * 100vw, 16px);
    }
}