@charset "utf-8";

/* 웹접근성 스킵 */
#accessibility {position: fixed; top: 0; left: 0; width: 100%; z-index: 99999}
#accessibility ul {margin: 0; padding: 0; list-style-type: none;}
#accessibility li {margin: 0;padding: 0; list-style-type: none}
#accessibility a {display: block; position: absolute; top: -9999px; left: 0; width: 100%; height: 26px;	line-height: 18px; text-align: center;	background: #333; color:#fff; text-decoration: none; font-size: 12px}
#accessibility a:focus, #accessibility a:active {top: 0; padding: 4px 0; font-weight: 600}
.skip{position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;}

/* 메인 */
#wrapper{margin-top: 0}
body{font-family: 'Noto Sans KR', sans-serif;}

/* 메뉴 */
#hd_wrap{top: 0; left: 0; z-index: 999; width: 100%; position: fixed; background:transparent; height: 120px; border-bottom: 1px solid #fff;}
#header{transition: 0.3s ease; overflow: hidden; height: 120px;}
.hd_top{height: 50px; padding-top: 15px; margin-right: 55px;}
.hd_top ul{display: flex; justify-content: flex-end;}
.hd_top ul li{font-size: 13px; margin-left: 30px; position: relative;}
.hd_top ul li a{color: #fff;}
.hd_top ul li:first-child::after{width: 0; height: 0;}
.hd_top ul li::after{position: absolute; top: 4px; left: -15px; width: 1px; height: 10px; content: ''; background: #fff;}
.hd_bottom{height: 70px; display: flex; justify-content: space-between; align-items: center;}
.menu>ul{display: flex; margin-top: 215px;}
.menu ul li{font-size: 18px; width: 150px; text-align: center;}
.menu ul li a.main_menu{color: #fff; position: relative;}
.menu ul li:hover a.main_menu::after{position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); background: #f88c00; content: ''; width: 30px; height: 3px;}


.sub_menu{margin-top: 20px; width: 100%; padding-top: 5px; height: 190px;}
.sub_menu li{width: 150px; padding-bottom: 10px; text-align: center;}
.sub_menu li a{font-size: 16px;}
.sub_menu li a:hover{color:#f88c00;}

#header.on{background: #fff; border-bottom: 1px solid #ccc;}
#header.on .menu ul li a.main_menu{color: #000;}
#header.on .hd_top ul li::after{background: #a0a0a0}
#header.on .hd_top ul li>a{color: #000;}

#header.open{height: 300px; border-bottom: 1px solid #ccc;}

/* 퀵메뉴 */
.sns{padding: 21px 0; background: rgba(0,0,0,0.6); width: 70px; height: 285px; border-radius: 35px;}
.sns a{position: relative; padding: 16px 0; display: block;}
.sns a::after{position: absolute; width: 25px; height: 1px; bottom: 0; left: 22px; content: ''; background: rgba(255,255,255,0.5);}
.sns a:last-child:after{width: 0; height: 0;}

.top_bt{cursor: pointer; padding: 13px; width: 70px; height: 70px; margin-top: 20px; border-radius: 50%; color: #fff; background: #f88c00;}
.top_bt p{padding-top: 3px; width: 100%; font-size: 16px; font-weight: bold;}

/* 모바일메뉴 */
.ham{display: none; position: absolute; left: 2%; top: 22%;}
.ham .ham_line{background: #fff; width: 30px; height: 3px; margin: 8px 0;}

/* 모바일메뉴 */
.ham{position: absolute; width: 70px; height: 70px; display: none;}
.ham_menu{width: 40px; height: 3px; background: #ccc; position: absolute; top: 25px; left: 25px;}
.ham_menu::before{width: 40px; height: 3px; background: #ccc; position: absolute; top: 10px; left: 0px; content: '';}
.ham_menu::after{width: 40px; height: 3px; background: #ccc; position: absolute; top: 20px; left: 0px; content: '';}

.ham_menu_cont{top: 0; width: 240px; position: fixed; height: 150%; text-align: center; background: #292929; left: -100%; transition: all 0.5s; z-index: 9999;}
.ham_menu_cont.on{left: 0;}
.ham_menu_cont .x{text-align: right; padding: 14px;}
.ham_menu_cont .x img{width: 23px;}
.close_bt{height: 50px; border-bottom: 1px solid #383838; }

.accordion-box{width: 100%; max-width: 600px; margin:  0 auto;}
.accordion-box .title_menu{transition: all 0.5s; overflow: hidden; clear: both; width: 100%; line-height: 50px; background: #292929; color: #fff; box-sizing: border-box; border-bottom: 1px solid #383838; font-size: 17px; cursor:pointer;}
.accordion-box .title_menu span.tt{float: left; margin-left: 20px; font-size: 15px;}
.accordion-box .title_menu span.ic{float: right; margin-right: 20px;}
.accordion-box .con{display:none;}
.accordion-box .con ul li{height: 50px; line-height: 50px; border-bottom: 1px solid #383838; background: #000; font-size: 15px; text-align: left; padding-left: 20px;}
.accordion-box .con ul li a{color: #b7b7b7; display: block; font-size: 14px;}

.black_bg{width: 100%; height: 200%; background: rgba(0,0,0,0.5); position: fixed; display: none; z-index: 888; top: 0;}

/* 배너 */
.slick-slide img{max-width: 1920px; margin: 0 auto;}
.slick-prev{position: absolute; top: 50%; transform: translateY(-50%); left: 150px; z-index: 10;}
.slick-next{position: absolute; top: 50%; transform: translateY(-50%); right: 150px;}
.banner_txt{max-width: 1300px; text-align: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-35%);}
.banner_txt .title{letter-spacing: 18px; color: #fff; font-size: 60px; font-weight: 900;}
.banner_txt .desc{color: #fff; font-size: 20px; line-height: 32px; padding: 80px 0;}
.banner_txt .banner_bt a{font-size: 18px; display: inline-block; padding: 15px 80px; border: 1px solid #fff;}
.banner_txt .banner_bt a.trans{color: #fff; margin-right: 10px;}
.banner_txt .banner_bt a.white{background: #fff; color: #173f48}

/* 컨텐츠 */
#service{}
#business{padding: 150px 0;}
#news{padding: 150px 0; background: #fafafa;}
#education{padding: 150px 0;}
#call{padding: 70px 0; background: url(../img/callimg.png)no-repeat center; background-size: cover;}

.container_1300{width: 1300px; margin: 0 auto;}
.sub_title{padding-bottom: 80px; font-weight: bold; text-align: center; font-size: 36px; letter-spacing: 18px; text-transform: uppercase;}

/* 서비스 */
.service{display: flex; justify-content: space-between; align-items: center;}
.service_num{width: 65%; }
.service_num>h1{font-size: 24px; margin-bottom: 25px;}
.service_num ul{display: flex;}
.service_num ul li{text-align: center; position: relative; margin-right: 52px;}
.service_num ul li:first-child{margin-right: 30px;}
.service_num ul li::after{position: absolute; content: ''; width: 1px; height: 35px; background: #d2d2d2; top: 22px; left: -27px;}
.service_num ul li:first-child:after{width: 0; height: 0;}
.service_num ul li:nth-child(2):after{width: 0; height: 0;}
.service_num ul li h1{font-size: 30px; font-weight: bold; margin-bottom: 10px;}
.service_num ul li h2{font-size: 16px; color: #757575;}
.service_num ul li.orange h1{color: #f88c00;}
.service_num ul li.orange h2{color: #000; word-break: keep-all;}

.notice{background: #fff; margin-top: -30px; height: 260px; width: 35%; position: relative; padding: 25px; box-sizing: border-box; border: 1px solid #d2d2d2;}
.notice_title{font-size: 24px; margin-bottom: 10px;}
.notice_title span{font-size: 20px; color: #76706b}
.notice_more{position: absolute; top: 30px; right: 30px;}

.notice table{width: 100%;}
.notice table tr{width: 100%;}
.notice table tr td.desc{width: 100%; display: block; font-size: 15px; padding: 5px 0; white-space: nowrap; text-overflow: ellipsis; overflow: hidden}
.notice table tr td.day{width: 30%; font-size: 15px; text-align: right; white-space: nowrap;}

/* 비즈니스 */
.business{display: flex; justify-content: space-between;}
.business_ct{width: 24%; margin-right: 2%; box-shadow: 0 0 15px rgb(0,0,0,0.1);}
.business_ct:last-child{margin-right: 0%;}
.business_ct_img{overflow: hidden; height: 280px; width: 100%;}
.business_ct_img img{width: 100%; height: 100%; object-fit: cover;}
.business_ct_img:hover img{transform: scale(1.1); transition: 0.3s ease;}
.business_ct_txt{padding: 40px 20px; text-align: center;}
.business_ct_txt h1{font-size: 14px; color: #fa9700; letter-spacing: 1px; text-transform: uppercase;}
.business_ct_txt h2{font-size: 24px; margin: 15px 0 25px 0;}
.business_ct_txt p{font-size: 16px; word-break: break-all;}
.business_ct_txt>p{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; white-space:normal; overflow:hidden; text-overflow:ellipsis;}
.business_ct_txt>h2{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; white-space:normal; overflow:hidden; text-overflow:ellipsis;  word-break : keepall}

/* 교육 */
.education{display: flex;}
.education_ct{overflow: hidden; position: relative; width: 49%; margin-right: 2%; height: 280px;}
.education_ct_txt{width: 100%; text-align: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.education_ct img{width: 100%; height: 100%; object-fit: cover;}
.education_ct:hover img{transform: scale(1.1); transition: 0.3s ease;}
.education_ct h1{color: #fff; font-weight: bold; font-size: 36px; margin-bottom: 40px;}
.education_ct a{font-size: 18px; color: #fff; display: block; border: 1px solid #fff; padding: 10px 0px; margin: 0 auto; width: 300px;}
.education_ct a:hover{background: #fff; color: #000; transition: 0.3s ease;}
.education_ct:last-child{margin-right: 0;}

/* 후원 */
.call{display: flex; color: #fff; justify-content: space-between; align-items: center;}
.call_num{width: 49%; text-align: center;}
.call_num h1{font-size: 24px; font-weight: 500;}
.call_num h2{font-size: 56px; font-weight: bold;}
.call_line{height: 120px; width: 1px; background: rgba(255,255,255,0.5);}
.call_bt{text-align: center; width: 49%;}
.call_bt p{font-size: 16px; margin-bottom: 25px;}
.call_bt a{margin: 0 auto; display: block; background: #fff; color: #fa9700; font-size: 18px; width: 200px; padding: 10px 0;}

/* 푸터 */
.ft_wrap{padding: 50px 0; color: #fff; display: flex; justify-content: space-between;}
.ft_txt{text-align: left;}
.ft_txt h1{font-size: 30px; font-weight: 500; padding-bottom: 15px; margin-top: -7px;}
.ft_txt p{font-size: 16px; color: #a0a0a0;}
.ft_side{text-align: right;}
.ft_side .ft_sns{margin-left: 5px;}
.ft_side>a{color: #fff; border: 1px solid #fff; border-radius: 5px; font-size: 16px; padding: 5px 20px; display: inline-block; margin-top: 15px;}


/* 반응형 */
@media screen and (max-width: 1500px) {
    #top_btn{display: none;}
}
@media screen and (max-width: 1320px) {
    #hd, #wrapper, #ft {min-width: 100%;}
    .container_1300{width: 90%; margin: 0 auto;}

    .ft_txt p{font-size: 14px;}
    .ft_wrap{flex-wrap: wrap; justify-content: center;}
    .ft_logo{width: 100%; display: none;}
    .ft_txt{width: 100%; text-align: center;}
    .ft_side{width: 100%; display: flex; justify-content: center; align-items: baseline;}
    .ft_side .ft_sns{margin-right: 20px; margin-left: 0;}
}

@media screen and (max-width: 1150px) {
    .business{flex-wrap: wrap;}
    .business_ct{width: 49%; margin-right: 2%}
    .business_ct:nth-of-type(1){margin-bottom: 2%}
    .business_ct:nth-of-type(2){margin-bottom: 2%}
    .business_ct:nth-of-type(2n){margin-right: 0}

    .banner_txt{width: 90%;}
    .slick-prev{z-index: 0}
    .slick-next{z-index: -1}

    .service{flex-wrap: wrap;}
    .service_num{width: 100%; padding: 50px 0;}
    .service_num>h1{text-align: center;}
    .service_num ul{justify-content: center;}
    .service_num ul li:last-child{margin-right: 0;}
    .notice{width: 100%; margin-top: 0;}

}

@media screen and (max-width: 1024px) {
    #hd_wrap{height: 70px;}
    #header{height: 70px;}
    .menu{display: none;}
    .hd_top{display: none;}
    .logo{width: 100%; text-align: center;}
    .ham{display: block;}

    #header.on{background: #fff; border-bottom: 1px solid #ccc;}
    #header.on .ham .ham_line{background: #292929;}

    #header.open{height: auto; border-bottom: 1px solid #ccc;}
    .ft_side>a{display: none;}
    .a1234_banner{display: none;}
    .a1234_title{margin-top: 15px;}

}

@media screen and (max-width: 960px) {
    .education{flex-wrap: wrap;}
    .education_ct{width: 100%; margin-right: 0%;}
    .education_ct:first-child{margin-bottom: 2%;}
    .education_ct img{width: 100%;}

    .call{flex-wrap: wrap;}
    .call_line{display: none;}
    .call_num{width: 100%;}
    .call_bt{width: 100%;}
    .call_bt p{margin-top: 15px;}
}

@media screen and (max-width: 767px) {
    #banner_wrap{height: 100vh;}
    .banner{height: 100%;}
    .slick-list{height: 100%;}
    #business{padding: 80px 0;}
    #news{padding: 80px 0;}
    #education{padding: 80px 0;}
    #call{padding: 50px 0; background-position: left;}
    .sub_title{padding-bottom: 30px; letter-spacing: 3px; font-size: 30px;}

    .logo img{width: 160px;}
    .ham{left: 5%;}

    .banner_txt{top: 45%;}
    .banner_txt .banner_bt a.trans{margin-right: 0; margin-bottom: 10px;}
    .banner_txt .title{font-size: 40px; line-height: 50px; letter-spacing: 5px;}
    .banner_txt .desc br{display: none;}
    .banner_txt .desc{word-break: keep-all; font-size: 16px; line-height: 26px; padding: 30px 0;}

    .service_num>h1{font-size: 20px;}
    .service_num ul{flex-wrap: wrap;}
    .service_num ul li{width: 50%;}
    .service_num ul li::after{width: 0; height: 0;}
    .service_num ul li{margin-right: 0; margin-bottom: 25px;}
    .service_num ul li:nth-of-type(5){margin-bottom: 0px;}
    .service_num ul li:nth-of-type(6){margin-bottom: 0px;}
    .service_num ul li:first-child{margin-right: 0;}
    .service_num ul li.orange{text-align: left;}

    .notice table tr td.desc{width: 90%;}

    .business_ct{width: 100%; margin-bottom: 5%!important; margin-right: 0}
    .education_ct:last-child{margin-bottom: 0%;}
    .education_ct h1{font-size: 28px;}
    .education_ct:first-child{margin-bottom: 5%}
    .education_ct a{width: 200px;}

    .call_num h2{font-size: 34px;}
    .call_bt p br{display: none}
    .call_bt p{word-break: keep-all; font-size: 14px;}

    .ft_txt p br{display: none}
    .ft_txt p{word-break: keep-all; font-size: 12px; margin-top: 10px;}
    .ft_txt h1{display: none;}
    .ft_wrap{flex-wrap: wrap-reverse; padding: 30px 0;}
}

@media screen and (max-width: 479px) {
    .education_ct{height: 200px;}
    body{min-width: 360px;}
    .banner_txt .title{letter-spacing: 5px;}
}