
.accordion{
  margin-top: 20px!important;
	margin-bottom: 50px;
}

.accordion__container {
  width: 80%;
}

.accordion__title {
  border-bottom: 1px solid #313994;
  color: #313994;
  font-size: 0.9em;
  padding: 0.5em 0.5em 0.5em 0.5em;
  position: relative;
  cursor: pointer;
  user-select: none;
}

.accordion__title::after {
  content: "";
  border-top: 1px solid #313994;
  border-left: 1px solid #313994;
  display: inline-block;
  width: 10px;
  height: 10px;
  transform: rotate(-135deg) translateY(0px);
  position: absolute;
  right: 20px;
  top: 50%;
  transition: transform .4s;
}

.accordion__title:hover,
.accordion__title:active,
.accordion__title.is-active { 
  background-color: #F0F7FC;
}

.accordion__title.is-active::after {
  transform: rotate(45deg);
}

.accordion__content {
  border-left: 1px solid transparent;
  border-right: 1px solid transparent;
  padding: 0 1.5em;
  line-height: 0;
  height: 0;
  overflow: hidden;
  opacity: 0;
  transition-duration: .3s;
}

.accordion__content.is-open {
  padding: .625em 1.5em;
  line-height: normal; /* numberに書き換える*/
  height: auto;
  opacity: 1;
}


@media screen and (max-width: 767px) {
  .accordion__container {
  	width: 100%;
	}
  .accordion__title::after {
  	top: 40%;
}

 }