/* スマートフォン・タブレット対応（2026-11-06 指示「モバイル対応」）。
   もとの style.css は幅 1000px 固定なので、画面が狭いときだけここで上書きする。PC の見た目は変えない。 */

@media (max-width: 1020px) {
  body { min-width: 0 !important; }
  #pagewrap, #header, #head_menu .topmenu, #contentwrap, #main_banner_bg, #main_banner_bg .main_banner,
  #sub_banner_bg, #sub_banner_bg .sub_banner, #na_serch_bg .na_serch, #sub_serch_bg .sub_serch {
    width: auto !important; min-width: 0 !important; max-width: 100%;
  }
  #contentwrap { padding: 0 12px; box-sizing: border-box; }
  #content img, #content table, #content iframe, #content video { max-width: 100%; }
  #content img { height: auto; }

  /* ヘッダー：ロゴ＋電話・お見積もり・お問い合わせを折り返して並べる */
  #pagewrap #h1 { display: none; }
  #header { height: auto !important; overflow: visible !important; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 12px; box-sizing: border-box; }
  #header .logo, #header .header_right { float: none !important; padding: 0 !important; }
  #header .header_right { width: 100%; }
  #header .header_right ul { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; justify-content: center; }
  #header .header_right li { list-style: none; }
  #header .header_right img { max-height: 34px; width: auto; }

  /* 上のメニュー：隠れないように折り返して全部見せる（2026-11-06 指示「上のメニューが出ない」） */
  #head_menu { height: auto !important; }
  #myslidemenu ul { display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)); }
  #myslidemenu li { width: auto !important; border-left: none !important; border-right: none !important; border-bottom: 1px solid #eee; border-right: 1px solid #eee !important; }
  #myslidemenu li a { padding: 0 2px; white-space: nowrap; }

  /* トップの検索：背景の大きな絵はやめて、検索欄だけ */
  #main_banner_bg { height: auto !important; background-size: cover; }
  #na_serch_bg, #na_serch_bg .na_serch { height: auto !important; background: none !important; }
  #na_serch_bg .na_serch .na_serch_form { float: none !important; padding: 14px 12px !important; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px;
    background: rgba(255, 255, 255, .9); }
  #na_serch_bg .na_serch .na_serch_form > div { float: none !important; margin: 0 !important; }
  #na_serch_bg select { max-width: 70vw; height: 34px; }
  #sub_banner_bg, #sub_serch_bg { height: auto !important; }
  #sub_serch_bg .navi { padding: 16px 12px !important; }

  /* フッター：縦に並べる */
  #tail_banner, #tail_content { min-width: 0 !important; height: auto !important; }
  #tail_banner .tail_banner, #tail_content .tail_top { width: auto !important; }
  #tail_banner > div { flex-direction: column !important; gap: 16px !important; padding: 20px 14px !important; text-align: center; }
  #tail_banner > div > div { text-align: center !important; flex-wrap: wrap; justify-content: center; }

  /* ナレーターカード：2列 */
  .nl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
  .nw-info { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 640px) {
  body { font-size: 13px; }
  #header .logo img { width: 26px; height: auto; }
  .nw-logo-jp { font-size: 20px !important; }
  .nw-logo-en { font-size: 10px !important; }
  .nw-tel-h { display: none; }

  /* 言語メニュー：折り返して全部見せる（隠れないように） */
  .nw-bar.wrap .nw-bar-s { flex-wrap: wrap !important; justify-content: center !important; overflow: visible !important; row-gap: 5px !important; }
  .nw-bar.wrap .nw-bar-s a { font-size: 11px; line-height: 24px; padding: 0 7px; }
  /* 上のメニュー：3列 */
  #myslidemenu ul { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  /* 電話・お見積もり・お問い合わせを1行に */
  #header .header_right ul { flex-wrap: nowrap; gap: 4px; }
  #header .header_right img { max-height: 30px; }
  .nw-tel { margin-right: 0 !important; padding-right: 4px !important; }
  .nw-tel img { display: none; }
  .nw-tel-n { font-size: 15px !important; }
  .nw-bar-s::-webkit-scrollbar { display: none; }

  /* 見出し */
  .nw-sec h2 { font-size: 20px !important; }
  .nw-sec h2 small { display: none; }

  /* ナレーターカード：1列 */
  .nl-grid { grid-template-columns: 1fr !important; }
  .nw-info { grid-template-columns: 1fr !important; }
  .nw-faq ul { grid-template-columns: 1fr !important; }

  /* 詳細ページ：写真を上、情報を下に */
  .nd-top { grid-template-columns: 1fr !important; gap: 16px !important; }
  .nd-top > div:first-child { display: flex; flex-direction: column; align-items: center; }
  .nd-photo { width: 200px !important; height: 250px !important; }
  .nd-btn { width: 100%; }
  .nd-btn-big { padding: 13px 0 !important; width: 100%; box-sizing: border-box; }
  .nd-head h2 { font-size: 22px !important; }
  .nd-row { grid-template-columns: 86px 1fr !important; }
  .nd-clip { flex-wrap: wrap; }
  .nd-audio { width: 100% !important; }

  /* 表・フォームが横にはみ出さないように */
  #content table { width: 100% !important; }
  #content input[type=text], #content input[type=email], #content input[type=tel], #content input[type=password], #content textarea, #content select { max-width: 100%; box-sizing: border-box; }
  #content td, #content th { word-break: break-word; }
}