/* --------- common --------- */
.forSp {
  display: none;
}
@media screen and (max-width: 767px) {
  .forSp {
    display: block;
  }
}

.prospectusStep  {
  position: relative;
    width: 100vw;
    left: 50%;
    transform: translateX(-50%);
}
#contents .prospectusStep h2 {
  margin-top: 0;
  margin-bottom: 0;
}
/* --------- lead --------- */
.procedureContent--mokuji {
  text-align: center;
  margin-top: 50px!important;
  padding-bottom: 50px!important;
}
#contents .procedureContent--mokuji h4 {
  margin: 1.2em 0;
}
.pageInNav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 40px;
}
@media screen and (max-width: 767px) {
  .reskillLogo {
    text-align: center;
  }
  .reskillLogo img {
    width: 200px;
  }
  .procedureContent--mokuji {
    text-align: left;
    padding-bottom: 24px!important;
  }
  .pageInNav {
    flex-direction: column;
    gap: 15px;
  }
}
/* --------- overview --------- */

#contents #OVERVIEW h3 {
  font-size: 1.2em;
  margin-bottom: 0.3em;
}
.tableContent {
  max-width: 1032px;
  width: 90%;
  margin: 0 auto;
}
#contents .basicTable {
  width: 100%;
  margin: 2em 0 1em;
  background: #fff;
  border-collapse: collapse;
  border: 1px solid #c9c9c9;
  font-size: 12px;
  line-height: 1.6;
}
#contents .basicTable thead {
  background: #f1f1f1;
      font-weight: bold;
}
#contents table thead tr th {
    color: #4d4d4d;
    font-weight: bold;
  
}
#contents table thead tr th.colorRed {
    color: #f03b3b;
}
.basicTable tr {
  border: 1px solid #c9c9c9;
}
.basicTable tr th, .basicTable tr td {
  border-right: 1px solid #c9c9c9;
  padding: 10px;
}
.basicTable tr td:nth-child(n+3){
  text-align: right;
}
.basicTable .w15 {
  width: 15%;
}
.basicTable .w20 {
  width: 20%;
}
.basicTable .w50 {
  /* width: 50%; */
}
.basicTable .bg01 {
  background: #fae4e4;
}
.basicTable .bg02 {
  background: #e1ebf5;
}
.basicTable .bg03 {
  background: #e2efda;
}
.basicTable .bg04 {
  background: #fff2cc;
}
.basicTable .bg05 {
  background: #f2f2f2;
}
.basicTable .bg06 {
  background: #e8e8ff;
}
.basicTable a {
  color: currentColor;
  font-weight: bold;
}
.basicTable a:hover {
  opacity: .7;
  transition: .3s all;
}
.notes>li {
  font-size: 11px;
  padding-left: 1em;
  text-indent: -1em;
}
@media print, screen and (max-width: 768px) {
  .tableScroll {
    overflow-x: auto;
  }
  .basicTable {
    min-width: 680px;
  }
}

@media print, screen and (min-width: 769px) {
  #contents .basicTable {
    font-size: 14px;
  }
  .notes>li {
    font-size: 12px;
  }
}
/* --------- eligibility --------- */
#contents .eligibilityContent h3 {
  margin-bottom: 0;
  font-size: 1.2em;
}


/* --------- PROCEDURE --------- */
.procedureContent {
  margin-top: 20px;margin-bottom: 80px;padding: 24px;background-color: #fff5ee;
}
.procedureContent--blue {
  background-color: #eefff2;
}
.procedureContent__head {
  margin-bottom: 50px;
}
#contents #PROCEDURE h3 {
  font-size: 1.2em;
}
#contents .procedureContent__head h3 {
  font-size: 1.2em;
  margin: 1em 0 0.3em;
}
#contents .procedureContent h3 {
  font-size: 1.2em;
}
.stepWrapper {
  display: flex;
  padding-bottom: 50px;
  margin-bottom: 50px;
  border-bottom: dashed 1px #ddd;
}
.procedureContent .stepWrapper:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
}
.stepNum {
  display: flex;
  align-items: center;
  gap: 0.5em;
  font-size: 80%;
  
}
.stepNum .spantext {
      background-color: #f7701b;
      color: #fff;
      padding: 0 1em;
}
.stepText {
  padding-right: 70px;
  width: calc(100% - 370px);
}
.stepWrapper.noImage .stepText {
  width: 100%;
}
#contents .stepText h3 {
  margin: 1em 0;
}
.stepImage {
  width: 370px;
  flex-shrink: 0;
}
.stepImage img {
  width: 100%;
}
.goalHeading {
  text-align: center;
  margin: 50px 0;
}
#contents .goalHeading h3 {
  font-size: 1.2em;
  margin: 0;
}
@media screen and (max-width: 767px) {
  .stepWrapper {
    flex-direction: column;
    gap: 20px;
  }
  .stepText {
    padding-right: 0;
    width: 100%;
  }
  .stepImage {
    width: 100%;
    max-width: 400px;
  }
}

/* --------- FAQ --------- */
.listDot .layoutSolid {
  width: 100%;
}
#contents .listDot li:before {
  display: none;
}
@media screen and (max-width: 767px) {
    #contents .listDot .layoutSolid {
        padding: 0;
    }
   .listDot .list5 {
  padding: 0;
} 
}