.pc{}
.mo{display: none}

.close_btn {
        display: none;
    }

.all_nav_are{display: none}


.input_btn{justify-content: center;
    align-items: center;}

@media (max-width: 1810px) {
	
	
	
	
	
	#my-nav{right: 20px}
	.scroll_down{right: 25px}
	
	
	.flex_hover .box{height: 55vh}
	.sboom{display: none}
	
	.main_service, .main_news{padding: 170px 0 30px}
	
	
	.main_public .left, .main_public .right{padding:170px 5rem 30px }
	
	.main_service .right_txt .main_title{flex:1}
	
	.main_title p{word-break: keep-all}
	
	
	
	
	
}

@media (max-width: 1680px) {
	
	
	#my-nav{display: none}
	.scroll_down{display: none}
	
	
	.main_public .left, .main_public .right {
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }
	
	
	.main_service, .main_news{display: flex;
        align-items: center;
        gap: 0; padding: 0; padding-top: 90px;}
        
    .main_public .left{padding:170px 50px 30px 25px}  
    .main_public .right{padding:170px 25px 30px 50px}    
        
        
	.slide_txt{padding: 0 25px 260px}
	.slide_btn{padding: 0 25px}
}


@media (max-width: 1460px) {
	

	
	.news_slide .box .img_are img {
    width: 100%;
    height: 100%;
    object-fit: cover;}
    
    .slide_txt h2{font-size: 60px;}
    
    .main_tech {
    padding: 90px 0 0;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;}
    
    
    .main_public .left{padding:90px 50px 0px 25px}  
    .main_public .right{padding:90px 25px 0px 50px} 
	
	.main_title h2{font-size: 48px}
	.board_least_title h2{font-size: 38px}
	
	.flex_hover .box{padding: 45px 35px}
	
	.flex_hover .box:hover h2 {
    font-size: 40px;
    line-height: 50px;}
	
	
	.history_tab{display: none}
	
}



 
@media (max-width: 1280px) {
	
	.service03_service {
    flex-direction: column;
}
	
	.service03_pss .flex_pss .box{width: auto; flex:1}
	.service03_pss .flex_pss.notbox{gap:30px}
	.service03_pss .flex_pss.notbox .box{width: auto; flex:1}
	
	
	
	.service_first .flex_ser .mini .line_box_ser *{font-size: 16px}
	
	.p_list_flex li{gap:4rem}
	.p_list_flex li .txt p{font-size: 16px}
	
	.sub_title h4{font-size: 16px; margin-bottom: 10px}
	.sub_title h2{font-size: 40px}
	.sub_title h3{font-size: 18px}
	
	.p_list_flex li .txt h2{font-size: 40px}
	
	.left_overview .small_txt_are p.last_sign b{font-size: 24px}
	.mission_flex .box .txt h2 b{font-size: 24px}
	.mission_flex .box .txt h2{font-size: 18px}
	
	.p_list_flex li .txt a{font-size: 16px; padding: 15px 20px}
	
	.partner_flex,
	.location_are{gap:20px}
	
	.location_box h4{font-size: 16px}
	
	.sub_title_are h2{font-size: 40px}
	
	.rnd_partners li p{font-size: 16px}
	
	.sub_only_img{padding-left: 0}
	

	.main_title h2{font-size: 34px; line-height: 44px}
	.board_least_title h2{font-size: 34px}
	.main_title p{font-size: 16px; line-height: 25px}
	.main_title p br{display: none}
	
	
	.main_service .inner2{gap:50px}
	.main_service .left {
    width: calc(100% - 50px - 40%);}
	
	.main_service .right{width: 40%}
	
	.flex_hover .box {
        height: 45vh;
    }
    
    .flex_hover .box .txt_are h2{font-size: 20px}
    .flex_hover .box:hover h2{font-size: 34px; line-height: 44px}
    
    
   /*sub*/
  
  .left_overview h2{font-size: 40px; line-height: 55px}
  
  .left_overview .small_txt_are {
    margin-top: 50px; }
    
   .left_overview .small_txt_are p {font-size: 16px; line-height: 24px; word-break: keep-all}
   .left_overview .small_txt_are p + p{margin-top: 20px} 
   
   .flex_overview_over .box .box_txt h3{font-size: 22px; line-height: 32px}
   
   .flex_overview_over .box .box_txt ul li {font-size: 16px; line-height: 24px; word-break: keep-all}
   .flex_overview_over .box .box_txt ul li:after{top: 10px}
   .history_info{padding: 0}
   
   .history_info h1{font-size: 40px}
   
   .history .tab__item a{font-size: 24px}
   .location_box h2{font-size: 24px}
   
   .tech_flex .info_tech h2{font-size: 40px; line-height: 55px}
   .tech_flex .info_tech p{font-size: 16px; line-height: 24px; word-break: keep-all}
   .tech_flex .info_tech p br{display: none}
	
}









@media (max-width: 1024px) {
	
	.service03_pss .flex_pss .box{flex:none}
	
	
	body{overflow-x: hidden}
	
	
	.service_first {
    flex-direction: column;
}
	.service_first .flex_ser{width: 100%}
	
	.service_first .flex_ser.left {
    align-items: center;
}

.service_first .flex_ser .mini .line_box_ser {
    flex: none;
    width: 100%;
}


.service03_step ul {
    gap: 20px;
    position: relative;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
}

.service03_step ul li {
    width: 100%;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.service03_step ul li.center_li {
    position: relative;
    top: 0;
}
	
.service03_step .mid_box + .mid_box {
    margin-left: 0; margin-top: 15px
}	
	
	
.service03_step2 {
    display: flex;
    align-items: flex-start;
    justify-content: center;
}
	
	.service03_step2 ul {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    flex:1
}

.service03_step2 ul li{
	display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap:25px
}

.service03_step2 ul + ul {
    margin-top: 0;
}

.p_list_flex li .thum{width: 30%;     aspect-ratio: 1;}

.p_list_flex li {
    align-items: flex-start;
    justify-content: flex-start;
}

.p_list_flex li .txt p{margin: 15px 0 25px}
.ctc_last .mid{padding: 15px 25px; text-align: center}

.ctc_last .r_box .in_box h2{font-size: 30px}

.service03_step2 ul + ul li{flex-direction: column-reverse;}
	
.service03_step2 ul:nth-child(2){display: none}	
	
.partner_flex, .location_are {
    gap: 50px;
    flex-direction: column;
}	
	
	.service_first .flex_ser .mini .line_box_ser *{width: 100%; }
	
	.service_first .flex_ser .mini{width: 100%}
	
	.point_dot{display: none}
	
	.service_first .flex_ser.mid .box:after,
	.service_first .flex_ser.mid .box:before,
	.service_first .flex_ser.mid .mini:after{display: none}
	
	.service_first .flex_ser .mini li {
    gap: 8px;
    flex-direction: column;}
	
	.fp-overflow{max-height: max-content; }
	
	.main_tech, .main_service, .main_public, .main_service, .main_news{height: auto; padding: 90px 0; overflow: hidden}
	
	.svg_icon{stroke-dashoffset: -0;}
	
	.section{min-height: auto !important}
	
	.header .inner{padding-right: 80px; height: 80px}
	
	
	.right_nav ul{display: none}

	
	.main_service{background: #fff}
	
	.main_service .inner2 {
    display: flex;
    gap: 80px;
    flex-direction: column;}
    
    .main_service .left, .main_service .right{width: 100%}
    
    .main_service .right .big_thum{height: 30vh; overflow: hidden}
    .main_service .right .big_thum img{width: 100%; height: 100%; object-fit: cover;}
    
    
    .flex_hover .box {
        height: 36vh;
        padding: 40px;
    }
    
    

    
    
    .main_public {
    display: flex;
    flex-direction: column;}
    
    
    .main_public .left{
        padding: 90px 25px;
        width: 100%;
        height: auto;
    }
    .main_public .right {
        padding: 90px 25px ;
        width: 100%;
        height: auto;
    }
    
    
    .main_contact{min-height: auto}
    
    
    
    .close_btn {
        display: block;
        width: 25px;
        height: 19px;
        position: fixed;
        right: 25px;
        top: 32px;
        z-index: 9999;
    }
    
    
    .header.drop .close_btn span{background: #111}
    
    .close_btn span {
        display: block;
        position: absolute;
        right: 0;
        width: 100%;
        height: 3px;
        border-radius: 15px;
        background: #fff;
        transition: all 0.3s ease-in-out;
    }
    
    .open_nav .close_btn span{background: #111}
    
    .open_nav .header .logo{opacity: 0}
    
        .close_btn span:first-child {
        top: 0;
    }
    
    .close_btn span:nth-child(2) {
        top: 50%;
        width: 70%;
        transform: translateY(-50%);
    }
    
    .close_btn span:nth-child(3) {
        bottom: 0;
    }
    
    .open_nav .close_btn span:first-child {
        top: 50%;
        transform: translateY(-50%) rotate(45deg);
    }
    
    .open_nav .close_btn span:nth-child(2) {
        opacity: 0;
    }
    
    .open_nav .close_btn span:nth-child(3) {
        bottom: 50%;
        transform: translateY(50%) rotate(-45deg);
    }
    
    .all_nav_are{display: block; width: 100%; height: 100%;  backdrop-filter: blur(50px); z-index: 9998; 
    position: fixed; right:-100% ; top: 0 ; background: rgba(255,255,255,0.8); opacity: 0; transition-duration: 1s}


	
	
	.open_nav .header .lang a{color: #111}
.open_nav .header .lang a:hover, .open_nav .header .lang a.on{border-color: #111}

	.mo_nav{margin-top: 80px;
        padding: 5rem 25px;
        text-align: center;
        height: calc(100% - 80px);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 10px;}



.all_nav_are .collapsible {
           font-size: 22px;
        text-align: center;
        color: #111;
        background: transparent;
        display: block;
        border: 0;
        width: 100%; font-weight: bold
        }

.all_nav_are .content {
            padding: 0 18px;
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.2s ease-out;
        }


.all_nav_are .content a{display: block; font-size: 18px; color: #111; }
.all_nav_are .content a + a{margin-top: 10px}

.mo_subdeps{padding: 15px 0}


.open_nav .all_nav_are{opacity: 1; right: 0}







 /*sub*/

.tech_detail .step3{background-position: left 15px;}
.tech_flex .thum_tech{padding-right: 50px}


.function_flex .box {
    height: auto;
    width: calc(33.33% - 16px);
}

.overview_flex{flex-direction: column-reverse; gap:60px}

.right_video {
    width: 100%;
    max-width: 100%;
    position: relative;
    top: 0;
    right: 0;
}

.left_overview{width: 100%}


.history_are{padding: 0 25px}
.history_are .img_h{padding: 0 50px 0 0}

.map_info li{width: 100%}


.service03_step .arrow img {
    margin: 0 auto;
    transform: rotate(90deg);
}

.service03_step .arrow{padding: 25px 0}

}




@media (max-width: 768px) {


	.service03_pss .flex_pss{gap:15px}
	.service03_pss .flex_pss .next3{display: none}

	.num_pss{gap:10px}
	.num_pss li{width: 100%}



	
	.main_title h2 {
        font-size: 40px;
        line-height: 50px;
    }
    
    .flex_hover {
    display: flex;
    gap: 10px;
    margin-top: 50px;}
    
    .flex_hover .box {
        height: 30vh;
        padding: 20px;
    }
    
    .flex_hover .box .txt_are h2{font-size: 20px; line-height: 32px; font-weight: bold}
    
    .flex_hover .box:hover p {
    height: auto;
    opacity: 1;
    max-height: 100px;
}
    
    .flex_hover .box .txt_are p {
    font-size: 14px;
    line-height: 20px; word-break: keep-all}
    
    .service03_detail li span,
    .service03_detail li b{height: auto; padding: 15px}
    
    
    .gall_list_style {
    gap: 80px 20px;
    flex-wrap: wrap;
}

.gall_list_style li {
    width: calc(50% - 10px);
}
    
    .main_service {
        gap: 50px;
        display: flex;
        flex-direction: column;
        padding: 0 25px 80px;
    }
	
	.main_service .left_img{width: 100%}
	.main_service .left_img .main_service_icon{display: none}
	
	.main_service .right_txt{width: 100%}
	
	.fp-overflow{max-height: max-content; }
	
	.svg_flex a {
        flex: none;
        width: calc(50% - 5px);
    }
    
    .svg_flex a:last-child{width: 100%}
    
    
    .board_least_title h2{font-size: 30px}
    
	.main_public .left, .main_public .right{padding: 80px 25px; height: auto}
	
	.main_service, .main_news {
        height: 100%;
        padding: 80px 0;
    }
    
    .main_tech{height: 100%}
    
    .flex_hover {
        flex-direction: column;
    }
    
    .flex_hover .box {
        height: 30vh;
        padding: 20px;
        flex: auto;
    }
    
    .flex_hover .box:hover {
    flex: auto;}
    
    .text_op0 {
    height: auto;
    opacity: 1;
    max-height: 100%;
    visibility: visible;
    transition-duration: 0s;}
    
    .main_public{height: auto}
    
    
    
    
    /*sub*/
   
   .sub_visual{height: 400px; padding-bottom: 0}
   .sub_visual_txt p{font-size: 14px}
   
   .sub_visual_txt h2 {
    color: #fff;
    font-size: 30px;
    font-weight: 600;
    margin-top: 10px;}
    
    .sub_warp{padding: 100px 0}
    
    .sub_title_are h2{font-size: 30px}
    
    .location_are{margin-top: 60px}
    
    .history .tab__item{padding: 0 25px}
    
    .history .tab__content-wrapper{margin: 60px auto 0}
    
    
    .history_info .history_info_flex li {
    padding-left: 100px;
    font-size: 16px;
    line-height: 24px;
    word-break: keep-all;}
    
    .history_info h1 {
        font-size: 24px;
        margin-bottom: 20px;
    }
    
    
    .sub_only_img{margin-top: 60px}
    .overview_flex{margin-top: 0px; padding-bottom: 100px; padding-top: 60px}
    
    .mission_flex {
    flex-wrap: wrap;
    gap:20px
}

.mission_flex .box{width: calc(50% - 10px); flex:none}

.dist_box .box{width: 100%}

.ctc_flex {
    flex-wrap: wrap;
}
.ctc_flex .box {
    width: 100%;
}

.rnd_center_flex .box + .box {
    border-left: 0;
    margin-top: 56px
}
.rnd_center_flex .box {
    text-align: center;
    flex: none;
    width: 100%;
}

.rnd_center_flex {
    flex-wrap: wrap;
}


.rnd_partners {
    gap: 60px 20px;
    align-items: flex-start;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.rnd_partners li {
    width: calc(33.33% - 13.33px);
    text-align: center;
}

.liquid_txt p strong{font-size: 18px}

.service02_step {
    gap: 12px;
    flex-direction: column;
}

.service02_step .red_box{width: auto; padding:  25px}

.ctc_last {
    margin-top: 70px;
    gap: 16px;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.liquid_txt h3{font-size: 24px; word-break: keep-all}

.liquid_flex{gap:20px}

    .left_overview h2{font-size: 30px; line-height: 42px}
    
    .scl_wid{padding: 100px 25px; margin-bottom: 60px}
    
    .scl_wid h2{font-size: 30px; line-height: 42px}
    .scl_wid h3{font-size: 18px; line-height: 32px}
    
    
    .sub_title_are_small h2 {
    color: #1a1a1a;
    font-size: 30px;
    margin-bottom: 50px;}
    
    .flex_overview_over {
    display: flex;
    gap: 5px;
    flex-direction: column;}
    
    
    .flex_overview_over .box:hover {
    flex: none;
    height: 300px;}
    
    .flex_overview_over .box {
    flex: none;
    height: 300px;}
    
    
    .flex_overview_over .box:hover ul {
    height: auto;
    opacity: 1;
    margin-top: 10px;
}
.flex_overview_over .box .box_txt ul {
    margin-top: 10px;
    height: auto;
    overflow: hidden;
    opacity: 1;
    transition-duration: .5s;
}
    
    
    .technology_tab{margin-top: 60px;flex-wrap: nowrap;
        overflow-x: auto; flex-direction: row; position: relative;  border: 0; gap:5px; overflow-y: hidden}
        

    
	.technology_tab a{flex:0 0 auto; width: 30%; border: 1px solid #e9e9e9}
    
    
    .tech_title{margin: 60px 0}
    
    .tech_title h2, .tech_page_title h2{ font-size: 30px;}
    
    
        .tech_flex .thum_tech {
        width: 100%;
        padding-right: 0;
    }
    
    .tech_flex .thum_tech img{margin: 0 auto}
    
    .tech_flex {
    display: flex;
    flex-direction: column;
    gap: 50px;}


	.tech_flex .info_tech {
    width: 100%;}
    
    
    .tech_detail .page{padding: 60px 0}
    
    
    .tech_flex .info_tech h2{font-size: 30px; line-height: 42px; word-break: keep-all}
    .tech_flex .info_tech h2 br{display: none}
    
    
    .function_flex .box {
        height: auto;
        width: calc(50% - 12px);
    }
    
    
    .tech_img_flex {
    display: flex;
    gap: 24px;
    flex-direction: column;}
    
    .tech_img_flex .box img{width: 100%}
    
        .tech_detail .step3 {
        background: none;
        display: flex;
        flex-direction: column; gap:50px
    }
    
    body.sub_body{overflow-x: visible}
    
    .tech_detail_tab .inner{padding: 0}
    
    .tech_page_title p{margin-top: 15px; font-size: 16px; line-height: 24px}
    
    .live_all_box p{word-break: keep-all; font-size: 16px; line-height: 24px}
    .live_all_box p br{display: none}
    
    .live_all_box .box .live_all_box_title {
        border-radius: 70px;
        left: 50%;
        transform: translateX(-50%);
        top: -30px;
    }
    
    
    .tech_application_flex {
    gap: 28px;
    display: flex;
    flex-direction: column;}
    
    .tech_application_flex .box:first-child {
    border-radius: 20px 20px 0 0px;
}

.tech_application_flex .box:last-child {
    border-radius: 0px 0 20px 20px;
}


.live_img_flex {
    flex-direction: column;
}
    
.live_img_flex .box{width: 100%}
.live_img_flex .box img{width: 100%}    
    



.main_board_flex {
    flex-direction: column;
}

.main_board_flex .main_txt_board{width: 100%}

.slide_txt h2{font-size: 30px}



.quality_ink{gap:20px}
.quality_ink li{width: calc(50% - 10px)}
.quality_ink li p{font-size: 16px}


}




@media (max-width: 620px) {
	
	
	.main_txt_board_title h2{font-size: 24px}
	
	.main_board_section{padding: 80px 0}
	
	.txt_board li a.txt_title,
	.main_board_silde h4{font-size: 16px}
	.main_board_silde p{font-size: 14px}
	
	.main_board_silde p.date{display: none}
	
	.txt_board li p.date{display: none}
	
	.slide_txt h2{font-size: 30px;}
	
	.slide_txt p {
    font-size: 16px;
    color: #fff;
    margin-top: 20px; word-break: keep-all; line-height: 28px}
    
    .scroll_down{display: none}
	
	.slide_btn .slick-slider-dots{display: none}
	
	
	.main_tech{padding: 80px 0}
	
	 .main_title h2 {
        font-size: 30px;
        line-height: 40px;
    }
    
    .main_title p{font-size: 16px; line-height: 28px; }
    
    
    .flex_hover {
        display: flex;
        gap: 10px;
        margin-top: 50px;
        flex-direction: row;
        overflow-x: auto;
        overflow-y: hidden;
    }
    
    
    .flex_hover .box {
        height: 50vh;
        padding: 20px;
        flex: none;
        width: 80%;
    }
    
    .flex_hover .box:hover{flex:none}
    
    
        .main_title p.small_txt {
        font-size: 16px;
        line-height: 28px;
        font-weight: 400;
        margin-top: 20px;
    }
    
        .svg_flex a {
        flex: none;
        width: 100%;
        height: 250px;
        padding: 30px;
    }
    
    .svg_flex a h3{font-size: 18px; word-break: keep-all}
    .svg_flex a h3 br{display: none}
    
    .svg_flex a:hover p {
    height: auto;
    opacity: 1;
    max-height: 500px;
    margin-top: 8px;}
	
	.svg_flex a svg{max-width: 60px}
	
	.board_least_title {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-direction: column;
    gap: 40px;}
	

	
	.board_least_list ul li a .txt_board{border: 0; padding: 0}
	.board_least_list ul li a .txt_board h2{font-size: 16px}
	.board_least_list ul li a .txt_board p{font-size: 14px}
	
	.board_least_list{margin-top: 50px}
	
	
	.main_news .main_title a{position: relative; margin-top: 40px}
	


    
    .foot_up:hover {
	    padding-bottom: 5px;
	}
	.foot_up {
	    position: absolute;
	    right: 0;
	    top: 0;
	    border-radius: 0 0 5px 5px;
	    width: 60px;
	    height: 60px;
	    background: #292929;
	    display: flex;
	    align-items: center;
	    justify-content: center;
	    transition-duration: 1s;
	}
	
	.foot_up img{max-width: 16px}
	
	.foot_info .foot_link {
    display: flex;
    gap: 20px;
    margin: 25px 0 20px;
    flex-direction: row;
    overflow-x: auto;}
    
    .foot_info .foot_link a {
    color: #646464;
    font-size: 14px;
    font-weight: bold;
    flex: 0 0 auto;}
	
	.foot_info p{font-size: 14px;
        line-height: 22px;
        word-break: keep-all;
        display: flex;
        flex-wrap: wrap;
        gap: 0 10px;}
	
	
	
	.foot_bottom p {
   font-size: 12px;
      word-break: keep-all}
      
      
      
      
     /*sub*/
    
    
    .sub_tab{display: none}
      
     .sub_visual {
        height: 300px;
        padding-bottom: 0;
        padding-top: 80px;
    }
      
    .sub_visual_txt p{font-size: 14px}  
    .sub_visual_txt h2, .sub_title_are_small h2{font-size: 24px}  
    
    
    .sub_title_are h2{font-size: 24px}
    .technology_tab   { flex-wrap: wrap;}
    .technology_tab a{font-size: 14px; height: 40px; line-height: 40px; width: auto; padding: 0 25px}  
    
    
    .tech_title h2, .tech_page_title h2{font-size: 24px}
    
    .toggle_are .content{padding: 0 25px}
    
    .tech_page_title{margin-bottom: 50px}
    
    .tech_detail_tab{display: none}
    
    .function_flex .box{width: 100%; padding: 40px 25px}
    
    .function_flex .box h3, .tech_detail .step3 .box h3{font-size: 18px; line-height: 28px}
    .function_flex .box p, .tech_detail .step3 .box p{font-size: 14px; line-height: 20px; }
      
     .tech_detail .step3 .step_txt{margin-top: 20px} 
     
     .live_flex .box{width: 100%}
     .live_flex .box .live_title{border-radius: 0 !important;  height: 50px; } 
     .live_flex .box .live_title h2{line-height: 50px; font-size: 18px}
     .live_flex .box .img_are{border-radius: 0 !important; padding: 40px 20px} 
     
     .live_img_flex{gap:50px}
     
     .live_img_flex .box h3{font-size: 18px; line-height: 28px; margin-top: 25px}
     
     .live_img_flex .box p{font-size: 14px; line-height: 20px; }
     
     .live_all_box .box .live_all_box_title h2{line-height: 50px; font-size: 18px}
     
     .live_all_box .box .live_all_box_title{height: 50px; width: 80%}
     
     
     .live_all_box p{font-size: 14px; line-height: 20px; margin-top: 25px}
     .tech_page_title p{font-size: 14px; line-height: 20px; margin-top: 15px; word-break: keep-all}
     
     
     .sub_only_img{height: 250px}
     .sub_only_img img{object-fit: cover;
    width: 100%;
    height: 100%;} 
    
    
    .left_overview h2{font-size: 24px; line-height: 32px; word-break: keep-all}
    .left_overview h2 br{display: none}
    
    .left_overview .small_txt_are p br{display: none}
    
    
        .flex_overview_over {
        display: flex;
        gap: 5px;
 
    }
     
     
        .flex_overview_over .box {
        flex: none;
        height: 50vh;
        width: 100%;
        padding: 20px;
    } 
    
    
    .flex_overview_over .box:hover{height: auto}
    
    .flex_overview_over .box .box_txt h3{font-size: 20px; word-break: keep-all}
    .flex_overview_over .box .box_txt h3 br{display: none}
    
    .flex_overview_over .box .box_txt ul li {
        font-size: 14px;
        line-height: 20px;
        word-break: keep-all;
    }
    
    .history .tab {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 60px;
    flex-wrap: wrap;
    gap: 5px;}
    
    .history .tab__item{border: 1px solid #e8e8e8; padding: 0 25px; height: 40px}
    .history .tab__item a{font-size: 16px; line-height: 40px}
    
    .history .tab__item + .tab__item:after{display: none}
    
    
    .history_are .page {
    display: flex;
    padding-bottom: 60px;
    width: 100%;
    flex-direction: column; gap:50px}
    
        .history_are .img_h {
        padding: 0;
        width: 100%;
    }
    
        .history_info {
        padding: 0;
        width: 100%;
    }
     
	
	
	.map_iframe iframe{max-height: 300px}
	.location_box h3{font-size: 16px; text-align: center}
	
	    .location_box h2 {
        font-size: 20px;
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
    }
	
	
	.map_info li {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;font-size: 14px;
        word-wrap: break-word;
    }
    
    
    .map_info li span.bus_flex {
    display: flex;
    gap: 10px;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;}
    
    
    .live_all_box .box{padding: 40px 25px}
    
    
    .board_title ul{display: none}
    
    .board_title h2{font-size: 18px}
    #bo_v_con *{font-size: 14px}
    
    .board_view_btn .common_btn{font-size: 14px; padding: 15px 30px}
    
    .gall_list_style{gap:60px 10px}
    .gall_list_style li{width: calc(50% - 5px)}
    
    .board_list_txt{margin-top: 15px}
    .board_list_txt h3{font-size: 16px}
    .board_list_txt p{font-size: 12px}
    
    .profit-board__caption{font-size: 16px}
    
    .board_tlb table td.num{display: none}
    .board_tlb table td a.flex_subject{font-size: 16px}
    .board_tlb table td.date,
    .board_tlb table td.hit{display: none}
    
    .profit-board{overflow-x: auto}
    .pg{overflow-x: auto}
    
    .liquid_txt p{font-size: 16px; }
    .liquid_txt p br{display: none}
    
    .service04 .title p{font-size: 18px}
    ul.dist li,
    .service02_txt p{font-size: 16px}
    .service02_step .red_box p{font-size: 16px;}
    .service02_step ul li b,
    .service02_step ul li span{font-size: 16px; height: auto; padding: 15px}
    
    .service_img_flex{gap:10px}
	
	.service_tlb{overflow-x: auto}
	
	
	    .service03_step ul {
        gap: 50px;
        position: relative;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
    }
    
       .service03_step ul li.center_li {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }
    
    .service03_detail li {
    display: flex;
    gap: 8px;
    flex-direction: column;
}

.service03_detail li b,
.service03_detail li span{font-size: 16px; width: 100%}
    
.service03_detail li:first-child b,
.service03_detail li:first-child span,
.service03_detail li:last-child b,
.service03_detail li:last-child span{border-radius: 0}    


.service03_step2 ul li p{font-size: 16px}
.service03_step2 ul li h3{margin-bottom: 20px; font-size: 18px}   
    
    
 .p_list_flex li {
    display: flex;
    gap: 50px;
    flex-direction: column;
}   
    
.p_list_flex li .thum{width: 100%}    
.p_list_flex li .txt{padding: 0}  
    
.p_list_flex li .txt h2{font-size: 24px}    




.quality{width: 100%; margin-top: 80px; margin-bottom: 0}

.quality_r{width: 100%; border-radius: 10px; padding: 10px; height: auto}
.quality_r .mid,
.quality_r .in_mid{width: 100%; border-radius: 10px; position: relative;
left: 0;
    top: 0;
    transform: none;; height: auto; padding: 10px}
.quality_i .box p{font-size: 16px}
.quality_i .box{opacity: 1; position: relative; border-radius: 10px; width: calc(50% - 5px) }
.quality_i{position: relative; margin-top: 20px; display: flex; gap:10px;
        flex-wrap: wrap;}    
    
.quality_r .in_mid h2{font-size: 18px}
    
.quality_i .box:first-child {
    left: 0%;
    top: 0px;
    transform: none;
}


.quality_i .box:nth-child(2){left: 0%;
    top: 0;
    transform: none; right: 0 }
.quality_i .box:nth-child(3){left: 0%;
    top: 0;
    transform: none; right: 0 }
.quality_i .box:nth-child(4){left: 0%;
    top: 0;
    transform: none; right: 0 ; bottom: 0}
.quality_i .box:nth-child(5){left: 0%;
    top: 0;
    transform: none; right: 0; bottom: 0 }



.show .quality_i .box{opacity: 1}


.show .quality_i .box:first-child {
    left: 0%;
    top: 0;
    transform: none;
}
.show .quality_i .box:nth-child(2){left: 0%;
    top: 0;
    transform: none; right: 0 }
.show .quality_i .box:nth-child(3){left: 0%;
    top: 0;
    transform: none; right: 0 }
.show .quality_i .box:nth-child(4){left: 0%;
    top: 0;
    transform: none; right: 0; bottom: 0 }
.show .quality_i .box:nth-child(5){left: 0%;
    top: 0;
    transform: none; right: 0; bottom: 0 }

    
    
   .rnd_flex {
    flex-wrap: wrap;
    gap:60px
} 
 .rnd_flex .box{flex:none; width: 100%; gap:30px}   
 .rnd_flex .box .top h2,
 .rnd_center_flex .box h3{font-size: 18px}   
 
ul.box_dist li,
.rnd_center_flex .box p{font-size: 16px} 
 
.rnd_partners{gap:30px 10px}    
.rnd_partners li{width: calc(50% - 5px)}    
 
.rnd_partners li .rnd_logo img{max-width: 80%}    
 
 
.liquid_flex {
    flex-wrap: wrap;
    gap:40px 10px
} 
 
 .liquid_flex .box{width: calc(50% - 5px)} 

.liquid_flex .box p{font-size: 16px}  
    
.ctc_sklii ul {
    display: flex
;
    flex-direction: column;
}    
    
    
.ctc_sklii ul li img {
    margin: 0 auto;
    transform: rotate(90deg);
} 
    
 .ctc_sklii ul li:nth-child(2){width: 100%}   
  .ctc_last .mid h2{font-size: 24px}  
  
  
.board_tlb table td.file{display: none}
.board_tlb table td{font-size: 16px}  
.board_tlb table th{font-size: 16px}  

.board_tlb table th {
        font-size: 16px;
        white-space: nowrap;
    }

.board_tlb table td .datetime{display: none}  
  
.sub_title h2{font-size: 24px}  
 .mission_flex .box .txt p br{display: none}

.contact_tlb table th{font-size: 16px; padding: 15px 5px; width: 100px}





.toggle_are .toggle_tech{padding-right: 50px; font-size: 16px}
.service_toggle_box h4{font-size: 16px}

.service03_service .service03_service_title p{font-size: 18px}

.service03_pss .flex_pss .box,
.service03_pss .flex_pss .next{width: 100%; margin: 15px 0}
.service03_pss .flex_pss .next3{display: block}
.service03_pss .flex_pss .next img{
	        transform: rotate(90deg);
        margin: 0 auto;
}


.num_pss li{font-size: 16px}


.service03_pss .flex_pss.notbox .box{flex:none; width: 100%}

.service04 .txt p{font-size: 16px}


}






@media (max-width: 380px) {
	
	
	
	
	
}