/* ============================================================
   clone-override.css  —  1cs.jp 静的クローン用の最小オーバーライド
   ------------------------------------------------------------
   現行サイトは UA で viewport を出し分けていた（PC=width=1400px 固定 /
   スマホ=width=device-width）。本クローンは viewport を device-width 一本に統一する。

   【全幅背景の方針（2026-06-14 修正）】
   テーマの内側コンテナ .wrap は width:882pt(≈1176px)・margin:0 auto で
   コンテンツを中央寄せする。よって本クローンは body を 1400px に絞らず、
   全幅セクションの背景（ヘッダー帯・ヒーロー・.wrap-contents の色帯・フッター）を
   画面幅 100% で表示する。コンテンツは .wrap により常に中央 1176px に収まるため、
   広いモニタでも本文が間延びしない。
   → 「背景は画面幅100%・本文は中央寄せ」で、現行PC（1400pxキャンバスを全幅にズーム）
     とほぼ同じ見た目になる。
   ※旧版は body{max-width:1400px} で全要素を箱化していたため、全幅背景が
     1400px で切れて左右に白余白が出ていた（誤り）。本修正で撤廃。
   ============================================================ */

html { background: #ffffff; }

/* 空の <p> を非表示（現行は各ページ inline で p:empty{display:none} を持つが、
   コラム/リリース等のアーカイブ系テンプレだけこの inline が無く、空<p>がスマホメニュー等で
   空行として出てしまう。全ページ共通でここに置いて揃える）。 */
p:empty { display: none; }

/* スマホメニューのトップ項目間に余分な空きが出るページ(コラム等のアーカイブ)対策：
   項目間隔をテーマ既定の 1px に固定し、サブメニュー親の <p>/折りたたみ <ul> の余白を消す。 */
nav.sp .sp-nav > li { margin-bottom: 1px !important; margin-top: 0 !important; }
nav.sp .sp-nav > li > p.normal { margin: 0 !important; }

/* 横スクロールの保険（全幅要素が 100vw を超えないように） */
html, body { overflow-x: hidden; }

/* フォームの「必須」マーカーを赤に（現行テーマはオレンジ。鷲田指示で赤に統一）。元マークアップ流用版に適用。 */
.required { color: #d9333f !important; }

/* ===== 自前フォーム（GAS送信）の最小スタイル ===== */
.cs-form-wrap { max-width: 760px; margin: 0 auto; }
.cs-form .cs-row { margin-bottom: 22px; }
.cs-form label { display: block; font-weight: 700; font-size: 16px; margin-bottom: 8px; line-height: 1.6; }
.cs-form input[type="text"], .cs-form input[type="email"], .cs-form input[type="tel"], .cs-form input[type="url"],
.cs-form select, .cs-form textarea {
  width: 100%; box-sizing: border-box; padding: 12px 14px; font-size: 16px;
  border: 1px solid #c9cdd3; border-radius: 8px; background: #fff; color: #333;
}
/* テーマCSS未読込時(Drive配信遅延)でも画像がコンテナ幅を超えない防御（低詳細度＝テーマ読込時はテーマ優先）*/
.image img { max-width: 100%; height: auto; }
.cs-form input:focus, .cs-form select:focus, .cs-form textarea:focus {
  outline: none; border-color: #6080B0; box-shadow: 0 0 0 3px rgba(96,128,176,.18);
}
.cs-form .required { display: inline-block; font-size: 12px; font-weight: 700; color: #fff;
  background: #d9333f; border-radius: 4px; padding: 2px 8px; margin-left: 6px; vertical-align: middle; }
/* 注記：ラベルと同じ文字サイズ(16px)・フォーム枠内に配置。「必須」は赤文字、続きの文は黒 */
.cs-required-note { color: #000; font-size: 16px; font-weight: 700; line-height: 1.7; margin: 0 0 24px; }
.cs-required-note .required { background: transparent; color: #d9333f; padding: 0; margin: 0 4px 0 0; font-size: inherit; vertical-align: baseline; }
.cs-form .cs-radios label { display: block; font-weight: 400; margin: 0 0 10px; cursor: pointer; }
.cs-form .cs-radios input { margin-right: 8px; }
.cs-form .cs-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.cs-form .cs-submit { text-align: center; margin-top: 32px; }
.cs-form .cs-submit .btn { min-width: 280px; font-size: 17px; padding: 16px 28px; }
.cs-form button[disabled] { opacity: .6; cursor: progress; }
.cs-error { color: #d9333f; font-weight: 700; background: #fde8ea; border: 1px solid #f3b6bd;
  border-radius: 8px; padding: 12px 14px; margin-top: 18px; }
@media (max-width: 767px) { .cs-form .cs-submit .btn { width: 100%; min-width: 0; } }

/* ===== Instagram サムネイル一覧（recruit SNSセクション・各サムネ→投稿へリンク）===== */
.cs-ig-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px;
  max-width: 760px; margin: 0 auto; }
.cs-ig-grid a { display: block; position: relative; aspect-ratio: 1 / 1; overflow: hidden;
  border-radius: 8px; background: #f0f0f0; }
.cs-ig-grid img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .2s ease; }
.cs-ig-grid a:hover img { transform: scale(1.06); }
@media (max-width: 600px) { .cs-ig-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; } }
