/* 추천 솔루션 02 · 자동화된 MPS·MRP에서 APS까지 — 제안서 전용 스타일 (2026-09-29) */
*{box-sizing:border-box}
:root{--navy:#0d2a3e;--ink:#173b50;--sub:#4d6b7c;--blue:#135cc5;--teal:#16889e;--line:#d3e0e8;--soft:#f1f6f9;--tint:#e6f1f5;--warn:#d99a00;--over:#d2473a;--ok:#2a9473;--paper:#fff}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#e6edf1;color:var(--ink);font-family:Manrope,'Noto Sans KR','Malgun Gothic',sans-serif;word-break:keep-all;overflow-wrap:anywhere}
a{color:inherit}
.document-nav{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:14px 4%;background:var(--navy);color:#fff;font-size:14px}
.document-nav a{color:#fff;text-decoration:none;white-space:nowrap}
.document-nav a.dl{padding:7px 14px;border:1px solid #ffffff66;border-radius:4px}
.document-nav span{opacity:.8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.proposal-embedded .document-nav{display:none}
.plm-proposal{width:min(1180px,calc(100% - 32px));margin:22px auto 40px}

/* 한 장 = A4 가로 비율. 안쪽 크기는 모두 em이며 장 너비에 비례한다. */
.pg{container-type:inline-size;position:relative;aspect-ratio:297/210;margin:0 0 26px;background:var(--paper);box-shadow:0 8px 26px #0d2a3e1f;overflow:hidden}
.pg-in{position:absolute;inset:0;display:flex;flex-direction:column;padding:2.5em 3em 1.7em;font-size:1.46cqw;line-height:1.68}
.pg-top{display:flex;justify-content:space-between;align-items:baseline;font-size:.72em;letter-spacing:.16em;color:var(--teal);font-weight:700}
.pg-top b{color:var(--sub);font-weight:600;letter-spacing:.06em}
.pg h2{margin:.55em 0 .2em;font-size:2.15em;line-height:1.32;letter-spacing:-.02em;font-weight:800;color:var(--navy)}
.pg h2 em{font-style:normal;color:var(--blue)}
.lead{margin:0 0 1.1em;max-width:62em;font-size:1.06em;color:var(--sub)}
.pg-body{flex:1;min-height:0;display:grid;gap:1.5em;align-content:center}
.pg-foot{display:flex;justify-content:space-between;margin-top:1em;padding-top:.8em;border-top:1px solid var(--line);font-size:.7em;color:var(--sub);letter-spacing:.04em}
.c2{grid-template-columns:1fr 1fr}.c32{grid-template-columns:3fr 2fr}.c23{grid-template-columns:2fr 3fr}.c3{grid-template-columns:repeat(3,1fr)}
h3{margin:0 0 .45em;font-size:1.12em;line-height:1.45;color:var(--navy)}
p{margin:0 0 .7em}
.note{font-size:.84em;color:var(--sub);border-left:3px solid var(--teal);padding:.1em 0 .1em 1em;margin:0}
.ex{display:inline-block;padding:.1em .7em;border:1px solid var(--line);border-radius:99px;font-size:.72em;color:var(--sub);background:#fff;letter-spacing:.02em}
ul.pts{margin:0;padding:0;list-style:none;display:grid;gap:.75em}
ul.pts li{position:relative;padding-left:1.25em}
ul.pts li:before{content:'';position:absolute;left:0;top:.62em;width:.5em;height:.5em;background:var(--blue)}
ul.pts b{display:block;color:var(--navy)}
ul.pts span{color:var(--sub);font-size:.94em}

/* 표지 */
.cover{background:linear-gradient(135deg,#081e2e 0%,#0d2a3e 45%,#123f5c 100%);color:#fff}
.cover .pg-in{padding:3.2em 3.6em 2.4em}
.cover svg.bg{position:absolute;inset:0;width:100%;height:100%}
.cover .pg-top{color:#7fd3e4}.cover .pg-top b{color:#ffffffaa}
.cover h1{position:relative;margin:auto 0 .35em;font-size:3.9em;line-height:1.18;letter-spacing:-.03em;font-weight:800}
.cover .sub{position:relative;margin:0 0 .5em;font-size:1.55em;font-weight:700;color:#8fe0ee}
.cover .desc{position:relative;margin:0 0 2.2em;max-width:40em;font-size:1.05em;color:#ffffffc9}
.chain{position:relative;display:flex;flex-wrap:wrap;gap:.5em;align-items:center;font-weight:700}
.chain i{font-style:normal;padding:.4em 1.05em;border:1px solid #ffffff55;border-radius:4px;background:#ffffff12}
.chain i.on{background:#fff;color:var(--navy);border-color:#fff}
.chain u{text-decoration:none;color:#7fd3e4}
.cover .pg-foot{border-color:#ffffff33;color:#ffffffa6}

/* 질문 */
.ask{display:flex;flex-direction:column;justify-content:center;padding:2em 2.2em;background:var(--navy);color:#fff}
.ask q{quotes:none;display:block;font-size:2.05em;line-height:1.35;font-weight:800;letter-spacing:-.02em}
.ask p{margin:1.3em 0 0;color:#ffffffc4;font-size:.98em}
.four{display:grid;grid-template-columns:1fr 1fr;gap:1em}
.card{padding:1.15em 1.25em;border:1px solid var(--line);background:#fff;border-top:3px solid var(--blue)}
.card small{display:block;font-size:.72em;letter-spacing:.14em;color:var(--teal);font-weight:700}
.card b{display:block;margin:.15em 0 .3em;font-size:1.2em;color:var(--navy)}
.card span{display:block;font-size:.92em;color:var(--sub);line-height:1.6}
.strip{grid-column:1/-1;padding:1em 1.4em;background:var(--tint);font-size:.98em}
.strip b{color:var(--navy)}

/* 표 */
table.t{width:100%;border-collapse:collapse;font-size:.92em;line-height:1.55}
.t th,.t td{padding:.62em .8em;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.t thead th{background:var(--navy);color:#fff;font-weight:700;border:0}
.t td.g{width:5.2em;background:var(--tint);font-weight:800;color:var(--navy);text-align:center;vertical-align:middle}
.t td.k{font-weight:700;color:var(--blue);white-space:nowrap}
.t tbody tr:nth-child(even) td:not(.g){background:#f7fafc}
table.mrp{width:100%;border-collapse:collapse;font-size:.92em;text-align:right}
.mrp th,.mrp td{padding:.55em .7em;border:1px solid var(--line)}
.mrp thead th{background:var(--navy);color:#fff;text-align:center}
.mrp tbody th{text-align:left;background:var(--soft);color:var(--navy);white-space:nowrap}
.mrp td.z{color:#a9bac4}.mrp td.s{background:#fdecea;color:var(--over);font-weight:800}
.mrp td.p{background:#e7f0fd;color:var(--blue);font-weight:800}.mrp tr.inv td{font-weight:700}
.mrp tr.inv td.low{background:#fff6dd;color:#8a6200}

/* 다섯 단계 구조 */
.pipe{display:grid;grid-template-columns:repeat(5,1fr);gap:.9em;position:relative}
.stage{position:relative;display:flex;flex-direction:column;padding:1.1em 1em 1.05em;background:#fff;border:1px solid var(--line);border-top:.35em solid var(--blue)}
.stage:not(:last-child):after{content:'';position:absolute;right:-.72em;top:50%;width:.55em;height:.55em;border-top:2px solid var(--teal);border-right:2px solid var(--teal);transform:translateY(-50%) rotate(45deg);z-index:1}
.stage small{font-size:.7em;letter-spacing:.12em;color:var(--teal);font-weight:700}
.stage strong{font-size:1.7em;line-height:1.2;color:var(--navy);letter-spacing:-.01em}
.stage em{font-style:normal;font-size:.8em;color:var(--sub)}
.stage q{quotes:none;display:block;margin:.8em 0;padding:.7em 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-weight:700;color:var(--navy);line-height:1.5;flex:1}
.stage span{font-size:.84em;color:var(--sub);line-height:1.55}
.stage.x{border-top-color:var(--navy);background:var(--navy)}
.stage.x strong,.stage.x q{color:#fff}.stage.x q{border-color:#ffffff33}.stage.x span,.stage.x em{color:#ffffffc2}.stage.x small{color:#8fe0ee}
.base{display:grid;grid-template-columns:auto 1fr;gap:1.2em;align-items:center;padding:.85em 1.2em;background:var(--tint);font-size:.92em}
.base b{color:var(--navy)}
.back{display:flex;align-items:center;gap:.8em;padding:.85em 1.2em;border:1px dashed var(--teal);color:var(--ink);font-size:.92em}
.back i{font-style:normal;color:var(--teal);font-weight:800;font-size:1.3em;line-height:1}

/* 흐름 */
.flow{display:grid;gap:.5em;counter-reset:f}
.flow.n7{grid-template-columns:repeat(7,1fr)}.flow.n5{grid-template-columns:repeat(5,1fr)}.flow.n4{grid-template-columns:repeat(4,1fr)}
.step{position:relative;padding:.9em .8em .9em 1em;background:var(--soft);border-left:.3em solid var(--blue);counter-increment:f}
.step:before{content:counter(f,decimal-leading-zero);display:block;font-size:.72em;font-weight:800;color:var(--teal);letter-spacing:.1em}
.step b{display:block;color:var(--navy);font-size:1.05em;line-height:1.4}
.step span{display:block;margin-top:.3em;font-size:.84em;color:var(--sub);line-height:1.55}
.step.now{background:var(--navy);border-color:#8fe0ee}.step.now b{color:#fff}.step.now span{color:#ffffffc2}.step.now:before{color:#8fe0ee}
.tri{display:grid;grid-template-columns:repeat(3,1fr);gap:1em}
.tri div{padding:1em 1.2em;border:1px solid var(--line)}
.tri small{display:block;font-size:.74em;font-weight:800;letter-spacing:.1em;color:var(--teal)}
.tri b{display:block;margin:.15em 0 .3em;color:var(--navy);font-size:1.06em}
.tri span{font-size:.9em;color:var(--sub);display:block;line-height:1.6}
.tri .r{border-top:3px solid var(--over)}.tri .y{border-top:3px solid var(--warn)}.tri .b{border-top:3px solid var(--blue)}.tri .n{border-top:3px solid var(--navy)}.tri .g{border-top:3px solid var(--ok)}

/* 도식 */
.fig{align-self:center;display:flex;flex-direction:column;gap:.6em;padding:1.1em 1.2em 1em;border:1px solid var(--line);background:#fbfdfe}
.fig svg{display:block;width:100%;height:auto}
.fig figcaption,.cap{display:flex;justify-content:space-between;gap:1em;align-items:center;font-size:.8em;color:var(--sub)}
figure{margin:0}
.merge{display:grid;grid-template-columns:1fr auto 1fr;gap:.8em;align-items:center}
.merge .col{display:grid;gap:.5em}
.box{padding:.7em .9em;border:1px solid var(--line);background:#fff;font-size:.9em;line-height:1.5}
.box b{display:block;color:var(--navy)}
.box.k{background:var(--navy);color:#fff;border-color:var(--navy)}.box.k b{color:#fff}
.box.w{background:#fff6dd;border-color:#ecd48a}
.arr{color:var(--teal);font-weight:800;font-size:1.5em;text-align:center}
.split{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch}
.split>div{padding:1em 1.1em}
.split .l{background:var(--soft)}.split .r{background:var(--navy);color:#fff}
.split .m{display:grid;place-items:center;padding:0 .6em;background:var(--blue);color:#fff;font-weight:800;writing-mode:vertical-rl;letter-spacing:.2em;font-size:.86em}
.split small{display:block;font-size:.72em;letter-spacing:.12em;font-weight:800;color:var(--teal)}.split .r small{color:#8fe0ee}
.split b{display:block;font-size:1.1em;margin:.1em 0 .4em}
.split span{display:block;font-size:.88em;line-height:1.6;opacity:.9}

/* 평가표 */
.score{border:1px solid var(--line);background:#fff}
.score header{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:1em;align-items:center;padding:.9em 1.2em;background:var(--navy);color:#fff;font-size:.92em}
.score header b{display:inline-block;margin-left:.6em;padding:.1em .8em;background:#fff;color:var(--navy);border-radius:4px;font-size:1.25em}
.score .row{display:grid;grid-template-columns:4.6em 1fr 1fr 7.5em;gap:1em;align-items:center;padding:.72em 1.2em;border-top:1px solid var(--line);font-size:.9em}
.score .row>b{padding:.45em 0;text-align:center;background:var(--tint);color:var(--navy)}
.score .row span{line-height:1.55;color:var(--ink)}
.score .row span.a{color:var(--over);font-weight:700}
.bar{position:relative;margin-right:3.4em;height:1.5em;background:var(--soft);border:1px solid var(--line)}
.bar i{position:absolute;left:0;top:0;bottom:0;background:var(--blue)}
.bar em{position:absolute;right:-3.4em;width:3em;text-align:right;top:0;line-height:1.5em;font-style:normal;font-weight:800;font-size:.9em;color:var(--navy)}
.bar.lo i{background:var(--warn)}

/* 순환 */
.loop{display:grid;grid-template-columns:1fr auto 1fr;grid-template-rows:auto auto auto;gap:.5em .8em;align-items:center}
.loop .n{padding:1em 1.1em;border:1px solid var(--line);background:#fff}
.loop .n b{display:block;color:var(--navy);font-size:1.05em}
.loop .n span{font-size:.86em;color:var(--sub);display:block;line-height:1.55}
.loop .n.k{background:var(--navy);border-color:var(--navy)}.loop .n.k b{color:#fff}.loop .n.k span{color:#ffffffc2}
.loop .a{color:var(--teal);font-weight:800;font-size:1.5em;text-align:center;line-height:1}

/* 화면 */
.shots{display:grid;grid-template-columns:repeat(3,1fr);gap:1em}
.shots figure{border:1px solid var(--line);background:#fff;padding:.6em .6em .7em}
.shots img{display:block;width:100%;height:auto;pointer-events:none;user-select:none}
.shots figcaption{margin-top:.5em;font-size:.84em;color:var(--navy);font-weight:700;line-height:1.45}
.shots figcaption span{display:block;font-weight:400;color:var(--sub);font-size:.94em}

/* 마무리 */
.end{background:linear-gradient(135deg,#081e2e,#123f5c);color:#fff}
.end h2{color:#fff;font-size:2.7em}.end .lead{color:#ffffffc9}
.end .pg-top{color:#7fd3e4}.end .pg-top b{color:#ffffffaa}.end .pg-foot{border-color:#ffffff33;color:#ffffffa6}
.cta{display:grid;grid-template-columns:repeat(3,1fr);gap:1em}
.cta a{display:block;padding:1.2em 1.3em;border:1px solid #ffffff44;background:#ffffff10;text-decoration:none;color:#fff}
.cta small{display:block;font-size:.72em;letter-spacing:.14em;color:#8fe0ee;font-weight:700}
.cta b{display:block;font-size:1.2em;margin:.2em 0 .3em}
.cta span{display:block;font-size:.88em;color:#ffffffc2;line-height:1.6}
.contact{display:flex;flex-wrap:wrap;gap:.4em 2.4em;font-size:.98em;color:#ffffffd9}
.contact b{color:#fff}

/* 좁은 화면: 장 비율을 풀고 한 단으로 읽는다 */
@media screen and (max-width:860px){
 .plm-proposal{width:calc(100% - 16px);margin:8px auto 24px}
 .document-nav{padding:12px 14px;font-size:13px}.document-nav span{display:none}
 .pg{aspect-ratio:auto;margin-bottom:12px;overflow:visible}
 .pg-in{position:relative;inset:auto;padding:26px 18px 18px;font-size:15px;line-height:1.75}
 .pg h2{font-size:1.55em}.cover h1{font-size:2.3em;margin-top:2.4em}.cover .sub{font-size:1.15em}.end h2{font-size:1.8em}
 .cover .pg-in{padding:30px 20px 22px}
 .c2,.c32,.c23,.c3,.four,.tri,.cta,.shots,.merge,.split,.loop{grid-template-columns:1fr}
 .pipe,.flow.n7,.flow.n5,.flow.n4{grid-template-columns:1fr}
 .stage:not(:last-child):after{right:50%;top:auto;bottom:-.62em;transform:translateX(50%) rotate(135deg)}
 .split .m{writing-mode:horizontal-tb;padding:.4em 1em;justify-content:center}
 .arr,.loop .a{transform:rotate(90deg)}
 .scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}.scroll>*{min-width:620px}
 .score header{grid-template-columns:1fr}.score .row{grid-template-columns:4em 1fr;}.score .row .bar{grid-column:1/-1}
 .base{grid-template-columns:1fr}
}
@media print{
 @page{size:A4 landscape;margin:0}
 body{background:#fff}.document-nav{display:none}
 .plm-proposal{width:297mm;margin:0}
 .pg{width:297mm;height:210mm;aspect-ratio:auto;margin:0;box-shadow:none;break-after:page;break-inside:avoid}
 .pg:last-child{break-after:auto}
 *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* Shared proposal dialog provides navigation and PDF download. */
.proposal-embedded .document-nav{display:none}
