.community-archive-title {
    position: relative;
    padding: 16px 48px 16px 0;
}

.community-archive-title:before,
.community-archive-title:after {
    position: absolute;
    top: 0;
    right: 16px;
    bottom: 0;
    width: 16px;
    height: 2px;
    margin: auto 0;
    content: '';
    -webkit-transition: all .12s ease-out 0s;
    -o-transition: all .12s ease-out 0s;
    transition: all .12s ease-out 0s;
    background: #fff;
}

.community-archive-title:after {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 1;
}

.community-archive-title.is-open:before {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.community-archive-title.is-open:after {
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
    opacity: 0;
}

.community-archive-content .community-archive-box:last-child {
    overflow: hidden;
    /*max-height: 0;*/
    transition: max-height 0.3s ease-out;
}

@media only screen and (min-width: 768px) {
  .community-archive-content .exhibition-box .community-archive-box:last-child {
    margin: 20px 0 60px;
    border-bottom: 1px solid #e0e0e0;
  }
  .community-archive-title:before,
  .community-archive-title:after {
      background: #999;
  }
}