/* PETCOM mobile header v75 — clean reset / single-source mobile styling */
@media (max-width: 991px) {
  html, body { overflow-x: hidden; }

  #header_wrap.top_menu_06,
  #header_wrap.top_menu_06.sub {
    position: relative !important;
    z-index: 1200 !important;
    width: 100% !important;
    height: 58px !important;
    min-height: 58px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(31,26,22,.08) !important;
    box-shadow: 0 2px 10px rgba(35,27,21,.035) !important;
  }

  /* Kill decorative leftovers from previous mobile header versions. */
  #header_wrap.top_menu_06::before,
  #header_wrap.top_menu_06::after,
  #header_wrap.top_menu_06.sub::before,
  #header_wrap.top_menu_06.sub::after { content: none !important; display: none !important; }

  #header_wrap.top_menu_06 > .container,
  #header_wrap.top_menu_06.sub > .container {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: none !important;
    height: 58px !important;
    min-height: 58px !important;
    margin: 0 !important;
    padding: 0 17px !important;
    box-sizing: border-box !important;
  }

  #header_wrap.top_menu_06 h1,
  #header_wrap.top_menu_06.sub h1 {
    position: relative !important;
    inset: auto !important;
    float: none !important;
    flex: 0 0 104px !important;
    width: 104px !important;
    height: 29px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  /* logo.png is a vertical two-frame sprite; expose the lower frame cleanly. */
  #header_wrap.top_menu_06 h1 > a,
  #header_wrap.top_menu_06.sub h1 > a {
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    display: block !important;
    width: 104px !important;
    height: 29px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translateY(-50%) !important;
    background-image: url(../img/main/logo.png) !important;
    background-repeat: no-repeat !important;
    background-size: 104px 59px !important;
    background-position: 0 bottom !important;
    text-indent: -9999px !important;
    overflow: hidden !important;
  }

  #header_wrap.top_menu_06 .navbar-toggle,
  #header_wrap.top_menu_06 .js-offcanvas-btn,
  #header_wrap.top_menu_06.sub .navbar-toggle,
  #header_wrap.top_menu_06.sub .js-offcanvas-btn {
    position: relative !important;
    inset: auto !important;
    float: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 36px !important;
    width: 36px !important;
    height: 36px !important;
    margin: 0 -4px 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
  }

  #header_wrap.top_menu_06 .navbar-toggle .hiraku-open-btn-line,
  #header_wrap.top_menu_06.sub .navbar-toggle .hiraku-open-btn-line {
    position: relative !important;
    display: block !important;
    width: 23px !important;
    height: 2px !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 2px !important;
    background: #28231f !important;
    box-shadow: none !important;
    transition: transform .18s ease !important;
  }

  #header_wrap.top_menu_06 .navbar-toggle .hiraku-open-btn-line::before,
  #header_wrap.top_menu_06 .navbar-toggle .hiraku-open-btn-line::after,
  #header_wrap.top_menu_06.sub .navbar-toggle .hiraku-open-btn-line::before,
  #header_wrap.top_menu_06.sub .navbar-toggle .hiraku-open-btn-line::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    width: 23px !important;
    height: 2px !important;
    border-radius: 2px !important;
    background: #28231f !important;
    box-shadow: none !important;
  }
  #header_wrap.top_menu_06 .navbar-toggle .hiraku-open-btn-line::before,
  #header_wrap.top_menu_06.sub .navbar-toggle .hiraku-open-btn-line::before { top: -7px !important; }
  #header_wrap.top_menu_06 .navbar-toggle .hiraku-open-btn-line::after,
  #header_wrap.top_menu_06.sub .navbar-toggle .hiraku-open-btn-line::after { top: 7px !important; }

  #header_wrap.top_menu_06 .navbar-toggle:active .hiraku-open-btn-line,
  #header_wrap.top_menu_06.sub .navbar-toggle:active .hiraku-open-btn-line { transform: scaleX(.88) !important; }

  #header_wrap.top_menu_06 .menu_wrap { display: none !important; }
  #header_wrap.top_menu_06 + .row-offcanvas { margin-top: 0 !important; }
}

@media (max-width: 374px) {
  #header_wrap.top_menu_06,
  #header_wrap.top_menu_06.sub,
  #header_wrap.top_menu_06 > .container,
  #header_wrap.top_menu_06.sub > .container { height: 56px !important; min-height: 56px !important; }
  #header_wrap.top_menu_06 > .container,
  #header_wrap.top_menu_06.sub > .container { padding-left: 15px !important; padding-right: 15px !important; }
  #header_wrap.top_menu_06 h1,
  #header_wrap.top_menu_06.sub h1 { flex-basis: 98px !important; width: 98px !important; height: 28px !important; }
  #header_wrap.top_menu_06 h1 > a,
  #header_wrap.top_menu_06.sub h1 > a { width: 98px !important; height: 28px !important; background-size: 98px 55px !important; }
}