.profile-intro {
  display: flex; /* 要素を柔軟(横列、順序、パディング)に並び替えるため */
  flex-direction: column; /* 子要素を縦に並べる */
}

.profile-intro__inner {
  display: flex; /* 要素を柔軟(横列、順序、パディング)に並び替えるため */
  flex-direction: column; /* 子要素を縦に並べる */
  justify-content: center; /* 中央に寄せる */

  width: 300px;
  border: 1px solid #bbb; /*輪郭(太さ、線の種類、色)*/
  border-radius: 16px; /* cardの角に接する円の、中心から縦横の高さ*/
  overflow: hidden; /* 角丸に合わせて中身を切り取る */
  margin: 16px;
  padding-left: 10px;
  padding-right: 10px;
  line-height: 3;
}

.profile-intro__header {
  margin: 4px 0;
  font-size: 14px;
  color: #555; /*若干薄く*/
  padding-top: 5px;
}

.profile-intro__body {
  display: flex; /* 要素を柔軟(横列、順序、パディング)に並び替えるため */
  flex-direction: column; /* 子要素を縦に並べる */
}

.profile-intro__role,
.profile-intro__interests {
  margin: 4px 0;
  font-size: 14px;
  color: #555; /*若干薄く*/
}