:root{--shadow-color:#eae5ec}*{scroll-behavior:smooth}a{text-decoration-line:none;color:var(--font-color)}.header{z-index:999;position:fixed;top:0;left:0;display:flex;align-items:center;grid-area:header;width:100%;padding:11px 40px;background:var(--background-color2);box-shadow:0 2px 4px 0 var(--shadow-color)}.header-btn{display:inline-flex;margin-left:auto;gap:20px;font-size:14px}.sidebar-toggler{display:none}@media only screen and (max-width:768px){.overlay{left:0;width:100%;background:rgba(0,0,0,.4);z-index:997}.header-btn,.overlay{position:fixed;top:0;height:100%}.header-btn{right:-250px;width:250px;flex-direction:column;justify-content:flex-start;gap:0;padding:100px 20px 20px;background-color:var(--background-color2);box-shadow:-2px 0 5px rgba(0,0,0,.1);transition:right .3s ease-in-out;z-index:998}.header-btn.active{right:0}.header-btn a{margin-bottom:15px}.sidebar-toggler{display:inline-block;margin-left:auto;cursor:pointer}}@font-face{font-family:GangwonState;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2307-2@1.0/GangwonState.woff2) format("woff2");font-weight:400;font-style:normal}:root{--point-color:#c954f830;--point-color2:#3e1a4b60;--point-color3:#fafbff;--point-color4:#fafffa;--point-color5:#fffffa;--point-color6:#fefaff;--point-color7:#fffcfa;--point-color8:#fffafc;--point-color9:#fffcfa;--shadow-color:#e5ece6;--background-color1:#f8f4fa;--background-color2:#fefaff;--font-size:16px;--font-color:#726f69;--content-width:950px;--transition:all 0.4s;--border-radius:10px;--container-padding:40px}*{font-family:GangwonState;margin:0;padding:0;border:0;font-size:inherit;list-style:none;box-sizing:border-box}html{display:block}body{padding-top:50px;background:var(--background-color1);font-size:var(--font-size);line-height:1.8;word-wrap:break-word;color:var(--font-color);background-size:cover;overflow-y:scroll}::-webkit-scrollbar{width:0}.pointer{cursor:pointer;transition:var(--transition)}.pointer:hover{cursor:pointer;opacity:.8}.br{margin:40px 0}.scale-down{-o-object-fit:scale-down!important;object-fit:scale-down!important}.image-modal{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;background-color:rgba(0,0,0,.4);z-index:1000}.image-modal img{max-width:90%;max-height:90%;border-radius:var(--border-radius);box-shadow:8px 6px 0 var(--shadow-color)}.detail-modal{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;background-color:rgba(0,0,0,.8);z-index:1000}.detail-modal h4{margin:20px 0}.detail-modal .container{width:90%;max-width:750px;height:70%;overflow:auto}.detail-modal .container img{width:100%;height:350px;-o-object-fit:cover;object-fit:cover}.controller{position:relative;top:-200px;left:50%;transform:translate(-50%);width:100%;max-width:670px;display:flex;justify-content:space-between;z-index:10}.controller span{cursor:pointer;background-color:var(--point-color3);opacity:.7;padding:12px 19px;margin:0 30px;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.1)}.image-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.image-grid img{width:calc(100% - 20px)!important;height:80%}.award-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.award-grid img{width:calc(100% - 20px)!important;height:80%;-o-object-fit:cover;object-fit:cover}.pagination{overflow:hidden;position:relative;bottom:50px;width:100%;text-align:center;z-index:10}.pagination span{display:inline-block;width:10px;height:10px;background-color:var(--point-color);margin:0 5px;cursor:pointer;border-radius:50%}.pagination span.active-button{background:var(--point-color2);box-shadow:0 2px 4px rgba(0,0,0,.1)}.about{background:var(--point-color3)}.cert,.skills{background:var(--point-color4)}.archiving{background:var(--point-color5)}.project{background:var(--point-color6)}.award{background:var(--point-color7)}.edu{background:var(--point-color8)}.activity{background:var(--point-color9)}.container{width:90%;max-width:var(--content-width);margin:auto;z-index:2;border-radius:var(--border-radius);padding:160px var(--container-padding)}.shadow{background:var(--background-color1);padding:var(--container-padding)}.container h1,.shadow{box-shadow:0 2px 4px 0 var(--shadow-color)}.container h1{text-align:left;display:inline-block;border-radius:calc(var(--border-radius) + 15px);background-color:var(--point-color2);padding:6px 14px;font-weight:400;text-transform:capitalize;color:#fff}.container h3{font-size:20px}.container h4{font-size:17px;margin:14px 0 6px;color:var(--point-color2);text-align:left}.container img{width:200px}.about li{text-align:center}.profile{display:block;border-radius:50%;margin:30px auto;box-shadow:8px 6px 0 var(--shadow-color);transition:var(--transition)}.detail-container img,.image-container img{max-height:400px}.box,.detail-container img,.image-container img{cursor:pointer;margin:30px 12px;border-radius:var(--border-radius);box-shadow:8px 6px 0 var(--shadow-color);transition:var(--transition)}.box{padding:17px 34px;background-color:#fff}.detail-container img{width:40%;height:82%;-o-object-fit:cover;object-fit:cover}.detail-container img:hover,.image-container img:hover{opacity:.6}.skills i{margin-right:5px}.tag{position:relative;width:auto;height:auto;display:inline-block;border-radius:calc(var(--border-radius) + 15px);background-color:#f0ede6;padding:6px 14px;font-weight:400;color:var(--font-color);box-shadow:inset 3px 3px 6px var(--shadow-color),2px 2px 4px var(--shadow-color);margin:0 10px 10px 0;cursor:pointer;transition:var(--transition);white-space:normal;overflow-wrap:break-word}.tag:hover{opacity:.6}.tooltip{bottom:100%;transform:translateX(-50%);margin-bottom:10px;padding:8px 12px;border-radius:12px;background-color:#000;color:#fff;font-size:12px;white-space:nowrap;z-index:10;opacity:1}.tooltip,.tooltip:before{position:absolute;left:50%}.tooltip:before{content:"";top:100%;margin-left:-5px;border-width:5px;border-style:solid;border-color:#000 transparent transparent transparent}.activity img{box-shadow:none}@media (max-width:768px){.award-grid,.image-grid{grid-template-columns:repeat(1,1fr)}.activity{grid-template-columns:repeat(2,1fr)}}