@charset "utf-8";

/* ==========================================================================
   PR1MEPICK — デザイン原本互換レイヤー
   PR1ME AI CAMPS ページはデザインキャンバスのマークアップをそのまま実装している
   ため、原本が持っていた data 属性ベースのレスポンシブ指定をここに移植する。
   （原本 AICampus.dc.html の <style> と同等）
   ========================================================================== */

@media (max-width:1279px){
  [data-cardgrid]{grid-template-columns:repeat(3,1fr)!important}
}

@media (max-width:1023px){
  [data-cardgrid]{grid-template-columns:repeat(2,1fr)!important}
  [data-cardgrid5]{grid-template-columns:repeat(2,1fr)!important}
  [data-grid-2col]{grid-template-columns:1fr!important}
  [data-split]{grid-template-columns:1fr!important}
  [data-herogrid]{grid-template-columns:1fr!important;gap:48px!important}
  [data-herogrid] > div:last-child{max-width:320px!important;justify-self:start!important}
  [data-valuegrid="4"]{grid-template-columns:repeat(2,1fr)!important;gap:48px 0!important}
  [data-valuegrid] span[aria-hidden]{display:none}
}

@media (max-width:900px){
  [data-viz]{grid-template-columns:1fr!important;justify-items:center;gap:20px!important}
}

@media (max-width:639px){
  [data-cardgrid]{grid-template-columns:1fr!important}
  [data-valuegrid],
  [data-valuegrid="4"]{grid-template-columns:1fr!important;gap:48px 0!important}
  [data-spec]{grid-template-columns:1fr!important;gap:8px!important}
}

/* 原本はテーブルを div グリッドで組んでいるため、狭い幅では横スクロールさせる */
@media (max-width:1023px){
  [data-table-scroll]{overflow-x:auto}
}