@charset "UTF-8";
@import url(breakpoints.css);

:root {
  --var-color-link-omron: #0000FF;
  /* Omronのプッシュイン端子台へのリンク色 */
  --var-serarch-icon: #53bbff;
  /* パンくずテキスト色 */
  --var-bread-current-text: #333;
  /* パンくず現在地のテキスト色 */
  --var-hlcolor1: #FFA07A;
  /* ハイライト センサー */
  --var-hlcolor2: #FFFACD;
  /* ハイライト 電子部品 */
  --var-hlcolor3: #98FB98;
  /* ハイライト モーター/アクチュエーター */
  --var-hlcolor4: #AFEEEE;
  /* ハイライト 電池/バッテリー */
  --var-hlcolor5: #ADD8E6;
  /* ハイライト プリント基板 */
  --var-hlcolor6: #DDA0DD;
  /* ハイライト スイッチ/リレー/ブレーカー */
  --var-hlcolor7: #FFC0CB;
  /* ハイライト その他 */
  
  --var-history: #1208a5f1;
  /* 沿革色 ヘッダ・年 */
  --var-history-nomaltext: #151516;
  /* 沿革色 通常文字 */
  --var-history-bar: #d5d5d8;
  /* 沿革色 通常文字 */
}

/* #region ===== 見出し ===== */
h2 {
  position: relative;
  padding: 1.5em 0.5em 0 0;
  font-size: 2rem;
}

h2:after {
  content: "";
  display: block;
  height: 5px;
  background: linear-gradient(to right, #6DA6D9, #1F4F7B);
}

/* #endregion */

/* #region ==== 沿革 ===== */
.history-over {
  margin: 10px auto;
  max-width: 720px;
}

.history-list {
  margin: 70px 0 0;
  position: relative;
}
.history-list._history dl {
  padding: 32px 0;
  position: relative;
  z-index: 3;
}
.history-list._history dl:before {
  content: "";
  width: 262px;
  height: 108px;
  position: absolute;
  right: -40px;
  bottom: -40px;
  z-index: 3;
  display: block;
}
.history-list._history dt {
  position: relative;
  z-index: 2;
  line-height: 1;
  font-weight: 500;
  font-size: 40px;
  color: var(--var-history);
}
.history-list dt {
  width: 22.8%;
  font-weight: 700;
}
.history-list dl {
  padding: 16px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-top: 2px var(--var-history-bar) solid;
}
.history-list ._head {
  margin-bottom: 5px;
  display: block;
  font-weight: 700;
}
.all_text {
  letter-spacing: 0.05em;
  line-height: 2;
  font-size: 16px;
}
.all_font_poppins {
  font-weight: 400;
  font-family: "Poppins", sans-serif;
}
.history-list._history dd {
  position: relative;
  z-index: 2;
}
.history-list dd {
  width: 77.2%;
}
/* #endregion */