/* 暮らしの相談室：公式サイトからのご案内 */
.bss-header-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex: 0 0 auto;
  padding: 5px 22px;
  border: 2px solid #7aa8bc;
  border-radius: 999px;
  background: #dff1fa;
  color: #24588c;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
  text-decoration: none;
  transition: background-color .2s ease, color .2s ease;
}
.bss-header-link span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: Arial, sans-serif;
  font-size: 1.3em;
  font-weight: 400;
  line-height: 1;
  transform: translateY(-.06em);
}
.bss-header-link:hover { background: #c8e7f6; color: #003e76; }
.bss-header-link:focus-visible { outline: 3px solid #005092; outline-offset: 3px; }
.top_header_inner { max-width: 1440px; gap: 24px; }
.top_header_inner > .header_tel_wrap { margin-left: 0; flex: 1 1 622px; min-width: 0; display: flex; justify-content: center; }
.top_header_inner > .header_tel_wrap > .header_tel_link { width: 100%; max-width: 622px; }
.top_header_inner > .header_tel_wrap img { width: 100%; height: auto; }
.top_header_inner > .bss-header-link { margin-left: 0; }
.bss-header-brand { gap: 20px; }
.bss-header-brand > .header_tel_wrap { margin-left: 0; }
.bss-header-brand > .bss-header-link { padding: 5px 14px; font-size: 15px; gap: 8px; }
.top_footer_banner_item-bss { grid-column: 1 / -1; margin-top: 24px; }
.top_footer_banner_item-bss picture { display: block; }
.top_footer_banner_item-bss .bss-footer-banner { display: block; width: 100%; height: auto; }
@media screen and (min-width: 761px) {
  .header_wrap { max-width: 1600px; }
  .header_wrap .bss-header-brand { flex: 1 1 auto; min-width: 0; }
  .bss-header-brand > .header_tel_wrap { flex: 0 0 auto; }
  .bss-header-brand > .bss-header-link {
    margin-inline: auto;
    padding: 8px 20px;
    font-size: clamp(18px, 1.4vw, 21px);
    gap: 10px;
  }
  .header_wrap .header_menu_wrap { flex: 0 0 auto; }
}
@media screen and (min-width: 761px) {
  .header_wrap .glovalnavi_inner {
    display: grid;
    grid-template-columns: repeat(2, max-content);
    gap: 4px 16px;
    max-width: none;
    padding-top: 0;
    margin-right: 16px;
  }
  .header_wrap .glovalnavi_item,
  .header_wrap .glovalnavi_item:not(:last-child) { width: auto; margin: 0; padding: 0; }
  .header_wrap .glovalnavi_item::after { display: none; }
  .header_wrap .glovalnavi_link { font-size: 14px; white-space: nowrap; letter-spacing: .04em; }
}
@media screen and (min-width: 761px) and (max-width: 1200px) {
  .bss-header-brand { gap: 12px; }
  .header_wrap .glovalnavi_wrap { display: none; }
}
@media screen and (max-width: 760px) {
  .top_header_inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 8px;
    padding-inline: 8px;
  }
  .top_header_inner > .top_header_logo_wrap { flex: 0 0 auto; }
  .top_header_logo_wrap img { width: clamp(60px, 20vw, 107px); }
  .top_header_inner > .header_tel_wrap { order: 3; flex: 0 1 92px; justify-self: end; width: 100%; max-width: 92px; }
  .top_header_inner > .header_tel_wrap img { width: 100%; height: auto; }
  .top_header_inner > .bss-header-link { order: 2; margin-left: 0; justify-self: center; }
  .bss-header-link,
  .bss-header-brand > .bss-header-link {
    padding: 4px 8px;
    gap: 5px;
    border-width: 1px;
    font-size: clamp(8px, 2.35vw, 13px);
    line-height: 1.4;
  }
  .header_wrap { padding-inline: 6px; gap: 4px; }
  .bss-header-brand { flex: 1 1 auto; min-width: 0; gap: 6px; padding-left: 0; }
  .bss-header-brand > a:first-child,
  .bss-header-brand > h1 { flex: 0 0 auto; }
  .bss-header-brand .logo { width: clamp(54px, 15vw, 94px); height: auto; }
  .bss-header-brand > .header_tel_wrap { order: 3; flex: 0 1 92px; min-width: 0; margin: 0; }
  .bss-header-brand > .header_tel_wrap img { width: 100%; height: auto; }
  .bss-header-brand > .bss-header-link { order: 2; margin-left: auto; }
  .header_menu_wrap { flex: 0 0 36px; min-width: 0; }
  .header_menu_wrap .hamburger_open { flex: 0 0 36px; width: 36px; }
  .top_footer_banner_item-bss { margin-top: 12px; }
}
