.header {
  width: 100%;
  height: 104px;
  box-shadow: 0px 4px 11px 0px #1d1f221a;
  position: fixed;
  z-index: 11;
  background-color: #fff;
  top: 0;
  .headerContent {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: 100%;
  }
  .logo {
    width: 41px;
    height: 41px;
    object-fit: cover;
  }
  .iconBox {
    .cartIcon {
      display: none;
    }
  }
  @media screen and (min-width: 768px) {
    height: 80px;
    .headerContent {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
    }
    .iconBox {
      padding: 0 16px;
      display: flex;
      align-items: center;
      gap: 16px;
      .cartIcon {
        display: block;
        position: relative;
        cursor: pointer;
        .badge {
          width: 17px;
          height: 17px;
          border-radius: 999px;
          background-color: chocolate;
          position: absolute;
          top: -9px;
          right: -10px;
          span {
            display: block;
            line-height: 17px;
            font-size: 11px;
            text-align: center;
            color: #fff;
          }
        }
      }
    }
  }
}
