/* 공통 */
.only_pc {
    display: block;
}
.only_mo {
    display: none;
}

section {
    width: 100%;
    padding: 0 40px;
    box-sizing: border-box;
}

section .main_inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    max-width: 1518px;
    width: 100%;
}

section .main_title {
    width: 100%;
}

section .main_title h3 {
    display: block;
    margin-bottom: min(1.429vw, 28px);
    font-family: 'noto7';
    font-size: min(2.8vw, 52px);
    letter-spacing: -0.065em;
    line-height: 1.2;
    text-align: center;
    color: #000;
}

section .main_title h3 em {
    color: #ff5858;
}

section .main_title p {
    font-family: 'noto4';
    font-size: min(1.17vw, 18px);
    letter-spacing: -0.065em;
    line-height: 1.55;
    text-align: center;
    color: #787878;
}

/* top : s */
.top_area {
    background: linear-gradient(to bottom, #f3f7fd, #dee8fe);
}

.top_area .main_inner {
    padding: min(7.444vw, 140px) 0 0;
}

.top_area .top_contents {
    position: relative;
}

.top_area .top_contents .txt {
    position: absolute;
}

.top_area .top_contents .txt_01 {
    top: min(29.5%, 213px);
    left: min(3.8%, 57px);
}

.top_area .top_contents .txt_02 {
    top: min(48%, 347px);
    left: min(3.8%, 57px);
}

.top_area .top_contents .txt_03 {
    top: min(29.5%, 213px);
    right: min(3.8%, 57px);
}

.top_area .top_contents .txt_04 {
    top: min(48%, 347px);
    right: min(1.4%, 20px);
}

.top_area .top_contents .txt h3 {
    display: inline-block;
    background: linear-gradient(to top, #cedaff 9px, transparent 9px);
    font-family: 'noto7';
    font-size: min(22px, 1.56vw);
    letter-spacing: -0.045em;
    line-height: 1.2;
    color: #000;
}

.top_area .top_contents .txt p {
    margin-top: 5px;
    font-family: 'noto4';
    font-size: min(17px, 1.061vw);
    letter-spacing: -0.045em;
    line-height: 1.5;
    color: #000;
}

.top_area .top_contents .only_pc {
    margin-top: 5px;
}

.top_area .top_contents img {
    width: 100%;
}
/* top : e */

/* test : s */
.test_area {
    background: linear-gradient(to bottom, #dee8fe, #f3f7fd);
}

.test_area .main_inner {
    padding: min(1.098vw, 20px) 0 min(8.3vw, 160px);
}

.test_area .txt_slide {
    position: relative;
    max-width: 1518px;
    width: 100%;
    overflow: hidden;
}

.test_area .txt_slide .swiper-slide {
    width: 100%;
}

.test_area .test_slide_wrap {
    width: 100%;
    margin-top: min(3.333vw, 60px);
}

.test_area .test_slide_pc {
    position: relative;
    width: 100%;
    padding-bottom: 4vw;
    overflow: hidden;
}

.test_area .test_slide_pc .swiper-slide {
    width: 100%;
    border-radius: 1.667vw;
    background: #fff;
}

.test_area .test_slide .swiper-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.861vw;
    width: 100%;
    bottom: 0;
}

.test_area .test_slide .swiper-pagination .swiper-pagination-bullet {
    width: 1.567vw;
    height: 1.567vw;
    border: 0;
    border-radius: 50%;
    background: #d1d1d1;
    opacity: 1;
}

.test_area .test_slide .swiper-pagination .swiper-pagination-bullet-active {
    background: #000;
}
/* test : e */

/* 채점 결과 및 분석 : s */
.result_info_area .main_inner {
    padding: min(8.056vw, 148px) 0 min(10.461vw, 197px);
}

.result_info_area .main_tab {
    position: relative;
    width: 100%;
    margin-top: 40px;
    overflow: hidden;
}

.result_info_area .main_tab .tab_list {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 28px;
    position: static;
    margin-bottom: 43px;
}

.result_info_area .main_tab .tab_list .btn_tab {
    width: 230px;
    height: 50px;
    border-radius: 50px;
    background: #c4c4c4;
    font-family: 'noto5';
    font-size: min(1.833vw, 24px);
    letter-spacing: -0.065em;
    line-height: 1;
    color: #fff;
}

.result_info_area .main_tab .tab_list .btn_tab.is_active {
    background: #000;
}

.result_info_area .main_tab .tab_list .btn_tab:first-child {
    margin-left: 0.1px;
}

.result_info_area .tab_content {
    width: 100%;
    aspect-ratio: 1518/847;
    border: 3px solid #000;
    border-radius: min(1.861vw, 35px);
    box-sizing: border-box;
    background: #fff;
}

.result_info_area .tab_content .result_list_wrap {
    display: flex;
    gap: min(1.878vw, 38px);
    padding: 0 min(4.233vw, 78px);
    box-sizing: border-box;
}

.result_info_area .tab_content .result_list_wrap.list_3 {
    gap: min(2.667vw, 48px);
}

.result_info_area .tab_content .result_list_wrap .result_list {
    width: 100%;
    aspect-ratio: 659/135;
    padding: min(1.45vw, 27px) 0 0 min(2.528vw, 47px);
    border-radius: min(0.667vw, 12px);
    background-color: #ecf1ff;
    background-repeat: no-repeat;
    background-size: min(4.211vw, 80px) min(3.894vw, 77px);
    background-position: right min(2.06vw, 40px) top 47%;
}

.result_info_area .tab_content .result_list_wrap:not(.list_3) .result_list:nth-child(2) {
    padding-left: min(3.361vw, 53px);
}

.result_info_area .tab_content .result_list_wrap.list_3 .result_list {
    aspect-ratio: 420/136;
    padding: min(1.45vw, 27px) 0 0 min(1.922vw, 34px);
}

.result_info_area .tab_content_01 .result_list_wrap .result_list_1 {
    background-image: url('/_skin/pass_sidae_renew/service_intro/result_icon_01.png');
    background-position: right 22px top 56%;
    background-position: right 1.056vw top 56%;
}

.result_info_area .tab_content_01 .result_list_wrap .result_list_2 {
    background-image: url('/_skin/pass_sidae_renew/service_intro/result_icon_02.png');
}

.result_info_area .tab_content_01 .result_list_wrap .result_list_3 {
    background-image: url('/_skin/pass_sidae_renew/service_intro/result_icon_03.png');
}

.result_info_area .tab_content_02 .result_list_wrap .result_list_1 {
    background-image: url('/_skin/pass_sidae_renew/service_intro/result_icon_04.png');
    background-position: right min(2.9vw, 54px) top 47%;
}

.result_info_area .tab_content_02 .result_list_wrap .result_list_2 {
    background-image: url('/_skin/pass_sidae_renew/service_intro/result_icon_05.png');
    background-position: right min(2.35vw, 45px) top 47%;
}

.result_info_area .tab_content_03 .result_list_wrap .result_list_1 {
    background-image: url('/_skin/pass_sidae_renew/service_intro/result_icon_06.png');
    background-position: right min(2.35vw, 45px) top 55%;
}

.result_info_area .tab_content_03 .result_list_wrap .result_list_2 {
    background-image: url('/_skin/pass_sidae_renew/service_intro/result_icon_04.png');
    background-position: right min(2.528vw, 47px) top 51%;
}

.result_info_area .tab_content .result_list_wrap .result_list h3 {
    font-family: 'noto6';
    font-size: min(1.135vw, 21px);
    letter-spacing: -0.045em;
    line-height: 1;
    color: #000;
}

.result_info_area .tab_content .result_list_wrap .result_list p {
    margin-top: min(0.589vw, 10px);
    font-family: 'noto3';
    font-size: min(0.915vw, 17px);
    letter-spacing: -0.045em;
    line-height: 1.3;
    color: #000;
}
/* 채점 결과 및 분석 : e */

/* 비교 : s */
.compare_area {
    background: url('/_skin/pass_sidae_renew/service_intro/compare_bg_pc.png') center no-repeat;
}

.compare_area .main_inner {
    padding: min(8.133vw, 152px) 0 min(3.689vw, 69px);
}

.compare_area .main_title h3 {
    color: #fff;
}

.compare_area .compare_wrap {
    position: relative;
    width: 100%;
    height: 37.517vw;
    max-height: 705px;
    margin-top: min(3.478vw, 92px);
    background: url('/_skin/pass_sidae_renew/service_intro/compare_box_pc.png') center / contain no-repeat;
}

.compare_area .compare_wrap ul {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: min(37.028vw, 695px);
    aspect-ratio: 695/602;
    padding-top: min(6.484vw, 122px);
}

.compare_area .compare_wrap ul li {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: min(0.589vw, 10px);
    font-family: 'noto5';
    font-size: min(1.489vw, 28px);
    letter-spacing: -0.065em;
    line-height: 2.15;
    text-align: center;
    color: #fff;
    transform: translateX(min(-1.078vw, -20px));
}

.compare_area .compare_wrap ul li.only_mo {
    display: none;
}

.compare_area .compare_wrap ul li::before {
    clear: both;
    content: '';
    display: block;
    width: min(2.256vw, 40px);
    height: min(1.8vw, 36px);
    background: url('/_skin/pass_sidae_renew/service_intro/compare_icon.png') center / contain no-repeat;
}
/* 비교 : e */

/* 4단계로 합격 준비 : s */
.step_area .main_inner {
    padding: min(9.811vw, 188px) 0 min(5.278vw, 110px);
}

.step_area .step_wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: min(3.878vw, 74px);
    margin: min(2.822vw, 52px) 0 min(4.506vw, 85px);
}

.step_area .step_wrap .step {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    width: min(25vw, 324px);
    /* height: min(27.083vw, 339px); */
    aspect-ratio: 324 / 339;
    padding: min(3.5vw, 54px) 0 min(2.111vw, 36px);
    border-radius: min(1.078vw, 20px);
    background-color: #ffffff;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    box-shadow: 0 min(0.5vw, 10px) min(1.178vw, 30px) rgba(0, 0, 0, 0.2);
    font-family: 'spoqa4';
    letter-spacing: -0.065em;
    text-align: center;
    list-style: none;
}

.step_area .step_wrap .step_01 {
    background-image: url('/_skin/pass_sidae_renew/service_intro/step_01_pc.png');
}

.step_area .step_wrap .step_02 {
    background-image: url('/_skin/pass_sidae_renew/service_intro/step_02_pc.png');
}

.step_area .step_wrap .step_03 {
    background-image: url('/_skin/pass_sidae_renew/service_intro/step_03_pc.png');
}

.step_area .step_wrap .step_04 {
    background-image: url('/_skin/pass_sidae_renew/service_intro/step_04_pc.png');
}

.step_area .step_wrap .step span {
    display: block;
    font-size: min(1vw, 16px);
    font-weight: bold;
    line-height: 1.4;
    text-align: center;
    color: #f39595;
}

.step_area .step_wrap .step h3 {
    display: block;
    margin-top: min(0.3vw, 7px);
    font-family: 'spoqa5';
    font-size: min(1.8vw, 25px);
    font-weight: bold;
    text-align: center;
    letter-spacing: -0.065em;
    line-height: 1.4;
    color: #000;
}

.step_area .step_wrap .step p {
    margin-top: min(0.14vw, 2px);
    font-size: min(1.25vw, 18px);
    font-family: 'spoqa3';
    line-height: 1.4;
    text-align: center;
    color: #000;
}

.step_area .online_test_banner_wrap {
    position: relative;
}

.step_area .online_test_banner_wrap img {
    width: 100%;
}

.step_area .online_test_banner_wrap .txt_wrap {
    position: absolute;
    top: 0;
    left: 0;
    padding: min(66px, 3.15vw) min(90px, 5.92vw) min(46px, 3.03vw);
    color: #ffffff;
}

.step_area .online_test_banner_wrap .txt_wrap h3 {
    font-family: 'spoqa2';
    font-size: clamp(24px, 3.29vw, 50px);
    line-height: 1.2;
    letter-spacing: -0.045em;
    color: #ffffff;
}

.step_area .online_test_banner_wrap .txt_wrap strong {
    font-family: 'spoqa4';
    font-size: clamp(28px, 3.62vw, 55px);
    font-weight: bold;
}

.step_area .online_test_banner_wrap .txt_wrap .link_btn {
    display: block;
    width: min(176px, 11.61vw);
    margin-top: min(36px, 2.37vw);
    padding: min(17px, 1.12vw) min(30px, 1.98vw);
    border: 1px solid #ffffff;
    border-radius: 50px;
    background: url('/_skin/pass_sidae_renew/main/link_arrow.png') 85% center no-repeat;
    font-size: clamp(11px, 1.62vw, 16px);
    letter-spacing: -0.045em;
}
/* 4단계로 합격 준비 : e */

@media screen and (min-width: 2561px) {
    .compare_area {
        background-size: cover;
    }
}

@media screen and (max-width: 1399px) {
    /* top : s */
    .top_area .top_contents .txt_01,
    .top_area .top_contents .txt_02 {
        left: 0;
    }

    .top_area .top_contents .txt_03 {
        right: 3%;
    }

    .top_area .top_contents .txt_04 {
        right: 0;
    }
    /* top : e */
}

@media screen and (max-width: 1023px) {
    .only_pc {
        display: none;
    }
    .only_mo {
        display: block;
    }

    section {
        padding: 0 min(40px, 4.256vw);
    }

    section .main_title h3 {
        margin-bottom: min(3.629vw, 28px);
        font-size: min(7.639vw, 55px);
    }

    section .main_title p {
        font-size: min(3.194vw, 23px);
        line-height: 1.65;
    }

    /* top : s */
    .top_area {
        background: linear-gradient(to bottom, #f3f7fd, #dbe6fd, #e7eefe);
    }

    .top_area .main_inner {
        padding: min(12.844vw, 106px) 0 0;
    }

    .top_area .top_contents .txt_wrap {
        display: flex;
        flex-direction: column;
        gap: min(3.472vw, 25px);
    }

    .top_area .top_contents .txt {
        position: static;
        width: 100%;
        padding: min(3.25vw, 27px) 0 min(3.25vw, 27px) min(6.622vw, 52px);
        border-radius: min(2.778vw, 20px);
        background: #f8faff;
    }

    .top_area .top_contents .txt h3 {
        font-size: min(33px, 4.383vw);
    }

    .top_area .top_contents .txt p {
        margin-top: min(1.528vw, 11px);
        font-size: min(24px, 3.333vw);
    }
    /* top : e */

    /* test : s */
    .test_area {
        background: linear-gradient(to bottom, #e7eefe 10%, #f3f7fd 20%, #f3f7fd);
    }

    .test_area .main_inner {
        padding: min(35.417vw, 255px) 0 min(24.111vw, 188px);
    }

    .test_area .test_slide_wrap {
        max-width: 687px;
        margin-top: min(5.333vw, 40px);
    }

    .test_area .test_slide_mo {
        position: relative;
        width: 100%;
        padding-bottom: 10.5vw;
        overflow: hidden;
    }

    .test_area .test_slide_mo .swiper-slide {
        width: 100%;
        border-radius: min(5.667vw, 40px);
        background: #fff;
    }

    .test_area .test_slide .swiper-pagination {
        gap: 1.861vw;
    }

    .test_area .test_slide .swiper-pagination .swiper-pagination-bullet {
        width: 3.9vw;
        height: 3.9vw;
    }
    /* test : e */

    /* 채점 결과 및 분석 : s */
    .result_info_area .main_inner {
        padding: min(25.778vw, 200px) 0 min(26.75vw, 207px);
    }

    .result_info_area .main_tab {
        max-width: 687px;
    }

    .result_info_area .main_tab .tab_list {
        gap: min(2.639vw, 19px);
        margin-bottom: min(7vw, 53px);
    }

    .result_info_area .main_tab .tab_list .btn_tab {
        width: min(28vw, 216px);
        height: min(8.333vw, 60px);
        font-size: min(3.22vw, 25px);
    }

    .result_info_area .tab_content {
        aspect-ratio: 686/1412;
    }

    .result_info_area .tab_content .result_list_wrap {
        flex-direction: column;
        padding: 0 min(7vw, 54px);
    }

    .result_info_area .tab_content .result_list_wrap.list_3 {
        gap: min(1.667vw, 12px);
    }

    .result_info_area .tab_content .result_list_wrap .result_list {
        aspect-ratio: 571/166;
        border-radius: min(2.578vw, 20px);
        padding: min(3.556vw, 25px) 0 0 min(5.694vw, 41px);
        background-size: min(10.711vw, 80px) min(10.394vw, 77px);
        background-position: right min(6.056vw, 45px) top 52%;
    }

    .result_info_area .tab_content .result_list_wrap.list_3 .result_list {
        aspect-ratio: 571/136;
        padding: min(3.194vw, 23px) 0 0 min(5.772vw, 43px);
    }

    .result_info_area .tab_content .result_list_wrap:not(.list_3) .result_list:nth-child(2) {
        padding-left: min(5.694vw, 41px);
    }

    .result_info_area .tab_content_01 .result_list_wrap .result_list_1 {
        background-position: right min(6.056vw, 45px) top 50%;
    }

    .result_info_area .tab_content_01 .result_list_wrap .result_list_2 {
        background-position: right min(6.056vw, 45px) top 30%;
    }

    .result_info_area .tab_content_02 .result_list_wrap .result_list_1 {
        background-position: right min(6.056vw, 45px) top 45%;
    }

    .result_info_area .tab_content_02 .result_list_wrap .result_list_2 {
        background-position: right min(6.056vw, 45px) top 47%;
    }

    .result_info_area .tab_content_03 .result_list_wrap .result_list_2 {
        background-position: right min(6.056vw, 45px) top 46%;
    }

    .result_info_area .tab_content .result_list_wrap .result_list h3 {
        font-size: min(3.3vw, 25.2px);
    }

    .result_info_area .tab_content .result_list_wrap .result_list p {
        margin-top: min(1.389vw, 10px);
        font-size: min(2.653vw, 20.4px);
    }
    /* 채점 결과 및 분석 : e */

    /* 비교 : s */
    .compare_area {
        background: url('/_skin/pass_sidae_renew/service_intro/mo/compare_bg_mo.png') center / cover no-repeat;
    }

    .compare_area .main_inner {
        padding: min(23.322vw, 178px) 0 min(15.528vw, 119px);
    }

    .compare_area .main_title h3 {
        margin-bottom: 0;
    }

    .compare_area .compare_wrap {
        max-width: 687px;
        height: auto;
        max-height: 100%;
        aspect-ratio: 682/943;
        margin-top: min(0.478vw, 5px);
        background: url('/_skin/pass_sidae_renew/service_intro/mo/compare_box_mo.png') center / contain no-repeat;
    }

    .compare_area .compare_wrap ul {
        display: flex;
        flex-direction: column;
        gap: min(2.14vw, 16px);
        left: 47%;
        width: min(45.611vw, 350px);
        height: min(100.833vw, 762px);
        margin-top: min(11.639vw, 91px);
        padding-top: min(15.25vw, 117px);
    }

    .compare_area .compare_wrap ul li {
        align-items: flex-start;
        gap: min(1.667vw, 12px);
        font-size: min(3.889vw, 28px);
        line-height: 1.3;
        transform: translateX(min(-2.083vw, -15px));
    }

    .compare_area .compare_wrap ul li.only_pc {
        display: none;
    }

    .compare_area .compare_wrap ul li.only_mo {
        display: flex;
    }

    .compare_area .compare_wrap ul li::before {
        width: min(5.1vw, 40px);
        height: min(4.9vw, 36px);
        padding-top: min(1.389vw, 10px);
    }
    /* 비교 : e */

    /* 4단계로 합격 준비 : s */
    .step_area .main_inner {
        padding: min(20.822vw, 160px) 0 min(18.472vw, 133px);
    }

    .step_area .step_wrap {
        flex-wrap: wrap;
        gap: min(2.878vw, 74px);
        max-width: 687px;
        margin: min(4.956vw, 40px) 0 min(6.111vw, 44px);
        margin-top: 5.556vw;
        margin-bottom: 6.111vw;
    }

    .step_area .step_wrap .step {
        display: block;
        width: min(42.556vw, 326px);
        height: min(22.722vw, 178px);
        border-radius: min(2.033vw, 24px);
        padding-left: min(5.694vw, 41px);
        padding-top: min(3.056vw, 22px);
        box-shadow: 0 min(1.5vw, 10px) min(2.178vw, 30px) rgba(0, 0, 0, 0.2);
    }

    .step_area .step_wrap .step_01 {
        background-image: url('/_skin/pass_sidae_renew/service_intro/mo/step_01_mo.png');
    }

    .step_area .step_wrap .step_02 {
        background-image: url('/_skin/pass_sidae_renew/service_intro/mo/step_02_mo.png');
    }

    .step_area .step_wrap .step_03 {
        background-image: url('/_skin/pass_sidae_renew/service_intro/mo/step_03_mo.png');
    }

    .step_area .step_wrap .step_04 {
        background-image: url('/_skin/pass_sidae_renew/service_intro/mo/step_04_mo.png');
    }

    .step_area .step_wrap .step span {
        font-size: min(2vw, 16px);
        text-align: left;
        letter-spacing: -0.065em;
    }

    .step_area .step_wrap .step h3 {
        font-size: min(3.589vw, 28px);
        text-align: left;
        letter-spacing: -0.065em;
    }

    .step_area .step_wrap .step p {
        font-size: min(2.578vw, 20px);
        text-align: left;
        letter-spacing: -0.065em;
    }

    .step_area .online_test_banner_wrap {
        max-width: 687px;
    }

    .step_area .online_test_banner_wrap .txt_wrap {
        padding: min(40px, 5.556vw) min(52px, 7.222vw) min(80px, 11.111vw);
    }

    .step_area .online_test_banner_wrap .txt_wrap h3 {
        font-size: clamp(14px, 4.899vw, 35.27px);
    }

    .step_area .online_test_banner_wrap .txt_wrap strong {
        font-size: clamp(18px, 5.389vw, 38.8px);
    }

    .step_area .online_test_banner_wrap .txt_wrap .link_btn {
        width: min(176px, 24.444vw);
        min-width: 92px;
        margin-top: min(36px, 5vw);
        padding: min(17px, 2.361vw) min(30px, 4.167vw);
        font-size: clamp(11px, 2.222vw, 16px);
    }
    /* 4단계로 합격 준비 : e */
}