/* アコーディオン
----------------------------------------------- */
.com-accordion {
  border-top: 1px solid #ddd;
}

.com-accordion-item {
  border-bottom: 1px solid #ddd;
  scroll-margin-top: 80px;

  > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 0;
    cursor: pointer;
    list-style: none;
    user-select: none;

    &::-webkit-details-marker {
      display: none;
    }

    &::after {
      content: '';
      flex-shrink: 0;
      width: 12px;
      height: 12px;
      border-right: 2px solid #333;
      border-bottom: 2px solid #333;
      transform: rotate(45deg);
      transition: transform 0.3s ease;
    }
  }

  &[open] > summary::after {
    transform: rotate(-135deg);
  }

  &.is-closing > summary::after {
    transform: rotate(45deg);
  }
}

.com-accordion-body {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s ease;

  .com-accordion-item[open] > & {
    grid-template-rows: 1fr;
  }

  .com-accordion-item.is-closing > & {
    grid-template-rows: 0fr;
  }
}

.com-accordion-inner {
  overflow: hidden;
}

.com-accordion-content {
  padding: 16px 0;
}
