html,body{margin:0;padding:0;width:100%;height:100vh}.header-container{display:flex;justify-content:center;align-items:center;flex-direction:column;background-color:#f0efe2;height:100vh;width:100%}.header{display:flex;justify-content:center;align-items:center;font-size:3em;color:#333}.header-sub{display:flex;justify-content:center;align-items:center;margin-top:0;font-size:16px;color:#333}.main-container{display:flex;justify-content:flex-start;align-items:center;flex-direction:column;width:100%;height:100%}.name-container{display:flex;justify-content:center;align-items:center;flex-direction:column;font-size:16px;width:100%;margin-top:150px;margin-bottom:10px}.name{display:flex;justify-content:center;align-items:center;font-size:2em;color:#333}.introduction{display:flex;justify-content:center;align-items:center;font-size:16px;color:#333;margin-left:50px;margin-right:50px;margin-top:20px;overflow-wrap:break-word}.skills{display:flex;justify-content:center;align-items:center;flex-direction:column;font-size:16px;width:100%;margin-top:150px;margin-bottom:10px}.skills-title{display:flex;justify-content:center;align-items:center;font-size:2em;width:100%;margin-bottom:0;color:#333}.skills-row{display:flex;flex-direction:row;justify-content:center;align-items:flex-start;width:100%}.skills-column{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;width:20%;color:#333}.skills-column ul{padding:0 10px;line-height:1.5}.skills-sub-title{display:flex;justify-content:center;align-items:center;font-size:1.5em;width:100%;margin-bottom:0;color:#333}.sns-container{display:flex;justify-content:center;align-items:center;flex-direction:column;font-size:16px;width:100%;margin-top:150px;margin-bottom:50px}.icon-container{display:flex;justify-content:center;align-items:center;gap:20px;margin-bottom:20px}.sns{display:flex;justify-content:center;align-items:center;font-size:2em;color:#333}.github-icon,.qiita-icon{width:50px;height:50px;transition:transform .3s}.x-icon{width:45px;height:45px;transition:transform .3s;margin-top:5px}.github-icon:hover,.x-icon:hover,.qiita-icon:hover{transform:scale(1.2)}.footer-container{display:flex;justify-content:center;align-items:center;flex-direction:column;background-color:#dcdcdc;width:100%;height:10vh}.copyright{display:flex;justify-content:center;align-items:center;font-size:16px;color:#333}@media (max-width: 500px){.header{font-size:2em}.header-sub{font-size:14px}.skills-row{flex-direction:column;align-items:center}}