<h1 class="cp_h1title"><span>見出しテキスト</span></h1>

.cp_h1title {
  color: #f8f8f8;
  background-color: #303f9f;
  background-image:
  linear-gradient(45deg,#283593 25%, transparent 25%,transparent 50%, #283593 50%,#283593 75%, transparent 75%,transparent),
  linear-gradient(-45deg,#283593 25%, transparent 25%,transparent 50%, #283593 50%,#283593 75%, transparent 75%,transparent);
  background-size: 10px 10px;
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2);
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  line-height: 1em;
}
.cp_h1title span {
  position: relative;
  display: inline-block;
  border-radius: 4px 0px 0px 4px;
  background: #4dd0e1;
  line-height: 1em;
  padding: 5px 10px;
}
.cp_h1title span::after {
  position: absolute;
  top: 0;
  right: -0.68em;
  display: inline-block;
  width: 0;
  height: 0;
  content: '';
  border-width: 0.69em 0 0.69em 0.69em;
  border-style: solid;
  border-color: transparent transparent transparent #4dd0e1;
}