@charset "UTF-8";
/* ==========================================================================
   autobase — 회사소개 (데스크톱, 시안 1920px)
   ※ @media 는 m.company.css 에만.
   ========================================================================== */

/* 섹션 공통 제목 (센터) */
.co-sec-title { font-size: 48px; font-weight: 600; line-height: 1.3; text-align: center; }

/* ── 인트로 ──────────────────────────────────────────────────────────── */
.co-intro { margin-top: 140px; }
.co-intro__title { font-size: 64px; font-weight: 700; line-height: normal; }
.co-intro__desc { margin-top: 32px; font-size: 20px; line-height: 1.5; }

/* ── 기술이 경쟁력입니다 ─────────────────────────────────────────────── */
.co-greet { margin-top: 140px; }
.co-greet__box {
  position: relative;
  height: 650px;
  border-radius: 50px;
  overflow: hidden;
}
.co-greet__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
}
/* 하단 325px 아래로 갈수록 짙어지는 검정 30% */
.co-greet__box::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 1;
  width: 100%;
  height: 50%;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, #000 100%);
  opacity: .3;
}
.co-greet__copy {
  position: absolute;
  left: 80px;
  top: 369px;
  z-index: 2;
  color: #fff;
}
.co-greet__title { font-size: 48px; font-weight: 600; line-height: normal; }
.co-greet__copy p { font-size: 16px; line-height: 1.5; }
.co-greet__title + p { margin-top: 32px; }
.co-greet__copy p + p { margin-top: 16px; }

/* ── 01~04 소개 ──────────────────────────────────────────────────────── */
.co-about { margin-top: 140px; }
.co-about__inner {
  display: flex;
  justify-content: space-between;
  gap: 80px;
}
.co-about__visual {
  flex: 0 0 467px;
  height: 550px;
  border-radius: 30px;
  overflow: hidden;
  background: #000;
}
.co-about__visual img { width: 100%; height: 100%; object-fit: cover; object-position: center bottom; }

.co-about__list { flex: 1 1 auto; min-width: 0; border-top: 1px solid var(--brand); }
/* 라인 간격 275px = padding 40+39 + 콘텐츠 195 + border 1. 텍스트는 좌우 32px 들여쓰기 */
.co-about__item { padding: 40px 32px 39px; border-bottom: 1px solid rgba(30, 58, 138, .3); }
.co-about__no { display: block; font-size: 16px; font-weight: 500; font-style: normal; line-height: 1.3; color: #185fe4; }
.co-about__title { margin-top: 10px; font-size: 32px; font-weight: 600; line-height: 1.3125; }
.co-about__desc { margin-top: 32px; font-size: 16px; line-height: 1.5; color: #333; }

/* ── VISION & MISSION ────────────────────────────────────────────────── */
.co-vm { margin-top: 140px; padding: 140px 0; background: #f8f8f8; }

.co-vm__diagram { position: relative; height: 400px; margin-top: 80px; }
.co-vm__circle { position: absolute; top: 0; width: 400px; height: 400px; }
/* 흰 배경(z1)과 파란 테두리(z2)를 분리 — 겹친 원의 교차 라인이 모두 보이게 (시안 Union 구조) */
.co-vm__circle::before,
.co-vm__circle::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
}
.co-vm__circle::before { z-index: 1; background: #fff; }
.co-vm__circle::after { z-index: 2; border: 1px solid var(--brand); }
.co-vm__circle--vision { left: 0; }
.co-vm__circle--mission { left: 372px; }
.co-vm__circle--goal { left: 1000px; }
.co-vm__circle--goal::before { background: var(--brand); }

.co-vm__txt {
  position: absolute;
  inset: 0;
  z-index: 3;
  padding-top: 115px;
  text-align: center;
}
.co-vm__circle--goal .co-vm__txt { color: #fff; }
.co-vm__label { display: block; font-size: 14px; font-weight: 500; font-style: normal; line-height: 17px; color: var(--brand); }
.co-vm__label::after {
  content: "";
  display: inline-block;
  width: 2px;
  height: 2px;
  margin-left: 3px;
  border-radius: 50%;
  background: currentColor;
}
.co-vm__circle--goal .co-vm__label { color: #fff; }
.co-vm__title { margin-top: 4px; font-size: 24px; font-weight: 600; line-height: 1.3; }
.co-vm__desc { margin-top: 16px; font-size: 16px; line-height: 1.5; }
.co-vm__circle--goal .co-vm__desc { padding: 0 50px; }

/* MISSION → Goal 화살표 (시안 에셋: 라인 197 + 이중원 점) */
.co-vm__arrow {
  position: absolute;
  left: 772px;
  top: 192px;
  z-index: 3;
  width: 212px;
  height: 16px;
  background: url('../../images/icons/vm-arrow.svg') center / contain no-repeat;
}

/* ── 연혁 ────────────────────────────────────────────────────────────── */
.co-his { margin-top: 140px; }
.co-his__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 40px;
}
.co-his__title { font-size: 48px; font-weight: 600; line-height: 1.3; }
.co-his__nav { display: flex; gap: 32px; }

.co-his__timeline { position: relative; margin-top: 80px; }
/* 연도 아래 컨테이너 풀폭 라인 — 슬라이더와 무관하게 고정 */
.co-his__timeline::before {
  content: "";
  position: absolute;
  left: 0;
  top: 58px;
  width: 100%;
  height: 1px;
  background: var(--brand);
}
.co-his__slider { overflow: hidden; }
.co-his__slide { width: 450px; }
.co-his__period { font-size: 32px; font-weight: 500; line-height: 1.3; color: var(--brand); }
.co-his__list { margin-top: 32px; }
.co-his__list li {
  position: relative;
  padding-left: 12px;
  font-size: 16px;
  line-height: 1.5;
  word-break: break-all;
}
.co-his__list li + li { margin-top: 8px; }
.co-his__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--brand);
}

/* ── CORE VALUE ──────────────────────────────────────────────────────── */
.co-core { margin-top: 140px; padding: 140px 0; background: #f8f8f8; }
.co-core__title { color: var(--brand); }
.co-core__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-top: 80px;
}
.co-core__item { text-align: center; }
.co-core__item + .co-core__item { border-left: 1px solid #ddd; }
.co-core__icon { width: 120px; height: 120px; margin: 0 auto; }
.co-core__item h3 { margin-top: 30px; font-size: 24px; font-weight: 500; line-height: normal; }
.co-core__item p { margin-top: 8px; font-size: 16px; line-height: 1.5; }

/* 시안에서 푸터는 CORE VALUE 배경에 바로 이어 붙는다 */
.co-core + .ft { margin-top: 0; }