.modal {
  display: none;
  position: fixed;
  z-index: 2;
  left: 0;
  top: 0;
  height: 100vh;
  width: 100%;
  overflow: auto;
  background-color: rgba(0,0,0,0.5);
}

.modal-content {
  background-color: #F68A36;
  width: 62.5vw;
  height: 41.667vw;
  border-radius: 1.615vw;
  margin: 0 auto;
  top: 55%;
  transform: translateY(-50%);
  display: flex;
  animation-name: modalopen;
  animation-duration: 1s;
  position: relative;
  z-index: 99;
}

@keyframes modalopen {
  from {opacity: 0}
  to {opacity: 1}
}

.modal-header h1 {
  margin: 1rem 0;
}

.modal-img {
  display: block;
  width: 28.646vw;
}

.modal-img img {
  height: auto;
  width: 100%;
}

.modalClose {
  font-size: 2rem;
}

.modalClose:hover {
  cursor: pointer;
}

.modal-body {
  width: 28.802vw;
  margin: 2.5vw;
  color: black;
  overflow-y: scroll;
}

.modal-body > div {
  padding-bottom: 1.042vw;
  color: #fff;
}

.modal-body > div::after {
  content: "";
  display: block;
  width: 27.083vw;
  filter: opacity(0.5);
}

.modal-body > div p:first-of-type {
  font-size: 0.833vw;
  padding-bottom: 0.729vw;
  display: flex;
  align-items: center;
  justify-content: start;
}

.modal-body > div p:first-of-type::before {
  content: "";
  display: block;
  margin-right: 0.573vw;
  width: 4.167vw;
  border-top: 1px solid #fff;
}

.modal-body > div p:last-of-type {
  font-size: 1.042vw;
  padding-bottom: 1.198vw;
  line-height: 1.563vw;
}

.modal-body > div p:last-of-type span {
  font-size: 0.729vw;
}

.modalClose {
  position: absolute;
  font-size: 2.604vw;
  top: -1.302vw;
  right: -0.573vw;
  color: #fff;
  border-radius: 0.521vw;
  z-index: 100;
}

.modalClose::before {
  position: absolute;
  background-color: #000;
  content: "";
  width: 4.167vw;
  height: 4.167vw;
  display: block;
  z-index: -10;
  top: -0.573vw;
  right: -1.146vw;
  border-radius: 2.865vw;
}

.modalClose:hover {
  cursor: pointer;
}

/* courseのmodal */
.course-modal {
  width: 100%;
  height: 100vh;
  background-color: rgba(0,0,0,0.5);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 3;
  overflow: auto;
  visibility: hidden;
}

.modalClose-course {
  position: absolute;
  font-size: 50px;
  display: block;
  top: calc(50vh - 320px);
  right: calc(50vw - 550px);
  color: #fff;
  border-radius: 10px;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  z-index: 100;
  cursor: pointer;
}

.modalClose-course::before {
  position: absolute;
  background-color: #000;
  content: "";
  width: 80px;
  height: 80px;
  display: block;
  z-index: -10;
  top: -11px;
  right: -22px;
  border-radius: 55px;
}

.course-modal > div {
  width: 1100px;
  height: 700px;
  border-radius: 1.615vw;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  background-color: #FFEF9D;
  position: absolute;
  overflow-y: scroll;
}

.course-modal > div > h3 {
  font-family: "mplu-bold";
  font-size: 2.083vw;
  letter-spacing: 0.05em;
  line-height: 2.24vw;
  text-align: center;
  color: #ef822d;
  width: fit-content;
  margin: 0 auto 2.865vw;
  padding: 2.604vw 0 0;
}

.course-modal > div > h3::after {
  content: "";
  display: block;
  background-image: url(../images/modal-dottod-class.svg);
  background-size: contain;
  width: 13.958vw;
  height: 0.313vw;
  margin: 0 auto;
  margin-top: 0.521vw;
}

.modal-course::after {
  content: "";
  display: block;
  background-image: url(../images/modal-dottod-text.svg);
  background-size: contain;
  width: 50vw;
  height: 0.313vw;
}

.modal-course,
.modal-item {
  width: 50vw;
  margin: 0 auto;
}

.modal-course li:nth-of-type(2n + 1) {
  font-size: 1.242vw;
  line-height: 1.198vw;
  text-align: left;
  color: #ef822d;
  padding-bottom: 0.781vw;
  font-family: "mplu-bold";
}

.modal-course li:nth-of-type(2n) {
  font-size: 0.833vw;
  font-family: "mplu-regular";
  line-height: 1.563vw;
  text-align: left;
  color: #222;
  padding-bottom: 2.865vw;
}

.modal-course-three {
  display: flex;
}

.modal-course-three p {
  padding-right: 0.521vw;
}

.course-detail{
  font-size: 1.033vw;
  font-family: mplu-bold;
}

.old-detail{
  font-family: mplu-medium;
}

.modal-item {
  padding-bottom: 3.906vw;
}

.modal-item > li {
  font-size: 0.833vw;
}

.modal-item > li::after {
  content: "";
  display: block;
  background-image: url(../images/modal-dottod-text.svg);
  background-size: contain;
  height: 0.313vw;
  margin-top: 1.302vw;
}
/*
.modal-item > li:nth-child(5)::before {
  content: "";
  display: block;
  background-image: url(../images/modal-dottod-text.svg);
  background-repeat: no-repeat;
  background-size: contain;
  height: 0.313vw;
  padding-top: 1.302vw;
}
*/
.modal-item > li:not(:nth-of-type(4)) {
  padding-top: 1.302vw;
}

.modal-item > li > span:first-of-type {
  font-size: 0.938vw;
  line-height: 1.25vw;
  text-align: left;
  color: #222;
  font-weight: 500;
  font-family: "mplu-medium";
}

.modal-item > li:nth-of-type(4) {
  padding-top: 1.302vw;
}
/*
.modal-item > li:nth-of-type(4) > span:first-of-type {
  margin-right: 10.625vw;
  padding: 4.167vw 0;
  display: block;
}

.modal-item > li:nth-of-type(5) > span:first-of-type,
.modal-item > li:nth-of-type(6) > span:first-of-type {
  padding-right: 9.688vw;
}

.monthly-fee {
  display: flex;
  flex-flow: column;
  height: 10.417vw;
  justify-content: space-evenly;
}

.monthly-fee > li > span:first-of-type {
  line-height: 1.25vw;
  color: #ef822d;
}

.monthly-fee > li:first-of-type > span:first-of-type {
  margin-right: 8.281vw;
}

.monthly-fee > li:nth-of-type(2) > span:first-of-type {
  margin-right: 1.615vw;
}

.monthly-fee > li:last-of-type > span:first-of-type {
  margin-right: 7.448vw;
}
*/
.monthly-flex{
  display: flex;
}
.monthly-padding{
  padding: 3.667vw 0;
}
.monthly-padding2{
  padding: 1.467vw 0;
}
.monthly-fee {
  display: flex;
  flex-flow: column;
  justify-content: space-between;
}
.padding-delete{
  padding-top: 0 !important;
}
.text-weight {
  font-weight: 500;
  font-size: 1.458vw;
  font-family: "mont-medium";
}

.text-margin {
  font-size: 0.729vw;
  margin-left: 0.781vw;
}

.modal-event2021{
  margin-bottom: 13px;
  font-size: 1.042vw;
}
/*
.modal-lesson{
  width: 50vw;
  margin: 0 auto;
  font-size: 0.833vw;
  font-family: "mplu-regular";
  line-height: 1.563vw;
  text-align: left;
  margin-bottom: 70px;
}
*/

.modal-words2{
  padding-right: 10.625vw;
}

.modal-words3{
  padding-right: 9.688vw;
}

.modal-words6{
  padding-right: 6.875vw;
}

.modal-words8{
  padding-right: 5.75vw;
}

.modal-words13{
  padding-right: 3.45vw;
}

.monthly-words5{
  padding-right: 10vw;
}

.monthly-words8{
  padding-right: 3.5vw;
}

.monthly-words16{
  padding-right: 2vw;
}

.monthly-words18{
  padding-right: 1vw;
}

.monthly-words-course1{
  padding-right: 8.5vw;
}

.monthly-words-course2{
  padding-right: 2.2vw;
}

.monthly-words-course3{
  padding-right: 11.1vw;
}

.monthly-words-course4{
  padding-right: 6.95vw;
}

.monthly-words-course5{
  padding-right: 7.95vw;
}

.monthly-words-course6{
  padding-right: 6.95vw;
}

.pv-lesson,.semipv-lesson{
  color: #222;
  font-size: .942vw;
  font-family: "mplu-bold";
}