@charset "UTF-8";

.p-index__kv_news:not(:has(.p-index__kv_news_list > li)),
.p-index__news_item_list > li:nth-of-type(n+4),
.p-news__list_img img[src="#"] {
  display: none!important;
}

.p-index__news_item_img:empty,
.p-news__list_img {
  position: relative;
  background: #fff;
}

.p-index__news_item_img:empty:after,
.p-news__list_img:has(img[src="#"]):after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  translate: -50% -50%;
  display: block;
  width: 100%;
  height: 100%;
  background: url(../img/common/logo_mark.svg) no-repeat 50% 50% / contain;
  scale: .4;
  opacity: .3;
}



/* SVG矢印 */
.o-list__img_cnt_arrow, .o-btn__color_reverse_arrow {
  position: relative;
  display: inline-block;
  width: 8px;
  height: 13px;
  -webkit-mask-image: url("/assets/img/common/arrow-right.svg");
  mask-image: url("/assets/img/common/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;
  background-color: #000000;  /* ここがアイコンの色 */
}

.o-list__img_cnt_arrow
 {
  position: absolute;
}



/* ボタン本体：黒いカプセル＋テキスト白 */
.o-btn__color_reverse:hover {
  background-color: #000;
  color: #fff;
  text-decoration: none;
}


/* 矢印を mask-image で描画（通常：黒） */
.o-btn__color_reverse_arrow::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  -webkit-mask-image: url("/assets/img/common/arrow-right.svg");
  mask-image: url("/assets/img/common/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;
  background-color: #000;           /* 通常時の矢印色（黒） */
}

/* ホバー時：矢印だけ白くする */
.o-btn__color_reverse:hover .o-btn__color_reverse_arrow::after {
  background-color: #fff;           /* 矢印が白になる */
}

/* 矢印用の枠 */
.o-btn__relation_page_arrow {
  display: inline-block;
  width: 7px;
  height: 12px;
  position: relative; 
}

/* 擬似要素で小さい矢印SVGを表示 */
.o-btn__relation_page_arrow::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-image: url("/assets/img/common/arrow-right-s.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}



.o-each_course__bottom_item_arrow {
  position: relative;
  width: 8px;
  height: 12px;
}

/* mask-image で小さい矢印を表示 */
.o-each_course__bottom_item_arrow::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  -webkit-mask-image: url("/assets/img/common/arrow-right.svg");
  mask-image: url("/assets/img/common/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;
  background-color: #000;          /* 通常：黒矢印 */
}

/* hover時 ボタン反転＋矢印白 */
.o-each_course__bottom_item_box:hover {
  background-color: #000;
  color: #fff;
}

.o-each_course__bottom_item_box:hover .o-each_course__bottom_item_arrow::after {
  background-color: #fff;          /* hover：白矢印 */
}