@charset "UTF-8";
/**
 * めざましmediaカルーセル：cx-mezamashi-media-feedスタイル設定
*/

/* カルーセルエリアコンテナ */
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel {
  width: 90%;
}
/* カルーセルスライド */
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-item {
  padding: 16px;
  background-color: #f2f2f2; /* スライド背景色変更の場合はここを変更 */
  height: auto;
}
/* スライド内リンクエリア */
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-item-link {
  height: 100%;
  text-decoration: none;
}
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-item-link:hover {
  text-decoration: underline;
}
/* スライド内画像エリア */
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-item-img {
  margin: 0;
  overflow: hidden;
}
/* スライド内 img */
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-item .cx-mezamashi-media-feed-carousel-item-img {
  overflow: hidden;
}
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-item-img img {
  max-width: 100%;
  height: auto;
  box-sizing: border-box;
  /* object-fit: contain; */
}
#mezamashi-media .cx-mezamashi-media-feed-carousel-item img {
  aspect-ratio: unset;
}
/* スライド内日付 */
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-item-date {
  display: inline-block;
  margin: 10px 0 0 0;
  color: #C567F7;
  font-family: "Goldman", sans-serif;
  font-weight: 700;
  font-style: normal;
}
/* スライド内テキスト */
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-item-text {
  margin: 5px 0;
  color: #163C77;
  line-height: 1.2;
}
/* ナビゲーション共通 */
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-navi {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 50px;
  height: 50px;
  cursor: pointer;
  z-index: 1;
}
/* ナビゲーション 前後のスライドがない場合のprev、nextボタンの表示制御 */
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-navi.swiper-button-disabled {
  opacity: 0;
}
/* ナビゲーション prev */
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-prev {
  left: 10px;
}
/* ナビゲーション next */
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-next {
  right: 10px;
}
/* ナビゲーション SVGアイコン */
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-navi .icon_svg {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #FCD93A;
  fill: #fff;
}

/**
 * ナビゲーションをアイコン画像に変更する場合
 * 以下のCSSをコメントアウトして設定可能
*/
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-navi .icon_svg {
  display: none
}
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-navi {
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-prev {
  background-image: url(../img/arrow_media.png);
  transform: scaleX(-1) translateY(-50%);
}
.cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-next {
  background-image: url(../img/arrow_media.png);
}

@media screen and (max-width: 768px) {
  .cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel {
    width: 100%;
  }
  /* 前後のスライドを薄く */
  .cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-item.swiper-slide-next,
  .cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-item.swiper-slide-prev {
    opacity: .6;
  }
  /* ナビゲーション prev */
  .cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-prev {
    left: min(25px, 6.4vw);
  }
  /* ナビゲーション next */
  .cx-mezamashi-media-feed-carousel-container .cx-mezamashi-media-feed-carousel-next {
    right: min(25px, 6.4vw);
  }
}