.bg-black{background-color:#000}.bg-black span{color:#fff}.bg-grey{background-color:#bdbdbd}.bg-white{background-color:#fff}.bg-green{background-color:#029902}.bg-yellow{background-color:#fcbe1d}.bg-blue{background-color:#1c40cf}.bg-red{background-color:#f83c00}.bg-brown{background-color:#7f4d1f}.bg-dark-brown{background-color:#422307}.bg-dark-brown span{color:#fff}.bg-beige{background-color:#fbf9ea}.bg-divider{background-color:#ebebeb}.bg-light-blue{background-color:#dae8ff}body:has(.guide-container){background-color:#000}.guide-container{max-width:1200px;margin:0 auto;padding:80px 20px;background:#fff;color:#000}.guide-header{border-bottom:2px solid #000000;margin-bottom:60px;padding-bottom:20px}.guide-section{margin-bottom:80px}.guide-title{font-family:Bricolage Grotesque,sans-serif;font-variation-settings:"wdth" 88;font-size:32px;line-height:1;letter-spacing:-.02em;font-weight:600}@media(max-width:1279px){.guide-title{font-size:24px;line-height:1;letter-spacing:-.02em;font-weight:600}}@media(max-width:799px){.guide-title{font-size:20px;line-height:1;letter-spacing:-.02em;font-weight:600}}.guide-title{margin-bottom:30px;text-transform:uppercase;color:#999}.typo-list .typo-item{margin-bottom:40px;border-bottom:1px solid #eee;padding-bottom:20px}.typo-list .typo-item .label{font-size:12px;color:#666;margin-bottom:10px}.typo-list .h1-text{font-family:Bricolage Grotesque,sans-serif;font-variation-settings:"wdth" 88;font-size:200px;line-height:.8;letter-spacing:-.02em;font-weight:800}@media(max-width:1279px){.typo-list .h1-text{font-size:160px;line-height:.8;letter-spacing:-.02em;font-weight:800}}@media(max-width:799px){.typo-list .h1-text{font-size:80px;line-height:.8;letter-spacing:-.02em;font-weight:800}}.typo-list .h2-text{font-family:Bricolage Grotesque,sans-serif;font-variation-settings:"wdth" 88;font-size:120px;line-height:.8;letter-spacing:-.02em;font-weight:800}@media(max-width:1279px){.typo-list .h2-text{font-size:72px;line-height:.8;letter-spacing:-.02em;font-weight:800}}@media(max-width:799px){.typo-list .h2-text{font-size:40px;line-height:.8;letter-spacing:-.02em;font-weight:800}}.typo-list .h3-text{font-family:Bricolage Grotesque,sans-serif;font-variation-settings:"wdth" 88;font-size:80px;line-height:.8;letter-spacing:-.02em;font-weight:800}@media(max-width:1279px){.typo-list .h3-text{font-size:64px;line-height:.8;letter-spacing:-.02em;font-weight:800}}@media(max-width:799px){.typo-list .h3-text{font-size:32px;line-height:.8;letter-spacing:-.02em;font-weight:800}}.typo-list .h4-text{font-family:Bricolage Grotesque,sans-serif;font-variation-settings:"wdth" 88;font-size:56px;line-height:1;letter-spacing:-.02em;font-weight:600}@media(max-width:1279px){.typo-list .h4-text{font-size:48px;line-height:1;letter-spacing:-.02em;font-weight:600}}@media(max-width:799px){.typo-list .h4-text{font-size:24px;line-height:1;letter-spacing:-.02em;font-weight:600}}.typo-list .h5-text{font-family:Bricolage Grotesque,sans-serif;font-variation-settings:"wdth" 88;font-size:32px;line-height:1;letter-spacing:-.02em;font-weight:600}@media(max-width:1279px){.typo-list .h5-text{font-size:24px;line-height:1;letter-spacing:-.02em;font-weight:600}}@media(max-width:799px){.typo-list .h5-text{font-size:20px;line-height:1;letter-spacing:-.02em;font-weight:600}}.typo-list .p1-text{font-family:Archivo Narrow,Pretendard,sans-serif;font-size:32px;line-height:1.2;letter-spacing:-.02em;font-weight:500}@media(max-width:1279px){.typo-list .p1-text{font-size:28px;line-height:1.2;letter-spacing:-.02em;font-weight:500}}@media(max-width:799px){.typo-list .p1-text{font-size:28px;line-height:1.2;letter-spacing:-.02em;font-weight:500}}.typo-list .p2-text{font-family:Archivo Narrow,Pretendard,sans-serif;font-size:24px;line-height:1.2;letter-spacing:0em;font-weight:400}@media(max-width:1279px){.typo-list .p2-text{font-size:20px;line-height:1.3;letter-spacing:0em;font-weight:400}}@media(max-width:799px){.typo-list .p2-text{font-size:18px;line-height:1.4;letter-spacing:0em;font-weight:400}}.typo-list .p3-text{font-family:Lisu Bosa,serif;font-size:20px;line-height:1;letter-spacing:0em;font-weight:200}@media(max-width:1279px){.typo-list .p3-text{font-size:18px;line-height:1.3;letter-spacing:-.04em;font-weight:200}}@media(max-width:799px){.typo-list .p3-text{font-size:18px;line-height:1.3;letter-spacing:-.04em;font-weight:200}}.typo-list .p4-text{font-family:Archivo Narrow,Pretendard,sans-serif;font-size:16px;line-height:1.3;letter-spacing:0em;font-weight:400}.typo-list .caption1{font-family:Archivo Narrow,Pretendard,sans-serif;font-size:12px;line-height:1.2;letter-spacing:.12em;font-weight:500;text-transform:uppercase}.typo-list .caption2{font-family:Archivo Narrow,Pretendard,sans-serif;font-size:10px;line-height:1.2;letter-spacing:.12em;font-weight:500;text-transform:uppercase}.color-list{display:grid;grid-template-columns:repeat(auto-fill,100px);gap:16px}.color-list .color-item{text-align:center}.color-list .color-item:hover span{opacity:1}.color-list .color-item span{display:block;font-size:12px;opacity:0;transition:opacity .3s}.color-list .box{display:flex;justify-content:center;align-items:center;width:100px;height:100px;border-radius:50px;border:1px solid #eee}.component-list .component-item{margin-bottom:40px}.component-list .component-item .label{font-size:12px;color:#666;margin-bottom:10px}.component-list .component-item .component-view{display:flex;flex-direction:column;align-items:flex-start;min-height:150px;width:100%}.component-list .component-item .component-view .project-list{max-width:640px}