@charset "utf-8";


/* 뷰보드 내 탭메뉴 */
.tabs{overflow:hidden; position:relative; background:#494949;}
ul.tabs li{padding: 10px 0;float:left; cursor: pointer; color:#fff; border-left:1px solid #fff; width:220px; text-align:center;}
ul.tabs li:first-child{padding-left:21px !important; border-left:0;}
ul.tabs li:hover{background-color:#739b42;}
#tab_1, #tab_2{clear:both;}
ul.tabs li.current{background:#739b42;}
.tab_content{display: none;}
.tab_content.current{display: inherit;}
.tab_content strong{font-size:18px; line-height:120%;}
.date {text-align:center;}
.con-tbl th{line-height:130%}
/*뷰보드 공통 끝 ===================================================================*/



/*개인정보처리방침*/
.level1_1{font-size:25px; font-weight:600; margin-top:40px; margin-bottom:30px;}
.level1_1:first-child{margin-top:0px;}
.level1_2{font-size:16px;font-weight:600; margin-top:40px; margin-bottom:30px;}
.level1_2_1{font-weight:600; margin-top:40px; margin-bottom:10px;font-size:20px}
.level1_2_1:first-child{margin-top:0px;}
.level1_3{margin-top:10px; margin-bottom:5px;}
.level1_4{margin-bottom:5px; padding-left:22px; text-indent:-21px;}
.level1_4_1{text-indent:-22px; padding-left:22px;  margin-bottom:5px;}
.level1_4_2{text-indent:-19px; padding-left:38px;  margin-bottom:5px;}
.level1_5{text-indent:-1px; padding-left:24px;  margin-bottom:5px;}
.level1_5_1{text-indent:-1px; padding-left:17px;  margin-bottom:5px;}
.level1_6{text-indent:0px; padding-left:37px;margin-bottom:5px;}
.level1_7{text-indent:0px; padding-left:42px;margin-bottom:5px;}
.ctt_privacy  .bo_v_tit{font-size:26px;margin-bottom:40px !important;display:inline-block}

/*이용약관*/
.level2_1{font-size:25px; font-weight:600; margin-top:40px; margin-bottom:30px;}
.level2_1:first-child{margin-top:0px;}
.level2_2{font-size:16px;font-weight:600; margin-top:40px; margin-bottom:30px;}
.level2_2_1{margin-top:10px; margin-bottom:5px; text-indent:0px; padding-left:0px}
.level2_3{margin-top:10px; margin-bottom:5px;text-indent:-0px; padding-left:0px;}
.level2_3_1{margin-top:10px; margin-bottom:5px;text-indent:-20px; padding-left:20px;}
.level2_4{margin-bottom:5px; padding-left:38px; text-indent:-16px;}
.level2_4_1{text-indent:-21px; padding-left:22px;  margin-bottom:5px;}
.level2_4_2{text-indent:-19px; padding-left:38px;  margin-bottom:5px;}
.level2_5{text-indent:-21px; padding-left:58px;  margin-bottom:5px;}
.level2_6{padding-left:38px;  margin-bottom:5px;}
.ctt_provision .bo_v_tit{font-size:26px;margin-bottom:40px !important;display:inline-block}


/* 이용/처리방침 리스트 */
.level-ul1{}
.level-ul1 li{margin:10px 0; padding-left:15px; text-indent:-15px;}
.level-ul1 li:before{content:''; display:inline-block; vertical-align:5px; margin-right:10px; width:6px; height:2px; background:#739b42;}
.level-ul1 li .in_li-tit{display:inline-block; padding-left:15px; width:calc(100% - 15px);}
.level-ul1 li ul li strong{margin:10px 0 5px;}

.level-ul2{margin-top:10px; margin-left:-15px;}
.level-ul2 li{position:relative; margin:5px 0; padding-left:10px; text-indent:-10px;}
.level-ul2 li:first-child{margin-top:0;}
.level-ul2 li:last-child{margin-bottom:0;}
.level-ul2 li:before{content:''; display:inline-block; vertical-align:4px; margin-right:5px; width:3px; height:3px; background:#474747; border-radius:20px;}



/*이미지 정렬박스*/
div [class^="img-box"] .con-img img{width:100%;max-width:100%}

.img-box2 .con-img{float:left;width:calc(50% - 5px);margin-right:10px;display:inline-block;}
.img-box2 .con-img:nth-child(2n){margin-right:0px}

.img-box3 .con-img{float:left;width:calc(33.333333% - 7px);margin-right:10px;display:inline-block;}
.img-box3 .con-img:nth-child(3n){margin-right:0px}
.img-box3 .con-img:nth-child(n+4){margin-top:10px}

.img-box4 .con-img{float:left;display:inline-block;width:calc(25% - 8px);margin-right:10px}
.img-box4 .con-img:nth-child(4n){margin-right:0px}
.img-box4 .con-img:nth-child(n+5){margin-top:10px}


/*왼쪽박스, 오른쪽박스 기본값*/
.left-box, .right-box{float:Left;display:inline-block;box-sizing:border-box;margin:10px auto;}
.left-box{width:30%;padding:10px}
.right-box{width:70%;padding-left:30px}
.left-box img, .right-box img{max-width:100% !important}


/*제목있는 박스 3x3*/
.wd-body{width:100%;display:inline-block;}
.wd-body .wd-box{float:left;display:inline-block;width:calc(33.33333% - 7px);margin:5px;box-sizing:border-box;}
.wd-body > .wd-box:first-child, .wd-body > .wd-box:nth-child(3n+1) {margin-left:0px}
.wd-body .wd-box:nth-child(3n){margin-right:0px}
.wd-body .wd-title{font-weight:bold;font-size:14px;text-align:center;background:#3f51b5;color:#fff;padding:15px 0;letter-spacing:-1px;border-radius:20px 20px 0 0}
.wd-body .wd-con{padding:20px;min-height:150px;background:#f1f1f1; border-radius:0 0 20px 20px}


.mo-none{display:block !important;}
.m-block, .pv-none{display:none !important;}

.aw-box3 {display:flex; align-items:center; }
.aw-box3 .abox{border:1px solid #ddd; border-radius:20px; padding:20px }

.aw-box6{display:flex;align-items: stretch; }
.aw-box6 .abox{display:flex;align-items: center; flex-direction: column; width:100%; border:1px solid #ddd; background:#fafafa; padding:20px;}
.aw-box6 .abox .con-txt{width:100%}
.aw-box6 .abox .con-tit{padding:10px}
.aw-box6 .arbox{width:100%; max-width:11px; margin:0 10px;    display: flex;    align-items: center;}

/*Responsive 370, 480, 768, 992, 1160*/
@media all and (max-width:768px){
	.aw-box5, .aw-box10{flex-direction: column;justify-content: center;}
	.aw-box5 .abox, .aw-box10 .abox {width:100%;margin:0 auto}
	.aw-box5 .arbox, .aw-box10 .arbox{margin:10px auto}
	.aw-box5 .arbox img, .aw-box10 .arbox img{-webkit-transform: rotate(90deg);-moz-transform: rotate(90deg);-o-transform: rotate(90deg);-ms-transform: rotate(90deg);transform: rotate(90deg);}

	.donation-info-box{flex-direction: column;gap:10px}
	.content-telbox{flex-direction: column;}
}


/*연혁*/
/*Responsive 370, 480, 768, 992, 1160*/
@media all and (max-width:480px){
	.year{margin-bottom:10px}
	.year:after{left:12px;top:40px}
	.con_wrap{padding-left:30px;margin:-3px 0 0 20px}

	.root_daum_roughmap{height:auto !important}
	.B06 .section-prinfo .ul1 li{font-size:15px;}
}


#bo_design .h1{line-height:160%;  margin-bottom:20px;position: relative; font-size:clamp(20px, 9vw, 26px); margin-top: 0;}
#bo_design .h2{position:relative; margin-bottom:15px;font-size:clamp(17px, 9vw, 22px); margin-top: 0;}
#bo_design .h3{position:relative; margin-bottom:10px;font-size:clamp(14px, 9vw, 18px); margin-top: 0;}

/*웹접근성 이미지 설명 누락 표시*/
/*img[alt=""]{border: 5px solid #c00;}*/
/*img:not([alt]){border: 5px solid #c00;}*/

/*콘텐츠 스타일*/


 #business_process {}

#business_process .con_wrap {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: 8rem 2.4rem;
}

#business_process .con_wrap .itm {
	position: relative;
	border: 1px solid var(--line-color);
	box-shadow: 0 24px 0 -16px rgba(0, 0, 0, 0.1);
}

#business_process .con_wrap .itm figure {
	height: 24rem;
	overflow: hidden;
	clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%);
}

#business_process .con_wrap .itm figure img {
	transition: 0.4s;
}

#business_process .con_wrap .itm:hover figure img {
	transform: scale(1.25);
}

#business_process .con_wrap .itm .txt {
	padding: 2.4rem 1.6rem;
}

#business_process .con_wrap .itm .txt strong {
	font-size: 2rem;
	font-weight: 600;
}

#business_process .con_wrap .itm .txt p {
	margin-top: 0.8rem;
	min-height: 6rem;
}

#business_process .con_wrap .itm .txt::after {
	content: attr(data-txt);
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%, 50%);
	display: inline-flex;
	align-items: center;
	height: 4rem;
	padding: 0 2.4rem;
	background: var(--primary-color);
	border-radius: 2rem;
	color: var(--white-color);
	font-weight: 700;
}



.table_responsive {
	overflow-x: auto;
}


.con-tbl tbody th{width:20%}


/*입소안내*/
div[class ^= 'aw-box'] { border-radius:20px; padding:0px 0; align-items: center; width:100%; gap:1vw}
div[class ^= 'aw-box'] > .abox{ padding:20px}
div[class ^= 'aw-box'] > .abox .con-img{margin-bottom:0px;}
div[class ^= 'aw-box'] > .abox:hover .con-img img{transform: scale(1.08); transition: transform 500ms cubic-bezier(0.165, 0.84, 0.44, 1) 0ms; cursor:pointer}

/* 위에서 작성한 CSS 코드를 여기에 붙여넣으세요 */
.aw-box5 { display: flex; justify-content: space-between; align-items: center; gap: 1vw; width: 100%; }
.aw-box5 .abox { flex: 1; display: flex; flex-direction: column; justify-content: center; align-items: center; background-color: #fafafa; border-radius:20px; min-width: 100px; padding:15px}
.aw-box5 .abox .con-img, .aw-box5 .abox .con-txt { flex: 1; display: flex; justify-content: center; align-items: center; width: 100%; }
.aw-box5 .abox .con-img img {}
.aw-box5 .con-txt { font-weight: bold; font-size: 1.1em; }
.aw-box5 .arbox { flex: 0 0 auto; }




.B01 .ab-box{    align-items: center;}


/*후원안내*/
/* #business_process ID 내부의 aw-box3 스타일 지정 */
 .aw-box4 .con-img{margin-bottom:20px;}
#business_process .aw-box4 {
    display: flex;
    justify-content: space-between;
    align-items: center; /* 화살표 및 박스 수직 중앙 정렬 */
    gap: 1vw; /* 박스 사이 간격 */
    width: 100%;
    flex-wrap: wrap;
}

/* 각 단계 박스 설정 */
#business_process .aw-box4 .abox {
    flex: 1; /* 4개의 박스가 공간을 균등하게 차지 */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #f8f8f8; /* 배경색 (필요시 수정) */
    border-radius: 10px;
    box-sizing: border-box;
    padding: 20px;
    min-width: 120px; /* 최소 너비 안전장치 */
}

/* 이미지와 텍스트 영역 높이 균등 분배 */
#business_process .aw-box4 .abox .con-img,
#business_process .aw-box4 .abox .con-txt {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

/* 이미지 사이즈 제어 */
#business_process .aw-box4 .abox .con-img img {
    object-fit: contain;
}

/* 텍스트 스타일 */
#business_process .aw-box4 .abox .con-txt {
    word-break: keep-all; /* 단어 단위 줄바꿈 */
    font-size: 1.1em; /* 글자 크기 조정 */
    font-weight: 600;
}

/* 화살표 박스 */
#business_process .aw-box4 .arbox {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

#business_process .aw-box4 .arbox img {
    max-width: 100%;
}

/* --- 모바일 반응형 (768px 이하) --- */
@media (max-width: 768px) {
    #business_process .aw-box4 {
        flex-direction: column; /* 세로 정렬 */
        gap: 20px;
    }

    #business_process .aw-box4 .abox {
        width: 100%;
        aspect-ratio: auto; /* 모바일에서는 높이 자동 (정사각형 해제) */
        padding: 20px 0;
        flex: none;
    }

    #business_process .aw-box4 .abox .con-img,
    #business_process .aw-box4 .abox .con-txt {
        flex: none; /* 높이 강제 해제 */
        padding: 5px 0;
    }

    /* 화살표 회전 */
    #business_process .aw-box4 .arbox img {
        transform: rotate(90deg);
    }
}


/*프로그램안내*/
/* 프로그램 섹션 전체 그리드 레이아웃 */
.program-grid {
    display: grid;
    /* 카드의 최소 너비를 280px로 설정하여 화면 크기에 따라 자동 줄바꿈 */
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px; /* 박스 간격 */
    margin-top: 30px;
}

/* 개별 박스 디자인 */
.pr-box {
    background: #fff;
    border: 1px solid #e1e1e1;
    border-radius: 15px; /* 둥근 모서리 */
    padding: 30px 20px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05); /* 살짝 떠있는 그림자 효과 */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: center; /* 내용 가운데 정렬 */
    text-align: center;
}

/* 마우스 올렸을 때 효과 */
.pr-box:hover {
    transform: translateY(-5px); /* 살짝 위로 올라감 */
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
    border-color: #3b82f6; /* 강조 색상 (원하는 테마색으로 변경 가능) */
}

/* 아이콘 감싸는 원형 박스 */
.pr-box .icon-wrap {
    width: 80px;
    height: 80px;
    background-color: #f0f7ff; /* 연한 파란 배경 */
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
}

/* 아이콘 스타일 */
.pr-box .icon-wrap i {
    font-size: 40px;
    color: var(--theme-color2); /* 아이콘 색상 (원하는 테마색으로 변경 가능) */
}

/* 제목 스타일 재정의 */
.pr-box .h3 {
    margin-bottom: 15px;
    font-size: 1.25rem;
    font-weight: 700;
    color: #333;
    border-bottom: 2px solid #f0f0f0;
    padding-bottom: 10px;
    width: 100%;
}

/* 리스트 스타일 커스텀 */
.pr-box .ul1 {
    text-align: left; /* 리스트 내용은 왼쪽 정렬 */
    width: 100%;
    margin: 0;
    padding-left: 0px;
/*    font-size: 1.6rem;*/
    color: #666;
    line-height: 1.6;
}

.pr-box .ul1 li {
    margin-bottom: 5px;
    list-style-type: none; /* 점 모양 불릿 */
}

.con-box, .con-txt{line-height:170%}

.B01 .ab-box .con-img{position:relative; border-radius:900px 400px 300px 500px; overflow:hidden; box-shadow: 0 7px 14px rgba(50, 50, 93, 0.1), 0 3px 6px rgba(0, 0, 0, 0.08); box-shadow: 0px 6px 15px 0px rgba(50, 50, 50, 0.4);}
.B01 .ab-box .con-img::after {
  content: "";
  position: absolute;
  inset: 0 0 0 0;
  z-index: 3;
  background: url('../images/pt-bg01.png');
}

.B01 .con-txt{line-height:240%}

.B03 .aw-box5 .con-img img,
.B09 .aw-box4 .con-img img,
.B11 .aw-box4 .con-img img { max-width:130px !important; max-height:104px !important; }

.B16 .con-tbl thead th{width:10%}







@media (max-width: 768px) {
	.sb-title2{font-size:clamp(1.2rem, 4vw, 1.8rem) !important;}

	.aw-box5 { flex-direction: column; gap: 15px; }
	.aw-box5 .abox { width: 80%; aspect-ratio: auto; padding: 15px; }
	.aw-box5 .arbox img { transform: rotate(90deg); }

	.B01 .ab-box{     flex-direction: column-reverse;}
	/*	.B01 .ab-box .con-img{max-height:200px; overflow:hidden; border-radius:0px;}*/
	.B01 .ab-box .con-img{display:none}

}