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

:root {
  /* access見出し */
  --var-c-accesshead-back: #f4f4f4;
  --var-c-accesshead-text: #494949;
  --var-c-accesshead-border: #7db4e6;
  --var-s-accesshead-border: 5px;
  --var-c-accesshead-bordershadow: #d7d7d7;
  --var-s-accesshead-bordershadow: 3px;

  /* access記事 */
  --var-c-accessarticle-text: #5c87a6;
  --var-s-accessarticle-text-tb: 15px;
}

/* #region ===== 所在地 ===== */
.access {
  width: 960px;
  margin: 0 auto;
}

.access-head {
  padding: 0.4em 0.5em;
  color: var(--var-c-accesshead-text);
  background: var(--var-c-accesshead-back);
  border-left: solid var(--var-s-accesshead-border) var(--var-c-accesshead-border);
  border-bottom: solid var(--var-s-accesshead-bordershadow) var(--var-c-accesshead-bordershadow);
  margin: 0px;
  font-size: 21px;
}

.article-area {
  width: 100%;
  margin: 0 auto 0 10px;
  text-align: left;
  color: var(--var-c-accessarticle-text);
  transition: transform 0.2s;
}

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

.link-wrap {
  display: flex;
  margin-bottom: 2em;
  margin: 20px auto 0px auto;
}

.map {
  margin-right: 0;
}

.directions {
  margin: 0 auto 0 10px;
  color: var(--var-c-accessarticle-text);
}

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

  .link-wrap {
    display: flex;
  }

  .map {
    width: 70%;
    margin: 10px 10px;
  }

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

  .article-area {
    width: 200px;
    font-size: var(--var-s-accessarticle-text-tb);
    margin: 10px auto 10px 10px;
  }
}

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

  .access {
    width: 400px;
    margin: auto;
  }

  .link-wrap {
    display: block;
  }

  .map {
    width: 100%;
  }

  .access-over {
    width: 100%;
    max-width: none;
    margin: 0 10px;
  }

  .article-area {
    width: 200px;
  }
}

/* #endregion */

/* #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 */