
/* ****************** HTML 편집기  ****************** */

.html_459881_ {overflow:hidden;}
.html_459881_:after {content:''; display:block; clear:both;}

    /* — 리셋 — */
    * { margin:0; padding:0; box-sizing:border-box }
    body {
      font-family:"Nanum Gothic",sans-serif;
      background:#f4f4f4;
      color:#333;
      line-height:1.5;
    }
    img { display:block; max-width:100%; height:auto }

    /* — 컨테이너 — */
    .container {
      max-width:1000px;
      margin:40px auto;
      padding:0 20px;
    }

    /* — 헤더 — */
    .history-header {
      text-align:center;
      margin-bottom:40px;
    }
    .history-header img {
      width:100%; max-width:1400px;
    }
    .history-header h2 {
      font-size:2.5rem;
      margin:20px 0 8px;
    }
    .history-header p {
      color:#666;
      margin-bottom:40px;
    }
    .history-header .now-badge {
      display:inline-block;
      background:#333;
      color:#fff;
      padding:16px 24px;
      border-radius:50%;
      font-size:1rem;
      margin-bottom:60px;
    }

    /* — 타임라인 전체 + 세로축 — */
    .timeline {
      position:relative;
      padding-bottom:40px;
    }
    .timeline::before {
      content:"";
      position:absolute;
      left:50%;
      top:0;
      bottom:0;
      width:2px;
      background:#00834A;
      transform:translateX(-50%);
      z-index:1;
    }

    /* — 타임라인 아이템 (3열 그리드) — */
    .timeline-item {
      display:grid;
      grid-template-columns:1fr 40px 1fr;
      column-gap:16px;
      align-items:flex-start;
      margin-bottom:80px;
      position:relative;
      z-index:2;
    }
    .timeline-item:last-child {
      margin-bottom:0;
    }

    /* — 축(axis): 동그라미 + 세로선 + 수평선 — */
    .timeline-item .axis {
      grid-column:2;
      display:flex;
      flex-direction:column;
      align-items:center;
    }
    .axis .dot {
      width:12px; height:12px;
      border:2px solid #00834A;
      border-radius:50%;
      background:#f4f4f4;
      position:relative;
      z-index:2;
    }
    .axis .dot::after {
      content:"";
      position:absolute;
      left:50%;
      top:50%;
      transform:translate(6px,-50%);
      width:60px; height:2px;
      background:#DDD;
    }
    .axis .line {
      flex:1;
      width:2px;
      background:#00834A;
      margin-top:4px;
    }

    /* — 콘텐츠 (연도/텍스트/이미지) — */
    .timeline-item .content {
      display:flex;
      flex-direction:column;
      gap:12px;
      max-width:400px;
    }
    .content h3 {
      font-size:1.25rem;
      color:#00834A;
    }
    .content p {
      font-size:0.95rem;
      color:#444;
      line-height:1.4;
    }

    /* — 왼쪽 아이템 — */
    .timeline-item.left .content {
      grid-column:1;
      text-align:right;
      padding-right:24px;
    }
    /* — 오른쪽 아이템 — */
    .timeline-item.right .content {
      grid-column:3;
      text-align:left;
      padding-left:24px;
    }

    /* — 반응형 (≤768px) — */
    @media(max-width:768px) {
      .timeline { padding-left:20px; }
      .timeline::before { left:20px; }

      .timeline-item {
        display:block;
        margin-bottom:60px;
      }
      .timeline-item .axis {
        position:absolute;
        left:20px;
        top:0;
        flex-direction:row;
        gap:8px;
      }
      .axis .line,
      .axis .dot::after {
        display:none;
      }
      .timeline-item .content {
        padding:32px 0 0 40px !important;
        text-align:left !important;
      }
    }
  
/* ****************** 년도 월 연혁  ****************** */

.history_313108_ {  }
.history_313108_:after { content: ''; display: block; clear: both; }
.history_313108_ dl { position: relative; }
.history_313108_ dt, .history_313108_ dd { margin: 0; }
.history_313108_ dt { color: #0256d0; font-size: 20px; font-weight: bold; margin-bottom: 10px; }
.history_313108_ dd p { position: relative;  margin: 0 0 7px 0; padding-left: 50px; font-size: 10.5pt; line-height: 1.3em; }
.history_313108_ dd p strong { display: block; position: absolute; top: 0; left: 0; float: left; width: 40px; }

@media (min-width:1023px){
	.history_313108_ dt { position: absolute; top: 0; left: 0; width: 80px; float: left; }
	.history_313108_ dd { position: relative; margin-left: 90px; }
}
@media \0screen{
	
}

/* ****************** 연혁내용  ****************** */

.history__52214__ {margin-bottom:5px;}
.history__52214__ .date__52214__ {font-size:14px; font-weight:bold; color:#000000;}
.history__52214__ .cont__52214__ {margin-top:5px; font-size:13px; color:;}

@media all and (min-width:1024px){
	.history__52214__ {margin-bottom:10px;}
	.history__52214__:after {content:''; display:block; clear:both;}
	.history__52214__ .date__52214__ {float:left; width:100px;}
	.history__52214__ .cont__52214__ {overflow:hidden; margin-top:0; font-size:14px;}
}
