@charset "utf-8";
/* 2026-10 개편: 에이전틱 커머스·AI 소프트웨어 인프라 페이지와 홈 신규 섹션 공통 스타일 (rn- 접두어) */
.rn{--rn-ink:#0f141b; --rn-ink2:#3a4250; --rn-muted:#6b7480; --rn-line:#e4e7ec; --rn-soft:#f4f6f8; --rn-night:#0b1118; --rn-brand:#00acee; color:var(--rn-ink); word-break:keep-all;}
.rn *{box-sizing:border-box;}
.rn a{text-decoration:none;}
.rn .rn-wrap{width:92%; max-width:1200px; margin:0 auto;}
.rn .rn-sec{padding:120px 0;}
.rn .rn-sec.soft{background-color:var(--rn-soft);}
.rn .rn-eyebrow{font-size:15px; font-weight:700; letter-spacing:.01em; color:var(--rn-brand);}
.rn .rn-title{margin-top:16px; font-size:44px; font-weight:500; line-height:1.25; letter-spacing:-.02em; color:var(--rn-ink);}
.rn .rn-lead{max-width:720px; margin-top:20px; font-size:18px; font-weight:400; line-height:1.7; color:var(--rn-ink2);}
#container.rn > .top_visual{display:none;}
#container.rn{padding-top:80px;}
@media screen and (max-width:1399px){ #container.rn{padding-top:60px;} } /* 2026-11-01 헤더가 1399px 이하에서 60px(header_style.css)이라 맞춤: 전에는 첫 영역 위에 20px 틈 */
.rn .rn-head{display:flex; justify-content:space-between; align-items:flex-end; gap:32px; flex-wrap:wrap;}

/* 버튼 */
.rn .rn-btn{display:inline-flex; align-items:center; gap:10px; height:48px; padding:0 22px; border-radius:999px; font-size:15px; font-weight:600; line-height:1; transition:background-color .2s, color .2s;}
.rn .rn-btn span{transition:transform .2s;}
.rn .rn-btn:hover span{transform:translateX(4px);}
.rn .rn-btn.primary{background-color:var(--rn-brand); color:#fff;}
.rn .rn-btn.primary:hover{background-color:#0098d4;}
.rn .rn-btn.line{border:1px solid var(--rn-ink); color:var(--rn-ink);}
.rn .rn-btn.line:hover{background-color:var(--rn-ink); color:#fff;}
.rn .rn-btn.ghost{border:1px solid rgba(255,255,255,.4); color:#fff;}
.rn .rn-btn.ghost:hover{background-color:rgba(255,255,255,.1);}

/* 페이지 머리 */
.rn .rn-hero{position:relative; overflow:hidden; padding:120px 0 100px; background-color:var(--rn-night); color:#fff;}
.rn .rn-hero:before{content:""; position:absolute; inset:0; background:radial-gradient(55% 70% at 85% 10%, rgba(0,172,238,.25), transparent 70%), linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px) 0 0/64px 64px, linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px) 0 0/64px 64px; pointer-events:none;}
.rn .rn-hero .rn-wrap{position:relative;}
.rn .rn-hero .kicker{font-size:16px; font-weight:500; color:rgba(255,255,255,.7);}
.rn .rn-hero h2, .rn .rn-hero h1{margin-top:16px; font-size:64px; font-weight:700; line-height:1.1; letter-spacing:-.03em; color:#fff;}
.rn .rn-hero p.sub{max-width:720px; margin-top:28px; font-size:20px; line-height:1.6; color:rgba(255,255,255,.82);}
.rn .rn-hero .cta{display:flex; flex-wrap:wrap; gap:12px; margin-top:40px;}

/* 세 번째 전환 */
.rn .rn-shift{display:grid; grid-template-columns:repeat(3,1fr); margin-top:64px; border-top:1px solid var(--rn-ink);}
.rn .rn-shift > div{padding:32px 32px 8px 0; border-right:1px solid var(--rn-line);}
.rn .rn-shift > div + div{padding-left:32px;}
.rn .rn-shift > div:last-child{border-right:0;}
.rn .rn-shift .no{display:block; font-size:60px; font-weight:200; line-height:1; color:#c9cfd6;}
.rn .rn-shift .yr{margin-top:24px; font-size:14px; color:var(--rn-muted);}
.rn .rn-shift h3{margin-top:6px; font-size:24px; font-weight:600; color:var(--rn-ink);}
.rn .rn-shift p.desc{margin-top:12px; font-size:15px; line-height:1.7; color:var(--rn-ink2);}
.rn .rn-shift .now .no, .rn .rn-shift .now h3{color:var(--rn-brand);}

/* 5대 제품 지도 */
.rn .rn-stages{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:64px;}
.rn .rn-stages div{padding-bottom:14px; border-bottom:2px solid var(--rn-ink); font-size:13px; font-weight:700; letter-spacing:.08em; color:var(--rn-muted);}
.rn .rn-stages div i{margin-left:6px; font-style:normal; letter-spacing:0; color:var(--rn-ink);}
.rn .rn-board{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:16px;}
.rn .rn-card{display:flex; flex-direction:column; min-height:220px; padding:28px; border:1px solid var(--rn-line); border-radius:16px; background-color:#fff; color:var(--rn-ink); transition:border-color .25s, transform .25s, box-shadow .25s;}
/* 2026-11-01 둥근 모서리·마우스오버는 누르는 카드에만. 마우스오버: 파란 테두리 + 6px 위로 + 그림자 + "살펴보기 →" 파랑·화살표 이동 */
a.rn-card:hover, a.rn-card:focus-visible{border-color:var(--rn-brand); transform:translateY(-6px); box-shadow:0 24px 48px -24px rgba(0,120,170,.45); outline:none;}
a.rn-card:hover .more, a.rn-card:focus-visible .more{color:var(--rn-brand);}
.rn .rn-card .more span{display:inline-block; transition:transform .25s;}
a.rn-card:hover .more span, a.rn-card:focus-visible .more span{transform:translateX(6px);}
.rn .rn-card .tag{font-size:12px; font-weight:700; letter-spacing:.04em; color:var(--rn-brand);}
.rn .rn-card h3{margin-top:10px; font-size:26px; font-weight:700; letter-spacing:-.02em; color:inherit;}
.rn .rn-card p{flex:1; margin-top:12px; font-size:15px; line-height:1.65; color:var(--rn-ink2);}
.rn .rn-card .note{margin-top:12px; padding-top:12px; border-top:1px dashed var(--rn-line); font-size:13px; color:var(--rn-muted);}
.rn .rn-card .more{margin-top:20px; font-size:14px; font-weight:700;}
.rn .rn-board .rn-card{scroll-margin-top:110px;} /* 상단 메뉴에서 제품으로 바로 갈 때 고정 헤더에 가리지 않게 */
.rn .rn-card.geo{grid-column:1/2; grid-row:1;}
.rn .rn-card.disc{grid-column:2/3; grid-row:1;}
.rn .rn-card.foundry{grid-column:1/2; grid-row:2; background:linear-gradient(180deg, #fff, #f1f5f9);}
.rn .rn-card.x2bee{grid-column:3/4; grid-row:1/3; border-color:#0a6fb5; background:linear-gradient(160deg, #0b5ea3 0%, #0a87d0 100%); color:#fff;} /* 2026-11-01 커머스 코어 플랫폼: 파란 바탕으로 다른 제품과 구분 */
.rn .rn-card.x2bee .tag{color:#bfeaff;}
.rn .rn-card.x2bee p{color:rgba(255,255,255,.85);}
a.rn-card.x2bee:hover, a.rn-card.x2bee:focus-visible{border-color:#8fdcf8; box-shadow:0 24px 48px -20px rgba(11,94,163,.6);}
a.rn-card.x2bee:hover .more, a.rn-card.x2bee:focus-visible .more{color:#fff;}
.rn .rn-card.xgen{grid-column:4/5; grid-row:1/3; border-color:var(--rn-night); background-color:var(--rn-night); color:#fff;}
.rn .rn-card.xgen p{color:rgba(255,255,255,.75);}
.rn .rn-card.xgen .note{border-color:rgba(255,255,255,.18); color:rgba(255,255,255,.6);}
a.rn-card.xgen:hover{border-color:var(--rn-brand);}
.rn .rn-card.gelatto{grid-column:2/3; grid-row:2;}
.rn .rn-card.groobee{grid-column:1/5; flex-direction:row; align-items:center; gap:24px; min-height:auto; padding:22px 28px; background:linear-gradient(90deg, #fff, #eaf7fd);}
.rn .rn-card.groobee h3{margin:0; font-size:22px;}
.rn .rn-card.groobee p{margin:0;}
.rn .rn-card.groobee .more{margin:0;}

/* 숫자 */
.rn .rn-nums{display:grid; grid-template-columns:repeat(3,1fr); margin-top:56px; border-top:1px solid var(--rn-line);}
.rn .rn-nums div{padding:32px 24px 0 0;}
.rn .rn-nums strong{display:block; font-size:56px; font-weight:600; line-height:1.1; letter-spacing:-.03em; color:var(--rn-ink);} /* 2026-11-03 영문 검수 화면 깨짐: 단위(small)가 없는 영문은 물려받은 줄 높이 22px로 숫자가 아래 글자와 겹쳤다 */
.rn .rn-nums strong small{margin-left:4px; font-size:22px; font-weight:500;}
.rn .rn-nums span{display:block; margin-top:8px; font-size:15px; color:var(--rn-muted);}
.rn .rn-basis{margin-top:24px; font-size:13px; color:var(--rn-muted);}

/* AI 소프트웨어 인프라 띠 */
.rn .rn-band{display:grid; grid-template-columns:1.1fr 1fr; gap:48px; align-items:center; padding:56px; border-radius:24px; background-color:var(--rn-soft);}
.rn .rn-band h2{margin-top:12px; font-size:34px; font-weight:600; letter-spacing:-.02em; color:var(--rn-ink);}
.rn .rn-band p{font-size:16px; line-height:1.75; color:var(--rn-ink2);}
.rn .rn-chips{display:flex; flex-wrap:wrap; gap:8px; margin:20px 0 28px;}
.rn .rn-chips span{padding:7px 12px; border:1px solid var(--rn-line); border-radius:999px; background-color:#fff; font-size:13px; font-weight:500; color:var(--rn-ink);}

/* 네 갈래 (AI 소프트웨어 인프라 페이지) */
.rn .rn-areas{display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:56px;}
.rn .rn-areas{column-gap:40px; row-gap:40px;}
/* 2026-11-01 누르지 않는 카드(div)는 정보 묶음: 각진 모서리, 상자 없이 위쪽 구분선 */
.rn div.rn-card{min-height:auto; padding:24px 0 0; border:0; border-top:1px solid var(--rn-ink); border-radius:0; background:none;}
.rn .rn-areas .rn-card{min-height:auto;}
.rn .rn-areas .rn-card ul{margin-top:14px; padding:0; list-style:none;}
.rn .rn-areas .rn-card li{position:relative; padding-left:14px; font-size:15px; line-height:1.9; color:var(--rn-ink2);}
.rn .rn-areas .rn-card li:before{content:""; position:absolute; top:13px; left:0; width:5px; height:5px; border-radius:50%; background-color:var(--rn-brand);}

/* 문의 띠 */
.rn .rn-contact{padding:120px 0; background:radial-gradient(50% 80% at 50% 120%, rgba(0,172,238,.35), transparent 70%), var(--rn-night); color:#fff; text-align:center;}
.rn .rn-contact h2{font-size:52px; font-weight:600; line-height:1.15; letter-spacing:-.03em; color:#fff;}
.rn .rn-contact p{margin-top:20px; font-size:18px; color:rgba(255,255,255,.75);}
.rn .rn-contact .cta{display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:40px;}

@media screen and (max-width:1023px){
.rn .rn-stages{display:none;}
.rn .rn-board{grid-template-columns:repeat(2,1fr);}
.rn .rn-card.geo, .rn .rn-card.disc, .rn .rn-card.foundry, .rn .rn-card.x2bee, .rn .rn-card.xgen, .rn .rn-card.gelatto{grid-column:auto; grid-row:auto;}
.rn .rn-card.groobee{grid-column:1/-1;}
.rn .rn-card.geo{order:1;} .rn .rn-card.disc{order:2;} .rn .rn-card.foundry{order:3;} .rn .rn-card.gelatto{order:4;} .rn .rn-card.x2bee{order:5;} .rn .rn-card.xgen{order:6;} .rn .rn-card.groobee{order:7;}
}
@media screen and (max-width:859px){
.rn .rn-sec{padding:80px 0;}
.rn .rn-title{font-size:30px;}
.rn .rn-lead{font-size:16px;}
.rn .rn-hero{padding:120px 0 72px;}
.rn .rn-hero h2, .rn .rn-hero h1{font-size:40px;}
.rn .rn-hero p.sub{font-size:17px;}
.rn .rn-shift{grid-template-columns:1fr;}
.rn .rn-shift > div, .rn .rn-shift > div + div{padding:28px 0; border-right:0; border-bottom:1px solid var(--rn-line);}
.rn .rn-board, .rn .rn-areas{grid-template-columns:1fr;}
.rn .rn-card.groobee{flex-direction:column; align-items:flex-start; gap:12px;}
.rn .rn-nums{grid-template-columns:1fr;}
.rn .rn-nums strong{font-size:44px;}
.rn .rn-band{grid-template-columns:1fr; gap:24px; padding:32px 24px;}
.rn .rn-band h2{font-size:26px;}
.rn .rn-contact{padding:80px 0;}
.rn .rn-contact h2{font-size:32px;}
.rn .rn-hero .rn-btn, .rn .rn-contact .rn-btn{flex:1 1 auto; justify-content:center;}
}

/* 홈 4개 영역 (에이전틱 커머스 · Commerce AX Engineering · AI 소프트웨어 인프라 · XGEN·AI Labs) */
.rn .rn-feat{padding:120px 0; background-color:#fff;}
.rn .rn-feat.soft{background-color:var(--rn-soft);}
.rn .rn-feat.dark{background-color:var(--rn-night); color:#fff;}
.rn .rn-feat-grid{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center;}
.rn .rn-feat-title{margin-top:16px; font-size:40px; font-weight:600; line-height:1.25; letter-spacing:-.02em; color:var(--rn-ink);}
.rn .rn-feat.dark .rn-feat-title{color:#fff;}
.rn .rn-feat-lead{margin-top:20px; font-size:17px; line-height:1.75; color:var(--rn-ink2);}
.rn .rn-feat.dark .rn-feat-lead{color:rgba(255,255,255,.75);}
.rn .rn-feat-cta{display:flex; flex-wrap:wrap; gap:12px; margin-top:32px;}
.rn .rn-feat .rn-chips{margin:24px 0 0;}
.rn .rn-steps{margin:0; padding:0; list-style:none; border-top:1px solid rgba(255,255,255,.16);}
.rn .rn-steps li{display:flex; justify-content:space-between; align-items:center; gap:16px; padding:22px 4px; border-bottom:1px solid rgba(255,255,255,.16);}
.rn .rn-steps b{font-size:18px; font-weight:600; color:#fff;}
.rn .rn-steps span{font-size:17px; font-weight:500; color:var(--rn-brand);}
.rn .rn-steps li.all b{color:rgba(255,255,255,.7); font-weight:500;}
.rn .rn-tiles{display:grid; gap:0; border-top:1px solid var(--rn-ink);} /* 2026-11-01 정보 묶음: 상자 대신 줄 목록 */
.rn .rn-tile{padding:18px 0; border-bottom:1px solid var(--rn-line);}
.rn .rn-tile b{display:block; font-size:18px; font-weight:700; color:var(--rn-ink);}
.rn .rn-tile span{display:block; margin-top:6px; font-size:15px; line-height:1.6; color:var(--rn-ink2);}
.rn .rn-lab{padding:40px; border-radius:0; background-color:rgba(255,255,255,.06);} /* 2026-11-01 정보 판: 각진 면 */
.rn .rn-lab-name{font-size:15px; font-weight:700; letter-spacing:.01em; color:var(--rn-brand);}
.rn .rn-lab-motto{margin-top:10px; font-size:28px; font-weight:600; color:#fff;}
.rn .rn-lab-desc{margin-top:10px; font-size:15px; line-height:1.7; color:rgba(255,255,255,.72);}
.rn .rn-lab-nums{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:28px;}
.rn .rn-lab-nums strong{display:block; font-size:44px; font-weight:600; line-height:1; color:#fff;}
.rn .rn-lab-nums span{display:block; margin-top:8px; font-size:13px; line-height:1.4; color:rgba(255,255,255,.65);}
.rn .rn-lab-basis{margin:16px 0 24px; font-size:12px; color:rgba(255,255,255,.45);}
@media screen and (max-width:1023px){
.rn .rn-feat-grid{grid-template-columns:1fr; gap:40px;}
}
@media screen and (max-width:859px){
.rn .rn-feat{padding:72px 0;}
.rn .rn-feat-title{font-size:28px;}
.rn .rn-feat-lead{font-size:16px;}
.rn .rn-feat-cta .rn-btn{flex:1 1 auto; justify-content:center;}
.rn .rn-steps b{font-size:16px;} .rn .rn-steps span{font-size:15px;}
.rn .rn-tile{padding:20px;}
.rn .rn-lab{padding:28px 20px;}
.rn .rn-lab-motto{font-size:22px;}
.rn .rn-lab-nums strong{font-size:34px;}
}

/* 홈 하단(고객·뉴스룸·문의 띠)을 위 영역과 같은 체계로 — 기존 고객 탭·뉴스 슬라이드 기능은 그대로 */
.main_wrap.hm{padding:0 !important; overflow:visible; background-color:#fff;}
.main_wrap.hm .con_align{position:relative; width:92%; max-width:1200px; margin:0 auto;}
.hm .hm-head{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap; margin-bottom:40px; text-align:left;}
.hm .hm-eyebrow{font-size:15px; font-weight:700; letter-spacing:.01em; color:#00acee;}
.hm .hm-title{margin-top:16px; font-size:40px; font-weight:600; line-height:1.25; letter-spacing:-.02em; color:#0f141b;}
.hm .hm-more{font-size:15px; font-weight:600; color:#0f141b; white-space:nowrap;}
.hm .hm-more:hover{color:#00acee;}

/* 고객 */
.main_wrap.hm .main_customer{margin:0 !important; padding:120px 0 !important; border-radius:0 !important; background:#f4f6f8 !important;}

/* 뉴스룸 */
.main_wrap.hm .main_news{margin:0 !important; padding:120px 0 !important; border-radius:0 !important; background:#fff !important;}

/* 문의 띠 */
.hm .hm-cta{padding:120px 0; background:radial-gradient(50% 80% at 50% 120%, rgba(0,172,238,.35), transparent 70%), #0b1118; text-align:center;}
.hm .hm-cta-in{width:92%; max-width:1200px; margin:0 auto;}
.hm .hm-cta h3{font-size:44px; font-weight:600; line-height:1.2; letter-spacing:-.03em; color:#fff;}
.hm .hm-cta-btns{display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:36px;}
.hm .hm-btn{display:inline-flex; align-items:center; gap:10px; height:48px; padding:0 24px; border-radius:999px; font-size:15px; font-weight:600; line-height:1;}
.hm .hm-btn.primary{background-color:#00acee; color:#fff;}
.hm .hm-btn.primary:hover{background-color:#0098d4;}
.hm .hm-btn.ghost{border:1px solid rgba(255,255,255,.4); color:#fff;}
.hm .hm-btn.ghost:hover{background-color:rgba(255,255,255,.1);}

/* 바닥글: 헤더와 같은 남흑색 */
footer{background:#13181f !important; border-top:1px solid rgba(248,249,251,.08);}

@media screen and (max-width:859px){
.hm .hm-title{font-size:28px;}
.hm .hm-head{margin-bottom:28px;}
.main_wrap.hm .main_customer, .main_wrap.hm .main_news{padding:72px 0 !important;}
.hm .hm-cta{padding:72px 0;}
.hm .hm-cta h3{font-size:28px;}
.hm .hm-btn{flex:1 1 auto; justify-content:center;}
}

/* 홈 숫자 6개 (hm-stats): 칸 너비·구분선·글자 기준선 통일, 마우스를 올리면 위쪽 파란 선이 자라고 숫자가 파랗게 */
.rn .hm-stats{display:grid; grid-template-columns:repeat(6,1fr); margin:56px 0 0; padding:0; list-style:none; border-top:1px solid var(--rn-line); border-bottom:1px solid var(--rn-line);}
.rn .hm-stats li{position:relative; display:flex; flex-direction:column; padding:32px 24px 30px; border-left:1px solid var(--rn-line); transition:background-color .3s ease;}
.rn .hm-stats li:first-child{border-left:0; padding-left:4px;}
.rn .hm-stats li:before{content:""; position:absolute; top:-1px; left:0; right:0; height:3px; background:var(--rn-brand); transform:scaleX(0); transform-origin:left center; transition:transform .35s ease;}
.rn .hm-stats strong{display:flex; align-items:baseline; gap:2px; height:52px; color:var(--rn-ink); transition:color .3s ease, transform .3s ease;}
.rn .hm-stats strong b{font-size:44px; font-weight:700; line-height:1; letter-spacing:-.03em;}
.rn .hm-stats strong small{margin-left:2px; font-size:18px; font-weight:600; color:var(--rn-ink2);}
.rn .hm-stats strong .plus{align-self:flex-start; margin-top:8px; font-size:22px; font-style:normal; font-weight:700; color:var(--rn-brand);}
.rn .hm-stats span{margin-top:14px; font-size:15px; font-weight:600; line-height:1.4; color:var(--rn-ink);}
.rn .hm-stats em{margin-top:6px; font-size:13px; font-style:normal; line-height:1.4; color:var(--rn-muted);}
@media (hover:hover){
.rn .hm-stats li:hover{background-color:var(--rn-soft);}
.rn .hm-stats li:hover:before{transform:scaleX(1);}
.rn .hm-stats li:hover strong{color:var(--rn-brand); transform:translateY(-4px);}
}
@media screen and (max-width:1199px){
.rn .hm-stats{grid-template-columns:repeat(3,1fr);}
.rn .hm-stats li:nth-child(4){border-left:0; padding-left:4px;}
.rn .hm-stats li:nth-child(n+4){border-top:1px solid var(--rn-line);}
}
@media screen and (max-width:859px){
.rn .hm-stats{grid-template-columns:repeat(2,1fr); margin-top:36px;}
.rn .hm-stats li{padding:24px 0 22px 16px;}
.rn .hm-stats li:nth-child(odd){border-left:0; padding-left:0;}
.rn .hm-stats li:nth-child(4){border-left:1px solid var(--rn-line); padding-left:16px;}
.rn .hm-stats li:nth-child(n+3){border-top:1px solid var(--rn-line);}
.rn .hm-stats strong{height:40px;}
.rn .hm-stats strong b{font-size:34px;}
.rn .hm-stats strong small{font-size:15px;}
.rn .hm-stats strong .plus{font-size:18px;}
.rn .hm-stats span{margin-top:10px; font-size:14px;}
.rn .hm-stats em{font-size:12px;}
}
/* 고객 카드: 안쪽 float(사례 글·로고)을 카드 안에 가둔다 (탭 숨김 방식은 건드리지 않음) */
/* 회사소개 대표 그림: 에이전틱 커머스 엔진 4단계 + 사업 3개 (옛 사업부문 이미지 대체, 2026-10-30) */
.rn.co-map{max-width:960px; margin:56px auto 0; text-align:left;}
.rn.co-map .co-engine{padding:32px; border-radius:0; background-color:var(--rn-night); color:#fff;}
.rn.co-map .co-head{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:6px 16px;}
.rn.co-map .co-head strong{font-size:22px; font-weight:600; color:#fff;}
.rn.co-map .co-head span{font-size:14px; color:#9aa4b2;}
.rn.co-map .co-steps{display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:24px 0 0; padding:0; list-style:none;}
.rn.co-map .co-steps li{padding:16px 0 0; border-top:1px solid rgba(255,255,255,.3);}
.rn.co-map .co-steps b{display:block; font-size:13px; font-weight:700; letter-spacing:.04em; color:var(--rn-brand);}
.rn.co-map .co-steps span{display:block; margin-top:8px; font-size:18px; font-weight:600; color:#fff;}
.rn.co-map .co-all{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:4px 12px; margin-top:20px; padding:14px 18px; border-radius:0; background-color:rgba(0,172,238,.16);}
.rn.co-map .co-all b{font-size:14px; font-weight:600; color:#cfeefc;}
.rn.co-map .co-all span{font-size:18px; font-weight:600; color:#fff;}
.rn.co-map .co-biz{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:12px;}
.rn.co-map .co-card{padding:20px 0 0; border-top:1px solid var(--rn-ink);}
.rn.co-map .co-card .tag{font-size:12px; font-weight:700; letter-spacing:.04em; color:var(--rn-brand);}
.rn.co-map .co-card b{display:block; margin-top:10px; font-size:17px; font-weight:600; line-height:1.4; color:var(--rn-ink);}
.rn.co-map .co-card span{display:block; margin-top:8px; font-size:14px; line-height:1.5; color:var(--rn-muted);}
@media screen and (max-width:859px){
.rn.co-map{margin-top:40px;}
.rn.co-map .co-engine{padding:22px;}
.rn.co-map .co-head strong{font-size:19px;}
.rn.co-map .co-steps{grid-template-columns:repeat(2,1fr); gap:8px;}
.rn.co-map .co-steps li{padding:12px 0 0;}
.rn.co-map .co-steps span{font-size:16px;}
.rn.co-map .co-biz{grid-template-columns:1fr; gap:8px;}
.rn.co-map .co-card{padding:16px 0 0;}
}
/* AI 소프트웨어 인프라: IDT가 하는 일·DevOps 라이프사이클·자사 제품·구축 사례 (2026-10-30) */
.rn .idt-why{display:grid; grid-template-columns:repeat(2,1fr); gap:40px; margin-top:56px;}
.rn .idt-why > div{display:flex; gap:24px; padding:28px 0 0; border-top:1px solid var(--rn-ink);}
.rn .idt-why .no{flex:none; font-size:34px; font-weight:700; line-height:1; color:var(--rn-brand);}
.rn .idt-why h4{font-size:22px; font-weight:700; letter-spacing:-.02em; color:var(--rn-ink);}
.rn .idt-why p{margin-top:10px; font-size:15px; line-height:1.7; color:var(--rn-ink2);}
.rn .idt-note{margin-top:24px; font-size:15px; line-height:1.7; color:var(--rn-ink2);}
.rn .idt-note b{font-weight:700; color:var(--rn-ink);}
.rn .idt-cycle{display:grid; grid-template-columns:repeat(6,1fr); gap:12px; margin:56px 0 0; padding:0; list-style:none;}
.rn .idt-cycle li{padding:22px 20px; border-top:3px solid var(--rn-brand); background-color:var(--rn-soft);}
.rn .idt-cycle b{display:block; font-size:13px; font-weight:700; letter-spacing:.04em; color:var(--rn-brand);}
.rn .idt-cycle strong{display:block; margin-top:6px; font-size:20px; font-weight:700; color:var(--rn-ink);}
.rn .idt-cycle span{display:block; margin-top:12px; font-size:14px; line-height:1.7; color:var(--rn-ink2);}
.rn .idt-svc{display:grid; grid-template-columns:repeat(4,1fr); gap:32px; margin-top:16px;}
.rn .idt-svc > div{padding:20px 0 0; border-top:1px solid var(--rn-ink);}
.rn .idt-svc h4{font-size:18px; font-weight:700; color:var(--rn-ink);}
.rn .idt-svc p{margin-top:10px; font-size:14px; line-height:1.7; color:var(--rn-ink2);}
.rn .idt-areas{margin-top:16px; font-size:14px; line-height:1.8; color:var(--rn-muted);}
.rn .idt-areas b{margin-right:8px; font-weight:700; color:var(--rn-ink);}
.rn .idt-products{display:grid; grid-template-columns:repeat(5,1fr); gap:12px; margin-top:56px;}
.rn .idt-products .rn-card{min-height:auto; padding:24px;}
.rn .idt-products .rn-card h3{font-size:24px;}
.rn .idt-products .rn-card p{font-size:14px;}
.rn .idt-cases{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:56px;}
.rn .idt-cases .rn-card{min-height:auto;}
.rn .idt-cases .rn-card h3{font-size:22px;}
.rn .idt-cases .rn-card .ttl{margin-top:8px; font-size:15px; font-weight:600; line-height:1.5; color:var(--rn-ink);}
.rn .idt-cases .rn-card ul{flex:1; margin-top:14px; padding:0; list-style:none;}
.rn .idt-cases .rn-card li{position:relative; padding-left:14px; font-size:14px; line-height:1.75; color:var(--rn-ink2);}
.rn .idt-cases .rn-card li:before{content:""; position:absolute; top:11px; left:0; width:5px; height:5px; border-radius:50%; background-color:var(--rn-brand);}
.rn .idt-quote{margin-top:24px; padding:28px 32px; border-left:3px solid var(--rn-brand); background-color:var(--rn-soft);}
.rn .idt-quote p{font-size:18px; font-weight:500; line-height:1.6; color:var(--rn-ink);}
.rn .idt-quote cite{display:block; margin-top:10px; font-size:14px; font-style:normal; color:var(--rn-muted);}
@media screen and (max-width:1023px){
.rn .idt-cycle{grid-template-columns:repeat(3,1fr);}
.rn .idt-svc{grid-template-columns:repeat(2,1fr);}
.rn .idt-products{grid-template-columns:repeat(2,1fr);}
}
@media screen and (max-width:859px){
.rn .idt-why, .rn .idt-cases, .rn .idt-svc, .rn .idt-products{grid-template-columns:1fr;}
.rn .idt-why > div{gap:16px; padding:24px;}
.rn .idt-why .no{font-size:26px;}
.rn .idt-why h4{font-size:19px;}
.rn .idt-cycle{grid-template-columns:repeat(2,1fr); gap:8px;}
.rn .idt-cycle li{padding:18px 16px;}
.rn .idt-cycle strong{font-size:18px;}
.rn .idt-quote{padding:22px 20px;}
.rn .idt-quote p{font-size:16px;}
}
/* 국문 라이프사이클: IDT 홈페이지 그림(왼쪽) + 서비스 4종(오른쪽) */
.rn .idt-life{display:grid; grid-template-columns:1.1fr 1fr; gap:48px; align-items:center; margin-top:56px;}
.rn .idt-life img{display:block; width:100%; max-width:560px; margin:0 auto;}
.rn .idt-life .idt-svc{grid-template-columns:repeat(2,1fr); margin-top:0;}
@media screen and (max-width:1023px){
.rn .idt-life{grid-template-columns:1fr; gap:32px;}
}
@media screen and (max-width:859px){
.rn .idt-life .idt-svc{grid-template-columns:1fr;}
}
/* 모바일에서는 그림 글자가 작아 단계 카드로 바꿔 보여 준다 */
.rn .idt-life .idt-cycle-mo{display:none;}
@media screen and (max-width:859px){
.rn .idt-life .idt-life-img{display:none;}
.rn .idt-life .idt-cycle-mo{display:grid; margin-top:0;}
}
.rn .idt-products .rn-card{scroll-margin-top:110px;} /* 상단 메뉴 "제품"에서 바로 갈 때 고정 헤더에 가리지 않게 */

/* 2026-10-31 홈 Enterprise AX · XGEN 영역: 금융 사례·인증·활용 영역 줄 */
.rn .rn-fin{margin-top:64px; padding-top:48px; border-top:1px solid rgba(255,255,255,.14);}
.rn .rn-fin-head{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap;}
.rn .rn-fin-tag{font-size:14px; font-weight:700; letter-spacing:.01em; color:var(--rn-brand);}
.rn .rn-fin-head h4{margin-top:10px; font-size:26px; font-weight:600; line-height:1.35; letter-spacing:-.02em; color:#fff;}
.rn .rn-fin-cert{display:flex; flex-direction:column; align-items:flex-end; padding:12px 18px; border:1px solid rgba(255,255,255,.22);}
.rn .rn-fin-cert b{font-size:16px; font-weight:700; color:#fff;}
.rn .rn-fin-cert span{margin-top:2px; font-size:12px; color:rgba(255,255,255,.55);}
.rn .rn-fin-cases{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:28px 0 0; padding:0; list-style:none;}
.rn .rn-fin-cases li{display:flex; flex-direction:column; padding:20px 0 0; border-top:1px solid rgba(255,255,255,.3);}
.rn .rn-fin-cases b{font-size:20px; font-weight:700; color:#fff;}
.rn .rn-fin-cases span{flex:1; margin-top:8px; font-size:15px; line-height:1.6; color:rgba(255,255,255,.72);}
.rn .rn-fin-foot{display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:16px;}
.rn .rn-fin-foot a{font-size:13px; font-weight:600; color:rgba(255,255,255,.75);}
.rn .rn-fin-foot a:hover{color:#fff;}
.rn .rn-fin-cases em{padding:4px 10px; border-radius:999px; background-color:rgba(255,255,255,.1); font-size:12px; font-style:normal; font-weight:600; color:rgba(255,255,255,.85);}
.rn .rn-fin-areas{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:24px;}
.rn .rn-fin-areas i{margin-right:8px; font-size:13px; font-style:normal; font-weight:600; color:rgba(255,255,255,.5);}
.rn .rn-fin-areas span{padding:6px 12px; border:1px solid rgba(255,255,255,.2); border-radius:999px; font-size:13px; color:rgba(255,255,255,.85);}
@media screen and (max-width:1023px){
.rn .rn-fin-cases{grid-template-columns:1fr;}
.rn .rn-fin-cert{align-items:flex-start;}
}
@media screen and (max-width:859px){
.rn .rn-fin{margin-top:48px; padding-top:36px;}
.rn .rn-fin-head h4{font-size:21px;}
.rn .rn-fin-cases li{padding:20px;}
.rn .rn-fin-areas i{width:100%; margin:0 0 4px;}
}

/* 2026-10-31: 상단 메뉴에서 제품으로 이동하면 도착한 카드를 잠깐 파란 테두리로 표시 (script_function.js의 is-target) */
.rn .rn-card.is-target{animation:rn-target 2.4s ease-out;}
.rn .rn-card:focus{outline:none;}
@keyframes rn-target{0%,55%{border-color:var(--rn-brand); box-shadow:0 0 0 4px rgba(0,172,238,.28);} 100%{box-shadow:0 0 0 4px rgba(0,172,238,0);}}

/* 2026-10-31 제품 요약 창(시범: groobee) — PC는 오른쪽 패널, 모바일은 아래에서 올라오는 시트 */
html.rn-panel-lock{overflow:hidden;} /* body까지 막으면 body 높이(화면 높이) 아래 내용이 잘려 빈 화면이 된다 */
.rn .rn-panel{position:fixed; inset:0; z-index:10000;}
.rn .rn-panel[hidden]{display:none;}
.rn .rn-panel-dim{position:absolute; inset:0; background-color:rgba(11,17,24,.16); opacity:0; transition:opacity .3s ease;}
.rn .rn-panel-box{position:absolute; top:0; right:0; display:flex; flex-direction:column; width:min(520px, 100%); height:100%; background-color:#fff; box-shadow:-24px 0 60px -30px rgba(11,17,24,.5); transform:translateX(100%); transition:transform .35s cubic-bezier(.2,.8,.2,1); outline:none;}
.rn .rn-panel.is-open .rn-panel-dim{opacity:1;}
.rn .rn-panel.is-open .rn-panel-box{transform:none;}
.rn .rn-panel-top{display:flex; justify-content:space-between; align-items:center; gap:16px; padding:20px 24px 0 32px;}
.rn .rn-panel-top .tag{font-size:12px; font-weight:700; letter-spacing:.04em; color:var(--rn-brand);}
.rn .rn-panel-x{display:flex; justify-content:center; align-items:center; flex:none; width:40px; height:40px; border:0; border-radius:50%; background-color:var(--rn-soft); cursor:pointer; transition:background-color .2s;}
.rn .rn-panel-x:hover, .rn .rn-panel-x:focus-visible{background-color:var(--rn-line);}
.rn .rn-panel-x svg{width:20px; height:20px; fill:none; stroke:var(--rn-ink); stroke-width:2; stroke-linecap:round;}
.rn .rn-panel-body{flex:1; overflow-y:auto; overscroll-behavior:contain; padding:12px 32px 32px;}
.rn .rn-panel-body h3{font-size:34px; font-weight:700; letter-spacing:-.02em; color:var(--rn-ink);}
.rn .rn-panel-lead{margin-top:10px; font-size:16px; line-height:1.7; color:var(--rn-ink2);}
.rn .rn-panel-nums{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:24px 0 0; padding:0; list-style:none;}
.rn .rn-panel-nums li{padding:16px 14px; background-color:var(--rn-soft);}
.rn .rn-panel-nums b{display:block; font-size:20px; font-weight:700; color:var(--rn-ink);}
.rn .rn-panel-nums span{display:block; margin-top:4px; font-size:12px; line-height:1.45; color:var(--rn-muted);}
.rn .rn-panel-body h4{margin-top:32px; font-size:13px; font-weight:700; letter-spacing:.06em; color:var(--rn-muted);}
.rn .rn-panel-body h4 + p{margin-top:10px; font-size:15px; line-height:1.7; color:var(--rn-ink2);}
.rn .rn-panel-feats{margin:12px 0 0;}
.rn .rn-panel-feats div{padding:14px 0; border-top:1px solid var(--rn-line);}
.rn .rn-panel-feats div:last-child{border-bottom:1px solid var(--rn-line);}
.rn .rn-panel-feats dt{font-size:16px; font-weight:700; color:var(--rn-ink);}
.rn .rn-panel-feats dd{margin:4px 0 0; font-size:14px; line-height:1.65; color:var(--rn-ink2);}
.rn .rn-panel-body .rn-panel-clients{font-weight:600; color:var(--rn-ink);}
.rn .rn-panel-cta{display:flex; gap:10px; padding:16px 32px 24px; border-top:1px solid var(--rn-line); background-color:#fff;}
.rn .rn-panel-cta .rn-btn{flex:1; justify-content:center;}
/* 2026-11-03 제품 사이트 버튼: 하늘색 테두리, '제품 사이트 바로가기' ↔ '도메인'을 3초마다 굴려 바꾼다(창이 열렸을 때만, CSS만). 화면 낭독기는 aria-label 고정 */
.rn .rn-panel-cta .rn-go{border-color:var(--rn-brand); color:var(--rn-brand);}
.rn .rn-panel-cta .rn-go:hover, .rn .rn-panel-cta .rn-go:active{background-color:var(--rn-brand); color:#fff;}
.rn .rn-go-roll{display:inline-grid; justify-items:center; height:1.3em; overflow:hidden;}
.rn .rn-go-roll span{grid-area:1 / 1; line-height:1.3em; white-space:nowrap;}
.rn .rn-go-roll span + span{transform:translateY(130%);}
.rn .rn-panel.is-open .rn-go-roll span{animation:rnGoA 6s ease-in-out 1.5s infinite;}
.rn .rn-panel.is-open .rn-go-roll span + span{animation-name:rnGoB;}
.rn .rn-go:hover .rn-go-roll span, .rn .rn-go:focus-visible .rn-go-roll span{animation-play-state:paused;}
@keyframes rnGoA{0%, 42%{transform:translateY(0);} 50%, 92%{transform:translateY(-130%);} 92.01%{transform:translateY(130%);} 100%{transform:translateY(0);}}
@keyframes rnGoB{0%, 42%{transform:translateY(130%);} 50%, 92%{transform:translateY(0);} 100%{transform:translateY(-130%);}}
@media (prefers-reduced-motion: reduce){
.rn .rn-panel.is-open .rn-go-roll span{animation:none;}
.rn .rn-go-roll span:first-child{visibility:hidden;}
.rn .rn-go-roll span + span{transform:none;}
}
@media screen and (max-width:767px){
.rn .rn-panel-box{top:auto; bottom:0; width:100%; height:88svh; border-radius:20px 20px 0 0; box-shadow:0 -24px 60px -30px rgba(11,17,24,.5); transform:translateY(100%);}
.rn .rn-panel-box::before{content:""; position:absolute; top:8px; left:50%; width:40px; height:4px; margin-left:-20px; border-radius:2px; background-color:var(--rn-line);}
.rn .rn-panel-top{padding:20px 16px 0 20px;}
.rn .rn-panel-body{padding:8px 20px 24px;}
.rn .rn-panel-body h3{font-size:28px;}
.rn .rn-panel-nums b{font-size:17px;}
.rn .rn-panel-cta{padding:12px 20px calc(16px + env(safe-area-inset-bottom));}
.rn .rn-panel-cta .rn-btn{padding:0 12px; font-size:14px;}
}
@media (prefers-reduced-motion: reduce){
.rn .rn-panel-dim, .rn .rn-panel-box{transition:none;}
}

/* 2026-11 에이전틱 커머스: Commerce AX Engineering 도입부, 엔진 3계층(데이터·지식·거래) — 계층 행을 누르면 "더 알아보기" 요약 창 */
.rn .rn-cax{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:56px;}
.rn .rn-cax > div{padding:24px 0 0; border-top:1px solid var(--rn-ink);}
.rn .rn-cax .no{font-size:13px; font-weight:700; letter-spacing:.08em; color:var(--rn-brand);}
.rn .rn-cax h4{margin-top:12px; font-size:20px; font-weight:600; color:var(--rn-ink);}
.rn .rn-cax p{margin-top:10px; font-size:15px; line-height:1.7; color:var(--rn-ink2);}
.rn .rn-msg{margin-top:48px; padding-left:20px; border-left:3px solid var(--rn-brand); font-size:20px; font-weight:500; line-height:1.6; color:var(--rn-ink);}
.rn .rn-badge{display:inline-block; margin-left:8px; padding:2px 10px; border:1px solid var(--rn-brand); border-radius:999px; font-size:12px; font-weight:600; letter-spacing:0; color:var(--rn-brand); vertical-align:middle; white-space:nowrap;}
.rn .rn-layers{margin-top:56px; border-top:1px solid var(--rn-ink);}
.rn .rn-layer{display:grid; grid-template-columns:180px 1fr 300px 140px; gap:24px; align-items:center; padding:32px 16px 32px 0; border-bottom:1px solid var(--rn-line); color:var(--rn-ink); scroll-margin-top:110px; transition:background-color .2s, padding .2s;}
.rn .rn-layer .ly{font-size:13px; font-weight:700; letter-spacing:.08em; color:var(--rn-muted);}
.rn .rn-layer .ly b{display:block; margin-top:6px; font-size:24px; font-weight:600; letter-spacing:0; color:var(--rn-ink);}
.rn .rn-layer .desc{font-size:16px; line-height:1.7; color:var(--rn-ink2);}
.rn .rn-layer .by b{display:block; font-size:17px; font-weight:700; color:var(--rn-ink);}
.rn .rn-layer .by span:not(.rn-badge){display:block; margin-top:6px; font-size:14px; color:var(--rn-muted);}
.rn .rn-layer .more{justify-self:end; font-size:14px; font-weight:600; color:var(--rn-brand); white-space:nowrap;}
.rn .rn-layer .more span{display:inline-block; transition:transform .25s;}
.rn .rn-layer:focus-visible{outline:none; padding-left:20px; background-color:#fff; box-shadow:inset 3px 0 0 var(--rn-brand);}
.rn .rn-layer.knowledge .ly b{color:var(--rn-brand);}
.rn .rn-layer.is-target{animation:rn-target 2.4s ease-out;}
@media (hover:hover){
.rn .rn-layer:hover{padding-left:20px; background-color:#fff; box-shadow:inset 3px 0 0 var(--rn-brand);}
.rn .rn-layer:hover .ly b{color:var(--rn-brand);}
.rn .rn-layer:hover .more span{transform:translateX(6px);}
}
/* 요약 창 안: 관련 제품 줄, 핵심 문장, 처리 단계, 처리 예시 */
.rn .rn-panel-rel{margin-top:8px; font-size:14px; color:var(--rn-muted);}
.rn .rn-panel-rel b{margin-left:6px; color:var(--rn-ink);}
.rn .rn-panel-body .rn-df-key{margin-top:16px; padding-left:14px; border-left:3px solid var(--rn-brand); font-size:16px; font-weight:600; line-height:1.6; color:var(--rn-ink);}
.rn .rn-panel-steps{margin:12px 0 0; padding:0; list-style:none; counter-reset:none;}
.rn .rn-panel-steps li{display:grid; grid-template-columns:36px 1fr; gap:4px 8px; padding:14px 0; border-top:1px solid var(--rn-line);}
.rn .rn-panel-steps li:last-child{border-bottom:1px solid var(--rn-line);}
.rn .rn-panel-steps .no{grid-row:span 2; font-size:13px; font-weight:700; color:var(--rn-brand);}
.rn .rn-panel-steps b{font-size:16px; font-weight:700; color:var(--rn-ink);}
.rn .rn-panel-steps span:not(.no){font-size:14px; line-height:1.65; color:var(--rn-ink2);}
.rn .rn-panel-ex{margin-top:12px; padding:18px 20px; background-color:var(--rn-soft);}
.rn .rn-panel-ex dl{margin:0;}
.rn .rn-panel-ex dl div{display:grid; grid-template-columns:110px 1fr; gap:10px; padding:7px 0; font-size:14px; line-height:1.55;}
.rn .rn-panel-ex dt{font-weight:600; color:var(--rn-ink);}
.rn .rn-panel-ex dd{margin:0; color:var(--rn-ink2);}
.rn .rn-panel-ex .use{margin-top:12px; padding-top:12px; border-top:1px solid var(--rn-line); font-size:15px; font-weight:600; line-height:1.6; color:var(--rn-brand);}
.rn .rn-panel-ex .use span{display:block; font-size:12px; font-weight:700; color:var(--rn-muted);}
.rn .rn-panel-body p.rn-panel-note{margin-top:12px; font-size:13px; line-height:1.6; color:var(--rn-muted);}
.rn .rn-panel-body .rn-chips{margin:12px 0 0;}
.rn .rn-panel-body .rn-chips span{background-color:var(--rn-soft); border-color:transparent;}
@media screen and (max-width:1023px){
.rn .rn-layer{grid-template-columns:140px 1fr auto;}
.rn .rn-layer .by{grid-column:2;}
.rn .rn-layer .more{grid-column:3; grid-row:1 / span 2;}
}
@media screen and (max-width:859px){
.rn .rn-cax{grid-template-columns:1fr;}
.rn .rn-msg{font-size:17px;}
.rn .rn-layer{grid-template-columns:1fr; gap:8px; padding:24px 0;}
.rn .rn-layer .by, .rn .rn-layer .more{grid-column:auto; grid-row:auto; justify-self:start;}
.rn .rn-panel-ex dl div{grid-template-columns:1fr; gap:2px;}
}
/* 2026-11-01 정보 묶음 강조: 강조할 칸에 is-em을 붙이면 위쪽 선이 파란 2px로 바뀐다 (마우스 효과 없음) */
.rn div.rn-card.is-em, .rn .rn-cax > .is-em, .rn .rn-tile.is-em, .rn .idt-why > .is-em, .rn .idt-svc > .is-em, .rn.co-map .co-card.is-em{border-top:2px solid var(--rn-brand);}
.rn .rn-tiles > .rn-tile.is-em:first-child{margin-top:-1px;}
.rn .rn-fin-cases li.is-em, .rn.co-map .co-steps li.is-em{border-top:2px solid var(--rn-brand);}
/* 2026-11-01 홈 뉴스 카드는 누르는 카드: 제목 링크를 카드 전체로 넓히고, 마우스오버는 파란 테두리·제목 파랑 (슬라이드 영역이 잘라서 위로 뜨는 효과는 쓰지 않음) */
/* 2026-11-01 PC(1024px 이상) 정보 묶음 칸 사이 세로 구분선 — 홈 숫자 띠(Experience)처럼 칸을 나눈다. 모바일·태블릿은 그대로 */
@media screen and (min-width:1024px){
/* 2칸 */
.rn .rn-areas, .rn .idt-why, .rn .idt-life .idt-svc{column-gap:0;}
.rn .rn-areas > div.rn-card, .rn .idt-why > div, .rn .idt-life .idt-svc > div{padding-right:32px; padding-bottom:8px;}
.rn .rn-areas > div.rn-card:nth-child(2n), .rn .idt-why > div:nth-child(2n), .rn .idt-life .idt-svc > div:nth-child(2n){padding-left:32px; border-left:1px solid var(--rn-line);}
/* 3칸 */
.rn .rn-cax, .rn.co-map .co-biz, .rn .rn-fin-cases{column-gap:0;}
.rn .rn-cax > div, .rn.co-map .co-card{padding-right:28px; padding-bottom:8px;}
.rn .rn-cax > div:not(:nth-child(3n+1)), .rn.co-map .co-card:not(:nth-child(3n+1)){padding-left:28px; border-left:1px solid var(--rn-line);}
.rn .rn-fin-cases li{padding-right:26px; padding-bottom:4px;}
.rn .rn-fin-cases li:not(:nth-child(3n+1)){padding-left:26px; border-left:1px solid rgba(255,255,255,.16);}
/* 4칸 (어두운 바탕) */
.rn.co-map .co-steps{column-gap:0;}
.rn.co-map .co-steps li{padding-right:20px; padding-bottom:4px;}
.rn.co-map .co-steps li:not(:nth-child(4n+1)){padding-left:20px; border-left:1px solid rgba(255,255,255,.16);}
}

/* 2026-11-01 그림 배치 (hp-visual, 기준 .claude/visual-style.md) */
.rn .rn-hero-bg{position:absolute; top:0; right:0; bottom:0; width:62%; pointer-events:none;}
.rn .rn-hero-bg img{display:block; width:100%; height:100%; object-fit:cover; opacity:.8; -webkit-mask-image:linear-gradient(90deg, transparent, #000 50%); mask-image:linear-gradient(90deg, transparent, #000 50%);}
.rn .rn-logos{margin-top:56px;}
.rn .rn-logos-cap{font-size:13px; font-weight:700; letter-spacing:.06em; color:var(--rn-muted);}
.rn .rn-logos-view{overflow:hidden; margin-top:16px; -webkit-mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);}
.rn .rn-logos-track{display:flex; width:max-content; animation:rn-logos 60s linear infinite;}
.rn .rn-logos-view:hover .rn-logos-track{animation-play-state:paused;}
.rn .rn-logos ul{display:flex; gap:12px; margin:0; padding:0 12px 0 0; list-style:none;}
.rn .rn-logos li{flex:none; border:1px solid var(--rn-line); background-color:#fff;}
.rn .rn-logos img{display:block; width:176px; height:72px;}
@keyframes rn-logos{to{transform:translateX(-50%);}}
@media (prefers-reduced-motion: reduce){
.rn .rn-logos-track{animation:none; width:auto;}
.rn .rn-logos-view{-webkit-mask-image:none; mask-image:none;}
.rn .rn-logos ul{flex-wrap:wrap;}
.rn .rn-logos ul[aria-hidden]{display:none;}
}
.rn .rn-panel-hero{margin:4px 0 24px;}
.rn .rn-panel-hero img, .rn .rn-panel-hero video, .rn .rn-panel-hero svg{display:block; width:100%; height:auto; border:1px solid var(--rn-line); border-radius:12px;}
.rn .rn-panel-hero video{background-color:#f4f6f8;}
/* 2026-11-03 그림 크게 보기: 요약 창 위쪽 그림의 오른쪽 위 버튼(script_function.js preparePanel)과 화면 가득 보는 창(.rn-zoom) */
.rn .rn-panel-hero{position:relative;}
.rn .rn-panel-hero img{cursor:zoom-in;}
.rn .rn-zoom-btn{position:absolute; top:10px; right:10px; display:flex; justify-content:center; align-items:center; width:36px; height:36px; padding:0; border:0; border-radius:50%; background-color:rgba(11,17,24,.62); cursor:zoom-in; transition:background-color .2s;}
.rn .rn-zoom-btn:hover, .rn .rn-zoom-btn:active, .rn .rn-zoom-btn:focus-visible{background-color:rgba(11,17,24,.85);}
.rn .rn-zoom-btn svg{width:18px; height:18px; fill:none; stroke:#fff; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
.rn-zoom{position:fixed; inset:0; width:100%; height:100%; max-width:none; max-height:none; margin:0; padding:0; border:0; background-color:rgba(5,9,14,.9); overflow:hidden;}
.rn-zoom::backdrop{background:transparent;}
.rn-zoom-view{display:flex; width:100%; height:100%; overflow:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch;}
.rn-zoom-view img{display:block; flex:none; margin:auto; max-width:calc(100% - 32px); max-height:calc(100% - 128px); width:auto; height:auto; border-radius:8px; background-color:#fff; cursor:zoom-in;}
.rn-zoom.is-actual .rn-zoom-view img{align-self:flex-start; max-width:none; max-height:none; margin:72px 16px 24px; border-radius:0; cursor:zoom-out;}
.rn-zoom-bar{position:absolute; top:calc(12px + env(safe-area-inset-top)); right:calc(12px + env(safe-area-inset-right)); display:flex; gap:8px;}
.rn-zoom-bar button{display:flex; justify-content:center; align-items:center; width:44px; height:44px; padding:0; border:0; border-radius:50%; background-color:rgba(255,255,255,.16); cursor:pointer; transition:background-color .2s;}
.rn-zoom-bar button:hover, .rn-zoom-bar button:active, .rn-zoom-bar button:focus-visible{background-color:rgba(255,255,255,.3);}
.rn-zoom-bar svg{width:22px; height:22px; fill:none; stroke:#fff; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
.rn-zoom.is-actual .rn-zoom-fit .v{display:none;} /* 원래 크기일 때는 − (축소) */
@media (max-width:1023px){
.rn .rn-logos img{width:132px; height:54px;}
}
.rn .rn-panel-shot{margin:24px 0 0;}
.rn .rn-panel-shot img{display:block; width:100%; height:auto; border:1px solid var(--rn-line); border-radius:12px;}
/* 섹션 split 배치: 섹션 머리·제목은 전체 폭, 머리말 왼쪽 + 그림(.rn-split-fig) 오른쪽, 나머지는 전체 폭. 모바일은 머리말 아래(.is-pc-only면 숨김) */
.rn .rn-split-fig{max-width:560px; margin:32px 0 0;}
.rn .rn-split-fig svg, .rn .rn-split-fig img{display:block; width:100%; height:auto;}
@media (max-width:767px){ .rn .rn-split-fig.is-pc-only{display:none;} }
@media (min-width:1024px){
.rn .rn-split{display:grid; grid-template-columns:minmax(0,1fr) 560px; column-gap:48px;}
.rn .rn-split > *{grid-column:1 / -1;}
.rn .rn-split > .rn-lead{grid-column:1; align-self:start;}
.rn .rn-split > .rn-split-fig{grid-column:2; grid-row:3; max-width:none; margin:4px 0 0;}
/* is-fig-top: 그림을 제목 높이부터 — 섹션 머리·제목·머리말은 왼쪽 칸, 그림은 오른쪽 칸 제목 줄에서 시작 */
.rn .rn-split.is-fig-top{grid-template-columns:minmax(0,1fr) 520px; grid-template-rows:auto auto 1fr; column-gap:40px;}
.rn .rn-split.is-fig-top > .rn-eyebrow, .rn .rn-split.is-fig-top > .rn-title{grid-column:1;}
.rn .rn-split.is-fig-top > .rn-split-fig{grid-row:2 / span 2; align-self:start; margin:0;}
}
@media (max-width:1023px){
.rn .rn-hero-bg{width:100%;}
.rn .rn-hero-bg img{opacity:.35; -webkit-mask-image:none; mask-image:none;}
}

/* 2026-11-01 "도구 위에 AI" 도식(.rn-onstack): 두께·윗면이 있는 판 3장을 아래(넓음)→위(좁음)로 쌓아 올린 적층 구조.
   01 도구 판(흰색) 위에 02 AI 판(파랑), 그 위에 03 자체 솔루션 판(어두운 색). 위층이 아래층 윗면에 올라앉고 그림자가 떨어진다. 누르지 않는 정보 영역 */
.rn .rn-onstack{display:flex; flex-direction:column; align-items:center; gap:14px; padding:22px 0 18px; font-size:14px;}
.rn .rn-onstack > div{position:relative; box-sizing:border-box; padding:16px;}
.rn .rn-onstack > div::before{content:""; position:absolute; left:0; right:0; bottom:100%; height:20px; clip-path:polygon(4% 0, 96% 0, 100% 100%, 0 100%);}
.rn .rn-onstack ul{display:flex; flex-wrap:wrap; gap:6px; margin:0; padding:0; list-style:none;}
.rn .rn-onstack-cap{display:flex; align-items:center; gap:6px; margin-bottom:10px; font-size:13px; font-weight:700; letter-spacing:.01em;}
.rn .rn-onstack-cap svg{flex:none; width:15px; height:15px;}
.rn .rn-onstack-cap b{margin-right:4px; font-weight:700;}
.rn .rn-onstack li{padding:6px 8px; border-radius:2px; font-weight:700;}
/* 03 자체 솔루션: 맨 위, 가장 좁은 어두운 판 */
.rn .rn-onstack-sol{z-index:3; width:82%; background:linear-gradient(180deg, #24324a, #182233); color:#fff; box-shadow:0 7px 0 #0b1118, 0 22px 26px -12px rgba(11,17,24,.55);}
.rn .rn-onstack-sol::before{background:linear-gradient(180deg, #4a5f7d, #34465f);}
.rn .rn-onstack-sol .rn-onstack-cap{color:rgba(255,255,255,.75);}
.rn .rn-onstack-sol .rn-onstack-cap b{color:var(--rn-brand);}
.rn .rn-onstack-sol li{border:1px solid rgba(255,255,255,.22); background-color:rgba(255,255,255,.08);}
/* 02 AI: 가운데 파랑 판 */
.rn .rn-onstack-ai{z-index:2; width:94%; background:linear-gradient(180deg, #13b4f0, #0a8fd0); color:#fff; box-shadow:0 7px 0 #066a9e, 0 22px 26px -12px rgba(6,90,140,.55);}
.rn .rn-onstack-ai::before{background:linear-gradient(180deg, #8fdcf8, #4fc4f1);}
.rn .rn-onstack-ai .rn-onstack-cap{color:#fff;}
.rn .rn-onstack-ai .rn-onstack-cap b{color:#fff; opacity:.7;}
.rn .rn-onstack-ai li{border:1px solid rgba(255,255,255,.45); background-color:rgba(255,255,255,.15);}
/* 01 쓰고 계신 도구: 맨 아래, 가장 넓은 흰 판 */
.rn .rn-onstack-base{z-index:1; width:100%; padding-bottom:14px; background-color:#fff; box-shadow:0 7px 0 #cdd5e0, 0 26px 30px -16px rgba(15,20,27,.3);}
.rn .rn-onstack-base::before{background:linear-gradient(180deg, #f5f7fa, #e3e8ef);}
.rn .rn-onstack-base ul{justify-content:center; gap:8px;}
.rn .rn-onstack-base li{width:calc((100% - 32px) / 5); padding:0; border:1px solid var(--rn-line); border-radius:0;}
.rn .rn-onstack-base img{display:block; width:100%; height:auto;}
.rn .rn-onstack-base .rn-onstack-cap{justify-content:center; margin:12px 0 0; color:var(--rn-muted);}
.rn .rn-onstack-base .rn-onstack-cap b{color:var(--rn-brand);}
@media (max-width:767px){
.rn .rn-onstack{gap:12px;}
.rn .rn-onstack > div{padding:14px 12px;}
.rn .rn-onstack > div::before{height:16px;}
.rn .rn-onstack-sol{width:92%;} .rn .rn-onstack-ai{width:96%;}
.rn .rn-onstack-sol li, .rn .rn-onstack-ai li{padding:5px 7px; font-size:13px;}
.rn .rn-onstack-sol ul, .rn .rn-onstack-ai ul{gap:4px;}
.rn .rn-onstack-base li{width:calc((100% - 16px) / 3);}
}

/* 2026-11-01 글자 규칙 (visual-style.md 8절): 제목은 의미 단위 <br> + 고른 줄바꿈, 머리말·메시지는 마지막 줄 외톨이 방지 */
.rn .rn-title, .rn .rn-feat-title, .hm .hm-title, .rn .rn-contact h2, .rn .rn-hero h2, .rn .rn-hero h1{text-wrap:balance;}
.rn .rn-lead, .rn .rn-msg, .rn .rn-feat-lead, .rn .rn-hero p.sub, .rn .rn-panel-lead{text-wrap:pretty;}

/* 2026-11-01 홈 에이전틱 커머스: 고객 여정 4단계 + 전 단계 기반(아이콘·차례로 켜지는 빛·제품 요약 창) */
.rn .rn-jn-sec{background:radial-gradient(ellipse 70% 60% at 85% 0%, rgba(0,172,238,.16), rgba(0,172,238,0) 70%), var(--rn-night);}
.rn .rn-jn-head{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:end;}
.rn .rn-jn-head .rn-feat-lead{margin-top:0;}
.rn .rn-journey{position:relative; margin-top:64px;}
.rn .rn-jn-steps{position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin:0; padding:0; list-style:none;}
.rn .rn-jn-steps::before{content:""; position:absolute; top:28px; left:28px; right:0; height:1px; background:linear-gradient(90deg, rgba(0,172,238,.6), rgba(0,172,238,.15));}
.rn .rn-jn-steps::after{content:""; position:absolute; top:27px; left:0; width:180px; height:3px; border-radius:2px; background:linear-gradient(90deg, rgba(0,172,238,0), #7fdcff, rgba(0,172,238,0)); opacity:0;}
.rn .rn-jn-step{position:relative; display:flex; flex-direction:column;}
.rn .rn-jn-ico{position:relative; z-index:1; display:flex; justify-content:center; align-items:center; width:56px; height:56px; border:1px solid rgba(0,172,238,.55); border-radius:50%; background-color:#0d1722; color:var(--rn-brand); transition:background-color .3s, color .3s, box-shadow .3s;}
.rn .rn-jn-ico svg{width:26px; height:26px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round;}
.rn .rn-jn-ico.sm{width:44px; height:44px; flex:none;}
.rn .rn-jn-ico.sm svg{width:22px; height:22px;}
.rn .rn-jn-no{margin-top:24px; font-size:14px; font-weight:700; color:var(--rn-brand);}
.rn .rn-jn-name{margin-top:6px; font-size:26px; font-weight:600; color:#fff;}
.rn .rn-jn-prods{display:flex; flex-direction:column; gap:10px; flex:1; margin-top:20px;}
.rn .rn-jn-prod{position:relative; display:flex; flex-direction:column; gap:4px; padding:16px 44px 16px 18px; border:1px solid rgba(255,255,255,.16); border-radius:12px; background-color:rgba(255,255,255,.04); color:#fff; transition:border-color .2s, background-color .2s, transform .2s;}
.rn .rn-jn-step .rn-jn-prod:only-child{flex:1;}
.rn .rn-jn-prod .cap{font-size:13px; line-height:1.45; color:rgba(255,255,255,.62);}
.rn .rn-jn-prod b{font-size:18px; font-weight:700; line-height:1.3; color:#fff;}
.rn .rn-jn-prod i{position:absolute; right:18px; bottom:16px; font-style:normal; font-size:16px; color:var(--rn-brand); transition:transform .2s;}
.rn .rn-jn-prod:focus-visible{border-color:var(--rn-brand); background-color:rgba(0,172,238,.12); transform:translateY(-2px);}
.rn .rn-jn-prod:hover, .rn .rn-jn-prod:active{border-color:var(--rn-brand); background-color:rgba(0,172,238,.12); transform:translateY(-2px);}
.rn .rn-jn-prod:focus-visible i{transform:translateX(4px);}
.rn .rn-jn-prod:hover i, .rn .rn-jn-prod:active i{transform:translateX(4px);}
.rn .rn-jn-step:has(.rn-jn-prod:focus-visible) .rn-jn-ico{background-color:var(--rn-brand); color:#fff; box-shadow:0 0 0 8px rgba(0,172,238,.16), 0 0 32px rgba(0,172,238,.55);}
.rn .rn-jn-step:has(.rn-jn-prod:hover) .rn-jn-ico, .rn .rn-jn-step:has(.rn-jn-prod:active) .rn-jn-ico{background-color:var(--rn-brand); color:#fff; box-shadow:0 0 0 8px rgba(0,172,238,.16), 0 0 32px rgba(0,172,238,.55);}
.rn .rn-jn-base{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:16px 0 0; padding:20px 0 0; border-top:1px solid rgba(255,255,255,.12); list-style:none;}
.rn .rn-jn-base-item{display:flex; align-items:center; gap:16px;}
.rn .rn-jn-base-name{flex:1; font-size:16px; font-weight:600; line-height:1.4; color:rgba(255,255,255,.85);}
.rn .rn-jn-base .rn-jn-prod{flex:none; min-width:220px;}
.rn .rn-jn-hint{margin-top:20px; font-size:13px; color:rgba(255,255,255,.5);}
/* 움직임: 화면에 들어오면 단계가 차례로 나타나고(js-reveal), 빛이 01→04로 흐르며 아이콘이 차례로 켜진다 */
.rn .rn-journey.js-reveal .rn-jn-step, .rn .rn-journey.js-reveal .rn-jn-base{opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s ease; transition-delay:calc(var(--i, 4) * .12s);}
.rn .rn-journey.js-reveal.is-in .rn-jn-step, .rn .rn-journey.js-reveal.is-in .rn-jn-base{opacity:1; transform:none;}
.rn .rn-journey.is-in .rn-jn-steps::after{animation:rnJnFlow 8s linear infinite;}
.rn .rn-journey.is-in .rn-jn-ico:not(.sm){animation:rnJnLit 8s ease-in-out infinite; animation-delay:calc(var(--i) * 2s);}
@keyframes rnJnFlow{0%{left:0; opacity:0;} 4%{opacity:1;} 92%{opacity:1;} 100%{left:calc(100% - 180px); opacity:0;}}
@keyframes rnJnLit{0%, 30%, 100%{background-color:#0d1722; color:var(--rn-brand); box-shadow:none;} 6%, 22%{background-color:var(--rn-brand); color:#fff; box-shadow:0 0 0 8px rgba(0,172,238,.16), 0 0 32px rgba(0,172,238,.55);}}
@media (prefers-reduced-motion: reduce){
.rn .rn-journey.is-in .rn-jn-steps::after, .rn .rn-journey.is-in .rn-jn-ico:not(.sm){animation:none;}
.rn .rn-journey.js-reveal .rn-jn-step, .rn .rn-journey.js-reveal .rn-jn-base{opacity:1; transform:none; transition:none;}
}
@media (max-width:1023px){
.rn .rn-jn-head{grid-template-columns:1fr; gap:20px;}
.rn .rn-journey{margin-top:48px;}
.rn .rn-jn-steps{grid-template-columns:1fr 1fr; row-gap:40px;}
.rn .rn-jn-steps::before, .rn .rn-jn-steps::after{display:none;}
.rn .rn-jn-base{grid-template-columns:1fr;}
}
@media (max-width:767px){
.rn .rn-jn-steps{grid-template-columns:1fr; row-gap:0;}
.rn .rn-jn-steps::before{display:block; top:28px; bottom:28px; left:27px; right:auto; width:1px; height:auto; background:linear-gradient(180deg, rgba(0,172,238,.6), rgba(0,172,238,.15));}
.rn .rn-jn-step{display:grid; grid-template-columns:56px 1fr; column-gap:16px; padding-bottom:28px;}
.rn .rn-jn-ico:not(.sm){grid-row:span 3;}
.rn .rn-jn-no{margin-top:4px;}
.rn .rn-jn-name{font-size:22px;}
.rn .rn-jn-prods{margin-top:14px;}
.rn .rn-jn-base-item{flex-wrap:wrap;}
.rn .rn-jn-base .rn-jn-prod{flex:1 1 100%; min-width:0;}
}
/* 제품 버튼의 흰색 로고 (2026-11-01): 로고 높이를 글자 크기에 맞춰 눈으로 고르게, genser는 로고 + 제품 이름 */
.rn .rn-jn-prod b{display:flex; flex-wrap:wrap; align-items:center; column-gap:8px; row-gap:4px; min-height:28px;}
.rn .rn-jn-logo{display:block; width:auto; height:20px;}
.rn .rn-jn-logo.is-genser{height:19px;}
/* genser 로고 + 제품 이름: 로고 그림 아래 25%가 g 내림·밑줄 자리라 그만큼 내려 글자 기준선(하단)을 맞춘다 */
.rn .rn-jn-prod b.has-genser{display:block; min-height:0;}
.rn .rn-jn-prod b.has-genser .rn-jn-logo{display:inline-block; margin-right:7px; vertical-align:-4.75px;}
.rn .rn-jn-logo.is-x2bee{height:32px;}
.rn .rn-jn-logo.is-xgen{height:20px;}
.rn .rn-jn-logo.is-gelatto{height:24px;}
.rn .rn-jn-logo.is-groobee{height:25px;}

/* 2026-11-01 홈 고객: 사업별 탭 대신 로고띠 2줄(커머스 / AI 소프트웨어 인프라) + 사업마다 대표 사례. 로고띠는 에이전틱 커머스 페이지(P2)와 같은 마크업 */
.rn.hm-cus .rn-logos{margin-top:0;}
.rn.hm-cus .rn-logos + .rn-logos{margin-top:28px;}
.rn.hm-cus .rn-logos-view{-webkit-mask-image:linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); mask-image:linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);}
.rn.hm-cus .rn-logos-track{animation-duration:calc(var(--n, 20) * 3s);}
.rn.hm-cus .rn-logos.is-reverse .rn-logos-track{animation-direction:reverse;}
.rn .hm-cases{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin:56px 0 0; padding:0; list-style:none;}
.rn .hm-case{display:flex; flex-direction:column; padding:28px; border-top:2px solid var(--rn-ink); background-color:#fff;}
.rn .hm-case-top{display:flex; justify-content:space-between; align-items:center; gap:12px;}
.rn .hm-case-top img{display:block; width:110px; height:45px;}
.rn .hm-case-top span{font-size:12px; font-weight:700; letter-spacing:.01em; text-align:right; color:var(--rn-brand);}
.rn .hm-case h4{margin-top:20px; margin-bottom:-6px; font-size:20px; font-weight:700; color:var(--rn-ink);}
.rn .hm-case p{margin-top:16px; font-size:15px; line-height:1.7; color:var(--rn-ink2); text-wrap:pretty;}
@media (max-width:1023px){ .rn .hm-cases{grid-template-columns:1fr 1fr;} }
@media (max-width:767px){ /* 모바일: 사례 6개를 세로로 쌓으면 너무 길어 옆으로 넘기는 줄로 */
.rn .hm-cases{display:flex; gap:12px; margin:40px -4.35% 0; padding:0 4.35% 8px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding:0 4.35%; -webkit-overflow-scrolling:touch;}
.rn .hm-case{flex:0 0 84%; padding:24px 20px; scroll-snap-align:start;}
}

/* 2026-11-01 홈 뉴스룸: 썸네일 카드 슬라이드 대신 글 목록(날짜 · 분류 · 제목). 왼쪽 머리, 오른쪽 최근 5건 */
.main_wrap.hm .hm-news{background:#fff !important;}
.hm .hm-news-grid{display:grid; grid-template-columns:minmax(0,4fr) minmax(0,8fr); gap:64px; align-items:start;}
.hm .hm-news-head .hm-more{display:inline-block; margin-top:32px;}
.hm .hm-news-list{margin:0; padding:0; border-top:1px solid #0f141b; list-style:none;}
.hm .hm-news-list li{border-bottom:1px solid #e4e7ec;}
.hm .hm-news-list a{display:grid; grid-template-columns:1fr auto; column-gap:24px; row-gap:8px; align-items:center; padding:24px 4px;}
.hm .hm-news-meta{grid-column:1; display:flex; align-items:center; gap:12px; font-size:14px; color:#6b7480;}
.hm .hm-news-meta em{font-style:normal; font-weight:600; color:#00acee;}
.hm .hm-news-list b{grid-column:1; font-size:18px; font-weight:600; line-height:1.5; color:#0f141b; text-wrap:pretty; transition:color .2s;}
.hm .hm-news-list i{grid-column:2; grid-row:1 / span 2; font-style:normal; font-size:18px; color:#0f141b; transition:transform .2s, color .2s;}
.hm .hm-news-list a:focus-visible b{color:#00acee;}
.hm .hm-news-list a:hover b, .hm .hm-news-list a:active b{color:#00acee;}
.hm .hm-news-list a:focus-visible i{color:#00acee; transform:translateX(4px);}
.hm .hm-news-list a:hover i, .hm .hm-news-list a:active i{color:#00acee; transform:translateX(4px);}
@media (max-width:1023px){ .hm .hm-news-grid{grid-template-columns:1fr; gap:28px;} .hm .hm-news-head{display:grid; grid-template-columns:1fr auto; align-items:end; column-gap:16px;} .hm .hm-news-head .hm-eyebrow{grid-column:1 / -1;} .hm .hm-news-head .hm-more{margin-top:0; padding-bottom:4px;} }
@media (max-width:767px){ .hm .hm-news-list a{padding:20px 0; column-gap:16px;} .hm .hm-news-list b{font-size:16px;} .hm .hm-news-meta{font-size:13px;} }
/* 2026-11-01 휴대폰: 누르는 순간(:active)도 마우스오버와 같은 모습(위 규칙), 회색 탭 번쩍임 없앰 */
.rn .rn-jn-prod, .hm .hm-news-list a{-webkit-tap-highlight-color:transparent;}
.rn .rn-jn-ico{transition:background-color .3s, color .3s, box-shadow .3s;}

/* 2026-11-01 회사소개 개편(company_plateer.html, .co-page): 페이지 안 바로가기, 숫자 판, 수상·인증, 연표, AI Labs 순환도·원칙, 플래티어재팬 */
.rn.co-page [id]{scroll-margin-top:90px;} /* 상단 메뉴(AI Labs 소개·플래티어재팬)에서 바로 갈 때 고정 헤더에 가리지 않게 */
.rn .co-jump{display:flex; flex-wrap:wrap; gap:8px; margin-top:40px;}
.rn .co-jump a{padding:9px 16px; border:1px solid rgba(255,255,255,.32); border-radius:999px; font-size:14px; font-weight:500; color:rgba(255,255,255,.88); transition:background-color .2s, border-color .2s;}
.rn .co-jump a:hover, .rn .co-jump a:focus-visible{border-color:#fff; background-color:rgba(255,255,255,.12); color:#fff;}
.rn .rn-lead + .rn-lead{margin-top:12px;}
.rn .co-sub{margin-top:64px; font-size:13px; font-weight:700; letter-spacing:.06em; color:var(--rn-muted);}
.rn .co-cta{display:flex; flex-wrap:wrap; gap:12px; margin-top:48px;}
/* 숫자 판: 누르지 않는 정보 → 각진 모서리·위쪽 선(P6) */
.rn .co-stats{display:grid; grid-template-columns:repeat(3,1fr); margin:56px 0 0; border-top:1px solid var(--rn-ink);}
.rn .co-stats > div{padding:28px 28px 32px 0; border-bottom:1px solid var(--rn-line);}
.rn .co-stats > div:not(:nth-child(3n+1)){padding-left:28px; border-left:1px solid var(--rn-line);}
.rn .co-stats dt{font-size:15px; font-weight:700; color:var(--rn-ink);}
.rn .co-stats dd{margin:0;}
.rn .co-stats strong{display:block; margin-top:20px; font-size:52px; font-weight:600; line-height:1; letter-spacing:-.03em; color:var(--rn-ink);}
.rn .co-stats strong small{margin-left:4px; font-size:20px; font-weight:500; letter-spacing:0;}
.rn .co-stats span{display:block; margin-top:10px; font-size:13px; line-height:1.5; color:var(--rn-muted);}
.rn.co-page #glance .rn-logos{margin-top:48px;}
.rn .co-detail{display:grid; grid-template-columns:1.2fr 1fr; gap:56px; margin-top:64px;}
.rn .co-box{padding-top:24px; border-top:1px solid var(--rn-ink);}
.rn .co-box + .co-box{margin-top:40px;}
.rn .co-box h4{font-size:20px; font-weight:700; color:var(--rn-ink);}
.rn .co-box h4 em{margin-left:10px; font-size:15px; font-style:normal; font-weight:700; color:var(--rn-brand);}
.rn .co-yr{margin:12px 0 0; padding:0; list-style:none;}
.rn .co-yr li{display:grid; grid-template-columns:56px 1fr; gap:12px; padding:12px 0; border-bottom:1px solid var(--rn-line); font-size:15px; line-height:1.6;}
.rn .co-yr.is-wide li{grid-template-columns:minmax(120px,auto) 1fr;}
.rn .co-yr b{font-weight:700; color:var(--rn-ink);}
.rn .co-yr span{color:var(--rn-ink2);}
.rn .co-certs{display:flex; gap:16px; margin-top:16px;}
.rn .co-certs img{width:auto; height:72px;}
.rn .co-dots{margin:12px 0 0; padding:0; list-style:none;}
.rn .co-dots li{position:relative; padding-left:14px; font-size:15px; line-height:1.9; color:var(--rn-ink2);}
.rn .co-dots li:before{content:""; position:absolute; top:13px; left:0; width:5px; height:5px; border-radius:50%; background-color:var(--rn-brand);}
/* 연표: 가로 선 위 점, 마지막(지금)은 채운 점. 1023px 이하는 옆으로 넘김 */
.rn .co-tl{display:grid; grid-template-columns:repeat(9,1fr); margin:56px 0 0; padding:0; list-style:none;}
.rn .co-tl.is-short{grid-template-columns:repeat(5,1fr); margin-top:20px;}
.rn .co-tl li{position:relative; padding:28px 16px 0 0;}
.rn .co-tl li:before{content:""; position:absolute; top:5px; left:0; right:0; height:2px; background-color:var(--rn-line);}
.rn .co-tl li:after{content:""; position:absolute; top:0; left:0; width:12px; height:12px; border:2px solid var(--rn-brand); border-radius:50%; background-color:#fff; box-sizing:border-box;}
.rn .co-tl li.is-now:after{background-color:var(--rn-brand); box-shadow:0 0 0 5px rgba(0,172,238,.18);}
.rn .co-tl .yr{font-size:22px; font-weight:700; letter-spacing:-.01em; color:var(--rn-ink);}
.rn .co-tl.is-short .yr{font-size:17px;}
.rn .co-tl.is-short .tech{min-height:0;}
.rn .co-tl .tech{min-height:2.9em; margin-top:6px; font-size:13px; font-weight:600; line-height:1.45; color:var(--rn-brand);}
.rn .co-tl b{display:block; margin-top:14px; font-size:15px; font-weight:700; line-height:1.4; color:var(--rn-ink);}
.rn .co-tl.is-short b{margin-top:8px; font-weight:600; color:var(--rn-ink2);}
.rn .co-tl li > p:last-child{margin-top:6px; font-size:13px; line-height:1.55; color:var(--rn-muted);}
.rn .co-tl li.is-now .yr{color:var(--rn-brand);}
.rn .co-foot{margin-top:40px; font-size:13px; line-height:1.7; color:var(--rn-muted);}
/* AI Labs: 어두운 영역, 오른쪽 순환도(5단계가 원 위에), 아래 원칙 3개 */
.rn .co-lab .rn-lab-nums{max-width:460px;}
.rn .co-cycle{margin:0;}
.rn .co-cycle-ring{position:relative; width:440px; height:440px; margin:0 auto;}
.rn .co-cycle-ring:before{content:""; position:absolute; inset:70px; border:1px dashed rgba(255,255,255,.3); border-radius:50%;}
.rn .co-cycle-ring:after{content:""; position:absolute; inset:70px; border:2px solid transparent; border-top-color:var(--rn-brand); border-radius:50%; animation:co-spin 12s linear infinite;}
.rn .co-cycle-core{position:absolute; z-index:1; inset:150px; display:flex; flex-direction:column; align-items:center; justify-content:center; border-radius:50%; background:radial-gradient(circle, rgba(0,172,238,.38), rgba(0,172,238,.06) 70%); text-align:center;}
.rn .co-cycle-core b{font-size:15px; font-weight:700; letter-spacing:.12em; color:#fff;}
.rn .co-cycle-core span{margin-top:2px; font-size:17px; font-weight:600; color:var(--rn-brand);}
.rn .co-cycle ol{margin:0; padding:0; list-style:none;}
.rn .co-cycle li{position:absolute; z-index:1; top:50%; left:50%; width:136px; padding:12px 10px; border:1px solid rgba(255,255,255,.2); background-color:#131d29; text-align:center; transform:translate(-50%,-50%) rotate(calc(var(--i) * 72deg)) translateY(-150px) rotate(calc(var(--i) * -72deg));}
.rn .co-cycle li em{display:block; font-size:11px; font-style:normal; font-weight:700; color:var(--rn-brand);}
.rn .co-cycle li b{display:block; margin-top:2px; font-size:15px; font-weight:600; color:#fff;}
.rn .co-cycle li span{display:block; margin-top:2px; font-size:11px; color:rgba(255,255,255,.6);}
.rn .co-cycle figcaption{margin-top:20px; font-size:14px; text-align:center; color:rgba(255,255,255,.65);}
@keyframes co-spin{to{transform:rotate(360deg);}}
.rn .co-lab .co-sub{color:rgba(255,255,255,.55);}
.rn .co-principles{display:grid; grid-template-columns:repeat(3,1fr); margin:20px 0 0; padding:0; list-style:none;}
.rn .co-principles li{padding:24px 28px 4px 0; border-top:1px solid rgba(255,255,255,.35);}
.rn .co-principles li + li{padding-left:28px; border-left:1px solid rgba(255,255,255,.12);}
.rn .co-principles .no{display:block; font-size:13px; font-weight:700; color:var(--rn-brand);}
.rn .co-principles b{display:block; margin-top:10px; font-size:19px; font-weight:600; color:#fff;}
.rn .co-principles p{margin-top:10px; font-size:15px; line-height:1.7; color:rgba(255,255,255,.7);}
/* 플래티어재팬: 사이트 화면(창 틀), 회사 정보, 제품 3개(누르지 않는 정보 판), 활동 연표 */
.rn .co-shot{border:1px solid var(--rn-line); background-color:#fff; box-shadow:0 24px 48px -28px rgba(15,20,27,.35);}
.rn .co-shot-bar{display:flex; align-items:center; gap:6px; height:30px; padding:0 12px; border-bottom:1px solid var(--rn-line); background-color:var(--rn-soft);}
.rn .co-shot-bar i{width:8px; height:8px; border-radius:50%; background-color:#cfd5dd;}
.rn .co-shot-bar span{margin-left:10px; font-size:12px; color:var(--rn-muted);}
.rn .co-facts{display:grid; grid-template-columns:repeat(4,1fr); margin:56px 0 0; border-top:1px solid var(--rn-ink);}
.rn .co-facts > div{padding:20px 24px 0 0;}
.rn .co-facts > div + div{padding-left:24px; border-left:1px solid var(--rn-line);}
.rn .co-facts dt{font-size:13px; font-weight:700; color:var(--rn-muted);}
.rn .co-facts dd{margin:8px 0 0; font-size:17px; font-weight:600; line-height:1.45; color:var(--rn-ink);}
.rn .co-prods{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:20px;}
.rn .co-prods > div{display:flex; flex-direction:column; padding:24px 24px 28px; border-top:2px solid var(--rn-ink); background-color:var(--rn-soft);}
.rn .co-prods .tag{font-size:12px; font-weight:700; letter-spacing:.04em; color:var(--rn-brand);}
.rn .co-prods h4{margin-top:8px; font-size:24px; font-weight:700; color:var(--rn-ink);}
.rn .co-prods b{margin-top:10px; font-size:16px; font-weight:600; line-height:1.45; color:var(--rn-ink);}
.rn .co-prods p{margin-top:8px; font-size:14px; line-height:1.65; color:var(--rn-ink2);}
.rn .co-prods .note{margin-top:12px; padding-top:10px; border-top:1px dashed #cfd5dd; font-size:13px; color:var(--rn-muted);}
@media (prefers-reduced-motion: reduce){ .rn .co-cycle-ring:after{animation:none;} }
@media (max-width:1023px){
.rn .co-detail{grid-template-columns:1fr; gap:40px;}
.rn .co-tl{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:12px;}
.rn .co-tl li{flex:0 0 180px; scroll-snap-align:start;}
.rn .co-tl.is-short li{flex-basis:200px;}
.rn .co-prods{grid-template-columns:1fr;}
.rn .co-facts{grid-template-columns:repeat(2,1fr);}
.rn .co-facts > div:nth-child(n+3){margin-top:20px;}
.rn .co-facts > div:nth-child(3){padding-left:0; border-left:0;}
}
@media (max-width:859px){
.rn .co-stats{grid-template-columns:repeat(2,1fr);}
.rn .co-stats > div, .rn .co-stats > div:not(:nth-child(3n+1)){padding:22px 16px 24px 0; border-left:0;}
.rn .co-stats > div:nth-child(2n){padding-left:16px; border-left:1px solid var(--rn-line);}
.rn .co-stats strong{font-size:38px;}
.rn .co-stats strong small{font-size:16px;}
.rn .co-principles{grid-template-columns:1fr;}
.rn .co-principles li, .rn .co-principles li + li{padding:22px 0; border-left:0;}
.rn .co-sub{margin-top:48px;}
.rn .co-jump{margin-top:28px;}
.rn .co-jump a{padding:8px 12px; font-size:13px;}
}
@media (max-width:767px){ /* 순환도: 원 대신 세로 목록 */
.rn .co-cycle-ring{width:auto; height:auto;}
.rn .co-cycle-ring:before, .rn .co-cycle-ring:after, .rn .co-cycle-core{display:none;}
.rn .co-cycle ol{display:grid; grid-template-columns:1fr; gap:8px;}
.rn .co-cycle li{position:static; min-height:0; display:flex; align-items:baseline; gap:10px; width:auto; padding:12px 14px; text-align:left; transform:none;}
.rn .co-cycle li b, .rn .co-cycle li span{margin-top:0;}
.rn .co-cycle figcaption{text-align:left;}
.rn .co-yr li{grid-template-columns:48px 1fr; font-size:14px;}
.rn .co-yr.is-wide li{grid-template-columns:1fr; gap:2px;}
.rn .co-facts dd{font-size:15px;}
}
/* 2026-11-01 새 디자인 페이지의 탭 메뉴(LNB = CMS 하위 메뉴: 회사소개·연혁·Contact Us 등): 첫 화면 아래로 옮기고 새 디자인 색으로 (사용자 요청) */
#container.rn{display:flex; flex-direction:column;}
#container.rn > .rn-hero{order:-1;}
.rn > .lnb_wrap{border-bottom:1px solid var(--rn-line); background-color:#fff;}
.rn > .lnb_wrap .lnb{display:flex; gap:8px; width:92%; max-width:1200px; margin:0 auto; text-align:left; font-size:0;}
.rn > .lnb_wrap .lnb li, .rn > .lnb_wrap .lnb li.on, .rn > .lnb_wrap .lnb li:hover{display:block; width:auto; height:auto; margin:0; border:0; background:none;}
.rn > .lnb_wrap .lnb li a{position:relative; display:block; padding:0 16px; line-height:64px; font-size:16px; font-weight:500; white-space:nowrap; color:var(--rn-muted); transition:color .2s;}
.rn > .lnb_wrap .lnb li:first-child a{padding-left:0;}
.rn > .lnb_wrap .lnb li a:after{content:""; position:absolute; right:16px; bottom:-1px; left:16px; height:3px; background-color:var(--rn-brand); transform:scaleX(0); transition:transform .25s;}
.rn > .lnb_wrap .lnb li:first-child a:after{left:0;}
.rn > .lnb_wrap .lnb li.on a{font-weight:700; color:var(--rn-ink);}
.rn > .lnb_wrap .lnb li.on a:after{transform:scaleX(1);}
@media (hover:hover){ .rn > .lnb_wrap .lnb li:hover a{font-weight:500; color:var(--rn-ink);} .rn > .lnb_wrap .lnb li.on:hover a{font-weight:700;} }
@media (max-width:859px){
.rn > .lnb_wrap .lnb{width:100%; padding:0 4%; overflow-x:auto; box-sizing:border-box; scrollbar-width:none;}
.rn > .lnb_wrap .lnb::-webkit-scrollbar{display:none;}
.rn > .lnb_wrap .lnb li a{padding:0 12px; line-height:52px; font-size:15px;}
.rn > .lnb_wrap .lnb li a:after{right:12px; left:12px;}
}
/* 2026-11-01 회사 메뉴 공통 첫 화면(.co-top = base/company_hero.html + 탭 메뉴): 옛 디자인 페이지(연혁·Contact Us)에서도 회사소개와 같은 위치·크기 */
#container:not(.rn) > .co-top{padding-top:80px;}
@media screen and (max-width:1399px){ #container:not(.rn) > .co-top{padding-top:60px;} }
/* 2026-11-01 지속가능경영(윤리헌장·인권헌장): 왼쪽 글·내려받기 카드, 오른쪽 확인서 */
.rn .sx-doc{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:64px; align-items:start;}
.rn .sx-doc .rn-lead{max-width:none;}
.rn a.sx-dl{display:flex; align-items:center; gap:16px; max-width:480px; margin-top:40px; padding:20px 24px; border:1px solid var(--rn-line); border-radius:16px; background-color:#fff; color:var(--rn-ink); transition:border-color .25s, box-shadow .25s, transform .25s;}
.rn .sx-dl-ico{flex:none; display:flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius:12px; background-color:rgba(0,172,238,.1); font-size:12px; font-weight:800; letter-spacing:.04em; color:var(--rn-brand);}
.rn .sx-dl-txt{flex:1;}
.rn .sx-dl-txt b{display:block; font-size:17px; font-weight:700;}
.rn .sx-dl-txt span{display:block; margin-top:4px; font-size:14px; color:var(--rn-muted);}
.rn a.sx-dl i{font-size:20px; font-style:normal; color:var(--rn-muted); transition:transform .25s, color .25s;}
.rn a.sx-dl:hover, .rn a.sx-dl:focus-visible{border-color:var(--rn-brand); box-shadow:0 20px 40px -24px rgba(0,120,170,.45); transform:translateY(-3px); outline:none;}
.rn a.sx-dl:hover i, .rn a.sx-dl:focus-visible i{color:var(--rn-brand); transform:translateY(3px);}
.rn .sx-cert{margin:0;}
.rn .sx-cert img{display:block; width:100%; height:auto; border:1px solid var(--rn-line); box-shadow:0 24px 48px -28px rgba(15,20,27,.35);}
.rn .sx-cert figcaption{margin-top:12px; font-size:13px; color:var(--rn-muted); text-align:center;}
/* 2026-11-01 COLABs 소개: 교육강좌 누르는 카드 2개, 교육장 사진 격자(큰 사진 1 + 5), 위치 */
.rn .cp-courses{display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:48px;}
.rn .cp-courses .rn-card{min-height:auto;}
.rn .cp-gallery{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:48px 0 0; padding:0; list-style:none;}
.rn .cp-gallery li{position:relative; overflow:hidden; aspect-ratio:16/10; background-color:#dfe3e8;}
.rn .cp-gallery li.is-main{grid-column:span 2; grid-row:span 2; aspect-ratio:auto;}
.rn .cp-gallery img{display:block; width:100%; height:100%; object-fit:cover;}
.rn .cp-gallery span{position:absolute; left:12px; bottom:12px; padding:4px 10px; background-color:rgba(11,17,24,.7); font-size:13px; font-weight:600; color:#fff;}
.rn .cp-loc{display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:40px; margin-top:48px; align-items:start;}
.rn .cp-map{min-height:360px; border:1px solid var(--rn-line); overflow:hidden;}
.rn .cp-map .root_daum_roughmap{width:100% !important;}
.rn .cp-map .root_daum_roughmap .wrap_map{height:360px !important;}
.rn .cp-info dl{margin:0; border-top:1px solid var(--rn-ink);}
.rn .cp-info dl > div{padding:20px 0; border-bottom:1px solid var(--rn-line);}
.rn .cp-info dt{font-size:13px; font-weight:700; color:var(--rn-muted);}
.rn .cp-info dd{margin:8px 0 0; font-size:16px; line-height:1.65; color:var(--rn-ink);}
.rn .cp-cta{margin-top:32px; padding:28px; background-color:var(--rn-night); color:#fff;}
.rn .cp-cta p{margin-bottom:20px; font-size:20px; font-weight:600; color:#fff;}
@media (max-width:1023px){
.rn .sx-doc{grid-template-columns:1fr; gap:40px;}
.rn .sx-cert{max-width:280px;}
.rn .cp-loc{grid-template-columns:1fr;}
}
@media (max-width:767px){
.rn .cp-courses{grid-template-columns:1fr;}
.rn .cp-gallery{grid-template-columns:repeat(2,1fr); gap:8px;}
.rn .cp-gallery li.is-main{grid-column:1 / -1; grid-row:auto; aspect-ratio:16/10;}
.rn .cp-gallery span{left:8px; bottom:8px; font-size:12px;}
.rn .sx-cert{max-width:240px;}
}
/* 2026-11-01 COLABs 교육강좌(campus_lecture): 강좌 바로가기, IDT 벤더 정보 판, 제품 교육(어두운 머리판 + 특장점 + 교육 과정 표) */
.rn .cp-jump{display:flex; flex-wrap:wrap; gap:8px; margin-top:32px;}
.rn .cp-jump a{padding:9px 16px; border:1px solid var(--rn-line); border-radius:999px; background-color:#fff; font-size:14px; font-weight:600; color:var(--rn-ink); transition:border-color .2s, color .2s;}
.rn .cp-jump a:hover, .rn .cp-jump a:focus-visible{border-color:var(--rn-brand); color:var(--rn-brand);}
.rn .cp-vendors{display:grid; grid-template-columns:repeat(2,1fr); gap:0 48px; margin-top:56px;}
.rn .cp-vendor{padding:28px 0; border-top:1px solid var(--rn-ink);}
.rn .cp-vendor img{display:block; width:auto; height:28px; mix-blend-mode:multiply;}
.rn .cp-vendor p{margin-top:16px; font-size:15px; line-height:1.7; color:var(--rn-ink2);}
.rn .cp-vendor .rn-chips{display:flex; flex-wrap:wrap; gap:6px; margin-top:16px;}
.rn .cp-prod{margin-top:72px; scroll-margin-top:90px;}
.rn .cp-prod:first-of-type{margin-top:56px;}
.rn .cp-prod-head{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px 40px; align-items:end; padding:36px 40px; background-color:var(--rn-night); color:#fff;}
.rn .cp-prod-head .rn-jn-logo{grid-column:1; height:28px;}
.rn .cp-prod-head .rn-jn-logo.is-x2bee{height:40px;}
.rn .cp-prod-head .rn-jn-logo.is-groobee{height:30px;}
.rn .cp-prod-head .tag{grid-column:1; margin-top:8px; font-size:13px; font-weight:700; letter-spacing:.04em; color:var(--rn-brand);}
.rn .cp-prod-head .desc{grid-column:1; max-width:720px; font-size:16px; line-height:1.7; color:rgba(255,255,255,.78);}
.rn .cp-prod-head .cta{grid-column:2; grid-row:1 / span 3; display:flex; flex-direction:column; gap:10px;}
.rn .cp-prod-head .rn-btn{justify-content:center;}
.rn .cp-prod .co-sub{margin-top:40px;}
.rn .cp-feats{display:grid; grid-template-columns:repeat(3,1fr); gap:0 32px; margin:16px 0 0; padding:0; list-style:none;}
.rn #xgen .cp-feats{grid-template-columns:repeat(4,1fr);}
.rn .cp-feats li{padding:20px 0 16px; border-top:1px solid var(--rn-ink);}
.rn .cp-feats .no{font-size:13px; font-weight:700; color:var(--rn-brand);}
.rn .cp-feats b{display:block; margin-top:6px; font-size:17px; font-weight:700; color:var(--rn-ink);}
.rn .cp-feats p{margin-top:8px; font-size:14px; line-height:1.65; color:var(--rn-ink2);}
.rn .cp-table{margin-top:16px; overflow-x:auto;}
.rn .cp-table table{width:100%; border-collapse:collapse; border-top:1px solid var(--rn-ink); font-size:15px;}
.rn .cp-table thead th{padding:14px 16px; border-bottom:1px solid var(--rn-line); background-color:var(--rn-soft); font-size:13px; font-weight:700; text-align:left; color:var(--rn-muted);}
.rn .cp-table tbody th{width:190px; padding:18px 16px; border-bottom:1px solid var(--rn-line); font-weight:700; text-align:left; vertical-align:top; color:var(--rn-ink);}
.rn .cp-table tbody th small{display:block; margin-top:4px; font-size:13px; font-weight:500; color:var(--rn-muted);}
.rn .cp-table td{padding:18px 16px; border-bottom:1px solid var(--rn-line); vertical-align:top; line-height:1.65; color:var(--rn-ink2);}
.rn .cp-table td ul{margin:0; padding:0; list-style:none;}
.rn .cp-table td li{position:relative; padding-left:14px;}
.rn .cp-table td li + li{margin-top:6px;}
.rn .cp-table td li:before{content:""; position:absolute; top:11px; left:0; width:5px; height:5px; border-radius:50%; background-color:var(--rn-brand);}
.rn .cp-table td b{color:var(--rn-ink);}
/* 2026-11-01 COLABs 문의하기(campus_inquire): 대관신청 및 문의는 맨 앞 가로 강조 카드(파란 바탕), 교육 문의 3개 */
.rn .cp-asks{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:48px;}
.rn .cp-ask{display:flex; flex-direction:column; justify-content:space-between; gap:28px; padding:28px; border:1px solid var(--rn-line); border-radius:16px; background-color:#fff;}
.rn .cp-ask .tag{font-size:13px; font-weight:600; line-height:1.5; color:var(--rn-brand);}
.rn .cp-ask h4{margin-top:8px; font-size:22px; font-weight:700; letter-spacing:-.01em; color:var(--rn-ink);}
.rn .cp-ask ul{margin:20px 0 0; padding:0; list-style:none;}
.rn .cp-ask li{display:flex; gap:12px; padding:6px 0; font-size:15px;}
.rn .cp-ask li span{flex:none; width:48px; font-size:13px; color:var(--rn-muted);}
.rn .cp-ask li a{color:var(--rn-ink); word-break:break-all;}
.rn .cp-ask li a:hover{color:var(--rn-brand);}
.rn .cp-ask > .rn-btn{align-self:flex-start;}
.rn .cp-ask.is-main{grid-column:1 / -1; flex-direction:row; align-items:center; padding:36px 40px; border:0; background:linear-gradient(120deg, #0b5ea3 0%, #0a87d0 100%); color:#fff;}
.rn .cp-ask.is-main .tag{color:#bfeaff;}
.rn .cp-ask.is-main h4{font-size:30px; color:#fff;}
.rn .cp-ask.is-main ul{display:flex; flex-wrap:wrap; gap:4px 32px;}
.rn .cp-ask.is-main li span{width:auto; color:rgba(255,255,255,.7);}
.rn .cp-ask.is-main li a{color:#fff;}
.rn .rn-btn.light{background-color:#fff; color:#0b5ea3;}
.rn .rn-btn.light:hover{background-color:#e6f6fd;}
.rn .cp-ask.is-main > .rn-btn{align-self:center; height:56px; padding:0 28px; font-size:16px;}
@media (max-width:1023px){
.rn .cp-prod-head{grid-template-columns:1fr; padding:28px;}
.rn .cp-prod-head .cta{grid-column:1; grid-row:auto; flex-direction:row; flex-wrap:wrap; margin-top:12px;}
.rn .cp-feats, .rn #xgen .cp-feats{grid-template-columns:repeat(2,1fr);}
.rn .cp-asks{grid-template-columns:1fr;}
.rn .cp-ask.is-main{flex-direction:column; align-items:flex-start; padding:28px;}
.rn .cp-ask.is-main > .rn-btn{align-self:flex-start;}
}
@media (max-width:767px){
.rn .cp-vendors{grid-template-columns:1fr;}
.rn .cp-feats, .rn #xgen .cp-feats{grid-template-columns:1fr;}
.rn .cp-prod-head .cta .rn-btn{flex:1 1 auto;}
.rn .cp-table table{min-width:560px;}
.rn #groobee .cp-table table, .rn #x2bee .cp-table table{min-width:0;}
.rn .cp-table tbody th{width:110px;}
.rn .cp-ask.is-main h4{font-size:24px;}
}
/* 2026-11-01 COLABs 문의 양식(X2BEE·XGEN 교육 문의, 대관신청 및 문의): 양식 구조는 그대로 두고 새 디자인 입력칸·버튼으로 (campus_inqury_form.css 위에 덮음) */
.rn .cp-form .inquiry_form, .rn .cp-form .inquiry_privacy{max-width:none; margin:48px 0 0;}
.rn .cp-form .inquiry_form > dt{margin:0 0 14px; font-size:17px; font-weight:700; color:var(--rn-ink);}
.rn .cp-form .inquiry_form > dt span{display:inline; margin-left:8px; font-size:14px; font-weight:400; color:var(--rn-muted);}
.rn .cp-form .inquiry_form > dd{margin-bottom:40px;}
.rn .cp-form .inquiry_form textarea{height:200px; padding:18px 20px; border:1px solid var(--rn-line); border-radius:12px; font-size:16px; line-height:1.6; transition:border-color .2s;}
.rn .cp-form .inquiry_form .basic_info{display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin:0;}
.rn .cp-form .inquiry_form .basic_info li{float:none; width:auto; padding:0; border:0;}
.rn .cp-form .inquiry_form .basic_info .etc_info{display:none;}
.rn .cp-form .inquiry_form .basic_info .etc_info.on{display:block;}
.rn .cp-form .inquiry_form .basic_info input, .rn .cp-form .inquiry_form .basic_info select,
.rn .cp-form .inquiry_form .rent_info input, .rn .cp-form .inquiry_form .rent_info select{width:100%; height:52px; padding:0 16px; border:1px solid var(--rn-line); border-radius:12px; background-color:#fff; font-size:16px; color:var(--rn-ink); transition:border-color .2s;}
.rn .cp-form .inquiry_form .rent_info{display:grid; grid-template-columns:minmax(0,1fr) 32px minmax(0,1fr); align-items:center; max-width:640px;}
.rn .cp-form .inquiry_form .rent_info li{width:auto; padding:0; border:0;}
.rn .cp-form .inquiry_form .rent_info li.date_middle{width:auto; font-size:18px; color:var(--rn-muted);}
.rn .cp-form textarea:focus, .rn .cp-form input:focus, .rn .cp-form select:focus{border-color:var(--rn-brand); outline:none;}
.rn .cp-form .inquiry_privacy textarea{height:160px; padding:18px 20px; border-radius:12px; background-color:var(--rn-soft); font-size:14px; line-height:1.7; color:var(--rn-ink2);}
.rn .cp-form .inquiry_privacy .privacy_agree{margin-top:14px; text-align:left;}
.rn .cp-form .inquiry_privacy .privacy_agree input{accent-color:var(--rn-brand);}
.rn .cp-form .inquiry_privacy .privacy_agree label{font-size:15px; font-weight:600; color:var(--rn-ink);}
.rn .cp-form .inquiry_submit{margin-top:40px; text-align:left;}
.rn .cp-form .inquiry_submit .submit_btn{display:inline-flex; align-items:center; justify-content:center; width:auto; min-width:200px; height:52px; margin:0; padding:0 32px; border-radius:999px; background-color:var(--rn-brand); font-size:16px; font-weight:700; line-height:1; color:#fff; transition:background-color .2s;}
.rn .cp-form .inquiry_submit .submit_btn:hover{background-color:#0098d4;}
@media (max-width:767px){
.rn .cp-form .inquiry_form .basic_info{grid-template-columns:1fr;}
.rn .cp-form .inquiry_submit .submit_btn{width:100%;}
}
/* 2026-11-01 뉴스룸(뉴스·콘텐츠·리소스·이벤트, #container.nr-page): 게시판 구조(legacy_board.html·legacy_history_event.html)는 그대로 두고 새 디자인 입힘. IR 등 다른 게시판은 해당 없음 */
.rn.nr-page > .contents, .rn.nr-page > section.contents{display:block; width:92%; max-width:1200px; margin:0 auto; padding:100px 0 120px;}
.rn.nr-page h3.con_title{margin:0 0 40px; font-size:44px; font-weight:500; line-height:1.25; letter-spacing:-.02em; text-align:left; color:var(--rn-ink);}
.rn.nr-page h3.con_title:before{content:"Newsroom"; display:block; margin-bottom:16px; font-size:15px; font-weight:700; letter-spacing:.01em; color:var(--rn-brand);}
.rn.nr-page h3.con_title:empty{display:none;}
/* 분류: 둥근 알약(누르는 것) */
.rn.nr-page .media_cate{display:flex; flex-wrap:wrap; justify-content:flex-start; gap:8px; width:auto; margin:0 0 20px;}
.rn.nr-page .media_cate li{float:none; width:auto; height:auto; margin:0; border:0;}
.rn.nr-page .media_cate li a{display:block; height:auto; padding:9px 18px; border:1px solid var(--rn-line); border-radius:999px; background-color:#fff; font-size:15px; font-weight:500; line-height:1.2; color:var(--rn-ink2); transition:border-color .2s, color .2s;}
.rn.nr-page .media_cate li a:hover{border-color:var(--rn-brand); color:var(--rn-brand);}
.rn.nr-page .media_cate li.on a{border-color:var(--rn-ink); background-color:var(--rn-ink); font-weight:600; color:#fff;}
/* 검색 */
.rn.nr-page .search_bar{width:100%; max-width:440px; margin:0 0 40px auto; overflow:visible;}
.rn.nr-page .search_bar form{display:flex; gap:8px;}
.rn.nr-page .search_bar select{float:none; flex:none; width:110px; height:48px; margin:0; padding:0 14px; border:1px solid var(--rn-line); border-radius:999px; background-color:#fff; font-size:15px; color:var(--rn-ink);}
.rn.nr-page .search_bar .input_wrap{float:none; flex:1; width:auto; height:48px; border:1px solid var(--rn-line); border-radius:999px; background-color:#fff; overflow:hidden;}
.rn.nr-page .search_bar .input_wrap:focus-within, .rn.nr-page .search_bar select:focus{border-color:var(--rn-brand); outline:none;}
.rn.nr-page .search_bar .input_wrap input{width:calc(100% - 52px); height:46px; padding:0 18px; font-size:15px; color:var(--rn-ink);}
.rn.nr-page .search_bar .input_wrap a{width:52px; height:46px; background-position:center; background-size:18px auto;}
/* 글 카드: 누르는 것 → 둥근 모서리·마우스오버·위로 뜸 */
.rn.nr-page .event_con{display:grid; grid-template-columns:repeat(3,1fr); gap:32px 24px; padding:32px 0 0; border-top:1px solid var(--rn-ink); overflow:visible;}
.rn.nr-page .event_con li, .rn.nr-page .event_con li:nth-child(even){float:none; width:auto; margin:0;}
.rn.nr-page .event_con li > a{display:flex; flex-direction:column; height:100%; color:var(--rn-ink);}
.rn.nr-page .event_con li .event_thum{position:relative; overflow:hidden; height:auto; aspect-ratio:5/3; border:1px solid var(--rn-line); border-radius:16px; background-color:var(--rn-soft); transition:border-color .25s, box-shadow .25s, transform .25s;}
.rn.nr-page .event_con li .event_thum img{display:block; width:100%; height:100%; object-fit:cover; transition:transform .4s;}
.rn.nr-page .event_con li:hover .event_thum{border-color:var(--rn-brand); box-shadow:0 24px 48px -28px rgba(0,120,170,.5); transform:translateY(-4px);}
.rn.nr-page .event_con li:hover .event_thum img{transform:scale(1.03);}
/* 2026-11-03 전략기획실 요청(리소스 썸네일 잘림): 칸 비율을 업로드 기준 900×540(5:3)에 맞추고,
   유튜브 썸네일(480×360, 위아래 검은 띠 안에 16:9 영상)은 띠가 칸 밖으로 나가도록 106.7% 너비로 가운데 맞춤 */
.rn.nr-page .event_con li .event_thum img[src*="img.youtube.com"]{position:absolute; left:50%; top:50%; width:106.7%; max-width:none; height:auto; margin:0; object-fit:fill; transform:translate(-50%,-50%);}
.rn.nr-page .event_con li:hover .event_thum img[src*="img.youtube.com"]{transform:translate(-50%,-50%) scale(1.03);}
.rn.nr-page .event_con li .event_info{height:auto; padding:18px 2px 0;}
.rn.nr-page .event_con li .event_info .event_cate{margin:0 0 6px; font-size:13px; font-weight:700; color:var(--rn-brand);}
.rn.nr-page .event_con li .event_info h4{display:-webkit-box; height:auto; margin:0; overflow:hidden; -webkit-line-clamp:2; -webkit-box-orient:vertical; font-size:18px; font-weight:600; line-height:1.45; letter-spacing:-.01em; color:var(--rn-ink); transition:color .2s;}
.rn.nr-page .event_con li:hover .event_info h4{color:var(--rn-brand);}
.rn.nr-page .event_con li .event_info p{margin-top:10px; font-size:14px; color:var(--rn-muted);}
.rn.nr-page .event_con li .event_info .event_state{margin:12px 0 0;}
.rn.nr-page .event_con li .event_info .event_state span{display:inline-block; width:auto; height:auto; padding:4px 12px; border-radius:999px; font-size:13px; line-height:1.4;}
.rn.nr-page .event_con li.no_data{grid-column:1 / -1;}
.rn.nr-page .event_con li.no_data .event_thum{display:none;}
.rn.nr-page .event_con li.no_data .event_info{padding:56px 0; text-align:center;}
.rn.nr-page .event_con li.no_data h4{font-size:16px; font-weight:500; color:var(--rn-muted);}
/* 쪽 번호 */
.rn.nr-page .paging{display:flex; justify-content:center; margin:64px auto 0;}
.rn.nr-page .paging ul{display:flex; gap:6px;}
.rn.nr-page .paging li{float:none; width:40px; height:40px; margin:0; border:1px solid var(--rn-line); border-radius:50%; overflow:hidden;}
.rn.nr-page .paging li a{line-height:38px; font-size:14px; color:var(--rn-ink2);}
.rn.nr-page .paging li:hover{border-color:var(--rn-brand);}
.rn.nr-page .paging li.on{border-color:var(--rn-ink); background-color:var(--rn-ink);}
.rn.nr-page .paging li.on a{color:#fff;}
/* 콘텐츠 상단 슬라이드 */
.rn.nr-page .board_slide{max-width:none; margin-bottom:40px; padding-top:0;}
.rn.nr-page .board_slide .slide_news_wrap{display:grid; grid-template-columns:1.2fr 1fr; padding-bottom:0; border-radius:16px; overflow:hidden; background-color:var(--rn-night);}
.rn.nr-page .board_slide .slide_news_con{position:static; display:flex; flex-direction:column; justify-content:center; padding:40px;}
.rn.nr-page .board_slide .slide_news_cate{width:auto; height:auto; padding:0; background:none; text-align:left; font-size:13px; line-height:1.4; color:var(--rn-brand);}
.rn.nr-page .board_slide .slide_news_txt dt{margin:10px 0 12px; font-size:24px; font-weight:600; line-height:1.4; color:#fff;}
.rn.nr-page .board_slide .slide_news_txt dd{font-size:15px; line-height:1.7; color:rgba(255,255,255,.72);}
.rn.nr-page .board_slide .swiper-pagination{bottom:20px; z-index:5;}
/* 글 보기 */
.rn.nr-page .board_cate_tt{margin:0 0 12px; font-size:14px; font-weight:700; text-align:left; color:var(--rn-brand);}
.rn.nr-page .board_view{max-width:880px; border-top:0;}
.rn.nr-page .board_view .board_tt{display:block; margin:0 0 32px; padding:0 0 28px; border-bottom:1px solid var(--rn-line);}
.rn.nr-page .board_view .board_tt h1{display:block; margin:0; font-size:36px; font-weight:600; line-height:1.35; letter-spacing:-.02em; color:var(--rn-ink);}
.rn.nr-page .board_view .board_tt p, .rn.nr-page .board_view .board_tt p.event_date{display:block; width:auto; margin-top:14px; font-size:15px; text-align:left; color:var(--rn-muted);}
.rn.nr-page .board_view > .file_down{padding:0 0 24px;}
.rn.nr-page .board_view .board_con{padding:0 0 56px; border-bottom:1px solid var(--rn-line); font-size:17px; line-height:1.85; color:var(--rn-ink2);}
.rn.nr-page .board_view .board_con img{max-width:100%; height:auto;}
.rn.nr-page .board_view .board_list li, .rn.nr-page .board_view .board_list li.prev, .rn.nr-page .board_view .board_list li.next{display:flex; gap:16px; padding:18px 0; border-bottom:1px solid var(--rn-line); background:none;}
.rn.nr-page .board_view .board_list li:before{flex:none; width:64px; font-size:13px; font-weight:700; color:var(--rn-muted);}
.rn.nr-page .board_view .board_list li.prev:before{content:"↑";}
.rn.nr-page .board_view .board_list li.next:before{content:"↓";}
.rn.nr-page .board_view .board_list li a{display:block; font-size:16px; color:var(--rn-ink);}
.rn.nr-page .board_view .board_list li a:hover{color:var(--rn-brand);}
.rn.nr-page .board_view .list_btn{margin-top:40px; text-align:left;}
.rn.nr-page .board_view .list_btn a{display:inline-flex; align-items:center; justify-content:center; width:auto; height:48px; padding:0 28px; border:1px solid var(--rn-ink); border-radius:999px; font-size:15px; font-weight:600; line-height:1; color:var(--rn-ink); transition:background-color .2s, color .2s;}
.rn.nr-page .board_view .list_btn a:hover{background-color:var(--rn-ink); color:#fff;}
@media (max-width:1023px){
.rn.nr-page .event_con{grid-template-columns:repeat(2,1fr);}
.rn.nr-page .board_slide .slide_news_wrap{grid-template-columns:1fr;}
}
@media (max-width:767px){
.rn.nr-page > .contents, .rn.nr-page > section.contents{padding:64px 0 80px;}
.rn.nr-page h3.con_title{font-size:30px; margin-bottom:28px;}
.rn.nr-page .media_cate{flex-wrap:nowrap; overflow-x:auto; margin-right:-4%; padding-right:4%; scrollbar-width:none;}
.rn.nr-page .media_cate::-webkit-scrollbar{display:none;}
.rn.nr-page .media_cate li a{white-space:nowrap;}
.rn.nr-page .search_bar{max-width:none;}
.rn.nr-page .event_con{grid-template-columns:1fr; gap:28px;}
.rn.nr-page .board_view .board_tt h1{font-size:26px;}
.rn.nr-page .board_view .board_con{font-size:16px;}
.rn.nr-page .board_slide .slide_news_con{padding:24px;}
.rn.nr-page .board_slide .slide_news_txt dt{font-size:19px;}
}
/* 뉴스룸 보정: 분류(왼쪽)·검색(오른쪽) 한 줄, 콘텐츠 상단 슬라이드 그림이 왼쪽 칸을 채우게 */
@media (min-width:768px){
.rn.nr-page .media_cate{float:left; max-width:calc(100% - 460px); margin:4px 0 32px;}
.rn.nr-page .search_bar{float:right; margin:0 0 32px;}
.rn.nr-page .event_con, .rn.nr-page .paging{clear:both;}
}
.rn.nr-page .board_slide{padding-top:0;}
.rn.nr-page .board_slide .slide_news_wrap{display:grid !important; grid-template-columns:1.15fr 1fr; flex-direction:initial;}
.rn.nr-page .board_slide .slide_news_wrap .slide_news_img{width:auto; min-height:340px;}
.rn.nr-page .board_slide .slide_news_wrap .thum_wrap{height:100%; padding-bottom:0;}
.rn.nr-page .board_slide .slide_news_wrap .thum_wrap > a{display:block; height:100%;}
.rn.nr-page .board_slide .slide_news_wrap .thum_img{inset:0;}
.rn.nr-page .board_slide .slide_news_wrap .slide_news_con{width:auto; padding:48px;}
.rn.nr-page .board_slide .slide_news_wrap .slide_news_cate{width:auto; height:auto; padding:0; background:none; font-size:13px; line-height:1.4; text-align:left; color:var(--rn-brand);}
.rn.nr-page .board_slide .slide_news_wrap .slide_news_txt dt{margin:12px 0 14px; font-size:26px; font-weight:600; color:#fff;}
.rn.nr-page .board_slide .slide_news_wrap .slide_news_txt dd{font-size:15px; color:rgba(255,255,255,.72);}
.rn.nr-page .board_slide .swiper-pagination{left:auto; right:24px; bottom:20px; width:auto;}
@media (max-width:1023px){ .rn.nr-page .board_slide .slide_news_wrap{grid-template-columns:1fr;} .rn.nr-page .board_slide .slide_news_wrap .slide_news_img{min-height:0; aspect-ratio:16/10;} .rn.nr-page .board_slide .slide_news_wrap .slide_news_con{padding:28px 24px 48px;} .rn.nr-page .board_slide .slide_news_wrap .slide_news_txt dt{font-size:20px;} }
.rn.nr-page .board_slide .slide_news_wrap .slide_news_img{min-height:0; aspect-ratio:16/10;}
@media (max-width:767px){ .rn.nr-page .paging ul{flex-wrap:wrap; justify-content:center; gap:4px;} .rn.nr-page .paging li{width:34px; height:34px;} .rn.nr-page .paging li a{line-height:32px; font-size:13px;} }
/* 2026-11-01 일본어 뉴스(영문 뉴스 함께 표시): 영문 기사 원문 안내·日本語で読む(Google 번역) 버튼 */
.rn.nr-page .nr-original{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 20px; margin:-8px 0 32px; padding:16px 20px; border-radius:12px; background-color:var(--rn-soft);}
.rn.nr-page .nr-original p{font-size:14px; color:var(--rn-ink2);}
.rn.nr-page a.nr-original-btn{display:inline-flex; align-items:center; gap:8px; height:44px; padding:0 22px; border-radius:999px; background-color:var(--rn-brand); font-size:15px; font-weight:700; color:#fff; transition:background-color .2s;}
.rn.nr-page a.nr-original-btn:after{content:"↗";}
.rn.nr-page a.nr-original-btn:hover{background-color:#0098d4;}
/* 2026-11-01 영·일 뉴스는 회사소개 하위 메뉴(뉴스룸 메뉴 없음) → 섹션 머리를 "Press & Media"로 */
html[lang="en"] .rn.nr-page h3.con_title:before, html[lang="ja"] .rn.nr-page h3.con_title:before{content:"Press & Media";}
/* 2026-11-01 영·일 프레스릴리즈 목록: 업로드 그림 대신 자동 글자 카드(국문 카드와 같은 모양, 그 언어 제목) — 사용자 결정 ② */
.rn.nr-page .event_con li .event_thum.nr-card{display:flex; flex-direction:column; padding:7% 6% 5%; background:linear-gradient(110deg, #a6c4fb 0%, #c4e4fc 100%); container-type:inline-size;}
.rn.nr-page .event_con li .event_thum.nr-card.is-media{background:linear-gradient(110deg, #7fe0b4 0%, #a8e6f0 100%);}
.rn.nr-page .nr-card-tag{align-self:flex-end; padding:3px 9px; border:1.5px solid #2a2f3a; border-radius:7px; font-size:clamp(11px, 3.6cqi, 15px); font-weight:500; line-height:1.3; color:#1f2430;}
.rn.nr-page .nr-card-title{display:-webkit-box; margin-top:5%; overflow:hidden; -webkit-line-clamp:3; -webkit-box-orient:vertical; font-size:clamp(15px, 5.6cqi, 24px); font-weight:500; line-height:1.4; letter-spacing:-.01em; color:#1b2030; word-break:keep-all;}
.rn.nr-page .nr-card-foot{display:flex; align-items:center; justify-content:space-between; margin-top:auto; padding-top:4%; border-top:1px solid rgba(27,32,48,.35);}
.rn.nr-page .event_con li .event_thum.nr-card .nr-card-foot img{width:auto; height:clamp(10px, 4cqi, 16px); object-fit:contain; filter:brightness(0); opacity:.8; transition:none;}
.rn.nr-page .nr-card-foot span{font-size:clamp(10px, 3.4cqi, 14px); font-weight:600; color:#1f2430;}
.rn.nr-page .event_con li:hover .event_thum.nr-card img{transform:none;}
/* 영·일 보도자료 글 보기: 본문 첫 카드 그림(한국어) 대신 같은 모양의 자동 카드(큰 크기) */
.rn.nr-page .board_view .nr-card-lg{display:flex; flex-direction:column; max-width:880px; aspect-ratio:900/540; margin:0 0 40px; padding:7% 6% 5%; border-radius:16px; background:linear-gradient(110deg, #a6c4fb 0%, #c4e4fc 100%); container-type:inline-size;}
.rn.nr-page .board_view .nr-card-lg.is-media{background:linear-gradient(110deg, #7fe0b4 0%, #a8e6f0 100%);}
.rn.nr-page .board_view .nr-card-lg .nr-card-foot img{width:auto; height:clamp(12px, 3.6cqi, 26px); filter:brightness(0); opacity:.8;}
.rn.nr-page .board_view .nr-card-lg .nr-card-title{-webkit-line-clamp:4;}
.rn.nr-page .board_view .nr-card-lg .nr-card-title{font-size:clamp(18px, 5cqi, 42px);}
.rn.nr-page .board_view .nr-card-lg .nr-card-tag{font-size:clamp(11px, 2.6cqi, 22px); padding:.3em .7em; border-radius:10px;}
.rn.nr-page .board_view .nr-card-lg .nr-card-foot span{font-size:clamp(10px, 2.2cqi, 19px);}
@media (max-width:767px){ .rn.nr-page .board_view .nr-card-lg{aspect-ratio:auto; min-height:210px; gap:12px;} .rn.nr-page .board_view .nr-card-lg .nr-card-title{-webkit-line-clamp:5;} }

/* 2026-11-01 홈 모바일(사용자 지적: 스크롤 두세 번 전까지 검정 화면만 이어짐)
   - 어두운 첫 화면 배너 바로 아래 여정 섹션을 휴대폰에서만 연회색 바탕 + 흰 카드로 (PC·태블릿은 어두운 그대로)
   - 여정 섹션 길이 줄이기: 아이콘 56→40px, 번호와 단계 이름을 한 줄로, 제품 카드 여백·글자 축소 */
@media (max-width:767px){
.rn .rn-feat.dark.rn-jn-sec{padding:56px 0; background:radial-gradient(ellipse 90% 40% at 100% 0%, rgba(0,172,238,.10), rgba(0,172,238,0) 70%), var(--rn-soft); color:var(--rn-ink);}
.rn .rn-feat.dark.rn-jn-sec .rn-feat-title{color:var(--rn-ink);}
.rn .rn-feat.dark.rn-jn-sec .rn-feat-lead{color:var(--rn-ink2);}
.rn .rn-jn-head{gap:14px;}
.rn .rn-jn-head .rn-feat-cta{margin-top:20px;}
.rn .rn-journey{margin-top:32px;}
.rn .rn-jn-steps::before{top:20px; bottom:20px; left:19px;}
.rn .rn-jn-step{grid-template-columns:40px auto 1fr; column-gap:10px; align-items:center; padding-bottom:20px;}
.rn .rn-jn-ico{border-color:rgba(0,172,238,.45); background-color:#fff; color:var(--rn-brand);}
.rn .rn-jn-ico:not(.sm), .rn .rn-jn-ico.sm{grid-row:auto; width:40px; height:40px;}
.rn .rn-jn-ico svg, .rn .rn-jn-ico.sm svg{width:20px; height:20px;}
.rn .rn-jn-no{grid-column:2; margin-top:0; font-size:13px;}
.rn .rn-jn-name{grid-column:3; margin-top:0; font-size:19px; color:var(--rn-ink);}
.rn .rn-jn-prods{grid-column:2 / -1; gap:8px; margin-top:10px;}
.rn .rn-jn-prod{gap:2px; padding:11px 36px 11px 14px; border-color:var(--rn-line); background-color:#fff; color:var(--rn-ink); box-shadow:0 1px 2px rgba(15,20,27,.04);}
.rn .rn-jn-prod .cap{font-size:12px; color:var(--rn-muted);}
.rn .rn-jn-prod b{min-height:24px; font-size:16px; color:var(--rn-ink);}
.rn .rn-jn-prod i{right:14px; bottom:50%; transform:translateY(50%);}
.rn .rn-jn-prod:hover, .rn .rn-jn-prod:active, .rn .rn-jn-prod:focus-visible{background-color:#f0faff;}
.rn .rn-jn-prod:hover i, .rn .rn-jn-prod:active i, .rn .rn-jn-prod:focus-visible i{transform:translate(4px,50%);}
.rn .rn-jn-logo{filter:brightness(0);} /* 흰색 로고 파일을 밝은 카드 위에서 검정으로 */
.rn .rn-jn-logo{height:17px;}
.rn .rn-jn-logo.is-genser{height:16px;}
.rn .rn-jn-prod b.has-genser .rn-jn-logo{vertical-align:-4px;}
.rn .rn-jn-logo.is-x2bee{height:27px;}
.rn .rn-jn-logo.is-xgen{height:17px;}
.rn .rn-jn-logo.is-gelatto{height:20px;}
.rn .rn-jn-logo.is-groobee{height:21px;}
.rn .rn-jn-base{gap:20px; margin-top:4px; padding-top:20px; border-top-color:rgba(15,20,27,.1);}
.rn .rn-jn-base-item{display:grid; grid-template-columns:40px 1fr; column-gap:10px; row-gap:10px; align-items:center;}
.rn .rn-jn-base-name{font-size:16px; color:var(--rn-ink);}
.rn .rn-jn-base .rn-jn-prod{grid-column:2;}
.rn .rn-jn-hint{margin-top:16px; color:var(--rn-muted);}
.rn .rn-journey.is-in .rn-jn-ico:not(.sm){animation-name:rnJnLitLight;}
}
@keyframes rnJnLitLight{0%, 30%, 100%{background-color:#fff; color:var(--rn-brand); box-shadow:none;} 6%, 22%{background-color:var(--rn-brand); color:#fff; box-shadow:0 0 0 6px rgba(0,172,238,.14);}}

/* 2026-11-01 첫 화면 배너 ↔ 여정 섹션 경계 (사용자 선택 ①+④, PC·태블릿) — 2026-11-01 다시 작성(사용자 지적: 다시 올라왔을 때 세로선이 다시 내려오지 않음)
   - 바탕을 배너보다 한 단계 밝은 남색(#0f1722)으로
   - 순서: 가운데 섬광 → 하늘색 빛줄기가 양쪽 끝으로 펼쳐짐 → 아래로 빛 번짐 → (1024px 이상) 가운데 세로선이 유성처럼 천천히 내려와 여정 가로선과 만나고 점
   - 모든 조각이 키프레임 애니메이션(fill both)이라 .is-play를 떼었다 붙이면 처음 모습으로 돌아가 다시 전부 재생된다.
     main_home.js initDivider가 처음 보일 때, 그리고 스크롤을 올려 경계선이 상단 메뉴 아래로 다시 나타날 때마다 .is-play를 다시 붙인다
   - 요소는 main_home.js가 넣는다. 휴대폰(밝은 여정 섹션)은 표시 안 함 */
.rn .rn-jn-glow, .rn .rn-jn-beam, .rn .rn-jn-flare, .rn .rn-jn-thread, .rn .rn-jn-meteor, .rn .rn-jn-node{display:none;}
@media (min-width:768px){
.rn .rn-feat.dark.rn-jn-sec{position:relative; background:#0f1722;}
.rn .rn-jn-sec > .rn-wrap{position:relative; z-index:1;}
.rn .rn-jn-glow, .rn .rn-jn-beam, .rn .rn-jn-flare{display:block; position:absolute; top:0; left:50%; pointer-events:none;}
.rn .rn-jn-glow{width:80%; height:320px; margin-left:-40%; background:radial-gradient(ellipse 50% 100% at 50% 0%, rgba(0,172,238,.28), rgba(0,172,238,0) 70%); opacity:0;}
.rn .rn-jn-beam{left:0; right:0; height:1px; background:linear-gradient(90deg, rgba(0,172,238,0), rgba(0,172,238,.75) 22%, #c4f0ff 50%, rgba(0,172,238,.75) 78%, rgba(0,172,238,0)); box-shadow:0 0 10px 1px rgba(0,172,238,.45); transform:scaleX(0);}
.rn .rn-jn-flare{width:8px; height:8px; margin:-4px 0 0 -4px; border-radius:50%; background:#e6f9ff; box-shadow:0 0 12px 4px rgba(127,220,255,.9), 0 0 48px 16px rgba(0,172,238,.45); opacity:0; transform:scale(.2);}
.rn .rn-jn-sec.is-play .rn-jn-flare{animation:rnDvFlare 1.8s ease-out .2s both;}
.rn .rn-jn-sec.is-play .rn-jn-beam{animation:rnDvBeam 1.2s cubic-bezier(.2,.8,.2,1) .45s both;}
.rn .rn-jn-sec.is-play .rn-jn-glow{animation:rnDvGlow 1.6s ease .9s both;}
}
@media (min-width:1024px){
.rn .rn-jn-thread{display:block; position:absolute; top:0; left:50%; width:1px; margin-left:-.5px; background:linear-gradient(180deg, rgba(127,220,255,.85), rgba(0,172,238,.35)); clip-path:inset(0 0 100% 0); pointer-events:none;}
/* 세로선은 천천히(2.8초), 끝에 유성(밝은 머리 + 위로 흐려지는 꼬리)이 선과 같은 속도·곡선으로 내려간다 */
.rn .rn-jn-meteor{display:block; position:absolute; top:0; left:50%; width:2px; height:140px; margin-left:-1px; background:linear-gradient(180deg, rgba(127,220,255,0), rgba(127,220,255,.55) 55%, #e6f9ff); border-radius:2px; opacity:0; transform:translateY(-140px); pointer-events:none;}
.rn .rn-jn-meteor::after{content:""; position:absolute; bottom:-3px; left:50%; width:6px; height:6px; margin-left:-3px; border-radius:50%; background:#fff; box-shadow:0 0 8px 3px rgba(196,240,255,.95), 0 0 26px 8px rgba(0,172,238,.55);}
.rn .rn-jn-node{display:block; position:absolute; left:50%; width:9px; height:9px; margin:-4.5px 0 0 -4.5px; border-radius:50%; background:#7fdcff; box-shadow:0 0 0 5px rgba(0,172,238,.16), 0 0 18px rgba(0,172,238,.7); z-index:2; opacity:0; transform:scale(0); pointer-events:none;}
.rn .rn-jn-sec.is-play .rn-jn-thread{animation:rnDvThread 2.8s cubic-bezier(.45,0,.3,1) 1.1s both;}
.rn .rn-jn-sec.is-play .rn-jn-meteor{animation:rnDvMeteor 2.8s cubic-bezier(.45,0,.3,1) 1.1s both, rnDvMeteorFade 2.8s linear 1.1s both;}
.rn .rn-jn-sec.is-play .rn-jn-node{animation:rnDvNode .4s cubic-bezier(.3,1.6,.5,1) 3.8s both;}
}
@keyframes rnDvFlare{0%{opacity:0; transform:scale(.2);} 18%{opacity:1; transform:scale(1.6);} 100%{opacity:.55; transform:scale(1);}}
@keyframes rnDvBeam{from{transform:scaleX(0);} to{transform:scaleX(1);}}
@keyframes rnDvGlow{from{opacity:0;} to{opacity:1;}}
@keyframes rnDvThread{from{clip-path:inset(0 0 100% 0);} to{clip-path:inset(0);}}
@keyframes rnDvMeteor{from{transform:translateY(-140px);} to{transform:translateY(calc(var(--jn-y, 300px) - 140px));}}
@keyframes rnDvMeteorFade{0%{opacity:0;} 6%{opacity:1;} 90%{opacity:1;} 100%{opacity:0;}}
@keyframes rnDvNode{from{opacity:0; transform:scale(0);} to{opacity:1; transform:none;}}
@media (prefers-reduced-motion: reduce){ /* 움직임 없이 마지막 모습만 */
.rn .rn-jn-sec.is-play .rn-jn-flare, .rn .rn-jn-sec.is-play .rn-jn-beam, .rn .rn-jn-sec.is-play .rn-jn-glow, .rn .rn-jn-sec.is-play .rn-jn-thread, .rn .rn-jn-sec.is-play .rn-jn-meteor, .rn .rn-jn-sec.is-play .rn-jn-node{animation:none;}
.rn .rn-jn-sec.is-play .rn-jn-flare{opacity:.55; transform:none;}
.rn .rn-jn-sec.is-play .rn-jn-beam{transform:none;}
.rn .rn-jn-sec.is-play .rn-jn-glow{opacity:1;}
.rn .rn-jn-sec.is-play .rn-jn-thread{clip-path:none;}
.rn .rn-jn-sec.is-play .rn-jn-node{opacity:1; transform:none;}
}

/* 2026-11-01 홈 Enterprise AX(국문): AI Labs 판 자리에 XGEN 소개 영상 카드 + 그 아래 AI Labs 한 줄(사용자 결정 A안)
   - 카드는 썸네일만 보여 주고, 누르면 화면 위 팝업(.rn-xv-modal, main_home.js initVideo)에서 YouTube 재생
   - 스크립트가 없으면 카드가 YouTube 링크로 동작 */
.rn .rn-xv{display:flex; flex-direction:column; min-width:0;}
.rn .rn-xv-card{position:relative; display:block; overflow:hidden; aspect-ratio:16/9; background:#000; color:#fff; -webkit-tap-highlight-color:transparent;}
.rn .rn-xv-card img{display:block; width:100%; height:100%; object-fit:cover; transition:transform .5s ease, opacity .3s;}
.rn .rn-xv-card::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.72)); pointer-events:none;}
.rn .rn-xv-play{position:absolute; top:50%; left:50%; z-index:1; display:flex; justify-content:center; align-items:center; width:72px; height:72px; margin:-36px 0 0 -36px; border-radius:50%; background:rgba(0,172,238,.92); box-shadow:0 0 0 8px rgba(0,172,238,.22), 0 12px 32px rgba(0,0,0,.45); transition:transform .25s ease, box-shadow .25s ease;}
.rn .rn-xv-play svg{width:28px; height:28px; margin-left:3px; fill:#fff;}
.rn .rn-xv-cap{position:absolute; left:20px; right:20px; bottom:16px; z-index:1; display:flex; flex-direction:column; gap:2px;}
.rn .rn-xv-cap b{font-size:17px; font-weight:700; color:#fff;}
.rn .rn-xv-cap span{font-size:13px; color:rgba(255,255,255,.75);}
.rn .rn-xv-card:hover img, .rn .rn-xv-card:active img, .rn .rn-xv-card:focus-visible img{transform:scale(1.04);}
.rn .rn-xv-card:hover .rn-xv-play, .rn .rn-xv-card:active .rn-xv-play, .rn .rn-xv-card:focus-visible .rn-xv-play{transform:scale(1.08); box-shadow:0 0 0 12px rgba(0,172,238,.25), 0 12px 32px rgba(0,0,0,.45);}
.rn .rn-xv-card:focus-visible{outline:2px solid var(--rn-brand); outline-offset:3px;}
.rn .rn-xv-more{align-self:flex-end; margin-top:10px; font-size:13px; color:rgba(255,255,255,.6); transition:color .2s;}
.rn .rn-xv-more:hover, .rn .rn-xv-more:active, .rn .rn-xv-more:focus-visible{color:#fff;}
.rn .rn-xv .rn-lab-line{display:grid; grid-template-columns:auto 1fr auto; align-items:center; column-gap:20px; row-gap:6px; margin-top:20px; padding:18px 20px; background-color:rgba(255,255,255,.06);}
.rn .rn-xv .rn-lab-name{font-size:14px; white-space:nowrap;}
.rn .rn-xv .rn-lab-nums{display:flex; gap:18px; margin:0; padding:0; list-style:none;}
.rn .rn-xv .rn-lab-nums li{display:flex; align-items:baseline; gap:6px;}
.rn .rn-xv .rn-lab-nums strong{display:inline; font-size:20px; line-height:1;}
.rn .rn-xv .rn-lab-nums span{display:inline; margin-top:0; font-size:12px; white-space:nowrap;}
.rn .rn-xv .rn-lab-link{font-size:13px; font-weight:600; color:#fff; white-space:nowrap; transition:color .2s;}
.rn .rn-xv .rn-lab-link:hover, .rn .rn-xv .rn-lab-link:active, .rn .rn-xv .rn-lab-link:focus-visible{color:var(--rn-brand);}
.rn .rn-xv .rn-lab-basis{grid-column:1 / -1; margin:0; font-size:11px;}
@media (max-width:1199px){ .rn .rn-xv .rn-lab-line{grid-template-columns:1fr auto;} .rn .rn-xv .rn-lab-nums{grid-column:1 / -1; grid-row:2;} }
@media (max-width:767px){
.rn .rn-xv-play{width:60px; height:60px; margin:-30px 0 0 -30px;}
.rn .rn-xv-play svg{width:24px; height:24px;}
.rn .rn-xv-cap{left:14px; right:14px; bottom:12px;}
.rn .rn-xv-cap b{font-size:15px;}
.rn .rn-xv-cap span{font-size:12px;}
.rn .rn-xv .rn-lab-line{padding:16px;}
.rn .rn-xv .rn-lab-nums{gap:14px;}
}
/* 재생 팝업: 화면을 어둡게 덮고 가운데 16:9 영상, 닫기(×)·Esc·바깥 누르기로 닫힘 (<dialog>) */
.rn-xv-modal{width:min(960px, 88vw); max-width:none; padding:0; border:0; background:transparent; overflow:visible;}
/* 2026-11-01 사용자 요청: 뒤 홈페이지가 보이는 오버레이 → 배경은 옅게만(블러 없음), 영상 판에 테두리·그림자로 떠 보이게 */
.rn-xv-modal::backdrop{background:rgba(5,9,14,.38);}
.rn-xv-modal .rn-xv-frame{position:relative; aspect-ratio:16/9; background:#000; outline:1px solid rgba(255,255,255,.18); box-shadow:0 30px 90px rgba(0,0,0,.55), 0 0 0 6px rgba(0,172,238,.12);}
.rn-xv-modal iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}
.rn-xv-modal .rn-xv-close{position:absolute; top:-48px; right:0; display:flex; justify-content:center; align-items:center; width:40px; height:40px; border:0; border-radius:50%; background:rgba(15,20,27,.82); box-shadow:0 4px 14px rgba(0,0,0,.35); color:#fff; font-size:22px; line-height:1; cursor:pointer;}
.rn-xv-modal .rn-xv-close:hover, .rn-xv-modal .rn-xv-close:focus-visible{background:var(--rn-brand, #00acee); outline:none;}
@media (prefers-reduced-motion: reduce){ .rn .rn-xv-card img, .rn .rn-xv-play{transition:none;} }

/* 2026-11-01 홈 Commerce AX Engineering·AI Software Infrastructure 보강(사용자 요청: 너무 축약, 오른쪽 빈약)
   - 정보 줄(.rn-tiles.is-num): 번호 + 이름 + 한 줄 설명. AI 소프트웨어 인프라는 2×2(.is-grid)
   - 섹션 아래 근거 띠(.rn-proof): 수치 4칸 + 기준 + (IDT) 글로벌 파트너 로고 9곳. 최상급 표현은 사용자 결정(2026-11-01) */
.rn .rn-tiles.is-num{counter-reset:rnTile;}
.rn .rn-tiles.is-num .rn-tile{position:relative; padding:20px 0 20px 44px; counter-increment:rnTile;}
.rn .rn-tiles.is-num .rn-tile::before{content:counter(rnTile, decimal-leading-zero); position:absolute; left:0; top:22px; font-size:13px; font-weight:700; color:var(--rn-brand);}
.rn .rn-tiles.is-num .rn-tile span{font-size:15px;}
@media (min-width:1024px){
.rn .rn-tiles.is-grid{grid-template-columns:1fr 1fr; column-gap:32px;}
.rn .rn-tiles.is-grid .rn-tile{padding:22px 0 22px 0;}
.rn .rn-tiles.is-grid .rn-tile::before{position:static; display:block; margin-bottom:10px;}
}
.rn .rn-proof{margin-top:56px; padding-top:32px; border-top:1px solid var(--rn-line);}
.rn .rn-proof-nums{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:24px; margin:0; padding:0; list-style:none;}
.rn .rn-proof-nums li{display:flex; flex-direction:column; gap:8px;}
.rn .rn-proof-nums strong{font-size:40px; font-weight:700; line-height:1; letter-spacing:-.02em; color:var(--rn-ink);}
.rn .rn-proof-nums span{font-size:14px; line-height:1.5; color:var(--rn-ink2);}
.rn .rn-proof-basis{margin-top:18px; font-size:12px; color:var(--rn-muted);}
.rn .rn-proof-partners{display:grid; grid-template-columns:auto 1fr; align-items:center; gap:24px; margin-top:28px;}
.rn .rn-proof-partners p{font-size:13px; font-weight:700; color:var(--rn-ink); white-space:nowrap;}
.rn .rn-proof-partners ul{display:grid; grid-template-columns:repeat(10, minmax(0,1fr)); gap:8px; margin:0; padding:0; list-style:none;}
.rn .rn-proof-partners li{display:flex; justify-content:center; align-items:center; height:52px; padding:0 10px; background:#fff; border:1px solid var(--rn-line);}
.rn .rn-proof-partners img{display:block; width:100%; max-width:110px; height:auto; filter:grayscale(1); opacity:.9; transition:filter .2s, opacity .2s;}
.rn .rn-proof-partners li:hover img, .rn .rn-proof-partners li:active img{filter:none; opacity:1;}
@media (max-width:1199px){ .rn .rn-proof-partners{grid-template-columns:1fr; gap:12px;} .rn .rn-proof-partners ul{grid-template-columns:repeat(5, minmax(0,1fr));} }
@media (max-width:767px){
.rn .rn-proof{margin-top:40px; padding-top:24px;}
.rn .rn-proof-nums{grid-template-columns:1fr 1fr; gap:20px 16px;}
.rn .rn-proof-nums strong{font-size:30px;}
.rn .rn-proof-nums span{font-size:13px;}
.rn .rn-proof-partners ul{grid-template-columns:repeat(2, minmax(0,1fr));} /* 2026-11-03 Workday 추가로 10개: 2칸 × 5줄 */
.rn .rn-proof-partners li{height:46px;}
.rn .rn-tiles.is-num .rn-tile{padding:18px 0 18px 36px;}
.rn .rn-tiles.is-num .rn-tile::before{top:20px;}
}
/* 2026-11-01 Commerce AX Engineering 아래: 숫자 띠(하단 Experience와 겹침, 사용자 지적) 대신 X2BEE 구조 그림 + 8대 기능 영역·MACH·GS인증 (사용자 선택 A안) */
.rn .rn-xmap{display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:48px; align-items:center; margin-top:56px; padding-top:40px; border-top:1px solid var(--rn-line);}
.rn .rn-xmap-fig{margin:0;}
.rn .rn-xmap-fig img{display:block; width:100%; height:auto; border:1px solid var(--rn-line);}
.rn .rn-xmap-fig figcaption{display:block; margin-top:10px; font-size:13px; color:var(--rn-muted);}
.rn .rn-xmap-h{font-size:13px; font-weight:700; letter-spacing:.01em; color:var(--rn-ink);}
.rn .rn-xmap-h + ul{margin:12px 0 0; padding:0; list-style:none;}
.rn .rn-xmap-h:not(:first-child){margin-top:24px;}
.rn .rn-xmap-areas{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:6px;}
.rn .rn-xmap-areas li{display:flex; justify-content:center; align-items:center; min-height:44px; padding:6px 8px; border:1px solid var(--rn-line); background:var(--rn-soft); font-size:14px; font-weight:600; line-height:1.3; text-align:center; color:var(--rn-ink); word-break:keep-all;}
.rn .rn-xmap-mach{display:flex; flex-wrap:wrap; gap:6px 14px;}
.rn .rn-xmap-mach li{position:relative; padding-left:12px; font-size:14px; color:var(--rn-ink2);}
.rn .rn-xmap-mach li::before{content:""; position:absolute; left:0; top:.6em; width:5px; height:5px; border-radius:50%; background:var(--rn-brand);}
.rn .rn-xmap-cert{display:inline-flex; align-items:baseline; gap:10px; margin-top:24px; padding:10px 16px; border:1px solid var(--rn-ink);}
.rn .rn-xmap-cert b{font-size:15px; font-weight:700; color:var(--rn-ink);}
.rn .rn-xmap-cert span{font-size:12px; color:var(--rn-muted);}
@media (max-width:1199px){ .rn .rn-xmap{grid-template-columns:1fr; gap:32px;} }
@media (max-width:767px){
.rn .rn-xmap{margin-top:40px; padding-top:28px;}
.rn .rn-xmap-areas{grid-template-columns:repeat(2, minmax(0,1fr));}
.rn .rn-xmap-areas li{min-height:40px; font-size:13px;}
}
/* 2026-11-01 GS인증 1등급 공식 마크(company/certif01.png, 회사소개 인증 칸과 같은 파일)를 X2BEE·XGEN 인증 배지에 (사용자 요청)
   - 원본이 121×79라 원래 크기 이하(높이 48px)로만 쓴다. 투명 바탕이라 흰 판 위에 둔다 */
.rn .rn-gs-mark{display:flex; justify-content:center; align-items:center; flex:none; width:84px; height:56px; padding:4px; box-sizing:border-box; background:#fff;}
.rn .rn-gs-mark img{display:block; width:auto; height:48px; max-width:100%;}
.rn .rn-xmap-cert{display:inline-flex; align-items:center; gap:14px; padding:8px 18px 8px 8px;}
.rn .rn-xmap-cert > div{display:flex; flex-direction:column; gap:2px;}
.rn .rn-xmap-cert .rn-gs-mark{border:1px solid var(--rn-line);}
.rn .rn-fin-cert.has-mark{flex-direction:row; align-items:center; gap:14px; padding:8px 18px 8px 8px;}
.rn .rn-fin-cert.has-mark > div{display:flex; flex-direction:column; align-items:flex-end;}
@media (max-width:767px){ .rn .rn-fin-cert.has-mark > div{align-items:flex-start;} }
/* 2026-11-01 사용자 요청 "GS인증이 있다는 표식은 조금 작게… 그냥 알 수 있는 정도로. 너무 부각하면 없어보입니다"
   → 테두리 상자 없이 작은 마크(높이 22px) + 작은 글자 한 줄 */
.rn .rn-gs-mark{width:auto; height:auto; padding:2px 4px; border:0 !important; border-radius:2px;}
.rn .rn-gs-mark img{height:22px;}
.rn .rn-xmap-cert, .rn .rn-fin-cert.has-mark{gap:8px; padding:0; border:0; background:none;}
.rn .rn-xmap-cert{margin-top:20px;}
.rn .rn-xmap-cert > div, .rn .rn-fin-cert.has-mark > div{flex-direction:row; align-items:baseline; gap:6px;}
.rn .rn-xmap-cert b, .rn .rn-fin-cert.has-mark b{font-size:12px; font-weight:600;}
.rn .rn-xmap-cert b{color:var(--rn-ink2);}
.rn .rn-fin-cert.has-mark b{color:rgba(255,255,255,.75);}
.rn .rn-xmap-cert span, .rn .rn-fin-cert.has-mark span{margin-top:0; font-size:11px;}

/* 2026-11-01 문의 페이지 카드 재정리(사용자 결정): 메뉴 묶음별 머리말 + 카드 그리드(옛 float·nth-child 배치 대신).
   다른 페이지의 문의 버튼이 /company/contactus#카드 로 오면 그 카드가 하늘색 테두리로 강조되고 포커스(company_contactus.html 스크립트) */
.contact_con .contact_li.cg{display:block;}
.contact_con .contact_li.cg::after{content:""; display:block; clear:both;}
.contact_con .contact_li.cg .cg-group + .cg-group{margin-top:36px;}
.contact_con .contact_li.cg .cg-h{margin-bottom:14px; font-size:15px; font-weight:700; letter-spacing:.01em; color:#00acee;}
.contact_con .contact_li.cg .cg-cards{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:24px;}
.contact_con .contact_li.cg dl, .contact_con .contact_li.cg dl:nth-child(n){float:none; width:auto; margin:0; scroll-margin-top:120px; outline:2px solid transparent; outline-offset:0; transition:outline-color .3s, box-shadow .3s;}
.contact_con .contact_li.cg dt{height:auto; min-height:72px; color:#5a6472; line-height:1.55;}
.contact_con .contact_li.cg dt em{color:#0f141b;}
.contact_con .contact_li.cg .cg-form{margin-top:10px;}
.contact_con .contact_li.cg .cg-form a{font-size:14px; font-weight:600; color:#00acee;}
.contact_con .contact_li.cg dl:target, .contact_con .contact_li.cg dl.is-hit{outline-color:#00acee; box-shadow:0 0 0 6px rgba(0,172,238,.14), 5px 5px 5px rgba(0,0,0,.1);}
.contact_con .contact_li.cg dl.is-hit{animation:cgHit 1.6s ease-out 1;}
.contact_con .contact_li.cg dl:focus{outline-color:#00acee;}
@keyframes cgHit{0%{box-shadow:0 0 0 0 rgba(0,172,238,.45), 5px 5px 5px rgba(0,0,0,.1);} 60%{box-shadow:0 0 0 14px rgba(0,172,238,0), 5px 5px 5px rgba(0,0,0,.1);} 100%{box-shadow:0 0 0 6px rgba(0,172,238,.14), 5px 5px 5px rgba(0,0,0,.1);}}
@media (max-width:1199px){ .contact_con .contact_li.cg .cg-cards{grid-template-columns:repeat(2, minmax(0,1fr));} }
@media (max-width:767px){ .contact_con .contact_li.cg .cg-cards{grid-template-columns:1fr; gap:16px;} .contact_con .contact_li.cg dl, .contact_con .contact_li.cg dl:nth-child(n){scroll-margin-top:80px;} }
@media (prefers-reduced-motion: reduce){ .contact_con .contact_li.cg dl.is-hit{animation:none;} }

/* 2026-11-02 AI CX 요청(권장2): 패널 문단 안 바로가기 링크(예: GEO 무료 사전 점검 신청) */
.rn .rn-panel-go{font-weight:600; color:#00acee; white-space:nowrap;}
.rn .rn-panel-go:hover, .rn .rn-panel-go:focus-visible{text-decoration:underline;}

/* 2026-11-02 R-261102-06 XGEN 팝업 「시연 영상」 목록(연구소 요청, A안): 썸네일(재생 표시·길이) + 제목·한 줄 설명.
   누르면 큰 영상 창(.rn-xv-modal, script_function.js rnPanelVideo)에서 YouTube 재생 */
.rn .rn-pv-note{margin:-4px 0 10px; font-size:13px; color:var(--rn-muted, #6b7684);}
.rn .rn-pv-list{margin:0 0 8px; padding:0; list-style:none; border-top:1px solid var(--rn-line);}
.rn .rn-pv-list li{border-bottom:1px solid var(--rn-line);}
.rn .rn-pv{display:grid; grid-template-columns:132px minmax(0,1fr); align-items:center; gap:16px; padding:12px 0; color:inherit; text-decoration:none;}
.rn .rn-pv-th{position:relative; display:block; overflow:hidden; aspect-ratio:16/9; border-radius:8px; background:#0b0f1a;}
.rn .rn-pv-th img{display:block; width:100%; height:100%; object-fit:cover; transition:transform .4s ease;}
.rn .rn-pv-play{position:absolute; top:50%; left:50%; width:30px; height:30px; margin:-15px 0 0 -15px; border-radius:50%; background:var(--rn-brand, #00acee); box-shadow:0 4px 12px rgba(0,0,0,.35);}
.rn .rn-pv-play::after{content:""; position:absolute; top:50%; left:52%; border-style:solid; border-width:6px 0 6px 9px; border-color:transparent transparent transparent #fff; transform:translate(-50%,-50%);}
.rn .rn-pv-dur{position:absolute; right:5px; bottom:5px; padding:1px 5px; border-radius:4px; background:rgba(0,0,0,.72); color:#fff; font-size:11px; font-style:normal; line-height:16px;}
.rn .rn-pv-tx b{display:block; font-size:15px; font-weight:700; line-height:1.4; color:var(--rn-ink, #0f141b);}
.rn .rn-pv-tx span{display:block; margin-top:3px; font-size:13px; line-height:1.45; color:var(--rn-muted, #6b7684);}
.rn .rn-pv:hover .rn-pv-th img, .rn .rn-pv:focus-visible .rn-pv-th img{transform:scale(1.05);}
.rn .rn-pv:hover .rn-pv-tx b, .rn .rn-pv:focus-visible .rn-pv-tx b{color:var(--rn-brand, #00acee);}
.rn .rn-pv:active .rn-pv-th img{transform:scale(1.05);}
@media (max-width:767px){ .rn .rn-pv{grid-template-columns:112px minmax(0,1fr); gap:12px;} .rn .rn-pv-tx b{font-size:14px;} }
@media (prefers-reduced-motion: reduce){ .rn .rn-pv-th img{transition:none;} }

/* 2026-11-02 R-261102-07 연구소 의견(설명 문구가 흐릿함): common.css가 body·p·a 등에 굵기 300(Light)을 직접 주므로
   개편 영역(.rn) 본문 기본 굵기를 400으로. :where()로 우선순위를 낮춰(요소 선택자 수준) 클래스로 굵기를 정한 곳(제목·강조)은 그대로 둔다.
   색은 개편 색(--rn-ink2·--rn-muted) 유지 */
:where(.rn){font-weight:400;}
:where(.rn) :is(p, a, table, input, textarea, select){font-weight:400;}

/* 2026-11-03 전략기획실(손지은 프로) 추가 의견: 뉴스·콘텐츠 썸네일도 업로드 규격(900×540, 5:3)과 같게
   - 콘텐츠·리소스 맨 위 슬라이드 그림: 칸이 16:10(글 칸 높이에 맞춰 늘어남)이라 좌우가 잘림 → 그림 칸을 5:3으로 고정
   - 목록 썸네일: 1px 테두리가 그림 칸을 줄여 위아래 약 1px 잘림 → 테두리를 칸 바깥에 두어 그림 칸이 정확히 5:3 */
.rn.nr-page .event_con li .event_thum:not(.nr-card){box-sizing:content-box;}
.rn.nr-page .board_slide .slide_news_wrap .slide_news_img{min-height:0; aspect-ratio:5/3; align-self:start;}
@media (max-width:1023px){ .rn.nr-page .board_slide .slide_news_wrap .slide_news_img{aspect-ratio:5/3;} }

/* 2026-11-03 사용자 A안: 금융 사례가 2개로 줄어 엉성해진 Finance 영역을 세 칸으로 — 제주은행 · iM캐피탈(보도자료 링크) · GS인증 1등급 카드
   (제목 오른쪽 작은 인증 표시를 세 번째 카드로 내림) */
.rn .rn-fin-gs-top{display:flex; align-items:center; gap:12px;}
.rn .rn-fin-cases .rn-fin-gs .rn-gs-mark{flex:none; width:56px; height:38px; margin:0; padding:3px; border-radius:4px;} /* 사례 카드 글(span) 규칙(flex:1)이 마크에 붙지 않게 */
.rn .rn-fin-gs .rn-gs-mark img{height:32px;}
.rn .rn-fin-cases .rn-fin-gs-top b{font-size:20px;}