@charset "UTF-8";
/*
変数関係をまとめたファイル
 */
/*
色に関して記述しているファイル
色に関して、ここで宣言をしたものを利用する様にする
*/
:root {
  --color-default: #444444;
  --color-main: #1055A3;
  --color-black: #222222;
  --color-white: #fff;
  --color-gray: #E5E5E5;
  --color-gray2: #666666;
  --color-red: #dc3232;
}

/*
ブレイクポイントに関して記述しているファイル
下のブレイクポイントの設定を変更するときは必ずPMに一声かける
 */
/* ブレイクポイントの設定 min~max */
/* mq-target:指定してメディアクエリのみに適用 */
/* mq:指定より小さい画面に適用 */
/* ==========================================================================
   Company Page（トップと統一したエディトリアル構成）
   ========================================================================== */
.page-company {
  /* ---- PHILOSOPHY ---- */
  /* ---- COMPANY DETAIL ---- */
}
.page-company .py-32 {
  padding-top: 112px;
  padding-bottom: 112px;
}
@media screen and (max-width: 840px) {
  .page-company .py-32 {
    padding-top: 64px;
    padding-bottom: 64px;
  }
}
.page-company .philosophy .philosophy-inner {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}
.page-company .philosophy .philosophy-en {
  font-family: "proxima-nova", sans-serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.4em;
  color: var(--color-main);
  margin-bottom: 32px;
}
.page-company .philosophy .philosophy-logo {
  width: 100%;
  max-width: 420px;
  height: auto;
  margin: 0 auto 40px;
}
@media screen and (max-width: 840px) {
  .page-company .philosophy .philosophy-logo {
    max-width: 280px;
    margin-bottom: 32px;
  }
}
.page-company .philosophy .philosophy-lead {
  font-size: 16px;
  font-weight: 700;
  line-height: 2.4;
  color: #4a5568;
}
@media screen and (max-width: 840px) {
  .page-company .philosophy .philosophy-lead {
    font-size: 13px;
    line-height: 2.1;
  }
}
.page-company .company-detail {
  background-color: #f4f6f9;
}
.page-company .company-detail .company-flex {
  display: flex;
  gap: 64px;
  align-items: flex-start;
}
@media screen and (max-width: 840px) {
  .page-company .company-detail .company-flex {
    flex-direction: column;
    gap: 40px;
  }
}
.page-company .company-detail .minimal-table {
  flex: 1 1 56%;
  width: 100%;
  border-collapse: collapse;
}
.page-company .company-detail .minimal-table .column {
  border-bottom: 1px solid #e2e5ea;
  transition: background-color 0.3s ease;
}
.page-company .company-detail .minimal-table .column:hover {
  background-color: rgba(16, 85, 163, 0.04);
}
.page-company .company-detail .minimal-table .column th,
.page-company .company-detail .minimal-table .column td {
  padding: 22px 16px;
  text-align: left;
  vertical-align: top;
  line-height: 1.7;
}
.page-company .company-detail .minimal-table .column th {
  font-weight: bold;
  width: 34%;
  color: #4a5568;
}
@media screen and (max-width: 840px) {
  .page-company .company-detail .minimal-table .column th {
    font-size: 13px;
  }
}
.page-company .company-detail .minimal-table .column td {
  width: 66%;
  color: #1a2233;
}
@media screen and (max-width: 840px) {
  .page-company .company-detail .minimal-table .column td {
    font-size: 13px;
  }
}
@media screen and (max-width: 840px) {
  .page-company .company-detail .minimal-table .column {
    display: block;
    padding: 12px 0;
  }
  .page-company .company-detail .minimal-table .column th,
  .page-company .company-detail .minimal-table .column td {
    display: block;
    width: 100%;
    padding: 6px 0;
  }
  .page-company .company-detail .minimal-table .column th {
    padding-bottom: 0;
  }
}
.page-company .company-detail .map {
  flex: 1 1 44%;
  position: sticky;
  top: 96px;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 16px 40px rgba(13, 20, 36, 0.1);
}
.page-company .company-detail .map iframe {
  display: block;
  width: 100%;
  border: 0;
}
@media screen and (max-width: 840px) {
  .page-company .company-detail .map {
    position: static;
    width: 100%;
  }
}