@charset "utf-8";
@import url("https://use.typekit.net/xcq5mtd.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');

.inview {
  opacity: 0;
  transition: 1.5s;
  transform: translateY(50px);
}
.inview.in {
  opacity: 1;
  transform: translateY(0);
}


.fadeimg {
  transition: .3s;
}

.l-container {
  width: 1158px;
}

.feature {
  width: 1158px;
  font-family: "Noto Sans JP", sans-serif;
  text-align: center;
  margin: 0 auto 50px;
}

.feature h1 {
  padding: 80px 0 62px;
}

/*result*/
.result {
  width: 893px;
  display: flex;
  margin: 0 0 113px 155px;
}
.result-image {
  width: 393px;
}

.result-meta {
  text-align: left;
  padding: 0 0 0 47px;
}
.result-large-text {
  font-size: 30px;
  line-height: 1.6;
  letter-spacing: 0.18em;
  margin: 0 0 23px;
}
.result-large-text span {
  font-weight: 700;
}
.result-normal-text {
  font-size: 16px;
  line-height: 2.4;
  letter-spacing: 0.13em;
}
.result-meta hr {
  width: 54px;
  border: none;
  border-bottom: 4px solid #000;
  display: block;
  margin: 72px 0 40px;
}

.result-meta h5 {
  font-size: 25px;
  font-weight: 700;
  margin: 0 0 22px;
}
.result-meta ul li {
  font-size: 16px;
  line-height: 2.6;
  letter-spacing: 0.12em;
  text-indent: -1em;
  padding: 0 0 0 1em;
}


/*trend*/
.trend {
  margin: 0 0 102px;
}
.trend h5 {
  width: 443px;
  height: 76px;
  line-height: 76px;
  letter-spacing: .07em;
  display: inline-block;
  font-size: 24px;
  position: relative;
}
.trend h5::before,
.trend h5::after {
  content: '';
  width: 20px;
  height: 76px;
  display: block;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
}
.trend h5::before {
  background-image: url(../img/tit_trend_left.png);
  left: 0;
}
.trend h5::after {
  background-image: url(../img/tit_trend_right.png);
  right: 0;
}

.trend p {
  font-size: 20px;
  line-height: 2.1;
  letter-spacing: 0.06em;
  margin: 43px 0 0;
}


/*category-title*/
.category-title {
  width: 1097px;
  display: inline-block;
  font-size: 24px;
  letter-spacing: 0.3em;
  line-height: 1.5;
  padding: 32px 0 38px;
  margin: 0 0 40px;
  position: relative;
}
.category-title::before,
.category-title::after {
  content: '';
  width: 1097px;
  height: 14px;
  display: block;
  background-repeat: no-repeat;
  position: absolute;
  left: 0;
}
.category-title::before {
  background-image: url(../img/tit_border_top.png);
  top: 0;
}
.category-title::after {
  background-image: url(../img/tit_border_bottom.png);
  bottom: 0;
}

.category-text {
  font-size: 22px;
  letter-spacing: 0.06em;
  margin: 0 0 93px;
}


/*group*/
.group h3 {
  margin: -3px 0 120px;
}
.group h3 > span {
  box-sizing: border-box;
  min-width: 210px;
  font-family: futura-pt, sans-serif !important;
  font-size: 40px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: 0.05em;
  display: inline-block;
  padding: 0 15px;
  position: relative;
}
.group h3 > span::before,
.group h3 > span::after {
  content: '';
  width: 126px;
  height: 1px;
  background: #000;
  position: absolute;
  top: 50%;
  left: -126px;
}
.group h3 > span::after {
  left: auto;
  right: -126px;
}
.group h3 span span {
  display: block;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .23em;
  margin: 23px 0 0;
}


/*block*/
.block {
  margin: 0 0 150px;
}

.block h4 {
  font-size: 21px;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0.02em;
  text-align: left;
  position: relative;
  padding: 0 0 0 180px;
}
.block h4 span {
  font-family: futura-pt, sans-serif !important;
  font-size: 61px;
  font-weight: 300;
  line-height: 1.4;
  letter-spacing: normal;
  border-bottom: 1px solid #000;
  position: absolute;
  bottom: 0;
  left: 90px;
}

.coord > ul {
  display: flex;
}


.straight .p01 { margin: 70px 60px 145px 175px; }
.straight .p01_2 { margin: 400px 0 0; }
.straight .p02 { margin: 235px 55px 85px 222px; }
.straight .p02_2 { margin: -40px 0 0; }
.straight .p03 {
  width: 414px;
  text-align: right;
  margin: 60px 30px 80px 158px;
}
.straight .p03 a {
  display: inline-block;
}
.straight .p03 a + a {
  margin: 46px 0 0;
}
.straight .p03_3 { margin: 250px 0 0; }
.straight .p04 { margin: 243px 50px 90px 278px; }
.straight .p04_2 { margin: -60px 0 0; }

.wave .p01 { margin: 75px 47px 124px 164px; }
.wave .p01_2 { margin: 350px 0 0; }
.wave .p02 { margin: 70px 68px 138px 164px; }
.wave .p02_2 { margin: 206px 0 0; }
.wave .p03 {
  width: 357px;
  text-align: right;
  margin: 80px 36px 105px 235px;
}
.wave .p03 a {
  display: inline-block;
}
.wave .p03 a + a {
  margin: 46px 0 0;
}
.wave .p03_3 { margin: 394px 0 0; }
.wave .p04 { margin: 94px 40px 110px 235px; }
.wave .p04_2 { margin: -48px 0 0; }

.natural .p01 {
  width: 694px;
  display: flex;
  justify-content: space-between;
  margin: 248px -74px 83px 36px;
  z-index: 2;
}
.natural .p01 a {
  display: inline-block;
}
.natural .p01 a + a {
  background: #fff;
  margin: 290px 0 0;
}
.natural .p01_3 { margin: -30px 0 0; }
.natural .p02 { margin: 108px 43px 265px 210px; }
.natural .p02_2 { margin: 360px 0 0; }
.natural .p03 { margin: 96px 35px 245px 165px; }
.natural .p03_2 { margin: 243px 0 0; }
.natural .p04 { margin: 118px 42px 111px 260px; }
.natural .p04_2 { margin: -40px 0 0; }


.block p {
  font-size: 18px;
  line-height: 1.9;
}
.block p + p {
  margin: 37px 0 0;
}


/*items*/
.items {
  width: 450px;
  margin: 27px auto 0;
}
.items li {
  font-family: futura-pt, sans-serif !important;
  font-size: 17px;
  font-weight: 500;
  letter-spacing: 0.03em;
  line-height: 1.6;
  display: inline-block;
  margin: 0 5px;
}


/*button*/
.button {
  margin: 175px 0 114px;
}

.buttons {
  margin: 0 0 115px;
}
.buttons ul li + li {
  margin: 41px 0 0;
}