@media (min-width: 701px) {
  .garment-header-inner {
    grid-template-columns: 330px minmax(0, 1fr) auto;
  }

  .garment-logo {
    position: relative;
    display: grid;
    width: 310px;
    height: 82px;
    place-items: center start;
    overflow: visible;
    isolation: isolate;
  }

  .garment-logo img {
    z-index: 1;
    inset: 0;
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: contain;
    object-position: left center;
    transform: translateZ(0);
    will-change: opacity;
    transition: opacity 0.32s cubic-bezier(0.22, 1, 0.36, 1);
  }

  .garment-header.is-scrolled .garment-logo {
    width: 310px;
    height: 82px;
  }

  .garment-header.is-scrolled .garment-logo img {
    max-height: none;
  }

  .dibu .footer-l .logo {
    width: min(310px, 100%);
    height: auto;
    overflow: visible;
  }

  .dibu .footer-l .logo a,
  .dibu .footer-l .logo img {
    display: block;
    width: 100%;
    height: auto;
  }

  .dibu .footer-l .logo img {
    object-fit: contain;
    object-position: left center;
  }
}

@media (min-width: 701px) and (max-width: 1199px) {
  .garment-header-inner {
    grid-template-columns: 235px minmax(0, 1fr) auto;
  }

  .garment-logo,
  .garment-header.is-scrolled .garment-logo {
    width: 224px;
    height: 66px;
  }

  .garment-logo img,
  .garment-header.is-scrolled .garment-logo img {
    height: 100%;
    max-height: none;
  }
}
