@charset "utf-8";

body{
  overflow-x: hidden;
}

.mv{
  max-width: 1275px;
  width: 90%;
  margin: 0 auto 50px;
  padding-top: 70px;
}
.mv .tit{
  max-width: 802px;
  margin: 0 auto 20px;
}
@media screen and (max-width: 767px) {
  .mv{
    margin: 0 auto 30px;
    padding-top: 30px;
  }
  .mv .tit{
    max-width: 800px;
    margin: 0 auto 10px;
  }
}

.intro{
  text-align: center;
  width: 90%;
  margin: 0 auto 70px;
}
.intro .txt1{
  font-size: clamp(18px, 3vw, 40px);
  line-height: 1.6;
  margin: 0 0 20px;
}
.intro .txt1 span{
  font-size: clamp(10px, 1.4vw, 20px);
}
.intro .txt2{
  font-size: clamp(11px, 1.6vw, 22px);
  line-height: 2;
}
@media screen and (max-width: 767px) {
  .intro{
    margin: 0 auto 30px;
  }
  .intro .txt1{
    margin: 0 0 10px;
  }
}

.design{
  max-width: 1050px;
  width: 90%;
  margin: 0 auto 70px;
}
.design .txt1{
  font-size: clamp(18px, 2.6vw, 32px);
  line-height: 1.6;
  margin: 0 0 20px;
  text-align: center;
}
.design ul{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.design ul li{
  width: calc(100% / 4 - 10px);
}
.design ul li .img span{
  right: inherit;
  left: 5px;
}
.design ul li .txt2{
  font-size: clamp(14px, 1.8vw, 22px);
  line-height: 1.4;
  margin: 10px 0 0;
  text-align: center;
}
.design ul li .txt2 span{
  display: block;
  font-size: clamp(10px, 1.2vw, 14px);
}
@media screen and (max-width: 767px) {
  .design{
    margin: 0 auto 30px;
  }
  .design .txt1{
    margin: 0 0 10px;
  }
  .design ul li{
    width: calc(100% / 2 - 3px);
    margin: 0 0 15px;
  }
  .design ul li .img span{
    right: inherit;
    left: 5px;
  }
  .design ul li .txt2{
    font-size: clamp(14px, 1.8vw, 22px);
    line-height: 1.4;
    margin: 10px 0 0;
    text-align: center;
  }
}

.kukaku{
  max-width: 1465px;
  width: 98%;
  margin: 0 auto 70px;
}
.kukaku .txt1{
  font-size: clamp(18px, 3vw, 40px);
  line-height: 1.6;
  margin: 0 0 -60px;
  text-align: center;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 767px) {
  .kukaku{
    margin: 0 auto 30px;
  }
  .kukaku .txt1{
    margin: 0 0 -5%;
  }
}

.point .img{
  max-width: 1055px;
  width: 90%;
  margin: 0 auto 30px;
}
.point .txt{
  max-width: 1280px;
  width: 90%;
  margin: 0 auto 70px;
}
@media screen and (max-width: 767px) {
  .point .img{
    margin: 0 auto 15px;
  }
  .point .txt{
    margin: 0 auto 30px;
  }
}