@charset "utf-8";

/* 레이아웃 개선: CSS Grid를 사용하여 2단 배치 적용 */
.program-wrap {
    margin-top: 35px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 35px; /* 박스 사이 간격 설정 */
}

.program-card {
    border: 1px solid #dfe7e3;
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 5px 15px rgba(0,0,0,.05);
}

.program-head {
    display: flex;
    align-items: center;
    padding: 18px 28px;
    background: linear-gradient(90deg, #0b8d5e, #37b07c);
}

.program-head .num {
    width: 42px;
    height: 42px;
    line-height: 42px;
    text-align: center;
    border-radius: 50%;
    background: #fff;
    color: #0b8d5e;
    font-size: 18px;
    font-weight: 700;
    margin-right: 18px;
}

.program-head h3 {
    margin: 0;
    color: #fff;
    font-size: 22px;
    font-weight: 700;
}

.program-body {
    padding: 30px;
}

.program-body dl {
    display: flex;
    margin: 0;
    padding: 18px 0;
    border-bottom: 1px dashed #e4e4e4;
}

.program-body dl:last-child {
    border-bottom: 0;
}

.program-body dt {
    width: 120px;
    flex-shrink: 0;
    font-weight: 700;
    color: #0b8d5e;
    font-size: 16px; /* 폰트 크기 조정 */
}

/* 선명도 및 가독성 개선 */
.program-body dd {
    flex: 1;
    margin: 0;
    color: #333; /* 기존 #555에서 좀 더 짙게 변경하여 가독성 확보 */
    line-height: 1.7;
    font-size: 16px; /* 워드 10~12pt 수준에 맞는 16px로 키움 */
    word-break: keep-all; /* 한글 단어 단위 줄바꿈 방지 */
}

.program-body ul {
    margin: 0;
}

.program-body li + li {
    margin-top: 10px;
}

/* 모바일 화면 대응 (768px 이하에서는 1단으로 변경) */
@media(max-width:768px) {
    .program-wrap {
        grid-template-columns: 1fr; /* 1단 구성 */
        gap: 20px;
    }

    .program-head {
        padding: 15px 20px;
    }

    .program-head h3 {
        font-size: 20px;
    }

    .program-body {
        padding: 20px;
    }

    .program-body dl {
        display: block;
    }

    .program-body dt {
        width: auto;
        margin-bottom: 8px;
    }
}