/* 상단 흑백 헤더 */
.fa-hero {
  background: url('../images/fa.png') center center / cover no-repeat;
  filter: grayscale(100%);
  height: 480px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
}

.fa-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
}

.fa-hero .sub-hero-inner {
  position: relative;
  z-index: 2;
}

.fa-hero h1 {
  font-family: 'GmarketSansBold';
  font-size: 2.4rem;
  margin: 10px 0;
  text-shadow: 0 3px 8px rgba(0,0,0,0.4);
}

.fa-hero p {
  font-family: 'GmarketSansMedium';
  font-size: 1.1rem;
  color: rgba(255,255,255,0.9);
}

/* 섹션 간격 */
.section {
  padding: 100px 20px;
  background: #fffaf5;
}

/* 2단 구조 (split) */
.split-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}

.split.reverse .split-inner {
  direction: rtl;
}
.split.reverse .split-text {
  direction: ltr;
}

.split-text h2 {
  font-family: 'GmarketSansBold';
  font-size: 2rem;
  margin-bottom: 16px;
  color: #2c2c2c;
}

.split-text p {
  font-family: 'GmarketSansMedium';
  font-size: 1.05rem;
  color: #555;
  line-height: 1.8;
}

.split-media img {
  width: 100%;
  border-radius: 14px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

/* ===== 프랜차이즈 비용표 (사이트 톤 버전) ===== */
.highlight-table {
  width: 100%;
  border-collapse: collapse;
  font-family: 'GmarketSansMedium';
  margin-top: 30px;
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
}

.highlight-table th {
  background: #b68d57; /* 골드브라운 */
  color: #fff;
  padding: 14px;
  text-align: center;
  font-size: 1.05rem;
}

.highlight-table td {
  border: 1px solid #e9dcc1;
  text-align: center;
  padding: 12px 10px;
  color: #333;
}

.highlight-table tr:nth-child(even) {
  background: #fffaf3;
}

/* 빨간 줄 효과 (톤다운된 브릭레드) */
.strike-text {
  position: relative;
  display: inline-block;
  color: #555;
}
.strike-text::after {
  content: '';
  position: absolute;
  top: 50%;
  left: -4px;
  width: 110%;
  height: 2px;
  background: #c76a5b; /* 톤다운된 붉은색 */
  transform: rotate(-5deg);
}

/* 강조줄 (연한 골드) */
.merged-row td {
   background: #b68d57; /* 골드브라운 */
  color: #fff;
  font-weight: bold;
  padding: 10px;
  text-align: center;
}

/* 합계 강조 */
.total {
  background: #b68d57;
  color: #fff;
  font-weight: bold;
}

/* 부제, 안내문 */
.subtitle {
  text-align: center;
  font-family: 'GmarketSansMedium';
  font-size: 1.05rem;
  color: #7c6a4b;
  margin-bottom: 18px;
}

.note {
  text-align: center;
  margin-top: 24px;
  font-size: 1rem;
  color: #7c6a4b;
  line-height: 1.7;
}

/* 반응형 */
@media (max-width: 768px) {
  .highlight-table th,
  .highlight-table td {
    font-size: 0.9rem;
    padding: 10px 6px;
  }
}

/* ===== 창업혜택 섹션 ===== */
.franchise-benefit {
  background: linear-gradient(to bottom, #fffaf5 0%, #fff7ef 100%);
  text-align: center;
  padding: 80px 20px 60px;
}

.franchise-benefit h2 {
  font-family: 'GmarketSansBold';
  font-size: 2.3rem; /* 크기 업 */
  color: #2c2c2c;
  margin-bottom: 14px;
  position: relative;
}

/* ✅ 밑줄 강조 */
.franchise-benefit h2::after {
  content: "";
  display: block;
  width: 80px;
  height: 3px;
  background-color: #b68d57; /* 따뜻한 골드 브라운 */
  margin: 10px auto 0;
  border-radius: 2px;
}

.franchise-benefit .subtitle {
  font-family: 'GmarketSansMedium';
  font-size: 1.1rem; /* 살짝 키움 */
  color: #7c6a4b;
  margin-bottom: 50px;
}

/* ===== 2x2 레이아웃 ===== */
.benefit-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 48px 60px;
  justify-items: center;
  align-items: center;

  /* ✅ 가운데 정렬 느낌 */
  max-width: 700px;
  margin: 0 auto;
}

.benefit-item {
  text-align: center;
}

.benefit-item img {
  width: 90px;
  height: 90px;
  object-fit: contain;
  margin-bottom: 16px;
  filter: grayscale(40%) brightness(0.95);
}

.benefit-item p {
  font-family: 'GmarketSansMedium';
  font-size: 1.15rem;
  color: #4e3c2a;
}

.benefit-item strong {
  color: #b68d57;
}

/* 반응형 */
@media (max-width: 768px) {
  .benefit-grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .benefit-item img {
    width: 70px;
    height: 70px;
  }
}

/* ===== 공통 섹션 제목 스타일 (창업혜택, 창업비용 공용) ===== */
.section-title {
  text-align: center;
  margin-bottom: 40px;
}

.section-title h2 {
  font-family: 'GmarketSansBold';
  font-size: 2.3rem;
  color: #2c2c2c;
  margin-bottom: 12px;
  position: relative;
}

/* 밑줄 강조 */
.section-title h2::after {
  content: "";
  display: block;
  width: 80px;
  height: 3px;
  background-color: #b68d57;
  margin: 10px auto 0;
  border-radius: 2px;
}

.section-title .subtitle {
  font-family: 'GmarketSansMedium';
  font-size: 1.1rem;
  color: #7c6a4b;
  margin-top: 10px;
}

/* ===== 표 하단 설명 강조 (업데이트 버전) ===== */
.note {
  text-align: center;
  font-family: 'GmarketSansMedium';
  font-size: 2rem;  /* 전체 글자 크기 크게 */
  color: #4e3c2a;
  margin-top: 60px;
  line-height: 1.6;
}

.note strong,
.note span {
  font-size: inherit; /* ✅ 부모 폰트 크기 그대로 상속 */
}

.note .highlight {
  color: #b68d57; /* 브랜드 포인트 컬러 */
  font-family: 'GmarketSansBold';
  font-weight: 700;
}

.note .emphasis {
  color: #2c1a0a;
  font-weight: 600;
}


/* ===== 장인 인테리어 섹션 (배경형 통합버전) ===== */
.artisan-hero {
  position: relative;
  background: url('../images/sam.jpg') center center / cover no-repeat;
  min-height: 580px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #fff;
  padding: 80px 20px;
  border-radius: 16px;
  overflow: hidden;
}

/* 어두운 오버레이 */
.artisan-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  z-index: 1;
}

.artisan-content {
  position: relative;
  z-index: 2;
  max-width: 900px;
  text-align: center;
}

.artisan-content h2 {
  font-family: 'GmarketSansBold';
  font-size: 2.2rem;
  margin-bottom: 16px;
  text-shadow: 0 3px 8px rgba(0, 0, 0, 0.4);
}

.artisan-content p {
  font-family: 'GmarketSansMedium';
  font-size: 1.05rem;
  line-height: 1.9;
  text-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
}

/* 장인 인용문 박스 */
.artisan-quote-box {
  background: rgba(255, 255, 255, 0.9);
  color: #3b2b1c;
  border-radius: 12px;
  padding: 28px 32px;
  margin-top: 36px;
  display: inline-block;
  text-align: left;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

.artisan-quote-box .quote {
  font-family: 'GmarketSansMedium';
  font-size: 1.1rem;
  line-height: 1.8;
  margin-bottom: 12px;
}

.artisan-quote-box strong {
  color: #b68d57;
}

.artisan-quote-box .signature {
  text-align: right;
  font-family: 'GmarketSansBold';
  color: #5a4631;
}

.artisan-quote-box .sub-note {
  text-align: center;
  font-size: 0.95rem;
  color: #7c6a4b;
  margin-top: 10px;
}

/* 반응형 대응 */
@media (max-width: 768px) {
  .artisan-hero {
    min-height: 480px;
    padding: 60px 16px;
  }
  .artisan-content h2 {
    font-size: 1.6rem;
  }
  .artisan-content p {
    font-size: 0.95rem;
  }
  .artisan-quote-box {
    padding: 22px 20px;
  }
}

/* ===== 브랜드 철학 (카드형 + 배경이미지 버전) ===== */
.brand-card-section {
  background: url('../images/back.jpg') center center / cover no-repeat;
  padding: 140px 20px;
  position: relative;
}

.brand-card-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255, 250, 245, 0.7); /* 살짝 밝은 오버레이로 카드와 어울림 */
  z-index: 1;
}

.brand-card {
  position: relative;
  z-index: 2;
  max-width: 1100px;
  margin: 0 auto;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 20px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 50px;
  padding: 60px;
  align-items: center;
  backdrop-filter: blur(6px); /* ✅ 약한 유리질감 */
}

.brand-photo img {
  width: 100%;
  border-radius: 16px;
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);
}

.brand-text h2 {
  font-family: 'GmarketSansBold';
  font-size: 2rem;
  color: #2c2c2c;
  margin-bottom: 20px;
  position: relative;
}

.brand-text h2::after {
  content: '';
  display: block;
  width: 70px;
  height: 3px;
  background: #b68d57;
  margin-top: 10px;
  border-radius: 2px;
}

.brand-text p {
  font-family: 'GmarketSansMedium';
  font-size: 1.05rem;
  color: #4e3c2a;
  line-height: 1.9;
}

/* 반응형 */
@media (max-width: 768px) {
  .brand-card {
    grid-template-columns: 1fr;
    padding: 40px 24px;
  }

  .brand-text {
    text-align: center;
  }

  .brand-text h2 {
    font-size: 1.6rem;
  }

  .brand-text p {
    font-size: 0.95rem;
  }
}

/* PC / Mobile 텍스트 분리 */
.pc-text { display: block; }
.mobile-text { display: none; }

@media (max-width: 768px) {
  .pc-text { display: none; }
  .mobile-text { display: block; }

  /* 모바일 H1 크기 조절 */
  .sub-hero .mobile-text {
    font-size: 1.7rem;
    line-height: 1.35;
    text-align: center;
  }

  /* 히어로 안쪽 전체를 조금 아래로 */
  .sub-hero-inner {
    padding-top: 40px;
  }
}

/* =========================================
   📱 패밀리즘 페이지 전용 MOBILE HERO 디자인
   ========================================= */
@media (max-width: 768px) {

  /* 히어로 섹션 높이 & 배경 정렬 */
  .fa-hero {
    height: 300px !important;
    background-position: center center !important;
    background-size: cover !important;
  }

  /* 오버레이 살짝 어둡게 */
  .fa-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55) !important;
    backdrop-filter: blur(1px);
    z-index: 1;
  }

  /* 내부 텍스트 위치 ↓ 아래로 내리기 */
  .fa-hero .sub-hero-inner {
    position: relative;
    top: 25px !important;
    padding: 0 20px;
    text-align: center;
    z-index: 2;
  }

  /* EYEBROW (JEOLGU FAMILYISM) */
  .fa-hero .eyebrow {
    font-size: 0.85rem !important;
    letter-spacing: 2px;
    margin-bottom: 14px;
  }

  /* 메인 타이틀(h1) 모바일 크기 */
  .fa-hero h1 {
    font-size: 1.6rem !important;
    line-height: 1.35 !important;
    margin-bottom: 16px;
  }

  /* 본문 문구 */
  .fa-hero p {
    font-size: 1rem !important;
    line-height: 1.6 !important;
  }
}



  .fa-hero .sub-hero-inner {
    margin-top: -60px; /* 모바일에서 글씨 위치 살짝 위로 보정 */
  }

  /* ============================
   📱 브랜드카드 모바일 정렬 FIX
============================ */
@media (max-width: 768px) {

  /* 텍스트 전체 가운데 정렬 */
  .brand-text {
    text-align: center !important;
  }

  /* 밑줄 가운데 정렬 */
  .brand-text h2::after {
    margin-left: auto;
    margin-right: auto;
  }

  /* 문단 폭 줄여서 더 정갈하게 */
  .brand-text p {
    max-width: 90%;
    margin: 0 auto;
    line-height: 1.7;
  }
}

/* 📱 모바일 전용 — 창업혜택을 2×2 레이아웃으로 정렬 */
@media (max-width: 768px) {

  .benefit-grid {
    grid-template-columns: repeat(2, 1fr) !important; /* 2열로 */
    gap: 30px 20px; /* 상하/좌우 간격 조절 */
    max-width: 100%;
    margin: 0 auto;
  }

  .benefit-item img {
    width: 60px;
    height: 60px;
    margin-bottom: 10px;
  }

  .benefit-item p {
    font-size: 0.95rem;
    line-height: 1.4;
  }
}