@charset "utf-8";
/*****************************************************모바일*****************************************************************/

@media all and (max-width:767px) {
    .main_section_wrap {
        height: 350px;
    }
    .main_section_wrap .main_bg .computing {
        top: 100px;
    }
    .main_section_wrap .main_section .main_tit {
        font-size: 32px;
        margin-bottom: 10px;
    }
    .main_section_wrap .main_section .main_ex {
        width: 226px;
        font-size: 12px;
    }

/*************************  main_section  ***********************************************/
    .section_01 .animated-title {
        font-size: 30px;
    }
    .section_01 .card_contents {
        margin: 30px auto 0;
    }
    .main_section_wrap .main_bg .mySlides:nth-child(1) {
        top: 50%;
        transform: translateY(-50%);
    }
    .main_section_wrap .main_bg .mySlides:nth-child(2) {
        top: 70px;
    }
    .main_section_wrap .main_bg .mySlides:nth-child(3) {
        right: 20px;
    }
/*************************  //main_section  ***********************************************/

/********************************  section_01  ********************************/
    .section_01 .card_contents .card01,
    .section_01 .card_contents .card02,
    .section_01 .card_contents .card03,
    .section_01 .card_contents .card04 {        
        margin: 0 auto 20px;
        float: none;
    }
    .section_01 .card_contents .card05 {
        margin: 0 auto 0;
    }

    .section_01 .card_contents .card03 > ul > li.card_ex03 {
       
        padding: 30px 20px 15px;
    }
    @media all and (max-width: 413px) {
        .section_01 .card_contents .card01,
        .section_01 .card_contents .card02,
        .section_01 .card_contents .card03,
        .section_01 .card_contents .card04, 
        .section_01 .card_contents .card05 {
            
            width: 335px;
        }
    }
/********************************  //section_01  ********************************/

/********************************  section_02  ********************************/
.section_02 .animated-title {
    font-size: 30px;
}
.section_02 .list_contents {
    margin: 30px auto 0;
}
.section_02 .list_contents .list01 {
    padding: 30px 0;
}
.section_02 .list_contents .list02 {
    padding: 30px 20px;
}
.section_02 .list_contents .list03 {
    padding: 30px 20px;
}
.section_02 .list_contents .list04 {
    padding: 30px 20px;
}
/********************************  //section_02  ********************************/

/********************************  section_03  ********************************/

.section_03 .animated-title {
    font-size: 30px;  
}
.section_03 .roadmap_img {
    margin: 30px auto;
}
.section_03 .roadmap_img img {
    width: 100%;
    padding: 0 50px;
}
/********************************  //section_03  ********************************/

/********************************  section_04  ********************************/
.section_04 .service_contents {
    gap: 20px;
    padding: 0 20px;
    margin: 30px auto;
}
.section_04 .service_contents .service {
    width: 100%;
}
.section_04 .section_04_slide_txt .slidetxt {
    flex-wrap: wrap;
}
.section_04 .section_04_slide_txt .slidetxt .slidetxt_tit {
    width: 100%;
    font-size: 26px;
}
.section_04 .section_04_slide_txt .slidetxt .slidetxt_tit .tit_ex {
    width: 90%;
    font-size: 15px;
}
.section_04 .section_04_slide_txt .slidetxt_ex {
    width: 90%;
    margin-top: 20px;
}
.slick-dots {
    width: 100%;
    text-align: center;
}
/********************************  //section_04  ********************************/

/********************************  footer  ********************************/
.footer {
    margin-top: 60px;
    padding: 70px 0;
}
.footer .footer_logo img {
    height: 25px;
}
.footer .footer_txt {
    font-size: 10px;
    margin-top: 25px;
}
/********************************  //footer  ********************************/
























































}