@charset "UTF-8";

/* CON14 — 게시판 메뉴와 물결 */
.con14 {
  padding-top: 2.6vw;
  padding-bottom: 4.4vw;
  background-color: var(--color-pale-blue);
  font-family: "Paperlogy";
}
.con14_surface {
  width: 94.4882%;
  padding-bottom: calc(var(--px) * 75);
  border-radius: calc(var(--px) * 40);
  background-color: #fff;
}
.con14_water {
  inset: 0;
  overflow: hidden;
  border-radius: inherit;
}
.con14_water::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(127,201,230,0) 60%, rgba(127,201,230,0.035) 74%, rgba(127,201,230,0.188) 86%, rgba(127,201,230,0.55) 100%);
}
.con14_wave {
  width: calc(var(--px) * 8228);
  left: -45.3%;
  top: 27.2vw;
}
.con14_wave_img {
  width: calc(var(--px) * 4114);
  aspect-ratio: 4114 / 661;
  flex-shrink: 0;
}
.con14_word {
  font-size: calc(var(--px) * 150);
  font-weight: 800;
  line-height: 6.4vw;
  letter-spacing: -0.3vw;
  color: var(--color-pale-blue);
}
.con14_lead {
  margin-top: 1.6vw;
  font-size: calc(var(--px) * 42);
  font-weight: 200;
  line-height: 2.6vw;
  letter-spacing: -0.1vw;
  color: #000;
}
.con14_title {
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 60);
  font-weight: 800;
  line-height: 3.8vw;
  letter-spacing: -0.1vw;
  color: #000;
}
.con14_menu {
  width: 100%;
  box-sizing: border-box;
  padding-left: calc(var(--px) * 176);
  margin-top: 0.8vw;
  column-gap: calc(var(--px) * 33);
  justify-content: flex-start;
}
.con14_feature {
  display: grid;
  place-items: center;
  width: calc(var(--px) * 566);
  height: calc(var(--px) * 447);
  flex-shrink: 0;
}
.con14_feature_img {
  width: calc(var(--px) * var(--menu-feature-width));
  grid-area: 1 / 1;
}
.con14_star {
  left: 14.3%;
  top: 0.5vw;
  font-size: calc(var(--px) * 91);
  font-weight: 600;
  line-height: 4.8vw;
  letter-spacing: -0.2vw;
  color: var(--color-point);
  z-index: 99;
}
.con14_label {
  bottom: 2.5vw;
  max-width: 90%;
  box-sizing: border-box;
  padding: calc(var(--px) * 10) calc(var(--px) * 18);
  border-radius: calc(var(--px) * 10);
  background-color: var(--color-point);
  color: #fff;
  font-size: calc(var(--px) * 25);
  font-weight: 800;
  line-height: 1.4vw;
  letter-spacing: 0vw;
  text-align: center;
}
.con14_rail {
  width: calc(var(--px) * 924 + 2.1vw);
  align-self: flex-start;
  flex-shrink: 0;
  overflow: hidden;
  margin-top: 5.1vw;
  cursor: grab;
  user-select: none;
  touch-action: pan-y;
}
.con14_rail.is-grabbing,
.con14_rail.is-grabbing .con14_select { cursor: grabbing; }
.con14_list {
  width: 100%;
  justify-content: flex-start;
  gap: 0.7vw;
}
.con14_item {
  flex-shrink: 0;
}
.con14_select {
  cursor: inherit;
  width: calc(var(--px) * 231);
  height: calc(var(--px) * 231);
  box-sizing: border-box;
  border: 1px solid #cde4ed;
  border-radius: 50%;
  background-color: #fff;
}
.con14_select:focus-visible {
  outline: 2px solid var(--color-point);
}
.con14_thumb_stage {
  width: calc(var(--px) * 156);
  height: calc(var(--px) * 145);
  flex-shrink: 0;
}
.con14_thumb_img {
  width: calc(var(--px) * var(--menu-thumb-width));
  opacity: 0.4;
}
.con14_name {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  flex-shrink: 0;
  max-width: 90%;
  margin-top: 0.5vw;
  color: #b7cfd8;
  font-size: calc(var(--px) * 22);
  font-weight: 800;
  line-height: 1.2vw;
  letter-spacing: 0vw;
}
.con14_empty {
  font-size: calc(var(--px) * 25);
}

section {
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  flex-direction: column;
}

section {
  font-family: "Pretendard Variable";
  font-weight: 300;
  font-size: calc(var(--px) * 18);
  letter-spacing: -0.04vw;
}

section img {
  width: 100%;
}

/* 마커디자인 */
.map_marker {
  position: relative;
  display: inline-block;
}

/* 말풍선 텍스트 박스 */
.map_marker_text {
  background: #711835;
  border: 1px solid #fff;
  padding: 9px 19px;
  border-radius: 100px;
  font-size: 13px;
  font-weight: 500;
  color: #fff;
  white-space: nowrap;
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
}

/* 말풍선 꼬리 (삼각형 테두리) */
.map_marker_tail {
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid #fff;
}

/* 말풍선 꼬리 내부 (흰색 채우기) */
.map_marker_tail::after {
  content: "";
  position: absolute;
  top: -9px;
  left: -7px;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 7px solid #711835;
}

/* 퍼블시작 */

/* ===== 모바일 지도 터치 잠금 오버레이 (md/map_zoom_control.md §3) ===== */
.map-touch-lock-parent {
  position: relative;
}

.map-touch-lock {
  position: absolute;
  z-index: 30;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0;
  color: #fff;
  background: rgba(0, 0, 0, 0.58);
  border: 0;
  box-sizing: border-box;
  text-align: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: pan-y;
}

.map-touch-lock-text {
  display: block;
  padding: 0 calc(var(--px) * 20);
  font-size: calc(var(--px) * 16);
  font-weight: 700;
  line-height: 1.3;
  word-break: keep-all;
}

.is-map-touch-unlocked .map-touch-lock {
  opacity: 0;
  pointer-events: none;
}

@media (max-width: 599px) {
  .map-touch-lock-text {
    font-size: 4.3vw;
    padding: 0 4vw;
  }
}

/* ═══════════════════════════ MAIN — 히어로 ═══════════════════════════ */

.main {
  /* 첫 화면에 4개 강점 카드가 퀵바에 안 가려지고 다 보이게 한다 (기획 수정안 260930 「상단 공간 축소」).
     화면이 낮으면 위쪽 여백(--hero-p) 부터, 그래도 모자라면 로고~카드 간격(--hero-g) 을 줄이고, 화면이 충분하면 시안값(9vw · 10.6vw) 그대로다.
     --hero-a = 위 여백 + 로고~카드 간격에 쓸 수 있는 높이 = 화면 높이 − (헤더~제목~로고~카드 고정분 645.7 + 퀵바 73 + 여유 12) × --px.
     섹션 높이는 줄인 만큼 같이 줄이고 배경을 아래에 붙여(카드·배경 매장의 상하 관계 유지) 위쪽 백지만 잘려 나간다. */
  --hero-a: calc(100svh - var(--px) * 730.7);
  --hero-p: clamp(calc(var(--px) * 20), calc(var(--hero-a) - 10.6vw), 9vw);
  --hero-g: clamp(calc(var(--px) * 110), calc(var(--hero-a) - var(--hero-p)), 10.6vw);
  box-sizing: border-box;
  justify-content: flex-start;
  /* 고정 헤더 높이(143px)만큼 내린다 — height 1113 고정이라 padding 이 아닌 margin.
     헤더 height 와 같은 식으로 쓴다: 7.5vw(142.875px)면 아래 섹션 문서 top 이 소수가 돼 캡처가 1px 밀린다 */
  margin-top: calc(var(--px) * 143);
  height: calc(var(--px) * 1113 - (9vw - var(--hero-p)) - (10.6vw - var(--hero-g)));
  padding-top: var(--hero-p);
  padding-bottom: 12.5vw;
  background-color: #ffffff;
  background-image: url('/images/main_01.jpg');
  background-position: center bottom;
  /* 쌓임 맥락을 만들어 아래 ::before(배경을 지우는 막)를 배경 위·내용 아래에 둔다 */
  position: relative;
  z-index: 0;
}

/* 히어로 배경 사진을 흰색으로 녹이는 막 — 배경 위·내용 아래(위 .main 이 쌓임 맥락이라 z-index -1 이 내용 아래로 들어간다).
   --main-veil 0 → 1 을 js/animation.js(con01-m03)가 스크롤에 맞춰 올린다: 매장이 배경에서 떨어져 나올 때 벽·바닥이 흰색으로 녹는다. */
.main::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  background-color: #ffffff;
  opacity: var(--main-veil, 0);
}

.main_tit {
  gap: 2.1vw;
  font-family: "Paperlogy";
  font-weight: 800;
  font-size: calc(var(--px) * 100);
  letter-spacing: -0.21vw;
  line-height: 4.7vw;
  color: #000000;
}

.main_tit_bracket {
  font-family: "Paperlogy";
  font-weight: 500;
  color: var(--color-point);
}

.main_point {
  color: var(--color-point);
}

.main_desc {
  margin-top: 1.7vw;
  font-weight: 600;
  font-size: calc(var(--px) * 35);
  letter-spacing: -0.07vw;
  line-height: 1.7vw;
  color: #000000;
}

.main_logo {
  width: calc(var(--px) * 264);
  aspect-ratio: 264 / 95;
  margin-top: 4.2vw;
  flex-shrink: 0;
}

/* main-m01~m03·m06 첫 화면 깜빡임 방지 (유저 지시 2026-09-17) — 완성 타이틀이 한 번 보였다 사라지지 않게 처음부터 숨긴다.
 * js/animation.js 가 글자·괄호를 숨기는 같은 순간에 인라인으로 넘겨받는다. JS 가 못 돌면 3초 뒤 스스로 나타난다. */
.main_tit,
.main_desc,
.main_logo {
  opacity: 0;
  animation: main_reveal 0.4s ease 3s forwards;
}

@media (prefers-reduced-motion: reduce) {
  .main_tit,
  .main_desc,
  .main_logo {
    opacity: 1;
    animation: none;
  }
}

.main_stats {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  gap: 0.8vw;
  margin-top: var(--hero-g);
  flex-shrink: 0;
}

/* main-m04 — js/animation.js 가 .main_stat_dark 를 카드마다 순환 부여한다.
 * 그라데이션은 보간이 안 되므로 다크 그라데이션을 위 레이어로 얹고 알파(--main-stat-dark)만 튼다.
 * @property 로 등록해야 transition 이 걸린다 (미지원 브라우저는 전환 없이 즉시 바뀐다). */
@property --main-stat-dark {
  syntax: "<number>";
  inherits: false;
  initial-value: 0;
}

.main_stat {
  --main-stat-dark: 0;
  --main-stat-note: rgba(135, 135, 135, 0.502);
  box-sizing: border-box;
  width: calc(var(--px) * 321);
  height: calc(var(--px) * 172);
  border-radius: calc(var(--px) * 34);
  box-shadow: 0 0 16px rgba(0, 0, 0, 0.05);
  background: linear-gradient(180deg, rgba(7, 35, 70, var(--main-stat-dark)) 0%, rgba(7, 35, 70, var(--main-stat-dark)) 65%, rgba(8, 40, 79, var(--main-stat-dark)) 70%, rgba(11, 48, 94, var(--main-stat-dark)) 80%, rgba(14, 57, 110, var(--main-stat-dark)) 90%, rgba(15, 61, 118, var(--main-stat-dark)) 100%), linear-gradient(180deg, #ffffff 0%, #ffffff 65%, #f6fafc 70%, #e5f1f6 80%, #d5e8f0 90%, #cde4ed 100%);
  transition: --main-stat-dark 0.5s ease, margin-top 0.5s ease, color 0.5s ease;
}

.main_stat_dark {
  --main-stat-dark: 1;
  --main-stat-note: rgba(255, 255, 255, 0.302);
  margin-top: -2.6vw;
  color: #ffffff;
}

/* 라벨·값은 color 를 선언하지 않는다 — 카드(li)의 color 를 상속받아야 .main_stat_dark 전환 때 같이 바뀐다. */
.main_stat_label {
  font-weight: 600;
  font-size: calc(var(--px) * 22);
  line-height: 1.6vw;
}

.main_stat_value {
  font-family: "Paperlogy";
  font-weight: 800;
  font-size: calc(var(--px) * 35);
  letter-spacing: -0.07vw;
  line-height: 2.5vw;
}

.main_stat_note {
  margin-top: 0.3vw;
  font-weight: 400;
  font-size: calc(var(--px) * 13);
  letter-spacing: -0.03vw;
  line-height: 0.6vw;
  color: var(--main-stat-note);
  transition: color 0.5s ease;
}

/* ═══════════════════════════ CON01 — 매장을 먼저 생각하니 잘되는 브랜드가 되었습니다 ═══════════════════════════ */

/* 섹션 프레임 = 시안 947 고정 — 흐름합 946.24 가 소수라 아래 섹션 문서 top 이 소수가 되고 요소 캡처가 1px 밀린다 (main 과 같은 처리) */
.con01 {
  box-sizing: border-box;
  height: calc(var(--px) * 947);
  justify-content: flex-start;
  padding-top: 5.9vw;
  padding-bottom: 5.5vw;
  background-color: #ffffff;
  /* 히어로 매장 자리로 올려 둔 무대(.con01_slide)가 섹션 밖(히어로 위)에서도 보이도록 자르지 않는다 — 아래 「이어붙이기」 주석 참고 */
  overflow: visible;
}

/* 히어로 끝 끌어올리기 — 사진이 녹고 강점 카드가 사라진 뒤 히어로 아래쪽(로고 아래 ~ 섹션 끝)은 빈 백지라, CON01 을 로고 바로 아래까지 끌어올려
   카드가 내려앉는 거리·펼침까지 스크롤할 거리를 줄인다(클라이언트 2026-10-02 「이동 거리가 너무 멀어 스크롤이 낭비 — 저 구간 최소화」).
   --hero-tail(로고 bottom ~ 히어로 끝, px)과 이 클래스는 js/animation.js(con01-m03)가 레이아웃을 재서 붙인다 — JS 가 없거나 모션 줄이기면 원래 흐름(히어로 아래)이다.
   맨 위에서는 CON01(제목·무대)이 숨어 있어 아래 강점 카드·사진을 가리지 않는다. */
.con01.is_tucked {
  margin-top: calc(var(--hero-tail) * -1);
}

.con01_head {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.con01_star {
  left: 18.2%; /* 제목 첫 글자 왼쪽 위 — 제목 폭이 바뀌면(2026-10-02 문구 변경: 한 줄이 길어졌다) 같이 옮긴다. 이전 28.1% */
  top: -0.6vw;
  font-family: "Paperlogy";
  font-weight: 600;
  font-size: calc(var(--px) * 92);
  line-height: 2vw;
  color: var(--color-point);
}

.con01_title {
  font-family: "Paperlogy";
  font-weight: 800;
  font-size: calc(var(--px) * 60);
  letter-spacing: -0.13vw;
  line-height: 2.8vw;
  color: #000000;
}

.con01_stage {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  margin-top: 6.6vw;
}

/* 매장 커버플로우 — 카드 코너(원근)·투명도·반사 투명도는 js/slide.js 가 슬롯 표로 보간(matrix3d).
   카드가 전부 absol 이라 컨테이너 높이를 메인 매장 높이(550)로 준다. 반사가 아래로 넘쳐 overflow 해제 */
.con01_slide {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: calc(var(--px) * 550);
  overflow: visible;
}

/* matrix3d 는 카드 박스 좌상단 기준 호모그래피 → 원점 고정 */
.con01_card {
  transform-origin: 0 0;
}

.con01_card_store {
  width: calc(var(--px) * 1099);
  aspect-ratio: 1099 / 550;
}

/* 사진 카드 — 가운데 855×550 (메인 매장 높이 맞춤) */
.con01_card_photo {
  width: calc(var(--px) * 855);
  aspect-ratio: 855 / 550;
}

/* 반사 — 투명도가 알파에 구워져 있어 CSS 는 slide.js 의 가운데 가중치만. 가로 좌표 없음 = 카드 flex center */
.con01_reflect_store {
  top: 28.5vw;
  width: calc(var(--px) * 1158);
  aspect-ratio: 1158 / 141;
}

.con01_reflect_photo {
  top: 28.9vw;
  width: calc(var(--px) * 855);
  aspect-ratio: 855 / 141;
}

/* 히어로 → CON01 이어붙이기 (con01-m03, 기획 수정안 260930)
   커버플로우 무대(.con01_slide — 진짜 카드들)는 제 자리(흐름)에 그대로 있고, js/animation.js 가 스크롤 0 에서 transform 으로 히어로 배경 사진 속 매장 자리에 올려 겹쳐 둔다.
   무대도 사진도 페이지와 함께 스크롤되니 어긋나지 않고, 스크롤을 조금 내리면 사진이 흰색으로 녹고 같은 그림의 카드가 드러난다. 그다음 시간 트윈으로 카드가 제 자리로 스윽 내려앉으며 줄어들고 옆 카드가 펼쳐진다.
   고정(fixed)도 스크롤 연동(scrub)도 쓰지 않는다. 올려 둔 무대가 히어로 위에 보이려면 섹션이 자르지 않아야 해서 .con01 은 overflow: visible 이다(z-index 없이 문서 순서로 히어로 위에 그려진다).
   위치·크기·확대·투명도는 js/animation.js 가 채운다. */

/* 간판은 히어로 로고와 벌어진 뒤에 드러난다 — 카드 위쪽 --cut(로고 bottom 이 카드 안 몇 % 지점인지, 최소 16%)까지는 비워 로고를 가리지 않고,
   그 안의 간판 글자 자리(위 16%)는 --sign 0 → 1 로 로고가 완전히 벗어난 뒤에 드러난다 (둘 다 js). 반사(.con01_reflect)는 카드 밖이라 마스크 대상이 아니다.
   변수는 상속으로 받는다(img 에서 다시 선언하면 상속이 끊긴다). 제 자리에 앉으면 js 가 클래스를 뗀다 */
.con01_slide.is_gliding .con01_card_store > img {
  -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, var(--sign, 0)) 0%, rgba(0, 0, 0, var(--sign, 0)) var(--cut, 16%), #000000 calc(var(--cut, 16%) + 5.5%));
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, var(--sign, 0)) 0%, rgba(0, 0, 0, var(--sign, 0)) var(--cut, 16%), #000000 calc(var(--cut, 16%) + 5.5%));
}

/* ═══════════════════════════ CON02 — 성공에는 이유가 있습니다 ═══════════════════════════ */

.con02 {
  padding-top: 2.6vw;
  padding-bottom: 10.8vw;
  background-image: linear-gradient(180deg, #ffffff 0%, #ffffff 42.5%, #feffff 45.0%, #fdfeff 48.1%, #fbfeff 51.2%, #f8fdfe 55.3%, #f4fcfe 59.4%, #effafd 63.5%, #ecf9fd 67.6%, #eaf9fc 71.6%, #e8f8fc 76.7%, #e8f8fc 100%);
}

.con02_head {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
}

/* 세로 좌표 없음 = .con02_head 의 세로 중앙정렬이 static position 담당 */
.con02_scribble {
  left: 32.2%;
  width: calc(var(--px) * 177);
  aspect-ratio: 177 / 101;
}

.con02_title {
  font-family: "Paperlogy";
  font-weight: 800;
  font-size: calc(var(--px) * 60);
  letter-spacing: -0.13vw;
  line-height: 2.9vw;
  color: #000000;
}

.con02_star {
  left: 32.2%;
  top: -0.3vw;
  font-family: "Paperlogy";
  font-weight: 600;
  font-size: calc(var(--px) * 92);
  line-height: 2vw;
  color: var(--color-point);
}

.con02_desc {
  margin-top: 1.6vw;
  font-weight: 600;
  font-size: calc(var(--px) * 24);
  letter-spacing: -0.05vw;
  line-height: 1.5vw;
  color: #000000;
}

/* CSS 테두리와 단일 pill 클리핑으로 래스터 가장자리의 중복 AA를 없앤다. */
.con02_card {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: calc(var(--px) * 1442);
  height: calc(var(--px) * 424);
  margin-top: 2.4vw;
  border-radius: 50vw;
  box-shadow: 0 0 calc(var(--px) * 52) rgba(15, 74, 119, 0.25);
}

.con02_card_pic {
  isolation: isolate;
  overflow: hidden;
  border-radius: inherit;
  outline: 1px solid #ffffff;
}

.con02_light_ambient {
  left: -1.9%;
  top: -6.2vw;
  width: calc(var(--px) * 1591);
  aspect-ratio: 1591 / 1038;
  mix-blend-mode: color-dodge;
  opacity: 0.7294117647;
}

.con02_light_back {
  left: 8.3%;
  width: calc(var(--px) * 677);
  aspect-ratio: 677 / 424;
  mix-blend-mode: color-dodge;
}

.con02_cert_back {
  left: 14.8%;
  width: calc(var(--px) * 183);
  aspect-ratio: 183 / 258;
}

.con02_cert_front {
  left: 23.9%;
  top: 2vw;
  width: calc(var(--px) * 235);
  aspect-ratio: 235 / 332;
}

.con02_light_front {
  left: 0;
  width: calc(var(--px) * 707);
  aspect-ratio: 707 / 424;
  mix-blend-mode: color-dodge;
}

.con02_card_txt {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: 5.9vw;
  margin-left: 53.5%;
}

.con02_rank {
  padding: calc(var(--px) * 8) calc(var(--px) * 12) calc(var(--px) * 6) calc(var(--px) * 13);
  border-radius: calc(var(--px) * 8);
  background-color: var(--color-point);
  font-weight: 600;
  font-size: calc(var(--px) * 21);
  letter-spacing: -0.05vw;
  line-height: 1.2vw;
}

.con02_rank_hl {
  color: #fbff89;
}

.con02_card_title {
  margin-top: 1.5vw;
  font-family: "Paperlogy";
  font-weight: 800;
  font-size: calc(var(--px) * 42);
  letter-spacing: -0.09vw;
  line-height: 2.7vw;
}

.con02_card_title_hl {
  color: #b8f1ff;
}

.con02_cta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-top: 1.8vw;
}

/* 화살표 2개 = con02_03 한 파일. opacity 는 파일에 굽지 않음. 가로 좌표 없음 = .con02_cta 가로 중앙정렬 */
.con02_arrow01 {
  --con02-arrow-opacity: 0.09;
  top: -3.1vw;
  width: calc(var(--px) * 235);
  aspect-ratio: 235 / 295;
  opacity: 0.09;
}

.con02_arrow02 {
  --con02-arrow-opacity: 0.41;
  top: 0.5vw;
  width: calc(var(--px) * 143);
  aspect-ratio: 235 / 295;
  opacity: 0.41;
}

/* radius 12·하단 글로우는 con02_04 에 구워짐 → background/border-radius/box-shadow 금지 */
.con02_btn {
  width: calc(var(--px) * 323);
  height: calc(var(--px) * 75);
}

.con02_btn_txt {
  font-size: calc(var(--px) * 22);
  letter-spacing: -0.05vw;
  line-height: 1vw;
}

/* ═══════════════════════════ CON03 — 결과는 숫자가 말해줍니다 ═══════════════════════════ */

/* 발광 con03_01 = 섹션 배경 레이어 (발광 아래는 배경색·흰 글자뿐 → 화면 동일). .back_img 의 cover·top center 덮어씀 */
.con03 {
  padding-top: 2.4vw;
  padding-bottom: 3.7vw;
  background-color: #e8f8fc;
  background-image: url('/images/con03_01.png');
  background-size: calc(var(--px) * 1092);
  background-position: 50.4% -5.2vw;
}

.con03_head {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.con03_title {
  color: #000000;
}

.con03_title_top {
  font-family: "Paperlogy";
  font-weight: 200;
  font-size: calc(var(--px) * 42);
  letter-spacing: -0.09vw;
  line-height: 1.9vw;
}

.con03_title_main {
  margin-top: 0.9vw;
  font-family: "Paperlogy";
  font-weight: 800;
  font-size: calc(var(--px) * 60);
  letter-spacing: -0.11vw;
  line-height: 2.8vw;
}

.con03_stage {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  margin-top: 2.2vw;
}

/* 뒤 대형 글자 — 「매출」은 카드 판 그림자 아래, 「압도적」은 평균 가격 아래 (DOM 순서로 해결, z-index 없음)
   스크롤 잉크(common.css): 처음부터 또렷한 하늘색 + 스크롤에 맞춰 짙은 포인트색이 글자를 왼쪽부터 채운다. 칠하는 영역만 padding 으로 넓히고 left/top 을 같은 만큼 물린다 */
.con03_word {
  --ink-base: rgba(6, 162, 219, 0.4);
  --ink-lit: rgba(6, 162, 219, 0.9);
  padding: 0.2em 0.25em;
  font-family: "Paperlogy";
  font-weight: 800;
  font-size: calc(var(--px) * 150);
  letter-spacing: -0.32vw;
  line-height: 7vw;
}

.con03_word01 {
  left: calc(18.4% - 0.25em);
  top: calc(1.2vw - 0.2em);
}

.con03_word02 {
  left: calc(74.3% - 0.25em);
  top: calc(17.5vw - 0.2em);
}

/* 카드 흰 판 — 화살표가 판 위·파랑 박스 아래라 내용(.con03_card)과 분리. content-box → 외곽 319×437 */
.con03_card_panel {
  left: 56.4%;
  top: 0;
  width: calc(var(--px) * 317);
  height: calc(var(--px) * 435);
  border: 1px solid #ffffff;
  border-radius: calc(var(--px) * 22);
  background-color: rgba(255, 255, 255, 0.651);
  box-shadow: 0 0 calc(var(--px) * 80) calc(var(--px) * 7) rgba(6, 162, 219, 0.592), 0 0 calc(var(--px) * 48) rgba(15, 74, 119, 0.25);
}

/* 그라데이션은 con03_02 에 구워짐 → filter·opacity 금지 */
.con03_arrow {
  left: 40.5%;
  top: 5.6vw;
  width: calc(var(--px) * 408);
  aspect-ratio: 408 / 218;
}

.con03_avg {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  margin-top: 8vw;
  margin-left: 28.2%;
  color: #5c5b5b;
}

.con03_avg_price {
  font-size: calc(var(--px) * 34);
  letter-spacing: -0.07vw;
  line-height: 1.6vw;
}

.con03_avg_unit {
  font-size: calc(var(--px) * 25);
}

.con03_avg_num {
  margin-top: 0.1vw;
  line-height: 1vw;
}

.con03_avg_box {
  margin-top: 0.4vw;
  width: calc(var(--px) * 290);
  aspect-ratio: 290 / 225;
}

.con03_label_avg {
  margin-top: -1vw;
  padding: calc(var(--px) * 7) calc(var(--px) * 17) calc(var(--px) * 7) calc(var(--px) * 15);
  border-radius: calc(var(--px) * 8);
  background-color: #1b1b1b;
  font-size: calc(var(--px) * 16);
  letter-spacing: -0.03vw;
  line-height: 0.9vw;
}

/* 원 그라데이션 = sRGB 10 stop 전개본. `in oklab` 금지 (미지원 브라우저에서 선언 전체 무효 → 원 배경 소실) */
.con03_ratio {
  width: calc(var(--px) * 158);
  height: calc(var(--px) * 158);
  margin-top: 9.9vw;
  margin-left: 2.4%;
  border-radius: 50%;
  background-image: linear-gradient(to top, rgb(7, 35, 70) 7.0%, rgb(5, 30, 61) 15%, rgb(4, 23, 50) 25%, rgb(2, 17, 40) 35%, rgb(1, 11, 30) 45%, rgb(1, 6, 20) 55%, rgb(0, 3, 11) 65%, rgb(0, 1, 4) 75%, rgb(0, 0, 1) 85%, rgb(0, 0, 0) 100%);
  box-shadow: 0 0 0 calc(var(--px) * 2) #ffffff, 0 0 0 calc(var(--px) * 8) #b8f1ff;
}

.con03_ratio_txt {
  margin-bottom: 0.3vw;
  font-family: "Paperlogy";
  font-weight: 800;
  font-size: calc(var(--px) * 24);
  letter-spacing: -0.05vw;
  line-height: 1.5vw;
}

.con03_ratio_num {
  font-size: calc(var(--px) * 45);
  letter-spacing: 0.05vw;
  vertical-align: calc(var(--px) * -2);
}

.con03_card {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: calc(var(--px) * 319);
  margin-left: 2.3%;
  padding-top: calc(var(--px) * 25);
  color: #000000;
}

.con03_card_price {
  font-family: "Paperlogy";
  font-weight: 800;
  font-size: calc(var(--px) * 51);
  line-height: 2.4vw;
}

.con03_card_unit {
  font-size: calc(var(--px) * 37);
}

.con03_card_num {
  line-height: 1vw;
}

.con03_card_box {
  margin-top: 0.4vw;
  width: calc(var(--px) * 277);
  aspect-ratio: 277 / 338;
}

/* 흰색·90° 회전은 con03_05 에 구워짐 → transform·filter 금지 */
.con03_logo {
  left: 30.3%;
  top: 4.2vw;
  width: calc(var(--px) * 47);
  aspect-ratio: 47 / 137;
}

.con03_label_brand {
  margin-top: -1.5vw;
  margin-left: 1.6%;
  padding: calc(var(--px) * 13) calc(var(--px) * 14) calc(var(--px) * 13) calc(var(--px) * 13);
  border-radius: calc(var(--px) * 8);
  background-color: var(--color-point);
  font-family: "Paperlogy";
  font-weight: 800;
  font-size: calc(var(--px) * 22);
  line-height: 1.1vw;
}

.con03_result {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: baseline;
  width: 100%;
  margin-top: 1.8vw;
}

/* #b8f1ff 링은 con03_06 에 구워짐 → filter·opacity 금지 */
.con03_swoosh {
  left: 52.1%;
  top: -1.3vw;
  width: calc(var(--px) * 275);
  aspect-ratio: 275 / 112;
}

.con03_result_txt {
  font-family: "Paperlogy";
  font-weight: 800;
  font-size: calc(var(--px) * 42);
  letter-spacing: -0.09vw;
  line-height: 2vw;
  color: #000000;
}

/* 그라데이션 stop = 글리프 ink 박스(70px) 기준 PS 값을 요소 박스(h78.48) 기준으로 환산 */
.con03_result_rank {
  margin-left: 1.3%;
  font-family: "Paperlogy";
  font-weight: 800;
  font-size: calc(var(--px) * 80);
  letter-spacing: -0.16vw;
  line-height: 3.7vw;
  color: transparent;
  background-image: var(--light-layer, none), linear-gradient(to top, #0f3d76 14.2%, #072346 44.8%);
  -webkit-background-clip: text;
  background-clip: text;
}

.con03_result_one {
  letter-spacing: -0.5vw;
}

.con03_result_pct {
  font-size: calc(var(--px) * 60);
}

.con03_source {
  margin-top: 0.7vw;
  font-size: calc(var(--px) * 14);
  letter-spacing: -0.03vw;
  line-height: 0.8vw;
  color: rgba(136, 136, 136, 0.5);
}

/* ═══════════════════════════ CON04 — 평균은 일부 매장이 만드는 숫자가 아닙니다 ═══════════════════════════ */

.con04 {
  padding-top: 3.6vw;
  padding-bottom: 3.1vw;
  background-image: linear-gradient(180deg, #e8f8fc 0%, #ebf9fc 21.5%, #fcfeff 61.8%, #ffffff 93.6%);
}

/* 다중 배경 = 라인 03 → 글로우 01 → 글로우 02 → 카드 그라데이션 (위→아래). 글로우·라인은 이 바탕 기준 알파 언믹스본 → 스톱 변경·mix-blend-mode·img 전환 금지 */
.con04_box {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 94.4357%;
  padding-top: 5.8vw;
  padding-bottom: 5.8vw;
  border-radius: calc(var(--px) * 40);
  background-image: url('/images/con04_03.png'), url('/images/con04_01.png'), url('/images/con04_02.png'), linear-gradient(180deg, #072346 0%, #062142 26.9%, #051b37 48.2%, #030e1b 83.1%, #020b15 97%, #020a15 100%);
  background-repeat: no-repeat;
  background-size: calc(var(--px) * 571) calc(var(--px) * 9), calc(var(--px) * 1166) calc(var(--px) * 152), calc(var(--px) * 1144) calc(var(--px) * 149), 100% 100%;
  background-position: calc(var(--px) * 736) calc(var(--px) * 239), calc(var(--px) * 319) 0, center bottom, 0 0;
}

.con04_lead {
  font-family: "Paperlogy";
  font-weight: 200;
  font-size: calc(var(--px) * 35);
  letter-spacing: -0.07vw;
  line-height: 1.7vw;
}

.con04_head {
  width: 100%;
  margin-top: 0.7vw;
}

.con04_title {
  font-family: "Paperlogy";
  font-weight: 800;
  font-size: calc(var(--px) * 70);
  letter-spacing: -0.15vw;
  line-height: 4.2vw;
}

/* 스톱 = 잉크 박스 기준 PSD 값을 span 박스 기준으로 환산. 기본 sRGB → @supports 안에서 in oklab 본값.
   첫 슬롯 var(--light-layer, none) = 전역 커서 광원(common.css). var() 가 든 선언은 한 규칙 안 이중 선언 폴백이 무효라 @supports 로 나눈다 · 포인트색 hex 를 var() 로 바꾸지 말 것 */
.con04_title_num {
  margin-left: calc(var(--px) * 7);
  margin-right: calc(var(--px) * 7);
  font-size: calc(var(--px) * 80);
  letter-spacing: 0;
  color: transparent;
  background-image: var(--light-layer, none), linear-gradient(318deg, #06a2db 32.5%, #b2f0ff 69.7%);
  -webkit-background-clip: text;
  background-clip: text;
}

@supports (background-image: linear-gradient(in oklab, #06a2db, #b2f0ff)) {
  .con04_title_num {
    background-image: var(--light-layer, none), linear-gradient(in oklab 318deg, #06a2db 36.5%, #b2f0ff 70.8%);
  }
}

.con04_title_unit {
  letter-spacing: -0.17vw;
}

/* 「돌파」 오른쪽 위 돌출 오브젝트 · 회전(con04-m01)은 Animation Pass */
.con04_star {
  left: 73.8%;
  top: -0.1vw;
  font-family: "Paperlogy";
  font-weight: 600;
  font-size: calc(var(--px) * 92);
  line-height: 2vw;
  color: var(--color-point);
}

.con04_notice {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  margin-top: 1.2vw;
  padding: calc(var(--px) * 9) calc(var(--px) * 16) calc(var(--px) * 9) calc(var(--px) * 12);
  border-radius: 50vw;
  background-color: #0262c3;
  font-weight: 700;
  font-size: calc(var(--px) * 20);
  line-height: 0.9vw;
}

.con04_notice_icon {
  width: calc(var(--px) * 29);
  height: calc(var(--px) * 29);
  margin-right: calc(var(--px) * 7);
  border-radius: 50%;
  background-color: #151515;
  color: #fbff89;
}

/* 그리드 오른쪽 끝 = 시안 비대칭 위치 (가운데정렬 흉내 아님) */
.con04_basis {
  align-self: flex-end;
  margin-top: 1.7vw;
  margin-right: 22.9%;
  font-weight: 400;
  font-size: calc(var(--px) * 16);
  letter-spacing: -0.03vw;
  line-height: 0.8vw;
  opacity: 0.62;
}

.con04_slider {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 67.4263%;
  margin-top: 1.1vw;
}

/* 호버 = 채움 + 흰 셰브론 교차 페이드 · 외경 51은 두 상태에서 동일 */
.con04_arr {
  transition: background-color var(--transition-ui) var(--ease-ui), opacity var(--transition-ui) var(--ease-ui);
  width: calc(var(--px) * 49);
  height: calc(var(--px) * 49);
  border: 1px solid var(--color-point);
  border-radius: 50%;
}

.con04_arr:hover {
  background-color: var(--color-point);
}

.con04_arr_pic {
  display: grid;
  justify-content: center;
  align-items: center;
  width: calc(var(--px) * 9);
  aspect-ratio: 9 / 16;
}

.con04_arr_pic img {
  grid-area: 1 / 1;
  transition: opacity var(--transition-ui) var(--ease-ui);
}

.con04_arr_pic img:last-child {
  opacity: 0;
}

.con04_arr:hover img:first-child {
  opacity: 0;
}

.con04_arr:hover img:last-child {
  opacity: 1;
}

/* 슬라이드 폭 = 컨테이너 ÷ 3 · 카드 319 는 슬라이드 안 가운데 (간격 포함) */
.con04_slide {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  width: 81.4509%;
}

.con04_list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  row-gap: 0.4vw;
}

.con04_item {
  width: calc(var(--px) * 319);
  height: calc(var(--px) * 123);
  border-radius: calc(var(--px) * 21);
  background-image: linear-gradient(180deg, #ffffff 61.8%, #cde4ed 96.2%);
}

.con04_store {
  font-weight: 700;
  font-size: calc(var(--px) * 18);
  line-height: 1.1vw;
  color: #000000;
}

.con04_sales {
  margin-top: 0.5vw;
  font-family: "Paperlogy";
  font-weight: 700;
  font-size: calc(var(--px) * 30);
  letter-spacing: -0.06vw;
  line-height: 1.4vw;
}

.con04_sales_unit {
  font-size: calc(var(--px) * 24);
  letter-spacing: -0.05vw;
  color: #000000;
}

/* ═══════════════════════════ CON05 — 오래 가는 매장 ═══════════════════════════ */
.con05 {
  padding-top: 3.2vw;
  padding-bottom: 5.5vw;
  background-color: #ffffff;
}

.con05_why {
  margin-right: 1.9%;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 150);
  letter-spacing: calc(-6 / 1905 * 100vw);
  line-height: 6.2vw;
  color: var(--color-pale-blue);
}

.con05_title_wrap {
  margin-top: -0.8vw;
}

.con05_title {
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 60);
  letter-spacing: calc(-2.4 / 1905 * 100vw);
  line-height: 3.2vw;
  color: #000000;
}

.con05_star {
  left: -5.4%;
  top: -0.1vw;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 92);
  line-height: 2vw;
}

.con05_compare {
  width: 75.853%;
  margin-left: 0.3%;
  margin-top: 2.2vw;
}

.con05_panel {
  height: calc(var(--px) * 310);
}

.con05_panel_left {
  width: 49.7578%;
  border-radius: calc(var(--px) * 155) calc(var(--px) * 155) 0 calc(var(--px) * 155);
  background: radial-gradient(circle calc(var(--px) * 520) at calc(var(--px) * 747) calc(var(--px) * 74),
    rgba(6, 162, 219, 0.514) 0,
    rgba(6, 162, 219, 0.506) calc(var(--px) * 20),
    rgba(6, 162, 219, 0.502) calc(var(--px) * 40),
    rgba(6, 162, 219, 0.486) calc(var(--px) * 60),
    rgba(6, 162, 219, 0.463) calc(var(--px) * 80),
    rgba(6, 162, 219, 0.439) calc(var(--px) * 100),
    rgba(6, 162, 219, 0.408) calc(var(--px) * 120),
    rgba(6, 162, 219, 0.373) calc(var(--px) * 140),
    rgba(6, 162, 219, 0.338) calc(var(--px) * 160),
    rgba(6, 162, 219, 0.302) calc(var(--px) * 180),
    rgba(6, 162, 219, 0.267) calc(var(--px) * 200),
    rgba(6, 162, 219, 0.228) calc(var(--px) * 220),
    rgba(6, 162, 219, 0.192) calc(var(--px) * 240),
    rgba(6, 162, 219, 0.163) calc(var(--px) * 260),
    rgba(6, 162, 219, 0.137) calc(var(--px) * 280),
    rgba(6, 162, 219, 0.106) calc(var(--px) * 300),
    rgba(6, 162, 219, 0.086) calc(var(--px) * 320),
    rgba(6, 162, 219, 0.071) calc(var(--px) * 340),
    rgba(6, 162, 219, 0.055) calc(var(--px) * 360),
    rgba(6, 162, 219, 0.039) calc(var(--px) * 380),
    rgba(6, 162, 219, 0.031) calc(var(--px) * 400),
    rgba(6, 162, 219, 0.024) calc(var(--px) * 420),
    rgba(6, 162, 219, 0.016) calc(var(--px) * 440),
    rgba(6, 162, 219, 0.013) calc(var(--px) * 460),
    rgba(6, 162, 219, 0.008) calc(var(--px) * 480),
    rgba(6, 162, 219, 0.008) calc(var(--px) * 500),
    rgba(6, 162, 219, 0.000) calc(var(--px) * 520)), var(--color-pale-blue);
}

.con05_panel_right {
  width: 50.2422%;
  border-radius: calc(var(--px) * 155) calc(var(--px) * 155) calc(var(--px) * 155) 0;
  background: radial-gradient(calc(var(--px) * 600) calc(var(--px) * 618) at calc(var(--px) * 88.5) calc(var(--px) * 114),
    rgba(0, 0, 0, 0.824) 0%,
    rgba(0, 0, 0, 0.816) 5%,
    rgba(0, 0, 0, 0.801) 10%,
    rgba(0, 0, 0, 0.776) 15%,
    rgba(0, 0, 0, 0.738) 20%,
    rgba(0, 0, 0, 0.686) 25%,
    rgba(0, 0, 0, 0.621) 30%,
    rgba(0, 0, 0, 0.545) 35%,
    rgba(0, 0, 0, 0.461) 40%,
    rgba(0, 0, 0, 0.373) 45%,
    rgba(0, 0, 0, 0.289) 50%,
    rgba(0, 0, 0, 0.215) 55%,
    rgba(0, 0, 0, 0.153) 60%,
    rgba(0, 0, 0, 0.107) 65%,
    rgba(0, 0, 0, 0.070) 70%,
    rgba(0, 0, 0, 0.044) 75%,
    rgba(0, 0, 0, 0.027) 80%,
    rgba(0, 0, 0, 0.014) 85%,
    rgba(0, 0, 0, 0.006) 90%,
    rgba(0, 0, 0, 0.002) 95%,
    rgba(0, 0, 0, 0.000) 100%), #747474;
}

.con05_circle {
  width: calc(var(--px) * 216);
  height: calc(var(--px) * 216);
  left: -7.5%;
  border-radius: 50%;
  /* 웹페이지 다크모드(강제 변환)는 CSS·SVG 그라데이션 바탕을 어둡게 뒤집는데 안의 로고는 어두운 그대로라 묻혔다 →
     바탕은 안 뒤집히는 평평한 흰 판(common.css --plate-white)으로 깔고, 그 위에 하늘색을 알파 그라데이션(아래 진함 → 위 투명)으로 얹는다.
     같은 하늘색(185, 241, 255) 알파 합성이라 밝은 화면에선 원래 그라데이션(하늘색 → 흰색)과 ±1 단계 이내로 같다. */
  background: linear-gradient(to top, rgba(185, 241, 255, 1) 0.7%, rgba(185, 241, 255, 0.914) 4.4%, rgba(185, 241, 255, 0.814) 8.1%, rgba(185, 241, 255, 0.7) 11.8%, rgba(185, 241, 255, 0.571) 15.5%, rgba(185, 241, 255, 0.429) 19.2%, rgba(185, 241, 255, 0.314) 22.9%, rgba(185, 241, 255, 0.2) 26.6%, rgba(185, 241, 255, 0.1) 30.3%, rgba(185, 241, 255, 0.014) 34%, rgba(185, 241, 255, 0) 37.7%), var(--plate-white) center / 100% 100% no-repeat;
  box-shadow: 0 0 0 calc(var(--px) * 2) #ffffff, 0 0 0 calc(var(--px) * 8) #b8f1ff, 0 0 calc(var(--px) * 26.8) calc(var(--px) * 19.5) rgba(104, 215, 255, 0.4);
}

.con05_check_pic {
  width: calc(var(--px) * 113);
  aspect-ratio: 113 / 116;
  left: 28.2%;
  top: -3vw;
}

.con05_logo_pic {
  width: calc(var(--px) * 150);
  aspect-ratio: 150 / 53;
  margin-top: -0.7vw;
}

.con05_left_copy {
  margin-left: 13.9%;
}

.con05_ring_pic {
  width: calc(var(--px) * 123);
  aspect-ratio: 123 / 80;
  left: -11.4%;
  top: -1.1vw;
}

.con05_left_text {
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 42);
  letter-spacing: calc(-1.68 / 1905 * 100vw);
  line-height: 2.5vw;
  color: #000000;
}

.con05_right_text {
  margin-right: 6.6%;
  margin-top: -0.1vw;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 28);
  letter-spacing: calc(-1.12 / 1905 * 100vw);
  line-height: 1.6vw;
  mask-image: linear-gradient(to right, rgba(0, 0, 0, 1) 0.4%, rgba(0, 0, 0, 0.997) 8.6%, rgba(0, 0, 0, 0.991) 16.9%, rgba(0, 0, 0, 0.974) 25.2%, rgba(0, 0, 0, 0.942) 33.5%, rgba(0, 0, 0, 0.896) 41.8%, rgba(0, 0, 0, 0.823) 50.1%, rgba(0, 0, 0, 0.707) 58.3%, rgba(0, 0, 0, 0.516) 66.6%, rgba(0, 0, 0, 0.314) 74.9%, rgba(0, 0, 0, 0.219) 83.2%, rgba(0, 0, 0, 0.192) 91.5%, rgba(0, 0, 0, 0.199) 99.2%);
}

.con05_vs_circle {
  width: calc(var(--px) * 124);
  height: calc(var(--px) * 124);
  left: 45.5%;
  top: 4.7vw;
  background-color: #ffffff;
  border-radius: 50%;
}

.con05_vs_pic {
  width: calc(var(--px) * 78);
  aspect-ratio: 78 / 71;
  margin-left: -8.1%;
}

.con05_slide {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  margin-top: 2.2vw;
  overflow: visible;
}

.con05_list {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  transition-timing-function: linear !important;
}

.con05_item {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: calc(var(--px) * 288.667);
  flex-shrink: 0;
}

.con05_card {
  width: calc(var(--px) * 319);
  aspect-ratio: 319 / 270;
  flex-shrink: 0;
  margin-left: -9.4%;
}

.con05_card_copy {
  top: 5.6vw;
}

.con05_open {
  font-size: calc(var(--px) * 16);
  letter-spacing: calc(-0.64 / 1905 * 100vw);
  line-height: 0.9vw;
  color: #b8f1ff;
}

.con05_store {
  margin-top: 0.5vw;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 28);
  letter-spacing: calc(-1.12 / 1905 * 100vw);
  line-height: 1.5vw;
}

.con05_duration {
  width: calc(var(--px) * 228);
  height: calc(var(--px) * 53);
  margin-top: 0.5vw;
  border-radius: calc(var(--px) * 12);
  background-color: #ffffff;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 26);
  letter-spacing: calc(-1.04 / 1905 * 100vw);
  line-height: 1.4vw;
  color: #000000;
}

.con05_basis {
  align-self: flex-end;
  margin-right: 5.9%;
  margin-top: 0.3vw;
  font-size: calc(var(--px) * 15);
  letter-spacing: calc(-0.6 / 1905 * 100vw);
  line-height: 0.8vw;
  color: #878787;
  opacity: 0.71;
}

/* con06 — 좋은 매장이 모이면 좋은 브랜드가 됩니다 */
.con06 {
  --con06-grid: linear-gradient(to bottom,
    rgba(255, 255, 255, 0) 0% 16.8%,
    rgba(255, 255, 255, 0.0024) 21% 25.2%,
    rgba(255, 255, 255, 0.0096) 29.4%,
    rgba(255, 255, 255, 0.0168) 33.6%,
    rgba(255, 255, 255, 0.0264) 37.8%,
    rgba(255, 255, 255, 0.0384) 42%,
    rgba(255, 255, 255, 0.0624) 46.2%,
    rgba(255, 255, 255, 0.0792) 50.4%,
    rgba(255, 255, 255, 0.1008) 54.6%,
    rgba(255, 255, 255, 0.1296) 58.8%,
    rgba(255, 255, 255, 0.1583) 63%,
    rgba(255, 255, 255, 0.1967) 67.2%,
    rgba(255, 255, 255, 0.2351) 71.4%,
    rgba(255, 255, 255, 0.2735) 75.6%,
    rgba(255, 255, 255, 0.3143) 79.8%,
    rgba(255, 255, 255, 0.3527) 84%,
    rgba(255, 255, 255, 0.391) 88.2%,
    rgba(255, 255, 255, 0.4246) 92.4%,
    rgba(255, 255, 255, 0.4582) 96.6%,
    rgba(255, 255, 255, 0.4846) 100%);
  padding-top: 5.3vw;
  padding-bottom: 3.4vw;
  background-color: #fff;
  background-image:
    var(--con06-grid), var(--con06-grid), var(--con06-grid), var(--con06-grid), var(--con06-grid),
    linear-gradient(to bottom,
      rgba(6, 162, 219, 0) 0% 16.8%,
      rgba(6, 162, 219, 0.0023) 21% 25.2%,
      rgba(6, 162, 219, 0.0091) 29.4%,
      rgba(6, 162, 219, 0.0159) 33.6%,
      rgba(6, 162, 219, 0.025) 37.8%,
      rgba(6, 162, 219, 0.0364) 42%,
      rgba(6, 162, 219, 0.0592) 46.2%,
      rgba(6, 162, 219, 0.0751) 50.4%,
      rgba(6, 162, 219, 0.0956) 54.6%,
      rgba(6, 162, 219, 0.1229) 58.8%,
      rgba(6, 162, 219, 0.1502) 63%,
      rgba(6, 162, 219, 0.1866) 67.2%,
      rgba(6, 162, 219, 0.2231) 71.4%,
      rgba(6, 162, 219, 0.2595) 75.6%,
      rgba(6, 162, 219, 0.2982) 79.8%,
      rgba(6, 162, 219, 0.3346) 84%,
      rgba(6, 162, 219, 0.371) 88.2%,
      rgba(6, 162, 219, 0.4029) 92.4%,
      rgba(6, 162, 219, 0.4347) 96.6%,
      rgba(6, 162, 219, 0.4598) 100%);
  background-repeat: no-repeat;
  background-size:
    1px calc(var(--px) * 762), 1px calc(var(--px) * 762),
    1px calc(var(--px) * 762), 1px calc(var(--px) * 762),
    1px calc(var(--px) * 762), 100% calc(var(--px) * 762);
  background-position:
    calc(var(--px) * 261.0028) 0, calc(var(--px) * 607.0028) 0,
    calc(var(--px) * 952.0028) 0, calc(var(--px) * 1297.0028) 0,
    calc(var(--px) * 1642.0028) 0, 0 0;
}

.con06_title {
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 60.0543);
  letter-spacing: calc(-0.1260983vw);
  line-height: 3.4vw;
}

.con06_desc {
  margin-top: 1vw;
  font-size: calc(var(--px) * 24.0218);
  letter-spacing: calc(-0.0504395vw);
  line-height: 1.6vw;
}

.con06_wordmark {
  left: 19.9%;
  top: 22.8vw;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 278.3913);
  letter-spacing: calc(-0.5845487vw);
  line-height: 14.6vw;
}

.con06_star {
  left: -9.6%;
  top: 2vw;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 91.6229);
  line-height: 4.8vw;
}

.con06_plot {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: stretch;
  width: 100%;
  height: calc(var(--px) * 482);
}

.con06_curve {
  width: 100%;
  height: auto;
}

.con06_milestone {
  width: 18.12%;
  justify-content: flex-end;
}

.con06_milestone_01 {
  padding-bottom: calc(var(--px) * 38);
}

.con06_milestone_02 {
  padding-bottom: calc(var(--px) * 196);
}

.con06_milestone_03 {
  padding-bottom: calc(var(--px) * 279);
}

.con06_milestone_04 {
  padding-bottom: calc(var(--px) * 336);
}

.con06_milestone_final {
  padding-bottom: calc(var(--px) * 374);
}

.con06_number {
  margin-bottom: 0.6vw;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 28.0387);
  letter-spacing: calc(-0.0588739vw);
  line-height: 1.5vw;
}

.con06_number_final {
  margin-bottom: -1.9vw;
  font-size: calc(var(--px) * 60.0828);
  letter-spacing: 0vw;
  line-height: 3.5vw;
}

.con06_number_first {
  letter-spacing: calc(-0.1261581vw);
}

.con06_point {
  width: calc(var(--px) * 15);
  height: calc(var(--px) * 15);
  border-radius: 50%;
  flex-shrink: 0;
  background-color: var(--color-point);
}

.con06_halo {
  width: calc(var(--px) * 98.8341);
  height: calc(var(--px) * 98.8341);
  border-radius: 50%;
  flex-shrink: 0;
  background-color: #fbff89;
}

.con06_baseline {
  width: 100%;
  height: 1px;
  background-color: #000;
}

.con06_labels {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  width: 90.6%;
  margin-top: -0.2vw;
}

.con06_label {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 20%;
}

.con06_axis_point {
  width: calc(var(--px) * 6.7158);
  height: calc(var(--px) * 6.7158);
  border-radius: 50%;
  background-color: #000;
}

.con06_year {
  margin-top: 0.6vw;
  font-size: calc(var(--px) * 15.9209);
  line-height: 1vw;
}

.con06_store {
  font-size: calc(var(--px) * 19.4588);
  line-height: 1.2vw;
}

/* con07 — 점주 성공 이야기 */
.con07 {
  padding-top: calc(var(--px) * 67.5);
  padding-bottom: calc(var(--px) * 66.4);
  background: linear-gradient(to bottom, #ffffff calc(var(--px) * 0), #ffffff calc(var(--px) * 0), #ffffff calc(var(--px) * 20), #ffffff calc(var(--px) * 40), #ffffff calc(var(--px) * 60), #ffffff calc(var(--px) * 80), #ffffff calc(var(--px) * 100), #ffffff calc(var(--px) * 120), #ffffff calc(var(--px) * 140), #feffff calc(var(--px) * 160), #feffff calc(var(--px) * 180), #feffff calc(var(--px) * 200), #feffff calc(var(--px) * 220), #feffff calc(var(--px) * 240), #feffff calc(var(--px) * 260), #fdffff calc(var(--px) * 280), #fdfeff calc(var(--px) * 300), #fdfeff calc(var(--px) * 320), #fcfeff calc(var(--px) * 340), #fcfeff calc(var(--px) * 360), #fbfeff calc(var(--px) * 380), #fbfefe calc(var(--px) * 400), #fafefe calc(var(--px) * 420), #f9fdfe calc(var(--px) * 440), #f9fdfe calc(var(--px) * 460), #f8fdfe calc(var(--px) * 480), #f7fdfe calc(var(--px) * 500), #f6fcfe calc(var(--px) * 520), #f5fcfe calc(var(--px) * 540), #f4fcfe calc(var(--px) * 560), #f3fbfd calc(var(--px) * 580), #f2fbfd calc(var(--px) * 600), #f1fbfd calc(var(--px) * 620), #f0fbfd calc(var(--px) * 640), #effafd calc(var(--px) * 660), #effafd calc(var(--px) * 680), #eefafd calc(var(--px) * 700), #edf9fd calc(var(--px) * 720), #ecf9fd calc(var(--px) * 740), #ecf9fc calc(var(--px) * 760), #ebf9fc calc(var(--px) * 780), #eaf9fc calc(var(--px) * 800), #eaf9fc calc(var(--px) * 820), #eaf8fc calc(var(--px) * 840), #e9f8fc calc(var(--px) * 860), #e9f8fc calc(var(--px) * 880), #e9f8fc calc(var(--px) * 900), var(--color-pale-blue) calc(var(--px) * 920), var(--color-pale-blue) calc(var(--px) * 940));
}

.con07_panel {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  box-sizing: border-box;
  width: 94.4042%;
  padding: calc(var(--px) * 105.5) calc(var(--px) * 177.7) calc(var(--px) * 130.6) calc(var(--px) * 289.7);
  border-radius: calc(var(--px) * 40);
  background: linear-gradient(to bottom, #072345 calc(var(--px) * 0), #072345 calc(var(--px) * 0.5), #072345 calc(var(--px) * 20.5), #072345 calc(var(--px) * 40.5), #072245 calc(var(--px) * 60.5), #072244 calc(var(--px) * 80.5), #072244 calc(var(--px) * 100.5), #072244 calc(var(--px) * 120.5), #072143 calc(var(--px) * 140.5), #072142 calc(var(--px) * 160.5), #072142 calc(var(--px) * 180.5), #072141 calc(var(--px) * 200.5), #062040 calc(var(--px) * 220.5), #06203f calc(var(--px) * 240.5), #061f3e calc(var(--px) * 260.5), #061f3d calc(var(--px) * 280.5), #061e3c calc(var(--px) * 300.5), #061d3a calc(var(--px) * 320.5), #061d39 calc(var(--px) * 340.5), #061c38 calc(var(--px) * 360.5), #051b36 calc(var(--px) * 380.5), #051a34 calc(var(--px) * 400.5), #051933 calc(var(--px) * 420.5), #051831 calc(var(--px) * 440.5), #05172f calc(var(--px) * 460.5), #05172d calc(var(--px) * 480.5), #04162b calc(var(--px) * 500.5), #041529 calc(var(--px) * 520.5), #041427 calc(var(--px) * 540.5), #041325 calc(var(--px) * 560.5), #041223 calc(var(--px) * 580.5), #031121 calc(var(--px) * 600.5), #031020 calc(var(--px) * 620.5), #030f1e calc(var(--px) * 640.5), #030e1d calc(var(--px) * 660.5), #030e1b calc(var(--px) * 680.5), #030d1a calc(var(--px) * 700.5), #020c19 calc(var(--px) * 720.5), #020c18 calc(var(--px) * 740.5), #020b17 calc(var(--px) * 760.5), #020b16 calc(var(--px) * 780.5), #020b15 calc(var(--px) * 800.5), #020b15 calc(var(--px) * 807.1));
}

.con07_row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
}

.con07_heading {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: calc(133 * 100vw / 1905);
}

.con07_title {
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 60.0828);
  letter-spacing: calc(-2.403312 * 100vw / 1905);
  line-height: calc(67 * 100vw / 1905);
  white-space: nowrap;
}

.con07_star {
  left: calc(-47 / 374.90625 * 100%);
  top: calc(-31 * 100vw / 1905);
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 91.6229);
  letter-spacing: calc(-3.664916 * 100vw / 1905);
  line-height: calc(91.6229 * 100vw / 1905);
}

/* 스크롤 잉크(common.css): 네이비 글자를 얼음빛이 스크롤에 맞춰 왼쪽부터 채운다. padding 으로 칠하는 영역을 넓히고 left/top 을 같은 만큼 물린다 */
.con07_story {
  --ink-base: var(--color-navy);
  --ink-lit: rgba(var(--light-ice), 0.75);
  left: calc(63.7 / 1798.4 * 100% - 0.25em);
  top: calc(612.5 * 100vw / 1905 - 0.2em);
  padding: 0.2em 0.25em;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 214.1847);
  letter-spacing: calc(-12.851082 * 100vw / 1905);
  line-height: calc(214.1847 * 100vw / 1905);
  white-space: nowrap;
}

.con07_story_s {
  letter-spacing: calc(-4.283694 * 100vw / 1905);
}

.con07_media {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 54.3201%;
}

.con07_stage {
  border-radius: calc(var(--px) * 33);
  overflow: hidden;
}

.con07_play {
  width: calc(var(--px) * 720);
  aspect-ratio: 720 / 405;
}

.con07_play_icon {
  width: calc(var(--px) * 66);
  aspect-ratio: 1;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.45);
}

.con07_play_icon::after {
  content: "";
  width: 0;
  height: 0;
  margin-left: calc(var(--px) * 4);
  border-style: solid;
  border-width: calc(var(--px) * 10) 0 calc(var(--px) * 10) calc(var(--px) * 17);
  border-color: transparent transparent transparent #ffffff;
}

.con07_player {
  left: 0;
  top: 0;
  border: 0;
}

.con07_controls {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  margin-top: calc(15 * 100vw / 1905);
}

.con07_choices {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 73.5823%;
}

.con07_choice_list {
  align-items: center;
}

.con07_choice {
  display: flex;
  justify-content: center;
  align-items: center;
}

.con07_more {
  margin-left: calc(6 / 723 * 100%);
}

.con07_thumb_img {
  width: calc(var(--px) * 262);
  aspect-ratio: 262 / 151;
  border-radius: calc(var(--px) * 12);
  overflow: hidden;
}

.con07_more_img {
  width: calc(var(--px) * 185);
  aspect-ratio: 185 / 151;
}

.con07_more_content {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  top: calc(26 * 100vw / 1905);
}

.con07_more_text {
  font-size: calc(var(--px) * 22.0304);
  letter-spacing: calc(-0.881216 * 100vw / 1905);
  line-height: calc(26 * 100vw / 1905);
}

.con07_arrow_circle {
  width: calc(var(--px) * 50);
  aspect-ratio: 1;
  margin-top: calc(7 * 100vw / 1905);
  border-radius: 50%;
  background: #ffffff;
}

.con07_arrow {
  font-family: "Suit";
  font-size: calc(var(--px) * 20.1896);
  letter-spacing: calc(-0.807584 * 100vw / 1905);
  line-height: calc(34.6593 * 100vw / 1905);
  color: var(--color-navy);
}

/* con08 — 영업권 2KM 보장 */
.con08 {
  padding-top: calc(var(--px) * 68);
  padding-bottom: calc(var(--px) * 79.6);
  background: var(--color-pale-blue);
}

.con08_tag {
  width: calc(var(--px) * 362);
  aspect-ratio: 362 / 55;
}

.con08_tag_first,
.con08_tag_second {
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 28);
  letter-spacing: calc(-0.0587927vw);
  line-height: calc(34 / 1905 * 100vw);
}

.con08_tag_first {
  left: calc(7.1823204%);
}

.con08_tag_second {
  left: calc(65.7458564%);
}

.con08_title {
  margin-top: calc(0.4829396vw);
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 60);
  letter-spacing: calc(-0.1259843vw);
  line-height: calc(67 / 1905 * 100vw);
  color: #000;
}

.con08_title_text {
  white-space: pre;
}

.con08_title_mark::before {
  content: "";
  position: absolute;
  width: calc(var(--px) * 172);
  height: calc(var(--px) * 67);
  background: #fff;
}

.con08_desc {
  margin-top: calc(0.6404199vw);
  font-size: calc(var(--px) * 24);
  letter-spacing: calc(-0.0503937vw);
  line-height: calc(31.2 / 1905 * 100vw);
  color: #000;
}

.con08_map_frame {
  width: calc(var(--px) * 1441);
  height: calc(var(--px) * 511);
  margin-top: calc(2.7191601vw);
  border-radius: calc(var(--px) * 40);
  outline: 1px solid #fff;
  overflow: hidden;
  background: var(--color-pale-blue);
  box-shadow: 0 0 24px 6.7px rgba(5, 148, 201, .14);
}

.con08_map_img {
  width: calc(var(--px) * 1772);
  aspect-ratio: 1772 / 884;
  left: calc(-10.0624566%);
  top: calc(-7.6850394vw);
}

.con08_points {
  width: 100%;
  height: 100%;
}

.con08_radius_outer,
.con08_ripple,
.con08_protection,
.con08_competitor {
  box-sizing: border-box;
  border-radius: 50%;
}

/* 보장상권 원 — 한 개. 프레임(높이 511) 안에 통째로 보이는 크기(지름 480)로 두고 경계를 또렷하게 한다.
   예전엔 지름 735(프레임 위아래로 잘림) 바깥 원 + 380 안쪽 원 + 글로우 띠가 겹치고 두 원이 커졌다 사라지는 물결까지 돌아 어디까지가 보장상권인지 가늠이 안 됐다(클라이언트 2026-10-01 「원은 1개로」). 경쟁사 핀은 전부 이 원 안에 있다.
   물결(.con08_ripple)은 한 개만 되살렸고 원과 같은 지름·같은 중심에 둔다 — 가운데서부터 커지다 원 경계에서 사라지므로 원 밖으로 번지지 않는다(유저 2026-10-01 「지금 크기만큼만 커지는 글로우」). */
.con08_radius_outer,
.con08_ripple {
  width: calc(var(--px) * 480);
  height: calc(var(--px) * 480);
  top: 0.9vw;
}

.con08_radius_outer {
  background: rgba(6, 162, 219, .14);
  border: 3px solid rgba(6, 162, 219, .85);
}

/* 물결 글로우 — 바깥으로 갈수록 밝아지다 가장자리에서 옅어지는 띠. JS(con08-m02)가 켜기 전엔 보이지 않는다(JS 가 없거나 모션 줄이기면 정적 원만 남는다) */
.con08_ripple {
  background: radial-gradient(circle closest-side, rgba(6, 162, 219, 0) 0%, rgba(6, 162, 219, .1) 55%, rgba(6, 162, 219, .55) 92%, rgba(6, 162, 219, 0) 100%);
  opacity: 0;
}

.con08_pin {
  width: calc(var(--px) * 14);
  height: calc(var(--px) * 21);
  clip-path: polygon(3.6% 19.0%, 32.1% 0.0%, 67.9% 0.0%, 96.4% 19.0%, 96.4% 47.6%, 53.6% 95.2%, 39.3% 90.5%, 3.6% 47.6%);
}

/* 경쟁사 핀은 회색 — 가운데 PLUS82 파란 핀만 색을 갖는다 (기획 수정안 260930 「시안성 낮춤」). E사 = 짙은 회색, C사 = 연한 회색으로 두 무리만 구분 */
.con08_pin_e {
  background: #6d7681;
}

.con08_pin_c {
  background: #8d8d8d;
}

.con08_pin_716 {
  left: 34.6%;
  top: 12.5vw;
}

.con08_pin_717 {
  left: 37.1%;
  top: 12.2vw;
}

.con08_pin_718 {
  left: 42.6%;
  top: 6.1vw;
}

.con08_pin_719 {
  left: 41.5%;
  top: 4.3vw;
}

.con08_pin_720 {
  left: 42.8%;
  top: 2.6vw;
}

.con08_pin_721 {
  left: 45.6%;
  top: 2vw;
}

.con08_pin_722 {
  left: 48.3%;
  top: 2.1vw;
}

.con08_pin_723 {
  left: 50.9%;
  top: 4vw;
}

.con08_pin_724 {
  left: 54.3%;
  top: 2.2vw;
}

.con08_pin_725 {
  left: 57.7%;
  top: 4vw;
}

.con08_pin_726 {
  left: 63%;
  top: 10.9vw;
}

.con08_pin_727 {
  left: 56.4%;
  top: 16.8vw;
}

.con08_pin_728 {
  left: 57.5%;
  top: 19.4vw;
}

.con08_pin_729 {
  left: 56.1%;
  top: 23.1vw;
}

.con08_pin_730 {
  left: 53.3%;
  top: 23vw;
}

.con08_pin_731 {
  left: 50.4%;
  top: 23.8vw;
}

.con08_pin_732 {
  left: 45.2%;
  top: 23.1vw;
}

.con08_pin_733 {
  left: 43.2%;
  top: 18.2vw;
}

.con08_pin_734 {
  left: 41.5%;
  top: 19.6vw;
}

.con08_pin_735 {
  left: 37.8%;
  top: 18.1vw;
}

.con08_pin_736 {
  left: 35.4%;
  top: 16.6vw;
}

.con08_pin_737 {
  left: 36.4%;
  top: 14.7vw;
}

.con08_pin_746 {
  left: 40.2%;
  top: 12.5vw;
}

.con08_pin_747 {
  left: 45.3%;
  top: 4.4vw;
}

.con08_pin_749 {
  left: 51.4%;
  top: 1.9vw;
}

.con08_pin_750 {
  left: 55.6%;
  top: 5.2vw;
}

.con08_pin_751 {
  left: 60.3%;
  top: 11.1vw;
}

.con08_pin_752 {
  left: 59.9%;
  top: 14vw;
}

.con08_pin_753 {
  left: 64.1%;
  top: 14.9vw;
}

.con08_pin_754 {
  left: 63.2%;
  top: 17.2vw;
}

.con08_pin_755 {
  left: 58.8%;
  top: 17.6vw;
}

.con08_pin_756 {
  left: 60.9%;
  top: 19.7vw;
}

.con08_pin_757 {
  left: 55%;
  top: 18.6vw;
}

.con08_pin_758 {
  left: 54.7%;
  top: 20.4vw;
}

.con08_pin_759 {
  left: 48.2%;
  top: 22.4vw;
}

.con08_pin_760 {
  left: 45.7%;
  top: 19.3vw;
}

.con08_pin_761 {
  left: 43.1%;
  top: 21.3vw;
}

.con08_pin_762 {
  left: 40.1%;
  top: 21.4vw;
}

.con08_pin_763 {
  left: 40.3%;
  top: 15.3vw;
}

/* 경쟁사 원형 로고는 회색으로 — PLUS82 를 돋보이게 시안성을 낮춘다 (기획 수정안 260930). 지름 148.6 → 108: 「E사·C사 원형 로고 크기를 더 줄여달라」(클라이언트 2026-10-01) */
.con08_competitor {
  width: calc(var(--px) * 108);
  height: calc(var(--px) * 108);
  padding-top: calc(var(--px) * 2);
  gap: calc(1 / 1905 * 100vw);
  background: rgba(118, 126, 136, .94);
}

.con08_competitor_c {
  left: 57.9%;
  top: 5vw;
}

.con08_competitor_e {
  left: 34.8%;
  top: 5.6vw;
}

.con08_competitor_name {
  font-size: calc(var(--px) * 13);
  letter-spacing: calc(-0.0274vw);
  line-height: calc(15.7 / 1905 * 100vw);
}

.con08_competitor_count {
  font-size: calc(var(--px) * 16);
  letter-spacing: calc(-0.0336vw);
  line-height: calc(19.2 / 1905 * 100vw);
}

/* 「매장」 글자를 뺀 자리만큼 숫자를 키워 「몇 개」 가 먼저 읽히게 한다. 회색 배지 위라 파랑이 아니라 흰색 */
.con08_competitor_num {
  font-size: calc(var(--px) * 25);
  letter-spacing: calc(-0.0525vw);
  line-height: calc(25 / 1905 * 100vw);
  color: #ffffff;
}

.con08_shop_img {
  width: calc(var(--px) * 299);
  aspect-ratio: 299 / 228;
  left: calc(1.3879251%);
  top: calc(14.519685vw);
}

.con08_shop_copy {
  top: calc(5.3543307vw);
  gap: calc(5 / 1905 * 100vw);
}

.con08_shop_title {
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 22);
  letter-spacing: calc(-0.0461942vw);
  line-height: calc(22 / 1905 * 100vw);
  color: #000;
}

.con08_shop_distance {
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 45);
  font-weight: 900;
  letter-spacing: calc(-0.0944882vw);
  line-height: calc(45 / 1905 * 100vw);
}

/* 커다란 매장모양 핀 — 흰 배지(.con08_protection)가 머리 안에 얹힌다. 머리 중심(124/316)을 반경 원 중심(y 263)에 맞추면 top = 139 → 139 / 1905 * 100 (7.294vw)인데,
   핀은 머리 아래로 꼬리(190)가 길게 늘어져 그 자리에 두면 아래로 쳐져 보인다 → 핀 전체의 상하 중심이 원 중심에 오도록 36(1905 기준 = 1.9vw) 올렸다.
   뒤 반경 원(.con08_radius_outer)은 그대로. 가로는 부모 flex 가운데 */
.con08_bigpin {
  width: calc(var(--px) * 248);
  aspect-ratio: 248 / 316;
  top: calc(7.294vw - 1.9vw);
  filter: drop-shadow(0 calc(var(--px) * 9) calc(var(--px) * 13) rgba(3, 78, 132, .38));
}

.con08_bigpin svg {
  width: 100%;
  height: 100%;
}

.con08_protection {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: calc(var(--px) * 196.3);
  height: calc(var(--px) * 196.3);
  top: calc(8.6509186vw - 1.9vw);
  padding-top: calc(var(--px) * 38);
  border: 1px solid #fff;
  outline: 8px solid #b8f1ff;
  background: linear-gradient(to bottom, #fff 0%, #fff calc(64.3311%), #b8f1ff 100%);
}

.con08_logo_img {
  width: calc(var(--px) * 114);
  aspect-ratio: 114 / 40;
}

.con08_protection_text {
  margin-top: calc(17.7 / 1905 * 100vw);
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 24);
  letter-spacing: calc(-0.0503937vw);
  line-height: calc(26.6 / 1905 * 100vw);
  color: #000;
}

.con08_protection_line:last-child {
  display: block;
}

/* 모바일에서만 쓰는 「PLUS82 1개 매장」 강조 칩 — PC 는 핀 안 배지가 같은 말을 한다 */
.con08_solo {
  display: none;
}

/* con09 — 월 로열티 20만 원 고정 */
.con09 {
  padding-top: calc(var(--px) * 67);
  padding-bottom: calc(var(--px) * 67);
  background-color: var(--color-pale-blue);
}

.con09_principle_img {
  width: calc(var(--px) * 362);
  aspect-ratio: 362 / 55;
}

.con09_principle_first,
.con09_principle_second {
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 28.0395);
  letter-spacing: calc(-1.12158 / 1905 * 100vw);
  line-height: calc(34 / 1905 * 100vw);
}

.con09_principle_first {
  left: calc(26 / 362 * 100%);
}

.con09_principle_second {
  left: calc(248.5 / 362 * 100%);
}

.con09_title {
  margin-top: calc(12 / 1905 * 100vw);
  gap: 0;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 60.0543);
  letter-spacing: calc(-2.402172 / 1905 * 100vw);
  line-height: calc(67 / 1905 * 100vw);
  color: #000;
}

.con09_title_before,
.con09_title_point,
.con09_title_after {
  white-space: pre;
}

.con09_title_point {
  display: inline-block;
  background: #fff;
  box-shadow: calc(var(--px) * -7) 0 #fff, calc(var(--px) * 13) 0 #fff;
}

.con09_desc {
  margin-top: calc(13 / 1905 * 100vw);
  font-size: calc(var(--px) * 24.0218);
  letter-spacing: calc(-0.960872 / 1905 * 100vw);
  line-height: calc(29 / 1905 * 100vw);
  color: #000;
}

/* 스크롤 잉크(common.css): 처음부터 또렷한 하늘색 + 스크롤에 맞춰 짙은 포인트색이 글자를 왼쪽부터 채운다. padding 으로 칠하는 영역을 넓히고 left/top 을 같은 만큼 물린다 */
.con09_word {
  --ink-base: rgba(6, 162, 219, 0.4);
  --ink-lit: rgba(6, 162, 219, 0.9);
  padding: 0.2em 0.25em;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 150.224);
  letter-spacing: calc(-6.00896 / 1905 * 100vw);
  line-height: calc(150 / 1905 * 100vw);
  white-space: nowrap;
}

.con09_word_less {
  left: calc(943 / 1905 * 100% - 0.25em);
  top: calc(303.8 / 1905 * 100vw - 0.2em);
}

.con09_word_royalty {
  left: calc(1230 / 1905 * 100% - 0.25em);
  top: calc(306.8 / 1905 * 100vw - 0.2em);
}

.con09_list {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  width: 42.8346%;
  margin-top: calc(74 / 1905 * 100vw);
}

.con09_item {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 33.3333%;
}

.con09_price_long,
.con09_price_short {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: baseline;
  gap: 0;
}

.con09_price_long {
  font-size: calc(var(--px) * 33.6862);
  letter-spacing: calc(-1.347448 / 1905 * 100vw);
  line-height: calc(34 / 1905 * 100vw);
  color: #5c5b5b;
}

.con09_price_long_small {
  font-size: calc(var(--px) * 24.7032);
  letter-spacing: calc(-0.988128 / 1905 * 100vw);
  line-height: 1;
}

.con09_long_img {
  width: calc(var(--px) * 127);
  aspect-ratio: 127 / 339;
  margin-top: calc(12 / 1905 * 100vw);
}

.con09_label_long {
  margin-top: calc(6 / 1905 * 100vw);
  margin-left: calc(4.984 / 272 * 100%);
  padding: calc(var(--px) * 8) calc(var(--px) * 18.5);
  border-radius: calc(var(--px) * 8);
  background: #1b1b1b;
  font-size: calc(var(--px) * 22.0304);
  letter-spacing: calc(-0.881216 / 1905 * 100vw);
  line-height: calc(26 / 1905 * 100vw);
}

.con09_panel {
  width: calc(var(--px) * 270);
  padding: calc(var(--px) * 23) 0 calc(var(--px) * 28);
  outline: 1px solid #fff;
  border-radius: calc(var(--px) * 21);
  background: rgba(255, 255, 255, 0.65098);
}

.con09_price_short {
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 63.5155);
  letter-spacing: 0;
  line-height: calc(64 / 1905 * 100vw);
  color: #000;
}

.con09_price_short_small {
  font-size: calc(var(--px) * 46.5781);
  letter-spacing: calc(-1.863124 / 1905 * 100vw);
  line-height: 1;
}

.con09_short_img {
  width: calc(var(--px) * 127);
  aspect-ratio: 127 / 135;
  margin-top: calc(12 / 1905 * 100vw);
}

.con09_label_short {
  margin-top: calc(-22 / 1905 * 100vw);
  margin-left: 3.3%;
  padding: calc(var(--px) * 8) calc(var(--px) * 12.45);
  gap: 0;
  border-radius: calc(var(--px) * 8);
  background: var(--color-point);
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 22.0304);
  letter-spacing: calc(-0.881216 / 1905 * 100vw);
  line-height: calc(26 / 1905 * 100vw);
}

.con09_label_s {
  letter-spacing: calc(1.321824 / 1905 * 100vw);
}

.con09_shadow_long_img {
  width: calc(var(--px) * 349);
  aspect-ratio: 349 / 131;
  left: calc(641 / 1905 * 100%);
  top: calc(655 / 1905 * 100vw);
}

.con09_shadow_short_img {
  width: calc(var(--px) * 347);
  aspect-ratio: 347 / 230;
  left: calc(30.5 / 270 * 100%);
  top: calc(152 / 1905 * 100vw);
}

.con09_arrow_img {
  width: calc(var(--px) * 330);
  aspect-ratio: 330 / 292;
  left: calc(795 / 1905 * 100%);
  top: calc(422 / 1905 * 100vw);
}

.con09_difference {
  width: calc(var(--px) * 158);
  height: calc(var(--px) * 158);
  top: calc(416 / 1905 * 100vw);
  border-radius: 50%;
  box-shadow: 0 0 0 2px #fff, 0 0 0 8px #b8f1ff;
  background: linear-gradient(180deg, #000 0%, #000 10%, #000001 20%, #000104 30%, #00040e 40%, #010919 50%, #021026 60%, #041732 70%, #051d3c 80%, #062244 90%, var(--color-navy) 100%);
}

.con09_difference_copy {
  margin-bottom: calc(12 / 1905 * 100vw);
  text-align: center;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 24.0521);
  letter-spacing: calc(-0.962084 / 1905 * 100vw);
  line-height: calc(29 / 1905 * 100vw);
}

.con09_difference_amount {
  gap: 0;
}

.con09_difference_first {
  letter-spacing: calc(-4.81042 / 1905 * 100vw);
}

.con09_difference_second {
  letter-spacing: calc(-2.886252 / 1905 * 100vw);
}

.con09_panel_glow {
  width: calc(var(--px) * 270);
  height: calc(var(--px) * 262);
  left: calc(1089.5 / 1905 * 100%);
  top: calc(468 / 1905 * 100vw);
  border-radius: calc(var(--px) * 21);
  box-shadow: 0 0 54px rgba(15, 74, 119, 0.25), 0 0 103px 6px rgba(6, 162, 219, 0.31);
}

.con09_note {
  margin-top: calc(31 / 1905 * 100vw);
  font-size: calc(var(--px) * 16.0221);
  letter-spacing: calc(-0.640884 / 1905 * 100vw);
  line-height: calc(22 / 1905 * 100vw);
  color: #878787;
}

.con09_price_long,
.con09_price_short,
.con09_label_long,
.con09_label_short,
.con09_difference_month,
.con09_difference_amount,
.con09_note {
  white-space: nowrap;
}

.con09_price_long_small,
.con09_price_short_small,
.con09_difference_rest {
  white-space: pre;
}

/* CON10: 주 6일 물류 배송 */
.con10 {
  padding-top: calc(170 / 1905 * 100vw);
  padding-bottom: calc(151.6 / 1905 * 100vw);
  background: url('../images/con10_01.png') center top / 100% 100% no-repeat;
}

.con10_tag {
  width: calc(var(--px) * 362);
  aspect-ratio: 362 / 55;
}

.con10_tag_label {
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 28.0395);
  letter-spacing: calc(-0.04 * 28.0395 / 1905 * 100vw);
  line-height: calc(33.6 / 1905 * 100vw);
}

.con10_tag_label_first {
  left: calc(100% * 25.85 / 362);
}

.con10_tag_label_second {
  left: calc(100% * 248.38 / 362);
}

.con10_title {
  margin-top: calc(15.6 / 1905 * 100vw);
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 60.0543);
  letter-spacing: calc(-0.04 * 60.0543 / 1905 * 100vw);
  line-height: calc(72.1 / 1905 * 100vw);
  white-space: nowrap;
}

.con10_desc {
  margin-top: calc(17.8 / 1905 * 100vw);
  font-size: calc(var(--px) * 24.0218);
  letter-spacing: calc(-0.04 * 24.0218 / 1905 * 100vw);
  line-height: calc(28.8 / 1905 * 100vw);
  white-space: nowrap;
}

.con10_bar {
  z-index: 1;
  width: 54.8031%;
  margin-top: calc(31.1 / 1905 * 100vw);
  padding-block: calc(var(--px) * 16.7);
  border-radius: calc(var(--px) * 12);
  background: #0262c3;
  box-shadow: 0 0 54px rgba(15, 74, 119, .25);
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 28.0386);
  letter-spacing: calc(-0.02 * 28.0386 / 1905 * 100vw);
  line-height: calc(33.6 / 1905 * 100vw);
  text-align: center;
}

.con10_compare {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 54.8294%;
  height: calc(var(--px) * 415);
  margin-top: calc(16 / 1905 * 100vw);
}

.con10_legacy {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  box-sizing: border-box;
  width: 36.5534%;
  height: calc(var(--px) * 380);
  flex-shrink: 0;
  padding-top: calc(var(--px) * 43.6);
  border: 1px solid #747f84;
  border-radius: calc(var(--px) * 21);
  background: rgba(12, 12, 12, .4196078431);
  box-shadow: 0 0 24px 6.7px rgba(5, 148, 201, .14);
}

.con10_legacy_title {
  margin-left: calc(100% * 93.1 / 379.8);
  font-size: calc(var(--px) * 24.0338);
  letter-spacing: calc(-0.04 * 24.0338 / 1905 * 100vw);
  line-height: calc(28.8 / 1905 * 100vw);
  white-space: nowrap;
}

.con10_legacy_list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  width: calc(100% * 279 / 379.8);
  margin-left: calc(100% * 43.5 / 379.8);
  margin-top: calc(36.5 / 1905 * 100vw);
}

.con10_legacy_item {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  box-sizing: border-box;
  width: 100%;
  height: calc(var(--px) * 72);
  column-gap: calc(17.7 / 1905 * 100vw);
  border: 1px solid #747f84;
  border-radius: calc(var(--px) * 12);
  background: transparent;
}

.con10_legacy_item:nth-child(2) {
  margin-top: calc(7 / 1905 * 100vw);
}

.con10_legacy_item:nth-child(3) {
  margin-top: calc(6 / 1905 * 100vw);
}

.con10_legacy_img {
  width: calc(100% * 62 / 277);
  aspect-ratio: 62 / 45;
  margin-left: calc(100% * 18.9 / 277);
}

.con10_legacy_icon_warehouse {
  width: 80.6452%;
}

.con10_legacy_icon_store {
  width: 82.2581%;
}

.con10_legacy_text {
  flex-shrink: 0;
  font-size: calc(var(--px) * 17.024);
  letter-spacing: calc(-0.04 * 17.024 / 1905 * 100vw);
  line-height: calc(21.8 / 1905 * 100vw);
  color: #b6bec2;
  white-space: nowrap;
}

.con10_arrow {
  width: calc(var(--px) * 216);
  right: calc(var(--px) * -89.6);
  top: calc(105.1 / 1905 * 100vw);
}

.con10_plus {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  box-sizing: border-box;
  width: 70.7611%;
  height: calc(var(--px) * 415);
  flex-shrink: 0;
  margin-left: calc(var(--px) * -76.4);
  padding-top: calc(var(--px) * 53);
  border-radius: calc(var(--px) * 30);
  background: #fff;
  box-shadow: 0 0 54px rgba(15, 74, 119, .25), 0 0 103px 6.2px rgba(6, 162, 219, .31);
}

.con10_plus_inner {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  width: 79.2586%;
  column-gap: calc(100% * 8.2 / 585.8);
}

.con10_plus_column {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 49.3001%;
  flex-shrink: 0;
}

.con10_plus_title {
  margin-left: calc(100% * 6.1 / 288.8);
  font-size: calc(var(--px) * 28.0395);
  letter-spacing: calc(-0.04 * 28.0395 / 1905 * 100vw);
  line-height: calc(33.6 / 1905 * 100vw);
  color: #0c0c0c;
  white-space: nowrap;
}

.con10_plus_list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  row-gap: calc(9 / 1905 * 100vw);
}

.con10_plus_list_left {
  width: 100%;
  margin-top: calc(25.7 / 1905 * 100vw);
}

.con10_plus_list_right {
  width: 49.3001%;
  flex-shrink: 0;
  margin-top: calc(37.9 / 1905 * 100vw);
}

.con10_plus_card {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
  width: 100%;
  height: calc(var(--px) * 110);
  column-gap: calc(2 / 1905 * 100vw);
  border: 1px solid var(--color-point);
  border-radius: calc(var(--px) * 20);
  background: #eef4fc;
}

.con10_plus_card_calendar {
  padding-left: calc(100% * 12.1 / 288.8);
  padding-right: calc(100% * 30.7 / 288.8);
}

.con10_plus_card_map {
  padding-left: calc(100% * 10.1 / 288.8);
  padding-right: calc(100% * 30.7 / 288.8);
}

.con10_plus_card_spc {
  padding-left: calc(100% * 36.1 / 288.8);
  padding-right: calc(100% * 30.7 / 288.8);
  background: #f8fafe;
}

.con10_plus_card_stock {
  padding-left: calc(100% * 30.1 / 288.8);
  padding-right: calc(100% * 30.7 / 288.8);
}

.con10_plus_img {
  flex-shrink: 1;
  min-width: 0;
}

.con10_plus_img_calendar {
  width: 54.0984%;
  aspect-ratio: 132 / 89;
}

.con10_plus_img_map {
  width: 56.0976%;
  aspect-ratio: 138 / 84;
}

.con10_plus_img_spc {
  width: 30.4545%;
  aspect-ratio: 67 / 73;
  margin-top: calc(12.4 / 1905 * 100vw);
}

.con10_plus_img_stock {
  width: 36.2832%;
  aspect-ratio: 82 / 83;
}

.con10_plus_text {
  flex-shrink: 0;
  font-size: calc(var(--px) * 17.024);
  letter-spacing: calc(-0.04 * 17.024 / 1905 * 100vw);
  line-height: calc(21.8 / 1905 * 100vw);
  color: #0c0c0c;
  text-align: right;
  white-space: nowrap;
}

.con10_plus_text_calendar {
  margin-top: calc(55.8 / 1905 * 100vw);
}

.con10_plus_text_map {
  margin-top: calc(45.8 / 1905 * 100vw);
}

.con10_plus_text_spc {
  margin-top: calc(31.6 / 1905 * 100vw);
}

.con10_plus_text_stock {
  margin-top: calc(45.8 / 1905 * 100vw);
}

/* CON11: 매장 맞춤 시스템 지원 */
.con11 {
  background: url('../images/con11_01.png') center top / 100% 100% no-repeat;
  padding-top: calc(71 / 1905 * 100vw);
  padding-bottom: calc(.7 / 1905 * 100vw);
}

.con11_tag {
  width: 19.0026%;
  aspect-ratio: 362 / 55;
  margin-right: calc(9 / 1905 * 100vw);
}

.con11_tag_lead,
.con11_tag_number {
  font-family: 'Paperlogy';
  font-size: calc(var(--px) * 28.0395);
  letter-spacing: calc(-.04 * 28.0395 / 1905 * 100vw);
  line-height: calc(33.6 / 1905 * 100vw);
}

.con11_tag_lead {
  left: calc(100% * 25.8487 / 362);
}

.con11_tag_number {
  left: calc(100% * 248.3847 / 362);
}

.con11_title {
  margin-top: calc(23.4 / 1905 * 100vw);
  margin-right: calc(4.5072 / 1905 * 100vw);
  font-family: 'Paperlogy';
  color: #000;
  white-space: nowrap;
}

.con11_title_first {
  display: block;
  font-size: calc(var(--px) * 50.0957);
  letter-spacing: calc(-.04 * 50.0957 / 1905 * 100vw);
  line-height: calc(56 / 1905 * 100vw);
  text-align: center;
}

.con11_title_second {
  margin-top: calc(1 / 1905 * 100vw);
  font-size: calc(var(--px) * 60.0543);
  letter-spacing: calc(-.04 * 60.0543 / 1905 * 100vw);
  line-height: calc(67 / 1905 * 100vw);
}

.con11_title_point {
  display: inline-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.con11_title_point_text,
.con11_title_rest {
  white-space: pre;
}

.con11_title_highlight {
  width: calc(329 / 1905 * 100vw);
  height: 100%;
  left: calc(-5.0589 / 1905 * 100vw);
  background: #fff;
}

.con11_desc {
  margin-top: calc(22.2 / 1905 * 100vw);
  font-size: calc(var(--px) * 24.0218);
  letter-spacing: calc(-.04 * 24.0218 / 1905 * 100vw);
  line-height: calc(28.8 / 1905 * 100vw);
  color: #000;
  white-space: nowrap;
  text-align: center;
}

.con11_bar {
  width: 54.8031%;
  margin-top: calc(35.3 / 1905 * 100vw);
  padding-block: calc(16.7 / 1905 * 100vw);
  background: #0262c3;
  border-radius: calc(12 / 1905 * 100vw);
  box-shadow: 0 0 54px rgba(15, 74, 119, .25);
  font-family: 'Paperlogy';
  font-size: calc(var(--px) * 28.0386);
  letter-spacing: calc(-.02 * 28.0386 / 1905 * 100vw);
  line-height: calc(33.6 / 1905 * 100vw);
  text-align: center;
  z-index: 1;
}

.con11_compare {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 54.6982%;
  height: calc(415 / 1905 * 100vw);
  margin-top: calc(16.6 / 1905 * 100vw);
}

.con11_legacy,
.con11_plus,
.con11_legacy_item,
.con11_data_card,
.con11_card_border,
.con11_app_card {
  box-sizing: border-box;
}

.con11_legacy {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 32.5336%;
  height: calc(362 / 1905 * 100vw);
  flex-shrink: 0;
  padding-top: calc(40.3 / 1905 * 100vw);
  background: var(--color-pale-blue);
  border-radius: calc(21 / 1905 * 100vw);
  box-shadow: 0 0 24px 6.7px rgba(5, 148, 201, .14);
}

.con11_legacy_title {
  margin-left: calc(100% * 91.1631 / 339);
  font-size: calc(var(--px) * 24.0331);
  letter-spacing: calc(-.04 * 24.0331 / 1905 * 100vw);
  line-height: calc(28.8 / 1905 * 100vw);
  color: #0c0c0c;
  white-space: nowrap;
}

.con11_legacy_list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  width: 83.5988%;
  margin-left: calc(100% * 41.3009 / 339);
  margin-top: calc(32 / 1905 * 100vw);
}

.con11_legacy_item {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: calc(72 / 1905 * 100vw);
  border: 1px solid #a6c4d2;
  border-radius: calc(12 / 1905 * 100vw);
  background: transparent;
}

.con11_legacy_item01 {
  column-gap: calc(37.7 / 1905 * 100vw);
}

.con11_legacy_item02 {
  margin-top: calc(7 / 1905 * 100vw);
  column-gap: calc(30.7 / 1905 * 100vw);
}

.con11_legacy_item03 {
  margin-top: calc(6 / 1905 * 100vw);
  column-gap: calc(36.7 / 1905 * 100vw);
}

.con11_legacy_icon {
  flex-shrink: 0;
}

.con11_legacy_icon01 {
  width: calc(35 / 1905 * 100vw);
  margin-left: calc(26.2 / 1905 * 100vw);
}

.con11_legacy_icon02 {
  width: calc(46 / 1905 * 100vw);
  margin-left: calc(22.2 / 1905 * 100vw);
}

.con11_legacy_icon03 {
  width: calc(34 / 1905 * 100vw);
  margin-left: calc(28.2 / 1905 * 100vw);
}

.con11_legacy_copy {
  flex-shrink: 0;
  margin-top: calc(.3 / 1905 * 100vw);
  font-size: calc(var(--px) * 17.0235);
  letter-spacing: calc(-.04 * 17.0235 / 1905 * 100vw);
  line-height: calc(20.4 / 1905 * 100vw);
  color: #678594;
  white-space: nowrap;
}

.con11_plus {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 70.9309%;
  height: calc(415 / 1905 * 100vw);
  margin-left: calc(-36.1 / 1905 * 100vw);
  flex-shrink: 0;
  padding-top: calc(45.4 / 1905 * 100vw);
  background: #fff;
  border-radius: calc(21 / 1905 * 100vw);
  outline: 1px solid #fff;
  box-shadow: 0 0 54px rgba(15, 74, 119, .25), 0 0 103px 6.2px rgba(6, 162, 219, .31);
}

.con11_plus_inner {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  width: 79.3352%;
}

.con11_plus_left {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  width: 49.2866%;
  flex-shrink: 0;
}

.con11_plus_title {
  margin-left: calc(4.8 / 1905 * 100vw);
  margin-top: calc(4.4 / 1905 * 100vw);
  font-size: calc(var(--px) * 28.0386);
  letter-spacing: calc(-.04 * 28.0386 / 1905 * 100vw);
  line-height: calc(33.6 / 1905 * 100vw);
  color: #0c0c0c;
  white-space: nowrap;
}

.con11_plus_brand,
.con11_plus_title_line {
  display: block;
}

.con11_map {
  margin-top: calc(27.6 / 1905 * 100vw);
}

.con11_graph {
  margin-top: calc(11 / 1905 * 100vw);
}

.con11_data_card {
  width: 100%;
  height: calc(110 / 1905 * 100vw);
  border-radius: calc(21 / 1905 * 100vw);
  background: #f8fafe;
  overflow: hidden;
}

.con11_data_photo {
  width: calc(100% + 4 / 1905 * 100vw);
}

.con11_card_border {
  width: 100%;
  height: 100%;
  border: 1px solid var(--color-point);
  border-radius: inherit;
}

.con11_data_copy,
.con11_app_copy {
  flex-shrink: 0;
  font-size: calc(var(--px) * 17.0235);
  letter-spacing: calc(-.04 * 17.0235 / 1905 * 100vw);
  line-height: calc(20.4 / 1905 * 100vw);
  color: #0c0c0c;
  white-space: nowrap;
}

.con11_data_copy {
  align-self: flex-end;
  margin-right: calc(24.4 / 1905 * 100vw);
}

.con11_map_copy {
  margin-top: calc(48.8 / 1905 * 100vw);
}

.con11_graph_copy {
  margin-top: calc(50.8 / 1905 * 100vw);
}

.con11_app_card {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 49.4571%;
  height: calc(331 / 1905 * 100vw);
  flex-shrink: 0;
  border: 1px solid var(--color-point);
  border-radius: calc(21 / 1905 * 100vw);
  background: #f8fafe;
  padding: calc(17.3 / 1905 * 100vw) 0 calc(18.8 / 1905 * 100vw);
}

.con11_app_logos {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  width: 74.6528%;
  aspect-ratio: 215 / 112;
  flex-shrink: 0;
}

.con11_app_baemin,
.con11_app_yogiyo {
  width: 39.0698%;
}

.con11_app_baemin {
  margin-right: calc(100% * 47 / 215);
}

.con11_app_coupang {
  width: 78.1395%;
  top: calc(-4 / 1905 * 100vw);
}

.con11_app_settings {
  width: calc(137 / 1905 * 100vw);
  margin-top: auto;
  flex-shrink: 0;
}

.con11_app_copy {
  margin-top: calc(14.1 / 1905 * 100vw);
  text-align: center;
}

/* con12: 본사 쿠폰 지원 */
.con12 {
  background-image: url('/images/con12_01.png');
  align-items: flex-start;
  padding-top: calc(12.7034120735vw);
  padding-bottom: calc(5.9842519685vw);
}

.con12_row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  width: 74.5932%;
  margin-left: calc(17.7427821522%);
  flex-shrink: 0;
}

.con12_left {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 33.5961%;
  margin-top: calc(2.2572178478vw);
  flex-shrink: 0;
}

.con12_stage {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 66.9951%;
  margin-left: calc(-0.5911330049%);
  flex-shrink: 0;
}

.con12_pill_img {
  width: calc(var(--px) * 495);
  aspect-ratio: 495 / 77;
}

.con12_pill_copy {
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 32.0176);
  letter-spacing: calc(-0.0672285564vw);
  line-height: calc(2.0157480315vw);
  white-space: nowrap;
}

.con12_title {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: calc(1.5958005249vw);
  margin-left: calc(1.7176372015%);
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 70.0386);
  letter-spacing: calc(-0.1470626772vw);
  line-height: calc(4.1552703412vw);
  white-space: nowrap;
  -webkit-text-stroke: calc(var(--px) * 4) #009dd7;
  paint-order: stroke fill;
}

.con12_title_line,
.con12_title_rate {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
}

.con12_title_plain,
.con12_title_tail,
.con12_title_last {
  white-space: pre;
}

.con12_title_rate {
  color: #fbff89;
}

.con12_digit_2 {
  letter-spacing: calc(0.1470626772vw);
}

.con12_digit_3 {
  letter-spacing: 0vw;
}

.con12_apps {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: calc(2.0629921260vw);
  margin-left: calc(1.4662756598%);
}

.con12_app {
  flex-shrink: 0;
}

.con12_app:nth-child(2) {
  margin-left: calc(var(--px) * 7);
}

.con12_app:nth-child(3) {
  margin-left: calc(var(--px) * 5);
}

.con12_app:nth-child(4) {
  margin-left: calc(var(--px) * 6);
}

.con12_app_img {
  width: calc(var(--px) * 98);
  aspect-ratio: 98 / 99;
}

.con12_app:nth-child(n+2) .con12_app_img {
  width: calc(var(--px) * 99);
  aspect-ratio: 99 / 99;
}

.con12_percent_img {
  width: calc(var(--px) * 472);
  aspect-ratio: 472 / 453;
  left: 0;
  top: calc(11.9160104987vw);
}

.con12_phone_shadow_img {
  width: calc(var(--px) * 564);
  aspect-ratio: 564 / 593;
  left: calc(15.7563025210%);
  top: calc(5.8267716535vw);
}

.con12_phone_back_img,
.con12_phone_clip_img {
  width: calc(var(--px) * 281);
  aspect-ratio: 281 / 542;
  left: calc(64.4957983193%);
}

.con12_phone_front_img {
  width: calc(var(--px) * 338);
  aspect-ratio: 338 / 652;
  margin-left: calc(34.5588235294%);
}

.con12_coupon {
  width: calc(var(--px) * 431);
  left: calc(57.2478991597%);
  top: calc(15.2230971129vw);
}

.con12_coupon_shadow_img {
  width: calc(var(--px) * 421);
  aspect-ratio: 421 / 243;
  top: calc(4.4619422572vw);
}

.con12_coupon_body_img {
  width: calc(var(--px) * 383);
  aspect-ratio: 383 / 248;
}

.con12_coupon_logo_img {
  width: calc(var(--px) * 109);
  aspect-ratio: 109 / 49;
  left: calc(35.2668213457%);
  top: calc(3.7270341207vw);
}

.con12_coupon_title,
.con12_coupon_copy {
  font-family: "Paperlogy";
  white-space: nowrap;
  transform: rotate(-9.028003deg);
  transform-origin: 0 0;
}

.con12_coupon_title {
  left: calc(15.8361272994%);
  top: calc(7.1004815911vw);
  font-size: calc(var(--px) * 60.8592);
  letter-spacing: calc(-0.1277883465vw);
  line-height: calc(3.8320209974vw);
  background-image: var(--light-layer, none), linear-gradient(327.028003deg, rgb(6, 162, 219) calc(24.9747%), rgb(19, 164, 220) calc(28.7490%), rgb(34, 167, 221) calc(32.5233%), rgb(47, 171, 223) calc(36.2976%), rgb(59, 175, 225) calc(40.0719%), rgb(70, 180, 228) calc(43.8462%), rgb(81, 185, 230) calc(47.6205%), rgb(92, 190, 233) calc(51.3948%), rgb(103, 196, 235) calc(55.1691%), rgb(113, 202, 238) calc(58.9434%), rgb(123, 207, 241) calc(62.7177%), rgb(133, 213, 243) calc(66.4920%), rgb(142, 218, 245) calc(70.2663%), rgb(151, 223, 248) calc(74.0406%), rgb(159, 228, 250) calc(77.8149%), rgb(166, 232, 252) calc(81.5892%), rgb(172, 236, 253) calc(85.3635%), rgb(176, 239, 255) calc(89.1378%), rgb(177, 239, 255) calc(90.0814%));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.con12_coupon_copy {
  left: calc(32.0259645829%);
  top: calc(10.2855290645vw);
  font-size: calc(var(--px) * 32.0177);
  letter-spacing: calc(-0.0672287664vw);
  line-height: calc(2.0157480315vw);
}

/* CON13: 잘 팔리지 않으면 출시하지 않습니다. */
.con13 {
  background-color: var(--color-point);
  z-index: 1;
}

.con13_surface {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100.7874%;
  flex-shrink: 0;
  padding-top: calc(133.4 / 1905 * 100vw);
  padding-bottom: calc(89 / 1905 * 100vw);
  background: var(--color-pale-blue) url('/images/con13_01.png') center calc(-43 / 1905 * 100vw) no-repeat;
  background-size: calc(var(--px) * 1374) calc(var(--px) * 1128);
  border-radius: calc(var(--px) * 150) calc(var(--px) * 150) 0 0;
  overflow: hidden;
}

.con13_title {
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 60.0543);
  letter-spacing: calc(-2.402172 / 1905 * 100vw);
  line-height: calc(65 / 1905 * 100vw);
  color: #000;
  white-space: nowrap;
}

.con13_title_leaf {
  white-space: pre;
}

.con13_title_tracking {
  letter-spacing: calc(1.201086 / 1905 * 100vw);
}

.con13_title_line {
  background-image: var(--light-layer, none), linear-gradient(#000, #000);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.con13_title_gradient {
  background-image: var(--light-layer, none), linear-gradient(318deg, var(--color-navy) 3.1%, var(--color-navy) 41.0%, #082a4e 43.3%, #093359 45.7%, #0a3f67 48.1%, #0b4d77 50.4%, #0b5b89 52.8%, #0c6b9a 55.2%, #0b7aac 57.5%, #0a88bc 59.9%, #0994cb 62.2%, #079ed7 64.6%, var(--color-point) 65.8%, var(--color-point) 67.0%, var(--color-point) 97.2%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.con13_desc {
  margin-top: calc(17.2 / 1905 * 100vw);
  font-size: calc(var(--px) * 24.0218);
  letter-spacing: calc(-.960872 / 1905 * 100vw);
  line-height: calc(28.8 / 1905 * 100vw);
  color: #000;
  white-space: nowrap;
}

.con13_list {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  width: 42.1719%;
  margin-top: calc(38.5 / 1905 * 100vw);
  flex-wrap: wrap;
  row-gap: calc(15 / 1905 * 100vw);
}

.con13_item {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 49.0305%;
  flex-shrink: 0;
}

.con13_badge {
  padding-block: calc(var(--px) * 7.1);
  padding-inline: calc(var(--px) * 23.9);
  background-color: var(--color-point);
  border-radius: 50vw;
  z-index: 1;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 23.9621);
  letter-spacing: calc(-.718863 / 1905 * 100vw);
  line-height: calc(28.8 / 1905 * 100vw);
}

.con13_badge_waffle {
  padding-inline: calc(var(--px) * 24.8);
}

.con13_badge_tea {
  padding-inline: calc(var(--px) * 25.4);
}

.con13_panel {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  margin-top: calc(-20 / 1905 * 100vw);
  padding: calc(var(--px) * 48) 0 calc(var(--px) * 32);
  box-sizing: border-box;
  border-radius: calc(var(--px) * 30);
  box-shadow: 0 0 16px rgba(0, 0, 0, .05);
  background-image: linear-gradient(180deg, #0f3d76 -0.8%, #0f3d76 3.4%, #0f3d76 3.9%, #0e3b72 7.6%, #0d386d 11.7%, #0c3466 15.9%, #0b305f 20.1%, #0a2c57 24.2%, #082951 28.4%, #08264b 32.6%, #072347 36.7%, var(--color-navy) 37.3%, var(--color-navy) 100.3%);
}

.con13_metric {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  box-sizing: border-box;
}

.con13_metric_time {
  width: 37.0277%;
  padding-left: calc(var(--px) * 12.3);
}

.con13_metric_sales {
  width: 62.9723%;
  padding-right: calc(var(--px) * 18.7);
}

.con13_metric_sales_right {
  padding-right: calc(var(--px) * 14.7);
}

.con13_clock_img {
  width: calc(var(--px) * 34);
  aspect-ratio: 34 / 34;
  margin-top: calc(2 / 1905 * 100vw);
}

.con13_store_img {
  width: calc(var(--px) * 38);
  aspect-ratio: 38 / 34;
}

.con13_caption {
  font-size: calc(var(--px) * 16.0221);
  letter-spacing: calc(-.640884 / 1905 * 100vw);
  line-height: calc(19.2 / 1905 * 100vw);
}

.con13_caption_time {
  margin-top: calc(14.5 / 1905 * 100vw);
}

.con13_caption_sales {
  margin-top: calc(16.5 / 1905 * 100vw);
}

.con13_value {
  margin-top: calc(3.8 / 1905 * 100vw);
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 32.0442);
  letter-spacing: calc(-1.281768 / 1905 * 100vw);
  line-height: calc(38.5 / 1905 * 100vw);
  color: #fbff89;
}

.con13_value > span {
  white-space: pre;
}

.con13_space {
  color: #b8f1ff;
}

.con13_divider {
  width: 1px;
  left: calc(147 / 397 * 100%);
  background-color: #fff;
  opacity: .14901960784313725;
}

.con13_divider_waffle {
  height: calc(132.989030 / 1905 * 100vw);
  top: calc(34.052380 / 1905 * 100vw);
}

.con13_divider_other {
  height: calc(133.395247 / 1905 * 100vw);
  top: calc(36.802377 / 1905 * 100vw);
}

.con13_food_waffle {
  width: calc(var(--px) * 334);
  aspect-ratio: 334 / 300;
  left: calc(15.8072916667%);
  top: calc(250 / 1905 * 100vw);
}

.con13_food_egg {
  width: calc(var(--px) * 390);
  aspect-ratio: 390 / 474;
  left: calc(65.703125%);
  top: calc(99 / 1905 * 100vw);
}

.con13_food_tea {
  width: calc(var(--px) * 343);
  aspect-ratio: 343 / 361;
  left: calc(14.8697916667%);
  top: calc(542 / 1905 * 100vw);
}

.con13_food_tteok {
  width: calc(var(--px) * 315);
  aspect-ratio: 315 / 315;
  left: calc(66.7447916667%);
  top: calc(579 / 1905 * 100vw);
}

/* 하나만 선명 순환(con13-m07) — js/animation.js 가 is-active 를 옮기고 전환은 transition 이 담당 */
.con13_food_overlay {
  opacity: .74;
  transition: opacity 0.6s ease;
}

.con13_food_img.is-active .con13_food_overlay {
  opacity: 0;
}

.con13_source {
  margin-top: calc(47.9 / 1905 * 100vw);
  font-size: calc(var(--px) * 16.0221);
  letter-spacing: calc(-.640884 / 1905 * 100vw);
  line-height: calc(19.2 / 1905 * 100vw);
  color: #878787;
  white-space: nowrap;
}

/* CON15: 점포개발 직접합니다 */
.con15 {
  padding-top: calc(var(--px) * 78.099959);
  padding-bottom: calc(var(--px) * 140.452354);
  background-color: var(--color-pale-blue);
}

.con15_title {
  padding-right: calc(var(--px) * 4.5);
  box-sizing: border-box;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 60.1149);
  letter-spacing: calc(-2.404596 / 1905 * 100vw);
  line-height: calc(65 / 1905 * 100vw);
  color: #000;
}

.con15_title_line {
  white-space: nowrap;
}

.con15_impact {
  margin-top: calc(-3.089059 / 1905 * 100vw);
  font-size: calc(var(--px) * 70.134);
  letter-spacing: calc(-2.80536 / 1905 * 100vw);
  line-height: calc(84 / 1905 * 100vw);
}

.con15_impact_text {
  background-image: var(--light-layer, none), linear-gradient(318deg, var(--color-navy) 5.6%, #07274b 38.7%, #082a4f 40.2%, #09355c 44.1%, #0a436c 47.9%, #0b527e 51.8%, #0c6392 55.6%, #0b74a6 59.5%, #0a84b9 63.4%, #0993c9 67.2%, #079ed6 71.1%, var(--color-point) 73.4%, var(--color-point) 95.3%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}

.con15_glow {
  width: calc(var(--px) * 548);
  aspect-ratio: 548 / 63;
  top: calc(137.900041 / 1905 * 100vw);
}

.con15_divider {
  width: 1px;
  height: calc(40 / 1905 * 100vw);
  margin-top: calc(3.989100 / 1905 * 100vw);
  background-color: #000;
}

.con15_desc {
  margin-top: calc(3.611042 / 1905 * 100vw);
  color: #0c0c0c;
}

.con15_desc_line {
  font-size: calc(var(--px) * 35.067);
  letter-spacing: calc(-1.40268 / 1905 * 100vw);
  line-height: calc(47.4 / 1905 * 100vw);
  white-space: nowrap;
}

.con15_desc_line:first-child > span {
  color: #000;
}

.con15_desc_emphasis {
  margin-top: calc(1.045616 / 1905 * 100vw);
  padding-inline: calc(var(--px) * 11.9);
  line-height: calc(46 / 1905 * 100vw);
  background-color: var(--color-point);
}

.con15_capsule {
  width: 82.1528%;
  margin-top: calc(24.495690 / 1905 * 100vw);
  padding: calc(var(--px) * 38.747652) 0 calc(var(--px) * 38.947646);
  box-sizing: border-box;
  border-radius: 50vw;
  background-color: #fff;
  box-shadow: 0 0 calc(54 / 1905 * 100vw) rgba(15, 74, 119, .25), 0 0 calc(92 / 1905 * 100vw) rgba(6, 162, 219, .62);
}

.con15_list {
  width: 86.3252%;
  gap: calc(13.4 / 1905 * 100vw);
  flex-wrap: nowrap;
  color: #0c0c0c;
}

.con15_item {
  width: 15.8401%;
  flex-shrink: 0;
  padding: calc(var(--px) * 5.7) 0 calc(var(--px) * 11.850853);
  border: 1px solid #e0e9ec;
  border-radius: calc(var(--px) * 12);
  box-sizing: border-box;
  background-color: #fff;
}

.con15_item.is-active {
  background-color: var(--color-navy);
}

.con15_photo {
  width: calc(var(--px) * 196);
  aspect-ratio: 196 / 111;
}

.con15_item:nth-child(6) > div {
  width: calc(var(--px) * 197);
  aspect-ratio: 197 / 111;
}

.con15_caption {
  margin-top: calc(11.349147 / 1905 * 100vw);
  font-size: calc(var(--px) * 17.0259);
  letter-spacing: calc(-.681036 / 1905 * 100vw);
  line-height: calc(20.4 / 1905 * 100vw);
  white-space: nowrap;
}

.con15_item:nth-child(n + 4) > p {
  font-size: calc(var(--px) * 17.0287);
  letter-spacing: calc(-.681148 / 1905 * 100vw);
}

.con15_arrow {
  width: calc(var(--px) * 30.565187);
  height: calc(30.565187 / 1905 * 100vw);
  border-radius: 50%;
  background-color: #fff;
  box-shadow: 0 0 calc(9 / 1905 * 100vw) rgba(7, 35, 70, .36);
}

.con15_arrow_1 {
  left: calc(311.723222 / 1565.011631 * 100%);
  background-color: var(--color-point);
}

.con15_arrow_2 {
  left: calc(539.723222 / 1565.011631 * 100%);
}

.con15_arrow_4 {
  left: calc(994.723222 / 1565.011631 * 100%);
}

.con15_arrow_5 {
  left: calc(1221.723222 / 1565.011631 * 100%);
}

.con15_arrow_icon {
  width: calc(var(--px) * 7);
  height: calc(12 / 1905 * 100vw);
}

/* CON16 — 매장 맞춤 인테리어 */
.con16 {
  padding-top: calc(3.3024557173641536vw);
  padding-bottom: calc(8.686309271786195vw);
  background-color: var(--color-pale-blue);
}

.con16::before {
  content: "";
  position: absolute;
  width: 131.5486%;
  height: calc(845 / 1905 * 100vw);
  top: calc(25.669291338582678vw);
  border-radius: 50%;
  background-color: #fff;
}

.con16_head {
  padding-right: calc(4.3 / 1905 * 100vw);
  font-family: "Paperlogy";
  color: #000;
}

.con16_lead {
  font-size: calc(var(--px) * 42.0579589431);
  letter-spacing: calc(42.0579589431 * -0.04 / 1905 * 100vw);
  line-height: calc(50.4 / 1905 * 100vw);
}

.con16_title {
  flex-direction: row;
  margin-top: calc(0.031496062992126vw);
  font-size: calc(var(--px) * 60.0827784485);
  letter-spacing: calc(60.0827784485 * -0.04 / 1905 * 100vw);
  line-height: calc(72 / 1905 * 100vw);
}

.con16_bgword {
  top: calc(726.4646192342 / 1905 * 100vw);
  left: calc(586.744 / 1905 * 100%);
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 150.2240372736);
  letter-spacing: calc(150.2240372736 * -0.04 / 1905 * 100vw);
  line-height: calc(180 / 1905 * 100vw);
  color: var(--color-pale-blue);
}

.con16_star {
  top: calc(81.7900583928 / 1905 * 100vw);
  left: calc(525.9 / 1905 * 100%);
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 91.6229178161);
  letter-spacing: calc(91.6229178161 * -0.04 / 1905 * 100vw);
  line-height: calc(110 / 1905 * 100vw);
  transform-origin: calc(21 / 38.1875 * 100%) calc(34.5 / 110 * 100%);
}

.con16_gallery {
  flex-direction: row;
  width: calc(923 / 1905 * 100%);
  margin-top: calc(1.3530419622006333vw);
}

.con16_main_swiper.swiper {
  display: flex;
  flex-direction: row;
  width: calc(717.659192 / 923 * 100%);
}

.con16_main_track {
  flex-direction: row;
  justify-content: flex-start;
}

.con16_slide.swiper-slide {
  flex-direction: row;
}

.con16_main_photo {
  flex-direction: row;
  width: 100%;
  aspect-ratio: 717659192 / 407505961;
  overflow: hidden;
  border-radius: calc(21 / 1905 * 100vw);
}

.con16_thumbs.swiper {
  display: flex;
  flex-direction: row;
  width: calc(1435.999940 / 1905 * 100%);
  margin-top: calc(1.3819897416671996vw);
}

.con16_thumbs_track {
  flex-direction: row;
  justify-content: flex-start;
  width: 100%;
  transition-timing-function: linear;
}

.con16_thumb_item.swiper-slide {
  display: flex;
  width: calc(229.540448 / 1435.999940 * 100%);
  margin-right: calc(11.7514504 / 1435.999940 * 100%);
  flex-shrink: 0;
}

.con16_thumb {
  width: 100%;
  cursor: inherit;
}

.con16_thumb_photo {
  flex-direction: row;
  width: 100%;
  aspect-ratio: 229540448 / 130005712;
  overflow: hidden;
  border-radius: calc(12 / 1905 * 100vw);
}

.con16_photo {
  height: auto;
  flex-shrink: 0;
  max-width: none;
}

.con16_photo[data-photo="1"] { width: 103.9491%; }
.con16_photo[data-photo="2"] { width: 111.0915%; }
.con16_photo[data-photo="3"] { width: 103.6854%; }
.con16_photo[data-photo="4"] { width: 103.2498%; }
.con16_photo[data-photo="5"] { width: 104.1211%; }
.con16_photo[data-photo="6"] { width: 127.2107%; }
.con16_photo[data-photo="7"] { width: 106.7350%; }

.con16_photo_main[data-photo="1"] { left: calc(-12.026533 / 717.659192 * 100%); }
.con16_photo_main[data-photo="2"] { left: -6.5%; top: calc(-0.550358vw); }
.con16_photo_main[data-photo="3"] { top: calc(-1.535084vw); }
.con16_photo_main[data-photo="4"] { top: calc(-4.161019vw); }
.con16_photo_main[data-photo="5"] { left: -1.7%; top: calc(-4.161019vw); }
.con16_photo_main[data-photo="6"] { left: -7.5%; top: calc(-3.832777vw); }
.con16_photo_main[data-photo="7"] { left: -2.8%; }
.con16_photo_thumb[data-photo="2"] { left: -6.5%; top: calc(-0.184782vw); }
.con16_photo_thumb[data-photo="3"] { top: calc(-0.499743vw); }
.con16_photo_thumb[data-photo="6"] { left: -7.5%; top: calc(-1.234651vw); }

.con16_prev,
.con16_next {
  width: calc(50 / 1905 * 100vw);
  aspect-ratio: 1;
  border-radius: 50%;
  box-sizing: border-box;
  z-index: 2;
  transition: background-color var(--transition-ui) var(--ease-ui), color var(--transition-ui) var(--ease-ui);
}

.con16_prev {
  left: 0;
  background-color: transparent;
  border: 1px solid var(--color-point);
}

.con16_prev:hover,
.con16_next:hover {
  background-color: var(--color-point);
  color: #fff;
}

.con16_next {
  right: 0;
  border: 1px solid var(--color-point);
}

.con16_arrow {
  width: calc(9 / 1905 * 100vw);
  height: calc(16 / 1905 * 100vw);
}

.con16_arrow_path {
  fill: none;
  stroke: currentColor;
  stroke-width: 1;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* CON17: 창업 비용 */
.con17 {
  padding-top: calc(100vw * 66.998142 / 1905);
  padding-bottom: calc(100vw * 39 / 1905);
  background: #fff;
}

.con17_label {
  padding: calc(100vw * 11.323096 / 1905) calc(100vw * 22.746296 / 1905) calc(100vw * 8.680620 / 1905);
  border-radius: calc(100vw * 12 / 1905);
  background: var(--light-layer, none), radial-gradient(ellipse calc(100vw * 219.065344 / 1905) calc(100vw * 115.289339 / 1905) at 50.6% calc(100vw * 114.618842 / 1905), #04ffff 54.5%, #04c1e7 60%, #039cd9 65%, #0384d0 70%, #0275ca 75%, #026cc7 80%, #0267c5 85%, #0265c4 90%, #0263c3 100%);
  background-color: #0262c3;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 25.0345);
  letter-spacing: calc(100vw * -1.001380 / 1905);
  line-height: calc(100vw * 30 / 1905);
  white-space: pre;
}

.con17_title {
  margin-top: calc(100vw * 6.631482 / 1905);
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 60.0543);
  letter-spacing: calc(100vw * -2.402172 / 1905);
  line-height: calc(100vw * 72 / 1905);
  white-space: pre;
}

.con17_desc {
  margin-top: calc(100vw * 12.187670 / 1905);
  font-size: calc(var(--px) * 24.0218);
  letter-spacing: calc(100vw * -0.960872 / 1905);
  line-height: calc(100vw * 28.8 / 1905);
  white-space: pre;
}

.con17_table {
  width: 65.1969vw;
  height: auto;
  margin-top: calc(100vw * -15.621010 / 1905);
}

.con17_card {
  width: 26.6705vw;
  top: calc(100vw * 402.949823 / 1905);
  padding: calc(100vw * 40.050177 / 1905) calc(100vw * 52.754991 / 1905) calc(100vw * 41.141351 / 1905);
  border: 1px solid #fff;
  box-sizing: border-box;
  border-radius: calc(100vw * 21 / 1905);
  background: #fff;
  box-shadow: 0 0 calc(100vw * 54 / 1905) rgba(15,74,119,.25), 0 0 calc(100vw * 92 / 1905) rgba(6,162,219,.62);
}

.con17_lock {
  width: 3.4646vw;
  height: auto;
}

.con17_card_title {
  margin-top: calc(100vw * 24.081496 / 1905);
  font-size: calc(var(--px) * 28.0386);
  letter-spacing: calc(100vw * -1.121544 / 1905);
  line-height: calc(100vw * 33.6 / 1905);
  white-space: nowrap;
}

.con17_card_title_line {
  white-space: pre;
}

.con17_card_desc {
  margin-top: calc(100vw * 11.8 / 1905);
  font-size: calc(var(--px) * 16.0221);
  letter-spacing: calc(100vw * -0.640884 / 1905);
  line-height: calc(100vw * 19.2 / 1905);
  color: #0c0c0c;
  white-space: nowrap;
}

.con17_card_desc_line {
  white-space: pre;
}

.con17_call {
  width: 12.7770vw;
  margin-top: calc(100vw * 23.611622 / 1905);
  padding: calc(100vw * 13.153103 / 1905) 0 calc(100vw * 12.813693 / 1905);
  gap: calc(100vw * 3.257486 / 1905);
  border-radius: calc(100vw * 12 / 1905);
  background: #0262c3;
  font-family: "Paperlogy";
}

.con17_call_label {
  font-size: calc(var(--px) * 17.0235);
  letter-spacing: calc(100vw * -0.340470 / 1905);
  line-height: calc(100vw * 20.4 / 1905);
  white-space: pre;
}

.con17_call_number {
  font-size: calc(var(--px) * 26.0483);
  letter-spacing: calc(100vw * -0.520966 / 1905);
  line-height: calc(100vw * 31.2 / 1905);
  white-space: pre;
}


/* CON18: 질문과 답변 — native frame mask and natural-flow FAQ */
.con18 {
  box-sizing: border-box;
  height: calc(var(--px) * 964);
  justify-content: flex-start;
  padding-top: calc(135.0878 / 1905 * 100vw);
  padding-bottom: calc(77.4285 / 1905 * 100vw);
}

.con18::before {
  content: "";
  position: absolute;
  width: 94.3304%;
  top: calc(54.9882 / 1905 * 100vw);
  bottom: calc(31.0118 / 1905 * 100vw);
  border-radius: calc(30 / 1905 * 100vw);
  background: var(--color-pale-blue);
  mask-image: linear-gradient(to bottom,
    rgba(0, 0, 0, 1) calc(0 / 1905 * 100vw),
    rgba(0, 0, 0, 1) calc(325 / 1905 * 100vw),
    rgba(0, 0, 0, 0.9921568627450981) calc(326.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.9921568627450981) calc(351.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.9764705882352941) calc(376.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.9529411764705882) calc(401.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.9215686274509803) calc(426.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.8784313725490196) calc(451.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.8274509803921568) calc(476.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.7568627450980392) calc(501.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.6862745098039216) calc(526.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.596078431372549) calc(551.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.5019607843137255) calc(576.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.4117647058823529) calc(601.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.32941176470588235) calc(626.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.24705882352941178) calc(651.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.1843137254901961) calc(676.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.12549019607843137) calc(701.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.08235294117647059) calc(726.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.050980392156862744) calc(751.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.03137254901960784) calc(776.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.01568627450980392) calc(801.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.00784313725490196) calc(826.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.00392156862745098) calc(851.0117503922702 / 1905 * 100vw),
    rgba(0, 0, 0, 0.00392156862745098) calc(876.0117503922702 / 1905 * 100vw));
}

.con18_title {
  flex-shrink: 0;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 60.0543);
  letter-spacing: calc(100vw * -2.4021736063 / 1905);
  line-height: calc(71.9275 / 1905 * 100vw);
  color: #000;
}

.con18_search {
  flex-shrink: 0;
  justify-content: flex-start;
  width: 32.3348%;
  box-sizing: border-box;
  margin-top: calc(23.6224 / 1905 * 100vw);
  padding: calc(15.3623 / 1905 * 100vw) calc(26.4893 / 1905 * 100vw) calc(19.4563 / 1905 * 100vw) calc(45.1684 / 1905 * 100vw);
  border: 1px solid #cde4ed;
  border-radius: calc(21 / 1905 * 100vw);
  background: #fff;
}

.con18_search_input {
  flex-grow: 1;
  min-width: 0;
  width: 0;
  margin-top: calc(5.5002 / 1905 * 100vw);
  font-size: calc(var(--px) * 18.9771);
  letter-spacing: calc(100vw * -0.9488538110 / 1905);
  line-height: calc(26.0252 / 1905 * 100vw);
  color: #191818;
}

.con18_search_input::placeholder {
  color: #828080;
  opacity: 1;
}

.con18_search_input::-webkit-search-cancel-button {
  display: none;
}

.con18_search_input:focus {
  outline: none;
}

.con18_search_icon {
  width: calc(34 / 1905 * 100vw);
  aspect-ratio: 1;
  fill: none;
  stroke: var(--color-point);
  stroke-width: 3.5;
  stroke-linecap: round;
}

.con18_list {
  flex-grow: 1;
  min-height: 0;
  justify-content: flex-start;
  align-items: stretch;
  width: 75.5378%;
  margin-top: calc(44.5231 / 1905 * 100vw);
  border-block: 1px solid #191818;
}

.con18_item {
  flex-shrink: 0;
  justify-content: flex-start;
  align-items: stretch;
  width: 100%;
}

.con18_item + .con18_item {
  border-top: 1px solid rgba(25, 24, 24, .1490196);
}

.con18_question_heading {
  width: 100%;
}

.con18_question {
  justify-content: flex-start;
  box-sizing: border-box;
  width: 100%;
  padding: calc(7.2397 / 1905 * 100vw) calc(104.2234 / 1905 * 100vw) calc(4.9219 / 1905 * 100vw) calc(81.9915 / 1905 * 100vw);
}

.con18_question_text {
  overflow-wrap: anywhere;
  font-size: calc(var(--px) * 17.0221);
  letter-spacing: calc(100vw * -0.8511037751 / 1905);
  line-height: calc(24 / 1905 * 100vw);
  color: #191818;
  flex-grow: 1;
  margin-left: calc(38.1467 / 1905 * 100vw);
  margin-top: calc(-1.6211 / 1905 * 100vw);
  text-align: left;
}

.con18_toggle {
  flex-shrink: 0;
  width: calc(40.7809 / 1905 * 100vw);
  aspect-ratio: 1;
  border-radius: 50%;
  background: #fff;
}

.con18_chevron {
  width: calc(13 / 1905 * 100vw);
  aspect-ratio: 13 / 8;
  fill: none;
  stroke: var(--color-point);
  stroke-width: 1;
}

.con18_question[aria-expanded="true"] .con18_chevron {
  transform: rotate(180deg);
}

.con18_badge {
  flex-shrink: 0;
  width: calc(47 / 1905 * 100vw);
  padding-block: calc(3.4506 / 1905 * 100vw);
  border-radius: 50vw;
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 15.0195);
  letter-spacing: calc(100vw * -0.7509752161 / 1905);
  line-height: calc(21.0805 / 1905 * 100vw);
}

.con18_badge_q {
  margin-top: calc(-1.2489 / 1905 * 100vw);
  background: var(--color-point);
  outline: 1px solid #efefef;
}

.con18_badge_a {
  outline: 1px solid var(--color-point);
}

.con18_answer {
  justify-content: flex-start;
  align-items: stretch;
  box-sizing: border-box;
  width: 100%;
  border-top: 1px solid rgba(25, 24, 24, .1490196);
}

.con18_answer[hidden] {
  display: none;
}

.con18_answer_inner {
  justify-content: flex-start;
  align-items: flex-start;
  box-sizing: border-box;
  width: 100%;
  height: calc(var(--px) * 132 - (1px - var(--px)) * 10);
  padding: calc(11.0724 / 1905 * 100vw) calc(104.2234 / 1905 * 100vw) calc(11.0724 / 1905 * 100vw) calc(81.9915 / 1905 * 100vw);
  overflow-y: auto;
  overflow-x: hidden;
}

.con18_answer_inner::-webkit-scrollbar {
  width: calc(var(--px) * 6);
}

.con18_answer_inner::-webkit-scrollbar-track {
  background: #cde4ed;
  border-radius: 50vw;
}

.con18_answer_inner::-webkit-scrollbar-thumb {
  background: var(--color-point);
  border-radius: 50vw;
}

.con18_answer_inner::-webkit-scrollbar-thumb:hover {
  background: var(--color-navy);
}

@supports not selector(::-webkit-scrollbar) {
  .con18_answer_inner {
    scrollbar-width: thin;
    scrollbar-color: var(--color-point) #cde4ed;
  }
}

.con18_answer_text {
  overflow-wrap: anywhere;
  font-size: calc(var(--px) * 17.0221);
  letter-spacing: calc(100vw * -0.8511037751 / 1905);
  line-height: calc(24 / 1905 * 100vw);
  color: #191818;
  margin-left: calc(38.1467 / 1905 * 100vw);
  margin-top: calc(2.8046 / 1905 * 100vw);
}

.con18_item:nth-child(2) .con18_question {
  padding-top: calc(5.2972 / 1905 * 100vw);
  padding-bottom: calc(3.8644 / 1905 * 100vw);
}
.con18_item:nth-child(2) .con18_badge_q { margin-top: calc(-7.2489 / 1905 * 100vw); }
.con18_item:nth-child(3) .con18_question {
  padding-top: calc(6.3547 / 1905 * 100vw);
  padding-bottom: calc(5.8069 / 1905 * 100vw);
}
.con18_item:nth-child(3) .con18_question_text { margin-top: calc(-.5521 / 1905 * 100vw); }
.con18_item:nth-child(4) .con18_question {
  padding-top: calc(4.4122 / 1905 * 100vw);
  padding-bottom: calc(3.8183 / 1905 * 100vw);
}
.con18_item:nth-child(4) .con18_question_text { margin-top: calc(.5169 / 1905 * 100vw); }
.con18_item:nth-child(4) .con18_badge_q { margin-top: calc(-3.2489 / 1905 * 100vw); }
.con18_item:nth-child(5) .con18_question {
  padding-top: calc(6.4008 / 1905 * 100vw);
  padding-bottom: calc(5.7608 / 1905 * 100vw);
}
.con18_item:nth-child(5) .con18_question_text { margin-top: calc(1.5859 / 1905 * 100vw); }
.con18_item:nth-child(6) .con18_question {
  padding-top: calc(6.4583 / 1905 * 100vw);
  padding-bottom: calc(5.7033 / 1905 * 100vw);
}
.con18_item:nth-child(6) .con18_question_text { margin-top: calc(-1.3451 / 1905 * 100vw); }
.con18_item:nth-child(6) .con18_badge_q { margin-top: calc(-3.2489 / 1905 * 100vw); }

.con18_pager {
  flex-shrink: 0;
  margin-top: calc(49.0883 / 1905 * 100vw);
  gap: calc(var(--px) * 8);
}

.con18_page_control {
  box-sizing: border-box;
  flex-shrink: 0;
  width: calc(var(--px) * 40.7809);
  height: calc(var(--px) * 40.7809);
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
}

.con18_arrow {
  background: #fff;
  color: var(--color-point);
  border-color: #cde4ed;
}

.con18_arrow_disabled {
  opacity: .35;
}

.con18_arrow_icon {
  width: calc(var(--px) * 8);
  aspect-ratio: 8 / 13;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
}

a.con18_page_control:hover {
  background: var(--color-point);
  color: #fff;
  border-color: var(--color-point);
}

a.con18_page_control:focus-visible {
  background: var(--color-point);
  color: #fff;
  border-color: var(--color-point);
}

.con18_page {
  font-size: calc(var(--px) * 15.0195);
  letter-spacing: 0;
  line-height: calc(20 / 1905 * 100vw);
  color: #191818;
}

a.con18_page {
  font-weight: 300;
}

.con18_empty {
  flex-grow: 1;
  min-height: 0;
  font-size: calc(var(--px) * 17.0221);
  letter-spacing: calc(100vw * -0.8511037751 / 1905);
  line-height: calc(24 / 1905 * 100vw);
  color: #191818;
  padding-block: calc(54.5 / 1905 * 100vw);
}

/* CON19: 전국 매장 안내 — 게시판 목록과 지도 슬롯 */
.con19 {
  justify-content: flex-start;
  padding-top: calc(100vw * 52.298647 / 1905);
  padding-bottom: calc(100vw * 113.394961 / 1905);
  background: linear-gradient(to bottom, #fff 0 calc(100vw * 59 / 1905), var(--color-pale-blue) calc(100vw * 59 / 1905) 100%);
}
.con19_heading { box-sizing: border-box; width: 100%; padding-right: calc(var(--px) * 4); justify-content: flex-start; }
.con19_en {
  font-family: "Paperlogy";
  font-weight: 800;
  font-size: calc(var(--px) * 150);
  letter-spacing: calc(100vw * -6 / 1905);
  line-height: calc(100vw * 180 / 1905);
  color: #fff;
}
.con19_title {
  margin-top: calc(100vw * -51.514522 / 1905);
  font-family: "Paperlogy";
  font-weight: 800;
  font-size: calc(var(--px) * 59.939563);
  letter-spacing: calc(100vw * -2.3975825175 / 1905);
  line-height: calc(100vw * 71.927476 / 1905);
  color: #000;
}
.con19_search {
  box-sizing: border-box;
  width: calc(100vw * 615.978655 / 1905);
  height: calc(100vw * 70.972577 / 1905);
  margin-top: calc(100vw * 40.802198 / 1905);
  justify-content: space-between;
  border: 1px solid #cde4ed;
  border-radius: calc(var(--px) * 21);
  background: #fff;
  z-index: 2;
}
.con19_search:focus-within {
  box-shadow: 0 0 calc(var(--px) * 54) #0f4a7740, 0 0 calc(var(--px) * 18) #06a2db2b;
}
.con19_search_input {
  width: 100%;
  min-width: 0;
  padding-left: calc(100vw * 45.489327 / 1905);
  font-weight: 500;
  font-size: calc(var(--px) * 19.041306);
  letter-spacing: calc(100vw * -0.95206529805 / 1905);
  line-height: calc(100vw * 26.081850 / 1905);
  color: #828080;
}
.con19_search_input::placeholder { color: #828080; opacity: 1; }
.con19_search_btn {
  flex-shrink: 0;
  width: calc(var(--px) * 34);
  height: calc(var(--px) * 34);
  margin-right: calc(100vw * 27.489327 / 1905);
  color: var(--color-point);
}
.con19_search_icon { width: 100%; }
.con19_frame {
  width: calc(var(--px) * 1600);
  margin-top: calc(100vw * -34.881336 / 1905);
  justify-content: flex-start;
  align-items: stretch;
  border-radius: calc(var(--px) * 21);
  box-shadow: inset 0 0 0 1px #cde4ed;
  overflow: hidden;
  background: #fff;
}
.con19_list {
  width: calc(var(--px) * 370);
  height: calc(var(--px) * 665);
  overflow-y: auto;
  overscroll-behavior: contain;
  flex-shrink: 0;
  justify-content: flex-start;
  align-items: stretch;
}
.con19_store {
  box-sizing: border-box;
  width: 100%;
  flex-shrink: 0;
  justify-content: flex-start;
  align-items: stretch;
  padding-top: 2vw;
  padding-right: 0;
  padding-bottom: 2vw;
  padding-left: 2.3vw;
  border-bottom: 1px solid #cde4ed;
}
.con19_store:first-child { /* padding-top: calc(100vw * 48.996736 / 1905); */ }
.con19_list::-webkit-scrollbar { width: calc(var(--px) * 12); }
.con19_list::-webkit-scrollbar-track {
  margin-block: calc(var(--px) * 21);
  border-radius: calc(var(--px) * 10);
  background: transparent;
}
.con19_list::-webkit-scrollbar-thumb {
  border: calc(var(--px) * 4) solid transparent;
  border-radius: calc(var(--px) * 12);
  background: #9fc8d5;
  background-clip: padding-box;
}
.con19_list::-webkit-scrollbar-thumb:hover {
  background-color: var(--color-point);
}
@supports not selector(::-webkit-scrollbar) {
  .con19_list { scrollbar-width: thin; scrollbar-color: #9fc8d5 transparent; }
}
.con19_store_name {
  font-size: calc(var(--px) * 22);
  font-weight: 600;
  letter-spacing: calc(100vw * -1.1 / 1905);
  line-height: calc(100vw * 26.4 / 1905);
  color: #000;
}
.con19_store_info {
  font-size: calc(var(--px) * 17.010446);
  font-weight: 300;
  letter-spacing: calc(100vw * -0.850522302 / 1905);
  line-height: calc(100vw * 25.174866 / 1905);
  color: #000;
}
.con19_store_address { margin-top: calc(100vw * 16.362065 / 1905); }
.con19_store_tel { margin-top: calc(100vw * -1.174866 / 1905); }
.con19_store_actions {
  width: 100%;
  height: calc(var(--px) * 40);
  justify-content: flex-start;
  margin-top: calc(100vw * 1.815217 / 1905);
}
.con19_naver {
  width: calc(var(--px) * 135);
  height: calc(var(--px) * 29);
  margin-top: calc(var(--px) * 5);
  gap: calc(var(--px) * 7);
  border-radius: calc(var(--px) * 5);
  background: #03cd5c;
}
.con19_naver_icon {
  width: calc(var(--px) * 14);
  aspect-ratio: 14 / 12;
  flex-shrink: 0;
}
.con19_naver_text {
  font-size: calc(var(--px) * 14);
  font-weight: 600;
  letter-spacing: calc(100vw * -0.42 / 1905);
  line-height: calc(100vw * 16.923563 / 1905);
  color: #fff;
  white-space: nowrap;
}
.con19_more {
  right: 1.3vw;
  bottom: 1.3vw;
  width: calc(var(--px) * 40);
  height: calc(var(--px) * 40);
  border-radius: 50%;
  background: #efefef;
  color: #000;
}
.con19_more_icon { width: calc(var(--px) * 15); }
.con19_map {
  width: calc(var(--px) * 1230);
  height: calc(var(--px) * 665);
  background: #e8edf1;
  flex-shrink: 0;
  justify-content: flex-start;
}
.con19_noshop {
  box-sizing: border-box;
  padding: calc(var(--px) * 40);
  font-size: calc(var(--px) * 16);
  color: #828080;
  text-align: center;
}
.con19_popup {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(0, 0, 0, .4);
  font-family: "Pretendard Variable";
  line-height: 1.5;
  color: #222;
}
.con19_dialog {
  box-sizing: border-box;
  width: calc(var(--px) * 760);
  height: auto;
  min-height: calc(var(--px) * 360);
  max-height: 90vh;
  overflow-y: auto;
  overscroll-behavior: contain;
  justify-content: flex-start;
  align-items: stretch;
  border-radius: calc(var(--px) * 20);
  background: #fff;
}
.con19_popup_photo {
  width: calc(var(--px) * 340);
  flex-shrink: 0;
  background: var(--color-pale-blue);
}
.con19_popup_image { width: 100%; height: auto; }
.con19_popup_placeholder {
  gap: calc(var(--px) * 16);
  font-size: calc(var(--px) * 16);
  color: #6a8995;
}
.con19_popup_placeholder_icon { width: calc(var(--px) * 48); }
.con19_popup_info {
  box-sizing: border-box;
  flex: 1;
  min-width: 0;
  justify-content: center;
  align-items: stretch;
  padding: calc(var(--px) * 40);
}
.con19_popup_close {
  top: calc(var(--px) * 14);
  right: calc(var(--px) * 20);
  z-index: 1;
  width: calc(var(--px) * 34);
  height: calc(var(--px) * 34);
  font-family: inherit;
  font-size: calc(var(--px) * 30);
  line-height: 1;
  color: inherit;
  border: 0;
  background: transparent;
}
.con19_popup_name {
  font-family: inherit;
  font-size: calc(var(--px) * 28);
  font-weight: 700;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.con19_popup_line {
  width: calc(var(--px) * 40);
  height: calc(var(--px) * 3);
  margin: 1vw 0;
  background: var(--color-point);
}
.con19_popup_detail {
  margin-top: .6vw;
  font-size: calc(var(--px) * 16);
  color: #555;
  overflow-wrap: anywhere;
}
.con19_popup_label { font-weight: 600; }
.con19_popup_naver {
  width: calc(var(--px) * 135);
  height: calc(var(--px) * 29);
  margin-top: 1.2vw;
  border-radius: calc(var(--px) * 5);
  background: #03cd5c;
  color: #fff;
  font-size: calc(var(--px) * 14);
  font-weight: 600;
}

/* CON20: 창업 문의 */
.con20 {
  width: 100%;
  justify-content: flex-start;
  padding-top: calc(100vw * 105 / 1905);
  padding-bottom: calc(100vw * 129.013028 / 1905);
  background: var(--color-point);
}
.con20_logo_wrap { width: calc(100vw * 121 / 1905); }
.con20_logo { width: 100%; }
.con20_title {
  font-family: "Paperlogy";
  font-size: calc(var(--px) * 60.0543);
  letter-spacing: calc(100vw * -2.402172 / 1905);
  line-height: calc(100vw * 72.06516 / 1905);
  margin-top: calc(100vw * 14.480127 / 1905);
  white-space: pre;
}
.con20_form {
  width: calc(100vw * 1443.011539 / 1905);
  justify-content: flex-start;
  margin-top: calc(100vw * 23.441686 / 1905);
  padding-top: calc(100vw * 64.852859 / 1905);
  padding-bottom: calc(100vw * 43.986972 / 1905);
  background: #fff;
  border-radius: calc(100vw * 25 / 1905);
}
.con20_fields { width: calc(100vw * 893 / 1905); justify-content: flex-start; }
.con20_row { width: 100%; justify-content: space-between; align-items: flex-start; }
.con20_field { width: calc(100vw * 432.994626 / 1905); justify-content: flex-start; align-items: flex-start; gap: calc(100vw * 13.398603 / 1905); }
.con20_label {
  font-size: calc(var(--px) * 18.0115);
  letter-spacing: calc(100vw * -0.900575 / 1905);
  line-height: calc(100vw * 21.6 / 1905);
  color: #000;
}
.con20_phone .con20_label { font-size: calc(var(--px) * 18.0022); letter-spacing: calc(100vw * -0.900110 / 1905); }
.con20_inflow .con20_label { font-size: calc(var(--px) * 17.9920); letter-spacing: calc(100vw * -0.899600 / 1905); }
.con20_control {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  border: 1px solid #cde4ed;
  border-radius: calc(100vw * 12 / 1905);
  background: #fff;
  color: #000;
  font-size: calc(var(--px) * 16.0111);
  letter-spacing: calc(100vw * -0.800555 / 1905);
  line-height: calc(100vw * 19.2 / 1905);
}
.con20_control::placeholder { color: #878787; opacity: 1; }
/* 브라우저 기본 검은 포커스 링 대신 유입경로 버튼의 빛 테두리와 같은 모양.
   색은 실측값 — .con20_form 의 data-light="card ice" 가 --light-tint 를 상속시켜
   폼 안 빛은 cool 이 아니라 ice(링 #ABF1FF = ice .85, 글로우 가장 진한 곳 #E5FBFF) 다. */
.con20_control:focus {
  outline: 1px solid rgba(var(--light-ice), .85);
  outline-offset: calc(var(--px) * 5);
  box-shadow: 0 0 calc(var(--px) * 26) rgba(var(--light-ice), .5);
  transition: box-shadow var(--transition-ui) var(--ease-ui);
}
.con20_name .con20_control { padding: calc(100vw * 14.001397 / 1905) calc(100vw * 31.476571 / 1905) calc(100vw * 14.795762 / 1905); }
.con20_phone .con20_control {
  padding: calc(100vw * 14.094004 / 1905) calc(100vw * 30.465520 / 1905) calc(100vw * 14.703155 / 1905);
  font-size: calc(var(--px) * 16.0029);
  letter-spacing: calc(100vw * -0.800145 / 1905);
}
.con20_location .con20_control { padding: calc(100vw * 14.001397 / 1905) calc(100vw * 30.476571 / 1905) calc(100vw * 14.795762 / 1905); }
.con20_row_second { margin-top: calc(100vw * 37.996624 / 1905); }
.con20_select_wrap { width: 100%; justify-content: flex-start; min-width: 0; }
.con20_select {
  transition: color var(--transition-ui) var(--ease-ui);
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  justify-content: space-between;
  padding: calc(100vw * 14.096980 / 1905) calc(100vw * 31.503090 / 1905) calc(100vw * 14.700179 / 1905) calc(100vw * 30.219925 / 1905);
  border: 1px solid #cde4ed;
  border-radius: calc(100vw * 12 / 1905);
  background: #fff;
  color: #878787;
  font-size: calc(var(--px) * 16.0029);
  letter-spacing: calc(100vw * -0.800145 / 1905);
  line-height: calc(100vw * 19.2 / 1905);
}
.con20_select.is-selected { color: #000; }
.con20_arrow { font-size: calc(var(--px) * 13.1230); letter-spacing: calc(100vw * -0.524920 / 1905); color: #474747; }
.con20_options {
  opacity: 1;
  transition: opacity var(--transition-panel) var(--ease-ui), display var(--transition-panel) allow-discrete;
  box-sizing: border-box;
  width: 100%;
  top: calc(100% + 100vw * 6 / 1905);
  padding: calc(100vw * 8 / 1905);
  max-height: calc(100vw * 264 / 1905);
  overflow-y: auto;
  z-index: 1;
  background: #fff;
  border: 1px solid #cde4ed;
  border-radius: calc(100vw * 12 / 1905);
}
.con20_options[hidden] { display: none; opacity: 0; }

@starting-style {
  .con20_options:not([hidden]) { opacity: 0; }
}
.con20_option {
  transition: background-color var(--transition-ui) var(--ease-ui);
  padding: calc(100vw * 11.4 / 1905) calc(100vw * 14 / 1905);
  font-size: calc(var(--px) * 16.0111);
  letter-spacing: calc(100vw * -0.800555 / 1905);
  line-height: calc(100vw * 19.2 / 1905);
  color: #000;
  cursor: pointer;
}
.con20_option:focus { background: var(--color-pale-blue); }
.con20_option[aria-selected="true"] { background: var(--color-pale-blue); }
.con20_message {
  width: calc(100vw * 891.929022 / 1905);
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: calc(100vw * 31.991397 / 1905);
  gap: calc(100vw * 12.400023 / 1905);
}
.con20_message .con20_control { height: calc(100vw * 99.994319 / 1905); padding: calc(100vw * 14.999977 / 1905) calc(100vw * 29.956326 / 1905); resize: vertical; }
.con20_consent {
  width: calc(100% - 100vw * 2.488341 / 1905);
  justify-content: flex-start;
  margin-top: calc(100vw * 23.910436 / 1905);
  margin-left: calc(100vw * 2.488341 / 1905);
  gap: calc(100vw * 10.611999 / 1905);
}
.con20_check {
  appearance: none;
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: calc(100vw * 18.835985 / 1905);
  height: calc(100vw * 18.954463 / 1905);
  border: 1px solid #cde4ed;
  border-radius: 50%;
  color: var(--color-point);
  font-size: calc(var(--px) * 17.4303);
  letter-spacing: calc(100vw * -0.697212 / 1905);
  line-height: calc(100vw * 19.2 / 1905);
  cursor: pointer;
}
.con20_check::before {
  content: "✓";
  opacity: 0;
  transition: opacity var(--transition-ui) var(--ease-ui);
}
.con20_check:checked::before { opacity: 1; }
.con20_consent_text { font-size: calc(var(--px) * 15.8647); letter-spacing: calc(100vw * -0.634588 / 1905); line-height: calc(100vw * 19.2 / 1905); color: #000; white-space: nowrap; }
.con20_policy { text-decoration: underline; }
.con20_agree_label { cursor: pointer; }
.con20_submit {
  box-sizing: border-box;
  width: calc(100vw * 247 / 1905);
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: calc(100vw * 42.302443 / 1905);
  padding: calc(100vw * 20 / 1905) calc(100vw * 70.556733 / 1905) calc(100vw * 21 / 1905) calc(100vw * 63 / 1905);
  gap: calc(100vw * 16.802642 / 1905);
  border: 0;
  border-radius: 50vw;
  background: var(--light-layer, none) center / 100% 100% no-repeat, url('/images/con20_03.png') center / 100% 100% no-repeat;
  transition: none;
}
.con20_submit:disabled { cursor: wait; background-image: url('/images/con20_03.png'); }
.con20_icon_wrap { width: calc(100vw * 24 / 1905); flex-shrink: 0; }
.con20_icon { width: 100%; }
.con20_submit_text { margin-top: calc(100vw * 0.321238 / 1905); font-size: calc(var(--px) * 22.0304); letter-spacing: calc(100vw * -0.881216 / 1905); line-height: calc(100vw * 26.4 / 1905); white-space: pre; }
.con20_status { margin-top: calc(100vw * 21 / 1905); font-size: calc(var(--px) * 16.0111); letter-spacing: calc(100vw * -0.800555 / 1905); line-height: calc(100vw * 19.2 / 1905); color: #000; }
.con20_status[hidden] { display: none; }

/* ===== CON02 인증서 스티커 필링(peel) — 아래 끝이 들렸다 붙는다 (con02-r02) =====
   같은 이미지 2겹을 접힘선(--fold) 기준으로 나눈다. 위는 바닥에 붙은 채(peel-main),
   아래는 거울처럼 뒤집어(peel-flap) 들린 것처럼 보인다. --peel 하나만 움직이면 끝.
   기본값 0 = 완전히 붙은 상태 = 원본 시안과 동일 → JS 가 죽어도 인증서는 멀쩡히 보인다. */
.con02_cert_peel {
  --peel: 0;                                          /* 0=붙음 ~ 1=떼짐 (GSAP 가 스크롤로 제어) */
  --fold: calc((1 - var(--peel)) * 100%);             /* 접힘선 y (아래→위) */
  --tilt: -5deg;                                      /* 들렸을 때 기울기. 붙으면 수평 */
  position: relative;
  width: 100%;
  height: 100%;
  transform: rotate(calc(var(--peel) * var(--tilt)));
  transform-origin: 50% 6%;                           /* 위쪽(붙은 쪽) 축 → 아래 끝이 들린다 */
}

.con02_cert_peel .peel-main,
.con02_cert_peel .peel-flap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.con02_cert_peel .peel-main img,
.con02_cert_peel .peel-flap img {
  display: block;
}

/* 바닥에 붙은 부분 (접힘선 위) */
.con02_cert_peel .peel-main {
  clip-path: inset(0 0 calc(100% - var(--fold)) 0);
}

/* 떼져 말린 부분 (접힘선 아래 → 뒤집어 위로 접힘). top 반사 공식은 부호 그대로 둘 것 */
.con02_cert_peel .peel-flap {
  clip-path: inset(var(--fold) 0 0 0);
  transform: scaleY(-1);
  top: calc(2 * var(--fold) - 100%);
}

/* 뒷면 = 종이 뒤라 색이 빠진다 */
.con02_cert_peel .peel-flap img {
  filter: grayscale(1) brightness(1.18) contrast(0.86);
}