.cor-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  font-size: var(--step--3);
  gap: var(--space-3xs);
  padding: var(--padding, 0);
}

.cor-card > * {
  margin: 0;
}

.cor-card--border {
  background-color: var(--oc-indigo-0);
  border: solid 1px var(--oc-indigo-8);
  border-radius: 20px;
  display: grid;
  font-size: var(--step--3);
  gap: var(--space-xs);
  padding: var(--space-m) var(--space-2xs);
}

.cor-card > * {
  margin: 0;
}

.cor-card__title,
.mainContent .cor-card__title {
  all: unset;
  font-size: var(--step--3);
}

.mainContent a.cor-card__title__link {
  font-weight: bold;
  text-decoration: none;
}

.mainContent a.cor-card__title__link:hover {
  text-decoration: underline;
}

.cor-card__title__link[href]:after {
  content: none;
}

.cor-card__title__link[href] .cor-card__title__link__info {
  align-items: center;
  color: var(--text-color-light);
  display: flex;
  gap: var(--space-3xs);
  margin-top: var(--space-3xs);
}

.cor-card__title__link[href] .cor-card__title__link__info:before {
  display: inline-block;
  content: "";
  vertical-align: -0.125em;
  background-image: var(--icon-document);
  background-repeat: no-repeat;
  width: 16px;
  height: 16px;
}

.cor-card__image {
  border-radius: 2px;
}

.cor-card__date {
  font-size: var(--step--4);
}

.cor-card--withbackground {
  background-color: var(--oc-gray-1);
  padding: var(--space-xs);
}

.cor-card--opinion {
  display: grid;
  gap: var(--space-xs);
  grid-template-columns: 150px 1fr;
}

.cor-card--opinion > img:first-child {
  align-self: stretch;
  grid-row: 1 / 2;
  height: 100%;
}

.cor-card--opinion img + div {
  display: grid;
  gap: var(--space-3xs);
  margin-top: 0;
  padding: var(--space-2xs) var(--space-2xs) var(--space-2xs) 0;
}

.cor-card--opinion {
  padding: 0;
}

.cor-card--opinion img + div :first-child {
  margin-top: 0;
  padding-top: 0;
}

.cor-card figure {
  position: relative;
}

.cor-card figure footer {
  background: #0007;
  bottom: 0;
  color: #fff;
  font-size: var(--step--4);
  padding: var(--space-3xs);
  position: absolute;
  text-align: right;
}

.cor-card figure:hover {
  bottom: 0; /* main.css override */
}

/* To move */
.cor-image-customratio h3.cor-card__title { text-align: center; width: 100%;}
.cor-image-customratio .cor-image { aspect-ratio: auto; }