:root{--color-bg-box-default: #F6F8FA;--color-bg-box-dark: #373948;--color-bg-footer: #F6F6F6;--color-grayscale-gray-03: #E3E3E3;--color-border-default: #EDEDED;--color-border-active:#7730EA;--color-brand-mi-violet: #7730EA;--color-brand-mi-black: #242635;--color-icon-button-default: rgba(255, 255, 255, .6);--color-black: #000;--color-white: #FFF;--color-white-16: rgba(255, 255, 255, .16);--color-white-80: rgba(255, 255, 255, .8);--color-error: #F02A26;--color-text-navigation-default: #4D4D4D;--color-text-navigation-active: #7730EA;--color-text-head-1: #171717;--color-text-head-2: #323232;--color-text-head-3: #FFF;--color-text-head-4: #6F6F6F;--color-text-head-4-invert: rgba(174,174,174, 1);--color-text-body: #6F6F6F;--color-text-body-invert: #FFF;--color-text-caption: #323232;--color-text-footer-default:#8E8E8E;--color-bg-button-default: #7730EA;--color-bg-button-hover: #5F26BB;--color-text-button-default: #FFF;--radius-size-s: .5rem;--radius-box: 1rem}*{margin:0;padding:0;box-sizing:border-box;outline:none;-webkit-user-select:none;user-select:none;font-family:Pretendard,sans-serif}* *::-webkit-scrollbar{width:8px}* *::-webkit-scrollbar-track{background:transparent}* *::-webkit-scrollbar-corner{display:none}* *::-webkit-scrollbar-thumb{background:rgba(0,0,0,.35);border:2px rgb(255,255,255) solid;border-radius:.5rem}html{height:100%;width:100vw;font-size:16px;scroll-behavior:smooth}@media only screen and (max-width: 580px){html{font-size:14px}}body{height:100%;width:100%;margin:0;box-sizing:border-box;overflow-x:hidden;font-family:Pretendard,sans-serif}body>#root{position:relative;width:100%;height:100%}article#app{width:100%;background:white}article#app>div#main{display:flex;width:100%;flex-direction:column}article#app>div#main>#main-content{position:relative;display:flex;flex:1;width:100%;height:auto;justify-content:center}article#app>div#main>#main-content #content{display:flex;height:auto;justify-content:center;width:100%;margin:7.625rem 0 7.5rem;padding:0 2rem}@media screen and (max-width: 800px){article#app>div#main>#main-content #content{margin:9.4rem 0 10rem}}@media screen and (max-width: 580px){article#app>div#main>#main-content #content{padding:0 1.42rem}}.page.brand-guide{display:flex;gap:2.5rem;justify-content:flex-end;position:relative}.page.brand-guide>.nav-bar{width:8.75rem;height:100%}.page.brand-guide>.nav-bar>div{position:sticky;top:0;transform:translateY(8.125rem)}.page.brand-guide>.nav-bar>div>ul{list-style:none}.page.brand-guide>.nav-bar>div>ul>li{display:flex;padding:.375rem 0 .375rem 1rem;border-left:2px solid var(--color-border-default)}.page.brand-guide>.nav-bar>div>ul>li>.caption{color:var(--color-text-navigation-default)}.page.brand-guide>.nav-bar>div>ul>li>.caption>a{color:var(--color-text-navigation-default);text-decoration:none}.page.brand-guide>.nav-bar>div>ul>li.active{border-left:2px solid var(--color-border-active)}.page.brand-guide>.nav-bar>div>ul>li.active>.caption>a{color:var(--color-text-navigation-active)}@media screen and (max-width: 1200px){.page.brand-guide>.nav-bar{display:none}}.page.brand-guide>.content{max-width:53.75rem}.page.brand-guide>.content>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:3.75rem}@media screen and (max-width: 580px){.page.brand-guide>.content>header>span{font-size:3.14rem}}.page.brand-guide>.content>header>a{text-decoration:none}.page.brand-guide>.content>header>a>#button{height:fit-content;display:flex;align-items:center;gap:.375rem}.page.brand-guide>.content>header>a>#button>span{color:var(--color-text-button-default);display:inline-block;vertical-align:middle}@media screen and (max-width: 780px){.page.brand-guide>.content>header{flex-direction:column;align-items:flex-start;gap:1.25rem}}.page.brand-guide>.content>.container>.title-wrapper{margin-bottom:3rem}.page.brand-guide>.content>.container>.title-wrapper>div{margin-top:1.25rem;display:flex;flex-direction:column;gap:.5rem}.page.brand-guide>.content>.container>.title-wrapper>div>.body{white-space:normal;word-break:break-all;line-height:150%}.page.brand-guide>.content>.container:not(:nth-of-type(1)){margin-top:7.5rem}.page.brand-guide>.content>.container>.content-wrapper.grid{display:grid;row-gap:2rem;column-gap:1.5rem;grid-template-columns:1fr 1fr}@media only screen and (max-width: 580px){.page.brand-guide>.content>.container>.content-wrapper.grid{row-gap:1.14rem}}.page.brand-guide>.content>.container>.content-wrapper.grid>div:nth-of-type(1){grid-column:1/3;grid-row:1/2}.page.brand-guide>.content>.container>.content-wrapper.grid>div:nth-of-type(1)>.content{aspect-ratio:812/272}.page.brand-guide>.content>.container>.content-wrapper.grid>div:nth-of-type(2){grid-column:1/2;grid-row:2/3}.page.brand-guide>.content>.container>.content-wrapper.grid>div:nth-of-type(2)>.content{aspect-ratio:370/194}.page.brand-guide>.content>.container>.content-wrapper.grid>div:nth-of-type(3){grid-column:2/3;grid-row:2/3}.page.brand-guide>.content>.container>.content-wrapper.grid>div:nth-of-type(3)>.content{aspect-ratio:370/194}@media screen and (max-width: 580px){.page.brand-guide>.content>.container>.content-wrapper.grid{column-gap:0;grid-template-columns:1fr}.page.brand-guide>.content>.container>.content-wrapper.grid>div{grid-column:1/3!important}.page.brand-guide>.content>.container>.content-wrapper.grid>div>.content{aspect-ratio:508/236!important}.page.brand-guide>.content>.container>.content-wrapper.grid>div:nth-of-type(3){grid-row:3/4}}.page.brand-guide>.content>.container.basic-rule>.content-wrapper>div.card>.content{width:100%}.page.brand-guide>.content>.container.basic-rule>.content-wrapper>div.card:nth-of-type(1)>.content>img{width:65%}.page.brand-guide>.content>.container.basic-rule>.content-wrapper>div.card:nth-of-type(2)>.content>img{width:75%}.page.brand-guide>.content>.container.basic-rule>.content-wrapper>div.card:nth-of-type(3)>.content>img{width:75%}.page.brand-guide>.content>.container.brand-color>.content-wrapper{display:grid;grid-template-columns:1fr 1fr;column-gap:1.5rem}@media screen and (max-width: 580px){.page.brand-guide>.content>.container.brand-color>.content-wrapper{grid-template-columns:1fr;gap:1rem;row-gap:1.14rem}}.page.brand-guide>.content>.container.service-logo>.content-wrapper>div.card:nth-of-type(1)>.content{aspect-ratio:812/325}.page.brand-guide>.content>.container.service-logo>.content-wrapper>div.card:nth-of-type(1)>.content>.image-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%;gap:3.375rem}.page.brand-guide>.content>.container.service-logo>.content-wrapper>div.card:nth-of-type(1)>.content>.image-wrapper img{max-height:3.4375rem;aspect-ratio:30/5}@media screen and (max-width: 780px){.page.brand-guide>.content>.container.service-logo>.content-wrapper>div.card:nth-of-type(1)>.content>.image-wrapper img{max-width:80%}}.page.brand-guide>.content>.container.service-logo>.content-wrapper>div.card:nth-of-type(2)>.content>img{width:70%}.page.brand-guide>.content>.container.service-logo>.content-wrapper>div.card:nth-of-type(3)>.content>img{width:65%}.page.brand-guide>.content>.container.logo-usage-rule>.content-wrapper{display:flex;flex-wrap:wrap;gap:2rem 1.375rem}@media screen and (max-width: 580px){.page.brand-guide>.content>.container.logo-usage-rule>.content-wrapper{gap:1.14rem 0}}.page.brand-guide>.content>.container.logo-usage-rule>.content-wrapper>.logo-usage-rule-card{flex:1 1 30%}.page.brand-guide>.content>.container.logo-usage-rule>.content-wrapper>.logo-usage-rule-card:nth-of-type(1)>.image-wrapper img{width:11.75rem}.page.brand-guide>.content>.container.logo-usage-rule>.content-wrapper>.logo-usage-rule-card:nth-of-type(2)>.image-wrapper img{width:10rem}.page.brand-guide>.content>.container.logo-usage-rule>.content-wrapper>.logo-usage-rule-card:nth-of-type(3)>.image-wrapper img{width:11.75rem}.page.brand-guide>.content>.container.logo-usage-rule>.content-wrapper>.logo-usage-rule-card:nth-of-type(4)>.image-wrapper img{width:11.75rem}.page.brand-guide>.content>.container.logo-usage-rule>.content-wrapper>.logo-usage-rule-card:nth-of-type(5)>.image-wrapper{background-repeat:no-repeat;background-size:100%}.page.brand-guide>.content>.container.logo-usage-rule>.content-wrapper>.logo-usage-rule-card:nth-of-type(5)>.image-wrapper img{width:11.75rem}.page.brand-guide>.content>.container.logo-usage-rule>.content-wrapper>.logo-usage-rule-card:nth-of-type(6)>.image-wrapper{background:#E9EDF4}.page.brand-guide>.content>.container.logo-usage-rule>.content-wrapper>.logo-usage-rule-card:nth-of-type(6)>.image-wrapper img{width:11.75rem}@media screen and (max-width: 780px){.page.brand-guide>.content>.container.logo-usage-rule>.content-wrapper>.logo-usage-rule-card{flex:1 1 45%}}@media screen and (max-width: 580px){.page.brand-guide>.content>.container.logo-usage-rule>.content-wrapper>.logo-usage-rule-card{flex:1 1 100%}.page.brand-guide>.content>.container.logo-usage-rule>.content-wrapper>.logo-usage-rule-card>.image-wrapper img{width:75%!important}}.page.brand-guide>.content>.container.slogan>.content-wrapper>.card:nth-of-type(1){background-image:linear-gradient(0deg,#F6F8FA 0%,rgba(244,246,249,0) 100%,rgba(246,248,250,0) 100%),linear-gradient(145deg,#FFE1D0 0%,#EBD4FF 52.6%,#C9E9FF 100%);background-position:50% 100%;background-size:1398px 590px;background-repeat:no-repeat}.page.brand-guide>.content>.container.slogan>.content-wrapper>.card:nth-of-type(1)>.content>img{width:75%}.page.brand-guide>.content>.container.slogan>.content-wrapper>.card:nth-of-type(2)>.content>img{width:60%}.page.brand-guide>.content>.container.slogan>.content-wrapper>.card:nth-of-type(3)>.content>img{width:75%}#button{background:var(--color-bg-button-default);padding:1rem 1.5rem;color:var(--color-text-button-default);border-radius:var(--radius-size-s);display:inline-flex;align-items:center;cursor:pointer}#button>svg{height:1rem;width:1rem}#button:hover{background:var(--color-bg-button-hover)}.flake-ui.typography{width:100%;height:100%;font-family:Pretendard}.flake-ui.typography .heading1{font-size:3.5rem;color:var(--color-text-head-1);font-weight:700;line-height:125%}.flake-ui.typography .heading2{font-size:2rem;font-weight:600;line-height:125%;color:var(--color-text-head-2)}.flake-ui.typography .heading3{font-size:1.25rem;font-weight:700;line-height:125%;color:var(--color-text-head-3)}.flake-ui.typography .heading4{font-size:1rem;font-weight:500;line-height:125%;color:var(--color-text-head-4)}.flake-ui.typography .body{font-size:1rem;font-weight:400;line-height:125%;color:var(--color-text-body)}.flake-ui.typography .body.bold{font-weight:700}.flake-ui.typography .caption{font-size:.75rem;font-weight:500;line-height:125%;color:var(--color-text-caption)}.flake-ui.typography .caption.bold{font-weight:700}.flake-ui.card{background:var(--color-bg-box-default);border-radius:var(--radius-box);padding:1.5rem;transition:background-color .25s ease}.flake-ui.card>.title{display:flex;justify-content:space-between;margin-bottom:.625rem;position:relative}.flake-ui.card>.content{display:flex;flex-direction:column;align-items:center;justify-content:center}.flake-ui.card.dark{background-color:var(--color-bg-box-dark)}.flake-ui.card.dark>.title>.heading4{color:var(--color-text-head-4-invert)}.flake-ui.switch{--switch-width: 4.375rem;--switch-height: 2.5rem;display:inline-block}.flake-ui.switch.default{--switch-width: 4.375em;--switch-height: 2.5rem}.flake-ui.switch.small{--switch-width: 2rem;--switch-height: 1.25rem}.flake-ui.switch.large{--switch-width: 4rem;--switch-height: 2.25rem}.flake-ui.switch>.container{position:relative;overflow:hidden;padding:0;width:var(--switch-width);height:var(--switch-height);border-radius:4rem;background-color:var(--color-grayscale-gray-03);cursor:pointer;transition:all .25s ease}.flake-ui.switch>.container>.circle{position:absolute;display:flex;justify-content:center;align-items:center;top:calc(50% - var(--switch-height) * .4);left:0;border-radius:100rem;width:calc(var(--switch-height) * .7);height:calc(var(--switch-height) * .7);background-color:#fff;box-shadow:0 2px 6px #0003;transform:translate(calc(var(--switch-width) / 15));transition:transform .25s ease 0s,width .2s ease 0s}.flake-ui.switch>.container>.circle.dark-mode{display:flex;padding:.375rem;width:fit-content;height:fit-content}.flake-ui.switch>.container>.circle.dark-mode>svg{width:1.25rem;height:1.25rem}.flake-ui.switch>.container>.circle.ani-circle{width:calc(var(--switch-height) * .7 + var(--switch-width) / 10);transform:translate(calc(var(--switch-width) / 7.5))}.flake-ui.switch>.container.checked{background-color:var(--color-black)}.flake-ui.switch>.container.checked>.circle{transform:translate(calc(var(--switch-width) - var(--switch-width) / 7 - var(--switch-height) * .7))}.flake-ui.switch>.container.checked>.circle.ani-circle{transform:translate(calc(var(--switch-width) - var(--switch-width) / 4.5 - var(--switch-height) * .7))}.flake-ui.switch.disabled>.container{cursor:not-allowed;background:rgba(29,34,41,.2)!important;pointer-events:none}.flake-ui.color-card{border-radius:var(--radius-box);padding:1.5rem 1.5rem 2.5rem 2.5rem}.flake-ui.color-card>.title-wrapper{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1rem 1rem 0;position:relative}.flake-ui.color-card>.title-wrapper>.heading3{flex:1}.flake-ui.color-card>.title-wrapper>.icon{position:relative;cursor:pointer}.flake-ui.color-card>.title-wrapper>.icon>svg{width:1.5rem;height:1.5rem;color:var(--color-icon-button-default);position:relative}.flake-ui.color-card>.title-wrapper>.icon.hover>svg,.flake-ui.color-card>.title-wrapper>.icon.mobile>svg{transition:none;fill:#fff}.flake-ui.color-card>.title-wrapper>.icon.hover:after,.flake-ui.color-card>.title-wrapper>.icon.mobile:after{position:absolute;top:0;left:0;transform:translate(-30%,-30%);content:" ";background:var(--color-white-16);border-radius:999px;width:3.5rem;height:3.5rem}.flake-ui.color-card>.title-wrapper>.icon>.tool-tip{position:absolute;right:0%;bottom:0%;width:max-content;display:flex;align-items:center;transform:translate(36%,140%);background:var(--color-white);transform-origin:0% 50%;border-radius:var(--radius-size-s);gap:.25rem;padding:.75rem;box-shadow:0 6px 12px #0000002e}.flake-ui.color-card>.title-wrapper>.icon>.tool-tip>svg{width:.875rem;height:.875rem;color:var(--color-brand-mi-violet)}.flake-ui.color-card>.title-wrapper>.icon>.tool-tip.mobile{transform:translate(10%,140%)}.flake-ui.color-card>.content-wrapper{height:15rem;display:flex;flex-direction:column;justify-content:flex-end;gap:.5rem}.flake-ui.color-card>.content-wrapper .body{color:var(--color-text-body-invert)}.flake-ui.color-card>.content-wrapper .body.bold{margin-right:.5rem}@media screen and (max-width: 580px){.flake-ui.color-card>.content-wrapper{height:8.58rem}}.flake-ui.logo-usage-rule-card{border-radius:var(--radius-box);border:1px solid var(--color-border-default);overflow:hidden}.flake-ui.logo-usage-rule-card>.image-wrapper{background:var(--color-white);width:100%;aspect-ratio:272/192;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;background-size:contain}.flake-ui.logo-usage-rule-card>.image-wrapper:after{position:absolute;content:" ";width:150%;height:1px;z-index:10;background:var(--color-error);transform:rotate(-35deg)}@media screen and (max-width: 580px){.flake-ui.logo-usage-rule-card>.image-wrapper{aspect-ratio:320/226}}.flake-ui.logo-usage-rule-card>.desc-wrapper{background:var(--color-bg-box-default);display:flex;align-items:center;padding:1rem;gap:.25rem;height:3rem}.flake-ui.logo-usage-rule-card>.desc-wrapper>img{width:1rem;height:1rem}@media screen and (max-width: 580px){.flake-ui.logo-usage-rule-card>.desc-wrapper{height:fit-content;padding:1.14rem}}#gnb{background-color:var(--color-white-80);z-index:999;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-bottom:1px solid var(--color-border-default);position:fixed;top:0;min-width:100%}#gnb>div{height:64px;margin:auto;display:flex;max-width:65rem;align-items:center}#gnb>div>img{height:26px}@media screen and (max-width: 1200px){#gnb{padding:0 1.7rem}#gnb>div{height:54px;width:100%;margin:0}#gnb>div>img{height:25px}}#footer{background-color:var(--color-bg-footer);padding:1.68rem 0}#footer>div{max-width:65rem;width:100%;font-size:.75rem;margin:auto;display:flex;justify-content:space-between;color:var(--color-text-footer-default)}#footer>div>.manager{display:flex;gap:.75rem}@media screen and (max-width: 1200px){#footer{padding:1.5rem 2rem}}