/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 23 2025 | 05:22:22 */
/* ===========================================================
   ヘッダー固定（Ziri/FSE用）
   =========================================================== */
.sticky-header {
  position: sticky;
  top: 0; /* 管理バー考慮が必要なら下の行に変更 */
  /* top: var(--wp-admin--admin-bar--height, 0px); */
  z-index: 9999;
  background: #fff;      /* 透過だと下のコンテンツが透けるので色を付ける */
  width: 100%;
  box-shadow: 0 2px 8px rgba(0,0,0,.06); /* 任意：固定時に影 */
}

/* 親のoverflow対策（sticky無効化を防ぐ） */
.wp-site-blocks { overflow: visible; }

/* 固定ヘッダーが重ならないよう、次要素に余白をつけたい場合（任意） */
.has-sticky-spacer {
  padding-top: 72px; /* ヘッダーの高さに合わせて調整 */
}

.sticky-header .wp-block-navigation__container {
  flex-wrap: nowrap;          /* メニュー項目も折り返さない */
}
.sticky-header .wp-block-navigation__container > .wp-block-navigation-item {
  white-space: nowrap;        /* 各項目を1ワード扱いに */
}

/* 共通スタイル（言語リンクの基本デザイン） */
.lang-switch a {
  text-decoration: none !important;
  padding: 4px 10px;
/*   border: 1px solid #ccc;
  border-radius: 999px; */
  margin-left: 8px;
  font-size: 14px;
	color: #505556;
}

.lang-switch a:hover {
/*   background: #111; */
	color: #0693e3;
  text-decoration: none;
}

/* PC用：デフォルトで表示 */
.pc-only { display: inline-flex !important; align-items: center; }

/* SP用：デフォルトで非表示 */
.sp-only { display: none !important; }

/* スマホ幅になったら逆転 */
@media (max-width: 782px) {
  .pc-only { display: none !important; }
  .sp-only { display: inline-flex !important; }
}

/* ハンバーガーメニュー未展開のときは sp-only を隠す */
.wp-block-navigation__responsive-container:not(.is-menu-open) .sp-only {
  display: none !important;
}
.sticky-header .wp-block-site-title{
	white-space: nowrap;        /* 改行しない */
  word-break: keep-all;
  display: inline-block;
  margin: 0;
  flex: 0 0 auto;             /* 伸縮させない */
}

/* 英語サイト名 リンクをカスタム */
h1.custom-title a,
h1.wp-block-heading.custom-title a {
  font-size: var(--wp--preset--font-size--x-large, 2rem) !important;
  color: #212728 !important;     /* 任意カラー */
  text-decoration: none !important;
  font-weight: 600 !important;
  font-style: normal !important;
  line-height: 1.2 !important;
  white-space: nowrap;        /* 改行しない */
  word-break: keep-all;
  display: inline-block;
  margin: 0;
  flex: 0 0 auto;             /* 伸縮させない */
}

/* ホバー・フォーカス・アクティブ時 */
h1.custom-title a:hover,
h1.custom-title a:focus,
h1.custom-title a:active {
  color: #212728 !important;
  text-decoration: none !important;
}

/* Contactボタンを横書きで改行させない */
.wp-block-button__link[href*="/contact"] {
  white-space: nowrap;        /* 改行を禁止 */
  display: inline-block;      /* インラインで固定 */
  text-align: center;
  line-height: 1.4;
}


/* ===========================================================
   共通ベース：Flexレイアウト（PC横並び→改行→スマホ縦並び）
   =========================================================== */
.flex-tiles {
  display: flex;
  flex-wrap: wrap;            /* 横幅不足時は改行 */
  justify-content: center;    /* 横中央揃え */
  align-items: stretch;
  gap: 10px;                  /* カード間余白 */
}

/* スマホ（768px以下）共通設定：縦並び */
@media (max-width: 768px) {
  .flex-tiles {
    flex-direction: column;
    align-items: stretch;   /* center → stretch に変更 */
    gap: 16px;
  }
  .flex-tiles > .tile {
    flex: 1 1 100%;
    width: 100%;
    max-width: none;
	height:auto;
    min-width: 0;
    box-sizing: border-box;
  }
  /* Step コンテナは子要素を横幅いっぱいに伸ばす */
  .steps-list,.industry-list {
    align-items: stretch; /* ← center だと幅が狭くなることがある */
    width: 100%;
  }

  /* タイル自体を全幅にする（PC の max-width を打ち消す） */
  .steps-list > .tile,.industry-list > .tile {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0;
    box-sizing: border-box;
  }
}

/* ===========================================================
   Industry 用設定（5枚構成を想定・横幅や余白を広めに）
   =========================================================== */
.industry-list > .tile {
  flex: 0 0 220px;             /* PC時：ややコンパクトな幅 */
  min-width: 220px;
  max-width: 260px;
  text-align: center;
  padding: 28px 10px;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.06);
  transition: transform .25s ease, box-shadow .25s ease;
}
.industry-list > .tile:hover {
  transform: translateY(-4px);
	background: #fff;
}

/* ===========================================================
   Step 用設定（4枚構成・説明文を多く取るため広めに）
   =========================================================== */

.steps-list > .tile {
  flex: 0 0 250px;             /* PC時：少し広めに確保 */
  min-width: 200px;
  max-width: 340px;
  text-align: center;
  padding: 32px 10px;
}


/* ===========================================================
   footer設定
   =========================================================== */
:where(.wp-site-blocks) > footer {
  margin-block-start: 0 !important;
}

/* フッターのリスト全体 */
.site-footer ul {
  list-style: none;       /* ・を消す */
  margin: 0;
  padding: 0;
}

/* リスト項目のリンク */
.site-footer ul li a {
  color: inherit;         /* 親の文字色を継承（青にならない） */
  text-decoration: none;  /* 下線を消す */
  display: block;
  margin-bottom: 8px;     /* 項目間の余白 */
  transition: color .2s;
}

/* ホバー時の色だけ少し濃く */
.site-footer ul li a:hover {
  color: #000;
}

/* button */
.btn-hov-outline .wp-element-button {
    border-color:#fff !important;
	color: var(--wp--preset--color--white) !important;
}
 .btn-hov-outline .wp-element-button:hover{
	background-color: #fff !important;
    color: var(--wp--preset--color--primary) !important;
	border:1px solid #fff !important;
}

/* ===========================================================
   Contact Form7 フォーム調整
   =========================================================== */
/* フォーム全体：中央寄せ＆横幅制御 */
.wpcf7 form {
  max-width: 680px;
  margin: 0 auto;
  padding: 0 16px;
  font-size: 16px;
}

/* ラベルをブロック化して縦並びに */
.wpcf7 form label {
  display: block;
  margin: 0 0 16px;
  color: #111;
}

/* テキスト系・セレクト・テキストエリアを統一 */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 select,
.wpcf7 textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 12px 14px;
  border: 1px solid #cfd3d7;
  border-radius: 6px;
  background: #fff;
  color: #111;
  outline: none;
  transition: border-color .2s, box-shadow .2s;
  appearance: none; /* iOSの余計な装飾を抑制 */
}

.wpcf7 textarea { min-height: 160px; resize: vertical; }

/* フォーカス時 */
.wpcf7 input:focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus {
  border-color: #2b7cff;
  box-shadow: 0 0 0 3px rgba(43,124,255,.12);
}

/* placeholderの色薄め */
.wpcf7 ::placeholder { color: #9aa3ab; }

/* 送信ボタン */
.wpcf7 input[type="submit"] {
  width: 100%;
  max-width: 220px;
  padding: 12px 16px;
  border: none;
  border-radius: 999px;
  background: #2b7cff;
  color: #fff;
  font-weight: 700;
  cursor: pointer;
  transition: opacity .2s, transform .02s ease-in;
}
.wpcf7 input[type="submit"]:hover { opacity: .9; }
.wpcf7 input[type="submit"]:active { transform: translateY(1px); }
.submit-wrap { text-align: center; margin-top: 8px; }

/* 同意チェック */
.wpcf7 .policy {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 8px 0 20px;
}
.wpcf7 .policy input[type="checkbox"] { width: 18px; height: 18px; }

/* 非活性状態の送信ボタン */
.wpcf7 input[type="submit"]:disabled {
  background: #cfd3d7;  /* グレーに */
  color: #888;
  cursor: not-allowed;
  opacity: 0.7;
  transform: none; /* 押した時の動きを無効化 */
  box-shadow: none;
}

/* バリデーション・完了メッセージ */
.wpcf7 form.invalid .wpcf7-response-output { border-color:#ff3b30; }
.wpcf7 form.sent .wpcf7-response-output { border-color:#28a745; }

/* リンク全体 */
.cta-link{
  display:inline-flex; align-items:center; gap:.6rem;
  color:#1e66ff; text-decoration:none; font-weight:600;
  letter-spacing:.02em;
  transition:opacity .2s, transform .05s ease;
}
.cta-link .icon{ width:22px; height:22px; flex:0 0 22px; color:currentColor; }
.cta-link:hover{ opacity:.9; }
.cta-link:active{ transform:translateY(1px); }

/* キーボードフォーカス */
.cta-link:focus-visible{
  outline: 2px solid #1e66ff; outline-offset:3px; border-radius:6px;
}


/* ===========================================================
   仕様用のアイコン
   =========================================================== */
/* 共通設定 */

.circle-icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

/* 個別の背景色設定 */
.icon1 { background-color: #2D8CFF; } /* GENAI統合 */
.icon2 { background-color: #27AE60; } /* RAMAN EYE技術 */
.icon3 { background-color: #F5B700; } /* リアルタイム分析 */
.icon4 { background-color: #00A5A5; } /* マルチスペクトル対応 */
.icon5 { background-color: #E83E8C; } /* 産業グレード設計 */
.icon6 { background-color: #6C757D; } /* クラウド連携 */
