.header-bg{position:absolute;top:0;left:0;width:100%;height:70px;z-index:0}.header-bg.top-page{background-color:#242424}.header-bg.other-page{background-color:#fff}header{position:fixed;top:0;display:flex;justify-content:space-between;align-items:center;width:100%;height:70px;z-index:1000;padding:10px 20px;background:rgba(0,0,0,.6)}header .sns{list-style:none;margin:0;margin-top:auto;margin-bottom:auto;padding:0;display:flex;gap:16px;justify-content:center;align-items:center}header .sns li{display:inline-block}header .sns img{display:block;width:auto;height:50px}header nav{display:flex;align-items:center}@media screen and (max-width:48em){header nav nav{display:inline}}header .menu__box{display:flex;flex-direction:row;list-style-type:none}@media screen and (max-width:48em){header .menu__box{flex-direction:column;position:fixed;visibility:hidden;top:0;left:0;width:100%;margin:-600px 0 0;padding:.6em 0;text-align:center;background-color:#2d303a;box-shadow:1px 0 6px rgba(0,0,0,.2);z-index:1;transition-duration:.5s}}header .menu__item{display:flex;flex-direction:column;padding:0 1em 0 1.9em;color:#fff;font-family:sans-serif;font-size:14px;font-weight:400;text-decoration:none;text-transform:uppercase}@media screen and (max-width:48em){header .menu__item{display:block;padding:14px 24px;color:#fff;font-size:16px;transition-duration:.5s;border-bottom:1px solid #a8a8ab}header .menu__item:hover{background-color:#4f5464}}header #menu__toggle{opacity:0}header #menu__toggle:checked~.menu__btn>span{transform:rotate(45deg)}header #menu__toggle:checked~.menu__btn>span:before{top:0;transform:rotate(0);background:#f06c64}header #menu__toggle:checked~.menu__btn>span:after{top:0;transform:rotate(90deg);background:#f06c64}header #menu__toggle:checked~.menu__box{visibility:visible;left:0;margin:0}header .menu__btn{transition-duration:.25s;box-sizing:border-box;display:flex;align-items:center;position:relative;bottom:2px;width:26px;height:26px;cursor:pointer;z-index:2}header .menu__btn span{display:inline-block;position:absolute;width:100%;height:3px;background-color:#fff}header .menu__btn span:before{display:inline-block;position:absolute;width:100%;height:3px;background-color:#fff;content:"";top:-8px;transition-duration:.25s}header .menu__btn span:after{display:inline-block;position:absolute;width:100%;height:3px;background-color:#fff;content:"";top:8px;transition-duration:.25s}@media screen and (min-width:48em){header .menu__btn{display:none}}