@charset "UTF-8";
/* CSS for accordion */
.accordion {
  margin-top: 10px;
}

.accordion__container {
  width: 100%;
  margin: 0 auto;
}

.accordion__title {
  background-color: rgba(128,128,128,1);
  border: 1px solid transparent;
  color: #fff;
  font-size: 1rem;
  padding: 0.625em 0.625em 0.625em 2em;
  margin: 0;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.accordion__title::before, .accordion__title::after {
  content: "";
  display: block;
  background-color: #fff;
  position: absolute;
  top: 50%;
  width: 15px;
  height: 2px;
  right: 25px;
}

.accordion__title::after {
  transform: rotate(90deg);
  transition-duration: 0.3s;
}

.accordion__title:hover,
.accordion__title:active,
.accordion__title.is-active {
  background-color: rgba(128,128,128,1);
}

.accordion__title.is-active::before {
  opacity: 0;
}

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

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

.accordion__content li {
  list-style: none;
  box-shadow: 0 1px 0 0 rgba(0 ,0 ,0 ,0.1);
}
.accordion__content li a {
  display: block;
  padding: 0.8em 0.625em;
  font-size: 0.86rem;
}
.accordion__content li a:hover {
  background: ghostwhite; 
}

.accordion__content.is-open {
  border: 1px solid gainsboro;
  padding: 0;
  line-height: normal;
  /* numberに書き換える*/
  height: auto;
  opacity: 1;
}
.is-current {
	background: whitesmoke;
}

/*CSS for button*/
.c5-btn {
  display: flex;
  margin: 30px -5px 30px -5px;
  padding: 0;
  list-style: none;
}
.c5-btn li {
  margin: 0 5px;
  flex: 0 1 50%;
}
.c5-btn a {
  display: block;
  text-align: center;
  padding: 20px;
  background: rgba(243,244,246,1);
  text-decoration: none;
  font-weight: bold;
  height: 100%;
  position: relative;
  min-height: 90px;
  box-sizing: border-box;
}
.c5-btn a > span {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 100%;
}
.c5-btn a .sub {
  font-size: .85em;
}
.c5-btn a:hover {
  text-decoration: none;
}
.c5-btn a.hover {
  background: rgba(243,244,246,1);
  overflow: hidden;
  position: relative;
  z-index: 0;
}
.c5-btn a.hover::after {
  background: rgba(251,251,251,0.7);
  position: absolute;
  top: 0;
  left: 0;
  content: '';
  width: 100%;
  height: 100%;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
  z-index: -1;
}
.c5-btn a.hover:hover {
  background: rgba(243,244,246,0.7);
}
.c5-btn a.hover:hover::after {
  transform: scale(1, 1);
}
.c5-btn a.active {
  background-color: rgba(67,67,67,1);
  color: #fff;
  pointer-events: none;
}
.c5-btn a.active span.s5-link {
  color: #fff;
}
@media only screen and (max-width: 767px) {
.c5-btn a {
    padding: 20px 5px;
    font-size: 10px;
    height: 100%;
    box-sizing: border-box;
    min-height: 0;
	}
}