---
{"id":"accordion","title":"아코디언","category":"컴포넌트","order":46,"summary":"필수가 아닌 긴 보조 내용을 점진적으로 공개의 사용·상태·접근성 계약.","status":"문서 기준 · UI 미검증","references":["components/accordion/usage"]}
---

# 아코디언

## 목적과 사용

필수가 아닌 긴 보조 내용을 점진적으로 공개에 사용합니다. 반드시 모두 읽어야 하는 위험·가격·동의 내용을 숨기지 않습니다.

## 구성과 변형

제목 버튼, 열림 표시, 연결된 내용. 변형의 외형은 각 제품의 기존 [토큰](tokens.md)을 사용합니다. Carbon의 크기·색·모서리·아이콘을 가져오지 않습니다.

## 동작 규칙

- ACC-01 MUST: 제목만 읽어도 안의 내용을 예상할 수 있어야 합니다.
- ACC-02 MUST: 실제 열림 상태와 aria-expanded가 일치합니다.
- ACC-03 SHOULD: 여러 항목 동시 열기 여부를 작업 성격에 맞게 정합니다.
- ACC-04 MUST: 접힌 필드에 오류가 있으면 사용자가 발견·이동할 수 있게 합니다.

## 접근성

제목은 button, 내용과 aria-controls로 연결하고 Enter/Space를 지원합니다. 공통 [접근성 기준](accessibility.md)도 함께 적용합니다.

## 콘텐츠 예시

좋음: 선택적 고급 설정 설명 / 피함: 추가 요금 조건을 기본 접힘에만 둠.

## 우리 구현과 연결

현재 제품별 구현 위치는 추가 조사 대상입니다. 필수 조건 공개 규칙은 공통입니다.

제품별 소유 경로는 [WICKEDVPS](product-vps.md), [Panel](product-panel.md), [Blesta](product-blesta.md)와 [소스 근거](source-evidence.md)를 확인합니다. 코드 존재와 모든 사용처의 준수는 다르며, 별도 표시가 없는 제품별 준수 상태는 미검증입니다.

## 상태와 검증

열기/닫기·직접 링크·접힌 오류·긴 제목·인쇄를 확인합니다.

일반·hover·focus·실행 중·실패·성공·disabled·read-only 중 해당하는 상태를 기록합니다. 해당하지 않는 상태를 임의로 만들지 말고 이유를 남깁니다. [검증 체크리스트](testing.md)에 증거를 연결합니다.