@charset "utf-8";


/* 공통영역 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* 이미지박스 */
.imgbox {position:relative; width:100%; text-align:center; padding:3rem; border-radius:1rem; border:1px solid #ddd; background:var(--white); overflow:hidden;}
.imgbox.nobox {padding:0; border:none;} /* 박스가 필요없는 경우 */
.imgbox div {position:relative;}
.imgbox div ~ div {margin-top:6rem;}

.imgbox .expand {display:none;} /* 이미지확대-모바일용 */

@media screen and (max-width: 769px){
	.imgbox {padding:1.5rem;}
	.imgbox div ~ div {margin-top:3rem;}
	.imgbox img {width:100% !important;}
	
	.imgbox .expand {position:absolute; left:1rem; top:1rem; width:4rem; height:4rem; display:flex; justify-content:center; align-items:center; text-align:center; border-radius:1rem; background:rgba(34,63,99,0.2); cursor:pointer;}
	.imgbox .expand:hover {background:rgba(34,63,99,0.6);}
	.imgbox .expand i {font-size:1.4rem; color:var(--white);}
}

/* 소개박스 */
.intro_box {display:flex; flex-direction:column; gap:2rem; padding:4rem 5rem; border-radius:1rem; border:1px solid #ddd; background:var(--white); box-shadow:3px 3px 0 3px rgba(0,0,0,0.1);}
.intro_box h4 {font-family:var(--fontPre); font-size:2.4rem; line-height:1.6; font-weight:500; color:var(--fontcolor1);}
.intro_box h4 strong {color:var(--fourthcolor);}
.intro_box h4 b {font-size:2.8rem; color:var(--fourthcolor);}
.intro_box div p {font-size:1.6rem; word-break:keep-all;}
.intro_box div p ~ p {margin-top:8px;}


/* 대학일자리플러스센터 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* 소개 */
.career_work_list {display:grid; grid-template-columns:repeat(2, 1fr); gap:6rem; margin-top:7rem;}
.career_work_list li {position:relative; display:flex; justify-content:center; align-items:center; text-align:center; word-break:keep-all; padding:2rem; margin-left:2rem; border-radius:50em; border:2px solid #90c9e9; background:#e6f6ff;}
.career_work_list li span {
	position:absolute; left:-2rem; top:-4rem; width:8rem; height:8rem; display:flex; justify-content:center; align-items:center; 
	text-align:center; border:3px solid var(--fourthcolor); border-radius:50%; background:var(--white);
}
.career_work_list li span img {height:4.5rem;}
.career_work_list li div {font-size:1.6rem; font-weight:bold; color:var(--fontcolor1);}

@media screen and (max-width :1200px){
}
@media screen and (max-width :1025px){
	.career_work_list {grid-template-columns:1fr;}
}
@media screen and (max-width: 769px){
}
@media screen and (max-width: 481px){
	.career_work_list li {padding:2rem 5rem;}
}

/* 대학일자리플러스센터 로드맵 */
.career_roadmap p {font-size:1.6rem; word-break:keep-all; margin-bottom:2rem;}

.roadmap_order {display:grid; grid-template-columns:repeat(4, 1fr); gap:5rem 2rem; margin-top:6rem;}
.roadmap_order * {word-break:keep-all;}
.roadmap_order > div {position:relative; display:flex; flex-direction:column; gap:2rem; padding:4rem 2rem 2.5rem; border-radius:1rem; background:#e6edfa;}
.roadmap_order > div span {
	position:absolute; top:-2.5rem; left:50%; width:5rem; height:5rem; transform:translate(-50%);
	display:flex; justify-content:center; align-items:center; font-family:var(--fontPre); font-size:2rem; font-weight:900; 
	color:var(--fourthcolor); text-align:center; border-radius:50%; border:3px solid #9cbbe0; background:var(--white);
}
.roadmap_order > div h4 {display:flex; justify-content:center; align-items:center; font-size:1.6rem; font-weight:500; color:var(--fourthcolor); text-align:center; padding:1rem; border-radius:6px; background:var(--white);}
.roadmap_order > div ul {padding:0 1rem;}
.roadmap_order > div ul li {position:relative; font-size:1.5rem; color:var(--fontcolor2); padding:4px 0 4px 16px;}
.roadmap_order > div ul li::after {content:""; display:block; position:absolute; left:0; top:16px; width:3px; height:3px; border-radius:50%; background:var(--fourthcolor);}

@media screen and (max-width :1380px){
	.roadmap_order {grid-template-columns:repeat(2, 1fr);}
}
@media screen and (max-width :1200px){
}
@media screen and (max-width :1025px){
}
@media screen and (max-width: 769px){
	.roadmap_order {grid-template-columns:1fr;}
}
@media screen and (max-width: 481px){
}

/* 위치 및 이용안내 */
.center_location {width:100%; overflow:hidden;}
.center_location .root_daum_roughmap {width:100% !important; height:450px !important; border-bottom:1px solid #ddd;}
.center_location .root_daum_roughmap .cont {display:none;}
.center_location .wrap_map {width:100% !important; height:450px !important;}

.location_info {display:grid; grid-template-columns:repeat(2, 1fr); gap:3rem 4rem; padding:4rem; margin-top:3rem; border-radius:5px; border:1px solid var(--fifthcolor); background:var(--white);}
.location_info * {word-break:keep-all;}
.location_info dl {display:flex; flex-direction:column; gap:1.5rem;}
.location_info dl.info {grid-column:span 2;}
.location_info dl dt {font-size:1.8rem; font-weight:bold; color:var(--fontcolor1);}
.location_info dl dd {font-size:1.6rem;}
.location_info dl dd p ~ p {margin-top:5px;}

@media screen and (max-width :1200px){
}
@media screen and (max-width :1025px){
	.location_info {grid-template-columns:1fr;}
	.location_info dl.info {grid-column:span 1;}
}
@media screen and (max-width: 769px){
}
@media screen and (max-width: 481px){
}


/* 재학생 맞춤형 고용서비스 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* 빌드업-점프업 */
.build_jump {display:flex; flex-direction:column; gap:4rem;}
.build_jump * {word-break:keep-all;}
.build_jump > div div {display:flex; flex-wrap:wrap; align-items:center; gap:2rem;}
.build_jump > div div strong {display:flex; justify-content:center; align-items:center; font-size:1.8rem; color:var(--white); padding:1rem 2rem; margin-left:1rem; border-radius:1rem 1rem 0 0;}
.build_jump > div div span {font-size:1.8rem; font-weight:500;}
.build_jump > div ul {padding:2rem; border-radius:5px; border:3px solid;}
.build_jump > div ul li {position:relative; font-size:1.6rem; color:var(--fontcolor2); padding:4px 0 4px 16px;}
.build_jump > div ul li::after {content:""; display:block; position:absolute; left:0; top:16px; width:3px; height:3px; border-radius:50%; background:var(--fourthcolor);}

.build_jump > div.build_up div strong {background:#0080cb;} /* 빌드업 */
.build_jump > div.build_up div span {color:#0080cb;}
.build_jump > div.build_up ul {border-color:#b7d8eb; background:#e6f6ff;}

.build_jump > div.jump_up div strong {background:#0063b4;} /* 점프업 */
.build_jump > div.jump_up div span {color:#0063b4;}
.build_jump > div.jump_up ul {border-color:#b6d2ea; background:#edf1f9;}

@media screen and (max-width :1200px){
}
@media screen and (max-width :1025px){
}
@media screen and (max-width: 769px){
	.build_jump > div div {flex-direction:column-reverse;}
}
@media screen and (max-width: 481px){
}

/* 유형 */
.work_project_type {display:grid; grid-template-columns:repeat(2, 1fr); gap:3rem; padding:3rem 0 0; overflow:hidden;}
.work_project_type * {word-break:keep-all;}
.work_project_type > div {position:relative; padding:3rem; margin-top:2rem; border-radius:1rem; border:2px solid #ddd; background:var(--white);}
.work_project_type > div h3 {
	position:absolute; top:0; left:50%; z-index:1; display:inline-flex; justify-content:center; align-items:center; 
    width:max-content; font-size:1.8rem; font-weight:500; padding:1rem 3rem; border-radius:50em; border:3px solid; transform:translate(-50%, -50%);
}
.work_project_type > div p {display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px; font-family:var(--fontPre); font-size:2.4rem; color:var(--fontcolor1); text-align:center; padding:6rem 3rem;}
.work_project_type > div p strong {color:var(--red);}
.work_project_type > div div {display:flex; flex-wrap:wrap; align-items:center; gap:1rem 2rem; padding-top:3rem; border-top:1px dashed #aaa;}
.work_project_type > div div span {font-size:1.6rem;}

.work_project_type > div.lead h3 {color:#0080cb; border-color:#65aad3; background:#e6f6ff;} /* 자기주도형 */
.work_project_type > div.service h3 {color:#3772b6; border-color:#6c9bd2; background:#edf1f9;} /* 서비스참여형 */

@media screen and (max-width :1200px){
}
@media screen and (max-width :1025px){
}
@media screen and (max-width: 769px){
	.work_project_type {grid-template-columns:1fr;}
}
@media screen and (max-width: 481px){
}


/* 지역청년 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* 지역청년 상담>상담신청>신청안내 */
.consult_local_youth {display:flex; flex-direction:column; gap:3rem;}

.consult_local_intro {width:100%; height:50rem; display:grid; grid-template-columns:2fr 1fr; padding:4rem 4rem 4rem 8rem; background:var(--bgblue);}
.consult_local_intro * {word-break:keep-all;}
.consult_local_intro .consult_bg {background:url('../images/content/consult_local_youth_bg.jpg') bottom center no-repeat; background-size:cover;}
.consult_local_intro .consult_text {display:flex; flex-direction:column; justify-content:center;}
.consult_local_intro .consult_text > * {color:var(--fontcolor1); padding-right:4rem;}
.consult_local_intro .consult_text h3 {font-size:4rem; letter-spacing:-0.02em; font-weight:500;}
.consult_local_intro .consult_text h3 b {color:var(--fifthcolor);}
.consult_local_intro .consult_text p {font-size:1.8rem; margin-top:2rem;}
.consult_local_intro .consult_text ul {padding-top:2.5rem; margin-top:2.5rem; border-top:1px dashed #aaa;}
.consult_local_intro .consult_text ul li {position:relative; font-size:1.6rem; color:var(--fontcolor2); padding:4px 0 4px 16px;}
.consult_local_intro .consult_text ul li::after {content:""; display:block; position:absolute; left:0; top:16px; width:3px; height:3px; border-radius:50%; background:var(--fourthcolor);}

@media screen and (max-width :1200px){
}
@media screen and (max-width :1025px){
	.consult_local_intro {height:auto; grid-template-columns:1fr; grid-template-rows:1fr 30rem; gap:4rem; padding:5rem 4rem 4rem;}
	.consult_local_intro .consult_text h3 {font-size:3.2rem;}
	.consult_local_intro .consult_text p {font-size:1.6rem;}
}
@media screen and (max-width: 769px){
}
@media screen and (max-width: 512px){
}


/* 커뮤니티 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* 연계사이트 */
.connect_site {display:grid; grid-template-columns:repeat(4, 1fr); gap:2rem;}
.connect_site a {display:flex; flex-direction:column; border-radius:5px; border:2px solid #ddd; background:var(--white);}
.connect_site a b {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:1rem; font-size:1.5rem; font-weight:500; color:var(--fontcolor1); padding:1rem 1.5rem;}
.connect_site a b i {font-size:1.6rem; color:var(--gray); opacity:0.5;}
.connect_site a span {display:flex; justify-content:center; align-items:center; text-align:center; padding:1rem 1.5rem; border-top:2px dotted #ddd;}
.connect_site a span img {height:7rem;}
.connect_site a:hover {border-color:var(--fourthcolor); box-shadow:0 0 10px rgba(0,0,0,0.1);}
.connect_site a:hover span {border-top-color:var(--fourthcolor);}
.connect_site a:hover b i {color:var(--fifthcolor); opacity:0.8;}

@media screen and (max-width :1340px){
	.connect_site {grid-template-columns:repeat(3, 1fr);}
}
@media screen and (max-width :1200px){
}
@media screen and (max-width :1025px){
}
@media screen and (max-width: 769px){
	.connect_site {grid-template-columns:repeat(2, 1fr);}
}
@media screen and (max-width: 512px){
	.connect_site {grid-template-columns:1fr;}
}