@charset "UTF-8";
.section-ttl {
  font-family: "Avenir Next";
  font-size: 36px;
  font-weight: 700;
  line-height: 1.2;
}

.section-ttl span {
  color: #3863aa;
}

.section-ttl small {
  display: block;
  font-size: 14px;
  font-weight: 400;
}

/* engineering-top */
.engineering-top {
  padding-top: 80px;
  color: #fff;
  font-family: "Avenir Next";
}

.engineering-top h2 .row {
  font-size: 36px;
  font-weight: 700;
  line-height: 1.2;
  display: block;
  text-align: left;
  margin-left: 0;
}

.engineering-top p {
  padding: 50px 10px 0px;
  font-size: 20px;
  font-weight: 700;
}

.engineering-top p:nth-of-type(1) {
  margin-bottom: 80px;
}

/* engineering-about */
.engineering-about {
  color: #000;
  padding: 80px 10px 0px;
}

.col-th {
  width: 400px;
}

.engineering-about table {
  width: 100%;
  table-layout: auto;
}

.engineering-about th {
  width: 400px;
  padding: 20px 10px 20px 40px;
  vertical-align: middle;
  text-align: left;
  font-size: 20px;
  font-weight: 700;
  border-top: solid 1px #3863aa;
}

.engineering-about th:last-of-type {
  border-bottom: solid 1px #3863aa;
}

.engineering-about td {
  padding: 20px 10px 20px 40px;
  vertical-align: middle;
  font-size: 20px;
  font-weight: 700;
  border-top: solid 1px #bfbfbf;
  overflow-wrap: break-word;
}

.engineering-about td:last-of-type {
  border-bottom: solid 1px #bfbfbf;
}

.engineering-about p {
  padding: 30px 10px 0px;
  font-size: 20px;
  font-weight: 700;
}

.engineering-about p:not(:last-of-type) {
  margin-bottom: 30px;
}

/* engineering-bottom */
.engineering-bottom {
	padding-top: 80px;
	color: #000;
}

.engineering-bottom p {
  padding: 0px 10px 0px;
  font-size: 20px;
  font-weight: 700;
}

.engineering-bottom p:first-of-type {
	margin-top: 50px;
}

.engineering-bottom p:not(:last-of-type) {
	margin-bottom: 30px;
}

/* 親要素にフレックスを指定して中央揃え */
.movie {
    display: flex;             /* 横方向中央揃え用 */
    justify-content: center;   /* 横方向中央 */
    align-items: center;       /* 縦方向中央 */
    margin-top: 50px;          /* 上に余白 */
    width: 100%;               /* 親要素幅に合わせる */
    max-width: 100%;           /* はみ出し防止 */
    overflow: hidden;          /* はみ出した部分を隠す */
}

/* video 自体は幅100%で縦横比を維持 */
.movie video {
    width: 50%;               /* 親要素いっぱいに広げる */
    max-width: 100%;           /* 横はみ出し防止 */
    height: auto;              /* 縦横比を維持 */
    object-fit: contain;       /* はみ出さずに収める */
    display: block;            /* ブロック表示にして余計な隙間を削除 */
}

@media screen and (max-width: 768px) {
  /* engineering-topスマホ */
  .engineering-top {
    padding: 50px 0;
  }
  .engineering-top h2,.engineering-top h2 .row {
    font-size: 26px;
  }
  .engineering-top p {
    font-size: 13px;
  }

/* engineering-about スマホ */
.engineering-about {
  color: #000;
  padding: 40px 0px;
}

.engineering-about h2 {
  font-size: 26px;
}

.col-th {
  width: 100px;
}

.engineering-about table {
  width: 100%;
  table-layout: auto;
}

.engineering-about th {
  width: 100px;
  padding: 10px 10px 10px 15px;
  vertical-align: middle;
  text-align: left;
  font-size: 13px;
  border-top: solid 1px #3863aa;
}

.engineering-about th:last-of-type {
  border-bottom: solid 1px #3863aa;
}

.engineering-about td {
  padding: 10px 10px 10px 15px;
  vertical-align: middle;
  font-size: 13px;
  border-top: solid 1px #bfbfbf;
  overflow-wrap: break-word;
}

.engineering-about td:last-of-type {
  border-bottom: solid 1px #bfbfbf;
}

.engineering-about p {
  padding: 30px 10px 0px;
  font-size: 13px;
}

.engineering-about p:not(:last-of-type) {
  margin-bottom: 30px;
}
  /* engineering-bottomスマホ */
.engineering-bottom {
	color: #000;
	padding: 40px 0px;
}

.engineering-bottom h2 {
  font-size: 26px;
}

.engineering-bottom p {
  padding: 0px 10px 0px;
  font-size: 13px;
}

.engineering-bottom p:first-of-type {
	margin-top: 50px;
}

.engineering-bottom p:not(:last-of-type) {
	margin-bottom: 30px;
}

  /* movieスマホ */
/* 親要素にフレックスを指定して中央揃え */
.movie {
    display: flex;             /* 横方向中央揃え用 */
    justify-content: center;   /* 横方向中央 */
    align-items: center;       /* 縦方向中央 */
    margin-top: 50px;          /* 上に余白 */
    width: 100%;               /* 親要素幅に合わせる */
    max-width: 100%;           /* はみ出し防止 */
    overflow: hidden;          /* はみ出した部分を隠す */
}

/* video 自体は幅100%で縦横比を維持 */
.movie video {
    width: 100%;               /* 親要素いっぱいに広げる */
    max-width: 100%;           /* 横はみ出し防止 */
    height: auto;              /* 縦横比を維持 */
    object-fit: contain;       /* はみ出さずに収める */
    display: block;            /* ブロック表示にして余計な隙間を削除 */
}
	
}