미디어위키:Common.css

.wikitable td {
    position: relative !important; /* 내부 요소 정렬 기준 */
    max-width: 100% !important;
    overflow: hidden !important;
    table-layout: fixed
}

.wikitable td table {
    width: 100% !important; /* 부모 td의 크기에 맞춤 */
    max-width: 100% !important;
}

.nob {
	margin-top: 4px;
	margin-bottom: 4px;
}

.ind {
	font-size: 14px;
	color : #4a4a4a;
	margin-left: 18px;
	margin-top: 4px;
	margin-bottom: 4px;
}

.nob2 {
	margin-top: -3px;
}

.mw-headline  #toc a {
  margin-right: 6px;
}

li > ul {
  margin-top: 2px !important;
  margin-bottom: 2px !important;
}

li > ul > li {
	  margin-top: 2px !important;
  margin-bottom: 2px !important;
}

.mw-parser-output > h2, h3 {
  margin-top: 32px !important;
}

h2 .mw-headline a[href="#toc"],
h3 .mw-headline a[href="#toc"],
h4 .mw-headline a[href="#toc"] {
  margin-right: 5px;
}

/* =========================================================
   사용자 정의 펼치기 · 접기
   ========================================================= */

/* =========================================================
   Animated Collapse / Expand
   MediaWiki:Common.css
   ========================================================= */


/* ---------------------------------------------------------
   1. 펼치기 / 접기 버튼
   --------------------------------------------------------- */

.animated-toggle {
    display: block;
    width: 100%;

    box-sizing: border-box;

    cursor: pointer;
    user-select: none;

    text-align: center;

    outline: none;

    transition:
        opacity 0.2s ease,
        background-color 0.2s ease;
}


/* 마우스 오버 */
.animated-toggle:hover {
    opacity: 0.75;
}


/* 키보드 접근성 */
.animated-toggle:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}


/* ---------------------------------------------------------
   2. 펼쳐지는 전체 영역
   --------------------------------------------------------- */

.animated-content {
    display: grid;

    /*
     * 닫힌 상태
     *
     * 0fr → 높이 0
     */
    grid-template-rows: 0fr;

    opacity: 0;

    transform: translateY(-8px);

    visibility: hidden;

    /*
     * 애니메이션
     */
    transition:
        grid-template-rows 0.4s cubic-bezier(0.4, 0, 0.2, 1),
        opacity 0.3s ease,
        transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
        visibility 0s linear 0.4s;
}


/* ---------------------------------------------------------
   3. 실제 내용 영역
   --------------------------------------------------------- */

.animated-content-inner {
    min-height: 0;

    overflow: hidden;

    /*
     * 일부 브라우저에서 큰 표 / 이미지가
     * 펼쳐질 때 생기는 레이아웃 문제 방지
     */
    min-width: 0;
}


/* ---------------------------------------------------------
   4. 열린 상태
   --------------------------------------------------------- */

.animated-content.is-open {
    /*
     * 0fr → 1fr
     *
     * 내용의 실제 높이에 맞춰 자동으로 펼쳐짐
     */
    grid-template-rows: 1fr;

    opacity: 1;

    transform: translateY(0);

    visibility: visible;

    transition:
        grid-template-rows 0.4s cubic-bezier(0.4, 0, 0.2, 1),
        opacity 0.3s ease,
        transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
        visibility 0s linear 0s;
}


/* ---------------------------------------------------------
   5. 펼치기 안에 들어가는 이미지
   --------------------------------------------------------- */

.animated-content img {
    max-width: 100%;
}


/* ---------------------------------------------------------
   6. 펼치기 안에 들어가는 표
   --------------------------------------------------------- */

.animated-content table {
    max-width: 100%;
}


/* ---------------------------------------------------------
   7. 중앙 정렬 유틸리티
   --------------------------------------------------------- */

.text-center {
    text-align: center;
}


/* ---------------------------------------------------------
   8. 사용자가 OS에서 애니메이션 감소를 설정한 경우
   --------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {

    .animated-toggle,
    .animated-content {
        transition: none !important;
    }

}