@charset "UTF-8";

/* =========================================================
   Header left adjustment
   - ヘッダーだけ少し左に寄せる
   - 既存の非リキッド仕様は維持
   ========================================================= */

.site-header > .site-header__inner.l-container,
.site-header .site-header__inner.l-container{
  max-width: 1240px;
  padding-left: 12px;
  padding-right: 20px;
}

@media (min-width: 1280px){
  .site-header > .site-header__inner.l-container,
  .site-header .site-header__inner.l-container{
    padding-left: 8px;
  }
}

@media (max-width: 1205px){
  .site-header > .site-header__inner.l-container,
  .site-header .site-header__inner.l-container{
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* =========================================================
   Logo link width fix
   - ロゴリンクのクリック範囲が画像より横に広がるのを防ぐ
   - utilities.css 側の旧 min-width:max-content 上書き対策も兼ねる
   ========================================================= */
.site-header .site-branding{
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  line-height: 0 !important;
}

.site-header .site-branding__link{
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 0 !important;
  font-size: 0 !important;
  vertical-align: top !important;
  flex: 0 0 auto !important;
}

.site-header .site-branding__link > .custom-logo{
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 300px !important;
  max-height: 96px !important;
  min-width: 0 !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
}

.site-header .site-branding__link > .site-title{
  line-height: 1.2 !important;
  font-size: 18px !important;
}


/* =========================================================
   Logo transparent padding hit-area adjustment
   - JSで透明余白を検出できた場合だけ、リンク幅を見た目のロゴ幅に寄せる
   - 画像は縮小せず、透明余白だけをレイアウト幅から逃がす
   ========================================================= */
.site-header .site-branding__link.is-logo-hitarea-adjusted{
  overflow: visible !important;
  flex-shrink: 0 !important;
}

.site-header .site-branding__link.is-logo-hitarea-adjusted > .custom-logo{
  flex-shrink: 0 !important;
}