@charset "utf-8";
/*------------------------------------------------
  LifeGateの家
------------------------------------------------*/

/*========== LifeGateの家 ==========*/

.features {
  padding: 0 15px;
}

.features-inner {
  padding: 0 0 30px;
}

.features-text {
  margin-bottom: 30px;
  text-align: center;
}

.features-content {
  position: relative;
  padding-top: calc(125px / 2);
}

.features-content:not(:last-of-type) {
  margin-bottom: 30px;
}

.features-content-title {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: calc(50% - (125px / 2));
  width: 125px;
  height: 125px;
  font-size: 2.5rem;
  line-height: 1.25;
  text-align: center;
  background-position: center;
  background-size: cover;
}

.features-content:nth-of-type(1) .features-content-title {
  background-image: url(../../images/features/background_features_01.png);
}

.features-content:nth-of-type(2) .features-content-title {
  background-image: url(../../images/features/background_features_02.png);
}

.features-content:nth-of-type(3) .features-content-title {
  background-image: url(../../images/features/background_features_03.png);
}

.features-content:nth-of-type(4) .features-content-title {
  background-image: url(../../images/features/background_features_04.png);
}

.features-content:nth-of-type(5) .features-content-title {
  background-image: url(../../images/features/background_features_05.png);
}

.features-content:nth-of-type(6) .features-content-title {
  background-image: url(../../images/features/background_features_06.png);
}

.features-content-list {
  max-width: 500px;
  margin: auto;
  padding: 90px 30px 30px;
  border: 3px solid #ccc;
}

.features-content-item {
  line-height: 2;
  text-align: center;
}

.features-content-item:not(:last-of-type) {
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 2px solid #ccc;
}

.features-content-item-image {
  display: block;
  width: 100%;
  margin-top: 15px;
}

@media print, screen and (min-width: 769px) {
  .features {
    padding: 0;
  }

  .features-inner {
    width: 1000px;
    margin: auto;
    padding: 0 0 100px;
  }

  .features-text {
    margin-bottom: 50px;
    line-height: 2;
  }

  .features-content:not(:last-of-type) {
    margin-bottom: 50px;
  }

  .features-content-list {
    max-width: 700px;
    padding: 110px 50px 50px;
  }

  .features-content-item {
    line-height: 2;
  }

  .features-content-item:not(:last-of-type) {
    margin-bottom: 30px;
    padding-bottom: 30px;
  }

  .features-content-item-image {
    width: auto;
    max-width: 100%;
    margin: 15px auto 0;
  }
}
