@charset "UTF-8";

/* ==================================================== */
/* オンデマンド配信  主要*/
/* ==================================================== */

table.table02 {
  border-collapse: collapse !important;
  width: 100% !important;
  font-size: 0.95rem !important;
}

table.table02 > tbody > tr {
  width: 100% !important;
}

table.table02 > tbody > tr > td {
  padding: 0;
  text-align: left !important;
}

@media (max-width: 800px) {
  table.table02 > tbody > tr {
    border: solid 2px #ccc !important;
  }

  table.table02 > tbody > tr > td {
    border: solid 1px rgb(245, 245, 245) !important;
    display: block;
    padding: 0.65rem 1rem !important;
    text-align: left !important;
  }

  table.table02 > tbody > tr:hover {
    background: none !important;
  }

  table.table02 > tbody > tr > td::before {
    content: attr(data-label);
    font-size: 0.875rem;
    /* color: #666; */
    display: block;
    margin-bottom: 0.25rem;
    font-weight: bold;
  }

  .session-name {
    background: #ecf6ff !important;
  }

  td.session-name ul li span {
    display: inline-block !important;
    color: #fff !important;
  }

  td:nth-child(1),
  td:nth-child(2),
  td:nth-child(3),
  td:nth-child(4),
  td:nth-child(5),
  td:nth-child(6) {
    width: auto !important;
  }

  .heading {
    display: none;
  }
}

/* --プログラム ------------------------- */

table.table02 > tbody > tr > td > div.section-area {
  position: relative !important;
  padding: 10px 15px 85px !important;
  border: 1px solid #ddd !important;
  background: #fff !important;
  text-align: left !important;
  margin-bottom: 25px !important;
}

table.table02 > tbody > tr > td > div.section-area-sp {
  position: relative !important;
  padding: 10px 15px 100px !important;
  border: 1px solid #ddd !important;
  background: #fff !important;
  text-align: left !important;
  margin-bottom: 25px !important;
}

@media (max-width: 768px) {
  table.table02 > tbody > tr > td > div.section-area {
    padding: 5px 5px 85px !important;
    border: none !important;
    margin-bottom: 0 !important;
  }
  table.table02 > tbody > tr > td > div.section-area-sp {
    padding: 5px 5px 115px !important;
    border: none !important;
  }
}

table.table02 > tbody > tr > td > div.section-area > .btn,
table.table02 > tbody > tr > td > div.section-area-sp > .btn {
  position: absolute !important;
  bottom: 15px !important;
  right: 10px !important;
  padding: 15px 22px !important;
  min-width: 120px !important;
}

table.table02 > tbody > tr > td > div.section-area > .btn-area,
table.table02 > tbody > tr > td > div.section-area-sp > .btn-area {
  display: flex;
  position: absolute !important;
  bottom: 15px !important;
  right: 10px !important;
}

table.table02 > tbody > tr > td > div.section-area > .btn-area02,
table.table02 > tbody > tr > td > div.section-area-sp > .btn-area02 {
  display: flex;
  position: absolute !important;
  bottom: 15px !important;
  right: 10px !important;
}

@media (max-width: 460px) {
  table.table02 > tbody > tr > td > div.section-area > .btn-area02,
  table.table02 > tbody > tr > td > div.section-area-sp > .btn-area02 {
    display: initial;
    text-align: right;
    bottom: 5px !important;
    right: 10px !important;
  }
}

table.table02 > tbody > tr > td > div.section-area > .btn-area > .btn,
table.table02 > tbody > tr > td > div.section-area-sp > .btn-area > .btn,
table.table02 > tbody > tr > td > div.section-area > .btn-area02 > .btn,
table.table02 > tbody > tr > td > div.section-area-sp > .btn-area02 > .btn {
  padding: 15px 22px !important;
  min-width: 120px !important;
  margin-left: 7px;
  margin-bottom: 7px;
}

table.table02 > tbody > tr > td > div.section-area-sp > .korabo {
  position: absolute !important;
  top: 18px !important;
  right: 15px !important;
}

div.section-area-each {
  position: relative;
  padding: 12px 1rem 12px 1rem !important;
  border-top: dotted 2px #ccc;
}

div.section-area-each > .btn {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  padding: 10px 12px;
}

div.section-area-each li{
  width: 85% !important;
}

@media (max-width: 800px) {
  div.section-area-each {
    margin-bottom: 10px !important;
    /* padding: 12px 0 45px 0 !important; */
  }

  table.table02 > tbody > tr > td > div.section-area > .btn,
  table.table02 > tbody > tr > td > div.section-area-sp > .btn {
    top: inherit;
    bottom: 15px !important;
    left: 0;
    width: 100%;
  }
}

.h3-5,
.h3-5-02,
.h3-5-03,
.h3-5-04,
.h3-5-05,
.h3-5-06,
.h3-5-07,
.h3-5-08,
.h3-5-09,
.h3-5-10,
.h3-5-11,
.h3-5-12 {
  font-size: 1.19rem !important;
  padding: 0 0 5px 0;
  color: #123a68;
  font-weight: bold;
  line-height: 1.35;
  /* box-shadow: 1px 1px 2px rgb(179, 179, 179); */
  margin-bottom: 1rem;
  margin-top: 1rem;
  border-bottom: solid 3px #cce4ff;
  position: relative;
}

.h3-5:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #00bb85;
  bottom: -3px;
  width: 25%;
}

.h3-5-02:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #ff9500;
  bottom: -3px;
  width: 25%;
}

.h3-5-03:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #009bbf;
  bottom: -3px;
  width: 25%;
}

.h3-5-04:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #f62e36;
  bottom: -3px;
  width: 25%;
}

.h3-5-05:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #d7c447;
  bottom: -3px;
  width: 25%;
}

.h3-5-06:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #9b7cb6;
  bottom: -3px;
  width: 25%;
}

.h3-5-07:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #814721;
  bottom: -3px;
  width: 25%;
}

.h3-5-08:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #0078ba;
  bottom: -3px;
  width: 25%;
}

.h3-5-09:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #e85298;
  bottom: -3px;
  width: 25%;
}

.h3-5-10:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #019a66;
  bottom: -3px;
  width: 25%;
}

.h3-5-11:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #9caeb7;
  bottom: -3px;
  width: 25%;
}

.h3-5-12:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #363636;
  bottom: -3px;
  width: 25%;
}

ul.session {
  padding: 0 !important;
  margin: 0 !important;
}

ul.session li {
  list-style: none !important;
}

.session li.subject {
  font-size: 1.1rem !important;
  /* color: #000 !important; */
  letter-spacing: 0.05rem !important;
}

.session li.subject_sp {
  font-size: 1.1rem;
  font-weight: 600;
  /* color: #444; */
  letter-spacing: 0.05rem;
  background: #0079ba0a;
  padding: 0.5rem 0.5rem;
  display: block;
  line-height: 1.45;
}

.session li.subject_sp span {
  display: inline-block;
  margin-right: 0.5rem;
}

.session li.subject02 {
  font-size: 1rem;
  font-weight: bold;
  /* color: #5c5c5c; */
  letter-spacing: 0.05rem;
  padding-bottom: 0;
  margin-bottom: 0.15rem;
}

.session li.subject02 > dl {
  margin: 0 0 7px;
  padding: 0;
  display: flex;
}

.session li.subject02 > dl > dt {
  width: 3.25rem !important;
  font-weight: bold !important;
  font-size: 0.95rem;
  padding: 0.05rem 0 0;
  margin: 0;
  color: #009bbf !important;
  line-height: 1.45;
}

.session li.subject02 > dl > dd {
  width: calc(100% - 3.25rem) !important;
  padding: 0;
  margin: 0;
  line-height: 1.45;
}

.session li.subject02 > dl > dd > span {
  display: inline-block;
  margin-right: 0.5rem;
}

.session li.subject03 {
  font-size: 1rem;
  font-weight: bold;
  /* color: #5c5c5c; */
  letter-spacing: 0.05rem;
  padding-bottom: 0;
  margin-bottom: 0.15rem;
}

.session li.subject03 > dl {
  margin: 0;
  padding: 0;
  display: flex;
}

.session li.subject03 > dl > dt {
  width: 7rem !important;
  font-weight: normal !important;
  font-size: 0.95rem;
  padding: 0.05rem 0 0;
  margin: 0;
  color: #009bbf !important;
}

.session li.subject03 > dl > dd {
  width: calc(100% - 8.5rem) !important;
  padding: 0;
  margin: 0;
}

/* .session li.teacher {
  font-size: 1rem;
  padding: 0.75rem 0 0 0.75rem;
  line-height: 1.1 !important;
  letter-spacing: 0.15rem;
  color: #111;
} */

.session div li.teacher4 {
  font-size: 1rem !important;
  padding: 0 0 0.25rem 3.25rem !important;
  line-height: 1.35 !important;
  letter-spacing: 0.1rem !important;
  /* color: #111 !important; */
}

.session div li.teacher4 span {
  display: inline-block;
  font-size: clamp(0.844rem, 0.831rem + 0.06vw, 0.906rem);
  margin-right: 0.35rem;
  color: #7c7c7c;
  letter-spacing: -0.01rem;
}

@media (max-width: 576px) {
  .session li.subject02 > dl {
    display: initial;
  }
  .session li.subject02 > dl > dt {
    width: auto !important;
    margin: 0 0 5px;
  }

  .session li.subject02 > dl > dd {
    width: 100% !important;
  }
  .session div li.teacher4 {
    margin-top: 5px;
    padding: 0 0 0.25rem 0 !important;
  }
}

.session div li.teacher4 span:first-child {
  font-size: 1rem !important;
  color: #333 !important;
  letter-spacing: 0 !important;
  font-weight: 500 !important;
}

.session div li.teacher5 {
  font-size: 1rem !important;
  padding: 0 0 0.25rem 7rem !important;
  line-height: 1.1 !important;
  letter-spacing: 0.1rem !important;
  /* color: #111 !important; */
}

.session div li.teacher5 span {
  display: inline-block;
  font-size: 0.8rem !important;
  margin-right: 0.35rem;
  /* color: #555; */
}

.session div li.teacher5 span:first-child {
  font-size: 1rem !important;
  /* color: #111 !important; */
}

/* .session li.teacher span,
.session li.teacher2 span,
.session li.teacher3 span,
.session li.chairman span,
.session li.chairman02 span,
.session li.organizer span,
.session li.organizer02 span {
  font-size: 0.8rem !important;
  padding: 0 !important;
  color: #555 !important;
  letter-spacing: 0.05rem !important;
} */

.session li.performer {
  font-size: 1rem !important;
  padding: 0.75rem 0 0 0.75rem !important;
  line-height: 1.45 !important;
  letter-spacing: 0.1rem !important;
}

.session li.performer.spb-100 {
  padding-bottom: 25px !important;
}

.session li.performer > ol {
  margin: 0;
  padding: 0;
}

.session li.performer > ol > li:first-child > dl {
  display: flex;
  align-items: flex-start;
  margin: 0;
  padding: 0;
}

.session li.performer > ol > li:first-child > dl > dt,
.session li.performer > ol > li:first-child > dl > dd {
  width: calc(100% - 6.5rem) !important;
  line-height: 1.25;
  margin: 0;
  padding: 5px 0 5px 1rem;
}

.session li.performer > ol > li:first-child > dl > dt {
  width: 6.5rem !important;
  background: #3c3c3c;
  color: #fff !important;
  text-align: center;
  padding: 5px 0.55rem 5px;
  text-align: justify;
  text-align-last: justify;
  font-weight: 400;
  white-space: nowrap;
  font-size: 0.95rem !important;
}

.session li.performer > ol > li:first-child > dl > dt > span {
  font-weight: 300 !important;
  white-space: nowrap !important;
}

.session li.performer > ol > li:first-child > dl > dd > span {
  display: inline-block;
  font-size: clamp(0.844rem, 0.831rem + 0.06vw, 0.906rem);
  margin-right: 0.35rem;
  color: #7c7c7c;
  letter-spacing: -0.01rem;
}

.session li.performer > ol > li:first-child > dl > dd > span:first-child {
  font-size: 1rem !important;
  color: #333 !important;
  font-weight: 500 !important;
}

.session li.performer > ol > li {
  padding-left: 7.5rem;
  margin-bottom: 0.35rem;
}

.session li.performer > ol > li > span {
  display: inline-block;
  font-size: clamp(0.844rem, 0.831rem + 0.06vw, 0.906rem);
  margin-right: 0.35rem;
  color: #7c7c7c;
  letter-spacing: -0.01rem;
}

.session li.performer > ol > li > span:first-child {
  font-size: 1rem !important;
  color: #333 !important;
  font-weight: 500 !important;
}

.session li.performer > ol > li:first-child {
  padding-left: 0 !important;
}

@media (max-width: 576px) {
  .session li.performer > ol > li:first-child > dl {
    display: initial;
  }
  .session li.performer > ol > li:first-child > dl > dt,
  .session li.performer > ol > li:first-child > dl > dd {
    margin: 5px 0;
  }
  .session li.performer > ol > li:first-child > dl > dd {
    padding-left: 0;
  }
  .session li.performer > ol > li {
    padding-left: 0;
  }
}

table.table02 > tbody > tr > td > div.section-area.spb-200 {
  padding-bottom: 115px !important;
}

table.table02 > tbody > tr > td > div.section-area-sp.spb-100 {
  padding-bottom: 115px !important;
}

@media (max-width: 460px) {
  table.table02 > tbody > tr > td > div.section-area.spb-200 {
    padding-bottom: 180px !important;
  }

  table.table02 > tbody > tr > td > div.section-area-sp.spb-100 {
    padding-bottom: 180px !important;
  }
}
