@charset "UTF-8";
/* CSS Document */
/**********************************/
body:before {
  content: "";
  position: absolute;
  inset: -40px;
  background: url("../images/common/bg.svg") center top no-repeat;
  background-size: 100% auto;
  transform: translate3d(var(--bg-x), var(--bg-y), 0);
  z-index: 0;
  pointer-events: none;
  aspect-ratio: 2055/707;
  width: 105%;
  max-width: 2055px;
  left: -2%;
  top: -0.5%;
  height: auto;
  z-index: -1; }

@media (min-width: 1980px) {
  body:before {
    background-size: 2055px auto;
    width: 100%;
    max-width: 100%;
    left: 0;
    top: 0; } }
@media (max-width: 1280px) {
  body:before {
    left: 0; } }
@media (max-width: 768px) {
  body:before {
    background: url("../images/common/bg_sp.svg") center top no-repeat;
    background-size: 100% auto;
    aspect-ratio: 885/379;
    left: 0;
    top: 50px; } }
/*max-width:768px*/
/*max-width:480px*/
/**********************************/
.about_all {
  transition: .3s;
  width: calc(100% - 100px);
  max-width: 1620px;
  margin: 0 auto;
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch; }

.about_side {
  width: 240px; }
  .about_side div {
    position: sticky;
    left: 0;
    top: 150px;
    counter-reset: about_side; }
  .about_side a {
    display: block;
    font: 1.7rem/1.5em "Noto Sans JP", sans-serif;
    font-weight: 700;
    letter-spacing: 0.06em;
    margin: 0 0 25px;
    padding: 0 0 0 40px;
    position: relative; }
    .about_side a.current {
      color: #5A4398; }
    .about_side a:before {
      font: 1.3rem/1em "Inter Tight", sans-serif;
      font-weight: 900;
      color: #5A4398;
      counter-increment: about_side;
      content: "0" counter(about_side);
      position: absolute;
      left: 0;
      top: 50%;
      transform: translateY(-50%); }

.about_content {
  width: calc(100% - 340px);
  max-width: 1170px;
  color: #000;
  counter-reset: box;
  position: relative; }

.about_content_box {
  width: 100%;
  position: relative; }
  .about_content_box h2 {
    position: relative;
    font: 5.2em/1em "Noto Sans JP", sans-serif;
    font-weight: 500;
    position: relative; }
    .about_content_box h2 span {
      margin: 20px 0 0 0;
      color: #5A4398;
      display: block;
      font: 1.3rem/1em "Inter Tight", sans-serif;
      font-weight: 500;
      letter-spacing: 0.045em; }
    .about_content_box h2:before {
      counter-increment: box;
      content: "0" counter(box);
      position: absolute;
      top: 7px;
      left: -50px;
      font: 1.8rem/1em "Inter Tight", sans-serif;
      color: #5A4398;
      font-weight: 900; }
    .about_content_box h2 br {
      display: none; }
  .about_content_box::after {
    content: "";
    position: absolute;
    right: clamp(-75px, calc((1770px - 100vw) / 2), -25px);
    width: 75px;
    background-size: contain; }
  .about_content_box::before {
    content: "";
    position: absolute;
    bottom: 0;
    --offset: calc(
      ((100vw - min(1620px, calc(100vw - 100px))) / 2)
      + 440px
    );
    left: calc(var(--offset) * -1);
    width: calc(100vw + var(--offset));
    height: 1px;
    background: #D9D9D9; }

.about_content_item {
  max-width: 1000px;
  position: relative;
  width: calc(100% - 100px); }

/*min-width:1980px*/
@media (max-width: 1280px) {
  .about_side {
    display: none; }

  .about_all {
    margin: 0 0 0 50px; }

  .about_content {
    width: 100%;
    max-width: 1170px;
    padding: 0 0 0 50px; } }
/*max-width:1280px*/
@media (max-width: 1024px) {
  .about_all {
    width: calc(100% - 80px);
    margin: 0 auto; }

  .about_content_box:after {
    display: none; }
  .about_content_box h2 {
    font: 3.9em/1em "Noto Sans JP", sans-serif;
    font-weight: 500;
    padding: 0 0 0 40px; }
    .about_content_box h2 span {
      font: 0.9rem/1em "Inter Tight", sans-serif;
      font-weight: 500; }
    .about_content_box h2:before {
      top: 7px;
      left: 0;
      font: 1.1rem/1em "Inter Tight", sans-serif;
      color: #5A4398;
      font-weight: 900; }

  .about_content {
    width: 100%;
    margin: 0 auto;
    padding: 0; }

  .about_content_item {
    width: 100%; } }
/*max-width:1024px*/
@media (max-width: 768px) {
  .about_all {
    width: calc(100% - 60px); }

  .about_content_box h2 {
    font: 3.3em/1em "Noto Sans JP", sans-serif;
    font-weight: 500;
    padding: 0 0 0 30px; }
    .about_content_box h2:before {
      font: 0.9rem/1em "Inter Tight", sans-serif;
      font-weight: 900; } }
/*max-width:768px*/
@media (max-width: 480px) {
  .about_all {
    width: calc(100% - 30px); }

  .about_content_box h2 br {
    display: none; }

  .about_content {
    max-width: 330px; } }
/*max-width:480px*/
/**********************************/
.about01 {
  padding: 0 0 240px; }
  .about01 h2 {
    margin: 0 0 80px; }
  .about01:after {
    top: 130px;
    background: url("../images/about/about01.png") top left no-repeat;
    background-size: contain;
    aspect-ratio: 75/642;
    width: 100%;
    max-width: 75px;
    height: auto; }
  .about01 .line {
    border: #D5D4D4 1px solid;
    border-radius: 30px;
    background-color: #fff;
    padding: 110px 50px;
    margin: 0 0 150px; }
    .about01 .line h3 {
      width: 100%;
      max-width: 780px;
      margin: 0 auto 50px;
      letter-spacing: 0.04em;
      font: 3.2em/1.8em "Noto Sans JP", sans-serif;
      font-weight: 700; }
    .about01 .line ol {
      width: 100%;
      max-width: 760px;
      margin: 0 auto; }
    .about01 .line li {
      padding: 0 0 0 3.6rem;
      margin: 0 0 20px;
      letter-spacing: 0.02em;
      font: 2em/1.8em "Noto Sans JP", sans-serif;
      font-weight: 400;
      position: relative; }
      .about01 .line li:before {
        position: absolute;
        content: "一、";
        left: 0; }
      .about01 .line li:last-of-type {
        margin: 0; }
  .about01 h3 {
    margin: 0 0 40px;
    letter-spacing: 0.04em;
    font: 4.4rem/1.8em "Noto Sans JP", sans-serif;
    font-weight: 500; }
    .about01 h3 strong {
      font-weight: 700;
      color: #5A4398; }
  .about01 p {
    font: 1.6rem/2.2em "Noto Sans JP", sans-serif;
    font-weight: 400;
    margin: 0 0 35px;
    text-align: justify;
    text-justify: inter-ideograph; }
    .about01 p:last-of-type {
      margin: 0; }

/*min-width:1980px*/
/*max-width:1280px*/
@media (max-width: 1024px) {
  .about01 {
    padding: 0 0 145px; }
    .about01 h2 {
      margin: 0 0 40px; }
    .about01 .line {
      padding: 70px 50px;
      margin: 0 0 70px; }
      .about01 .line h3 {
        width: 100%;
        max-width: 780px;
        margin: 0 auto 40px;
        letter-spacing: 0.04em;
        font: 2.5em/1.8em "Noto Sans JP", sans-serif;
        font-weight: 700; }
      .about01 .line ol {
        width: 100%;
        max-width: 760px;
        margin: 0 auto; }
      .about01 .line li {
        padding: 0 0 0 2.5rem;
        margin: 0 0 20px;
        letter-spacing: 0.02em;
        font: 1.4em/2em "Noto Sans JP", sans-serif;
        font-weight: 400;
        position: relative; }
    .about01 h3 {
      margin: 0 0 30px;
      letter-spacing: 0.04em;
      font: 3.3rem/1.8em "Noto Sans JP", sans-serif;
      font-weight: 500; } }
/*max-width:1024px*/
@media (max-width: 768px) {
  .about01 {
    padding: 0 0 80px; }
    .about01 h2 {
      margin: 0 0 40px; }
    .about01 .line {
      padding: 55px 30px 60px 30px; }
      .about01 .line h3 {
        margin: 0 auto 30px;
        letter-spacing: 0.04em;
        font: 2.3em/1.8em "Noto Sans JP", sans-serif;
        font-weight: 700; }
    .about01 h3 {
      font: 2.4rem/1.8em "Noto Sans JP", sans-serif;
      font-weight: 500; }
    .about01 p {
      font: 1.5rem/2.2em "Noto Sans JP", sans-serif;
      font-weight: 400;
      margin: 0 0 35px; } }
/*max-width:768px*/
@media (max-width: 480px) {
  .about01 {
    padding: 0 0 80px; }
    .about01 h2 {
      margin: 0 0 40px; }
    .about01 .line {
      padding: 40px 25px 50px; }
      .about01 .line h3 {
        margin: 0 auto 30px;
        letter-spacing: 0.04em;
        font: 2.2em/1.8em "Noto Sans JP", sans-serif;
        font-weight: 700; }
    .about01 h3 {
      font: 2.4rem/1.8em "Noto Sans JP", sans-serif;
      font-weight: 500; }
    .about01 p {
      font: 1.5rem/2.2em "Noto Sans JP", sans-serif;
      font-weight: 400;
      margin: 0 0 35px; } }
/*max-width:480px*/
/**********************************/
.about02 {
  padding: 230px 0 240px; }
  .about02 h2 {
    margin: 0 0 100px; }
    .about02 h2 small {
      margin: 0 0 15px;
      display: block;
      font: 2.2rem/1em "Inter Tight", sans-serif;
      font-weight: 500;
      letter-spacing: 0.04em; }
    .about02 h2:before {
      top: 3px; }
  .about02:after {
    top: 50px;
    background: url("../images/about/about02.png") top left no-repeat;
    background-size: contain;
    aspect-ratio: 75/336;
    width: 100%;
    max-width: 75px;
    height: auto; }
  .about02 h3 {
    color: #5A4398;
    padding: 0 0 0 30px;
    letter-spacing: 0.04em;
    font: 2.8em/1.8em "Noto Sans JP", sans-serif;
    font-weight: bold;
    position: relative;
    margin: 0 0 70px; }
    .about02 h3:before {
      z-index: -1;
      position: absolute;
      content: "";
      display: block;
      width: 100%;
      height: 3px;
      background-color: #5A4398;
      left: 0;
      top: 50%;
      transform: translateY(-50%); }
    .about02 h3 span {
      background-color: #fff;
      padding: 0 20px;
      display: inline-block; }
  .about02 dl {
    margin: 0 0 150px; }
  .about02 dt {
    margin: 0 0 25px;
    font: 2.6rem/1em "Noto Sans JP", sans-serif;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 10px 20px;
    width: fit-content;
    border: 1px solid #D5D4D4; }
  .about02 dd {
    font: 1.6rem/2em "Noto Sans JP", sans-serif;
    font-weight: 500;
    margin: 0 0 70px; }
  .about02 li {
    font: 2.2rem/1.6em "Noto Sans JP", sans-serif;
    font-weight: 700;
    letter-spacing: 0.01em;
    position: relative;
    padding: 0 0 0 25px;
    margin: 0 0 45px; }
    .about02 li:before {
      position: absolute;
      content: "";
      left: 0;
      top: 50%;
      transform: translateY(-50%);
      display: block;
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background-color: #5A4398; }
    .about02 li:last-of-type {
      margin: 0; }

/*min-width:1980px*/
/*max-width:1280px*/
@media (max-width: 1024px) {
  .about02 {
    padding: 115px 0; }
    .about02 h2 {
      margin: 0 0 80px; }
      .about02 h2 small {
        font: 1.6rem/1em "Inter Tight", sans-serif;
        font-weight: 500; }
    .about02 h3 {
      padding: 0;
      letter-spacing: 0.04em;
      font: 2.1em/1.8em "Noto Sans JP", sans-serif;
      font-weight: bold;
      margin: 0 0 45px; }
      .about02 h3:before {
        display: none; }
      .about02 h3 span {
        padding: 0;
        display: inline-block; }
    .about02 dl {
      margin: 0 0 85px; }
    .about02 dt {
      margin: 0 0 20px;
      font: 1.9rem/1em "Noto Sans JP", sans-serif;
      font-weight: 700; }
    .about02 dd {
      margin: 0 0 45px; }
    .about02 li {
      font: 1.6rem/1.6em "Noto Sans JP", sans-serif;
      font-weight: 700;
      padding: 0 0 0 18px;
      margin: 0 0 35px; }
      .about02 li:before {
        width: 7px;
        height: 7px; } }
/*max-width:1024px*/
@media (max-width: 768px) {
  .about02 {
    padding: 80px 0; }
    .about02 h2 {
      margin: 0 0 45px; }
    .about02 dl {
      margin: 0 0 70px; } }
/*max-width:768px*/
/*max-width:480px*/
/**********************************/
.about03 {
  padding: 230px 0 240px; }
  .about03 h2 {
    margin: 0 0 80px; }
  .about03:after {
    top: 50px;
    background: url("../images/about/about03.png") top left no-repeat;
    background-size: contain;
    aspect-ratio: 75/510;
    width: 100%;
    max-width: 75px;
    height: auto; }
  .about03 dl {
    font: 1.6rem/1.6em "Noto Sans JP", sans-serif;
    font-weight: 700;
    letter-spacing: 0.1em;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: stretch; }
  .about03 dt {
    border-bottom: 1px solid #5A4398;
    width: 150px;
    padding: 25px 20px; }
  .about03 dd {
    border-bottom: 1px solid #D5D4D4;
    width: calc(100% - 150px);
    padding: 25px 20px 25px 45px; }
    .about03 dd br {
      display: none; }

/*min-width:1980px*/
/*max-width:1280px*/
@media (max-width: 1024px) {
  .about03 {
    padding: 115px 0; }
    .about03 h2 {
      margin: 0 0 60px; }
    .about03 dt {
      width: 120px; }
    .about03 dd {
      width: calc(100% - 120px); } }
/*max-width:1024px*/
@media (max-width: 768px) {
  .about03 {
    padding: 80px 0; }
    .about03 h2 {
      margin: 0 0 35px; }
    .about03 dt {
      width: 100%;
      padding: 20px 20px 0px;
      border-bottom: none; }
    .about03 dd {
      width: 100%;
      padding: 5px 20px 20px;
      position: relative; }
      .about03 dd:before {
        position: absolute;
        content: "";
        display: block;
        width: 140px;
        bottom: -1px;
        height: 1px;
        background-color: #5A4398;
        left: 0; }
      .about03 dd br {
        display: block; } }
/*max-width:768px*/
/*max-width:480px*/
/**********************************/
.about04 {
  padding: 230px 0 0; }
  .about04:before {
    display: none; }
  .about04 h2 {
    margin: 0 0 80px; }
  .about04:after {
    top: 50px;
    background: url("../images/about/about04.png") top left no-repeat;
    background-size: contain;
    aspect-ratio: 75/348;
    width: 100%;
    max-width: 75px;
    height: auto; }
  .about04 .group_box {
    max-width: 600px;
    margin: 0 auto;
    width: 100%; }
  .about04 .holdings {
    color: #5A4398;
    padding: 100px 0 0 116px;
    font: 2rem/1em "Inter Tight", sans-serif;
    font-weight: 700;
    letter-spacing: 0.02em;
    display: block;
    width: 440px;
    height: 120px;
    margin: 0 0 75px;
    background: url("../images/about/holdings.svg") center top no-repeat;
    position: relative; }
    .about04 .holdings:before {
      position: absolute;
      content: "";
      display: block;
      background: url("../images/about/line02.svg") center top no-repeat;
      background-size: contain;
      aspect-ratio: 59/138;
      width: 100%;
      max-width: 59px;
      height: auto;
      left: 47px;
      top: 92px; }
  .about04 .mitsuibau {
    margin: 0 0 34px 123px;
    color: #5A4398;
    padding: 62px 0 0 76px;
    font: 1.8rem/1em "Inter Tight", sans-serif;
    font-weight: 700;
    letter-spacing: 0.02em;
    display: block;
    width: 295px;
    height: 85px;
    background: url("../images/about/mitsuibau.svg") center top no-repeat;
    position: relative; }
    .about04 .mitsuibau:before {
      position: absolute;
      content: "";
      display: block;
      background: url("../images/about/line01.svg") center top no-repeat;
      background-size: contain;
      aspect-ratio: 65/260;
      width: 100%;
      max-width: 65px;
      height: auto;
      left: 34px;
      top: 68px; }
  .about04 .design {
    margin-bottom: 30px; }
  .about04 .lincar {
    margin-bottom: 60px; }
  .about04 .design,
  .about04 .lincar {
    font: 1.8em/1em "Noto Sans JP", sans-serif;
    font-weight: 700;
    margin-left: 212px;
    padding: 0 0 0 22px;
    position: relative; }
    .about04 .design a,
    .about04 .lincar a {
      display: block;
      width: fit-content;
      font: 1.8rem/1em "Inter Tight", sans-serif;
      font-weight: 700;
      color: #5A4398;
      margin: 10px 0 0 0; }
    .about04 .design:before,
    .about04 .lincar:before {
      position: absolute;
      content: "";
      left: 0;
      top: 6px;
      display: block;
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background-color: #5A4398; }
  .about04 .vietnam {
    color: #5A4398;
    padding: 65px 0 0 77px;
    font: 2rem/1em "Inter Tight", sans-serif;
    font-weight: 700;
    letter-spacing: 0.02em;
    display: block;
    margin: 0 0 0 240px;
    width: 350px;
    height: 85px;
    background: url("../images/about/vietnam.svg") left top no-repeat;
    background-size: 295px; }

@media (hover: hover) {
  .about04 .holdings:hover {
    color: #FFE100; }
  .about04 .mitsuibau:hover {
    color: #FFE100; }
  .about04 .design a:hover,
  .about04 .lincar a:hover {
    color: #FFE100; }
  .about04 .vietnam:hover {
    color: #FFE100; } }
/*min-width:1980px*/
/*max-width:1280px*/
@media (max-width: 1024px) {
  .about04 {
    padding: 115px 0 0; }
    .about04 h2 {
      margin: 0 0 60px; }
    .about04 .holdings {
      color: #5A4398;
      padding: 79px 0 0 92px;
      font: 1.3em/1em "Inter Tight", sans-serif;
      font-weight: 700;
      width: 345px;
      height: 91px;
      margin: 0 0 60px;
      background-size: 345px; }
      .about04 .holdings:before {
        max-width: 41px;
        height: auto;
        left: 47px;
        top: 80px; }
    .about04 .mitsuibau {
      margin: 0 0 30px 100px;
      padding: 51px 0 0 62px;
      font: 1.2rem/1em "Inter Tight", sans-serif;
      font-weight: 700;
      letter-spacing: 0.02em;
      display: block;
      width: 230px;
      height: 63px;
      background-size: 230px; }
      .about04 .mitsuibau:before {
        max-width: 50px;
        height: auto;
        left: 23px;
        top: 54px; }
    .about04 .design {
      margin-bottom: 20px; }
    .about04 .lincar {
      margin-bottom: 50px; }
    .about04 .design,
    .about04 .lincar {
      font: 1.2em/1em "Noto Sans JP", sans-serif;
      font-weight: 700;
      margin-left: 165px;
      padding: 0 0 0 18px;
      position: relative; }
      .about04 .design a,
      .about04 .lincar a {
        display: block;
        width: fit-content;
        font: 1.2rem/1em "Inter Tight", sans-serif;
        font-weight: 700;
        color: #5A4398;
        margin: 10px 0 0 0; }
      .about04 .design:before,
      .about04 .lincar:before {
        top: 3px;
        width: 8px;
        height: 8px; }
    .about04 .vietnam {
      padding: 51px 0 0 62px;
      font: 1.2rem/1em "Inter Tight", sans-serif;
      font-weight: 700;
      margin: 0 0 0 184px;
      width: 230px;
      height: 64px;
      background-size: 230px; } }
/*max-width:1024px*/
@media (max-width: 768px) {
  .about04 {
    padding: 80px 0 0; }
    .about04 h2 {
      margin: 0 0 45px; }
    .about04 .holdings {
      color: #5A4398;
      padding: 53px 0 0 65px;
      font: 0.8rem/1em "Inter Tight", sans-serif;
      font-weight: 700;
      width: 239px;
      height: 61px;
      margin: 0 0 40px;
      background-size: 239px; }
      .about04 .holdings:before {
        max-width: 28px;
        height: auto;
        left: 26px;
        top: 54px; }
    .about04 .mitsuibau {
      margin: 0 0 20px 67px;
      padding: 35px 0 0 45px;
      font: 0.7rem/1em "Inter Tight", sans-serif;
      font-weight: 700;
      width: 160px;
      height: 42px;
      background-size: 160px; }
      .about04 .mitsuibau:before {
        max-width: 34px;
        height: auto;
        left: 18px;
        top: 40px; }
    .about04 .design {
      margin-bottom: 20px; }
    .about04 .lincar {
      margin-bottom: 35px; }
    .about04 .design,
    .about04 .lincar {
      font: 0.7em/1em "Noto Sans JP", sans-serif;
      font-weight: 700;
      margin-left: 115px;
      padding: 0 0 0 10px; }
      .about04 .design a,
      .about04 .lincar a {
        font: 0.7em/1em "Inter Tight", sans-serif;
        font-weight: 700;
        color: #5A4398;
        margin: 10px 0 0 0; }
      .about04 .design:before,
      .about04 .lincar:before {
        top: 2px;
        width: 5px;
        height: 5px; }
    .about04 .vietnam {
      padding: 36px 0 0 44px;
      font: 0.7rem/1em "Inter Tight", sans-serif;
      font-weight: 700;
      margin: 0 0 0 130px;
      width: 160px;
      height: 44px;
      background-size: 160px; } }
/*max-width:768px*/
/*max-width:480px*/
