/* 상단 타이틀 */
.history-head{
  text-align:center;
  margin-bottom:60px;
}
.history-head h2{
  font-family:var(--scFont);
  font-size:40px;
  font-weight:700;
  margin:0 0 24px;
}
.history-head p{
  font-family:var(--scFont);
  font-size:20px;
  font-weight:500;
  color:#333;
  margin:0;
}

/* ===== 타임라인 공통 ===== */
#milestone{
  padding:60px 16px 80px;
}
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	.org-wrap{
        max-width:1200px;
        margin:0 auto;
    }

    /* 공통 카드 스타일 */
    .org-card{
        background:#ffffff;
        border-radius:14px;
        box-shadow:0 8px 20px rgba(15,23,42,0.06);
        padding:12px 20px;
        text-align:center;
        border:1px solid rgba(148,163,184,0.5);
    }
    .org-title{
        font-size:14px;
        letter-spacing:0.08em;
        color:#64748b;
        margin:0 0 4px;
    }
    .org-name{
        font-size:18px;
        font-weight:800;
        margin:0;
    }

    /* 상단: 대표이사 / 사장 */
    .org-top{
        display:flex;
        flex-direction:column;
        align-items:center;
        gap:16px;
        margin-bottom:20px;
    }
    .org-ceo{
        min-width:220px;
        border-top:4px solid #0f766e;
    }
    .org-president{
        min-width:220px;
        border-top:4px solid #2563eb;
    }

    /* 사장 아래 영역(연결선 + 부서) */
.org-bottom{
    position:relative;
    max-width:1200px;   /* 또는 100% 로 해도 됨 */
    margin:0 auto;
    padding-top:20px;
}

    /* 사장 → 가로선 중앙 세로선 (연한 회색) */
    .org-line-down{
        position:absolute;
        top:-20px;                 /* org-bottom 위로 60px 올라가서 사장 카드와 만남 */
        left:50%;
        width:2px;
        height:20px;
        background:#c6c6c6;
        transform:translateX(-50%);
    }

    /* 가로 연계선 (연한 회색) */
    .org-mid-line{
        position:absolute;
        top:0;                     /* org-bottom의 가장 위 */
        left:50%;
        width:100%;
        height:2px;
        background:#c6c6c6;
        transform:translateX(-50%);
    }

    /* 부서 레이아웃 */
    .org-dept-row{
        margin-top:0;              /* 패딩이 이미 들어있으므로 0 */
        display:flex;
        flex-wrap:wrap;
        justify-content:center;
        column-gap:24px;
        row-gap:18px;
    }

    .org-dept{
        position:relative;         /* ::before 세로선 기준 */
        flex:1 1 200px;
        min-width:200px;
        max-width:220px;
        display:flex;
        flex-direction:column;
        gap:6px;
        align-items:stretch;
    }

    /* 가로선에서 각 부서 헤더로 내려오는 검은 세로선 */
    .org-dept::before{
        content:"";
        position:absolute;
        top:-20px;                 /* org-bottom top(가로선)에서 내려오는 길이 */
        left:50%;
        width:2px;
        height:20px;
        background:#c6c6c6;
        transform:translateX(-50%);
        border-radius:999px;
    }

    .org-dept-header{
        padding:10px 12px;
		margin-bottom:10px;
        border-radius:15px;
        font-size:15px;
        font-weight:700;
        color:#ffffff;
        text-align:center;
    }

    .dept-rnd      { background:#0ea5e9; } /* R&D */
    .dept-mgmt     { background:#22c55e; } /* 경영관리부 */
    .dept-sales    { background:#f97316; } /* 영업부 */
    .dept-prod     { background:#6366f1; } /* 생산부 */
    .dept-quality  { background:#ec4899;} /* 품질보증부 */

    .org-dept-body{
        background:#ffffff;
        border-radius:16px;
        padding:10px 14px 14px;
        box-shadow:0 5px 14px rgba(15,23,42,0.06);
        border:1px solid rgba(148,163,184,0.4);
        text-align:left;
        min-height:170px;
    }
    .org-dept-body ul{
        margin:0;
        padding-left:18px;
        font-size:14px;
        line-height:1.6;
        color:#4b5563;
    }

    /* 반응형 */
    @media (max-width:900px){
        .org-bottom{max-width:100%;}
    }
@media (max-width:720px){
    .org-dept-row{
        flex-direction:column;   /* 세로 정렬 */
        align-items:stretch;
        column-gap:0;
        row-gap:18px;
    }
    .org-dept{
        flex:1 1 100%;           /* 한 줄에 하나 */
        min-width:0;
        max-width:none;          /* 가로 꽉 채우기 */
    }
    /* ▼ 스마트폰에서는 세로 연결선 숨기기 */
    .org-dept::before{
        display:none;
    } 
	.org-line-down{
        display:none;
    }
	
	.org-mid-line{
        display:none;
    }
	
	 
}


	
@media (max-width: 768px){

	.history-head{
		padding-bottom:10px;
	}
	.history-head h2{
        font-size:24px;
	}
    .history-head p{
        font-size:16px;
    }
	
}