@import "https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;700&display=swap";
html{font-family:YakuHanMP,Noto Serif JP,serif;line-height:1.6}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.btn{transition:all .3s}.btn:hover{transform:translateY(-2px)}.menuButton{z-index:1;position:relative}.menuButton:before{content:"";z-index:-1;background:radial-gradient(circle,rgba(200,200,200,.3) 0%,transparent 70%);width:100%;height:100%;animation:10s linear infinite rotate;position:absolute;top:0;bottom:0;left:0;right:0}.bar{background:#000;border-radius:2px;width:45px;height:6px;transition:all .3s ease-in-out;position:absolute}.bar.top{top:42%;transform:translateY(-50%)}.bar.middle{top:49%;transform:translateY(-50%)}.bar.bottom{top:55%;transform:translateY(-50%)}@media (max-width:768px){.bar.top{top:31%}.bar.middle{top:48%}.bar.bottom{top:65%}}.menuButton.open .bar.top{background:#fff;top:50%;left:50%;transform:translate(-50%,-50%)rotate(45deg)}.menuButton.open .bar.middle{opacity:0}.menuButton.open .bar.bottom{background:#fff;top:50%;left:50%;transform:translate(-50%,-50%)rotate(-45deg)}.menuButton.open:before{filter:brightness(0)invert()}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}