@charset "utf-8";

*{
	box-sizing : border-box;
}
body {
	overflow-X : hidden;
}
.font {
	font-family : 'rixstraight-pro', sans-serif;
    font-weight : 300;
    font-style : normal;
}


/******************************  메인 페이지  ******************************/

/*******배너영역******/
#main_banner {
	/* width : 100%;
	min-height : 760px;
	background: url('../images/main_banner01.png') no-repeat center center / contain;
	display : flex;
	justify-content : center;
	align-items : center;
	flex-direction : column; */
	width: 100%;
	min-height: 760px;
	position: relative;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
}

#main_banner .title {
	position: absolute;
	top: 80px;
	left: 50%;
	transform: translateX(-50%);
	text-align: center;
	color: #fff;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
}
#main_banner .title,
.btn_box{
	color : #fff;
	text-align : center;
}

#main_banner .title h2 {
	font-size : 60px;
	margin-bottom : 40px;
	font-weight : bold;
	text-shadow : 5px 5px rgba(0,0,0,0.2);
}

#main_banner .title p {
	font-size : 24px;
	margin-bottom : 66px;
	text-shadow : 3px 3px rgba(0,0,0,0.2);
	line-height : 1.7;
}

.main_banner_slider.pc { 
	display:block; 
}
.main_banner_slider.mob { 
	display:none; 
}

#main_banner .main_banner_slide {
	position : absolute;
	left : 0;
	top : 0;
	width : 100%;
	height : 100%;
	z-index : 0;
	opacity : 0;
}

#main_banner .slide01 {
	background : url('../images/main_banner01.png')  no-repeat center center / cover;
}

#main_banner .slide02 {
	background : url('../images/main_banner02.png')  no-repeat center center / cover;
}

#main_banner .slide01_m {
	background : url('../images/m_main_banner01.png') no-repeat center center / cover;
}

#main_banner .slide02_m {
	background : url('../images/m_main_banner02.png') no-repeat center center / cover;
}

.main_banner_slider.pc .main_banner_slide:first-child,
.main_banner_slider.mob .main_banner_slide:first-child {
	opacity : 1; 
}

 #main_banner .btn_box {
  display: flex;
  flex-direction: row;   
  gap: 20px;            
} 
 .btn_round {
	width : 254px;
	height : 60px;
	display : flex;
	justify-content : space-between;
	align-items: center;
	flex-direction : row;
	padding: 6px 20px;
	background-color: var(--main-color);        
	border-radius: 9999px;
	font-size : 18px;
	transition: all 0.2s ease;
}
.btn_round:hover{
	transform: translateY(-4px);
	background-color : #fff;
	color : var(--main-color);
	font-weight : 700;
} 
.title .word,
.title .char {
	display : inline-block;
	white-space : pre;
	will-change : transform, opacity;
}
.mob_br {
	display : none;
}

@media screen and (max-width:1000px) {
	.main_banner_slider.pc { 
		display:none; 
	}
	.main_banner_slider.mob { 
		display:block; 
	}
	#main_banner {
		min-height : 100vw;
		aspect-ratio : 1 / 1;
		padding : 0;
	}
	#main_banner .title {
		width : 100%;
		top : 10vw;
		background-color : rgba(255, 255, 255, 0.4);
		padding : 20px 10px 0 10px;
	}
	#main_banner .title h2 {
		color : #222222;
		font-size : 7vw;
		margin-bottom : 25px;
		font-weight : bold;	
		text-shadow : none;
	}
	#main_banner .title p {
		color : #444444;
		font-size : 3.6vw;
		margin-bottom : 30px;
		text-shadow : none;
	}
	#main_banner .btn_box {
	  flex-direction: column;   
	  gap: 10px;            
	}
	.btn_round {
		width : 150px;
		height : 40px;
		font-size : 4vw;
	}
	.mob_br {
		display : block;
	}
}
/*******배너영역 끝******/

/*******section01(동행소개)******/
#section01{
	background-color : var(--gray);
	width : 100%;
	height : 540px;
	padding : 80px 300px;
	text-align : center;
}
#section01 .sub_title {
	font-size : 20px;
	font-weight : bold;
	color : #AAAAAA;
	margin-bottom : 10px;
}
#section01 h3{
	font-size : 40px;
	font-weight : bold;
}
.icon_box_pc ul{
	display : flex;
	justify-content : space-around;
	margin-top : 60px;

}
.icon_box_pc ul li {
	transition: all 0.2s ease;
}
.icon_box_pc ul li:hover{
	transform: translateY(-8px);
}
.icon_box_pc ul li h4 {
	font-size : 20px;
	font-weight : bold;
	margin-top : 30px;
	margin-bottom : 13px;
}
.icon_box_pc ul li p {
	font-size : 18px;
	line-height : 1.5;
}
.icon_box_mob {
	display : none;
}

@media screen and (max-width:1000px) {
	#section01{
		background-color : #fff;
		height : auto;
		padding : 30px 0;
		text-align : center;
	}
	#section01 .sub_title {
		font-size : 6vw;
	}
	#section01 h3{
		font-size : 8vw;
	}
	.icon_box_pc {
		display : none;
	}
	.icon_box_mob {
		display : block;
	}
	.icon_box_mob ul{
		min-height : 100vw;
		background-color : var(--gray);
		display : flex;
		flex-wrap : wrap;
		justify-content : space-around;
		margin-top : 30px;
		gap : 10px;
		padding : 20px 0;
		position : relative;
	}
	.icon_box_mob ul li h4 {
		font-size : 4vw;
		font-weight : bold;
		margin : 13px 0;
	}
	.icon_box_mob ul li p {
		font-size : 3vw;
		line-height : 1.5;
	}
	.icon_box_mob ul li {
		flex: 0 0 45%;           
		text-align: center;
		padding: 20px 16px;
	}
	.icon_box_mob ul::before {
		content: "";
		position: absolute;
		top: 20px;               
		bottom: 20px;             
		left: 50%;
		width: 1px;
		background: #ddd;
		transform: translateX(-50%);
	}
	.icon_box_mob ul::after {
		content: "";
		position: absolute;
		left: 20px;               
		right: 20px;              
		top: 50%;
		height: 1px;
		background: #ddd;
		transform: translateY(-50%);
	}
}
/*******section01(동행소개) 끝******/

/*******section02(사업소개)******/
#section02{
	padding : 80px 200px;
	text-align : center;
}

#section02 .sub_title {
	font-size : 20px;
	font-weight : bold;
	color : #AAAAAA;
	margin-bottom : 10px;
}
#section02 h3{
	font-size : 40px;
	font-weight : bold;
	margin-bottom : 60px;
}
#section02 .business_pc {
	display : grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px; 
}
#section02 .business_pc .conbox {
	padding-left : 50px; 
	display : flex;
	justify-content : left;
	align-items : center;
	gap : 30px;
	text-align : left;
}
#section02 .business_pc .conbox .con_txtbox .blue {
	color : var(--main-color);
	font-size : 20px;
	font-weight : bold;
}
#section02 .business_pc .conbox .con_txtbox > p {
	font-size : 18px;
	margin-top : 13px;
	margin-bottom : 20px;
}
.btn_round_white {
	width : 186px;
	height : 47px;
	display : flex;
	justify-content : space-between;
	align-items: center;
	flex-direction : row;
	padding: 6px 20px;
	background-color: #FFFFFF;        
	border-radius: 9999px;
	border : 1px solid #DEDEDE;
	color : #686868;
	font-size : 18px;
	transition: all 0.2s ease;
}
.btn_round_white:hover {
	transform: translateY(-3px);
	box-shadow : 3px 3px 6px #eee;
}
#section02 .business_mob {
	display : none;
}
@media screen and (max-width:1000px) {	
	#section02 .business_mob {
		display : block;
	}
	#section02 .business_pc {
		display : none;
	}
	#section02{
		padding : 0;
		max-width : 100%;
		min-height : 100vw;
		text-align : center;
		
	}
	#section02 .business_mob_bg {
		min-height : 100vw;
		background-color : var(--gray);
		padding : 20px 10px;
	}
	#section02 .business_mob_bg .conbox {
		position : relative;
		margin-bottom : 30px;
	}
	#section02 .business_mob_bg .conbox img {
		width : 100%;
		height : 300px;
	}
	#section02 .business_mob_bg .conbox .con_txtbox {
		display : flex;
		gap : 15px;
		flex-direction : column;
	}
	#section02 .business_mob_bg .conbox .con_txtbox.a {
		position : absolute;
		top : 50%;
		left : 50%;
		text-align : left;
		transform : translate( -10% , -40%);
		line-height : 1.4;
		align-items: flex-start;
	}

	#section02 .business_mob_bg .conbox .con_txtbox.b{
		position : absolute;
		top : 50%;
		left : 30%;
		transform : translate( -50% , -40%);
		text-align : right;
		line-height : 1.4;
		align-items: flex-end;
	}

	#section02 .business_mob_bg .conbox .con_txtbox .blue {
		color : var(--main-color);
		font-size : 5vw;
		font-weight : bold;
	}
	#section02 .sub_title {
		font-size : 6vw;
	}
	#section02 h3{
		font-size : 8vw;
		margin-bottom : 30px;
	}
	.btn_round_white {
		width : 130px;
		height : 35px;
		font-size : 3.5vw;
	}
/* 	.btn_round_white .arrow {
		padding-top : 13px;
	} */
	.btn_round_white:hover {
		transform: translateY(-3px);
		box-shadow : 3px 3px 6px #eee;
	}
}
/*******section02(사업소개)끝******/

/*******section03(갤러리)*******/
#section03 {
	background-color : var(--gray);
	width : 100%;
	height : auto;
	padding : 80px 0;
	text-align : center;
}
#section03 .sub_title {
	font-size : 20px;
	color : #AAAAAA;
	margin-bottom : 60px;
}
#section03 h3{
	font-size : 40px;
	font-weight : bold;
	margin-bottom : 10px;
}
#section03 .sec03_gallbox_pc {
	display: grid;
	grid-template-columns: repeat(4, 1fr); 
	gap: 20px;
	padding : 0 200px;
}
#section03 .sec03_gallbox_pc .gall_item_pc {
	overflow : hidden;
	height: 320px;
}
#section03 .sec03_gallbox_pc .gall_item_pc img{
	width: 100%;
	height: 100%;
	display: block;
	transition: all 0.3s ease;
	aspect-ratio: 360 / 320;
	object-fit: cover;
}
#section03 .sec03_gallbox_pc .gall_item_pc img:hover{
	transform : scale(1.1);
	filter: saturate(130%); 
}
.btn_area {
	text-align: center;
	margin-top: 30px;
}
.btn_area > button {
	width : 186px;
	height : 47px;
	border-radius : 30px;
	color : var(--main-color);
	font-size : 18px;
	border : 1px solid #1C337A;
	background-color : #fff;
}
.btn_area .morebtn:hover {
	transform: translateY(-3px);
	box-shadow : 3px 3px 6px #eee;	
}
.sec03_gallbox_mob{
	display : none;
}
@media screen and (max-width:1000px) {
	#section03 .sec03_gallbox_pc {
		display : none;
	}
	#section03 .sec03_gallbox_mob{
		display : block;       
		padding: 20px 10px;
	}
	#section03 .sec03_gallbox_mob {        
		display: grid;
		grid-template-columns: repeat(2, 1fr); 
		gap: 10px;
	}
	#section03 .sec03_gallbox_mob .gall_item_mob {
		overflow : hidden;
	}
	#section03 .sec03_gallbox_mob .gall_item_mob img{
		width: 100%;
		display: block;
		width : 170px;
		height: 200px;
		aspect-ratio: 4 / 5;
		object-fit: cover;
		transition: transform 0.3s ease, filter 0.3s ease;
	}
	#section03 {
		background-color : #fff;
		width : 100%;
		height : auto;
		padding : 30px 0;
		text-align : center;
	}
	.sec03_gallbox_mob {
		background-color : var(--gray);
	}
	#section03 .sub_title {
		font-size : 4vw;
		margin-bottom : 10px;
	}
	#section03 h3{
		font-size : 8vw;
		margin-bottom : 10px;
	}
	.btn_area > button {
		width : 150px;
		height : 40px;
		font-size : 4vw;
		border : 1px solid #1C337A;
		background-color : #fff;
	}

}
/*******section03(갤러리)끝******/

/*******section04(후원업체)*******/
#section04{
	padding : 80px 200px;
	text-align : center;
}

#section04 .sub_title {
	font-size : 20px;
	font-weight : bold;
	color : #AAAAAA;
	margin-bottom : 10px;
}
#section04 h3 {
	font-size : 40px;
	font-weight : bold;
	margin-bottom : 60px;
}
#section04 .sec04_clientbox {
	display: grid;
	grid-template-columns: repeat(4, 1fr); 
	gap: 20px;
}

@media screen and (max-width:1000px) {
	#section04 {
		padding : 0;
		max-width : 100%;
		min-height : 100vw;
		text-align : center;
		padding : 30px 0;
	}
	#section04 .sec04_clientbox {
		display: grid;
		grid-template-columns: repeat(2, 1fr); 
		gap: 10px;
		padding : 0 10px;
	}
	#section04 .sec04_clientbox .sec04_clientbox_item img {
		width : 160px;
		height : 130px;
	}
	#section04 .sub_title {
		font-size : 4vw;
		margin-bottom : 10px;
	}
	#section04 h3{
		font-size : 8vw;
		margin-bottom : 30px;
	}
}
/*******section04(후원업체)끝*******/

/*******section05(문의)*******/
#section05 {
	background-color : var(--gray);
	width : 100%;
	height : auto;
	padding : 80px 0;
	text-align : center;
}
#section05 .sub_title {
	font-size : 20px;
	color : #AAAAAA;
	margin-bottom : 10px;
}
#section05 h3{
	font-size : 40px;
	font-weight : bold;
	margin-bottom : 84px;
}

#section05 .sec05_wrap {
	display : flex;
	padding : 0 200px;
	justify-content : space-around;
	align-items : top;
	text-align : left;
}
#section05 .sec05_wrap .txtbox .txt {
	font-size : 18px;
	line-height : 1.6;
	margin-bottom : 50px;
}
.tit_bold{
	font-size : 20px;
	font-weight : bold;
	margin: 30px 0;
}
#section05 .sec05_wrap .iconbox .icon_item {
	margin-bottom : 20px;
}
#section05 .sec05_wrap .iconbox .icon_item span {
	font-size : 18px;
	margin-left : 20px;
}
.agree_box {
	display: flex;
	align-items: center;
	margin: 40px 0;
	font-size: 14px;
	color: #333;
}
.agree_box input[type=checkbox] {
	width: 18px;
	height: 18px;
	margin-right: 8px;
	accent-color: var(--main-color); 
	cursor: pointer;
}
.btn_area .submit_btn {
	width : 682px;
	height : 70px;
	border-radius : 10px;
	background-color : var(--main-color);
	color : #fff;
	font-size : 20px
}

@media screen and (max-width:1000px) {
	#section05 {
		padding : 80px 10px;

	}
	#section05 .sec05_wrap {
		display : flex;
		flex-direction : column;
		padding : 0;
		justify-content : space-around;
		align-items : top;
		text-align : left;
	}
	.tit_bold{
		font-size : 5vw;
		font-weight : bold;
		margin: 30px 0 30px 5px;
	}
	.agree_box {
		margin: 20px 0 20px 5px;
		font-size: 4vw;
	}
	.btn_area .submit_btn {
		width : 70%;
		height : 60px;
		border-radius : 10px;
		background-color : var(--main-color);
		color : #fff;
		font-size : 6vw;
	}
	#section05 .sec05_wrap .txtbox {
		text-align : left;
		margin-top : 60px;
		padding : 0 20px;
	}
	#section05 .sec05_wrap .txtbox .hide {
		display : none;
	}
	#section05 .sec05_wrap .txtbox .txt {
		font-size : 4vw;
	}
	#section05 .sec05_wrap .iconbox .icon_item {
		margin-bottom : 10px;
	}
	#section05 .sec05_wrap .iconbox .icon_item span {
		font-size : 4vw;
		margin-left : 10px;
	}

}
/*******section05(문의)끝*******/
/******************************  //메인 페이지  ******************************/

/******************************  기관소개 페이지  ******************************/
/******* 설립이념 시작 *******/
.topbanner_mob {
	display : none;
}
.topbanner_pc {
	position : relative;
}
.btm_txt_mob {
	display : none;
}
.banner_txt {
	color : #fff;
	font-size : 50px;
	font-weight : bold;
	position : absolute;
	top : 50%;
	left : 50%;
	transform : translate(-50%, -50%);
}
#main_area {
	/* padding : 0 278px;
	display : flex;
	justify-content : start;
	gap : 30px; */
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 30px;
	padding: 0 278px;
	box-sizing: border-box;
}

#main_area .menu_bar {
	width : 250px;
	min-height : 100%;
	background-color : #fff;
	border-left: 1px solid #E1E1E1;   /* 왼쪽 선 */
	border-right: 1px solid #E1E1E1;  /* 오른쪽 선 */
	align-self: stretch;
	position: relative;
}
#main_area .menu_bar ul li {
	border-bottom: 1px solid #E1E1E1;
}
#main_area .menu_bar ul li a {
	display : block;
	width : 100%;
	height : 70px;
	font-size : 16px;
	line-height : 70px;
	padding : 0 15px;
	font-weight : bold;
}
#main_area .menu_bar ul li a:hover,
#main_area .menu_bar ul li a.on {
	background-color : var(--main-color);
	color : #fff;
}
#main_area .content {
/* 	background-color : pink;
	max-width : 100%;
	padding-bottom : 150px; */
	flex: 1; 
	min-width: 0;
	padding-bottom : 150px;
}
#main_area .content .sub_tit {
	margin-top : 84px;
	margin-bottom : 40px;
	font-size : 50px;
	color : var(--main-color);
	font-weight : 600;
}
#main_area .content .con_imgbox {
	background-color : var(--gray);
	padding : 60px 30px;
	text-align : center;
}
#main_area .content .con_imgbox .btm_txt_pc {
	font-size : 18px;
	line-height : 1.6;
	margin : 60px 0;
}
#main_area .content .con_imgbox .imgbox_top {
	display : grid;
	grid-template-columns: repeat(2, 1fr);
	gap : 60px;
}
#main_area .content .con_imgbox .imgbox_top .imgitem {
	text-align : center;
}
#main_area .content .con_imgbox .imgbox_top .imgitem .txtbg{
	background-color : #fff;
	padding : 20px 0;

}
#main_area .content .con_imgbox .imgbox_top .imgitem .sub_bold {
	font-size : 22px;
	font-weight : bold;
/* 	margin-top : 24px; */
	margin-bottom : 10px;
}
#main_area .content .con_imgbox .imgbox_top .imgitem .txtbg > p {
	font-size : 18px;
	text-align : center;
}

@media screen and (max-width:1000px) {
	.topbanner_mob {
		display : block;
		position : relative;
		width : 100vw;
	}
	.topbanner_mob > img {
		width : 100%;
		height : 150px;
	}
	.topbanner_pc {
		display : none;
	}
	.banner_txt {
		width : 80%;
		color : #fff;
		font-size : 6vw;
		font-weight : bold;
		position : absolute;
		text-align : center;
	}
	
	#main_area {
		/* background-color : pink; */
		padding : 25px 10px;
		display : flex;
		justify-content : center;
		gap : 30px;
	}
	#main_area .menu_bar {
		display : none;
	}
	#main_area .content {
		padding-bottom : 50px;
	}
	#main_area .content .sub_tit {
		margin : 25px 0;
		font-size : 8vw;
	}
	#main_area .content .con_imgbox {
		min-width : 95vw;
		padding : 25px 5px 12.5px 5px;
		border-top : 2px solid #1C337A
	}
	#main_area .content .con_imgbox .imgbox_top .imgitem {
		text-align : left;
		max-width : 100%;
	}
	#main_area .content .con_imgbox .imgbox_top .imgitem img {
		max-width : 100%;
	}
	#main_area .content .con_imgbox .imgbox_top .imgitem .txtbg{
		background-color : #fff;
		padding : 10px 0;
		text-align : center;
	}
	#main_area .content .con_imgbox .imgbox_top {
		display : grid;
		grid-template-columns: repeat(1, 1fr);
		gap : 30px;
	}
	.btm_txt_pc {
		display : none;
	}
	.btm_txt_mob {
		display : block;
		margin : 50px 0;
		font-size : 4vw;
	}
}
/******* //설립이념 끝 *******/

/******* 걸어온길  *******/
.pc_history{
	display : block;
}
.mob_history{
	display : none;
}

@media screen and (max-width:1000px) {
	.pc_history{
		display : none;
	}
	.mob_history{
		display : block;
		max-width : 100%;
	}

}
/******* //걸어온길 끝 *******/

/******* 인사말  *******/
.content .con_imgbox .txtbox p {
	font-size : 22px;
	text-align : left;
	margin-bottom : 80px;
}
@media screen and (max-width:1000px) {
	.content .con_imgbox .txtbox p {
		font-size : 4.5vw;
		text-align : center;
	}
	.content .con_imgbox .txtbox img {
		width : 60%;
	}

}
/******* //인사말 끝 *******/

/******* 사람들  *******/
.pc_people{
	display : block;
}
.mob_people{
	display : none;
}

@media screen and (max-width:1000px) {
	.pc_people{
		display : none;
	}
	.mob_people{
		display : block;
		max-width : 100%;
	}

}
/******* //사람들 끝 *******/

/******* 오시는길 *******/
.content .con_imgbox > p, 
.content .con_imgbox > h4, 
.content .con_imgbox > span {
	font-size : 22px;
	text-align : left;
	line-height : 1.6;
	margin-bottom : 30px;
}
.content .con_imgbox .blue{
	color : var(--main-color);
}
.content .con_imgbox .bold {
	font-weight : 600;
}
.content .con_imgbox .adress {
	margin : 30px 0;
	text-align : left;
}
.content .con_imgbox .adress .adress_con {
	margin-bottom : 10px;
}
.content .con_imgbox .adress .adress_con > .tel {
	font-size : 18px;
	margin-left : 10px;
}
.content .con_imgbox .map{
	width : 100%;
	height : 440px;
	/* background-color : #CBCBCB; */
	margin-bottom : 30px;
}
@media screen and (max-width:1000px) {
	.content .con_imgbox > p , 
	.content .con_imgbox > h4 , 
	.content .con_imgbox > span {
		font-size : 4vw;
		line-height : 1.5;
	}
	.content .con_imgbox .adress .adress_con > .tel {
		font-size : 4vw;
		margin-left : 10px;
		}
}
/******* //오시는길 끝 *******/
/******************************  //기관소개 페이지  ******************************/


/****************************** 사업소개 페이지  ******************************/
/******* 급식후원 *******/
.batge{
	width : 110px;
	height : 40px;
	background-color : var(--main-color);
	color : #fff;
	font-size : 22px;
	display: flex;
	justify-content: center; 
	align-items: center;    
}

.batge.btm {
	margin-top : 70px;
}

.bold.b1 {
	text-align : left;
	margin : 20px 0;
	font-size : 22px;
}

.business_grid{
	display : grid;
	grid-template-columns : repeat(2, 1fr);
	gap  :35px;
}

.imgbox01 .slider_wrap{
	position : relative;
	overflow : hidden;
	margin-top : 50px;
}

.imgbox01 .img_slider{
	/* display : flex; */
	/* transition : transform 1s ease; */
	width: 483px;
	height: 362px;
}

.imgbox01 .imgitem{ 
	/* min-width : 100%; */ 
	/* width: 483px; */
	/* height: 362px; */
}

.imgbox01 .item img{
	width : 100%;
	height: 100%;
	aspect-ratio : 4/3; 
	object-fit : cover;
	/* display : block; */
}

.slide_btn{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 44px;
	height: 44px;
	z-index: 5;
	display: block !important;
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto;
	cursor : pointer;
}

.slide_btn.prev{ 
	left : 12px; 
}

.slide_btn.next{ 
	right : 12px; 
}

.slide_btn.prev,
.slide_btn.next {
	display: block !important;
	opacity: 1 !important;
	visibility: visible !important;
}

.slide_btn:hover{
	transform:translateY(-50%) scale(1.06);
}

.imgbox01 .card_text{
	/* background-color : pink; */
	padding : 24px 10px;
	text-align : left;
}
.imgbox01 .card_text .sub_bold{
	font-size : 22px;
	font-weight : 700;
	margin-bottom : 10px;
	text-align : left;
}

.imgbox01 .card_text > p{
	font-size : 18px;
	line-height : 1.5;
	margin-bottom : 8px;
}

.imgbox01 .desc_list{
	line-height:1.5;
	font-size : 18px;
	list-style: none !important;
	padding-left: 0;
}

.desc_list li {
	position: relative;
	padding-left: 1.1em;
	margin-bottom: 6px;
}

.desc_list li::before{
	content: "•";
	position: absolute;
	left: 0;
	top: 0;
	line-height: 1.6;
	color: #000;           
	font-size: 1em;
}

@media screen and (max-width:1000px){
	.imgbox01 .slider_wrap{
		margin-top : 25px;
	}
	
	.batge{
		font-size : 5vw;
	}
	
	.bold.b1 {
		margin-top : 18px;
		font-size : 4vw;
	}
	
	.imgbox01 .card_text{
		background-color : #fff;
		padding : 24px 10px;
		text-align : left;
	}
	
	.imgbox01 .card_text .sub_bold{
		font-size : 5vw;
		font-weight : 700;
	}

	.imgbox01 .card_text > p{
		font-size : 4vw;
		line-height : 1.3;
	}

	.imgbox01 .desc_list{
		line-height:1.3;
		font-size : 4vw;
	}
	.business_grid{ 
		grid-template-columns : 1fr; 
		gap : 20px; 
	}
	
	.imgbox01 .img_slider{
		width: 92vw;
		height: auto;
	}
	
	.slide_btn.prev{ 
		left : 5px; 
	}

	.slide_btn.next{ 
		right : 5px; 
	}
}
/******* //급식후원 끝 *******/

/******* 사업계획서 *******/
.planbox {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 40px;
	margin-top: 40px;
}

.planitem {
	background-color: #fff;
	padding: 20px 5px;
	box-sizing: border-box;
	border-top : 2px solid #1F378D;
	max-width : 100%;
	height : auto;
	/* background-color : pink; */
}

.planitem .bold.b1 {
	font-size: 16px;
	margin-bottom: 20px;
	font-weight : 600;
	color : var(--main-color);
}

.plan_tit {
	width: 100%;
	display: flex;
	justify-content: space-between; 
	align-items: center;             
	background: none;
	padding: 15px 10px;
	font-size: 16px;
	font-weight: 600;
	text-align: left;
	border-top : 1px solid #DDDDDD;
	border-bottom : 1px solid #DDDDDD;
}
.plan_tit img {
	width : 10px;
	height : auto;
	transition : transform 0.3s ease;
}
.plan_body{
	display :block;      
	background: var(--gray);
	padding:14px 16px;
	line-height:1.7;
	font-size : 16px;
}

@media screen and (max-width: 1000px) {
	.planbox {
		grid-template-columns: 1fr;
		gap: 20px;
	}
	.planitem {
		background-color: #fff;
		padding: 20px 5px;
		box-sizing: border-box;
		border-top : 2px solid var(--main-color);
		width : 100%;
		height : auto;
		/* background-color : pink; */
	}
	.plan_body{
		display :block;      
		background: var(--gray);
		padding:14px 16px;
		line-height:1.7;
		font-size : 4vw;
	}
}
/******* //사업계획서 끝 *******/
/****************************** //사업소개 페이지 끝  ******************************/


/****************************** 참여하기 페이지 시작  ******************************/
/******* 봉사하기 시작 ********/
.service_top {
	/* background-color : yellow; */
	display : flex;
	justify-content : center;
	align-items : center;
	margin : 35px 0 65px 0;
	gap : 40px;
}
.right_arrow {
	display : inline-block;
	width : 50px !important;
	height : 50px !important;
}
.right_arrow.mob {
	display : none;
}
.service_top .service01 .service_text {
	width : 240px;
	text-align : left;
}
.service_top .service01 .service_text .sub_bold.bk {
	font-size : 22px;
	font-weight : bold;
 	margin-top : 20px; 
	margin-bottom : 10px;
}
.service_top .service01 .service_text p {
	font-size : 18px;
	line-height : 1.4;
}

.service_btm {
	/* background-color : yellow; */
	text-align : left;
}
.service_btm ul {
	margin-bottom : 65px;
}
.service_btm ul li {
	display : grid;
	grid-template-columns : 12px 180px 1fr;   /* ● | 제목 | 설명 */
	align-items : center;
	column-gap : 30px;
	line-height : 1.7;
	margin-bottom : 20px;
}
.dot.sv1 {
	grid-column : 1;
	font-size : 10px;
	font-weight : bold;
	color : var(--main-color);
	text-align : center;
}
.sv1_tit {
	grid-column : 2;
	font-weight : bold;
	font-size : 20px;
	
}
.sv1_txt {
	grid-column : 3;
	font-size : 18px;
}
.mob_br {
	display : none;
}

@media screen and (max-width: 1000px) {
	.service_top {
		/* background-color : yellow; */
		flex-direction : column;
		gap : 20px;
	}
	.mob_br {
		display : block;
	}
	.bold.b2 {
		font-size : 4.5vw;
		line-height : 1.4;
		margin : 0;
	}
	.right_arrow {
		display : none;
	}
	.right_arrow.mob {
		width : 40px !important;
		height : 40px !important;
	}
	.service_top .service01 .service_img > img {
		width : 100%;
	}
	.service_top .service01 .service_text {
		width : 88vw;
		text-align : center;
		background-color : #fff;
		padding : 10px 3px;
	}
	.service_top .service01 .service_text .sub_bold.bk {
		font-size : 5vw;
		margin-top : 0; 
		margin-bottom : 10px;
	}
	.service_top .service01 .service_text p {
		font-size : 4vw;
		line-height : 1.4;
	}
	.service_btm {
		/* background-color : yellow; */
		text-align : left;
	}
	.service_btm ul li {
		grid-template-columns : 10px 1fr;
		column-gap : 10px; 
		align-items : start;
	}
	.dot.sv1 {
		grid-column : 1;
		grid-row : 1 / span 2;
		margin-top : 6px;
	}
	.sv1_tit {
		grid-column : 2;
		font-size : 5vw;
		margin-bottom : 4px;
	}
	.sv1_txt {
		grid-column : 2;
		display : block;
		font-size : 4vw;
		line-height : 1.6;
	}
	.sv_banner.pc {
		display : none;
	}
	.sv_banner.mob {
		width : 100%;
	}
}

/******* //봉사하기 끝 *******/

/******* 후원하기 시작 *******/
.service_top.bank {
	/* background-color : yellow; */
	display : flex;
	flex-direction : column;
	background-color : #D7DFF8;
	text-align : left;
	padding : 20px 40px;
	align-items : stretch;
	gap : 20px;
}
.service_top.bank h3.bold.b1 {
	text-align : left !important; 
}
.service_top.bank .banklist {
	text-align : left;
}
.service_top.bank .banklist ul {
	display : grid;
	grid-template-columns : repeat(2, 1fr);
	column-gap : 80px; 
	row-gap : 5px;  
}

.service_top.bank .banklist ul li {
	display : grid;
	grid-template-columns : 12px 120px 1fr; 
	align-items : center;
	column-gap : 10px;
	line-height : 1.7;
	margin-bottom : 5px;
	text-align : left;
}

@media screen and (max-width: 1000px) {
	.service_top.bank {
		padding : 20px;
	}
	.service_top.bank .bold.b1 {
		font-size : 6vw;
	}
	.service_top.bank .banklist ul {
		grid-template-columns : 1fr;
		row-gap : 12px;
	}
	.service_top.bank .banklist ul li {
		grid-template-columns : 12px 1fr;   
		align-items : start; 
		column-gap : 8px;
	}
	.service_top.bank .banklist .dot.sv1 {
		grid-row : 1 / span 2;
		font-size : 3.5vw;
	}
	.service_top.bank .banklist .sv1_txt {
		font-size : 5vw;
		line-height : 1.5;
	}
}

/******* //봉사하기 끝 *******/

/******* 봉사헤택 시작 *******/
.service_btm .sv03 {
	display : grid;
	grid-template-columns : 1fr;
	row-gap : 20px;
	list-style : none;  
	padding : 0;
	margin : 0 0 50px;
}
.bold.sv03 {
	margin-bottom : 40px;
}
.service_btm .sv03 > li {
	display : grid;
	grid-template-columns : 16px 1fr;  
	column-gap : 10px;
	align-items : start;
}
.service_btm .dot.sv3 {
	line-height : 1;
	margin-top : 10px;          
}
.service_btm .text_wrap {
	display : flex;
	flex-direction : column;
	gap : 6px;
}
.service_btm .text_wrap .sv1_tit.blue {
	font-size : 20px;
	font-weight : bold;
	line-height : 1.5;
	color : var(--main-color);
}
.service_btm .text_wrap .sv1_txt {
	font-size : 18px;
}
.btn_box.sv {
	display : flex;
	justify-content : center;
	gap : 30px;
	margin-bottom : 65px;
}
.btn_box.sv .btn_round_white.sv {
	border : 1px solid var(--main-color);
	color : var(--main-color);
}
.btn_box.sv .btn_round_white.sv:hover {
	border : 1px solid #fff;
	color : #fff;
	background-color : var(--main-color);
	font-weight : bold;
}
.btn_box.sv .btn_round.sv {
	width : 186px;
	height : 47px;
}

@media screen and (max-width: 1000px) {
	.con_imgbox.sv03 {
		padding : 25px 0 12.5px 0 !important;
	}
	.bold.sv03 {
		font-size : 6vw;
		text-align : center;
	}
	.service_btm.sv03 {
		margin-top : 30px; 
	}
	.service_btm .sv03 li:nth-child(odd) {
		background-color : #fff; 
		padding : 10px;
	}
	.service_btm .text_wrap {
		gap : 0;
	}
	.service_btm .text_wrap .sv1_txt {
		font-size : 4vw;
	}
	.btn_box.sv {
		gap : 10px;
		flex-direction : column;
		align-items : center;
		background-color : #fff;
		padding : 50px 0; 
	}
	.btn_box.sv .btn_round_white.sv,
	.btn_box.sv .btn_round.sv {
		width : 180px;
		height : 45px;
		font-size : 4vw;
	}
	
}

/******* //봉사하혜택 끝 *******/
/****************************** //참여하기 페이지 끝  ******************************/

/****************************** 커뮤니티 페이지 시작  ******************************/
/******* 공지사항 시작 *******/
.notice_wrap {
	padding : 30px;
	text-align : center;
}
.notice {
	width: 100%;
}
.notice_search {
	display : flex;
	justify-content : flex-end;
	align-items : center;
	gap : 10px;
	margin-bottom : 30px;
}
.search_input {
	width : 310px !important;
	height : 55px !important;
	padding : 0 12px !important;
	border : 1px solid #ccc !important;
	border-radius : 0 !important;
	font-size : 18px !important;
	transition : all 0.2s ease;
	margin : 0 !important;
}
.search_input:focus {
	outline : none;
	border-color : var(--main-color);
	box-shadow : 0 0 3px rgba(0, 43, 153, 0.2);
}
.search_btn {
	width : 102px;
	height : 55px;
	background-color : var(--main-color);
	color : #fff;
	font-size : 18px;
	font-weight : bold;
	border : none;
	cursor : pointer;
	transition : background-color 0.2s ease;
}
.notice thead {
	border-top : 2px solid var(--main-color);
}
.notice thead th,
.notice tbody td {
	border-bottom: 1px solid #ddd;
	font-size: 16px;
	height: 60px;
}
.notice thead th.num {
	width: 60px;
}

@media screen and (max-width: 1000px) {
	.notice_wrap {
		padding : 25px 5px 12.5px 5px;
	}
	.search_input {
		width : 100% !important;
		height : 12vw !important;
		padding : 0 12px !important;
		font-size : 4vw !important;
	}
	.search_btn {
		width : 20vw;
		height : 12vw;
		font-size : 4vw;
	}
	.notice thead th,
	.notice tbody td {
		padding: 4.5vw 0;
		font-size: 4vw;
		vertical-align: top;
		height: auto;
	}
	.notice thead th.num {
		width: 10%;
	}
	.notice thead th.tit {
		text-align: left;
		padding: 4.5vw 3vw;
		padding-left: 15vw;
		white-space : nowrap;
	}
	.notice thead th.view {
		width: 15%;
		
	}
	.notice thead th.date {
		width: 25%;
	}
	.notice thead th.l_date {
		width: 27%;
	}
	.paging {
        margin: 10vw 0;
    }

}
/******* //공지사항 끝 *******/

/******* 공지사항 내용 시작 *******/
.notice_wrap.view {
	background : #fff;
	padding : 30px 24px;
	box-sizing : border-box;
	text-align : left;
}

/* 제목 + 날짜 */
.notice_head {
	display : grid;
	grid-template-columns : 1fr auto;
	align-items : end;
	padding : 20px 10px;
	border-bottom : 1px solid #ccc;
	border-top : 2px solid var(--main-color);
}
.notice_title {
	font-size : 22px;
	font-weight : bold;
	padding : 10px 0 10px 0;
}
.notice_date {
	font-size : 14px;
	color : #666;
	line-height : 46px;
}
.notice_body {
	padding : 20px 10px;
	font-size : 18px;
	line-height : 1.8;
	color : #111;
}
.notice_file {
	display : flex;
	align-items : center;
	justify-content : space-between;
	padding : 15px 10px;
	border-top : 1px solid #ccc;
	border-bottom : 1px solid #ccc;
}
.file_name {
	font-size : 15px;
	color : #333;
}
.btn_download {
	background :#E1E1E1;
	border : 1px solid #ccc;
	padding : 8px 16px;
	font-size : 16px;
	cursor : pointer;
	transition : 0.2s;
}
.btn_download:hover {
	background : #e5e7eb;
}
.notice_btn_box {
	text-align : center;
	margin-top : 30px;
}
.btn_list {
	display : inline-block;
	padding : 12px 40px;
	background : #fff;
	font-size : 16px;
	text-decoration : none;
	border : 1px solid #DDDDDD;
}

@media screen and (max-width: 1000px) {
	.notice_wrap.view {
		padding : 0;
	}
	.notice_head {
		padding : 10px;
	}
	.notice_title {
		font-size : 4.5vw;
	}
	.notice_date {
		font-size : 3.5vw;
	}
	.notice_body {
		padding : 20px 10px;
		font-size : 4vw;
		line-height : 1.6;
	}
	.notice_file {
		padding : 10px;
	}
	.btn_download {
		font-size : 3vw;
	}
	.btn_list {
		display : inline-block;
		padding : 10px 30px;
		background : #fff;
		font-size : 4vw;
		text-decoration : none;
		border : 1px solid #DDDDDD;
	}

}
/******* //공지사항 내용 끝 *******/

/******* 포토갤러리 시작 *******/
.gallery_list {
	display : grid;
	grid-template-columns : repeat(3, 1fr);
	gap : 20px;
}
.gallery_item {
	overflow : hidden;
	transition : transform 0.2s ease;
}
.gallery_item:hover {
	transform : translateY(-4px);
}
.gall_img {
	height: 320px;
	overflow: hidden;
}
.gallery_link {
	display : block;
	width : 100%;
	height : 100%;
}

.thumb_img {
	width : 100%;
	height : 100%;
	object-fit : cover;
	aspect-ratio: 1 / 1;
	display : block;
}

.info_wrap {
	padding : 12px 14px 14px;
}
.info_tit {
	margin : 0 0 8px;
	font-size : 20px;
	font-weight : bold;
}
.ellipsis2 {
	display : -webkit-box;
	-webkit-box-orient : vertical;
	-webkit-line-clamp : 2; 
	overflow : hidden;
	text-overflow : ellipsis;
	word-break : break-all; 
}
.info_txt {
	display : flex;
	align-items : center;
	gap : 6px;
	font-size : 18px;
}
.gall_bar {
	opacity : 0.5;
	margin : 0 5px;
}
.gall_view::before {
	content : "조회수";
	margin-right : 5px 
}

@media screen and (max-width: 1000px) {
	.notice_wrap.gall {
		border-top : 2px solid var(--main-color); 
	}
	.gallery_list {
		grid-template-columns : repeat(2, 1fr);
		gap : 10px;
	}
	.gall_img {
		height: 43vw;
	}
	.info_tit {
		margin : 0 0 4px;
		font-size : 4vw;
		text-overflow : ellipsis;
		white-space : nowrap;
	}
	.info_txt {
		gap : 3px;
		font-size : 3.2vw;
	}
	.gall_view::before {
		content : "";
		margin-right : 0; 
	}

}
/******* //포토갤러리 끝 *******/

/******* 포토갤러리 내용 *******/
.notice_file.gallview {
	border-top : 0;
	border-bottom : 1px solid #ccc;
}
.gallview{
	margin-top : 40px;
	max-width : 100%;
	display : grid;
	grid-template-columns : repeat(3, 1fr);
}

@media screen and (max-width: 1000px) {
	.gallview{
		grid-template-columns : repeat(1 , 1fr);
	}
}
/******* //포토갤러리 내용 끝 *******/


/****************************** //커뮤니티 페이지 끝  ******************************/


/* 2025-10-24 지도 관련 스타일 추가 */
.map .root_daum_roughmap {
	width: 100%;
	height: 100%;
}

.map .root_daum_roughmap .wrap_map {
	height: 100%;
}


/******************************  레이어 팝업  ******************************/
#popup_layer {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.3);
	z-index: 9999;
}

#popup_layer .popup_box {
	display: none;
	position: absolute;
	top: 50%;
	left: 50%;
	max-width: 1000px;
	transform: translate(-50%,-50%);
	background: #fff;
}

#popup_layer .popup_box .layer_img {
	display: block;
	margin: 0 auto;
}

#popup_layer .popup_box .layer_close {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 30px;
	height: 30px;
	background: #000;
}

#popup_layer .popup_box .layer_close::before,
#popup_layer .popup_box .layer_close::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 20px;
	height: 2px;
	background: #fff;
	transform-origin: center;
}

#popup_layer .popup_box .layer_close::before {
	transform: translate(-50%, -50%) rotate(45deg);
}

#popup_layer .popup_box .layer_close::after {
	transform: translate(-50%, -50%) rotate(-45deg);
}

@media screen and (max-width: 1000px) {
	#popup_layer .popup_box .layer_img {
		width: 88vw;
	}
}