Components · Disclosure

Accordion

여러 개의 펼침 항목. native <details> + 원형 + → × 아이콘. 항목 사이는 hairline divider, 인라인 보더 금지.

Preview

비개발자도 따라갈 수 있나요?

네. 수료생의 약 70%가 비개발 직무입니다. 기획자·운영자·디자이너·리서처를 우선 고려해 커리큘럼이 설계되었습니다.

전 회차 출석이 어렵습니다.

사전 신청 시 회차당 2회까지 온라인 참여가 가능합니다. 모든 회차는 녹화본을 제공합니다.

수강료 환불 정책이 궁금합니다.

1주차 종료 후 자율 환불 가능합니다.

Usage

<div class="accordion">
  <details>
    <summary>질문 텍스트<span class="acc-icon"></span></summary>
    <div class="acc-body">
      <p class="t-body">답변 본문.</p>
    </div>
  </details>
</div>

Rules

DO

native <details> 사용 — JS 의존 없음, 키보드 접근성 자동.
아이콘은 원형 + 회전(+ → ×).
3개 이상 묶을 때 사용 — 1~2개면 Collapse 권장.

DON'T

JS로 직접 toggle 구현 금지.
아이콘 라운드 사각형 금지 — 원형만.