@charset "utf-8";
/*  cnsl.css
---------------------------------------------- */

/*  pc
---------------------------------------------- */
/*-------- cnsl --------*/
#cnsl {
  padding: 60px 0 140px;
  text-align: center;
}
#cnsl .cnsl-logo img {
  width: 313px;
}
#cnsl .cnsl-ttl {
  margin-top: 40px;
}
/* 共通CSSの p が text-align: justify を直接指定しているため、継承では中央寄せにならない */
#cnsl .cnsl-txt {
  line-height: 2.2;
  text-align: center;
}

/*-------- project --------*/
/* プロジェクトのご紹介は白地にする */
.project-area {
  background: #fff;
}
#project {
  padding: 100px 0 140px;
}
#project .project-head {
  margin-bottom: 100px;
  text-align: center;
}
#project .project-head .head-sub {
  display: block;
}
#project .project-item + .project-item {
  margin-top: 100px;
}
/* 連番は装飾要素のため共通の文字サイズクラスに含めない。SPでも同じ大きさを保つ */
#project .project-item_vol {
  display: flex;
  align-items: baseline;
  gap: 10px;
  color: #c6c0ba;
  font-family: "Cormorant Garamond", serif;
  line-height: 1;
}
#project .project-item_vol-num {
  font-size: max(42px, 4.2rem);
}
#project .project-item_vol::after {
  content: "";
  flex: 1;
  height: 1px;
  margin-left: 10px;
  background: #dcd8d3;
}
#project .project-item_ttl {
  margin-top: 30px;
}
/* 英数字の塊は途中で折り返せず、両端揃えだと直前の行の文字間が開くため左揃えにする */
#project .project-item .body-txt {
  text-align: left;
}
#project .project-item_img {
  margin-top: 40px;
}
#project .project-item_img img {
  width: 100%;
}
#project .project-item_imgs {
  display: flex;
  gap: 27px;
  margin-top: 40px;
}
#project .project-item_imgs li {
  width: calc((100% - 54px) / 3);
}
#project .project-item_imgs img {
  width: 100%;
}

/*-------- event --------*/
#project .project-event {
  margin-top: 140px;
}
/* 共通CSSの p が text-align: justify を直接指定しているため、継承では中央寄せにならない */
#project .project-event .head-sub {
  text-align: center;
}
/* バナーが入るまでの枠。文言を差し替えず img に置き換える */
#project .project-event_bnr {
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 830px;
  aspect-ratio: 83/18;
  margin: 40px auto 0;
  background: #f0efed;
  color: #3b4043;
}
#project .project-more {
  margin: 80px auto 0;
  color: #000;
}

/*  sp
---------------------------------------------- */
@media only screen and (max-width: 959px) {
  /*-------- cnsl --------*/
  #cnsl {
    padding: 30px 0 70px;
  }
  #cnsl .cnsl-logo img {
    width: 24rem;
    margin-inline: auto;
  }
  #cnsl .cnsl-ttl {
    margin-top: 25px;
  }
  #cnsl .cnsl-txt {
    line-height: 2;
  }

  /*-------- project --------*/
  #project {
    padding: 50px 0 70px;
  }
  #project .project-head {
    margin-bottom: 50px;
  }
  #project .project-item + .project-item {
    margin-top: 50px;
  }
  #project .project-item_ttl {
    margin-top: 20px;
  }
  #project .project-item_img,
  #project .project-item_imgs {
    margin-top: 25px;
  }
  #project .project-item_imgs {
    display: block;
  }
  #project .project-item_imgs li {
    width: 100%;
  }
  #project .project-item_imgs li + li {
    margin-top: 15px;
  }

  /*-------- event --------*/
  #project .project-event {
    margin-top: 70px;
  }
  #project .project-event_bnr {
    margin-top: 25px;
  }
  #project .project-more {
    margin-top: 45px;
  }
}