@charset "utf-8";

.join-index .content-headline__bgwrap{background-image: url("/images/join/headline_bg_pc.jpg");}
.kids_junior_apply-index .content-headline__bgwrap{background-image: url("/images/join/kids_junior_apply/headline_bg_pc.jpg");}
.family_apply-index .content-headline__bgwrap{background-image: url("/images/join/family_apply/headline_bg_pc.jpg");}
@media screen and (max-width: 768px){
  .join-index .content-headline__bgwrap{background-image: url("/images/join/headline_bg_sp.jpg");}
  .kids_junior_apply-index .content-headline__bgwrap{background-image: url("/images/join/kids_junior_apply/headline_bg_sp.jpg");}
  .family_apply-index .content-headline__bgwrap{background-image: url("/images/join/family_apply/headline_bg_sp.jpg");}
}


/* join-card__rapturelist
----------------------- */
.join-card__rapturelist{
display: flex;
  justify-content: center;
  gap: 0 25px;
}
.join-card__rapturelist__box{
  background-color: #fff;
      display:flex;
    -ms-flex-pack:distribute;
    flex-direction: column;
    flex-wrap: wrap;
  width: calc((100% - 50px) / 3);
  padding: 16px 25px 45px;
}
.join-card__rapturelist__box .image{
  margin: 0 -12px 0;
  width: calc(100% + 24px);
}
.join-card__rapturelist__box .image img{
  width: 100%;
  height: auto;
}
.join-card__rapturelist__txt{
  margin-top: 1.5em;
}
@media screen and (max-width: 768px){
  .join-card__rapturelist{
    display: block;
    margin-top: 10.25vw;
    background-color: #F5F6F8;
    padding: 8vw 4vw;
  }
  .join-card__rapturelist__box{
    display: block;
    width: 100%;
    margin-top: 7.69vw;
    padding: 7.69vw 3.3vw 10.25vw;
  }
  .join-card__rapturelist__box:first-child{
    margin-top: 0;
  }
  .join-card__rapturelist__box .image{
    margin: 0;
    width: 100%;
  }
}
/* ============================================================================================================================
index
============================================================================================================================ */
/* ========================================================
join-index-what
======================================================== */
.join-index-what{
  padding: 90px 0 85px;
}
.join-index-what__read{
  text-align: center;
  line-height: 1.6em;
  font-weight: bold;
  font-size: 22px;
}
@media screen and (max-width: 768px){
  .join-index-what{
    padding: 7.69vw 0 10.25vw;
  }
  .join-index-what__read{
    font-size: 5.1vw;
  }
}
/* join-index-what__mv
----------------------- */
@media screen and (min-width: 769px){
  .join-index-what__mv{
    position: relative;
    margin: 60px 0 0;
    height: 277px;
  }
  .join-index-what__mv .image{
    width: 1400px;
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, 0);
  }
}
@media screen and (max-width: 768px){
  .join-index-what__mv{
    margin: 5.1vw -3vw 0;
  }
}
.join-index-what__caption{
  text-align: center;
  font-size: 18px;
}
@media screen and (max-width: 768px){
  .join-index-what__caption{
    font-size: 3.58vw;
  }
}
/* join-index-what__rapturelist
----------------------- */
.join-index-what__rapturelist{
display: flex;
  justify-content: center;
  gap: 0 25px;
}
.join-index-what__rapturelist__box{
  background-color: #fff;
      display:flex;
    -ms-flex-pack:distribute;
    justify-content:space-between;
    flex-direction: column;
    flex-wrap: wrap;
  width: calc((100% - 50px) / 3);
  padding: 16px 25px 45px;
}
.join-index-what__rapturelist__box .image{
  margin: 0 -12px;
}
.join-index-what__rapturelist__ttl{
  line-height: 1.6em;
  margin-top: 30px;
  font-size: 22px;
}
.join-index-what__rapturelist__ttl span{
  display: block;
  line-height: 1em;
  margin-bottom: 0.8em;
  color: #02B1B7;
  font-size: 15px;
}
.join-index-what__rapturelist__txt{
  margin-top: 0.8em;
}
.join-index-what__rapturelist__txt strong{
  font-weight: normal;
}
.join-index-what__rapturelist__link{
  margin: auto 25px 0;
  padding-top: 30px;
}
.join-index-what__rapturelist__link .link-bar__box{
  width: 100%;
  font-size: 16px;
}
@media screen and (max-width: 768px){
  .join-index-what__pagelink__ttl{
    font-weight: bold;
    text-align: center;
    color: #00B7BD;
    margin-top: 10.7vw;
  }
  .join-index-what__pagelink__ttl span{
    display: inline-block;
    position: relative;
  }
  .join-index-what__pagelink__ttl span::before,
  .join-index-what__pagelink__ttl span::after{
    content: "";
    display: block;
    background-color: #00B7BD;
    width: 1.5em;
    height: 2px;
    position: absolute;
    bottom: 0.8em;
  }
  .join-index-what__pagelink__ttl span::before{
    transform: rotate(60deg);
    left: -2.5em;
  }
  .join-index-what__pagelink__ttl span::after{
    transform: rotate(-60deg);
    right: -2.5em;
  }
  .join-index-what__rapturelist{
    display: block;
    margin-top: 10.25vw;
  }
  .join-index-what__rapturelist__box{
    display: block;
    width: 100%;
    margin-top: 7.69vw;
    padding: 7.69vw 3.3vw 10.25vw;
  }
  .join-index-what__rapturelist__box .image{
    margin: 0;
  }
  .join-index-what__rapturelist__ttl{
    margin-top: 5.1vw;
    font-size: 5.1vw;
  }
  .join-index-what__rapturelist__ttl span{
    font-size: 3vw;
  }
  .join-index-what__rapturelist__link{
    margin: auto auto 0;
    padding: 6.6vw 7.69vw 0;
  }
  .join-index-what__rapturelist__link .link-bar__box{
    font-size: 3.8vw;
    min-width: 100%;
  }
}
/* ========================================================
join-index-select
======================================================== */
.join-index-select{
  padding: 20px 0 150px;
}
@media screen and (max-width: 768px){
  .join-index-select{
    padding: 10.25vw 0;
  }
}
/* join-index-select__mv
----------------------- */
@media screen and (min-width: 769px){
  .join-index-select__mv{
    position: relative;
    height: 489px;
  }
  .join-index-select__mv .image{
    width: 1876px;
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, 0);
  }
}
@media screen and (max-width: 768px){
  .join-index-select__mv{
    margin: 0 -3vw;
  }
}
.join-index-select__lead{
  line-height: 1.6em;
  text-align: center;
  font-size: 18px;
}
.join-index-select .lineup-select{
  margin-top: 130px;
}
.join__lead{
  line-height: 1.6em;
  text-align: center;
  font-size: 18px;
}
@media screen and (max-width: 768px){
  .join-index-select__lead{
    font-size: 4.1vw;
    font-weight: bold;
  }
  .join-index-select .lineup-select{
    margin-top: 14.1vw;
  }
  .join__lead{
    font-size: 4.1vw;
    font-weight: normal;
    text-align: left;
  }
}
/* ========================================================
join-index-family
======================================================== */
.join-index-family{
  padding: 90px 0;
}
.join-index-family .tablist__body__inner{
  padding: 45px 45px 70px;
}
.join-index-family__lead{
  font-weight: bold;
  line-height: 1.6em;
  text-align: center;
  font-size: 22px;
}
@media screen and (max-width: 768px){
  .join-index-family{
    padding: 10.25vw 0;
  }
  .join-index-family .tablist__body__inner{
    padding: 4.3vw 3.3vw 10.25vw;
  }
  .join-index-family__lead{
    font-size: 5.1vw;
  }
}
/* join-index-family__point
----------------------- */
.join-index-family__point{
    display:flex;
    -ms-flex-pack:distribute;
    justify-content:space-between;
    flex-wrap: wrap;
}
.join-index-family__point__box{
  width: calc((100% - 60px) / 3);
}
.join-index-family__point__box .image img{
  width: 100%;
  height: auto;
}
.join-index-family__point__number{
  font-weight: bold;
  color: #02B1B7;
  line-height: 1em;
  display: block;
  margin-top: 1.5em;
  font-size: 15px;
}
.join-index-family__point__txt{
  margin-top: 0.8em;
}
@media screen and (max-width: 768px){
  .join-index-family__point__box{
    width: 100%;
  }
  .join-index-family__point__box:not(:first-of-type){
    margin-top: 8.7vw;
  }
  .join-index-family__point__number{
    font-size: 4.1vw;
  }
}
/* ========================================================
join-index-guide
======================================================== */
.join-index-guide{
  padding: 90px 0;
}
.join-index-guide__lead{
  font-weight: bold;
  line-height: 1.6em;
  text-align: center;
  font-size: 22px;
}
@media screen and (max-width: 768px){
  .join-index-guide{
    padding: 10.25vw 0 11.5vw;
  }
  .join-index-guide__lead{
    font-size: 5.1vw;
  }
}
/* join-index-guide__step
----------------------- */
.join-index-guide__step__ehadline{
  text-align: center;
  font-weight: normal;
  font-size: 30px;
  margin-top: 90px;
}
.join-index-guide__step__ehadline span{
  display: inline-block;
  position: relative;
}
.join-index-guide__step__ehadline span::before{
  content: "";
  display: block;
  background: #17BFC4;
  width: 0.3em;
  height: 0.3em;
  border-radius: 9999px;
  position: absolute;
  top: -0.3em;
  left: calc(50% - 0.15em);
}
.join-index-guide__step__list{
    display:flex;
    -ms-flex-pack:distribute;
    justify-content:space-between;
    flex-wrap: wrap;
}
.join-index-guide__step__list__box{
  background-color: #fff;
  text-align: center;
  padding: 1em 1.5em 2em;
  border-radius: 6px;
  width: calc((100% - 52px) / 3);
}
.join-index-guide__step__list__box .image{
  margin: 0 auto;
  width: 145px;
}
.join-index-guide__step__list__number{
  font-weight: bold;
  color: #00B7BD;
  margin-top: 1em;
}
.join-index-guide__step__list__ttl{
  margin-top: 0.5em;
  font-size: 18px;
}
.join-index-guide__step__list__txt{
  margin-top: 1em;
  font-size: 15px;
}
@media screen and (max-width: 768px){
  .join-index-guide__step__ehadline{
    font-size: 5.3vw;
    margin-top: 12.8vw;
  }
  .join-index-guide__step__list{
      display:block;
      margin-top: 7.69vw;
  }
  .join-index-guide__step__list__box{
    width: 100%;
    margin-top: 4.3vw;
  }
  .join-index-guide__step__list__box .image{
    width: 37vw;
  }
  .join-index-guide__step__list__ttl{
    font-size: 4.6vw;
  }
  .join-index-guide__step__list__txt{
    font-size: 3.8vw;
  }
}
/* ========================================================
join-index-support
======================================================== */
.join-index-support{
  padding: 90px 0;
  margin-bottom: -70px;
}
@media screen and (max-width: 768px){
  .join-index-support{
    padding: 10.25vw 0 11.5vw;
    margin-bottom: 0;
  }
}
/* ============================================================================================================================
kids_junior_apply
============================================================================================================================ */
/* ========================================================
kids-index-about
======================================================== */
.kids-index-about{
  padding: 90px 0;
  background-color: #F5F6F8;
}
.kids-index-about .inner{
  max-width: 1220px;
}
@media screen and (max-width: 768px){
  .kids-index-about{
    background: none;
  }
}
/* ========================================================
kids-index-target
======================================================== */
.kids-index-target__list{
    display:flex;
    -ms-flex-pack:distribute;
    justify-content:space-between;
    flex-wrap: wrap;
    margin-right: auto;
    margin-left: auto;
  width: 490px;
}
.kids-index-target__list li{
  text-align: center;
  border: 1px solid #DDDDDD;
  border-radius: 0.5em;
  padding: 1em;
  width: 238px;
}
.kids-index-target__list li .image{
  margin: 1em auto;
  text-align: center;
  width: 120px;
}
.kids-index-target__list li p{
  font-weight: bold;
      display:flex;
    justify-content: center;
    align-items: center;
    height: auto;
    min-height: 3em;
}
@media screen and (max-width: 768px){
  .kids-index-target__list{
    width: 100%;
  }
  .kids-index-target__list li{
    width: calc((100% - 2.5vw) / 2);
  }
}
/* ========================================================
.kids-index-contact
======================================================== */
.kids-index-contact .inner{
  max-width: 1220px;
}
.kids-index-contact .card-list{
  max-width: 890px;
  margin-right: auto;
  margin-left: auto;
}
@media screen and (max-width: 768px){
}
/* ============================================================================================================================
family_apply
============================================================================================================================ */
/* ========================================================
family-index-about
======================================================== */
.family-index-about{
  padding: 90px 0;
  background-color: #F5F6F8;
}
.family-index-about .inner{
  max-width: 1220px;
}
@media screen and (max-width: 768px){
  .family-index-about{
    background: none;
  }
}
/* ========================================================
family-index-target
======================================================== */
.family-index-target .inner{
  max-width: 1220px;
}
.family-index-target__list{
    display:flex;
    -ms-flex-pack:distribute;
    justify-content:space-between;
    flex-wrap: wrap;
    margin-right: auto;
    margin-left: auto;
}
.family-index-target__list li{
  text-align: center;
  border: 1px solid #DDDDDD;
  border-radius: 0.5em;
  padding:2em 1em;
  width: 100%;
}
@media screen and (max-width: 768px){
}
/* ========================================================
family-index-contact
======================================================== */
.family-index-contact .inner{
  max-width: 1220px;
}
.family-index-contact .card-list{
  max-width: 890px;
  margin-right: auto;
  margin-left: auto;
}
@media screen and (max-width: 768px){
}
/* join-target-content
----------------------- */
.join-target-content{
  border-top:solid 1px #83D1D5;
  margin-top: 40px;
}
.join-target-content__inner{
  border-bottom:solid 1px #83D1D5;
  text-align: center;
  padding: 90px calc(50% - 320px);
}
.join-target-content__lead{
  line-height: 1.6em;
  font-weight: bold;
  margin-top: 30px;
  font-size: 20px;
}
.join-target-content__card{
  display: flex;
  justify-content: center;
    flex-wrap: wrap;
  margin: 30px -260px 0;
  gap: 40px 18px;
}
.join-target-content__card__box{
  width: 310px;
}
.join-target-content__card__name{
  text-align: left;
  line-height: 1.6em;
  margin-top: 0.5em;
  font-size: 15px;
}
.join-target-content__inner .link-bar__box{
  max-width: 100%;
  width: 100%;
}
@media screen and (min-width: 769px){
  .join-target-content__card.join-target-content__card__pc2{
    width: 638px;
    margin: 30px 0 0;
  }
}
@media screen and (max-width: 768px){
  .join-target-content{
    margin-top: 12.8vw;
  }
  .join-target-content__inner{
    padding: 12.8vw 3vw;
  }
  .join-target-content__lead{
    margin-top: 7.69vw;
    font-size: 3.8vw;
  }
  .join-target-content__card{
    margin: 2.5vw auto 0;
    gap: 3.8vw 2.3vw;
  }
  .join-target-content__card.join-target-content__card__spleft{
    justify-content: flex-start;
  }
  .join-target-content__card__box{
    width: calc((100% - 2.3vw) / 2);
  }
  .join-target-content__card__name{
    font-size: 3vw;
  }
  .join-target-content__inner .link-bar__box a{
    padding: 0.5em 1.2em;
  }
}
/* join-target-content__borderbox
----------------------- */
.join-target-content__borderbox{
  border: 1px solid #83D1D5;
  border-radius: 0.7em;
  margin: 40px auto 0;
  padding: 40px;
  max-width: 638px;
}
.join-target-content__borderbox__ttl{
  line-height: 1.6em;
  font-size: 24px;
}
.join-target-content__borderbox .dial-content{
  margin-top: 30px;
}
@media screen and (max-width: 768px){
  .join-target-content__borderbox{
    margin: 7.69vw auto 0;
    padding: 7.69vw 0;
  }
  .join-target-content__borderbox__ttl{
    font-size: 4.6vw;
  }
  .join-target-content__borderbox .dial-content{
    margin-top: 6.15vw;
  }
}