*{margin:0; padding: 0; font-family: 'Pretendard', 'Noto Sans KR', sans-serif; color:#1C1C1C; }

section{width:100%; font-family: 'Pretendard', 'Noto Sans KR', sans-serif; }
a{text-decoration: none; color:#000; font-family: 'Pretendard', 'Noto Sans KR', sans-serif; overflow-x: hidden;}

li{list-style: none;}
body{overflow-x: hidden;}
.hidden {overflow: hidden;}

/*header-----------------------------------------------------------------------------------------------------*/

header{ width:100%; height: 80px; display: flex;justify-content: space-around;align-items: center;
        position: fixed; z-index: 10000;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-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;}


/*-------------------------------------------------------------------------------------------------*/

/*Main*/

.main_img{width:100%; height: 100vh; background-image :url('../img/main.png');  background-repeat:  no-repeat;  background-size: cover; background-position: center; margin-top: 80px;}
.main_img > img{width:100%;}
.main_text{ position: absolute;top: 32%;left: 7%; color: #fff;}
.main_text h1{ font-size: 62px; color: #fff;}
.main_text p{ margin-top: 20px; font-size: 24px; line-height:1.5;color: #fff;}

.section2{width:100%; position: relative;top: -70px;  }
.main_tab{ width:1360px; position: relative; left: 50%; transform: translate(-50%,0); display: flex;justify-content: space-evenly;}
.main_tab div{ width: 406px; height: 310px; display: flex;flex-direction: column;flex-wrap: nowrap;justify-content: center;align-items: center;margin-bottom: 30px;
    background: var(--unnamed-color-ffffff) 0% 0% no-repeat padding-box;background: #FFFFFF 0% 0% no-repeat padding-box;box-shadow: 0px 0px 20px #33333336;border-radius: 50px; text-align: center;}
.main_tab h1{margin-top:40px; color: #122462; font-size:30px;}

.section3{width: 100%; margin: 0 auto;display: flex; justify-content: center;flex-direction: row; padding-bottom:60px;
    background-size: auto; background-position: -3% bottom; background-image: url('../img/bg1.png'); background-repeat: no-repeat;}
.section3 > div{ display: flex;flex-direction: column;align-items: center; margin:0 4%;}
.section3_1 p{margin: 30px auto; font-size: 20px; text-align: center;line-height: 1.5;} 
.section3_1 h1{ font-size: 56px; text-align: center; font-weight:bold;}
.section3_1 p span{color: #FF6446; font-weight: bold;}


.section3_2{ align-items: flex-start!important;}
.section3_2 img{margin:0 auto 45px;}
.section3_2 h2{ margin-bottom: 30px; font-weight: 400; font-size:30px;}
.section3_2 h2 span{font-weight:bold;}
.section3_2 p{margin-bottom :80px; font-size: 20px; line-height: 1.5}
.bg{ margin-top:-250px; margin-left: -13%; position: relative; z-index:-1;}

.section4{width:100%; height: 1330px; overflow-x: hidden;}
.main_test{ width: 85%; height: 550px;background-color: #122462; border-top-right-radius:300px; border-bottom-right-radius:300px; 
            display:flex;align-items: center; justify-content: center;flex-direction: column; position:relative;z-index:2;}
.main_test > h1{ color: #fff; font-size: 50px; }
.main_test ul{ width:970px; display: flex;justify-content: space-between; margin-top:50px;}
.main_test ul li{ width: 230px; height: 245px;background-color: #fff; display: flex;flex-direction: column;justify-content: center;align-items: center;}
.main_test ul li h1{ margin: 30px auto 10px;}
.main_test ul li p{ line-height:1.5; text-align: center;}


.section4_1{ width:89%; background-color: #F4F4FA; height: 1000px;border-top-left-radius:110px; border-bottom-left-radius:110px; float: right; 
        display:flex;align-items: flex-start; justify-content: flex-end;flex-direction: column; margin-top:-300px; position: relative;z-index: 1;}

.section4_slide{ display: flex; width: 1610px;justify-content: space-around; margin-left:15%; margin-bottom:80px;}
.section4_1 > h1{ font-size: 50px;margin-left:15%;}
.section4_slide div > div > div{width:363px; height: 435px; margin-top:40px;background-color: #111111; display: flex;flex-direction: column;justify-content: flex-start; margin-right:30px;}
.section4_slide div > div > div img{ width:100%;}
.section4_slide div h1{ margin: 25px 25px 20px;  font-size: 22px;line-height: 1.5;color: #fff; }
.section4_slide div p{ margin: 0 30px; color: #CF533B; display: flex;}
.section4_slide div p span{ color: #fff;  border-left: 1px solid #fff; padding: 0 10px; margin:0 10px; line-height: 1.2; }


.slick-arrow{ position: absolute; bottom: 40%; width:66px; height:66px; z-index:999; outline:0;color: transparent; border: none; 
    border-radius: 33px; background-size: cover; background-position:center; box-shadow: 0px 3px 11px #00000029; cursor:pointer;}
.slick-prev{ left: -9%; background-image: url('../img/arrow_prev.png'); }
.slick-next{ right: 15%;background-image: url('../img/arrow_next.png');}

.section5 {padding: 100px 0;}
.section5 > h1{ font-size: 56px; text-align: center; font-weight:bold; }
.section5 > p{ text-align: center; margin-top:20px; font-size: 20px;}

.section5_content{margin-top:60px; display: flex;justify-content: center; align-items: center}
.section5_text_box{ padding: 30px; background:#F4F4FA; width: 350px; height: 180px; box-sizing: border-box; margin: 40px 0;
                    display: flex;flex-direction: column;justify-content: space-evenly;font-size: 18px; line-height:1.5}
.section5_text_box h2{ font-size: 24px; color: #3A65A0; }
.section5_icon_box{ width:180px; height: 180px; border-radius: 90px; background: #fff;box-shadow: 0px 0px 20px #020C764D; 
                    display: flex;flex-direction: column;justify-content: center;align-items: center; z-index:100;}
.section5_icon_box h1{ color: #3A65A0; font-size:18px;margin: 7px 0;font-weight:bold;}
.section5_icon_box p{font-size: 20px;}
.left .section5_icon_box{margin: 40px 40px 40px -10px;}
.right .section5_icon_box{margin: 40px -10px 40px 40px;}

.left, .right{ display:flex;align-items: center;flex-direction: column}
.left{margin-right: -130px;}
.right{ margin-left: -130px;}
.left > div , .right > div{ display: flex;}
.left > .section5_number{margin-left: -190px;}
.right > .section5_number{margin-left: 190px;}

.right > div{flex-direction: row-reverse}
.center{ border: 3px dotted #E4E4E4; width:420px; height: 260px; display: flex;justify-content: center ;align-items: center; position:relative; z-index:-1;}
.center > div{width:200px; height:200px; display:flex; background:#FF6446 ; border-radius: 100px;justify-content: center ;align-items: center;}

.section5_number{color: #FF6446; font-size: 36px; text-align:left; font-weight: bold;}

.section6{ display: flex;flex-direction: column;align-items: center; width:100%; height: 510px;
            background-size: auto; background-position: right bottom; background-image: url('../img/bg2.png'); background-repeat: no-repeat;}
.section6 > h1{  font-size: 56px; text-align: center; font-weight:bold; margin-bottom: 80px;}
.section6 div ul{ display: flex; width: 1280px;}
.section6 div ul{ display: flex; justify-content: space-evenly}


.section7{width:100%; overflow-x: hidden; }
.bg2{ margin-top:-250px;margin-left: 85%;position: absolute; z-index:1;}
.section7_1{ width:100%; height: 500px; background-image:url('../img/section7_bg.png');z-index:2; position:relative; background-size: cover; background-position: center;}
.section7_text{ position: absolute; color: #fff; font-size:50px; left: 16%; top:40%; font-weight: bold; line-height: 1.3;}

.section7_2{ width:100%; height: 200px; background: #222222;display: flex;justify-content: center;align-items: center;}
.section7_2 ul{width:1280px; display: flex;justify-content: space-between;}
.section7_2 ul li{width: 297px; height: 60px;  text-align: center; background:#444444; color: #fff;  display: flex;justify-content: space-between;align-items: center;
                padding:0 20px; box-sizing:  border-box;}
.section7_2 ul li:hover{ background-color: #FF6446; transition:1s; cursor:pointer;}
.section7_2 ul li span{color: #fff;}




/*footer-------------------------------------------------------------------------------------------------*/

footer{width:100%; background:#EEEEEE; padding: 0px 0 80px; border:1px solid #eeeeee; }
.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;}
.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 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;}

/*-------------------------------------------------------------------------------------------------*/


/*aside 메인에만 존재--------------------------------------------------*/

aside{ position: fixed; bottom: 5%; right: 5%; display: flex;flex-direction: column; z-index: 100;}
aside div{width:100px; height: 100px; text-align: center; border-radius: 50px; display: flex;flex-direction: column;justify-content: center;align-items: center; margin-bottom: 15px; box-shadow: 0px 0px 10px #00000033;}
aside div img{width:30%;}
aside div h1{color: #fff; font-size: 16px; font-weight: 400; margin-top:10px;}


/*-------------------------------------------------------------------------------------------------*/

.m_block{display: none;}

@media (max-width: 1400px){
    /*header-------------------------------------------------------------------------------------------*/

    header{justify-content: space-evenly; padding-left: 2%;}
    header div ul{ width: 660px;}
    header > div{width:100%;justify-content: space-evenly}
    .logo{width: 140px;}

    /*-------------------------------------------------------------------------------------------------*/

    .main_img{ height: 80vh;}
    .main_text{ top: 22%;}
    .main_text h1{ font-size: 46px;}
    .main_text p{ font-size: 20px;}

    .main_tab{width: 80%;}
    .main_tab div{ width: 30%;}

    .section3 > div{margin:0px 2%;}
    .section3_1 h1{font-size: 40px;}
    .section3_2 h2{font-size: 26px;}
    
    .section3_1 p, .section3_2 p{ font-size: 16px;}

    .main_test{width: 95%; border-top-right-radius: 250px; border-bottom-right-radius:250px}
    .main_test > h1, .section4_1 > h1,.section5 > h1, .section6 > h1{ font-size: 40px;}

    .main_test ul{ width: 90%; justify-content: space-evenly;}
    .main_test ul li{width: 19%;}

    .section4_slide{width:95%;}

    .section6 div ul{ width:80%; margin: 0 auto;}
    .section6 div ul{ display: flex; justify-content: space-evenly}

    .section7_1{height: 350px;}
    .section7_text{ left: 6%;}
    .section7_2 ul{width:90%;}
    .section7_2 ul li{ width: 23%;}


    /*footer-------------------------------------------------------------------------------------------*/

    .main_footer_content, .footer_content{width: 90%;}
    .main_footer_content > div{width: 49%!important}

    /*--------------------------------------------------------------------------------------------------*/

}

@media (max-width: 1100px){

/*header-------------------------------------------------------------------------------------------*/

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: 1000; padding: 20px 0;}
#mo_nav.active {left:0;}
#mo_nav .nav {z-index: 100; 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;}

/*------------------------------------------------------------------------------------------------*/


.main_img{margin-top:60px;}
.main_tab{width: 80%;}
.main_tab div{ width: 30%; height: 265px;}

.section3 > div{margin:0px 2%;}
.section3_1 h1{font-size: 40px;}
.section3_2 h2{font-size: 26px;}

.section3_1 p, .section3_2 p{ font-size: 16px;}
.section3_1 p br, .section3_2 p br{display: none;}
.section3_1 img{width:90%;}



.main_test{width: 97%; border-top-right-radius: 250px; border-bottom-right-radius:250px}
.main_test > h1, .section4_1 > h1,.section5 > h1, .section6 > h1{ font-size: 40px;}

.main_test ul{ width: 90%; justify-content: space-evenly;}
.main_test ul li{width: 18%;}
.main_test ul li img{width: 40%;}
.main_test ul li p{ font-size: 14px;}

.section5_text_box{width: 65%;}
.section5_text_box br{ display: none;}
.section5_icon_box{width: 150px; height: 150px; border-radius: 75px;}
.section5_icon_box h1{font-size: 18px;}

.section6{background-image: none;}
.section6 ul{width:90%;}
.section6 ul img{width:100%;}

.section7_1{height: 350px;}
.section7_text{ left: 6%;}
.section7_2 ul{width:90%;}
.section7_2 ul li{ width: 23%;}



/*footer---------------------------------------------------------------------------*/

.main_footer_content, .footer_content{width: 90%;}
.main_footer_content > div{width: 49%!important}

/*--------------------------------------------------------------------------------------*/


}

@media (max-width:996px ){

    /* 모바일 헤더 */

}

@media (max-width: 767px){

/*header--------------------------------------------------------------------------------*/

header{ padding: 0 15px;}

/*--------------------------------------------------------------------------------------*/

.main_img{background-image:url('../img/m_main.png'); height: 96vh;}
.main_text{ bottom: 8%;top: auto;}
.main_text h1{ font-size: 38px;}
.main_text p{ font-size: 16px;}

.main_tab{width: 95%; background: var(--unnamed-color-ffffff) 0% 0% no-repeat padding-box;background: #FFFFFF 0% 0% no-repeat padding-box;box-shadow: 0px 0px 20px #33333336;border-radius: 30px;}
.main_tab div{ width: 33%; height: 186px; margin-bottom:0; box-shadow: none;}
.main_tab h1{font-size: 14px;margin-top:20px;}
.main_tab img{width:60%;}

.section3{flex-direction: column; background-image: none;}
.section3 > div{margin:0px 4%;}
.section3_1 h1{font-size: 40px;}
.section3_2 h2{width:100%;font-size: 26px; text-align: center;}

.section3_2{margin-top: 80px!important;}

.section3_1 p, .section3_2 p{ font-size: 16px; text-align: center;}
.section3_1 p br, .section3_2 p br{display: none;}
.section3_1 img{width:90%;}

.main_test{width: 100%; border-top-right-radius: 0px; border-bottom-right-radius:0px}
.main_test > h1, .section4_1 > h1,.section5 > h1, .section6 > h1{ font-size: 30px;}

.main_test ul{ width: 90%; justify-content: space-evenly;}
.main_test ul li{width: 80%; display:flex!important; margin:0 10px;}
.main_test ul li img{width: 32%;}
.main_test ul li p{ font-size: 14px;}

.section4{height: auto;}
.section4_slide{margin: 0 auto 80px; width: 85%;}
.section4_slide div > div > div{margin:40px 10px;height: 290px;}
.section4_slide div h1{font-size: 18px; margin: 4% 7%;}
.section4_slide div p{ font-size: 12px; margin:0 7%;}
.section4_1 > h1{margin-left:0; margin:0 auto;}
.section4_slide div h1 br{ display: none;}

.section4_1{ width:100%; height: 900px; border-radius: 0;}

.section5{ width:98%; margin:0 auto;}
.section5_content{flex-direction: column}
.section5 > p{ line-height: 1.5;}
.section5_text_box{width: 86%; margin: 40px auto;}
.section5_text_box br{ display: none;}
.section5_icon_box{width: 150px; height: 150px;}
.left, .right{margin: 0;}
.left > div:first-child .section5_icon_box{margin: -60px auto 40px;}
.right > div:first-child .section5_icon_box{margin: -60px auto 40px;}

.left > div:last-child .section5_icon_box{margin:30px auto -50px;}
.right > div:last-child .section5_icon_box{margin: 30px auto -50px;}

.left > div:first-child, .right > div:first-child{flex-direction: column;align-items: center;}
.left > div:last-child, .right > div:last-child{flex-direction: column-reverse;}

.section5_number{margin:-100px auto!important; width: 86%; border: 2px dotted #E4E4E4; padding: 100px 0;justify-content: center}

.center{width: 86%; border: none;}

.section6{background-image: none; height: 685px;}
.section6 div {width:85%; display:flex;flex-direction: column;}
.section6 div ul{display: inline-block; float: left; width:100%;}
.section6 div ul li{margin: 10px 0; width: 49%; float: left; height: 70px; text-align: center;}
.section6 ul img{width:97%; margin:0  auto;}
.sch8{width: 85%!important;}

.section7_1{height: 350px; background-image: url('../img/m_section7.png')}
.section7_text{ left: 6%;font-size: 30px;}
.section7_2{ height: 340px;}
.section7_2 ul{width:80%;flex-direction: column;}
.section7_2 ul li{ width: 100%;margin: 5px auto; font-weight: 500; font-size: 18px;}

/*aside*/
aside{ bottom: none;top: 80px; right: 2%; }
aside div{width:80px; height: 80px; text-align: center; border-radius: 40px; display: flex;flex-direction: column;justify-content: center;align-items: center; margin-bottom: 15px; box-shadow: 0px 0px 10px #00000033;}
aside div h1 {font-size: 12px;}


/*footer*/
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 .title{font-size: 30px;}
.footer_notice ul{ border-bottom:2px solid #B9B9B9; border-top: 2px solid #B9B9B9;}

.footer_contact .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 .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;}
}

@media (max-width: 400px){

    .section5{padding: 100px 0 60px;}
    .section6{ height: 570px;}

}