:root {
  --logo_m-t: 30px;
  --logo_m-lr: 15px;
}
header {
  text-align: center;
  img {
    width: 100%;
    max-width: 950px;
    margin: 0 auto;
  }
  img:not(picture img) {
    width: 40%;
  }
  .innerBox {
    img {
      margin-left: initial;
    }
  }
  @media screen and (min-width: 768px) {
    .innerBox {
      text-align: center;
    }
  }
}
#headerTop {
  color: #696868;
  display: block;
  overflow: hidden;
  width: 100%;
  padding: 2px 0;
  clear: both;
  font-size: 85.7%;
  border-top: #f49ac1 3px solid;
  background: #f3f3f3;
  margin-bottom: 1.5rem;
  .innerBox {
    max-width: 950px;
    margin: 0 auto;
    padding: 5px 0;
    font-size: 11px;
    color: #696868;
    text-align: left;
  }
}
nav {
  background-color: #f49ac1;
  border: 0 solid #fff;
  border-left: 3px solid #fff;
  ul {
    max-width: 950px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin: 0 auto;
  }
  @media screen and (min-width: 768px) {
    ul {
      grid-template-columns: repeat(7, 1fr);
    }
  }
  li {
    list-style: none;
    -ms-text-underline: none;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    a {
      display: block;
      color: white;
      text-decoration: none;
      text-align: center;
      padding: 11px 2px 9px;
      font-size: 1.3rem;
      font-weight: 700;
      &:hover {
        background-color: #f067a6;
      }
    }
  }
}