@charset "utf-8";
/*--------------------------------------------------------------------------------

  lead

--------------------------------------------------------------------------------*/
.lead {
  background: url("../image/lead_bg.jpg") no-repeat right center;
  background-size: cover;
  position: relative;
}
.lead:before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  background: url("../image/lead.png?d=2026") no-repeat left center;
  position: absolute;
  left: 0;
  top: 0;
}
.lead_txt {
  display: none;
}
@media not (max-width: 640px) {
  .lead {
    height: 400px;
  }
}
@media (max-width: 640px) {
  .lead {
    --container-side-space: 0;
    padding-top: 45%;
  }
  .lead:before {
    background-position: -15%;
    background-size: contain;
  }
}

/*--------------------------------------------------------------------------------

  course

--------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------
  .course-tbl
--------------------------------------------------------------------------------*/
.course-tbl-scr {
  overflow-x: auto;
}
.course-tbl-scr .scroll-hint-icon {
  transform: translateX(50%);
}
.course-tbl {
  width: 100%;
  border-collapse: separate;
  border: 0;
}
.course-tbl thead th:first-child,
.course-tbl tbody th {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  left: 0;
}
.course-tbl th,
.course-tbl td {
  line-height: var(--lh-s);
  text-align: center;
  vertical-align: middle;
}
.course-tbl thead th,
.course-tbl tbody th {
  white-space: nowrap;
}
.course-tbl thead th {
  font-weight: inherit;
  padding: 0.75rem 1rem;
}
.course-tbl thead tr:first-child th:not(:first-child),
.course-tbl thead tr:not(:first-child) th:not(:first-child) {
  min-width: 200px;
}
.course-tbl thead tr:first-child th:not(:first-child):not(:last-child),
.course-tbl thead tr:not(:first-child) th:not(:first-child) {
  border-right: 1px solid var(--bg-color);
}
.course-tbl thead tr:not(:first-child) th:not(:first-child):not(:last-child) {
  border-right: 1px solid var(--border-color-dark);
}
.course-tbl thead th:first-child {
  background-color: var(--bg-color);
}
.course-tbl thead th.course-tbl_gp1,
.course-tbl thead th.course-tbl_gp2 {
  font-weight: 400;
  color: #FFF;
}
.course-tbl thead th.course-tbl_gp1 { background-color: var(--color-blue-light); }
.course-tbl thead th.course-tbl_gp2 { background-color: var(--color-pink-light); }
.course-tbl_gp1-2 { background-color: var(--bg-blue); }
.course-tbl tbody th {
  font-weight: 400;
  background-color: var(--bg-base-1);
  white-space: nowrap;
}
.course-tbl tbody td {
  background-color: #FFF;
  text-align: left;
  vertical-align: top;
  --list-rgap: 0.5rem;
}
.course-tbl tbody tr:not(:last-child) th {
  border-bottom: 1px solid var(--border-color-dark);
}
.course-tbl tbody tr:not(:last-child) td {
  border-bottom: 1px solid var(--border-color-dark);
}
.course-tbl tbody td:not(:last-child) {
  border-right: 1px solid var(--border-color-dark);
}
.course-tbl_gp1 .course-tbl_price { color: var(--color-blue); }
.course-tbl_gp2 .course-tbl_price { color: var(--color-pink); }
.course-tbl_price-yen { font-family: var(--ff-min); font-size: var(--fs-3m); font-weight: 500; }
.course-tbl_price-tax { font-family: var(--ff-min); font-size: var(--fs-2s); font-weight: 400; }
.course-tbl_bikou { font-size: var(--fs-s); padding-top: 0.5em; }
@media not (max-width: 640px) {
  .course-tbl tbody th,
  .course-tbl tbody td {
    padding: 1.25rem;
  }
}
@media (max-width: 640px) {
  .course-tbl {
    font-size: var(--fs-s);
  }
  .course-tbl tbody th,
  .course-tbl tbody td {
    padding: 1rem;
  }
}

/*--------------------------------------------------------------------------------

  price

--------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------
  .price-tbl
--------------------------------------------------------------------------------*/
.price-tbl-wrap {
  container-type: inline-size;
}
.price-tbl {
  width: 100%;
  border-collapse: collapse;
  line-height: var(--lh-s);
}
.price-tbl thead th {
  background-color: var(--color-base-lighter);
  color: #FFF;
  font-weight: 400;
  text-align: center;
  padding: 0.75rem;
}
.price-tbl tbody th,
.price-tbl tbody td {
  padding: 1.25rem;
}
.price-tbl tbody th {
  background-color: var(--bg-base-1);
  font-weight: 400;
}
.price-tbl tbody tr:not(:last-child) th,
.price-tbl tbody tr:not(:last-child) td {
  border-bottom: 1px solid var(--border-color);
}
.price-tbl tbody td {
  background-color: #FFF;
}
.price-tbl tbody tr td:first-of-type {
  text-align: left;
}
.price-tbl_1st th,
.price-tbl_1st td,
.price-tbl_clear {
  border-bottom: none !important;
}
.price-tbl_clear {
  background-color: transparent !important;
  text-align: left;
  padding-inline: 0 !important;
}
.price-tbl_price {
  text-align: right;
}
.price-tbl_price-yen {
  font-family: var(--ff-min);
  font-weight: 500;
  font-size: var(--fs-l);
  color: var(--color-blue);
}
.price-tbl_price-tax {
  font-family: var(--ff-min);
  font-weight: 400;
  font-size: var(--fs-2s);
  color: var(--color-blue);
  display: inline-block;
}
@media (max-width: 640px) {
  .price-tbl {
    font-size: min(4cqw, 1rem);
  }
  .price-tbl tbody th,
  .price-tbl tbody td {
    padding: 1rem;
  }
}
