固定したヘッダーが画面幅(100％)からはみ出してしまう際の改善策

前提・実現したいこと

html初心者なのですが、isaraのホームページホームページ模写コーディングしている際に、position: fixed; で固定した、headerタグにwidth:100%;を指定し、全要素にbox-sizing: border-box;も指定しているのに、
headerタグのみが、全体の幅(100％)よりも長くなります。解決策を教えていただきたいです。

発生している問題・エラーメッセージ

レスポンシブ対応で768pxなど、画面幅を狭くすると、headerタグのみ、その幅より広くなってしまいます。

該当のソースコード

html
<header>
    <div class="header-in">
      <div class="title">
        <div class="logo"><img src="https://isara.life/wp-content/themes/isara_v2/img/isaralogo.png" alt="iSara"></div>
        <div class="subtitle txtxs">
          <p>バンコクのノマドエンジニア育成講座</p>
        </div>

        <div class="headcontact">
          <div class="contactpc startpoint">
            <p class="txtxs">お問い合わせ / 資料請求はこちら</p>
          </div>

          <div class="contactsp startpoint">
            <img src="https://isara.life/wp-content/themes/isara_v2/img/form.png">
            <a href="">資料請求</a>
          </div>
        </div>
      </div>
    </div>
  </header>



scss

header {
  width: 100% !important;
  position: fixed;
  z-index: 10;
  background-color: white;
  box-sizing: border-box;
  overflow: hidden;


  .header-in {

    width: 100%;

    .title {
      max-width: calc(100% - 20px);
      margin: 0 auto;
      height: 75px;
      padding: 20px 0;
      position: relative;

      @include tab {
        padding: 0;
        height: 62px;
      }
    }

    .logo {
      display: inline-block;

      @include tab {
        position: absolute;
        top: 25px;
        left: 10px;
        margin-top: 0;
      }

      img {
        width: 128px;

        @include tab {
          width: 90px;
        }
      }
    }

    .subtitle {
      display: inline-block;
      font-weight: 900;

      @include tab {
        position: absolute;
        top: 8px;
        left: 10px;
        font-size: 10px;
        font-weight: 600;
        letter-spacing: 0px;
      }

      p {
        position: relative;
        top: -5px;
        left: 10px;
      }
    }

    .headcontact {
      display: inline-block;
      position: absolute;
      right: 0px;

      .contactpc {
        display: inline-block;
        cursor: pointer;
        color: white;
        border-radius: 25px;
        background-color: #da6b64;
        padding: 11px 40px;

        @include tab {
          display: none;
        }


        &:hover {
          background-color: #d84940;
          text-decoration: none;
        }

        p {
          margin: 0;
        }
      }

      .contactsp {
        display: none;
        position: absolute;
        right: 0px;
        top: 0;
        text-align: center;
        padding: 9px 11px;
        height: 62px;
        width: 62px;
        background-color: #da6b64;

        @include tab {
          display: block;


        }

        img {
          width: 25px;
        }

        a {
          color: white;
          display: block;
          font-size: 8px;
        }
      }
    }
  }
}