.wrap {
  max-width: 500px;
  width: 100%;
  margin: 0 auto;
}

/* ここからアコーディオン */
.off-trigger {
  display: block;
  cursor: pointer;
}

.on-content {
  position: relative;
}

.close-trigger {
  display: block;
  cursor: pointer;
}

.off-trigger,
.on-trigger {
  display: block;
  cursor: pointer;
  margin: 20px 10px 0;
}

/* closed */
.off .on-content {
  display: none;
}

/* opened */
.on .off-content {
  display: none;
}

/* ここまでアコーディオン */