@media screen and (max-width: 800px) {
  .downBlock {
    width: 100% !important;
  }
  .username, .messageIcon, .upIcon {
    display: none !important;
  }
  #mallTopNav {
    padding: 0 1rem !important;
    background-size: cover !important;
    height: 5em !important;
  }
  #moblieMenu {
    display: block !important;
    position: fixed;
    display: flex !important;
    justify-content: space-between !important;
    width: 100% !important;
  }
  #sysBlock img {
    max-width: 50px !important;
    max-height: 50px !important;
  }
  #sysBlock a {
    margin: 0 !important;
    margin-top: 1em !important;
  }
}

@media screen and (max-width: 600px) {
  .container {
    margin: 0 !important;
  }
}

@media screen and (max-width: 420px) {
  #hotProduct a, #recordProduct a, #othersBuy a, #shopClass a {
    width: 6rem !important;
  }
  #sysBlock, #shopClass, #hotProduct, #recordProduct, #othersBuy, #downBlock, .block {
    margin-top: 0 !important;
  }
  .block img {
    max-width: 75px !important;
    min-width: 75px !important;
    max-height: 75px !important;
    min-height: 75px !important;
  }
  #moblieMenu a {
    margin: 0 !important;
  }
  .mallSearch input {
    width: 100px !important;
  }
  .mallSearch {
    width: 130px !important;
  }
  #sysBlock img {
    max-width: 35px !important;
    max-height: 35px !important;
  }
  #moblieMenu {
    width: 96% !important;
  }
  .notify {
    margin-left: 1em;
  }
  #mallTopNav div a:not(.logo) img {
    width: 1.5rem !important;
    height: 1.5rem !important;
  }
}