/* ********************************************* *
 * 1440px
 * ********************************************* */
 @media screen and (max-width: 1440px){

    .boundary, .boundary2{padding:0 20px;}
    .common_submenu .boundary{padding:0}
  
}

/* ********************************************* *
 * 1300px
 * ********************************************* */
 @media screen and (max-width: 1300px){
    /* main */
    .main_section03{height: 700px; padding: 90px 0;}
    .main_section03 li{width: 50%;}

}

/* ********************************************* *
 * 1200px
 * ********************************************* */
@media screen and (max-width: 1200px){
    
    .business-process ul li.round_box{width: 25%;}

}

/* ********************************************* *
 * 1024px min 부터 mobile ver.
 * ********************************************* */
@media screen and (min-width: 1024px){

    
    
   
}

/* ********************************************* *
 * 1024px max
 * ********************************************* */
@media screen and (max-width: 1024px){
    .pc_ver{display: none;}
    .mobile_ver{display: block!important;}
    .mobile_ver .menu_right{margin-right: 20px;}

    /* 모바일 메뉴 */
    .mobile_menu_wrap{width: 100%; }
    .mobile_menu_wrap .mobile_menu{display: none; width: 100%; position: absolute; top: 70px; left: 0; z-index: 700; }
    .mobile_menu_wrap .mobile_menu>li{width: 100%; border-bottom: 1px solid #125ad3; text-align: center; line-height: 60px; font-size: 18px; cursor: pointer;}
    .mobile_menu_wrap .mobile_menu>li>a{width: 100%; color:#fff; height: 100%; display: block; background-color: #000; }
    .mobile_sub_menu>ul{background-color:rgba(24,24,24,0.9); height: auto; display: none;}
    .mobile_sub_menu>ul>li a{display: inline-block; font-size: 15px; cursor: pointer; color: #fff; width: 100%; }

    footer .rock{display: none;}
    .main_section01{height: 740px;}
    .main_slide_container{height: 740px;}
    .main_section01 .main_topbanner{top: 260px;}
    .main_topbanner{top: 265px;}

    .product_section .project_list ul li{width: 50%;}

    .business_tab .tap_wrap01 ul{border-bottom: none}
    .business_tab .tap_wrap01 ul::after{width: 100%; width: 100%; height: 1px; background-color: #ccc; bottom: 36px; left: 0; display: block; content: ""; position: absolute; z-index: -1;}

    .business-process .round_box::before{right: 2px;}
    .business-process .round_box::after{right: 30px;}
}

/* ********************************************* *
 * 960px max
 * ********************************************* */
 @media screen and (max-width: 960px){

    .owl-nav>button{top:40% ;}
    .owl-prev{left: 0;}
    .owl-next{right:0}
    .main_section04 .info{width: 100%;}
    
    .company_certification ul li{width: 50%;}

    .equipment_section ul li{width: 50%;}

    .business ul li{width: 50%;}
    .business-process ul li .round_in span{font-size: 16px;}
    .business-process .round_box::before{right: -7px;}
    .business-process .round_box::after{right: 21px;}

    .comapny_direction .direction_info .dir_title{padding:0 20px 40px}
    .comapny_direction .direction_info .dir_detail{padding:0 20px}
    .comapny_direction .dir_detail table tr td:nth-child(1){width: 40%;}
    .ceo_greeting_wrap ul li:nth-child(1){display: none;}
    .ceo_greeting_wrap ul li:nth-child(2){width: 100%;}
} 
/* ********************************************* *
 * 768px max
 * ********************************************* */
 @media screen and (max-width: 768px){
   

    .business-process ul li .round_in span{font-size: 12px;}
    .business-process ul li.round_box{width: 33%;}
    .business-process .round_box::before{right: -7px;}
    .business-process .round_box::after{right: 21px;}

    .aside{bottom: 0; right: 0;}
    .aside .aside_btn{width: 42px; height: 42px; background-color: #222;}
    .aside .aside_btn:hover{background-color:#444}

    .company_history .history_container .history_contents{width: 100%;}
    .company_history .history_container .history_date{width: 100%;}
    .company_history .history_container .history_contents::before{left: 8%;}
    .history_date + .history_contents{border-left: none; }
    .history_container + .history_container{border-top: 1px dashed #ccc;}
    .company_history .history_container .history_date::after{display: none;}
    .company_history .history_container .history_date::before{display: block; position: absolute; content: "";
        width: 50px; height: 2px; background-color: #125ad3; bottom: 13px; left: 50%; margin-left: -25px;}
    .company_history .history_container .last_his_contents::after{display: none;}
    .company_banner{height:164px; margin-bottom: 40px;}
} 

/* ********************************************* *
 * 600px
 * ********************************************* */
@media screen and (max-width: 600px){

    .owl-nav>button{display: none!important;}

    .main_section02 .hana_logo{width:80%}
    .main_section02 .text_container p br{display: none;}
    .main_section03{padding:59px 0 }
    .main_section03 li .inner{height: 270px;}

    .main_section04{overflow: hidden; padding: 96px 0 80px}
    .main_section04 .map li{width: 100%; height: 200px;}
    .main_section04 .info li{width: 50%; padding-bottom: 26px;}

    .comapny_direction .dir_detail table{font-size: 17px;}
    .comapny_direction .dir_detail table tr td{display: block;}
    .comapny_direction .dir_detail table tr td:nth-child(1){width: 100%; background-color: #eee; padding-left: 10px;}
    .comapny_direction .dir_detail table tr td:nth-child(2){border-left: none; padding-left: 10px;}

    .business ul li{width: 100%;}
    .business_tab ul{width: 90%;}
    .business_tab ul li a{font-size: 14px;}
    .business h2{font-size: 25px;}

    .product_section .project_list ul li{width: 100%;}
    .product_hover .btn_con{top: 100px;}
    .project_list .picture_wrap{height: 230px;}
    .product_view_section .board_view .board_header{text-align: center;}
    .product_view_section .board_title{width: 100%;}
    .product_view_section .board_date{width: 100%; text-align: center; padding-top: 10px;}

    .common_banner .common_banner_text h1{font-size: 40px; line-height: 1;}
    .common_banner .common_banner_text h1::after{display: none;}
    .common_banner .common_banner_text p{font-size: 20px;}
    .common_banner .common_banner_text{top: 130px;}
    .common_banner{height: 250px;}

    
    .contact_box .input_box{width: 100%; padding: .5em 2.4em 0.5em;}
    .contact_box .input_box .input_con{width: 100%;}
    .contact_box .input_box input{width: 100%;}
   
    .pc_in_ver{display: none;}
    .mobile_in_ver{display: block;}
    
    /* 모바일 서브 메뉴 */
    .mobile_in_menu{width: 100%; height: 50px; background-color: rgba(0,0,0,0.5); z-index: 10; position: relative;border-top: 1px solid #444;}
    .mobile_in_menu>li{width: 100%; border-bottom: 1px solid #125ad3; text-align: center; line-height: 50px; font-size: 18px; cursor: pointer; }
    .mobile_in_menu>li>a{width: 100%; color:#fff; height: 100%; display: block; background-color: #000; border-bottom: 1px solid #125ad3; }
    #company_in_ul{background-color:rgba(24,24,24,0.9); height: auto; display: none;}
    #company_in_ul>li a{display: inline-block; font-size: 15px; cursor: pointer; color: #fff; width: 100%; }
    #business_in_ul{background-color:rgba(24,24,24,0.9); height: auto; display: none;}
    #business_in_ul>li a{display: inline-block; font-size: 15px; cursor: pointer; color: #fff; width: 100%; }


    .mobile_in_menu .arrow_down{
        transform: translateY(-50%);  display: inline-block; margin-left: 20px;
         border-left: 6px solid transparent; border-right: 6px solid transparent;   
        border-top: 6px solid #fff;
        -webkit-transition: all 0.3s ease-out;   
        transition: all 0.3s ease-out; 
         -ms-transition: all 0.3s ease-out;   
         -moz-transition: all 0.3s ease-out; 
         -o-transition: all 0.3s ease-out;}
    .mobile_in_menu .arrow_down.circle{transform: rotate(180deg);}
}

/* ********************************************* *
 * 480px
 * ********************************************* */
@media screen and (max-width: 480px){

    
    .common_banner .common_banner_text h1{font-size: 30px;}

    .main_section01{height: 440px;}
    .main_topbanner{top: 107px;}
    .main_topbanner h1{font-size: 50px;}

    .main_section03{overflow: hidden; height: unset; }
    .main_section03 li{width: 100%;}
    .main_section03 li .inner{height: 164px; }
    .main_section03 li .inner p{display: none;}

    .main_section04 .info li{width: 100%;}

    .company_certification ul li{width: 100%;}
    .company_certification ul li p{height: auto;}

    .comapny_direction .direction_info .dir_title p{padding-left: 0;}
    .comapny_direction .direction_info .dir_title p::before{display: none;}

   
    
    .product_view_section .board_body .board_content{min-height: 300px;}

    .equipment_section ul li{width: 100%;}

    .business-process ul li .round_in span{font-size: 12px;}
    .business-process ul li.round_box{width: 50%; padding: 5.5% 11% 1.5% 0;}
    .business-process .round_box::before{right: -7px;}
    .business-process .round_box::after{right: 21px;}

    .contact_box{min-width: 100%;}
}

/* ********************************************* *
 * 380px
 * ********************************************* */
@media screen and (max-width: 380px){

 
}