@charset "UTF-8";

/*-------------------------
 common
-------------------------*/
html {
  font-size: 10px;
}

.l-container {
  width: 100%;
  margin: auto;
}

.feature {
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic", "メイリオ", sans-serif;
}

.feature .dunbarN {
  font-family: "dunbar-tall", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.feature .dunbarI {
  font-family: "dunbar-tall", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.feature {
  width: 100%;
  font-feature-settings: "palt";
}

.feature img {
  width: 100%;
  height: auto;
  display: block;
}

.feature a {
  transition: opacity .3s;
}

.feature a:hover {
  text-decoration: none;
  opacity: 0.6;
}


html {
  font-size: 10px;
}

@media screen and (max-width: 1400px) {
  html {
    font-size: calc(10 * (100vw / 1400));
  }
}


/*-------------------------
 slide
-------------------------*/
.feature .js-fade {
  opacity: 0;
  transition: opacity 2s ease-in;
}

.feature .js-fade.is-active {
  opacity: 1;
}

.feature .js-slider_infinity.slick-initialized,
.feature .js-slider_fade.slick-initialized {
  opacity: 0;
}

.feature .js-slider_infinity.slick-initialized,
.feature .js-slider_fade.slick-initialized {
  opacity: 1;
}

.feature .js-slider_fade {
  pointer-events: auto;
}

/*-------------------------
 PC
-------------------------*/
/* ------------ FV ------------ */
.feature h2 {
  width: 31.2rem;
  margin: 0 auto;
}

.feature h2 img {
  margin-left: 0.4rem;
}

.feature .itemArea {
  margin-top: 1.8rem;
  height: fit-content;
}

.feature .itemArea_list {
  width: 23.2rem;
  margin: 0 1.5rem;
}

.feature .leadArea {
  position: relative;
  margin-top: 1.4rem;
  text-align: center;
  z-index: 1;
}

.feature .leadArea_text {
  margin-top: 3.2rem;
  letter-spacing: 0.05em;
  line-height: 2;
  font-size: 1.6rem;
  color: #282828;
}

.feature .leadArea_text:nth-of-type(1) {
  margin-top: 0;
}

/* ------------ cntArea ------------ */
.feature .cntArea {
  position: relative;
  margin-top: 14.5rem;
}

.feature .cntArea::before {
  content: "";
  position: absolute;
  top: 13.6rem;
  left: 0;
  width: 100%;
  height: 104.4rem;
  background: #f9efef;
  z-index: -3;
}

.feature .cntArea__inner {
  width: 140rem;
  margin: 0 auto;
}

.feature .whiteBg {
  position: relative;
}

.feature .whiteBg::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 99.8%;
  height: 99.8%;
  margin: auto;
  background: #fff;
  z-index: -1;
}

.feature .ctn04__model02.whiteBg::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 99%;
  height: 99%;
  margin: auto;
  background: #fff;
  z-index: -1;
}


.feature .cntArea__clor {
  position: absolute;
  top: 5.6rem;
  letter-spacing: 0.1em;
  line-height: 1.5;
  font-size: 1.6rem;
  color: #3c3c3c;
  pointer-events: none;
  z-index: 1;
}

.feature .cntArea__creditArea {
  margin-top: 3.3rem;
  text-align: center;
  letter-spacing: 0.075em;
  line-height: 2;
  font-size: 1.2rem;
  color: #3c3c3c;
}

.feature .cntArea__creditArea a {
  display: inline-block;
  text-decoration: underline;
  text-decoration-skip-ink: none;
  font-feature-settings: "palt";
}

.feature .cntArea__creditLeft {
  margin-left: 1.1rem;
}

.feature .cntArea__creditLeftPC {
  margin-left: 1.1rem;
}

/* ------------ cnt01 ------------ */
.feature .cnt01 {
  margin-top: 14.1rem;
}

.feature .cnt01__model01 {
  width: 48rem;
  margin: 0 auto;
}

.feature .cnt01__modelArea {
  display: flex;
  justify-content: space-between;
  width: 83rem;
  margin: 8rem auto 0;
}

.feature .cnt01__model02 {
  width: 39rem;
  height: 52rem;
}

.feature .cnt01__model02::after {
  content: "";
  display: block;
  position: absolute;
  top: -2rem;
  right: -2rem;
  width: 39rem;
  height: 52rem;
  background: #e5cccc;
  z-index: -2;
}

.feature .cnt01 .cntArea__clor {
  right: -6.4rem;
}

.feature .cnt01__model03 {
  width: 34rem;
  margin-top: 18rem;
}

.feature .cnt01__model03::after {
  content: "";
  display: block;
  position: absolute;
  bottom: -2rem;
  left: -2rem;
  width: 33.8rem;
  height: 45.1rem;
  border: 1px solid #e5cccc;
  z-index: -2;
}

.feature .cnt01 .cntArea__creditArea {
  margin-top: 5.3rem;
}

/* ------------ cnt02 ------------ */
.feature .cnt02::before {
  top: 12rem;
  height: 55rem;
  background: #ebebeb;
}

.feature .cnt02__modelArea {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  width: 91rem;
  margin: 0 auto;
}

.feature .cnt02__model01 {
  width: 45rem;
  height: 60rem;
}

.feature .cnt02__model02 {
  width: 36rem;
  margin-top: 25rem;
}

.feature .cnt02__model02::after {
  content: "";
  display: block;
  position: absolute;
  top: -2rem;
  right: -2rem;
  width: 35.8rem;
  height: 47.8rem;
  border: 1px solid #bbbbbb;
  z-index: -2;
}




/* ------------ cnt03 ------------ */
.feature .cnt03::before {
  top: 12rem;
  height: 57rem;
  background: #f5f4f0;
}

.feature .cnt03__modelArea {
  display: flex;
  justify-content: space-between;
  width: 91rem;
  margin: 0 auto;
}

.feature .cnt03__model01 {
  width: 45rem;
  height: 60rem;
}

.feature .cnt03__model02 {
  width: 36rem;
  margin-top: 25rem;
}

.feature .cnt03__model02::after {
  content: "";
  display: block;
  position: absolute;
  bottom: -2rem;
  left: -2rem;
  width: 36rem;
  height: 48rem;
  background: #e6e2d8;
  z-index: -2;
}

.feature .cnt03 .cntArea__clor {
  top: 7.6rem;
  left: -5.4rem;
}

.feature .cnt03 .cntArea__clor span {
  display: inline-block;
  text-indent: 2.6rem;
}

.feature .cnt03 .cntArea__creditArea {
  margin-top: 5.3rem;
}




/* ------------ cnt04 ------------ */
.feature .cnt04::before {
  top: 12rem;
  height: 55rem;
  background: #d3dae3;
}

.feature .cnt04__modelArea {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  width: 91rem;
  margin: 0 auto;
}

.feature .cnt04__model01 {
  width: 45rem;
  height: 60rem;
  margin-right: -1.5rem;
}

.feature .cnt04__model02 {
  width: 36rem;
  margin-top: 25rem;
  margin-left: 1.5rem;
}

.feature .cnt04__model02::after {
  content: "";
  display: block;
  position: absolute;
  top: -2rem;
  right: -2rem;
  width: 35.8rem;
  height: 47.8rem;
  border: 1px solid #54647a;
  z-index: -2;
}



/* ------------ pointArea ------------ */
.feature .pointArea {
  margin-top: 14.8rem;
}

.feature .pointArea__title {
  position: relative;
}

.feature .pointArea__title::before {
  content: "";
  display: block;
  position: absolute;
  top: 1rem;
  left: 0;
  width: 100%;
  height: 1px;
  background: #3c3c3c;
  z-index: -1;
}

.feature .pointArea__title h3 {
  width: 30.5rem;
  margin: 0 auto;
  padding: 0 5.4rem;
  background: #fff;
}

.feature .pointArea__lead {
  width: 12.8rem;
  margin: 1.8rem auto 0;
}

.feature .iconArea {
  position: relative;
  margin-top: 5.1rem;
}

.feature .iconArea::before {
  content: "";
  display: block;
  position: absolute;
  top: 4rem;
  left: 0;
  width: 100%;
  height: 32.5rem;
  background: #f5f4f0;
  z-index: -1;
}

.feature .iconArea__inner {
  width: 140rem;
  margin: 0 auto;
}

.feature .iconArea__box {
  display: flex;
  justify-content: space-between;
  width: 77.8rem;
  margin: 0 auto;
  padding-inline-start: 0;
}

.feature .iconArea__list {
  width: 25.8rem;
  list-style: none;
}

.feature .iconArea__imgArea {
  width: 18rem;
  margin: 0 auto;
}

.feature .iconArea__textArea {
  margin-top: 2.8rem;
  text-align: center;
}

.feature .iconArea__name {
  letter-spacing: 0.1em;
  font-size: 2.4rem;
  color: #3c3c3c;
}

.feature .iconArea__text {
  margin-top: 0.5rem;
  letter-spacing: 0.05em;
  line-height: 2;
  font-size: 1.6rem;
  color: #3c3c3c;
}

@media screen and (min-width: 768px) {

  /* ------------ PC Only ------------ */
  .sp_only {
    display: none;
  }

  .pc_only {
    display: block;
  }

  .feature {
    margin: 2.5rem 0 0;
  }

  .feature .cnt01 .credit .item:nth-child(n+2) {
    display: inline-block;
  }

  .feature .cnt01 .credit .item:nth-child(3) {
    margin: 0 0.7rem;
  }

  .feature .cnt02 .credit .item:nth-child(n+2) {
    display: inline-block;
    margin: 0 0.4rem;
  }

  .feature .cnt03 .credit .item:nth-child(n+2) {
    display: inline-block;
    margin: 0 0.4rem;
  }

  .feature .cnt04 .credit .item:nth-child(n+2) {
    display: inline-block;
    margin: 0 0.4rem;
  }
}

/*-------------------------
 SP
-------------------------*/
@media screen and (max-width: 767px) {
  .sp_only {
    display: block;
  }

  .pc_only {
    display: none;
  }

  /* ------------ FV ------------ */
  .feature {
    margin: calc(107 *(100vw / 750)) 0 0;
  }

  .feature h2 {
    width: calc(522* (100vw / 750));
  }

  .feature h2 img {
    margin-left: calc(5* (100vw / 750));
  }

  .feature .itemArea {
    margin-top: calc(20* (100vw / 750));
  }

  .feature .itemArea_list {
    width: calc(330* (100vw / 750));
    margin: 0;
  }

  .feature .leadArea {
    margin-top: calc(-11* (100vw / 750));
  }

  .feature .leadArea_text {
    margin-top: calc(48* (100vw / 750));
    line-height: 2;
    font-size: calc(24* (100vw / 750));
  }

  /* ------------ cntArea ------------ */
  .feature .cntArea {
    margin-top: calc(192* (100vw / 750));
  }

  .feature .cntArea::before {
    top: calc(240* (100vw / 750));
    height: calc(2000* (100vw / 750));
  }

  .feature .cntArea__inner {
    width: 100%;
  }

  .feature .cntArea__clor {
    top: calc(80* (100vw / 750));
    font-size: calc(24* (100vw / 750));
  }

  .feature .cntArea__creditArea {
    margin-top: calc(48* (100vw / 750));
    font-size: calc(22* (100vw / 750));
  }

  .feature .cnt01 .credit .item:nth-child(2),
  .feature .cnt01 .credit .item:nth-child(3) {
    display: inline-block;
  }

  .feature .cnt01 .credit .item:nth-child(3) {
    margin-left: calc(15* (100vw / 750));
  }

  .feature .cnt02 .credit .item:nth-child(2),
  .feature .cnt02 .credit .item:nth-child(3),
  .feature .cnt02 .credit .item:nth-child(4),
  .feature .cnt02 .credit .item:nth-child(5) {
    display: inline-block;
  }

  .feature .cnt02 .credit .item:nth-child(3),
  .feature .cnt02 .credit .item:nth-child(5) {
    margin-left: calc(15* (100vw / 750));
  }

  .feature .cnt03 .credit .item:nth-child(2),
  .feature .cnt03 .credit .item:nth-child(3) {
    display: inline-block;
  }

  .feature .cnt03 .credit .item:nth-child(3),
  .feature .cnt03 .credit .item:nth-child(5) {
    margin-left: calc(15* (100vw / 750));
    margin-right: 0;
  }

  .feature .cnt04 .credit .item:nth-child(2),
  .feature .cnt04 .credit .item:nth-child(3) {
    display: inline-block;
  }

  .feature .cnt04 .credit .item:nth-child(3) {
    margin-left: calc(15* (100vw / 750));
    margin-right: 0;
  }

  .feature .cntArea__creditLeft {
    margin-left: calc(22* (100vw / 750));
  }

  .feature .cntArea__creditLeftPC {
    margin-left: 0;
  }

  /* ------------ cnt01 ------------ */
  .feature .cnt01 {
    margin-top: calc(136* (100vw / 750));
  }

  .feature .cnt01__model01 {
    width: calc(660* (100vw / 750));
  }

  .feature .cnt01__modelArea {
    display: block;
    width: 100%;
    margin: calc(110* (100vw / 750)) auto 0;
  }

  .feature .cnt01__model02 {
    width: calc(540* (100vw / 750));
    height: calc(720* (100vw / 750));
  }

  .feature .cnt01__model02::after {
    top: calc(-30* (100vw / 750));
    right: calc(-30* (100vw / 750));
    width: calc(540* (100vw / 750));
    height: calc(720* (100vw / 750));
  }

  .feature .cnt01 .cntArea__clor {
    right: calc(-136* (100vw / 750));
  }

  .feature .cnt01__model03 {
    width: calc(480* (100vw / 750));
    margin: calc(41* (100vw / 750)) 0 0 auto;
  }

  .feature .cnt01__model03::after {
    bottom: calc(-30* (100vw / 750));
    left: calc(-30* (100vw / 750));
    width: calc(479* (100vw / 750));
    height: calc(639* (100vw / 750));
  }

  .feature .cnt01 .cntArea__creditArea {
    margin-top: calc(78* (100vw / 750));
  }

  /* ------------ cnt02 ------------ */
  .feature .cnt02::before {
    top: calc(180* (100vw / 750));
    height: calc(1400* (100vw / 750));
  }

  .feature .cnt02__modelArea {
    display: block;
    width: 100%;
    margin: 0;
  }

  .feature .cnt02__model01 {
    width: calc(660* (100vw / 750));
    height: calc(880* (100vw / 750));
    margin-left: auto;
  }

  .feature .cnt02__model02 {
    width: calc(600* (100vw / 750));
    margin-top: calc(80* (100vw / 750));
  }

  .feature .cnt02__model02::after {
    top: calc(-40* (100vw / 750));
    right: calc(40* (100vw / 750));
    width: calc(599* (100vw / 750));
    height: calc(799* (100vw / 750));
  }

  /* ------------ cnt03 ------------ */
  .feature .cnt03 {
    margin-top: calc(190* (100vw / 750));
  }

  .feature .cnt03::before {
    top: calc(240* (100vw / 750));
    height: calc(1400* (100vw / 750));
  }

  .feature .cnt03__modelArea {
    display: block;
    width: 100%;
  }

  .feature .cnt03__model01 {
    width: calc(660* (100vw / 750));
    height: calc(880* (100vw / 750));
  }

  .feature .cnt03__model02 {
    width: calc(570* (100vw / 750));
    margin: calc(110* (100vw / 750)) 0 0 auto;
  }

  .feature .cnt03__model02::after {
    top: calc(-30* (100vw / 750));
    bottom: 0;
    left: calc(-30* (100vw / 750));
    width: calc(570* (100vw / 750));
    height: calc(760* (100vw / 750));
  }

  .feature .cnt03 .cntArea__clor {
    top: calc(95* (100vw / 750));
    left: calc(-140* (100vw / 750));
  }

  .feature .cnt03 .cntArea__clor span {
    text-indent: calc(38* (100vw / 750));
  }

  .feature .cnt03 .cntArea__creditArea {
    margin-top: calc(48* (100vw / 750));
  }

  /* ------------ cnt04 ------------ */
  .feature .cnt04 {
    margin-top: calc(238* (100vw / 750));
  }

  .feature .cnt04::before {
    top: calc(200* (100vw / 750));
    height: calc(1400* (100vw / 750));
  }

  .feature .cnt04__modelArea {
    display: block;
    width: 100%;
    margin: 0;
  }

  .feature .cnt04__model01 {
    width: calc(660* (100vw / 750));
    height: calc(880* (100vw / 750));
    margin: 0 auto;
  }

  .feature .cnt04__model01::after {
    content: "";
    display: block;
    position: absolute;
    top: calc(-50* (100vw / 750));
    right: calc(50* (100vw / 750));
    width: calc(659* (100vw / 750));
    height: calc(882* (100vw / 750));
    border: 1px solid #54647a;
    z-index: -2;
  }

  .feature .cnt04__model02 {
    width: calc(570* (100vw / 750));
    margin: calc(80* (100vw / 750)) auto 0;
  }

  .feature .cnt04__model02::after {
    display: none;
  }

  /* ------------ pointArea ------------ */
  .feature .pointArea {
    margin-top: calc(196* (100vw / 750));
  }

  .feature .pointArea__title::before {
    top: calc(16* (100vw / 750));
  }

  .feature .pointArea__title h3 {
    width: calc(510* (100vw / 750));
    padding: 0 calc(45* (100vw / 750));
  }

  .feature .pointArea__lead {
    width: calc(184* (100vw / 750));
    margin: calc(38* (100vw / 750)) auto 0;
  }

  .feature .iconArea {
    margin-top: calc(60* (100vw / 750));
  }

  .feature .iconArea::before {
    top: calc(60* (100vw / 750));
    height: calc(980* (100vw / 750));
  }

  .feature .iconArea__inner {
    width: 100%;
  }

  .feature .iconArea__box {
    display: block;
    width: calc(630* (100vw / 750));
  }

  .feature .iconArea__list {
    display: flex;
    width: 100%;
    margin-top: calc(40* (100vw / 750));
  }

  .feature .iconArea__list:nth-of-type(1) {
    margin-top: 0;
  }

  .feature .iconArea__list:nth-of-type(2) {
    flex-direction: row-reverse;
  }

  .feature .iconArea__imgArea {
    width: calc(340* (100vw / 750));
    margin: 0 calc(37* (100vw / 750)) 0 0;
  }

  .feature .iconArea__list:nth-of-type(2) .iconArea__imgArea {
    margin: 0 0 0 calc(49* (100vw / 750));
  }

  .feature .iconArea__list:nth-of-type(3) .iconArea__imgArea {
    margin: 0 calc(41* (100vw / 750)) 0 0;
  }

  .feature .iconArea__textArea {
    margin-top: calc(47* (100vw / 750));
  }

  .feature .iconArea__list:nth-of-type(3) .iconArea__textArea {
    margin-top: calc(68* (100vw / 750));
  }

  .feature .iconArea__name {
    font-size: calc(36* (100vw / 750));
  }

  .feature .iconArea__text {
    margin-top: calc(-23* (100vw / 750));
    line-height: 1.75;
    font-size: calc(24* (100vw / 750));
  }
}

/*-------------------------
 btn
-------------------------*/
/* ------------ PC ------------ */
.feature .btnArea {
  width: 112rem;
  margin: 0 auto 8rem;
  border: 1px solid #000;
  margin-top: 17.5rem;
}

.feature .btnArea_all {
  letter-spacing: 0.12em;
  letter-spacing: 0.15em;
  font-size: 2.6rem;
}

.feature .btnArea_all a {
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1.95;
}

/* ------------ PC ------------ */

/* ------------ SP ------------ */
@media screen and (max-width: 767px) {
  .feature .btnArea {
    margin-top: calc(125* (100vw / 750));
    margin-bottom: calc(100* (100vw / 750));
    width: calc(710* (100vw / 750));
  }

  .feature .btnArea_all {
    font-size: calc(26 *(100vw / 750));
  }

  .feature .btnArea_all a {
    line-height: 2.3;
  }
}

/* ------------ SP ------------ */