@charset "UTF-8";
/*----------------------------------------
body
----------------------------------------*/

.contents_item:nth-child(even) {
  direction: rtl;
}
.contents_item:nth-child(even) > * {
  direction: ltr;
}
.faq {
  background: url(../img/common/faq_bg.png) no-repeat top;
  background-size: contain;
}
/*contens数字*/
.contents_heading {
  position: relative;
  padding-bottom: 0.5em;
  padding: 0.8em 0 0.3em;
  overflow: visible;
}
.contents_heading > span {
  padding-left: 3.5em;
  display: block;
}
.contents_heading::before {
  width: 2em;
  text-indent: 0;
  font-size: 1.5em;
  display: inline-block;
  height: 2em;
  margin-right: 0.2em;
  color: #fff;
  border-radius: 50%;
  /* transform: scale(0.8); */
  content: attr(data-number);
  display: flex;
  padding-bottom: 0.1em;
  left: 0;
  font-weight: 600;
  translate: -0.1em 0.3em;
  position: absolute;
  align-items: center;
  justify-content: center;
  bottom: 0;
}
.contents_heading > span::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0em;
  transform: translateX(-50%);
  width: 100%;
  height: 1px;
}
.contents_heading.--green::before,
.contents_heading.--green > span::after {
  background-color: #6cb45d;
}
.contents_heading.--pink::before,
.contents_heading.--pink > span::after {
  background-color: #c38384;
}
.contents_heading.--yellow::before,
.contents_heading.--yellow > span::after {
  background-color: #b89c4f;
}
@media screen and (min-width: 1024px) {
  .contents_item_body {
    padding: var(--space-sm);
  }
  .contents_item {
    justify-items: center;
    align-items: center;
  }
  .contents_heading {
    padding: 0 0 0.3em;
    width: 100%;
  }
  .contents_heading > span::after {
    width: calc(100% + var(--space-sm) * 2);
  }
}
@media screen and (min-width: 1440px) {
  .contents_item_body {
    padding: var(--space-sm) var(--space-md);
  }
  .contents_heading > span::after {
    width: calc(100% + var(--space-md) * 2);
  }
}
