/* ============================================================
   RISE 소개 (New Home 01~05) 전용 스타일
   기존 사이트 팔레트(네이비 #1B3E8C / 브레드크럼 그라데이션)를 그대로 사용합니다.
   ============================================================ */
.rise-intro{ background:#fff; }
.rise-intro .container{ max-width:1140px; }

.rise-intro section.block{ padding:70px 0; }
.rise-intro section.block.soft{ background:#f7f8fb; }
.rise-intro section.block.dark{ background:#12203f; color:#fff; }

.rise-intro .section-head{ text-align:center; margin-bottom:42px; }
.rise-intro .section-head .eyebrow{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12.5px; font-weight:700; letter-spacing:.06em;
  color:#1B3E8C; background:#eaeffb; border-radius:999px;
  padding:6px 16px; margin-bottom:16px;
}
.rise-intro section.block.dark .section-head .eyebrow{ background:rgba(255,255,255,.1); color:#fff; }
.rise-intro .section-head h2{ font-size:26px; font-weight:700; margin:0 0 12px; color:#171e2e; }
.rise-intro section.block.dark .section-head h2{ color:#fff; }
.rise-intro .section-head p{ font-size:15px; color:#7e7e7e; max-width:640px; margin:0 auto; }
.rise-intro section.block.dark .section-head p{ color:rgba(255,255,255,.68); }

.rise-intro .grid{ display:flex; flex-wrap:wrap; margin:0 -11px; }
.rise-intro .grid > .card,
.rise-intro .grid > .step,
.rise-intro .grid > .g-card{ margin:0 11px 22px; }
.rise-intro .grid.cols-2 > *{ flex:1 1 calc(50% - 22px); }
.rise-intro .grid.cols-3 > *{ flex:1 1 calc(33.333% - 22px); }
.rise-intro .grid.cols-4 > *{ flex:1 1 calc(25% - 22px); }
.rise-intro .grid.cols-6 > *{ flex:1 1 calc(16.666% - 22px); }

.rise-intro .card{
  background:#fff; border:1px solid #ececf2; border-radius:14px;
  padding:28px 24px; box-shadow:0 2px 10px rgba(20,30,60,.03);
}
.rise-intro .card .icon{
  width:52px; height:52px; border-radius:13px; background:#eaeffb;
  display:flex; align-items:center; justify-content:center; margin-bottom:16px;
  color:#1B3E8C; font-size:22px;
}
.rise-intro .card.on-dark{ background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.14); }
.rise-intro .card.on-dark .icon{ background:rgba(255,255,255,.12); color:#fff; }
.rise-intro .card .tag{ display:block; font-size:11.5px; font-weight:800; letter-spacing:.05em; color:#c6104a; margin-bottom:8px; }
.rise-intro .card.on-dark .tag{ color:#8fb3ff; }
.rise-intro .card h3{ font-size:17px; font-weight:700; margin:0 0 8px; color:#171e2e; }
.rise-intro .card.on-dark h3{ color:#fff; }
.rise-intro .card p{ font-size:13.5px; color:#7e7e7e; margin:0; line-height:1.65; }
.rise-intro .card.on-dark p{ color:rgba(255,255,255,.68); }

.rise-intro .steps{ display:flex; flex-wrap:wrap; margin:0 -11px; counter-reset:step; }
.rise-intro .steps .step{
  flex:1 1 calc(25% - 22px); margin:0 11px 22px; background:#fff; border:1px solid #ececf2;
  border-radius:14px; padding:26px 22px;
}
.rise-intro .steps .step .num{
  width:32px; height:32px; border-radius:50%; background:#1B3E8C; color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; margin-bottom:14px;
}
.rise-intro .steps .step h4{ font-size:15px; font-weight:700; margin:0 0 6px; color:#171e2e; }
.rise-intro .steps .step p{ font-size:13px; color:#7e7e7e; margin:0; line-height:1.6; }
.rise-intro .steps .step.dark-step{ background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.14); }
.rise-intro .steps .step.dark-step h4{ color:#fff; }
.rise-intro .steps .step.dark-step p{ color:rgba(255,255,255,.68); }
.rise-intro .steps .step.accent{ background:#1B3E8C; border-color:#1B3E8C; }
.rise-intro .steps .step.accent .num{ background:#fff; color:#1B3E8C; }
.rise-intro .steps .step.accent h4,
.rise-intro .steps .step.accent p{ color:#fff; }

.rise-intro .pillbar{ display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin-top:30px; }
.rise-intro .pillbar span{
  background:#fff; border:1px solid #ececf2; border-radius:999px; padding:9px 18px;
  font-size:13.5px; font-weight:700; color:#1B3E8C;
}

.rise-intro .statement{ text-align:center; max-width:760px; margin:0 auto; }
.rise-intro .statement .big{ font-size:26px; font-weight:700; line-height:1.55; color:#fff; }
.rise-intro .statement .big .accent{ color:#ff5d8a; }
.rise-intro .statement .sub{ color:rgba(255,255,255,.65); font-size:14px; margin-top:10px; }

.rise-intro .intro-split{ display:flex; gap:44px; align-items:center; flex-wrap:wrap; }
.rise-intro .intro-split > div{ flex:1 1 380px; }
.rise-intro .intro-split h2{ font-size:24px; font-weight:700; margin:0 0 16px; color:#171e2e; }
.rise-intro .intro-split p{ font-size:14.5px; color:#7e7e7e; margin:0 0 12px; line-height:1.7; }
.rise-intro .stat-box{
  background:#f7f8fb; border:1px solid #ececf2; border-radius:14px; padding:26px;
  display:flex; flex-wrap:wrap; gap:20px;
}
.rise-intro .stat-box .stat{ flex:1 1 calc(50% - 20px); }
.rise-intro .stat-box .stat b{ display:block; font-size:19px; color:#1B3E8C; font-weight:700; margin-bottom:4px; }
.rise-intro .stat-box .stat span{ font-size:12.5px; color:#7e7e7e; line-height:1.5; }

.rise-intro .roadmap{ display:flex; gap:22px; flex-wrap:wrap; }
.rise-intro .roadmap .phase{ flex:1 1 300px; border:1px solid #ececf2; border-radius:14px; padding:28px 24px; background:#fff; }
.rise-intro .roadmap .phase .no{ font-size:12.5px; font-weight:800; color:#c6104a; letter-spacing:.05em; }
.rise-intro .roadmap .phase h3{ font-size:18px; font-weight:700; margin:10px 0 12px; color:#171e2e; }
.rise-intro .roadmap .phase .yr{ display:inline-block; font-size:12px; font-weight:700; color:#fff; background:#1B3E8C; padding:4px 12px; border-radius:999px; margin-bottom:14px; }
.rise-intro .roadmap .phase p{ font-size:13.5px; color:#7e7e7e; margin:0 0 6px; line-height:1.6; }

.rise-intro .gov-grid{ display:flex; gap:22px; flex-wrap:wrap; }
.rise-intro .gov-grid .g-card{ flex:1 1 300px; border:1px solid #ececf2; border-radius:14px; padding:28px 24px; background:#fff; }
.rise-intro .gov-grid .g-card .role{ font-size:12.5px; font-weight:800; color:#1B3E8C; letter-spacing:.04em; margin-bottom:8px; display:block; }
.rise-intro .gov-grid .g-card h3{ font-size:17px; font-weight:700; margin:0 0 10px; color:#171e2e; }
.rise-intro .gov-grid .g-card p{ font-size:13.5px; color:#7e7e7e; margin:0; line-height:1.65; }

.rise-intro .org-cols{ display:flex; gap:22px; flex-wrap:wrap; margin-bottom:36px; }
.rise-intro .org-cols .g-card{ flex:1 1 260px; text-align:center; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); border-radius:14px; padding:24px; }
.rise-intro .org-cols .g-card .role{ display:block; font-size:12px; color:rgba(255,255,255,.5); font-weight:700; letter-spacing:.08em; margin-bottom:8px; }
.rise-intro .org-cols .g-card h3{ font-size:16px; font-weight:700; color:#fff; margin:0; }
.rise-intro .orglist{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.rise-intro .orglist span{
  font-size:13px; font-weight:700; color:#fff; background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18); border-radius:999px; padding:8px 18px;
}

/* media-frame shrink-wraps to the rendered image (width:fit-content) plus a small
   even pad. The images themselves are never edited — instead the frame's own
   background-color is set (inline, per image) to match that image's native
   background tone, so the seam between picture and frame disappears. No
   border, no shadow, no rounded corners — just a color match, not an "effect". */
.rise-intro .media-frame{ display:block; width:fit-content; max-width:100%; margin:0 auto; padding:18px; }
.rise-intro .media-frame img{ display:block; max-width:100%; height:auto; }

.rise-intro .hero-media{ margin-bottom:32px; text-align:center; }
.rise-intro .hero-media .media-frame img{ max-height:300px; }

.rise-intro .split-media{ display:flex; align-items:center; justify-content:center; }
.rise-intro .split-media .media-frame img{ max-height:260px; }

@media (max-width: 576px){
  .rise-intro .hero-media .media-frame img{ max-height:220px; }
  .rise-intro .split-media .media-frame img{ max-height:220px; }
}

.rise-intro .pagenav{ border-top:1px solid #ececf2; border-bottom:1px solid #ececf2; }
.rise-intro .pagenav .row2{ display:flex; justify-content:space-between; padding:18px 15px; }
.rise-intro .pagenav a{ font-size:13.5px; font-weight:700; color:#565c68; }
.rise-intro .pagenav a:hover{ color:#1B3E8C; }

.rise-intro .cta-box{ text-align:center; padding:56px 0; background:#f7f8fb; }
.rise-intro .cta-box h2{ font-size:22px; font-weight:700; margin:0 0 10px; color:#171e2e; }
.rise-intro .cta-box p{ font-size:14px; color:#7e7e7e; margin:0 0 22px; }

@media (max-width: 991px){
  .rise-intro .grid.cols-4 > *,
  .rise-intro .grid.cols-6 > *,
  .rise-intro .grid.cols-3 > *{ flex:1 1 calc(50% - 22px); }
  .rise-intro .steps .step{ flex:1 1 calc(50% - 22px); }
}
@media (max-width: 576px){
  .rise-intro .grid > *{ flex:1 1 100% !important; }
  .rise-intro .steps .step{ flex:1 1 100%; }
  .rise-intro .intro-split > div{ flex:1 1 100%; }
}
