ul,
li {
  margin: 0;
  padding: 0;
}

#new-cul {
  background-color: #fffff6;
  margin-bottom: 40px;
  padding: 40px 0;
}

.new-cul-cnt {
  width: 900px;
  margin: 0 auto;
}

.new-cul-ttl {
  margin: 15px 0;
  font-size: 30px;
  position: relative;
  padding-left: 166px;
  padding-top: 2px;
}
.new-point-icon {
  width: 170px;
  height: 106px;
  clip-path: polygon(0 1%, 100% 0, 66% 100%, 0% 100%);
  position: absolute;
  top: -1px;
  left: 0px;
  background-color: var(--main-color);
  display: flex;
  justify-content: center;
  align-items: center;
}
.new-point-icon p {
  color: white;
  font-size: 30px;
  font-weight: bold;
  line-height: 0.9;
  margin-left: -36px;
}

.new-cul-ttl-att {
  font-size: 40px;
  color: var(--main-color);
}
.new-cul-subtxt {
  font-size: 18px;
  margin: 5px auto;
}
.new-cul-teacher-box {
  margin-bottom: 10px;
}
.new-cul-course {
  margin: 0 auto;
  width: 800px;
  padding: 15px;
  border: 2px solid var(--main-color);
  border-radius: 15px;
  background-color: #fff;
}
.new-cul-course-ttl {
  font-size: 26px;
  text-align: left;
  border-bottom: solid 1px #000;
  width: 80%;
}

.new-cul-teacher-item {
  display: flex;
  width: 750px;
  margin: 0 auto;
  margin-bottom: 5px;
}

.new-cul-teacher-img {
  width: 100px;
}

.new-cul-item-container {
  width: 650px;
}

.new-cul-info-box {
  background-color: #009380;
  display: flex;
  padding: 5px;
  align-items: center;
  padding-left: 20px;
}

.new-cul-top-adj {
  line-height: 1.2;
  padding-top: 9px;
}

.new-cul-teacher-name {
  text-align: center;
  color: white;
  font-size: 22px;
  margin-left: 20px;
}

.new-cul-subject-name {
  background-color: white;
  font-weight: bold;
  font-size: 25px;
  width: 120px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  margin-right: 15px;
}

.new-cul-teacher-item-container{
  width: 650px;
}

.english-color {
  color: #d8c11a;
}

.math-back {
  background-color: #3e75cf;
}

.japanese-back {
  background-color: #fe68c1;
}

.social-back {
  background-color: #7ACCA5;
}

.new-cul-teacher-info-box {
  display: flex;
  padding: 5px;
  align-items: center;
  padding-left: 20px;
}

.new-cul-teacher-name-att {
  font-weight: bold;
}

.new-cul-explain {
  padding-left: 20px;
  padding-top: 5px;
}

.new-cul-system-ttl {
  margin-top: 15px;
  text-align: center;
  font-size: 30px;
  color: var(--main-color);
}

.new-cul-qa-icon {
  width: 35px;
  height: 35px;
  background-color: var(--main-color);
  border-radius: 50%;
  line-height: 1.8em;
  text-align: center;
  font-weight: bold;
  color: #fff;
}

.new-cul-qa-ttl {
  font-size: 20px;
  margin-left: 15px;
}

.new-cul-a-ttl {
  font-size: 20px;
  margin-left: 15px;
  width: 85%;
}

.new-cul-qa-item {
  position: relative;
  border-bottom: 1px solid #000;
  width: 850px;
  margin: 0 auto;
}

.new-cul-qa-item:before,
.new-cul-qa-item:after {
  content: "";
  position: absolute;
  top: 40px;
  right: 5px;
  width: 20px;
  height: 1px;
  background-color: #000000;
  transition: all 0.5s ease-in-out;
}

.new-cul-qa-item:before {
  transform: rotate(90deg);
}
.new-cul-qa-item.js-new-cul-qa-open:before {
  transform: rotate(540deg);
}

.new-cul-qa-item.js-new-cul-qa-open:after {
  opacity: 0;
}

.new-cul-q,
.answer-flex {
  width: 98%;
  margin: 0 auto;
  padding: 15px 0;
  display: flex;
  justify-content: flex-start;
}

.new-cul-q {
  align-items: center;
}
.new-cul-answer-link {
  display: block;
  text-align: right;
  color: #01034f;
}
.new-cul-a {
  display: none;
}

.js-new-cul-qa-showed {
  display: block;
}


/*ここから先追加*/
.counter-title {
  color: var(--main-color);
  text-align: center;
  margin: 20px 0px;
}

.counter-subtitle-box {
  width: 900px;
  margin: 0 auto;
  background-color: #f2f1f1;
}

.counter-subtitle {
  padding-left: 40px;
  position: relative;
}

.counter-subtitle::before {
  content: "";
  position: absolute;
  left: 0;
  background-color: var(--main-color);
  width: 7px;
  height: 45px;
}

.counter-supplement {
  color: var(--sub-color);
  font-size: 25px;
  margin: 5px auto;
  margin-left: 60px;
}
.countermeasure-box {
  width: 1000px;
  margin: 0 auto;
}

.counter-center-box {
  display: flex;
  width: 900px;
  margin: 0 auto;
  background-color: var(--main-color);
  justify-content: space-evenly;
}

.counter-point {
  width: 230px;
  background-color: #fff;
  position: relative;
  border-radius: 10px;
  margin: 15px 30px;
  text-align: center;
  box-shadow: 5px 5px 3px #000000;
  padding: 10px 5px 20px;
}

.counter-point-text {
  font-weight: bold;
  text-align: center;
  font-size: 22px;
  position: absolute;
  top: -6%;
  text-shadow: 1px 1px 0 #fff, -1px -1px 0 #fff, -1px 1px 0 #fff,
    1px -1px 0 #fff, 0px 1px 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff, 1px 0 0 #fff;
  left: 50%;
  transform: translateX(-50%);
}

.counter-point-img {
  width: 160px;
  margin-top: -9px;
}

.counter-point-text-big {
  font-size: 26px;
}

.counter-point-maintext {
  font-size: 24px;
  font-weight: bold;
  line-height: 1.1;
  height: 57px;
}

.counter-point-subtext {
  line-height: 1.2;
  font-size: 19px;
}

.counter-back-triangle {
  width: 0;
  height: 0;
  border-style: solid;
  margin: 0 auto;
  border-width: 80px 450px 0 450px;
  border-color: var(--main-color) transparent transparent transparent;
  position: relative;
}
.counter-back-triangle::before {
  content: "３つの力は東進で伸ばすことができます";
  position: absolute;
  top: -65px;
  right: -220px;
  color: white;
  width: 462px;
  font-size: 25px;
  font-weight: bold;
  text-shadow: 2px 2px 0 var(--main-color), -2px -2px 0 var(--main-color),
    -2px 2px 0 var(--main-color), 2px -2px 0 var(--main-color),
    0px 2px 0 var(--main-color), 0 -2px 0 var(--main-color),
    -2px 0 0 var(--main-color), 2px 0 0 var(--main-color);
  background: linear-gradient(transparent 50%, #fcff00 50%);
}
.lecture-box {
  width: 850px;
  margin: 30px auto;
  border: solid 2px var(--main-color);
  border-radius: 10px;
  background-color: #ffffff;
  padding: 20px;
}
.new-course-teacher-box {
  width: 700px;
  margin: 10px auto 20px;
  display: flex;
  justify-content: space-between;
}

.course-teacher-item {
  position: relative;
  width: 140px;
}

.course-teacher-subject {
  font-size: 20px;
  font-weight: bold;
  text-align: left;
}

.course-tantou-name {
  text-shadow: 2px 2px 0 white, -2px -2px 0 white, -2px 2px 0 white,
    2px -2px 0 white, 0px 2px 0 white, 0 -2px 0 white, -2px 0 0 white,
    2px 0 0 white;
  position: absolute;
  font-size: 24px;
  bottom: -10px;
  z-index: 1;
  right: 40px;
}
.counter-lec-ttl {
  font-weight: bold;
  font-size: 30px;
  background-image: linear-gradient(
    to right,
    #000,
    #000 15px,
    transparent 0px,
    transparent 0px
  );
  background-size: 20px 3px;
  background-position: left bottom;
  background-repeat: repeat-x;
  width: 800px;
  margin-bottom: 5px;
}

.lec-annotation {
  font-size: 15px;
  margin-top: 5px;
}
.counter-sum-msg-mid-box {
  margin: 0 auto;
  text-wrap: nowrap;
}
.counter-sum-msg-att {
  color: #00937e;
  margin-top: 10px;
  text-align: center;
  font-weight: bold;
  font-size: 35px;
}
.counter-toshin-img-box {
  display: flex;
  justify-content: center;
  width: 150px;
}
.counter-name-att {
  font-weight: 900;
  font-size: 30px;
  text-decoration: underline;
  color: #4d4dd7;
}

.experience-box {
  width: 800px;
  text-align: center;
  margin: 0 auto;
}

.all-about-title {
  width: 100%;
  background-color: #33a999;
  color: white;
  font-size: 25px;
  text-align: center;
  font-weight: bold;
  margin: 0 auto 15px auto;
}
.counterm-gaikan-box {
  width: 330px;
  text-align: center;
  font-weight: bold;
  font-size: 19px;
}
.mini-text {
  font-size: 80%;
}
.counterm-taisaku-box {
  width: 480px;
  background-color: #f4f4f4;
  padding: 11px 5px;
}

.bg-ash {
  background-color: #f4f4f4;
  padding: 11px 5px;
}
.counterm-gaikan-ex-txt {
  width: 500px;
}

.text-attention-red {
  color: #ed2853;
  font-size: 120%;
}

.all-about-upper-text {
}

.all-about-img {
  width: 250px;
  margin: 5px 0;
}
.new-cur-rich {
  width: 850px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  padding: 5px 10px;
}
.counterm-taisaku-class-list {
  width: 95%;
  border: solid #f02954 2px;
  border-radius: 10px;
  margin: 0 auto;
  padding: 3px 0px 3px 10px;
  background-color: white;
  position: relative;
}
.counterm-taisaku-class-list::after {
  content: "";
  width: 135px;
  height: 135px;
  border-radius: 50%;
  border: solid #f02954 3px;
  background-color: white;
  position: absolute;
  right: 0px;
  top: -100px;
}
.counterm-taisaku-class-list::before {
  content: "";
  width: 135px;
  height: 135px;
  border-radius: 50%;
  background-color: white;
  position: absolute;
  right: 0px;
  top: -100px;
}
.taisaku-popup-txt {
  position: absolute;
  z-index: 2;
  width: 120px;
  height: 100px;
  right: -7px;
  top: -81px;
  font-size: 19.5px;
  line-height: 1.2;
}
.taisaku-popup-txt::after {
  content: "";
}
.taisaku-popup-att {
  color: #f02954;
}
.counterm-taisaku-class-name-adj {
  font-size: 80%;
}
.couterm-taisaku-exp {
  margin-left: 10px;
}

.all-about-bottom-img {
  width: 450px;
}

.teacher-intro-title {
  margin: 10px 0 1px 0;
  font-size: 30px;
  font-weight: bold;
  text-align: center;
}
.teacher-intro-title span {
  font-size: 150%;
  color: #00937e;
}
.teacher-intro-item {
  display: flex;
  width: 750px;
  margin: 0 auto;
  margin-bottom: 5px;
}
.teacher-intro-item-container {
  width: 650px;
}

.teacher-img {
  width: 100px;
}
.countm-teacher-name {
  text-align: center;
  color: white;
  font-size: 22px;
  margin-left: 20px;
}
.english-back {
  background-color: #d8c11a;
}
.japanese-back {
  background-color: #fe68c1;
}
.math-back {
  background-color: #3e75cf;
}
.info-back {
  background-color: #424f71;
}
.english-color {
  color: #d8c11a;
}
.japanese-color {
  color: #fe68c1;
}
.social-color {
  color: #7ACCA5;
}
.math-color {
  color: #3e75cf;
}
.info-color {
  color: #424f71;
}
.counterm-last-adj {
  margin-bottom: 15px;
}
.counterm-explain-top-adj {
  line-height: 1.2;
  padding-top: 9px;
}
.course-teacher-display {
  width: 80%;
  margin-left: 200%;
}
.counter-toshin-img-box {
  display: flex;
  justify-content: center;
  width: 150px;
}
.counter-sum-msg-cnt {
  background-color: #fff;
    border-radius: 15px;
    width: 100%;
    align-items: center;
    padding: 1rem;
    margin: 20px auto;
    width: 1000px;
    text-align: center;
}

.

.new-cul-test-overview h2 {
  font-size: 1.5rem;
  margin-bottom: 15px;
  background-color: var(--main-color);
  color: white;
  padding: 10px;
  border-radius: 10px;
  width: fit-content;
  margin: 20px 0;
}

.new-cul-test-overview ul {
  list-style: none;
  padding: 10px 10px 10px 10px;
  border: solid 3px var(--main-color);
  background-color: white;
}
.new-cul-test-overview ul li {
  margin-bottom: 10px;
  font-weight: bold;
}

.new-cul-test-number {
  font-size: 1.5em;
  color: var(--main-color);
}

.new-cul-test-points {
  background-color: #FFFFFF;
  border: 2px solid var(--main-color); /* 緑色ボーダー */
  padding: 15px;
  border-radius: 10px;
  color: #000;
}

.new-cul-points-header {
  font-weight: bold;
  font-size: 25px;
  color: #000;
}

.new-cul-points-details {
  font-size: 20px;
  width: 80%;
  color: #000;
  display: flex;
  margin: 10px auto;
  justify-content: space-evenly;
}

.new-cul-test-key {
  font-size: 25px;
  font-weight: bold;
  color: #000;
}

.new-cul-test-key span {
  font-size: 2em;
}

.new-cul-test-items {
  font-size: 25px;
  width: 80%;
  color: #000;
  display: flex;
  margin: 10px auto;
  justify-content: space-evenly;
}

.new-ucl-test-items-span span{
  color: red;
  padding: 3px 8px;
  border-radius: 5px;
  font-size: 1.5em;
  margin-left: 5px;
  font-weight: bold;
  background: linear-gradient(transparent 50%, #ffff00 10%);
}

.new-cul-test-intro{
  margin-top: 10px;
  text-align: center;
}

.new-cul-test-intro::after {
  content: "";
  display: block;
  width: 0; 
  height: 0;
  margin: 10px auto;
  border-left: 30px solid transparent;
  border-right: 30px solid transparent; 
  border-top: 30px solid red;
  animation: scale-animation 3s infinite;
}

@keyframes scale-animation {
  0%, 100% {
    transform: scale(1); /* 初期サイズ */
  }
  50% {
    transform: scale(1.2); /* 拡大サイズ */
  }
}

.new-cul-tab-button {
  padding: 10px 20px;
  margin: 5px 5px 0 5px;
  cursor: pointer;
  border: 1px solid #ccc;
  background-color: #f9f9f9;
}

.new-cul-tab-button[data-tab="tab-english"].active {
  background-color: #FCB814;
}

.new-cul-tab-button[data-tab="tab-math"].active {
  background-color: #0089CF;
}

.new-cul-tab-button[data-tab="tab-info"].active {
  background-color: #434F70;
}

.new-cul-tab-button.active {
  font-weight: bold;
}

.new-cul-tab{
  display: flex;
  background-color: #ffffff;
  margin-top: -20px;
  border: solid 3px var(--main-color);
  border-top: none;
  width: 100%;
}

.new-cul-tab-content {
  margin: 20px;
  width: 100%;
}

.new-cul-tab-button-cnt {
  display: flex;
  flex-wrap: wrap;
  margin:20px 0;
}
.new-cul-tab-button-cnt:after {
  content: '';
  width: 100%;
  height: 3px;
  background: var(--main-color);
  display: block;
  order: -1;
}
.new-cul-tab-button {
  color: #fff;
  background: #d3d3d3;
  font-size: 20px;
  text-shadow: 0 -1px 0 rgba(0,0,0,.2);
  white-space: nowrap;
  text-align: center;
  padding: 10px .5em;
  order: -1;
  position: relative;
  z-index: 1;
  cursor: pointer;
  border-radius: 5px 5px 0 0;
  flex: 1;
  margin: 5px 5px 0 5px;
  border: 1px solid #ccc;
}
.new-cul-tab-button:not(:last-of-type) {
  margin-right: 5px;
}
.new-cul-tab-ttl{
  font-size: 25px;
  text-align: center;
  color: #fff;
  font-weight: bold;
  width: fit-content;
  padding: 0 50px;
}
.new-cul-tab-subttl {
  padding: 20px;
  font-size: 25px;
  font-weight: bold;
}
.new-cul-tab-subttl span{
  color: red;
}
.new-cul-tab-content[id="tab-english"] .new-cul-tab-ttl{
  background-color: #FCB814;
}

.new-cul-tab-content[id="tab-math"] .new-cul-tab-ttl{
  background-color: #0089CF;
}

.new-cul-tab-content[id="tab-info"] .new-cul-tab-ttl{
  background-color: #434F70;
}
.new-cul-tab-dtl-cnt {
  display: flex;
  align-items: center;
}
.new-cul-tab-dtl {
  font-size: 19px;
  line-height: 4.5;
}
.new-cul-tab-dtl span{
  font-weight: bold;
  font-size: 1.2em;
}
.new-cul-tab-content img {
  display: block;
  width: 500px;
}
.new_cul_img{
  width: 300px;
  display: block;
  text-align: center;
}

.new_cul_ing_box{
  justify-content: space-evenly;
  display: flex;
  width: 720px;
  margin: 0 auto;
}

.guideline-container {
  margin: 0 auto;
  border: solid 5px var(--submain-color);
  border-radius: 10px;
  border-spacing: 0;
  border-collapse: inherit;
  margin-top: 15px;
}

.guideline-flex {
  display: flex;
}

.guideline-margin {
  border-bottom: solid 2px var(--submain-color);
  height: auto;
}

.guideline-left-text {
  text-align: center;
  color: #ffffff;
  font-size: 28px;
  font-weight: bold;
  background-color: #009380;
  width: 160px;
  border-bottom: solid 1px #ffffff;
}

.guideline-right-text {
  width: 600px;
  text-align: left;
  font-size: 20px;
  padding: 10px 0 10px 40px;
  border-bottom: solid 1px var(--submain-color);
}

.red {
  color: #ff0000;
}

.bold {
  font-weight: bold;
}

.guideline-big {
  font-size: 22px;
}

.guideline-days-text {
  font-weight: normal;
  font-size: 22px;
}

.guideline-small {
  font-size: 18px;
}

.days-ul {
  padding: 0 0 0 3vw;
}

.guideline-inbitation-text {
  font-weight: bold;
  font-size: 6vw;
  text-align: center;
  color: #ff0000;
  margin-top: 2vw;
  margin-bottom: -1vw;
}

.guideline-bottom-place {
  text-align: start;
  font-size: 4vw;
  padding: 2vw 3vw;
}

.guideline-corona {
  font-size: 18px;
  text-align: start;
}

.youkou-title {
  text-align: center;
  position: absolute;
  font-size: 54px;
  top: -30px;
  left: 50%;
  transform: translateX(-50%);
  color: var(--main-color);
}

.youkou-title-box {
  position: relative;
  width: 890px;
  height: 70px;
  margin: -70px auto 0;
}

.youkou-title-girl {
  position: absolute;
  width: 285px;
  top: -244px;
  left: 2%;
}

.corona-box {
  width: 750px;
  margin: 30px auto 0;
}

.youkou-title-background {
  height: 200px;
}

.youkou-title-text {
  position: relative;
  left: 42%;
  width: 550px;
  height: auto;
  transform: translateY(-220%);
}

.font-winter {
  font-size: 50px;
}

.guideline-big-text {
  font-size: 1.15em;
}

.guideline-small-text {
  font-size: 0.8em;
}

.youkou-text-small {
  font-size: .8em;
}

:root {
  --submain-color: #009380; /* 例: 青色 */
}

.spacer-m {
  height: 50px;
}

.new-cul-img-box{
  display: flex;
    justify-content: space-evenly;
    width: 80%;
    margin: 0 auto;
}

/* .background-gray{
  background-color: #f0f0f0; */
  padding-bottom: 1rem;
  padding-top: 1rem;
}
.kouza-box{
  font-family: Consolas, 'I-OTFゴシックオールドStd E', monospace;
  font-weight: 900;
}
.kouza-background-color{
  background-color: #FFFEF9;
  padding: 20px 2px 20px 2px;
  padding-bottom: 10px;
}
.kouza-top-container{
  display: flex;
  justify-content: space-around; 
  letter-spacing: 2px;
}
.kouza-attention-txt-1{
  color: #FD9903;
  font-size: 18px;
  font-weight: normal;
  /* text-shadow: 0 0 1px #FD9903; */
}
.kouza-attention-txt-1 span-1{
  color:#FF6000;
  font-size: 18px;
  font-weight: normal;
}
.kouza-attention-txt-1 span{
  font-size: 21px;
}
.kouza-attention-txt-2{
  color:#FF6000;
  font-size: 18px;
  font-weight: normal;
  /* text-shadow: 0 0 1px #FF6000; */
}
.kouza-attention-txt-2 span{
  font-size: 21px;
}
.kouza-point-img-1{
  width: 104px;
  height: auto;
  margin-left: 3vh;
}
.kouza-explain-container{
  display: flex;
  justify-content: space-between;
  margin-top: 0px;
}
.kouza-class-img{
  width: 420px;
  height: 280px;
  margin: auto 0;
}
.kouza-explain-txt-container{
  text-align: left;
  margin-right: 1vh;
}
.kouza-explain-point-container{
  display: flex;
  padding-right: 2vh;
}
.kouza-explain-txt-1{
  font-size: 18px;
  font-weight: normal;
  color: black;
  /* text-shadow: 0 0 1px black; */
  letter-spacing: 2px;
  margin-top: 1vh;
  font-weight: bold;
}
.kouza-explain-txt-1 span{
  color: #FD9903;
  /* text-shadow: 0 0 1px #FD9903; */
}
.kouza-point-img-2{
  width: 175px;
  height: auto;
}
.kouza-explain-txt-2{
  color: #1AB8B7;
  font-size: 23px;
  font-weight: bold;
  /* text-shadow: 0 0 1px #1AB8B7; */
  letter-spacing: 4px;
}
.kouza-explain-txt-3{
  font-size: 16px;
  font-weight: normal;
  line-height: 180%;
  letter-spacing: -0.5px;
  margin-top: 2vh;
  color: black;
}
.kouza-explain-txt-3 span{
  color: #1AB9BC;
}
.kouza-explain-txt-3 span-1{
  color: #FAA203;
}
.section-title-upper{
  font-size: 1.25rem;
  color: #009380;
  font-weight: 700;
}

.section-title{
  font-weight: 700;
  font-size: 2rem;
  padding-bottom: 0.25em;
  padding-top: 1rem;
  border-bottom: 3px solid #cbcbcb;
  width: 80%;
  position: relative;
}
.section-title2{
font-weight: 700;
font-size: 2rem;
padding-bottom: 0.25em;
padding-top: 1rem;
border-bottom: 3px solid #cbcbcb;
width: 770px;
position: relative;
margin: 0 auto;
text-align: left;
padding-left: 30px;}

.section-title2::before{
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 30%;
  height: 3px;
  background-color: #009380;
}

.section-title::before{
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 30%;
  height: 3px;
  background-color: #009380;
}

  font-size: 0.5em;
  margin-left: 0.5em;
}

body.is-fixed{
  overflow: hidden;
}

.modal-overlay{
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 30;
  display: none;
}

.modal-overlay.is-active{
  display: block;
}

.modal-dialog{
  width: 70vw;
  max-height: 80vh;
  max-height: 80svh;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  padding: 1rem 1rem 0 1rem;
  z-index: 22;
  border-radius: 10px;
  overflow-y: scroll;
}

.modal-close-button.x-mark{
  position: absolute;
  top: 1rem;
  right: 1rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-size: 2rem;
  color: #a6a6a6;
  z-index: 30;
  cursor: pointer;
}

/*------------------------------------
apply
------------------------------------*/
.apply-button-box{
  width: 700px;
  margin: 0 auto;
}

.apply-before{
  font-weight: 700;
  width: 70%;
  font-size: 1.5rem;
  text-align: center;
  border-radius: 15px;
  border: 2px solid;
  padding: 1rem;
  margin: 0 auto;
  display: block;
}

.apply-after{
  font-weight: 700;
  width: 70%;
  font-size: 1.5rem;
  text-align: center;
  border-radius: 15px;
  padding: 1rem;
  margin: 0 auto;
  display: block;
  background-color: #808080;
  color: #fff;
}

/*------------------------------------
header-nav
------------------------------------*/
.header-container {
  background-color: #009380;
  padding: 10px;
  position: sticky;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10;
  box-shadow: 0 2px 2px rgba(0,0,0,0.2);
}

.header-nav {
  background-color: #fff;
  border-radius: 8px;
  padding: 5px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.9rem;
}

.logo {
  width: 4rem;
}

.header-nav-list {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex: 1;
  padding: 0.4rem 2rem;
  font-weight: bold;
}

.nav-box {
  white-space: nowrap;
  line-height: 1.2;
  text-align: center;
  transition: transform 200ms;
  position: relative;
  height: 40px;
  display: flex
;
  align-items: center;
}
.nav-box:hover {
  transform: translate(2px, 2px);
  background-color: #f6f6f6;
}
@media (min-width: 768px) and (max-width: 1024px) {
  .header-nav-list {
      flex-wrap: wrap;
      padding: 0.4rem 1rem;
  }

  .nav-box {
      margin-bottom: 1.5rem;
      font-size: 14px;
      width: 140px;
  }

  .header-request-button {
      width: 95%;
      display: block;
      margin: 0 auto;
  }

  .header-nav {
      display: block;
  }
}
/* .nav-box:hover:before {
  content: "";
  position: absolute;
  width: 170px;
  height: 4px;
  border-bottom: 2px solid #009380;
  border-radius: 5px;
} */
.nav-box:after {
  content: "";
  position: absolute;
  width: 48px;
  height: 1px;
  transform: rotate(90deg);
  /* background-color: #4c4c4c; */
}
.nav-box::after {
  right: -35px;
}


.header-nav-list li a {
  display: flex;
  align-items: center;
}

.header-nav-list li a i {
  margin-left: 0.5rem;
}

.header-request-button{
  color: #f00;
  border: 2px solid;
  text-align: center;
  border-radius: 8px;
  padding: 0.4rem 2rem;
  position: relative;
  line-height: 1.2;
  transition: background-color 300ms, color 300ms;
  margin-right: 1rem;
}

.header-request-button-green{
  color: #009380;
  border: 2px solid;
  text-align: center;
  border-radius: 8px;
  padding: 0.4rem 2rem;
  position: relative;
  line-height: 1.2;
  transition: background-color 300ms, color 300ms;
}

.header-request-button i {
  position: absolute;
  top: 50%;
  right: 0.3rem;
  transform: translateY(-50%);
}

.header-request-button-green i {
  position: absolute;
  top: 50%;
  right: 0.3rem;
  transform: translateY(-50%);
}

.header-request-button:hover {
  background-color: #f00;
  color: #fff;
}

.header-request-button-green:hover {
  background-color: #009380;
  color: #fff;
}

.mainvisual{
  margin-top: 10px;
  text-align: center;
}

.mainvisual2 {
  width:1000px;
  margin: 0 auto;
}


.mainvisual2 img{
  margin: 0 auto;
}

.suisenn{
  text-align: center;
  margin:50px auto;
}
.suisenn >a img{
  max-width: 1000px;
  
  padding: 0 0.5rem;
}

.muryou{
  background-color: #E479A7;
  color: white;
  font-size: 2.2em;
  font-weight: bold;
  padding: 15px;
  text-align: center;
  width: 100%;
  margin-top: 10px;
}
.logo2025{
  width: 60%;
}

.kouza-img-1{
  width: 100%;
  text-align: center;
  margin-top: 10px;
}

.kouza-img-2{
  width: 500px;
  text-align: center;
  margin-top: 10px;
}
/*------------------------------------
news
------------------------------------*/
.news-icon {
  background-color: #009380;
  color: #fff;
  font-weight: 700;
  border-radius: 50px;
  padding: 0 1rem;
  width: fit-content;
  margin: 0 auto;
  font-size: 1.5rem;
}

.news-title {
  text-align: center;
  font-weight: 700;
  margin: 0.5rem auto 1rem;
  font-size: 1.5rem;
  width: 1000px;
  position: relative;
}

.news-title::before{
  position: absolute;
  content: "";
  top: 50%;
  left: 5%;
  width: 7rem;
  height: 2px;
  background-color: #000;
  transform: rotate(65deg);
}

.news-title::after{
  position: absolute;
  content: "";
  top: 50%;
  right: 5%;
  width: 7rem;
  height: 2px;
  background-color: #000;
  transform: rotate(115deg);
}
.news-title-red{
  color: red;
}

.news-title .-attention {
  color: #f00;
  font-size: 1.5em;
}

.news-title-bigger{
  text-align: center;
  font-weight: 700;
  font-size: 2rem;
  line-height: 1.5;
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  position: relative;
}

.news-title-bigger .-subject-name{
  position: absolute;
  font-size: 0.7rem;
  /* font-weight: normal; */
  background: var(--subject-color);
  padding: 0.15rem;
  color: #fff;
  border-radius: 5px;
  transform: translateX(1rem);
  top: -0.2em;
}

.news-title-bigger .-emphasis{
  color: #009380;
}

.news-title-bigger .-bigger{
  font-size: 2em;
}

.news-detail{
  background-color: #fee5ca;
  padding: 0.5rem;
}

.news-detail .-detail-title{
  background-color: #009380;
  color: #fff;
  text-align: center;
  font-weight: 700;
  border-radius: 50px;
  width: fit-content;
  margin: 0 auto;
  padding: 0 3rem;
  font-size: 0.6rem;
}

  font-size: 0.7em;
}

.news-detail .-detail-text{
  font-size: 0.5rem;
  margin: 0.5rem 0;
}

.voice-container{
  display: flex;
  justify-content: space-between;
  margin-top: 1rem;
}

.voice{
  background-color: #fff;
  padding: 1rem;
  flex-basis: 49%;
  border-radius: 15px;
}

.voice .-subject-name{
  background-color: var(--subject-color);
  color: #fff;
  font-weight: 700;
  padding: 0 .5rem;
  width: fit-content;
  display: inline-block;
  font-size: 1.25rem;
}

.voice .-title{
  color: #f00;
  font-weight: 700;
  font-size: 1.25rem;
  display: inline-block;
}

.voice .-detail-block{
  display: flex;
  justify-content: space-between;
  margin-top: 1rem;
}

.voice .-detail-block .-sub-title{
  font-weight: 700;
  font-size: 1rem;
}

.voice .-image-col{
  flex: 1;
}

.voice .-text-col{
  flex: 1.5;
  margin-left: 0.5rem;
}
.-explanation1{
  font-size: 2vw;
  font-weight: bold;
}
.voice .-detail-block .-explanation{
  font-size: .9rem;
  line-height: 1.15;
}

@keyframes scroll {
  0% {
      transform: translateX(-100%);
  }

  100% {
      transform: translateX(0%);
  }
}

.image-scroll {
  overflow: hidden;
  white-space: nowrap;
  box-sizing: border-box;
  margin-top: 1rem;
}

.image-scroll img {
  width: 300%;
  display: inline-block;
  animation: scroll 40s linear infinite;
}

.lec-modal-teacher {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}

.lec-modal-teacher-info {
  margin-left: 20px;
  max-width: 580px;
  text-align: left;
}

.lec-modal-teacher-info dt {
  flex: 3 1 100%;
  font-size: 30px;
  font-weight: bold;
  align-self: center;
  margin-bottom: 0;
}

.lec-modal-teacher-info dt span {
  font-size: 0.7em;
}

.lec-modal-body {
  font-size: 26px;
  display: flex;
  align-items: center;
}

.lec-modal-item {
  margin-bottom: 15px;
}

.lec-modal-item-title {
  background: #009380;
  color: #fff;
  width: 120px;
  font-size: 18px;
  text-align: center;
  border-radius: 3px;
  margin-bottom: 5px;
}

.lec-modal-item-sentence {
  font-size: 20px;
  text-align: left;
}

.lec-modal-video-wrap {
  display: flex;
}

.video {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  margin-left: 10px;
  height: 230px;
}

.video iframe {
  width: 400px;
  height: 220px;
  margin: 0 auto;
}

.lec-search-grade {
  width: 30%;
  line-height: 2;
  border: #26507a solid 1px;
  border-radius: 7px;
}

.lec-search-subject {
  width: 14%;
  line-height: 2;
  border: #26507a solid 1px;
  border-radius: 7px;
}

.lec-search-level {
  width: 14%;
  line-height: 2;
  border: #26507a solid 1px;
  border-radius: 7px;
}

.lecture-detail {
  margin: 15px auto 0;
  width: 1000px;
  background-color: var(--light-color);
  font-size: 15px;
  padding-top: 10px;
  text-align: left;
}

.result_area {
  height: 400px;
  padding-bottom: 50px;
  overflow-y: scroll;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  align-content: stretch;
}

.lec-modal-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1400;
}

.lec-modal-overlay {
  position: absolute;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.8);
}

.lec-modal {
  position: absolute;
  background-color: #fff;
  top: 47%;
  left: 50%;
  width: 840px;
  max-height: 72dvh;
  transform: translate(-50%, -50%);
  padding: 20px;
  overflow-y: scroll;
}

.lec-modal-teacher p {
  flex: 3 1 100%;
  font-size: 40px;
  font-weight: bold;
  align-self: center;
  margin-bottom: 0;
}
.lec-modal-teacher p span {
  font-size: 0.8em;
}
.lec-modal-teacher img {
  flex: 1 0 100px;
  width: 100px;
  align-self: center;
}

.lec-modal-name {
  margin-bottom: 10px;
  font-size: 35px;
  border-bottom: 1px dotted #888;
}
.lec-modal-head {
  font-size: 40px;
  font-weight: bold;
  line-height: 1.5;
  margin-bottom: 20px;
}

.lec-modal-close {
  position: fixed;
  top: calc(50% - 389px);
  left: calc(50% + 440px);
  border-radius: 50%;
  color: #ffffff;
  font-size: 50px;
  cursor: pointer;
  font-weight: bold;
}

.lec-modal-close-footer {
  margin: 30px auto 0;
  width: 30%;
  border: solid 3px var(--main-color);
  text-align: center;
  font-size: 26px;
  cursor: pointer;
}

/*モーダル本体の指定 + モーダル外側の背景の指定*/
.modal-container{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	background: rgba(0,0,0,50%);
	padding: 40px 20px;
	overflow: auto;
	opacity: 0;
	visibility: hidden;
	transition: .3s;
  box-sizing: border-box;
  z-index: 999;
}

/*モーダル本体の擬似要素の指定*/
.modal-container:before{
	content: "";
	display: inline-block;
	vertical-align: middle;
	height: 100%;
}
/*モーダル本体に「active」クラス付与した時のスタイル*/
.modal-container.active{
	opacity: 1;
	visibility: visible;
}

/*モーダル枠の指定*/
.modal-body{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	max-width: 500px;
	width: 90%;
}
/*モーダルを閉じるボタンの指定*/
.modal-close{
	position: absolute;
	display: flex;
    align-items: center;
    justify-content: center;
	top: -40px;
	right: -40px;
	width: 40px;
	height: 40px;
	font-size: 40px;
	color: #fff;
	cursor: pointer;
}
/*モーダル内のコンテンツの指定*/
.modal-content{
	background: #fff;
  height: 600px;
  border-radius: 20px;
	text-align: left;
	width: 500px;
}



/* モーダル内のコンテンツ */
.modal-in-top{
  background-color: #009380;
  border-radius: 20px;
  height: 85px;
  width: 100%;
}
.modal-in-topp{
  color: white;
  text-align: center;
  padding-top: 17px;
}

body.no-scroll {
  overflow: hidden;
}


.splide:not(.is-overflow) .splide__pagination{
  display: flex;
}

.splide__arrow{
  color: #000;
}

.splide__arrow--prev {
  left: -3em;
}

.splide__arrow--next {
  right: -3em;
}

.splide__pagination__page.is-active{
  background-color: #009380;
}

.improve-tabpanel .splide__pagination{
  top: calc(100% - 10px);
}
.lesson-example-slide-container .splide__pagination__page.is-active{
  background-color: #fff;
}

.lesson-example-slide-container .splide__pagination__page{
  background-color: #ccc;
}

.lesson-example-slide-container .splide__arrow{
  display: none;
}

/* モーダルのスタイル */
.modal {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  justify-content: center;
  align-items: center;
}

/* モーダルの中身 */
.modal-content {
  background: white;
  padding: 20px;
  border-radius: 5px;
  width: 55%;
  text-align: center;
  position: relative;
  height: 800px;
}

/* 閉じるボタン */
.close {
  position: absolute;
  top: 10px;
  right: 15px;
  font-size: 20px;
  cursor: pointer;
}

/* モーダルを開くアニメーション */
.modal.show {
  display: flex;
  animation: fadeIn 0.3s ease-in-out;
}

@keyframes fadeIn {
  from {
      opacity: 0;
  }
  to {
      opacity: 1;
  }
}

[v-cloak] {
  display: none;
}

.button-upper{
  font-size: 30px;
  font-weight: bold;
  margin-bottom: 5px;
}

.button-bottom-txt-countdown{
  text-align: center;
  margin: -25px 25px 25px 25px;
}

.button-shotai-txt-countdown{
    text-align: center;
    margin: 7px 25px 0 25px;
}

.button-bottom-txt-countdown-2{
  text-align: left;
  margin: 7px 105px 0 105px;
}

.to-kouza-button{
  display: block;
  text-align: center;
  padding: 1rem 0;
  width: 70%;
  color: rgb(228, 121, 167);
  font-weight: bold;
  font-size: 1.75rem;
  margin: 20px auto;
  border: 3px solid;
  border-radius: 15px;
  box-shadow: 3px 3px 8px rgb(0,0,0,0.3);
  transition: transform 200ms, box-shadow 200ms;
  position: relative;
  cursor: pointer;
}

.modal-kouza{
  overflow-y: scroll;
  width: 35vw;
  max-height: 80vh;
  max-height: 80svh;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  padding: 1rem 1rem 0 1rem;
  z-index: 22;
  border-radius: 10px;
}

.kouza-slide {
  width: 200px;
}

.kouza-attention-txt-1 , .kouza-attention-txt-2{
  font-weight: bold;
}