Components

Accordion

긴 내용을 접어서 제공합니다. 제목 행을 누르면 펼쳐집니다.

전송 링크는 얼마나 유효한가요?
발급 시점부터 30일간 유효하며, 만료 시 재발급할 수 있습니다.
파일은 어디에 보관되나요?
…
코드 보기
<div class="tn-acc">
  <details><summary>질문</summary><div class="bd">답</div></details>
</div>

Variants

이름설명미리보기
기본+/− 인디케이터
질문
단독 열림한 번에 하나만 (name 속성)
열린 항목
내용

Guidelines

✓ Do
  • 네이티브 details/summary 기반 (JS 불필요)
  • 제목은 질문형·명사형 한 줄
✕ Don't
  • 아코디언 안에 아코디언 금지
  • 필수 정보를 접어두지 않는다

Specification

속성토큰/값비고
행 패딩0.75rem 1rem
인디케이터+/− 텍스트