@charset "utf-8";
/* ==========================================================================
   돌핀 견적문의 — 랜딩 전용 스타일
   전역 리셋 없음. 모든 규칙은 .dlp-land 안에서만 적용됩니다.
   사이트 헤더가 고정(fixed)이면 index.php 의 --dlp-head 값을 실제 높이로.
   ========================================================================== */

/* ==========================================================================
   관리자 내용 버튼 안보이게
   ========================================================================== */
.btn_admin{
	position: fixed;
	left:20px;
	bottom:10px;
	outline: none;
	color: #fff;
	text-decoration: none;
	}

.dlp-land{
  --deep:#05122E;
  --deep-2:#0B2050;
  --dolphin:#003399;
  --lift:#3667C5;
  --line:#C9D4E2;
  --wash:#F2F5F9;
  --muted:#5B6B82;
  --lamp:#FFB000;
  --ok:#1D8A5B;

  --shell:1180px;        /* 본문 컨테이너 폭 — 테마 값에 맞춰 조정 */
  --rail:340px;          /* 우측 문의 폼 폭 */
  --rail-top:150px;      /* 우측 문의 폼이 헤더 아래로 내려오는 거리. 타이틀 높이를 감안한 값 */

  /* 서체 — 테마 기본 서체를 덮어씁니다 */
  --dp-font:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,
            system-ui,"Apple SD Gothic Neo","Malgun Gothic","맑은 고딕",
            "Noto Sans KR",sans-serif;
  font-family:var(--dp-font);
  --gap:40px;            /* 본문과 폼 사이 간격 */

  color:var(--deep);
  font-size:17px;
  line-height:1.75;
  word-break:keep-all;
  -webkit-font-smoothing:antialiased;
}
@media(min-width:860px){.dlp-land{font-size:18px}}

/* 테마 CSS 가 태그별로 서체를 지정해 둔 경우를 덮습니다 */
.dlp-land, .dlp-land *,
.dlp-rail, .dlp-rail *,
.dlp-sheet, .dlp-sheet *,
.dlp-dock, .dlp-dock *{font-family:var(--dp-font)}

.dlp-land h2,.dlp-land h3{margin:0;line-height:1.25;letter-spacing:-.03em;font-weight:800}
.dlp-land p{margin:0}
.dlp-land a{color:inherit}
.dlp-land :focus-visible{outline:3px solid var(--lamp);outline-offset:3px}

/* ---------- 섹션 공통 ---------- */
.dlp-sec{
  position:relative;
  padding:56px 0;
  scroll-snap-align:start;
  scroll-margin-top:calc(var(--dlp-head) + var(--dlp-gap, 0px));
  min-height:calc(100dvh - var(--dlp-head));   /* 채우되 내용이 길면 늘어남 → 잘리지 않음 */
  /* 내용을 위로 붙입니다. 가운데 정렬하면 항목이 적을 때 위아래가 모두 비어 보입니다.
     내용이 늘어나면 자연스럽게 아래로 채워집니다. */
  display:flex;align-items:flex-start;
}
@media(min-width:860px){.dlp-sec{padding:76px 0}}
.dlp-sec--wash{background:var(--wash)}
.dlp-sec--deep{background:var(--deep-2);color:#fff}
.dlp-sec--dark{background:var(--deep);color:#fff}

.dlp-shell{width:100%;max-width:var(--shell);margin:0 auto;padding:0 22px}

/* 우측 폼이 붙는 섹션은 그 폭만큼 자리를 미리 비워 둠 (표시·숨김 시 본문이 밀리지 않게) */
@media(min-width:1200px){
  .dlp-sec--rail .dlp-shell{padding-right:calc(var(--rail) + var(--gap) + 22px)}
}

.dlp-head{max-width:26em;margin-bottom:32px}
.dlp-head h2{font-size:clamp(25px,5.6vw,38px);margin-bottom:14px}
.dlp-head p{color:var(--muted);font-size:16.5px}
.dlp-sec--deep .dlp-head p,.dlp-sec--dark .dlp-head p{color:#B4C6E2}

/* ---------- 버튼 ---------- */
.dlp-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:16px 26px;border-radius:10px;text-decoration:none;
  font-weight:700;font-size:17px;border:2px solid transparent;cursor:pointer;
  font-family:inherit;transition:background .16s,border-color .16s;
}
.dlp-btn--solid{background:var(--lamp);color:#22180A}
.dlp-btn--solid:hover{background:#FFC33D}
.dlp-btn--line{border-color:#4A6796;color:#fff;background:transparent}
.dlp-btn--line:hover{border-color:#9FB6DC}
/* 밝은 배경 위에서는 색을 뒤집습니다 */
.dlp-sec--wash .dlp-btn--line,
.dlp-sec:not(.dlp-sec--deep):not(.dlp-sec--dark) .dlp-btn--line{
  border-color:var(--deep);color:var(--deep);background:#fff;
}
.dlp-sec--wash .dlp-btn--line:hover,
.dlp-sec:not(.dlp-sec--deep):not(.dlp-sec--dark) .dlp-btn--line:hover{
  background:var(--deep);color:#fff;
}
.dlp-btn--navy{background:var(--dolphin);color:#fff;font-size:17px;padding:16px}
.dlp-btn--navy:hover{background:#00287A}

/* ---------- ② 제품 특징 ---------- */
.dlp-merits{border-top:2px solid var(--deep);width:100%}
.dlp-merit{
  display:grid;grid-template-columns:44px 1fr;gap:16px;
  padding:22px 0;border-bottom:1px solid var(--line);align-items:start;
}
@media(min-width:860px){
  .dlp-merit{grid-template-columns:52px 1fr 1.05fr;gap:24px;align-items:baseline;padding:24px 0}
}
/* 우측 폼이 붙어도 가로 배열(아이콘 / 제목 / 설명)을 유지합니다 */
@media(min-width:1200px){
  .dlp-sec--rail .dlp-merit{grid-template-columns:48px 210px 1fr;gap:20px}
}
.dlp-merit-ico{color:var(--dolphin);padding-top:3px}
.dlp-merit h3{font-size:19.5px;margin-bottom:6px}
@media(min-width:860px){.dlp-merit h3{font-size:21px;margin-bottom:0}}
.dlp-merit p{color:var(--muted);font-size:16px;line-height:1.7}
.dlp-merit-note{grid-column:1/-1;margin-top:2px;font-size:14.5px;color:var(--dolphin);font-weight:600}
@media(min-width:860px){.dlp-merit-note{grid-column:2/-1}}

/* ---------- 실적 배지 (⑤ 견적 문의 좌측) ---------- */
.dlp-badges{display:flex;flex-wrap:wrap;gap:9px;margin-top:26px}
.dlp-badge{border:1px solid var(--line);border-radius:999px;padding:7px 15px;
  font-size:13.5px;color:var(--muted);font-weight:600}

/* ---------- 제품 체크리스트 ---------- */
/* 제목줄 : 좌측 제목 · 우측 전체영상 버튼 */
.dlp-head--row{max-width:none;display:flex;flex-wrap:wrap;align-items:flex-end;
  justify-content:space-between;gap:18px}
.dlp-head--row > div{max-width:30em}

.dlp-ytbtn{
  display:inline-flex;align-items:center;gap:8px;
  padding:11px 18px;border-radius:999px;
  border:1.5px solid var(--line);background:#fff;color:var(--deep);
  font-family:inherit;font-size:14.5px;font-weight:700;letter-spacing:-.02em;
  cursor:pointer;transition:border-color .16s,background .16s;
}
.dlp-ytbtn:hover{border-color:var(--deep)}
.dlp-ytbtn__ico{
  display:inline-flex;align-items:center;justify-content:center;
  width:20px;height:20px;border-radius:50%;
  background:var(--dolphin);color:#fff;font-size:9px;padding-left:2px;
}
@media(max-width:859px){
  .dlp-head--row{align-items:flex-start;flex-direction:column;gap:14px}
}

/* 항목 : 좌측 썸네일 · 우측 (제목 → 설명 → 답)
   제목이 넓은 쪽에 놓여 길어도 한 줄에 들어갑니다. */
.dlp-checks{border-top:2px solid var(--deep);width:100%}
.dlp-check{padding:22px 0;border-bottom:1px solid var(--line);display:grid;gap:14px}
@media(min-width:860px){
  .dlp-check{grid-template-columns:300px 1fr;column-gap:34px;align-items:start;padding:26px 0}
  /* 썸네일도 영상도 없는 항목은 글이 가로 전체를 씁니다 */
  .dlp-check:not(.has-media){grid-template-columns:1fr}
}
@media(min-width:1200px){
  .dlp-sec--rail .dlp-check{grid-template-columns:260px 1fr;column-gap:26px}
  .dlp-sec--rail .dlp-check:not(.has-media){grid-template-columns:1fr}
}
.dlp-check-q{display:flex;align-items:baseline;gap:10px;margin-bottom:16px}
.dlp-check-q b{font-size:19px;font-weight:800;color:var(--dolphin);letter-spacing:.01em;flex:none;
  font-variant-numeric:tabular-nums;line-height:1.1}
.dlp-check-q h3{font-size:18.5px;letter-spacing:-.025em}
.dlp-check-r p{color:var(--muted);font-size:16px;line-height:1.7}
.dlp-check-a{color:var(--deep)!important;font-weight:700;margin-top:4px!important}
.dlp-check-a:before{content:'→ ';color:var(--dolphin)}

/* 썸네일 */
.dlp-thumb{
  display:block;width:100%;max-width:340px;padding:0;border:0;cursor:pointer;
  position:relative;border-radius:10px;overflow:hidden;
  background:var(--deep);aspect-ratio:16/9;font-family:inherit;
}
.dlp-thumb img{width:100%;height:100%;object-fit:cover;display:block;opacity:.88;transition:opacity .2s,transform .3s}
.dlp-thumb:hover img{opacity:1;transform:scale(1.03)}
/* 영상 없이 이미지만 있는 경우 — 재생 배지는 없지만 눌러서 크게 볼 수 있습니다 */
.dlp-thumb--still img{opacity:1}

.dlp-thumb__play{
  position:absolute;left:10px;bottom:10px;
  display:inline-flex;align-items:center;gap:7px;
  padding:7px 13px;border-radius:999px;
  background:rgba(5,18,46,.82);color:#fff;
  font-size:13.5px;font-weight:700;letter-spacing:-.02em;
}
.dlp-thumb__play i{
  display:inline-flex;align-items:center;justify-content:center;
  width:17px;height:17px;border-radius:50%;
  background:var(--lamp);color:#22180A;font-size:8px;font-style:normal;padding-left:2px;
}

/* ---------- 도입 절차 · 걱정 해소 ---------- */
.dlp-steps{list-style:none;margin:0 0 40px;padding:0;display:grid;gap:14px;width:100%}
@media(min-width:860px){.dlp-steps{grid-template-columns:repeat(3,1fr);gap:22px}}
.dlp-steps li{border-top:2px solid var(--deep);padding-top:14px}
.dlp-steps b{display:block;font-size:13px;font-weight:700;color:var(--dolphin);letter-spacing:.06em;margin-bottom:5px}
.dlp-steps strong{display:block;font-size:18px;font-weight:800;letter-spacing:-.025em;margin-bottom:5px}
.dlp-steps span{display:block;color:var(--muted);font-size:15.5px;line-height:1.65}
.dlp-worry{border:1px solid var(--line);border-radius:12px;padding:24px;background:#fff;width:100%}
.dlp-worry h3{font-size:18px;margin-bottom:14px}
.dlp-worry ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.dlp-worry li{font-size:16px;line-height:1.7;color:var(--muted);padding-left:16px;position:relative}
.dlp-worry li:before{content:'';position:absolute;left:0;top:11px;width:6px;height:6px;border-radius:50%;background:var(--dolphin)}
.dlp-worry li b{color:var(--deep);font-weight:700}
.dlp-worry-note{margin-top:16px;font-size:13px;color:#8A97A8}

/* ---------- ③ 계산기 (자리만 유지 · 내용은 추후 수정) ---------- */
.dlp-calc{display:grid;gap:26px;width:100%}
@media(min-width:900px){.dlp-calc{grid-template-columns:1fr 1fr;gap:44px;align-items:start}}
/* 우측 폼이 붙으면 좌우 2단 → 위아래 1단 (입력 위 / 결과 아래) */
@media(min-width:1200px){
  .dlp-sec--rail .dlp-calc{grid-template-columns:1fr;gap:28px;max-width:720px}
}
.dlp-field{margin-bottom:22px}
.dlp-field:last-child{margin-bottom:0}
.dlp-field-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px}
.dlp-field-top label{font-weight:700;font-size:16.5px}
.dlp-field-val{font-weight:800;font-size:19px;color:var(--lamp);font-variant-numeric:tabular-nums}
.dlp-land input[type=range]{width:100%;height:32px;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer;display:block}
.dlp-land input[type=range]::-webkit-slider-runnable-track{height:6px;background:#20386A;border-radius:3px}
.dlp-land input[type=range]::-moz-range-track{height:6px;background:#20386A;border-radius:3px}
.dlp-land input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;border-radius:50%;background:#fff;border:5px solid var(--lamp);margin-top:-11px}
.dlp-land input[type=range]::-moz-range-thumb{width:28px;height:28px;border-radius:50%;background:#fff;border:5px solid var(--lamp)}
.dlp-money{position:relative}
.dlp-money input{
  width:100%;padding:13px 44px 13px 16px;font-size:19px;font-weight:700;
  border:1px solid #2E4874;background:#0A1B42;color:#fff;border-radius:9px;
  font-family:inherit;font-variant-numeric:tabular-nums;
}
.dlp-money span{position:absolute;right:16px;top:50%;transform:translateY(-50%);color:#8AA3CC;font-weight:600}
.dlp-seg{display:flex;gap:8px}
.dlp-seg button{
  flex:1;padding:11px 6px;border-radius:9px;border:1px solid #2E4874;background:transparent;
  color:#B4C6E2;font-family:inherit;font-size:14.5px;font-weight:700;cursor:pointer;line-height:1.35;
}
.dlp-seg button b{display:block;font-size:16px;color:#fff}
.dlp-seg button[aria-pressed=true]{background:var(--lamp);border-color:var(--lamp);color:#5A4104}
.dlp-seg button[aria-pressed=true] b{color:#22180A}

.dlp-readout{background:#020C1F;border:1px solid #22406F;border-radius:14px;padding:26px 24px}
.dlp-rlab{font-size:15px;color:#9FB6DC;font-weight:600}
.dlp-now{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid #22406F}
.dlp-now + .dlp-rlab{margin-top:18px}
.dlp-now span{font-size:14px;color:#8AA3CC;font-weight:600}
.dlp-now b{font-size:20px;font-weight:700;color:#C3D2E8;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.dlp-now em{font-style:normal;font-size:.7em;margin-left:1px}
.dlp-big{
  font-size:clamp(40px,10vw,58px);font-weight:800;color:var(--lamp);
  letter-spacing:-.045em;font-variant-numeric:tabular-nums;line-height:1.1;margin:6px 0 2px;
}
.dlp-big small{font-size:.42em;font-weight:700;letter-spacing:-.02em;margin-left:2px}
.dlp-subfig{font-size:16px;color:#C3D2E8;font-weight:600;font-variant-numeric:tabular-nums}
.dlp-rule{height:1px;background:#22406F;margin:22px 0}
.dlp-pay{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap}
.dlp-paynum{font-size:32px;font-weight:800;color:#fff;font-variant-numeric:tabular-nums;letter-spacing:-.03em}
.dlp-paynum small{font-size:.5em;margin-left:2px}
.dlp-bar{height:9px;background:#132A52;border-radius:5px;margin-top:14px;overflow:hidden}
.dlp-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--lift),var(--lamp));border-radius:5px;width:0;transition:width .4s ease}
.dlp-barlab{display:flex;justify-content:space-between;font-size:13px;color:#8AA3CC;margin-top:8px;font-weight:600}
.dlp-assume{font-size:13.5px;color:#8AA3CC;line-height:1.65;margin-top:18px}
.dlp-assume b{color:#C3D2E8}

/* ---------- ④ 매장 크기별 추천 ---------- */
.dlp-tiers{
  border-top:2px solid var(--deep);width:100%;
  /* 매장 풍경 폭과 높이. 제품 이미지 높이를 여기에 맞춥니다. */
  --place-w:340px;
  --place-h:calc(var(--place-w) * 9 / 16);
}
.dlp-tier{padding:24px 0;border-bottom:1px solid var(--line);display:grid;gap:14px}

@media(min-width:860px){
  .dlp-tier{
    grid-template-columns:340px 1fr;
    column-gap:34px;row-gap:18px;
    align-items:start;padding:28px 0;
  }
  .dlp-tier-size  {grid-column:1;grid-row:1}
  .dlp-tier-desc  {grid-column:2;grid-row:1}
  .dlp-tier-place {grid-column:1;grid-row:2}
  .dlp-tier-models{grid-column:2;grid-row:2}
  /* 매장 사진이 없으면 제품이 가로 전체를 씁니다 */
  .dlp-tier:not(.has-place) .dlp-tier-models{grid-column:1 / -1}
}
@media(min-width:1200px){
  .dlp-sec--rail .dlp-tiers{--place-w:300px}
  .dlp-sec--rail .dlp-tier{grid-template-columns:300px 1fr;column-gap:26px}
}

.dlp-tier-size{font-weight:800;font-size:19px;letter-spacing:-.025em;line-height:1.35}
.dlp-tier-size em{display:block;font-style:normal;font-size:14px;font-weight:600;
  color:var(--muted);letter-spacing:0;margin-top:2px}
.dlp-tier-desc{color:var(--muted);font-size:16px;line-height:1.7}

/* 매장 풍경 — 영상 썸네일과 같은 규격 */
.dlp-tier-place{
  width:100%;max-width:var(--place-w);aspect-ratio:16/9;
  border-radius:10px;overflow:hidden;background:var(--rule);
}
.dlp-tier-place img{width:100%;height:100%;object-fit:cover;display:block}

/* 제품 — 세로형 2:3 */
.dlp-models{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start}
/* 제품 이미지 높이를 좌측 매장 풍경과 같게 맞춥니다 (세로 2:3) */
.dlp-model{width:calc(var(--place-h) * 2 / 3);text-align:center}
.dlp-model__img{
  display:block;width:100%;height:var(--place-h);padding:0;border:0;
  background:transparent;border-radius:8px;overflow:hidden;
}
.dlp-model__img img{width:100%;height:100%;object-fit:contain;display:block}
.dlp-model__name{
  display:block;margin-top:8px;font-size:15px;font-weight:700;
  color:var(--deep);letter-spacing:-.02em;font-variant-numeric:tabular-nums;
}
/* 목록 아래 안내 + 제품소개 버튼 */
.dlp-tier-note{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:16px;margin-top:28px;width:100%;
}
.dlp-tier-note p{color:var(--muted);font-size:16px;line-height:1.7}
.dlp-tier-note .dlp-btn{flex:none;padding:13px 22px;font-size:15.5px}
@media(max-width:559px){
  .dlp-tier-note{flex-direction:column;align-items:stretch;text-align:left}
  .dlp-tier-note .dlp-btn{width:100%}
}

@media(max-width:859px){
  /* 좁은 화면에서는 매장 풍경이 가로를 채우므로 제품은 고정폭으로 */
  .dlp-model{width:130px}
  .dlp-model__img{height:195px}
}
@media(max-width:559px){
  .dlp-models{gap:14px}
  .dlp-model{width:calc(50% - 7px)}
  .dlp-model__img{height:auto;aspect-ratio:2/3}
}

/* ---------- ⑤ 문의 ---------- */
.dlp-formwrap{display:grid;gap:30px;width:100%}
@media(min-width:900px){
  /* 좌우 두 덩어리의 윗선을 맞춥니다. 가운데 정렬하면 높이가 달라 시작선이 어긋납니다. */
  .dlp-formwrap{grid-template-columns:1fr 1.1fr;gap:52px;align-items:start}
}
.dlp-side > :first-child{margin-top:0}
.dlp-side .dlp-head{margin-bottom:30px}
.dlp-side p{color:var(--muted);font-size:16.5px}
.dlp-side > p{margin-top:22px}

/* 전화 안내 박스 */
.dlp-callbox{border:2px solid var(--deep);border-radius:12px;padding:18px 20px;background:#fff}
.dlp-callbox-lab{font-size:14.5px;font-weight:700;color:var(--muted);
  margin-bottom:4px;line-height:1.5;display:block}
.dlp-callbox a{display:block;font-size:clamp(30px,7vw,38px);font-weight:800;
  color:var(--dolphin);text-decoration:none;letter-spacing:-.035em;
  font-variant-numeric:tabular-nums;line-height:1.15;margin:0}

/* ---------- 폼 본체 (자리를 옮겨 다니므로 독립적으로 스타일) ---------- */
.dlp-frm{display:grid;gap:15px}
.dlp-row2{display:grid;gap:15px}
@media(min-width:560px){.dlp-row2{grid-template-columns:1fr 1fr}}
.dlp-f label{display:block;font-weight:700;font-size:14.5px;margin-bottom:6px}
.dlp-f label i{color:#C0392B;font-style:normal;margin-left:2px}
.dlp-f input,.dlp-f select,.dlp-f textarea{
  width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:9px;
  font-family:var(--dp-font);font-size:16px;background:#fff;color:var(--deep);
  line-height:1.4;height:auto;min-height:0;   /* 테마의 height 지정 무력화 */
  -webkit-appearance:none;appearance:none;
  box-shadow:none;vertical-align:middle;
}
/* select 는 화살표가 사라지므로 직접 그립니다 */
.dlp-f select{
  padding-right:38px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%235B6B82' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:12px 8px;
}
.dlp-f input::-ms-clear{display:none}
.dlp-f textarea{min-height:92px;resize:vertical;line-height:1.6}
.dlp-f input:focus,.dlp-f select:focus,.dlp-f textarea:focus{border-color:var(--dolphin);outline:2px solid rgba(0,51,153,.18)}
.dlp-f select:disabled{background:var(--wash);color:var(--muted);cursor:not-allowed}
.dlp-agree{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--muted);line-height:1.6}
.dlp-agree input{width:20px;height:20px;margin-top:2px;flex:none;accent-color:var(--dolphin)}
.dlp-done{display:none;border:2px solid var(--ok);background:#F0FAF5;border-radius:12px;padding:24px;text-align:center}
.dlp-done.is-on{display:block}
.dlp-done h3{color:var(--ok);font-size:21px;margin-bottom:8px}
.dlp-done p{color:var(--muted);font-size:16px}
.dlp-done a{color:var(--dolphin);font-weight:700;text-decoration:none}


/* ==========================================================================
   [ C ] 우측 고정 문의 폼 (PC 1200px 이상)
   문서 안에 폼은 하나뿐이며, 이 컨테이너와 ⑤번 자리 사이를 오갑니다.
   ========================================================================== */
.dlp-rail{display:none}
@media(min-width:1200px){
  .dlp-rail{
    display:block;position:fixed;z-index:50;
    width:var(--rail);
    right:calc(50% - (var(--shell) / 2) + 22px);
    /* 헤더 아래 여백. 더 내리려면 --rail-top 값만 키우십시오. */
    top:calc(var(--dlp-head) + var(--rail-top));
    max-height:calc(100dvh - var(--dlp-head) - var(--rail-top) - 24px);
    /* overscroll-behavior:contain 을 쓰지 않습니다.
       화면에 고정된 요소라 마우스가 그 위에 있을 때 페이지 스크롤을 막아 버립니다. */
    overflow-y:auto;
    background:#fff;border:1px solid var(--line);border-radius:14px;
    box-shadow:0 6px 28px rgba(5,18,46,.10);
    padding:22px 20px;
    opacity:0;visibility:hidden;transform:translateY(8px);
    transition:opacity .25s,transform .25s,visibility .25s;
  }
  .dlp-rail.is-on{opacity:1;visibility:visible;transform:none}
}
.dlp-rail-head{margin-bottom:16px}
.dlp-rail-head strong{display:block;font-size:18px;font-weight:800;letter-spacing:-.025em;color:var(--deep)}
.dlp-rail-head span{display:block;font-size:13.5px;color:var(--muted);margin-top:4px;line-height:1.55}
.dlp-rail-tel{
  display:flex;align-items:center;justify-content:center;gap:10px;
  margin-bottom:16px;padding:11px 14px;border-radius:9px;
  background:var(--wash);text-decoration:none;font-weight:700;color:var(--dolphin);
  font-size:17px;font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}
.dlp-rail-tel span{
  font-size:13px;font-weight:700;color:var(--muted);letter-spacing:0;
}
/* 우측에 들어갔을 때는 2열을 1열로 */
.dlp-rail .dlp-row2{grid-template-columns:1fr}
/* 우측에서는 확장 항목(매장명 · 문의 내용)을 숨김. 하단으로 내려가면 다시 나타남 */
.dlp-rail [data-full]{display:none}

/* ── 우측 폼 전용 : 세로를 줄입니다. 하단 폼은 그대로 둡니다. ─────────────
   작은 노트북(세로 700px 안팎)에서도 스크롤 없이 들어가도록 맞춘 값입니다. */
.dlp-rail{padding:16px 16px 18px}
.dlp-rail .dlp-rail-head{margin-bottom:10px}
.dlp-rail .dlp-rail-head strong{font-size:16.5px}
.dlp-rail .dlp-rail-head span{display:none}   /* 보조 문구는 쓰지 않습니다 */
.dlp-rail .dlp-rail-tel{margin-bottom:11px;padding:7px 12px;font-size:15.5px;gap:8px}
.dlp-rail .dlp-rail-tel span{font-size:12px}
.dlp-rail .dlp-frm{gap:8px}
.dlp-rail .dlp-row2{gap:8px}
.dlp-rail .dlp-f label{font-size:12.5px;margin-bottom:3px}
.dlp-rail .dlp-f input,
.dlp-rail .dlp-f select{padding:7px 11px;font-size:14.5px;border-radius:7px}
.dlp-rail .dlp-f select{padding-right:32px;background-position:right 11px center;background-size:11px 7px}
.dlp-rail .dlp-agree{font-size:11.5px;line-height:1.45;gap:7px;margin-top:2px}
.dlp-rail .dlp-agree input{width:17px;height:17px;margin-top:1px}
.dlp-rail .dlp-btn--navy{padding:11px;font-size:15.5px;margin-top:2px}

/* ==========================================================================
   [ D ] 좌측 섹션 이동 버튼 (900px 이상)
   ========================================================================== */
.dlp-dots{display:none}
@media(min-width:900px){
  .dlp-dots{display:flex;flex-direction:column;gap:14px;
    position:fixed;left:20px;top:50%;transform:translateY(-50%);z-index:50}
}
.dlp-dots button{display:flex;align-items:center;gap:10px;background:none;border:0;padding:2px;cursor:pointer;font-family:inherit}
.dlp-dots i{width:10px;height:10px;border-radius:50%;flex:none;background:#C9D4E2;transition:background .2s,transform .2s}
.dlp-dots span{font-size:12.5px;font-weight:700;color:#5B6B82;white-space:nowrap;opacity:0;transform:translateX(-6px);transition:opacity .2s,transform .2s}
.dlp-dots button:hover span,.dlp-dots button:focus-visible span{opacity:1;transform:none}
.dlp-dots button[aria-current=true] i{background:#FFB000;transform:scale(1.35)}
.dlp-dots button[aria-current=true] span{opacity:1;transform:none;color:#05122E}
/* 어두운 배경 섹션(도입 · 계산기) 위에서는 밝게 */
.dlp-dots.on-dark i{background:rgba(255,255,255,.45)}
.dlp-dots.on-dark span{color:#B4C6E2}
.dlp-dots.on-dark button[aria-current=true] i{background:#FFB000}
.dlp-dots.on-dark button[aria-current=true] span{color:#fff}

/* ==========================================================================
   [ E ] 모바일 하단 바 + 입력폼 시트 (899px 이하)
   ========================================================================== */
.dlp-dock{display:none}
@media(max-width:899px){
  .dlp-dock{
    position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;gap:9px;
    padding:10px 14px calc(10px + env(safe-area-inset-bottom));
    background:rgba(255,255,255,.97);border-top:1px solid #C9D4E2;
    box-shadow:0 -3px 16px rgba(5,18,46,.09);
    transform:translateY(0);transition:transform .25s;
  }
  .dlp-dock.is-off{transform:translateY(110%)}
  .dlp-dock .dlp-btn{flex:1;padding:14px 8px;font-size:16px}
  .dlp-dock .d-call{background:#fff;border-color:#05122E;color:#05122E}
  .dlp-dock .d-ask{background:#003399;color:#fff}
  body{padding-bottom:76px}
}
.dlp-scrim{position:fixed;inset:0;z-index:70;background:rgba(5,18,46,.5);opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}
.dlp-scrim.is-on{opacity:1;visibility:visible}
.dlp-sheet{
  position:fixed;left:0;right:0;bottom:0;z-index:75;
  background:#fff;border-radius:16px 16px 0 0;
  max-height:88dvh;overflow-y:auto;overscroll-behavior:contain;
  padding:18px 18px calc(24px + env(safe-area-inset-bottom));
  transform:translateY(100%);transition:transform .28s ease;
}
.dlp-sheet.is-on{transform:none}
.dlp-sheet-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;position:sticky;top:0;background:#fff;padding:4px 0 10px}
.dlp-sheet-bar strong{font-size:18px;letter-spacing:-.02em;color:#05122E}
.dlp-sheet-bar button{background:none;border:0;font-size:15px;font-weight:700;color:#5B6B82;cursor:pointer;font-family:inherit;padding:6px 4px}
@media(min-width:900px){.dlp-sheet,.dlp-scrim{display:none}}


@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important;scroll-snap-type:none!important}
  *{animation:none!important;transition:none!important}
}