/* 초기화 */
html,
body {
  margin: 0;
  padding: 0;
  scroll-behavior: smooth;
}

/* 전체 */
.info-container {
  font-family: 'Spoqa Han Sans Neo', sans-serif;
  max-width: 1200px;
  margin: 0 auto;
  box-sizing: border-box;
}


/* 헤더 */
.header-container {
  width: 100%;
  max-width: 1440px;
  height: 80px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 5%;
  background: #ffffff;
  box-sizing: border-box;
  position: sticky;
  top: 0;
  z-index: 1000;
}

.logo {
  height: 36px;
  width: auto;
}

.nav-menu {
  display: flex;
  gap: 40px;
}

.nav-item {
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 500;
  font-size: 17px;
  line-height: 26px;
  color: #000;
  text-decoration: none;
  position: relative;
  padding-bottom: 6px;
  transition: all 0.3s ease;
}

/* Hover 시 밑줄만 */
.nav-item::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 2px;
  background-color: #FF8A00;
  transition: width 0.3s ease;
}

.nav-item:hover::after {
  width: 100%;
}

.header-divider {
  position: fixed;
  /* <- 화면 기준으로 고정 */
  top: 80px;
  /* 헤더 높이와 정확히 맞춰줌 */
  left: 0;
  width: 100vw;
  height: 2px;
  background: #D9D9D9;
  z-index: 999;
  /* 헤더 아래에 위치하도록 낮춤 */
}

/* 제목 부분 */
.section-hero {
  position: relative;
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  background-color: #fff;
  padding: 80px 20px 0;
  /* 아래쪽 패딩 제거 */
  box-sizing: border-box;
}

.hero-title {
  font-family: 'Spoqa Han Sans Neo', sans-serif;
  font-weight: 700;
  font-size: 44px;
  line-height: 150%;
  color: #3B2610;
  white-space: pre-line;

  width: 1200px;
  /* ✅ 이미지와 너비 맞춤 */
  margin: 0 auto 40px;
  /* ✅ 가운데 정렬 */
  text-align: left;
  /* ✅ 내용은 왼쪽 정렬 */
}

.hero-title .highlight {
  color: #FF8A00;
}

.hero-image-box {
  position: relative;
  width: 100%;
  max-width: 1200px;
  height: 500px;
  background-color: #E8D531;
  border-radius: 30px;
  margin: 0 auto;
  overflow: hidden;
}

.hero-background-image {
  position: absolute;
  top: -101px;
  left: 0;
  width: 1200px;
  height: 801px;
  object-fit: cover;
  z-index: 1;
}

.hero-description {
  font-family: 'Spoqa Han Sans Neo', sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 26px;
  line-height: 150%;
  color: #333333;
  width: 1200px;
  /* ✅ 이미지와 동일하게 맞춤 */
  margin: 40px auto 0;
  /* ✅ 중앙 정렬 */
  white-space: pre-line;
  text-align: left;
  /* ✅ 문단은 왼쪽 정렬 유지 */
}

.hero-description .highlight {
  color: #FF8A00;
  font-weight: 500;
}

.about-container {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 80px;
  max-width: 1200px;
  margin: 100px auto;
  padding: 0 20px;
}

.about-image {
  width: 520px;
  height: 600px;
  border-radius: 30px;
  object-fit: cover;
}

.about-text {
  width: 520px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.about-label {
  font-family: 'Noto Sans KR';
  font-weight: 700;
  font-size: 18px;
  line-height: 150%;
  color: #3B2610;
  display: inline-block;
  position: relative;
}

.about-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  background-color: #FFC900;
  border-radius: 50%;
  margin-left: 5px;
  position: relative;
  top: -2px;
}

.about-title {
  font-family: 'Spoqa Han Sans Neo', sans-serif;
  font-weight: 700;
  font-size: 36px;
  line-height: 130%;
  color: #3B2610;
}

.about-description {
  font-family: 'Spoqa Han Sans Neo', sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 170%;
  color: #333333;
}

.believe-container {
  display: flex;
  align-items: flex-end;
  /* 하단 기준 정렬 */
  justify-content: center;
  gap: 80px;
  max-width: 1200px;
  margin: 100px auto;
  padding: 0 20px;
  padding-top: 60px;
  /* 위에 다른 요소와의 간격 확보 */
}

.believe-image {
  width: 520px;
  height: 600px;
  border-radius: 30px;
  object-fit: cover;
}

.believe-text {
  width: 520px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.believe-label {
  font-family: 'Noto Sans KR';
  font-weight: 700;
  font-size: 18px;
  line-height: 150%;
  color: #3B2610;
  display: inline-block;
  position: relative;
}

.believe-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  background-color: #FFC900;
  border-radius: 50%;
  margin-left: 5px;
  position: relative;
  top: -2px;
}

.believe-title {
  font-family: 'Spoqa Han Sans Neo', sans-serif;
  font-weight: 700;
  font-size: 36px;
  line-height: 130%;
  color: #3B2610;
}

.believe-description {
  font-family: 'Spoqa Han Sans Neo', sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 170%;
  color: #333333;
}

/* 슬로건 */
.slogan-section {
  width: 100%;
  /* 전체 화면 너비로 설정 */
  background-color: #FFF9E5;
  display: flex;
  justify-content: center;
}

.slogan-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 24px;
  box-sizing: border-box;
  font-family: 'Spoqa Han Sans Neo', sans-serif;
  text-align: center;
}

.slogan-header {
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 20px;
  color: #3B2610;
  margin-bottom: 24px;
}

.slogan-header .yellow-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #FFC900;
  margin-left: 8px;
}

.slogan-title {
  font-family: 'Gmarket Sans TTF', sans-serif;
  font-size: 40px;
  font-weight: 700;
  color: #3B2610;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}

.slogan-title .orange {
  color: #FF8A00;
}

.slogan-title .line {
  width: 98px;
  height: 2px;
  background-color: #3B2610;
  display: inline-block;
}

.slogan-sub {
  display: flex;
  justify-content: center;
  gap: 50px;
  font-size: 20px;
  font-weight: 500;
  color: #333;
  margin-bottom: 24px;
}

.slogan-description {
  font-size: 20px;
  font-weight: 400;
  line-height: 170%;
  color: #333333;
  text-align: center;
}

/* ===================== Work Section (PNG 라인 버전) ===================== */

/* ===================== Work Section (boxed) ===================== */

/* ===================== Work Section (boxed & pretty spacing) ===================== */

.work-section{
  width:100%;
  background:#fff;
  position:relative;
  overflow:visible;
  padding-top:24px;
  padding-bottom:64px;
}

/* 1200 컨테이너 */
.work-wrap{
  max-width:1200px;
  margin:0 auto;
  padding:0 24px;
  box-sizing:border-box;
}

/* 제목: 라인 위에 살짝 붙음 */
.work-header{
  display:flex; align-items:center; gap:8px;
  font-family:'Noto Sans KR',sans-serif;
  font-weight:700; font-size:18px; color:#3B2610;
  margin:0 0 10px;
}
.yellow-dot{ width:8px; height:8px; border-radius:50%; background:#FFC900; }

/* 라인: 컨테이너 폭 100%, 비율 유지 */
.work-band{
  width:100%;
  aspect-ratio: 1440 / 155;            /* 피그마 라인 비율 */
  background: url('/work_line.png') center/100% 100% no-repeat;
  margin:0 0 12px;                     /* 라인과 카드 사이 간격(작게) */
  pointer-events:none;
}

/* ---------- 카드 배치 파라미터 (여기 숫자만 만지면 즉시 튜닝) ---------- */
.work-cards{
  --card-top: 64px;                    /* 핀에서 카드까지 세로거리 */
  --card-w:   420px;                   /* 카드 폭(타이틀+설명 적당한 폭) */
  --title-size: 58px;                  /* Create/Connect/Grow 타이틀 크기 */
  --desc-w:   520px;                   /* 설명문 폭 */
  --p1: 18.2%;                         /* 1번 핀(좌) x좌표 % */
  --p2: 45.8%;                         /* 2번 핀(중앙) x좌표 % */
  --p3: 79.0%;                         /* 3번 핀(우) x좌표 % */

  position:relative;
  height: 280px;                       /* 카드 영역 높이(필요시 조절) */
}

/* 카드 공통 */
.work-step{
  position:absolute;
  top: var(--card-top);
  left: 50%;
  transform: translateX(-50%);
  width: min(var(--card-w), 92vw);
  text-align:left;
}

/* 각 카드: 핀 아래 정렬(퍼센트로 움직임) */
.work-step.step1{ left: var(--p1); }
.work-step.step2{ left: var(--p2); }
.work-step.step3{ left: var(--p3); }

/* 타이틀/도트/언더라인/설명 */
.work-title{
  font-family:'Gmarket Sans TTF',sans-serif;
  font-weight:500; 
  font-size: var(--title-size);
  line-height:1.25; 
  color:#000;
  margin:0;
  display:inline-flex; 
  align-items:center; gap:8px;
}
.work-title .title-dot{
  width:10px; height:10px; border-radius:50%; background:#FFC900;
}
.work-title.no-dot .title-dot{ display:none; }

/* 언더라인은 살짝 긴 느낌으로 */
.work-underline{ height:1px; background:#D9D9D9; margin:10px 0 14px; width:100%; }
.u-210{ max-width:240px; }   /* 기존보다 약간 길게 */
.u-252{ max-width:280px; }
.u-169{ max-width:210px; }

.work-desc{
  max-width: var(--desc-w);
  font-family:'Spoqa Han Sans Neo',sans-serif;
  font-size:18px; line-height:150%; color:#444; margin:0;
}

/* Grow + AI 뱃지 */
.grow-row{ display:flex; align-items:center; gap:16px; }
.ai-badge{ position:relative; width:98px; height:98px; border-radius:999px; background:#000; flex:0 0 auto; }
.ai-text{ position:absolute; right:22px; top:22px; font-family:'Gmarket Sans TTF',sans-serif; font-weight:500; font-size:48px; line-height:1; color:#fff; }
.plus-vert,.plus-horz{ position:absolute; background:#fff; }
.plus-vert{ width:3px; height:26px; left:12px; top:35px; }
.plus-horz{ width:26px; height:3px; left:0; top:47px; }

/* ===================== 반응형 ===================== */
/* 1100↓ : 살짝 줄이기 */
@media (max-width:1100px){
  .work-cards{ --card-w: 380px; --title-size:52px; --desc-w:480px; --card-top:58px; }
}

/* 1024↓ : 절대배치 → 그리드 전환 */
@media (max-width:1024px){
  .work-cards{
    height:auto;
    display:grid; grid-template-columns:repeat(2,1fr);
    gap:36px 28px;
  }
  .work-step{ position:static; transform:none; width:auto; }
}

/* 768↓ : 한 칼럼 */
@media (max-width:768px){
  .work-cards{ grid-template-columns:1fr; gap:28px; text-align:center; }
  .work-title{ justify-content:center; font-size:40px; }
  .grow-row{ justify-content:center; }
  .work-underline{ margin-inline:auto; }
  .work-desc{ font-size:16px; max-width: 92vw; }
  .ai-badge{ width:84px; height:84px; }
  .ai-text{ right:18px; top:18px; font-size:42px; }
  .plus-vert{ height:24px; left:11px; top:32px; }
  .plus-horz{ width:24px; top:44px; }
}

/* 480↓ */
@media (max-width:480px){
  .work-title{ font-size:34px; }
  .ai-badge{ width:72px; height:72px; }
  .ai-text{ right:15px; top:15px; font-size:36px; }
}

/* === Service Header (Group 45/46) === */
.svc-head {
  position: relative;
  width: 446px;
  /* 피그마: Group width */
  height: 27px;
  /* 피그마: Group height */
  margin: 80px auto 0;
  /* top: 80px, 가로 중앙 정렬 (calc 대체) */
  box-sizing: border-box;
}

/* 텍스트 (피그마 타이포 그대로) */
.svc-head__text {
  margin: 0;
  font-family: 'Noto Sans KR', sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 18px;
  /* 피그마 */
  line-height: 150%;
  /* 27px */
  color: #3B2610;
  /* 피그마 컬러 */
  text-align: center;
  /* Group 중앙 정렬 */
  white-space: nowrap;
  /* 한 줄 유지 (피그마 박스 높이 동일) */
}

/* Ellipse 11 (노란 점) */
.svc-head__dot {
  position: absolute;
  right: -16px;
  /* 그룹 오른쪽 바깥 여백으로 살짝 */
  top: 50%;
  width: 8px;
  height: 8px;
  background: #FFC900;
  border-radius: 50%;
  transform: translateY(-50%);
  display: inline-block;
}

/* 반응형: 좁은 화면에서 폭/폰트 줄이기(선택) */
@media (max-width: 480px) {
  .svc-head {
    width: 90%;
    height: auto;
    /* 텍스트 줄바꿈 허용시 auto */
  }

  .svc-head__text {
    font-size: 16px;
    white-space: normal;
    /* 필요하면 줄바꿈 허용 */
    text-wrap: balance;
    /* 지원 브라우저에서 균형 잡힌 줄바꿈 */
  }

  .svc-head__dot {
    right: -12px;
    width: 6px;
    height: 6px;
  }
}

/* 프레임(주황 박스) */
.svc-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 40px;

  width: 1200px;
  margin: 40px auto 0;
  /* top: 152px, 좌우 중앙 정렬 */
  padding: 80px 80px 0;
  /* Figma: 80 80 0 */
  background: #FFF7E6;
  border-radius: 40px;
  box-sizing: border-box;
}

/* 좌측 컬럼 */
.svc-left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  /* Figma gap: 20 */
  width: 629px;
  /* Figma width */
}


.svc-icon {
  width: 68px;
  height: 68px;
}

.svc-icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* 텍스트 */
.svc-left__text {
  padding-bottom: 80px;
}

/* Figma: padding-bottom: 80 */
.svc-title {
  display: flex;
  gap: 0;
  font-size: 36px;
  font-weight: 700;
  line-height: 150%;
  /* 54px */
  margin: 0 0 12px;
}

.svc-title .accent {
  color: #FF8A00;
}

.svc-title span:not(.accent) {
  color: #4A2F14;
}

.svc-desc {
  width: 586px;
  /* Figma 본문 폭 */
  font-size: 19px;
  line-height: 170%;
  text-align: justify;
  color: #444;
  margin: 0 0 16px;
}

.svc-desc.strong {
  font-weight: 700;
  color: #444;
}

.svc-desc .emph {
  display: block;
  font-weight: 700;
}

/* 2) 두 문장 머리말 점(불릿) */
.svc-bullets {
  margin: 0 0 16px;
  padding-left: 20px;
  /* 들여쓰기 */
  list-style-type: disc;
  /* ✅ 점 강제 */
  list-style-position: outside;
}

.svc-bullets li {
  display: list-item;
  /* ✅ 점 보이게 강제 */
  list-style-type: disc;
  /* 리셋에 li{list-style:none} 대비 */
  width: 586px;
  /* 본문 폭과 맞춤 */
  font-size: 19px;
  line-height: 170%;
  text-align: justify;
  color: #131416;
  margin: 0 0 8px;
}

.svc-bullets li::marker {
  color: #4A2F14;
  /* 갈색 불릿 */
  font-size: .7em;
}

/* 3) 마지막 줄 한 줄로 고정 */
.svc-desc.last-line {
  white-space: nowrap;
  font-size: 18px;
  /* 한 줄 유지 위해 살짝 다운 (필요 시 19px로 올려봐도 OK) */
}

@media (max-width: 900px) {
  .svc-desc.last-line {
    white-space: normal;
  }

  /* 모바일에선 줄바꿈 허용 */
}


/* 우측 이미지(모바일 화면) */
.svc-right {
  width: 371px;
}

.svc-mock {
  width: 371px;
  /* Figma: 371 */
  height: auto;
  border: 10px solid #FFF;
  border-radius: 30px 30px 0 0;
  display: block;
}

/* 반응형(선택): 좁은 화면에서 스택 */
@media (max-width: 1280px) {
  .svc-card {
    width: auto;
    margin: 120px 24px 0;
  }
}

@media (max-width: 900px) {
  .svc-card {
    flex-direction: column;
    align-items: flex-start;
    padding: 48px 24px;
    gap: 24px;
  }

  .svc-left,
  .svc-desc {
    width: 100%;
  }

  .svc-right,
  .svc-mock {
    width: 100%;
    max-width: 371px;
  }
}

/* 컨테이너 폭/간격 */
.svc-strap{
  width: 1200px;
  margin: 110px auto 0;         /* 위 섹션과 간격: 필요시 40~56px로 조절 */
}

/* 텍스트 스타일 (피그마 값) */
.svc-strap__text{
  width: 669px;
  font-family: 'Spoqa Han Sans Neo', sans-serif;
  font-weight: 500;
  font-size: 24px;
  line-height: 150%;           /* 39px */
  color: #4A2F14;              /* 본문 갈색 */
  text-align: left;
  word-break: keep-all;
}

.nowrap{ white-space: nowrap; }             /* '혁신적인 플랫폼으로' 단어쌍 고정 */

/* 강조 */
.svc-strap__text .accent{ color: #FF8A00; }

/* 반응형: 모바일에서는 강제 줄바꿈 제거 */
@media (max-width: 900px){
  .svc-strap{ width:auto; margin:32px 24px 0; }
  .svc-strap__text{ width:100%; font-size:22px; }
  .svc-strap__text .br-desktop{ display:none; }
}

/* 전체 레이아웃 */
.svc-split.svc-split--chan{
  width: 1200px;
  margin: 80px auto 0;
  display: flex;
  align-items: center;
  gap: 64px;
}

/* 좌측 카드 (Frame 16978) */
.svc-split--chan .svc-split__media{
  position: relative;
  width: 663px;
  height: 516px;
  background: #FFF7E6;
  border-radius: 28px;
  overflow: hidden; /* 그림자/이미지 넘침 방지(원하면 제거) */
}

/* 폰 (image 677) */
.svc-split--chan .split-phone{
  position: absolute;
  left: 144px;
  top: 66px;
  width: 374.49px;
  height: 450px;
  border: 10px solid #FFFFFF;
  border-radius: 35px 35px 0 0;
  display: block;
  object-fit: cover;
  z-index: 1;
}

/* 툴바 (image 678) */
.svc-split--chan .split-tools{
  position: absolute;
  left: 26px;
  top: 232px;
  width: 611px;
  height: 55px;
  border-radius: 18px;
  display: block;
  filter: drop-shadow(0 0 10px #FF8A00);
  z-index: 2; /* 원 위/폰 위로 */
}

/* Ellipse 5,6 (빨간 원) */
.svc-split--chan .blob{
  position: absolute;
  background: #FF0707;
  opacity: 0.1;
  border-radius: 50%;
  z-index: 3; /* 툴바 아래, 배경 위 */
}
.svc-split--chan .blob-lg{ /* Ellipse 5 */
  width: 88px; height: 88px;
  left: 144px; top: 216px;
}
.svc-split--chan .blob-sm{ /* Ellipse 6 */
  width: 52px; height: 52px;
  left: 162px; top: 234px;
}

/* 오른쪽 카피 (Frame 16974) */
.svc-split--chan .svc-split__copy{ flex: 1; }
.svc-split--chan .svc-split__title{
  width: 455px;
  margin: 0 0 12px;
  font-family: 'Spoqa Han Sans Neo', sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 150%;
  color: #4A2F14;
}
.svc-split--chan .svc-split__desc{
  width: 469px;
  margin: 0 0 8px;
  font-family: 'Spoqa Han Sans Neo', sans-serif;
  font-weight: 400;
  font-size: 19px;
  line-height: 1.8;
  color: #333333;
  text-align: left;
  word-break: keep-all;
}

/* 첫 문단을 딱 3줄 느낌으로 맞춤 */
.svc-split--chan .svc-split__desc.lead{
  width: auto;             /* 고정폭(469px) 해제 */
  max-width: 520px;        /* ← 3줄 맞추는 폭. 500~540px 사이에서 미세조정 OK */
  text-wrap: balance;      /* 줄 너비 균형(지원 브라우저에서) */
  word-break: keep-all;    /* 한국어 단어 나눔 최소화 */
}

/* (선택) 좁은 화면 스택 */
@media (max-width: 900px){
  .svc-split.svc-split--chan{
    width: auto;
    margin: 48px 24px 0;
    flex-direction: column;
    gap: 24px;
  }
  .svc-split--chan .svc-split__media{ width: 100%; }
  .svc-split--chan .svc-split__desc, 
  .svc-split--chan .svc-split__title{ width: 100%; }
}

/* 섹션 레이아웃 (고유 클래스) */
.svc-allin{
  width: 1200px;
  margin: 80px auto 0;
  display: flex;
  align-items: center;
  gap: 64px;
}

/* 좌측 텍스트 — 이전 확정값과 동일 */
.svc-allin .allin-copy{ flex: 1; max-width: 455px; }
.allin-title{
  margin: 0 0 12px;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1.5;
  color: #4A2F14;
}
.allin-desc{
  margin: 0;
  font-family: 'Spoqa Han Sans Neo', sans-serif;
  font-weight: 400;
  font-size: 18px;        /* 최종 확정값 */
  line-height: 1.8;       /* 최종 확정값 */
  color: #333;
  text-align: left;
  word-break: keep-all;
}

/* 우측 카드(배경 프레임) — Figma: 663x516 */
.allin-card{
  position: relative;
  width: 663px;
  height: 516px;
  background: #FFF7E6;
  border-radius: 28px;
  overflow: hidden;
}

/* image 680 (툴 메뉴) — Figma 좌표 */
.allin-menu{
  position: absolute;
  left: 71px;
  top: 0px;
  width: 238.66px;
  height: 348px;
  object-fit: cover;
  border-radius: 0 0 30px 30px;
  filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.1));
  z-index: 2;
  display: block;
}

/* image 686 (폰) — Figma 좌표 */
.allin-phone{
  position: absolute;
  left: 340px;
  top: 174px;
  width: 252px;
  height: 410px;
  object-fit: cover;
  border: 10px solid #FFFFFF;
  border-radius: 20px;
  filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.1));
  z-index: 2;
  display: block;
}

/* Ellipse 5,6 — 맨 위로 */
.allin-card .blob{
  position: absolute;
  background: #FF0707;
  opacity: 0.1;
  border-radius: 50%;
  z-index: 3;                 /* 이미지들 위 */
  pointer-events: none;
}
.allin-card .blob-lg{ width: 88px; height: 88px; left: 107px; top: 50px; }
.allin-card .blob-sm{ width: 52px; height: 52px; left: 125px; top: 68px; }

/* 반응형(선택) */
@media (max-width: 900px){
  .svc-allin{
    width: auto;
    margin: 48px 24px 0;
    flex-direction: column;
    gap: 24px;
  }
  .svc-allin .allin-copy{ max-width: none; }
}

/* 레이아웃(관리 섹션) */
.svc-manage{
  width: 1200px;
  margin: 64px auto 0;
  display: flex;
  align-items: center;
  gap: 64px;
}

/* 카드 프레임 (Frame 16983) */
.manage-card{
  position: relative;
  width: 663px;
  height: 516px;
  background: #FFF7E6;
  border-radius: 28px;
  overflow: hidden;               /* 685는 주황박스까지만 보이게 */
}

/* image 684 (service_teamflow.png) */
.manage-phone{
  position: absolute;
  left: calc(50% - 301.71px/2 - 120.5px);
  top: 65px;
  width: 301.71px;
  height: 451px;
  object-fit: cover;
  border: 10px solid #FFFFFF;
  border-radius: 35px 35px 0 0;
  z-index: 1;
  display: block;
}

/* image 685 (project_setting.png) */
.manage-board{
  position: absolute;
  left: 92px;
  top: 229px;
  width: 1024.23px;
  height: 254px;
  object-fit: cover;
  z-index: 2;                     /* 폰 아래, 원 아래 */
  display: block;
}

/* Ellipse 5,6 (맨 위로) */
.manage-card .blob{
  position: absolute;
  background: #FF0707;
  opacity: 0.1;
  border-radius: 50%;
  z-index: 4;                     /* 최상단 */
  pointer-events: none;
}
.manage-card .blob-lg{ width: 88px; height: 88px; left: 88px; top: 41px; }
.manage-card .blob-sm{ width: 52px; height: 52px; left: 106px; top: 59px; }

/* 오른쪽 텍스트 (관리) */
.manage-copy{ flex: 1; max-width: 455px; }
.manage-title{
  margin: 0 0 12px;
  font-family: 'Spoqa Han Sans Neo', sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1.5;
  color: #4A2F14;
}
.manage-desc{
  margin: 0;
  font-family: 'Spoqa Han Sans Neo', sans-serif;
  font-weight: 400;
  font-size: 18px;               /* 섹션들 통일 */
  line-height: 1.8;
  color: #333333;
  text-align: left;
  word-break: keep-all;
}

/* 반응형(선택) */
@media (max-width: 900px){
  .svc-manage{
    width: auto;
    margin: 48px 24px 0;
    flex-direction: column;
    gap: 24px;
  }
  .manage-copy{ max-width: none; }
}


/* ===== 풀-블리드 띠(양옆 100%) ===== */
.cta-band{
  position: relative;
  left: 50%;
  right: 50%;
  margin-top: 65px;
  margin-left: -50vw;     /* 부모가 1200px 컨테이너여도 화면 전체로 펼침 */
  margin-right: -50vw;
  width: 100vw;

  background: linear-gradient(90deg, #FFF9E5 0%, #FFE6CD 100%);
}

/* 내부 컨테이너 (Figma padding/높이 반영) */
.cta-band__inner{
  max-width: 1200px;      /* 페이지 그리드 */
  margin: 0 auto;
  min-height: 174px;
  padding: 40px 0;

  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

/* 기본 문구 색은 진갈색, 강조만 주황 */
.cta-band__title{
  margin: 0;
  max-width: 1047px;
  font-family: 'Spoqa Han Sans Neo', sans-serif;
  font-weight: 700;
  font-size: 30px;
  line-height: 150%;
  color: #3B2610;            /* ← 기본 */
}
.cta-band__title .accent{ color: #FF8A00; }  /* ← 강조만 주황 유지 */

/* 버튼 (Figma: 153x48, 12px radius) */
.cta-band__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 153px;
  height: 48px;
  padding: 12px;
  gap: 10px;

  background: #FFFFFF;
  border-radius: 12px;
  text-decoration: none;

  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 500;
  font-size: 17px;
  line-height: 150%;
  color: #131416;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
}

/* 반응형(옵션) */
@media (max-width: 900px){
  .cta-band__inner{ padding: 24px; min-height: auto; flex-direction: column; align-items: flex-start; }
  .cta-band__title{ font-size: 22px; }
}

/* ================= Footer ================= */
.site-footer{
  background:#fff;
  /* CTA 띠 바로 아래에 붙이려면 margin-top:0; 필요하면 숫자 조절 */
  margin-top: 0;
  border-top: 0;
}

.footer-inner{
  width: 1200px;             /* 페이지 그리드 */
  margin: 0 auto;
  padding: 60px 80px;        /* Figma: 60/80 */
  display: flex;
  align-items: center;
  gap: 24px;                 /* Figma gap */
}

.footer-logo img{
  
  display:block;
  width:324px;
  height:auto;               /* 비율 유지 */
}

/* 오른쪽 영역 */
.footer-right{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:8px;                   /* Figma: 8px */
}

/* 링크 줄 */
.footer-links{
  display:flex;
  align-items:center;
  gap:24px;                  /* Figma: 40px */
  list-style:none;
  padding:0; margin:0;
}

.footer-links a{
  font-family:'Noto Sans KR',sans-serif;
  font-weight:500;
  font-size:17px;
  line-height:150%;
  color:#131416;
  text-decoration:none;
}
.footer-links a:hover{ text-decoration:underline; }

/* 카피라이트 */
.copyright{
  font-family:'Spoqa Han Sans Neo',sans-serif;
  font-weight:400;
  font-size:14px;
  line-height:150%;
  letter-spacing:-0.5px;
  color:#6D7882;
}

/* 반응형 */
@media (max-width: 900px){
  .footer-inner{ width:auto; padding:32px 24px; flex-direction:column; align-items:flex-start; gap:24px; }
  .footer-logo img{ width:240px; }
  .footer-links{ flex-wrap:wrap; gap:16px 24px; }
}