﻿@charset "UTF-8";

/* =========================
  Books page CSS
  /denki/books/index.html
========================= */

.neaBk-main{
  background:#fff;
}

.neaBk-section{
  padding:18px 0 44px;
}

/* 既出の「gridでテーブルが崩れる」対策（保険） */
.main-layout > *{
  min-width:0;
}

/* ---------- Quick menu ---------- */
.neaBk-quick{
  padding:18px 0 10px;
  background:#fff;
}

.neaBk-quick__grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:12px;
}

.neaBk-quickCard{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:14px 16px;
  border-radius:14px;
  border:1px solid var(--nea-border);
  background:#fff;
  font-weight:900;
  color:var(--nea-text);
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .05s ease;
  min-width:0;
  text-align:center;
}

/*
.neaBk-quickCard__icon{
  width:34px;
  height:34px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background: rgba(39,89,180,.08);
  border:1px solid rgba(39,89,180,.20);
  flex:0 0 auto;
}*/

.neaBk-quickCard__icon i{
  color: var(--nea-primary);
  font-size:16px;
}

.neaBk-quickCard:hover{
  background: rgba(39,89,180,.04);
  border-color: rgba(39,89,180,.35);
  box-shadow: 0 10px 24px rgba(39,89,180,.12);
  transform: translateY(-1px);
}

@media (max-width: 900px){
  .neaBk-quick__grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px){
  .neaBk-quick__grid{ grid-template-columns: 1fr; }
}

/* ---------- Flow box (FAX/割引など) ---------- */
.neaBk-flow{
  margin-top:12px;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(39,89,180,.18);
  background: rgba(39,89,180,.03);
}

.neaBk-flow__badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-radius:999px;
  border:1px solid rgba(39,89,180,.22);
  background:#fff;
  font-weight:900;
  font-size:12px;
  color: var(--nea-primary-700);
}

.neaBk-flow__badge i{
  color: var(--nea-primary);
}

.neaBk-flow__text{
  margin-top:10px;
}

/* ---------- PCB products ---------- */
.neaBk-productGrid{
  margin-top:12px;
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:12px;
}

.neaBk-product{
  border:1px solid var(--nea-border);
  border-radius:14px;
  background:#fff;
  overflow:hidden;
  box-shadow: 0 10px 24px rgba(15,23,42,.06);
  display:grid;
  grid-template-columns: 180px 1fr;
  min-width:0;
}

.neaBk-product__media{
  padding:14px;
  background: rgba(39,89,180,.02);
  border-right:1px solid var(--nea-border);
  display:flex;
  align-items:center;
  justify-content:center;
}

.neaBk-product__ph{
  width:100%;
  min-height:130px;
  border-radius:14px;
  border:1px dashed rgba(39,89,180,.35);
  background: rgba(39,89,180,.03);
  display:grid;
  place-items:center;
}

.neaBk-product__phInner{
  text-align:center;
  padding:12px;
}

.neaBk-product__phTitle{
  font-weight:900;
  color: var(--nea-primary-700);
  margin-bottom:6px;
}

.neaBk-product__phNote{
  font-size:12px;
  font-weight:800;
  color: var(--nea-muted);
}

.neaBk-product__body{
  padding:14px 14px;
  min-width:0;
}

.neaBk-product__title{
  font-weight:900;
  font-size:14px;
  margin-bottom:10px;
  color: var(--nea-text);
}

/* key-value */
.neaBk-kv{
  margin:0;
}
.neaBk-kv__row{
  display:grid;
  grid-template-columns: 70px 1fr;
  gap:10px;
  padding:8px 0;
  border-bottom:1px dashed rgba(15,23,42,.10);
}
.neaBk-kv__row:last-child{ border-bottom:none; }
.neaBk-kv dt{
  font-size:12px;
  font-weight:900;
  color: var(--nea-muted);
}
.neaBk-kv dd{
  margin:0;
  font-size:13px;
  font-weight:800;
  color: var(--nea-text);
  line-height:1.7;
  overflow-wrap:anywhere;
}

@media (max-width: 960px){
  .neaBk-productGrid{ grid-template-columns: 1fr; }
  .neaBk-product{ grid-template-columns: 1fr; }
  .neaBk-product__media{ border-right:none; border-bottom:1px solid var(--nea-border); }
}

/* ---------- Video split (sell / rental) ---------- */
.neaBk-split{
  margin-top:12px;
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:12px;
}

.neaBk-split__card{
  border:1px solid var(--nea-border);
  border-radius:14px;
  background:#fff;
  padding:14px 14px;
  box-shadow: 0 10px 24px rgba(15,23,42,.06);
  min-width:0;
}

.neaBk-split__title{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  font-weight:900;
  margin-bottom:10px;
}

.neaBk-split__title i{
  color: var(--nea-primary);
}

.neaBk-split__badge{
  margin-left:auto;
  font-size:12px;
  font-weight:900;
  color: var(--nea-primary-700);
  background: rgba(39,89,180,.06);
  border:1px solid rgba(39,89,180,.18);
  padding:6px 10px;
  border-radius:999px;
}

.neaBk-muted{
  color: var(--nea-muted);
}

@media (max-width: 900px){
  .neaBk-split{ grid-template-columns: 1fr; }
}

/* ---------- Sample videos ---------- */
.neaBk-samples{
  margin-top:14px;
  padding-top:6px;
}

.neaBk-samples__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:10px;
}

.neaBk-samples__title{
  font-weight:900;
  display:flex;
  align-items:center;
  gap:10px;
  color: var(--nea-text);
}

.neaBk-samples__title i{
  color: var(--nea-primary);
}

.neaBk-samples__grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:10px;
  margin-bottom:10px;
}

.neaBk-sampleCard{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid var(--nea-border);
  background:#fff;
  font-weight:900;
  line-height:1.5;
  min-width:0;
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .05s ease;
}

.neaBk-sampleCard__icon{
  width:30px;
  height:30px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background: rgba(39,89,180,.08);
  border:1px solid rgba(39,89,180,.20);
  flex:0 0 auto;
}

.neaBk-sampleCard__icon i{
  color: var(--nea-primary);
}

.neaBk-sampleCard__text{
  overflow-wrap:anywhere;
  font-size: 0.8em;
}

.neaBk-sampleCard:hover{
  background: rgba(39,89,180,.04);
  border-color: rgba(39,89,180,.35);
  box-shadow: 0 10px 24px rgba(39,89,180,.12);
  transform: translateY(-1px);
}

@media (max-width: 960px){
  .neaBk-samples__grid{ grid-template-columns: 1fr; }
}

/* アンカー移動時、sticky header 分だけ余白を確保 */
:where(#books, #ebooks, #pcb, #video){
  scroll-margin-top: 90px; /* ヘッダー+少し余裕。必要に応じて調整 */
}