/* =========================================================
   メディア掲載のボタン（inc/media-feature.php、2026-11-08）
   ① 各ページ：研修ページの黒いリンクカード（.trk-linkcard）と同じ形
   ② トップ：ヒーロー右下の最新お知らせの左の小さなボタン／狭い画面ではお知らせの帯の中
   ========================================================= */
.vmf-wrap{max-width:1240px;margin:clamp(28px,4vw,48px) auto 0;padding-inline:clamp(18px,4vw,48px);position:relative;z-index:1}
.vmf-card{display:grid;grid-template-columns:1fr auto;gap:4px 20px;align-items:center;margin-top:clamp(16px,2vw,24px);background:#111;color:#fff;padding:24px clamp(22px,3vw,36px);text-decoration:none;transition:background .25s}
.vmf-card:hover{background:#1d3f91;color:#fff}
.vmf-card:focus-visible{outline:3px solid #1d3f91;outline-offset:3px}
.vmf-card-label{font-size:12px;font-weight:600;opacity:.75}
.vmf-card-title{grid-column:1;font-family:"Noto Serif JP","Yu Mincho","YuMincho",serif;font-size:clamp(16px,1.7vw,20px);font-weight:700;line-height:1.6}
.vmf-card-btn{grid-column:2;grid-row:1 / span 2;width:46px;height:46px;border-radius:50%;background:#1d3f91;color:#fff;display:grid;place-items:center;font-weight:700}
.vmf-card:hover .vmf-card-btn{background:#fff;color:#1d3f91}
.vmf-wrap .vmf-card{margin-top:0}

/* ② トップのヒーロー右下（最新お知らせのボタンの代わり。題名＋ひとことの説明） */
/* 広い画面だけ。狭い画面（1100px以下）では動画の右下には出さない（lp.css と同じ。2026-11-08 スマホで重なっていたのを直した） */
@media(min-width:1101px){
  .is-intro .hero-news-box.has-media{display:flex;justify-content:flex-end;width:min(560px,42vw)}
}
@media(max-width:1100px){
  .is-intro .hero-news-box{display:none!important}
}
.hero-media{
  flex:1 1 auto;min-width:0;box-sizing:border-box;
  display:flex;align-items:center;gap:12px;
  padding:12px 20px 12px 16px;border-radius:18px;
  background:rgba(6,18,34,.70);border:1px solid rgba(255,255,255,.5);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  box-shadow:0 6px 20px rgba(4,13,26,.28);
  color:#fff;text-decoration:none;text-align:left;
  transition:background .25s ease,transform .25s ease
}
.hero-media:hover{background:rgba(6,18,34,.86);transform:translateY(-2px);color:#fff}
.hero-media-label{flex:none;align-self:flex-start;margin-top:2px;font-size:10px;font-weight:800;letter-spacing:.14em;line-height:1;padding:4px 7px 3px;border-radius:4px;background:#1d3f91;color:#fff}
.hero-media-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.hero-media-title{font-size:13.5px;font-weight:700;line-height:1.45}
.hero-media-desc{font-size:12px;line-height:1.6;opacity:.85;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hero-media-arrow{flex:none;font-size:15px}

/* 狭い画面（ヒーロー右下が出ない幅）では、動画の下のお知らせの帯に出す */
.news-strip-media{display:none}
@media(max-width:600px){
  .news-strip-media .hero-media-desc{display:none}
}
@media(max-width:1100px){
  .news-strip-in{flex-wrap:wrap}
  .news-strip-media.hero-media{display:flex;flex-basis:100%;order:-1;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(255,255,255,.08);padding:10px 14px}
}