/************************************
** Body
************************************/
body {
  font-family: "Noto Sans JP", sans-serif !important;
}

/************************************
** ヘッダー
************************************/
.header-container {
  height: 80px !important;
  margin-bottom: 0 !important;
}
.navi-in > ul li {
  height: 40px;
  line-height: 40px;
  margin: 5px 0;
}
.header-container-in a img.header__logo {
  height: 40px;
  max-height: 40px !important;
  width: auto;
}
.logo-menu-button a img.header__logo--mobile {
  height: 46px;
  max-height: 46px !important;
  width: auto;
}
#menu-header_menu_media_pc .header__contact a {
  background-color: var(--color-LinkusPrimary-030);
  color: var(--color-grayscale-100);
}
#menu-header_menu_media_pc .header__contact a .item-label {
  color: var(--color-grayscale-100);
  font-weight: bold;
}

@media screen and (max-width: 1255px) {
  .header-container-in {
    width: calc(100% - 48px);
  }
}

/* ヘッダー右側ナビゲーション */
.mediaHeader__nav {
  align-items: center;
  display: flex;
  gap: 24px;
}
.mediaHeader__nav .search-box {
  align-items: center;
  border-radius: var(--border-radius-S);
  margin: 0;
  width: 230px;
}
.mediaHeader__nav .search-edit {
  font-size: 14px;
  line-height: 1.2;
}
.mediaHeader__nav .search-submit {
  font-size: 16px;
  top: 50% !important;
  transform: translateY(-50%);
}
.header-container-in.hlt-top-menu .navi {
  height: 48px;
  width: auto;
}
.header-in {
  align-items: flex-end;
  flex-direction: row;
  gap: 16px;
}
.logo__catch {
  color: var(--color-grayscale-005);
  font-size: var(--font-size-caption);
}

@media screen and (max-width: 1023px) {
  .mobile-header-menu-buttons {
    height: 90px;
  }
  .mobile-menu-buttons .logo-menu-button.menu-button {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    justify-content: center !important;
  }
  .logo__catch {
    font-weight: normal;
    line-height: 2;
  }
}

@media screen and (max-width: 320px) {
  .logo-menu-button a img.header__logo--mobile {
    height: 36px;
    max-height: 36px !important;
    width: auto;
  }
  .logo__catch {
    font-size: 10px;
  }
}

/************************************
** メディア用ナビゲーション
************************************/
.media__nav {
  display: block;
  margin: 0 auto 8px;
  max-width: 1256px;
  padding: 0;
  width: 100%;
}
.media__nav .media__navList {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}
.media__nav .media__navList li {
  border-right: 1px solid var(--color-grayscale-060);
  margin: 0;
  padding: 0;
}
.media__nav .media__navList li:first-child {
  border-left: 1px solid var(--color-grayscale-060);
}
.media__nav .media__navList li a {
  color: var(--color-LinkusSecondary-020);
  display: block;
  font-size: var(--font-size-content-S);
  font-weight: bold;
  line-height: 2;
  padding: 0 16px;
  position: relative;
  text-decoration: none;
  transition: color .3s ease;
}
.media__nav .media__navList li a::after {
  background-color: var(--color-LinkusSecondary-070);
  bottom: 0;
  content: '';
  height: 2px;
  left: 0;
  position: absolute;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .3s ease;
  width: 100%;
}
.media__nav .media__navList li a:hover {
  color: var(--color-LinkusSecondary-050);
}
.media__nav .media__navList li a:hover::after {
  transform: scaleX(1);
}

@media screen and (max-width: 1255px) {
  .media__nav {
    width: calc(100% - 48px);
  }
}

@media screen and (max-width: 840px) {
  .media__nav {
    margin-bottom: 0!important;
  }
}

@media screen and (max-width: 640px) {
  .main .media__nav,
  .content .main .media__nav {
    display: none !important;
  }
}

/************************************
** メディア用ナビ（SP）ハンバーガー内カテゴリー（PCではアイコン非表示）
************************************/
/* 三角矢印アイコンはドロワー内（モバイル）のみ表示 */
.menu-drawer .menu-item-type-taxonomy a {
  align-items: center;
  display: flex;
}
.menu-drawer .menu-item-type-taxonomy a::before {
  background-image: url(../img/media/icon-right.svg);
  background-repeat: no-repeat;
  background-size: contain;
  content: '';
  display: inline-block;
  flex-shrink: 0;
  height: 12px;
  margin-right: 8px;
  width: 12px;
}

/* ドロワー内：カテゴリー見出し・キーワード検索・お問い合わせはこちら */
.menu-drawerExtra {
  padding: 16px 32px 0 32px;
}
.menu-drawerExtra__section {
  margin-bottom: 24px;
}
.menu-drawerExtra__section:last-child {
  margin-bottom: 0;
}
.menu-drawerExtra__heading {
  border-bottom: 1px solid var(--color-grayscale-005);
  color: var(--color-grayscale-005);
  font-size: var(--font-size-content-M);
  font-weight: bold;
  margin: 0 0 16px;
  padding: 0 0 8px;
}
.menu-drawerExtra .menu-drawer {
  margin: 0;
  padding: 0 !important;
}
.menu-drawerExtra .menu-drawer .menu-item {
  margin-bottom: 8px;
}
.menu-drawerExtra .menu-drawer .menu-item:last-child {
  margin-bottom: 0;
}

/* ドロワー内検索フォーム */
.menu-drawerExtra .search-box {
  align-items: stretch;
  border: 1px solid var(--color-grayscale-060);
  border-radius: var(--border-radius-M);
  display: flex;
  overflow: hidden;
}
.menu-drawerExtra .search-box .search-edit {
  border: 0;
  width: 100%;
}
.menu-drawerExtra .search-box .search-submit {
  align-items: center;
  display: flex;
  flex-shrink: 0;
  justify-content: center;
  line-height: 1;
  right: 8px;
  top: calc(50% - 10px);
}
.menu-drawerExtra .search-box .search-submit .fa {
  display: block;
  line-height: 1;
}

/* ドロワー内お問い合わせボタン */
.menu-drawerExtra__contactBtn {
  align-items: center;
  background-color: var(--color-LinkusPrimary-030);
  border-radius: var(--border-radius-M);
  box-shadow: 0 2px 4px rgba(var(--color-grayscale-000-rgb), .15);
  color: var(--color-grayscale-100);
  display: flex;
  font-weight: bold;
  gap: 8px;
  justify-content: center;
  padding: 16px 24px;
  text-decoration: none;
  transition: background-color .3s ease;
  width: 100%;
}
.menu-drawerExtra__contactBtn:hover {
  background-color: var(--color-LinkusPrimary-020);
  color: var(--color-grayscale-100);
}
.menu-drawerExtra__contactBtn .fas {
  flex-shrink: 0;
}

/************************************
** メディア用ボタンスタイル
************************************/
.media__button {
  font-size: var(--font-size-content-S);
  line-height: 1;
  text-align: center;
}
.media__button.--read {
  background: var(--color-LinkusSecondary-040);
  background-size: 200% 100%;
  background-position: 0 0;
  border-radius: var(--border-radius-S);
  color: var(--color-grayscale-100);
  font-weight: bold;
  margin: 0 16px;
  padding: 16px;
  transition: background-position .4s ease;
}
.media__button.--read:hover {
  background: linear-gradient(
    to right,
    var(--color-LinkusSecondary-040) 0%,
    var(--color-LinkusSecondary-060) 100%
  );
  background-position: 100% 0;
}
.media__button.--moreArticles {
  align-items: center;
  background-color: var(--color-grayscale-100);
  border: 2px solid var(--color-LinkusSecondary-040);
  border-radius: var(--border-radius-full);
  color: var(--color-LinkusSecondary-040);
  display: flex;
  font-weight: bold;
  gap: 8px;
  justify-content: center;
  margin: 32px auto 0;
  padding: 12px 24px;
  width: fit-content;
}
.media__button.--moreArticles::after {
  content: '';
  background-color: var(--color-LinkusSecondary-040);
  height: 12px;
  -webkit-mask-image: url(../img/media/icon-arrow-right.svg);
          mask-image: url(../img/media/icon-arrow-right.svg);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center;
          mask-position: center;
  width: 12px;
}
.media__button.--moreArticles:hover {
  background-color: var(--color-LinkusSecondary-040);
  color: var(--color-grayscale-100);
  transition: background-color .4s ease;
}
.media__button.--moreArticles:hover::after {
  background-color: var(--color-grayscale-100) !important;
}
.media__button.--cv {
  align-items: center;
  background-color: var(--color-LinkusPrimary-030);
  border: 2px solid transparent;
  border-radius: var(--border-radius-full);
  color: var(--color-grayscale-100);
  display: flex;
  font-weight: bold;
  gap: 8px;
  padding: 12px 24px;
  text-align: center;
  transition: background-position .4s ease;
  width: fit-content;
}
.media__button.--cv::after {
  background-color: var(--color-grayscale-100);
  background-repeat: no-repeat;
  background-size: contain;
  content: '';
  height: 20px;
  -webkit-mask-image: url(../img/media/icon-target-link.svg);
          mask-image: url(../img/media/icon-target-link.svg);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center;
          mask-position: center;
  width: 20px;
}
.media__button.--cv:hover {
  background-color: var(--color-LinkusPrimary-090);
  border: 2px solid var(--color-LinkusPrimary-030);
  color: var(--color-LinkusPrimary-030);
  transition: background-color .4s ease, border-color .4s ease, color .4s ease;
}
.media__button.--cv:hover::after {
  background-color: var(--color-LinkusPrimary-030) !important;
}

/************************************
** コンテンツベース
************************************/
html,
.content-top {
  margin: 0 !important;
}
.content {
  margin-top: 0 !important;
}
.content-in.wrap {
  width: 100%;
}

@media screen and (max-width: 1023px) {
  .content {
    margin-top: 120px !important;
  }
}

@media screen and (max-width: 834px) {
  .content {
    margin-top: 80px !important;
  }
  .search .content {
    margin-top: 120px !important;
  }
}

@media screen and (max-width: 640px) {
  .page-id-211 .content {
    margin-top: 32px !important;
  }
}

/************************************
** メディアトップページベース
************************************/
.page-id-211 .main {
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}
.page-id-211 .content__wrapper {
  margin: 0 auto;
  max-width: 1256px !important;
  width: 100% !important;
}

@media screen and (max-width: 1255px) {
  .page-id-211 .content__wrapper {
    width: calc(100% - 48px) !important;
  }
}

@media screen and (max-width: 1023px) {
  .page-id-211 .content__wrapper {
    max-width: 800px !important;
    min-width: 672px !important;
    width: 100% !important;
  }
}

@media screen and (max-width: 834px) {
  .contents {
    padding: 60px 0;
  }
  .page-id-211 .content__wrapper {
    min-width: 300px;
    width: 90%;
  }

  /* タブレット以下で左右の余白を取り除き、横スクロールをさせたい時に使用 */
  .page-id-211 .--scroll-x {
    width: 100% !important;
  }
}

@media screen and (max-width: 640px) {
  .page-id-211 .content,
  .page-id-211 .content-in.wrap,
  .page-id-211 .main {
    overflow-x: hidden;
  }
  .page-id-211 .content__wrapper {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .page-id-211 .content-in.wrap {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
}

/************************************
** メディア：サイドバー
************************************/
.mediaSidebar {
  padding: 0;
  width: 30%;
}
.mediaSidebar .mediaSidebar__heading {
  background-color: transparent;
  border: none;
  border-radius: 0;
  color: var(--color-LinkusSecondary-010);
  font-size: var(--font-size-content-M);
  font-weight: bold;
  margin: 0 0 16px;
  padding: 0;
}
.mediaSidebar__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mediaSidebar__item {
  margin: 0 0 16px;
}
.mediaSidebar__item:last-child {
  margin-bottom: 0;
}
.mediaSidebar__link {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  text-decoration: none;
}
.mediaSidebar__link:hover {
  opacity: .8;
  transition: opacity .4s ease;
}
.mediaSidebar__thumb {
  border-radius: var(--border-radius-M);
  flex-shrink: 0;
  height: 95px;
  overflow: hidden;
  width: 136px;
}
.mediaSidebar__thumb img {
  height: 100%;
  image-rendering: -webkit-optimize-contrast;
  object-fit: cover;
  transform: translateZ(0);
  width: 100%;
}
.mediaSidebar__thumbPlaceholder {
  background-color: var(--color-grayscale-080);
  display: block;
  height: 100%;
  width: 100%;
}
.mediaSidebar__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.mediaSidebar__category {
  background-color: var(--color-LinkusSecondary-090);
  color: var(--color-LinkusSecondary-030);
  font-size: var(--font-size-caption);
  font-weight: bold;
  line-height: 1;
  padding: 4px 8px;
  width: fit-content;
}
.mediaSidebar__title {
  color: var(--color-LinkusSecondary-030);
  font-size: var(--font-size-content-S);
  font-weight: bold;
  line-height: 1.4;
  margin: 0;
}

@media screen and (max-width: 1024px) {
  .mediaSidebar {
    display: block !important;
  }
}

@media screen and (max-width: 834px) {
  .mediaSidebar {
    display: none !important;
  }
}

/************************************
** メディア：サイドバー：カテゴリーから記事を探す
************************************/
.mediaSidebar__categorySearch {
  background-color: var(--color-LinkusSecondary-080);
  border-radius: var(--border-radius-M);
  margin-top: 32px;
  padding: 16px;
}
.categorySearch__Heading {
  background-color: transparent !important;
  border-bottom: 2px solid var(--color-LinkusSecondary-020);
  color: var(--color-LinkusSecondary-020);
  font-size: var(--font-size-content-M);
  font-weight: bold;
  margin: 0 0 16px !important;
  padding: 0 0 12px !important;
  position: relative;
}
.categorySearch__Heading::before {
  background-image: url(../img/media/icon-search.svg);
  background-repeat: no-repeat;
  background-size: contain;
  content: '';
  display: inline-block;
  height: 20px;
  margin-right: 8px;
  vertical-align: middle;
  width: 20px;
}
.categorySearch__nav,
.categorySearch__item {
  margin: 0;
  padding: 0;
}
.categorySearch__list {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.categorySearch__link {
  align-items: center;
  background-color: var(--color-grayscale-100);
  border-radius: var(--border-radius-full);
  color: var(--color-LinkusSecondary-040);
  display: flex;
  flex-shrink: 0;
  font-size: var(--font-size-caption);
  font-weight: bold;
  line-height: 1.2;
  min-height: 0;
  padding: 4px 8px;
  text-decoration: none;
  white-space: nowrap;
}
.categorySearch__link:hover {
  background-color: var(--color-LinkusSecondary-040);
  color: var(--color-grayscale-100);
}

/* hover 時は矢印アイコンを白に */
.categorySearch__link:hover::before {
  filter: brightness(0) invert(1);
}
.categorySearch__link::before {
  background-image: url(../img/media/icon-right.svg);
  background-repeat: no-repeat;
  background-size: contain;
  content: '';
  display: inline-block;
  flex-shrink: 0;
  height: 12px;
  margin-right: 4px;
  width: 12px;
}

/* メディアサイドバー：バナーエリア（ウィジェット） */
.mediaSidebar__bannerArea {
  margin-top: 24px;
}
.mediaSidebar__bannerArea a {
  display: block;
}
.mediaSidebar__bannerArea a:not(:last-child) {
  margin-bottom: 16px;
}
.mediaSidebar__bannerArea a:hover {
  opacity: .6;
}

/* その他 */
.sns-share-message {
  font-size: 16px;
  text-align: left;
  font-weight: 600;
}
.sns-share-buttons {
  justify-content: flex-start;
}
.sns-share.ss-col-6 a,
.sns-share-buttons a {
  width: auto !important;
  height: auto !important;
  padding: 5px 10px;
  margin-right: 10px;
}

/************************************
** メディアトップページ：　スライダー
************************************/
.mediaTop__slider .swiper {
  margin: 0 auto;
  padding: 0 24px;
  position: relative;
}
.swiper-wrapper {
  align-items: center;
}

/* 記事スライド（全ブレイクで 1200×630 比率を維持。幅は Swiper が指定するため aspect-ratio で高さを算出） */
.swiper-slide.article-slide {
  aspect-ratio: 1200 / 630;
  box-sizing: border-box;
  height: auto !important;
  min-height: 0;
}
.swiper-slide.article-slide a {
  display: block;
  height: 100%;
  position: relative;
  text-decoration: none;
  width: 100%;
}
.swiper-slide.article-slide .thumbnail {
  height: 100%;
  overflow: hidden;
  position: relative;
  width: 100%;
}
.swiper-slide.article-slide .thumbnail img {
  height: 100%;
  image-rendering: -webkit-optimize-contrast;
  object-fit: cover;
  transform: translateZ(0);
  width: 100%;
}

/* Pickupラベル */
.swiper-slide.article-slide .label__pickup {
  height: 25px;
  left: 24px;
  position: absolute;
  top: -16px;
  width: 68px;
  z-index: 2;
}

/* コンテンツオーバーレイ */
.swiper-slide.article-slide .content {
  background-color: rgba(var(--color-grayscale-000-rgb), .6);
  border-top: 1px solid var(--color-grayscale-100);
  bottom: 0;
  left: 0;
  padding: 24px 24px 16px;
  position: absolute;
  right: 0;
  z-index: 1;
}
.swiper-slide.article-slide .content .title {
  color: var(--color-grayscale-100);
  font-size: var(--font-size-18);
  font-weight: bold;
  line-height: 1.4;
  margin: 0;
}
.swiper-slide.article-slide .content .title.lineClamp.--2 {
  min-height: 2.8em;
}

/* サービスバナー（記事スライドと 1200×630 比率で揃える） */
.swiper-slide.banner-slide {
  aspect-ratio: 1200 / 630;
  box-sizing: border-box;
  height: auto !important;
  min-height: 0;
}
.swiper-slide.banner-slide a {
  display: block;
  height: 100%;
  width: 100%;
}
.swiper-slide.banner-slide img {
  height: 100%;
  image-rendering: -webkit-optimize-contrast;
  object-fit: cover;
  transform: translateZ(0);
  width: 100%;
}

/* ナビゲーションボタン */
.swiper-button-prev,
.swiper-button-next {
  border-radius: var(--border-radius-full);
  box-shadow: 0 4px 4px 0 rgba(var(--color-grayscale-000-rgb), .25);
  height: 24px !important;
  opacity: .8;
  width: 24px !important;
  z-index: 20;
}
.swiper-button-prev {
  content: url(../img/media/icon-carousel-prev.svg);
  left: 24px !important;
}
.swiper-button-next {
  content: url(../img/media/icon-carousel-next.svg);
  right: 24px !important;
}

/* Swiperデフォルトの::after（'next'/'prev'）を非表示にし、カスタムSVGのみ表示 */
.swiper-button-prev::after,
.swiper-button-next::after {
  content: '';
  font-size: 0;
}
.swiper-button-prev:hover,
.swiper-button-next:hover {
  opacity: .8;
}

/* レスポンシブ対応（スライドは常に aspect-ratio 1200/630 で統一） */
@media screen and (max-width: 1255px) {
  .swiper {
    width: 100%;
  }
  .swiper-button-prev {
    left: 24px;
  }
  .swiper-button-next {
    right: 24px;
  }
}
@media screen and (max-width: 834px) {
  .swiper {
    padding: 0 24px;
  }
}
@media screen and (max-width: 640px) {
  /* 直前スライドの1px見切れを防ぐ */
  .mediaTop__slider {
    overflow: hidden;
  }
  .mediaTop__slider .swiper {
    padding: 0;
  }
  .swiper-slide.article-slide .thumbnail,
  .swiper-slide.article-slide .content {
    margin-left: -2px;
  }

  /* スマホのみ：Pickupラベルをスライド内に収め、切れないようにする */
  .swiper-slide.article-slide .label__pickup {
    left: 16px;
    top: 8px;
  }
  .swiper-slide.article-slide .content {
    margin-top: 0 !important;
    padding: 48px 16px 16px;
  }
  .swiper-slide.article-slide .content .title {
    font-size: var(--font-size-16);
  }

  /* 矢印ボタン */
  .swiper-button-prev,
  .swiper-button-next {
    height: 24px !important;
    width: 24px !important;
  }
  .swiper-button-prev {
    left: 8px !important;
  }
  .swiper-button-next {
    right: 8px !important;
  }
}

/************************************
** メディアトップページ：　新着記事
************************************/
.newArticles {
  background-color: var(--color-LinkusSecondary-090);
  padding: 32px 0
}
.newArticles__heading {
  color: var(--color-LinkusSecondary-030);
  font-size: var(--font-size-heading-S);
  font-weight: bold;
  line-height: 1;
  margin-bottom: 24px;
}
.newArticles .articleCards__list .articleCard {
  box-sizing: border-box;
  width: 25%;
}

@media screen and (max-width: 834px) {
  .newArticles__heading {
    margin-left: 24px;
  }
}

/************************************
** メディア：　記事カード一覧
************************************/
.articleCards__list {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 24px;
}

@media screen and (max-width: 834px) {
  .articleCards__list {
    padding: 0 24px 8px;
    overflow-x: scroll !important;
  }
  .newArticles .articleCards__list .articleCard {
    flex-shrink: 0;
    min-width: 300px;
    width: 300px;
  }
}
/************************************
** メディア：　記事カード
************************************/
.articleCard {
  border-radius: var(--border-radius-M);
  box-shadow: 0 2px 4px 0 rgba(var(--color-grayscale-000-rgb), .1);
  display: flex;
  flex-direction: column;
}
.articleCard:hover {
  box-shadow: 0 4px 16px 0 rgba(var(--color-grayscale-000-rgb), .1);
  opacity: .7;
  transition: opacity .4s ease;
}
.articleCard.--top {
  background-color: var(--color-grayscale-100);
}
.articleCard__link {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}
.articleCard__footer {
  display: flex;
  flex-direction: column;
  margin-top: auto;
  padding: 0 16px 16px;
}
.articleCard__footer .articleCard__dateInfo {
  margin-bottom: 8px;
}
.articleCard__footer .media__button.--read {
  margin-left: 0;
  margin-right: 0;
}
/* サムネイルは 1200×630 比率。画像を absolute で収め、比率の違う画像が高さをはみ出さないようにする */
.articleCard__thumbnail {
  aspect-ratio: 1200 / 630;
  border-bottom: 1px solid var(--color-grayscale-070);
  border-radius: var(--border-radius-M) var(--border-radius-M) 0 0;
  flex-shrink: 0;
  height: auto;
  overflow: clip;
  position: relative;
  width: 100%;
}
.articleCard__thumbnail img {
  height: 100%;
  image-rendering: -webkit-optimize-contrast;
  object-fit: cover;
  position: absolute;
  inset: 0;
  transform: translateZ(0);
  width: 100%;
}
.articleCard__content {
  padding: 16px;
}
.articleCard__title {
  color: var(--color-LinkusSecondary-030);
  font-size: var(--font-size-content-M);
  font-weight: bold;
  line-height: 1.4;
  margin-bottom: 8px;
}
.newArticles .articleCard__title.lineClamp.--2 {
  min-height: 2.8em;
}
.articleCard__excerpt {
  color: var(--color-LinkusSecondary-005);
  font-size: var(--font-size-content-S);
  font-weight: normal;
  line-height: 1.4;
  margin-bottom: 16px;
}
.articleCard__categories {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.category__tag {
  background-color: var(--color-LinkusSecondary-060);
  border-radius: var(--border-radius-full);
  color: var(--color-grayscale-100);
  line-height: 1;
  font-size: var(--font-size-caption);
  font-weight: bold;
  padding: 6px 12px;
}
.articleCard__dateInfo {
  color: var(--color-LinkusSecondary-005);
  display: flex;
  flex-direction: row;
  gap: 8px;
  font-size: var(--font-size-caption);
  font-weight: normal;
  line-height: 1.4;
  justify-content: flex-end;
}

/* 日付左横のアイコン用スペース */
.articleCard__date {
  padding-left: 20px;
  position: relative;
}
.articleCard__date::before {
  background-size: contain;
  background-repeat: no-repeat;
  content: '';
  height: 12px;
  left: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 12px;
}
.articleCard__date.--publish::before {
  background-image: url(../img/media/icon-date-publish.svg);
}
.articleCard__date.--update::before {
  background-image: url(../img/media/icon-date-update.svg);
}

@media screen and (max-width: 834px) {
  .articleCard {
    flex-shrink: 0;
    min-width: 300px;
    width: 300px;
  }
  .articleCardList .articleCard {
    min-width: 0;
    width: 100%;
  }
}

/************************************
** メディア：カテゴリー一覧（articleCard --list）
************************************/
.articleCardList,
.search .articleCardList {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(2, 1fr);
}
.articleCardList .articleCard.--list {
  background-color: var(--color-LinkusSecondary-090);
}

/* 新着記事ページ（全ページ）4カラム */
.blog .articleCardList,
.articleCardList--newEntries {
  grid-template-columns: repeat(4, 1fr);
}

@media screen and (max-width: 834px) {
  .blog .articleCardList,
  .articleCardList--newEntries {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (max-width: 640px) {
  .articleCardList,
  .search .articleCardList {
    grid-template-columns: 1fr;
  }
  .articleCardList .articleCard.--list {
    min-width: 0;
    width: 100%;
  }
}

/************************************
** 検索0件時：おすすめ記事
************************************/
.recommendBox {
  background-color: var(--color-LinkusSecondary-090);
  border-radius: var(--border-radius-M, 8px);
  margin-top: 32px;
  padding: 32px 24px 40px;
}
.recommendBox__heading {
  color: var(--color-LinkusSecondary-020);
  font-size: var(--font-size-emphasize);
  font-weight: bold;
  margin: 0 0 24px;
}
.recommendBox__list {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(2, 1fr);
}
.recommendBox__list .articleCard {
  background-color: var(--color-grayscale-100) !important;
}

@media screen and (max-width: 640px) {
  .recommendBox {
    padding: 24px 16px 32px;
  }
  .recommendBox__list {
    grid-template-columns: 1fr !important;
  }
}

/************************************
** 各カテゴリー紹介
************************************/
.categoryBox {
  padding: 80px 0;
}
.categoryBox:not(.inhouse) {
  border-bottom: 1px solid var(--color-LinkusSecondary-060);
}
.categoryBox__intro {
  align-items: flex-start;
  display: flex;
  flex-direction: row;
  gap: 40px;
  justify-content: center;
  margin: 0 auto 40px;
  width: calc(100% - 96px);
}
.categoryBox__heading {
  color: var(--color-LinkusSecondary-010);
  flex-shrink: 0;
  font-size: var(--font-size-heading-S);
  font-weight: bold;
  line-height: 1;
  margin-bottom: 0;
  padding-top: 16px;
  position: relative;
}
.categoryBox__heading::before {
  background-color: var(--color-LinkusPrimary-040);
  content: '';
  height: 4px;
  left: 0;
  position: absolute;
  top: 0;
  width: 1.2em;
}
.categoryBox__description {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.categoryBox__lead {
  color: var(--color-LinkusSecondary-005);
  font-size: var(--font-size-content-M);
  line-height: 1.4;
  max-width: 100%;
  width: fit-content;
}
.categoryBox__lead p {
  margin: 0 0 16px;
  width: fit-content;
}
.categoryBox__lead p:last-child {
  margin-bottom: 0;
}

@media screen and (max-width: 834px) {
  .categoryBox {
    border-bottom: none !important;
    padding-bottom: 0 !important;
  }
  .categoryBox__intro {
    flex-direction: column;
    gap: 16px;
    width: 100% !important;
  }
  .categoryBox__heading {
    margin-bottom: 0;
    margin-left: 24px;
  }
  .categoryBox__lead {
    padding: 0 24px;
  }
}

/************************************
** 各サービスごとのCTA
************************************/
.categoryBox__cta {
  background-color: var(--color-grayscale-080);
  border-radius: var(--border-radius-M);
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 24px 24px 32px;
}
.categoryBox__ctaHeading {
  align-items: center;
  border-bottom: 1px solid var(--color-LinkusSecondary-005);
  color: var(--color-LinkusSecondary-005);
  display: flex;
  font-size: var(--font-size-content-M);
  font-weight: bold;
  gap: 8px;
  justify-content: flex-start;
  line-height: 1;
  padding-bottom: 8px;
}
.categoryBox__ctaHeading::before {
  background-repeat: no-repeat;
  background-size: contain;
  content: url(../img/media/icon-detail.svg);
  height: 20px;
  width: 20px;
}
.categoryBox__ctaButtons {
  display: flex;
  gap: 16px;
  justify-content: flex-start;
}

@media screen and (max-width: 834px) {
  .categoryBox__cta {
    margin: 0 auto;
    width: calc(100% - 48px);
  }
}

@media screen and (max-width: 640px) {
  .categoryBox__ctaButtons {
    flex-direction: column;
    gap: 16px;
  }
  .categoryBox__ctaButtons .media__button.--cv {
    justify-content: center;
    line-height: 1.4;
    padding: 16px 24px;
    width: 100%;
  }
}

/************************************
** 新着記事カルーセル（フッター直下）
************************************/
.newArticlesCarousel {
  margin: 0 auto;
  max-width: 1250px;
  overflow-x: hidden;
  width: calc(100% - 48px);
}
.newArticlesCarousel__inner {
  max-width: 100%;
}
.newArticlesCarousel .categoryBox__pickupList .swiper-button-prev {
  left: 16px !important;
  right: auto !important;
}
.newArticlesCarousel .categoryBox__pickupList .swiper-button-next {
  right: 16px !important;
  left: auto !important;
}
.newArticlesCarousel .media__button.--moreArticles {
  display: none !important;
}

@media screen and (max-width: 834px) {
  .newArticlesCarousel {
    width: 100%;
  }
  .newArticlesCarousel .categoryBox__pickupList .swiper-button-prev,
  .newArticlesCarousel .categoryBox__pickupList .swiper-button-next {
    display: none !important;
  }
}

/************************************
** 各カテゴリーのピックアップ記事
************************************/
.categoryBox__pickup {
  align-items: center;
  background-color: var(--color-LinkusSecondary-080);
  border-radius: var(--border-radius-M);
  display: flex;
  flex-direction: column;
  padding: 32px 48px;
}
.categoryBox__pickupHeading {
  color: var(--color-LinkusSecondary-020);
  font-size: var(--font-size-emphasize);
  font-weight: bold;
  line-height: 1;
  margin: 0 0 24px;
  text-align: left;
  width: 100%;
}
.categoryBox__pickupList {
  margin: 0 auto;
  max-width: 100%;
  padding: 0;
  position: relative;
}
.categoryBox__pickup .categoryBox__swiper {
  overflow: hidden;
  position: relative;
}
.categoryBox__pickup .categoryBox__swiper .swiper-wrapper {
  align-items: stretch;
  margin-top: 0 !important;
}
/* スライド内の記事カード：サムネイルを 1200×630 比率で横幅いっぱいに表示 */
.categoryBox__pickup .swiper-slide {
  box-sizing: border-box;
  display: flex;
  height: auto;
  min-height: 0;
  min-width: 300px;
  width: 300px;
}
.categoryBox__pickup .swiper-slide .articleCard {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  width: 100%;
}
.categoryBox__pickup .swiper-slide .articleCard__link {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}
.categoryBox__pickup .articleCard__thumbnail {
  aspect-ratio: 1200 / 630;
  flex-shrink: 0;
  height: auto;
  overflow: hidden;
  position: relative;
  width: 100%;
}
.categoryBox__pickup .articleCard__thumbnail img {
  height: 100%;
  image-rendering: -webkit-optimize-contrast;
  object-fit: cover;
  position: absolute;
  inset: 0;
  transform: translateZ(0);
  width: 100%;
}
.categoryBox__pickup .categoryBox__pickupList .swiper-button-prev,
.categoryBox__pickup .categoryBox__pickupList .swiper-button-next {
  box-shadow: none !important;
  height: 24px !important;
  margin-top: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 24px !important;
  z-index: 10;
}
.categoryBox__pickup .categoryBox__pickupList .swiper-button-prev {
  content: url(../img/media/icon-carousel-prev.svg);
  left: -36px !important;
  right: auto !important;
}
.categoryBox__pickup .categoryBox__pickupList .swiper-button-next {
  content: url(../img/media/icon-carousel-next.svg);
  right: -36px !important;
  left: auto !important;
}
.categoryBox__pickup .categoryBox__pickupList .swiper-button-prev:hover,
.categoryBox__pickup .categoryBox__pickupList .swiper-button-next:hover {
  opacity: .5;
  transition: opacity .4s ease;
}

@media screen and (max-width: 834px) {
  .categoryBox__pickup .categoryBox__pickupList .swiper-button-prev,
  .categoryBox__pickup .categoryBox__pickupList .swiper-button-next {
    display: none !important;
  }
  .categoryBox__pickup {
    border-radius: 0 !important;
    overflow-x: hidden;
    padding: 32px 0 !important;
  }
  .categoryBox__pickupHeading {
    margin-left: 48px !important;
  }
  .categoryBox__pickupList {
    overflow: hidden;
    /* padding-left: 24px; */
    padding-right: 0 !important;
  }
}

@media screen and (max-width: 640px) {
  .categoryBox__pickup {
    width: 100%;
    max-width: 100%;
  }
  .categoryBox__pickupList {
    padding-left: 0 !important;
  }
  .categoryBox__pickup .swiper-slide {
    width: calc(100vw - 80px);
  }
}

/************************************
** CTA（ページ下部）
************************************/
.ctaBox {
  background-color: var(--color-LinkusSecondary-090);
  margin-top: 72px;
  padding: 48px 0 56px;
}
.ctaBox .content__wrapper {
  margin: 0 auto;
  max-width: 1256px;
  padding: 0;
  width: 100%;
}
.ctaBox__contact {
  align-items: center;
  border-bottom: 1px solid var(--color-LinkusSecondary-070);
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: center;
  padding-bottom: 32px;
  margin: 0 auto;
  max-width: 800px;
}
.ctaBox__contact .contact__text {
  color: var(--color-LinkusSecondary-020);
  font-size: var(--font-size-content-M);
  font-weight: bold;
  line-height: 1.6;
  margin: 0;
  max-width: 560px;
}
.ctaBox__contact .button {
  margin: 0 !important;
}
.ctaBox__contact .button--primary {
  align-items: center;
  display: inline-flex;
  gap: 8px;
}
.ctaBox__contact .button--primary::before {
  content: '\f0e0';
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  flex-shrink: 0;
}
.ctaBox__service {
  display: flex;
  flex-direction: row;
  gap: 24px;
  margin: 32px auto 0;
  max-width: 800px;
}
.ctaBox__link {
  flex: 1;
  min-width: 0;
}
.ctaBox__link a {
  background: linear-gradient(
    to right,
    var(--color-LinkusSecondary-070) 0%,
    var(--color-LinkusSecondary-060) 40%,
    var(--color-LinkusSecondary-060) 70%,
    var(--color-LinkusSecondary-070) 100%
  );
  background-size: 200% 100%;
  background-position: 100% 0;
  border-radius: 16px;
  box-shadow: 0 4px 16px rgba(var(--color-grayscale-000-rgb), .08);
  display: flex;
  flex-direction: column;
  min-height: 160px;
  overflow: hidden;
  padding-bottom: 24px;
  text-decoration: none;
}
.ctaBox__link a:hover {
  background-position: 0 0;
  transition: background-position .4s ease;
}
.ctaBox__link .service__text {
  color: var(--color-grayscale-100);
  font-size: var(--font-size-content-M);
  font-weight: bold;
  height: calc(3rem * 2);
  line-height: 1.5;
  margin: 0;
  padding: 24px 16px;
  text-align: center;
  text-shadow: 0 0 4px rgba(var(--color-grayscale-000-rgb), .25);
}
.ctaBox__link.--linkus .service__text {
  line-height: 3;
}
.ctaBox__link .service__logo {
  align-items: center;
  background-color: var(--color-grayscale-100);
  border-radius: var(--border-radius-M);
  display: flex;
  flex: 1;
  justify-content: center;
  margin: 0 auto;
  min-height: 80px;
  padding: 24px 16px;
  width: 90%;
}
.ctaBox__link .service__logo img {
  display: block;
  height: 48px;
  max-width: 100%;
  object-fit: contain;
}

@media screen and (max-width: 834px) {
  .ctaBox__service {
    margin: 24px;
  }
}

@media screen and (max-width: 640px) {
  .ctaBox {
    padding: 32px 24px 40px;
  }
  .ctaBox__contact {
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding-bottom: 24px;
  }
  .ctaBox__contact .contact__text {
    text-align: center;
  }
  .ctaBox__contact .button--primary {
    width: 100%;
    justify-content: center;
  }
  .ctaBox__service {
    flex-direction: column;
    margin: 24px 0 0 0;
    gap: 16px;
  }
  .ctaBox__link .service__text {
    font-size: var(--font-size-content-S);
    height: auto;
    padding: 16px;
  }
}

/************************************
** メディア：アーカイブページ・投稿ページ
************************************/
.blog .footer,
.single .footer,
.search .footer {
  background: transparent !important;
}
.archive .content .wrap,
.single .content .wrap,
.blog .content .wrap,
.search .content .wrap {
  margin-top: 24px;
  max-width: 1256px;
  width: 100%;
}
.archive .content__wrapper,
.single .content__wrapper,
.blog .content__wrapper,
.search .content__wrapper {
  margin: 0 auto;
  max-width: 1256px;
  width: 100%;
}
.archive .main,
.single .main,
.search .main {
  padding: 0;
  width: calc(70% - 56px);
}
.blog .main {
  padding: 0;
  width: 100%;
}
.archive__heading {
  color: var(--color-LinkusSecondary-020);
  font-size: var(--font-size-heading-S);
  font-weight: bold;
  line-height: 1;
  margin: 0 0 24px;
  padding-top: 16px;
  position: relative;
}
.archive__heading::before {
  background-color: var(--color-LinkusPrimary-040);
  content: '';
  height: 4px;
  left: 0;
  position: absolute;
  top: 0;
  width: 1.2em;
}
/* 親テーマが出力するフォルダアイコンを非表示 */
.archive__heading .fa,
.archive__heading .fa-folder-open {
  display: none;
}

@media screen and (max-width: 1256px) {
  .archive .content .wrap,
  .blog .content .wrap,
  .search .content .wrap,
  .single .content .wrap {
    width: calc(100% - 48px);
  }
}

@media screen and (max-width: 1024px) {
  .archive .content .wrap,
  .blog .content .wrap,
  .search .content .wrap,
  .single .content .wrap {
    display: flex !important;
  }
  .archive .main,
  .search .main {
    margin: 0 !important;
    padding: 0;
    width: calc(70% - 32px);
  }
}

@media screen and (max-width: 834px) {
  .archive .main,
  .search .main,
  .single .main {
    width: 100%
  }
}

@media screen and (max-width: 640px) {
  .archive .content .wrap,
  .search .content .wrap {
    margin-top: 120px;
  }
}

/************************************
** メディア：ページネーション
************************************/
.mediaPagination {
  margin: 0;
  padding: 0;
}
.mediaPagination__list {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
}
.mediaPagination__item {
  margin: 0;
  padding: 0;
}
.mediaPagination__item a,
.mediaPagination__item span {
  align-items: center;
  display: flex;
  justify-content: center;
}
.mediaPagination__item--number a,
.mediaPagination__item--number span,
.mediaPagination__item--number .page-numbers {
  border: none;
  color: var(--color-LinkusSecondary-040);
  font-weight: bold;
  height: auto !important;
  text-decoration: none;
  opacity: 1;
  width: fit-content !important;
}

/* 省略記号（…）をスマホでも確実に表示 */
.mediaPagination__item--dots {
  display: list-item;
}
.mediaPagination__item--dots .page-numbers {
  display: inline-flex;
  min-width: 1em;
  pointer-events: none;
}
.mediaPagination__item--dots .page-numbers.dots {
  background-color: transparent;
}
.mediaPagination__item--number.mediaPagination__item--active a,
.mediaPagination__item--number.mediaPagination__item--active span {
  color: var(--color-LinkusPrimary-030);
}
.mediaPagination__arrowImg {
  display: block;
  height: 20px;
  width: 20px;
}