/*
Theme Name: Lightning Child
Theme URI:
Template: lightning
Description:
Author:
Tags:
Version: 0.6.1
*/

/* ===============================
   Lightning G3 ヘッダーナビ整形
   =============================== */


@media (max-width: 768px) {
  /* 背景削除・透過 */
  .vk_slider_item .wp-block-group.has-white-background-color.has-background {
    background-color: transparent !important;
    box-shadow: none !important;
  }

  /* キャッチコピーを白文字＋小さめに */
  .vk_slider_item .wp-block-heading.is-style-vk-heading-plain {
    color: #ffffff !important;
    font-size: 1.5rem !important;      /* ←ここでサイズ調整（前回1.2rem） */
    line-height: 1.5 !important;
    text-align: left !important;
    letter-spacing: 0.02em;
    text-shadow: 0 0 6px rgba(0, 0, 0, 0.4); /* 背景と馴染ませて読みやすく */
  }
}


/* メニューがヘッダーの下に潜らないように */
.wp-block-navigation__responsive-container,
.wp-block-navigation__responsive-container * {
    z-index: 999999 !important;
    position: relative;
}

/* ===============================
   採用ページ整形
   =============================== */
/* 採用情報ページだけページヘッダーを非表示 */
.page-id-134 .header-visual,
.page-id-134 .vk_pageHeader,
.page-id-134 .vk-page-header,
.page-id-134 .page-header,
.page-id-134 .l-page-header,
.page-id-134 .section-header,
.page-id-134 .page-header-section {
    display: none !important;
}

/* ===============================
   お問い合わせページ整形
   =============================== */
/* 行全体の余白 */
.contact-row {
  margin-bottom: 28px;
}

/* ラベル部分 */
.contact-label {
  display: inline-block;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 8px;
}

/* 必須ラベル（赤背景） */
.contact-label.required::before {
  content: "必須";
  display: inline-block;
  background: #c00;
  color: #fff;
  font-size: 13px;
  padding: 3px 10px;
  border-radius: 4px;
  margin-right: 12px;
}

/* 任意ラベル（灰色） */
.contact-label:not(.required)::before {
  content: "任意";
  display: inline-block;
  background: #bbb;
  color: #fff;
  font-size: 13px;
  padding: 3px 10px;
  border-radius: 4px;
  margin-right: 12px;
}

/* 入力欄のデザイン */
.contact-input,
.contact-textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid #ddd;
  border-radius: 6px;
  background: #f9f9f9;
  font-size: 16px;
}

.contact-input:focus,
.contact-textarea:focus {
  background: #fff;
  border-color: #cc0000;
  outline: none;
}

/* テキストエリア */
.contact-textarea {
  height: 180px;
}

/* 送信ボタン */
.contact-submit {
  background: #cc0000;
  color: #fff;
  padding: 14px 28px;
  font-size: 18px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
}

.contact-submit:hover {
  background: #a80000;
}
/* 共通：MW WP Form のフォーム幅を中央寄せ・幅を狭く */
.mw_wp_form {
    max-width: 900px;   /* お好みで 700〜900px あたりに調整可能 */
    margin: 0 auto;
    padding: 20px 0;
}

/* フォームのラベルや入力欄のバランス */
.mw_wp_form .contact-row {
    max-width: 900px;
    margin: 0 auto 20px auto;
}

/* confirm・送信ボタンを中央揃え */
.mw_wp_form .form-buttons {
    text-align: center;
    margin-top: 30px;
}

.mw_wp_form .form-buttons input {
    display: inline-block;
    background: #c00;
    color: #fff;
    padding: 12px 30px;
    border-radius: 6px;
    border: none;
    font-size: 16px;
    cursor: pointer;
}

.mw_wp_form .form-buttons input:hover {
    opacity: 0.8;
}

/* ====== 確認画面（Confirm Plus）デザイン調整 ====== */

/* 確認画面の本体テーブル */
.wpcf7cp-confirm-table {
  width: 70%;
  margin: 40px auto;
  border-collapse: collapse;
  font-size: 16px;
  background: #fff;
  box-shadow: 0 2px 10px rgba(0,0,0,0.08);
  border-radius: 6px;
  overflow: hidden;
}

/* 各行 */
.wpcf7cp-confirm-table tr {
  border-bottom: 1px solid #eee;
}

/* ラベル部分（1列目）*/
.wpcf7cp-confirm-table th {
  width: 30%;
  background: #f8f8f8;
  padding: 16px;
  text-align: left;
  font-weight: 600;
  color: #444;
  border-right: 1px solid #eee;
}

/* 入力値（2列目） */
.wpcf7cp-confirm-table td {
  padding: 16px;
  color: #333;
}

/* ボタン配置 */
.wpcf7cp-buttons {
  text-align: center;
  margin-top: 24px;
}

/* ボタン共通 */
.wpcf7cp-buttons input[type="submit"],
.wpcf7cp-buttons button {
  padding: 10px 24px;
  font-size: 15px;
  border-radius: 4px;
  cursor: pointer;
  border: none;
  margin: 0 8px;
}

/* 修正ボタン */
.wpcf7cp-back {
  background: #ccc;
  color: #333;
}



/* 固定ページ（採用ページなど）を全幅に広げる */
.page .site-body-container.container {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
}

/* セクション本体も広げる */
.page .main-section.main-section--col-two {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
}


/* 完了画面レイアウト調整 */
.mw-thanks-container {
  max-width: 900px;
  margin: 60px auto 120px;
  padding: 0 20px;
}

.thanks-wrapper {
  text-align: center;
}

.thanks-title {
  font-size: 2rem;
  margin-bottom: 30px;
}

.thanks-text {
  font-size: 1rem;
  line-height: 1.9;
  margin-bottom: 20px;
}

.thanks-button-area {
  margin-top: 40px;
}

.thanks-button {
  display: inline-block;
  background: #c00;
  color: #fff;
  padding: 12px 32px;
  border-radius: 4px;
  text-decoration: none;
  font-size: 1rem;
}

.thanks-button:hover {
  opacity: 0.8;
}

/* 採用お問い合わせフォームの幅を狭めて中央に配置 */
.recruit-form-area {
  max-width: 900px; /* 好みで 700〜900px くらいに調整 */
  margin: 0 auto;
  padding: 40px 20px;
}

/* 各フォームパーツの調整（Lightning と相性よく） */
.recruit-form-area .contact-row,
.recruit-form-area .mw_wp_form input,
.recruit-form-area .mw_wp_form textarea,
.recruit-form-area .mw_wp_form select {
  max-width: 100%;
}



/* フッター前の余白を削除 */
.site-body,
.site-body-base-on,
.main-section,
.main-section__base-on,
.site-body-container {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

/* Lightning のレスポンシブ下部 padding を強制的に0に */
@media (min-width: 1200px) {
  .site-body {
    padding-bottom: 0 !important;
  }
}
@media (min-width: 992px) {
  .site-body {
    padding-bottom: 0 !important;
  }
}
@media (min-width: 768px) {
  .site-body {
    padding-bottom: 0 !important;
  }
}
@media (max-width: 767.98px) {
  .site-body {
    padding-bottom: 0 !important;
  }
}

/* VK Blocks Outer が下の余白を持っている場合 */
.vk_outer,
.vk_outer .vk_outer_container {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* ---------------------------------------------------------
   グローバルナビ：フォント・サイズ調整
--------------------------------------------------------- */
.global-nav li a {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN",
               "ヒラギノ角ゴ Std", "Hiragino Kaku Gothic Std",
               "メイリオ", Meiryo, sans-serif !important;
  font-size: 28px !important; /* 少し大きめ */
  padding: 18px 22px !important; /* クリックしやすい */
  color: #333 !important;
}

/* ---------------------------------------------------------
   hover：背景赤 × 文字白 の反転
--------------------------------------------------------- */
.global-nav li a:hover {
  background-color: #d7000f !important; /* 赤背景 */
  color: #ffffff !important; /* 白文字 */
}

/* ---------------------------------------------------------
   アクティブ（現在ページ）も赤反転
--------------------------------------------------------- */
.global-nav li.current-menu-item > a,
.global-nav li.current_page_item > a {
  background-color: #d7000f !important;
  color: #fff !important;
}