/************************************************
* accordion
*************************************************/
.accordion .inner {
  background-color: #fff;
  padding: 1% 3% 3% 3%;
}
@media screen and (min-width: 720px) {
  .accordion .inner {
    padding: 1% 3% 2% 3%;
  }
}
@media screen and (min-width: 1400px) {
  .accordion .inner {
    margin-left: calc((100% - 1200px) / 2);
    margin-right: calc((100% - 1200px) / 2);
  }
}
.accordion .inner summary {
  list-style: none;
  border-bottom: 1px solid var(--color-background-fourth);
  cursor: pointer;
  background-color: #fff;
  font-weight: 500;
  display: flex;
}
.accordion .inner summary::-webkit-details-marker {
  display: none;
}
.accordion .inner summary span {
  display: inline-block;
  font-size: 2.5em;
  font-size: 1.2rem;
  margin: 0.6em;
  max-width: 900px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.accordion .inner summary::before {
  content: "arrowrightnocircle";
  transition: transform 200ms ease;
  transform-origin: center center;
  display: inline-block;
  font-family: "deister-icons";
  font-size: 2rem;
  font-weight: 500;
  max-height: 52px;
  position: relative;
  margin-right: 1rem;
}
.accordion .inner details > div {
  padding: 2% 0;
}
@media screen and (max-width: 780px) {
  .accordion .inner details > div {
    padding: 3.5% 0;
  }
  .accordion .inner details > div .text {
    order: 2;
    flex: 0 0 100%;
  }
  .accordion .inner details > div figure.image {
    margin-bottom: 3%;
    flex: 0 0 100%;
  }
}
.accordion .inner details[open] summary::before {
  transform: rotate(90deg) translateX(-3px);
  transform-origin: center;
}
.accordion .inner details[open] summary span {
  max-width: unset;
  white-space: unset;
  overflow: unset;
  text-overflow: unset;
}

/*# sourceMappingURL=accordion.css.map */
