@charset "UTF-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");

/* 노트북 타블렛*/
@media (min-width: 1025px) and (max-width: 1440px) {
    .group_school_main > div {
        width: calc(100% - 48px);
        max-width: 100%;
    }

    .group_school_main > div#group_school_menu,
    .group_school_main > div#grouptest_detailview_wrap {
        width: 100%;
    }

    #grouptest_detailview_wrap > div {
        width: calc(100% - 48px);
    }

    .group_school_data:not(#data_kindergarten) thead .data_dwn {
        display: none;
    }

    .group_school_data tbody > tr {
        position: relative;
    }

    .data_table_wrap .group_school_data:not(#data_kindergarten) tbody tr td {
        padding-bottom: 68px;
    }

    .group_school_data:not(#data_kindergarten) tbody .data_dwn {
        position: absolute;
        left: 0;
        bottom: 16px;
        padding: 0 0 0 40px !important;
        background-color: transparent;
        border-top: none !important;
    }

    .data_table_wrap .group_school_data thead .data_saenggibu {
        border-radius: 0 20px 20px 0;
    }

    .data_table_wrap .group_school_data .data_saenggibu {
        padding-right: 40px;
        width: 180px;
    }

    .data_table_wrap .group_school_data tbody tr:first-of-type .data_saenggibu {
        border-radius: 0 20px 0 0;
    }

    .data_table_wrap .group_school_data tbody tr:last-of-type .data_saenggibu {
        border-radius: 0 0 20px 0;
    }

    .grouptest_tab_list > li > span {
        height: 52px;
        font-size: 18px;
    }

    .grouptest_tab_list > li > span > img {
        width: 24px;
    }
    .small_banner_wrap.division_3 > div{
        padding:30px;
    }
}

/* 모바일, 타블렛 */
@media (max-width: 1024px) {
    #container.group_school {
        width: 100%;
    }

    .group_school_main > div {
        padding: 0 20px;
        box-sizing: border-box;
    }

    .breadcrumb_list {
        margin: 16px 0;
    }

    .breadcrumb_list li,
    .breadcrumb_list li a {
        font-size: 16px;
    }

    .division__banner .swiper {
        border-radius: 16px;
    }

    .swiper-pagination {
        position: absolute;
        left: inherit;
        bottom: 12px;
        right: -15px;
        color:#fff;
        background-color: rgba(0, 0, 0, 0.7);
        padding: 2px 8px;
        border-radius: 4px;
    }
    /*
    .swiper-pagination span.swiper-pagination-current{
        font-weight:700;
    }
    */

    .swiper-pagination span {
        color: #fff;
    }

    .group_school_menu_list {
        gap: 20px;
        overflow-x: auto;
        justify-content: normal;
        padding:0 20px;
    }

    .group_school_menu_list li {
        height: 52px;
        line-height: 52px;
        font-size: 14px;
    }

    .group_school_menu_list li.on {
        border-bottom-width: 3px;
    }

    .group_school_main > div#group_school_menu {
        margin-top: 16px;
        overflow: hidden;
        padding:0;
    }

    .group_school_menu_list::-webkit-scrollbar {
        display: none;
    }

    .group_school_menu_list li a {
        display: block;
        white-space: nowrap;
    }

    .group_school_title {
        margin-top: 40px;
        font-size: 24px;
    }

    .group_school_desc {
        flex-direction: column;
    }

    .desc_contents .desc_main {
        font-size: 16px;

    }

    .desc_contents .desc_sub {
        font-size: 14px;
        margin-top: 8px;
    }

    .group_school_btn_wrap {
        margin-top: 40px;
        flex-direction: column;
        gap: 20px;
    }

    .group_school_btn_wrap a {
        width: 100%;
    }

    .group_school_small_banner_wrap {
        margin-top: 24px;
    }

    .small_banner_wrap {
        flex-direction: column;
    }

    .small_banner_wrap.division_3 > div {
        width: 100%;
        height: 230px;
    }

    .small_banner_wrap .small_banner {
        padding: 20px 24px;
        background-size: 50%;
    }

    .small_banner_btn_wrap {
        gap: 12px;
    }

    .small_banner_title {
        font-size: 24px;
    }

    .small_banner_btn_wrap > a {
        height: 96px;
    }

    .small_banner_btn_wrap > a > .btn_text {
        font-size: 14px;
        margin-top: 8px;
    }

    .small_banner_btn_wrap > a > .btn_text > img {
        width: 16px;
    }

    .small_banner_wrap.division_2 > div {
        width: 100%;
        height: 144px;
    }

    .small_banner_title.small {
        font-size: 16px;
    }

    .small_banner_desc .desc_main,
    .small_banner_desc .desc_main > span#emailaddr{
        font-size: 24px;
    }
     

    .small_banner.contact_call .desc_main > span{
        font-size: 16px;
    }

    .small_banner_desc .desc_sub {
        font-size: 14px;
        margin-top: 8px;
    }

    .small_banner_wrap.division_2 > div.small_banner {
        background-size: 30%;
        background-position: 90% -30%;
    }

    .group_school_title.kindergarten {
        margin-top: 80px;
        margin-bottom: 16px;
    }

    .group_school_banner.kindergarten {
        width: calc(100% - 40px);
        height: 280px;
        padding: 24px;
        flex-direction: column;
        background-size: 60%;
        background-position: center bottom;
        margin-bottom: 80px;
    }

    .group_school_banner.kindergarten > div.banner_content > .banner_title {
        font-size: 18px;
    }

    .group_school_banner.kindergarten > div.banner_content > .banner_desc {
        font-size: 12px;
        margin-top: 12px;
    }

    .banner_content > .banner_desc > span {
        display: block;
    }

    .banner_content > .banner_desc > span + span:before {
        display: none;
    }

    .group_school_banner.kindergarten > div.banner_btn_wrap > a {
        width: 100%;
    }

    .group_school_main > div#grouptest_detailview_wrap {
        padding: 60px 0;
    }
    .group_school_main > div#grouptest_detailview_wrap >div{
        padding:0 20px;
        box-sizing: border-box;
    }
    
    .group_school_main > div#grouptest_detailview_wrap >div.grouptest_detailview_tab{
        padding:0;
    }
    .grouptest_detailview_tab {
        overflow: hidden;
    }

    .grouptest_detailview_tab > .grouptest_tab_list {
        overflow-x: auto;
        padding: 24px 20px;
    }

    .grouptest_detailview_tab > .grouptest_tab_list::-webkit-scrollbar {
        display: none;
    }

    .grouptest_tab_list > li {
        white-space: nowrap;
    }

    .grouptest_tab_list > li > span {
        height: 36px;
        font-size: 14px;
    }

    .group_school_data {
        background-color: #fff;
        border-radius: 16px;
    }

    .group_school_data thead {
        display: none;
    }


    .group_school_data tbody tr + tr {
        border-top: 1px solid #ddd;
    }

    .group_school_data tbody td {
        display: block;
        box-sizing: border-box !important;
        width: 100% !important;
        border-top: none !important;
        background-color: transparent;
    }

    .group_school_data tbody tr:first-of-type > td:first-of-type {
        border-radius: 16px 16px 0 0;
    }

    .data_dwn_mo {
        display: inline-block;
        border: 1px solid #ddd;
        border-radius: 22px;
        padding: 8px 34px 8px 16px;
        position: relative;
    }

    .data_dwn_mo:after {
        border-bottom: 1px solid #111;
        border-right: 1px solid #111;
        content: "";
        display: block;
        width: 7px;
        height: 7px;
        pointer-events: none;
        position: absolute;
        right: 15px;
        top: 50%;
        margin-top: -5px;
        -webkit-transform-origin: 66% 66%;
        -ms-transform-origin: 66% 66%;
        transform-origin: 66% 66%;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }

    .data_dwn_mo.active {
        background-color: #F6F6F6;
    }

    .data_dwn_mo.active:after {
        -webkit-transform: rotate(-135deg);
        -ms-transform: rotate(-135deg);
        transform: rotate(-135deg);
    }

    .data_dwn_mo + ul {
        display: none;
    }

    .data_dwn_mo.active + ul {
        display: block;
        position: absolute;
        background-color: #fff;
        z-index: 10;
        min-width: 170px;
        border: 1px solid #ddd;
        border-radius: 22px;
        box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12);
        padding:4px;
        box-sizing: border-box;
    }

    .data_test .data_test_name_wrap {
        flex-direction: column;
        align-items: normal;
    }

    .data_table_wrap .group_school_data tbody tr td {
        font-size: 14px;
    }

    .data_table_wrap .group_school_data tbody tr:first-of-type > td:first-of-type {
        border-radius: 16px 16px 0 0;
    }

    .data_table_wrap .group_school_data tbody tr:first-of-type > td:last-of-type {
        border-radius: 0;
    }

    .data_table_wrap .group_school_data tbody tr:last-of-type > td:first-of-type {
        border-radius: 0;
    }

    .data_table_wrap .group_school_data tbody tr:last-of-type > td:last-of-type {
        border-radius: 0 0 16px 16px;
    }

    .data_table_wrap .group_school_data tbody tr > td.data_test {
        padding: 20px 16px 0 16px;
    }

    .data_table_wrap .group_school_data tbody tr > td.date_grade {
        padding: 12px 0 0 16px;
        width: 125px !important;
        text-align: left;
    }

    .data_table_wrap .group_school_data tbody tr > td.data_totalnum {
        padding: 12px 0 0 16px;
        width: calc(100% - 125px) !important;
        text-align: left;
    }

    .data_table_wrap .group_school_data:not(#data_elementary) tbody tr > td.data_totalnum {
        width: 100% !important;
    }

    .data_table_wrap .group_school_data tbody tr > td.data_activitysheet {
        padding: 10px 0 0 16px;
    }

    .data_table_wrap .group_school_data tbody tr > td.data_saenggibu {
        padding: 10px 0 0 16px;
    }

    .data_table_wrap .group_school_data tbody tr > td.data_dwn {
        padding: 20px 0 20px 16px;
    }

    .classify {
        width: max-content;
    }

    .chk .mo_title {
        display: inline-block;
        margin-right: 6px;
        font-size: 14px;
        font-weight: 500;
        color: #777;
    }

    .data_test_name_wrap .test_name a {
        font-size: 16px;
    }

    .group_school_data tbody tr:first-of-type {
        border-radius: 16px 16px 0 0;
    }

    .group_school_data tbody tr:last-of-type {
        border-radius: 0 0 16px 16px;
    }

    .group_school_data tbody td.date_grade,
    .group_school_data tbody td.data_totalnum,
    .group_school_data tbody td.data_activitysheet,
    .group_school_data tbody td.data_saenggibu {
        display: inline-block;
        width: auto !important;
    }

    .group_school_data tbody td.not {
        height: 0 !important;
        width: 0 !important;
        padding: 0 !important;
    }

    .data_table_wrap .group_school_data img {
        width: 18px;
        margin-left: 6px;
    }

    .data_dwn_list > li {
        border: none;
        flex-direction: column;
        width: max-content;
        min-width: 100%;
        height: auto;
    }

    .data_dwn_list > li > span {
        display: block;
        width: 100%;
        height: 36px;
        line-height: 36px;
        position: relative;
    }

    .data_dwn_list > li.active > span {
        background-color: transparent;
    }

    .data_dwn_list > li.active .dwn_list {
        position: static;
        border: none;
        box-shadow: none;
        padding: 0 16px;
    }

    .dwn_list > li > a {
        padding: 0;
        color:#333;
    }

    .data_table_wrap .group_school_data ul img {
        margin-left: 0;
        margin-right: 4px;
    }

    .data_test_name_wrap .test_name .test_name_etc {
        position: static;
    }

    .grouptest_tab_list > li > span > img {
        width: 20px;
    }

    .group_school_main > div.followup_program_maintitle {
        padding: 50px 20px;
    }

    .followup_program_maintitle > .main_title {
        font-size: 24px;
    }

    .followup_program_maintitle > .main_desc {
        margin-top: 16px;
    }

    .followup_program_maintitle > .main_desc ul li {
        font-size: 16px;
    }

    .followup_program_maintitle > .main_desc ul li .contact {
        font-size: 16px;
    }

    .followup_program_title {
        margin-top: 60px;
        margin-bottom: 16px;
        font-size: 24px;
    }

    .followup_program_main_banner {
        flex-direction: column;
        gap: 16px;
    }

    .followup_program_main_banner > div {
        width: 100%;
        height: 180px;
        padding:20px;
    }
    .followup_program_main_banner > div.elementary,
    .followup_program_main_banner > div.middle,
    .followup_program_main_banner > div.high{
        height:200px;
    }
    
    .followup_banner.path a,
    .followup_banner.edu a,
    .followup_banner.sociality a {
        padding: 20px;
    }
    .followup_banner_title > span{
        font-size:18px;
    }
    
    
    /* 검사후속 서비스 공통 */
    .group_school_main > div.followup_program_sub{
        padding:0;
    }
    .followup_program_sub .followup_left{
        display: none;
    }
    
    .followup_program_sub .followup_right{
        width: 100%;
    }
    .side_category.mo{
        display: block;
        width:100%;
    }
    .side_category.mo > .category_title{
        display: none;
    }
    
    .side_category.mo > .main_category{
        display: flex;
        border-bottom:1px solid #ddd;
        gap:20px;
        padding:0 20px;
        overflow-x: auto;
        align-items: center;
        margin-top:0;
        height:52px;
    }
    .side_category.mo > .main_category::-webkit-scrollbar{
        display: none;
    }
    .side_category.mo > .main_category > li{
        white-space: nowrap;
    }
    .side_category.mo > .main_category > li.open{
        padding-left:23px;
        background-image:url(../images/group_school/ic_chk_black.svg);
        background-repeat: no-repeat;
        background-position: left center;
    }
    .side_category.mo > .main_category > li + li{
        margin-top:0;
    }
    .side_category.mo > .main_category > li > a:after{
       display: none;
    }
    .followup_sub_content{
        padding:0 20px;
    }
    .sub_category_wrap > ul > li{
        display: none;
    }
    .sub_category_wrap > ul > li.open{
        display: block;
    }
    .sub_category_wrap > ul > li > .sub_category{
        display: flex;
        margin-top:14px;
        overflow-x: auto;
        gap:8px;
        padding:0 20px;
    }
    .sub_category_wrap > ul > li > .sub_category::-webkit-scrollbar{
        display: none;
    }
    .sub_category_wrap > ul > li > .sub_category > li{
        background-color:#F6F6F6;
        border-radius: 22px;
        height:36px;
        line-height: 36px;
        font-size:14px;
        font-weight:500;
        color:#333;
        padding:0 16px;
        white-space: nowrap;
    }
    .sub_category_wrap > ul > li > .sub_category > li.current{
        background-color:#111;
        color:#fff;
    }
    .followup_sub_content{
        margin-top:40px;
    }
    
    .followup_sub_content > .main_title{
        font-size: 24px;
    }
    .followup_sub_content > .sub_title{
        margin:24px 0 16px;
        font-size: 18px;
    }
    .followup_sub_content > .sub_title > span{
        font-size: 14px;
    }
    .followup_test_info_list{
        flex-direction: column;
        gap:16px;
    }
    .followup_test_info_list > li{
        width:100%;
        padding:20px 24px;
        height:87px;
    }
    .followup_test_info_list > li > .num{
        font-size: 12px;
    }
    .followup_test_info_list > li > .title{
        font-size: 16px;
    }
    .followup_contents > .followup_program_tb > thead{
        display: none;
    }
    .followup_contents > .followup_program_tb > tbody > tr + tr{
        border-top:1px solid #ddd;
    }
    .followup_contents > .followup_program_tb > tbody > tr > td{
        width:100%;
        display: block;
        box-sizing: border-box;
        padding:0 20px;
    }
    .followup_contents > .followup_program_tb > tbody > tr > td:nth-of-type(1){
        padding-top:16px;
    }
    .followup_contents > .followup_program_tb > tbody > tr > td:nth-of-type(2){
        padding-top:20px;
        padding-bottom:10px;
    }
    .followup_contents > .followup_program_tb > tbody > tr > td:nth-of-type(3){
         padding-bottom:16px;
    }
    .followup_contents > .followup_program_tb > tbody > tr + tr > td{
        border-top:none;
    }
    .followup_contents > .expectation_effect > li{
        font-size: 14px;
    }
    .followup_test_list > li{
        flex-direction: column;
    }
    .followup_test_list > li > .test_image{
        width:100%;
        height:inherit;
        padding:18px;
        box-sizing: border-box;
    }
    .followup_test_list > li > .test_image >img{
        width:100%;
    }
    .followup_test_list > li > .test_info{
        width:100%;
        padding:20px 0;
    }
    
    .followup_test_list > li > .test_info > .test_desc{
        padding:12px 0 16px;
    }
    .followup_test_list > li > .test_result_tb_down > .btn_main.open +.result_tb_list{
        right:inherit;
        left:80px;
    }
    .group_school_reference_title{
        flex-direction: column;
        padding:0 20px;
        box-sizing: border-box;
        margin-top:24px;
    }
    .group_school_reference_title > .reference_title{
        font-size: 24px;
        margin-bottom: 24px;
    }
    .reference_search_wrap .ul_select_wrap{
        width:45%;
        height:36px;
        line-height: 36px;
    }
    .reference_search_wrap #reference_search{
        width:55%;
        margin-left:8px;
        height:36px;
        font-size: 14px;
    }
    .group_school_reference_tab{
        overflow: hidden;
        margin-top:24px;
        margin-bottom:0;
        border-bottom:1px solid #ddd;
    }
    .reference_tab_list{
        gap:18px;
        overflow-x:auto;
        padding:0 20px;
    }
    .reference_tab_list::-webkit-scrollbar{
        display: none;
    }
    .reference_tab_list > li > a{
        white-space: nowrap;
        background-color:#fff;
        color:#555;
        padding:0;
        font-size: 16px;
        font-weight: 500;
        height:54px;
    }
    .reference_tab_list > li.on > a{
        background-image:url(../images/group_school/ic_check_blue.svg);
        background-color: #fff;
        color:#2B398F;
        background-repeat: no-repeat;
        background-position: left center;
        padding-left:20px;
    }
    .reference_tab_list_wrap{
        padding:0 20px;
        box-sizing: border-box;
        margin-bottom: 80px;
    }
    .reference_list > li{
        flex-direction: column;
        align-items: flex-start;
        gap:16px;
    }
    .reference_list > li:last-of-type{
        border-bottom:1px solid #ddd;
    }
    .followup_service_content{
        padding: 40px 20px;
    }
    .followup_service_title{
        font-size: 30px;
    }
    .followup_service_desc_title{
        font-size: 16px;
        margin-top:16px;
    }
    .followup_service_desc_title > span{
        font-size: 16px;
    }
    .followup_service_desc_content{
        font-size: 14px;
    }
    .test_implement_list{
        flex-direction: column;
        gap:20px;
    }
    .test_implement_list >li{
        width:100%;
        display: flex;
        gap:20px;
        justify-content: flex-start;
        align-items: flex-start;
    }
    .test_implement_list > li > .icon_wrap > .step_icon{
        width:100px;
        height:100px;
    }
    .test_implement_list > li > .icon_wrap > .after_setep{
        display: none;
    }
    .test_implement_list > li > .icon_wrap{
        margin-bottom:0;
    }
    .test_implement_list > li > .content_wrap > .content_title{
        font-size: 16px;
    }
    .test_implement_list > li > .content_wrap > .content_detail{
        margin-top:10px;
    }
    .followup_service_datadown{
        flex-direction: column;
        gap:16px;
    }
    .followup_service_datadown > .datadown_banner{
        width:100%;
        padding:20px;
        box-sizing: border-box;
        max-height: 178px;
    }
    .followup_service_datadown > .datadown_banner > .down_title{
        font-size: 16px;
        margin:16px 0;
    }
    .followup_service_datadown > .datadown_banner > .down_icon > img{
        width:40px;
    }
    .followup_service_datadown > .datadown_banner > .down_btn{
        width:100%;
        box-sizing: border-box;
    }
    .provide_studentrecord_test_list{
        flex-direction: column;
        gap:16px;
    }
    .provide_studentrecord_test_list > li{
        width:100%;
        padding:24px;
    }
    .provide_studentrecord_test_list > li > .sub_list{
        font-size: 14px;
    }
}