/* 서비스 소개는 공통 스타일보다 범위를 구체화해 가독성을 유지한다. */
@font-face {
  font-family: "Foodnote Intro";
  font-style: normal;
  font-weight: 45 920;
  font-display: swap;
  src: url("/fonts/foodnote-intro.woff2") format("woff2");
}
html.rm #foodnote-workspace[data-view=intro] {
  --rm-font: "Foodnote Intro", "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", system-ui, sans-serif;
  --font-body: var(--rm-font);
  font-family: var(--rm-font);
}
html.rm #foodnote-workspace[data-view=intro],html.rm #foodnote-workspace[data-view=intro] .fw-device{background:#fff}
html.rm #foodnote-workspace[data-view=intro] .fw-main{padding:0}
html.rm #foodnote-workspace[data-view=intro] #fw-content{max-width:1200px;padding:0 24px 40px;margin:auto}
html.rm #foodnote-workspace[data-view=intro] .fn-header .fn-shell{max-width:1200px;width:100%;padding-inline:24px;margin:auto;box-sizing:border-box}
html.rm #foodnote-workspace .home-intro-page{color:#101828;overflow-wrap:break-word}
html.rm #foodnote-workspace .home-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:center;gap:64px;padding:64px 0 56px}
html.rm #foodnote-workspace .home-intro{min-width:0}
html.rm #foodnote-workspace .home-intro h1{font-size:clamp(34px,4vw,54px);font-weight:780;line-height:1.22;letter-spacing:-.045em;margin:0 0 24px}
html.rm #foodnote-workspace .home-lead{font-size:17px;line-height:1.85;color:#475467;margin:0 0 28px;max-width:34ch}
html.rm #foodnote-workspace .home-primary,html.rm #foodnote-workspace .home-secondary{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:52px;padding:12px 22px;box-sizing:border-box;border-radius:10px;font-size:16px;font-weight:650;text-decoration:none}
html.rm #foodnote-workspace .home-primary{background:#2457d6;color:#fff;border:1px solid #2457d6}
html.rm #foodnote-workspace .home-primary:hover{background:#1a43a8;color:#fff}
html.rm #foodnote-workspace .home-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
html.rm #foodnote-workspace .home-secondary.home-guide{gap:8px;border:1px solid #d0d5dd;background:#fff;color:#344054}
html.rm #foodnote-workspace .home-secondary.home-guide:hover{border-color:#2457d6;color:#2457d6;background:#f8faff}
html.rm #foodnote-workspace .home-guide svg{width:20px;height:20px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:420px){html.rm #foodnote-workspace .home-actions{gap:8px}html.rm #foodnote-workspace .home-actions>.home-primary,html.rm #foodnote-workspace .home-actions>.home-guide{flex:1 1 0;min-width:0;width:auto;padding-inline:12px;font-size:14px;gap:8px}}
html.rm #foodnote-workspace .home-primary svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
html.rm #foodnote-workspace .home-access{display:flex;align-items:center;gap:8px;font-size:13px;color:#475467;margin:16px 0 0}
html.rm #foodnote-workspace .home-access svg{width:17px;height:17px;fill:none;stroke:#2457d6;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
html.rm #foodnote-workspace .home-preview{min-width:0;border:1px solid #e4e7ec;border-radius:16px;background:#fff;box-shadow:0 12px 40px #10182808;overflow:hidden}
html.rm #foodnote-workspace .home-preview-head{display:flex;align-items:center;gap:12px;padding:24px;border-bottom:1px solid #e4e7ec}
html.rm #foodnote-workspace .home-preview-mark{display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;border-radius:10px;background:#e9eefb;color:#2457d6}
html.rm #foodnote-workspace .home-preview-mark svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
html.rm #foodnote-workspace .home-preview-head h2{margin:0 0 5px;font-size:17px;line-height:1.5;font-weight:700}
html.rm #foodnote-workspace .home-preview-head p{margin:0;color:#475467;font-size:12px}
html.rm #foodnote-workspace .home-preview-loading{padding:24px;min-height:172px;box-sizing:border-box;margin:0;font-size:14px;color:#475467;line-height:1.8}
html.rm #foodnote-workspace #home-preview-data{min-height:254px}
html.rm #foodnote-workspace .home-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:13px;font-variant-numeric:tabular-nums}
html.rm #foodnote-workspace .home-table th,html.rm #foodnote-workspace .home-table td{padding:16px 12px;text-align:right;vertical-align:middle;border-bottom:1px solid #f0f2f5;overflow-wrap:anywhere}
html.rm #foodnote-workspace .home-table tr>:first-child{width:40%;padding-left:24px;text-align:left}
html.rm #foodnote-workspace .home-table tr>:last-child{padding-right:24px}
html.rm #foodnote-workspace .home-table thead th{font-size:12px;font-weight:500;color:#475467;background:#f9fafb}
html.rm #foodnote-workspace .home-table tbody th{font-weight:550;color:#344054}
html.rm #foodnote-workspace .home-table td strong{font-size:17px;color:#101828;font-weight:700;white-space:nowrap}
html.rm #foodnote-workspace .home-example-source{padding:0 24px;font-size:12px;color:#475467}
html.rm #foodnote-workspace .home-example-source>summary{min-height:44px;display:flex;align-items:center;cursor:pointer}
html.rm #foodnote-workspace .home-example-source p{line-height:1.8;margin:8px 0 14px}
html.rm #foodnote-workspace .home-preview-foot{padding:12px 24px;background:#f9fafb;border-top:1px solid #e4e7ec}
html.rm #foodnote-workspace .home-preview-foot p{margin:0;font-size:12px;line-height:1.7;color:#475467}
html.rm #foodnote-workspace .home-preview-link{display:inline-flex;align-items:center;gap:12px;min-height:44px;font-size:14px;font-weight:650;text-decoration:none}
html.rm #foodnote-workspace .home-benefits{padding:32px 0 40px;border-top:1px solid #e4e7ec;border-bottom:1px solid #e4e7ec}
html.rm #foodnote-workspace .home-benefits>h2,html.rm #foodnote-workspace .home-how h2{margin:0;font-size:24px;line-height:1.45;font-weight:720;letter-spacing:-.025em}
html.rm #foodnote-workspace .home-benefit-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin:28px 0 0}
html.rm #foodnote-workspace .home-benefit-list>div{min-width:0}
html.rm #foodnote-workspace .home-benefit-list dt{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:650;line-height:1.6}
html.rm #foodnote-workspace .home-benefit-list svg{width:21px;height:21px;flex-shrink:0;fill:none;stroke:#2457d6;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
html.rm #foodnote-workspace .home-benefit-list dd{margin:12px 0 0 31px;font-size:14px;line-height:1.85;color:#475467;max-width:29ch}
html.rm #foodnote-workspace .home-how{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:40px 0}
html.rm #foodnote-workspace .home-how p{margin:12px 0 0;color:#475467;font-size:14px;line-height:1.85}
html.rm #foodnote-workspace .home-secondary{border:1px solid #d0d5dd;color:#344054;background:#fff;white-space:nowrap}
html.rm #foodnote-workspace .home-secondary:hover{border-color:#2457d6;color:#2457d6}
html.rm #foodnote-workspace .home-help{border-top:1px solid #e4e7ec;color:#475467;font-size:13px}
html.rm #foodnote-workspace .home-help>summary{display:flex;align-items:center;min-height:52px;cursor:pointer;list-style:disclosure-closed}
html.rm #foodnote-workspace .home-help>div{max-width:76ch;padding:0 0 12px}
html.rm #foodnote-workspace .home-help p{line-height:1.85;margin:8px 0 16px}
html.rm #foodnote-workspace .home-help strong{color:#344054}
html.rm #foodnote-workspace .home-text-button{border:0;background:transparent;color:#2457d6;min-height:44px;padding:0;font:inherit;font-weight:600;cursor:pointer}
@media(max-width:960px){
html.rm #foodnote-workspace .home-hero{gap:32px;padding-top:44px}
html.rm #foodnote-workspace .home-intro h1{font-size:38px}
html.rm #foodnote-workspace .home-desktop-break{display:none}
html.rm #foodnote-workspace .home-preview-head{padding:20px}
html.rm #foodnote-workspace .home-preview-head h2{font-size:15px}
html.rm #foodnote-workspace .home-table td strong{font-size:15px}
html.rm #foodnote-workspace .home-benefit-list{gap:24px}
html.rm #foodnote-workspace .home-benefit-list dd{margin-left:0}}
@media(max-width:760px){
html.rm #foodnote-workspace .home-hero{grid-template-columns:minmax(0,1fr);gap:32px;padding:36px 0}
html.rm #foodnote-workspace .home-intro h1{font-size:38px;margin-bottom:20px}
html.rm #foodnote-workspace .home-lead{max-width:40ch;font-size:16px;margin-bottom:22px}
html.rm #foodnote-workspace .home-preview{max-width:560px;width:100%}
html.rm #foodnote-workspace .home-benefit-list{grid-template-columns:minmax(0,1fr);gap:24px}
html.rm #foodnote-workspace .home-benefit-list dd{max-width:42ch;margin:8px 0 0 31px}
html.rm #foodnote-workspace .home-benefits{padding:28px 0}
html.rm #foodnote-workspace .home-benefits>h2,html.rm #foodnote-workspace .home-how h2{font-size:22px}
html.rm #foodnote-workspace .home-how{padding:32px 0;align-items:flex-start;flex-direction:column;gap:20px}}
@media(max-width:420px){
html.rm #foodnote-workspace[data-view=intro] #fw-content{padding-inline:16px}
html.rm #foodnote-workspace[data-view=intro] .fn-header .fn-shell{padding-inline:16px}
html.rm #foodnote-workspace .home-intro h1{font-size:34px}
html.rm #foodnote-workspace .home-primary{width:100%}
html.rm #foodnote-workspace .home-preview-head{padding:18px 16px;gap:9px}
html.rm #foodnote-workspace .home-preview-mark{width:34px;height:34px}
html.rm #foodnote-workspace .home-preview-head h2{font-size:14px}
html.rm #foodnote-workspace .home-preview-head p{font-size:11px}
html.rm #foodnote-workspace .home-table{font-size:12px}
html.rm #foodnote-workspace .home-table th,html.rm #foodnote-workspace .home-table td{padding:14px 7px}
html.rm #foodnote-workspace .home-table tr>:first-child{width:39%;padding-left:16px}
html.rm #foodnote-workspace .home-table tr>:last-child{padding-right:16px}
html.rm #foodnote-workspace .home-table td strong{font-size:13px}
html.rm #foodnote-workspace .home-example-source,html.rm #foodnote-workspace .home-preview-foot{padding-inline:16px}
html.rm #foodnote-workspace .home-benefit-list dd{margin-left:0}
html.rm #foodnote-workspace .home-access{font-size:12px}}
@media print{
html.rm #foodnote-workspace .home-primary,html.rm #foodnote-workspace .home-secondary,html.rm #foodnote-workspace .home-help{display:none}
html.rm #foodnote-workspace .home-hero{padding:16px 0}
html.rm #foodnote-workspace .home-preview{box-shadow:none}}
@media(max-width:420px){
html.rm #foodnote-workspace #home-preview-data{min-height:288px}}
html.rm #foodnote-workspace .home-help>summary::after,html.rm #foodnote-workspace .home-example-source>summary::after{content:"";width:7px;height:7px;flex-shrink:0;margin-left:10px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg)}
html.rm #foodnote-workspace .home-help[open]>summary::after,html.rm #foodnote-workspace .home-example-source[open]>summary::after{transform:translateY(2px) rotate(225deg)}
@media(min-width:1024px){html.rm #foodnote-workspace .home-hero{grid-template-columns:minmax(0,1fr) minmax(320px,460px)}html.rm #foodnote-workspace .home-intro h1{font-size:48px}}
html.rm #foodnote-workspace .home-service{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:36px 0 12px;padding:28px 32px;border-radius:16px;background:#101828;color:#fff}
html.rm #foodnote-workspace .home-service h2{font-size:23px;line-height:1.5;margin:8px 0;color:#fff}
html.rm #foodnote-workspace .home-service p{font-size:14px;line-height:1.8;margin:0;color:#e4e7ec}
html.rm #foodnote-workspace .home-service-label{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:12px;color:#e4e7ec}
html.rm #foodnote-workspace .home-service-label span{padding:2px 8px;border:1px solid #667085;border-radius:999px;font-size:11px}
html.rm #foodnote-workspace .home-service a{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;flex-shrink:0;border-radius:10px;background:#fff;color:#101828;font-size:14px;font-weight:700;text-decoration:none}
@media(max-width:720px){html.rm #foodnote-workspace .home-service{align-items:flex-start;flex-direction:column;padding:24px 20px}html.rm #foodnote-workspace .home-service h2{font-size:21px}}
