@charset "UTF-8";

/*피시*/
@media screen and (max-width:1600px){
.sub_strong_pnt_wrap{height: auto; min-height:550px  }
    .sub_strong_pnt_txt h3 { font-size: 35px; margin: 20px 0 40px }
    .sub_strong_pnt_img{ width:600px; }
/*        .sub_strong_pnt_img img{ width:100%; transform: translateY(0px)   }*/
/*    .sub_strong_pnt .slick-arrow { bottom: 100px; }*/
}
@media screen and (max-width:1400px){
           .sub_strong_pnt_img{ padding-left: 20px; }
}

@media screen and (max-width:1300px){
    .sub_con{ width:90% }
    .sub_con.port_view{ width:100%; }
        .sub_strong_pnt { width:95%; margin-left: 5%}
            .sub_strong_pnt_img{ width:500px; }
                .strong_pnt_cut{ display: inline;}
/*    .sub_port_list{ justify-content: space-around; }*/
    .sub_port_list{ justify-content: flex-start; }
    .sub_port_list .swiper-slide{ margin: 0 0.2vw 0.3vw; width: 29vw !important; }
    .sub_port_list .swiper-slide:not(:nth-child(3n+1)){  margin: 0 0.2vw 0.3vw; }
     .sub_port_list li a { height: 22.1vw !important;}
            .port_txt{ padding: 20px; }
                .port_name { font-size: 18px;}
    .port_view_banner{ width:100%; height:45vw; }
    .port_main_view{ width:90%; }
    .sub_wrap.port_view::after{ top:30vw }
    .port_app_cnt img{ max-width: 100%;  }
}


/*테블릿*/
@media screen and (max-width:1200px){

      .sub_strong_pnt_img{ width:450px;  }
      .field_img { width: 360px;}
      .sub_tit_sub_wrap h1 {font-size: 35px;}
    .port_gap{ position: relative;}
        .port_view_bg{
            position: absolute;
            top:0;
            left:0;
            width:100%;
            height:100%
        }
    .data_con{ width:90%;  }
    .data_tit strong { position:initial; margin-right: 10px; }
    .data_intro_ul { width: 100%; padding: 0 40px;}
    .data_cms_img_wrap{ height:36vw; }
    .cmsImg{
        width:700px;
        transform: initial;
        right:0;
        top:-190px;
    }
   
}

@media screen and (max-width:1024px){
    .sub_wrap.data{ margin: 70px auto 30vw; }
    .sub_tit_sub_wrap p { font-size: 18px; margin-bottom: 20px;}
    .sub_tit_sub_wrap h1 {margin-bottom: 80px; }
    .mention_txt { font-size: 26px;}
    .sub_strong_pnt_wrap{ min-height: initial; margin-bottom: 300px; }
        .sub_strong_pnt { width: 100%; margin:0 auto; padding: 50px 0 20px; }
            .sub_strong_pnt li dl{ flex-wrap: wrap; }
            .sub_strong_pnt_bg{ height:100%; }
                .sub_strong_pnt_txt{
                    width:90%; margin: 0 auto; height: 300px;
                }
                .sub_strong_pnt_img{
                    width:100%;
                    height:400px;
                    margin-top: 40px;
                    overflow: hidden;
                    padding-left: 0;
                }
                    .sub_strong_pnt_img img{
                        width:100%; margin: 0 auto; transform: translateY(0%);
                    }
                .sub_strong_pnt .slick-arrow { top:320px; }
                .sub_strong_pnt .slick-prev { left: calc(50% - 50px) }
                .sub_strong_pnt .slick-next { left: initial; right:calc(50% - 50px) }
    .mamber_wrap{ flex-wrap: wrap; }
      .mamber_wrap li { margin: 0 2%; flex-basis: 25%}
            .member_img img{ max-width:100%; }
            .mamber_wrap li h3 { font-size: 22px;}
    .sub_tit_sub_wrap.member::after {
        width: 440px; height: 220px; left:130px;
    }
    .sub_tit_sub_wrap.member::before { width: 500px; left: -6%; }
    .field_img { width: 200px; margin-right: 15px; }
    .field_txt{ width: calc(100% - 220px); }
        .field_txt h3 {font-size: 18px;}
        .field_txt p{ font-size:14px; }
    .sub_port_list .swiper-slide{ width: 44vw !important; }
        .sub_port_list li a { height: 33.5vw !important;}
            .port_txt{ padding: 30px; }
                .port_name { font-size: 18px;}
    .port_view_banner { padding: 35px; }
    .port_view_banner_cnt h3 {
        font-size: 30px; margin: 10px 0 20px;
    }
    .port_view_banner_cnt p { font-size: 14px; }
    .port_link {margin-top: 50px;}
        .port_gap { height:45vh; }
        .port_app_cnt { padding-top: 50px;  }
    .port_letsbee_graphy{ height:110vw; }
        .port_letsbee_graphy img{ max-width: 90%; }
    .data_banner_cnt{ margin-top: 30px; }
        .data_banner_cnt h3 { font-size: 45px; margin-bottom:15px; }
        .data_banner_cnt p{ font-size:24px; }
    .data_intro_ul{ padding: 0 20px; }
    .data_intro_ul li{ flex-basis:370px; }
    .data_tit strong {font-size: 70px;}
    .data_tit span { font-size: 38px}
        .data_txt {font-size: 18px;}
        .data_sec01_txt p { font-size: 18px;}
        .data_sec01_graphy02_site{ width:100%; }
        .data_sec01_graphy02_site::after{ width: calc(100% - 160px);}
            .data_sec01_graphy02_site li dt{ width:140px; }
            .data_sec01_graphy02_site li dt img{ width:100%; }
                .data_sec01_graphy02_site li dd { font-size: 14px; width:140px; letter-spacing: -0.8px; }
            .data_sec01_graphy03 .highcharts-root { width: 250px !important; }
                .highcharts-container {width: 250px !important;}
    .cms_pop{ top:22vw;}
    .data_chk_tit h3 { font-size:30px;}
    .ai_cost_table tr td { font-size: 15px; }
    .naviBg_cnt p{ width:calc(100% - 300px) }
    .cmsImg{ width:550px; top:-90px; }
}

@media screen and (max-width:768px){
    .data_txt { font-size: 16px; }
    .sub_wrap {margin:60px auto 120px; }
    .sub_wrap.port_view {margin:60px auto 0px; }
    .sub_tit_wrap h3 {font-size: 40px;}
        .sub_tit_sub_wrap h1 { font-size: 25px; margin-bottom: 50px; }
        .mamber_wrap{ margin-top: 30px;}
          .mamber_wrap > li{ flex-basis: 100%; margin: 0 auto 80px;}
            .member_img{ width:auto; }
        .sub_strong_pnt_wrap { margin-bottom: 200px; }
            .sub_tit_sub_wrap.member::before { width: 400px; }
            .sub_tit_sub_wrap.member::after {
                width: 300px; height: 150px; left:150px; top: -120px
            }
        .sub_strong_pnt { padding: 30px 0 0px;}
            .sub_strong_pnt_txt h5 {font-size: 18px;}
            .sub_strong_pnt_txt h3 {font-size: 30px;}
            .sub_strong_pnt_img{ height:300px; }
    .sub_tab_wrap_scroll{ overflow-y: hidden; width:100%; }
        .sub_tab_wrap{ width: 800px; }
            .sub_tab_wrap li{ flex-basis: 200px }
                .sub_tab_wrap li a{ font-size:16px; }
    .work_cnt_keyword { margin: 40px auto 100px; }
    .work_cnt_keyword .slick-arrow{ width:36px; height:27px; bottom:-40px; }
        .work_cnt_keyword li p { font-size: 16px;}
    .sub_field_head{ flex-wrap: wrap; margin: 30px auto; }
        .field_img{ width:100%; }
        .field_txt{ width:100%; margin-top: 30px; }
    .sub_field_ul{ flex-wrap: wrap; }
        .sub_field_ul li { margin: 0 auto 10px; padding: 20px; }
            .sub_field_ul li dt { font-size: 16px; margin-bottom: 10px;}
                .sub_field_ul li dd p { font-size: 14px;}
                .sub_field_ul li dd p.dot::before { top:12px }
    .port_view_banner{ height: 330px; padding: 20px; }
        .port_txt{ padding: 20px; }
        .port_link { margin-top: 30px;}
        .port_view_banner_cnt p { letter-spacing: -0.8px; }
        .port_gap { height:30vh; }
        .port_app_cnt { padding-top: 30px;  }
    .contact_btn{ flex-wrap:wrap; }
        .contact_agree_box{ width:100%; justify-content: flex-start }
    .sub_port_list .swiper-slide { width: 43vw !important; }
    .sub_port_list .swiper-slide:not(:nth-child(3n+1)) { margin:initial; }
    .sub_port_list .swiper-slide:not(:first-child) { margin: 0 0.5vw 1vw; }
    .sub_port_list li a { height: 32.9vw !important; }
      .port_view_bg{}
    .data_intro_sec{ width:90%; margin: 0 auto; }
        .data_tit strong { font-size: 60px; display: block; }
        .data_tit span { font-size: 30px; display: block; }
        .data_intro_ul { flex-wrap:wrap; }
            .data_intro_ul li { flex-basis: 100%;}
            .data_intro_ul li:first-child{ margin-bottom: 120px; }
                .data_intro_ul::before {
                    font-size: 60px; top: 50%; transform: translate(-50%,-50%);
                }
                .data_intro_ul li dd img{  }
            .data_intro_sec h2 { font-size: 26px; }
    .data_sec01_graphy01 { 
        flex-wrap: wrap; 
        justify-content: space-between; 
        margin: 20px 0 80px; 
        position: relative;
        z-index: 2;
    }
        .data_sec01_txt {
            padding: 15px 20px;
            width:80%;
            max-width:600px; 
            margin-left: 0px;
            margin-right: initial;
            margin-bottom: 30px;
        }
            .data_sec01_txt p{font-size:16px;}
            .data_sec01_txt h5{font-size:14px;}
        .data_sec01_graphy01 > img{ 
            position: relative; 
            top:40px; 
            right:0;
            width:80px;
            z-index: -1;
        }
    .data_sec01_graphy02_site { margin: 0 auto 80px;}
    .data_sec01_graphy02_site02 { margin: 40px auto 80px; }
    .data_sec01_graphy02_site::after { width: 64vw; bottom: -60px; height:4px; }
        .data_sec01_graphy02_site li::after { 
            height: 20px; bottom: -40px; width:4px;
        }
        .data_sec01_graphy02_site li::before { 
            height: 20px; bottom: -60px;
        }
        .data_sec01_graphy02_site li:nth-child(1)::before, .data_sec01_graphy02_site li:nth-child(2)::before { 
            border-bottom: 4px solid #eaeaea; border-left: 4px solid #eaeaea; left: calc(50% + 8px); 
        }
        .data_sec01_graphy02_site li:nth-child(3)::before, .data_sec01_graphy02_site li:nth-child(4)::before { 
            border-bottom: 4px solid #eaeaea; border-right: 4px solid #eaeaea; right: calc(50% - 12px);
        }
        .data_sec01_graphy02_arrow::before {height: 25px; top: -23px; width: 4px;}
               .data_sec01_graphy02_site li dt { width: 21vw; }    
               .data_sec01_graphy02_site li dd { width: 21vw; height:36px; }  
        .data_sec01_graphy02_mid_tit { font-size: 20px;}
        .data_sec01_graphy02_mid_tit::before {
            width: 70px; height: 100px; left: calc(50% - 280px); top: 0px;
        }
        .data_sec01_graphy02_mid_tit::after {
            width: 100px; height: 120px; right: calc(50% - 280px); top: -30px;
        }
        .data_sec01_graphy02_mid_tit02::before {
            width: 90px; height: 80px; left: calc(50% - 280px); top: -30px;
        }
        .data_sec01_graphy02_mid_tit02::after {
            width: 160px; height: 120px; right: calc(50% - 280px); top: -45px;
        }
    .bar_graphy_cnt ul { width: 140px; }
    .cms_pop{ width:32vw; top: 21vw; }
    .cms_pop::before { height: 5%; top:-5%; }
    .data_sample_graphy02_wrap img{ width: 45%; display: block; }
    .ai_cost_table tr th div{ font-size:16px; padding: 10px }
    .th_2{ font-weight:400 !important; font-size:14px !important; }
        .ai_cost_table tr td { font-size: 12px; }
        .ai_cost_table tr td div .c_purple{ font-size:16px; }
        .ai_cost_table_wrap::after { 
            width: 70px; height: 90px;  right: -30px; top: -50px; 
        }
        .ai_cost_table_wrap::before { width: 60px; height: 80px; left: -20px; }
    .sub_img_field{ margin:40px auto 100px; }
    .naviBg{ padding:50px 0; margin-bottom: 100px; }
    .naviBg_cnt p { width: calc(100% - 210px); font-size:14px; }
    .cmsImg { 
        width: 350px; top: 50%; transform: translateY(-37%);
    }
    
}
@media screen and (max-width:640px){
        .mention_txt { font-size: 20px;}
     .sub_strong_pnt_txt {height: 400px;}
         .sub_strong_pnt .slick-arrow { top: 400px;}
    .data_sec01_txt { width:90%; }
        .data_sec01_txt p { font-size: 14px; }
    .data_sec01_graphy01 > img{ 
        position: absolute;  right:0; top:100px; width:60px;
    }
    .data_sec01_graphy03{ flex-wrap: wrap; }
        .data_sec01_graphy03 li { width: 100%; margin-bottom: 10px; }
    .data_sec01_graphy04_wrap { margin-top: 0px; }
        .data_sec01_graphy04{ flex-wrap: wrap; }
            .data_sec01_graphy04 > li{ width:100%; }
            .data_sec01_graphy04 > li:not(:last-child){ margin-bottom: 70px; }
                .bar_graphy_tit{ margin-bottom: 20px; }
    .bar_graphy_cnt ul { width: 80%; }
    .data_banner_cnt h3 { font-size: 35px; }
    .data_banner_cnt p { font-size: 18px; }
    .data_sec01_graphy02_mid_tit::before { left: 2%; width:10vw; }
    .data_sec01_graphy02_mid_tit::after { right: -2%; width:15vw; }
    .data_sec01_graphy02_mid_tit02::before { left:-2%; width:15vw; }
    .data_sec01_graphy02_mid_tit02::after { width:25vw; }
    .data_sample_graphy01_top { width:100%; justify-content:space-between; }
        .data_sample_graphy01_top::after {width: 42vw;}
        .data_sample_graphy01_top li{ width:43vw; height:43vw; margin: 0; }
    
    .data_sample_graphy01_bottom { width: 100%; }
    
    
}

/*모바일*/
@media screen and (max-width:480px){
    .sub_wrap.data{ margin: 40px auto 30vw; }
    .data_txt { font-size: 14px; }
    .black_txt{ width:90%; margin: 0 auto; }
/*    .sub_tab_wrap{ width:90%; margin:30px auto 0; }*/
    .sub_tit_wrap { padding: 40px 0 110px;}
        .sub_tit_sub_wrap h1 { margin-bottom:40px; font-size:18px; }
         .sub_tit_sub_wrap.member h1{ font-size:25px }
        .mention_txt { font-size: 18px;}
            .sub_tit_sub_wrap.member::before { width: 74vw; }
            .sub_tit_sub_wrap.member::after {
                width: 40vw; height: 20vw; left:initial; right:10vw; top: -14vw
            }
            .sub_strong_pnt_wrap { margin-bottom: 150px; }
            .sub_strong_pnt_txt p {font-size: 14px;}
            .sub_strong_pnt_txt {height: 370px;}
               .sub_strong_pnt .slick-arrow { top: 390px;}
        .sub_tab_wrap{ width: 750px; }
            .sub_tab_wrap li{ flex-basis: 150px }
                .sub_tab_wrap li a{ font-size:14px; }
    .sub_port_list .swiper-slide{ width: 100% !important; }
        .sub_port_list li a { height: 68.5vw !important;}
         .port_view_banner_cnt h3 {font-size: 20px;}
         .port_view_banner_cnt p { font-size: 12px;}
            .port_gap { height:20vh; }
          .who_cnt_keyword .slick-arrow { width: 15px; height: 20px; }
          .who_cnt_keyword .slick-prev{ left:calc(50% - 20px);}
          .who_cnt_keyword .slick-next{ right:calc(50% - 20px);}
          .work_cnt_keyword .slick-arrow { width: 15px; height: 20px; }
          .work_cnt_keyword .slick-prev{ left:calc(50% - 20px);}
          .work_cnt_keyword .slick-next{ right:calc(50% - 20px);}
    .data_banner { height: 280px;}
        
            .data_banner_cnt h3 { font-size: 28px; }
            .data_banner_cnt p { font-size: 14px; }
    .data_intro_sec h2 { font-size: 20px; margin: 40px auto 80px; }
    .data_intro_ul li dd h3 { font-size: 16px;}
    .data_tit span { font-size: 6.5vw; }
    .data_tit_sub.mb { margin-bottom: 20px; }
    .data_tit_sub span { font-size: 18px;}
    .data_sec01_txt { width: 85%; padding: 15px 10px; }
/*    .data_sample_graphy01_top li { width:45vw; height:45vw;}*/
    .data_sample_graphy01_top::after { width:40vw;}
        .data_sample_graphy01_top li dd { width: 30vw; height: 26vw; }
            .data_sample_graphy01_top li dd p { width: 16vw; height: 16vw;}
    .data_sec01_graphy01 > img{ top:140px; }
    .data_sec01_graphy02_mid_tit { font-size: 15px; margin: 15px auto; }
        .data_sec01_graphy02_mid_tit::after {right: -5vw;}
        .data_sec01_graphy02_mid_tit02::after{ width:35vw; }
    .data_sec01_graphy02_site { margin: 0 auto 50px;}
    .data_sec01_graphy02_site02 { margin: 20px auto 50px; }
    .data_sec01_graphy02_site::after { bottom: -30px; width: 62vw;}
    .data_sec01_graphy02_site li::after { height: 15px; bottom: -15px; width:4px; }
    .data_sec01_graphy02_site li::before { bottom: -30px; }
    .data_sec01_graphy02_site li dd { font-size: 12px; }
    
    .data_chk_tit h3 { font-size:26px;}
    .data_sample_graphy02_wrap{ flex-wrap: wrap;}
        .data_sample_graphy02_wrap img{ 
            width: 240px; display: block; margin-bottom: 30px; 
        }
    .ai_cost_table tr td { font-size: 11px; }
    .ai_cost_table tr td div .c_purple { font-size: 14px;}
    .naviBg_cnt p { width: 100%; position: relative; z-index: 2}
    .cmsImg {
        width: 250px; top: 80px; 
    }
}