@charset "utf-8";
/* ========================================
   회사소개 페이지 스타일
   * theme_config 스타일 기반
======================================== */

/* ========================================
   기본 레이아웃
======================================== */
.companyWrap {}

/* ========================================
   섹션 스타일
======================================== */
.companySection {margin-bottom:40px;}
.companySection .sectionHeader {display:flex; align-items:center; margin-bottom:20px; padding-bottom:12px; border-bottom:1px solid var(--ui-color-gray-200);}
.companySection .sectionTitle {display:flex; align-items:center; gap:8px; color:var(--ui-color-gray-800); font-size:20px; font-weight:600;}
.companySection .sectionTitle i {color:var(--color-prime); font-size:24px;}

/* ========================================
   컨텐츠 박스
======================================== */
.companyBox {background:var(--ui-color-white); border:1px solid var(--ui-color-gray-200); border-radius:12px; overflow:hidden;}

.companyItem {display:flex; align-items:center; padding:24px; border-bottom:1px solid var(--ui-color-gray-100);}
.companyItem:last-child {border-bottom:none;}

/* 라벨 */
.companyItem .itemLabel {flex:0 0 180px; padding-right:30px;}
.companyItem .itemLabel label {display:block; margin-bottom:4px; color:var(--ui-color-gray-900); font-size:15px; font-weight:600;}
.companyItem .itemLabel label i {margin-right:6px; color:var(--color-prime);}
.companyItem .itemLabel .itemHelp {display:block; color:var(--ui-color-gray-500); font-size:12px;}

/* 컨텐츠 */
.companyItem .itemContent {flex:1;}
.companyItem .itemContent p {margin:0; color:var(--ui-color-gray-700); font-size:14px; line-height:1.7;}

/* ========================================
   회사 소개 인트로
======================================== */
.companyItem.intro {display:block; padding:30px; background:var(--ui-color-gray-50);}
.companyItem.intro .introContent {}
.companyItem.intro .companyName {margin:0 0 8px; color:var(--color-prime); font-size:28px; font-weight:700;}
.companyItem.intro .companySlogan {margin:0 0 16px; color:var(--ui-color-gray-600); font-size:16px; font-weight:500;}
.companyItem.intro .companyDesc {margin:0; color:var(--ui-color-gray-600); font-size:14px; line-height:1.8;}

/* 통계 */
.companyItem.stats {display:block; padding:24px 30px; background:var(--ui-color-white);}
.statGrid {display:grid; grid-template-columns:repeat(4, 1fr); gap:20px;}
.statBox {text-align:center; padding:16px; border-radius:8px; background:var(--ui-color-gray-50);}
.statBox .statNumber {display:block; color:var(--color-prime); font-size:28px; font-weight:700;}
.statBox .statNumber em {font-style:normal; font-size:18px;}
.statBox .statLabel {display:block; margin-top:4px; color:var(--ui-color-gray-500); font-size:12px; font-weight:500; text-transform:uppercase; letter-spacing:0.5px;}

/* ========================================
   핵심 가치 태그
======================================== */
.valueGrid {display:flex; flex-wrap:wrap; gap:10px;}
.valueTag {display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border-radius:20px; background:var(--ui-color-gray-100); color:var(--ui-color-gray-700); font-size:13px; font-weight:500;}
.valueTag i {color:var(--color-prime); font-size:16px;}

/* ========================================
   연혁 리스트
======================================== */
.historyList {margin:0; padding:0; list-style:none;}
.historyList li {position:relative; padding-left:16px; margin-bottom:6px; color:var(--ui-color-gray-700); font-size:14px; line-height:1.6;}
.historyList li:last-child {margin-bottom:0;}
.historyList li::before {content:''; position:absolute; left:0; top:8px; width:6px; height:6px; border-radius:50%; background:var(--color-prime);}

/* ========================================
   지도 영역
======================================== */
.companyItem.map {display:block; padding:0;}
#companyMap {width:100%; height:300px;}

/* ========================================
   반응형
======================================== */
@media (max-width:768px) {
    .companyWrap {padding:20px 16px;}

    .companySection .sectionTitle {font-size:18px;}
    .companySection .sectionTitle i {font-size:22px;}

    .companyItem {flex-direction:column; align-items:flex-start; padding:20px;}
    .companyItem .itemLabel {flex:none; padding-right:0; margin-bottom:10px;}
    .companyItem .itemContent {width:100%;}

    .companyItem.intro .companyName {font-size:24px;}
    .companyItem.intro .companySlogan {font-size:14px;}

    .statGrid {grid-template-columns:repeat(2, 1fr); gap:12px;}
    .statBox {padding:12px;}
    .statBox .statNumber {font-size:22px;}

    .valueGrid {gap:8px;}
    .valueTag {padding:6px 12px; font-size:12px;}
}

@media (max-width:480px) {
    .statGrid {grid-template-columns:repeat(2, 1fr);}
    .statBox .statNumber {font-size:20px;}
    .statBox .statLabel {font-size:11px;}
}