@charset "utf-8";

@media all and (max-width:1279px) {
    .sub2_circle .circle_wrap {
        flex-direction: column;
    }

    .sub2_circle .circle_wrap .circle_img {
        margin: 0 0 3rem 0;
    }

    .sub2_circle .circle_wrap ul {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media all and (max-width:1190px){

    html, body {
        height: auto;
    }

    nav {
        display: none;
    }

    .m_nav_wrap {
        display: flex;
    }

    header {
        display: block;
    }

    header .main_bg {
        padding: 80px 50px;
        width: 100%;
        height: auto;
        min-height: 230px;
        display: block;

        position: relative;
    }

    header .main_bg img {
        display: none;
    }

    header .main_bg01 {
        background: url('/images/main/m_main_bg01.png') no-repeat;
        background-size: cover;
        background-position: center center;
    }
    
    header .main_bg02 {
        background: url('/images/main/m_main_bg02.png') no-repeat;
        background-size: cover;
        background-position: center center;
    }
    
    header .main_bg03 {
        background: url('/images/main/m_main_bg03.png') no-repeat;
        background-size: cover;
        background-position: center center;
    }
    
    header .main_bg04 {
        background: url('/images/main/m_main_bg04.png') no-repeat;
        background-size: cover;
        background-position: center center;
    }

    header .main_bg:hover {
        width: inherit;
    }

    header .main_bg:hover h2 {
        font-size: 44px;
        font-weight: 700;
        line-height: 2.3rem;
    
        transition-delay: 0.5s; 
    }

    header .main_bg:hover small {
        font-size: 19px;
        font-weight: 400;
    }

    header .main_bg .main_hover_text {
        display: block;
        margin: 0;
        height: auto;

        position: absolute;
        top: 50%;
        right: 40px;
        transform: translate(-0,-50%);
    }
    

    header .main_bg:hover .main_hover_text {
        height: auto;
    }

    header .main_bg .main_hover_text p {
        display: none;
    }

    header .main_bg .main_hover_text a {
        margin: 0px;
        width: 120px;
        height: 50px;
        border-radius: 50px;
        font-size: 16px;
        font-weight: 600;
        color: #fff;
    }

    footer {
        padding: 35px 30px;
    }

    footer .foot_wrap {
        margin: 0 auto;
        max-width: 1640px;
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        text-align: center;
    }

    footer .foot_wrap .foot_con01 {
        display: none;
    }

    footer .foot_wrap .foot_con03 {
        margin-bottom: 25px;
        align-items: center;
    }

    footer .foot_wrap .foot_con03 .foot_sns a {
        margin: 0 15px;
    }

}

@media all and (max-width:1070px) {
    .history .history_wrap section .h_leftimg::before {
        display: none;
    }

    .history .history_wrap section .h_rightimg::before {
        display: none;
    }
}

@media all and (max-width:1000px) {
    .sub2_btm_wrap section {
        display: block;
        margin-bottom: 80px;
        padding: 0 20px;
    }

    .sub2_btm_wrap section h3 {
        margin: 0 0 2rem 0;
        width: 100%;
    }

    .sub2_btm_wrap section h3 br {
        display: none;
    }

    .sub2_btm_wrap section .s2_btm_R {
        width: 100%;
    }

    .sub2_btm_wrap section .s2_btm_R ul li {
        margin-right: 6.6%;
        width: 20%;
    }

    .sub2_btm_wrap section .s2_btm_R ul li:nth-child(4n) {
        margin-right: 0%;
    }

    .sub2_btm_wrap section .s2_btm_R .surface_wrap ul li:nth-child(4n) {
        margin-right: 2%;
    }
}

/* 모바일 */
@media all and (max-width:767px){
    .nav_open ul li h4 {
        text-align: left;
    }

    .nav_open ul li h4.on::before {
        top: 50%;
        right: 0px;
        transform: translate(-0,-50%) rotate(45deg);
    }

    .nav_open ul li div a {
    text-align: left;
    }

    footer .foot_wrap .foot_con02 p br {
        display: inline;
    }
    .sub_top_menu {
        width: 100%;
    }

    .sub_top_menu section:first-child {
        display: none;
    }

    .sub_top_menu section:nth-child(2), 
    .sub_top_menu section:nth-child(3) {
        width: 100%;
    }

    .sub_top_menu section:nth-child(3) {
        border-radius: 0px 0px 0px 0px;
    }

    .sub1_pagetop ul {
        padding: 0 50px;
    }

    .greeting_01 h3 {
        padding: 0 50px;
    }

    .greeting_02 .greeting_02_wrap {
        display: block;
        padding: 0 50px;
    }

    .greeting_02 .greeting_02_wrap section:first-child {
        margin: 0 auto 3rem;
    }

    .history {
        padding: 0 20px;
    }

    .organization {
        padding: 0 50px;
        margin: 70px 0 200px;
    }

    .map_wrap {
        padding: 70px 20px 0px;
    }

    .map_wrap div {
        position: relative;
        
        margin-top: 1rem;
        width: 100%;
    }

    .map_btm {
        padding: 0 20px;
    }

    .certificate ul {
        padding: 0 20px;
    }

    .certificate ul li {
        width: 22.87%;
    }

    .certificate ul li:not(:nth-child(4n)) {
        margin-right: 2%;
    }

    .sub2_btm_wrap section .s2_btm_R .table_wrap div {
        max-width: 100%;
    }

    .sub2_btm_wrap section .s2_btm_R .table_wrap img {
        display: none;
    }

    .promote .promote_wrap {
        padding: 0 20px;
    }

    .promote .promote_wrap .promote_list li {
        width: 48%;
    }

    .promote .promote_wrap .promote_list li:not(:nth-child(3n)) {
        margin-right: 0%;
    }

    .promote .promote_wrap .promote_list li:not(:nth-child(2n)) {
        margin-right: 4%;
    }

    .view_title {
        display: block;
    }

    .view_title h3 {
        margin: 0 0 12px 0;
        width: 100%;
    }

}

@media all and (max-width:660px) {
    .sub2_circle .circle_wrap ul li {
        margin: 1rem 10px !important;
    }
}

@media all and (max-width:630px) {
    .nav_open {
        padding: 0 50px;
    }

    .sub1_pagetop ul li {
        margin: 0 15px;
    }

    .greeting_02 .greeting_02_wrap section:first-child {
        margin: 0 auto 3rem;
        width: 100%;
    }
}

@media all and (max-width:550px) {
    .sub2_btm_wrap section .s2_btm_R .surface_wrap .surface_con01 {
        height: 290px;
    }
    .sub2_btm_wrap section .s2_btm_R .surface_wrap .surface_con02 {
        height: 190px;
    }

.sub2_btm_wrap section .s2_btm_R .surface_wrap ul li {
    width: 47%;
    margin-right: 6%;
}

.sub2_btm_wrap section .s2_btm_R .surface_wrap ul li:nth-child(2n) {
    margin-right: 0%;
}

.sub2_btm_wrap section .s2_btm_R .surface_wrap ul li:nth-child(3n) {
    margin-right: 6%;
}

.sub2_btm_wrap section .s2_btm_R .surface_wrap ul li:nth-child(6) {
    margin-right: 0%;
}


}

@media all and (max-width:500px){
    .nav_open {
        padding: 0 20px;
    }

    .close_btn {
        top: 30px;
        right: 20px;
    }

    .m_nav_wrap {
        padding: 27px 20px;
    }

    .m_nav_wrap img {
        width: 210px;
    }

    .m_nav_wrap .m_nav_right a {
        margin-right: 20px;
    }

    footer {
        padding: 35px 20px;
    }

    .sub2_circle .circle_wrap .circle_img {
        margin-right: 0px;
        width: 300px;
        height: 300px;
    }

    .sub2_btm_wrap section .s2_btm_R ul li {
        margin-right: 10%;
        width: 45%;
    }

    .sub2_btm_wrap section .s2_btm_R ul li:nth-child(2n) {
        margin-right: 0%;
    }

    .sub2_btm_wrap section .s2_btm_R .table_wrap div table tr th,
    .sub2_btm_wrap section .s2_btm_R .table_wrap div table tr td {
        width: 50%;
    }

    .promote .promote_wrap .promote_list li {
        width: 100%;
    }

    .promote .promote_wrap .promote_list li:not(:nth-child(2n)) {
        margin-right: 0%;
    }

}

@media all and (max-width:470px){
    header .main_bg {
        padding: 80px 20px;
    }

    .sub1_pagetop ul {
        padding: 0 20px;
    }

    .sub1_pagetop ul li {
        margin: 0 5px;
    }

    .greeting_01 h3 {
        padding: 0 20px;
    }

    .greeting_02 .greeting_02_wrap {
        display: block;
        padding: 0 20px;
    }

    .greeting_04 .gt_04_con {
        padding: 0 0px;
    }

    .history .history_wrap section .history_L {
        padding-right: 30px;
    }

    .history .history_wrap section .history_L h4::before {
        right: -40px;
    }

    .history .history_wrap section .history_L h4.h4_top::after {
        right: -40px;
    }

    .history .history_wrap section .history_R {
        padding-left: 30px;
    }

    .history .history_wrap section .history_R h4::before {
        left: -40px;
    }

    .organization {
        padding: 0 20px;
        margin: 70px 0 150px;
    }

    .certificate ul li {
        width: 45%;
    }

    

    .certificate ul li:not(:nth-child(2n)) {
        margin-right: 10%;
    }

    .certificate ul li:nth-child(2n) {
        margin-right: 0%;
    }
}

@media all and (max-width:430px){
    header .main_bg {
        padding: 50px 20px;
    }

    header .main_bg .main_hover_text {
        display: block;
        margin: 1rem 0 0;
        position: relative;
        top: inherit;
        right: inherit;
        transform: inherit;
    }

    .lab_wrap {
        margin: 50px 0 50px;
    }

    /* .certificate ul li {
        width: 100%;
    }

    .certificate ul li:not(:nth-child(2n)) {
        margin-right: 0%;
    } */

    .sub2_btm_wrap section .s2_btm_R .surface_wrap .surface_con01 {
        height: 190px;
    }
    .sub2_btm_wrap section .s2_btm_R .surface_wrap .surface_con02 {
        height: 190px;
    }
}


@media all and (max-width:390px){
    .m_nav_wrap img {
        width: 170px;
    }

    .map_btm div {
        padding: 0.5rem 8px;
    }

    .map_btm div h4 {
        margin: 0 10px 0 0;
    }

    .sub2_btm_wrap section .s2_btm_R .surface_wrap .surface_con01 div {
        padding: 0 0 8px 8px;
        width: 205px;
        height: 64px;
        background: linear-gradient(17deg , #0d993c 49%, rgba(0,0,0,0) 50% );
        box-sizing: border-box;
    }
    .sub1_pagetop ul li.on a p {
        font-size: 16px;
        letter-spacing: -0.9px;
    }
    .sub1_pagetop ul li a p {
        font-size: 14px;
        letter-spacing: -0.9px;
    }
}