/* 통합 마케팅 기획 — 어두운 중앙 무대 바로 아래 「한 장의 표」 보고서 액자(무대에 반쯤 걸침), 원칙 격자, 손님 순서별 채널 묶음, 검은 합계 카드.
   쪽만의 모션 = 무대의 3D 아이콘 떠 있기(nl.css) 하나 */
.pg-imc .im-hero{padding-bottom:200px}
.pg-imc .im-hero .nl-crumb{color:rgba(255,255,255,.7)}

/* 한 장의 표: 어두운 무대에 위 절반이 걸친다 */
.pg-imc .im-rep{position:relative;margin-top:-150px;padding-bottom:40px;background:linear-gradient(180deg,transparent 0 150px,#fff 150px)}
.pg-imc .im-rep .nl-frame{max-width:1040px;margin:0 auto;box-shadow:0 4px 8px rgba(0,20,60,.05),0 60px 120px -50px rgba(0,0,0,.55)}
.pg-imc .im-rep .nl-cap{max-width:1040px;margin:14px auto 0}
.pg-imc .im-in{padding:30px 34px 28px}
.pg-imc .im-hd{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.pg-imc .im-hd b{display:block;font-size:22px;font-weight:800;letter-spacing:-.05em}
.pg-imc .im-hd span{display:block;margin-top:4px;font-size:14.5px;color:var(--body)}
.pg-imc .im-hd em{flex:none;font-style:normal;font-size:12px;font-weight:700;padding:5px 10px;border-radius:999px;background:var(--soft);color:var(--body)}
.pg-imc .im-tb{width:100%;margin-top:22px;border-collapse:collapse;font-size:15px;text-align:left}
.pg-imc .im-tb th,.pg-imc .im-tb td{padding:15px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.pg-imc .im-tb thead th{padding-top:0;font-size:13px;font-weight:700;color:var(--body)}
.pg-imc .im-tb tbody th{font-weight:700;white-space:nowrap}
.pg-imc .im-tb :where(th,td):first-child{padding-left:0;width:96px}
.pg-imc .im-tb :where(th,td):nth-child(3),.pg-imc .im-tb :where(th,td):nth-child(4){width:24%}
.pg-imc .im-tb :where(th,td):last-child{padding-right:0;text-align:right;width:80px}
.pg-imc .im-tb s{display:block;height:12px;border-radius:6px;background:#edf0f3;text-decoration:none;overflow:hidden}
.pg-imc .im-tb s::before{content:"";display:block;height:100%;width:var(--w);border-radius:6px;background:#b0b8c1}
.pg-imc .im-tb td:nth-child(4) s::before{background:linear-gradient(90deg,#9cc6ff,var(--blue))}
.pg-imc .im-st{display:inline-block;padding:4px 9px;border-radius:7px;background:var(--soft);font-size:12.5px;font-weight:700;color:var(--body);white-space:nowrap}
.pg-imc .im-k{display:inline-block;padding:5px 11px;border-radius:999px;background:var(--soft);font-size:13px;font-weight:700;color:var(--body);white-space:nowrap}
.pg-imc .im-k.up{background:var(--blue);color:#fff}
.pg-imc .im-k.dn{background:var(--ink);color:#fff}
.pg-imc .im-sum{display:flex;align-items:center;gap:10px;margin-top:22px;padding:16px 18px;border-radius:12px;background:var(--bsoft);font-size:15.5px;font-weight:600}
.pg-imc .im-sum .ic{width:20px;height:20px;color:var(--blue)}
.pg-imc .im-sum b{color:var(--blue2)}

/* 원칙 격자: 3D 아이콘 크기 */
.pg-imc .nl-grid.g4 .nl-it img{width:64px;height:64px}
.pg-imc .nl-grid.g4 .nl-it h3{font-size:24px}

/* 손님 순서별 채널 묶음 */
.pg-imc .im-way{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:56px;counter-reset:w}
.pg-imc .im-way li{position:relative;padding:28px 24px;border-radius:20px;background:#fff;border:1px solid var(--line)}
.pg-imc .im-way li:not(:last-child)::after{content:"";position:absolute;z-index:1;top:50%;right:-13px;width:10px;height:10px;border-top:2px solid var(--blue);border-right:2px solid var(--blue);transform:translateY(-50%) rotate(45deg)}
.pg-imc .im-way small{font-size:13px;font-weight:800;color:var(--blue2)}
.pg-imc .im-way p{margin-top:12px;min-height:3em;font-size:18px;font-weight:800;line-height:1.45;letter-spacing:-.05em}
.pg-imc .im-way .nl-chips a{padding:6px 11px;border-radius:8px;background:var(--bsoft);font-size:13px;font-weight:700;color:var(--blue2);white-space:nowrap}
@media (hover:hover){.pg-imc .im-way .nl-chips a:hover{background:var(--blue);color:#fff}}
.pg-imc .im-way li.end{background:var(--ink);border-color:var(--ink);color:#fff}
.pg-imc .im-way li.end small{color:var(--sky)}
.pg-imc .im-way li.end .nl-chips span{background:rgba(255,255,255,.12);color:#fff}

/* 검은 합계 카드 */
.pg-imc .im-calc label{display:flex;gap:14px;align-items:flex-start;margin-top:14px;padding:16px 18px;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);cursor:pointer}
.pg-imc .im-calc h3+label{margin-top:26px}
.pg-imc .im-calc input{flex:none;width:20px;height:20px;margin-top:2px;accent-color:var(--blue)}
.pg-imc .im-calc label b{display:block;font-size:16px}
.pg-imc .im-calc label em{display:block;margin-top:4px;font-style:normal;font-size:13.5px;line-height:1.55;color:rgba(255,255,255,.75)}
.pg-imc .im-calc label:has(input:checked){border-color:var(--blue);background:rgba(49,130,246,.16)}
.pg-imc .im-tot{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:24px;padding-top:20px;border-top:1px dashed rgba(255,255,255,.3)}
.pg-imc .im-tot span{font-size:14px;color:rgba(255,255,255,.75)}
.pg-imc .im-tot b{font-size:clamp(26px,1.4vw + 18px,36px);font-weight:900;letter-spacing:-.04em;font-variant-numeric:tabular-nums}

/* 부탁 한 줄 */
.pg-imc .im-call{display:flex;gap:16px;align-items:flex-start;margin-top:20px;padding:26px 28px;border-radius:20px;background:#fff;border:1px solid var(--line);font-size:16px;line-height:1.8;color:var(--body)}
.pg-imc .im-call .ic{width:24px;height:24px;margin-top:3px;color:var(--blue)}
.pg-imc .im-call b{color:var(--ink)}

@media (max-width:900px){
  .pg-imc .im-hero{padding-bottom:150px}
  .pg-imc .im-rep{margin-top:-110px;background:linear-gradient(180deg,transparent 0 110px,#fff 110px)}
  .pg-imc .im-way{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pg-imc .im-way li::after{display:none}
}
@media (max-width:600px){
  .pg-imc .im-in{padding:18px 14px}
  .pg-imc .im-hd b{font-size:18px}
  .pg-imc .im-tb{font-size:13.5px}
  .pg-imc .im-tb th,.pg-imc .im-tb td{padding:12px 5px}
  .pg-imc .im-tb :where(th,td):first-child{display:none}
  .pg-imc .im-tb :where(th,td):nth-child(2){padding-left:0}
  .pg-imc .im-tb tbody th{white-space:normal;width:30%}
  .pg-imc .im-tb :where(th,td):last-child{width:auto}
  .pg-imc .im-k{padding:4px 8px;font-size:12px}
  .pg-imc .im-way{grid-template-columns:1fr}
  .pg-imc .im-way p{min-height:0}
  .pg-imc .im-call{padding:20px 18px}
}
.pg-imc .im-rep .nl-cap{color:var(--body)}
.pg-imc .nl-crumb .crumb{color:inherit;margin:0}
/* 첫 화면 안에 「한 장의 표」가 걸치게 */
@media (min-width:901px){.pg-imc .im-hero{padding-top:52px}.pg-imc .im-hero .nl-3d{width:112px;margin-bottom:14px}.pg-imc .im-hero .nl-btns{margin-top:30px}}

/* 첫 화면 — 어두운 좌우, 오른쪽 3D 아이콘을 채널 네 칸이 둘러쌈 */
.pg-imc .im-orbit{position:relative;height:380px;border-radius:50%;max-width:420px;width:100%;margin:0 auto;border:1px dashed rgba(255,255,255,.22)}
.pg-imc .im-hero .im-orbit .nl-3d{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:150px;margin:0}
.pg-imc .im-orbit span{position:absolute;padding:10px 14px;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);font-size:13px;font-weight:700;color:#fff;white-space:nowrap}
.pg-imc .im-orbit span b{display:block;font-size:11.5px;font-weight:600;color:var(--sky,#9cc7ff)}
.pg-imc .im-orbit .o1{left:50%;top:-18px;transform:translateX(-50%)}
.pg-imc .im-orbit .o2{right:-30px;top:44%}
.pg-imc .im-orbit .o3{left:50%;bottom:-18px;transform:translateX(-50%)}
.pg-imc .im-orbit .o4{left:-30px;top:44%;background:var(--blue);border-color:var(--blue)}
@media (max-width:900px){.pg-imc .im-orbit{display:none}}
@media (min-width:901px){.pg-imc .im-hero.split h1{font-size:clamp(34px,1.6vw + 22px,48px)}.pg-imc .im-hero.split{padding-bottom:230px}.pg-imc .im-hero.split .nl-w{grid-template-columns:1.1fr .9fr}}
