/**
 * Moreリンクコンポーネント共通スタイル
 */

.more-link {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  text-decoration: none;
  width: 100%;
}

.more-text {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 15px;
  font-weight: 500;
  line-height: 17.6px;
  color: #e7141a;
}

.more-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 1px solid #e7141a;
  border-radius: 50%;
  transition: background-color 0.3s ease;
}

.more-link:hover .more-btn {
  background-color: #e7141a;
}

.more-link:hover .more-btn svg path {
  stroke: #fff;
}

/* SP対応 */
@media screen and (max-width: 767px) {
  .more-text {
    font-size: 14px;
  }

  .more-btn {
    width: 36px;
    height: 36px;
  }
}