.header{position:fixed;top:0;left:0;width:100%;height:110px;padding:20px 40px;z-index:100}.headerBox{display:flex;justify-content:space-between;width:100%;height:100%}.iconBox{display:flex;flex-flow:column;justify-content:space-between}.logo{height:60px}.logo img,.logo picture{height:100%}.open-button{display:block;z-index:30;width:42px;height:42px;cursor:pointer;text-align:center;background-color:rgba(220,211,196,.7);border-radius:5px;position:relative}.open-button span{display:block;position:absolute;width:23px;height:2px;left:8px;background:#555;-webkit-transition:.3s ease-in-out;-moz-transition:.3s ease-in-out;transition:.3s ease-in-out}.open-button span:nth-child(1){top:10px}.open-button span:nth-child(2){top:20px}.open-button span:nth-child(3){top:30px}.open-button p{margin-top:35px}.open-button.active p{display:none}.open-button.active span:nth-child(1){top:19px;left:8px;background:#fff;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);transform:rotate(-45deg)}.open-button.active span:nth-child(2),.open-button.active span:nth-child(3){top:19px;background:#fff;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);transform:rotate(45deg)}.menuTxt{user-select:none}#nav{position:absolute;z-index:20;top:-20px;right:0;color:#fff;background:rgba(181,192,182,.97);width:400px;opacity:0;transition:opacity .3s ease,visibility .3s ease;visibility:hidden;padding:100px 40px 40px;display:flex;justify-content:space-between}.nav-logoBox{display:block;width:80px;height:80px}.nav-logo{width:100%}.top-snsIcon{width:50px;height:50px}.top-snsIcon img,.top-snsIcon picture{width:100%}#nav ul{font-size:1.8rem;line-height:2;width:calc(100% - 100px)}#nav ul li{display:block;list-style-type:none;padding:0;text-align:end;transition:.3s background ease-out;margin-top:0}#nav ul li:last-child{padding-bottom:0}#nav ul li:hover{background:#ddd}#nav ul li a{width:100%;display:block;color:#fff;padding:.5em;text-decoration:none;font-size:1.8rem;line-height:2;transition:.3s color ease-out}#nav ul li:hover a{color:#555}#nav.active{opacity:100;visibility:visible}@media (max-width:1023px){.header{height:80px;padding:10px}#nav{top:-10px}}@media (max-width:767px){#nav{right:-20px}}@media (max-width:479px){#nav{width:100%;padding:90px 20px 20px}.logo{height:45px}.open-button{height:35px;width:35px}.open-button p{font-size:1.4rem}.open-button span{width:22px;left:6px}.open-button span:nth-child(1){top:8px}.open-button span:nth-child(2){top:17px}.open-button span:nth-child(3){top:26px}.open-button.active span:nth-child(1){top:17px;left:6px}.open-button.active span:nth-child(2),.open-button.active span:nth-child(3){top:17px}}