/* Top-page entry to the 創業者の想い LP: the client's founder-entry.css (founder-entry-pc.zip) with #contents in
   front of every selector, because common.css styles every #contents section (cream box, padding, rounded corners)
   and the body sets a gothic font and a fixed 22.5px line height. The top margin stays the theme's section spacing.
   The font is the 今年の見どころ Mincho stack (the client's preview is Mincho; their CSS says inherit). */
#contents .tcm-founder-entry,
#contents .tcm-founder-entry * {
  box-sizing: border-box;
}

#contents .tcm-founder-entry {
  width: 100%;
  max-width: 900px;
  margin-right: auto;
  margin-left: auto;
  padding: 40px;
  border: 0;
  border-radius: 0;
  background: #fdfcf9;
  color: #07172f;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", "Noto Serif JP", serif;
  font-size: 16px;
  line-height: normal;
  text-align: left;
}

#contents .tcm-founder-entry .tcm-founder-entry__layout {
  display: grid;
  grid-template-columns: minmax(0, 42fr) minmax(0, 52fr);
  align-items: center;
  gap: 44px;
}

#contents .tcm-founder-entry .tcm-founder-entry__image {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 1.9 / 1;
  object-fit: cover;
  object-position: 50% 55%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#contents .tcm-founder-entry .tcm-founder-entry__content {
  min-width: 0;
}

#contents .tcm-founder-entry .tcm-founder-entry__title {
  margin: 0 0 22px;
  padding: 0;
  border: 0;
  background: none;
  color: #07172f;
  font-family: inherit;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.02em;
}

#contents .tcm-founder-entry .tcm-founder-entry__title::before,
#contents .tcm-founder-entry .tcm-founder-entry__title::after {
  content: none;
}

#contents .tcm-founder-entry .tcm-founder-entry__description {
  margin: 0;
  padding: 0;
  color: #27344a;
  font-family: inherit;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.95;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

/* A narrow column breaks before the phrase instead of leaving 「想い。」 on a line of its own. */
#contents .tcm-founder-entry .tcm-founder-entry__nobreak {
  display: inline-block;
}

#contents .tcm-founder-entry a.tcm-founder-entry__link {
  display: inline-flex;
  align-items: baseline;
  max-width: 100%;
  margin: 24px 0 0;
  padding: 0 0 4px;
  border: 0;
  border-bottom: 1px solid currentColor;
  border-radius: 0;
  background: none;
  color: #a52a37;
  font-family: inherit;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.7;
  text-decoration: none;
  box-shadow: none;
}

#contents .tcm-founder-entry a.tcm-founder-entry__link:visited {
  color: #a52a37;
}

#contents .tcm-founder-entry a.tcm-founder-entry__link:hover {
  color: #7f1f2b;
}

#contents .tcm-founder-entry a.tcm-founder-entry__link:focus-visible {
  outline: 2px solid #a52a37;
  outline-offset: 5px;
}

/* The whole card opens the LP: the link's ::after covers the card, so it stays one real link (new tab, screen
   readers) and hovering anywhere turns it the hover colour. The card is the positioned ancestor, so the link itself
   must stay unpositioned. No z-index: the fixed ticket banner (z-index 1), PAGE TOP (10) and the phone MENU (10)
   stay on top where they float over the card. top/right/bottom/left rather than inset, for Safari before 14.1. */
#contents .tcm-founder-entry {
  position: relative;
}

#contents .tcm-founder-entry a.tcm-founder-entry__link::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

/* The client's 16px flex gap, as a margin: Safari before 14.1 has no gap in flex layout. */
#contents .tcm-founder-entry .tcm-founder-entry__arrow {
  flex-shrink: 0;
  margin-left: 16px;
  font-size: 1em;
}

/* Phones (the zip has PC only): photo above the text. */
@media (max-width: 678px) {
  #contents .tcm-founder-entry {
    padding: 20px;
  }

  #contents .tcm-founder-entry .tcm-founder-entry__layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
  }

  #contents .tcm-founder-entry .tcm-founder-entry__title {
    margin-bottom: 14px;
    font-size: 22px;
  }

  #contents .tcm-founder-entry .tcm-founder-entry__description {
    font-size: 15px;
    line-height: 1.85;
  }

  #contents .tcm-founder-entry a.tcm-founder-entry__link {
    margin-top: 18px;
    font-size: 16px;
  }
}
