/* ============================================================================
   Sieger 日本サイト v15 — lp-logos.css（trust の 2 面：ロゴ・社名カードのマーキー）
   ・CSS だけで動く（JS 無効でも流れる）。lp-logos.js はタブ非表示と長押しの一時停止だけ。
   ・トラックに同じリストを 2 本並べ、translateX(0→-50%) を線形で無限ループ。
     継ぎ目を合わせるため、リスト間の隙間は track の gap ではなく各リストの padding-right で取る。
   ・section（.trust／.trust-nv.scene）には transform／filter／will-change を付けない。
   ・prefers-reduced-motion: reduce では静止し、折り返しの格子（v14 と同じ見え方）になる。
   ========================================================================= */

/* ------------------------------------------------ 1. 共通：器・トラック・一時停止 */
:is(body.lp,body.home) .lg-marq{position:relative;width:100%;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
:is(body.lp,body.home) .lg-track{display:flex;width:max-content;animation:lg-scroll 46s linear infinite}
:is(body.lp,body.home) .lg-list{display:flex;flex:none;gap:16px;margin:0;padding:0 16px 0 0;list-style:none}
:is(body.lp,body.home) .lg-list li{flex:none;margin:0}
@keyframes lg-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* 一時停止：hover／キーボード焦点／長押し（.is-paused は JS）／タブ非表示（html.lg-hidden は JS） */
:is(body.lp,body.home) .lg-marq:hover .lg-track,body.lp .lg-marq:focus-within .lg-track,:is(body.lp,body.home) .lg-marq.is-paused .lg-track,
:is(body.lp,body.home) .lg-marq.is-stopped .lg-track,
html.lg-hidden :is(body.lp,body.home) .lg-track{animation-play-state:paused}

/* ------------------------------------------------ 2. 白面：取引先 13 社（旧 .grid13 と同寸・同配色 172×68） */
:is(body.lp,body.home) .lg-clients{margin-top:22px;padding-block:6px}
:is(body.lp,body.home) .lg-clients .lg-list li{width:172px;height:68px;display:grid;place-items:center;background:var(--sky);
  border:1px solid var(--line-2);border-radius:var(--r-s);font-size:var(--fs-sm);font-weight:700;
  color:var(--navy);white-space:nowrap;letter-spacing:.01em}

/* ------------------------------------------------ 3. 濃紺面：技術パートナー 11 社（白カード 140×64・逆方向 40 秒）
   背景色に依存しない（scenes 段で写真の固定背景になる）。白カードが透明の上に乗る前提。 */
:is(body.lp,body.home) .lg-tech{margin-top:40px}
:is(body.lp,body.home) .lg-label{margin:0 0 14px;font-size:13px;font-weight:700;letter-spacing:.2em;text-indent:.2em;
  color:var(--blue-t);line-height:1.5;text-align:center}   /* v25：面が明るくなったので白から紺青へ */
:is(body.lp,body.home) .lg-tech .lg-marq{padding-block:8px}
:is(body.lp,body.home) .lg-tech .lg-track{animation-duration:40s;animation-direction:reverse}
:is(body.lp,body.home) .lg-tech .lg-list li{width:140px;height:64px;display:grid;place-items:center;background:var(--w);
  border-radius:var(--r-s);box-shadow:var(--sh)}
/* ロゴは無改変。原本が小さい（高さ 27〜41px）ので高さ 28px 以内に留め、拡大しない */
:is(body.lp,body.home) .lg-tech img{display:block;width:auto;height:auto;max-width:112px;max-height:28px}
/* Vidu だけ原本が 86×86 の正方形（白余白込み）。字の高さを他社に揃えるため 52px 以内（縮小のみ） */
:is(body.lp,body.home) .lg-tech .lg-vidu img{max-height:52px}

/* ------------------------------------------------ 4. SP（≤680）：カード 150×56／ロゴカード 120×56。旧 SP 横スクロール格子を置き換え */
@media (max-width:680px){
  :is(body.lp,body.home) .lg-marq{-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);
                           mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
  :is(body.lp,body.home) .lg-list{gap:8px;padding-right:8px}
  :is(body.lp,body.home) .lg-track{animation-duration:40s}
  :is(body.lp,body.home) .lg-clients{margin-top:16px;padding-block:4px}
  :is(body.lp,body.home) .lg-clients .lg-list li{width:150px;height:56px;font-size:var(--fs-cap)}
  :is(body.lp,body.home) .lg-tech{margin-top:30px}
  :is(body.lp,body.home) .lg-label{margin-bottom:10px}
  :is(body.lp,body.home) .lg-tech .lg-track{animation-duration:35s}
  :is(body.lp,body.home) .lg-tech .lg-list li{width:120px;height:56px}
  :is(body.lp,body.home) .lg-tech img{max-width:96px;max-height:26px}
  :is(body.lp,body.home) .lg-tech .lg-vidu img{max-height:46px}
}

/* ------------------------------------------------ 5. prefers-reduced-motion: reduce — 静止して折り返しの格子（v14 と同じ見え方） */
@media (prefers-reduced-motion:reduce){
  :is(body.lp,body.home) .lg-marq{-webkit-mask-image:none;mask-image:none}
  :is(body.lp,body.home) .lg-track{display:block;width:auto;animation:none !important}
  :is(body.lp,body.home) .lg-list{flex-wrap:wrap;justify-content:center;padding:0 var(--pad);margin:0 auto;
    max-width:calc(1320px + var(--pad) * 2)}
  :is(body.lp,body.home) .lg-list[aria-hidden="true"]{display:none}
  :is(body.lp,body.home) .lg-tech .lg-list{max-width:calc(1092px + var(--pad) * 2)}   /* 7 枚＋4 枚の 2 段 */
}


/* ---------------------------------------------------------------- v17b：主要顧客ロゴの寸法正規化
   各ロゴのインク領域（透明部分を除いた実描画）を計測し、面積を揃えたうえで密度（濃さ）で補正した。
   img はキャンバス全体を描画し、透明余白ぶんを負のマージンで相殺してインク領域だけをレイアウトに出す。
   ファイルは無改変。数値は qa/v17/ink.json から生成（再計算はこの節を作り直す）。 */
:is(body.lp,body.home) .lg-clients .lg-list li{width:168px;height:76px;background:var(--w);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;align-items:center;justify-content:center}
:is(body.lp,body.home) .lg-clients img{display:block;height:auto;max-width:none;max-height:none;object-fit:unset}
:is(body.lp,body.home) .lg-clients .lg-c-mihoyo img{width:92.0px;margin:-0.0px -0.0px -0.0px -0.0px}
:is(body.lp,body.home) .lg-clients .lg-c-funplus img{width:116.4px;margin:-0.0px -0.0px -0.1px -0.0px}
:is(body.lp,body.home) .lg-clients .lg-c-7road img{width:88.7px;margin:-0.0px -0.0px -0.0px -0.1px}
:is(body.lp,body.home) .lg-clients .lg-c-papergames img{width:78.3px;margin:-9.7px -9.7px -8.2px -9.7px}
:is(body.lp,body.home) .lg-clients .lg-c-gryphline img{width:152.1px;margin:-9.5px -14.8px -9.4px -12.9px}
:is(body.lp,body.home) .lg-clients .lg-c-airudder img{width:129.0px;margin:-1.2px -1.5px -1.4px -1.5px}
:is(body.lp,body.home) .lg-clients .lg-c-boke-games img{width:95.6px;margin:-0.0px -0.0px -0.0px -0.0px}
:is(body.lp,body.home) .lg-clients .lg-c-poppo-live img{width:119.3px;margin:-0.0px -0.0px -0.0px -0.0px}
:is(body.lp,body.home) .lg-clients .lg-c-rokid img{width:90.8px;margin:-0.1px -0.0px -0.1px -0.8px}
:is(body.lp,body.home) .lg-clients .lg-c-wuxi-biologics img{width:103.5px;margin:-0.0px -0.0px -0.1px -0.0px}
:is(body.lp,body.home) .lg-more{margin-top:14px;margin-bottom:48px;text-align:center;color:var(--ink-2)}
/* モノクロ統一にする場合はこの1行を有効化（各社の商標規定でモノクロ版の使用可否が異なるため既定は色つき） */
/* :is(body.lp,body.home) .lg-clients img{filter:grayscale(1) opacity(.72)} */
@media (max-width:680px){
  :is(body.lp,body.home) .lg-clients .lg-list li{width:140px;height:64px;border-radius:10px}
  :is(body.lp,body.home) .lg-more{margin-bottom:32px}
  :is(body.lp,body.home) .lg-clients .lg-c-mihoyo img{width:74.1px;margin:-0.0px -0.0px -0.0px -0.0px}
  :is(body.lp,body.home) .lg-clients .lg-c-funplus img{width:93.7px;margin:-0.0px -0.0px -0.1px -0.0px}
  :is(body.lp,body.home) .lg-clients .lg-c-7road img{width:71.4px;margin:-0.0px -0.0px -0.0px -0.1px}
  :is(body.lp,body.home) .lg-clients .lg-c-papergames img{width:60.9px;margin:-7.6px -7.5px -6.4px -7.6px}
  :is(body.lp,body.home) .lg-clients .lg-c-gryphline img{width:122.3px;margin:-7.7px -11.9px -7.5px -10.4px}
  :is(body.lp,body.home) .lg-clients .lg-c-airudder img{width:102.4px;margin:-0.9px -1.2px -1.1px -1.2px}
  :is(body.lp,body.home) .lg-clients .lg-c-boke-games img{width:77.0px;margin:-0.0px -0.0px -0.0px -0.0px}
  :is(body.lp,body.home) .lg-clients .lg-c-poppo-live img{width:96.0px;margin:-0.0px -0.0px -0.0px -0.0px}
  :is(body.lp,body.home) .lg-clients .lg-c-rokid img{width:73.1px;margin:-0.1px -0.0px -0.1px -0.6px}
  :is(body.lp,body.home) .lg-clients .lg-c-wuxi-biologics img{width:83.3px;margin:-0.0px -0.0px -0.1px -0.0px}
}