@charset "UTF-8";
/* --------------------------------------
　　案件ごとに編集　▼ ここから ▼
-------------------------------------- */
.secLineupDetail {
  background-image: url(../images/line_up/detail_bg_01.png);
  background-size: cover;
  background-repeat: no-repeat;
}
@media screen and (max-width: 750px) {
  .secLineupDetail {
    background-image: url(../images/line_up/sp-detail_bg_01.png);
  }
}

.secLineupDetail__inner {
  padding-top: 6rem;
  padding-bottom: 8rem;
}
@media screen and (max-width: 750px) {
  .secLineupDetail__inner {
    padding-bottom: 4rem;
  }
}

.secLineupDetail__title {
  color: #333;
  text-align: center;
  font-family: "Shippori Mincho", serif;
  font-size: 2.8rem;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: 0.14rem;
}
@media screen and (max-width: 750px) {
  .secLineupDetail__title {
    font-size: 2rem;
    letter-spacing: 0.1rem;
  }
}

.secLineupDetail__lead {
  margin-top: 3rem;
  color: #000;
  text-align: center;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.4; /* 38.4px */
  letter-spacing: 0.08rem;
}
@media screen and (max-width: 750px) {
  .secLineupDetail__lead {
    font-size: 1.4rem;
    line-height: 2; /* 28px */
    letter-spacing: 0.056rem;
    text-align: left;
  }
}
.secLineupDetail__lead--sup {
  font-size: 1.2rem;
}

.secLineupDetail__notice {
  margin-top: 1rem;
}
@media screen and (max-width: 750px) {
  .secLineupDetail__notice {
    margin-top: 0.5rem;
  }
}
.secLineupDetail__notice + .secLineupDetail__notice {
  margin-top: 0;
}

.secLineupDetail__notice--item {
  color: #333;
  text-align: center;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 500;
  line-height: 240%;
  letter-spacing: 0.06rem;
}
@media screen and (max-width: 750px) {
  .secLineupDetail__notice--item {
    font-size: 1.2rem;
    line-height: 1.8;
    text-align: left;
  }
}

.secLineupDetail__cards {
  margin-top: 6rem;
}
@media screen and (max-width: 750px) {
  .secLineupDetail__cards {
    margin-top: 3rem;
  }
}

.cardsLineupDetail {
  justify-content: center;
  gap: 0 6rem;
}
@media screen and (max-width: 750px) {
  .cardsLineupDetail {
    gap: 0;
  }
}

@media screen and (max-width: 750px) {
  .cardsLineupDetail__item {
    width: 8rem;
  }
}
.cardsLineupDetail__item:nth-child(2) .cardLineupDetail__img {
  width: 5.1rem;
}
@media screen and (max-width: 750px) {
  .cardsLineupDetail__item:nth-child(2) .cardLineupDetail__img {
    width: 4rem;
  }
}
.cardsLineupDetail__item:nth-child(3) .cardLineupDetail__img {
  width: 5.5rem;
}
@media screen and (max-width: 750px) {
  .cardsLineupDetail__item:nth-child(3) .cardLineupDetail__img {
    width: 4rem;
  }
}
.cardsLineupDetail__item:nth-child(4) .cardLineupDetail__img {
  width: 5.4rem;
}
@media screen and (max-width: 750px) {
  .cardsLineupDetail__item:nth-child(4) .cardLineupDetail__img {
    width: 4rem;
  }
}

.cardLineupDetail {
  position: relative;
}
.cardLineupDetail:hover .cardLineupDetail__img {
  transform: scale(1.05);
}
.cardLineupDetail:hover .cardLineupDetail__title::before {
  bottom: 0.4rem;
  transition: all 0.3s;
}

.cardLineupDetail__img {
  width: 10.6rem;
  height: 21.1rem;
  margin: 0 auto;
  transition: all 0.3s;
}
@media screen and (max-width: 750px) {
  .cardLineupDetail__img {
    width: 7.5rem;
    height: 15.7rem;
  }
}
.cardLineupDetail__img img {
  object-fit: contain;
  object-position: center bottom;
  width: 100%;
  height: 100%;
}

.cardLineupDetail__content {
  margin-top: 2rem;
}

.cardLineupDetail__title {
  color: #333;
  text-align: center;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.5; /* 24px */
  letter-spacing: 0.08rem;
  padding-bottom: 3.5rem;
  position: relative;
}
@media screen and (max-width: 750px) {
  .cardLineupDetail__title {
    font-size: 1rem;
    line-height: 1.3; /* 13px */
    letter-spacing: 0.05rem;
  }
}
@media screen and (max-width: 750px) {
  .cardLineupDetail__title--spLarge {
    font-size: 1.2rem;
    letter-spacing: 0.06rem;
  }
}
.cardLineupDetail__title::before {
  content: "";
  display: block;
  width: 1.5rem;
  height: 1.5rem;
  border-left: 0.3rem solid #C5C5C5;
  border-bottom: 0.3rem solid #C5C5C5;
  transform: rotate(-45deg) translateX(-50%);
  position: absolute;
  bottom: 0.9rem;
  left: 50%;
  transition: all 0.3s;
}

.secLineupProduct--cream .columnLineupProduct {
  gap: 0 9.2rem;
}
.secLineupProduct--cream .columnLineupProduct__img {
  width: 51.1rem;
  margin: -5rem;
}
@media screen and (max-width: 750px) {
  .secLineupProduct--cream .columnLineupProduct__img {
    margin: -7.7rem;
    width: 35.5rem;
  }
}
.secLineupProduct--cream .secLineupProduct__lower {
  background-color: #F1F8FF;
}
.secLineupProduct--cream .buttonMain {
  border-color: #004EA2;
}
.secLineupProduct--cream .buttonMain::after {
  background-image: url(../images/common/arrow_icon02.png);
}
.secLineupProduct--cream .buttonMain[target=_blank]::after {
  background-image: url(../images/common/button_blank_icon02.png);
}
.secLineupProduct--cream .buttonMain__inner {
  color: #004EA2;
}

.secLineupProduct--spray .secLineupProduct__lower {
  background-color: #FFF7FA;
}
.secLineupProduct--spray .columnLineupProduct__title--en {
  color: #E2698E;
}
.secLineupProduct--spray .columnLineupProduct__title--jp {
  color: #E2698E;
}
.secLineupProduct--spray .listLineupProduct__item {
  color: #E2698E;
  border: 0.1rem solid #E2698E;
}
.secLineupProduct--spray .listLineupProduct__item:nth-child(n+4) {
  border: none;
  background-image: url(../images/line_up/list_product_iconbg_02.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.secLineupProduct--spray .boxLineupProduct__title--text {
  color: #E2698E;
}
.secLineupProduct--spray .cardLineupProduct__title {
  border-color: #E2698E;
}
.secLineupProduct--spray .buttonMain {
  border-color: #E2698E;
}
.secLineupProduct--spray .buttonMain::after {
  background-image: url(../images/common/arrow_icon03.png);
}
.secLineupProduct--spray .buttonMain[target=_blank]::after {
  background-image: url(../images/common/button_blank_icon03.png);
}
.secLineupProduct--spray .buttonMain__inner {
  color: #E2698E;
}

.secLineupProduct--lotion .secLineupProduct__lower {
  background-color: #EBF9F9;
}
.secLineupProduct--lotion .columnLineupProduct__title--en {
  color: #20AAAC;
}
.secLineupProduct--lotion .columnLineupProduct__title--jp {
  color: #20AAAC;
}
.secLineupProduct--lotion .listLineupProduct__item {
  color: #20AAAC;
  border: 0.1rem solid #20AAAC;
}
.secLineupProduct--lotion .listLineupProduct__item:nth-child(n+4) {
  border: none;
  background-image: url(../images/line_up/list_product_iconbg_03.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.secLineupProduct--lotion .boxLineupProduct__title--text {
  color: #20AAAC;
}
.secLineupProduct--lotion .cardLineupProduct__title {
  border-color: #20AAAC;
}
.secLineupProduct--lotion .buttonMain {
  border-color: #20AAAC;
}
.secLineupProduct--lotion .buttonMain::after {
  background-image: url(../images/common/arrow_icon04.png);
}
.secLineupProduct--lotion .buttonMain[target=_blank]::after {
  background-image: url(../images/common/button_blank_icon04.png);
}
.secLineupProduct--lotion .buttonMain__inner {
  color: #20AAAC;
}

.secLineupProduct--foam .secLineupProduct__lower {
  background-color: #FEF8EE;
}
.secLineupProduct--foam .columnLineupProduct__title--en {
  color: #F6AC19;
}
.secLineupProduct--foam .columnLineupProduct__title--jp {
  color: #F6AC19;
}
.secLineupProduct--foam .listLineupProduct__item {
  color: #F6AC19;
  border: 0.1rem solid #F6AC19;
}
.secLineupProduct--foam .listLineupProduct__item:nth-child(n+4) {
  border: none;
  background-image: url(../images/line_up/list_product_iconbg_04.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.secLineupProduct--foam .boxLineupProduct__title--text {
  color: #F6AC19;
}
.secLineupProduct--foam .cardLineupProduct__title {
  border-color: #F6AC19;
}
.secLineupProduct--foam .buttonMain {
  border-color: #F6AC19;
}
.secLineupProduct--foam .buttonMain::after {
  background-image: url(../images/common/arrow_icon05.png);
}
.secLineupProduct--foam .buttonMain[target=_blank]::after {
  background-image: url(../images/common/button_blank_icon05.png);
}
.secLineupProduct--foam .buttonMain__inner {
  color: #F6AC19;
}

.secLineupProduct__upperInner {
  padding-top: 8rem;
  padding-bottom: 6rem;
}
@media screen and (max-width: 750px) {
  .secLineupProduct__upperInner {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
}

.secLineupProduct__column {
  padding-left: 8rem;
}
@media screen and (max-width: 750px) {
  .secLineupProduct__column {
    padding-left: 0;
    align-items: center;
  }
}

.columnLineupProduct {
  gap: 0 12rem;
}
@media screen and (max-width: 750px) {
  .columnLineupProduct {
    flex-direction: column;
  }
}

.columnLineupProduct__item:nth-child(2) {
  flex-grow: 1;
}

.columnLineupProduct__img {
  width: 48rem;
  margin: -5rem;
}
@media screen and (max-width: 750px) {
  .columnLineupProduct__img {
    margin: -8rem;
    width: 36rem;
  }
}

.columnLineupProduct__title {
  position: relative;
  padding-top: 5.2rem;
}
@media screen and (max-width: 750px) {
  .columnLineupProduct__title {
    padding-top: 2.3rem;
  }
}

.columnLineupProduct__title--en {
  color: #004EA2;
  text-align: center;
  font-family: "Aboreto", system-ui;
  font-size: 10rem;
  font-style: normal;
  font-weight: 400;
  line-height: 100%; /* 100px */
  letter-spacing: 0.5rem;
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0.1;
}
@media screen and (max-width: 750px) {
  .columnLineupProduct__title--en {
    font-size: 6rem;
    letter-spacing: 0.03rem;
    width: 100%;
  }
}

.columnLineupProduct__title--jp {
  color: #004EA2;
  text-align: center;
  font-size: 3.2rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.5; /* 48px */
}
@media screen and (max-width: 750px) {
  .columnLineupProduct__title--jp {
    font-size: 2.4rem;
    display: block;
  }
}

.columnLineupProduct__subtitle {
  margin-top: 4rem;
  color: #333;
  font-size: 2.4rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.8; /* 43.2px */
  letter-spacing: 0.12rem;
}
@media screen and (max-width: 750px) {
  .columnLineupProduct__subtitle {
    margin-top: 2rem;
    font-size: 1.6rem;
    line-height: 1.7; /* 27.2px */
    letter-spacing: 0.08rem;
  }
}

.columnLineupProduct__info {
  margin-top: 1.5rem;
}

.columnLineupProduct__infoName {
  display: flex;
  align-items: center;
  gap: 0 0.8rem;
}

.columnLineupProduct__infoName--text {
  color: #464646;
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.6; /* 22.4px */
  letter-spacing: 0.07rem;
}

.columnLineupProduct__infoName--notice {
  color: #333;
  font-size: 1.1rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.5; /* 16.5px */
  letter-spacing: 0.09rem;
  border: 0.1rem solid #333;
  padding: 0 0.8rem;
}

.columnLineupProduct__infoDetail {
  margin-top: 0.2rem;
  color: #464646;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.6; /* 19.2px */
  letter-spacing: 0.06rem;
}

.columnLineupProduct__list {
  margin-top: 4rem;
  margin-left: auto;
  margin-right: 0.4rem;
}
@media screen and (max-width: 750px) {
  .columnLineupProduct__list {
    margin-top: 2rem;
    margin-right: 0;
  }
}

.listLineupProduct {
  gap: 0 1.2rem;
  justify-content: flex-end;
}
@media screen and (max-width: 750px) {
  .listLineupProduct {
    margin-left: 0;
    gap: 0.5rem 1rem;
    flex-wrap: wrap;
    justify-content: center;
  }
}

.listLineupProduct__item {
  color: #004EA2;
  font-family: "Sawarabi Gothic", sans-serif;
  font-size: 1.3rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.2; /* 28px */
  letter-spacing: 0.25rem;
  text-align: center;
  background-color: #fff;
  width: 6rem;
  height: 6rem;
  border-radius: 6rem;
  border: 0.1rem solid #004EA2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 750px) {
  .listLineupProduct__item {
    width: 6rem;
    height: 6rem;
    font-size: 1.3rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.1; /* 26px */
    letter-spacing: 0.23rem;
  }
  .listLineupProduct__item:nth-child(1) {
    margin-left: 3rem;
  }
  .listLineupProduct__item:nth-child(3) {
    margin-right: 3rem;
  }
}
.listLineupProduct__item--lsSmall {
  letter-spacing: 0.1rem;
}
.listLineupProduct__item--ptSmall {
  padding-top: 0.4rem;
}
.listLineupProduct__item--textSmall {
  font-size: 1.1rem;
  letter-spacing: 0.03rem;
}
@media screen and (max-width: 750px) {
  .listLineupProduct__item--splsSmall {
    letter-spacing: 0.09rem;
  }
}
.listLineupProduct__item:nth-child(n+4) {
  border: none;
  background-image: url(../images/line_up/list_product_iconbg_01.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.secLineupProduct__lower {
  background-color: #F1F8FF;
}

.secLineupProduct__lowerInner {
  padding-top: 4rem;
  padding-bottom: 6rem;
}
@media screen and (max-width: 750px) {
  .secLineupProduct__lowerInner {
    padding-top: 2rem;
    padding-bottom: 5rem;
  }
}

.boxLineupProduct {
  max-width: 93rem;
  margin: 0 auto;
}

.boxLineupProduct__blk + .boxLineupProduct__blk {
  margin-top: 4rem;
}

.boxLineupProduct__title {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.boxLineupProduct__title--text {
  color: #004EA2;
  text-align: center;
  font-size: 2.4rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2; /* 48px */
  letter-spacing: 0.1rem;
}
@media screen and (max-width: 750px) {
  .boxLineupProduct__title--text {
    font-size: 1.8rem;
    letter-spacing: 0.09rem;
  }
}

.boxLineupProduct__title--fukidashi {
  display: block;
  margin: 0.4rem auto 0;
  width: 30rem;
}
@media screen and (max-width: 750px) {
  .boxLineupProduct__title--fukidashi {
    width: 100%;
  }
}

.boxLineupProduct__img {
  width: 46rem;
  margin: 2rem auto 0;
}
@media screen and (max-width: 750px) {
  .boxLineupProduct__img {
    width: 100%;
  }
}

.boxLineupProduct__cards {
  margin-top: 2rem;
}

.cardsLineupProduct {
  gap: 0 2rem;
  justify-content: center;
}
@media screen and (max-width: 750px) {
  .cardsLineupProduct {
    flex-direction: column;
    align-items: center;
    gap: 1.5rem 0;
  }
}

.cardsLineupProduct__item {
  width: 28rem;
}
@media screen and (max-width: 750px) {
  .cardsLineupProduct__item {
    width: 29rem;
  }
}

@media screen and (max-width: 750px) {
  .cardLineupProduct {
    display: flex;
    align-items: center;
    gap: 0 1rem;
  }
}

@media screen and (max-width: 750px) {
  .cardLineupProduct__img {
    width: 15rem;
    margin: 0 -2rem -1rem;
    flex-shrink: 0;
  }
}

.cardLineupProduct__content {
  margin-top: 1rem;
}
@media screen and (max-width: 750px) {
  .cardLineupProduct__content {
    margin-top: 0;
    flex-grow: 1;
  }
}

.cardLineupProduct__title {
  color: #333;
  text-align: center;
  font-size: 1.8rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.4; /* 43.2px */
  letter-spacing: 0.09rem;
  border-bottom: 0.1rem solid #004EA2;
}
@media screen and (max-width: 750px) {
  .cardLineupProduct__title {
    font-size: 1.3rem;
    line-height: normal;
    letter-spacing: 0.065rem;
    padding-bottom: 0.5rem;
  }
}

.cardLineupProduct__text {
  margin-top: 1rem;
  color: #333;
  text-align: center;
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.8; /* 25.2px */
  letter-spacing: 0.07rem;
}
@media screen and (max-width: 750px) {
  .cardLineupProduct__text {
    margin-top: 0.5rem;
    font-size: 1.2rem;
    line-height: normal;
    letter-spacing: 0.06rem;
  }
}

.boxLineupProduct__notice {
  margin-top: 4rem;
  padding: 1rem 3rem 2rem;
  background-color: #fff;
}
@media screen and (max-width: 750px) {
  .boxLineupProduct__notice {
    margin-top: 3rem;
  }
}

.boxLineupProduct__noticeTitle {
  color: #333;
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.5; /* 21px */
  letter-spacing: 0.11rem;
  padding-bottom: 0.4rem;
  border-bottom: 1px solid #C5C5C5;
  text-align: center;
}

.boxLineupProduct__noticeText {
  margin-top: 1rem;
  color: #333;
  font-size: 1.1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5; /* 16.5px */
  letter-spacing: 0.09rem;
}
@media screen and (max-width: 750px) {
  .boxLineupProduct__noticeText {
    font-size: 1.2rem;
    letter-spacing: 0;
  }
}

.boxLineupProduct__button {
  margin: 4rem auto 0;
  max-width: 40rem;
}
@media screen and (max-width: 750px) {
  .boxLineupProduct__button {
    margin-top: 2rem;
    max-width: 25rem;
  }
}
/*# sourceMappingURL=line_up.css.map */