/* ===================================================
   吹き出しの三角をちょっと曲げる
   数値は記事・CodePen と同じ。変えたのは色だけ（6 色に）。
   1つずつ、番号のところからコピーして使えます。
   =================================================== */

/* ---------- 見本の箱（マスに収めるための指定。コピーしなくても同じ形になります） ---------- */
.items > li { align-items: center; }

/* ---------- 01 右向き ---------- */
/* 吹き出し本体 */
.fukidasi_right {
  position: relative;
  padding: 20px;
  background-color: #2b2a27;
  font-size: 16px;
  color: #ffffff;
  border-radius: 10px;
}
/* 色付きの半円 */
.fukidasi_right::before {
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-radius: 50%;
  transform: rotate(45deg);
  right: -15px;
  top: 22px;
  border-left: 25px solid transparent;
  border-top: 25px solid #2b2a27;
  border-right: 25px solid transparent;
  border-bottom: 25px solid transparent;
}
/* 白い半円（背景と同じ色にする） */
.fukidasi_right::after {
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-radius: 50%;
  transform: rotate(45deg);
  right: -25px;
  top: 40px;
  border-left: 25px solid transparent;
  border-top: 25px solid #ffffff;
  border-right: 25px solid transparent;
  border-bottom: 25px solid transparent;
}

/* ---------- 02 左向き ---------- */
/* 吹き出し本体 */
.fukidasi_left {
  position: relative;
  padding: 20px;
  background-color: #2b2a27;
  font-size: 16px;
  color: #ffffff;
  border-radius: 10px;
}
/* 色付きの半円 */
.fukidasi_left::before {
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-radius: 50%;
  transform: rotate(45deg);
  left: -15px;
  top: 22px;
  border-left: 25px solid #2b2a27;
  border-top: 25px solid transparent;
  border-right: 25px solid transparent;
  border-bottom: 25px solid transparent;
}
/* 白い半円（背景と同じ色にする） */
.fukidasi_left::after {
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-radius: 50%;
  transform: rotate(45deg);
  left: -25px;
  top: 40px;
  border-left: 25px solid #ffffff;
  border-top: 25px solid transparent;
  border-right: 25px solid transparent;
  border-bottom: 25px solid transparent;
}