@charset "utf-8";
/* 必ず1行目 */

/*
Theme Name: brtpath
Theme URI: https://brtpath.com/
Author: 株式会社BRIGHTPATH
Author URI: https://brtpath.com/
Description: 自社サイト用オリジナルテーマ
Version: 1.0
*/




/* guide（大親記事） */
.a-guide ol {
  list-style: decimal;
  padding-left: 2rem;
}



/* parent【HP制作】 */
.story-list-item {
  counter-increment: step;
  display: grid;
  grid-template-columns: 1em 8em 1fr;
}

.story-list-item::before {
  content: counter(step) ".";
}


@media (max-width: 768px) {
  .story-list-item {
    display: grid;
    grid-template-columns: 1em 1fr;
  }

  .story-list-item::before {
    grid-column: 1;
    grid-row: 1;
  }

  .story-list-label {
    grid-column: 2;
    grid-row: 1;
  }

  .story-list-txt {
    grid-column: 2;
    grid-row: 2;
  }
}




/* 表の設定 */
table {
  border-collapse: collapse;
}

.table-title th {
  font-weight: 400;
  text-align: center;
}

.table-title-bg {
  background-color: var(--accent-color);
  opacity: .8;
  color: #fff;
}

.table-bg {
  background-color: #e6f1f6;
}


.blog-001-table table {
  border-collapse: collapse;
  width: auto;
  line-height: 2.5;
  border: 1px solid #ccc;
}

.blog-001-table th,
.blog-001-table td {
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: .5rem 1rem;
  line-height: 1.8;
}

.article-sub-title {
  color: var(--accent-color);
  font-weight: 500;
}

/* リストスタイルinside */
.article-list-style {
  list-style: unset;
  padding-left: 2rem;
}

/* お客様の声 */
.voice-client {
  background-color: #e6f0f7;
  display: flex;
  padding: 2rem 4rem;
  border-radius: 10px;
  margin: 2rem 3.5rem;
}

.voice-client img {
  padding-right: 2rem;
  width: 100px;
  height: auto;
  object-fit: contain;
}

.voice-client p {
  align-content: center;
}

.voice-client span {
  font-size: clamp(1.2rem, 2vw, 1.4rem);
}

/* メリット */
.blog-merit-title {
  font-weight: 500;
}

.blog-merit-number {
  font-weight: 600;
  color: var(--accent-color);
  margin-right: 2rem;
}

/* チェックリスト */
.blog-check-list p {
  color: var(--accent-color);
}

.blog-check-list li {
  position: relative;
  padding-left: 3.5rem;
}

.blog-check-list li:after {
  content: '';
  display: block;
  position: absolute;
  top: 1rem;
  left: 1rem;
  width: 13px;
  height: 5px;
  border-left: 2px solid var(--accent-color);
  border-bottom: 2px solid var(--accent-color);
  transform: rotate(-45deg);
}

/* ステップ */
.blog-step-title {
  font-weight: 500;
  margin-bottom: .5rem;
}

.blog-step-title span {
  background-color: #d0ebf5;
  padding: .5rem 1rem;
  margin-right: 1rem;
  font-size: clamp(1.3rem, 2vw, 1.5rem);
  border-radius: 5px;
}

/* FAQ */
.blog-faq {
  display: flex;
  align-items: flex-start;
}

.blog-faq-q,
.blog-faq-a {
  color: var(--accent-color);
  font-size: clamp(1.5rem, 2vw, 1.8rem);
  font-weight: 600;
  padding-right: 1rem;
}

.blog-faq-a {
  color: #679eb3;
}

.blog-faq-text {
  font-size: clamp(1.5rem, 2vw, 1.7rem);
  font-weight: 500;
}

.blog-faq-mb {
  margin-bottom: 3rem;
}


@media screen and (max-width: 1000px) {
  .blog-001-table td {
    line-height: 1.6;
  }
}


@media screen and (max-width: 767px) {
  .blog-001-table table {
    width: 100%;
    line-height: 1.6;
  }

  .voice-client {
    display: block;
    padding: 1rem 1.5rem;
  }

  .voice-client img {
    display: block;
    margin: 0 auto;
    width: 85px;
    padding-right: 0;
  }

  .table-title th {
    padding: .5rem;
  }
}


/* article-002 */
.fail-example {
  background-color: #dfdfdf;
}

.blog-target-table th,
.blog-target-table td {
  border: 1px solid #ccc;
  padding: .5rem 1rem;
  line-height: 1.8;
}

.blog-target-table th {
  background: #e6f1f6;
  width: 18%;
}

.blog-target-table thead th {
  background: var(--accent-color);
  opacity: .8;
  color: #fff;
  text-align: center;
  font-weight: 500;
  width: auto;
  padding: 0 2rem;
  line-height: 2.5;
  white-space: nowrap;
}

.blog-target-table tbody td:nth-child(1) {
  background: #e6f1f6;
  text-align: center;
}



@media screen and (max-width: 767px) {

  .blog-target-table th,
  .blog-target-table td {
    white-space: wrap;
    line-height: 1.6;
  }

  .blog-target-table thead th {
    padding: .5rem;
    line-height: unset;
    white-space: wrap;
  }
}


/* artcile003 */
.blog-font-color {
  color: var(--accent-color);
}

.blog-font-color span {
  color: var(--main-color);
}

.blog-demerit span {
  background-color: #d5d5d5;
}


/* artcile004 */
.blog-result {
  display: flex;
  justify-content: flex-start;
  font-weight: 500;
  font-size: clamp(1.5rem, 2vw, 1.8rem);
}

.blog-result-title {
  padding: 0 2rem;
  color: var(--accent-color);
  background: #dcf0f7;
  border: 1px solid var(--accent-color);
  margin-right: 2rem;
  border-radius: 10px;
}

.blog-result-detail {
  display: flex;
  justify-content: flex-start;
  font-weight: 500;
}

.blog-reason-title {
  padding: 0 2rem;
  color: var(--main-color);
  background: #ededed;
  border: 1px solid var(--main-color);
  margin-right: 2rem;
  border-radius: 10px;
}


.blog-002-table th,
.blog-002-table td {
  border: 1px solid #ccc;
  padding: 0 2rem;
  text-align: left;
  vertical-align: middle;
  line-height: 1.8;
}

.blog-002-table thead th {
  text-align: center;
}

.blog-002-table th[scope="row"] {
  background-color: #f2f2f2;
  font-weight: 500;
  width: 25%;
}

.blog-002-table .before {
  background-color: #d9d9d9;
  font-weight: 500;
}

.blog-002-table .after {
  background-color: #fce5cd;
  font-weight: 500;
}


@media screen and (max-width: 767px) {

  .blog-result,
  .blog-result-detail {
    display: block;
  }

  .blog-result-title,
  .blog-reason-title {
    display: inline-block;
  }

  .blog-002-table th,
  .blog-002-table td {
    padding: .5rem;
  }
}



/* artcile008 */
.article-list-padding li {
  padding-left: 3rem;
}

/* artcile009 */
.blog-001-table-lh table {
  line-height: 2;
}

@media screen and (max-width: 767px) {
  .blog-001-table-lh table {
    line-height: unset;
  }
}

/* artcile010 */
.sum-link a {
  display: block;
  text-align: center;
  width: 100%;
  max-width: 200px;
  padding: .5rem;
  margin-top: 1.5rem;
  color: var(--accent-color);
  background: #fff;
  border: 1px solid var(--accent-color);
  border-radius: 100vh;
  transition: 0.5s;
}

.sum-link a:hover {
  color: #fff;
  background: var(--accent-color);
}


@media screen and (max-width: 767px) {
  .sum-link a {
    margin: 1.5rem auto;
  }
}




/* artcile013 */
.vc-edit-01 {
  margin: 0;
  padding: 1rem 2rem;
}

.vc-edit-01 span {
  font-size: var(--font-base-size);
}

.vc-edit-01 img {
  width: 80px;
}

@media screen and (max-width: 767px) {
  .vc-edit-01 {
    display: flex;
    gap: 1rem;
  }

  .vc-edit-01 img {
    width: 55px;
    margin: 0;
  }
}


/* article023 HP制作 子記事001*/
.a023-table td:first-child,
.a023-table th:first-child {
  white-space: nowrap;
}

/* article024 HP制作 子記事002*/
.a024-list-style li p:nth-of-type(2) {
  padding-left: 3rem;
}

/* article025 HP制作 子記事003*/
.a025-frame {
  padding: .5rem;
  background-color: #d0ebf5;
  width: 60%;
  border-radius: 10px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .a025-frame {
    width: 100%;
  }
}

/* article026 HP制作 子記事004*/
.a026-frame {
  width: 80%;
  background: #eef7fa;
  padding: 3rem 5rem;
  border-radius: 5px;
  margin-top: 1rem;
}

.a026-frame p {
  margin-bottom: 1.5rem;
}

.a026-frame p:last-of-type {
  margin-bottom: 0;
}


@media screen and (max-width: 767px) {
  .a026-frame {
    width: 100%;
    padding: 2rem;
    border-radius: 3px;
    margin-top: .5rem;
    line-height: 1.5;
  }
}