/* /resources/css/pages/company/company.css */

/* =========================================
   1. 페이지 레이아웃 및 구조
   ========================================= */
.company-section {
    max-width: 1490px;
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 15px;
    padding: 10px 20px 30px; /* 좌우 패딩 추가 */
    letter-spacing: 0.07rem;
}

.company-page .page-hero {
  background: #f7f9fc;
  padding: 40px 0 30px;
  /* border-bottom: 1px solid #e3e7f0; */
}

.page-hero .page-title {
  font-size: 1.8rem;
  font-weight: 600;
  color: #1a202c;
  margin-top: 5px;
}

.page-hero .page-kicker {
  font-size: 0.8rem;
  color: #414141;
  letter-spacing: 0.15em;
  font-weight: 600;
}

/* 2단 그리드 레이아웃 (반응형 대비) */
.company-two-column {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
  gap: 40px; /* 간격 확장 */
  align-items: center;
}

@media (max-width: 992px) {
  .company-two-column {
    grid-template-columns: 1fr; /* 모바일에서는 1단으로 */
    gap: 30px;
  }
}

.page-subtitle {
	font-size: 1.2rem;
	letter-spacing: 0.05rem;
    padding-top: 10px;
}

/* =========================================
   2. 공통 테이블 스타일 (overview, license)
   ========================================= */
.company-info-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.03rem;
  border-top: 2px solid #2d3748; /* 상단 강조 */
}
.company-info-table th,
.company-info-table td {
  border-bottom: 1px solid #e3e7f0;
  padding: 12px 15px;
  text-align: left;
}
.company-info-table th {
  background-color: #f7f9fc;
  color: #414141;
  font-weight: 500;
  width: 150px; /* 기본정보 테이블에서 제목 너비 지정 */
}
.company-info-table td {
  color: #2d3748;
}

/* 라이선스 테이블 전용 */
.license-table thead th {
  background-color: #e2e8f0;
  color: #414141;
  text-align: center;
  font-size: 1.03rem;
  padding: 10px 15px;
  border-bottom: 2px solid #75a3f0;
}
/* 허가 및 등록사항 테이블: 본문 정렬 커스터마이징 */
.license-table tbody td {
  text-align: center; /* 기본값: 가운데 정렬(발급일은 그대로 사용) */
}

/* 허가/등록번호, 허가기관, 비고는 좌측 정렬 */
.license-table tbody td:nth-child(2),
.license-table tbody td:nth-child(3),
.license-table tbody td:nth-child(5) {
  text-align: left;
}

/* =========================================
   3. 인사말 (Greeting) 스타일
   ========================================= */
.company-greeting-section {
  padding-top: 20px;
  letter-spacing: 0.05rem;
}
.company-greeting-text p {
  line-height: 1.8;
  margin-bottom: 20px;
  color: #414141;
  font-size: 1.03rem;
}
.company-greeting-text h3 {
  font-size: 1.5rem;
  font-weight: 500;
  color: #2d3748;
  margin: 5px 0 20px;
  border-left: 4px solid #3182ce;
  padding-left: 10px;
}
.company-greeting-image {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}
.company-greeting-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* =========================================
   4. 회사개요 (Overview) 스타일
   ========================================= */

/* 회사개요 전체 래퍼: 두 개의 행(상단/하단)을 세로로 배치 */
.company-overview-grid {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

/* 각 행: 6:4 그리드 (좌:우 = 6:4) */
.overview-row {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); /* 6:4 비율 */
  gap: 40px;
  align-items: flex-start; /* 좌/우 타이틀 상단 정렬 */
}

@media (max-width: 992px) {
  .overview-row {
    grid-template-columns: 1fr; /* 모바일에서는 1단 */
    gap: 30px;
  }
}

/* 공통 컬럼 래퍼 */
.overview-col {
  min-width: 0;
}

/* 상단 좌측: 기본 정보 테이블 컨테이너 */
.overview-col-basic {
  /* 필요 시 추가 여백/보더 등 가능 */
}

/* 상단 우측: 비전/핵심가치 카드형 박스
   → 상단 padding 을 0 으로 해서 "기본 정보" 타이틀과 수평 정렬 */
.overview-col-vision {
  padding: 0 20px 20px;     /* 기존 20px에서 상단만 0으로 변경 */
  background-color: #e2e8f0;
  border-radius: 8px;
}

/* 하단 좌측: 연혁 테이블 */
.overview-col-history {
  /* 별도 마진 필요하면 여기서 조절 */
}

/* 하단 우측: 주요 사업 영역 */
.overview-col-business {
  padding: 20px 20px 20px;
  margin-top: 20px;
  background-color: #e2e8f0;
  border-radius: 8px;
  height: 100%;             
  display: flex;
  flex-direction: column;
}

/* 섹션 타이틀 공통 (좌측 기본정보 / 좌측 연혁) */
.company-section-title {
  font-size: 1.5rem;
  font-weight: 500;
  color: #2d3748;
  margin-bottom: 14px;
  padding-left: 20px;
}

/* 우측 컬럼 타이틀 중앙 정렬 (비전 및 핵심 가치 / 주요 사업 영역) */
.overview-col-vision .company-section-title,
.overview-col-business .company-section-title {
  padding-left: 0;      /* 좌측 들여쓰기 제거 */
  text-align: center;   /* 좌우 가운데 정렬 */
}

/* 비전/핵심 가치 내부 타이틀 */
.overview-vision-title {
  font-size: 1.3rem;
  color: #414141;
  padding: 20px 0 15px;
  text-align: center;    /* 비전 문구도 가운데 정렬(선택 사항) */
}

.overview-core-title {
  font-size: 1.03rem;
  color: #414141;
  margin: 25px 0 10px;
  text-align: center;    /* "핵심 가치" 제목도 가운데 정렬 */
}

/* 비전/핵심 가치 문단 */
.overview-col-vision p {
  font-size: 1.03rem;
  line-height: 1.6;
  color: #414141;
  margin-bottom: 10px;
}

/* 핵심 가치 리스트 */
.overview-core-list {
  margin-top: 10px;
}

/* 기존 회사 사업 리스트 공통 스타일 활용 */
.company-biz-list {
  margin-top: 10px;
  list-style: none;
  padding: 0;
}
.company-biz-list li {
  background: #fff;
  padding: 10px 15px;
  margin-bottom: 8px;
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  border-left: 3px solid #48bb78;
  font-weight: 500;
  color: #414141;
}

/* 회사개요 – 공통 테이블 스타일은 그대로 재사용 */
.company-info-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.03rem;
  border-top: 2px solid #75a3f0;
}
.company-info-table th,
.company-info-table td {
  border-bottom: 1px solid #96b2f1;
  padding: 12px 15px;
  text-align: left;
}
.company-info-table th {
  background-color: #f7f9fc;
  color: #414141;
  font-weight: 500;
  width: 150px;
}
.company-info-table td {
  color: #2d3748;
}

/* 기본 정보 테이블 전용 (필요 시 커스터마이징) */
.company-basic-table thead th {
  text-align: center;
  letter-spacing: 1.03rem;
}
/* 연혁 테이블 헤더 중앙 정렬 */
.company-history-table thead th {
  text-align: center;
  letter-spacing: 1.03rem;
}

/* 연혁 테이블 전용: 날짜 컬럼 폭/정렬 조정 */
.company-history-table thead th:first-child {
  width: 120px;
}
.company-history-table tbody td:first-child {
  width: 120px;
  white-space: nowrap;
  color: #414141;
}
.company-history-table tbody td:last-child {
  color: #2d3748;
}

.company-license-info {
  margin-top: 30px;
  margin-bottom: 100px;
  font-size: 1rem;
  color: #777
}
/* =========================================
   5. 오시는 길 (Location) 스타일
   ========================================= */
.company-location-layout {
  display: grid;
  grid-template-columns: minmax(0, 3.25fr) minmax(0, 1.75fr);
  gap: 30px;
}

@media (max-width: 992px) {
  .company-location-layout {
    grid-template-columns: 1fr;
  }
}
/* 타이틀 + 지도를 세로로 배치 */
.location-main-wrap {
  display: flex;
  flex-direction: column;
  /* gap: 12px; */
}
.location-map-wrap {
  min-height: 486px;
  border: 2px solid #f6d6ac;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}
.kakao-map-container {
  width: 100%;
  height: 100%;
}
.location-info-wrap {
  height: 490px;
  background-color: #faefe0;
  border-radius: 8px;
}
.location-guide-title {
  font-size: 1.2rem;
  font-weight: 500;
  color: #2d3748;
  margin-bottom: 14px;
  padding-left: 20px;  
}
/* .location-info-wrap h3 {
  font-size: 1.25rem;
  font-weight: 600;
  color: #2d3748;
  margin-top: 25px;
  margin-bottom: 10px;
} */

.location-guide-list {
  list-style: none;
  padding: 0px 20px 0px 20px;
  margin: 0;
}
.location-guide-list li {
  font-size: 1.03rem;
  line-height: 1.6;
  color: #414141;
  margin-bottom: 5px;
  padding-left: 1.5em;
  position: relative;
}
.location-guide-list li::before {
  content: "•";
  color: #4299e1; /* 블루 포인트 */
  font-weight: bold;
  display: inline-block;
  width: 1em;
  margin-left: -1em;
}
/* 공용 강조 라벨 스타일 */
.label-bold {
  font-weight: 450;
  color: #414141;    /* Strong보다 자연스럽고 브랜드 톤 유지 */
  margin-right: 3px;
}