@charset "utf-8";

/*================================================
AnchorButton
================================================*/

.AnchorButtonNormal {
  padding-bottom: 0px;
}
.AnchorButtonFix {
  position: fixed;
  z-index: 9999;
  width: 100%;
  height: auto;
  top: 0px;
  left: 0.1%;
  right: 0px;
  margin: auto;
}
.AnchorButton {
  width: 100%;
}
.AnchorButton nav {
  display: block;
  float: left;
  width: 100%;
  border-left: 1px #279739 solid;
}
.AnchorButton li {
  display: block;
  float: left;
  width: 16.6%;
  border-right: 1px #279739 solid;
  border-bottom: 5px solid #279739;
  text-align: center;
  font-size: 150%;
  box-sizing: border-box;
}
.AnchorButton span {
  display: block;
}
.AnchorButton .hidden {
  padding: 20px 0px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
.AnchorButton a {
  display: block;
  padding: 30px 0px;
  text-align: center;
  text-decoration: none;
}
.AnchorButton a:hover {
  opacity: 0.75;
  transition: all 0.3s ease;
  text-decoration: none;
}
.Off,
.Off:hover,
.Off:visited {
  background-color: #FEFDE9 !important;
  color: #269739 !important;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
}
.On,
.On:hover,
.On:visited {
  background-color: #269739 !important;
  color: #94CB9D !important;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
}

@media screen and (max-width: 1366px) {

  .AnchorButton nav {
    float: none;
    width: 100%;
  }
}

@media (min-width: 768px) and (max-width:1365px) { 

  .AnchorButton li {
    margin: 0px 0px 0px 0px;
    font-size: 125%;
  }
}

@media (max-width: 767px) {
  
  .AnchorButtonNormal {
    padding-bottom: 0px;
  }
  .AnchorButton nav {
    border-top: 1px #279739 solid;
  }
  .AnchorButton li {
    float: left;
    width: 50%;
    border-right: 1px #279739 solid;
    border-bottom: 1px solid #279739;
    text-align: center;
    font-size: 14px;
    box-sizing: border-box;
  }
  .AnchorButton a {
    padding: 7px 0px;
  }
  .AnchorButtonFix {
    position: static;
    width: 90%;
    margin-bottom: 50px;
  }
}

/*================================================
Firstview
================================================*/

.Firstview {
  width: 100%;
  padding: 50px 0px 0px 0px;
  background-color: #28973A;
  font-family: 'Noto Sans Japanese Thanks', sans-serif;
}
.FirstviewUpdateDay {
  display: block;
  width: 80%;
  margin: 0px auto 50px auto;
  background-color: #F1EA1F;
  color: #0A6A12;
  box-sizing: border-box;
}
.FirstviewUpdateDayTitle {
  display: block;
  margin-bottom: 5px;
  text-align: center;
  line-height: 1.25;
  font-size: 18px;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
}
.FirstviewUpdateDayRight {
  display: block;
  margin-bottom: 10px;
  text-align: right;
  line-height: 1.25;
  font-size: 14px;
  font-family: 'Noto Sans Japanese Thanks', sans-serif;
}
.FirstviewUpdateDayText {
  display: block;
  text-align: justify;
  text-justify: inter-ideograph;
  line-height: 1.50;
  font-size: 16px;
  font-family: 'Noto Sans Japanese Thanks', sans-serif;
}
.FirstviewInner {
  width: 80%;
  margin: 0px auto;
  background-color: #28973A;
}

@media screen and (max-width: 1366px) {

  .FirstviewUpdateDay {
    width: 96%;
  }
  .FirstviewInner {
    width: 96%;
  }
}

@media (max-width: 767px) {

  .Firstview {
    padding: 20px 0px 0px 0px;
  }
  .FirstviewUpdateDay {
    width: 100%;
    margin: 0px auto 10px auto;
  }
  .FirstviewUpdateDayTitle {
    font-size: 15px;
  }
  .FirstviewUpdateDayRight {
    margin-bottom: 15px;
    font-size: 12px;
  }
  .FirstviewUpdateDayText {
    font-size: 13px;
  }
  .FirstviewInner {
    width: 100%;
  }
}

/*================================================
Intro
================================================*/

.Intro {
  float: left;
  width: 40%;
  padding: 50px 0px 100px 0px;
}
.IntroMainTitle {
  margin-bottom: 50px;
}
.IntroMainTitle img {
  width: 100%;
  height: auto;
}
.IntroSubTitle {
  border-top: 5px #FFFFFF solid;
  border-left: 5px #FFFFFF solid;
  border-right: 5px #FFFFFF solid;
  padding: 5px 0px;
  text-align: center;
  line-height: 1.25;
  letter-spacing: 10px;
  color: #0A6A12;
  background-color: #FFFFFF;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  font-size: 32px;
  box-sizing: border-box;
}
.IntroGetTeams {
  margin-bottom: 10px;
  border: 5px #FFFFFF solid;
  padding: 20px;
  text-align: center;
  line-height: 1.25;
  background-color: #3EA24E;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  font-size: 20px;
  box-sizing: border-box;
}
.IntroGetTeams dt {
  display: inline-block;
  margin-bottom: 10px;
  padding: 10px 20px;
  border-radius: 25px;
  text-align: center;
  line-height: 1.25;
  background-color: #FFFFFF;
  color: #3EA24E;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  font-size: 20px;
  box-sizing: border-box;
}
.IntroGetTeams dd {
  line-height: 1.75;
  letter-spacing: 3px;
  color: #FFFFFF;
  font-size: 22px;
}
.IntroGetTeams dd span {
  padding-bottom: 8px;
  background: url("../img/intro_get_teams_wave.png") bottom repeat-x;
  background-size: 30px; 
  color: #f1ea1f;
  text-shadow:
    #0A6A12 2px 0px,
    #0A6A12 -2px 0px,
    #0A6A12 0px -2px,
    #0A6A12 0px 2px,
    #0A6A12 2px 2px,
    #0A6A12 -2px 2px,
    #0A6A12 2px -2px,
    #0A6A12 -2px -2px,
    #0A6A12 1px 2px,
    #0A6A12 -1px 2px,
    #0A6A12 1px -2px,
    #0A6A12 -1px -2px,
    #0A6A12 2px 1px,
    #0A6A12 -2px 1px,
    #0A6A12 2px -1px,
    #0A6A12 -2px -1px;
  font-size: 26px;
}
.IntroAttention {
  line-height: 1.75;
  color: #FFFFFF;
  font-size: 13px;
}

@media screen and (max-width: 1366px) {

  .IntroSubTitle {
    padding: 7px 0px;
    letter-spacing: 5px;
    font-size: 24px;
  }
  .IntroGetTeams {
    padding: 15px;
    font-size: 16px;
  }
  .IntroGetTeams dt {
    padding: 7px 16px;
    font-size: 16px;
  }
  .IntroGetTeams dd {
    line-height: 1.75;
    font-size: 16px;
  }
  .IntroGetTeams dd span {
    font-size: 20px;
  }
  .IntroAttention {
    line-height: 1.75;
    font-size: 12px;
  }
}

@media (max-width: 767px) {

  .Intro {
    float: none;
    width: 90%;
    margin: 0px auto;
    padding: 20px 0px;
  }
  .IntroMainTitle {
    margin-bottom: 20px;
  }
  .IntroSubTitle {
    font-weight: bold;
  }
}

@media (max-width: 320px) {

  .IntroGetTeams dd {
    font-size: 18px;
  }
  .IntroGetTeams dd span {
    font-size: 22px;
  }
}

/*================================================
Schedule
================================================*/

.Schedule {
  position: relative;
  float: left;
  width: 54%;
  margin-left: 6%;
  padding: 50px 0px;
  background-image: url("../img/schedule_back.png");
  background-size: contain;
  background-repeat: no-repeat;
  color: #FFFFFF;
}
.TimingA, .TimingB, .TimingC, .TimingD {
  color: #FFFFFF;
}

@media (max-width: 767px) {

  .Schedule {
    position: static;
    float: none;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    padding: 0px 5% 50px 5%;
    background-image: url("../img/schedule_back_sp.png");
    background-size: contain;
    background-position: top right;
    background-repeat: no-repeat;
  }
}

.ScheduleTitle,
.ScheduleTiming p,
.ScheduleTiming span {
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
}
.TimingA, .TimingB, .TimingC, .TimingD {
  display: block;
  box-sizing: border-box;
}
.ScheduleToCourseListLeft {
  display: block;
  padding-top: 10px;
  border-top: 3px #94CD9D solid;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  background-color: #28973A;
  color: #94CD9D;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  box-sizing: border-box;
}
.ScheduleToCourseListRight {
  display: block;
  padding-top: 10px;
  border-top: 3px #94CD9D solid;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  background-color: #28973A;
  color: #94CD9D;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  box-sizing: border-box;
}
.ScheduleToCourseListLeft:hover,
.ScheduleToCourseListRight:hover,
.ScheduleToCourseListLeft:visited,
.ScheduleToCourseListRight:visited {
  text-decoration: none;
  color: #94CD9D;
}
.ScheduleToCourseListKome {
  margin-left: 5px;
  font-size: 75%;
}
.ScheduleUnderAttention {
  color: #FFFFFF;
  font-size: 90%;
}
.ScheduleUnderAttention span {
  margin-right: 5px;
}
.ScheduleToFormulaArrow {
  width: 50px;
  height: 160px;
  background-image: url("../img/schedule_to_formula_arrow.png");
  background-repeat: no-repeat;
}
.ScheduleToFormula {
  border: 1px solid #F1EA1F;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  color: #FFFFFF;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  box-sizing: border-box;
}
.ScheduleToFormulaInner {
  background-color: #F1EA1F;
  color: #28973A;
}

@media (min-width:1920px) and (max-width:9999px) {

  .ScheduleTitle { position: absolute; z-index: 0; top: 5%; left: 20%; font-size: 200%; }
  .ScheduleUpperAttention { position: absolute; z-index: 0; top: 10%; left: 20%; font-size: 75%; color: #FFFFFF; }
  .ScheduleTiming { position: absolute; z-index: 0; top: 15%; left: 3%; }
  .ScheduleTiming p { font-size: 275%; }
  .ScheduleTiming span { font-size: 50%; }
  .TimingA, .TimingB, .TimingC, .TimingD { float: left; margin: 0px 45px; }
  .ScheduleToCourseListLeft { display: block; position: absolute; z-index: 0; bottom: 28%; left: 0%; width: 25%; font-size: 100%; }
  .ScheduleToCourseListRight { display: block; position: absolute; z-index: 0; bottom: 28%; right: 2%; width: 25%; font-size: 100%; }
  .ScheduleToCourseListSquare { display: block; margin-top: 10px; padding: 2%; border: 5px solid #94CB9D; font-size: 125%; }
  .ScheduleUnderAttention { position: absolute; z-index: 0; bottom: 3%; right: 0%; }
  .ScheduleToFormulaArrow { position: absolute; z-index: 0; bottom: 16%; left: 50%; right: 50%; }
  .ScheduleToFormula { display: block; position: absolute; z-index: 0; bottom: -25px; left: -5%; right: 5%; width: 35%; margin: auto; font-size: 125%; }
  .ScheduleToFormulaInner { margin: 6px; padding: 10px 20px; border: 5px solid #28973A; outline: 5px solid #F1EA1F; outline-offset: 0px; }

}

@media (min-width:1600px) and (max-width:1919px) {

  .ScheduleTitle { position: absolute; z-index: 0; top: 5%; left: 20%; font-size: 200%; }
  .ScheduleUpperAttention { position: absolute; z-index: 0; top: 10%; left: 20%; font-size: 75%; }
  .ScheduleTiming { position: absolute; z-index: 0; top: 13%; left: 3%; }
  .ScheduleTiming p { font-size: 200%; }
  .ScheduleTiming span { font-size: 50%; }
  .TimingA, .TimingB, .TimingC, .TimingD { float: left; margin: 0px 40px; }
  .ScheduleToCourseListLeft { display: block; position: absolute; z-index: 0; bottom: 26%; left: 0%; width: 25%; font-size: 100%; }
  .ScheduleToCourseListRight { display: block; position: absolute; z-index: 0; bottom: 26%; right: 2%; width: 25%; font-size: 100%; }
  .ScheduleToCourseListSquare { display: block; margin-top: 10px; padding: 2%; border: 5px solid #94CB9D; font-size: 125%; }
  .ScheduleUnderAttention { position: absolute; z-index: 0; bottom: 3%; right: 0%; }
  .ScheduleToFormulaArrow { position: absolute; z-index: 0; bottom: 14%; left: 50%; right: 50%; }
  .ScheduleToFormula { display: block; position: absolute; z-index: 0; bottom: -25px; left: -10%; right: 10%; width: 40%; margin: auto; font-size: 125%; }
  .ScheduleToFormulaInner { margin: 6px; padding: 10px 20px; border: 5px solid #28973A; outline: 5px solid #F1EA1F; outline-offset: 0px; }

}

@media (min-width:1440px) and (max-width:1599px) {

  .ScheduleTitle { position: absolute; z-index: 0; top: 4%; left: 20%; font-size: 200%; }
  .ScheduleUpperAttention { position: absolute; z-index: 0; top: 9%; left: 20%; font-size: 75%; }
  .ScheduleTiming { position: absolute; z-index: 0; top: 11%; left: 3%; }
  .ScheduleTiming p { font-size: 175%; }
  .ScheduleTiming span { font-size: 50%; }
  .TimingA, .TimingB, .TimingC, .TimingD { float: left; margin: 0px 35px; }
  .ScheduleToCourseListLeft { display: block; position: absolute; z-index: 0; bottom: 34%; left: 0%; width: 25%; font-size: 100%; }
  .ScheduleToCourseListRight { display: block; position: absolute; z-index: 0; bottom: 34%; right: 2%; width: 25%; font-size: 100%; }
  .ScheduleToCourseListSquare { display: block; margin-top: 10px; padding: 2%; border: 5px solid #94CB9D; font-size: 100%; }
  .ScheduleUnderAttention { position: absolute; z-index: 0; bottom: 3%; right: -5%; }
  .ScheduleToFormulaArrow { position: absolute; z-index: 0; bottom: 28%; left: 50%; right: 50%; }
  .ScheduleToFormula { display: block; position: absolute; z-index: 0; bottom: -25px; left: -15%; right: 15%; width: 50%; margin: auto; font-size: 125%; }
  .ScheduleToFormulaInner { margin: 6px; padding: 10px 20px; border: 5px solid #28973A; outline: 5px solid #F1EA1F; outline-offset: 0px; }

}

@media (min-width:1366px) and (max-width:1439px) {

  .ScheduleTitle { position: absolute; z-index: 0; top: 4.5%; left: 20%; font-size: 200%; }
  .ScheduleUpperAttention { position: absolute; z-index: 0; top: 9%; left: 20%; font-size: 75%; }
  .ScheduleTiming { position: absolute; z-index: 0; top: 12%; left: 2%; }
  .ScheduleTiming p { font-size: 150%; }
  .ScheduleTiming span { font-size: 50%; }
  .TimingA, .TimingB, .TimingC, .TimingD { float: left; margin: 0px 42px; }
  .ScheduleToCourseListLeft { display: block; position: absolute; z-index: 0; bottom: 35%; left: 0%; width: 25%; font-size: 100%; }
  .ScheduleToCourseListRight { display: block; position: absolute; z-index: 0; bottom: 35%; right: 2%; width: 25%; font-size: 100%; }
  .ScheduleToCourseListSquare { display: block; margin-top: 10px; padding: 2%; border: 5px solid #94CB9D; font-size: 100%; }
  .ScheduleUnderAttention { position: absolute; z-index: 0; bottom: 3%; right: 0%; }
  .ScheduleToFormulaArrow { position: absolute; z-index: 0; bottom: 22%; left: 50%; right: 50%; }
  .ScheduleToFormula { display: block; position: absolute; z-index: 0; bottom: -25px; left: -20%; right: 20%; width: 50%; margin: auto; font-size: 125%; }
  .ScheduleToFormulaInner { margin: 6px; padding: 10px 20px; border: 5px solid #28973A; outline: 5px solid #F1EA1F; outline-offset: 0px; }

}

@media (min-width:1280px) and (max-width:1365px) {

  .ScheduleTitle { position: absolute; z-index: 0; top: 4%; left: 20%; font-size: 200%; }
  .ScheduleUpperAttention { position: absolute; z-index: 0; top: 9%; left: 20%; font-size: 75%; }
  .ScheduleTiming { position: absolute; z-index: 0; top: 14%; left: 3%; }
  .ScheduleTiming p { font-size: 225%; }
  .ScheduleTiming span { font-size: 50%; }
  .TimingA, .TimingB, .TimingC, .TimingD { float: left; margin: 0px 40px; }
  .ScheduleToCourseListLeft { display: block; position: absolute; z-index: 0; bottom: 36%; left: 0%; width: 25%; font-size: 85%; }
  .ScheduleToCourseListRight { display: block; position: absolute; z-index: 0; bottom: 36%; right: 2%; width: 25%; font-size: 85%; }
  .ScheduleToCourseListSquare { display: block; margin-top: 10px; padding: 2%; border: 5px solid #94CB9D; font-size: 95%; }
  .ScheduleUnderAttention { position: absolute; z-index: 0; bottom: 3%; right: 0%; }
  .ScheduleToFormulaArrow { position: absolute; z-index: 0; bottom: 16%; left: 50%; right: 50%; }
  .ScheduleToFormula { display: block; position: absolute; z-index: 0; bottom: -25px; left: -20%; right: 20%; width: 50%; margin: auto; font-size: 100%; }
  .ScheduleToFormulaInner { margin: 6px; padding: 10px 20px; border: 5px solid #28973A; outline: 5px solid #F1EA1F; outline-offset: 0px; }

}

@media (min-width:1024px) and (max-width:1279px) {

  .ScheduleTitle { position: absolute; z-index: 0; top: 4%; left: 20%; font-size: 150%; }
  .ScheduleUpperAttention { position: absolute; z-index: 0; top: 8%; left: 20%; font-size: 75%; }
  .ScheduleTiming { position: absolute; z-index: 0; top: 12%; left: 3%; }
  .ScheduleTiming p { font-size: 125%; }
  .ScheduleTiming span { font-size: 50%; }
  .TimingA, .TimingB, .TimingC, .TimingD { float: left; margin: 0px 35px; }
  .ScheduleToCourseListLeft { display: block; position: absolute; z-index: 0; bottom: 40%; left: 0%; width: 25%; font-size: 75%; }
  .ScheduleToCourseListRight { display: block; position: absolute; z-index: 0; bottom: 40%; right: 2%; width: 25%; font-size: 75%; }
  .ScheduleToCourseListSquare { display: block; margin-top: 10px; padding: 2%; border: 5px solid #94CB9D; font-size: 85%; }
  .ScheduleUnderAttention { position: absolute; z-index: 0; bottom: 3%; right: 0%; }
  .ScheduleToFormulaArrow { position: absolute; z-index: 0; bottom: 18%; left: 40%; right: 60%; }
  .ScheduleToFormula { display: block; position: absolute; z-index: 0; bottom: -25px; left: -30%; right: 30%; width: 50%; margin: auto; font-size: 85%; }
  .ScheduleToFormulaInner { margin: 6px; padding: 10px 20px; border: 5px solid #28973A; outline: 5px solid #F1EA1F; outline-offset: 0px; }

}

@media (min-width: 768px) and (max-width:1023px) {

  .ScheduleTitle { position: absolute; z-index: 0; top: 2%; left: 20%; font-size: 125%; }
  .ScheduleUpperAttention { position: absolute; z-index: 0; top: 6%; left: 20%; font-size: 75%; }
  .ScheduleTiming { position: absolute; z-index: 0; top: 9%; left: 3%; }
  .ScheduleTiming p { font-size: 100%; }
  .ScheduleTiming span { font-size: 25%; }
  .TimingA, .TimingB, .TimingC, .TimingD { float: left; margin: 0px 30px; }
  .ScheduleToCourseListLeft { display: block; position: absolute; z-index: 0; bottom: 44%; left: 0%; width: 25%; font-size: 75%; }
  .ScheduleToCourseListRight { display: block; position: absolute; z-index: 0; bottom: 44%; right: 2%; width: 25%; font-size: 75%; }
  .ScheduleToCourseListSquare { display: block; margin-top: 10px; padding: 2%; border: 5px solid #94CB9D; font-size: 85%; }
  .ScheduleUnderAttention { position: absolute; z-index: 0; bottom: 3%; right: 0%; }
  .ScheduleToFormulaArrow { position: absolute; z-index: 0; bottom: 18%; left: 40%; right: 60%; }
  .ScheduleToFormula { display: block; position: absolute; z-index: 0; bottom: -25px; left: -40%; right: 40%; width: 50%; margin: auto; font-size: 75%; }
  .ScheduleToFormulaInner { margin: 6px; padding: 10px 20px; border: 5px solid #28973A; outline: 5px solid #F1EA1F; outline-offset: 0px; }

}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {

  .ScheduleTitle { position: absolute; z-index: 0; top: 2%; left: 20%; font-size: 125%; }
  .ScheduleUpperAttention { position: absolute; z-index: 0; top: 6%; left: 20%; font-size: 75%; }
  .ScheduleTiming { position: absolute; z-index: 0; top: 10%; left: 3%; }
  .ScheduleTiming p { font-size: 125%; }
  .ScheduleTiming span { font-size: 50%; }
  .TimingA, .TimingB, .TimingC, .TimingD { float: left; margin: 0px 25px; }
  .ScheduleToCourseListLeft { display: block; position: absolute; z-index: 0; bottom: 44%; left: 0%; width: 25%; font-size: 75%; }
  .ScheduleToCourseListRight { display: block; position: absolute; z-index: 0; bottom: 44%; right: 2%; width: 25%; font-size: 75%; }
  .ScheduleToCourseListSquare { display: block; margin-top: 10px; padding: 2%; border: 5px solid #94CB9D; font-size: 85%; }
  .ScheduleUnderAttention { position: absolute; z-index: 0; bottom: 3%; right: 0%; }
  .ScheduleToFormulaArrow { position: absolute; z-index: 0; bottom: 28%; left: 40%; right: 60%; }
  .ScheduleToFormula { display: block; position: absolute; z-index: 0; bottom: 50px; left: 0%; right: 0%; width: 50%; margin: auto; font-size: 85%; }
  .ScheduleToFormulaInner { margin: 6px; padding: 10px 20px; border: 5px solid #28973A; outline: 5px solid #F1EA1F; outline-offset: 0px; }

}

@media (min-width: 481px) and (max-width: 767px) {

  .ScheduleTitle { display: none; }
  .ScheduleUpperAttention { display: none; }
  .ScheduleTiming { position: static; top: auto; left: auto; }
  .ScheduleTiming p { font-size: 175%; }
  .ScheduleTiming span { font-size: 50%; }
  .TimingA, .TimingB, .TimingC, .TimingD { float: none; margin: 0px 0px 0px 0px; padding: 10% 0px 0% 0px; }
  .ScheduleToCourseListLeft { display: none; }
  .ScheduleToCourseListRight { display: none; }
  .ScheduleToCourseListSquare { display: none; }
  .ScheduleUnderAttention { display: none; }
  .ScheduleToFormulaArrow { display: none; }
  .ScheduleToFormula { display: none; }
  .ScheduleToFormulaInner { display: none; }

}

@media (min-width:   1px) and (max-width: 480px) {

  .ScheduleTitle { display: none; }
  .ScheduleUpperAttention { display: none; }
  .ScheduleTiming { position: static; top: auto; left: auto; }
  .ScheduleTiming p { font-size: 175%; }
  .ScheduleTiming span { font-size: 50%; }
  .TimingA, .TimingB, .TimingC, .TimingD { float: none; margin: 0px 0px 0px 0px; padding: 10% 0px 0% 0px; }
  .ScheduleToCourseListLeft { display: none; }
  .ScheduleToCourseListRight { display: none; }
  .ScheduleToCourseListSquare { display: none; }
  .ScheduleUnderAttention { display: none; }
  .ScheduleToFormulaArrow { display: none; }
  .ScheduleToFormula { display: none; }
  .ScheduleToFormulaInner { display: none; }

}

/*================================================
Formula
================================================*/

.Formula {
  padding: 50px 0px;
  background-color: #F1EA1F;
  border-top: 1px solid #28973A;
  outline: 1px solid #f1ea1f;
}
.FormulaInner {
  width: 85%;
  margin: 0px auto;
  box-sizing: border-box;
}
.FormulaTitle {
  margin-bottom: 50px;
  line-height: 1.25;
  text-align: center;
  color: #28973A;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  font-size: 200%;
}
.FormulaExampleA {
  float: left;
  width: 46%;
  margin-right: 3%;
  padding: 0% 3% 0% 0%;
  border-right: 1px solid #28973A;
  box-sizing: border-box;
}
.FormulaExampleB {
  float: left;
  width: 50%;
  padding: 0% 0% 0% 0%;
  box-sizing: border-box;
}

@media screen and (max-width: 1366px) {

  .FormulaInner {
    width: 90%;
  }
  .FormulaTitle {
    margin-bottom: 50px;
    font-size: 150%;
  }
}

@media (max-width: 767px) {

  .Formula {
    padding: 30px 0px;
  }  
  .FormulaInner {
    width: 90%;
  }
  .FormulaTitle {
    margin-bottom: 30px;
    font-size: 150%;
    font-weight: bold;
  }
  .FormulaExampleA {
    float: none;
    width: 100%;
    margin-right: 0%;
    padding: 0% 0% 0% 0%;
    border-right: 0px solid #28973A;
  }
  .FormulaExampleB {
    float: none;
    width: 100%;
    padding: 0% 0% 0% 0%;
  }
}

/*================================================
FormulaExampleA (Left)
================================================*/

.FormulaExampleTextA,
.FormulaExampleTextB {
  float: left;
  width: 40%;
  margin-right: 5%;
}
.FormulaExampleTextA dt,
.FormulaExampleTextB dt {
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px #3EA14D solid;
  line-height: 1.5;
  color: #28973A;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  font-size: 175%;
}
.FormulaExampleTextA dt img,
.FormulaExampleTextB dt img {
  margin-right: 10px;
}
.FormulaExampleTextA dd,
.FormulaExampleTextB dd {
  margin-bottom: 20px;
  text-align: justify;
  text-justify: inter-ideograph;
  line-height: 1.5;
  color: #28973A;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  font-size: 100%;
}
.FormulaExampleImageA,
.FormulaExampleImageB {
  float: left;
  width: 55%;
}
.FormulaExampleImageA figure,
.FormulaExampleImageB figure {
  margin-bottom: 50px;
}
.FormulaExampleImageA figure img,
.FormulaExampleImageB figure img {
  width: 100%;
  height: auto;
}
.FormulaExampleImageAttentionA {
  clear: both;
  display: inline-block;
  padding: 0px; border: 1px #28973A solid;
  font-family: 'Noto Sans Japanese Thanks', sans-serif;
}
.FormulaExampleImageAttentionA img {
  display: block;
  float: left;
  margin-right: 7px;
  line-height: 1.0;
}
.FormulaExampleImageAttentionA span {
  float: left;
  line-height: 1.75;
  color: #28973A;
  font-size: 100%;
}

@media (min-width:768px) and (max-width:1365px) {

  .FormulaExampleTextA,
  .FormulaExampleTextB {
    float: none;
    width: 100%;
    margin-right: 0%;
  }
  .FormulaExampleTextA dt,
  .FormulaExampleTextB dt {
    font-size: 150%;
  }
  .FormulaExampleImageA,
  .FormulaExampleImageB {
    float: none;
    width: 100%;
  }
  .FormulaExampleImageAttentionA {
    margin-bottom: 50px;
    padding: 10px;
  }
}

@media (max-width: 767px) {

  .FormulaExampleTextA,
  .FormulaExampleTextB {
    float: none;
    width: 100%;
    margin-right: 0%;
  }
  .FormulaExampleTextA dt,
  .FormulaExampleTextB dt {
    font-size: 150%;
    font-weight: bold;
  }
  .FormulaExampleTextA dt img,
  .FormulaExampleTextB dt img {
    width: 67px;
    height: 33px;
    margin-right: 10px;
  }
  .FormulaExampleTextA dd,
  .FormulaExampleTextB dd {
    margin-bottom: 10px;
    font-size: 100%;
  }
  .FormulaExampleImageA,
  .FormulaExampleImageB {
    float: none;
    width: 100%;
  }
  .FormulaExampleImageA figure,
  .FormulaExampleImageB figure {
    margin-bottom: 20px;
  }
  .FormulaExampleImageAttentionA {
    margin-bottom: 50px;
    padding: 10px;
  }
}

/*================================================
FormulaExampleB (Right)
================================================*/

.FormulaExampleImageAttentionB {
  display: block;
  clear: both;
  width: 100%;
}
.FormulaExampleImageAttentionB aside {
  display: block;
  float: left;
  width: 15%;
  padding: 0% 2%;
  text-align: right;
  color: #279739;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  font-size: 125%;
  box-sizing: border-box;
}
.FormulaExampleImageAttentionB span {
  display: block;
  float: left;
  width: 85%;
  padding: 2%;
  color: #FFFFFF;
  text-align: justify;
  text-justify: inter-ideograph;
  line-height: 1.50;
  background-color: #279739;
  font-family: 'Noto Sans Japanese Thanks', sans-serif;
  font-size: 95%;
  box-sizing: border-box;
}

@media (max-width: 767px) {

  .FormulaExampleImageAttentionB span {
    padding: 5%;
    font-size: 85%;
  }
}

/*================================================
CourseList
================================================*/

.CourseList {
  padding: 100px 0px;
  font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
}
.CourseListInner {
  width: 80%;
  margin: 0px auto;
}
.CourseListMainTitle {
  width: 96%;
  padding: 10px 2%;
  line-height: 1.25;
  text-align: center;
  background-color: #279739;
  color: #FFFFFF;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  font-size: 150%;
}
.CourseListSubTitle {
  margin-bottom: 30px;
  padding: 10px 0px;
  line-height: 1.25;
  text-align: center;
  color: #279739;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  font-size: 125%;
}

@media screen and (max-width: 1366px) {

  .CourseListInner {
    width: 90%;
    margin: 0px auto;
  }
}

@media (max-width: 767px) {

  .CourseList {
    padding: 30px 0px;
  }
  .CourseListInner {
    width: 90%;
  }
  .CourseListMainTitle {
    font-size: 125%;
    font-weight: bold;
  }
  .CourseListSubTitle {
    margin-bottom: 30px;
    font-size: 100%;
  }
}

/*================================================
CourseListBig
================================================*/

.CourseListBig {
  clear: both;
  width: 96%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 30px;
}
.CourseListBigTitle {
  clear: both;
  width: 99.70%;
  margin-bottom: 30px;
  padding: 20px 0px 24px 0px;
  text-align: center;
  background-color: #269739;
  color: #FEFDE9;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  font-size: 32px;
}
.CourseListBig li {
  float: left;
  width: 32%;
  margin-right: 1%;
  margin-bottom: 1%;
  border: 1px #279739 solid;
  background-color: #FEFDE9;
}
.CourseListBig li a {
  display: block;
  width: 100%;
  padding: 8%;
  color: #0A6A12;
  text-decoration: none;
  box-sizing: border-box;
}
.CourseListBig li a:hover {
  opacity: 0.75;
  transition: all 0.3s ease;
}
.CourseListName {
  display: block;
  width: 100%;
  height: 50px;
  margin-bottom: 5px;
  font-size: 18px;
  font-weight: bold;
  line-height: 1.4em;
}
.CourseListRoot {
  display: block;
  width: 100%;
  height: 50px;
  margin-bottom: 5px;
  padding-top: 5px;
  border-top: 1px #279739 solid;
  font-size: 12px;
  line-height: 1.4em;
}
.CourseListKen {
  display: block;
  width: 30%;
  margin-left: auto;
  margin-right: 0px;
  background-color: #279739;
  color: #FEFDE9;
  text-align: center;
  font-size: 14px;
}
.CourseListInterKm {
  display: block;
  width: 100%;
  margin-bottom: 5px;
  font-size: 12px;
}
.CourseListPhoto {
  display: block;
  width: 100%;
  margin-bottom: 0px;
}
.CourseListButton {
  display: none;
}

@media (max-width: 1024px) {
  
  .CourseListBig {
    clear: both;
    width: 100%;
    margin-bottom: 20px;
  }
  .CourseListBig li {
    float: none;
    width: 90%;
    margin: 0px auto 2% auto;
  }
  .CourseListBig li a {
    padding: 5%;
  }
  .CourseListPhoto {
    width: 100%;
    height: auto;
  }
  .CourseListButton {
    background-position: 90% 45%;
  }
  .CourseListName, .CourseListRoot {
    height: auto;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {

  .CourseListBig li {
    float: left;
    width: 32%;
    margin-right: 1%;
    margin-bottom: 1%;
    border: 1px #279739 solid;
    background-color: #FEFDE9;
  }
}

@media (max-width: 767px) {

  .CourseListBigTitle {
    clear: both;
    width: 100%;
    padding: 14px 0px 14px 0px;
    border-right: 1px solid #269739;
    background-color: #269739;
    font-size: 20px;
    font-weight: bold;
  }
}

/*================================================
CourseListMini
================================================*/

.CourseListMini {
  width: 100%;
  margin: 0px auto;
}
.CourseListMiniHalf {
  float: left;
  width: 46%;
  padding: 2%;
}
.CourseListMini li {
  padding: 2% 2% 0% 1em;
  line-height: 1.25;
  list-style: none;
  text-indent: -1em;
}
.CourseListMini li:before {
  content: "\25b6\00a0";
}
.CourseListMini li a {
  color: #004912;
}
.CourseListMini li a:hover {
  text-decoration: none;
}
.Pref {
  margin-bottom: 30px;
}
.PrefName {
  margin-bottom: 10px;
  padding: 2%;
  background-color: #0c943f;
  color: #FFFFFF;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  font-size: 20px;
}

@media (max-width: 767px) {
  
  .CourseListMini {
    width: 100%;
  }
  .CourseListMini li {
    padding: 2% 2% 0% 2%;
    text-indent: 0em;
    font-size: 14px;
  }
  .CourseListMini li:before {
    content: "";
  }
  .CourseListMini li a {
    display: block;
    padding: 2%;
    border-top: 1px #279739 solid;
    border-left: 8px #279739 solid;
    border-right: 1px #279739 solid;
    border-bottom: 1px #279739 solid;
    background-color: #FEFDE9;
    text-decoration: none;
  }
  .CourseListMiniHalf {
    float: none;
    width: 94%;
    padding: 3%;
  }
  .Pref {
    margin-bottom: 10px;
  }
  .PrefName {
    text-align: center;
  }
}

/*================================================
Detail
================================================*/

.Detail {
  margin: 0px auto;
  font-family: 'Noto Sans Japanese Thanks', sans-serif;
}
.DetailInner {
  width: 90%;
  margin: 0px auto;
}
.DetailTitle {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 50px; border: 1px solid #279739;
  line-height: 2.25;
  color: #279739;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  font-size: 20px;
}
.DetailTitle img {
  margin-right: 10px;
  vertical-align: middle;
}

@media (max-width: 767px) {

  .DetailTitle {
    margin-bottom: 10px;
    font-weight: bold;
  }
}

/*================================================
CampaignDetail
================================================*/

.CampaignDetail {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 50px; border: 1px #279739 solid;
  border-collapse: collapse;
  line-height: 1.5;
  font-size: 15px;
}
.CampaignDetail tr {
  width: 100%;
  line-height: 1.75;
}
.CampaignDetail th {
  width: 20%;
  padding: 10px;
  border-right: 1px #279739 solid;
  border-bottom: 1px #279739 solid;
  background-color: #FEFDE9;
  text-align: left;
  color: #269739;
  vertical-align: top;
}
.CampaignDetail td {
  width: 80%;
  padding: 10px;
  border-bottom: 1px #279739 solid;
  vertical-align: top;
}
.CampaignDetailRed {
  color: #CC0000;
  font-family: 'Noto Sans Japanese Thanks Bold', sans-serif;
  font-weight: normal;
}
.Pochi {
  list-style-type: circle;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: 1em;
  padding-left: 0.5em;
  text-indent: -0.25em;
  font-size: 16px;
  font-weight: bold;
}
.Kome {
  padding-left: 1em;
  text-indent: -1em;
}
.Kome:before {
  content: "\203B";
}

@media (max-width: 767px) {
  
  .CampaignDetail {
    width: 100%;
    margin: 0px auto 20px auto;
    border-top: 1px #279739 solid;
    border-left: 1px #279739 solid;
    border-right: 1px #279739 solid;
    border-bottom: none;
    font-size: 14px;
  }
  .CampaignDetail tr {
    width: 100%;
    line-height: 1.75;
  }
  .CampaignDetail th {
    display: block;
    width: 96%;
    padding: 2%;
    border-right: none;
    text-align: center;
  }
  .CampaignDetail td {
    display: block;
    width: 96%;
    padding: 2%;
  }
  .CampaignDetail td img {
    width: 100%;
    height: auto;
  }
}

/*================================================
PagetopFix
================================================*/

.PagetopFix {
  position: fixed;
  z-index: 9999;
  width: 64px;
  height: 64px;
  right: 40px;
  bottom: 20px;
}
.PagetopFix a img {
  width: 64px;
  height: 64px;
}
.PagetopFix a {
  display: block;
  text-decoration: none;
  color: #FFFFFF;
  font-weight: bold;
  transition: all 0.3s ease;
}
.PagetopFix a:hover {
  opacity: 0.5;
  transition: all 0.3s ease;
}

@media (max-width: 767px) {

  .PagetopFix {
    right: 10px;
    bottom: 10px;
    width: 48px;
    height: 48px;
  }
  .PagetopFix a img {
    width: 48px;
    height: 48px;
  }
}

/*================================================
Parallel
================================================*/

.Parallel {
  width: 100%;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

/*================================================
clearfix
================================================*/

.clearfix:before,
.clearfix:after {
  content: "";
  display: table;
}
.clearfix:after {
  clear: both;
}
.clearfix {
  *zoom: 1;
}

/*================================================
display on / off
================================================*/

.pc {
  display: block;
}
.sp {
  display: none;
}
.js-lazy { min-height: auto !important; }

@media (max-width: 767px) {

  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
}

/*================================================
Web Font
================================================*/

.Meiryo { font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; }
.Mincho { font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; }
.Bold { font-weight: bold; }
