@charset "utf-8";
/* STYLE LIST ------------------------------------------------------

 01. LAYOUT

 02. HEADER & FOOTER

 03. VISUAL

 04. CAMPAIGN

 05. CTA

 06. HOSPITALITY

 07. PERSONA

 08. STAFF

 09. SERVICE

 10. FACILITIES

 11. PROGRAM

 12. FLOW

 13. MEMBERSHIP

 14. ADMISSION

 15. RESERVATION

 16. INFO

 18. FORM

 19.  PREVENTION / コロナ関連

-------------------------------------------------------------------- */

/* 01. LAYOUT
-------------------------------------------------------------------- */

a {
  text-decoration: none;
}

a[href^="tel:"] {
  cursor: default;
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}

p {
  font-size: 1.4rem;
  line-height: 1.8;
  letter-spacing: 0.05rem;
}

.caution {
  font-size: 1.4rem;
}

.inner {
  width: 94%;
  max-width: 1000px;
  margin: 0 auto;
  padding: 100px 0;
}

.inner+.inner {
  padding: 0 0 100px;
}

/* タイトルパターン */
.contents_ttl {
  font-size: 5rem;
  line-height: 1.4;
  text-align: center;
  font-weight: bold;
  letter-spacing: 0.5rem;
  margin: 0 0 60px;
}

.contents_ttl span {
  position: relative;
  display: block;
  font-size: 1.6rem;
  font-weight: normal;
  letter-spacing: 0.3rem;
  margin: 40px 0 0;
}

.contents_ttl span:after {
  position: absolute;
  width: 70px;
  height: 3px;
  top: -22px;
  right: 0;
  left: 0;
  margin: 0 auto;
  content: "";
  background: #8dc21f;
}

/* PC・SP切替 */
.sp {
  display: none;
}


/* MEDIA QUERIE 961px～ */
@media screen and (min-width: 768px) {

  a {
    transition: .5s;
  }

}


/* MEDIA QUERIE ～767px */
@media screen and (max-width: 767px) {

  p {
    font-size: 1.3rem;
  }

  .inner {
    padding: 50px 0;
  }

  .pc {
    display: none;
  }

  .sp {
    display: block;
  }

}


/* MEDIA QUERIE ～480px */
@media screen and (max-width: 480px) {

  .inner {
    padding: 30px 0;
  }

  .contents_ttl {
    font-size: 2.5rem;
    margin: 0 0 30px;
  }

  .contents_ttl span {
    font-size: 1.4rem;
  }

}




/* 02. HEADER & FOOTER
-------------------------------------------------------------------- */

.header_inner {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  padding: 15px 30px;
}

.header_ttl {
  max-width: 450px;
}

.header_tel a,
.cta_tel a {
  position: relative;
  font-size: 3.6rem;
  font-weight: bold;
  color: #3e3a39;
}

.header_tel a:before,
.cta_tel a:before {
  content: '';
  background: url("../img/header_tel.svg") no-repeat 0 0;
  background-size: 40px 40px;
  width: 40px;
  height: 40px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: -50px;
  margin: auto 0;
}

.footer_inner {
  width: 94%;
  max-width: 1000px;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 30px 0;
}

.pagetop {
  position: fixed;
  right: 30px;
  bottom: 30px;
  z-index: 10;
  width: 50px;
  cursor: pointer;
}

.copyright {
  font-size: 1.2rem;
  text-align: center;
}


/* MEDIA QUERIE ～1024px */
@media screen and (max-width: 1024px) {

  .header_inner {
    display: block;
    padding: 10px 20px;
  }

  .header_ttl {
    margin: 0 auto 5px;
  }
  .header_tel {
    box-sizing: border-box;
    text-align: center;
    padding: 0 0 0 50px;
  }

}


/* MEDIA QUERIE ～480px */
@media screen and (max-width: 480px) {

  .header_tel a,
  .cta_tel a {
    font-size: 2.6rem;
  }

  .header_tel a:before,
  .cta_tel a:before {
    background: url("../img/header_tel.svg") no-repeat 0 0;
    background-size: 30px 30px;
    width: 30px;
    height: 30px;
    position: absolute;
    top: 0;
    left: -40px;
  }

  .pagetop {
    width: 40px;
  }

  .footer_inner {
    padding: 20px 0;
  }

}




/* 03. VISUAL
-------------------------------------------------------------------- */

.visual {
  background: url("../img/visual_img_pc_2008.jpg") no-repeat top center;
  background-size: cover;
  box-sizing: border-box;
  height: 683px;
}

.visual_inner {
  display: -webkit-flex;
  display: flex;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
}




/* MEDIA QUERIE ～1024px */
@media screen and (max-width: 1024px) {

  .visual {
    height: 500px;
  }

}


/* MEDIA QUERIE ～767x */
@media screen and (max-width: 767px) {

  .visual {
    background: none;
    height: auto;
  }
  .visual img {
    width: 100%;
    height: 100%;
  }

}

/* MEDIA QUERIE ～480px */
@media screen and (max-width: 480px) {}




/* 04. CAMPAIGN
-------------------------------------------------------------------- */

.campaign_ttl {
  box-sizing: border-box;
  border-top: solid 8px #e84212;
  font-size: 4rem;
  text-align: center;
  padding: 1.5rem 0 2rem;
}

.campaign_txt {
  border-top: 1px solid #3e3a39;
  margin: 50px 0 0;
  padding: 30px 0;
}

.cam_more {
  margin: 0 0 30px;
}

.campaign_hide .campaign_inner {
  padding: 0 0 60px;
}


/* MEDIA QUERIE ～767px */
@media screen and (max-width: 767px) {

  .campaign_ttl {
    font-size: 3rem;
  }

  .campaign_hide .campaign_inner {
    padding: 50px 0;
  }

  .campaign_txt {
    margin: 30px 0 0;
  }

}


/* MEDIA QUERIE ～480px */
@media screen and (max-width: 480px) {

  .campaign_ttl {
    font-size: 2rem;
  }

}




/* 05. CTA
-------------------------------------------------------------------- */

.cta_inner {
  margin: 60px auto 0;
}

.cta_only .cta_inner {
  margin: 0 auto;
}

.cta_btn {
  text-align: center;
}

.cta_btn a {
  position: relative;
  background: #8dc21f url("../img/arrow_down.svg") no-repeat right 30px center;
  background-size: 30px 20px;
  width: 95%;
  height: 100px;
  display: inline-block;
  font-size: 3.4rem;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  color: #fff;
}

.cta_btn a br {
  display: none;
}

.cta_btn a span {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  transform: translateY(-50%) translateX(-50%);
}

.cta_btn a:before, .cta_btn a:after {
  position: absolute;
  top: 0;
  width: 0;
  height: 0;
  content: '';
  border: 50px solid transparent;
  border-right: 20px solid transparent;
  border-left: 20px solid transparent;
}

.cta_btn a:before {
  right: 100%;
  border-right-color: #8dc21f;
}

.cta_btn a:after {
  left: 100%;
  border-left-color: #8dc21f;
}


/* MEDIA QUERIE ～1024px */
@media screen and (min-width: 1024px) {

  .cta_btn a:hover {
    box-shadow: none;
    opacity: 0.7;
  }

}


/* MEDIA QUERIE ～767px */
@media screen and (max-width: 767px) {

  .cta_inner {
    margin: 0;
  }

  .cta_btn a {
    background: #8dc21f url("../img/arrow_down.svg") no-repeat right 15px center;
    background-size: 20px 13px;
    width: 80%;
    font-size: 2rem;
  }

  .cta_btn a br {
    display: block;
  }

}




/* 06. HOSPITALITY
-------------------------------------------------------------------- */

.hospitality {
  position: relative;
  background: #8dc21f;
  background-image: radial-gradient(#96c730 20%, transparent 0), radial-gradient(#96c730 20%, transparent 0);
  background-position: 0 0, 18px 18px;
  background-size: 18px 18px;
}

.hospitality:after {
  position: absolute;
  content: "";
  background: url("../img/arrow_green.svg") no-repeat 0 0;
  background-size: 100px 32px;
  width: 100px;
  height: 32px;
  right: 0;
  left: 0;
  bottom: -32px;
  margin: 0 auto;
}

.hospitality h2 {
  text-align: center;
}

.hospitality_staff {
  max-width: 782px;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  margin: 40px auto 60px;
}

.hospitality_staff li {
  width: 31%;
  max-width: 220px;
}

.hospitality h3 {
  width: 90%;
  text-align: center;
  margin: 0 auto 30px;
}

.hospitality_txt {
  font-size: 1.8rem;
  color: #3e3a39;
  text-align: center;
}


/* MEDIA QUERIE ～767px */
@media screen and (max-width: 767px) {

  .hospitality:after {
    background-size: 50px 16px;
    width: 50px;
    height: 16px;
    bottom: -16px;
  }

  .hospitality_staff {
    margin: 20px auto 30px;
  }

  .hospitality_txt {
    font-size: 1.4rem;
    text-align: left;
  }

  .hospitality_txt br {
    display: none;
  }

}




/* 07. PERSONA
-------------------------------------------------------------------- */

.persona {
  position: relative;
}

.persona:after {
  position: absolute;
  content: "";
  background: url("../img/arrow_white.svg") no-repeat 0 0;
  background-size: 100px 32px;
  width: 100px;
  height: 32px;
  right: 0;
  left: 0;
  bottom: -32px;
  margin: 0 auto;
}

.persona_ttl {
  display: -webkit-flex;
  display: flex;
  border-bottom: 1px dashed #8dc21f;
}

.persona_ttl picture {
  width: 20%;
  max-width: 200px;
  min-width: 100px;
  margin: 0 5% -30px 0;
}

.persona_ttl_txt {
  width: 75%;
}

.persona_ttl_txt h2 {
  font-size: 3.4rem;
  font-weight: bold;
  color: #8dc21f;
}

.persona_ttl_txt p {
  font-size: 1.8rem;
  padding: 1rem 0;
}

.persona_comment {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  margin: 60px 0 0;
}

.persona_comment_txt {
  width: 45%;
  max-width: 428px;
  margin: 0 5% 0 0;
}

.persona_comment_txt h3 {
  font-size: 2.4rem;
  font-weight: bold;
  color: #8dc21f;
  margin: 0 0 20px;
}

.persona_comment_txt p {
  font-size: 1.6rem;
}

.persona_comment picture {
  width: 55%;
  max-width: 520px;
}


/* MEDIA QUERIE ～767px */
@media screen and (max-width: 767px) {

  .persona:after {
    background-size: 50px 16px;
    width: 50px;
    height: 16px;
    bottom: -16px;
  }

  .persona_ttl_txt br {
    display: none;
  }

  .persona_ttl_txt h2 {
    font-size: 2rem;
  }

  .persona_comment {
    display: block;
    margin: 40px 0 0;
  }

  .persona_comment_txt {
    width: 100%;
    max-width: 100%;
    margin: 0 0 30px;
  }

  .persona_comment_txt p {
    font-size: 1.4rem;
  }

  .persona_comment picture {
    display: block;
    width: 100%;
    max-width: 100%;
    text-align: center;
  }

}





/* 08. STAFF
-------------------------------------------------------------------- */

.staff {
  background: #f0f0f0;
  background-image: radial-gradient(#e6e6e6 20%, transparent 0), radial-gradient(#e6e6e6 20%, transparent 0);
  background-position: 0 0, 18px 18px;
  background-size: 18px 18px;
}

.staff_ttl {
  display: -webkit-flex;
  display: flex;
}

.staff_ttl picture {
  width: 20%;
  max-width: 200px;
  min-width: 100px;
  margin: 0 5% -30px 0;
}

.staff_ttl_txt {
  width: 75%;
}

.staff_ttl_txt h2 {
  font-size: 3.8rem;
  font-weight: bold;
  color: #3e3a39;
  margin: 2rem 0 0 2.5rem;
}

.staff_item {
  margin: 80px 0 0;
}

.staff_item ul {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 0 0 -50px;
}

.staff_item li {
  width: 32%;
  max-width: 320px;
  margin: 0 0 50px;
}

.staff_item_name {
  line-height: 1.4;
  font-weight: bold;
  text-align: center;
  margin: 2rem 0 1rem;
}

.staff_item_name span {
  display: block;
  font-size: 2rem;
}

.staff_personal {
  margin: 80px 0 0;
}

.staff_personal li {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  background: #fff;
  box-sizing: border-box;
  border: 3px solid #8dc21f;
  padding: 20px;
}

.staff_personal li:not(:last-child) {
  margin: 0 0 30px;
}

.staff_personal picture {
  width: 32%;
  max-width: 320px;
  margin: 0 5% 0 0;
}

.staff_personal_txt {
  width: 63%;
}

.staff_personal_txt h3 {
  font-size: 2.4rem;
  font-weight: bold;
}

.staff_personal_txt h3 span {
  font-size: 1.8rem;
}

.staff_item_price {
  font-size: 1.8rem;
  margin: 0 0 2rem;
}


/* MEDIA QUERIE ～767px */
@media screen and (max-width: 767px) {

  .staff_inner {
    padding: 60px 0 0;
  }
  .staff_ttl_txt h2 {
    font-size: 2rem;
  }

  .staff_item {
    margin: 40px 0 0;
  }

  .staff_item li {
    width: 49%;
    max-width: 100%;
    margin: 0 0 40px;
  }

  .staff_item ul {
    margin: 0;
  }

  .staff_item li img {
    width: 100%;
    height: auto;
  }

  .staff_personal {
    margin: 40px 0 0;
    padding: 0 0 50px;
  }

}


/* MEDIA QUERIE ～480px */
@media screen and (max-width: 480px) {

  .staff_item li {
    width: 100%;
    margin: 0 0 40px;
  }
  .staff_item li:last-child {
    display: none;
  }

  .staff_personal li {
    display: block;
  }
  .staff_personal picture {
    display: block;
    width: 100%;
    max-width: 100%;
    text-align: center;
    margin: 0 0 20px;
  }

  .staff_personal_txt {
    width: 100%;
  }

  .staff_personal_txt h3 {
    font-size: 2rem;
    text-align: center;
  }

  .staff_item_price {
    font-size: 1.6rem;
    margin: 0 0 1rem;
    text-align: center;
  }

}




/* 09. SERVICE
-------------------------------------------------------------------- */

.service h2 {
  text-align: center;
}

.service_item ul {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  margin: 60px 0 0;
}

.service_item li {
  width: 31%;
  max-width: 280px;
}

.service_item p {
  margin: 3rem 0 0;
}

.service_cta {
  background: #fff;
  background-image: radial-gradient(#f2f7e6 20%, transparent 0), radial-gradient(#f2f7e6 20%, transparent 0);
  background-position: 0 0, 18px 18px;
  background-size: 18px 18px;
  box-sizing: border-box;
  border: 3px solid #8dc21f;
  margin: 80px 0 0;
  padding: 20px;
}

.service_cta p {
  position: relative;
  font-size: 4.2rem;
  line-height: 1.4;
  font-weight: bold;
  text-align: center;
  padding: 0 0 2rem;
}

.service_cta p:before {
  content: '';
  background: url("../img/staff_img_takahashi@2x.png") no-repeat 0 0;
  background-size: 197px 201px;
  width: 197px;
  height: 201px;
  position: absolute;
  top: -55px;
  left: 10px;
}

.service_cta p:after {
  content: '';
  background: url("../img/staff_img_sagehashi@2x.png") no-repeat 0 0;
  background-size: 173px 202px;
  width: 173px;
  height: 202px;
  position: absolute;
  top: -55px;
  right: 10px;
}

.service_cta p span {
  color: #ff8c1a;
}


/* MEDIA QUERIE ～1024px */
@media screen and (max-width: 1024px) {

  .service_cta p {
    font-size: 3rem;
  }

}


/* MEDIA QUERIE ～767px */
@media screen and (max-width: 767px) {


  .service_item ul {
    margin: 30px 0 0;
  }

  .service_cta {
    margin: 40px 0 0;
  }

  .service_cta p {
    font-size: 2.5rem;
  }

  .service_cta p:before , .service_cta p:after {
    display: none;
  }

}


/* MEDIA QUERIE ～480px */
@media screen and (max-width: 480px) {


  .service_item ul {
    display: block;
  }

  .service_item li {
    width: 100%;
    max-width: 100%;
    text-align: center;
  }

  .service_item li:not(:last-child) {
    margin: 0 0 30px;
  }

  .service_item li p {
    text-align: left;
  }

}




/* 10. FACILITIES
-------------------------------------------------------------------- */

.facilities {
  background: #f0f0f0;
  background-image: radial-gradient(#e6e6e6 20%, transparent 0), radial-gradient(#e6e6e6 20%, transparent 0);
  background-position: 0 0, 18px 18px;
  background-size: 18px 18px;
}

.facilities_inner {
  width: 100%;
  max-width: 100%;
}

.facilities p {
  text-align: center;
  margin: 0 0 60px;
}

.facilities_list ul {
  overflow: hidden;
}

.facilities_list li {
  position: relative;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 1600px;
}

.facilities_cta {
  width: 90%;
  max-width: 1000px;
  margin: 0 auto;
}


@media all and (-ms-high-contrast: none){

  .facilities_list li {
    align-items: stretch;
  }

}

.facilities_list li:not(:last-child) {
  margin: 0 0 80px
}

.facilities_list li:nth-child(even) {
  flex-direction : row-reverse;
  float: right;
}

.facilities_list li:nth-child(even) .facilities_list_txt {
  left: 2%;
}

.facilities_list picture {
  width: 80%;
  max-width: 1210px;
  z-index: 1;
}

.facilities_list_txt {
  position: absolute;
  right: 2%;
  z-index: 2;
  background: rgba(255,255,255,0.9);
  filter: drop-shadow(3px 3px 10px rgba(51,51,51,0.1));
  width: 94%;
  max-width: 460px;
  box-sizing: border-box;
  padding: 60px;
}

.facilities_list_txt h3 {
  position: relative;
  font-size: 3rem;
  line-height: 1.4;
  font-weight: bold;
  margin: 0 0 2rem;
  padding: 0 0 1.5rem;
}

.facilities_list_txt h3:after {
  position: absolute;
  width: 40px;
  height: 3px;
  bottom: 0;
  left: 0;
  content: "";
  background: #8dc21f;
}

.facilities_list_txt .en {
  display: block;
  font-size: 1.4rem;
  color: #8dc21f;
  margin: 0 0 1rem;
}

.facilities_list_txt p {
  text-align: left;
  margin: 0 0 30px;
}


/* MEDIA QUERIE ～1600px */
@media screen and (max-width: 1600px) {

  .facilities_list ul {
    overflow: inherit;
  }

  .facilities_list li:nth-child(even) {
    float: none;
  }

}

/* MEDIA QUERIE ～1024px */
@media screen and (max-width: 1024px) {

  .facilities_list li {
    display: block;
  }

  .facilities_list picture {
    width: 100%;
  }

  .facilities_list_txt {
    position: static;
    max-width: 94%;
    text-align: center;
    margin: -50px auto 0;
    padding: 30px;
  }

  .facilities_list_txt h3:after {
    right: 0;
    left: 0;
    margin: 0 auto;
  }

}

/* MEDIA QUERIE ～767px */
@media screen and (max-width: 767px) {

  .facilities_list_txt h3 {
    font-size: 2rem;
  }

  .facilities_list li:not(:last-child) {
    margin: 0 0 30px
  }

  .facilities_cta {
    margin: 40px auto 0;
  }

}




/* 11. PROGRAM
-------------------------------------------------------------------- */

.program {
  background: #3e3a39;
  background-image: radial-gradient(#383433 20%, transparent 0), radial-gradient(#383433 20%, transparent 0);
  background-position: 0 0, 18px 18px;
  background-size: 18px 18px;
}

.program_inner {
  padding: 100px 0 60px;
}

.program .contents_ttl {
  color: #fff;
}

.program p,
.program h3 {
  color: #fff;
}

.program picture img {
  border: 1px solid #fff;
}

.program_copy {
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  margin: -20px 0 0;
}

.program_recommend {
  background:url("../img/program_img_darkBoxing_bk.png") no-repeat center center;
  box-sizing: border-box;
  background-size: cover;
  text-align: center;
}

.program_recommend_inner {
  position: relative;
  padding: 60px 0;
}

.program_recommend_inner:after {
  position: absolute;
  content: "";
  background: url("../img/icn_program_recommend.svg") no-repeat 0 0;
  background-size: 194px;
  width: 194px;
  height: 194px;
  top: -40px;
  left: 0;
}

.program_recommend h3 {
  font-size: 3rem;
  font-weight: bold;
  margin: 0 0 3rem;
}

.program_recommend p {
  padding: 0 0 5rem;
}

.program_item {}

.program_item_inner {
  padding: 60px 0 100px;
}

.program_item ul {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
}

.program_item li {
  width: 32%;
  background: rgba(34,34,34,0.8);
  box-sizing: border-box;
  max-width: 320px;
  margin: 0 0 20px;
  padding: 20px 20px 50px;
}

.program_item h3 {
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  padding: 2rem 0 1.5rem;
}

.program_emphasis {
  font-size: 2.4rem;
  font-weight: bold;
  text-align: center;
  margin: 1.5rem 0 0;
}

.program_emphasis .line {
  position: relative;
}

.program_emphasis .line:after {
  position: absolute;
  width: auto;
  height: 3px;
  bottom: -5px;
  right: 0;
  left: 0;
  margin: 0 auto;
  content: "";
  background: #8dc21f;
}

.program_emphasis .color {
  color: #8dc21f;
}


/* MEDIA QUERIE ～1024px */
@media screen and (max-width: 1024px) {

  .program_recommend_inner:after {
    background-size: 150px;
    width: 150px;
    height: 150px;
  }

  .program_emphasis {
    font-size: 1.8rem;
  }

}


/* MEDIA QUERIE ～767px */
@media screen and (max-width: 767px) {

  .program_inner {
    padding: 50px 0;
  }

  .program_copy {
    font-size: 1.6rem;
  }

  .program_copy br {
    display: none;
  }

  .program_recommend_inner:after {
    background-size: 120px;
    width: 120px;
    height: 120px;
    right: 0;
    margin: 0 auto;
  }

  .program_recommend h3 {
    font-size: 2rem;
    margin: 4rem 0 2rem;
  }

  .program_item li {
    width: 49%;
    max-width: 100%;
  }

  .program_item li picture {
    display: block;
    width: 100%;
  }
  
  .program_item li picture img {
    width: 100%;
    height: auto;
  }

  .program_emphasis {
    font-size: 1.6rem;
  }

  .program_emphasis .line:after {
    display: none;
  }

}


/* MEDIA QUERIE ～480px */
@media screen and (max-width: 480px) {

  .program_copy {
    font-size: 1.6rem;
    margin: 0;
  }

  .program_recommend p {
    padding: 0 0 3rem;
  }

  .program_item_inner {
    padding: 20px 0 50px;
  }

  .program_item ul {
    display: block;
  }

  .program_item li {
    width: 100%;
  }

}




/* 12. FLOW
-------------------------------------------------------------------- */

.flow_item li {
  position: relative;
}

.flow_item li:not(:last-child) {
  margin: 0 0 70px;
}

.flow_item li:after {
  position: absolute;
  content: "";
  background: url("../img/arrow_green.svg") no-repeat 0 0;
  background-size: 100px 32px;
  width: 100px;
  height: 32px;
  bottom: -55px;
  right: 0;
  left: 0;
  margin: 0 auto;
}

.flow_item li:last-child:after {
  background: none;
}

.flow_item picture {
  width: 48%;
  max-width: 480px;
  margin: 0 5% 0 0;
}

.flow_item h3 {
  position: relative;
  margin: 0 0 1.5rem;
  padding: 0 0 0 90px;
}

.flow_item h3:after {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto 0;
}

.flow_item li:first-child h3:after {
  background: url("../img/flow_step01.svg") no-repeat 0 0;
  background-size: 79px 28px;
  width: 79px;
  height: 28px;
}

.flow_item li:nth-child(2) h3:after {
  background: url("../img/flow_step02.svg") no-repeat 0 0;
  background-size: 82px 28px;
  width: 82px;
  height: 28px;
}

.flow_item li:nth-child(3) h3:after {
  background: url("../img/flow_step03.svg") no-repeat 0 0;
  background-size: 80px 28px;
  width: 80px;
  height: 28px;
}

.flow_item li:last-child h3:after {
  background: url("../img/flow_step04.svg") no-repeat 0 0;
  background-size: 83px 28px;
  width: 83px;
  height: 28px;
}

.cta_annotation {
  font-size: 1.6rem;
  text-align: center;
  padding: 0 0 3rem;
}

.cta_tel {
  text-align: center;
  margin: 20px 0 0 50px;
}


/* MEDIA QUERIE ～767px */
@media screen and (max-width: 767px) {

  .flow_item h3 {
    font-size: 1.8rem;
    text-align: left;
  }

}


/* MEDIA QUERIE ～480px */
@media screen and (max-width: 480px) {

  .flow_item picture {
    width: 100%;
    max-width: 100%;
    margin: 0 0 20px;
  }

  .cta_tel {
  margin: 20px 0 0 30px;
  }

}




/* 13. MEMBERSHIP
-------------------------------------------------------------------- */

.membership {
  background: #f0f0f0;
}

.member_table {
  color: #3e3a39;
  border: 1px solid #3e3a39;
  margin: 50px auto 0;
}

.member_table thead {
  color: #fff;
  background: #3e3a39;
}

.member_table thead th {
  font-size: 1.8rem;
  font-weight: bold;
  vertical-align: middle;
  padding: 2rem 0;
}

.member_table thead th:not(:last-child) {
  border-right: solid 1px #fff;
}

.member_table thead th {
  box-sizing: border-box;
  width: 33%;
}

.member_table tbody tr {
  background: #fff;
}

.member_table tbody tr:nth-child(even) {
  background: #edf2e2;
}

.member_table td {
  box-sizing: border-box;
  border: 1px solid #3e3a39;
  text-align: center;
  padding: 1.5rem;
}

.member_table .type {
  display: block;
  font-size: 2rem;
  font-weight: bold;
}

.member_table .price {
  font-size: 3.4rem;
  font-weight: bold;
}

.member_table .alltime {
  display: block;
  box-sizing: border-box;
  border-radius: 40px;
  background: #8dc21f;
  font-weight: bold;
  color: #fff;
  text-align: center;
  margin: 1rem 0 0;
  padding: 0.8rem;
}

.member_annotation {
  margin: 40px 0 0;
}

.member_annotation dl:not(:last-child) {
  margin: 0 0 3rem;
}

.member_annotation dt {
  font-size: 1.6rem;
  font-weight: bold;
  margin: 0 0 1rem;
}

.member_annotation dd {
  font-size: 1.4rem;
}


/* MEDIA QUERIE ～767px */

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

  thead {
    display: none;
  }

  .member_table {
    width: 100%;
    border: none;
    margin: 30px auto 0;
  }

  .member_table tr {
    display: block;
    box-sizing: border-box;
    margin: 0 0 30px;
    padding: 10px;
  }

  .member_table tbody tr:nth-child(even) {
    background: #fff;
}

  .member_table td {
    display: block;
    box-sizing: border-box;
    border: none;
    text-align: center;
    margin: 0;
    padding: 0 0 1rem;
  }

  .member_table td:before {
    box-sizing: border-box;
    margin: 0 auto 1rem;
    padding: 1rem 0;
  }

  .member_table td:first-child:before {
    content: "会員種別";
    display: block;
    background: #dfdfdf;
    text-align: center;
  }

  .member_table td:nth-child(2):before {
    content: "月会費";
    display: block;
    background: #dfdfdf;
    text-align: center;
  }

  .member_table td:nth-child(3):before {
    content: "利用時間";
    display: block;
    background: #dfdfdf;
    text-align: center;
  }

  .member_table .alltime {
    width: 94%;
    margin: 2rem auto 0;
    padding: 2rem;
  }

  .member_annotation {
    margin: 0;
  }

}




/* 14. ADMITTION
-------------------------------------------------------------------- */

.admission {
  background: #f0f0f0;
}

.admission_inner {
  padding: 0 0 100px;
}

.admission_item ul {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
}

.admission_item li {
  background: #fff;
  box-sizing: border-box;
  border: 3px solid #8dc21f;
  width: 31%;
  margin: 0 0 50px;
  padding: 30px;
}

.admission_item2 li {
  width: 48%;
}

.admission_item_special li:nth-child(n + 4) {
  width: 48%;
}

.admission_item p {
  font-size: 2.4rem;
  text-align: center;
}

.admission_item .tax {
  font-size: 1.4rem;
}

.admission_item .small {
  display: block;
  font-size: 1.4rem;
  text-align: left;
  padding: 1rem 0 0;
}


/* MEDIA QUERIE ～767px */
@media screen and (max-width: 767px) {

  .admission_inner {
    padding: 0 0 50px;
  }

  .admission_item li,
  .admission_item_special li:nth-child(n + 4) {
    width: 49%;
    margin: 0 0 10px;
    padding: 20px;
  }

  .caution {
    margin: 20px 0 0;
  }

}


/* MEDIA QUERIE ～480px */
@media screen and (max-width: 480px) {

  .admission_inner {
    padding: 0 0 30px;
  }

  .admission_item ul {
    display: block;
  }

  .admission_item li,
  .admission_item_special li:nth-child(n + 4) {
    width: 100%;
  }

}




/* 16. RESERVATION
-------------------------------------------------------------------- */

.reservation {
  background: #e1ecc8;
  padding: 100px 0;
}

.reservation_inner {
  background: #fff;
  box-sizing: border-box;
  padding: 50px;
}

.reservation_check {
  background: #f5f5f5;
  box-sizing: border-box;
  margin: 30px 0 0;
  padding: 30px;
}

.reservation_check dt {
  font-size: 1.6rem;
  font-weight: bold;
  padding: 0 0 1rem;
}

.reservation_check dd {
  font-size: 1.4rem;
  line-height: 1.8;
  padding: 0 0 3rem;
}

.reservation_check dd a {
  color: #8dc21f;
  text-decoration: underline;
}

.reservation_check p {
  text-align: center;
}

.form_caution {
  padding: 3rem 0 0;
}

.thanks h3 {
  font-size: 3rem;
  text-align: center;
  margin: 0 0 2rem;
}

.thanks p {
  text-align: center;
  margin: 0 0 2rem;
}

.thanks p a {
  color: #8dc21f;
  text-decoration: underline;
}


/* MEDIA QUERIE ～767px */
@media screen and (max-width: 767px) {

  .reservation {
    padding: 50px 0;
  }

  .reservation_inner {
    padding: 30px 20px 20px;
  }

}


/* MEDIA QUERIE ～480px */
@media screen and (max-width: 480px) {

  .reservation {
    padding: 30px 0;
  }

}




/* 17. INFO
-------------------------------------------------------------------- */

.info_inner {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}

.info_ttl {
  width: 40%;
  margin: 0 5% 0 0;
}

.info_txt_tel p {
  font-size: 1.5rem;
}

.info_txt dl {
  display: -webkit-flex;
  display: flex;
  margin: 0 0 20px;
}

.info_txt dl {
  border-bottom: 1px dashed #707070;
  font-size: 1.4rem;
  line-height: 1.8;
  letter-spacing: 0.05rem;
  padding: 0 0 1.5rem;
}

.info_txt dt {
  width: 15%;
  min-width: 60px;
  font-weight: bold;
  margin: 0 5% 0 0;
}

.info_txt dd {
  width: 80%;
}

.info_txt dd a {
  color: #3e3a39;
}

.info_txt dd span {
  display: block;
  font-size: 1.2rem;
}

.info_map img {
  box-sizing: border-box;
  border: solid 2px #3e3a39;
  padding: 10px;
}

.ggmap {
  height: 450px;
}

.ggmap iframe {
  width: 100%;
  height: 450px;
}


/* MEDIA QUERIE ～767px */
@media screen and (max-width: 767px) {

  .info_inner {
    display: block;
  }

  .info_ttl {
    width: 100%;
    text-align: center;
    margin: 0 0 30px;
  }

  .ggmap {
    height: 350px;
  }
  .ggmap iframe {
    height: 350px;
  }

}

/* MEDIA QUERIE ～480px */
@media screen and (max-width: 480px) {

  .ggmap {
    height: 250px;
  }

  .ggmap iframe {
    height: 250px;
  }

}




/* 18. FORM
-------------------------------------------------------------------- */

.form-group {
  max-width: 620px;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
  -webkit-align-items: stretch;
  align-items: stretch;
  -webkit-align-content: stretch;
  align-content: stretch;
  -webkit-flex-direction: row;
  flex-direction: row;
}

@media screen and (max-width: 767px) {
  .form-group--check {
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .form-group--check>* {
    width: 100%;
  }
}

.form-group--check div {
  margin-right: 40px;
}

@media screen and (max-width: 767px) {
  .form-group--check div {
    margin-right: 0;
    margin-top: 15px;
  }
}

.form-size--min {
  width: 48%;
  max-width: 210px;
  margin: 0 2% 0 0;
}

.form-size--mid {
  width: 100%;
  max-width: 380px;
}

.form-require {
  display: inline-block;
}

.form-require:after {
  content: "必須";
  display: inline-block;
  background: #ca004b;
  font-size: 1.2rem;
  line-height: 1;
  color: #fff;
  margin: 0 0 0 10px;
  padding: 6px 8px;
}

.form-action {
  margin: 40px 0 0;
  text-align: center;
}

.form-birthday {
  display: flex;
  align-items: center;
}

.form-birthday span {
  margin: 0 10px;
}


@media screen and (max-width: 767px) {
  .form-action {
    margin-top: 30px;
    margin-bottom: 30px;
  }
}

.form-btn {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  font-size: 24px;
  font-size: 2.4rem;
  color: #fff;
  padding: 20px 10px;
  min-width: 370px;
}

@media screen and (min-width: 768px) {
  .form-btn {
    -webkit-transition-property: opacity;
    transition-property: opacity;
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease;
  }
  .form-btn:hover {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
    opacity: 0.7;
  }
}

@media screen and (max-width: 767px) {
  .form-btn {
    min-width: 0;
  }
}

.form-btn--submit {
  position: relative;
  background: #ff8c1a url("../img/arrow_right.svg") no-repeat right 20px center;
  background-size: 14px 21px;
  width: 95%;
  max-width: 500px;
  height: 60px;
  display: inline-block;
  font-size: 2rem;
  line-height: 1.4;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  color: #fff;
  cursor: pointer;
}

.form-btn--submit span {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  transform: translateY(-50%) translateX(-50%);
}

.form-btn--submit:before, .form-btn--submit:after {
  position: absolute;
  top: 0;
  width: 0;
  height: 0;
  content: '';
  border: 30px solid transparent;
  border-right: 15px solid transparent;
  border-left: 15px solid transparent;
}

.form-btn--submit:before {
  right: 100%;
  border-right-color: #ff8c1a;
}

.form-btn--submit:after {
  left: 100%;
  border-left-color: #ff8c1a;
}

@media screen and (min-width: 768px) {
  .form-btn--submit {
    -webkit-transition-property: opacity;
    transition-property: opacity;
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease;
  }
  .form-btn--submit:hover {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
    opacity: 0.7;
  }
}

@media screen and (max-width: 767px) {
  .form-btn--submit {
    font-size: 2rem;
  }
}

.form-table {
  width: 100%;
  border-top: solid 1px #eee;
  margin: 40px 0 0;
}

.form-table__th, .form-table__td {
  box-sizing: border-box;
  border-bottom: solid 1px #eee;
  font-size: 1.6rem;
  padding: 20px 0;
}

@media screen and (max-width: 767px) {
  .form-table {
    margin: 20px 0 0;
  }
  .form-table__th, .form-table__td {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

.form-table__th, .form-table__th>*, .form-table__td, .form-table__td>* {
  line-height: 1.75;
}

.form-table__th {
  text-align: left;
  width: 280px;
}

@media screen and (max-width: 767px) {
  .form-table, .form-table__thead, .form-table__tbody, .form-table__tr, .form-table__th, .form-table__td {
    display: block;
    width: auto;
  }
  .form-table__tr+.form-table__tr {
    margin-top: 20px;
  }
  .form-table__th {
    background-color: #eee;
  }
  .form-table__th, .form-table__td {
    padding: 15px 10px;
  }
  .form-table__td {
    padding-left: 0;
    padding-right: 0;
  }
}

select, option, button, textarea, input:not([type]), input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="number"], input[type="datetime"], input[type="submit"], input[type="reset"] {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  appearance: none;
  -webkit-appearance: none;
  font-family: Arial, Verdana, "Helvetica Neue", Helvetica, "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

textarea, input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="number"], input[type="datetime"], select {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  border: 1px solid #ccc;
  font-size: 1.4rem;
  padding: 8px 10px;
}

button, input[type="submit"], input[type="reset"] {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  background: none;
  border: none;
}

input[type="radio"], input[type="checkbox"] {
  vertical-align: middle;
  width: 20px;
  height: 20px;
  margin-right: 5px;
  position: relative;
  top: -.05em;
}

button[disabled="disabled"] {
  opacity: .7;
}




/* 19. PREVENTION / コロナ関連
-------------------------------------------------------------------- */

.prevention_inner {
  margin: 0 auto -100px;
}

.prevention_main_ttl {
  font-size: 3rem;
  font-weight: bold;
  text-align: center;
  padding: 0 0 4rem;
}

.prevention ul {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}

.prevention li {
  position: relative;
  width: 31%;
  box-sizing: border-box;
  border: solid 4px #8cc11f;
  padding: 30px;
}

.prevention_num {
  position: absolute;
  top: -1.8rem;
  right: 0;
  left: 0;
  margin: 0 auto;
  width: 6rem;
  background: #fff;
  font-size: 2.5rem;
  line-height: 1.4;
  font-weight: bold;
  color: #8cc11f;
  text-align: center;
}

.prevention_icn {
  display: block;
  text-align: center;
  padding: 20px 0 30px;
}

.prevention_ttl {
  font-size: 2rem;
  line-height: 1.4;
  font-weight: bold;
  color: #003364;
  text-align: center;
  padding: 0 0 1.5rem;
}

.program_prevention {
  text-align: center;
  margin: 20px 0 -50px;
}


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

  .prevention_main_ttl br {
    display: none;
  }

}


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

  .prevention_inner {
    margin: 0 auto -50px;
  }

  .prevention_main_ttl {
    font-size: 2rem;
  }


  .prevention ul {
    display: block;
  }

  .prevention li {
    width: 100%;
  }

  .prevention li:not(:last-child) {
    margin: 0 0 40px;
  }

  .prevention_ttl {
    font-size: 1.6rem;
    padding: 0 0 1rem;
  }

}


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

  .prevention_inner {
    margin: 0 auto -30px;
  }

}