﻿
/*header-----------------------------------------------------------------------------------------------------*/

header { width:100%; height: 80px; display: flex;justify-content: space-around;align-items: center;
    position: fixed; z-index: 100;top: 0px;left: 0px; background: var(--unnamed-color-ffffff) 0% 0% no-repeat padding-box;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    opacity: 1;}

header div > ul{display: flex; width: 770px;justify-content:space-around;}
header div > ul li {font-family: 'Pretendard', 'Noto Sans KR', sans-serif; font-weight: bold; position:relative; cursor: pointer;}
header div > ul li img {height:24px;}
header > div {width:1170px; display: flex; line-height: 80px; justify-content: space-between;}
header div > a{padding: 0 10px; border-left: 1px solid #ccc; font-size: 14px; line-height:1; height:16px;}
header div a:first-child{border: none;}
header .sub_menu li {line-height: 1.5;}

.logo {
    width: 180px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

    .logo img {
        height: 23px;
    }

.mo_ham{display: none;}
#mo_nav {display:none;}
.sub_menu { display: none;position:absolute; width:200px; text-align: center; background-color: #fff; top:80px; padding: 15px 0;  left:50%;transform:translateX(-50%);}
.sub_menu li{padding: 10px;}


@media (max-width: 1400px){

    header{justify-content: space-evenly; padding-left: 2%;}
    header div ul{ width: 660px;}
    header > div{width:100%;justify-content: space-evenly}
    .logo{width: 140px;}

}


@media (max-width: 1100px){

    
    header {align-items: center; justify-content: space-between;padding: 0 30px; box-sizing: border-box; height: 60px;} 
    header .nav {display:none;}
    #mo_nav {display: block; position: fixed; left:-100%; top:60px; transition:0.5s; height: 100%; width: 100%; z-index: 100; padding: 20px 0;}
    #mo_nav.active {left:0;}
    #mo_nav .nav {z-index: 101; width:100%; height: 100vh; background-color: #fff; display: inline-block; }
    
    header div > ul{width:100%;height: 73vh;flex-direction: column;align-items: center; margin-bottom:5vh;}
    header div > ul li{ display: flex; align-items: center;flex-direction: column; font-size: 24px; font-weight: bold; line-height: 30px;}
    header div > ul li img{display: none;}
    .sub_menu{left:0!important; width:100%; position:relative; top: 10px;}
    .sub_menu li{font-weight: 400; font-size:20px; padding: 7px;}
    
    .nav > div{ display:flex;justify-content: center;}
    .nav > div a{ padding: 0 20px;}
    .logo{width: 120px;}
    .mo_ham{display: flex;justify-content: flex-end}
    .mo_ham, .mo_ham span { display: inline-block;transition: all .4s;box-sizing: border-box;}
    .mo_ham { position: relative; width: 36px;height: 22px; }
    .mo_ham span {position: absolute;left: 0; width: 100%;height: 2px;background-color: #131313;border-radius: 4px; }
    .mo_ham span:nth-of-type(1) {top: 0;}
    .mo_ham span:nth-of-type(2) {top: 10px;}
    .mo_ham span:nth-of-type(3) {bottom: 0;}
    .mo_ham.active-1 span:nth-of-type(1) {
        -webkit-transform: translateY (10px) rotate (-45deg);
        transform: translateY(10px) rotate(-45deg);
    }
    
        .mo_ham.active-1 span:nth-of-type(2) {
        opacity: 0;
    }
    
        .mo_ham.active-1 span:nth-of-type(3) {
        -webkit-transform: translateY(-10px) rotate(45deg);
        transform: translateY(-10px) rotate(45deg);
    }
    .mo_nav_active > .sub_menu{ left: 50%!important;}
    
}    

@media (max-width: 767px){

    header{ padding: 0 15px;}
}

/*-------------------------------------------------------------------------------------------------*/


/*footer-------------------------------------------------------------------------------------------------*/

footer{width:100%; background:#EEEEEE; padding: 120px 0 80px;}
.main_footer_content{ width:1280px; margin:0 auto; display:flex;justify-content: space-between; }

.main_footer_content > div{ display: flex;flex-direction: column;justify-content: space-around;height: 200px;}
.footer_notice{width:620px;}
.footer_notice .ft_title{ font-weight:bold; font-size: 36px; font-weight: bold; display: flex;justify-content: space-between; }
.footer_notice .ft_title span{font-size: 16px; font-weight: 200; }
.footer_notice ul{ padding: 30px 0; border-top: 1px solid gray; border-bottom: 1px solid gray; margin-top:10px;}
.footer_notice ul li{padding: 5px 0;display: flex;justify-content: space-between;}
.footer_notice ul li span{font-size: 12px;}
.footer_contact{ width:540px;}
.footer_contact .ft_title{ font-weight:bold; font-size:24px; font-weight: bold; }
.footer_contact .footer_tab{ display: flex;margin-top:50px;}
.footer_contact .footer_tab div{ background-color:#444444; color: #fff; width: 270px; height: 60px; padding: 0 20px; display :flex;justify-content: space-between;align-items: center; box-sizing: border-box;}
.footer_contact .footer_tab a:first-child{margin-right:10px;}
.footer_contact .footer_tab div span{color: #fff;}
/*.footer_content{ width:1280px; height: 340px;margin:80px auto 0; display: flex;flex-direction: column;align-items: flex-start;justify-content: space-evenly; padding:30px 0px 0px 0px; }*/
.footer_content{ width:1280px; height: 340px;margin:0px auto 0; display: flex;flex-direction: column;align-items: flex-start;justify-content: space-evenly; padding:80px 0px 30px 0px; }
.footer_content .ft_sub_title{ width:100%;font-size: 14px; line-height: 1.2; padding-bottom: 40px; border-bottom: 1px solid #1C1C1C;}
.footer_content .ft_sub_title span{font-weight: bold;}
.footer_contact .footer_tel{ font-weight:bold; font-size: 40px; font-weight: bold; margin-top:10px;}
.footer_contact .footer_add{ font-size: 14px;  margin-top:14px;}

.footer_content ul{display: flex;}
.footer_content ul a {overflow: hidden;}
.footer_content ul li{margin-right: 60px;font-size: 14px; font-weight:bold; }
.footer_content .footer_info{ line-height: 2.2; font-size: 14px;}
.footer_content .footer_info span{ margin: 0 10px;}

.m_block{display: none;}

@media (max-width: 1400px){

    .main_footer_content, .footer_content{width: 90%;}
    .main_footer_content > div{width: 49%!important}
}

@media (max-width: 1100px){

    .main_footer_content, .footer_content{width: 90%;}
    .main_footer_content > div{width: 49%!important}
}

@media (max-width: 767px){
    
    footer{ padding: 40px 0 0;}
    .main_footer_content, .footer_content{width: 90%;flex-direction: column;justify-content: space-evenly}
    .main_footer_content > div{width: 100%!important; height: 250px;justify-content: center}

    .footer_notice .ft_title{font-size: 30px;}
    .footer_notice ul{ border-bottom:2px solid #B9B9B9; border-top: 2px solid #B9B9B9;}

    .footer_contact .ft_title{ font-size:18px;}
    .footer_contact .footer_add{ line-height: 1.5;}

    .footer_contact .footer_tab div{ width: 100%; height: 50px;}
    .footer_contact .footer_tab a{width:50%;}
    .footer_content .ft_sub_title{ line-height: 1.4; margin-top:10px; padding-bottom:15px; border-bottom:2px solid #B9B9B9;}
    .footer_contact .footer_tab{ margin-top:30px;}
    .footer_content{ margin: 0 auto;height: 320px; padding-bottom:10px;}
    .footer_content ul li{margin-right: 30px; margin-top:10px;}

    .footer_content .footer_info{ font-size:14px; line-height: 1.7;}
    .footer_contact .footer_tel{ font-size: 30px; }


    .m_block{display: inline-block;}
    .m_none{display: none;}
}

/*-------------------------------------------------------------------------------------------------*/


