h2{ 
  position: relative; 
  padding: 10px;   /*枠の大きさ*/
  text-align:center; 
  border-top: solid 1px #30302f;  /*上の線*/
  border-bottom: solid 1px #30302f;  /*下の線*/
}
h2:before,h2:after{ 
  content: ''; 
  position: absolute; 
  top: -10px;   /*上へ線のはみ出し量*/
  width: 1px;   /*線の大きさ*/
  height: calc(100% + 25px);    /*下へ線のはみ出し量*/
  background-color: #30302f;
}
h2:before{
  left: 10px;
}
h2:after{
  right: 10px;
}