*,:after,:before{box-sizing:border-box}body,button,dd,dl,dt,fieldset,figcaption,figure,form,h1,h2,h3,h4,h5,h6,input,legend,li,ol,p,select,table,td,textarea,th,ul{margin:0;padding:0}body,button,input,select,table,textarea{font-family:맑은 고딕,helvetica,sans-serif}a,a:focus,a:hover{color:inherit;text-decoration:none}h1,h2,h3,h4,h5,h6{font-weight:400}ul{list-style:none}address,em{font-style:normal}strong{font-weight:400}img{vertical-align:top}button,input,select,textarea{-webkit-appearance:none;appearance:none;border:0;border-radius:0}button{background-color:#0000;cursor:pointer}@font-face{font-display:swap;font-family:PlayfairDisplay;font-style:normal;font-weight:400;src:url(/portfolio/static/media/PlayfairDisplay-Regular.6a97b5c64f316f567fa1.ttf) format("truetype")}@font-face{font-display:swap;font-family:PlayfairDisplay;font-style:normal;font-weight:500;src:url(/portfolio/static/media/PlayfairDisplay-Medium.b6b10a3a3492328a0c3f.ttf) format("truetype")}@font-face{font-display:swap;font-family:PlayfairDisplay;font-style:normal;font-weight:600;src:url(/portfolio/static/media/PlayfairDisplay-SemiBold.8762ccb8000d27202454.ttf) format("truetype")}@font-face{font-display:swap;font-family:PlayfairDisplay;font-style:normal;font-weight:700;src:url(/portfolio/static/media/PlayfairDisplay-Bold.c3c9165182044bf7f179.ttf) format("truetype")}:root{--black:#000;--black100:#222;--black200:#555;--black300:#ccc;--black400:#fafafa;--white:#fff;--subColorSkyBlue:#47a4ff;--subColorSkyBlue100:#d5eaff;--subColorPurple:#a968ff;--mainfont-playfairDisplay:"PlayfairDisplay";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;font-size:16px;font-synthesis:none;text-rendering:optimizeLegibility}@media only screen and (max-width:1000px){:root{font-size:14px}}@media only screen and (max-width:800px){:root{font-size:13px}}@media only screen and (max-width:600px){:root{font-size:12px}}@media only screen and (max-width:400px){:root{font-size:11px}}*{scroll-behavior:smooth}body{background-color:#fff;background-color:var(--white);color:#000;color:var(--black)}.App{width:100%}.wrapper{margin:0 auto;width:1200px}@media only screen and (max-width:1300px){.wrapper{width:90%}}#Header{background-color:#00000080;color:#fff;color:var(--white);left:0;padding:1rem 0;position:fixed;top:0;width:100%;z-index:1}.header_info{align-items:center;display:flex;justify-content:space-between}.header_info .logo{width:100px}.header_info .logo img{width:30px}.header_info .logo span:hover{color:#a968ff;color:var(--subColorPurple)}.header_info .header_navigation ul{align-items:center;display:flex;gap:3rem}.header_info .header_navigation ul li:hover{color:#a968ff;color:var(--subColorPurple)}.header_info .header_navigation button{display:none;height:30px;width:30px}.header_info .header_navigation button img{height:30px;width:30px}@media only screen and (max-width:700px){.header_info .logo{width:100px}.header_info .logo img{width:30px}}@media only screen and (max-width:650px){.header_info .header_navigation ul{display:none}.header_info .header_navigation button{display:block}}#HOME{background:url(/portfolio/static/media/background_img.0709fc92233624a8a942.png) no-repeat 50%;background-size:cover;color:#fff;color:var(--white);height:100vh;position:relative;width:100%}#HOME .home_info{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:100%}#HOME .home_info h1{font-family:PlayfairDisplay;font-family:var(--mainfont-playfairDisplay);font-size:4rem;text-align:center}#HOME .home_info p{margin-top:.5rem;text-align:center}#HOME .home_info p,#HOME a{left:50%;position:absolute;transform:translateX(-50%)}#HOME a{animation:homeIconAnimation 2s ease-in-out 1s infinite;bottom:2rem}#HOME a,#HOME a img{height:30px;width:30px}@keyframes homeIconAnimation{0%{bottom:2rem}50%{bottom:1rem}to{bottom:2rem}}@media only screen and (max-width:900px){#HOME .home_info{width:90%}#HOME .home_info h1{font-size:3.5rem}}@media only screen and (max-width:650px){#HOME .home_info h1{font-size:3rem}}@media only screen and (max-width:500px){#HOME .home_info h1{font-size:2.5rem}}#ABOUT{margin-top:5rem;opacity:0;transform:translateY(100px);transition:all 1s}#ABOUT .about_title{align-items:center;display:flex;gap:.5rem}#ABOUT .about_title img{animation:titleIconAnimation 3s ease-in-out 1s infinite;height:30px;transform:rotate(0deg);width:30px}#ABOUT .about_title h2{font-family:PlayfairDisplay;font-family:var(--mainfont-playfairDisplay);font-size:2rem;font-weight:600}#ABOUT .about_info{cursor:pointer;margin-top:2rem}#ABOUT .about_info ul{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(3,1fr)}#ABOUT .about_info ul li{align-items:center;border:1px solid #ccc;border:1px solid var(--black300);border-radius:.5rem;box-shadow:2px 2px 5px #ccc;box-shadow:2px 2px 5px var(--black300);display:flex;gap:1rem;height:100px;padding:1.5rem}#ABOUT .about_info ul li img{height:40px;width:40px}#ABOUT .about_info ul li div{align-items:flex-start;display:flex;flex-direction:column;gap:.2rem;justify-content:flex-start}#ABOUT .about_info ul li div h2{font-weight:600}#ABOUT .about_info ul li div h2,#ABOUT .about_info ul li div p{color:#555;color:var(--black200)}#ABOUT .about_info ul li div h2:hover,#ABOUT .about_info ul li div p:hover{color:#a968ff;color:var(--subColorPurple)}#ABOUT.active{opacity:1;transform:translateY(0)}@media only screen and (max-width:900px){#ABOUT .about_info ul{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(2,1fr)}}@media only screen and (max-width:650px){#ABOUT .about_title{justify-content:center}#ABOUT .about_info{align-items:center;flex-direction:column}#ABOUT .about_info img{height:200px;width:200px}#ABOUT .about_info div{text-align:center}}@media only screen and (max-width:500px){#ABOUT .about_info ul{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(1,1fr)}}#SKILL{margin-top:5rem;opacity:0;transform:translateY(100px);transition:all 1s}#SKILL .skill_title{align-items:center;display:flex;gap:.5rem}#SKILL .skill_title img{animation:titleIconAnimation 3s ease-in-out 1s infinite;height:30px;transform:rotate(0deg);width:30px}#SKILL .skill_title h2{font-family:PlayfairDisplay;font-family:var(--mainfont-playfairDisplay);font-size:2rem;font-weight:600}#SKILL .skill_info{margin-top:2rem}#SKILL .skill_info ul{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(6,1fr);justify-content:space-between}#SKILL .skill_info ul li{align-items:center;display:flex;flex-direction:column;gap:.5em}#SKILL .skill_info ul li div{border:1px solid #ccc;border:1px solid var(--black300);border-radius:1rem;padding:2rem;transition:all .5s}#SKILL .skill_info ul li div img{height:60px;width:60px}#SKILL .skill_info ul li div:hover{background-color:#d5eaff;background-color:var(--subColorSkyBlue100);border:1px solid #d5eaff;border:1px solid var(--subColorSkyBlue100)}#SKILL.active{opacity:1;transform:translateY(0)}@media only screen and (max-width:900px){#SKILL .skill_info ul{grid-template-columns:repeat(4,1fr)}}@media only screen and (max-width:650px){#SKILL .skill_title{justify-content:center}#SKILL .skill_info ul{grid-template-columns:repeat(3,1fr)}}@media only screen and (max-width:500px){#SKILL .skill_title{justify-content:center}#SKILL .skill_info ul{grid-template-columns:repeat(2,1fr)}}#PROJECT{margin-top:5rem;opacity:0;transform:translateY(100px);transition:all 1s}#PROJECT .project_title{align-items:center;display:flex;gap:.5rem}#PROJECT .project_title img{animation:titleIconAnimation 3s ease-in-out 1s infinite;height:30px;transform:rotate(0deg);width:30px}#PROJECT .project_title h2{font-family:PlayfairDisplay;font-family:var(--mainfont-playfairDisplay);font-size:2rem;font-weight:600}#PROJECT .project_list{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(1,1fr);margin-top:2rem}#PROJECT .project_list .project{background-color:#fafafa;background-color:var(--black400);border-radius:1rem;display:flex;flex-direction:column;justify-content:space-between;padding:2rem}#PROJECT .project_list .project .project_imgBox{border-bottom:1px solid #ccc;display:flex;justify-content:center;padding-bottom:2rem}#PROJECT .project_list .project .project_imgBox img{width:250px}#PROJECT .project_list .project .project_info{margin-top:2rem}#PROJECT .project_list .project .project_info h3{color:#47a4ff;color:var(--subColorSkyBlue);font-weight:bolder}#PROJECT .project_list .project .project_info p{margin:1rem 0}#PROJECT .project_list .project .project_info .project_skill{align-items:flex-end;color:#47a4ff;color:var(--subColorSkyBlue);display:flex;flex-wrap:wrap;gap:1rem}#PROJECT .project_list .project .project_info .project_skill div{border:1px solid #47a4ff;border:1px solid var(--subColorSkyBlue);border-radius:1rem;padding:.2rem 1rem}#PROJECT .project_list .project .project_link{display:flex;flex-direction:column;gap:1rem;margin-top:2rem}#PROJECT .project_list .project .project_link a{color:#fff;color:var(--white);font-weight:bolder;padding:.5rem 0;text-align:center}#PROJECT .project_list .project .project_link a:first-of-type{background-color:#47a4ff;background-color:var(--subColorSkyBlue)}#PROJECT .project_list .project .project_link a:nth-of-type(2),#PROJECT .project_list .project .project_link a:nth-of-type(3){background-color:#555;background-color:var(--black200)}#PROJECT .project_list .project .project_link a:hover{color:#a968ff;color:var(--subColorPurple)}#PROJECT.active{opacity:1;transform:translateY(0)}@media only screen and (max-width:900px){#PROJECT .project_list{grid-template-columns:repeat(1,1fr)}}@media only screen and (max-width:650px){#PROJECT .project_title{justify-content:center}}@media only screen and (max-width:500px){#PROJECT .project_list .project .project_imgBox img{width:150px}}#RESUME{margin-top:5rem;opacity:0;transform:translateY(100px);transition:all 1s}#RESUME .resume_title{align-items:center;display:flex;gap:.5rem}#RESUME .resume_title img{animation:titleIconAnimation 3s ease-in-out 1s infinite;height:30px;transform:rotate(0deg);width:30px}#RESUME .resume_title h2{font-family:PlayfairDisplay;font-family:var(--mainfont-playfairDisplay);font-size:2rem;font-weight:600}#RESUME .resume_info{margin-top:2rem}#RESUME .resume_info,#RESUME .resume_info a{align-items:center;display:flex;gap:2rem;justify-content:space-between}#RESUME .resume_info a{background-color:#fafafa;background-color:var(--black400);border-radius:1rem;flex:1 1;padding:2rem}#RESUME .resume_info a div{display:flex;flex-direction:column;gap:.5rem}#RESUME .resume_info a div h3{color:var(--subColorPurple300);font-weight:bolder}#RESUME .resume_info a img{height:60px;width:60px}#RESUME .resume_info a h3:hover{color:#a968ff;color:var(--subColorPurple)}#RESUME.active{opacity:1;transform:translateY(0)}@keyframes titleIconAnimation{0%{transform:rotate(0deg)}10%{transform:rotate(45deg)}20%{transform:rotate(-45deg)}30%{transform:rotate(30deg)}40%{transform:rotate(-30deg)}50%{transform:rotate(10deg)}60%{transform:rotate(-10deg)}70%{transform:rotate(0deg)}to{transform:rotate(0deg)}}@media only screen and (max-width:650px){#RESUME .resume_title{justify-content:center}#RESUME .resume_info{flex-direction:column}}@media only screen and (max-width:500px){#RESUME .resume_info a img{height:50px;width:50px}}#Footer{align-items:center;background-color:#000;background-color:var(--black);color:#fff;color:var(--white);display:flex;flex-direction:column;gap:1rem;justify-content:center;margin-top:5rem;padding:3rem;width:100%}#Footer ul{display:flex;gap:2rem}#Footer p{text-align:center}#Footer .motion_top{align-items:center;background-color:#0000;border:none;border-radius:.5rem;bottom:20px;color:#fff;cursor:pointer;display:flex;flex-direction:column;font-size:1rem;justify-content:center;padding:.5rem 1rem;position:absolute;transition:background-color .3s ease}#Footer .motion_top:hover{background-color:var(--zinc-800)}@media only screen and (max-width:500px){#Footer ul{align-items:center;flex-direction:column;gap:.5rem}}#FullMenu{align-items:center;background-color:#000c;display:flex;display:none;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1}#FullMenu ul{display:flex;flex-direction:column;gap:2rem}#FullMenu ul li{text-align:center}#FullMenu ul li a{color:#fff;color:var(--white);font-size:2rem;font-weight:bolder}#FullMenu .close{cursor:pointer;height:40px;position:absolute;right:3rem;top:3rem;width:40px}#FullMenu.on{display:flex}
/*# sourceMappingURL=main.5c80dff9.css.map*/