@charset "UTF-8";

/* 
    sub010101 
    사업단 소개 > 인사말 
*/
.greeting{display:flex; gap:5.9rem; padding:0;}
.greeting .text{flex:1; padding:5rem 0;}
.greeting .text > h3{font-size:2.6rem; font-weight:400; font-family: 'Chungbuk-National-University';}
.greeting .text > h3 p{color:#B62B5B; font-size:2.1rem;}
.greeting .text > h3 em{font-weight:700;}
.greeting .text > p{margin:4rem 0; font-size:1.8rem; font-weight:500;}
.greeting .text > strong{color:#555; font-size:2.1rem; font-family: 'Chungbuk-National-University';}
.greeting .text > strong em{display:block; color:#000; font-size:2.6rem;}

/* 
    sub010201 
    사업단 소개 > 사업개요 
*/
.business{padding:3rem 0 0;}
.business .top{text-align: center;}
.business .top img{margin:0 auto 2.8rem; width:24rem;}
.business .top strong{font-size:2.6rem;}
.business .top p{margin:1.4rem 0 0; font-size:1.8rem; color:#555; font-weight:500;}
.business .top p em{color:#B62B5B; font-weight:700;}
.business .middle{position:relative; margin-top:-3rem;}
.business .middle img{position:relative; z-index: -1;}
.business .middle [class*="item"] > li{position:absolute;}
.business .middle [class*="item"] > li strong{display:block; margin-bottom:1rem; font-size:2.6rem; font-family: 'Urbanist';}
.business .middle .item1 > li:nth-child(2n){text-align:right;}
.business .middle .item1 > li:nth-child(2n) [data-list="dot"]{align-items: flex-end;}
.business .middle .item1 > li:nth-child(1){left:0; top:11rem;}
.business .middle .item1 > li:nth-child(2){right:0; top:11rem;}
.business .middle .item1 > li:nth-child(3){left:0; bottom:5rem;}
.business .middle .item1 > li:nth-child(4){right:0; bottom:5rem;}
.business .middle .item1 > li i{display:none; position:absolute; left:0; top:0; width:32px; height:32px; background-position:50% 50%; background-repeat: no-repeat; background-size:cover;}
.business .middle .item1 > li i.icon1{background-image: url(../../../images/site/sub/icon_01.svg);}
.business .middle .item1 > li i.icon2{background-image: url(../../../images/site/sub/icon_02.svg);}
.business .middle .item1 > li i.icon3{background-image: url(../../../images/site/sub/icon_03.svg);}
.business .middle .item1 > li i.icon4{background-image: url(../../../images/site/sub/icon_04.svg);}
.business .middle .item2 > li strong{color:#B62B5B;}
.business .middle .item2 > li{top:50%; left:50%; transform: translate(-50%, -50%);}
.business .middle .item2 > li:nth-child(2n-1){text-align:right;}
.business .middle .item2 > li:nth-child(2n-1) [data-list="dot"]{align-items: flex-end;}
.business .middle .item2 > li:nth-child(1){margin-left:-36rem;}
.business .middle .item2 > li:nth-child(2){margin-left:34rem;}
.business .middle [data-list="dot"]{display:flex; flex-direction: column; align-items: flex-start; font-size:1.8rem; font-weight:500;}
.business .middle .text{position:absolute; left:50%; top:11.2rem; font-size:2.6rem; text-align: center; letter-spacing: -0.026rem; font-family: 'Chungbuk-National-University'; transform: translateX(-50%);}

/* 
    sub010301 
    사업단 소개 > 조직도 
*/
.organ{padding:4rem 0 0;}
.organ .top{position:relative; width:16rem; height:16rem; margin:0 auto; border-radius: 50%; border:2px solid #BE9F56;}
.organ .top::before{content:""; display:block; position:absolute; left:50%; top:100%; width:1px; height:3rem; background:#B2BCC6; transform: translateX(-50%);}
.organ .top span{display:flex; align-items: center; justify-content: center; width:100%; height:100%; padding:0.6rem; border-radius: 50%; border:1.4rem solid #fff; background:#BE9F56; color:#fff; font-size:16px; font-weight:700; line-height:1.3; text-align: center;}
.organ .box{display:block; width:100%; border-radius: 1.2rem; border:1px solid #151515; text-align: left; overflow: hidden;}
.organ .box .tit{padding:1.4rem 2rem; background:#151515;}
.organ .box .tit::before{content:""; display:table; clear: both;}
.organ .box .tit p{color:#FFA8C7; font-size:12px; font-weight:500; font-family: 'Urbanist';}
.organ .box .tit strong{color:#fff; font-size:16px;}
.organ .box .tit span{float: right; display:inline-block; position:relative; top: -2px;; margin-left:1.2rem; padding:0.4rem 1rem; border-radius: 0.4rem; background:#fff; color:#151515; font-size:14px; font-weight:700;}
.organ .box .text{padding:2rem; background:#fff;}
.organ .box .text > p{font-size:15px; font-weight:600;}
.organ .box .text [data-list="dot"]{margin-top:1.2rem; padding-top:1.2rem; border-top:1px solid #EAECEE; font-size:14px; font-weight:500;}
.organ .box .text [data-list="dot"] > li::before{top: 0.9rem; background:#B62B5B;}
.organ .box .text [data-list="dot"] > li + li{margin-top:0.6rem;}
.organ .item1{display:flex; flex-direction: column; align-items: center; justify-content: center; gap:1.2rem; height:100%; padding:2rem; border-radius: 1.6rem; background:#151515; color:#fff; text-align: center;}
.organ .item1::before{content:""; display:block; position:absolute; left:50%; top:100%; width:1px; height:5.8rem; background:#B2BCC6; transform: translateX(-50%);}
.organ .item1 strong{font-size:2rem; font-weight:600;}
.organ .item1 span{display:inline-block; padding:0.4rem 1.2rem; border-radius: 0.4rem; background:rgba(255,255,255,0.1); color:#FEE7B2; font-size:14px; font-weight:500;}
.organ .middle{margin-top:2.2rem;}
.organ .middle > ul{display:flex; justify-content: center; gap:8rem; position:relative;}
.organ .middle > ul::before{content:""; display:block; position:absolute; left:50%; top:0%; width:88rem; height:1px; background:#B2BCC6; transform: translateX(-50%);}
.organ .middle > ul > li{position:relative; width:100%; max-width:36rem; padding-top:3rem;}
.organ .middle > ul > li::before{content:""; display:block; position:absolute; left:50%; top:0%; width:1px; height:3rem; background:#B2BCC6; transform: translateX(-50%);}
.organ .bottom{margin-top:5.8rem; text-align: center;}
.organ .bottom > strong{display:inline-block; vertical-align: middle; position:relative; width:36rem; padding:2rem; border-radius: 5rem; background:#B62B5B; color:#fff; font-size:16px; font-weight:700; text-align: center; box-shadow: 0 4px 8px 0 rgba(225, 30, 38, 0.20);}
.organ .bottom > strong::before{content:""; display:block; position:absolute; left:50%; top:100%; width:1px; height:3rem; background:#B62B5B; transform: translateX(-50%);}
.organ .bottom > ul{display:flex; gap:3rem; position:relative; margin-top:2.8rem;}
.organ .bottom > ul::before{content:""; display:block; position:absolute; left:50%; top:0%; width:76.5%; height:1px; background:#B62B5B; transform: translateX(-50%);}
.organ .bottom > ul > li{flex:1; position:relative; padding-top:3rem;}
.organ .bottom > ul > li::before{content:""; display:block; position:absolute; left:50%; top:0%; width:1px; height:3rem; background:#B62B5B; transform: translateX(-50%);}
.organ .bottom .box{border-color:#B62B5B; box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.05);}
.organ .bottom .box .tit{background:#B62B5B;}
.organ .item2{padding-top:29.2rem;}
.organ .item2 > ul{position:absolute; right:calc(50% - 11rem); bottom:0; display:flex; gap:1.4rem; width:70rem; padding-top:3rem;}
.organ .item2 > ul::before{content:""; display:block; position:absolute; left:50%; top:0%; width:68%; height:1px; background:#B2BCC6; transform: translateX(-50%);}
.organ .item2 > ul > li{flex:1; position:relative; padding:2rem; border:1px solid #D1D6E0; border-radius: 1.2rem; box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.02); text-align: left;}
.organ .item2 > ul > li::before{content:""; display:block; position:absolute; left:50%; bottom:100%; width:1px; height:3rem; background:#B2BCC6; transform: translateX(-50%);}
.organ .item2 > ul > li:last-child:before{height:6rem;}
.organ .item2 > ul > li .tit::after{content:""; display:table; clear: both;}
.organ .item2 > ul > li .tit strong{font-size:15px;}
.organ .item2 > ul > li .tit span{float: right; display:inline-block; padding:0.2rem 0.8rem; border-radius: 0.4rem; background:#F2F4F7; color:#5F6B73; font-size:14px; font-weight:500;}
.organ .item2 > ul > li .text{margin-top:1.2rem; padding-top:1.2rem; border-top:1px solid #EAECEE;}
.organ .item2 > ul > li [data-list]{font-size:13px; font-weight:500;}
.organ .item2 > ul > li [data-list] > li::before{top: 0.8rem;}
.organ .item2 > ul > li [data-list] > li + li{margin-top:0.6rem;}
.organ .item2 > ul > li .text .tel{display:flex; align-items: flex-start; gap:6px; margin-top:1.2rem; padding:0.6rem 1rem; border-radius: 0.6rem; background:#F5F6F8; color:#5F6B73; font-size:14px; font-weight:600;}
.organ .item2 > ul > li .text .tel::before{content:""; display:inline-block; vertical-align: middle; width:12px; height:12px; margin-top:0.4rem; background:url("../../../images/site/sub/ico_phone.svg") no-repeat 50% 50% / cover;}

/* 
    sub010501 
    사업단 소개 > 협력기관 및 산업체
*/
.partner{display:grid; grid-template-columns: repeat(3,1fr); gap:2.4rem;}
.partner > li{border: 1px solid #CCC; border-radius: 1.2rem; box-shadow: 0 4px 12px 0 rgba(31, 41, 55, 0.04);}
.partner > li .img{display:block; width:100%; border-bottom:1px solid #ddd; overflow: hidden;}
.partner > li .img img{width:100%;}
.partner > li .text{padding:2.4rem; line-height:1.4;}
.partner > li .text strong{display:block; color:#B62B5B; font-size:1.8rem;}
.partner > li .text address{margin-top:0.8rem; font-size:13px; font-weight:500;}

/* 
    sub010601 
    사업단 소개 > 오시는길
*/
.location_wrap{padding:5rem 0 0;}
.location_wrap .info h3{font-size:3.2rem; font-weight:800;}
.location_wrap .info p{margin:1.2rem 0 2.4rem; color:#555; font-size:1.8rem; font-weight:500;}
.location_wrap .info dl{display:flex; align-items: flex-start; gap:1.2rem; margin-top:1.2rem; font-size:13px; font-weight:500; line-height:1.4;}
.location_wrap .info dt{min-width:6rem;}
.location_wrap #map{position:relative; height:44.7rem; margin:6rem 0 4.8rem; border-radius:1.6rem; background:#ddd; overflow: hidden;}
.location_wrap #map > img{min-height:100%; object-fit: cover;}
.traffic{display:flex; gap:6rem; padding:6rem 8rem; background:#f8fafc;}
.traffic .left h3{font-size:2.6rem;}
.traffic .left p{margin-top:1.2rem; font-size:13px; font-weight:500;}
.traffic .right h4{position:relative; margin-bottom:1.2rem; padding-left:1.2rem; color:#B62B5B; font-size:1.8rem;}
.traffic .right h4:not(:first-child){margin-top:2.4rem;}
.traffic .right h4::before{content:""; display:block; position:absolute; left:0; top:0.8rem; width:0.4rem; height:1rem; border-radius: 2rem; background:#B62B5B;}
.traffic .right ul > li{padding:2.4rem 0;}
.traffic .right ul > li + li{border-top:1px solid #E2E8F0;}
.traffic .right ul > li:first-child{padding-top:2rem;}
.traffic .right ul > li em{display:block; margin-bottom:0.8rem; font-size:1.5rem; font-weight:700;}
.traffic .right ul > li em::before{content:"· ";}
.traffic .right ul > li p{font-size:13px; font-weight:500;}

/* 
    sub020101 
    교육과정 > 교육과정 개요
*/
.schedule{overflow-x:auto;}
.schedule table{min-width:800px; border-top:2px solid #151515;}
.schedule table thead tr{border-bottom:1px solid #E6E8EA;} 
.schedule table thead tr:first-child{background-color:#EEF2F7;} 
.schedule table thead tr th{height:5rem; padding:0.8rem; font-weight:400;} 
.schedule table thead tr th.bold{font-weight:600;}
.schedule table thead tr th:not(:first-child){border-left:1px solid #E6E8EA;} 
.schedule table tbody tr{border-bottom:1px solid #E6E8EA;} 
.schedule table tbody tr.bd_bo{border-color:#AAA;}
.schedule table tbody tr th{font-size:1.8rem; font-weight:600;}  
.schedule table tbody tr td{height:4.8rem; padding:0.8rem; border-left:1px solid #E6E8EA; background:#FAFAFA; text-align: center;} 
.schedule .color1{background:#FBF3F5 !important;}
.schedule .color2{background:#F8E3E8 !important;}
.schedule .color3{background:#F1CFD7 !important;}
.schedule .color4{background:#E2FEF3 !important;}
.schedule .color5{background:#B8EFD9 !important;}
.schedule .color6{background:#6BE5B5 !important;}
.schedule .color7{background:#EFE9B8 !important;}
.subject > ul{border-top:1px solid #333;}
.subject > ul > li{display:flex; align-items: flex-start; padding:3.6rem 0;}
.subject > ul > li + li{border-top:1px solid #ddd;}
.subject > ul > li > strong{display:inline-block; position:relative; width:30rem; padding-left:1.6rem; font-size:2.2rem;}
.subject > ul > li > strong::before{content:""; display:block; position:absolute; left:0; top:50%; width:0.6rem; height:2.4rem; transform: translateY(-50%);}
.subject > ul > li:nth-child(1) > strong::before{background-color:#FBF3F5;}
.subject > ul > li:nth-child(2) > strong::before{background-color:#E2FEF3;}
.subject > ul > li:nth-child(3) > strong::before{background-color:#F8E3E8;}
.subject > ul > li:nth-child(4) > strong::before{background-color:#B8EFD9;}
.subject > ul > li:nth-child(5) > strong::before{background-color:#F1CFD7;}
.subject > ul > li:nth-child(6) > strong::before{background-color:#6BE5B5;}
.subject > ul > li [data-list]{flex:1; display:grid; grid-template-columns: repeat(3, 1fr); gap:1.2rem; font-size:1.8rem; font-weight:500;}
.subject .training{padding:2rem 4rem; border-radius: 1.6rem; background:#EFE9B8 url("../../../images/site/sub/sub020101_01.png") no-repeat right 4rem center / 8.6rem;}
.subject .training strong{display:block; margin-bottom:1.4rem; font-size:2.2rem;}
.subject .training [data-list]{font-size:1.7rem; font-weight:500;}
.subject .training [data-list] > li + li{margin-top:0.6rem;}
.subject .training [data-list] > li::before{width:0.4rem; height:0.4rem;}

/* 
    sub020201 
    교육과정 > 교육이수조건
*/
.requirement::after{content:""; display:table; clear: both;}
.requirement .list{float: left;}
.requirement .list > li{position:relative; padding-left:3.3rem;}
.requirement .list > li::before{content:""; display:block; position:absolute; left:0; top:0.7rem; width:2.3rem; height:2rem; background-repeat:no-repeat; background-size:cover; background-position:50% 50%;}
.requirement .list > li:nth-child(1)::before{background-image:url("../../../images/site/sub/sub020201_02.svg");}
.requirement .list > li:nth-child(2)::before{background-image:url("../../../images/site/sub/sub020201_03.svg");}
.requirement .list > li:nth-child(3)::before{background-image:url("../../../images/site/sub/sub020201_04.svg");}
.requirement .list > li + li{margin-top:3rem;}
.requirement .list > li strong{display:block; margin-bottom:0.8rem; font-size:2.2rem;}
.requirement .list > li p{color:#333; font-size:1.8rem; font-weight:500;}
.requirement .img{float: right; margin-top:1rem; margin-left: 2rem;}
.requirement [data-list]{float: left; width:100%; margin-top:4rem; padding:2rem 3.3rem; border-radius: 1.6rem; background:#FBF3F5; color:#151515; font-size:1.7rem; font-weight:500;}
.requirement [data-list] > li + li{margin-top:0.6rem;}

/* 
    sub020301 
    교육과정 > 활동지원내용
*/
.main_backup{display:grid; grid-template-columns: repeat(3, 1fr); gap:20px 3rem;}
.main_backup > li .thumb{position:relative; height:0; padding-top:69.566%; border-radius: 1.2rem; overflow: hidden;}
.main_backup > li .thumb img{position:absolute; left:0; top:0; width:100%; height:100%; object-fit: cover;}
.main_backup > li .text{padding-top:2rem;}
.main_backup > li .text strong{color:#B62B5B; font-size:2.2rem;}
.main_backup > li .text p{margin-top:0.8rem; font-size:1.6rem; font-weight:500;}
.sub_backup{display:flex; flex-wrap:wrap; justify-content: space-between; gap:2rem; position:relative; margin-top:11rem; padding:10rem 0 15rem; color:#fff;}
.sub_backup::after{content:""; display:block; position:absolute; left:50%; top:50%; width:100vw; height:100%; background:url("../../../images/site/sub/sub020301_08.jpg") no-repeat 50% 50% / cover; transform: translate(-50%,-50%); z-index: -1;}
.sub_backup .h3_title{margin:0;}
.sub_backup ul{display:grid; grid-template-columns: repeat(2, 1fr); gap:3rem; width:95rem; max-width:100%;}
.sub_backup ul > li{position:relative; padding:3rem; border-radius: 1.6rem; border:1px solid rgba(255,255,255,0.2); background:rgba(255,255,255,0.1); backdrop-filter: blur(40px); transition: background 0.3s ease, border-color 0.3s ease; will-change: transform;}
.sub_backup ul > li em{font-size:1.8rem; opacity: 0.8;}
.sub_backup ul > li strong{display:block; margin-top:1.2rem; font-size:2.2rem;}
.sub_backup ul > li img{position:absolute; right:3rem; top:50%; max-width:8rem; transform: translateY(-50%);}






@media screen and (max-width:1440px){
    .organ .item2{padding-top:34.2rem;}
    .organ .item2 > ul > li:last-child:before{height:11rem;}

    .traffic{padding:4rem;}

    .requirement .img{width:50rem;}
}
@media screen and (max-width:1240px){
    .greeting .img img{width:34rem;}
    .greeting .text{padding:0;}

    .business .middle{margin-top:0;}
    .business .middle .text{top: 5rem;}
    .business .middle img{width:100vw; max-width: 100vw; margin-left:-20px;}
    .business .middle [class*="item"]{display:grid; grid-template-columns: repeat(2, 1fr); gap:0 2rem;}
    .business .middle [class*="item"] > li{position:static; margin-top:24px; transform: translate(0%, 0%);}
    .business .middle .item1 > li{padding-left:44px;}
    .business .middle .item1 > li i{display:block;}
    .business .middle .item1 > li:nth-child(2n){text-align:left;}
    .business .middle .item1 > li:nth-child(2n) [data-list="dot"]{align-items: flex-start;}
    .business .middle .item2{margin-top:2.4rem; border-top:1px solid #EEE;}
    .business .middle .item2 > li:nth-child(2n-1){text-align:left;}
    .business .middle .item2 > li:nth-child(2n-1) [data-list="dot"]{align-items: flex-start;}
    .business .middle .item2 > li{margin-left:0 !important;}

    .organ .middle > ul{gap:4rem;}
    .organ .middle > ul::before{width:69.4%;}
    .organ .bottom > ul{gap:10px 2rem;}

    .partner{grid-template-columns: repeat(2,1fr); gap:20px;}

    .requirement .img{display:none;}

    .sub_backup ul{width:100%; gap:2.4rem;}

}
@media screen and (max-width:1024px){
    .greeting{flex-wrap:wrap; padding-top:2rem;}
    .greeting .img{display:none;}
    .greeting .img img{width:auto; margin:0 auto;}
    .greeting .text{flex:none; width:100%;}
    .greeting .text > p{font-size:16px;}

    .business .middle{margin-top:48px;}
    .business .middle .text{position:static; transform: translateX(0);}

    .organ .middle > ul{gap:2rem;}
    .organ .middle > ul::before{width:68%;}
    .organ .bottom > ul{flex-wrap:wrap;}
    .organ .bottom > ul > li{flex:1 1 100%; padding-top:0;}
    .organ .item2{margin-top:3rem; padding:0;}
    .organ .item2 > ul{position:relative; right:auto; width:100%;}
    .organ .item2 > ul > li:nth-child(2):before{height:6rem;}
    .organ .item2 > ul > li:last-child:before{height:3rem;}

    .location_wrap #map{height:38rem;}
    .location_wrap .info h3{font-size:24px;}
    .traffic{flex-direction: column; gap: 4rem; padding:2.4rem;}
    .traffic .right h4{font-size:16px;}
    .traffic .right ul > li{padding:2rem 0;}
    .traffic .right ul > li em{font-size:14px;}
    .traffic .right ul > li:first-child{padding-top:10px;}

    .subject > ul > li > strong{width:20rem;}

    .sub_backup{padding:60px 0 100px;}
}
@media screen and (max-width:820px){
    .organ{padding-top:0;}
    .organ .top::before{height:4rem;}
    .organ .middle > ul{flex-direction: column; gap:0;}
    .organ .middle > ul::before{display:none;}
    .organ .middle > ul > li{max-width:100%; padding-top:10px;}
    .organ .middle > ul > li::before{display:none;}
    .organ .middle > ul > li:nth-child(2){order:1;}
    .organ .bottom{margin-top:3rem;}
    .organ .bottom > strong{width:100%;}

    .subject > ul > li{flex-direction: column; gap:2.4rem;}
    .subject > ul > li > strong{width:100%;}
    .subject > ul > li [data-list]{gap:0.8rem; width:100%; font-size:15px;}
    .subject .training{padding:2.4rem; background-position:right 2.4rem center; background-size:7rem;}

    .main_backup{grid-template-columns: repeat(1, 1fr);}
    .main_backup > li{display:flex; align-items: flex-start; gap:16px;}
    .main_backup > li .thumb{width:240px; padding-top: 15.266%;}
    .main_backup > li .text{flex:1; padding:0;}
}
@media screen and (max-width:768px){
    .greeting .text > h3{font-size:22px;}
    .greeting .text > h3 p{font-size:18px;}
    
    .business .middle .text{margin-bottom:26px; font-size:24px;}
    .business .top strong{font-size:24px;}
    .business .top p{font-size:16px;}
    .business .middle [class*="item"]{grid-template-columns: repeat(1, 1fr);}
    .business .middle img.mo{width:100vw;}
    .business .middle [class*="item"] > li strong{font-size:22px;}
    .business .middle [data-list="dot"]{font-size:15px;}

    .organ .item2 > ul{flex-direction: column; padding-top:0;}
    .organ .item2 > ul::before{top:auto; bottom:100%; width:1px; height:3rem;}
    .organ .item2 > ul > li::before{display:none;}

    .partner{grid-template-columns: repeat(1,1fr); gap:16px;}
    .partner > li .text strong{font-size:16px;}

    .subject > ul > li [data-list]{grid-template-columns: repeat(2, 1fr);}

    .requirement .list > li p{font-size:15px;}
    .requirement [data-list]{font-size:14px;}

    .main_backup > li .thumb{width:150px; height:115px; padding-top:0;}
    .main_backup > li .text strong{font-size:17px;}
    .main_backup > li .text p{margin-top:4px; font-size:15px;}
    .sub_backup{margin-top:50px; padding:47px 0 58px;}
    .sub_backup ul{grid-template-columns: repeat(1, 1fr); gap:10px;}
    .sub_backup ul > li{padding:20px; border-radius: 8px;}
    .sub_backup ul > li img{right:20px; max-width:60px;}
}
@media screen and (max-width:414px){
    .partner > li .img img{width:120%; max-width:120%; margin-left:-10%;}

    .subject > ul > li [data-list]{grid-template-columns: repeat(1, 1fr);}
    .subject .training{background-image:none;}
}
@media screen and (max-width:340px){
    .main_backup > li .thumb{width:100%; height:auto; padding-top:50%;}
    .main_backup > li{flex-direction: column;}
    .sub_backup ul > li img{max-width:50px;}
}