/* First Tee Japan — 全ページ共通スタイル
   フォント（Google Fonts / Material Symbols）は各ページの <helmet> で読み込む。
   ここには全ページで値が完全に一致するリセット・ユーティリティ・レスポンシブ指定のみを置く。
   ページ固有の値（.mheropat の位置、goo-sky のオフセット、トップ独自の演出など）は
   各ページのインライン <style> に残し、この後に読み込むことで上書きされる。 */

*{box-sizing:border-box;}
a{color:inherit;}
.msym{font-family:'Material Symbols Rounded';font-weight:500;font-style:normal;line-height:1;font-variation-settings:'FILL' 1,'wght' 500;-webkit-font-feature-settings:'liga';font-feature-settings:'liga';display:inline-block;}
.ftjh-burger{display:none;}

@media (min-width:821px){
  [data-ftj]{min-width:1260px;}
}

@media (max-width:820px){
  .ftjh-nav{display:none !important;}
  .ftjh-burger{display:inline-flex !important;}
  img[src*="goo-sky"]{width:640px !important;}
  img[src*="goo-white"]{width:560px !important;top:auto !important;bottom:-170px !important;right:-300px !important;}
  #venues img[src*="hero-pattern"][style*="right"]{top:auto !important;bottom:32% !important;right:-300px !important;width:520px !important;}
  #venues img[src*="hero-pattern"][style*="left"]{bottom:-160px !important;left:-300px !important;width:520px !important;}
  img[src*="goo-sky"][style*="scaleX"]{right:-530px !important;left:auto !important;}
  img[src*="goo-sky"]:not([style*="scaleX"]){left:-530px !important;right:auto !important;}
  .m1{grid-template-columns:1fr !important;}
  .m2{grid-template-columns:repeat(2,1fr) !important;}
  .mrow{gap:6px !important;}
  .mpad{padding:56px 20px !important;}
  .mh1{font-size:37px !important;}
  .sp-hero{grid-template-columns:1fr !important;gap:24px !important;min-height:0 !important;padding:32px 22px 0 !important;}
  .sp-h1{font-size:31px !important;}
  .mhero{grid-template-columns:1fr !important;gap:10px !important;min-height:0 !important;padding:32px 20px 0 !important;}
  .mhsub{font-size:19px !important;}
  .mbadge{font-size:16px !important;padding:8px 14px !important;}
  .mpp{padding:36px 12px !important;}
  .mpi{padding:48px 20px !important;}
  .mbp{padding:0 22px 24px !important;}
  .mcommit{grid-template-columns:1fr !important;margin-left:0 !important;margin-right:0 !important;gap:10px !important;}
  .mcommit h3,.mcommit li{white-space:normal !important;}
  .mcommit > div{display:grid !important;grid-template-columns:auto 1fr !important;column-gap:14px;align-items:center;text-align:left !important;padding:16px 18px !important;}
  .mcommit > div > div:first-child{grid-row:1 / span 2;width:46px !important;height:46px !important;border-radius:14px !important;}
  .mcommit > div > div:first-child .msym{font-size:26px !important;}
  .mcommit h3{margin:0 !important;font-size:16px !important;}
  .mcommit ul{margin:8px 0 0 !important;padding:8px 0 0 !important;gap:5px !important;}
  .mcommit li{justify-content:flex-start !important;font-size:16px !important;}
  .mfc{padding:24px 18px !important;}
  .mcard{padding:24px 18px !important;}
  .mfeat-img{min-height:0 !important;height:220px !important;}
  .mfeat-body{padding:24px 22px 28px !important;}
  .mimg-lg{height:220px !important;}
  .mimg-md{height:200px !important;}
  .ftjf-grid{grid-template-columns:1fr !important;gap:28px !important;padding:44px 24px 28px !important;}
  .ftjf-bottom{flex-direction:column !important;align-items:flex-start !important;}
  .ftjc-sec{padding:56px 22px 132px !important;}
  .ftjc-h{font-size:29px !important;}
  .ftjc-p{font-size:16px !important;}
  .ftjc-sec img[src*="hero-pattern"]{top:auto !important;bottom:-24px !important;height:150px !important;min-width:540px !important;width:auto !important;left:50% !important;right:auto !important;transform:translateX(-50%) !important;}
  /* ヒーローの装飾パターンはスマホでは下部（画像に重なる位置）に配置し、文字には重ねない */
  /* サブページ装飾：ヒーローと同じ等倍パターン（object-fit:none・厚めの帯・左右へ飛び出す） */
  /* 装飾は飛び出す高さ(400px)を保ちつつ、下方向へ逃がして「上端だけ」を見せる（ヘッダは低く） */
  .mheropat:not(.mheropat-home){display:block !important;position:absolute !important;left:50% !important;right:auto !important;top:auto !important;bottom:-270px !important;transform:translateX(-50%) rotate(180deg) !important;width:auto !important;min-width:2000px !important;height:400px !important;object-fit:fill !important;object-position:center !important;opacity:1 !important;}
  /* 画像あり（レポート・お問い合わせ）は少し多めに見せる */
  .mheropat-img{height:420px !important;bottom:-260px !important;}
  /* 画像ありページ：見出し上・画像は自然な流れ、装飾の上端を画像上に重ねる */
  .sp-hero-img{min-height:0 !important;align-content:normal !important;padding-bottom:0 !important;}
  /* テキストのみページ：見出し上・下部に装飾の上端を見せる帯 */
  .sp-hero-text{min-height:0 !important;align-items:flex-start !important;padding-bottom:150px !important;}
  /* トップのヒーロー装飾：大きく中央・画面外まではみ出す（スマホでも表示） */
  .mheropat-home{display:block !important;position:absolute !important;object-fit:fill !important;object-position:center !important;top:auto !important;bottom:-160px !important;height:72% !important;width:auto !important;min-width:2000px !important;left:50% !important;right:auto !important;transform:translateX(-50%) !important;opacity:1 !important;}
  /* .mbr は改行制御用。スマホでは自然折り返しにするため改行を無効化 */
  .mbr{display:none !important;}
  /* 5つのコミットメントはスマホで1列に（.mcommit は flex のため grid 指定が効かない） */
  .mcommit{flex-direction:column !important;flex-wrap:nowrap !important;}
  .mcommit > div{flex:0 0 auto !important;max-width:100% !important;width:100% !important;}
}
