/*----------------------------------------------

 ABOUT PAGE CONTENTS

----------------------------------------------*/
.aboutPage-contents {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: min( calc( 30 / var(--screen-width) * 100vw ), 55px );
  height: inherit;
  /*---------------------------------------
   heading
  ---------------------------------------*/
  /*---------------------------------------
   body
  ---------------------------------------*/
}
.aboutPage-contents__heading {
  display: grid;
}
.aboutPage-contents__heading h1 {
  font-size: min( calc( 24 / var(--screen-width) * 100vw ), 35px );
  font-weight: bold;
  line-height: 1.5;
  text-align: center;
  letter-spacing: 0.1em;
}
.aboutPage-contents__heading small {
  display: block;
  font-size: min( calc( 10 / var(--screen-width) * 100vw ), 14px );
  font-weight: 500;
  font-family: "Roboto", sans-serif;
  text-align: center;
  letter-spacing: 0.1em;
}
.aboutPage-contents__body {
  flex: 1;
  display: grid;
  gap: min( calc( 30 / var(--screen-width) * 100vw ), 50px );
  position: relative;
  /* representative-porofile
  ----------------------------------*/
  /* company-profile
  ----------------------------------*/
}
.aboutPage-contents__body .representative-porofile {
  position: relative;
  padding: min( calc( 30 / var(--screen-width) * 100vw ), 50px ) 0;
  color: #fff;
}
.aboutPage-contents__body .representative-porofile dl {
  display: grid;
  justify-items: center;
  gap: min( calc( 20 / var(--screen-width) * 100vw ), 20px ) min( calc( 30 / var(--screen-width) * 100vw ), 30px );
  grid-template-areas: "img" "heading" "description";
  width: 100%;
}
.aboutPage-contents__body .representative-porofile dl dt {
  grid-area: heading;
  display: grid;
  line-height: 1.5;
  gap: min( calc( 5 / var(--screen-width) * 100vw ), 5px );
}
.aboutPage-contents__body .representative-porofile dl dt h2 {
  font-size: min( calc( 16 / var(--screen-width) * 100vw ), 16px );
  font-weight: bold;
  letter-spacing: 0.4em;
  width: 100%;
  margin-bottom: min( calc( 15 / var(--screen-width) * 100vw ), 15px );
}
.aboutPage-contents__body .representative-porofile dl dt .position {
  display: block;
  font-size: min( calc( 10 / var(--screen-width) * 100vw ), 10px );
  width: 100%;
}
.aboutPage-contents__body .representative-porofile dl dt .name {
  display: flex;
  align-items: center;
  font-size: min( calc( 16 / var(--screen-width) * 100vw ), 16px );
  font-weight: 600;
}
.aboutPage-contents__body .representative-porofile dl dt .name small {
  display: flex;
  align-items: center;
  font-family: "Roboto", sans-serif;
  font-size: min( calc( 10 / var(--screen-width) * 100vw ), 10px );
  font-weight: bold;
}
.aboutPage-contents__body .representative-porofile dl dt .name small:before {
  content: "";
  display: block;
  height: min( calc( 16 / var(--screen-width) * 100vw ), 16px );
  width: 1px;
  background-color: #fff;
  margin: 0 min( calc( 20 / var(--screen-width) * 100vw ), 20px );
}
.aboutPage-contents__body .representative-porofile dl dd.description {
  grid-area: description;
  font-size: min( calc( 15 / var(--screen-width) * 100vw ), 15px );
}
.aboutPage-contents__body .representative-porofile dl dd.img {
  grid-area: img;
  width: min( calc( 180 / var(--screen-width) * 100vw ), 180px );
  margin: auto;
}
@media (min-width: 768px) {
  .aboutPage-contents__body .representative-porofile dl {
    grid-template-columns: min( calc( 260 / var(--screen-width) * 100vw ), 260px ) 1fr;
    grid-template-rows: auto 1fr;
    grid-template-areas: "img heading" "img description";
    justify-items: flex-start;
  }
  .aboutPage-contents__body .representative-porofile dl dd.img {
    width: 100%;
  }
}
.aboutPage-contents__body .representative-porofile .bg {
  display: block;
  width: 100vw;
  height: 100%;
  background-image: linear-gradient(-45deg, #050332 40%, #000F68);
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
  overflow: hidden;
}
.aboutPage-contents__body .representative-porofile .bg:before {
  content: "";
  display: block;
  aspect-ratio: 1500/1200;
  width: auto;
  height: 100vw;
  background-image: var(--url);
  background-repeat: no-repeat;
  background-position: center right;
  background-size: contain;
  position: absolute;
  top: 0;
  left: 0;
  transform: rotate(-90deg) translateX(-60%);
  transform-origin: top left;
}
@media (min-width: 768px) {
  .aboutPage-contents__body .representative-porofile .bg:before {
    height: 100%;
    left: auto;
    right: 0;
    transform: none;
  }
}
.aboutPage-contents__body .company-profile {
  display: grid;
  gap: min( calc( 15 / var(--screen-width) * 100vw ), 25px );
}
.aboutPage-contents__body .company-profile dl {
  display: grid;
  gap: min( calc( 10 / var(--screen-width) * 100vw ), 10px );
  font-size: min( calc( 14 / var(--screen-width) * 100vw ), 14px );
  line-height: 1.5;
}
.aboutPage-contents__body .company-profile dl dt {
  background-color: #fff;
  padding: min( calc( 5 / var(--screen-width) * 100vw ), 5px ) min( calc( 10 / var(--screen-width) * 100vw ), 10px );
}
.aboutPage-contents__body .company-profile dl dd {
  display: block;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
@media (min-width: 768px) {
  .aboutPage-contents__body .company-profile dl {
    display: flex;
    gap: min( calc( 35 / var(--screen-width) * 100vw ), 35px );
  }
  .aboutPage-contents__body .company-profile dl dt {
    width: min( calc( 120 / var(--screen-width) * 100vw ), 120px );
    flex-shrink: 0;
    padding: 0;
    background: none;
    padding-right: min( calc( 35 / var(--screen-width) * 100vw ), 35px );
    border-right: 1px solid var(--color__text);
  }
}
.aboutPage-contents__body .company-profile .map {
  margin-top: min( calc( 20 / var(--screen-width) * 100vw ), 20px );
  height: min( calc( 350 / var(--screen-width) * 100vw ), 350px );
}
.aboutPage-contents__body .company-profile .map iframe {
  display: block;
  width: 100%;
  height: 100%;
}
/*# sourceMappingURL=page-company.css.map */