@charset "UTF-8";
/* =========================================================
   01-common-franchise.css
   独立加盟店用 共通CSS
   二重表示防止版
========================================================= */

/* 古い固定バッジを無効化 */
html body::before {
  content: none !important;
  display: none !important;
}

/* 親要素側に残っている独立加盟店バッジを停止 */
html body .siteHeader_logo::after,
html body .site-header-logo::after,
html body .navbar-brand::after,
html body .site-title::after {
  content: none !important;
  display: none !important;
}

/* サイト名リンクを横並びにする */
html body .siteHeader_logo > a,
html body .site-header-logo > a,
html body a.navbar-brand,
html body .site-title > a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  text-decoration: none !important;
}

/* 独立加盟店バッジはリンク側に1つだけ表示 */
html body .siteHeader_logo > a::after,
html body .site-header-logo > a::after,
html body a.navbar-brand::after,
html body .site-title > a::after {
  content: "独立加盟店" !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 3px 10px !important;
  border: 1px solid #C8D6AA !important;
  border-radius: 999px !important;
  background: #F3F7EE !important;
  color: #2F4635 !important;

  font-family:
    "Noto Sans JP",
    "Hiragino Sans",
    "Yu Gothic",
    "Yu Gothic Medium",
    "Meiryo",
    sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
  box-sizing: border-box !important;
}

/* スマホ */
@media screen and (max-width: 767px) {
  html body .siteHeader_logo > a,
  html body .site-header-logo > a,
  html body a.navbar-brand,
  html body .site-title > a {
    gap: 6px !important;
  }

  html body .siteHeader_logo > a::after,
  html body .site-header-logo > a::after,
  html body a.navbar-brand::after,
  html body .site-title > a::after {
    padding: 2px 8px !important;
    font-size: 10px !important;
  }
}
/* =========================================================
   ISSYA HEADER TITLE TWO LINES
   一社スタジオ：サイト名を2行で表示
========================================================= */

@media screen and (min-width: 768px) {

  html body .siteHeader_logo > a,
  html body .site-header-logo > a,
  html body a.navbar-brand,
  html body .site-title > a {
    display: inline-flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;

    /* 元のタイトル文字を視覚上非表示 */
    font-size: 0 !important;
    line-height: 1 !important;
  }

  /* 2行のサイトタイトル */
  html body .siteHeader_logo > a::before,
  html body .site-header-logo > a::before,
  html body a.navbar-brand::before,
  html body .site-title > a::before {
    content:
      "【名古屋・一社ヨガ】\A"
      "イルチブレインヨガ一社スタジオ" !important;

    display: block !important;
    flex: 0 1 auto !important;

    color: #222222 !important;
    font-family:
      "Noto Sans JP",
      "Hiragino Sans",
      "Yu Gothic",
      "Meiryo",
      sans-serif !important;
    font-size: 21px !important;
    font-weight: 800 !important;
    line-height: 1.45 !important;
    letter-spacing: 0 !important;
    white-space: pre-line !important;
  }

  /* 独立加盟店バッジは右側に1個だけ表示 */
  html body .siteHeader_logo > a::after,
  html body .site-header-logo > a::after,
  html body a.navbar-brand::after,
  html body .site-title > a::after {
    flex: 0 0 auto !important;
    align-self: center !important;
  }
}
/* =========================================================
   ISSYA HEADER MENU COMPACT
   一社スタジオ：PCメニューを必要最小限の幅にする
========================================================= */

@media screen and (min-width: 992px) {

  /* ヘッダー内を横並びに固定 */
  html body .siteHeader .container,
  html body header.siteHeader .container,
  html body .site-header .container,
  html body header.site-header .container {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: 18px !important;
  }

  /* サイト名側は必要以上に広げない */
  html body .siteHeader_logo,
  html body .site-header-logo,
  html body .site-title {
    flex: 0 1 auto !important;
    width: auto !important;
    max-width: 430px !important;
    margin-right: 8px !important;
  }

  /* メニュー外枠を内容幅だけにする */
  html body #gMenu_outer,
  html body .gMenu_outer,
  html body .siteHeader_nav,
  html body .site-header-nav {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    margin-left: auto !important;
  }

  /* メニュー本体 */
  html body .gMenu,
  html body .global-nav,
  html body .globalNav {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    width: auto !important;
    gap: 0 !important;
  }

  /* 各メニューの横幅を圧縮 */
  html body .gMenu > li > a,
  html body .global-nav > li > a,
  html body .globalNav > li > a {
    padding-left: 8px !important;
    padding-right: 8px !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
  }

  /* バッジも少しコンパクトに */
  html body .siteHeader_logo > a::after,
  html body .site-header-logo > a::after,
  html body .site-title > a::after {
    padding: 2px 8px !important;
    font-size: 10px !important;
  }
}
/* =========================================================
   ISSYA HEADER HEIGHT COMPACT
   一社スタジオ：PCヘッダーの高さを最小化
========================================================= */

@media screen and (min-width: 992px) {

  /* ヘッダー全体 */
  html body header.siteHeader,
  html body header.site-header,
  html body #site-header,
  html body .siteHeader {
    min-height: 0 !important;
    height: auto !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* ヘッダー内側 */
  html body .siteHeader .container,
  html body header.siteHeader .container,
  html body .site-header .container,
  html body header.site-header .container,
  html body #site-header .container {
    min-height: 0 !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    gap: 8px 18px !important;
  }

  /* サイト名部分 */
  html body .siteHeader_logo,
  html body .site-header-logo,
  html body .site-title {
    min-height: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 2px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1.25 !important;
  }

  /* 2行タイトル */
  html body .siteHeader_logo > a::before,
  html body .site-header-logo > a::before,
  html body .site-title > a::before {
    font-size: 18px !important;
    line-height: 1.3 !important;
  }

  /* 独立加盟店バッジ */
  html body .siteHeader_logo > a::after,
  html body .site-header-logo > a::after,
  html body .site-title > a::after {
    padding: 2px 7px !important;
    font-size: 9px !important;
    line-height: 1.2 !important;
  }

  /* メニュー外枠の上下余白を削減 */
  html body #gMenu_outer,
  html body .gMenu_outer,
  html body .siteHeader_nav,
  html body .site-header-nav {
    min-height: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* メニュー1項目の高さ */
  html body .gMenu > li > a,
  html body .global-nav > li > a,
  html body .globalNav > li > a {
    min-height: 38px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    line-height: 1.35 !important;
  }
}
/* =========================================================
   ISSYA HEADER TITLE EXACT TWO LINES
   一社スタジオ：タイトルを必ず2行に固定
========================================================= */

@media screen and (min-width: 992px) {

  /* サイト名エリアは内容幅で表示 */
  html body .siteHeader_logo,
  html body .site-header-logo,
  html body .site-title {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  /* タイトルとバッジの土台 */
  html body .siteHeader_logo > a,
  html body .site-header-logo > a,
  html body .site-title > a {
    position: relative !important;
    display: inline-block !important;

    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;

    /* 右側にバッジ用の幅だけ確保 */
    padding: 0 70px 0 0 !important;

    font-size: 0 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    overflow: visible !important;
  }

  /* 必ず2行にするタイトル */
  html body .siteHeader_logo > a::before,
  html body .site-header-logo > a::before,
  html body .site-title > a::before {
    content:
      "【名古屋・一社ヨガ】\A"
      "イルチブレインヨガ一社スタジオ" !important;

    display: block !important;
    width: max-content !important;
    min-width: max-content !important;
    max-width: none !important;

    color: #222222 !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    line-height: 1.28 !important;
    letter-spacing: 0 !important;

    white-space: pre !important;
    overflow: visible !important;
  }

  /* 独立加盟店バッジを右側に固定 */
  html body .siteHeader_logo > a::after,
  html body .site-header-logo > a::after,
  html body .site-title > a::after {
    position: absolute !important;
    top: 50% !important;
    right: 0 !important;
    left: auto !important;
    transform: translateY(-50%) !important;

    margin: 0 !important;
    padding: 2px 7px !important;

    font-size: 9px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
  }
}
/* =========================================================
   ISSYA MOBILE HEADER FINAL
   一社：タイトル2行固定・バッジ右配置
========================================================= */

@media screen and (max-width: 767px) {

  /* ヘッダーのサイト名領域 */
  html body .siteHeader_logo,
  html body .site-header-logo,
  html body .site-title {
    position: relative !important;

    width: 100% !important;
    max-width: none !important;
    min-height: 64px !important;

    margin: 0 !important;
    padding: 8px 8px 8px 52px !important;

    box-sizing: border-box !important;
    overflow: visible !important;
  }

  /* サイト名リンク */
  html body .siteHeader_logo > a,
  html body .site-header-logo > a,
  html body .site-title > a {
    position: static !important;
    display: block !important;

    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;

    font-size: 0 !important;
    line-height: 1 !important;
    text-align: left !important;
    overflow: visible !important;
  }

  /* タイトルは必ず2行 */
  html body .siteHeader_logo > a::before,
  html body .site-header-logo > a::before,
  html body .site-title > a::before {
    content:
      "【名古屋・一社ヨガ】\A"
      "イルチブレインヨガ一社スタジオ" !important;

    display: block !important;
    width: max-content !important;
    max-width: none !important;
    min-width: max-content !important;

    color: #222222 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.45 !important;
    letter-spacing: 0 !important;

    white-space: pre !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
  }

  /* 独立加盟店バッジを右側へ */
  html body .siteHeader_logo > a::after,
  html body .site-header-logo > a::after,
  html body .site-title > a::after {
    position: absolute !important;
    top: 50% !important;
    right: 8px !important;
    left: auto !important;

    transform: translateY(-50%) !important;

    margin: 0 !important;
    padding: 2px 6px !important;

    font-size: 8px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
  }
}