@charset "utf-8";

/* -- .slide-down -------------------------------------------------------------------------------------------- */

.slide-down::before {
  content: "―";
  padding-right: 0.35rem;
}

.slide-down:hover {
  cursor: pointer;
  /* opacity: 0.7; */
  background: #1c5b9f;
  color: #fff !important;
}

.slide-down:hover::before {
  content: "▼";
}

.active::before {
  content: "▲";
}

.active:hover::before {
  content: "▲";
}

/* -- div.slide-* -------------------------------------------------------------------------------------------- */

div[class^="slide-"] {
  display: none;
}

/* div.slide-1,
div.slide-2,
div.slide-3,
div.slide-4,
div.slide-5,
div.slide-6,
div.slide-7,
div.slide-8 {
	display: none;
} */

.slide-down {
  margin: 10px auto 4px;
  padding: 15px 20px;
  background: #fcfcfc;
  /* color: #333; */
  font-weight: 600;
  border: solid 1px #ccc;
}

.slide-down.active {
  background: #1c5b9f;
  color: #fff !important;
}

div[class^="slide-"] {
  margin: 0 auto 25px;
}

div[class^="slide-"] div.program-note {
  margin: 0 auto 5px;
  padding: 25px 20px;
  background: #ffffff;
  border: solid 7px #e5e7eb;
}

div[class^="slide-"] div.program-note:last-child {
  margin: 0 auto 45px;
}

/* div.slide-1,
div.slide-2,
div.slide-3,
div.slide-4,
div.slide-5,
div.slide-6,
div.slide-7,
div.slide-8 {
  margin: 0 auto 25px;
  padding: 25px 20px;
  background: #ffffff;
  border: solid 10px #e5e7eb;
} */

@media (max-width: 768px) {
div[class^="slide-"] div.program-note {
  border: solid 6px #e5e7eb;
}
}

@media (max-width: 420px) {
  #society-main {
    border: solid 1px #d7f0ff;
    padding: 0;
}
  #society-main .content-area {
    padding: 25px 5px 45px !important;
  }

  .slide-down {
    margin: 10px auto 4px;
    padding: 15px 10px;
  }

  div[class^="slide-"] {
    margin: 0 auto;
  }

  div[class^="slide-"] div.program-note {
    margin: -3px auto 0;
    padding: 15px 10px;
    background: #ffffff;
    border: solid 3px #e5e7eb;
  }

    div[class^="slide-"] div.program-note:first-child {
    margin: 5px auto 0;
  }

  div[class^="slide-"] div.program-note:last-child {
  margin: -3px auto 35px;
}

  /* div.slide-1,
  div.slide-2,
  div.slide-3,
  div.slide-4,
  div.slide-5,
  div.slide-6,
  div.slide-7,
  div.slide-8 {
    margin: 0 auto;
    padding: 25px 7px;
    background: #ffffff;
    border: solid 5px #e5e7eb;
  } */
}