@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; height: 140px; border-bottom: 1px solid #fff;}
#header{transition: 0.3s ease; overflow: hidden; height: 140px;}
.hd_box {margin:0 auto; padding:0; width:100%; height:140px;}
.on > .hd_box {background:#ffffff; box-shadow:0 0 2px 3px #bbb;}
.hd_top{height: 50px; padding-top: 15px;}
.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: 235px;}
.menu>ul>li {margin-left:100px;}
.menu ul li{font-size: 20px; text-align: left;}
.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: 20px; height: 190px;}
.sub_menu li{/*width: 150px;*/min-width:125px; padding-bottom: 10px; text-align: center;}
.sub_menu li a{font-size: 18px;}
.sub_menu li a:hover{color:#f88c00;}

#header.on{background:rgba(255, 255, 255, 0.8); 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: 355px; 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: 40px; height: 41px; display: none; cursor:pointer;}
.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: 110px 0; background: #fafafa;}
#call{margin:0 auto; padding:0;}

.container_1300{width: 1300px; margin: 0 auto;}
.sub_title{position:relative; margin:0 auto; padding-bottom: 80px; width:fit-content; font-weight: 900; text-align: center; font-size: 36px; letter-spacing: 8px;}
.sub_title:after {content:''; position:absolute; left:0; top:56px; width:calc(100% - 6px); height:4px; background:#000;}

/* 서비스 */
.service{display: flex; justify-content: space-between; align-items: center; padding:70px 0;}
.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; height: 260px; width: 100%; 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: 32%; 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}

/* 후원 */
.call{display:flex; flex-direction:row; justify-content:space-between; align-items:stretch; margin:0; margin-bottom:80px; padding:0;}
.call_logo {display:flex; flex-direction:row; align-items:center; justify-content:center; margin:0; padding:0; width:880px; height:650px; background:url('../img/call_bg.png') no-repeat center center; background-size:cover;}
.call_info {flex:1 1 0%; display:flex; flex-direction:column; align-items:center; justify-content:center; margin:0; padding:0; background:#062949;}
.call_info > p {font-family:'Noto Sans KR', sans-serif; color:#fff; font-size:24px; text-align:center; line-height:70px;}
.call_info > a {display:inline-block; margin:0; margin-top:80px; padding:5px 28px 7px 28px; background:#fff; color:#062949; font-family:'Noto Sans KR', sans-serif; font-weight:500; font-size:16px;}

/* 푸터 */
.ft_wrap{position:relative; padding: 50px 0; color: #fff; display: flex; justify-content: space-between;}
.ft_txt{text-align: left; flex:1 1 0%; margin-left:70px;}
.ft_txt h1{display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:space-between; margin:0; font-size: 30px; font-weight: 500; padding-bottom: 15px; margin-top: -7px;}
.ft_txt h1 > span > img {margin-left:10px;}
.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;}

.banner_txt {position:relative; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; margin:0; padding:0; width:100%;}
.banner_txt > h4 {padding-left:200px; padding-top:-270px; color:#fff; font-weight:700; font-size:70px; letter-spacing:-3px; line-height:80px; text-align:left;}
.banner_txt > p {padding-left:200px; padding-top:25px; color:#fff; font-weight:400; font-size:24px; text-align:left;}

.ft_link_box {position:absolute; right:0; bottom:50px; display:flex; flex-direction:row; align-items:center; justify-content:center; margin:0; padding:0; gap:0 10px;}
.ft_link_box > li > a {display:flex; flex-direction:row; align-items:center; justify-content:center; margin:0; padding:0; color:#fff; font-size:16px;}
.ft_link_icon {flex-direction:column !important; gap:5px 0; margin-left:10px !important;}


/* 반응형 */
@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;}

    .call_logo {width:700px; height:500px;}
    .call_info > p {font-size:22px; line-height:60px;}
    .call_info > a {margin-top:60px;}

    .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; margin-left:0;}
    .ft_side{width: 100%; display: flex; justify-content: center; align-items: baseline;}
    .ft_side .ft_sns{margin-right: 20px; margin-left: 0;}
    .ft_txt h1 {flex-direction:column-reverse;justify-content:center;}
    .ft_txt h1 > span {display:block;margin-bottom:15px;width:100%;}
}

@media screen and (max-width: 1150px) {
    .menu > ul > li {margin-left:70px;}

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

    .call_logo {width:550px; height:380px;}
    .call_info > p {font-size:20px; line-height:48px;}
    .call_info > a {margin-top:40px;}

}

@media screen and (max-width: 1024px) {
    #hd_wrap{height: 90px;}
    #header{height: 90px;}
    .hd_bottom {height:90px;}
    .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:90px; border-bottom: 1px solid #ccc;}
    .ft_side>a{display: none;}
    .a1234_banner{display: none;}
    .a1234_title{margin-top: 15px;}

    .call {flex-wrap:wrap;}
    .call_logo {width:100%; height:550px;}
    .call_info {padding:35px 15px;}
    .call_info > p {line-height:32px;}

    .banner_txt {align-items:center;}
    .banner_txt > h4 {text-align:center; padding-left:0;}
    .banner_txt > p {text-align:center; padding-left:0;}
    .slick-slide > div > div {height:650px !important;}

}

@media screen and (max-width: 960px) {
    .call{flex-wrap: wrap;}
}

@media screen and (max-width: 767px) {
    #banner_wrap{/*height: 100vh;*/}
    .banner{height: 100%;}
    .slick-list{height: 100%;}
    #business{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}

    .call_logo {height:400px;}
    .call_logo > img {margin-top:20px; width:220px;}

    .ft_txt p br{display: none}
    .ft_txt p{word-break: keep-all; font-size: 12px; margin-top: 10px;}
    .ft_txt h1{margin-bottom:0; padding-bottom:0; font-size:22px;}
    .ft_txt h1 > span {margin-bottom:8px;}
    .ft_txt h1 > span > img {height:27px;}
    .ft_wrap{flex-wrap: wrap-reverse; padding: 30px 0;}

    .banner_txt > h4 {font-size:50px; line-height:54px;}
    .banner_txt > p {padding-top:16px; font-size:20px;}

    .ft_link_box {position:relative; left:auto; bottom:0; margin-bottom:8px; width:100%;}
}

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

    .call_logo {height:320px;}
}