/* RNSh4 palette sync · 2026-10-01 */
:root{--rnsh4-ink:#152033;--rnsh4-muted:#6b7788;--rnsh4-brand:#416a87;--rnsh4-brand-dark:#163f68;--rnsh4-mint:#25c9ba;--rnsh4-mint-deep:#0da99e;--rnsh4-blue:#258cf0;--rnsh4-line:#e7edf2;--rnsh4-soft:#f7fafb;}
/* =========================================================
   203 · 장애인 재택근무 서비스 / 위플(WithFlow)
   Suhoin-inspired alternating feature rows + PDF role structure
   ========================================================= */
.page-203 main{overflow:hidden}
.page-203 .withflow-kicker{margin:0 0 14px;color:#416a87;font-size:12px;font-weight:900;letter-spacing:.14em}
.page-203 .withflow-section-heading{max-width:900px;margin-bottom:48px}
.page-203 .withflow-section-heading h2{margin:0;color:#111b2d;font-size:clamp(34px,3.4vw,50px);line-height:1.17;letter-spacing:-.045em}
.page-203 .withflow-section-heading--light .withflow-kicker{color:#6f8aa0}
.page-203 .withflow-section-heading--light h2{color:#fff}

.page-203 .withflow-hero-section{padding:104px 0;background:#fff}
.page-203 .withflow-hero-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:76px;align-items:center}
.page-203 .withflow-hero-copy h2{margin:0;color:#111b2d;font-size:clamp(38px,3.8vw,56px);line-height:1.18;letter-spacing:-.05em;word-break:keep-all}
.page-203 .withflow-hero-copy h2 strong{color:#416a87}
.page-203 .withflow-hero-copy>p:not(.withflow-kicker){margin:24px 0 0;color:#6b7788;font-size:18px;line-height:1.9;word-break:keep-all}
.page-203 .withflow-summary{margin-top:30px;padding:20px 24px;background:#f4f9ff;color:#163f68;font-size:18px;font-weight:850}
.page-203 .withflow-hero-visual{position:relative;min-height:470px;background:#163f68;overflow:hidden}
.page-203 .withflow-hero-visual figure{position:absolute;margin:0;background:#fff;box-shadow:0 18px 42px rgba(0,0,0,.18);overflow:hidden}
.page-203 .withflow-hero-visual figure:first-child{left:9%;bottom:-125px;width:210px;height:520px;border-radius:28px}
.page-203 .withflow-hero-visual figure:last-child{right:8%;top:58px;width:48%;height:350px}
.page-203 .withflow-hero-visual img{width:100%;height:100%;object-fit:cover;object-position:top left}
.page-203 .withflow-hero-visual figure:first-child img{height:auto}

.page-203 .withflow-role-section{padding:110px 0}
.page-203 .withflow-role-section--dark{background:#163f68}
.page-203 .withflow-role-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.page-203 .withflow-role-grid article{min-height:220px;padding:36px 30px;background:#163f68;color:#fff;text-align:center}
.page-203 .withflow-role-grid span{display:inline-flex;width:48px;height:48px;align-items:center;justify-content:center;border-radius:50%;background:#416a87;color:#fff;font-size:15px;font-weight:900}
.page-203 .withflow-role-grid h3{margin:22px 0 14px;color:#ffe7a8;font-size:24px}
.page-203 .withflow-role-grid p{margin:0;color:#f4f9ff;font-size:15px;line-height:1.75;word-break:keep-all}

.page-203 .withflow-feature-section,.page-203 .withflow-work-section{padding:104px 0;background:#fff}
.page-203 .withflow-feature-section--soft{background:#f4f9ff}
.page-203 .withflow-feature-grid{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:88px;align-items:center;min-height:470px}
.page-203 .withflow-feature-grid--reverse{grid-template-columns:minmax(0,1.22fr) minmax(0,.78fr)}
.page-203 .withflow-feature-grid--reverse .withflow-feature-copy{order:2}
.page-203 .withflow-feature-grid--reverse .withflow-feature-visual{order:1}
.page-203 .withflow-feature-copy{max-width:510px}
.page-203 .withflow-badge{display:inline-flex;align-items:center;min-height:30px;padding:5px 12px;border-radius:999px;background:#416a87;color:#fff;font-size:12px;font-weight:850}
.page-203 .withflow-feature-copy h2{margin:20px 0 18px;color:#111b2d;font-size:clamp(34px,3vw,48px);line-height:1.17;letter-spacing:-.045em;word-break:keep-all}
.page-203 .withflow-feature-copy p{margin:0;color:#6b7788;font-size:17px;line-height:1.9;word-break:keep-all}
.page-203 .withflow-feature-copy ul{margin:24px 0 0;padding:0;list-style:none}
.page-203 .withflow-feature-copy li{position:relative;margin-top:10px;padding-left:20px;color:#416a87;font-size:14px;line-height:1.65}
.page-203 .withflow-feature-copy li:before{content:'•';position:absolute;left:0;color:#416a87;font-weight:900}
.page-203 .withflow-feature-visual{position:relative;min-height:400px;background:#f4f9ff;border:1px solid #dbe7ef;overflow:hidden}
.page-203 .withflow-feature-visual figure{position:absolute;margin:0;background:#fff;border:1px solid #dbe7ef;box-shadow:0 16px 38px rgba(16,45,69,.10);overflow:hidden}
.page-203 .withflow-feature-visual img{width:100%;height:100%;object-fit:cover;object-position:top left}
.page-203 .withflow-feature-visual--attendance .withflow-phone{left:8%;bottom:-145px;width:190px;height:470px;border-radius:24px}
.page-203 .withflow-feature-visual--attendance .withflow-phone img{height:auto}
.page-203 .withflow-feature-visual--attendance .withflow-desktop{right:-4%;top:58px;width:72%;height:300px}
.page-203 .withflow-feature-visual--leave figure:first-child{left:4%;top:62px;width:60%;height:285px}
.page-203 .withflow-feature-visual--leave figure:last-child{right:4%;top:120px;width:58%;height:285px}
.page-203 .withflow-feature-visual--hr figure:first-child{left:3%;top:55px;width:73%;height:300px}
.page-203 .withflow-feature-visual--hr figure:last-child{right:-12%;top:126px;width:65%;height:290px}
.page-203 .withflow-feature-visual--work figure:first-child{left:4%;top:64px;width:54%;height:290px}
.page-203 .withflow-feature-visual--work figure:last-child{right:4%;top:112px;width:62%;height:290px}

.page-203 .withflow-system-message{padding:84px 0}
.page-203 .withflow-system-box{padding:42px 48px;background:#163f68;color:#fff;text-align:center}
.page-203 .withflow-system-box strong{display:block;font-size:30px;letter-spacing:-.04em}
.page-203 .withflow-system-box p{margin:14px 0 0;color:#f4f9ff;font-size:17px;line-height:1.75}
.page-203 .withflow-system-box span{display:block;margin-top:18px;color:#ffdf75;font-size:17px;font-weight:800}

@media(max-width:900px){
  .page-203 .withflow-hero-section,.page-203 .withflow-role-section,.page-203 .withflow-feature-section,.page-203 .withflow-work-section{padding:76px 0}
  .page-203 .withflow-hero-grid,.page-203 .withflow-feature-grid,.page-203 .withflow-feature-grid--reverse{grid-template-columns:1fr;gap:36px;min-height:0}
  .page-203 .withflow-feature-grid--reverse .withflow-feature-copy{order:1}
  .page-203 .withflow-feature-grid--reverse .withflow-feature-visual{order:2}
  .page-203 .withflow-feature-copy{max-width:none}
}
@media(max-width:760px){
  .page-203 .withflow-hero-section,.page-203 .withflow-role-section,.page-203 .withflow-feature-section,.page-203 .withflow-work-section{padding:58px 0}
  .page-203 .withflow-hero-copy h2{font-size:34px}
  .page-203 .withflow-hero-copy>p:not(.withflow-kicker),.page-203 .withflow-feature-copy p{font-size:15px;text-align:left}
  .page-203 .withflow-summary{font-size:16px}
  .page-203 .withflow-hero-visual{min-height:330px}
  .page-203 .withflow-hero-visual figure:first-child{left:18px;bottom:-160px;width:145px;height:390px;border-radius:18px}
  .page-203 .withflow-hero-visual figure:last-child{right:-50px;top:50px;width:72%;height:235px}
  .page-203 .withflow-role-grid{grid-template-columns:1fr}
  .page-203 .withflow-role-grid article{min-height:0;padding:30px 24px}
  .page-203 .withflow-feature-copy h2{font-size:30px}
  .page-203 .withflow-feature-visual{min-height:330px}
  .page-203 .withflow-feature-visual--attendance .withflow-phone{left:18px;bottom:-165px;width:145px;height:390px;border-radius:18px}
  .page-203 .withflow-feature-visual--attendance .withflow-desktop{right:-70px;top:48px;width:82%;height:230px}
  .page-203 .withflow-feature-visual--leave figure:first-child{left:-55px;top:50px;width:82%;height:230px}
  .page-203 .withflow-feature-visual--leave figure:last-child{right:-55px;top:112px;width:82%;height:230px}
  .page-203 .withflow-feature-visual--hr figure:first-child{left:-35px;top:44px;width:88%;height:235px}
  .page-203 .withflow-feature-visual--hr figure:last-child{right:-78px;top:112px;width:82%;height:225px}
  .page-203 .withflow-feature-visual--work figure:first-child{left:-45px;top:45px;width:82%;height:230px}
  .page-203 .withflow-feature-visual--work figure:last-child{right:-65px;top:112px;width:86%;height:230px}
  .page-203 .withflow-system-message{padding:58px 0}
  .page-203 .withflow-system-box{padding:32px 22px}
  .page-203 .withflow-system-box strong{font-size:25px}
  .page-203 .withflow-system-box p{font-size:14px;text-align:left}
  .page-203 .withflow-system-box span{font-size:15px}
}

/* =========================================================
   V32 · 203 WITHFLOW BRIGHT MULTI-COLOR RENEWAL
   - 101~105 / 201 / 202와 같은 밝은 브랜드 톤
   - 기존 콘텐츠/기능/이미지는 유지
   - 기능별 로즈·앰버·민트·스카이·라벤더 포인트
   ========================================================= */
.page-203{
  --wf-ink:#152033;
  --wf-muted:#416a87;
  --wf-border:#e7edf2;
  --wf-rose:#416a87;
  --wf-rose-dark:#416a87;
  --wf-rose-soft:#edf6ff;
  --wf-coral:#258cf0;
  --wf-coral-soft:#fff1ed;
  --wf-amber:#a67b35;
  --wf-amber-soft:#fff7e7;
  --wf-mint:#0da99e;
  --wf-mint-soft:#eefcf9;
  --wf-sage:#0da99e;
  --wf-sage-soft:#eefcf9;
  --wf-sky:#258cf0;
  --wf-sky-soft:#edf6ff;
  --wf-lav:#786b9a;
  --wf-lav-soft:#f5f1fb;
  --wf-cream:#f7fafb;
}

/* Sub hero / local navigation */
.page-203 .sub-hero{
  background:linear-gradient(120deg,#f7fafb 0%,#eefcf9 56%,#eefcf9 100%);
  border-bottom:1px solid var(--wf-border);
}
.page-203 .sub-breadcrumb,
.page-203 .sub-breadcrumb a{color:#416a87}
.page-203 .sub-breadcrumb a:hover{color:var(--wf-rose)}
.page-203 .sub-breadcrumb .is-current{color:#416a87}
.page-203 .sub-hero__category{color:#163f68}
.page-203 .sub-hero h1{color:var(--wf-ink)}
.page-203 .sub-hero__desc{color:#6b7788}
.page-203 .local-nav{background:#f7fafb;border-bottom:1px solid var(--wf-border)}
.page-203 .local-nav a{color:#416a87;border-bottom-width:3px}
.page-203 .local-nav a:hover{color:#163f68}
.page-203 .local-nav a.is-active{color:var(--wf-rose);border-bottom-color:var(--wf-rose);font-weight:750}

/* Common heading */
.page-203 .withflow-kicker{color:var(--wf-rose)}
.page-203 .withflow-section-heading h2,
.page-203 .withflow-feature-copy h2{color:var(--wf-ink)}
.page-203 .withflow-feature-copy p,
.page-203 .withflow-feature-copy li{color:var(--wf-muted)}

/* Hero — dark block removed */
.page-203 .withflow-hero-section{
  background:linear-gradient(135deg,#fffdfb 0%,#f4f9ff 50%,#f3f8f7 100%);
}
.page-203 .withflow-hero-copy h2{color:var(--wf-ink)}
.page-203 .withflow-hero-copy h2 strong{color:var(--wf-coral)}
.page-203 .withflow-hero-copy>p:not(.withflow-kicker){color:var(--wf-muted)}
.page-203 .withflow-summary{
  border:1px solid #edf6ff;
  border-radius:16px;
  background:linear-gradient(90deg,var(--wf-rose-soft) 0%,var(--wf-amber-soft) 100%);
  color:#163f68;
  box-shadow:0 10px 28px rgba(88,67,75,.05);
}
.page-203 .withflow-hero-visual{
  border:1px solid #edf6ff;
  border-radius:30px;
  background:linear-gradient(145deg,#f2f7fc 0%,#f7fafb 50%,#fff4e9 100%);
  box-shadow:0 22px 52px rgba(79,65,72,.08);
}
.page-203 .withflow-hero-visual:before{
  content:'';
  position:absolute;
  width:220px;
  height:220px;
  left:-70px;
  top:-70px;
  border-radius:50%;
  background:rgba(166,83,104,.08);
}
.page-203 .withflow-hero-visual:after{
  content:'';
  position:absolute;
  width:180px;
  height:180px;
  right:-55px;
  bottom:-55px;
  border-radius:50%;
  background:rgba(95,136,168,.09);
}
.page-203 .withflow-hero-visual figure{
  z-index:1;
  border:1px solid rgba(226,218,222,.9);
  box-shadow:0 18px 42px rgba(69,58,64,.10);
}

/* Role — former dark navy section becomes light, colorful cards */
.page-203 .withflow-role-section--dark{
  background:linear-gradient(135deg,#fff8f5 0%,#eefcf9 52%,#f1f6fb 100%);
}
.page-203 .withflow-section-heading--light .withflow-kicker{color:var(--wf-rose)}
.page-203 .withflow-section-heading--light h2{color:var(--wf-ink)}
.page-203 .withflow-role-grid{gap:24px}
.page-203 .withflow-role-grid article{
  min-height:230px;
  border:1px solid #edf6ff;
  border-radius:26px;
  background:var(--wf-rose-soft);
  color:var(--wf-ink);
  box-shadow:0 16px 38px rgba(82,64,72,.055);
}
.page-203 .withflow-role-grid article:nth-child(2){background:var(--wf-amber-soft);border-color:#efe1c0}
.page-203 .withflow-role-grid article:nth-child(3){background:var(--wf-mint-soft);border-color:#dff6f2}
.page-203 .withflow-role-grid span{background:var(--wf-rose);box-shadow:0 8px 18px rgba(166,83,104,.16)}
.page-203 .withflow-role-grid article:nth-child(2) span{background:var(--wf-amber)}
.page-203 .withflow-role-grid article:nth-child(3) span{background:var(--wf-mint)}
.page-203 .withflow-role-grid h3{color:var(--wf-ink)}
.page-203 .withflow-role-grid p{color:var(--wf-muted)}

/* Feature section identities */
.page-203 .withflow-feature-section--attendance{
  background:linear-gradient(135deg,#fffafa 0%,#edf6ff 50%,#fff8ee 100%);
}
.page-203 .withflow-feature-section--leave{
  background:linear-gradient(135deg,#fffdf9 0%,#fff7e7 52%,#f5f9fc 100%);
}
.page-203 .withflow-feature-section--hr{
  background:linear-gradient(135deg,#eefcf9 0%,#eefcf9 52%,#edf6ff 100%);
}
.page-203 .withflow-work-section--ops{
  background:linear-gradient(135deg,#faf8fd 0%,#f5f1fb 50%,#fff1ed 100%);
}
.page-203 .withflow-badge{box-shadow:0 8px 22px rgba(82,65,72,.10)}
.page-203 .withflow-badge--01{background:var(--wf-rose)}
.page-203 .withflow-badge--02{background:var(--wf-amber)}
.page-203 .withflow-badge--03{background:var(--wf-mint)}
.page-203 .withflow-badge--ops{background:var(--wf-lav)}
.page-203 .withflow-feature-section--attendance .withflow-feature-copy li:before{color:var(--wf-rose)}
.page-203 .withflow-feature-section--leave .withflow-feature-copy li:before{color:var(--wf-amber)}
.page-203 .withflow-feature-section--hr .withflow-feature-copy li:before{color:var(--wf-mint)}
.page-203 .withflow-work-section--ops .withflow-feature-copy li:before{color:var(--wf-lav)}

/* Screenshot frames */
.page-203 .withflow-feature-visual{
  border-radius:30px;
  background:rgba(255,255,255,.74);
  box-shadow:0 20px 48px rgba(79,65,72,.065);
}
.page-203 .withflow-feature-section--attendance .withflow-feature-visual{border-color:#edf6ff;background:linear-gradient(145deg,#fff 0%,#fff4f6 100%)}
.page-203 .withflow-feature-section--leave .withflow-feature-visual{border-color:#eee2c8;background:linear-gradient(145deg,#fff 0%,#fff9ec 100%)}
.page-203 .withflow-feature-section--hr .withflow-feature-visual{border-color:#dff6f2;background:linear-gradient(145deg,#fff 0%,#eefcf9 100%)}
.page-203 .withflow-work-section--ops .withflow-feature-visual{border-color:#e5dff0;background:linear-gradient(145deg,#fff 0%,#f7f3fb 100%)}
.page-203 .withflow-feature-visual figure{
  border-radius:16px;
  border-color:#edf6ff;
  box-shadow:0 16px 38px rgba(67,57,62,.10);
}

/* Final system message */
.page-203 .withflow-system-message{
  background:linear-gradient(120deg,#f7fafb 0%,#f7fafb 50%,#eefcf9 100%);
}
.page-203 .withflow-system-box{
  position:relative;
  overflow:hidden;
  border:1px solid #edf6ff;
  border-radius:28px;
  background:#fff;
  color:var(--wf-ink);
  box-shadow:0 18px 46px rgba(79,65,72,.065);
}
.page-203 .withflow-system-box:before{
  content:'';
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:7px;
  background:linear-gradient(180deg,var(--wf-rose),var(--wf-amber),var(--wf-mint));
}
.page-203 .withflow-system-box strong{color:var(--wf-ink)}
.page-203 .withflow-system-box p{color:var(--wf-muted)}
.page-203 .withflow-system-box span{color:var(--wf-rose)}

/* Bottom CTA / TOP — company pages unified */
.page-203 .footer-cta{
  background:linear-gradient(118deg,#fff8f5 0%,#f7fafb 55%,#f6f4ef 100%);
  border-top:1px solid #edf6ff;
}
.page-203 .footer-cta p{color:#163f68;font-weight:800;letter-spacing:.13em}
.page-203 .footer-cta h2{color:var(--wf-ink);font-weight:780;letter-spacing:-.05em}
.page-203 .footer-cta__actions a{
  background:var(--wf-rose);
  border-color:var(--wf-rose);
  color:#fff;
  box-shadow:0 12px 28px rgba(142,70,91,.14);
}
.page-203 .footer-cta__actions a:hover,
.page-203 .footer-cta__actions a:focus-visible{background:var(--wf-rose-dark);border-color:var(--wf-rose-dark)}
.page-203 .top-button{background:#5f6f7f;border-color:rgba(255,255,255,.62);color:#fff}
.page-203 .top-button:hover,.page-203 .top-button:focus-visible{background:var(--wf-rose);border-color:var(--wf-rose)}

@media(max-width:900px){
  .page-203 .withflow-hero-visual,
  .page-203 .withflow-feature-visual{border-radius:24px}
}
@media(max-width:760px){
  .page-203 .withflow-role-grid article{border-radius:20px}
  .page-203 .withflow-hero-visual,
  .page-203 .withflow-feature-visual{border-radius:20px}
  .page-203 .withflow-system-box{border-radius:20px}
  .page-203 .footer-cta{padding:58px 0}
  .page-203 .footer-cta__actions a{width:100%;max-width:320px;justify-content:center;min-height:54px}
}

/* =========================================================
   V45 · INDEX DETAIL CONTENT MIGRATION TO 203
   - THE FOUR PILLARS / DOCUMENT / EVALUATION / ALL IN ONE
   ========================================================= */
.page-203 .withflow-heading-desc{margin:16px 0 0;color:var(--wf-muted,#6b7788);font-size:17px;line-height:1.8;word-break:keep-all}

/* Four pillars */
.page-203 .withflow-pillars-section{padding:108px 0;background:linear-gradient(135deg,#fffdfb 0%,#fff7f4 48%,#eefcf9 100%)}
.page-203 .withflow-pillars-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.page-203 .withflow-pillar{position:relative;display:flex;min-height:330px;flex-direction:column;padding:30px 26px;border:1px solid #e7edf2;border-radius:26px;text-decoration:none;color:var(--wf-ink,#152033);box-shadow:0 16px 40px rgba(79,65,72,.055);transition:transform .25s ease,box-shadow .25s ease}
.page-203 .withflow-pillar:hover{transform:translateY(-5px);box-shadow:0 22px 48px rgba(79,65,72,.09)}
.page-203 .withflow-pillar--rose{background:#edf6ff}.page-203 .withflow-pillar--blue{background:#edf6ff}.page-203 .withflow-pillar--green{background:#eefcf9}.page-203 .withflow-pillar--amber{background:#fff7e8}
.page-203 .withflow-pillar__icon{display:inline-flex;width:52px;height:52px;align-items:center;justify-content:center;border-radius:16px;background:#fff;color:#416a87;box-shadow:0 8px 20px rgba(78,60,69,.08)}
.page-203 .withflow-pillar--blue .withflow-pillar__icon{color:#258cf0}.page-203 .withflow-pillar--green .withflow-pillar__icon{color:#0da99e}.page-203 .withflow-pillar--amber .withflow-pillar__icon{color:#c69026}
.page-203 .withflow-pillar__icon .rnsh-icon{width:26px;height:26px}
.page-203 .withflow-pillar__no{position:absolute;right:24px;top:26px;font-size:21px;font-weight:900;color:rgba(74,59,67,.33)}
.page-203 .withflow-pillar small{margin-top:26px;font-size:11px;font-weight:900;letter-spacing:.12em;color:#416a87}.page-203 .withflow-pillar--blue small{color:#258cf0}.page-203 .withflow-pillar--green small{color:#0da99e}.page-203 .withflow-pillar--amber small{color:#ad7d39}
.page-203 .withflow-pillar h3{margin:9px 0 12px;font-size:24px;line-height:1.35;letter-spacing:-.035em}
.page-203 .withflow-pillar p{margin:0;color:#416a87;font-size:14px;line-height:1.72;word-break:keep-all}
.page-203 .withflow-pillar b{margin-top:auto;padding-top:24px;font-size:13px;color:#163f68}

/* Document + evaluation */
.page-203 .withflow-admin-section{padding:108px 0;background:linear-gradient(135deg,#fff 0%,#f7fafb 48%,#eefcf9 100%)}
.page-203 .withflow-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.page-203 .withflow-admin-card{overflow:hidden;border:1px solid #edf6ff;border-radius:30px;background:#fff;box-shadow:0 20px 48px rgba(79,65,72,.06)}
.page-203 .withflow-admin-card--document{background:linear-gradient(180deg,#fff 0%,#eefcf9 100%)}
.page-203 .withflow-admin-card--evaluation{background:linear-gradient(180deg,#fff 0%,#fff8ec 100%)}
.page-203 .withflow-admin-card__copy{padding:38px 38px 28px}
.page-203 .withflow-admin-card__no{font-size:11px;font-weight:900;letter-spacing:.12em;color:#0da99e}.page-203 .withflow-admin-card--evaluation .withflow-admin-card__no{color:#b17f39}
.page-203 .withflow-admin-card h3{margin:12px 0 14px;color:var(--wf-ink,#152033);font-size:30px;letter-spacing:-.04em}
.page-203 .withflow-admin-card p{margin:0;color:#416a87;font-size:16px;line-height:1.8;word-break:keep-all}
.page-203 .withflow-admin-card ul{margin:22px 0 0;padding:0;list-style:none}
.page-203 .withflow-admin-card li{position:relative;margin-top:9px;padding-left:18px;color:#416a87;font-size:14px;line-height:1.65}
.page-203 .withflow-admin-card li:before{content:'•';position:absolute;left:0;color:#0da99e;font-weight:900}.page-203 .withflow-admin-card--evaluation li:before{color:#c69026}
.page-203 .withflow-admin-card figure{height:330px;margin:0 24px 24px;overflow:hidden;border:1px solid #edf6ff;border-radius:20px;background:#fff}
.page-203 .withflow-admin-card figure img{width:100%;height:100%;object-fit:cover;object-position:top center}

/* All in one */
.page-203 .withflow-allinone-section{padding:112px 0;background:linear-gradient(135deg,#fff8f7 0%,#f7f4fb 50%,#eefcf9 100%)}
.page-203 .withflow-section-heading--center{max-width:920px;margin-inline:auto;text-align:center}
.page-203 .withflow-allinone-relation{display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:center;margin:0 auto 30px;max-width:980px}
.page-203 .withflow-allinone-relation>div{min-height:112px;display:flex;flex-direction:column;justify-content:center;padding:24px 28px;border:1px solid #edf6ff;border-radius:22px;background:rgba(255,255,255,.82);text-align:center}
.page-203 .withflow-allinone-relation small{font-size:10px;font-weight:900;letter-spacing:.12em;color:#163f68}
.page-203 .withflow-allinone-relation strong{margin-top:8px;color:var(--wf-ink,#152033);font-size:18px;line-height:1.5}
.page-203 .withflow-allinone-relation>span{color:#6f8aa0;font-size:30px;font-weight:800}
.page-203 .withflow-allinone-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.page-203 .withflow-allinone-card{display:flex;min-height:190px;flex-direction:column;align-items:center;justify-content:center;padding:24px;border-radius:22px;text-align:center;border:1px solid rgba(93,76,84,.09);background:#fff;box-shadow:0 14px 34px rgba(79,65,72,.045)}
.page-203 .withflow-allinone-card>span{display:inline-flex;width:48px;height:48px;align-items:center;justify-content:center;border-radius:15px;margin-bottom:14px;background:#fff;color:#416a87;box-shadow:0 8px 20px rgba(79,65,72,.07)}
.page-203 .withflow-allinone-card>span .rnsh-icon{width:24px;height:24px}
.page-203 .withflow-allinone-card--rose{background:#edf6ff}.page-203 .withflow-allinone-card--blue{background:#edf6ff}.page-203 .withflow-allinone-card--green{background:#eefcf9}.page-203 .withflow-allinone-card--amber{background:#fff7e8}
.page-203 .withflow-allinone-card--blue>span{color:#258cf0}.page-203 .withflow-allinone-card--green>span{color:#0da99e}.page-203 .withflow-allinone-card--amber>span{color:#c69026}
.page-203 .withflow-allinone-card small{font-size:10px;font-weight:900;letter-spacing:.12em;color:#416a87}
.page-203 .withflow-allinone-card strong{margin-top:8px;color:var(--wf-ink,#152033);font-size:20px}
.page-203 .withflow-allinone-card p{margin:8px 0 0;color:#416a87;font-size:13px}
.page-203 .withflow-allinone-flow{margin-top:24px;padding:28px 30px;border:1px solid #edf6ff;border-radius:22px;background:rgba(255,255,255,.82);text-align:center}
.page-203 .withflow-allinone-flow>strong{display:block;margin-bottom:20px;color:var(--wf-ink,#152033);font-size:20px}
.page-203 .withflow-allinone-flow>div{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;gap:14px;align-items:center}
.page-203 .withflow-allinone-flow span{display:flex;min-height:68px;align-items:center;justify-content:center;gap:8px;border-radius:16px;background:#fff;color:#163f68;font-size:14px;font-weight:800}
.page-203 .withflow-allinone-flow b{color:#416a87}.page-203 .withflow-allinone-flow i{font-style:normal;color:#6f8aa0;font-size:24px}

@media(max-width:1000px){
  .page-203 .withflow-pillars-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-203 .withflow-allinone-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .page-203 .withflow-pillars-section,.page-203 .withflow-admin-section,.page-203 .withflow-allinone-section{padding:62px 0}
  .page-203 .withflow-heading-desc{font-size:15px;text-align:left}
  .page-203 .withflow-pillars-grid,.page-203 .withflow-admin-grid,.page-203 .withflow-allinone-grid{grid-template-columns:1fr}
  .page-203 .withflow-pillar{min-height:0;padding:26px 22px;border-radius:20px}
  .page-203 .withflow-pillar h3{font-size:22px}.page-203 .withflow-pillar b{padding-top:18px}
  .page-203 .withflow-admin-card{border-radius:22px}.page-203 .withflow-admin-card__copy{padding:30px 22px 22px}.page-203 .withflow-admin-card h3{font-size:26px}.page-203 .withflow-admin-card p{font-size:15px}.page-203 .withflow-admin-card figure{height:240px;margin:0 14px 14px;border-radius:16px}
  .page-203 .withflow-section-heading--center{text-align:left}
  .page-203 .withflow-allinone-relation{grid-template-columns:1fr;gap:10px}.page-203 .withflow-allinone-relation>span{transform:rotate(90deg);font-size:24px;text-align:center}
  .page-203 .withflow-allinone-relation>div{min-height:94px;padding:20px}.page-203 .withflow-allinone-relation strong{font-size:16px}
  .page-203 .withflow-allinone-card{min-height:150px}
  .page-203 .withflow-allinone-flow{padding:24px 18px}.page-203 .withflow-allinone-flow>div{grid-template-columns:1fr;gap:8px}.page-203 .withflow-allinone-flow i{transform:rotate(90deg);font-size:20px}
}


/* =========================================================
   RNSh4 · 203 정돈된 멀티컬러 v2 · 2026-10-01
   WithFlow는 민트/블루를 조금 더 사용하되 큰 면적은 뉴트럴 유지
   ========================================================= */
.page-203{
  --wf-brand:#466985;
  --wf-blue:#258cf0;
  --wf-mint:#0da99e;
  --wf-amber:#c58b2d;
  --wf-rose:#b96478;
  --wf-ink:#152033;
  --wf-muted:#66788a;
  --wf-border:#e4ebf0;
  --wf-neutral:#f7fafc;
  --wf-blue-soft:#edf6ff;
  --wf-mint-soft:#eefaf6;
  --wf-amber-soft:#fff7e7;
  --wf-rose-soft:#fff2f5;
}
.page-203 .withflow-kicker,
.page-203 .sub-hero__category,
.page-203 .sub-breadcrumb .is-current{color:var(--wf-brand)}
.page-203 .local-nav a.is-active{color:var(--wf-brand);border-bottom-color:var(--wf-brand)}
.page-203 .withflow-hero-section{background:#fff}
.page-203 .withflow-hero-copy h2 strong{color:var(--wf-brand)}

@media(max-width:760px){
  .page-203 .withflow-hero-copy .withflow-title-rest{display:block}
}
.page-203 .withflow-summary{background:var(--wf-neutral);border-color:var(--wf-border);color:var(--wf-brand)}
.page-203 .withflow-hero-visual{background:var(--wf-neutral);border-color:var(--wf-border)}
.page-203 .withflow-hero-visual:before,
.page-203 .withflow-hero-visual:after{display:none!important}
.page-203 .withflow-role-section--dark{background:var(--wf-neutral)}
.page-203 .withflow-role-grid article{background:var(--wf-blue-soft);border-color:#dce9f5}
.page-203 .withflow-role-grid article:nth-child(2){background:var(--wf-mint-soft);border-color:#d8eee6}
.page-203 .withflow-role-grid article:nth-child(3){background:var(--wf-amber-soft);border-color:#f0e0bc}
.page-203 .withflow-role-grid article:nth-child(1) span{background:var(--wf-blue)}
.page-203 .withflow-role-grid article:nth-child(2) span{background:var(--wf-mint)}
.page-203 .withflow-role-grid article:nth-child(3) span{background:var(--wf-amber)}
.page-203 .withflow-feature-section--attendance,
.page-203 .withflow-feature-section--hr{background:#fff}
.page-203 .withflow-feature-section--leave,
.page-203 .withflow-work-section--ops{background:var(--wf-neutral)}
.page-203 .withflow-badge--01{background:var(--wf-blue)}
.page-203 .withflow-badge--02{background:var(--wf-mint)}
.page-203 .withflow-badge--03{background:var(--wf-brand)}
.page-203 .withflow-badge--ops{background:var(--wf-amber)}
.page-203 .withflow-feature-section--attendance .withflow-feature-copy li:before{color:var(--wf-blue)}
.page-203 .withflow-feature-section--leave .withflow-feature-copy li:before{color:var(--wf-mint)}
.page-203 .withflow-feature-section--hr .withflow-feature-copy li:before{color:var(--wf-brand)}
.page-203 .withflow-work-section--ops .withflow-feature-copy li:before{color:var(--wf-amber)}
.page-203 .withflow-feature-visual,
.page-203 .withflow-feature-section--attendance .withflow-feature-visual,
.page-203 .withflow-feature-section--leave .withflow-feature-visual,
.page-203 .withflow-feature-section--hr .withflow-feature-visual,
.page-203 .withflow-work-section--ops .withflow-feature-visual{background:#fff;border-color:var(--wf-border)}
.page-203 .withflow-system-message{background:var(--wf-neutral)}
.page-203 .withflow-system-box{border-color:var(--wf-border)}
.page-203 .withflow-system-box:before{background:linear-gradient(180deg,var(--wf-brand),var(--wf-blue),var(--wf-mint))}
.page-203 .withflow-system-box span{color:var(--wf-brand)}
.page-203 .withflow-pillars-section{background:#fff}
.page-203 .withflow-pillar{border-color:var(--wf-border)}
.page-203 .withflow-pillar--rose{background:var(--wf-blue-soft)}
.page-203 .withflow-pillar--blue{background:var(--wf-mint-soft)}
.page-203 .withflow-pillar--green{background:var(--wf-amber-soft)}
.page-203 .withflow-pillar--amber{background:var(--wf-rose-soft)}
.page-203 .withflow-pillar--rose .withflow-pillar__icon,
.page-203 .withflow-pillar--rose small{color:var(--wf-blue)}
.page-203 .withflow-pillar--blue .withflow-pillar__icon,
.page-203 .withflow-pillar--blue small{color:var(--wf-mint)}
.page-203 .withflow-pillar--green .withflow-pillar__icon,
.page-203 .withflow-pillar--green small{color:var(--wf-amber)}
.page-203 .withflow-pillar--amber .withflow-pillar__icon,
.page-203 .withflow-pillar--amber small{color:var(--wf-rose)}
.page-203 .withflow-admin-section{background:var(--wf-neutral)}
.page-203 .withflow-admin-card--document{background:linear-gradient(180deg,#fff 0%,var(--wf-mint-soft) 100%)}
.page-203 .withflow-admin-card--evaluation{background:linear-gradient(180deg,#fff 0%,var(--wf-amber-soft) 100%)}
.page-203 .withflow-admin-card__no{color:var(--wf-mint)}
.page-203 .withflow-admin-card--evaluation .withflow-admin-card__no{color:var(--wf-amber)}
.page-203 .withflow-allinone-section{background:#fff}
.page-203 .withflow-allinone-relation>div,
.page-203 .withflow-allinone-flow{background:var(--wf-neutral);border-color:var(--wf-border)}
.page-203 .withflow-allinone-card--rose{background:var(--wf-blue-soft)}
.page-203 .withflow-allinone-card--blue{background:var(--wf-mint-soft)}
.page-203 .withflow-allinone-card--green{background:var(--wf-amber-soft)}
.page-203 .withflow-allinone-card--amber{background:var(--wf-rose-soft)}
.page-203 .withflow-allinone-card--rose>span{color:var(--wf-blue)}
.page-203 .withflow-allinone-card--blue>span{color:var(--wf-mint)}
.page-203 .withflow-allinone-card--green>span{color:var(--wf-amber)}
.page-203 .withflow-allinone-card--amber>span{color:var(--wf-rose)}

/* Mobile headings: keep the intended two lines intact and center the closing message. */
@media(max-width:760px){
  .page-203 .withflow-allinone-section .withflow-section-heading--center,
  .page-203 .withflow-allinone-section .withflow-heading-desc{text-align:center}
}
@media(max-width:430px){
  .page-203 #withflow-pillars-title{font-size:clamp(18px,7vw,30px)}
  .page-203 #withflow-all-title{font-size:clamp(18px,7.3vw,31px)}
  .page-203 #withflow-pillars-title span,
  .page-203 #withflow-all-title span{white-space:nowrap}
}

/* =========================================================
   RNSh4 · LIGHT SURFACE POLICY · 2026-10-01
   큰 면적의 진한 네이비 제거 / 밝은 시스템 톤으로 통일
   ========================================================= */
.page-203 .withflow-hero-visual{
  background:#f7fafc !important;
  border:1px solid #e4ebf0 !important;
}
.page-203 .withflow-role-section--dark{
  background:#f7fafc !important;
  color:#152033 !important;
}
.page-203 .withflow-role-section--dark .withflow-section-heading--light .withflow-kicker{color:#466985 !important;}
.page-203 .withflow-role-section--dark .withflow-section-heading--light h2{color:#152033 !important;}
.page-203 .withflow-role-section--dark .withflow-section-heading--light>p:last-child{color:#66788a !important;}
.page-203 .withflow-role-grid article{
  color:#152033 !important;
  border:1px solid #dce9f5 !important;
  box-shadow:none !important;
}
.page-203 .withflow-role-grid article:nth-child(1){background:#edf6ff !important;}
.page-203 .withflow-role-grid article:nth-child(2){background:#eefaf6 !important;border-color:#d8eee6 !important;}
.page-203 .withflow-role-grid article:nth-child(3){background:#fff7e7 !important;border-color:#f0e0bc !important;}
.page-203 .withflow-role-grid h3{color:#152033 !important;}
.page-203 .withflow-role-grid p{color:#66788a !important;}
.page-203 .withflow-system-message{background:#fff !important;}
.page-203 .withflow-system-box{
  background:#edf6ff !important;
  border:1px solid #dce9f5 !important;
  color:#152033 !important;
  box-shadow:none !important;
}
.page-203 .withflow-system-box strong{color:#466985 !important;}
.page-203 .withflow-system-box p{color:#66788a !important;}
.page-203 .withflow-system-box span{color:#0da99e !important;}
.page-203 .withflow-system-box:before{display:none !important;}

/* Mobile screenshots: one representative, cropped system preview per section. */
.page-203 .withflow-hero-visual figure a,
.page-203 .withflow-feature-visual figure a{display:block;width:100%;height:100%}
.page-203 .withflow-hero-visual figure a:focus-visible,
.page-203 .withflow-feature-visual figure a:focus-visible{outline:3px solid var(--wf-brand);outline-offset:-3px}
@media(max-width:760px){
  .page-203 .withflow-hero-visual,
  .page-203 .withflow-feature-visual{
    display:block;
    position:relative;
    min-height:0;
    height:clamp(250px,74vw,320px);
    padding:0;
    overflow:hidden;
    border:1px solid var(--wf-border) !important;
    border-radius:20px;
    background:#f7fafc !important;
    box-shadow:none;
  }
  .page-203 .withflow-hero-visual figure,
  .page-203 .withflow-feature-visual figure{display:none}
  .page-203 .withflow-hero-visual figure:last-child,
  .page-203 .withflow-feature-visual--work figure:last-child,
  .page-203 .withflow-feature-visual--attendance figure:last-child,
  .page-203 .withflow-feature-visual--leave figure:first-child,
  .page-203 .withflow-feature-visual--hr figure:first-child{
    display:block;
    position:absolute;
    inset:16px -26px -22px 16px;
    width:auto !important;
    height:auto !important;
    margin:0;
    border:1px solid var(--wf-border);
    border-radius:12px !important;
    box-shadow:0 12px 30px rgba(16,45,69,.10);
  }
  .page-203 .withflow-hero-visual figure a,
  .page-203 .withflow-feature-visual figure a{height:100%}
  .page-203 .withflow-hero-visual figure img,
  .page-203 .withflow-feature-visual figure img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:left top;
  }
}