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

:root {
  /* 会社概要ヘッダ 文字色 */
  --var-outline-head-font:#494949;
  /* 会社概要ヘッダ 背景色 */
  --var-outline-head-back:#f4f4f4;
  /* 会社概要ヘッダ 背景左色 */
  --var-outline-head-back-left:#7db4e6;
  /* 会社概要ヘッダ 背景下色 */
  --var-outline-head-back-bolder:#d7d7d7;
}

/* #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 ===== 会社概要 ===== */
.broad_outline {
  width: 960px;
  margin: 0 auto 5em auto;
}

.outline-head {
  padding: 0em 0.5em;
  color: var(--var-outline-head-font);
  background: var(--var-outline-head-back);
  border-left: solid 5px var(--var-outline-head-back-left);
  border-bottom: solid 3px var(--var-outline-head-back-bolder);
  margin: 0px;
  font-size: 21px;
}

.outline-over {
  margin: 10px auto 30px auto;
  max-width: 720px;
}

.outline-over>div, .outline-over>ol, .outline-over>ul{
  margin: 10px 0 20px 20px;
}
.outline-over>ol, .outline-over>ul{
  padding-left: 20px;
}

/* TB用 */
@media screen and (max-width: 1179px) {
  .broad_outline {
    display: flex;
    align-items: center;
    flex-direction: column;
  }

  .outline-over {
    width: 600px;
    max-width: none;
  }

}
/* sp用 */
@media screen and (max-width: 800px) {
  .broad_outline {
    padding: 0 20px;
    display: flex;
    align-items: center;
    flex-direction: column;
    width: auto;

  }

  .outline-over {
    width: 100%;
    max-width: none;
  }

}
/* #endregion */


/* #region ===== 会社概要 役員 ===== */
.post-wrap {
  margin: 15px 30px 20px 20px;
}
.post {
  margin: 0;
  font-weight: bold;
  margin-right: 30px;  
}
.post-wrap div {
  margin-left: 40px;
}

@media screen and (max-width: 800px) {
  .post-wrap div {
    margin-left: 20px;
  }  
}
/* #endregion */