/*==================================

Works of WORDING

===================================*/

#wording {
  position: relative;
  padding-top: 133px;
  padding-bottom: 141px;
  margin-bottom: 193px;
  background-color: #e3e7e8;
}
#wording .sec-heading {
  margin-bottom: 72px;
}
#wording .sec-heading__en {
  letter-spacing: 0.23em;
}
#wording .sec-heading__en-txt.sml {
  font-size: 24px;
  display: block;
  margin-bottom: 18px;
  line-height: 1.55;
  letter-spacing: 0.2em;
}
#wording .sec-heading .sec-heading__en::after {
  width: 285px;
  background-color: #fff;
}
.wordingGroup__intro {
  font-size: 14px;
  width: 100%;
  max-width: 690px;
  margin-bottom: 75px;
  line-height: 2.71;
}
#wording .works-list {
  margin-bottom: 0;
}
#wording .works-list__title {
  font-size: 20px;
  width: 100%;
  background-color: #fff;
  line-height: 1.7;
  letter-spacing: -0.02em;
}
#wording .works-list__title a {
  min-height: 182px;
  padding: 14px 29px 39px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  position: relative;
}
#wording .works-list__title a > p {
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
#wording .works-list__title a > p span {
  display: block;
}
#wording .works-list__title a > p span + br {
  display: none;
}
.wording__top-category {
  color: #6a6a6a;
  font-size: 12px;
  text-align: center;
  display: block;
  position: absolute;
  bottom: 20px;
  left: 0;
  width: 100%;
  text-align: center;
  line-height: 1.5;
}

/* アーカイブ */

#wording-archive #wording {
  position: relative;
  padding-top: 0;
  padding-bottom: 0;
  margin-bottom: 43px;
  background-color: transparent;
}
#wording-archive .works-list {
  margin-bottom: -79px;
}
#wording-archive .works-list__item {
  margin-bottom: 34px;
}
#wording-archive #wording .works-list__title {
  background-color: #f2f2f2;
}
#wording-archive #wording .works-list__title a {
  min-height: 207px;
  padding-top: 14px;
  padding-bottom: 14px;
}
#wording-archive .works-list__cat {
  padding-top: 17px;
}
#wording-archive .wording-archive__text {
  font-size: 18px;
  font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "HG明朝E", "メイリオ", Meiryo, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  line-height: 1.44;
  letter-spacing: 0.04em;
}

#wording-archive .more-view {
  position: relative;
  z-index: 2;
}

/* シングル */
#wording-single .wrap__type02 {
  max-width: 890px;
}
#wording.wording-single {
  position: relative;
  padding-top: 0;
  padding-bottom: 141px;
  margin-bottom: 0;
  background-color: transparent;
}
#wording-single .works-list__title {
  font-size: 34px;
  width: auto;
  min-height: 425px;
  padding: 35px 29px;
  margin-bottom: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1.7;
  letter-spacing: 0.04em;
  background-color: #e8e8e8;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
#wording-single .works-list__title:hover {
  opacity: 1;
}
#wording-single .works-list__title > p {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
#wording-single .works-list__title > p span {
  display: block;
}
#wording-single .works-list__title > p span + br {
  display: none;
}

.slogan-statement {
  font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "HG明朝E", "メイリオ", Meiryo, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  width: auto;
  max-width: 801px;
  padding: 122px 18% 134px;
  margin: 0 auto;
  background-color: #efefef;
}
.slogan {
  color: #000;
  padding-bottom: 72px;
  line-height: 1.7;
  letter-spacing: 0.04em;
}
.statement {
  color: #000;
  line-height: 2.33;
  letter-spacing: 0.04em;
}
.statement p:not(:last-child) {
  margin-bottom: 43px;
}
#wording-single .navigation a {
  padding-top: 80px;
  padding-bottom: 80px;
}
#wording-single .navigation a span:nth-child(1) {
  padding: 0;
}

.line-height-loose {
  line-height: 2;
}

.line-height-tight {
  line-height: 1.2;
}

@media screen and (max-width: 1180px) {
  #wording .works-list__title a {
    padding: 14px 22px 39px;
  }

  /* シングル */
  #wording-single .wrap__type02 {
    max-width: 100%;
    padding: 0 8%;
  }
  .slogan-statement {
    padding: 122px 17% 134px;
  }
  #wording-single .works-list__title {
    padding: 35px 22px;
  }
}
@media screen and (max-width: 1179px) {
  #wording-single .wrap__type02 {
    padding: 0 5%;
  }
}
@media screen and (max-width: 800px) {
  /* シングル */
  #wording-single .wrap__type02 {
    padding: 0 5%;
  }
}

@media screen and (max-width: 768px) {
  #wording {
    padding-top: 93px;
    padding-bottom: 171px;
    margin-bottom: 238px;
  }
  #wording .wrap {
    padding: 0px 9.1%;
  }
  #wording .sec-heading {
    margin-bottom: 66px;
  }
  #wording .works-list {
    padding-bottom: 51px;
  }
  .wordingGroup__intro {
    margin-bottom: 90px;
  }

  /* シングル */
  #wording-single .wrap__type02 {
    max-width: 767px;
    padding: 0 10%;
  }
  #wording-single .works-list__title {
    font-size: 23px;
    margin-bottom: 19.53125vw;
  }

  .slogan-statement {
    padding: 85px 15% 73px;
  }
  .slogan {
    padding-bottom: 49px;
    line-height: 1.38;
  }
  .statement {
    color: #000;
    line-height: 2.21;
  }
  .statement p:not(:last-child) {
    margin-bottom: 34px;
  }
}

@media screen and (max-width: 980px) {
  .works-list__item {
    width: 100%;
  }
  .works-list__item:nth-child(1),
  .works-list__item:nth-child(2),
  .works-list__item:nth-child(3) {
    margin-bottom: 37px;
  }
  .works-list__item:nth-child(n + 4) {
    margin-bottom: 37px;
  }
}

@media screen and (max-width: 750px) {
  #wording .works-list__title {
    font-size: 19px;
    line-height: 1.73;
  }
  #wording .works-list__title a {
    min-height: 161px;
  }
  .wording__top-category {
    font-size: 11px;
  }
  #wording .sec-heading .sec-heading__en::after {
    width: 185px;
  }
  #wording .sec-heading__en-txt.sml {
    font-size: 14px;
    margin-bottom: 6px;
  }

  /* アーカイブ */
  #wording-archive .works-list {
    margin-bottom: -36px;
  }
}

@media screen and (max-width: 500px) {
  /* シングル */
  #wording-single .wrap__type02 {
    max-width: 100%;
    padding: 0;
  }
  .slogan-statement {
    padding: 85px 10% 73px;
  }
}

/* Works of WORDING↑終了 */