@charset "utf-8";
/* =========================================================
   詳細ページ（theme/index.tpl）の画面幅対応
   ・通常ページのみ読み込み（ふれあい／スクール／ログイン中は対象外）
   ・幅1060px超はこれまでどおりのPC表示（このCSSは効きません）
   ・1060px以下：固定幅を解除して画面幅に合わせる
   ・760px以下：スマホ向けの調整
   ========================================================= */

/* ===== 1060px以下：固定幅の解除 ===== */
@media (max-width:1060px){
 body{background-image:none;background-color:#fff;}
 #wrap{width:auto;}
 #contents{width:auto;padding:0 20px;}

 /* 見出し（固定幅の背景画像 → CSSの帯に置き換え） */
 #contents h1{
  width:auto;height:auto;min-height:34px;line-height:1.5;padding:7px 16px;margin:16px 0;
  background:linear-gradient(135deg,#2e8a1c,#47a82a);border-radius:8px;color:#fff;
 }
 #contents .h2,#contents .h2_s,#contents .h2_s600,#contents .h2_m{width:auto;max-width:100%;}

 /* 本文中の画像・動画・埋め込み */
 #contents img{max-width:100% !important;height:auto !important;}
 #contents iframe,#contents video,#contents embed,#contents object{max-width:100% !important;}

 /* 幅を数値で指定した要素を画面内に収める */
 #contents div,#contents p,#contents ul,#contents ol,#contents dl,#contents form{max-width:100%;}
 #contents [style*="width"]{max-width:100% !important;box-sizing:border-box;}

 /* 幅を数値で指定した表は画面幅いっぱいに（文字は折り返し） */
 #contents table[width],#contents table[style*="width"]{width:100% !important;max-width:100% !important;table-layout:auto;}
 #contents td[width],#contents th[width]{width:auto !important;}

 /* 入力フォーム */
 #contents dl.input,#contents dl.input dl.address,#contents .jyuku dl.input{width:auto;max-width:100%;margin-left:0;}
 #contents input[type="text"],#contents input[type="email"],#contents input[type="tel"],
 #contents input[type="password"],#contents textarea,#contents select{max-width:100%;box-sizing:border-box;}

 /* 一覧系 */
 #contents table.usrlist,#contents table#movie_list,#contents ul#keyword_list li,
 #contents ul#seminar_list,#contents #seminar_list li,#contents .movie_caption{width:auto;max-width:100%;}

 /* パンくず・ページ先頭へ */
 .pankuzu ul{height:auto;line-height:1.6;margin:10px 0 0;padding:0 20px;}
 .pankuzu li{line-height:1.6;}
 .pagetop{margin:18px 20px 0;}
}

/* ===== 760px以下：スマホ ===== */
@media (max-width:760px){
 #contents{padding:0 14px;word-wrap:break-word;overflow-wrap:anywhere;}
 .pankuzu ul{padding:0 14px;}
 .pankuzu li{font-size:11.5px;}
 .pagetop{margin:16px 14px 0;}

 #contents h1{font-size:17px;padding:8px 12px;}

 /* 2段組み（左右に並べた要素）を縦積みに */
 #contents .movie_left,#contents .movie_right{float:none;width:auto;max-width:100%;}

 /* 入力フォーム：項目名と入力欄を縦積みに */
 #contents dl.input dt,#contents dl.input dl.address dt{float:none;width:auto;}
 #contents dl.input dd,#contents dl.input dl.address dd{margin-left:0;border-left:none;}
 #contents input[type="text"],#contents input[type="email"],#contents input[type="tel"],
 #contents input[type="password"],#contents textarea{width:100%;}

 /* リスト字下げを浅く */
 #contents .general ul li,#contents .general ol li{margin-left:20px;}
 #contents .general dl dd{margin-left:16px;}
}