/* ============ セキュリティと信頼 ============
   トップページには 3 カラムの要点カード + 要約区画。
   ナビから入ると全画面の詳細ページ（本文 + FAQ）が開く。
   配色は公式サイトの濃色背景 + ゴールドを踏襲。
   ==================================================== */

/* ---------- トップページ：3 カラムの要点（2 製品に共通する保護の仕組み） ---------- */
const SEC_CARDS = [
  {
    n: '01',
    t: 'クラウド運用で、安定して拡張できる',
    d: 'スマート BIM プラットフォームと IPCS スマート現場管理は Google Cloud 上で運用しており、案件数、モデルの規模、利用人数に応じて柔軟に拡張できます。高性能なサーバーを自社で構築しなくても、ブラウザとモバイル端末から利用できます。',
    points: ['Google Cloud での運用', 'マルチデバイスでの利用に対応', '複数案件への拡張に適する', '自社サーバーの運用負担を軽減']
  },
  {
    n: '02',
    t: 'きめ細かな権限設定で、データを安全に管理する',
    d: 'BIM モデル、図面、書類、および現場作業員の情報、検査記録、安全衛生記録は、いずれも管理されたクラウド領域に保存されます。管理者は案件、役割、アカウント、社外の関係者ごとに閲覧できる範囲を設定でき、協業のしやすさとデータの安全性を両立します。',
    points: ['HTTPS による暗号化通信', 'モデルや図面は権限を付与された利用者のみに公開', '協力会社は許可された範囲のみ閲覧', 'Viewer は閲覧のみで管理操作は不可']
  },
  {
    n: '03',
    t: 'バージョンと記録を、後から追跡できる',
    d: 'モデルはバージョンとタイムスタンプで管理し、新旧のデータが混ざることを防ぎます。現場側の入力、検査、承認には操作の記録が残り、経緯をたどる、内容を確認する、責任の所在を明らかにする際の根拠になります。',
    points: ['モデルのバージョンが明確', '現場での入力履歴が残る', '権限の変更を確認できる', 'バックアップと異常監視']
  }
];

/* 要約区画に並べる主な保護の仕組み */
const SEC_MECHS = [
  'Google Cloud での運用',
  'HTTPS による暗号化通信',
  'モデルと図面へのアクセス制御',
  '現場作業員情報の権限管理',
  '案件・役割・アカウント単位の権限管理',
  'Viewer は閲覧のみの権限',
  'モデルのバージョンとタイムスタンプ管理',
  '操作記録・バックアップ・異常監視'
];

/* ---------- 全画面ページ：本文 ---------- */
const SEC_SECTIONS = [
  {
    group: '2 製品に共通するプラットフォームの保護機構',
    id: 'cloud', n: '01',
    t: 'Google Cloud 上で運用し、安定して拡張できるサービスを提供',
    body: [
      'スマート BIM プラットフォームと IPCS スマート現場管理はクラウド構成で構築しており、案件の規模、モデル数、現場数、利用人数に応じて柔軟に拡張できます。',
      '高性能なサーバーを自社で構築する必要はなく、ストレージ、バックアップ環境、ネットワーク環境を自社で維持する必要もありません。ブラウザまたはモバイル端末からご利用いただけます。'
    ],
    listLabel: '想定される利用シーン',
    list: ['建築管理 BIM', '施工進捗 BIM', '3D GIS による設備位置管理', '外部 Viewer での閲覧・共有', '現場作業員と入退場記録の管理', '工事検査・安全衛生パトロール・日報の入力']
  },
  {
    id: 'tls', n: '02',
    t: '全ページで暗号化通信を行い、通信時のリスクを下げる',
    body: [
      'プラットフォームは HTTPS / TLS による暗号化通信を採用しています。ログイン、モデルの閲覧、図面の読み込み、書類の確認、現場での入力、データのやり取りは、いずれも暗号化された接続で行われます。',
      'これにより、通信の途中でデータが傍受、改ざん、漏えいするリスクを下げられます。社内、現場、社外のネットワークのいずれからでも、保護された経路でシステムを利用できます。'
    ]
  },
  {
    id: 'roles', n: '03',
    t: '役割ごとの権限管理により、閲覧できる範囲を制御する',
    body: ['プラットフォームは役割と権限の設定に対応しており、管理者、一般利用者、現場所長、工事監理者、協力会社、外部 Viewer、発注者といった役割ごとに、公開する機能とデータの範囲を変えられます。'],
    roles: [
      ['管理者', '案件、モデル、アカウント、権限、各種設定を管理できます'],
      ['編集・操作アカウント', 'モデルの閲覧、マークアップ、検索、データ操作を行えます'],
      ['現場側の利用者', '職務に応じて入力、検査、パトロール、追跡の機能を利用できます'],
      ['閲覧専用アカウント（Viewer）', '閲覧のみが可能で、編集・管理操作は行えません'],
      ['社外の協力会社', '許可された案件、または指定されたデータのみ閲覧できます']
    ],
    foot: '同じ利用者でも案件ごとに異なる役割を持てるため、複数案件・複数現場をまたぐ管理にも対応します。'
  },
  {
    id: 'audit', n: '04',
    t: 'バックアップ・監視・操作記録で、その後の運用管理を支える',
    body: ['クラウドのバックアップ、異常監視、操作記録を組み合わせることで、追跡でき、維持しやすい利用環境をつくれます。'],
    listLabel: '管理できる記録の例',
    list: ['モデルのアップロード・更新・削除', '書類のアップロード・改訂・削除', '利用者のログインと権限の変更', '現場での入力と承認の記録', '重要なデータ操作の記録', 'サービスの稼働状況・通信量・異常イベント'],
    foot: 'データをさかのぼる、内容を確認する、復元するといった必要が生じたとき、監査や復旧に必要な履歴を確認できます。'
  },

  {
    group: 'スマート BIM プラットフォーム',
    id: 'storage', n: '05',
    t: 'モデルと図面は公開せず、権限に応じて閲覧を許可',
    body: [
      'BIM モデル、3D Tiles、GLB、図面、PDF、写真、設備関連の書類は、いずれも管理されたクラウドストレージに保存されます。',
      '誰でもダウンロードできる形にはせず、アカウント、役割、案件ごとの権限、共有設定によって、利用者が閲覧できる内容を制御します。'
    ],
    listLabel: '管理者が実情に応じて設定できる項目',
    list: ['誰がプロジェクトにアクセスできるか', 'どの役割がプラットフォームを操作できるか', 'どの社外の方が閲覧のみか', 'どのデータを閲覧・ダウンロードできるか', 'どのモデルと機能を共有できるか'],
    foot: 'つまり、モデルを社外の Viewer に共有しながら、データは管理者の管理下に置いたままにできます。'
  },
  {
    id: 'version', n: '06',
    t: 'バージョン管理とキャッシュで、表示速度とデータの正確さを両立',
    body: [
      'スマート BIM プラットフォームは、モデル、タイル、属性データ、静的ファイルについて、キャッシュとバージョンのタイムスタンプ管理を組み合わせられます。',
      '同じバージョンのモデルはすばやく読み込め、重複した読み込みを減らせます。モデルを更新すると新しいバージョンに切り替わるため、利用者が古いデータや誤ったバージョンを見ることを防げます。'
    ],
    listLabel: 'この仕組みによる 3 つの効果',
    list: ['モデルの表示と閲覧が速くなる', '重複した読み込みによる通信量の無駄を減らせる', 'モデル更新後もバージョンを明確に追跡できる']
  },

  {
    group: 'IPCS スマート現場管理',
    id: 'people', n: '07',
    t: '現場作業員の情報は権限に応じて閲覧し、外部には公開しない',
    body: [
      'IPCS が管理する現場作業員の基本情報、所属する協力会社、職種、資格・免許、本人写真、出退勤記録は、いずれも管理されたクラウド領域に保存し、案件と役割の権限に応じて閲覧を許可します。',
      '入退場ゲートの顔認証は、顔認証システム提供会社の機器とシステムで実行されます。IPCS は同社が提供する API を通じて連携し、入退場した人物の情報を取得します。' +
      'つまり、顔の特徴量の照合と保存は顔認証システム側に残り、IPCS が取得・保存するのは入退場の記録です。'
    ],
    listLabel: '管理者が設定できる範囲',
    list: ['誰がその現場のプロジェクトにアクセスできるか', 'どの役割が作業員情報と資格情報を閲覧できるか', 'どの役割が出退勤と出面の記録を閲覧できるか', 'どのデータを書き出し・印刷できるか'],
    foot: '作業員情報は現場管理に欠かせない情報のため、プラットフォームは権限管理によって提供し、誰でも検索できる形や公開リンクの形では扱いません。'
  },
  {
    id: 'site-record', n: '08',
    t: '現場の入力と検査の記録に履歴が残り、責任の所在を明らかにできる',
    body: [
      '工事検査、安全衛生の点検、作業項目の追跡、会議での決定事項、工事日報は、いずれも入力者、入力日時、その後の対応状況がシステムに残ります。',
      '紙やチャットアプリと比べ、データが同じプラットフォームにまとまって保存されるため、ある検査、ある指摘事項、ある決定事項の経緯をあとからたどる際に、明確な根拠があります。'
    ],
    listLabel: '追跡できる内容',
    list: ['検査表の作成、結果、写真の保存', '安全衛生パトロールの指摘と是正の追跡', '作業項目の割り当て、対応状況の更新、期限超過の状態', '会議の決定事項をタスク化した後の対応状況', '日々入力する人員と機材の記録']
  },
  {
    id: 'vendor', n: '09',
    t: '協力会社と関係各社で権限を分け、許可された範囲だけを見せる',
    body: [
      '建設現場では通常、本社、現場所長、工事監理者、施工会社、複数の協力会社が関与しており、それぞれ必要とするデータの範囲は異なります。',
      'IPCS は案件、利用者グループ、機能権限に応じて、各社がアクセスできるプロジェクト、使えるモジュール、閲覧できるデータの内容を制御できます。'
    ],
    listLabel: 'よくある権限の分け方',
    list: ['協力会社は自社が担当する作業項目と検査記録のみ閲覧', '工事監理者は検査と安全衛生を閲覧できるが作業員情報は変更不可', '現場所長は単一現場の情報を一通り把握', '本社は現場をまたいで集計情報を閲覧'],
    foot: 'モバイル端末からの入力も同じ権限の規定に従います。現場の担当者がスマートフォンやタブレットで見られる機能とデータは、そのアカウントに許可された範囲と一致します。'
  }
];

const SEC_FAQ = [
  ['BIM モデルをクラウドに置いても安全ですか？',
   'スマート BIM プラットフォームは Google Cloud 上で運用し、暗号化通信、権限管理、バージョン管理、管理されたストレージを組み合わせています。モデルを誰でも見られる形でインターネット上に置くのではなく、ログインアカウント、案件ごとの権限、共有設定によって閲覧できる範囲を制御します。'],
  ['外部の Viewer が無料で閲覧できると、情報漏えいにつながりませんか？',
   'Viewer は閲覧のみの役割で、管理者が閲覧できる案件とデータの範囲を制御できます。外部 Viewer に共有することは、すべてのデータを公開することを意味しません。管理、編集、元ファイルのダウンロードも行えません。案件の必要に応じて閲覧権限を設定でき、共有のしやすさと管理のしやすさを両立します。'],
  ['モデル、図面、書類が自由にダウンロードされることはありませんか？',
   'モデルや図面を誰でもダウンロードできる設定にすることは推奨していません。BIM モデル、3D Tiles、GLB、図面、PDF、写真、設備関連の書類は管理されたクラウド領域に保存し、認証と権限設定にもとづいてアクセスを許可することで、ファイルが外部に流出するリスクを下げます。'],
  ['協力会社ごとに、自社のデータだけを見せられますか？',
   'できます。案件、役割、アカウントのグループごとに異なる権限を設定できます。たとえば協力会社には許可されたフロア、レイヤー、書類、作業内容のみを閲覧させ、管理者は案件全体の情報と権限設定を把握する、といった運用が可能です。'],
  ['モデルを更新した後、利用者が古いバージョンを見てしまうことはありませんか？',
   'バージョンのタイムスタンプ、またはバージョン番号で管理できます。同じバージョンのモデルはすばやく読み込め、モデルを更新するとシステムが新しいバージョンに切り替えるため、新旧のデータが混ざることを防ぎ、改訂の経緯も追跡しやすくなります。'],
  ['キャッシュによってデータの正確さが損なわれませんか？',
   'キャッシュは主にモデルファイル、タイル、属性データ、静的ファイルに使われ、読み込みを速くし、重複した読み込みを減らします。バージョン管理と組み合わせ、モデル更新時に新しいバージョンへ切り替えれば、速度と正確さを両立できます。'],
  ['案件数が多い場合、システムは拡張できますか？',
   'できます。クラウド構成のため、案件数、モデルのサイズ、利用人数、通信量に応じて拡張できます。小規模な案件から複数案件を扱う企業の管理まで、プランとご要望に応じてアカウント、ポイント、ストレージ容量、通信量などを調整できます。'],
  ['施工進捗 BIM と通常の建築管理 BIM で、データの安全性は同じですか？',
   '同じです。施工進捗 BIM も権限管理、クラウドストレージ、暗号化通信、バージョン管理によって保護されます。違いは、施工進捗 BIM が作業項目、状態、進捗データ、モデル部材との対応をより多く含む点にあり、そのぶん役割ごとの権限とバージョン管理がいっそう重要になります。'],
  ['システムは操作の記録を残しますか？',
   '重要な操作について記録を残せます。たとえばモデルのアップロード、モデルの更新、書類の改訂、アカウント権限の変更、重要な管理操作などです。後からの追跡、確認、責任の明確化に役立ちます。'],
  ['サーバーの運用は自社で行う必要がありますか？',
   '必要ありません。スマート BIM プラットフォームはクラウドサービスとして提供され、ブラウザからご利用いただけます。高性能なサーバーを自社で調達・保守する必要はありません。プランと案件のご要望に応じて、規模の異なるクラウドリソースを用意できます。'],
  ['現場作業員の写真、資格情報、出退勤記録はどのように保護されますか？',
   'これらのデータは管理されたクラウド領域に保存し、案件と役割の権限に応じて閲覧を許可します。誰でも検索できる形や公開リンクの形では扱いません。どの役割が作業員情報と資格情報を閲覧できるか、どの役割が出退勤と出面の記録を閲覧できるか、どのデータを書き出せるかを管理者が設定できます。'],
  ['入退場の顔認証データはどこに保存されますか。IPCS は保存しますか？',
   '保存しません。顔認証は顔認証システム提供会社の機器とシステムで実行され、顔の特徴量の照合と保存は同社側に残ります。IPCS は同社が提供する API を通じて入退場した人物の情報を取得し、保存するのは入退場の記録です。閲覧は案件と役割の権限に応じて許可されます。'],
  ['現場システム上で、協力会社どうしが互いのデータを見ることはありますか？',
   '管理者が許可しない限り、見ることはありません。IPCS は案件、利用者グループ、機能権限に応じて、各社がアクセスできるプロジェクト、使えるモジュール、閲覧できるデータの範囲を制御します。たとえば協力会社は、自社が担当する作業項目と検査記録のみを閲覧します。'],
  ['検査、安全衛生、日報の記録が後から書き換えられることはありませんか？',
   'システムは入力者、入力日時、その後の対応状況を保持し、データの変更についても記録が残ります。紙やチャットアプリと比べ、ある検査、ある指摘事項、ある決定事項の経緯をあとからたどる際に、明確な根拠があります。'],
  ['現場でスマートフォンやタブレットから入力しても安全ですか？',
   'モバイル端末とパソコンは同じアカウントと権限の規定を使い、通信も同じく HTTPS による暗号化を経由します。利用者が見られる機能とデータの範囲は、そのアカウントに許可された範囲と一致します。人事異動があった場合、管理者はアカウントをすぐに停止したり、権限を変更したりできます。']
];

/* ---------- トップページ用の区画 ---------- */
function SecuritySection({ onMore }) {
  const ref = useReveal(0.15);
  return (
    <section className="lx-section lx-sec" id="security" ref={ref}>
      <div className="lx-container">
        <div className="lx-section-head is-center">
          <span className="lx-section-eyebrow-line">TRUST · セキュリティと信頼</span>
          <h2 className="lx-section-title">データは共有できる。権限はお客様の手に。</h2>
          <p className="lx-section-sub">スマート BIM プラットフォームと IPCS スマート現場管理は共通のクラウドセキュリティ基盤を採用し、運用・通信・権限・記録保存まで一貫して保護します</p>
        </div>

        <div className="lx-sec-cards">
          {SEC_CARDS.map((c) =>
            <div key={c.n} className="lx-sec-card">
              <span className="lx-sec-card-n">{c.n}</span>
              <h3>{c.t}</h3>
              <p>{c.d}</p>
              <ul>
                {c.points.map((p) => <li key={p}>{p}</li>)}
              </ul>
            </div>
          )}
        </div>

        <div className="lx-sec-brief">
          <div className="lx-sec-brief-body">
            <h3>なぜ安心してお使いいただけるのか</h3>
            <p>
              2 つの製品はいずれも Google Cloud 上で運用し、暗号化通信、管理されたストレージ、役割ごとの権限、
              バージョン管理、バックアップと監視によって、安全に使えるクラウド環境をつくります。
              BIM モデル、図面、PDF、設備関連の書類は、誰でもダウンロードできる形にはしません。
              IPCS の現場作業員情報、検査記録、安全衛生記録も同じく案件、役割、アカウントの権限に応じて閲覧を許可し、
              協力会社や社外の関係者は許可された範囲だけを見ることになります。
            </p>
            <button className="lx-trial-btn" onClick={onMore}>詳しい説明とよくあるご質問 →</button>
          </div>
          <div className="lx-sec-mechs">
            <span className="lx-sec-mechs-label">主な保護の仕組み</span>
            <ul>
              {SEC_MECHS.map((m) => <li key={m}>{m}</li>)}
            </ul>
          </div>
        </div>
      </div>
    </section>
  );
}

/* ---------- 全画面：詳細説明 + FAQ ---------- */
function SecurityPage({ open, onClose, onTrial }) {
  const { useEffect: uE, useRef: uR, useState: uS } = React;
  const scrollRef = uR(null);
  const [openFaq, setOpenFaq] = uS(0);

  uE(() => {
    if (!open) return;
    document.body.style.overflow = 'hidden';
    document.body.classList.add('is-pd-open');
    if (scrollRef.current) scrollRef.current.scrollTop = 0;
    const h = (e) => { if (e.key === 'Escape') onClose(); };
    window.addEventListener('keydown', h);
    return () => {
      document.body.style.overflow = '';
      document.body.classList.remove('is-pd-open');
      window.removeEventListener('keydown', h);
    };
  }, [open, onClose]);

  return (
    <div className={`lx-cmp lx-secpage ${open ? 'is-open' : ''}`} ref={scrollRef}>
      <div className="lx-pd-head">
        <button className="lx-pd-close" onClick={onClose}>
          <span>← CLOSE</span>
          <span style={{ color:'var(--lx-ink-4)', fontWeight:400, letterSpacing:'1px' }}>ESC</span>
        </button>
        <div className="lx-pd-crumb">TRUST &nbsp;/&nbsp; <span>セキュリティと信頼</span></div>
      </div>

      <header className="lx-cmp-hero">
        <span className="lx-eyebrow">スマート BIM プラットフォーム ／ IPCS スマート現場管理</span>
        <h1>クラウド運用と情報セキュリティ</h1>
        <p className="lx-cmp-line">クラウド運用 ｜ 暗号化通信 ｜ 権限管理 ｜ バージョン管理 ｜ バックアップと監視</p>
        <p>
          2 つの製品はいずれも Google Cloud 上で運用しています。データの保存、通信の暗号化、役割ごとの権限、
          バージョン管理、バックアップと監視まで、プラットフォームは階層的な保護の仕組みを採用しています。
          モデルや図面、現場作業員の情報についても、それぞれの性質に応じた管理方法を用意しています。
        </p>
      </header>

      <div className="lx-secpage-body">
        {SEC_SECTIONS.map((s) =>
          <React.Fragment key={s.id}>
          {s.group && <h2 className="lx-secpage-group">{s.group}</h2>}
          <section id={s.id} className="lx-secpage-sec">
            <span className="lx-secpage-n">{s.n}</span>
            <div className="lx-secpage-sec-body">
              <h2>{s.t}</h2>
              {s.body.map((p, i) => <p key={i}>{p}</p>)}

              {s.list &&
                <div className="lx-secpage-list">
                  <span className="lx-secpage-list-label">{s.listLabel}</span>
                  <ul>{s.list.map((x) => <li key={x}>{x}</li>)}</ul>
                </div>
              }

              {s.roles &&
                <dl className="lx-secpage-roles">
                  {s.roles.map(([k, v]) =>
                    <div key={k}><dt>{k}</dt><dd>{v}</dd></div>
                  )}
                </dl>
              }

              {s.foot && <p className="lx-secpage-foot">{s.foot}</p>}
            </div>
          </section>
          </React.Fragment>
        )}

        <div className="lx-secpage-quote">
          <b>データ共有と権限管理を、両立するために。</b>
          <p>
            スマート BIM プラットフォームは BIM モデルを単にインターネット上に置くものではなく、
            IPCS も現場の帳票をそのままオンラインに移すだけのものではありません。
            管理でき、確認でき、共有でき、維持できるクラウド環境をつくるための仕組みです。
            Google Cloud での運用、暗号化通信、権限管理、図面と人員情報の保護、バージョン管理、バックアップと監視まで、
            企業や建設プロジェクトの実際の運用を踏まえて設計し、クラウド活用を安全に進められるよう支援します。
          </p>
        </div>

        <h2 className="lx-cmp-h2" id="sec-faq"><span>FAQ</span>よくあるご質問</h2>
        <div className="lx-secpage-faq">
          {SEC_FAQ.map(([q, a], i) =>
            <div key={i} className={`lx-faq-item ${openFaq === i ? 'is-open' : ''}`}>
              <button className="lx-faq-q" onClick={() => setOpenFaq(openFaq === i ? -1 : i)} aria-expanded={openFaq === i}>
                <em>Q{i + 1}</em>
                <span>{q}</span>
                <i aria-hidden="true">{openFaq === i ? '−' : '+'}</i>
              </button>
              <div className="lx-faq-a"><p>{a}</p></div>
            </div>
          )}
        </div>
      </div>

      <div className="lx-cmp-cta">
        <button className="lx-trial-btn is-primary" onClick={onTrial}>30 日間トライアルについて →</button>
        <a className="lx-trial-btn" href="#contact" onClick={(e) => { e.preventDefault(); if (window.lxGoto) window.lxGoto('contact'); else onClose(); }}>担当者に問い合わせる</a>
      </div>
    </div>
  );
}

window.SecuritySection = SecuritySection;
window.SecurityPage = SecurityPage;