.mo_open{display: none}
.mo_nav_are{display: none}

.pclist{}
.molist{display: none}



@media (min-width: 1930px) {

.controls{display: none}
.main_slide .slick-dots{padding-left: 0}

}


@media (min-width: 1641px) and (max-width: 1910px){

.controls{left: 7rem;}


}


@media (max-width: 1640px) {

.controls{left: 20px;}


}






@media (max-width: 1580px) {

.product_are{gap:50px;}

}


@media (max-width: 1360px) {

 
.ceo,
.management_flex{gap:50px}
.ceo .txt{flex:1}
.ceo .txt p br{display: none}
.ceo .thum{width: 30%}
.bu_slide .box{height: 40vh}


.product_are .p_slide_are{width: 40%}
.p_info{padding-top: 0}


}


@media (max-width: 1280px) {


.main_visual_txt h2{font-size: 40px}
.main_visual_txt p{font-size: 18px}
.common_btn{width: auto; font-size: 16px; padding: 15px 35px}
.top_btn{bottom: 20px; right: 20px; width: 60px; height: 60px}

.top_nav li a.main_deps,
.top_nav li .sub_deps a,
.lang .lang_list a{font-size: 16px}

.flex_bu_main .box{height: 30vh}
.flex_bu_main .box p{font-size: 16px}
.flex_bu_main .box h3{font-size: 18px}

.main_p a.box p{font-size: 22px}

.cont_slide {
    border-radius: 10px 0px;
    gap: 20px;
    padding: 10px 15px;
}


.main_board_slide{margin: 0 -10px}
.main_board_slide .slick-slide{padding: 0 10px}

.foot_info{padding: 40px 0}
.foot_are .bg_foot{padding: 60px 0}	
.main_title{margin-bottom: 50px}	

.main_title h3,
.ceo .txt p,
.sub_title p,
.management_flex .right .box p,
.management_flex .left p,
.history .right .box p,
.ci_are .txt p{font-size: 16px}

.management_flex .left p br,
.ci_are .txt p br{display: none}

.main_title h2,
.sub_visual h2,
.ceo .txt h2,
.sub_title h2{font-size: 30px}	

.sub_title h3{font-size: 24px}	

.ceo .txt .sign_ceo h3,
.management_flex .left h3{font-size: 18px;}
.ceo .txt .sign_ceo img{max-height: 30px}
	
.foot_info ul li,
.foot_info p.copy{font-size: 14px}	
.foot_info ul li b{font-size: 12px}	
.management_flex .left{flex:1}
.management_flex .right{width: 50%}

.sub_visual .sub_visual_nav{margin-top: 30px}

.management .box{width: 100%; border-radius: 20px}
.management .box .thum{border-radius: 20px}
.management .box .txt,
.management .box:nth-child(2) .txt{padding-left: 80px}


.history .left{width: 200px}
.history .left a{font-size: 16px}
.history .right .box h2{font-size: 24px; width: 200px}
.location .txt h3,
.ci_are .txt h3{font-size: 24px}

.location .txt ul li{font-size: 16px; gap:10px}

.history .right .box{gap:30px}


.ci_are{gap:40px}
.ci_are .thum{width: 40%; height: 40vh}


.ci_are .txt a.down_btn{font-size: 16px}
	
.sub_title{margin-bottom: 40px}
.sub_title h2{font-size: 24px}	
.sub_title h3{font-size: 18px}	

.ci_flex .box{height: 35vh; padding: 30px}
.bu_slide .box{padding: 30px}
.bu_slide .box p{font-size: 16px}

.ci_flex .box h3{font-size: 18px}
.ci_flex .box p,
.partner_flex ul li p{font-size: 16px}
	
	
.bu_flex,
.ink_flex{gap:20px;}	
.notice_p p,
.notice_p h3,
.ink_flex p,
.bu_flex .box p{font-size: 16px}	
	
	
.partner_flex ul{gap:40px 20px}	
.partner_flex ul li {
    width: calc(25% - 15px);
}


.partner_flex ul li .thum img{max-width: 80%}
	
	
.sub_are .product_nav{margin-bottom: 50px}	
	
.p_info_title h2{font-size: 24px}	

.p_info{flex:1}
.p_info_box{padding: 30px 25px}
.p_info_box p{font-size: 16px}	
	
.pr_btn {
    border-radius: 10px 0px;
    background: #153985;
    box-shadow: 2px 2px 25px 0px rgba(0, 0, 0, 0.15);
    padding: 0 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    color: #fff;
    font-size: 16px;
    display: inline-block;
    min-width: max-content;
    border: 0;
}	
	
	
.sub_title_small h2{font-size: 24px}

.sub_title_small {
    margin: 60px 0 40px;
}

	
.tlb table th, .tlb table td{padding: 15px; font-size: 16px;}	
	
.form_in ul li label{font-size: 14px}	
	
.board_list_box{border-radius: 10px 0 10px 0; padding: 30px 35px}	
.board_list_box .txt h3{font-size: 18px}
.board_list_box .txt p{font-size: 14px}


.board_detail_content p{font-size: 16px}
.board_list_txt h3{font-size: 16px}	
.gall_list_style{gap:40px 20px}



}




@media (max-width: 1024px) {
	
img{max-width: 100%}


.header .inner{height: 100px}
.header .top_right{margin-right: 60px}


.flex_bu_main {
    flex-wrap: wrap;
}
.flex_bu_main .box {
        height: 30vh;
        width: calc(50% - 10px);
        flex:none
    }
    
.section{max-height:none}    
.main_bu,
.main_news{height: auto; padding: 150px 0} 

.main_s .foot_are{height: auto; display: block}

.main_p{height: auto;flex-wrap: wrap; padding: 50px 20px}    
   
.main_p a.box + .box {
    margin-left: 0;
}   


.main_p a.box{flex:none ; padding: 25px; width: 50%; height: 40vh}

.main_p a.box img{display: none}


.main_p a.box:hover{flex:none}



.main_p a.box:nth-child(1){box-shadow: none; border-radius: 0; padding: 25px}
.main_p a.box:nth-child(2){box-shadow: none; border-radius: 0; padding: 25px}
.main_p a.box:nth-child(3){box-shadow: none; border-radius: 0; padding: 25px}
.main_p a.box:nth-child(4){box-shadow: none; border-radius: 0; padding: 25px}


.management .box .thum{position: relative; width: 100%; height: 20vh; border-radius: 0}
    .management .box {
        padding: 0;
        height: auto;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
    }
.management .box:hover .txt *{color: #222}

.management .box .txt, .management .box:nth-child(2) .txt{padding: 30px 45px}

.management .box:nth-child(2) {
    margin: 30px 0 0 auto;
    padding-left: 0;
    padding-right: 0;
    flex-direction: column-reverse;
}


.management_flex {
    margin-top: 100px;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
}


    .management_flex .right {
        width: 100%; max-width: 100%
    }


.history .left{display: none}
 
 
 
.ci_are {
        gap: 40px;
        flex-direction: column;
    }
 
 
     .ci_are .thum {
        width: 100%;
        height: 30vh;
    }
 
 
     .partner_flex ul li {
        width: calc(33.33% - 13.33px);
    }
 
    
/* 모바일 네비 시작 */

	.top_nav{display: none}
	.sns_top{right: 80px}

  
  	.mo_open{display: block;
    width: 25px;
    height: 19px;
    position: fixed;
    right: 20px;
    top: 40px;
    z-index: 9999}
    


    .mo_open  span {
    display: block;
    position: absolute;
    right: 0;
    width: 100%;
    height: 3px;
    border-radius: 15px;
    background: #fff;
    transition: all 0.3s ease-in-out;}


.header_top.drop + .mo_open span{background: #222}


.fp-viewing-s01 .header_top + .mo_open span{background: #222}
.fp-viewing-s02 .header_top + .mo_open span{background: #222}
.fp-viewing-s03 .header_top + .mo_open span{background: #222}
.fp-viewing-s05 .header_top + .mo_open span{background: #222}


    .mo_open span:first-child {
    top: 0;}

    .mo_open span:nth-child(2) {
    top: 50%;
    width: 70%;
    transform: translateY(-50%);}

    .mo_open span:nth-child(3) {
    bottom: 0;}


    .open_nav .mo_open span{background: #222}

    .open_nav .mo_open span:first-child {
    top: 50%;
    transform: translateY(-50%) rotate(45deg);}


    .open_nav .mo_open span:nth-child(2) {
    opacity: 0;}

    .open_nav .mo_open span:nth-child(3) {
    bottom: 50%;
    transform: translateY(50%) rotate(-45deg);}
    
    .mo_nav_are{position: fixed; right: -100%; top: 0; background: #f5f5f5; 
    width: 100%;; height: 100%; z-index: 9998; transition-duration: 1s; opacity: 0; display: block}

  	.open_nav .mo_nav_are{right: 0; transition-duration: 1s; opacity: 1}
  	
  
  	
  	.nav_drop{margin-top: 130px}

    .collapsible {
            background-color: #f5f5f5;
            color: #222;
            cursor: pointer;
            padding: 20px;
            width: 100%;
            border: none;
            text-align: left;
            outline: none;
            font-size: 18px; font-weight: bold
        }
        .collapsible .active,
        .collapsible:hover {
            color: #153985
        }
        .content {
            padding: 0 20px;
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.2s ease-out;

        }

        .content a{font-size: 18px; padding: 8px 0; display: block; color: #333}

        .collapsible:after {
            content: '\002B';
            color: #666;
            font-weight: bold;
            float: right;
            margin-left: 5px;
        }
        .collapsible .active:after {
            content: "\2212";
        }






.header.drop + .mo_open span{background: #222}

#bo_v{width: 100%}
#bo_v .sub_title h2,
.board_detail_content p{word-break: break-all}

 
/* 모바일 네비 끝 */

.product_flex3{flex-direction: column;
      }
.product_flex3 .box{  padding: 30px 25px;}

.product_flex3 .box h3{font-size: 18px}
.product_flex3 .box p{font-size: 16px}


body{overflow-x: hidden}


}




@media (max-width: 860px) {
	
	
.location .txt .kakao{padding: 10px 15px; border-radius: 5px; display: flex; gap:10px; }
.location .txt .kakao a{ font-size: 14px; }




.ceo {
    flex-direction: column-reverse;
}

.ceo .thum{width: 100%; border-radius: 10px; height: 40vh}
.ceo .thum img{width: 100%; height: 100%; object-fit: cover;}


.bu_flex .box{flex:none; padding: 30px 20px; width: calc(50% - 10px)}
.ink_flex .box{width: calc(50% - 10px)}


.bu_flex, .ink_flex {
    flex-wrap: wrap;
}

.bu_slide{margin: 0 -10px}
.bu_slide .slick-slide{padding: 0 10px}


.partner_flex ul li .thum{height: 20vh; border-radius: 10px}


    .product_are {
        gap: 50px;
        flex-direction: column;
    }

    .product_are .p_slide_are {
        width: 100%;
    }
.board_list_box{gap:30px}
.board_list_box .date{width: 70px}
.board_list_box .txt{width: calc(100% - 100px)}


.gall_list_style li {
    width: calc(50% - 10px);
}


.total_board p{font-size: 14px}

.sub_are{padding: 100px 0}


.agree_pop_content{max-width: 95%; border-radius: 5px; padding: 30px 15px}
.agree_pop_content .agree_title h2{font-size: 16px}
.agree_pop_info h3,
.agree_pop_info p{font-size: 14px}


}




@media (max-width: 600px) {
	
	
.product_flex3{flex-direction: column;
      }
.product_flex3 .box{  padding: 30px 25px;}

.product_flex3 .box h3{font-size: 16px}
.product_flex3 .box p{font-size: 14px}
	
	
	
.location .txt .kakao{position: relative; width: auto; margin-top: 30px; display: inline-flex ; gap:15px; padding: 15px 25px}
.location .txt .kakao a{ font-size: 14px; }	
	

.header .logo{width: 50px; height: 40px}
.header .inner{height: 80px}
.mo_open{top: 30px}
.header .top_right{margin-right: 50px;}


.main_visual_txt h2{font-size: 24px}
.main_visual_txt p{font-size: 16px}
    .main_bu, .main_news {
        height: auto;
        padding: 100px 0;
    }

.common_btn{font-size: 14px; padding: 10px 25px; border-radius: 5px}

.main_title h3{font-size: 14px}

.main_title h2{font-size: 20px; margin-top: 10px}
.main_title h2 br{display: none}

    .flex_bu_main .box {
        height: auto;
        width: 100%;
        flex: none;
        padding: 30px 20px;
        border-width: 1px;
    }


.flex_bu_main .box h3{margin: 10px 0 0 0}
.flex_bu_main .box img,
.flex_bu_main .box:hover img{display: none}

.flex_bu_main .box:hover{border-radius: 0; scale:1}

.main_p a.box{height: 30vh}
.main_p a.box p{font-size: 16px}


.flex_bu_main .box p{font-size: 14px}
.flex_bu_main .box h3{font-size: 16px; margin-top: 5px}


.main_new_top {
    margin-bottom: 40px;
    align-items: flex-start;
    justify-content: space-between;
    flex-direction: column;
    gap: 30px;
}

.ceo .txt h2{font-size: 24px;}


    .management .box .txt, .management .box:nth-child(2) .txt {
        padding: 30px 25px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }

.management .box .txt h3{font-size: 16px}
ul.dist li{font-size: 14px}

.management .box{border-radius: 5px}

.management_flex .left p{font-size: 14px}




.management_flex .right .box{width: calc(50% - 10px); padding: 30px 20px}


.sub_visual{height: 350px; padding-bottom: 50px}

.sub_visual .sub_visual_nav li{font-size: 14px}

.sub_visual .sub_visual_nav {
        margin-top: 20px;
        gap: 10px;
    }


.sub_visual p{font-size: 14px}
.sub_visual h2{font-size: 24px}

.history .right .box {
        gap: 30px;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
    }


.history .right .thum{border-radius: 5px}

.history .right .box p{font-size: 14px; gap:10px}

.history .right .box p span{flex:1}


.location .map,
.ci_are .thum{border-radius: 5px}
.location .map iframe{max-height: 30vh}

.location .txt h3, .ci_are .txt h3{font-size: 18px}

.location .txt ul li,
.ci_are .txt p,
.ci_are .txt a.down_btn,
.ci_flex .box p{font-size: 14px}
.ci_flex {
    gap: 20px;
    flex-direction: column;
}


    .ci_flex .box {
        height: 30vh;
        padding: 20px;
        flex: none;
    }


.bu_flex .box {
        padding: 30px 20px;
        width: 100%;
        border-radius: 5px;
    }

.bu_flex .box p{margin-top: 20px; font-size: 14px}

.notice_p{padding: 30px 20px; border-radius: 5px; margin-top: 30px}


.notice_p p,
.ink_flex p,
.partner_flex ul li p{font-size: 14px}
.ink_flex .thum,
.partner_flex ul li .thum{border-radius: 5px}

    .ink_flex .box {
        width: 100%;
    }
    
    

    .partner_flex ul li {
        width: calc(50% - 10px);
    }



.sub_are .product_nav {
    gap: 10px;
    flex-wrap: wrap;
}


.sub_are .product_nav a.on_nav, .sub_are .product_nav a:hover {
    background: #153985;
    box-shadow: 2px 2px 25px 0px rgba(0, 0, 0, 0.15);
    border-radius: 5px;
    border-color: #153985;
    color: #fff;
}


.sub_are .product_nav a {
    height: auto;
    text-align: center;
    border: 1px solid #ddd;
    font-size: 16px;
    line-height: 1.5;
    word-break: keep-all;
    font-size: 14px;
    padding: 10px 25px;
    transition-duration: 1s;
}

.small_slide{margin: 0 -5px}
.small_slide .slick-slide{padding: 5px}

.big_slide .box{border-radius: 5px}
.p_info_box p{font-size: 14px}
.p_info_box{margin: 30px 0}


.pr_btn{height: auto; line-height: 1.5; font-size: 14px; padding:10px 15px; border-radius: 5px; width: 100%; text-align: center}



.sub_title_small h2{font-size: 18px;}
.tlb{overflow-x: auto}
.tlb table th, .tlb table td{padding: 10px; font-size: 14px}

.sub_title_small {
        margin: 60px 0 20px;
    }


.form_in ul li {
    width: 100%;
}


.form_in input, .form_in select {
    background: #fff;
    height: 50px;
    line-height: 50px;
    border-radius: 5px;
    padding: 0 15px;
    font-size: 14px;
    color: #1D1D1B;
    border: 0;
    width: 100%;
    border: 1px solid #ddd;
}

.form_in textarea {
    background: #fff;
    height: 150px;
    line-height: 1.5;
    border-radius: 5px;
    padding: 15px 15px;
    font-size: 14px;
    width: 100%;
    border: 1px solid #ddd;
}

.form_in ul li .file_are {
    gap: 10px;
    justify-content: flex-start;
    align-items: center;
}

.form_in ul li .file_are input {
    background: #f5f5f5;
    flex: 1;
}

.form_in ul li .file_are button {
    font-size: 14px;
    height: 50px;
    line-height: 50px;
    background: #1D1D1B;
    color: #fff;
    border-radius: 8px;
    width: auto;
    font-weight: 600;
    border: 0;
    transition-duration: .5s;
    padding: 0 15px;
}


.ck_agree p{font-size: 14px}


.board_list_box{padding: 25px 15px; gap:15px}
.board_list_box .txt h3{font-size: 16px}
.board_list_box .date p{font-size: 12px; margin: 0}
.board_list_box .date h3{font-size: 20px}


.sub_title h2{font-size: 20px}
.sub_title p,
.board_detail_content p{font-size: 14px; line-height: 1.5}

#bo_v_atc{padding: 30px 0}


.gall_list_style li{width: 100%}
.board_list_txt{margin-top: 15px}
.board_list_txt h3{font-size: 14px}

.video-container{border-radius: 0}

.main_board_slide h3{font-size: 14px}
.main_board_slide p{display: none}

}



@media (max-width: 360px) {

 .controls{display: none}
 .main_slide .slick-dots{padding: 0 20px}
 
 .foot_info ul li {
    flex-wrap: wrap;
}
 
 .foot_info ul li b{border-radius: 0; width: auto; text-align: center}
 .foot_info ul li span{width: 100%}
 
 .foot_info img{max-width: 60px}
   
   
  .partner_flex ul li{width: 100%} 
   
     .content a {
        font-size: 16px;
        padding: 5px 0;
        display: block;
        color: #333;
    }  
   
   
   
   
}