@charset "utf-8";


/*--------------------------------------------------------------------------
   Overwright
---------------------------------------------------------------------------*/
.page-ttl{
  background:url(../image/facilities/img_kv_pc.jpg) no-repeat center center;
  background-size: cover;  
}


/*--------------------------------------------------------------------------
   Content
---------------------------------------------------------------------------*/


/* facilities
-----------------------------------------------------------------*/
.facilities{
  padding: 80px 0 60px;
}
.facilities .inner{
  max-width: 100%;
  padding: 0;
}
.facilities .txt-lead{
  margin-bottom: 25px;
  text-align: center;
  font-size: 2.8rem;
  line-height: 1.5;
  font-weight: 600;
  color: #F55267;  
}
.facilities .txt-lead + .txt{
  margin-bottom: 50px;
  font-size: 1.8rem;
  text-align:center  
}
.facilities .wrap{
  padding-bottom: 100px;
  background: url(../image/facilities/bg_content_pc.svg) center top 100px no-repeat;
  background-size: 100%;
}
.facilities .facility-list {
  display: flex;
  max-width: 1360px;
  margin: 0 auto;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.facilities .facility-list .facility{
  width: calc((100% - 120px)/3);
  margin: 0 20px;
  position: relative;
}
.facilities .facility-list .facility .pop{
  position: absolute;
}
.facilities .facility-list .facility .pop.pop01{
  width: 76%;
  max-width: 227px;
  top:-10%;
  left: -15px;
  z-index: 2;
}
.facilities .facility-list .facility .pop.pop02{
  width: 76%;
  max-width: 227px;
  top: -10%;
  right: -20px;
  z-index: 2;
}
.facilities .facility-list .facility:nth-of-type(n+4){
  margin-top: 60px;
}
.facilities .facility-list .facility .name-facility{
  margin-top: 20px;
  font-size: 1.8rem;
  font-weight: 600;
  text-align: center;
}


/*--------------------------------------------------------------------------
   mobile
---------------------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  .page-ttl{
    background:url(../image/facilities/img_kv_sp.jpg) no-repeat center center;
    background-size: cover;  
  }    


/* facilities
-----------------------------------------------------------------*/
  .facilities{
    padding: 40px 0;
  }
  .page-ttl+section{
    background: #fff;
    background-size: 100%;
  }
  .facilities .inner{
    padding: 0;
  }
  .facilities .txt-lead {
    font-size: 1.8rem;
  }
  .facilities .txt-lead + .txt {
    font-size: 1.4rem;
  }
  .facilities .wrap{
    padding-bottom: 60px;
    background: url(../image/facilities/bg_content_sp.png) center top 100px no-repeat;
    background-size: cover;
  }
  .facilities .facility-list .facility{
    width: 100%;
    margin: 0 20px;
  }
  .facilities .facility-list .facility .pop.pop01{
    width: 76%;
    max-width: 227px;
    top:-10%;
    left: -15px;
  }
  .facilities .facility-list .facility .pop.pop02{
    width: 76%;
    max-width: 227px;
    top: -10%;
    right: -20px;
  }
  .facilities .facility-list .facility:nth-of-type(n+2){
    margin-top: 40px;
  }
  .facilities .facility-list .facility .name-facility{
    margin-top: 15px;
    font-size: 1.6rem;
  }
}