@charset "utf-8";
/* CSS Document */

/*--.mv----------------------------------------------------------*/
#mv {
  background: url("../img/top/mv_bg.png") no-repeat top center;
}
#mv .container_small {
  padding: var(--m160) 0 var(--m80);
  text-align: center;
}

#mv h2 {
  margin-top: var(--m40);
  font-size: var(--fz24);
  font-weight: 600;
}

#mv h2 + p {
  font-size: var(--fz16);
  margin-top: var(--m100);
}

#mv .btn_login {
  margin: var(--m20) auto 0;
  width: 80%;
}
#mv .btn_login a {
  font-size: var(--fz24);
}
#mv .btn_login a:after {
  width: 1.2rem;
  height: 1.2rem;
}

.txt_login {
  margin-top: var(--m20);
  line-height: 1.6;
}

@media (max-width:768px) {
  #mv .btn_login a:after {
    width: 1rem;
    height: 1rem;
  }
}

/*--#facility_overview----------------------------------------------------------*/
.sec_ttl {
  font-size: var(--fz40);
  font-weight: 1000;
  border-left: solid 8px var(--blue);
  line-height: 1;
  padding-left: var(--m20);
}
.sec_ttl span {
  font-size: var(--fz16);
  margin-left: var(--m10);
}

.flex_wrap {
  display: flex;
  justify-content: space-between;
  margin-top: var(--m40);
}

.flex_img,
.flex_box {
  width: calc( 50% - var(--m20))
}

#facility_overview {
  background-color: var(--white);
}

#facility_overview .container_middle {
  padding: var(--m80) 0;
}

.btn_pdf a {
  display: flex;
  color: var(--blue);
  border: var(--blue) 2px solid;
  padding: var(--m10) var(--m20);
  line-height: 1;
  font-weight: 800;
  align-items: center;
  justify-content: center;
  font-size: var(--fz16);
  margin: var(--m20) auto 0;
  max-width: 320px;
  width: 80%;
}
.btn_pdf a:before {
  content: "";
  display: inline-block;  
  background: url("../img/common/pdf_icon.png") no-repeat center;
  background-size: contain;
  margin-right: var(--m10);
  width: 1.5rem;
  height: 1.5rem;
}

.facility_overview_list {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  border-top: var(--blue) 1px solid;
  font-size: var(--fz16);
}

.facility_overview_list dt,
.facility_overview_list dd {
  border-bottom: var(--blue) 1px solid;
  padding: var(--m20) 0;
  line-height: 1.4;
}

.facility_overview_list dt {
  width: 6rem;
  font-weight: 600;
}

.facility_overview_list dd {
  width: calc(100% - 6rem);
  color: #5d5753;
  font-weight: 800;
}

@media (max-width:768px) {
  .flex_wrap {
    flex-direction: column;
  }
  .flex_img,
  .flex_box {
    width: 100%;
  }
  .flex_img {
    text-align: center;
  }
  .flex_box:last-of-type {
    margin-top: var(--m40);
  }
}

/*--#equipment_list----------------------------------------------------------*/
#equipment_list {
  background: url("../img/top/equipmentlist_bg.png") no-repeat top center;
  background-size: cover;
}
#equipment_list .container_middle {
  padding: var(--m80) 0;
}

.sec_subttl {
  color: var(--blue);
  font-size: var(--fz24);
  font-weight: 800;
  margin-bottom: var(--m20);
  line-height: 1.2;
}

.blueline_list {
  border-top: var(--blue) 1px solid;
  font-size: var(--fz16);
  font-weight: 800;
}
.blueline_list li {
  border-bottom: var(--blue) 1px solid;
  padding: var(--m20);
  line-height: 1.2;
}

/*--#schedule_of_charges----------------------------------------------------------*/
#schedule_of_charges .container_middle {
  padding: var(--m80) 0;
}

#schedule_of_charges .sec_subttl {
  margin-top: var(--m40);
}

.charges_list {
  border-top: var(--blue) 1px solid;
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}

.table-wrap .charges_list {
  min-width: 780px;
}

.charges_list tr {
  border-bottom: var(--blue) 1px solid;
}
.charges_list th,
.charges_list td {
  padding: var(--m20);
  font-weight: 800;
  vertical-align: middle;
  line-height: 1.2;
}
.charges_list th {
  font-size: var(--fz16);
}
.charges_list tr:first-of-type th {
  text-align: center;
}
.flex_box .charges_list tr:first-of-type th {
  text-align: left;
}

.charges_list td {
  font-size: var(--fz20);
  color: var(--blue);
  text-align: center;
}

.sticky {
  position: sticky;
  top: 0;
  left: 0;
  background: none;
  border-left: none;
  border-right: none;
  width: 9rem;
  white-space: nowrap;
}
.sticky::before {
  content: "";
  position: absolute;
  top: 0;
  left: -1px;
  width: 100%;
  height: 100%;
  border-left: 1px solid var(--white);
  border-right: 1px solid var(--white);
  background-color: var(--white);
  z-index: -1;
}

.note {
  margin-top: var(--m20);
}

.note li {
  font-size: var(--fz16);
  text-indent: -1em;
  padding-left: 1em;
  line-height: 1.4;
}

.charges_list .red {
  font-size: var(--fz14);
  color: var(--red);
}

#schedule_of_charges .flex_box:last-of-type .charges_list td {
  width: 8rem;
}

@media (max-width:768px) {
  .table-wrap {
    overflow-x: scroll;
  }
}

/*--#membership_system----------------------------------------------------------*/
#membership_system {
  background-color: var(--blue);
}
#membership_system .container_middle {
  padding: var(--m80) 0;
  color: var(--white);
  font-size: var(--fz16);
  line-height: 1.6;
}

#membership_system .sec_ttl {
  border-left: solid 8px var(--white);
}

#membership_system p:first-of-type {
  margin-top: var(--m40);
}

.yellow_list li {
  text-indent: -1em;
  padding-left: 1em;
  color: #fff600;
}

.btn_contact a {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--white);
  color: var(--blue);
  font-size: var(--fz24);
  padding: var(--m20) var(--m40);
  border-radius: 5rem;
  line-height: 1;
  font-weight: 800;
  max-width: 640px;
  width: 80%;
  margin: var(--m40) auto 0;
}


/*--faq----------------------------------------------------------*/
#faq .container_middle {
  padding: var(--m80) 0;
}

.faq_list {
  margin-top: var(--m40);
}
.faq_list dt,
.faq_list dd {
  position: relative;
  line-height: 1.6;
  padding-left: 1.8rem;
  font-size: var(--fz16);
}
.faq_list dt:before,
.faq_list dd:before {
  font-weight: 1000;
  position: absolute;
  left: 0;
  top: -.2em;
  font-size: var(--fz20);
}
.faq_list dt {
  font-weight: normal;
  margin-top: var(--m20);
}
.faq_list dd {
  font-weight: 600;
  color: var(--blue);
  margin-top: var(--m20);
  padding-bottom: var(--m20);
  border-bottom: var(--blue) 1px solid;
}

.faq_list dt:before {
  content: 'Q.';
}
.faq_list dd:before {
  content: 'A.';
}


/*--faq----------------------------------------------------------*/
.blueline_list_note{
	text-align: center;
	margin-top: 1rem;
}

.flex_wrap + .blueline_list_note {
  margin-top: var(--m40);
}