@import url(https://fonts.googleapis.com/css2?family=Poppins&display=swap);@font-face{font-display:swap;font-family:Pretendard;font-style:normal;font-weight:45 920;src:local("Pretendard Variable"),url(/portfolio_2024/static/media/PretendardVariable.154ce88f9118a30d9d0e.woff2) format("woff2-variations")}@font-face{font-family:REM;font-size:swap;font-style:thin;font-weight:100;src:url(/portfolio_2024/static/media/REM-Thin.a8390e7fc393458c33bf.woff)}@font-face{font-family:REM;font-size:swap;font-style:light;font-weight:200;src:url(/portfolio_2024/static/media/REM-Light.9ddfc25b98dde045bfe1.woff)}@font-face{font-family:REM;font-size:swap;font-style:medium;font-weight:300;src:url(/portfolio_2024/static/media/REM-Regular.6b1eba23958702e0fc26.woff)}@font-face{font-family:REM;font-size:swap;font-style:medium;font-weight:400;src:url(/portfolio_2024/static/media/REM-Medium.e0bdec1a78528050f8bb.woff)}@font-face{font-family:REM;font-size:swap;font-style:bold;font-weight:500;src:url(/portfolio_2024/static/media/REM-Bold.a0f791b8f745ddd1086d.woff)}@font-face{font-family:REM;font-size:swap;font-style:bold;font-weight:600;src:url(/portfolio_2024/static/media/REM-ExtraBold.05f22155aaa633e0ecc5.woff)}:root{--main-color:#222;--sub-color:#d6d6d6}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Pretendard,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.margin-15{margin:10px}.padding-15{padding:10px}@media(min-width:0px)and (max-width:640px){body{font-size:1rem;font-weight:300}}@media (min-width:1200px){body{font-size:1rem;font-weight:400}}body{background-color:#fff;box-sizing:border-box;font-family:pretendard,맑은 고딕,san-serif;line-height:1.5;margin:0 auto;min-width:390px;padding:0 15px;word-break:keep-all}:root::-webkit-scrollbar-track{background-color:#0000;margin-top:90px}body::-webkit-scrollbar-thumb{background-color:#1a7ef3;border:3px solid #fff;border-radius:10px}body::-webkit-scrollbar{width:12px}a,em,h1,h2,h3,h4,h5,h6,li,ul{color:inherit;font-size:inherit;font-style:normal;font-weight:400;list-style:none;margin:0;padding:0;text-decoration:none}.move-border{height:1px;transition:width 1.3s cubic-bezier(.165,.84,.44,1)}.loading-cont,.move-border{background-color:#222;margin:0;padding:0;width:100vw}.loading-cont{align-items:center;color:#fff;display:grid;font-family:REM,pretendard,san-serif;height:100vh;justify-items:center;left:-15px;opacity:1;position:relative;top:0;transition:opacity 1s ease-out}.loading-cont.fade-out{opacity:0}@media(min-width:0px)and (max-width:640px){.loading-cont{font-size:3rem}}@media(min-width:640px)and (max-width:1199px){.loading-cont{font-size:5rem}}@media (min-width:1200px){.loading-cont{font-size:8rem}}@media(min-width:0px)and (max-width:640px){header{height:60px}header nav{display:none}}@media(min-width:640px)and (max-width:1199px){header{height:80px}header h1,header nav{margin:0 15px}header nav{display:flex;justify-content:space-between;width:40%}}@media (min-width:1200px){header{width:calc(100% - 60px)}header h1{margin:0 15px}header nav{display:flex;justify-content:space-between;margin:0 50px;width:40%}header nav li{position:relative}header nav li:hover:before{background-color:#1a7ef3;content:"";height:5px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:110%}}header{align-items:center;background-color:#fff;border-bottom:1px solid #222;box-sizing:border-box;cursor:pointer;display:flex;justify-content:space-between;left:0;padding:15px;position:fixed;top:0;width:100%;z-index:99999}header em{display:block}.about-contn{box-sizing:border-box;height:160vh;margin-top:5rem;width:100%}.about-contn h2{font-weight:100;padding:3.325rem 0 1rem}.about-contn h2 em{font-weight:800}.about-contn .border-top{border-top:1px solid #222;margin-top:30vh;position:relative}.about-contn .border-top span{height:30px;position:absolute;top:-10px;width:100%}.about-contn .border-top span:first-of-type{top:-20px}.about-contn .border-top span:after{transform:translateX(-65%) rotate(45deg)}.about-contn .border-top span:after,.about-contn .border-top span:before{background-color:#222;content:"";height:1px;position:absolute;right:0;top:-50%;width:15px}.about-contn .border-top span:before{transform:rotate(-45deg)}.about-contn .whoiam-contn{display:flex;font-weight:100;justify-content:space-between;margin:5px 0 20px}.about-contn .whoiam-contn,.about-contn h5{font-family:REM,pretendard,san-serif}@media(min-width:0px)and (max-width:640px){.about-contn h2{font-size:3.3rem}.about-contn .whoiam-contn :nth-child(3){display:none}.about-contn .about-intro{box-sizing:border-box;height:100%;margin-bottom:2vw;width:100%}.about-contn .about-intro h5{font-size:clamp(2rem,4vw,3.5rem);font-weight:300;line-height:1.5}}@media(min-width:640px)and (max-width:1199px){.about-contn h2{font-size:3.3rem;margin:0 15px}.about-contn .about-intro{height:100%;width:100%}.about-contn .about-intro h5{font-size:clamp(3.2rem,4vw,3.5rem);font-weight:200;line-height:1.8}}@media (min-width:1200px){.about-contn{margin-top:5rem}.about-contn h2{font-size:4.5rem;margin:0 3vw}.about-contn .about-intro{height:600px;overflow:hidden;padding-bottom:2vw;width:100%}.about-contn .about-intro h5{font-size:clamp(5rem,4vw,3.5rem);font-weight:200;line-height:1.4}}.skills-contn{position:relative}.skills-contn .border-top{border-top:1px solid #222;position:absolute;width:100%}.skills-contn h2{font-family:REM,pretendard,san-serif;font-size:6rem;font-weight:300;line-height:1;padding:10px 1rem 0;text-transform:capitalize}.skills-contn h2 .sticky{position:-webkit-sticky;position:sticky;top:100px}.skills-contn h2 em{color:#d6d6d6;display:block;font-family:Poppins,sans-serif;font-size:7rem;line-height:1.5}.skills-contn h2 :nth-child(3){bottom:-30px;font-size:5rem;font-style:normal;left:0;position:absolute}.skills-contn .skills-wrap{margin:30px 0 0}.skills-contn .skills-wrap h5{background-color:#222;color:#fff;display:inline-block;font-size:1rem;padding:10px 0;text-align:center;text-transform:capitalize;width:95px}.skills-contn .skills-wrap .skils-list>li{border-top:1px solid #222;padding:20px 0 60px}.skills-contn .skills-wrap .skils-list>li h3{font-size:1.8rem;font-weight:500;line-height:1.2;width:30%}.skills-contn .skills-wrap .skils-list>li h3 em{font-size:1rem;margin-left:4px}@media(min-width:0px)and (max-width:640px){.skills-contn{height:100%;width:100%}.skills-contn .skills-wrap .skils-list>li ul{margin:30px 15px 0}.skills-contn .skills-wrap .skils-list>li ul li{margin:1rem}}@media(min-width:640px)and (max-width:1199px){.skills-contn{height:100%;margin-top:10vh;width:100%}.skills-contn .skills-wrap .skils-list>li ul{margin:30px 0 0 35vw}.skills-contn .skills-wrap .skils-list>li ul li{margin:1rem}}@media (min-width:1200px){.skills-contn{display:flex;height:100%;margin-top:30vh;position:relative;width:100%}.skills-contn h2{height:2000px;margin-top:50px;width:30%}.skills-contn h2 .sticky{margin-bottom:30px;position:-webkit-sticky;position:sticky;top:100px;z-index:999}.skills-contn h2 :first-child{position:absolute;top:100px}.skills-contn h2 :nth-child(3){bottom:0;position:absolute}.skills-contn .skills-wrap{border-left:1px solid #222;margin:30px 0;position:relative;width:70%}.skills-contn .skills-wrap h5{left:-95px;position:absolute}.skills-contn .skills-wrap .skils-list>li{margin-left:30px}.skills-contn .skills-wrap .skils-list>li ul{margin-left:20vw}.skills-contn .skills-wrap .skils-list>li ul li{margin:1rem}}.TxtBox{opacity:1;transform:translateY(15px);transition:opacity 1s ease-in-out,transform .8s ease-in-out}.loaded .TxtBox{opacity:0;transform:translateY(0)}.proj-contn{border-top:1px solid #222;margin-top:30px}.proj-contn h2{font-family:REM,pretendard,san-serif;font-size:6rem;font-weight:300;line-height:1;padding:0 0 30px;text-transform:capitalize}.proj-contn h2 em{color:#d6d6d6;display:block;font-family:Poppins,sans-serif;font-size:7rem;line-height:1.5;text-align:right}.proj-contn .proj-wrap p{font-size:1.1rem}.proj-contn .proj-wrap p em{color:#d6d6d6;display:inline-block;font-family:Poppins,sans-serif;font-size:5rem;line-height:.9;padding-left:15px;vertical-align:top;width:3rem}.proj-contn .proj-title h4{font-size:1.8rem;font-weight:500;line-height:1.5;width:70%}.proj-contn .proj-title ul{align-items:center;display:flex;justify-content:space-between}.proj-contn .proj-title ul li{align-items:center;border:1px solid #222;display:grid;font-size:.875rem;height:55px;justify-self:center;text-align:center;width:22%}.proj-contn .proj-img{background-color:#ddd;height:70vh;line-height:70vh;overflow:hidden;width:100%}.proj-contn .proj-img img{height:100%;object-fit:cover;text-align:center;width:100%}.proj-contn .proj-img img:hover{transform:scale(1.1);transition:.5s}@media(min-width:0px)and (max-width:640px){.proj-wrap{border-bottom:1px solid #222;border-top:1px solid #222;margin:30px 0}.proj-title{padding:30px 15px}.proj-img img{height:100%}}@media(min-width:640px)and (max-width:1199px){.proj-wrap{border-bottom:1px solid #222;border-top:1px solid #222;margin:30px 0}.proj-title{padding:30px 15px}}@media (min-width:1200px){.proj-contn{padding-top:300px;position:relative}.proj-contn h2{padding:20px 50px 0 0;position:absolute;right:0;top:0}.proj-contn h2 em{display:inline}section{align-items:end;display:grid;grid-template-columns:30% repeat(2,1fr);grid-template-rows:350px}section .proj-wrap{border-bottom:1px solid #222;grid-column:1/2;padding:30px 0;width:calc(100% - 30px)}section .proj-wrap .proj-num{border-right:1px solid #222;height:320px;position:relative;width:calc(100% + 30px)}section .proj-wrap .proj-num p{bottom:0;margin:0;position:absolute}section .proj-title{border-bottom:1px solid #222;grid-column:2/5;margin-left:30px;padding:30px 30px 30px 0}section .proj-title ul{width:60%}section .proj-img{grid-column:1/4;margin-bottom:80px;margin-top:30px}}.contact-contn{margin-top:8vh;position:relative}.contact-contn h2{border-bottom:1px solid #222;border-top:1px solid #222;font-size:1.8rem;font-weight:500;line-height:1.5;text-align:center}.contact-contn .top-btn{background-color:#222;height:50px;margin:15px;position:absolute;right:0;width:50px}.contact-contn .top-btn:hover{background-color:#1a7ef3}.contact-contn .top-btn span{display:inline-block;height:100%;position:relative;width:100%}.contact-contn .top-btn span:after{background-color:#fff;content:"";height:26px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:2px}.contact-contn .top-btn span:before{border-right:2px solid #fff;border-top:2px solid #fff;content:"";display:inline-block;height:19px;left:50%;position:absolute;top:4px;transform:rotate(315deg) translateX(-70%);width:19px}.contact-contn .contact-intro{line-height:1.7;margin:100px 0 30px}.contact-contn .contact-info ul{width:100%}.contact-contn .contact-info ul li{border-top:1px solid #222;padding:35px 0}.contact-contn .contact-url{border-bottom:1px solid #222;display:grid;margin:30px 0;width:100%}.contact-contn .contact-url li{padding:15px;text-transform:capitalize}.contact-contn .contact-url li a{display:block;height:100%;width:100%}.contact-contn .contact-url :nth-child(3){background-color:#222;color:#fff;margin:0;position:relative}.contact-contn .contact-url :nth-child(3):hover{background-color:#1a7ef3}.contact-contn .contact-url :nth-child(3) span{color:#d6d6d6;position:absolute;top:60px}.contact-contn .contact-url :nth-child(3) em{background-color:#0000;border:1px solid #fff;border-radius:100%;bottom:0;display:inline-block;display:grid;height:75px;margin:15px;place-items:center;position:absolute;right:0;text-align:center;width:75px}@media(min-width:0px)and (max-width:640px){.contact-url{grid-template-columns:1fr 1fr;height:315px}.contact-url li{border-top:1px solid #222}.contact-url li:nth-child(3){grid-column:2/3;grid-row:1/2}.contact-url li:nth-child(3) span{top:5px;width:50%}.contact-url li:nth-child(4){border-left:1px solid #222}}@media(min-width:640px)and (max-width:1199px){.contact-url{grid-template-columns:1fr 1fr;height:315px}.contact-url li{border-top:1px solid #222}.contact-url li:nth-child(3){grid-column:2/3;grid-row:1/2}.contact-url li:nth-child(4){border-left:1px solid #222}}@media (min-width:1200px){.contact-wrap{display:flex;width:100%}.contact-wrap .contact-intro{height:80%;padding:0 15px;width:calc(50% - 30px)}.contact-wrap .contact-info{border-left:1px solid #222;margin-top:15px;padding:40vh 15px 0;width:calc(50% - 30px)}.contact-url{border-top:1px solid #222;grid-template-columns:repeat(4,1fr);height:180px}.contact-url li{border-right:1px solid #222;margin:15px 0}.contact-url li:nth-child(2n){border-right:none}.contact-url li:nth-child(3){padding-top:30px}}
/*# sourceMappingURL=main.1817f99c.css.map*/