@charset "utf-8";

/*------------  regist  ------------*/

#regist { box-sizing: border-box; margin: 0 auto; padding: 50px 3% 35px; max-width: 1120px; }
#regist .title { margin: 0 auto; padding: 0 0 30px; width: 338px; }

#regist .main { padding: 0 0 28px; }
#regist .main-inner { display: flex; align-items: center; padding: 40px 3%; background: #fff; border-radius: 18px; }
#regist .main .illust-block { padding: 0 2%; width: 50%; text-align: center; }
#regist .main .illust-block .illust { width: 100%; }
#regist .main .txt-block { padding: 0 2%; width: 50%; }
#regist .main .txt-block .lead { padding: 0 0 40px; font-family: 'Noto Sans JP', sans-serif; font-size: 28px; font-weight: 900; line-height: 1.5; -webkit-font-feature-settings:'palt' 1; font-feature-settings:'palt' 1; letter-spacing: .03em; }
#regist .main .txt-block .txt { font-size: 20px; font-weight: bold; line-height: 1.6; }

#regist .card {}
#regist .card-inner { padding: 50px 3%; background: #fff; border-radius: 18px; }
#regist .card .ttl-block { margin: 0 auto; padding: 0 0 45px; max-width: 350px; }
#regist .card .ttl-block .ttl { width: 100%; }
#regist .card .item-block { box-sizing: border-box; display: flex; }
#regist .card .item-block .item { box-sizing: border-box; width: 25%; text-align: center; }
#regist .card .item-block .item .name { font-family: 'Noto Sans JP', sans-serif; font-size: 20px; font-weight: 900; line-height: 1.5; -webkit-font-feature-settings:'palt' 1; font-feature-settings:'palt' 1; }
#regist .card .item-block .item .point-block { margin: 0 auto; padding: 0 5%; width: 80%; }
#regist .card .item-block .item .point-block .point { width: 100%; }
#regist .card .item-block .item .point-block .point a { display: block; }

.btn-home { margin: 0 auto; padding: 0 0 70px; width: 320px; }
.btn-home a { display: block; height: 60px; background: url('/images/regist/btn_home.png') no-repeat center #057eb0; background-size: 140px 18px; border-radius: 30px; text-indent: -9999px; overflow: hidden; }






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

  #regist .title { width: 303px; }
  #regist .main-inner { padding: 35px 3%; }
  #regist .main .txt-block .lead { padding: 0 0 30px; font-size: 24px; }
  #regist .main .txt-block .txt { font-size: 18px; }

  #regist .card-inner { padding: 42px 3%; }
  #regist .card .ttl-block { padding: 0 0 35px; max-width: 300px; }
  #regist .card .item-block .item .name { font-size: 16px; }

}






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

  #regist { padding: 20px 3% 20px; }
  #regist .title { padding: 0 0 16px; width: 216px; }

  #regist .main { padding: 0 0 15px; }
  #regist .main-inner { flex-direction: column; padding: 20px 3%; border-radius: 12px; }
  #regist .main .illust-block { padding: 0 4.5% 20px; width: inherit; max-width: 480px }
  #regist .main .txt-block { padding: 0 3.5% 10px; width: inherit;  }
  #regist .main .txt-block .lead { padding: 0 0 16px; font-size: 20px; }
  #regist .main .txt-block .txt { font-size: 15px; }

  #regist .card-inner { padding: 25px 3% 10px; border-radius: 12px; }
  #regist .card .ttl-block { padding: 0 4% 25px; max-width: 280px; }
  #regist .card .item-block { flex-wrap: wrap; margin: 0 auto; max-width: 500px; }
  #regist .card .item-block .item { width: 50%; padding: 0 1% 10px; }
  #regist .card .item-block .item .name { font-size: 15px; }
  #regist .card .item-block .item .point-block { width: 78%; }

  .btn-home { padding: 0 0 30px; width: 260px; }
  .btn-home a { height: 48px; background-size: 108px 14px; border-radius: 24px; }

}