/*
width: 100%;
max-width: 1200px;
*/
@media (min-width: 1024px) {
.pc-only{
  display: initial;
}
.sp-only{
  display: none;
}

.title-fs20{
  font-size: var(--fs-26);
}
.title-fs25{
  font-size: var(--fs-35);
  font-family: var(--title-font-family);
  font-weight: bold;
}
.w900{
  width: 100%;
  max-width: 920px;
  margin: 0 auto;

}
.pt68{padding-top: 8rem;}
.short-hr{
  width: 80px;
  height: 5px;
  background-color: var(--main-primary);
  margin: 3rem auto;
}
/* ////////////////////// */
.section-title{
  font-size: 3rem;
}
.section-title .section-subtitle{
  font-size: 1.25rem;
}
.text-center-sp{
  text-align: left;
}
.w-pd{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.site-simple{
  padding-top: 110px;
}

.pagination .nav-links .page-numbers{
  width: 60px;
  height: 60px;
  font-size: var(--fs-16);
}
.pagination .nav-links .page-numbers:first-child{
  border-radius: 30px 0 0 30px;
  width: 80px;
}
.pagination .nav-links .page-numbers:last-child{
  border-radius: 0 30px 30px 0;
  width: 80px;
}
.breadcrumb{
  width: 100%;
  background-color: #F3F3F3;
  margin: 0;
}
.breadcrumb ul{
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 10px;
}
.breadcrumb ul li{
  padding: 6px 0;
  font-size: var(--fs-14);
}
.breadcrumb ul li a{
  font-size: var(--fs-14);
  color: var(--main-text-color);
}
.breadcrumb ul li a:hover{
  color: var(--main-primary);
}

.simple-title{
  text-align: center;
  color: var(--main-primary);
  font-family: var(--title-font-family);
  font-size: var(--fs-35);
  font-weight: bold;
  margin: 2rem 0 2rem;
  padding-bottom: 1rem;
  position: relative;
}

.simple-title::after{
  content: '';
  display: block;
  width: 50px;
  height: 3px;
  background-color: var(--main-primary);
  bottom: 0;
  left: 50%;
  margin-left: -25px;
  position: absolute;
}

.simple-container{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}
.page-description{
  font-size: var(--fs-16);
}

/*
 * header
 */
 .header-inner{
 height: 76px; 
 width: 96%;
 background-color: var(--main-color-white);
 border-radius: 38px;
 margin: 30px auto 0;
 display: flex;
 justify-content: space-between;
 align-items: center;
 padding: 0 2rem;
}

 .site-logo{
  width: 153px;
}
.headr-bar-menu{
  list-style: none;
  display: flex;
  padding: 0;
  margin: 0;
  gap: 1.4rem;
  padding-right: 2rem;
}
.headr-bar-menu li{

}
.headr-bar-menu li a{
  color: var(--main-text-color);
  font-size: var(--fs-14);
  font-family: var(--title-font-family);

}
.headr-bar-menu li a:hover{
  color: var(--main-primary);
}

.nav-toggle{
  width: 50px;
  height: 50px;
  border-radius: 25px;
}
.header-nav-wrap .btn-xs{
  font-size: 1rem;
  padding: 10px 2rem;
  height: 48px;
  border-radius: 24px;
  font-family: var(--title-font-family);
}

.global-menu-context{
  width: 96%;
  top: 30px;
  left: 2%;
  right: 2%;
  max-width: none;
  border-radius: 30px;
  padding: 1rem 2rem;
}
.gm-main{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.gm-sub li.gm-h1-link{
  border-bottom: var(--border-style);
  padding-bottom: 0.5rem;
  margin-bottom: 0.5rem;
}
.gm-sub li.gm-h1-link a,
.gm-sub li.gm-h1-link span{
  font-size: var(--fs-18);
  font-weight: bold;
}

.gm-sub li.gm-h2-link{
  margin-bottom: 0.25rem;
}
.gm-sub li.gm-h2-link a{
  font-size: var(--fs-16);
}
.gm-sub li.gm-h3-link{
  display: block;
}
.gm-sub li.gm-h3-link a{
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: var(--fs-18);

}
.gm-sub li.gm-h3-link a .fa-solid{
  color: var(--main-primary);
}
.gm-social-links{
  justify-content: flex-start;
}

/* Footer */
.footer{
  width: 100%;
  padding-bottom: 2rem;
}

.footer-content{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  background-color: #F3F3F3;
  border-radius: 20px;
  padding: 4rem 3rem;;
  display: flex;
  justify-content: space-between;
  align-items: start;
}
.footer-left{
  text-align: left;
}
.footer-left .site-logo{
  width: 300px;
  margin: 0 auto;
}

.footer-nav{
  text-align: left;
}
.footer-right{
  text-align: end;
}

.footer-btns{
  display: block;
}
.footer-btns .btn{
  display: block;
}
.footer-btns .btn:first-child{
  margin-bottom: 1rem;
}
footer .gm-social-links{
  justify-content: end;
}
.copyright{
  font-size: 10px; 
}
/* ----------------------- */

.hero-section{
  width: 100%;
  height: 55vw;
  background-image: url(/wp-content/themes/ballschule/assets/images/mv01_pc.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  position: relative;
  display: flex;
}


.here-content{
text-align: center;
}
.here-content h2{
  font-size: 4rem;
  color: var(--main-color-white);
  margin-bottom: 2rem;
}
.here-content h4{
  font-size: 1.87rem;
  color: var(--main-color-white);
  margin-bottom: 2rem;
}
.mv-btn{
  font-size: 1.13rem;
  padding: 0.5rem 2rem;
  height: 45px;
  border-radius: 22.5px;
}
.classroom-info{
  width: 156px; 
  height: 156px;
  bottom: 2rem;
  right: 2rem;
  border-radius: 78px;
  padding-top: 35px;
}
.classroom-info img{
    width: 124px;
}
.scroll-img{
  left: 2rem;
}
/* Concept */
.concept-section{
  margin-top: 70px;
  display: flex;
  width: 100%;
  /* max-width: 1240px; */
  margin: 70px auto 0;
  justify-content: end;
}
.concept-left{
  position: relative;
  flex: 1;
  max-width: 600px;
  margin: 0;
}
.concept-left p{
  font-size: 1rem;
}
.concept-left .cp-text{
  padding-top: 1.5rem;
}
.concept-left .circle1{
  right: 0px;
  top: 68%;
}
.concept-left .circle2{
  left: -80px;
  bottom: 0;
}
.concept-left .circle3{
  right: -50px;
  top: 50%;
  z-index: 1;
}
.concept-right{
  flex: 0 0 50%;
  border-radius: 30px 0 0 30px;
  height: 430px;
  position: relative;
  overflow: hidden;
  display: block;
}
.concept-right img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* News */
.news-content{
  width: 86%;
  max-width: 1240px;
  display: flex;
}
.news-head{
  flex: 0 0 45%;
  text-align: left;
  display: flex;
  align-items: center;
  padding-left: 5rem;
  padding-bottom: 0;
}

.news-body{
  width: 55%;
}
.news-list{
  padding: 1rem 2rem 1rem 0;
}
.news-content .section-title{
  text-align: left;
}


.news-list li.news-item{
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  padding: 1.6rem 0;
}

.news-list li.news-item time{
  font-size: 1rem;
  margin-bottom: 0;
}
.news-list li.news-item a{
  font-size: 1rem;
  flex: 1;
  text-align: left;
}
.news-list li.more{
  display: none!important;
}
.news-item .link-anker{
  font-size: 1rem;
  color: #C2C2C2;
}

.news-content .news-boy{
  position: absolute;
  top: -4.4rem;
  left: 2rem;
  width: 73px;
}
a.news-link .news-info{
  display: flex;
  gap: 2rem;
}
a.news-link .news-info time{

}
a.news-link .news-info .news-title{
  flex: 1;
  font-size: var(--fs-16);
}

.news-header{
  padding-top: 1rem;
  padding-bottom: 2rem;
}
.news-header time{
  color: var(--main-warning);
  font-size: var(--fs-26);
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
}
.news-header h1{
  color: #000;
  font-size: 22px;
  font-weight: bold;
  padding: 1rem 0;
  border-bottom: 1px solid #C4C4C4;
}
.news-detail{
  width: 90%;
  margin: 0 auto;
  font-size: 16px;
}

/* About */
.section-about{
  width: 100%;
  max-width: 1200px;
  position: relative;
}
.about-container{
  display: grid;
  grid-template-columns: 40% 60%; /* 左40% 右60% */
  grid-template-rows: 22% auto;
  gap: 10px;
  margin-top: 4rem;
}

.about-container .about-dr{
  grid-column: 1;
  grid-row: 1 / 3;
}

.about-container .cp-text{
  grid-column: 2;
  grid-row: 1;
}

.about-container .about-text{
  grid-column: 2;
  grid-row: 2;
  font-size: var(--fs-16);
}

.about-dr-inner{
  width: 300px;
  margin: 0 auto;
}
.about-dr-inner .tag{
  font-size: var(--fs-14);
}
.about-container .cp-text{
  font-size: var(--fs-30);
  text-align: left;
  margin: 0;
}
.about-more{
  margin-top: 2rem;
  text-align: left;
}

.section-about .circle1{
  top: 110px;
  left: -50px;
}
.section-about .circle2{
  top: 100px;
  right: -50px;
}
.section-about .circle3{
  top: 50px;
  left: -50px;
}
.section-about .circle4{
  top: 0;
  right: 0;
}

.section-about .circle5{
  right: 0;
  bottom: 50px;
}
.section-about .about-boys{
  position: absolute;
  right: 0;
  width: 180px;
  bottom: -80px;
}

/* Ability */
.section-ability{
  
}
.ability-main{
  width: 100%;
  /* max-width: 1200px; */
  position: relative;
}
.ability-row{
  display: flex;
  justify-content: end;
  flex-wrap: nowrap;
}
.ability-row.flex-reverse{
  flex-direction: row-reverse;
  justify-content: end;
}


.ability-row .ability-content{
  flex: 1;
  max-width: 600px;
  margin: 0 0 0 auto;
}
.ability-row.flex-reverse .ability-content{
  margin: 0 auto 0 0;
}
.ability-row .img-wrap{
  flex: 0 0 50%;
  width: 50%;
  overflow: hidden;
  border-radius: 9999px 0 0 9999px;
  height: 350px;
}
.ability-row.flex-reverse .img-wrap{
  border-radius: 0 9999px 9999px 0;
}

.ability-row .img-wrap .ability-img{
  width: 100%;
  height: 350px;
  object-fit: cover;
  object-position: center;
  display: block;
}


.ability-content {
  text-align: left;
  padding: 1rem 0 0 0rem;
}
.ability-row.flex-reverse .ability-content {
  padding: 1rem 0 0 4rem;

}
.ability-content .ability-title{
  font-size: var(--fs-26);
}
.ability-content .ability-title span{
  width: 30px;;
  height: 30px;
  font-size: 23px;
}
.ability-content p{
  font-size: 1rem;
  padding-left: 3rem;
  padding-right: 2rem;
}

.ability-row.flex-reverse .ability-content p{
  padding-left: 3rem;
  padding-right: 1rem;
}
.ability-content .steps{
  justify-content: start;
  padding-left: 3rem;
}

.ability-content .steps .circle-step{
  width: 140px;
  height: 140px;
  border-radius: 70px;
  font-size: var(--fs-18);
  text-align: center;
}

.section-ability .video-content{
  margin-top: 300px;
  padding: 310px 0 4rem;
}
.section-ability .video-wrap{
  position: absolute;
  border: none;
  width: 900px;
  aspect-ratio: 16 / 9;
  left: 50%;
  margin-left: -450px;
  top: -250px;
}

.section-ability .circle1{
  top: -50px;
  left: 100px;
}
.section-ability .circle2{
  right: -50px;
  top: 460px;
}
.section-ability .circle3{
  left: -70px;
  top: 709px;
}
.section-ability .circle4{
  right: -20px;
  bottom: -150px;

}
.section-ability .circle5{
  bottom: -350px;
  left: -20px;
  z-index: 1;
  background-size: 80%;
}

.section-locatin{
  margin-top: 4rem;
}

.locatin-main{
  width: 100%;
  margin: 0 auto;
  text-align: left;
  display: flex;
}
.location-left{
  background-size: 60%;
  background-position-x: 180px;
  background-position-y: bottom;
  flex: 1;
  max-width: 600px;
  margin: 0 0 0 auto;
  padding-right: 2rem;
}

.location-right{
  flex: 0 0 50%;
  overflow: hidden;
  border-radius: 30px 0 0 30px;
  height: 430px;
} 
.location-right img{
  width: 100%;
  height: 430px;          /* 固定高さ */
  object-fit: cover;
  object-position: center;
  display: block;
}

/* Voice */
.voice-section{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  margin-top: 4rem;
  
}

.voice-items{
  display: flex;
  gap: 2rem;
  
}
.voice-item{
  padding: 2rem 2.5rem;
}
.img-voice{
  right: 2rem;
}

.voice-more{
  padding-top: 1rem;
}


.contact-section{
  aspect-ratio: 5.76 / 1;
  background-image: url(/wp-content/themes/ballschule/assets/images/contact-bg-pc.jpg);
}

.team-section{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  margin-top: 4rem;
  padding-bottom: 4rem;
  text-align: center;
}
.team-items{
  justify-content: center;
  gap: 1rem;
}
.team-items .img-team{
  flex: 0 0 16.666%;
  max-width: 150px;
}

/* FAQ */
.faq-page-title{
  padding: 3rem 0;
}
.faq-terms{
  grid-template-columns: repeat(4, 1fr);
}
.faq-terms .btn{
  padding: 12px 2rem;
  font-size: var(--fs-14);
  height: 50px;
  border-radius: 25px;
}
.faq-title{
  font-size: var(--fs-30);
}
.faq-question .char-q{
  font-size: var(--fs-26);
}
.faq-question .text-q{
  font-size: var(--fs-20);
}
.faq-question .handle-q{
  font-size: var(--fs-26);
}
.faq-answer{
  font-size: 1rem;
  padding: 0 2.2rem;
}
/* //////////////////////////////////////////////////// */
.partner-merit-wrap{
  padding: 1rem 4rem;
}
.partner-merit-item{
  display: flex;
  flex-direction: row;
  justify-content:space-between;
  border-bottom: 2px dashed var(--main-primary);
  padding: 1rem;
}
.partner-merit-item:last-child{
  border-bottom: none;
}

.partner-merit-item .title{
  border-bottom: none;
  position: relative;
  padding: 0.5rem 1rem 0.5rem 24px;
  width: 50%;
}
.partner-merit-item .title:after{
  content: '';
  width: 17px;
  height: 17px;
  border-radius: 9px;
  background-color: var(--main-primary);
  position: absolute;
  left: 1px;
  top: 18px;
}
.partner-merit-item .body{
  flex: 1;
  padding: 0.5rem 1rem;
}

.partner-plan-wrap{
  display: flex;
  flex-direction: row;
  gap: 2rem;
  justify-content: center;
}

.partner-plan-item{
  max-width: 500px;
}


.partner-voice{
  padding-bottom: 3rem;
  margin-bottom: 3rem;
  border-bottom: 2px dashed var(--main-primary);

  display: grid;
  grid-template-columns: 36% auto;   /* 左右2列 */
  grid-template-rows: 100px auto;    /* 行は自動で2段 */
  grid-template-areas:
    "b a"
    "b c";
  gap: 0 80px;
  

}
.partner-voice.reverse{
  grid-template-columns: auto 36%;
  grid-template-areas:
    "a b"
    "c b";
  
}

.partner-voice .block-a{
  grid-area: a;
}
.partner-voice .block-b{
  grid-area: b;
}
.partner-voice .block-c{
  grid-area: c;
}
.partner-voice-main{
  font-size: 22px;
}
.partner-voice-message{
  font-size: 14px;
  padding: 1rem 0;
}


.sponsorship-banner{
  margin: 4rem 0;
  aspect-ratio: 62 / 17;
  background-image: url(/wp-content/themes/ballschule/assets/images/sponsor-pc.png);
}

.sponsorship-banner .desp{
  font-size: 15px;
  color: #fff;
  text-align: left;
  padding: 3rem 0 0;
  margin: 0 auto;
  text-align: center;
}
/* //////////////////////////////////////////////////// */
.hero-container{
  width: 100%;
  
}
.hero-container .hero-wrap{
  width: 100%;
  display: flex;
  position: relative;
  aspect-ratio: 18 / 5;
}
.hero-container .hero-wrap .hero-img{
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
}
.hero-wrap .page-title{
  font-size: 50px
}
.hero-wrap .page-title span{
  font-size: 15px;
}

.program-class .btn-mock-primary{
  max-width: 260px;
  width: 260px;
  padding: 1rem 2rem;
  font-size: 30px;
}
.program-class-items li{
  gap: 20px;
  padding: 1.5rem 0;
}

.program-class-items li .pc-dot{
  margin-top: 10px;
}
.program-class-items li .pc-name{
  font-size: var(--fs-20);
}

.section-content{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
}

.subpage-title{
  text-align: center; 
  font-size: var(--fs-35);
  font-weight: bold;
  font-family: var(--title-font-family);
}

.subpage-cp-text{
  text-align: center; 
  font-size: var(--fs-26);
  font-weight: bold;
  font-family: var(--title-font-family);
  margin-top: 2rem;
}
.fs11-13{
  font-size: 13px;
}
.fs12-14{
  font-size: var(--fs-14);
}
.fs13-16{
  font-size: var(--fs-16);
}
.fs13-14{
  font-size: var(--fs-14);
}

.sp-centr{
  text-align: left;
}

/* About page */

.about-main-ttl-img{
  width: 520px;
  margin: 1rem auto;
}

img.about-title-border{
  margin-top: 2rem;
}

.about-circle-imgs{
  height: 60px;
}

.about-circle-imgs .about-circle1,
.about-circle-imgs .about-circle2,
.about-circle-imgs .about-circle3{
  position: absolute;
  display: block;
}
.about-circle-imgs .about-circle1{
  width: 260px;
  top: 0;
  left: -40px;
  
}

.about-circle-imgs .about-circle2{
  width: 200px;
  top: 80px;
  right: 45px;
}
.about-circle-imgs .about-circle3{
  width: 160px;
  top: 0;
  right: -100px;
}


.about-circle-imgs .circle-1{
  width: 50px;height: 50px; border-radius: 25px;
  top: 0;
  right: -180px;
}
.about-circle-imgs .circle-2{
  width: 60px;height: 60px; border-radius: 30px;
  bottom: 60px;
  left: -130px;
}
.about-circle-imgs .circle-3{
  width: 100px;height: 100px; border-radius: 50px;
  bottom: 10px;
  left: -110px;
}
.about-circle-imgs .circle-4{
  width: 47px;height: 47px; border-radius: 24px;
  bottom: 80px;
  right: -90px;
}
.about-circle-imgs .circle-5{
  display: none;
}
.about-circle-imgs .circle-6{
  width: 68px;height: 68px; border-radius: 32px;
  bottom: 10px;
  left: 160px;
}


.about-flex-1{
  display: flex;
  flex-direction: row;
  margin-top: 4rem;
  justify-content: space-between;
}

.about-flex-1 .about-flex-col{
  display: flex;
  justify-content: center;
  align-items: center;
}
.about-flex-1 .about-flex-col.left{
  flex: 0 0 40%; 
}
.about-title1{
  font-size: var(--fs-26);
  text-align: center;
  padding: 0 0 1rem;
  border-bottom: 3px solid #fff;
}
.about-flex-1 .about-flex-col .fs13-16{
  padding-top: 0;
}
img.about-title-border{
  display: block;
  width: 80%;
  max-width: 900px;
  margin: 2rem auto 0;
}

.about-flex-feature{
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 2rem;
}

.about-flex-feature .feature-item{
  background-color: #fff;
  width: 100%;
  border-radius: 15px;
  padding: 1.5rem 2rem;
}
.about-flex-feature .feature-item h4{
  text-align: center;
  font-size: var(--fs-26);
  font-weight: bold;
  font-family: var(--title-font-family);
  border-bottom: 3px solid var(--main-primary);
  padding-bottom: 1.5rem;
}
.about-flex-feature .feature-item .feature-body{
  padding-top: 1.5rem;
}
.about-skill-row{
    grid-template-columns: 40% 60%;   /* 左右2列 */
    grid-template-rows: 50px auto;    /* 行は自動で2段 */
    grid-template-areas:
      "b a"
      "b c";
    /* column-gap: 3rem; */
    gap: 0;
}
.about-skill-row h5{
  grid-area: a;
  font-size: 22px;
}
.about-skill-row .about-skill-thmb{
  grid-area: b;
  text-align: center;
}
.about-skill-thmb img{
  max-width: 350px;
  
}
.about-skill-row .about-skill-body{
  grid-area: c;
  padding-top: 0;
}

.about-point-row{
  flex-direction: row;
}

.about-point-row .col1{
  width: 30%;
}
.about-point-row .col2{
  flex: 1;
}

.about-key-row{
  grid-template-columns: 40% 60%;   /* 左右2列 */
  grid-template-rows: 50px auto;    /* 行は自動で2段 */
  grid-template-areas:
    "b a"
    "b c";
  gap: 0;
}
.about-key-row .col-a{
  grid-area: a;
  text-align: left;
  padding: 0 2rem;
}
.about-key-row .col-b{
  grid-area: b;
  text-align: right;
}
.about-key-row .col-b img{
  max-width: 360px;
}
.about-key-row .col-c{
  grid-area: c;
  padding: 0 2rem;
}

.pc-pd{
  padding-left: 3rem;
}


.wthite-round-wrap{
  padding: 4rem 2rem;
  margin-top: 4rem;
}
.wthite-round-wrap .subpage-title{
  color: var(--main-primary);
}

.about-program-row{
  flex-direction: row;
  gap: 2rem;
}


.voice-wrap{
  display: flex;
  flex-direction: row;
  padding-bottom: 2rem;
  gap: 2rem;
}
.voice-wrap.reverse{
  flex-direction: row-reverse;
}

.voice-wrap .voice-user{
  width: 30%;
  text-align: center;
  margin-bottom: 2rem;
}
.voice-wrap .voice-user .voice-user-img{
  width: 350px;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
}

.voice-user-info{
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 1rem;
  padding-top: 1.5rem;
}

.voice-user-info .voice-user-school{
  background-color: var(--main-primary);
  color: #fff;
  font-size: 18px;
  padding: 6px 1rem;
  border-radius: 24px;
}
.voice-user-info .voice-user-name{
  font-size: 18px;
  font-weight: bold;
  font-family: var(--title-font-family);
}

.voice-wrap .voice-qas{
  flex: 1;
  background-color: #F3F3F3;
  border-radius: 15px;
  padding: 3rem 3rem;
  margin-bottom: 2rem;
}

.voice-wrap .voice-qa-item{
  margin-bottom: 2rem;
}
.voice-wrap .voice-qa-item:last-child{
  margin-bottom: 0rem;
}

.voice-qa-item .question{
  display: flex;
  align-items: start;
  justify-content: space-between;
  background: #fff;
  border-radius: 8px;
  padding: 12px 1.5rem;
}
.voice-qa-item .question .char-q{
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 20px;
  color: var(--main-primary);
  width: 28px;
  text-align: left;
}
.voice-qa-item .question .text-q{
  flex: 1;
  font-size: 20px;
  font-family: var(--title-font-family);
  font-weight: bold;
}

.voice-qa-item .answer{
  display: flex;
  align-items: start;
  justify-content: space-between;
  padding-top: 1rem;
  gap: 1.5rem;
}

.voice-qa-item .answer .answer-type{
  width: 52px;
  height: 52px;
  border-radius: 26px;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  font-family: var(--title-font-family);
  font-weight: bold;
  
}
.voice-qa-item .answer .answer-type.parent{
  background-color: var(--main-primary);
}
.voice-qa-item .answer .answer-type.child{
  background-color: var(--main-warning);
}
.voice-qa-item .answer .answer-text{
  flex: 1;
}

.about-message-mainttl{
  color: #fff;
  margin-bottom: 2rem;
}
.about-message-subttl{
  text-align: center;
  color: #fff;
}
.about-message{
  flex-direction: row;
  padding: 3rem 3.5rem;
  gap: 3rem;
  align-items: center;
  margin-top: 3rem;
}

.about-message .left{
  width: 30%;
}
.about-message .left .about-message-lbl{
  font-size: 16px;
}
.about-message .left .about-message-name{
  font-size: 16px;  
}

.about-message .right{
  flex: 1;
}

.about-links{
  flex-direction: row;
  justify-content: center;
  gap: 4rem;
}
.about-links .about-link{
  max-width: 400px;
  aspect-ratio: 20 / 9;
  font-size: 26px;
}
.about-link.about-link1{
  background-image: url(/wp-content/themes/ballschule/assets/images/about-link1-pc.png);
}
.about-link.about-link2{
  background-image: url(/wp-content/themes/ballschule/assets/images/about-link2-pc.png);
}

/* CLASSROOM */
.site-classroom{
  padding-top: 110px;
}


/* Investigation */
.invest-row1{
  display: flex;
  flex-direction: row;
  gap: 4rem;
  margin-top: 4rem;
  justify-content: center;
  padding: 0 6rem;
}
.invest-row1 .left{
  text-align: center;
}
.invest-row1 .left img{
  width: 300px;
}
.invest-row1 .right{
  text-align: left;
}
.invest-row1 .right .fs13-16{
  text-align: left;
  padding-top: 1.5rem;
}

.invest-video-frame{
  width: 100%;
  max-width: 825px;
  margin: 0 auto;
  aspect-ratio: 16 / 9;
  margin-top: 1rem;
  display: block;
}

.invest-global{
  aspect-ratio: 62 / 19;
  background-image: url(/wp-content/themes/ballschule/assets/images/invest-link-pc.png);
  padding-left: 40%;
}
/* ////////////////////////////////////// */
.contact-container{
  width: 100%;

}

.contact-container .contact-wrap{
  padding-top: 110px;
}

.contact-inner{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  /* padding: 2rem 0; */
}
.contact-inner .page-title{
  font-size: var(--fs-35);
  padding: 3rem 0 1.6rem 0;
  margin-bottom: 2rem;
}
.contact-inner .seminar-title,
.condition-title{
  font-size: var(--fs-30);
  margin-bottom: 2rem;
}

.contact-inner .seminar-description{
  font-size: 1rem;
  padding-bottom: 2rem;
}

.contact-title{
   font-size: var(--fs-26);
}
.contact-values{
  padding: 2rem;
  font-size: 1rem;
}

.wpcf7-form{
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
}


.form-row{
  display: flex;
  flex-direction: row;
  align-items: start;

  margin-bottom: 2rem;
}
.form-row .form-label{
  width: 280px;
  margin-right: 1rem;
}
.form-row .form-input{
  flex: 1;
}
.wpcf7-list-item{
  display: block;
}
.wpcf7-not-valid-tip{
  
}

/* ///////////////////// */
.cf-section1{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.cr-title{
  font-size: var(--fs-35);
  margin: 4rem auto;
  width: 60%;
  border-radius: 38px;
}


.cf-message-wrap{
  display: flex; 
  justify-content: space-between;
}
.cf-message-wrap .cf-message-left{
  float: left;
  justify-content: center;
  align-items: center;
  flex: 0 0 30%;
  padding-top: 2rem;
}
.cf-message-wrap .cf-message-left .cf-message-title{
  font-size: var(--fs-26);
}
.cf-message-wrap .cf-message-right{
  font-size: var(--fs-16);
}

.classroom-photos {
  max-width: 1200px;
  margin: 0 auto;
  display: flex!important;
  gap: 1rem;
  justify-content: center!important;
}
.classroom-photos.swiper{
  padding-right: 0;
  padding-top: 2rem;
}

.cf-detail-wrap{
  display: flex;
  flex-direction: row;
}

.cf-detail-wrap .left{
  order: 2;
  width: 50%;
  padding-left: 3rem;
}

.cf-detail-wrap .right{
  order: 1;
  width: 50%;
  
}

.cf-detail-wrap .detail-value{
  font-size: var(--fs-16); 
  padding: 1rem 1rem 2rem;
}

.cf-detail-wrap .detail-value .fee-description{
  font-size: 12px;
  padding-top: 10px;
}
.cf-lesson-wrap{
  flex-direction: row;
}
.cf-lesson-item{
  flex: 1;
}
.cf-lesson-item + .cf-lesson-item {
  border-top: 1px solid #C2C2C2;
  border-left: none;
}
.cf-lesson-head{
  text-align: center;
  font-size: var(--fs-20);
  padding: 1rem;
  border-bottom: 1px solid #C2C2C2;
}
.cf-lesson-body{
  font-size: var(--fs-14);
  padding: 1rem;
}
.cf-contact-flow img{
  width: 80%;
  max-width: 550px;
}

.crg-title-under{
  margin-top: 1rem;
  width: 240px;
}
.crg-title-desp{
  font-size: var(--fs-16);
  text-align: center;
  padding-top: 2rem;
}

.location-wrap{
  background-color: #F3F3F3;
  width: 100%;
  padding: 1.5rem 2rem;
  border-radius: 20px;
}
.location-items{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: 1fr 1fr; /* SP: 1列 */
  gap: 20px;
  align-items: start;
}

.section-crg-main .circle5{
  top: 90px;
  left: -40px;
}
.section-crg-main .circle6{
  top: 10px;
  left: -90px;
}
.section-crg-main .circle7{
  top: 0;
  left: 110px;
}
.section-crg-main .circle8{
  top: 140px;
  right: -90px;
}
.section-crg-main .circle9{
  top: 190px;
  right: -165px;
}
.section-crg-main .circle10{
    top: 20px;
    right: 40px;
}
.location-title{
  font-size: var(--fs-26);
  text-align: left;
  padding-left: 0rem;
}

.contact-links{
  display: grid;
  grid-template-columns: 1fr 1fr; /* SP: 1列 */
  gap: 2rem;
}
.contact-links .btn{
  padding: 1.5rem 2rem;
  font-size: 22px;
  margin-bottom: 2rem;
}

.cert-merit-row{
  margin-top: 1rem;
  display: flex;
}
.cert-merit-row .cert-merit-col{
  margin-top: 1.4rem;
  flex: 1;
}
.cert-merit-title{
  font-size: var(--fs-26);
}
.cert-merit-body{
  font-size: var(--fs-16);
  padding: 1.5rem 0 0;
}
.cert-merit-img{
  width: auto;
  height: 230px;
}

.cert-step-img{
  width: 960px;
  display: block;
  margin: 2rem auto 1rem;
}

.cert-danger{
  width: 83.33%;
  margin: 4rem auto;
  display: flex;
  align-items: center;
  padding: 2rem;

}
.cert-danger .cert-danger-title{
  width: 40%;
  font-size: 22px;
  padding: 0;
}
.cert-danger .cert-danger-title .fa-solid{
  font-size: 57px;
}
.cert-danger .cert-danger-title label{
  margin: 0.5rem auto 0;
}
.cert-danger .cert-danger-desp{
  flex: 1;
  font-size: var(--fs-14);
  padding: 0;
}

.cert-links-row{
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  gap: 2rem;
  justify-items: center;
}
.cert-links-row .btn{
  color: #fff;
  display: block;
  width: 70%;
  font-size: 20px;
  max-width: 360px;
  height: 60px;
  padding: 1rem;
  border-radius: 9999px;
}

.contact-cert-ml{
  width: 100%;
  aspect-ratio: 62 / 15;
  background-image: url(/wp-content/themes/ballschule/assets/images/cert4-pc.png);
  background-repeat: no-repeat;
  background-size: contain;
  margin: 2rem 0 4rem;
  
}


.instructor-links{
  flex-wrap: nowrap;
  gap: 1rem;
}
.instructor-link{
  width: 230px;
  font-size: 20px;
}


.instructor-content1{
  width: 100%;
  /* max-width: 1200px; */
  margin: 0 auto;
  flex-direction: row;
  padding-top: 4rem;
}
.instructor-content1.rereverse{
  flex-direction: row-reverse;
}
.instructor-content1 .left{
  flex: 0 0 50%;
  overflow: hidden;
  padding-right: 4rem;
}
.instructor-content1 .left img{
  width: 100%;
  height: 400px;          /* 固定高さ */
  object-fit: cover;
  object-position: center;
  display: block;
  border-radius: 0 30px 30px 0;
}
.instructor-content1.rereverse .left{
  text-align: right;
  padding-right: 0;
  padding-left: 4rem;
}
.instructor-content1.rereverse .left img{
  border-radius: 30px 0 0 30px;
}

.instructor-content1 .right{
  flex: 1;
  max-width: 600px;
  padding: 0;
}
.instructor-content1 .right .sub-ttl{
  text-align: left;
}


.instructor-content1 .right .grid {
    grid-template-areas:
      "a b"
      "a c"; /* ★ PC時 */
}

.instructor-flow{
  background-color: #F3F3F3;
  border-radius: 20px;
  padding: 2rem 3rem;
}
.instructor-flow .step-img{
  width: 100%;
}
.instructor-flow .contact-btn .btn{
  max-width: 300px;
  margin: 0 auto;
}

.instructor-event{
  text-align: center;
}
.instructor-event img{
  width: 30%; 
}
.event-items{
  display: flex;
  flex-direction: row;
  margin-top: 2rem;
  gap: 1rem;
}
.event-items .event-item .eq2{
  font-size: 24px;
}


.confirm-row{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  border-bottom: 1px solid #C2C2C2;
  padding: 1rem 0.5rem;
  gap: 0.5rem;
}
.confirm-row:last-child{
  border-bottom: none
}

.confirm-row .confirm-label{
  width: 200px;
  font-weight: bold;
  font-family: var(--title-font-family);
  color: var(--main-text-color);
}
.confirm-row .confirm-value{
  flex: 1;
}

.contact-thanks{
  width: 60%;
  margin: 0 auto;
  text-align: center;
}


.search-form-wrap{
  background-color: #fff;
  width: 1000px;
  margin: 0 auto;
  border-radius: 20px;
  padding: 1rem 2rem;
}
.search-form-title{
  font-size: var(--fs-26);
  text-align: left;
  font-family: var(--title-font-family);
  font-weight: bold;
  padding-bottom: 1rem;
  border-bottom: 1px solid #C2C2C2; 
}

.search-form-body{
  padding: 1rem 1rem 0;
  display: flex;
  flex-direction: row;
  gap: 1rem;
  justify-content: space-between;
  align-items: center;
}

.btns{
  width: 160px;
  padding: 0;
}
.select-round-container{
  flex: 1;
}

.city-items{
  width: 100%;
  max-width: 1200px;
}

.city-item{
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 1.5rem 0;
}

.city-item .classroom-name{
  font-size: 18px;
  margin: 0;
}

.city-node{
  font-size: var(--fs-22);
}
.city-item-row{
  display: contents;
  gap: 0.5rem;
  align-items: start;
  
}

.city-item-row .address { 
  flex: 6;
  font-size: var(--fs-16);
  position: relative;
  padding-left: 20px;
}
.city-item-row .address .location-pin{
  position: absolute;
  color: var(--main-warning);
  top: 6px;
  left: 0;
  font-size: 16px;
}
.city-item-row .btns{
  width: 160px;
  flex: 0 0 160px;
  text-align: right;
}
.city-item-row .btn{
  font-size: 15px;
  width: 160px;
}
.city-item .classroom-name,
.city-item-row .address{
  flex: 1;
}

.plan-flex ul li{
  font-size: 13px;
}
.about-message-desp{
  font-size: 11px;
  text-align: left;
  padding-left: 4rem;
}

.section-404 h1{
  text-align: center;
  font-family: var(--poppins-font-family);
  font-size: 180px;
  letter-spacing: 10px;
  font-weight: bold;
  color: var(--main-primary);
}
.section-404 h1 span{
  display: block;
  text-align: center;
  font-size: 30px;
  letter-spacing: 2px;
}

.desp-404{
  padding-top: 2rem;
  font-size: 18px;
  text-align: center;
  padding-bottom: 15rem;
}
.btns-404{
  text-align: center;
  padding-top: 4rem;
}

/* ////////////////////// */
}

@media (max-width: 1240px) and (min-width: 1024px) {
.concept-left{
  padding-left: 7vw;
}
.concept-left .circle2{
  left: -30px;
  bottom: 0;
} 
}