/* ============================================================
   Buy Invest - 회사소개(about.html) 전용 스타일
   피그마 nodeId 1:580 "Buy Invest - 회사소개" 기준
   ※ common.css의 .sec / .sec-title / .def-list / .def-term / .def-desc 를
     재사용하되, 이 페이지에서만 적용되는 색상/레이아웃 보정은
     .about-body 스코프로 한정한다 (다른 페이지에 영향 없음).
   ============================================================ */

/* ===== 인사말 섹션 ===== */
.about-greet{
  background:var(--bg-soft);
}
.greet-inner{
  /* padding shorthand로 쓰면 .container의 좌우 20px 패딩을 0으로 덮어써서
     아래 본문 섹션들(.def-term/.def-desc, left:140px)보다 이 헤딩만
     왼쪽으로 20px 더 밀려나 보였다 — top/bottom만 지정해 좌우는 유지. */
  padding-top:60px;
  padding-bottom:60px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:40px;
}
.greet-text{
  flex:1 1 auto;
  min-width:0;
  padding-top:6px;
}
.greet-line{
  font-size:35px;
  font-weight:700;
  line-height:1.35;
  color:var(--text);
}
.greet-line .hl{
  color:var(--blue);
  font-weight:700;
}
.greet-sign{
  margin-top:40px;
  font-size:20px;
  font-weight:400;
  color:var(--text);
}
.greet-image{
  flex:0 0 auto;
  width:605px;
  max-width:44%;
}
.greet-image img{
  width:100%;
  height:auto;
  border-radius:6px;
  display:block;
  filter:saturate(1);
}

/* ===== 정의목록(용어+설명) 색상 보정 =====
   common.css 기본값: term=검정/19px, desc=회색(#666)
   피그마 회사소개 페이지 실제 값: term=블루 밑줄 강조/15px, desc=검정(#111) */
.about-body .def-term{
  display:inline-block;
  font-size:15px;
  font-weight:700;
  line-height:24px;
  color:var(--blue);
  padding-bottom:4px;
  border-bottom:2px solid var(--blue);
  margin-bottom:20px;
}
.about-body .def-desc{
  position:relative;
  padding-left:14px;
  color:var(--text);
}
.about-body .def-desc::before{
  content:"\00b7";
  position:absolute;
  left:0;
  top:0;
  color:var(--text);
}
.about-body .def-desc + .def-desc{
  margin-top:8px;
}

/* ===== 수상내역 리스트 ===== */
.award-list{
  margin-bottom:0;
}
.award-row b{
  font-weight:700;
  color:var(--text);
}

/* ===== Tablet ===== */
@media (max-width:1024px){
  .greet-line{font-size:28px;}
  .greet-image{width:420px;}
}

/* ===== Mobile ===== */
@media (max-width:768px){
  .greet-inner{flex-direction:column;padding-top:40px;padding-bottom:40px;}
  .greet-image{width:100%;max-width:100%;order:-1;}
  .greet-line{font-size:24px;}
  .greet-sign{margin-top:24px;font-size:16px;}
  .about-body .def-term{font-size:14px;}
  .about-body .def-desc{font-size:14px;}
}