@charset "utf-8";

/* ==========================================================================
   相談ナビ - Responsive Styles
   ========================================================================== */

/* --------------------------------------------------------------------------
   Large Desktop (≤1400px)
   -------------------------------------------------------------------------- */
@media screen and (max-width: 1400px) {
  .pro-card-list { grid-template-columns: repeat(4, 1fr); }
  .top_pickup-list { grid-template-columns: repeat(4, 1fr); }
  .stat-item { padding: 16px 20px; }
  .site-footer__inner { gap: 32px; padding-top: 48px; }
}

/* --------------------------------------------------------------------------
   Medium Desktop (≤1200px)
   -------------------------------------------------------------------------- */
@media screen and (max-width: 1200px) {
  :root { --container-pad: 24px; }

  .navbar__tagline { display: none; }

  .pro-card-list { grid-template-columns: repeat(3, 1fr); }
  .top_pickup-list { grid-template-columns: repeat(3, 1fr); }
  .top_articles-list { grid-template-columns: repeat(3, 1fr); }

  .site-footer__inner {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 28px;
  }
  .footer-col--brand { grid-column: 1 / -1; }
  .footer-col--brand .footer-desc { display: none; }

  .consultaion_category_list ul { grid-template-columns: repeat(7, 1fr) !important; }
}

/* --------------------------------------------------------------------------
   Tablet (≤1024px)
   -------------------------------------------------------------------------- */
@media screen and (max-width: 1024px) {
  .navbar__links { display: none; }
  .navbar__cta .btn--outline-nav { display: none; }
  .navbar__toggle { display: flex; }

  .hero { padding-top: calc(64px + 40px); }

  .pro-card-list { grid-template-columns: repeat(3, 1fr); gap: 16px; }
  .top_pickup-list { grid-template-columns: repeat(3, 1fr); gap: 16px; }
  .pro_list .pro-card-list { grid-template-columns: repeat(2, 1fr); }
  .pro_list .top_pickup-list { grid-template-columns: repeat(2, 1fr); }

  .top_articles-list { grid-template-columns: repeat(2, 1fr); }
  .testimonials_list { grid-template-columns: 1fr; }

  .consultaion_category_list ul { grid-template-columns: repeat(6, 1fr) !important; }

  .top-about .top-about-wrapper { flex-direction: column; gap: 24px; }

  /* タブレット：士業バッジを3列3段に（nth-childリセット） */
  .pro-badgers_list:nth-child(-n+5),
  .pro-badgers_list:nth-child(n+6) {
    flex: 0 0 calc(33.333% - 12px) !important;
  }

  /* 相談内容グリッド */
  .sn-consult-grid__list { grid-template-columns: repeat(6, 1fr) !important; }

  .about_intro_flex { flex-direction: column; gap: 32px; }
  .about_intro_img { width: 100%; max-width: 480px; margin: 0 auto; }

  .site-footer__inner { grid-template-columns: 1fr 1fr; }
  .footer-col--brand { grid-column: 1 / -1; }

  .pro-cta-band__inner { flex-direction: column; text-align: center; gap: 20px; }
  .topbenifits { flex-direction: column; align-items: center; }
}

/* --------------------------------------------------------------------------
   Mobile Large (≤768px)
   -------------------------------------------------------------------------- */
@media screen and (max-width: 768px) {
  :root {
    --container-pad: 16px;
    --section-py: clamp(40px, 8vw, 64px);
  }

  /* Navbar */
  .navbar__inner { height: 58px; }
  .navbar__logo-img { width: 130px; }
  .navbar__cta .global-nav__search-button { display: none; }

  /* Hero */
  .hero { padding-top: calc(58px + 28px); padding-bottom: 24px; }
  .hero__inner { gap: 20px !important; }
  .hero__content { gap: 14px !important; }
  .hero__title { font-size: 1.5rem !important; line-height: 1.4 !important; }
  .hero__subtitle { font-size: 0.875rem !important; }

  /* Search widget */
  .search-widget { border-radius: var(--r-lg); }
  .search-tab { font-size: 0.8125rem; padding: 11px 6px; gap: 4px; }
  .search-tab svg { display: none; }
  .search-widget__panel { padding: 14px; }
  .search-panel-form { flex-direction: column; gap: 10px; }
  .search-panel-form__fields { flex-direction: column; gap: 8px; }
  .btn-search { width: 100%; justify-content: center; height: 48px; }
  .search-input { height: 48px; }
  .search-select { height: 48px; font-size: 0.9rem; }

  /* Trust */
  .hero__trust { gap: 8px; }
  .trust-badge { font-size: 0.75rem; padding: 5px 10px; }

  /* よくある相談（ウィジェット内）モバイル対応 */
  .search-widget__quickcats { padding: 12px 14px; gap: 6px 8px; }
  .search-widget__quickcats-label { font-size: 0.75rem; width: 100%; }
  .search-widget__quickcats-list a { font-size: 0.75rem; padding: 4px 10px; }

  /* Stats */
  .stats-bar__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 0 var(--container-pad);
  }
  .stat-item { padding: 14px 10px; gap: 8px; }
  .stat-num { font-size: 1.0625rem; }
  .stat-label { font-size: 0.6875rem; }
  .stat-divider { display: none; }

  /* Page banner */
  .page-banner { padding-top: calc(58px + 32px); padding-bottom: 32px; }
  .page-banner__title { font-size: 1.375rem; }
  .page-nav-strip { top: 58px; }
  .page-nav-strip__item a { padding: 12px 14px; font-size: 0.8125rem; }

  /* Cards */
  .pro-card-list { grid-template-columns: 1fr 1fr; gap: 12px; }
  .top_pickup-list { grid-template-columns: 1fr 1fr; gap: 12px; }
  .pro_list .pro-card-list { grid-template-columns: 1fr; }
  .pro_list .top_pickup-list { grid-template-columns: 1fr; }
  .pro-card__name { font-size: 0.9375rem; }

  /* Articles */
  .top_articles-list { grid-template-columns: 1fr 1fr; gap: 12px; }

  /* Testimonials */
  .testimonials_list_item { flex-direction: column; }
  .image_box { width: 100%; height: 180px; }

  /* Consultation cats */
  .consultaion_category_list ul { grid-template-columns: repeat(4, 1fr) !important; gap: 8px !important; }
  .consult-cat_list { gap: 6px; }
  .consult-cat_list_item .tag { font-size: 0.8125rem; padding: 6px 14px; }

  /* Consult cats footer */
  .consult-cats { padding: 40px 0 32px; }
  .consult-cats__grid { grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)) !important; gap: 10px !important; }
  .consult-cat-icon { width: 68px !important; height: 68px !important; }
  .consult-cat-icon img { width: 58px !important; height: 58px !important; }
  .consult-cat-label { font-size: 0.8125rem !important; }
  .sn-consult-icon { width: 68px !important; height: 68px !important; }
  .sn-consult-icon img { width: 58px !important; height: 58px !important; }

  /* How it works */
  .how-steps { flex-direction: column; align-items: center; gap: 16px; }
  .how-step { max-width: 100%; width: 100%; }
  .how-step-arrow { display: none; }
  .how-guarantees { gap: 8px 16px; }

  /* Easy steps */
  .easy-steps__list { flex-direction: column; align-items: center; gap: 16px; }
  .easy-step { max-width: 100%; width: 100%; }
  .easy-step__arrow { display: none; }
  .easy-steps__badges { gap: 8px 16px; }

  /* Footer nav group */
  .footer-nav-group { grid-template-columns: 1fr 1fr !important; }
  .site-footer__inner { grid-template-columns: 1fr !important; gap: 32px !important; }

  /* Consult cats */
  .consult-cats__grid { grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)) !important; }

  /* Join section */
  .join_kaiketsu-wrapper { gap: 20px; }
  .topbenifits { flex-direction: column; align-items: center; gap: 12px; }
  .topbenifits li { width: 100%; max-width: 340px; justify-content: center; }

  /* Pro CTA band */
  .pro-cta-band { padding: 36px 0; }
  .pro-cta-band__title { font-size: 1.25rem; }
  .btn--cta-band { padding: 14px 28px; font-size: 0.9375rem; }

  /* Footer */
  .site-footer__inner {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    padding: 40px var(--container-pad) 32px;
  }
  .footer-col--brand { grid-column: 1 / -1; }
  .footer-col--brand .footer-logo img { width: 130px; }
  .footer-col__title { font-size: 0.8125rem; margin-bottom: 12px; }
  .footer-nav-list { gap: 8px; }
  .footer-nav-list li a { font-size: 0.75rem; }
  .site-footer__bottom-inner { flex-direction: column; align-items: center; text-align: center; gap: 12px; }
  .footer-legal-nav { justify-content: center; gap: 16px; }

  /* 768px以下：士業バッジ3列 */
  .pro-badgers_list:nth-child(-n+5),
  .pro-badgers_list:nth-child(n+6) {
    flex: 0 0 calc(33.333% - 11px) !important;
    min-width: 0 !important;
  }

  /* Map */
  .kensaku-map { max-width: 480px !important; }
  .todofuken { grid-template-columns: 1fr; }

  /* 相談内容グリッド */
  .sn-consult-grid__list { grid-template-columns: repeat(5, 1fr) !important; gap: 8px; }
}

/* --------------------------------------------------------------------------
   Mobile Small (≤480px)
   -------------------------------------------------------------------------- */
@media screen and (max-width: 480px) {
  .pro-card-list { grid-template-columns: 1fr; }
  .top_pickup-list { grid-template-columns: 1fr; }
  .top_articles-list { grid-template-columns: 1fr; }

  .search-tab { padding: 10px 4px; font-size: 0.75rem; }

  .stats-bar__inner { grid-template-columns: 1fr 1fr; }

  .consultaion_category_list ul { grid-template-columns: repeat(3, 1fr) !important; }

  .consult-cats__grid { grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); }

  /* 相談内容グリッド */
  .sn-consult-grid__list { grid-template-columns: repeat(3, 1fr) !important; }

  .site-footer__inner { grid-template-columns: 1fr; }

  .pro-badgers_list:nth-child(-n+5),
  .pro-badgers_list:nth-child(n+6) {
    flex: 0 0 calc(33.333% - 8px) !important;
  }

  .hero__trust { flex-direction: column; align-items: center; }
  .trust-badge { width: 100%; justify-content: center; max-width: 260px; }

  .navbar__logo-img { width: 110px; }
}

/* --------------------------------------------------------------------------
   Print
   -------------------------------------------------------------------------- */
@media print {
  .navbar, .hero, .stats-bar, .pro-cta-band,
  .consult-cats, .site-footer, .sp_overlay,
  .join_kaiketsu { display: none !important; }

  body { background: #fff; color: #000; font-size: 11pt; }
  a { color: #000; text-decoration: underline; }
}
