/* 메인 첫 화면 바로 밑(.dept1: Biz DESKERS 큰 배너 + 카드 2장) 모션 — .dept1 에 class "dkm dkm-biz" 추가.
   사진 배경은 장식 층(.dkm-ph)으로 옮겨 움직인다(같은 파일·같은 크기 규칙). 글자·버튼 HTML 은 그대로. */
.dept1.dkm-biz { background-image: none; position: relative; isolation: isolate; }
.dkm-biz .dkm-ph { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.dkm-biz .dkm-ph i { position: absolute; inset: 0; display: block; background: url(/images/main/dept1_bg.webp) center top no-repeat; background-size: 2500px auto;
  transform-origin: 72% 22%; will-change: transform, clip-path; }
.dkm-biz .dkm-edge { position: absolute; top: 0; height: 760px; width: 3px; margin-left: -1.5px; z-index: 1; pointer-events: none; opacity: 0;
  background: linear-gradient(180deg, rgba(0,180,64,0) 0%, #4be38a 18%, #eafff1 50%, #4be38a 82%, rgba(0,180,64,0) 100%);
  box-shadow: 0 0 18px 4px rgba(0, 180, 64, .55), 0 0 60px 14px rgba(0, 180, 64, .22); }
.dkm-biz .dkm-sheen { position: absolute; inset: 0; pointer-events: none; opacity: 0; mix-blend-mode: soft-light;
  background: linear-gradient(105deg, transparent 38%, rgba(255, 255, 255, .95) 50%, transparent 62%) no-repeat; background-size: 250% 100%; }
.dkm-biz > .cont, .dkm-biz > .bnr2 { position: relative; z-index: 2; }
.dkm-biz .dkm-bgc { z-index: 1; }
.dkm-biz .dkm-fxc { z-index: 3; }
/* 제목 밑 초록 빛줄 */
.dkm-biz .bnr1 { position: relative; }
.dkm-biz .bnr1 dd:not(.btn) { position: relative; }
.dkm-biz .dkm-uline { position: absolute; left: 0; top: calc(100% + 12px); height: 4px; border-radius: 4px; pointer-events: none; transform-origin: 0 50%; transform: scaleX(0);
  background: linear-gradient(90deg, #00b440, #4be38a 70%, rgba(75, 227, 138, 0)); box-shadow: 0 0 14px rgba(0, 180, 64, .55); }
/* 버튼: 테두리 도는 빛 + 반짝 */
.dkm-biz dd.btn a { position: relative; overflow: visible; will-change: transform; }
.dkm-biz dd.btn a .dkm-run { border-radius: 50px; }
.dkm-biz dd.btn a .dkm-shine { position: absolute; inset: 0; border-radius: 50px; pointer-events: none; opacity: 0; mix-blend-mode: screen;
  background: linear-gradient(105deg, transparent 38%, rgba(255, 255, 255, .45) 50%, transparent 62%) no-repeat; background-size: 250% 100%; }
/* 카드 2장: 3D 로 날아와 착지, 안쪽 사진 확대→제자리, 테두리 빛, 마우스 기울기 + 반사광 */
.dkm-biz .bnr2 { perspective: 1600px; }
.dkm-biz .bnr2 dl { position: relative; overflow: hidden; transform-style: preserve-3d; will-change: transform, opacity; background-image: none !important; background-color: #1d1f1e; }
.dkm-biz .bnr2 dl > dt, .dkm-biz .bnr2 dl > dd { position: relative; z-index: 2; }
.dkm-biz .dkm-cbg { position: absolute; inset: -2px; z-index: 0; pointer-events: none; background-position: center; background-size: cover; will-change: transform, filter; }
.dkm-biz .bnr2 dl.left .dkm-cbg { background-image: url(/images/main/dept1_bnt2_bg1.webp); }
.dkm-biz .bnr2 dl.right .dkm-cbg { background-image: url(/images/main/dept1_bnt2_bg2.webp); }
.dkm-biz .dkm-cshade { position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(ellipse 80% 70% at 50% 45%, rgba(0, 0, 0, .05), rgba(0, 0, 0, .45)); opacity: 0; }
.dkm-biz .dkm-glare { position: absolute; left: 0; top: 0; width: 900px; height: 900px; margin: -450px 0 0 -450px; z-index: 1; pointer-events: none; opacity: 0; border-radius: 50%;
  background: radial-gradient(circle, rgba(140, 255, 185, .30) 0%, rgba(0, 180, 64, .10) 30%, transparent 62%); mix-blend-mode: screen; }
.dkm-biz .bnr2 dl .dkm-run { z-index: 3; padding: 2px; }
/* 사이트 규칙(.dept1 .bnr2 dl dt span{display:block}, dl span{inline-block})이 글자 조각에 먹지 않게 */
.dkm-biz .bnr2 dl span.dkm-w, .dkm-biz .bnr2 dl span.dkm-ch, .dkm-biz .bnr2 dl span.dkm-wd { display: inline-block; }
.dkm-biz .bnr2 dl .dkm-roll { display: inline-flex; }
.dkm-biz .bnr2 dl .dkm-roll .dkm-strip span { display: block; }
.dkm-biz .bnr2 dl .dkm-run, .dkm-biz .bnr2 dl .dkm-shine, .dkm-biz .bnr2 dl .dkm-cbg, .dkm-biz .bnr2 dl .dkm-cshade, .dkm-biz .bnr2 dl .dkm-glare { display: block; }
.dkm-biz .dkm-num { display: inline-block; color: #6dffa6; text-shadow: 0 0 14px rgba(0, 180, 64, .65); }
@media only screen and (max-width: 1100px) { .dkm-biz .dkm-ph i { background-size: 2200px auto; } }
@media only screen and (max-width: 900px) {
  .dkm-biz .dkm-ph i { background-size: 1200px auto; }
  .dkm-biz .dkm-edge { height: 420px; }
  .dkm-biz > .cont { padding-left: 16px; padding-right: 16px; } /* 폰 글자 좌우 16px 규칙(원래 15px) */
  .dkm-biz .dkm-uline { height: 3px; top: calc(100% + 6px); }
}
/* JS 준비 전 깜빡임 방지(html.dkm-js 는 head 에서 붙이고 3초 뒤 안전 해제) */
html.dkm-js .dkm-biz :is(.bnr1 dt, .bnr1 dd:not(.btn), .bnr1 dd.btn a, .bnr2 dl) { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
  html.dkm-js .dkm-biz :is(.bnr1 dt, .bnr1 dd:not(.btn), .bnr1 dd.btn a, .bnr2 dl) { opacity: 1; }
  .dkm-biz .dkm-edge, .dkm-biz .dkm-sheen, .dkm-biz .dkm-glare { display: none; }
}
