/* iij_v1.css — IIJ 情シスラーニング 登壇ブロック 2026/09/10
   みずほブロック（mizuho_v1.css）と対になる見た目。
   違いはサムネイルが16:9なので左カラムを広く取っている点だけ。 */
.ij-media{padding:86px 5%;background:linear-gradient(180deg,#eef2f7,#ffffff);}
.ij-inner{max-width:1080px;margin:0 auto;}
.ij-head{text-align:center;margin-bottom:46px;}
.ij-en{display:block;font-family:'Lato',sans-serif;font-size:13px;font-weight:900;letter-spacing:.34em;color:#0d2eff;margin-bottom:12px;}
.ij-title{font-size:clamp(26px,3.4vw,38px);font-weight:800;color:#0a0e27;margin:0;line-height:1.45;}
.ij-title .ac{color:#ee3833;}
.ij-kicker{font-size:14px;color:#6b7488;line-height:1.9;margin:14px 0 0;}

/* 2列。登壇が2件並ぶことで「呼ばれ続けている人」に見せる */
.ij-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:stretch;}
.ij-card2{display:flex;flex-direction:column;background:#fff;border:1px solid #e9edf4;
  border-radius:18px;overflow:hidden;box-shadow:0 18px 44px rgba(10,14,39,.09);}
.ij-shot{position:relative;display:block;line-height:0;background:#0a0e27;}
.ij-shot img{width:100%;display:block;aspect-ratio:16/9;object-fit:cover;}
/* 常時見える再生マーク。どちらも動画へ向かうことを一目で分かるようにする */
.ij-shot .ij-mark{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:56px;height:56px;border-radius:50%;background:rgba(10,14,39,.55);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:18px;padding-left:4px;
  box-shadow:0 6px 18px rgba(0,0,0,.3);transition:.3s;pointer-events:none;}
.ij-shot:hover .ij-mark{background:rgba(238,56,51,.9);transform:translate(-50%,-50%) scale(1.08);}

.ij-body2{display:flex;flex-direction:column;flex:1;padding:22px 24px 26px;}
.ij-badge{display:inline-block;align-self:flex-start;font-size:11.5px;font-weight:800;color:#fff;
  background:#c1272d;border-radius:99px;padding:5px 14px;margin-bottom:14px;}
.ij-badge.dx{background:#0a2e7a;}
.ij-body2 h3{font-size:18px;font-weight:800;color:#0a0e27;line-height:1.55;margin:0 0 12px;}
.ij-body2 p{font-size:14px;line-height:1.95;color:#46506a;margin:0 0 20px;flex:1;}
.ij-body2 p strong{color:#0a0e27;font-weight:800;}
/* 外部リンク用の共通スタイルに文字色を奪われるので !important で固定する */
.ij-btn2{display:inline-block;align-self:flex-start;font-size:14px;font-weight:800;
  color:#0a0e27 !important;-webkit-text-fill-color:#0a0e27 !important;
  background:#fff;border:1.5px solid #d6dced;border-radius:9px;padding:11px 20px;text-decoration:none;
  transition:.25s;}
.ij-btn2:hover{border-color:#0a0e27;transform:translateY(-2px);}
.ij-btn2.on{color:#fff !important;-webkit-text-fill-color:#fff !important;border-color:transparent;
  background:linear-gradient(135deg,#ee3833,#ff6b3d);box-shadow:0 8px 20px rgba(238,56,51,.30);}
.ij-btn2.on:hover{border-color:transparent;}

/* 共通：書籍の要約版 */
.ij-foot{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-top:30px;
  background:#fff;border:1px solid #e9edf4;border-radius:16px;padding:24px 28px;
  box-shadow:0 12px 30px rgba(10,14,39,.07);}
.ij-foot p{font-size:14px;line-height:1.95;color:#46506a;margin:0;}
.ij-foot p strong{color:#0a0e27;font-weight:800;}
.ij-btn{display:inline-block;flex:none;font-size:15px;font-weight:800;color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  background:linear-gradient(135deg,#ee3833,#ff6b3d);border-radius:10px;padding:14px 28px;text-decoration:none;
  box-shadow:0 10px 24px rgba(238,56,51,.32);transition:transform .25s;}
.ij-btn:hover,.ij-btn:visited,.ij-btn:focus{color:#fff !important;-webkit-text-fill-color:#fff !important;}
.ij-btn:hover{transform:translateY(-2px);}

@media(max-width:900px){
  .ij-grid{grid-template-columns:1fr;gap:22px;}
  .ij-foot{flex-direction:column;align-items:flex-start;gap:18px;padding:22px;}
  .ij-btn{width:100%;text-align:center;}
}