div.c{
  position: relative;
  margin:1em;
}
.arrow{
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  opacity:0;
  visibility: 0;
}
.question-title{
  padding:1em;
  position: relative;
  font-size: 1.4em;
  -webkit-user-select: none;
    user-select: none;
}
.arrow-label::before{
  content:"";
  display: inline-block;
  border: 15px solid transparent;
  border-left:20px solid black;
}
label{
  cursor: pointer;
  position: relative;
  display: flex;
  align-items: center;
  color: black;
}
div.p{
  max-height: 0px;
  text-align: justify;
  overflow: hidden;
  transition:max-height 0.5s;
  background-color: white;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
}
div.p p {
  padding:1em;
  font-size: 1.2em;
}
.arrow:checked ~ h3 label::before{
  border-left:15px solid transparent;
  border-top:20px solid black;
  margin-top:12px;
  margin-right:10px;
}
.arrow:checked ~ h3 ~ div.p{
  max-height: 1000px;
}