@charset "UTF-8";

html {
  scroll-padding-top: 92.88px;
}

header.header {
  height: 92.88px;
}

spacerを400pxあたりで0pxにしたい

.header--logo {
  display: flex;
}
.header--logo > img {
  height: 90px;
}

#header_logo img {
  min-width: 200px;
}
@media screen and (min-width: 361px) and (max-width: 600px) {
  .header-spacer {
    width: 16px;
  }
}
@media screen and (max-width: 400px) {
  .content-right > .header-spacer {
    display: none;
  }
}

.header .content-right {
  float: right;
}

.header .phone-icon img {
  width: clamp(24px, (100vw - 370px) * 18 / 430 + 24px, 42px);
}
@media screen and (min-width: 361px) and (max-width: 800px) {
  .header .phone-number {
    font-size: clamp(16px, (100vw - 440px) * 24 / 360 + 16px, 40px);
  }
}
@media screen and (min-width: 361px) and (max-width: 600px) {
  .header-spacer {
    width: clamp(16px, (100vw - 240px) * 3 / 360 + 16px, 20px);
  }
}
@media screen and (max-width: 360px) {
  .header .phone-number {
    font-size: 16px;
  }
}