/* pg97 회사개요 전용 — 공통 규칙(jungshin.css) 위에 얹는다.
   회사소개서 2페이지: 5개 원 + 각 원의 설명. 면은 옅게, 글자는 기준색. */

.co-nodes{list-style:none;margin:0;padding:0 0 88px;position:relative}

/* 5개를 잇는 세로 레일 — 옅은 농도만 */
.co-nodes::before{
  content:"";position:absolute;left:179px;top:38px;bottom:124px;width:2px;
  background:linear-gradient(180deg,var(--t1),var(--t5));
  border-radius:2px;
}

.co-node{
  display:grid;grid-template-columns:360px 1fr;gap:56px;align-items:start;
  padding:36px 0;border-top:1px solid var(--jn-line);
}
.co-node:first-child{border-top:0}

/* 좌측 타원 — 회사소개서의 동그라미 */
.co-oval{
  position:relative;z-index:1;
  display:flex;align-items:center;justify-content:center;text-align:center;
  min-height:124px;padding:26px 30px;border-radius:999px;
  background:var(--tone);
  border:1px solid rgba(19,74,142,.13);
}
.co-oval-title{
  font-size:19px;font-weight:800;line-height:1.42;letter-spacing:-.012em;
  margin:0;color:var(--jn-primary);
}

.co-n1 .co-oval{--tone:var(--t1)}
.co-n2 .co-oval{--tone:var(--t2)}
.co-n3 .co-oval{--tone:var(--t3)}
.co-n4 .co-oval{--tone:var(--t4)}
.co-n5 .co-oval{--tone:var(--t5)}

/* 우측 설명 — 회사소개서 문구 그대로 */
.co-body{padding-top:8px}

/* ONE-STOP처럼 불릿 없이 통문장인 경우 */
.co-para{
  font-size:16px;line-height:1.85;color:var(--jn-body);margin:0 0 14px;
  padding-left:18px;position:relative;
}
.co-para:last-child{margin-bottom:0}
.co-para::before{
  content:"";position:absolute;left:0;top:3px;bottom:5px;width:3px;border-radius:2px;
  background:var(--jn-primary);opacity:.2;
}

@media (max-width:1100px){
  .co-node{grid-template-columns:290px 1fr;gap:38px}
  .co-nodes::before{left:144px}
  .co-oval-title{font-size:17px}
}
@media (max-width:820px){
  .co-nodes{padding-bottom:54px}
  .co-nodes::before{display:none}
  .co-node{grid-template-columns:1fr;gap:18px;padding:26px 0}
  .co-oval{min-height:0;padding:18px 24px;border-radius:14px;justify-content:flex-start;text-align:left}
  .co-oval-title{font-size:18px}
  .co-para{font-size:15.5px}
}