/* ============================================================
   黒岩苗圃様 スマートフォン対応CSS（追加したのはこのファイルだけ）
   既存のデザイン・HTML・画像には一切手を入れず、
   画面幅768px以下のときだけ表示を組み替える
   ============================================================ */
@media screen and (max-width: 768px) {

  /* --- 全体：960px固定・min-width:960pxをすべて解除 --- */
  body{min-width:0 !important;overflow-x:hidden}
  #header_wrap, #header, #main_image, #main_content, #main_col, #side_col,
  #footer_wrap, #footer, #copyright, #footer_widget_area{
    min-width:0 !important; width:auto !important; float:none !important;
  }
  img{max-width:100% !important;height:auto}

  /* --- 上部の住所バー（高さ固定を解除して全文表示）--- */
  .hd-txt{
    position:static !important;font-size:10px !important;
    padding:6px 10px !important;line-height:1.5 !important;margin:0 !important;
    height:auto !important;color:#333 !important;background:#eef0dd;
  }

  /* --- ヘッダー：森バンドをスリムに帯表示し、ロゴを中央に --- */
  #header_wrap{
    height:auto !important;
    background-size:cover !important;background-position:left center !important;
  }
  #header{position:relative;min-height:70px}
  #logo_area{position:static !important;background:rgba(238,240,221,0.92);text-align:center}
  #logo{position:static !important;top:auto !important;left:auto !important;padding:8px !important}
  #logo img{max-width:190px;height:auto}

  /* --- グローバルメニュー：絶対配置を解除し、下に折り返しバーで --- */
  #global_menu{
    position:static !important;top:auto !important;margin:0 !important;
    background:rgba(255,255,255,0.9);padding:6px 4px;
  }
  #global_menu ul{display:flex;flex-wrap:wrap;overflow:visible !important}
  #global_menu li{
    float:none !important;display:block !important;
    margin:3px 6px !important;padding:0 !important;line-height:2 !important;
  }
  #global_menu li a{font-size:14px}

  /* --- スライダー枠（現状コメントアウトで空。余白を潰す） --- */
  #main_image{width:auto !important;min-width:0 !important;height:auto !important;margin:0 !important;padding:0 !important}
  /* 森バンドの高さを程よく抑える */
  #header{min-height:60px}

  /* --- 本文2カラム → 縦積み（メインの下にサイドメニュー）--- */
  #main_content{margin:16px auto !important}
  #main_col{width:auto !important;position:relative}
  #side_col{width:auto !important;margin-top:24px}

  /* コンテンツ内の固定幅ボックス */
  #contents{width:auto !important}
  #main_col img, #side_col img{max-width:100%;height:auto}
  /* hspace属性の左右余白ではみ出す画像（区切り線dot等）を抑える */
  #main_col img[hspace]{margin-left:0 !important;margin-right:0 !important}

  /* テーマCSS側の固定幅（クラス指定・665px等）で画面をはみ出す要素を抑える */
  .menu_01, .menu_02, .menu_03, .menu_04, .menu_05, .menu_06,
  #main_col h1, #main_col h2, #main_col h3, #side_col h1, #side_col h2{
    width:auto !important; max-width:100% !important; box-sizing:border-box;
    margin-left:0 !important; margin-right:0 !important;  /* .menu_01の左マージン22pxを解除して新着情報と同じ全幅に */
  }
  #main_col a.title, #main_col .title a, #main_col .post_list .title a,
  #press_list .title a{
    width:auto !important; float:none !important;
  }

  /* ホバー用の重ね画像（opacity:0でクロスフェードする_on版）はスマホでは隠す。
     残すと透明のまま場所だけ取り、大きな空白になる（PCのマウスホバー演出はスマホに不要） */
  #main_col img[style*="opacity: 0"], #side_col img[style*="opacity: 0"]{display:none !important}

  /* --- 本文内の重なり解消：絶対配置・フロート・負マージン・固定幅を解除 --- */
  #main_col [style*="position: absolute"]{
    position:static !important;left:auto !important;top:auto !important;
    width:auto !important;z-index:auto !important;
  }
  #main_col [style*="float"]{float:none !important}
  #main_col [style*="margin-top: -"]{margin-top:0 !important}
  #main_col [style*="margin-left:"]{margin-left:0 !important}
  #main_col [style*="width:"]{max-width:100% !important;box-sizing:border-box !important}
  /* 幅を直書きされた「箱」(div)は、大きすぎ→縮める だけでなく 小さすぎ→広げる も行う
     （例：ご対応エリアの枠 width:227px を全幅に）。画像は別ルールなので除外 */
  #main_col div[style*="width:"], #side_col div[style*="width:"]{width:auto !important}
  #main_col [style*="width: 4"], #main_col [style*="width: 3"]{width:auto !important}
  #press_list{width:auto !important}

  /* intro横アコーディオン：縦積みで全項目を素直に表示 */
  #toggle_slide{height:auto !important;position:static !important}
  #toggle_slide .toggle_btn{position:static !important}
  #toggle_slide .toggle_contents{position:static !important;width:auto !important}

  /* もみじ＋ギャラリーバナー：縦積み・中央 */
  #main_col div[style*="float: left"]{float:none !important;text-align:center}
  /* 造園ギャラリー・出荷情報などの小バナー（260px）を画面中央に寄せる */
  #main_col p:has(img[src*="menu_mini"]){text-align:center !important;margin-left:0 !important;margin-right:0 !important;padding:0 !important}
  #main_col img[src*="menu_mini"]{margin-left:auto !important;margin-right:auto !important}

  /* 生産樹木ページ：align付き写真の回り込みを解除して縦積み・中央 */
  #main_col img[align="right"], #main_col img[align="left"]{
    float:none !important;display:block;margin:10px auto !important;
    padding:0 !important;hspace:0;
  }
  #main_col p.tytletext_m{font-size:16px !important;font-weight:bold}

  /* サイドメニューの緑バナー画像：中央寄せで大きく見せる */
  #side_col .textwidget p{text-align:center;margin:6px 0}
  #side_col .textwidget img{width:auto;max-width:100%}

  /* --- フッター（固定幅・フロート・ロゴのはみ出しを解除）--- */
  #footer_wrap{height:auto !important;background-size:cover !important;padding:10px 0}
  #footer, #footer_widget_area, #footer_widget_area *{max-width:100% !important;box-sizing:border-box}
  #footer_widget_area{width:auto !important;float:none !important}
  #footer_widget_area .footer_widget{float:none !important;width:auto !important;margin:6px 12px !important}
  #footer-tel, #text-3, #text-4{float:none !important;width:auto !important}
  #footer_widget_area img{max-width:100% !important;height:auto}
  #footer [style*="margin-left"]{margin-left:0 !important}  /* ロゴのmargin-left:340pxを解除 */
  #footer-tel{text-align:center}
  #copyright{min-width:0 !important;font-size:11px !important;padding:8px !important;width:auto !important}

  /* --- スマホ用：タップで電話（見本で追加した導線） --- */
  .sp-call{
    display:block !important;position:fixed;left:0;right:0;bottom:0;z-index:9000;
    background:#3d5222;color:#fff;text-align:center;text-decoration:none;
    font-size:16px;font-weight:bold;padding:12px 8px;
  }
  body{padding-bottom:56px !important}
}