body{background-color:#242528;margin:0;color:#f5f9ff;font-family:Lekton,serif;font-weight:400;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.portfolio-body{position:relative;display:flex;justify-content:center;flex-direction:column;min-height:100vh;min-height:100dvh}.contact-body-wrapper{background-color:#242528}.contact-body-wrapper .contact-body{padding:0 40px;max-width:1600px;margin:0 auto 30px}.contact-body-wrapper .contact-body .contact-content{display:flex;gap:20px;font-weight:700;flex-direction:row;justify-content:center}@media (max-width: 1024px){.contact-body-wrapper .contact-body .contact-content{gap:15px;flex-direction:row;justify-content:center}}@media (max-width: 700px){.contact-body-wrapper .contact-body .contact-content{gap:10px;flex-direction:column;justify-content:center}}.contact-body-wrapper .contact-body .contact-content .contact-item{display:flex;align-items:center;justify-content:center;color:#f5f9ff;font-size:30px;gap:15px}@media (max-width: 1024px){.contact-body-wrapper .contact-body .contact-content .contact-item{font-size:20px;gap:10px}}@media (max-width: 700px){.contact-body-wrapper .contact-body .contact-content .contact-item{font-size:15px;gap:5px}}.contact-body-wrapper .contact-body .contact-content .contact-item .contact-link{display:flex;align-items:center;color:#f5f9ff;text-decoration:none;font-size:30px;gap:15px}.contact-body-wrapper .contact-body .contact-content .contact-item .contact-link:hover{text-decoration:none}@media (max-width: 1024px){.contact-body-wrapper .contact-body .contact-content .contact-item .contact-link{font-size:20px;gap:10px}}@media (max-width: 700px){.contact-body-wrapper .contact-body .contact-content .contact-item .contact-link{font-size:15px;gap:5px}}.contact-body-wrapper .contact-body .contact-content .contact-item .contact-icon{width:50px;height:50px}@media (max-width: 1024px){.contact-body-wrapper .contact-body .contact-content .contact-item .contact-icon{width:40px;height:40px}}@media (max-width: 700px){.contact-body-wrapper .contact-body .contact-content .contact-item .contact-icon{width:25px;height:25px}}.contact-body-wrapper .contact-body .contact-content .contact-item .contact-text{font-size:30px}@media (max-width: 1024px){.contact-body-wrapper .contact-body .contact-content .contact-item .contact-text{font-size:20px}}@media (max-width: 700px){.contact-body-wrapper .contact-body .contact-content .contact-item .contact-text{font-size:15px}}.header{display:flex;flex-direction:row;align-items:center;white-space:nowrap;padding:50px 0}@media (max-width: 1024px){.header{padding:35px 0}}@media (max-width: 700px){.header{padding:20px 0}}.header .header-title{display:inline-flex;font-weight:700;color:#f7bf3b;line-height:1;font-size:60px}@media (max-width: 1024px){.header .header-title{font-size:40px}}@media (max-width: 700px){.header .header-title{font-size:25px}}.header .header-line{width:100%;height:7px;background-color:#f7bf3b;margin-left:20px;border-radius:5px;margin-bottom:2px}@media (max-width: 1024px){.header .header-line{height:5px}}@media (max-width: 700px){.header .header-line{height:3px}}.end-header{display:flex;flex-direction:row;align-items:center;white-space:nowrap;padding:50px 0}@media (max-width: 1024px){.end-header{padding:35px 0}}@media (max-width: 700px){.end-header{padding:20px 0}}.end-header .end-header-title{display:inline-flex;font-weight:700;color:#f7bf3b4d;line-height:1;font-size:60px}@media (max-width: 1024px){.end-header .end-header-title{font-size:40px}}@media (max-width: 700px){.end-header .end-header-title{font-size:25px}}.project-info{display:flex;flex-direction:column;line-height:1}.project-info .work-description{display:flex;flex-direction:column;padding-bottom:20px}.project-info .work-description .position-title{font-size:45px;font-weight:700}@media (max-width: 1024px){.project-info .work-description .position-title{font-size:30px}}@media (max-width: 700px){.project-info .work-description .position-title{font-size:20px}}.project-info .work-description .position-duration{font-size:30px}@media (max-width: 1024px){.project-info .work-description .position-duration{font-size:20px}}@media (max-width: 700px){.project-info .work-description .position-duration{font-size:15px}}.project-info .project-body{display:flex;flex-direction:column;background-color:#343b4b;border-radius:5px;position:relative;overflow:hidden;transition:transform 1s ease;width:100%;aspect-ratio:5/4;box-shadow:0 0 3px #000}.project-info .project-body:hover,.project-info .project-body:hover .project-images{transform:scale(1.05)}.project-info .project-body:hover .visit-text{opacity:1;visibility:visible;pointer-events:auto}.project-info .project-body .visit-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#f5f9ff;background-color:#000000b3;padding:10px 15px;border-radius:5px;font-weight:700;opacity:0;transition:opacity .3s ease;cursor:pointer;pointer-events:none;font-size:30px;line-height:1}@media (max-width: 1024px){.project-info .project-body .visit-text{font-size:20px}}@media (max-width: 700px){.project-info .project-body .visit-text{font-size:15px}}.project-info .project-body .project-title-description{padding:20px}@media (max-width: 1024px){.project-info .project-body .project-title-description{padding:10px}}.project-info .project-body .project-title-description .project-header{display:flex;flex-direction:row;align-items:center;justify-content:space-between;margin-bottom:5px}.project-info .project-body .project-title-description .project-header .project-title{color:#f7bf3b;font-size:45px;font-weight:700}@media (max-width: 1024px){.project-info .project-body .project-title-description .project-header .project-title{font-size:30px}}@media (max-width: 700px){.project-info .project-body .project-title-description .project-header .project-title{font-size:20px}}.project-info .project-body .project-title-description .project-header .programming-languages{display:flex;justify-content:center;align-items:center;gap:10px;position:relative}.project-info .project-body .project-title-description .project-header .programming-languages .language{display:flex;justify-content:center;align-items:center;gap:5px;background-color:#47536b;padding:5px 10px;border-radius:5px;font-size:30px;line-height:1}@media (max-width: 1024px){.project-info .project-body .project-title-description .project-header .programming-languages .language{font-size:20px}}@media (max-width: 700px){.project-info .project-body .project-title-description .project-header .programming-languages .language{font-size:15px}}.project-info .project-body .project-title-description .project-header .programming-languages .language img{width:20px}@media (max-width: 1024px){.project-info .project-body .project-title-description .project-header .programming-languages .language img{width:14px}}@media (max-width: 700px){.project-info .project-body .project-title-description .project-header .programming-languages .language img{font-size:15px;width:8px}}.project-info .project-body .project-title-description .project-header .programming-languages:hover .all-languages{max-height:500px}.project-info .project-body .project-title-description .project-header .programming-languages .all-languages{display:flex;flex-direction:column;max-height:0;overflow:hidden;position:absolute;top:100%;right:0;background-color:#343b4b;border-radius:5px;box-shadow:0 4px 6px #0000001a;padding:0 10px;z-index:1;transition:max-height .3s ease}.project-info .project-body .project-title-description .project-header .programming-languages .all-languages .language{display:flex;justify-content:center;align-items:center;margin-top:10px}.project-info .project-body .project-title-description .project-header .programming-languages .all-languages .language:last-child{margin-bottom:10px}.project-info .project-body .project-title-description .project-description{line-height:1;font-size:30px}@media (max-width: 1024px){.project-info .project-body .project-title-description .project-description{font-size:20px}}@media (max-width: 700px){.project-info .project-body .project-title-description .project-description{font-size:15px}}.project-info .project-body .project-images{display:grid;gap:10px;width:100%;height:100%;grid-template-columns:1fr;transition:transform 1s ease}@media (max-width: 1024px){.project-info .project-body .project-images{gap:5px}}.project-info .project-body .project-images:has(img:nth-child(2)){grid-template-columns:5fr 2.2fr}.project-info .project-body .project-images:has(img:nth-child(3)){grid-template-columns:1fr 1fr;grid-template-rows:auto}.project-info .project-body .project-images:has(img:nth-child(3)) img:first-child{grid-row:span 2}.project-info .project-body .project-images:has(img:nth-child(3)) img:nth-child(2){grid-column:2;grid-row:1}.project-info .project-body .project-images:has(img:nth-child(3)) img:nth-child(3){grid-column:2;grid-row:2}.project-info .project-body .project-images img{width:100%;height:100%;object-fit:cover;border-radius:5px}.project-info .project-body .development-indicator{position:absolute;bottom:10px;right:10px;width:40px;height:40px;background-color:#000000b3;border-radius:50%;display:flex;justify-content:center;align-items:center;z-index:10;padding:8px}.project-info .project-body .development-indicator .hammer-icon{width:100%;height:100%;color:#fff;animation:hammerAnimation 1.5s infinite}@keyframes hammerAnimation{0%{transform:rotate(0)}25%{transform:rotate(-20deg)}50%{transform:rotate(0)}75%{transform:rotate(-20deg)}to{transform:rotate(0)}}.current-work-body-wrapper{background-color:#2e2f33}.current-work-body-wrapper .current-work-body{padding:0 40px;max-width:1600px;margin:0 auto 40px}@media (max-width: 1024px){.current-work-body-wrapper .current-work-body{padding:0 20px}}@media (max-width: 700px){.current-work-body-wrapper .current-work-body{padding:0 20px}}.current-work-body-wrapper .current-work-body .current-work-content{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}@media (max-width: 700px){.current-work-body-wrapper .current-work-body .current-work-content{grid-template-columns:1fr}}.footer-body-wrapper{background-color:#242528}.footer-body-wrapper .footer-body{display:flex;justify-content:center;padding:0 40px;max-width:1600px;margin:20px auto;gap:5px;font-weight:700}@media (max-width: 1024px){.footer-body-wrapper .footer-body{padding:0 20px}}@media (max-width: 700px){.footer-body-wrapper .footer-body{padding:0 20px}}.footer-body-wrapper .footer-body .footer-text{line-height:1;font-size:30px}@media (max-width: 1024px){.footer-body-wrapper .footer-body .footer-text{font-size:20px}}@media (max-width: 700px){.footer-body-wrapper .footer-body .footer-text{font-size:15px}}.footer-body-wrapper .footer-body .footer-pic{height:30px}@media (max-width: 1024px){.footer-body-wrapper .footer-body .footer-pic{height:20px}}@media (max-width: 700px){.footer-body-wrapper .footer-body .footer-pic{height:15px}}.introduction-body{background-color:#242528;display:flex;flex-direction:row;height:100vh;max-height:1100px;white-space:nowrap;overflow:hidden;padding:0 40px;box-shadow:0 0 25px 5px #00000080;z-index:1;position:relative}@media (max-width: 1024px){.introduction-body{padding:0 20px}}@media (max-width: 700px){.introduction-body{padding:0 20px}}@media (min-width: 1600px){.introduction-body{justify-content:center}}.introduction-body .name-title{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left;white-space:nowrap;width:auto;position:relative}@media (max-width: 700px){.introduction-body .name-title{position:absolute;top:30px;left:50%;transform:translate(-50%);z-index:1}}.introduction-body .name-title .name{font-weight:700;color:#f7bf3b;line-height:1;font-size:70px}@media (max-width: 1024px){.introduction-body .name-title .name{font-size:50px}}@media (max-width: 700px){.introduction-body .name-title .name{font-size:30px}}.introduction-body .name-title .title{font-size:45px;line-height:1}@media (max-width: 1024px){.introduction-body .name-title .title{font-size:30px}}@media (max-width: 700px){.introduction-body .name-title .title{font-size:20px}}.introduction-body .profile-image{position:relative;display:flex;align-items:flex-end;height:100%}.introduction-body .profile-image .portfolio-pic{position:absolute;left:0;max-height:calc(100% - 80px);object-position:right}@media (min-width: 1600px){.introduction-body .profile-image .portfolio-pic{position:relative}}.title .cursor{display:inline-block;width:1ch;animation:blink 2s infinite}@keyframes blink{0%,50%,to{opacity:1}25%,75%{opacity:0}}.past-work-body-wrapper{background-color:#242528}.past-work-body-wrapper .past-work-body{padding:0 40px;max-width:1600px;margin:0 auto 40px}@media (max-width: 1024px){.past-work-body-wrapper .past-work-body{padding:0 20px}}@media (max-width: 700px){.past-work-body-wrapper .past-work-body{padding:0 20px}}.past-work-body-wrapper .past-work-body .past-work-content{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:1fr;gap:30px}.past-work-body-wrapper .past-work-body .past-work-content .project-info{grid-row:span 2}.past-work-body-wrapper .past-work-body .past-work-content .project-info:nth-child(odd){grid-column:2}.past-work-body-wrapper .past-work-body .past-work-content .project-info:nth-child(2n){grid-column:1}.past-work-body-wrapper .past-work-body .past-work-content .work-text{grid-area:1/1/1/2;display:flex;align-items:center;height:auto;line-height:1;font-size:45px}@media (max-width: 1024px){.past-work-body-wrapper .past-work-body .past-work-content .work-text{font-size:30px}}@media (max-width: 700px){.past-work-body-wrapper .past-work-body .past-work-content .work-text{font-size:20px}}@media (max-width: 700px){.past-work-body-wrapper .past-work-body .past-work-content{grid-template-columns:1fr;grid-template-rows:auto}.past-work-body-wrapper .past-work-body .past-work-content .project-info:nth-child(odd){grid-column:1}.past-work-body-wrapper .past-work-body .past-work-content .project-info:nth-child(2n){grid-column:1}}.skills-body-wrapper{background-color:#2e2f33}.skills-body-wrapper .skills-body{padding:0 40px;max-width:1600px;margin:0 auto 40px}@media (max-width: 1024px){.skills-body-wrapper .skills-body{padding:0 20px}}@media (max-width: 700px){.skills-body-wrapper .skills-body{padding:0 20px}}.skills-body-wrapper .skills-body-content{width:100%;display:flex;justify-content:center;align-items:center}.custom-amazon-color{color:orange}