.vol_info_wrap{
	display:flex;
	align-items:center;
	justify-content:space-between; /* 이거 추가 */
	flex-wrap:wrap;
	padding:0; margin:0; background:#f2f7fd;
    border-radius:0.5rem 75px 0.5rem 0.5rem;
}
.vol_info_wrap .vol_info{
	width:55%;
	display:block;
	padding:35px 0 35px 40px; margin:0;
}
.vol_info_wrap .vol_info .v_txt{
	font-size:clamp(16px, 2.3vw, 21px);
	padding:0 0 10px;
}
.vol_info_wrap .vol_img{
	width:42%;
	display:block;
	padding:0; 
    margin:0;
}
.vol_info_wrap .vol_img img{
	max-width:100%; 
    width:100%; 
    display:block;
	border-radius:0px 75px 0.5rem 0px;
}

@media( max-width:768px ){
	.vol_info_wrap .vol_info{width:100%; padding:50px 45px 40px;}
	.vol_info_wrap .vol_img{width:100%; margin:0 auto;}
	.vol_info_wrap .vol_img img{border-radius:0px 0px 0.5rem 0.5rem;}
}
@media( max-width:480px ){
	.vol_info_wrap .vol_info{padding:40px 40px 30px;}
}


/* =========================================================
   사업단 리스트 : 내용(좌) + 이미지(우)  ── float → flex 전환
   ========================================================= */
.biz_li_wrap {
  display: block;
  padding: 0;
  margin: 0;
  list-style: none;
  border: 1px solid #ddd;
  border-radius: 1rem;
  overflow: hidden; /* 자식이 모서리 밖으로 나가지 않도록 */
}

.biz_li_wrap li {
  display: flex;
  align-items: center;   /* 세로 가운데 정렬. 위쪽 정렬을 원하면 flex-start */
  padding: 2.5rem 3rem 2.5rem 4rem;
  margin: 0;
}

/* li가 여러 개일 때 구분선 */
.biz_li_wrap li + li {
  border-top: 1px solid #eee;
}

/* 왼쪽 : 텍스트 영역 */
.biz_li_wrap li .box_txt {
  flex: 1 1 auto;
  min-width: 0;          /* 긴 텍스트가 넘칠 때 줄어들 수 있게 */
  padding: 0 2rem 0 0;
}

/* 제목 앞 점 마커 (필요 없으면 h4 관련 3블록 삭제) */
.biz_li_wrap li .box_txt h4 {
  position: relative;
  padding: 0 0 0 18px;
  margin: 0 0 1.2rem;
  font-size: clamp(18px, 2.2vw, 22px);
  line-height: 1.4;
  word-break: keep-all;
}

.biz_li_wrap li .box_txt h4::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.65em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--main-color);
}

.biz_li_wrap li .box_txt .biz_info {
  padding:15px 0 0;
}

/* 오른쪽 : 이미지 영역 */
.biz_li_wrap li .box_img {
  flex: 0 0 45%;
  max-width: 45%;
  padding: 0 0 0 2rem;
  margin: 0;
}

.biz_li_wrap li .box_img img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 0.5rem;
  transition: box-shadow 0.3s ease;
}

.biz_li_wrap li .box_img .alguide {
  color:#777;
  font-size:clamp(12px, 1.5vw, 15px);
  padding:10px 0 0;
}

.biz_li_wrap li p {
  border-bottom: 1px dashed #ddd;
  padding: 5px 0;
  margin: 5px 0;
  line-height: 1.6;
  word-break: keep-all;
}

.biz_li_wrap li p:last-child {
  border-bottom: none;
}

.biz_li_wrap li p .info {
  padding: 0 0 0 29px;
  margin: 0;
  position: relative;
  display: inline-block;
  font-size: clamp(14px, 1.8vw, 17px);
}

.biz_li_wrap li p .info i {
  position: absolute;
  width: 20px;
  height: 20px;
  left: 0;
  top: 4px;
  color: var(--main-color);
  font-size: 20px !important;
}

/* 태블릿 가로 (769px ~ 1024px) */
@media (max-width: 1024px) and (min-width: 769px) {
  .biz_li_wrap li {
    padding: 2rem 2.5rem;
  }

  .biz_li_wrap li .box_txt {
    padding: 0 2.2rem 0 0;
  }

  .biz_li_wrap li .box_img {
    flex: 0 0 38%;
    max-width: 38%;
    padding: 0 0 0 2.2rem;
  }

  .biz_li_wrap li p .info {
    padding: 0 0 0 22px;
  }
}

/* 태블릿 세로 이하 (768px 이하) : 세로로 쌓기 */
@media (max-width: 768px) {
  .biz_li_wrap li {
    flex-direction: column;
    align-items: stretch;
    padding: 2rem;
  }

  .biz_li_wrap li .box_txt {
    padding: 0;
  }

  .biz_li_wrap li .box_img {
    flex: 0 0 auto;
    max-width: 100%;
    padding: 1.5rem 0 0;
  }

  .biz_li_wrap li p {
    padding: 8px 0;
    margin: 8px 0;
  }

  .biz_li_wrap li p .info {
    padding: 0 0 0 24px;
    font-size: 15px;
  }

  .biz_li_wrap li p .info i {
    top: 4px;
  }
}

/* 모바일 세로 (최대 480px) */
@media (max-width: 480px) {
  .biz_li_wrap li {
    padding: 1.6rem 1.4rem;
  }

  .biz_li_wrap li .box_txt h4 {
    padding: 0 0 0 15px;
    margin: 0 0 0.9rem;
  }

  .biz_li_wrap li .box_txt h4::before {
    width: 7px;
    height: 7px;
  }

  .biz_li_wrap li p {
    padding: 7px 0;
    margin: 7px 0;
  }

  .biz_li_wrap li p .info {
    padding: 0 0 0 22px;
    font-size: 14px;
  }

  .biz_li_wrap li p .info i {
    width: 14px;
    height: 14px;
    font-size: 13px !important;
    top: 3px;
  }
}

/* 매우 작은 모바일 (최대 360px) */
@media (max-width: 360px) {
  .biz_li_wrap li {
    padding: 1.4rem 1.1rem;
  }

  .biz_li_wrap li p {
    padding: 6px 0;
    margin: 6px 0;
  }

  .biz_li_wrap li p .info {
    padding: 0 0 0 20px;
    font-size: 13px;
  }

  .biz_li_wrap li p .info i {
    width: 13px;
    height: 13px;
    font-size: 12px !important;
    top: 2px;
  }
}

.biz_li_wrap2 {
  display: flex;
  flex-wrap: wrap;
  padding: 0; 
  margin: 0;
  gap: 10px;
  list-style: none; /* 웹접근성: 리스트 스타일 명시 */
}

.biz_li_wrap2 li {
  flex: 0 0 100%; 
  overflow: hidden;
  display: block;
  padding: 0; 
  margin: 0;
  transition: transform 0.3s ease;
}

.biz_li_wrap2 li:hover {
  transform: translateY(-5px);
}

.biz_li_wrap2 li .biz_img {
  width: 47%;
  float: left;
  display: block;
  padding: 0;
  margin: 0;
}

.biz_li_wrap2 li .biz_img img {
  width: 100%; /* 반응형: 이미지 크기 조절 */
  height: auto; /* 반응형: 비율 유지 */
  border-radius: 20px;
  display: block; /* 이미지 하단 공백 제거 */
}

.biz_li_wrap2 li:hover img {
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
}

.biz_li_wrap2 li .biz_txt {
  width: 47%;
  float: right;
  display: block;
  padding: 20px 0 0;
  margin: 0;
}

/* 태블릿 (768px 이하) */
@media (max-width: 768px) {
  .biz_li_wrap2 {
    gap: 15px;
  }
  
  .biz_li_wrap2 li .biz_img {
    width: 40%;
  }
  
  .biz_li_wrap2 li .biz_txt {
    width: 55%;
    padding: 10px 0 0;
  }
}

/* 모바일 (576px 이하) */
@media (max-width: 576px) {
  .biz_li_wrap2 {
    gap: 20px;
  }
  
  .biz_li_wrap2 li .biz_img,
  .biz_li_wrap2 li .biz_txt {
    width: 100%;
    float: none;
  }
  
  .biz_li_wrap2 li .biz_txt {
    padding: 15px 0 0;
  }
  
  .biz_li_wrap2 li:hover {
    transform: translateY(-3px); /* 모바일에서 호버 효과 감소 */
  }
}

/* 터치 디바이스 접근성 개선 */
@media (hover: none) {
  .biz_li_wrap2 li:hover {
    transform: none;
  }
  
  .biz_li_wrap2 li:active {
    transform: translateY(-3px);
  }
}