@charset "UTF-8";@import"https://fonts.googleapis.com/css2?family=Noto+Sans+KR&display=swap";@import"https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/variable/pretendardvariable.css";@import"https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css";@import"https://cdn.jsdelivr.net/gh/sunn-us/SUIT/fonts/variable/woff2/SUIT-Variable.css";@import"https://cdn.jsdelivr.net/gh/sunn-us/SUIT/fonts/static/woff2/SUIT.css";@import"https://cdn.jsdelivr.net/gh/sunn-us/SUITE/fonts/variable/woff2/SUITE-Variable.css";@import"https://cdn.jsdelivr.net/gh/sunn-us/SUITE/fonts/static/woff2/SUITE.css";@import"//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSansNeo.css";@import"//fonts.googleapis.com/earlyaccess/nanumgothic.css";@import"https://cdn.jsdelivr.net/gh/wanteddev/wanted-sans@v1.0.2/packages/wanted-sans/fonts/webfonts/static/complete/WantedSans.min.css";@import"https://cdn.jsdelivr.net/gh/wanteddev/wanted-sans@v1.0.2/packages/wanted-sans/fonts/webfonts/variable/complete/WantedSansVariable.min.css";@import"https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&display=swap";@import"https://fonts.googleapis.com/css2?family=Unbounded:wght@200..900&display=swap";@font-face{font-family:Min Sans Variable;src:local(※),url(/fonts/variable/MinSansVF.woff2) format("woff2")}@font-face{font-family:Min Sans Regular;src:local(※),url(/fonts/static/MinSans-Regular.woff2) format("woff2")}@font-face{font-family:Noto Sans Variable;src:local(※),url(/fonts/variable/NotoSansKR-VF-distilled.woff2) format("woff2")}@font-face{font-family:Nanum Square Neo Variable;src:local(※),url(/fonts/variable/NanumSquareNeo-Variable.woff2) format("woff2")}@font-face{font-family:IBMPlexSansKR-Regular;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-07@1.0/IBMPlexSansKR-Regular.woff) format("woff")}@font-face{font-family:KoddiUD Gothic Regular;src:local(※),url(/fonts/static/KoddiUDOnGothic-Regular.woff2) format("woff2")}@font-face{font-family:Nanum Square Neo Regular;src:local(※),url(/fonts/static/NanumSquareNeo-Regular.woff2) format("woff2")}@font-face{font-family:"87mmilsang Oblique";src:local(※),url(/fonts/static/87MMILSANG-Oblique.woff2) format("woff2")}@font-face{font-family:"87mmilsang Regular";src:local(※),url(/fonts/static/87MMILSANG-Regular.woff2) format("woff2")}@font-face{font-family:"87mmilsang Regular";src:local(※),url(/fonts/static/87MMILSANG-Regular.woff2) format("woff2")}@font-face{font-family:Interop;src:url(https://raw.githubusercontent.com/payw-org/Interop/main/web/fonts/Interop-Regular.woff2) format("woff2"),url(https://raw.githubusercontent.com/payw-org/Interop/main/web/fonts/Interop-Regular.woff) format("woff");font-weight:400;font-style:normal;font-display:block}@font-face{font-family:Freesentation-4Regular;src:url(https://fastly.jsdelivr.net/gh/projectnoonnu/2404@1.0/Freesentation-4Regular.woff2) format("woff2");font-weight:400;font-style:normal}@font-face{font-family:LINESeedKR-Rg;src:url(https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_11-01@1.0/LINESeedKR-Rg.woff2) format("woff2");font-weight:400;font-style:normal}@font-face{font-family:Paperlogy-4Regular;src:url(https://fastly.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-4Regular.woff2) format("woff2");font-weight:400;font-style:normal}@font-face{font-family:Freesentation Variable;src:local(※),url(/fonts/variable/Freesentation-variable.woff2) format("woff2")}@font-face{font-family:Freesentation Regular;src:url(https://fastly.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-4Regular.woff2) format("woff2");font-weight:400;font-style:normal}@font-face{font-family:AstaSans Variable;src:local(※),url(/fonts/variable/AstaSans-Variable.woff2) format("woff2")}@font-face{font-family:AstaSans-Bold;src:url(https://fastly.jsdelivr.net/gh/projectnoonnu/2505-1@1.0/AstaSans-Bold.woff2) format("woff2");font-weight:700;font-style:normal}@font-face{font-family:AstaSans-Regular;src:url(https://fastly.jsdelivr.net/gh/projectnoonnu/2505-1@1.0/AstaSans-Regular.woff2) format("woff2");font-weight:400;font-style:normal}@font-face{font-family:A2Z-Regular;src:local(※),url(/fonts/static/a2z-4Regular.woff2) format("woff2")}:root{--fs-base: 16px;--font-size-22: 22px;--font-weight: 400;--line-height: 1;--color-black: rgba(0, 0, 0, 1);--text-color-black: rgba(0, 0, 0, 1);--text-color-gray7: rgba(17, 17, 17, 1);--text-color-gray9: rgba(23, 23, 23, 1);--text-color-gray26: rgba(68, 68, 68, 1);--text-color-gray40: rgba(102, 102, 102, 1);--text-color-white: rgba(255, 255, 255, 1);--background-color-gray2: rgba(228, 228, 228, 1);--background-color-gray7: rgba(17, 17, 17, 1);--background-color-gray93: rgba(238, 238, 238, 1);--background-color-gray95: rgba(241, 241, 241, 1);--background-color-white: rgba(255, 255, 255, 1);--border-color-black: rgba(0, 0, 0, 1);--border-color-gray85: rgba(216, 216, 216, 1);--border-color-white: rgba(255, 255, 255, 1);--track-color: rgba(235, 235, 235, 1);--thumb-color: rgba(23, 23, 23, 1);--input-border-color: rgba(187, 187, 187, 1);--grid-min-width: 330px;--range-progress: 1.5% }*,*:before,*:after{box-sizing:border-box}a,a:hover{text-decoration:none}body,textarea,a,div,p{font-size:var(--fs-base);font-family:Pretendard Variable,sans-serif;color:var(--text-color-gray7)}body{background-color:#fafafa}.header{position:relative;display:flex;flex-wrap:wrap;align-items:center;max-width:1400px;padding:15px 20px;margin:auto}h1>a{display:flex;align-items:center;padding:15px 0 5px;font-size:20px;text-transform:capitalize;color:var(--text-color-black);font-family:Unbounded,sans-serif;font-optical-sizing:auto;font-weight:500;font-style:normal;font-variation-settings:"SOFT" 0,"WONK" 0}h1>a:before{content:"";width:34px;aspect-ratio:1;margin-right:8px;background-image:url(/_astro/logo_font_preview.DppEPTsD.png);background-size:100% 100%}.nav{display:flex;justify-self:flex-end;margin-left:auto}.nav a{display:block;padding:12px 15px;border-radius:100vmin;font-size:14px;line-height:1;color:var(--text-color-gray40);background-color:transparent;transition:background-color .1s ease-in}.nav a:hover{color:#171717;background-color:#0000000f}main{display:grid;grid-template-columns:1fr;gap:30px;max-width:1200px;padding:40px 20px;margin:auto}main:has(.checklist){grid-template-columns:1fr 230px}.home main{grid-template-columns:1fr;gap:0}.sidebar{--input-color-size: 16px;--input-range-border: 2px;grid-column:1/-1;grid-row:1/2;position:sticky;top:10px;z-index:99;display:flex;flex-wrap:wrap;align-items:center;padding:10px 15px;border:1px solid var(--border-color-gray85);border-radius:5px;background-color:#ffffff4d;box-shadow:2px 2px 5px #0000000d;-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px)}.sidebar .tit{margin:10px 20px 10px 0;font-size:20px}.sidebar>ul{display:flex;gap:10px;flex-grow:1}.sidebar li label{display:block;margin-bottom:8px;margin-left:2px;font-size:11px;text-transform:capitalize}.content{grid-column:1/2;grid-row:2/3}.checklist{grid-column:2/3;grid-row:2/3}.checklist h3{padding-bottom:10px;border-bottom:1px solid rgba(0,0,0,.1);margin-bottom:15px;font-weight:600;font-size:16px}.checklist li{margin-bottom:8px}.checklist input{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.checklist input+.text{padding:10px 16px;border-radius:4px;font-size:14px}.checklist input:checked+.text:before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' height='16' viewBox='0 0 20 20' width='16'%3E%3Cpath d='M14 7L8.5 12.5L6 10' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3C/path%3E%3C/svg%3E");background-position:50% 50%;background-color:var(--background-color-gray7);background-size:100% auto}.checklist .text{display:flex;align-items:center;font-size:14px;color:var(--text-color-gray9);background-color:var(--background-color-gray95);user-select:none;cursor:pointer}.checklist .text:hover{background-color:var(--background-color-gray93)}.checklist .text:before{content:"";display:inline-flex;align-items:center;justify-content:center;height:16px;width:16px;margin-right:10px;position:relative;transform:rotate(.000001deg);background:var(--ds-background-100);border-radius:4px;transition:border-color .2s,background .2s,box-shadow .2s;border:1px solid hsl(0,0%,56%)!important}.footer{grid-column:1/-1;grid-row:3/4;padding:30px 0;text-align:center}.header-wrap{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.header-wrap hgroup{padding:15px;border:1px solid rgb(234,234,234);border-radius:5px;background-color:var(--background-color-white)}.header-wrap h2{margin-bottom:15px;font-weight:500;font-size:32px;color:var(--text-color-gray26)}.header-wrap p{margin-bottom:30px;font-size:18px;color:var(--text-color-gray26)}.header-wrap .font-editor{height:170px;padding:15px;border:1px solid rgb(234,234,234);border-radius:5px;background-color:var(--background-color-white);font-weight:var(--font-weight);font-size:var(--font-size-22);line-height:var(--line-height);resize:none}.header-wrap .font-editor:focus{outline:none}.introduction{margin-bottom:20px;font-size:18px;line-height:1.5}.font-family-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,auto));grid-gap:20px}.font-family-list>li{padding:20px;border:1px solid var(--border-color-gray85);border-radius:8px;transition:box-shadow 3s cubic-bezier(.075,.82,.165,1);box-shadow:2px 2px 5px #00000008;background-color:var(--background-color-white)}.font-family-list>li:hover{box-shadow:0 2px 8px #63636333}.font-family-list dt{margin-bottom:5px;font-size:22px}.font-family-list dt+dd{margin-left:auto}.font-family-list dd{display:inline-flex;margin-left:6px}.font-family-list a{display:inline-flex;width:20px;height:20px;background-position:0 50%;background-repeat:no-repeat;background-size:100% 100%;font-size:0;color:transparent}.font-family-list a.github{background-image:url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M10.0083%200C4.47396%200%200%204.50694%200%2010.0826C0%2014.5396%202.86662%2018.3123%206.84338%2019.6476C7.34058%2019.748%207.5227%2019.4306%207.5227%2019.1637C7.5227%2018.93%207.50631%2018.1288%207.50631%2017.2939C4.72225%2017.895%204.14249%2016.092%204.14249%2016.092C3.69508%2014.9235%203.03215%2014.6232%203.03215%2014.6232C2.12092%2014.0055%203.09852%2014.0055%203.09852%2014.0055C4.1093%2014.0723%204.63969%2015.0405%204.63969%2015.0405C5.53432%2016.5761%206.97592%2016.1422%207.55588%2015.8751C7.63865%2015.224%207.90394%2014.7733%208.18563%2014.523C5.96514%2014.2893%203.62891%2013.4213%203.62891%209.54836C3.62891%208.44662%204.02634%207.54523%204.65608%206.8442C4.55672%206.59386%204.20866%205.5587%204.75564%204.17322C4.75564%204.17322%205.60069%203.90608%207.5061%205.20818C8.32188%204.98747%209.16317%204.8752%2010.0083%204.87426C10.8533%204.87426%2011.7148%204.99123%2012.5102%205.20818C14.4159%203.90608%2015.2609%204.17322%2015.2609%204.17322C15.8079%205.5587%2015.4596%206.59386%2015.3603%206.8442C16.0066%207.54523%2016.3876%208.44662%2016.3876%209.54836C16.3876%2013.4213%2014.0514%2014.2725%2011.8143%2014.523C12.179%2014.8401%2012.4936%2015.441%2012.4936%2016.3926C12.4936%2017.7446%2012.4773%2018.8298%2012.4773%2019.1635C12.4773%2019.4306%2012.6596%2019.748%2013.1566%2019.6478C17.1333%2018.3121%2020%2014.5396%2020%2010.0826C20.0163%204.50694%2015.526%200%2010.0083%200Z'%20fill='%2324292F'/%3e%3c/svg%3e")}.font-family-list a.homepage{background-image:url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M17.0701%202.93C15.2201%200.999998%2012.6601%20-0.0400016%2010.0001%20-1.57079e-06C7.34014%20-0.0400016%204.79014%200.999998%202.94014%202.93C1.00014%204.78%20-0.0398642%207.34%200.000135758%2010C-0.0398642%2012.66%201.00014%2015.21%202.93014%2017.06C4.78014%2019%207.34014%2020.04%2010.0001%2020C12.6601%2020.04%2015.2101%2019%2017.0601%2017.07C19.0001%2015.22%2020.0401%2012.66%2020.0001%2010C20.0401%207.34%2019.0001%204.78%2017.0701%202.93ZM15.0001%2010V16H11.5001V11H8.50014V16H5.00014V10H3.00014L10.0001%203L17.5001%2010H15.0001Z'%20fill='black'/%3e%3c/svg%3e")}.font-family-list a[href=""]{opacity:.7;pointer-events:none}.main-section{margin-top:40px}.main-section h2{margin-bottom:20px;font-weight:700;font-size:22px}.main-section .list a:hover{text-decoration:underline}.main-section .list li{position:relative;padding-left:13px;margin-bottom:10px;font-size:18px}.main-section .list li:before{content:"";position:absolute;top:11px;left:0;width:4px;height:4px;border-radius:50%;background-color:currentColor}.font-preview-container{--preview-font-size: 22px;--preview-font-weight: 400;--preview-line-height: 1;--preview-color-base: rgba(17, 17, 17, 1);--preview-background-color: var(--background-color-white);display:grid;grid-template-columns:repeat(2,1fr);gap:20px;min-height:200px;margin-top:20px}.font-preview-container:has(.active) .list-item:not(.active){display:none}.font-preview-container .list-item{min-height:200px;padding:15px;border:1px solid rgb(234,234,234);border-radius:5px;background-color:var(--preview-background-color)}.font-preview-container .list-item:hover{box-shadow:0 4px 3px -2px #091e4203,0 0 8px 1px #091e420a}.font-preview-container .font-name{margin-bottom:15px;font-weight:700;font-size:var(--fs-base)}.font-preview-container .font-preview{font-variation-settings:"wght" var(--preview-font-weight);font-weight:var(--preview-font-weight);font-size:var(--preview-font-size);line-height:var(--preview-line-height);color:var(--preview-color-base);word-break:break-all}.notosans-normal{font-family:Noto Sans KR,sans-serif}.pretendard{font-family:Pretendard Variable}.pretendard-normal{font-family:Pretendard}.suit{font-family:SUIT Variable}.suit-normal{font-family:SUIT,sans-serif}.suite{font-family:SUITE Variable,sans-serif}.suite-normal{font-family:SUITE,sans-serif}.minsans{font-family:Min Sans Variable}.minsans-normal{font-family:Min Sans Regular}.spoqa-han-sans-normal{font-family:Spoqa Han Sans Neo,sans-serif}.notosans{font-family:Noto Sans Variable,sans-serif}.nanumgothic-normal{font-family:Nanum Gothic,sans-serif}.ibmplexsanskr-normal{font-family:IBMPlexSansKR-Regular,sans-serif}.koddiud-normal{font-family:KoddiUD Gothic Regular,sans-serif}.nanum-square-neo{font-family:Nanum Square Neo Variable,sans-serif}.nanum-square-neo-normal{font-family:Nanum Square Neo Regular,sans-serif}.mmilsang88-normal{font-family:"87mmilsang Regular",sans-serif}.wantedsans-normal{font-family:Wanted Sans,sans-serif}.wantedsans{font-family:Wanted Sans Variable,sans-serif}.interop-normal{font-family:Interop,sans-serif}.lineseed-normal{font-family:LINESeedKR-Rg,sans-serif}.paperlogy-normal{font-family:Paperlogy-4Regular,sans-serif}.freesentation{font-family:Freesentation Variable,sans-serif;font-size:20px}.freesentation-normal{font-family:Freesentation-4Regular,sans-serif}.astasans{font-family:AstaSans Variable,sans-serif}.astasans-normal{font-family:AstaSans-Regular,sans-serif}.a2z-normal{font-family:A2Z-Regular,sans-serif}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;cursor:pointer;outline:none;border-radius:15px;background:linear-gradient(90deg,var(--thumb-color) var(--range-progress),var(--track-color) var(--range-progress));background-color:var(--track-color);height:6px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;height:15px;width:15px;background-color:var(--thumb-color);border-radius:50%;border:none;transition:.2s ease-in-out}input[type=range]::-moz-range-thumb{height:15px;width:15px;background-color:#f50;border-radius:50%;border:none;transition:.2s ease-in-out}input[type=range]::-webkit-slider-thumb:hover{box-shadow:0 0 0 10px #ff55001a}input[type=range]:active::-webkit-slider-thumb{box-shadow:0 0 0 13px #f503}input[type=range]:focus::-webkit-slider-thumb{box-shadow:0 0 0 13px #f503}input[type=range]::-moz-range-thumb:hover{box-shadow:0 0 0 10px #ff55001a}input[type=range]:active::-moz-range-thumb{box-shadow:0 0 0 13px #f503}input[type=range]:focus::-moz-range-thumb{box-shadow:0 0 0 13px #f503}