@charset "UTF-8";body{background-color:#121212;color:#f8fafc;margin:0;font-family:NanumSquareNeo}body.light-mode{background-color:#f8f8f8;color:#121212;transition:background-color .3s ease,color .3s ease}a{text-decoration:none;color:inherit;cursor:inherit}h1,h2,h3,h4,h5,h6,p,ul,ol{font-family:Montserrat,sans-serif;margin:0}.main-container{display:flex;justify-content:center}.main-container .main{display:flex;flex-direction:column;align-items:center}.main-container section{display:flex;justify-content:center;width:100%}@media (min-width: 768px){.main-container .main{width:calc(100% - 80px);padding:0 40px}}@media (min-width: 1024px){.main-container .main{width:calc(100% - 120px);padding:0 60px}}@media (min-width: 1280px){.main-container .main{width:calc(100% - 200px);padding:0 100px}}.mainHeader-container{width:100%;display:flex;justify-content:center;border-bottom:1px solid rgba(75,85,99,.3);position:fixed;top:0;z-index:10;background-color:#0000004d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:transform .3s ease}.mainHeader-container.hidden{transform:translateY(-100%)}.mainHeader-container.visible{transform:translateY(0)}.mainHeader-container.light-mode{background-color:#0000000d}.mainHeader-container.light-mode .item-text{color:#555}.mainHeader{padding:0 40px;max-width:1300px;width:100%;height:60px;display:flex;justify-content:space-between;align-items:center;font-family:Montserrat,sans-serif}.mainHeader .logo{display:flex}.mainHeader .logo-text{font-size:20px;font-weight:700}.mainHeader .logo-text:hover{cursor:pointer}.mainHeader .menu{display:flex;justify-content:space-between;width:40%}.mainHeader .item{display:flex;justify-content:center;align-items:center;width:100%;cursor:default}.mainHeader .item-text{color:#afb8c6;transition:color .2s}.mainHeader .item1:hover{cursor:pointer;color:#ff408084;font-weight:700}.mainHeader .item2:hover{cursor:pointer;color:#3578e5b3;font-weight:700}.mainHeader .item3:hover{cursor:pointer;color:#ff9900ab;font-weight:700}.toggle-switch{width:52px;height:20px;position:relative;display:flex;align-items:center;cursor:pointer}.toggle-switch .track{width:100%;height:100%;background-color:#f8fafcb3;border-radius:17px;transition:background-color .5s}.toggle-switch .thumb{position:absolute;top:-6px;left:-3px;width:32px;height:32px;background-color:#252525;border-radius:50%;transition:transform .3s ease-out,background-color .3s ease-in;display:flex;align-items:center;justify-content:center}.toggle-switch .thumb:before{content:"";width:20px;height:20px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20' width='20' viewBox='0 0 20 20'><path fill='%23f8fafc' d='M4.2 2.5l-.7 1.8-1.8.7 1.8.7.7 1.8.6-1.8L6.7 5l-1.9-.7-.6-1.8zm15 8.3a6.7 6.7 0 11-6.6-6.6 5.8 5.8 0 006.6 6.6z'/></svg>");background-repeat:no-repeat;background-position:center}.toggle-switch.active .track{background-color:#252525b3}.toggle-switch.active .thumb{background-color:#f8fafc;transform:translate(30px)}.toggle-switch.active .thumb:before{content:"";background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='20' width='20' viewBox='0 0 20 20'><path fill='%23252525' d='M9.305 1.667V3.75h1.389V1.667h-1.39zm-4.707 1.95l-.982.982L5.09 6.072l.982-.982-1.473-1.473zm10.802 0L13.927 5.09l.982.982 1.473-1.473-.982-.982zM10 5.139a4.872 4.872 0 00-4.862 4.86A4.872 4.872 0 0010 14.862 4.872 4.872 0 0014.86 10 4.872 4.872 0 0010 5.139zm0 1.389A3.462 3.462 0 0113.471 10a3.462 3.462 0 01-3.473 3.472A3.462 3.462 0 016.527 10 3.462 3.462 0 0110 6.528zM1.665 9.305v1.39h2.083v-1.39H1.666zm14.583 0v1.39h2.084v-1.39h-2.084zM5.09 13.928L3.616 15.4l.982.982 1.473-1.473-.982-.982zm9.82 0l-.982.982 1.473 1.473.982-.982-1.473-1.473zM9.305 16.25v2.083h1.389V16.25h-1.39z'/></svg>")}.start-container{position:relative;display:flex;flex-direction:column;justify-content:center;width:100%;max-width:1300px;height:100vh;margin:0 40px;padding-top:60px}.start-container.light-mode .frontend-text,.start-container.light-mode .code-text,.start-container.light-mode .react-text,.start-container.light-mode .typescript-text{opacity:.9}.start-container.light-mode .tag{border:1px solid #333}.start-container.light-mode .portfolio-title{color:#333}.frontend-text{font-family:Montserrat,sans-serif;font-size:56px;font-weight:700;color:#3578e5b3;position:absolute;top:22%;left:0;opacity:.5;text-shadow:3px 3px 10px hsla(217,77%,55%,.4);animation:bounce 3.2s infinite alternate;pointer-events:none;-webkit-user-select:none;user-select:none;filter:blur(5px)}.code-text{font-family:Montserrat,sans-serif;font-size:84px;font-weight:700;color:#ff9900ab;position:absolute;rotate:30deg;top:14%;right:21%;opacity:.5;text-shadow:3px 3px 10px rgba(255,153,0,.4);animation:bounce 2s infinite alternate;pointer-events:none;-webkit-user-select:none;user-select:none;filter:blur(4px)}.react-text{font-family:Montserrat,sans-serif;font-size:80px;font-weight:700;color:#6e6e6e;position:absolute;top:40%;right:5px;opacity:.5;text-shadow:3px 3px 10px rgba(248,250,252,.4);animation:bounce 3s infinite alternate;pointer-events:none;-webkit-user-select:none;user-select:none;filter:blur(6px)}.typescript-text{font-family:Montserrat,sans-serif;font-size:80px;font-weight:700;color:#ff408084;position:absolute;rotate:-10deg;bottom:11%;left:50%;opacity:.5;text-shadow:3px 3px 10px rgba(255,64,128,.4);animation:bounce 2.5s infinite alternate;pointer-events:none;-webkit-user-select:none;user-select:none;filter:blur(7px)}.text-container .portfolio-title{font-size:14px;color:gray}.text-container .main-heading{font-family:NanumSquareNeoExtraBold;font-size:80px;font-weight:800}.text-container .lg-hidden{display:none}@media (max-width: 1024px){.text-container .lg-hidden{display:block}}.text-container .lg-inline{display:inline}@media (max-width: 1024px){.text-container .lg-inline{display:none}}.typed-container{height:124px}.typed-text{font-family:Montserrat,sans-serif;font-size:80px;font-weight:400}.typed-text~.typed-cursor{font-size:76px}.tag-container{display:flex;gap:10px}.tag{font-size:14px;padding:10px 20px;border:1px solid #4a5568;border-radius:20px;font-family:Montserrat,sans-serif;display:inline-block}.tag1:hover{cursor:pointer;background-color:#ff408084;border:1px solid rgba(255,64,128,.5176470588)}.tag2:hover{cursor:pointer;background-color:#3578e5b3;border:1px solid rgba(53,120,229,.7019607843)}.tag3:hover{cursor:pointer;background-color:#ff9900ab;border:1px solid rgba(255,153,0,.6705882353)}.used-stack{display:flex;flex-direction:column;justify-content:flex-start;width:calc(100% - 80px);max-width:1300px;padding:60px 40px 140px}.used-stack .contents{display:flex;flex-direction:column;gap:20px}.used-stack .text{display:flex;flex-direction:column;width:100%}.used-stack .text h3{font-family:NanumSquareNeoExtraBold;font-size:40px;margin-bottom:16px;line-height:1.5}.used-stack .text p{font-family:NanumSquareNeo;font-size:18px;line-height:1.4;color:#9ca3af}.used-stack .used-stack-cards{display:grid;gap:1.25rem;width:100%;aspect-ratio:7/4;margin-top:50px;grid-template-columns:repeat(1,minmax(0,1fr))}.used-stack.light-mode .text p{color:#333}@media (min-width: 768px){.used-stack .used-stack-cards{grid-template-columns:repeat(1,minmax(0,1fr))}}@media (min-width: 1024px){.used-stack .used-stack-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width: 1280px){.used-stack .used-stack-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}.used-stack-card.light-mode{background-color:#b0b0b09d}.used-stack-card.light-mode .text{color:#111}.used-stack-card{display:flex;justify-content:flex-start;border-radius:10px;padding:1.5rem;background-color:#2525259d}.used-stack-card .icon{display:flex;justify-content:center;align-items:center;background-color:#121212;border-radius:50%;width:50px;height:50px}.used-stack-card .title-box{display:flex;align-items:center;gap:20px;width:100%;margin-bottom:24px}.used-stack-card .title{width:calc(100% - 66px);font-size:24px;font-weight:500;font-family:Montserrat,sans-serif}.used-stack-card .text{margin-left:0;line-height:1.8;color:#d0d4db}.used-stack-card .text div{margin-bottom:16px}.career-container{display:flex;flex-direction:column;margin-top:100px}.career-container .career-content{display:flex;flex-direction:column}.career-container .career-content .section-title{font-weight:600;font-size:32px;margin-bottom:60px}.career-container .career-content .career-list{display:flex;flex-direction:column;gap:30px;margin-left:40px}.career-container .career-content .career-list .career-item{display:flex;flex-direction:column;gap:15px}@media (min-width: 768px){.career-container .career-content .career-list .career-item{flex-direction:row;gap:40px}}.career-container .career-content .career-list .career-item .career-info{width:100%;max-width:30%;margin-bottom:20px}.career-container .career-content .career-list .career-item .career-info .job-title{font-weight:600;font-size:24px;margin-bottom:10px}.career-container .career-content .career-list .career-item .career-info .company-position{font-weight:600;margin-bottom:5px}.career-container .career-content .career-list .career-item .career-info .date{font-size:14px;color:gray}.career-container .career-content .career-list .career-item .career-details{flex:1;display:flex;flex-direction:column;gap:10px}.career-container .career-content .career-list .career-item .career-details .company-name{display:flex;align-items:center;gap:20px;font-weight:600;font-size:20px;margin-bottom:10px}.career-container .career-content .career-list .career-item .career-details .link-button{font-size:14px;padding:5px 10px;border:1px solid #4a5568;border-radius:20px;font-family:Montserrat,sans-serif;background-color:#121212;color:#f8fafc;transition:background-color .1s ease,color .1s ease;white-space:nowrap}.career-container .career-content .career-list .career-item .career-details .link-button.light-mode{border:1px solid #333;background-color:#ddd;color:#121212}.career-container .career-content .career-list .career-item .career-details .link-button:hover{background-color:#ddd;color:#121212;cursor:pointer}.career-container .career-content .career-list .career-item .career-details .link-button.light-mode:hover{background-color:#121212;color:#f8fafc}.career-container .career-content .career-list .career-item .career-details .description{font-family:NanumSquareNeo;font-size:16px;line-height:1.3;color:#d0d4db}.career-container .career-content .career-list .career-item .career-details .description p{display:flex;align-items:center;gap:10px;padding-bottom:12px}.career-container .career-content .career-list .career-item .career-details .description .spot{font-size:20px}.career-container .career-content .career-list .career-item .career-details .description.light-mode{color:#333}.project.light-mode h3 p{color:#555}.project{display:flex;flex-direction:column;max-width:1300px;padding:60px 40px 0}.project h2{font-size:64px;margin-bottom:80px;font-weight:400}.project h3{font-family:Montserrat,sans-serif;font-size:24px;font-weight:600;margin-bottom:30px}.project h3 p{font-family:NanumSquareNeo;font-size:16px;margin-top:5px;color:#9ca3af}.project .grid-container{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:40px}@media (min-width: 768px){.project .grid-container{grid-template-columns:repeat(1,minmax(0,1fr));gap:40px}}@media (min-width: 1024px){.project .grid-container{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}}@media (min-width: 1280px){.project .grid-container{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}}.light-mode .project-card .img-box{border:1px solid #555}.light-mode .project-card .info .subtitle{color:#333}.light-mode .project-card .tag-container .tag{color:#121212;border:1px solid #333}.project-card{margin-bottom:50px}.project-card:hover{cursor:pointer}.project-card .img-box{overflow:hidden;border-radius:20px;margin-bottom:20px;border:1px solid rgba(156,163,175,.3137254902);aspect-ratio:8/5;transition:all .3s ease-out;filter:brightness(.9)}.project-card .img-box:hover{transform:translateY(-10px)}.project-card .img{width:100%;object-fit:cover;object-position:top}.project-card .text-box{padding:5px}.project-card .title{font-size:24px;font-weight:700;margin-bottom:8px}.project-card .subtitle{color:#9ca3af;font-size:16px;line-height:1.3;white-space:pre-line}.project-card .tag-container{padding:6px 0;display:flex;gap:8px;flex-wrap:wrap;font-size:12px;margin-top:4px}.project-card .tag{font-family:Montserrat,sans-serif;padding:4px 8px;border-radius:9999px;border:1px solid #9ca3af;color:#d1d5db}.contact.light-mode .frontend-text,.contact.light-mode .code-text,.contact.light-mode .react-text,.contact.light-mode .typescript-text{opacity:.9}.contact.light-mode .link,.contact.light-mode .contact-item{border:1px solid #333}.contact.light-mode .description{color:#555}.contact{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-width:1300px;height:100vh;text-align:center;margin:0 40px}.contact .frontend-text{font-family:Montserrat,sans-serif;font-size:60px;font-weight:700;color:#6e6e6e;position:absolute;top:30%;left:0;opacity:.5;text-shadow:3px 3px 10px rgba(248,250,252,.4);animation:bounce 3.2s infinite alternate;pointer-events:none;-webkit-user-select:none;user-select:none}.contact .code-text{font-family:Montserrat,sans-serif;font-size:72px;font-weight:700;color:#6e6e6e;position:absolute;rotate:30deg;top:15%;right:20%;opacity:.5;text-shadow:3px 3px 10px rgba(248,250,252,.4);animation:bounce 2s infinite alternate;pointer-events:none;-webkit-user-select:none;user-select:none}.contact .react-text{font-family:Montserrat,sans-serif;font-size:68px;font-weight:700;color:#6e6e6e;position:absolute;top:38%;right:5px;opacity:.5;text-shadow:3px 3px 10px rgba(248,250,252,.4);animation:bounce 3s infinite alternate;pointer-events:none;-webkit-user-select:none;user-select:none}.contact .typescript-text{font-family:Montserrat,sans-serif;font-size:60px;font-weight:700;color:#6e6e6e;position:absolute;rotate:-10deg;bottom:10%;left:50%;opacity:.5;text-shadow:3px 3px 10px rgba(248,250,252,.4);animation:bounce 2.5s infinite alternate;pointer-events:none;-webkit-user-select:none;user-select:none}.contact .title{position:absolute;top:0;display:flex;align-items:center;gap:4%;font-size:50px;font-weight:700;margin-bottom:100px;white-space:nowrap;filter:brightness(.9);width:100%}.contact .title:before{content:"";display:block;width:100%;height:3px;border-radius:1px;background:linear-gradient(to right,#4a5568,#f8fafc);filter:brightness(.9)}.contact .title:after{content:"";display:block;width:100%;height:3px;border-radius:1px;background:linear-gradient(to right,#f8fafc,#4a5568);filter:brightness(.9)}.contact .sub-title{font-size:50px;font-weight:900;font-family:Montserrat,sans-serif;letter-spacing:2px;margin-top:76px;z-index:100}.contact .description{font-family:NanumSquareNeo;margin-top:.5rem;line-height:1.5;color:#d1d5d8;font-size:16px}.contact .contact-item-box{display:flex;flex-direction:column;margin-top:40px;gap:20px;font-size:16px}.contact .contact-item{font-family:Montserrat,sans-serif;padding:.7rem 1.2rem;border:1px solid #a0aec0;display:flex;gap:1rem;align-items:center;border-radius:9999px}.contact .link{font-family:Montserrat,sans-serif;padding:8px 16px;border:1px solid #4a5568;display:flex;gap:1rem;align-items:center;border-radius:9999px;font-size:18px;transition:background-color .1s ease,color .1s ease}.contact .link:hover{background-color:#f8fafc;color:#000;cursor:pointer}.contact .left-cloud{width:9vw;position:absolute;top:32%;left:0;filter:blur(2px);animation:bounce 3.2s infinite alternate;pointer-events:none;-webkit-user-select:none;user-select:none}.contact .top-cloud{width:9vw;position:absolute;rotate:10deg;top:22%;right:18%;filter:blur(1px);animation:bounce 2s infinite alternate;pointer-events:none;-webkit-user-select:none;user-select:none}.contact .right-cloud{width:7vw;position:absolute;top:42%;right:0;rotate:15deg;filter:blur(3px);animation:bounce 3s infinite alternate;pointer-events:none;-webkit-user-select:none;user-select:none}.contact .bottom-cloud{width:9vw;position:absolute;rotate:-3deg;bottom:12%;left:55%;filter:blur(3px);animation:bounce 2.5s infinite alternate;pointer-events:none;-webkit-user-select:none;user-select:none}@media (min-width: 768px){.contact .contact-item-box{flex-direction:column}}@media (min-width: 1024px){.contact .contact-item-box{flex-direction:column}}@media (min-width: 1280px){.contact .contact-item-box{flex-direction:row}}@keyframes bounce{0%{transform:translateY(0)}to{transform:translateY(-20px)}}.project-detail.light-mode .feature{color:#121212;border:1px solid #333}.project-detail.light-mode .sub-title,.project-detail.light-mode .period{color:#555}.project-detail.light-mode .detail-description{color:#333}.project-detail.light-mode .img-box{border:1px solid #555}.project-detail.light-mode .stack{color:#121212;border:1px solid #333}.project-detail.light-mode .project-explain-contents p{color:#333}.project-detail.light-mode .detail-bot .card{background-color:#b0b0b09d}.project-detail.light-mode .detail-bot .card h3{font-family:NanumSquareNeoBold;text-align:center;font-size:18px;background-color:#888;padding:24px;border-radius:10px}.project-detail{display:flex;flex-direction:column;align-items:center;padding:0 20px}.project-detail .detail-top{box-sizing:border-box;display:flex;justify-content:space-between;gap:1rem;width:100%;max-width:1300px;height:100%;padding:110px 20px 60px;border-bottom:1px solid rgba(156,163,175,.3)}.project-detail .info-box{display:flex;flex-direction:column;justify-content:space-between;width:600px}.project-detail .feature-box{display:flex;gap:10px;margin-bottom:.5rem}.project-detail .feature{padding:5px 10px;color:#d0d4db;font-size:12px;border:1px solid #9ca3af;border-radius:20px}.project-detail .sub-title{font-size:32px;color:#9ca3af}.project-detail .title{font-size:64px;font-weight:800;margin-bottom:1.25rem;font-family:NanumSquareNeoExtraBold}.project-detail .period{font-size:16px;margin-bottom:.5rem;color:#d0d4db}.project-detail .detail-description{font-size:16px;color:#d0d4db;line-height:1.6}.project-detail .link-button-box{margin-top:2rem;padding-bottom:15px}.project-detail .link-button{font-size:16px;padding:15px 20px;margin-right:16px;border:1px solid #4a5568;border-radius:9999px;font-family:Montserrat,sans-serif;background-color:#121212;color:#f8fafc;transition:background-color .1s ease,color .1s ease}.project-detail .link-button:hover{background-color:#f8fafc;color:#121212;cursor:pointer}.project-detail .img-box{width:600px;overflow:hidden;border-radius:20px;aspect-ratio:8/5;border:1px solid rgba(156,163,175,.3137254902)}.project-detail .img{width:100%;min-height:343px;object-fit:cover}.project-detail .detail-mid{box-sizing:border-box;display:flex;gap:1rem;width:100%;max-width:1300px;padding:40px 20px 60px}.project-detail h2{margin-bottom:32px}.project-detail .project-introduce-box{width:50%}.project-detail .project-introduce-contents{margin-left:20px}.project-detail .project-introduce-contents div{font-family:NanumSquareNeoBold;padding:0 0 20px}.project-detail .project-introduce-contents div p{font-family:NanumSquareNeo}.project-detail .spot{margin-right:6px}.project-detail .stack-box{display:flex;gap:10px;margin-bottom:.5rem;margin-left:18px}.project-detail .stack{padding:5px 10px;color:#e5e7eb;font-size:12px;border:1px solid #9ca3af;border-radius:20px;font-family:NanumSquareNeo}.project-detail .description{margin-top:1rem;margin-left:28px;margin-right:3rem;line-height:1.6}.project-detail .project-explain-box{width:50%}.project-detail .project-explain-contents{margin-left:20px}.project-detail .project-explain-contents div{margin-bottom:44px}.project-detail .project-explain-contents h4{margin-bottom:16px}.project-detail .project-explain-contents p{font-size:14px;margin-bottom:16px;margin-left:26px;color:#d0d4db}.project-detail .detail-bot{box-sizing:border-box;width:100%;max-width:1300px;padding:40px 20px 100px}.project-detail .detail-bot .grid-container{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2.5rem;padding-top:1rem}.project-detail .detail-bot .card{display:flex;flex-direction:column;background-color:#2525259d;border-radius:20px}.project-detail .detail-bot .card h3{font-family:NanumSquareNeoBold;text-align:center;font-size:18px;background-color:#333;padding:24px;border-radius:10px}.project-detail .detail-bot .problem,.project-detail .detail-bot .solution,.project-detail .detail-bot .learned{margin-top:10px;padding:24px;line-height:1.6}.project-detail .detail-bot .problem-title{font-size:14px;color:#f87171;margin-bottom:.5rem}.project-detail .detail-bot .solution-title{font-size:14px;color:#60a5fa;margin-bottom:.5rem}.project-detail .detail-bot .learned-title{font-size:14px;color:#f59e0b;margin-bottom:.5rem}@media (min-width: 768px){.project-detail{width:calc(100% - 80px);padding:0 20px}}@media (min-width: 1024px){.project-detail{width:calc(100% - 120px);padding:0 40px}}@media (min-width: 1280px){.project-detail{width:calc(100% - 200px);padding:0 100px}}