/* ==========================================================
   COMPANY PAGE

   共通デザインシステム:
   assets/css/locosystem-design-system.css

   セクション構成:
     HERO    … Brand Concept
     MESSAGE … Representative's Letter
     PURPOSE … Purpose + Mission
     VISION  … Vision
     VALUES  … Values
     PROFILE … 会社概要
========================================================== */

.ls-company {
  background: var(--ls-bg);
}


/* ==================================================
   COMPANY MESSAGE
================================================== */

.ls-company-message {
  position: relative;
  padding-block: var(--ls-space-120);
  border-top: 1px solid var(--ls-line-subtle);
  background: var(--ls-bg);
}


/* 上部：見出し・案内文・代表画像 */

.ls-company-message__top {
  display: grid;
  grid-template-columns:
    minmax(0, 0.9fr)
    minmax(0, 1.1fr);
  gap: var(--ls-space-72);
  align-items: center;
}

.ls-company-message__intro {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.ls-company-message__title {
  max-width: 620px;
  margin: var(--ls-space-24) 0 0;
  color: var(--ls-fg-strong);
  font-size: clamp(34px, 3.8vw, 54px);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.03em;
}

.ls-company-message__lead {
  max-width: 520px;
  margin-top: var(--ls-space-48);
}

.ls-company-message__lead p {
  margin: 0;
  color: var(--ls-fg-muted);
  font-size: 15px;
  line-height: 1.9;
  letter-spacing: 0.03em;
}


/* 代表画像 */

.ls-company-message__media {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0;
}

.ls-company-message__media img {
  display: block;
  width: 100%;
  height: 560px;
  object-fit: cover;
  object-position: center;
  background: var(--ls-bg-soft);
}


/* 画像下の肩書・氏名 */

.ls-company-message__caption {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: var(--ls-space-16);
  margin-top: var(--ls-space-24);
  color: var(--ls-fg-strong);
  text-align: right;
}

.ls-company-message__caption-role {
  font-size: 14px;
  line-height: 1.6;
}

.ls-company-message__caption-name {
  font-size: 20px;
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: 0.08em;
}


/* 下部：Chapter 3.2正文全文 */

.ls-company-message__full {
  max-width: 760px;
  margin: var(--ls-space-96) auto 0;
  padding-top: var(--ls-space-64);
  border-top: 1px solid var(--ls-line-subtle);
}

.ls-company-message__full p {
  margin: 0;
  color: var(--ls-fg);
  font-family: var(--ls-font-serif-jp);
  font-size: 17px;
  line-height: 2.15;
  letter-spacing: 0.04em;
}

.ls-company-message__full p + p {
  margin-top: var(--ls-space-24);
}


/* 正文末尾の正式署名 */

.ls-company-message__signature {
  margin-top: var(--ls-space-64);
  padding-top: var(--ls-space-32);
  border-top: 1px solid var(--ls-line-subtle);
  text-align: right;
}

.ls-company-message__signature p {
  margin: 0;
  color: var(--ls-fg-strong);
  font-family: var(--ls-font-serif-jp);
  font-size: 16px;
  line-height: 1.9;
  letter-spacing: 0.04em;
}

.ls-company-message__signature p + p {
  margin-top: var(--ls-space-8);
  font-size: 19px;
  font-weight: 600;
  letter-spacing: 0.08em;
}


/* ==================================================
   COMPANY PURPOSE
================================================== */

.ls-company-purpose {
  position: relative;
  overflow: hidden;
  padding-block: var(--ls-space-120);
  background: var(--ls-bg-soft);
}

.ls-company-purpose::before {
  position: absolute;
  top: -140px;
  right: -120px;
  width: 420px;
  height: 420px;
  border: 1px solid var(--ls-decoration-medium);
  border-radius: 50%;
  content: "";
  pointer-events: none;
}

.ls-company-purpose::after {
  position: absolute;
  bottom: -220px;
  left: -180px;
  width: 520px;
  height: 520px;
  border: 1px solid var(--ls-decoration-subtle);
  border-radius: 50%;
  content: "";
  pointer-events: none;
}

.ls-company-purpose__inner {
  position: relative;
  z-index: 1;
  max-width: 960px;
  margin-inline: auto;
  text-align: center;
}

.ls-company-purpose__title {
  margin: var(--ls-space-24) 0 0;
  color: var(--ls-fg-strong);
  font-size: clamp(38px, 5vw, 68px);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.04em;
}

.ls-company-purpose__body {
  max-width: 760px;
  margin: var(--ls-space-40) auto 0;
}

.ls-company-purpose__body p {
  margin: 0;
  color: var(--ls-fg);
  font-size: 16px;
  line-height: 2.1;
  letter-spacing: 0.03em;
}

.ls-company-purpose__mission {
  max-width: 640px;
  margin: var(--ls-space-48) auto 0;
  padding-top: var(--ls-space-40);
  border-top: 1px solid var(--ls-line-subtle);
}

.ls-company-purpose__mission p {
  margin: 0;
  color: var(--ls-fg-strong);
  font-size: clamp(18px, 2vw, 24px);
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.05em;
}


/* ==================================================
   COMPANY VISION
================================================== */

.ls-company-vision {
  padding-block: var(--ls-space-120);
  background: var(--ls-bg);
}

.ls-company-vision__header {
  max-width: 820px;
}

.ls-company-vision__title {
  margin: var(--ls-space-24) 0 0;
  color: var(--ls-fg-strong);
  font-size: clamp(38px, 4.8vw, 66px);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.04em;
}

.ls-company-vision__body {
  max-width: 720px;
  margin-top: var(--ls-space-40);
}

.ls-company-vision__body p {
  margin: 0;
  color: var(--ls-fg);
  font-size: 16px;
  line-height: 2;
  letter-spacing: 0.03em;
}

.ls-company-vision__body p + p {
  margin-top: var(--ls-space-24);
}

.ls-company-vision__outlook {
  max-width: 720px;
  margin-top: var(--ls-space-48);
  padding-top: var(--ls-space-40);
  border-top: 1px solid var(--ls-line-subtle);
}

.ls-company-vision__outlook-label {
  margin: 0 0 var(--ls-space-16);
  color: var(--ls-fg-muted);
  font-family: var(--ls-font-en);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.2em;
}

.ls-company-vision__outlook p {
  margin: 0;
  color: var(--ls-fg);
  font-size: 16px;
  line-height: 2;
  letter-spacing: 0.03em;
}


/* ==================================================
   COMPANY VALUES
================================================== */

.ls-company-values {
  padding-block: var(--ls-space-120);
  background: var(--ls-bg-soft);
}

.ls-company-values__header {
  max-width: 820px;
}

.ls-company-values__title {
  margin: var(--ls-space-24) 0 0;
  color: var(--ls-fg-strong);
  font-size: clamp(38px, 4.8vw, 66px);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.04em;
}

.ls-company-values__list {
  margin-top: var(--ls-space-72);
  border-top: 1px solid var(--ls-line-subtle);
}

.ls-company-values__item {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: var(--ls-space-32);
  align-items: start;
  padding-block: var(--ls-space-40);
  border-bottom: 1px solid var(--ls-line-subtle);
}

.ls-company-values__number {
  margin: 0;
  color: var(--ls-fg-link);
  font-family: var(--ls-font-en);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.18em;
}

.ls-company-values__item-title {
  margin: 0;
  color: var(--ls-fg-strong);
  font-size: clamp(20px, 2vw, 24px);
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: 0.03em;
}

.ls-company-values__text {
  margin: var(--ls-space-12) 0 0;
  color: var(--ls-fg);
  font-size: 15px;
  line-height: 1.95;
  letter-spacing: 0.03em;
}


/* ==================================================
   COMPANY PROFILE
================================================== */

.ls-company-profile {
  padding-top: var(--ls-space-96);
  padding-bottom: var(--ls-space-64);
  background: var(--ls-bg);
}

.ls-company-profile__header {
  margin-bottom: var(--ls-space-48);
}

.ls-company-profile__title {
  margin: var(--ls-space-16) 0 0;
  color: var(--ls-fg-strong);
  font-size: clamp(32px, 4vw, 48px);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0.03em;
}

.ls-company-profile__table {
  border-top: 1px solid var(--ls-line);
}

.ls-company-profile__row {
  display: grid;
  grid-template-columns: minmax(192px, 24%) minmax(0, 1fr);
  margin: 0;
  border-bottom: 1px solid var(--ls-line);
}

.ls-company-profile__row dt,
.ls-company-profile__row dd {
  margin: 0;
  padding-block: var(--ls-space-24);
}

.ls-company-profile__row dt {
  padding-right: var(--ls-space-32);
  color: var(--ls-fg-strong);
  font-weight: 600;
  line-height: 1.8;
}

.ls-company-profile__row dd {
  color: var(--ls-fg);
  line-height: 1.8;
}

.ls-company-profile__business-list {
  display: grid;
  gap: var(--ls-space-8);
  margin: 0;
  padding: 0;
  list-style: none;
}


/* ==================================================
   TABLET
================================================== */

@media (max-width: 959px) {

  .ls-company-message {
    padding-block: var(--ls-space-96);
  }

  .ls-company-message__top {
    grid-template-columns: 1fr;
    gap: var(--ls-space-48);
  }

  .ls-company-message__intro {
    max-width: 720px;
  }

  .ls-company-message__media img {
    height: 480px;
  }

  .ls-company-message__caption {
    justify-content: flex-start;
    text-align: left;
  }

  .ls-company-message__full {
    margin-top: var(--ls-space-72);
  }

  .ls-company-purpose,
  .ls-company-vision,
  .ls-company-values {
    padding-block: var(--ls-space-96);
  }

  .ls-company-values__item {
    grid-template-columns: 64px minmax(0, 1fr);
    gap: var(--ls-space-24);
  }

}


/* ==================================================
   MOBILE
================================================== */

@media (max-width: 767px) {

  .ls-company-message {
    padding-block: var(--ls-space-80);
  }

  .ls-company-message__top {
    gap: var(--ls-space-40);
  }

  .ls-company-message__title {
    font-size: clamp(28px, 8vw, 38px);
    line-height: 1.45;
  }

  .ls-company-message__lead {
    margin-top: var(--ls-space-32);
  }

  .ls-company-message__media img {
    height: 320px;
  }

  .ls-company-message__caption {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--ls-space-4);
    margin-top: var(--ls-space-16);
  }

  .ls-company-message__caption-role {
    font-size: 13px;
  }

  .ls-company-message__caption-name {
    font-size: 18px;
  }

  .ls-company-message__full {
    margin-top: var(--ls-space-64);
    padding-top: var(--ls-space-40);
  }

  .ls-company-message__full p {
    font-size: 15.5px;
    line-height: 2;
    letter-spacing: 0.03em;
  }

  .ls-company-message__signature {
    margin-top: var(--ls-space-48);
    padding-top: var(--ls-space-24);
    text-align: left;
  }

  .ls-company-message__signature p {
    font-size: 15px;
  }

  .ls-company-message__signature p + p {
    font-size: 17px;
  }

  .ls-company-purpose {
    padding-block: var(--ls-space-80);
  }

  .ls-company-purpose::before {
    top: -100px;
    right: -180px;
    width: 340px;
    height: 340px;
  }

  .ls-company-purpose::after {
    bottom: -180px;
    left: -220px;
    width: 420px;
    height: 420px;
  }

  .ls-company-purpose__title {
    font-size: clamp(34px, 10vw, 48px);
  }

  .ls-company-purpose__body {
    text-align: left;
  }

  .ls-company-purpose__body p {
    font-size: 15px;
    line-height: 2;
  }

  .ls-company-purpose__mission {
    margin-top: var(--ls-space-40);
    padding-top: var(--ls-space-32);
    text-align: left;
  }

  .ls-company-purpose__mission p {
    font-size: 17px;
  }

  .ls-company-vision {
    padding-block: var(--ls-space-80);
  }

  .ls-company-vision__title {
    font-size: clamp(34px, 10vw, 48px);
  }

  .ls-company-vision__body p,
  .ls-company-vision__outlook p {
    font-size: 15px;
  }

  .ls-company-vision__outlook {
    margin-top: var(--ls-space-40);
    padding-top: var(--ls-space-32);
  }

  .ls-company-values {
    padding-block: var(--ls-space-80);
  }

  .ls-company-values__title {
    font-size: clamp(34px, 10vw, 48px);
  }

  .ls-company-values__list {
    margin-top: var(--ls-space-48);
  }

  .ls-company-values__item {
    grid-template-columns: 1fr;
    gap: var(--ls-space-8);
    padding-block: var(--ls-space-32);
  }

  .ls-company-profile {
    padding-top: var(--ls-space-64);
    padding-bottom: var(--ls-space-40);
  }

  .ls-company-profile__header {
    margin-bottom: var(--ls-space-32);
  }

  .ls-company-profile__row {
    grid-template-columns: 1fr;
    padding-block: var(--ls-space-16);
  }

  .ls-company-profile__row dt,
  .ls-company-profile__row dd {
    padding: 0;
  }

  .ls-company-profile__row dt {
    margin-bottom: var(--ls-space-8);
  }

}


/* ==================================================
   SWELL標準表示の調整
================================================== */

.c-pageTitle {
  display: none;
}

#content {
  margin-top: 0;
  padding-top: 0;
}

.l-mainContent {
  padding-top: 0;
}