/* ============================================================
   index.css  —  메인(index.html) 전용 스타일
   ============================================================ */

/* ── 히어로 배너 ── */
.hero { position:relative; height:700px; overflow:hidden; }
.hero-slide { position:absolute; inset:0; opacity:0; transition:opacity 1s ease; display:flex; align-items:center; }
.hero-slide.active { opacity:1; z-index:1; }
.hero-slide-bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  transform:scale(1.06); transition:transform 7s ease;
}
.hero-slide.active .hero-slide-bg { transform:scale(1); }

/* 배경사진 — 교체 시 아래 URL만 변경 */
.hero-slide-bg.s1 { background-image:url('../img/main_bg_01.png?w=1800&q=80'); }
.hero-slide-bg.s2 { background-image:url('../img/main_bg_02.png?w=1800&q=80'); }
.hero-slide-bg.s3 { background-image:url('../img/main_bg_03.png?w=1800&q=80'); }
.hero-slide-bg.s4 { background-image:url('../img/main_bg_04.png?w=1800&q=80'); }

/*
  ★ 실제 사진으로 교체할 때:
     위 URL 대신 아래처럼 카페24 서버 경로 사용
     .hero-slide-bg.s1 { background-image:url('img/bg_slide1.jpg'); }
     .hero-slide-bg.s2 { background-image:url('img/bg_slide2.jpg'); }
     .hero-slide-bg.s3 { background-image:url('img/bg_slide3.jpg'); }
     .hero-slide-bg.s4 { background-image:url('img/bg_slide4.jpg'); }
*/

.hero-slide-bg::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(105deg, rgba(6,29,71,.80) 0%, rgba(10,45,107,.55) 55%, rgba(10,45,107,.28) 100%);
}
.hero-content { position:relative; z-index:2; max-width:1280px; margin:0 auto; padding:0 40px; width:100%; }
.hero-content .tag {
  display:inline-block; font-family:var(--font-en); font-size:11px; letter-spacing:3.5px;
  color:var(--gold); background:rgba(200,168,75,.15); border:1px solid rgba(200,168,75,.45);
  padding:5px 14px; border-radius:2px; margin-bottom:22px;
  opacity:0; transform:translateY(18px); transition:all .6s .2s;
}
.hero-slide.active .tag { opacity:1; transform:translateY(0); }
.hero-content h1 {
  font-size:54px; font-weight:900; color:#fff;
  line-height:1.18; letter-spacing:-1.5px; margin-bottom:20px;
  text-shadow:0 2px 20px rgba(0,0,0,.25);
  opacity:0; transform:translateY(28px); transition:all .7s .4s;
}
.hero-slide.active h1 { opacity:1; transform:translateY(0); }
.hero-content p {
  font-size:17px; color:rgba(255,255,255,.82); line-height:1.85; margin-bottom:36px;
  opacity:0; transform:translateY(18px); transition:all .7s .6s;
}
.hero-slide.active p { opacity:1; transform:translateY(0); }
.hero-btn {
  display:inline-flex; align-items:center; gap:10px;
  background:#fff; color:var(--primary);
  font-size:14px; font-weight:800; padding:15px 30px; border-radius:2px;
  opacity:0; transform:translateY(18px);
  transition:opacity .7s .8s, transform .7s .8s, background .3s, color .3s;
}
.hero-slide.active .hero-btn { opacity:1; transform:translateY(0); }
.hero-btn:hover { background:var(--primary); color:#fff; }
.hero-btn svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:2.2; transition:transform .3s; }
.hero-btn:hover svg { transform:translateX(4px); }

/* 도트 & 화살표 & 카운터 */
.hero-dots { position:absolute; bottom:32px; left:50%; transform:translateX(-50%); z-index:5; display:flex; gap:10px; }
.hero-dot { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.38); cursor:pointer; transition:all .35s; }
.hero-dot.active { background:#fff; width:30px; border-radius:4px; }
.hero-arrows { position:absolute; top:50%; transform:translateY(-50%); width:100%; z-index:5; display:flex; justify-content:space-between; padding:0 20px; pointer-events:none; }
.hero-arrow { width:50px; height:50px; background:rgba(255,255,255,.13); border:1px solid rgba(255,255,255,.28); display:flex; align-items:center; justify-content:center; cursor:pointer; pointer-events:all; transition:all .3s; border-radius:2px; }
.hero-arrow:hover { background:var(--primary); border-color:var(--primary); }
.hero-arrow svg { width:22px; height:22px; fill:none; stroke:#fff; stroke-width:2; }
.hero-counter { position:absolute; right:40px; bottom:34px; z-index:5; font-family:var(--font-en); font-size:13px; color:rgba(255,255,255,.5); display:flex; align-items:center; gap:6px; }
.hero-counter .cur { font-size:20px; font-weight:700; color:#fff; }
.hero-counter .sep { width:30px; height:1px; background:rgba(255,255,255,.3); }

/* ── 사업분야 (2열) ── */
.business { background:var(--light-gray); }
.biz-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.biz-card { background:var(--white); border-radius:4px; overflow:hidden; transition:all .35s; box-shadow:0 2px 12px rgba(10,45,107,.06); display:flex; flex-direction:column; }
.biz-card:hover { transform:translateY(-8px); box-shadow:0 18px 44px rgba(10,45,107,.14); }
.biz-card-img { height:260px; position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center; background-size:cover; background-position:center; }
.biz-card-img.c1 { background-color:#1a1a1a; background-image:none; background-size:cover; background-position:center; }
.biz-card-img.c2 { background-color:#1a1a1a; background-image:none; background-size:cover; background-position:center; }
.biz-card-img::before { content:''; position:absolute; inset:0; background:rgba(0,0,0,.30); }
.biz-card-img-icon { width:90px; height:90px; background:rgba(255,255,255,.12); border:2px solid rgba(255,255,255,.3); border-radius:50%; display:flex; align-items:center; justify-content:center; position:relative; z-index:1; transition:transform .35s; }
.biz-card:hover .biz-card-img-icon { transform:scale(1.08); }
.biz-card-img-icon svg { width:44px; height:44px; fill:#fff; }
.biz-card-body { padding:32px; flex:1; display:flex; flex-direction:column; }
.biz-card-body h3 { font-size:20px; font-weight:800; color:var(--primary-dark); margin-bottom:12px; letter-spacing:-.5px; }
.biz-card-body p { font-size:14px; color:var(--text-light); line-height:1.85; flex:1; }
.biz-card-link { display:inline-flex; align-items:center; gap:8px; margin-top:22px; font-size:13px; font-weight:700; color:var(--primary); transition:gap .2s; }
.biz-card-link svg { width:16px; height:16px; fill:currentColor; }
.biz-card:hover .biz-card-link { gap:13px; }

/* ── 메인 인허가사항 ── */
.main-license { background:var(--white); padding:90px 0 80px; }

.license-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }

/* award-card 스타일 재사용 (pages.css) + 메인용 보정 */
.main-license .award-card {
  aspect-ratio: 3 / 4;
  border-radius:6px;
  overflow:hidden;
  position:relative;
  cursor:pointer;
  transition:transform .35s, box-shadow .35s;
  background:var(--primary-dark);
}
.main-license .award-card:hover { transform:translateY(-6px); box-shadow:0 20px 50px rgba(10,45,107,.25); }
.main-license .award-card-bg { position:absolute; inset:0; background-size:cover; background-position:center; transition:transform .5s ease; }
.main-license .award-card:hover .award-card-bg { transform:scale(1.06); }
.main-license .award-card-bg.ab1 { background-color:#0a2d6b; background-image:linear-gradient(160deg,#061d47,#1a5cb8); }
.main-license .award-card-bg.ab2 { background-color:#0d3a7a; background-image:linear-gradient(160deg,#0a2240,#1e7fd4); }
.main-license .award-card-bg.ab3 { background-color:#103a88; background-image:linear-gradient(160deg,#061d47,#2e9de8); }
.main-license .award-card-bg.ab4 { background-color:#06233a; background-image:linear-gradient(160deg,#04111e,#0a3d8a); }
.main-license .award-card-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(10,10,10,.75) 0%, rgba(10,10,10,.35) 18%, rgba(0,0,0,.00) 35%, rgba(0,0,0,.00) 100%);
}
.main-license .award-card-icon {
  position:absolute; top:50%; left:50%;
  transform:translate(-50%,-65%);
  width:64px; height:64px;
  background:rgba(255,255,255,.12); border:2px solid rgba(255,255,255,.35);
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  transition:background .3s, transform .3s;
}
.main-license .award-card:hover .award-card-icon {
  background:rgba(30,127,212,.4);
  transform:translate(-50%,-65%) scale(1.08);
}
.main-license .award-card-icon svg { width:28px; height:28px; fill:#fff; }
.main-license .award-card-body {
  position:absolute; bottom:0; left:0; right:0;
  padding:22px 20px 20px; text-align:center;
}
.main-license .award-card-year {
  display:inline-block; font-family:var(--font-en);
  font-size:10px; letter-spacing:2.5px;
  color:var(--gold); border:1px solid rgba(200,168,75,.5);
  padding:3px 10px; border-radius:20px; margin-bottom:10px;
}
.main-license .award-card-body h4 { font-size:15px; font-weight:800; color:#fff; line-height:1.45; letter-spacing:-.3px; margin-bottom:6px; }
.main-license .award-card-body p  { font-size:12.5px; color:rgba(255,255,255,.65); }

/* 더보기 버튼 */
.more-btn-wrap { text-align:center; margin-top:44px; }
.more-btn {
  display:inline-flex; align-items:center; gap:10px;
  border:2px solid var(--primary); color:var(--primary);
  font-size:14px; font-weight:700;
  padding:14px 40px; border-radius:3px;
  transition:all .3s; letter-spacing:-.2px;
  background:transparent;
}
.more-btn:hover { background:var(--primary); color:#fff; }
.more-btn svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; transition:transform .3s; }
.more-btn:hover svg { transform:translateX(4px); }

/* ── 오시는 길 ── */
.directions-section { background:var(--white); padding:90px 0; }
.map-wrap-main { display:block; margin-bottom:28px; border-radius:8px; overflow:hidden; box-shadow:0 4px 24px rgba(10,45,107,.12); text-decoration:none; transition:box-shadow .3s; }
.map-wrap-main:hover { box-shadow:0 8px 36px rgba(10,45,107,.2); }
.map-static { height:400px; background:linear-gradient(135deg,#0a2240 0%,#0d3a7a 50%,#1a5cb8 100%); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; position:relative; overflow:hidden; }
.map-static::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px); background-size:40px 40px; }
.map-static svg { width:100px; height:100px; position:relative; z-index:1; }
.map-static-text { text-align:center; position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:8px; }
.map-icon-pin { font-size:28px; }
.map-static-text p { font-size:16px; font-weight:700; color:#fff; letter-spacing:-.3px; }
.map-click-hint { font-size:13px; color:rgba(255,255,255,.6); background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.2); padding:6px 16px; border-radius:20px; transition:all .3s; }
.map-wrap-main:hover .map-click-hint { background:rgba(255,255,255,.15); color:#fff; }
.dir-grid { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.dir-card-box { border-radius:6px; padding:32px; display:flex; gap:20px; align-items:flex-start; }
.dir-card-box.dark { background:var(--primary-dark); }
.dir-card-box.light { background:var(--light-gray); }
.dir-card-icon { width:44px; height:44px; flex-shrink:0; display:flex; align-items:center; justify-content:center; }
.dir-card-box.dark .dir-card-icon svg { width:28px; height:28px; fill:var(--gold); }
.dir-card-box.light .dir-card-icon svg { width:28px; height:28px; fill:var(--primary); }
.dir-card-content h3 { font-size:18px; font-weight:800; margin-bottom:14px; }
.dir-card-box.dark h3 { color:#fff; }
.dir-card-box.light h3 { color:var(--primary-dark); }
.dir-addr { font-size:14px; line-height:1.8; margin-bottom:14px; color:rgba(255,255,255,.82); }
.dir-contact { display:flex; gap:20px; font-size:13.5px; margin-bottom:10px; color:rgba(255,255,255,.82); }
.dir-contact strong { color:var(--gold); }
.dir-time { font-size:13px; color:rgba(255,255,255,.6); }
.transport-list { display:flex; flex-direction:column; gap:14px; }
.transport-item { display:flex; align-items:flex-start; gap:12px; }
.transport-type { font-size:11px; font-weight:700; padding:3px 10px; border-radius:3px; white-space:nowrap; margin-top:2px; color:#fff; flex-shrink:0; }
.transport-type.car { background:var(--primary); }
.transport-type.bus { background:#27ae60; }
.transport-type.ktx { background:#e74c3c; }
.transport-item p { font-size:13.5px; color:var(--text-mid); line-height:1.6; }

/* ── 반응형 ── */
@media (max-width:1024px) {
  .license-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:768px) {
  .hero { height:500px; }
  .hero-content { padding:0 24px; }
  .hero-content h1 { font-size:30px; }
  .hero-content p { font-size:14px; }
  .hero-arrows, .hero-counter { display:none; }
  .biz-grid-2 { grid-template-columns:1fr; }
  .biz-card-img { height:200px; }
  .license-grid { grid-template-columns:repeat(2,1fr); gap:14px; }
  .directions-section { padding:60px 0; }
  .map-static { height:280px; }
  .dir-grid { grid-template-columns:1fr; }
}
@media (max-width:480px) {
  .hero { height:420px; }
  .hero-content h1 { font-size:24px; }
  .map-static { height:220px; }
}