@charset "UTF-8";
/* 共通CSS: 以前は各ページの<style>に直書き（54ページで共通） */

/* ---- style#header-tablet-2row-fix ---- */

/* ===== ヘッダー：タブレット幅（1161〜1500px）でナビが右側操作群と重なるため、
   ヘッダー自体は1段のまま、長いナビタブだけ「意味のまとまり」で2行に折り返す =====
   例）用途・課題から探す → 1行目「用途・課題」／2行目「から探す」
   ロゴ（左）／お問い合わせ・Q&A＋Shop＋MENU（右）は常に1行目のまま */
.site-header .primary-nav > ul > li > a br.nav-break{
  display: none;
}
@media (min-width:1161px) and (max-width:1500px){
  .site-header{
    position: sticky;
    top: 0;
  }
  body{
    padding-top: 0 !important;
  }
  .site-header .header-inner{
    flex-wrap: nowrap;
    height: auto;
    min-height: 72px;
    align-items: center;
    justify-content: space-between !important;
  }
  .site-header .site-logo,
  .site-header .logo{
    min-height: 72px;
    display: flex;
    align-items: center;
  }
  .site-header .header-actions{
    min-height: 72px;
    display: flex;
    align-items: center;
  }
  .site-header .primary-nav{
    flex: 1 1 auto;
    min-width: 0;
    margin-left: 12px;
    margin-right: 12px;
  }
  .site-header .primary-nav > ul{
    flex-wrap: nowrap;
  }
  .site-header .primary-nav > ul > li{
    flex: none;
  }
  .site-header .primary-nav > ul > li > a{
    white-space: normal;
    word-break: keep-all;
    overflow-wrap: normal;
    text-align: center;
    line-height: 1.3;
  }
  .site-header .primary-nav > ul > li > a br.nav-break{
    display: inline;
  }
  .site-header .primary-nav > ul > li > a:has(br.nav-break){
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0;
  }
}