@charset "UTF-8";

/*----------------------------------------------------
  .about
----------------------------------------------------*/
.about {
  background: #F6F5F5;
}

.about-col {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.about-inner {
  width: 45%;
}

.about-lead {
  line-height: 1.8;
  margin-bottom: 20px;
}

.about-lead>p {
  font-size: 3.2rem;
}

.about-txt {
  width: 100%;
  margin-bottom: 40px;
}

.about-txt__main {
  font-size: 2rem;
  margin-bottom: 20px;
}

.about-link-btn {
  max-width: 360px;
}

.about-imgWrap {
  width: 50%;
  position: relative;
}

.about-imgWrap::before {
  display: block;
  content: '';
  width: 100%;
  height: 0;
  padding-top: 120%;
}

.about-sp {
  display: none;
}

.about-img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}

.about-img::after {
  display: block;
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, .3);
}

.about-img>img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
}

/*----------------------------------------------------
  .point
----------------------------------------------------*/
.point {
  background: #B4B4B4;
}

.point-body {
  width: 95%;
  max-width: 1440px;
  margin: 0 auto;
}

.point-col {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.point-blk {
  width: 32%;
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, .2);
}

.point-blk:nth-of-type(n+4) {
  margin-top: 60px;
}

.point-blk__eyecatch {
  width: 100%;
  height: auto;
  position: relative;
}

.point-blk__eyecatch::after {
  display: block;
  content: '';
  width: 100%;
  height: 0;
  padding-top: 65%;
}

.point-blk__eyecatch>img {
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}

.point-blk__inner {
  width: 100%;
  padding: 20px 30px 40px 30px;
  box-sizing: border-box;
}

.point-blk__ttl {
  width: 100%;
  padding-bottom: 14px;
  border-bottom: 1px solid #ccc;
}

.point-blk__ttl>h3 {
  font-size: 2.4rem;
  text-align: center;
}

.point-blk__txt {
  padding-top: 20px;
}


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

  /*---about---*/
  .about-lead>p {
    font-size: 2.8rem;
  }

  .about-txt>p:nth-of-type(2) br:nth-of-type(1),
  .about-txt>p:nth-of-type(2) br:nth-of-type(2) {
    display: none;
  }


}

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

  /*---about---*/
  .about-col {
    flex-direction: column;
  }

  .about-imgWrap::before {
    display: block;
    content: '';
    width: 100%;
    height: 0;
    padding-top: 75%;
  }

  .about-imgWrap {
    width: 100%;
    margin-bottom: 30px;
  }

  .about-inner {
    width: 100%;
  }

  .about-sp {
    display: block;
  }

  .about-pc {
    display: none;
  }

  /*---point---*/
  .point-body {
    width: 85%;
  }

  .point-blk {
    width: 49%;
  }

  .point-blk:nth-of-type(n+3) {
    margin-top: 40px;
  }

}

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

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

  /*---point---*/
  .point-body {
    width: 90%;
  }
}

@media screen and (max-width:680px) {
  .point-blk {
    width: 100%;
  }

  .point-blk:nth-of-type(n+2) {
    margin-top: 40px;
  }
}

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

  /*---about---*/
  .about-lead>p {
    font-size: 1.8rem;
  }

  .about-txt>p br {
    display: none;
  }

  .about-link-btn {
    width: 100%;
  }

  /*---point---*/
  .point-blk:nth-of-type(n+2) {
    margin-top: 30px;
  }

  .point-blk__inner {
    padding: 20px 20px 40px 20px;
  }

  .point-blk__ttl>h3 {
    font-size: 2rem;
  }
}