@charset "UTF-8";

/*
2022年5月6日 スマートフォンのヘッダーを修正
Author:Kazuhiro Maeda
*/
#header-sp {
  display: none;
}


@media (max-width: 800px) {
  #header-inner {
    display: none;
  }

  #header-sp {
    display: block;
  }

  #header-sp img {
    vertical-align: bottom;
  }

  .header-sp__row1 {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 10px 10px 0 10px;
  }

  #header-sp__logo {
    width: 77%;
    margin: 0px 3% 10px 0;
  }

  #header-sp__logo img {
    width: 100%;
    height: auto;
  }

  .header-sp__member {
    display: block;
    position: relative;
    top: 39px;
    width: 20%;
  }

  .header-sp__member img {
    width: 100%;
    height: auto;
  }

  .header-sp__row2 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0 20px;
    padding: 0px 10px 10px 10px;
    line-height: 1;
  }

  .header-sp__company {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0 3px;
    position: relative;
    top: 1px;
    width: 21%;
    font-size: calc(100vw / 27);
  }

  .header-sp__company img {
    width: 20%;
  }

  .header-sp__company span {
    position: relative;
    top: 2px;
  }

  .header-sp__koushi {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0 4px;
    position: relative;
    top: 1px;
    width: 34%;
    font-size: calc(100vw / 27);
  }

  .header-sp__koushi img {
    width: 13%;
  }

  .header-sp__koushi span {
    position: relative;
    top: 2px;
  }

  .header-sp__tel {
    width: 9%;
    margin: 0 1%;
    display: none;
  }

  .header-sp__tel img {
    width: 100%;
    display: none;
  }

  .header-sp__mail {
    width: 10%;
  }

  .header-sp__mail img {
    width: 100%;
  }

  .header-sp__blog {
    width: 10%;
  }

  .header-sp__blog img {
    width: 100%;
  }

  .header-sp__youtube {
    width: 10%;
  }

  .header-sp__youtube img {
    width: 100%;
  }
}

@media (max-width: 600px) {
  .header-sp__member {
    top: 13px;
  }

  .header-sp__row2 {
    gap: 0 5px;
  }
}