@charset "UTF-8";

#concept {
  background: #f7f6f0;
}

/* ========================================
  @media screen and (min-width: 768px),print
======================================== */
@media screen and (min-width: 768px), print {
  .p-fv {
    margin-block: 81px 150px;
  }

  .p-fv .l-inner.l-fv {
    display: grid;
  }

  .p-fv .p-fv__img {
    margin-inline: auto;
    width: min(95%, 1440px);
  }

  .p-fv .p-fv__img img {
    height: auto;
    width: 100%;
  }

  .p-fv .p-fv__con {
    display: grid;
    gap: 0 22%;
    grid-template-columns: 37.4% 42.4%;
    margin-inline: auto;
    width: min(95%, 993px);
  }

  .p-fv .p-fv__con-left h2 {
    border-left: 1px solid #4e4d48;
    font-size: 26px;
    font-weight: 400;
    letter-spacing: 0.06em;
    line-height: 1.8461538462;
    padding-block: 80px 136px;
    padding-inline: 60px 0;
  }

  .p-fv .p-fv__con-right {
    padding-block: 86px 0;
  }

  .p-fv .p-fv__con-right p {
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.06em;
    line-height: 2.7142857143;
    margin-bottom: 38px;
  }

  .p-fv .p-fv__con-right p:last-child {
    margin-bottom: 0;
  }

  .p-concept.--concept01 {
    margin-bottom: 150px;
  }

  .p-concept.--concept02 {
    margin-bottom: 150px;
  }

  .p-concept .p-concept__ttl {
    color: #ffffff;
    margin-bottom: 100px;
    margin-inline: auto;
    max-width: 1920px;
    padding-block: 140px 151px;
    text-align: center;
    width: 100%;
  }

  .p-concept .p-concept__ttl.--concept01 {
    background: url(../images/concept/concept01_bg.jpg) no-repeat top
      center/cover;
  }

  .p-concept .p-concept__ttl.--concept02 {
    background: url(../images/concept/concept02_bg.jpg) no-repeat top
      center/cover;
    padding-block: 175px 172px;
  }

  .p-concept .p-concept__ttl p {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.06em;
    line-height: 1;
    margin-bottom: 4px;
  }

  .p-concept .p-concept__ttl h2 {
    font-size: 28px;
    font-weight: 400;
    letter-spacing: 0em;
    line-height: 1.9;
  }

  .p-concept .p-concept01__con {
    display: grid;
    gap: 0 7.7%;
    grid-template-columns: 51.9% 40.4%;
    margin-bottom: 80px;
    margin-inline: auto;
    width: min(95%, 1040px);
  }

  .p-concept .p-concept__con-left img {
    height: auto;
    width: 100%;
  }

  .p-concept .p-concept__con-right p {
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0em;
    line-height: 2.7142857143;
    margin-bottom: 39px;
  }

  .p-concept .p-concept__con-right p:last-child {
    margin-bottom: 0;
  }

  .p-concept .p-concept01__con02 {
    display: grid;
    gap: 0 7.7%;
    grid-template-columns: 38.5% 53.8%;
    margin-inline: auto;
    width: min(95%, 1040px);
    align-items: center;
  }

  .p-concept .p-concept01__con02 .p-concept__con-left {
    order: 2;
  }

  .p-concept .p-concept01__con02 .p-concept__con-right {
    order: 1;
  }

  .p-concept .p-concept02__con {
    display: grid;
    gap: 0 0.9%;
    grid-template-columns: 49.5% 57.6%;
    margin-bottom: 80px;
    margin-inline: auto;
    width: min(95%, 1041px);
    align-items: center;
  }

  .p-concept .p-concept02__con .p-concept__con-left {
    order: 2;
  }

  .p-concept .p-concept02__con .p-concept__con-right {
    order: 1;
  }

  .p-concept .p-concept02__con02 {
    display: grid;
    gap: 0 6.1%;
    grid-template-columns: 48.8% 41.1%;
    margin-inline: auto;
    width: min(95%, 1198px);
    align-items: center;
  }

  .p-link {
    margin-bottom: 180px;
  }

  .p-link .l-link {
    margin-inline: auto;
    width: min(95%, 1020px);
  }

  .p-link .p-link__items {
    display: grid;
    gap: 0 80px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .p-link .p-link__item a {
    display: block;
  }

  .p-link .p-link__item a img {
    height: auto;
    width: 100%;
  }
}

/* ========================================
@media screen and (min-width:768px) and ( max-width:1300px) {
======================================== */
@media screen and (min-width: 768px) and (max-width: 1300px) {
  .p-concept .p-concept02__con {
    display: grid;
    gap: 0 3%;
    grid-template-columns: 49.5% 47.6%;
  }
}

/* ========================================
@media screen and (min-width:768px) and ( max-width:1050px) {
======================================== */
@media screen and (min-width: 768px) and (max-width: 1050px) {
  .p-fv .p-fv__con {
    display: grid;
    gap: 0 7%;
    grid-template-columns: 50.4% 42.4%;
  }
}

/* ========================================
  @media screen and (max-width: 767px)
======================================== */
@media screen and (max-width: 767px) {
  .p-fv {
    margin-block: 14.324vw 18.324vw;
  }

  .p-fv .l-inner.l-fv {
    display: grid;
  }

  .p-fv .p-fv__img {
    margin-bottom: 9.662vw;
    margin-inline: auto;
    order: 2;
    width: min(95%, 86.9vw);
  }

  .p-fv .p-fv__img img {
    height: auto;
    width: 100%;
  }

  .p-fv .p-fv__con {
    display: grid;
    display: contents;
    gap: 0;
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }

  .p-fv .p-fv__con-left {
    margin-bottom: 4.348vw;
    margin-inline: auto;
    order: 1;
    width: min(95%, 82.1vw);
  }

  .p-fv .p-fv__con-left h2 {
    border-left: 1px solid #4e4d48;
    font-size: 5.314vw;
    font-weight: 400;
    letter-spacing: 0.06em;
    line-height: 1.6363636364;
    padding-block: 0px;
    padding-inline: 5.797vw 0;
  }

  .p-fv .p-fv__con-right {
    margin-inline: auto;
    order: 3;
    padding-block: 0px 0;
    width: min(95%, 82.1vw);
  }

  .p-fv .p-fv__con-right p {
    font-size: 3.382vw;
    font-weight: 400;
    letter-spacing: 0.06em;
    line-height: 1.857;
    margin-bottom: 6.5vw;
  }

  .p-fv .p-fv__con-right p:last-child {
    margin-bottom: 0;
  }

  .p-concept.--concept01 {
    margin-bottom: 19.324vw;
  }

  .p-concept.--concept02 {
    margin-bottom: 19.324vw;
  }

  .p-concept .p-concept__ttl {
    color: #ffffff;
    margin-bottom: 9.662vw;
    padding-block: 14.734vw;
    text-align: center;
    width: 100%;
  }

  .p-concept .p-concept__ttl.--concept01 {
    background: url(../images/concept/concept01_bg_sp.jpg) no-repeat top
      center/cover;
  }

  .p-concept .p-concept__ttl.--concept02 {
    background: url(../images/concept/concept02_bg_sp.jpg) no-repeat top
      center/cover;
    padding-block: 22.464vw;
  }

  .p-concept .p-concept__ttl p {
    font-size: 2.899vw;
    font-weight: 400;
    letter-spacing: 0.06em;
    line-height: 1;
    margin-bottom: 2.865vw;
  }

  .p-concept .p-concept__ttl h2 {
    font-size: 5.314vw;
    font-weight: 400;
    letter-spacing: 0em;
    line-height: 1.4545454545;
  }

  .p-concept .p-concept01__con {
    display: grid;
    gap: 7.246vw 0;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    margin-bottom: 7.246vw;
    margin-inline: auto;
    width: min(95%, 82.1vw);
  }

  .p-concept .p-concept__con-left {
    order: 2;
  }

  .p-concept .p-concept__con-left img {
    height: auto;
    width: 100%;
  }

  .p-concept .p-concept__con-right {
    order: 1;
    width: min(95%, 80.1vw);
    margin-inline: auto;
  }

  .p-concept .p-concept__con-right p {
    font-size: 3.382vw;
    font-weight: 400;
    letter-spacing: 0em;
    line-height: 1.857;
    margin-bottom: 5.865vw;
  }

  .p-concept .p-concept__con-right p:last-child {
    margin-bottom: 0;
  }

  .p-concept .p-concept01__con02 {
    display: grid;
    gap: 8.246vw 0;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    margin-bottom: 7.246vw;
    margin-inline: auto;
    width: min(95%, 82.1vw);
  }

  .p-concept .p-concept01__con02 .p-concept__con-left {
    order: 2;
  }

  .p-concept .p-concept01__con02 .p-concept__con-right {
    order: 1;
  }

  .p-concept .p-concept02__con {
    display: grid;
    gap: 9.246vw 0;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    margin-bottom: 7.246vw;
    margin-inline: auto;
    width: min(95%, 82.1vw);
  }

  .p-concept .p-concept02__con .p-concept__con-left {
    order: 2;
  }

  .p-concept .p-concept02__con .p-concept__con-right {
    order: 1;
  }

  .p-concept .p-concept02__con02 {
    display: grid;
    gap: 7.246vw 0;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    margin-inline: auto;
    width: min(95%, 87.1vw);
  }

  .p-link {
    margin-bottom: 24.155vw;
  }

  .p-link .l-link {
    margin-inline: auto;
    width: min(95%, 91.7vw);
  }

  .p-link .p-link__items {
    display: grid;
    gap: 3.246vw 0;
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }

  .p-link .p-link__item a {
    display: block;
  }

  .p-link .p-link__item a img {
    height: auto;
    width: 100%;
  }
}