@media screen and (min-width: 992px) {
  header#pc {
    background: var(--header-background);
    box-shadow: var(--header-box-shadow);
  }

  header#sp {
    display: none;
  }

  #nls_form_sp {
    display: none!important;
  }

  #nls_text_wrapper {
    position: relative;
  }

  #nls_text_wrapper i#search_icon {
    position: absolute;
    top: 12px;
    left: 12px;
  }

  #nls_text_wrapper i#search_img_icon {
    position: absolute;
    top: 11px;
    right: 12px;
    cursor: pointer;
  }

  #nls_text {
    padding-left: 42px;
  }

  .with_search_image {
    padding-right: 42px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }

  .with_theme_category {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }
}

@media screen and (max-width: 991.98px) {
  header#pc {
    display: none;
  }

  header#sp {
    background: var(--header-background);
  }

  header#sp > div {
    display: flex;
    align-items: center;
  }

  #nls_text_wrapper_sp {
    position: relative;
    width: 100vw;
  }

  #nls_text_wrapper_sp i#search_icon_sp {
    position: absolute;
    top: 12px;
    left: 12px;
  }

  #nls_text_wrapper_sp i#search_img_icon_sp {
    position: absolute;
    top: 11px;
    right: 12px;
  }

  #nls_text_sp {
    padding-left: 42px;
  }

  .with_search_image {
    padding-right: 42px;
  }

  div.container-fluid .ui-autocomplete {
    width: calc(100% - 1rem - 1rem)!important;
  }

  #nlsConditionModal .modal-footer > div {
    width: 100%;
  }

  #nlsConditionModal .modal-footer > div > div:first-child div {
    width: 50%;
  }
}

#nls_condition, #favorite, #nls_condition_sp, #favorite_sp {
  cursor: pointer;
}

#nlsConditionModal #nlsTarget {
  padding: 7px 15px 7px 12px;
}

#nlsConditionModal #nlsTarget div:not(:last-child) {
  margin-right: 64px;
}

div.container-fluid > .ui-autocomplete {
  padding-left: 36px;
}

#nlsTargetArea label {
  padding-top: 10px;
}

#nlsConditionModal span.badge {
  font-size: inherit;
  font-weight: inherit;
  color: var(--color-kotami) !important;
  border: solid 1px var(--border-color-kotami) !important;
  margin-right: .5rem;
  margin-bottom: .5rem;
}

#nlsConditionModal span.badge:hover {
  cursor: pointer;
}

#nlsConditionModal span.badge.active {
  color: #fff!important;
  background-color: var(--background-color-kotami) !important;
  border-color: rgba(255, 255, 255, 0.25)!important;
}