/* =========================================================
   Mobile Header FINAL override (<=736px)
   - ロゴは左端固定、メニューは右寄せ
   - 被り/はみ出しを抑えるため最小限だけ縮小
   - ハルシネーション禁止／省略禁止／虚偽禁止
========================================================= */
@media (max-width:736px){

  /* ヘッダーは横並び。左右に要素を振り分け */
  #header{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:10px !important;
    height:auto !important;
    padding:6px 10px !important;
  }

  /* ロゴは左端に固定（押し出し役） */
  #logo{
    order:0 !important;
    margin:0 !important;
    margin-right:auto !important;   /* ← これでメニューが右へ押し出される */
    flex:0 0 auto !important;
  }
  #logo img{
    height:30px !important;         /* 既存34px→30pxに微調整（被り防止） */
    width:auto !important;
  }

  /* メニューは右寄せ・折返しさせない（被り回避） */
  #nav{
    order:1 !important;
    flex:1 1 auto !important;
    min-width:0 !important;         /* はみ出し抑止 */
  }
  #nav > ul{
    display:flex !important;
    flex-wrap:nowrap !important;    /* 折返しなし＝見た目安定 */
    justify-content:flex-end !important; /* 右寄せ */
    align-items:center !important;
    gap:12px !important;            /* ロゴ縮小に合わせてgapもやや小さめ */
    margin:0 !important;
    padding:0 !important;
  }

  /* 各リンクは少しだけ縮める（でも可読性は確保） */
  #nav > ul > li > a{
    font-size:clamp(12px,3.7vw,13px) !important;
    line-height:1.35 !important;
    padding:.25em 0 !important;
    white-space:nowrap !important;  /* 2行化を防止 */
  }

  /* CTAボタンは高さ・パディングを控えめに */
  #header .button.primary{
    height:30px !important;
    line-height:30px !important;
    padding:0 12px !important;
    border-radius:9999px !important;
    font-size:13px !important;
    white-space:nowrap !important;  /* 2行化を防止 */
  }
}

/* =========================================================
   Mobile CTA Final Fix（≤736px）
   「お問い合わせ」ボタンを白いピル型に戻す
   - PCと同じデザイン（背景白・文字#365650）
   - ホバー時に淡いグレー
   - ハルシネーション禁止／省略禁止／虚偽禁止
========================================================= */
@media (max-width:736px){
  #header .button.primary{
    background:#ffffff !important;
    color:#365650 !important;                /* 文字色：gj-primary-dark */
    border:0 !important;
    height:32px !important;
    line-height:32px !important;
    padding:0 14px !important;
    border-radius:9999px !important;
    font-size:13px !important;
    font-weight:700 !important;
    box-shadow:0 2px 6px rgba(0,0,0,.18) !important;
    text-decoration:none !important;
    white-space:nowrap !important;
  }

  #header .button.primary:hover{
    background:#f3f6f6 !important;
    color:#486660 !important;                /* gj-primary */
    box-shadow:0 4px 10px rgba(0,0,0,.22) !important;
  }
}

/* =========================================================
   Mobile Logo Final Alignment（≤736px）
   - ロゴをさらに左端へ
   - バランスよく大きめ（約36px）
   - 他要素は変更せず
   - ハルシネーション禁止／省略禁止／虚偽禁止
========================================================= */
@media (max-width:736px){

  /* ヘッダーの左右余白を少し狭くしてロゴを左端へ */
  #header{
    padding-left:6px !important;
    padding-right:10px !important;
  }

  /* ロゴは左端固定＋微調整 */
  #logo{
    margin:0 !important;
    margin-right:auto !important;
    position:relative !important;
    left:0 !important;
    flex:0 0 auto !important;
  }

  /* ロゴ画像サイズを少し拡大（高さ36px） */
  #logo img{
    height:36px !important;
    width:auto !important;
    max-height:none !important;
  }

  /* ロゴの見切れ防止：垂直方向に中央配置 */
  #logo a{
    display:flex !important;
    align-items:center !important;
  }
}

/* =========================================================
   Google Map 表示制御
   - PCのみ表示、Tablet/Smartphoneは非表示
   - カード内で横幅100%
========================================================= */
.only-pc { display:block; }
@media (max-width:980px){
  .only-pc { display:none !important; }
}
.map-wrap iframe{
  width:100%;
  height:450px;
  border:0;
}

/* =========================================================
   Footer Brand Logo（PC/Tablet/Smartphoneで最適サイズ）
   - 画像: images/logo_godjob06.png
   - 縦横比維持（高さ指定・幅auto）
========================================================= */
#footer{
  background:rgba(34,48,46,.92); /* 既定トーン維持 */
  border-top:1px solid rgba(255,255,255,.06);
  padding-top:22px;
  padding-bottom:28px;
}
.footer-brand{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:6px 0 10px;
}
.footer-brand img{
  display:block;
  height:52px;           /* PC 既定 */
  width:auto;            /* 縦横比維持 */
  image-rendering:auto;
  -ms-interpolation-mode:bicubic;
}
@media (max-width:980px){
  .footer-brand img{ height:44px; }  /* Tablet */
}
@media (max-width:736px){
  .footer-brand img{ height:36px; }  /* Smartphone */
}

/* 既存の .copyright は残すが主張を弱める */
#footer .copyright{
  display:flex;
  justify-content:center;
  gap:12px;
  margin:8px 0 0;
  opacity:.65;
  list-style:none;
  padding-left:0;
}
