@charset "utf-8";
/*--------
jcom 各種TOP コンテンツ追加等用CSS
26/2～利用開始（作成：関東制作）
*/

/*storybook関連ファイル読み込みにより、コンテンツがメイリオ⇒noto sansになってしまうため、再度メイリオ指定*/
html {
  font-size: 14px;
}
body {
  font-family: 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}

.pickup-contents-button {
  background: #f2f2f2;
  padding: min((16vw / 3.75), 16px);
  .ui-static-grid-list {
    justify-content: center;
  }
  .ui-static-grid-space-narrow {
    gap: min((16vw / 3.75), 24px);
  }
  .ui-static-link-list-button {
    max-width: none;
    width: min((304vw / 3.75), 304px);
    color: #2c2a29;
    background-color: #fff;
    border-color: #888;
    .ui-static-link-list-button-inner {
      font-weight: bold;
      gap: min((8vw/ 3.75), 8px);
      &::before {
        content: '';
        height: min((24vw / 3.75), 32px);
        aspect-ratio: 32 / 32;
        background: no-repeat center center / contain;
      }
      .is-media & {
        &::before {
          background-image: url(/cmn/kanto/images/icon_news.svg);
        }
      }
      .is-setsumeikai & {
        &::before {
          background-image: url(/cmn/kanto/images/icon_setsumeikai.svg);
        }
      }
      .is-event & {
        &::before {
          background-image: url(/cmn/kanto/images/icon_event.svg);
        }
      }
    }
  }
}

/*★ ＝＝ hover ＝＝ ★*/
@media (hover: hover) and (pointer: fine) {
  .ui-static-link-list-button {
    &:hover {
      color: #2c2a29;
      background-color: #e2e2e2;
      border-color: #888;
    }
  }
}
