/* ========================================================
 * 기관안내
======================================================== */

/* ******************  기관안내 :: 인사말 ********************** */
.overview-top-con {display:flex; align-items:center; justify-content:center; height:720px; background:url("../../images/sub/about_summaryBg.jpg") no-repeat 25% center / auto 100%; text-align:center; background-attachment:fixed;}
.overview-top-con .txt-box {font-size:45px; line-height:1.55;color: #fff; }
.overview-top-con .txt-box span {display:block; font-size:20px; font-weight:500;}
.overview-top-con .txt-box .tit {display:block; margin-top:40px; letter-spacing:-0.06em; font-weight:700; }
.overview-bottom-con {text-align:center; margin-top:154px;}
.overview-bottom-con .txt01 {font-size:45px; letter-spacing:-0.075em; line-height:1.44; color: #000;}
.overview-bottom-con .txt02 {font-size:18px; letter-spacing:-0.065em; line-height: 1.83; color: #555; margin-top:39px}
.overview-bottom-con .txt02:last-child {margin-top:34px;}
.overview-bottom-con .tit {font-family: "Paperlogy-8ExtraBold", "Noto Sans KR", sans-serif; font-size:200px; letter-spacing:-0.025em; white-space:nowrap; color: rgba(0,0,0,0.1); display:block; margin-top:75px;}


/* ******************  기관안내 :: 기관소개 ********************** */
.corporate-cont .conts-wrap {
	width: 100%;
	display: flex;
	flex-direction: row-reverse;
	margin-top: 40px;
}

.corporate-cont .cont-top{
    padding-bottom: 100px;
}

.corporate-cont .cont-top .tit{
    font-size: 36px;
    font-weight: bold;
    padding-bottom: 10px;
	border-bottom: 1px solid #555;
}

.corporate-cont .conts-wrap .img-box {
	width: 42%;
    flex-shrink: 0;
}

.corporate-cont .conts-wrap .img-box img {
	display: block;
	width: 100%;
    height: 100%;
	margin: 0 auto;
    object-fit: cover;
}

.corporate-cont .conts-wrap .conts-box {
	width: 58%;
	/*padding-right: 50px;*/
	margin: 0 auto;
	font-size: 20px;
	line-height: 1.6;
}

.corporate-cont .conts-wrap .conts-box .tableBox .img{
    margin-bottom: 30px;
}

.corporate-cont table {  /* margin-bottom: 70px; */margin-bottom: 30px; width: 100%; border-top:2px solid var(--mainColor); text-align: center; color:#555;  }
.corporate-cont table tr { border-bottom: 1px solid #dddddd; }
.corporate-cont table th { width: 20%; padding: 23px; font-size: 20px; }
.corporate-cont table td { width: 80%; padding: 23px; text-align: left; font-size: 20px; font-weight: 300;}
.corporate-cont table .fw-b {font-weight: bold;}

.corporate-cont .page-btn {text-align: center;}
.corporate-cont .page-btn a{display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 10px 24px; border: 1px solid var(--mainColor);  position: relative;}
.corporate-cont .page-btn a span {color: var(--mainColor); font-weight: bold;  transition: all 0.5s;}
.corporate-cont .page-btn a i {font-size: 13px; transition: all 0.5s;}

.corporate-cont .page-btn a:hover {background-color: var(--mainColor);}
.corporate-cont .page-btn a:hover span{ color: #fff;}
.corporate-cont .page-btn a:hover i{transform: rotate(180deg); color: #fff;}

.corporate-cont .chart {
    margin-top: 40px;
}

.corporate-cont .chart .chart-box  img{
    max-width: 100%;
    width: 75%;
    /* height: 100%; */
    display: block;
    margin: 0 auto;
}

.corporate-cont .chart .chart-box .txtBox{
    margin: 30px auto ;
}

.corporate-cont .chart .chart-box .txtBox h2 {
    margin-bottom: 10px;
    font-weight: bold;
    font-size: 20px;
}

.corporate-cont .chart .chart-box .txtBox h2.blue{
    color: #004fa4;
}

.corporate-cont .chart .chart-box .txtBox h2.green{
    color: #67bd4a;
}
.corporate-cont .chart .chart-box .txtBox p {display: flex; align-items: center;gap: 3px;}

.corporate-cont .chart .chart-box .txtBox p + p{ margin-top: 5px;}

.corporate-cont .chart .chart-box .txtBox p .num {width: 15px;}

/* ******************  기관안내 :: 기관 미션&비전 ********************** */

.vision .valueBox{/* background:url('../../images/sub/vision_bg.jpg') no-repeat center bottom / cover;  padding:120px 0; */margin:100px 0 0; /* background-color: #f5f5f5; */   }
.vision .title-h3 {
    font-size: 30px;
    font-weight: 700;
    text-align: center;
}

.vision .mission{margin:0 0 80px;}
.vision .mission > li {   padding: 30px ;   display: flex;    justify-content: center;   align-items: center; flex-direction: column;    gap:12px 30px; /* border: 1px solid rgba(255, 255, 255, 0.15);background: rgba(255, 255, 255, 0.05); */ border: 1px solid #ccc; background: #f5f5f5;  -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);  border-radius: 50px; text-align: center;	margin:20px 0;    font-size: 20px; }
.vision .mission > li > span { font-weight: 700;color: var(--mainColor); font-size: 1.2em;}
.vision .mission > li > p { text-align: center; font-weight: 600;}
.vision .value{display: flex; justify-content: center; gap: 30px; margin:40px 0;}
.vision .value li{/*padding:80px 20px;*/ width:100%; /*color: #fff;  border: 1px solid rgba(68, 132, 26, 0.15);background: rgba(68, 132, 26, 1); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);  border-radius: 20px;*/  }
.vision .value li p {font-size: 20px; text-align: center;}


.vision .value li strong{
	display:block; 
    margin: 0 auto 40px;
    padding: 20px 20px;
    max-width: 140px;
	/* font-size: 1.4em; */ 
	font-size: 36px; 
	margin-bottom: 20px; 
	line-height: 1.4; 
    color: #fff;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border-radius: 20px;
    border: 1px solid rgba(68, 132, 26, 0.15);
    background: var(--mainColor);
}

.vision .value li:nth-child(2) strong{
    background: var(--themeColor1);
}

.vision .value li:nth-child(3) strong{
    background: var(--themeColor2);
}

.vision .value li:nth-child(4) strong{
    background: var(--themeColor3);
}

/* 미션&비전 변경 */
.vision .tit{
    font-size: 36px;
    font-weight: bold;
    padding-bottom: 10px;
	border-bottom: 1px solid #555;
}

.vision .mission-vision {
    display: flex;
    flex-wrap: wrap;
    margin-top: 40px;
    list-style: none;
    justify-content: space-around;
    justify-content: center;
    gap: 30px;
}

.vision .mission-vision li {
    width: 40%;
    max-width: 480px;
    aspect-ratio: 1/1;
    text-align: center;
    padding: 20px;
    border-radius: 100%;
    border: 3px dotted #336114;
    display: flex;
    justify-content: center;
    align-items: center;
}

.vision .mission-vision li:nth-child(even) {border: 3px dotted #def1db;}

.vision .mission-vision li div {
    width: 100%;
    aspect-ratio: 1/1;
    display: flex;
   /*  vertical-align: middle; */
    background: #3b9649;
    border-radius: 100%;
    padding: 0;
    margin: 0;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #fff;
}

.vision .mission-vision li:nth-child(even) div {background: #edfbe1; color: var(--mainColor);}

.vision .mission-vision li div img {
    margin-bottom: 20px;
    width: 70px;
}

.vision .mission-vision li div h3 {
    font-size: 56px;
    font-weight: bold;
    margin-bottom: 15px;
}

.vision .mission-vision li div p {
    font-size: 24px;
    font-weight: 400;
}


.vision .explanBox .conts-box {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin-top: 80px;
	gap: 2%;
}
.vision .explanBox .conts-box:nth-child(1) {
	/*margin-top: 0;*/
}
.vision .explanBox .conts-box:nth-child(even) {
	/*flex-direction: row-reverse;*/
}
.vision .explanBox .conts-box > * {
	width: 49%;
}
.vision .explanBox .conts-box .img-box {
	padding: 0 22px 0 0;
	display: flex;
}
.vision .explanBox .conts-box:nth-child(even) .img-box {
	padding: 0 0 0 22px;
}
.vision .explanBox .conts-box .img-box .txt {
	display: block;
	position: relative;
	font-size: bold;
	font-weight: 600;
	color: #EBEBEB;
	writing-mode: vertical-rl;
	margin: 0 10px 0 0;
}
.vision .explanBox .conts-box:nth-child(even) .img-box {
	flex-direction: row-reverse;
}
.vision .explanBox .conts-box:nth-child(even) .img-box .txt {
	margin: 0 0 0 10px;
}
.vision .explanBox .conts-box .img-box .img img {
	display: block;
	max-width: 100%;
}
.vision .explanBox .conts-box .txt-box {
	/*padding: 0 80px;*/
	padding: 60px 40px 60px 60px;
    background: #fbfbfb;
	border-top: 2px solid #3b9649;
}
.vision .explanBox .conts-box .txt-box > * {
	display: block;
}
.vision .explanBox .conts-box .txt-box span {
	font-size: 24px;
	font-weight: 700;
	color: var(--mainColor);
}
.vision .explanBox .conts-box .txt-box em {
	font-size: 32px;
	font-weight: 700;
	margin: 10px 0 24px 0;
}

.vision .explanBox .conts-box .txt-box .conts ul li{
    font-size: 20px;
    display: flex;
    gap: 5px;
}

.vision .explanBox .conts-box .txt-box .conts ul li + li {
    margin-top: 10px;
}

/* ******************  기관안내 :: 기관 미션&비전 ********************** */


/* ******************  기관안내 :: 기관 연혁 ********************** */

/* history */
.history-cont {
	position: relative;
	/*padding-top: 174px;*/
}
.history-cont .flex-cont{display: flex;justify-content: space-between;flex-wrap: wrap;margin:80px 0;}
.history-cont .title-h2{font-size:70px; position:sticky; top:80px; font-weight: bold;}
.history-cont .title-h2 p{ font-size: 20px;     font-weight: 500;}
.history-cont .cont{margin-top: 0;}
.history-cont .cont ul li{padding:10px 0; position:relative; padding-left:120px;}
.history-cont .cont ul li + li{ border-top:1px solid #ddd;}
.history-cont .cont ul li strong{font-size:21px; position:absolute; left:0; top:28px;}
.history-cont .cont ul li p{position:relative; padding-left:48px;}
/*.history-cont .cont ul li p:before{content:''; width:4px; height:4px; background: #aaa; position:absolute; left:0; top:10px; border-radius:50%;}*/
.history-cont .image{width:100%; height:480px;max-width:100%; margin:0 auto; position:relative;  opacity:1 !important;}
.history-cont .image:before{content:''; width:calc(50% - 720px); height:100%; background:#fff; position:absolute; left:0; top:0; z-index:1;  transition: all ease .6s;  }
.history-cont .image:after{content:''; width:calc(50% - 720px); height:100%; background:#fff; position:absolute; right:0; top:0; z-index:1;  transition: all ease .6s;  }
.history-cont .image img{ position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover;}
.history-cont .image.animated:before{width:0;}
.history-cont .image.animated:after{width:0;}



@media (min-width: 801px) {
	
    /*.history-cont:before {
        content: "";
        width: 2px;
        height: 40px;
        background-color: #000;
        position: absolute;
        top: 0;
        left: 50%;
        margin-left: -1px;
        opacity: 0;
        transform: translateY(10%);
        transition: all 1s ease-in;
    }*/

    .animated.history-cont:before {
        opacity: 1;
        transform: none;
    }
}

/* 연혁 변경 */
.history-cont .tit{
    font-size: 36px;
    font-weight: bold;
    padding-bottom: 10px;
	border-bottom: 1px solid #555;
}

.tab-list { position: relative; margin-top: 40px; margin-bottom: 70px; }
.tab-list:after { content: ''; display: block; clear: both; }
.tab-list > li { float: left; margin-left: -1px; background-color: #fff; border: 1px solid #d6d6d6; }
.tab-list > li:first-child { margin-left: 0; }
.tab-list > li a,
.tab-list > li button { display: block;  width: 100%; height: 60px; text-align: center; color: #999999; /*font-size: 17px;*/font-size: 32px; letter-spacing: -0.05em; font-weight: 300; }
.tab-list > li.on { position: relative; margin-top: 0; border-top: 1px solid #3b9649; border-color: #3b9649; }

.tab-block > li.on a,
.tab-block > li.on button { background: #3b9649; color: #fff; font-weight: 500; }

.tab2 > li { width: 50%; }
.tab3 > li { width: 33.33333%; }
.tab4 > li { width: 25%; }
.tab5 > li { width: 20%; }
.tab6 > li { width: 16.66666%; }
.tab7 > li { width: 14.285%; }
.tab8 > li { width: 12.5%; }
.tab6:before { width: calc(100% - 5px); }
.tab-contents { position: relative; }
.tab-contents > li { display: none; position: absolute; top: 0; left: 0;}
.tab-contents > li.on { display: block; height:auto; position:relative; }

.tab-list--sticky{
    z-index: 100001;
    position: fixed; top: 0; left: 0; width: 100%;
    -webkit-transition: all ease-out .3s; transition: all ease-out .3s;
}

@media (max-width:1024px) {
    .tab-list:before { content: none; }
    .tab-list { margin-bottom: 35px; }
    .tab-list > li { margin-bottom: -1px; width: 50%; height: 50px; }
    .tab-list > li:first-child { margin-left: -1px; }
    .tab-list > li a, .tab-list > li button { height: 50px; line-height: 50px; font-size: 13px; }
}


/* ******************  기관안내 :: 기관 연혁 ********************** */


/* ******************  기관안내 :: 조직도 ********************** */
.org-cont .tit{
    font-size: 36px;
    font-weight: bold;
    padding-bottom: 10px;
	border-bottom: 1px solid #555;
}
.org-cont .img img{
    display: block;
    margin: 0 auto;
}

/* ******************  기관안내 :: 조직도 ********************** */


/* ******************  기관안내 :: 오시는 길 ********************** */

	.location_cont{}
	.location_cont .title{ font-size: 60px; font-weight: 300; line-height: 130%; letter-spacing: -1.6px; color: #000;}
	.location_cont .title .pointColor {color: var(--mainColor);}
    .location_cont .addr .addr_tit{font-size: 40px; font-weight: bold;}
	.location_in{position: relative; box-sizing:border-box; margin: 35px 0 45px; padding: 0 230px 0 0;}
	.location_in .location_info{display: flex; flex-wrap:wrap;}
	.location_in .location_info dt{width: 100%; line-height: 150%; color:rgba(0,0,0,.8); padding:0 0 0 30px; box-sizing:border-box; position:relative; margin: 0 0 8px; font-size: 22px;}
	.location_in .location_info dt:before{content:'\e0c8'; display:block; width:26px; height:26px; font-size:26px; line-height: 26px; position:absolute; top:2px; left:0; font-family:"Material Symbols Outlined"; color:#000;}
	.location_in .location_info dd{padding:0 25px 0 0;}
	.location_in .location_info dd .fs18{/*color:var(--subColor);*/font-size: 22px;}
	.location_in .location_info dd .fs18 b{display: inline-block; vertical-align: middle; margin:-2px 5px 0 0; /*font-size:8px;*/font-size:18px; color:#000;}
	.location_in .location_btn{position: absolute; right:0; bottom:0; display: flex;}
	.location_in .location_btn li{margin:0 4px 0 0;}
	.location_in .location_btn li:last-child{margin:0;}
	.location_in .location_btn li a{display:block; width:62px; height:62px; transition:all .3s linear; font-size:0;}
	.location_in .location_btn li.naver a{background:#10D265 url('../../images/common/naver.png') no-repeat center/100% auto;}
	.location_in .location_btn li.naver a:hover{background-color:#00C858;}
	.location_in .location_btn li.kakao a{background:#FEDD0D url('../../images/common/kakao.png') no-repeat center/100% auto;}
	.location_in .location_btn li.kakao a:hover{background-color:#FFD600;}
	.location_in .location_btn li.print a{background:var(--mainColor) url('../../images/common/print.png') no-repeat center/100% auto;}
	.location_in .location_btn li.print a:hover{background-color:var(--subColor);}
	.location_map{box-sizing:border-box; border:1px solid rgba(0, 0, 0, .13); position: relative; }
	.location_map .wrap_controllers{display:none !important;}
	.location_map .map_border{display:none !important;}
	.location_map .wrap_map{height: 550px !important; overflow: hidden;}

	.location_map  .block {
		z-index: 5;
		display: flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		top: 0;
		left: 0;
		padding: 24px;
		width: 100%;
		height: 100%;
		font-size: 28px;
		font-weight: 400;
		color: #fff;
		font-weight: bold;
		background: rgba(0, 0, 0, 0.5);
		opacity: 0;
		visibility: hidden;
		transition: all ease .35s;
	}

	
.location_cont .info-inner-con {
    display: flex;
    padding: 65px 0;
    border-top: 1px solid #eee;
}

.location_cont .info-inner-con:first-of-type {
    border-top: 0;
}

.location_cont .map-info-con {
    margin-top: 35px;
}

.location_cont .map-info-con .m-info-title{
    margin-bottom: 30px;
}

.location_cont .map-info-con .m-info-title h2 {
    font-size: 32px;
    font-weight: bold;
}

.location_cont .map-info-tit {
    width: 270px;
    font-size: 30px;
    letter-spacing: -0.065em;
    color: #000;
    font-weight: 600;
}

.location_cont .map-info-tbl {
    flex: 1;
}

.location_cont .map-info-tbl > li {
    display: flex;
    align-items: center;
    margin-top: 20px;
}

.location_cont .map-info-tbl li:first-of-type {
    margin-top: 0;
}

.location_cont .map-info-tbl > li > span {
    width: 135px;
    font-size: 19px;
    letter-spacing: -0.025em;
    color: #000;
    line-height: 1.7em;
    font-weight: 600;
}

.location_cont .map-info-tbl li .txt {
    width: calc(100% - 135px);
    font-size: 16px;
    color: #000;
    letter-spacing: -0.05em;
    line-height: 1.7;
}

.location_cont .route-list {
    /* width: calc(100% - 135px); */
}


.location_cont .route-list li {
    font-size: 22px;
    letter-spacing: -0.05em;
    line-height: 1.12;
    color: #000;
    margin-top: 16px;
}

.location_cont .route-list li:first-child {
    margin-top: 0;
}

.location_cont .route-list li .color {
    color: var(--mainColor);
    font-weight: bold;
}


.location_cont .route-list li span {
    margin-right: 14px;
    font-weight: 500;
}

.location_cont .route-list .line8 span {
    color: var(--mainColor);
}

.location_cont .route-list .line7 span {
    color: #747F00;
}

.location_cont .route-list .line3 span {
    color: #ed751a;
}

.location_cont .route-list .line5 span {
    color: #996CAC;
}

.location_cont .route-list .line2 span {
    color: #00A84D;
}

.location_cont .route-list .line1 span {
    color: #0052A4;
}

.location_cont .info-inner-con:last-child .map-info-tbl > li {
    margin-top: 35px;
}

.location_cont .info-inner-con:last-child .map-info-tbl > li:first-child {
    margin-top: 0;
}

.location_cont #tabConM01 .info-inner-con:last-child .map-info-tbl > li:last-child > span {
    align-self: center;
}

.location_cont .info-inner-con:last-child .map-info-tbl > li > span {
    align-self: flex-start;
}

.location_cont .navi {
    display: flex;
    align-items: center;
    background: #fafafa;
    height: 55px;
    padding: 0 35px 0 26px;
    border: 1px solid #ddd;
    border-radius: 50px;
    box-sizing: border-box;
}

.location_cont .navi > span {
    font-size: 16px;
    letter-spacing: -0.05em;
    color: #b2b2b2;
    line-height: 1.2;
}

.location_cont .navi > span i {
    color: #b2b2b2;
    font-size: 20px;
    margin-right: 5px;
}

.location_cont .navi p {
    font-size: 16px;
    letter-spacing: -0.05em;
    color: #000;
    line-height: 1.2;
    margin-left: 15px;
}


/* ========================================================/
 * 기관안내
 ========================================================*/
.work-cont .work-box {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin-top: 80px;
	gap: 2%;
}
.work-cont .work-box > * {
	width: 50%;
}
.work-cont .work-box .img-box {
	width: 30%;
    position: relative;
}
.work-cont .work-box .img-box .step span {
	font-size: 22px;
    /* color: #555555; */
    padding: 10px;
    background-color: var(--mainColor);
    color: #fff;
    font-weight: bold;
    border-radius: 100%;
}
.work-cont .work-box .img-box .txt {
	display: block;
	/*position: relative;
	font-size: bold;
	font-weight: 600;
	color: #EBEBEB;
	writing-mode: vertical-rl;
	margin: 0 10px 0 0;*/
	font-size: 26px;
	font-weight: bold;
    margin-top: 20px;
    margin-bottom: 10px;
}
.work-cont .work-box .img-box .img img {
	display: block;
	position: relative;
	float: right;
    right: 30px;
    width: 100px;
}
.work-cont .work-box .txt-box {
	width: 68%;
	padding: 40px 40px 60px 60px;
    background: #fbfbfb;
	border-top: 2px solid #3b9649;
}
.work-cont .work-box .txt-box > * {
	display: block;
}
.work-cont .work-box .txt-box span {
	font-size: 24px;
	font-weight: 700;
	color: var(--mainColor);
}
.work-cont .work-box .txt-box em {
	font-size: 20px;
	font-weight: 600;
	margin: 24px 0 10px 0;
}

.work-cont .work-box .txt-box .conts ul li{
    font-size: 18px;
}

.work-cont .work-box .txt-box .conts ul li + li {
    margin-top: 10px;
}


@media (max-width:768px) {
   
}
/*======================================================== */


/* ========================================================
 * 일자리 참여 안내
======================================================== */


/* ******************  일자리 참여 안내 :: 일자리 참여 안내 ********************** */

.dot_list{}
.dot_list > li,
.dot_list > dd{font-size:20px; letter-spacing: -0.54px; line-height:160%; position:relative; box-sizing:border-box; padding:0 0 9px 12px;}
.dot_list > li .btn {font-size: 32px; font-weight: bold;}
.dot_list > li .btn:hover {text-decoration: underline;}
.dot_list > li:last-child,
.dot_list > dd:last-child{padding-bottom:0 !important;}
.dot_list > li:before, 
.dot_list > dd:before{content:''; display:block; width:3px; height:3px; position:absolute; left:0; top:10px; background:rgba(0,0,0,.4);}

.dot_list li .point{font-weight: bold; color: var(--mainColor);}
.dot_list.dot_none > li {padding-left: 0;}
.dot_list.dot_none > li::before {content: none;}
.target_style{display: flex; flex-direction: row-reverse;}
.target_style dt{width: 96px; background:var(--mainColor) url('../../images/common/investment_icon.png') no-repeat center/46px auto;}
.target_style dd{width: calc(100% - 96px); background:#f0f0f0; box-sizing:border-box; padding:35px;}


.process_list{display: grid; grid-template-columns: repeat(3, 1fr); gap:30px;}
.process_list li{box-sizing:border-box; border:1px solid rgba(0, 0, 0, .13); position: relative; padding: 35px 35px 100px 35px; min-height:244px;}
.process_list li:after{content:'\e5c8'; font-family:"Material Symbols Outlined"; display: block; width: 22px; height: 22px; font-size:22px; line-height: 22px; position: absolute; right:-26px; top:50%; margin-top: -11px; color:#000000; opacity: 0.4;}
.process_list li:nth-child(3n):after{display: none;}
.process_list li:last-child:after{display: none !important;}
.process_list li .fs14{padding: 0 0 8px;}
.process_list li .fs16{padding: 2px 0 0;}
.process_list li img{position: absolute; right: 30px; bottom: 20px; width: 80px;}

.process_list .step { }
.process_list .step span{font-size: 18px; /* color: #555555; */ padding: 10px; background-color: var(--mainColor); color: #fff; font-weight: bold; border-radius: 100%;}
.process_list .tit {font-size: 26px; font-weight: bold; margin-top: 20px;}


.stock_list{display: grid; grid-template-columns: repeat(2, 1fr); gap:30px;}
	.stock_list li{box-sizing:border-box; border:1px solid rgba(0, 0, 0, .13); padding:35px 140px 35px 40px; position: relative;}
	.stock_list li h5{padding:0 0 8px; font-weight:bold; color:#000000; line-height:120%; font-size: 22px;}
	.stock_list li p.txt{color:var(--lightFont); font-size: 22px;}
	.stock_list li img{position: absolute; right: 40px; top:50%; margin-top: -30px; height: 60px; width: auto;}


/* ========================================================
 * 일자리 참여 안내
======================================================== */


/* ========================================================
 * 사업단 소개
======================================================== */

/* ******************  사업단 소개 :: 사업단 소개 ********************** */


.list-item-box {
}

.list-item-box .list-itemWrap{
    display: flex;
    align-items: center;
    padding: 100px 0;
    border-top: 2px solid var(--mainColor) ;
    gap: 30px;
}

.list-item-box .list-itemWrap .item{
    width: 50%;
}

.list-item-box .list-itemWrap .item .dot{
    padding-left: 10px;
    position: relative;
}

.list-item-box .list-itemWrap .item .dot::before{
    content: ' ';
    display: block;
    position: absolute;
    width: 3px;
    height: 3px;
    background-color: #444;
    top: 10px;
    left: 0;
}

.list-item-box .list-itemWrap .item .hr {
    margin: 40px 0;
    background-color: #ccc;    
    position: relative; 
    width: 38%;
    height: 1px;
}

.list-item-box .list-itemWrap .item .hr::before{
    content: '';
    width: 9px;
    height: 9px;
    border-width: 2px;
    border-radius: 20px;
    border-style: solid;
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    /* border-color: #e1e1e1; */
    border-color: #ccc;
    background-color: #f8f8f8 ;
}

.list-item-box .list-itemWrap .item .title {
    border-left-style: solid;
    border-left-width: 7px;
    padding-left: 20px;
    line-height: 1.5;
    border-color: var(--mainColor);
}

#service .list-item-box .list-itemWrap .item .title {
    border-color: var(--themeColor1);
}

#workgroup .list-item-box .list-itemWrap .item .title {
    border-color: var(--themeColor2);
}

#job .list-item-box .list-itemWrap .item .title {
    border-color: var(--themeColor3);
}

.list-item-box .list-itemWrap .item .title h2{
    margin-bottom: 10px;
    font-size: 40px;
    font-weight: bold;
}

.list-item-box .list-itemWrap .item .title  p {
    color: #444;
    letter-spacing: -1px;
    font-weight: 300;
    font-size: 20px;
}


.list-item-box .list-itemWrap .item .txt li + li {
    margin-top: 12px;
}

.list-item-box .list-itemWrap .item .txt li{
    font-size: 20px;
    display: flex;
}

.list-item-box .list-itemWrap .item .txt li b{
    color: var(--mainColor);
    width: 100px;
    margin-right: 5px;
    display: inline-block;
    font-size: 22px;
    flex-shrink: 0;
}

.list-item-box .list-itemWrap .item .img-box{
    aspect-ratio: 1/1;
    overflow: hidden;
    border-radius: 20px;
    box-shadow: 0 10px 10px #ddd ;
}

.list-item-box .list-itemWrap .item .img-box img{
    transition: all 1s;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

/* hover */

.list-item-box .list-itemWrap .item .img-box:hover img{
    transform: scale(1.1);
}



.sub-cm-con {display:flex; flex-direction: column; gap: 30px; padding:90px 0; border-top:1px solid rgba(224,224,224,0.5);}
.sub-cm-con .left-box {/* width:31.25%; */ width:100%;}
.sub-cm-con .left-box .cm-tit{line-height:1.3888; color: #333; font-size: 40px; font-weight: bold;}
.sub-cm-con .left-box .cm-txt{line-height:1.3888; color: #333; font-size: 18px; font-weight: 300; margin-top: 14px;}
.sub-cm-con .left-box .cm-en-tit {display:inline-block; font-size:16px; letter-spacing:-0.02em; color: var(--mainColor); font-weight: 600; line-height:1.833em; margin-top: 9px;}
.sub-cm-con .right-box {/* width:68.75%; */ width: 100%;}
.sub-cm-con:first-child,
.sub-cm-con:first-of-type{padding-top:0; border-top:0;}
.sub-cm-con:last-child {padding-bottom:0;}
.sub-cm-con.border-top {border-top:1px solid rgba(224,224,224,0.5); padding-top:90px; } /* 상단에 border 들어갈때  */

.quality-policy-con ul{display: flex; align-items: center; flex-wrap: wrap; gap: 20px;}

.quality-policy-con .quality-policy-item{display:flex; align-items:center; justify-content:space-between; border:1px solid #d6d6d6; padding: 30px 35px 29px 35px; /* margin-top:17px */ width: calc((100% /2) - 10px);}
/* .quality-policy-con .quality-policy-item:first-child{margin-top:0} */
.quality-policy-con .quality-policy-item dl{width:calc(100% - 150px);}
.quality-policy-con .quality-policy-item dt{display:flex; align-items:center; color:#333; font-size:24px; font-weight:600; letter-spacing:-0.075em; margin-bottom:0.7em;}
.quality-policy-con .quality-policy-item dt .num{display:inline-block; color:var(--theme-red-color); font-size:0.6956em; margin-right:14px;}
.quality-policy-con .quality-policy-item dd{color:#000; font-size:18px; font-weight:400; letter-spacing:-0.065em; line-height: 1.94; word-break: keep-all;}
.quality-policy-con .quality-policy-item .icon{position: relative; display:flex; justify-content:center; align-items:center; width:99px; height:98px;     border: 14px solid rgba(34, 51, 89, 0.07); border-radius:50%; }
.quality-policy-con .quality-policy-item .icon:before {display: block; content: ""; position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; border: 1px solid #a9ddfd; transform: translate(-50%, -50%); border-radius: 100%;}
.quality-policy-con .quality-policy-item .icon img{display:block; /* border:1px solid #a9ddfd; */ width:100%; /* border-radius:50%; */ box-sizing:border-box;}
.quality-policy-item .icon-box {display: block; width: 35px; height: 35px;}
.quality-policy-item .icon-box span {display: block; position: relative; width: 100%; height: 0; /* padding-top: 104.35%; */}

/* ========================================================
 * 사업단 소개
======================================================== */


/* ========================================================
 * with 강북시니어
======================================================== */



/* ******************  with 강북시니어 :: 후원안내 ********************** */

.support--01 {
    position: relative;
    padding: 0 0 130px;
  }
  
.support--01 .thumnail {
    position: relative;
    max-width: 1400px;
    width: 72.916%;
    /* aspect-ratio: 2.333 / 1; */
    aspect-ratio: 2.333 / 1.35;
    overflow: hidden;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.support--01 .thumnail img {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.support--01 .text-wrap {
    position: absolute;
    bottom: 0;
    right: 0;
    max-width: 1184px;
    padding: 85px 119px 80px;
    background-color: var(--mainColor);
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    color: #fff;
}

.support--01 .title {
    margin-bottom: 30px;
    font-size: 36px;
    font-weight: 700;
    line-height: 1;
}

.support--01 .text {
    max-width: 785px;
    font-size: 24px;
    line-height: 1.6;
}

.support_list {
    display: flex;
    flex-wrap: wrap;
    margin: 100px 0 0;
    list-style: none;
    justify-content: space-around;
    justify-content: center;
    gap: 30px;
}

.support_list li {
    width: 33.33%;
    max-width: 340px;
    aspect-ratio: 1/1;
    text-align: center;
    padding: 20px;
    border-radius: 20px;
    border: 1px dotted #3b9649;
}

.support_list li div {
    width: 100%;
    max-width: 300px;
    aspect-ratio: 1/1;
    display: flex;
    /*  vertical-align: middle; */
    background: #def1db;
    border-radius: 100%;
    padding: 0;
    margin: 0 auto;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.support_list li div img {
    margin-bottom: 20px;
    width: 70px;
}

.support_list li div h3 {
    font-size: 24px;
    font-weight: bold;
    color: var(--mainColor);
    margin-bottom: 5px;
}

.support_list li p {
	margin-top: 30px;
    font-size: 18px;
    font-weight: bold;
    line-height: 1.6;
}

/* ******************  with 강북시니어 :: 자원봉사안내 ********************** */

.sub_tit_s h2 {
    font-size: 28px;
    color: var(--mainColor);
    font-weight: 700;
    padding: 0 0 2px 25px;
    margin: 0 0 30px;
    line-height: 1.4;
    position: relative;
    letter-spacing: 0px;
}

.sub_tit_s h2:before {
    content: '';
    position: absolute;
    width: 10px;
    height: 33px;
    border-radius: 50px;
    background: var(--mainColor);
    left: 0;
    top: 5px;
}

.vol_list {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    list-style: none;
    justify-content: space-around;
    justify-content: center;
    gap: 30px;
}

.vol_list li {
    width: 33.33%;
    max-width: 340px;
    aspect-ratio: 1/1;
    text-align: center;
    padding: 20px;
    border-radius: 100%;
    border: 3px dotted #def1db;
    display: flex;
    justify-content: center;
    align-items: center;
}

.vol_list li div {
    width: 100%;
    aspect-ratio: 1/1;
    display: flex;
   /*  vertical-align: middle; */
    background: #edfbe1;
    border-radius: 100%;
    padding: 0;
    margin: 0;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.vol_list li div img {
    margin-bottom: 20px;
    width: 70px;
}

.vol_list li div h3 {
    font-size: 24px;
    font-weight: bold;
    color: var(--mainColor);
    margin-bottom: 5px;
}

.vol_list li div p {
    font-size: 18px;
    font-weight: 400;
}


.biz_step_li {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    justify-content: center;
    margin: 0;
}

.biz_step_li li {
    padding: 0;
    margin: 0 50px 30px 0;
    border-radius: 100px;
    font-weight: 500;
    position: relative;
    width: 180px;
    display: inline-block;
    text-align: center;
}

.biz_step_li li div {
    box-shadow: 0 0 0 4px inset var(--mainColor);
    aspect-ratio: 1/1;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    line-height: 1.4;
    border-radius: 100%;
}

.biz_step_li li div img{
    width: 60px;
}

.biz_step_li li div p {
    padding: 5px 0 0;
}

.biz_step_li li div p span {
    font-size: 15px;
}

.biz_step_li li .step_num{
    display: inline-block;
    margin: 5px auto 0;
    padding: 4px 12px 5px;
    background-color: var(--mainColor);
    color: #fff;
    font-weight: bold;
    border-radius: 20px;
    text-transform: uppercase;
}

.biz_step_li li:before {
    content: '';
    position: absolute;
    aspect-ratio: 1/1;
    width: 55px;
    background: url(../../images/sub/vol_list_next.png)no-repeat;
    right: -60px;
    top: 38%;
    background-size: 75%;
}

.biz_step_li li:last-of-type:before {
    display: none;
}

.biz_step_li li font {
    font-size: 15px;
}





/* ========================================================
* with 강북시니어
======================================================== */