.profile-detail {
  font-size: clamp(14px, 1.6vw, 16px);
  --txtLight: #fff;
  --category: var(--page-gakubu);
}
.profile-detail.--eng {
  --category: var(--cl-gakubu-eng);
}
.profile-detail.--cs {
  --category: var(--cl-gakubu-cs);
}
.profile-detail.--ms {
  --category: var(--cl-gakubu-ms);
}
.profile-detail.--bs {
  --category: var(--cl-gakubu-bs);
}
.profile-detail.--ds {
  --category: var(--cl-gakubu-ds);
}
.profile-detail.--hs {
  --category: var(--cl-gakubu-hs);
}
.profile-detail.--la {
  --category: var(--cl-gakubu-la);
}
.profile-detail.--grad {
  --category: var(--cl-gakubu-grad);
}
.profile-detail.--labo {
  --category: var(--cl-gakubu-labo);
}
.profile-detail:not(.profile-card) h2 {
  font-size: clamp(16px, 2.4vw, 24px);
  line-height: 1.2;
  padding: 0.5em 0.5em 0.5em clamp(12px, 2vw, 20px);
  margin: 2em 0 0.8em;
  background-color: var(--category);
  color: var(--txtLight);
  font-weight: 700;
}
.profile-detail:not(.profile-card) a {
  color: inherit;
}

.profile-card {
  background-color: var(--category);
  color: var(--txtLight);
  display: block;
}
.profile-card .profile-portforio img {
  display: block;
}
@media screen and (max-width: 480.9px) {
  .profile-card .profile-portforio img {
    aspect-ratio: 3/2;
    -o-object-fit: cover;
       object-fit: cover;
  }
}
.profile-card .profile-content {
  padding: clamp(12px, 2vw, 20px) clamp(12px, 3vw, 30px) clamp(16px, 3vw, 30px);
}
.profile-card h2 {
  font-size: clamp(24px, 3.2vw, 32px);
  line-height: 1.2;
  font-weight: 100;
  color: var(--txtLight);
}
.profile-card h3 {
  font-size: clamp(12px, 1.4vw, 14px);
  font-weight: 400;
  padding: 0 0 1em;
  margin: 0.4em 0 1em;
  border-bottom: 1px solid var(--txtLight);
  color: var(--txtLight);
}
.profile-card h4 {
  font-size: 1em;
  font-weight: 700;
  margin: 1em 0 0 0;
  color: var(--txtLight);
}
.profile-card p {
  font-size: 1em;
  font-weight: 400;
}