@import"https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css";@font-face{font-family:KakaoSmallFont;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/2503@1.0/KakaoSmallSans-Light.woff2) format("woff2");font-weight:300;font-display:swap}@font-face{font-family:KakaoSmallFont;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/2503@1.0/KakaoSmallSans-Regular.woff2) format("woff2");font-weight:400;font-display:swap}@font-face{font-family:KakaoSmallFont;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/2503@1.0/KakaoSmallSans-Bold.woff2) format("woff2");font-weight:700;font-display:swap}@font-face{font-family:ChangwonDangamRounded;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/2511-1@1.0/ChangwonDangamRound-Regular.woff2) format("woff2");font-weight:900;font-display:swap}@font-face{font-family:Gosan;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/Gosanja.woff) format("woff");font-weight:400;font-display:swap}html{scroll-behavior:smooth;font-family:KakaoSmallFont,-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans KR,Apple SD Gothic Neo,sans-serif}body{margin:0;font-family:inherit}.nav-wrapper{position:sticky;top:0;width:100%;padding-top:40px;display:flex;flex-direction:column;align-items:center;gap:35px;z-index:500}.nav-row{background:#fff;padding:12px 35px;border-radius:999px;display:flex;align-items:center;justify-content:center;gap:35px;box-shadow:0 0 10px #bbbbbb4d}.nav-bottom{width:445px;margin-top:-10px}.nav-item{display:flex;align-items:center;justify-content:center;padding:10px 18px;width:auto;min-width:0;flex:0 0 auto;border-radius:999px;color:#272727;text-decoration:none;font-size:16px;font-weight:500;transition:all .15s ease}.nav-logo{width:42px;height:42px;border-radius:50%;object-fit:contain;display:block;padding-left:10px}.nav-item.active{background:#007aff;color:#fff}.nav-item:hover{transform:translateY(-3px)}.intro-section{width:100%;min-height:100px;padding-top:30px;display:flex;flex-direction:column;align-items:center;gap:50px;padding-bottom:0;text-align:center}.intro-logo{width:170px;height:170px;object-fit:contain;opacity:.95}.intro-text h1,.intro-text h2{font-size:48px;font-weight:400;font-family:Gosan,KakaoSmallFont,sans-serif;margin:5px 0}.intro-name{font-size:48px;font-weight:400;font-family:Gosan,KakaoSmallFont,sans-serif;color:var(--primary);margin:15px 0 5px}.intro-name-line{display:flex;align-items:flex-end;justify-content:center;gap:2px}.intro-end{font-size:48px;font-weight:400;font-family:Gosan,KakaoSmallFont,sans-serif;margin-bottom:8px;margin-top:0}.aline{font-weight:500;font-size:18px;color:#616161}.intro-description-box p{margin:0 0 14px;color:#616161}section{min-height:100vh;padding:80px 20px;box-sizing:border-box}.project-masonry{display:flex;width:auto;margin:0 auto}.project-masonry-column{padding-left:24px;background-clip:padding-box}.project-card{margin-bottom:40px;padding:24px;border-radius:20px;background:#fff;box-shadow:0 10px 30px #00000014;transition:transform .3s ease,box-shadow .3s ease;display:flex;flex-direction:column}.project-card:hover{transform:translateY(-6px);box-shadow:0 14px 40px #0000001f}.project-image{width:100%;border-radius:16px;object-fit:cover;margin-bottom:16px;border:1px dashed #ddd}@keyframes scrollFadeInUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@keyframes scrollFadeInLeft{0%{opacity:0;transform:translate(-40px)}to{opacity:1;transform:translate(0)}}@keyframes scrollFadeInRight{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}@keyframes scrollScale{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.scroll-animate{opacity:0;transform:translateY(40px);transition:opacity .6s ease-out,transform .6s ease-out}.scroll-animate.visible{opacity:1;transform:translateY(0)}.scroll-animate-left{opacity:0;transform:translate(-40px);transition:opacity .6s ease-out,transform .6s ease-out}.scroll-animate-left.visible{opacity:1;transform:translate(0)}.scroll-animate-right{opacity:0;transform:translate(40px);transition:opacity .6s ease-out,transform .6s ease-out}.scroll-animate-right.visible{opacity:1;transform:translate(0)}.scroll-animate-scale{opacity:0;transform:scale(.9);transition:opacity .6s ease-out,transform .6s ease-out}.scroll-animate-scale.visible{opacity:1;transform:scale(1)}.delay-1{transition-delay:.1s}.delay-2{transition-delay:.2s}.delay-3{transition-delay:.3s}.delay-4{transition-delay:.4s}.delay-5{transition-delay:.5s}:root{--primary: #4682A9;--secondary: #749BC2;--accent-light: #91C8E4;--cream: #FFFBD E;--bg: #ffffff;--bg-soft: #f6fafe;--text-dark: #1e1e1e;--text-light: #ffffff}.logo-row{display:flex;gap:24px;align-items:center;justify-content:center;padding:32px 40px;border-radius:999px;background:radial-gradient(circle at top,#fff 0% 70%,#fff);cursor:default;transition:transform .35s ease,box-shadow .35s ease;position:relative;overflow:hidden}.logo-row:after{content:"";position:absolute;inset:-20%;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.6) 45%,transparent 60%);transform:translate(-100%) rotate(8deg);animation:sheen 1.4s ease-in forwards .45s;opacity:0;pointer-events:none}.logo-row:hover{transform:translateY(-8px) scale(1.015)}.logo-row:hover:after{animation:none;animation:sheen 1.1s ease-in forwards 0s}.logo-icon{width:70px;height:70px;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(10px) scale(.1);border-radius:50%;animation:dotToIcon 1.2s cubic-bezier(.25,.8,.25,1) forwards}.icon-1{--spread-x: -18px;--hover-delay: 0s;animation-delay:0s}.icon-2{--spread-x: 0px;--hover-delay: .05s;animation-delay:.08s}.icon-3{--spread-x: 18px;--hover-delay: .1s;animation-delay:.16s}.icon-inner{transition:transform .4s cubic-bezier(.22,.61,.36,1)}.logo-row:hover .logo-icon .icon-inner{animation:hoverLift .7s cubic-bezier(.22,.61,.36,1) forwards;animation-delay:var(--hover-delay, 0s)}@keyframes dotToIcon{0%{opacity:0;transform:translateY(10px) scale(.1);filter:blur(2px)}35%{opacity:1;transform:translateY(-6px) translate(var(--spread-x)) scale(.55);filter:blur(0)}65%{transform:translateY(3px) translate(calc(var(--spread-x) * .4)) scale(1.08)}to{opacity:1;transform:translateY(0) translate(0) scale(1)}}@keyframes hoverLift{0%{transform:translateY(0) scale(1)}55%{transform:translateY(-14px) scale(1.08)}to{transform:translateY(-8px) scale(1)}}@keyframes sheen{0%,60%{transform:translate(-120%) rotate(8deg);opacity:0}70%{opacity:.4}to{transform:translate(140%) rotate(8deg);opacity:0}}.logo-icon svg{display:block}.skills-section{width:100%;min-height:100vh;padding-top:20px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;font-family:KakaoSmallFont,sans-serif}.skills-title{font-size:24px;font-weight:700;color:#007aff}.skills-subtitle{font-size:18px;color:#666}.skills-tabs{display:flex;gap:14px;margin:25px 0 40px;background:#f7f7f7;padding:10px 13px;border-radius:40px}.skills-tab{padding:5px 18px;border:none;background:transparent;font-size:16px;font-weight:600;color:#9ca3af;cursor:pointer;border-radius:30px;transition:.2s}.skills-tab.active{background:#007aff;color:#fff}.skills-tab:hover{transform:translateY(-3px)}.skills-grid{display:grid;grid-template-columns:repeat(5,1fr);row-gap:35px;column-gap:20px}.skill-card{padding:10px;display:flex;flex-direction:column;align-items:center;gap:16px;transition:all .25s ease}.skill-card.fade-out{opacity:.2;filter:grayscale(90%);pointer-events:none;transform:none}.skill-card:hover{transform:translateY(-6px);color:#fff;border-color:transparent}.skill-icon{width:70px;height:70px;object-fit:contain}.skill-name{font-size:20px;font-weight:600}.skill-tooltip{background:transparent;border:none;padding:0}.skill-tooltip__shell{position:relative;padding:2px 8px;border-radius:3px;color:#171717;font-size:14px;font-weight:600;letter-spacing:.03em}.skill-tooltip__text{position:relative;z-index:1}.project-card-link{text-decoration:none;color:inherit;display:block}.project-card-link:hover .project-card{transform:translateY(-4px);box-shadow:0 8px 24px #0000001f}.project-card{transition:transform .2s ease,box-shadow .2s ease;cursor:pointer}.project-stack{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}.project-stack-item{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;background-color:#f4f2ed;transition:transform .2s}.project-stack-item:hover{transform:scale(1.1)}.project-stack-icon{width:20px;height:20px;object-fit:contain}.career-section{width:65%;max-width:1100px;margin:0 auto;padding-top:160px;padding-bottom:120px}.career-header{display:flex;align-items:baseline;justify-content:center;gap:12px}.career-exp{display:flex;flex-direction:column;align-items:center;font-size:16px;padding-bottom:20px;gap:10px}.career-exp p{margin:0}.career-divider{display:flex;align-items:center;gap:16px;max-width:768px;margin:48px auto 32px}.career-divider-line{flex:1;height:2px;opacity:.5}.career-divider-line.left,.career-divider-line.right{background:#e9ecef}.career-divider-label{flex-shrink:0;font-size:.85rem;color:#00000080;letter-spacing:.05em}.career-heading-en{font-size:40px;font-weight:500;letter-spacing:.04em}.career-list{max-width:768px;margin:0 auto}.career-item{display:grid;grid-template-columns:160px 1fr;column-gap:30px;padding:28px 0;gap:10px}.career-period{font-size:18px;font-weight:400;color:#868296}.career-title{font-size:22px;font-weight:600;color:#272727;margin-top:0}.career-h1{font-size:30px;color:#007aff;font-weight:900}.career-subtitle{margin:4px 0;font-size:16px;font-weight:400;color:#7a7a7a}.career-content details{margin-top:8px}.career-summary{margin-top:10px;display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:300;color:#b6bac5;cursor:pointer;list-style:none;transition:color .25s ease}.career-summary-icon{width:13px;height:13px;color:inherit;transition:transform .7s ease}.career-content details[open] .career-summary-icon{transform:rotate(360deg)}.career-list-wrap{margin:0 48px}.career-content details[open] .career-summary{color:#007aff}.career-description{margin:6px 0 0;font-size:15px;line-height:1.6;color:#222222bf}.career-divider-small{background-color:#f8f9fa;padding:5px 10px;border-radius:10px;margin-top:10px}.icon{display:block;width:16px;height:16px;color:inherit;transition:transform .7s ease;transform-origin:center;transform-box:fill-box}.more-velog{display:inline-flex;align-items:center;gap:8px;font-size:20px;font-weight:700;color:#b6bac5;cursor:pointer;list-style:none;transition:color .25s ease;text-decoration:none}.more-velog:hover{color:#007aff}.more-velog:hover .icon{transform:rotate(360deg)}.more-button{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:300;color:#b6bac5;cursor:pointer;list-style:none;transition:color .25s ease;text-decoration:none}.footer-section{padding:80px 20px;box-sizing:border-box;text-align:center}.footer-title{margin:0 auto 24px;font-size:28px;font-weight:600;line-height:1.5;color:#000}.footer-subtitle{margin:0 auto 40px;font-size:22px;line-height:1.5;color:#333}.footer-card{margin:0 auto;max-width:360px;display:grid;grid-template-columns:1fr 2fr;gap:10px;padding:24px;border-radius:20px;background:#00000008}.footer-label{margin:0;font-weight:700;text-align:left}.footer-value,.footer-link{margin:0;text-align:left;word-break:break-all}.footer-link{color:inherit;text-decoration:none}.footer-link:hover,.footer-link:focus-visible{text-decoration:underline}@media(min-width:768px){.footer-section{padding:96px 32px}.footer-title{font-size:32px;margin-bottom:28px}.footer-card{max-width:420px;padding:28px;gap:12px}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.project-detail-container{max-width:850px;margin:40px auto;padding:32px;border-radius:14px;background:#fff;box-shadow:0 4px 16px #00000014;line-height:1.6;animation:fadeIn .5s ease-out}.back-button{background:none;border:none;color:#3a5fff;font-size:16px;font-weight:600;cursor:pointer;padding:8px 0;margin-bottom:20px;transition:.2s;animation:slideInLeft .4s ease-out}.back-button:hover{opacity:.7}.project-detail-subtitle{font-size:18px;color:#666;margin-bottom:24px;margin-top:0;animation:fadeInUp .6s ease-out .3s both}.project-detail-image-wrap{width:100%;text-align:center;margin-bottom:24px;animation:fadeInUp .6s ease-out .1s both}.project-detail-title-wrap{display:flex;gap:40px;align-items:baseline;animation:fadeInUp .6s ease-out .2s both}.project-detail-image{width:80%;border-radius:12px;object-fit:cover}.project-detail-title{font-size:40px;font-weight:900;margin-bottom:0;color:#007aff}.project-detail-info{animation:fadeInUp .6s ease-out .4s both}.project-detail-info p{margin:4px 0;font-size:16px}.project-detail-block{margin-top:32px;animation:fadeInUp .6s ease-out both}.project-detail-block:nth-of-type(1){animation-delay:.5s}.project-detail-block:nth-of-type(2){animation-delay:.6s}.project-detail-block:nth-of-type(3){animation-delay:.7s}.project-detail-block:nth-of-type(4){animation-delay:.8s}.project-detail-block h2{font-size:20px;margin-bottom:10px;font-weight:600}.project-detail-block ul{padding-left:20px}.project-detail-link{margin-top:40px;animation:fadeInUp .6s ease-out .9s both}.project-detail-period{font-size:13px;color:#8c8c8c;margin-bottom:0}.project-detail-block-title{font-size:25px!important;font-weight:900;margin-bottom:10px}.project-detail-block-content{font-size:16px;color:#666;margin-bottom:0}.project-detail-link a{color:#3a5fff;font-weight:600;text-decoration:underline;transition:.2s}.project-detail-link a:hover{opacity:.7}.tech-stack-list{list-style:none;padding-left:0;margin-left:-20px;display:flex;flex-wrap:wrap;gap:20px}.tech-stack-item{display:inline-flex;align-items:center;gap:8px;transition:transform .2s;animation:fadeInUp .4s ease-out both}.tech-stack-item:nth-child(1){animation-delay:.75s}.tech-stack-item:nth-child(2){animation-delay:.8s}.tech-stack-item:nth-child(3){animation-delay:.85s}.tech-stack-item:nth-child(4){animation-delay:.9s}.tech-stack-item:nth-child(5){animation-delay:.95s}.tech-stack-item:nth-child(6){animation-delay:1s}.tech-stack-item:nth-child(7){animation-delay:1.05s}.tech-stack-item:hover{transform:translateY(-2px)}.tech-stack-icon{width:36px;height:36px;object-fit:contain}.tech-stack-name{font-size:14px;font-weight:600;color:#333}
