/*!************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./src/styles/style.scss ***!
  \************************************************************************************************************************************************************************/
@charset "UTF-8";
/* 基本的なリセット */
.post-description,
.article__body {
  /* HTML要素のデフォルトリセット */
  /* リンク */
  /* リスト */
  /* テーブル */
  /* 画像とビデオ */
  /* フォーム要素 */
  /* ボタン */
  /* 引用要素 */
  /* 記号や不要なスタイルをリセット */
  /* 強制的なスクロールバーの隠蔽を防ぐ */
}
.post-description *,
.post-description *::before,
.post-description *::after,
.article__body *,
.article__body *::before,
.article__body *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
.post-description html,
.post-description body,
.article__body html,
.article__body body {
  height: 100%;
  width: 100%;
  font-family: sans-serif;
  line-height: 1.5;
  background-color: #fff;
  color: #000;
}
.post-description a,
.article__body a {
  color: inherit;
  text-decoration: none;
}
.post-description ul,
.post-description ol,
.article__body ul,
.article__body ol {
  list-style: none;
}
.post-description table,
.article__body table {
  border-collapse: collapse;
  border-spacing: 0;
}
.post-description img,
.post-description video,
.article__body img,
.article__body video {
  display: block;
  max-width: 100%;
  height: auto;
}
.post-description input,
.post-description textarea,
.post-description button,
.post-description select,
.article__body input,
.article__body textarea,
.article__body button,
.article__body select {
  font: inherit;
  color: inherit;
  background: none;
  border: none;
  outline: none;
}
.post-description button,
.article__body button {
  cursor: pointer;
}
.post-description blockquote,
.post-description q,
.article__body blockquote,
.article__body q {
  quotes: none;
}
.post-description blockquote::before,
.post-description blockquote::after,
.post-description q::before,
.post-description q::after,
.article__body blockquote::before,
.article__body blockquote::after,
.article__body q::before,
.article__body q::after {
  content: "";
}
.post-description hr,
.article__body hr {
  border: 0;
  height: 1px;
  background: #ccc;
}
.post-description h1, .post-description h2, .post-description h3, .post-description h4,
.article__body h1,
.article__body h2,
.article__body h3,
.article__body h4 {
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
}

.post-description,
.post-content,
.article__body {
  overflow: hidden;
  font-size: 16px;
  padding-bottom: 80px;
}
@media (max-width: 768px) {
  .post-description,
  .post-content,
  .article__body {
    font-size: 14px;
    padding-bottom: 40px;
  }
}
.post-description p,
.post-content p,
.article__body p {
  display: flex;
  flex-direction: column;
  font-size: inherit;
  margin-bottom: 1em;
}
.post-description p:last-child,
.post-content p:last-child,
.article__body p:last-child {
  margin-bottom: 0;
}
.post-description h1,
.post-description h2,
.post-description h3:not(.text-titlecase),
.post-description h4,
.post-description h5,
.post-content h1,
.post-content h2,
.post-content h3:not(.text-titlecase),
.post-content h4,
.post-content h5,
.article__body h1,
.article__body h2,
.article__body h3:not(.text-titlecase),
.article__body h4,
.article__body h5 {
  text-align: left;
  font-weight: 700;
  margin-bottom: 1em;
  line-height: 1.8;
}
.post-description h1,
.post-content h1,
.article__body h1 {
  font-size: 26px;
  font-weight: 700;
  color: inherit;
}
@media (max-width: 768px) {
  .post-description h1,
  .post-content h1,
  .article__body h1 {
    font-size: 22px;
  }
}
.post-description h2,
.post-content h2,
.article__body h2 {
  font-size: 24px;
  font-weight: 700;
  color: var(--black-color);
}
@media (max-width: 768px) {
  .post-description h2,
  .post-content h2,
  .article__body h2 {
    font-size: 22px;
  }
}
.post-description h3:not(.text-titlecase),
.post-content h3:not(.text-titlecase),
.article__body h3:not(.text-titlecase) {
  font-size: 20px;
  font-weight: 700;
  color: inherit;
}
@media (max-width: 768px) {
  .post-description h3:not(.text-titlecase),
  .post-content h3:not(.text-titlecase),
  .article__body h3:not(.text-titlecase) {
    font-size: 20px;
  }
}
.post-description h4,
.post-content h4,
.article__body h4 {
  font-size: 18px;
  font-weight: 700;
  color: inherit;
}
@media (max-width: 768px) {
  .post-description h4,
  .post-content h4,
  .article__body h4 {
    font-size: 16px;
  }
}
.post-description a,
.post-content a,
.article__body a {
  color: var(--black-color);
  text-decoration: underline;
}
.post-description a:hover,
.post-content a:hover,
.article__body a:hover {
  opacity: 0.7;
}
.post-description img,
.post-content img,
.article__body img {
  width: auto;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.post-description hr,
.post-content hr,
.article__body hr {
  margin: 1em auto;
  background-color: #DDDDDD;
  height: 1px;
  border: none;
}
.post-description strong,
.post-description b,
.post-content strong,
.post-content b,
.article__body strong,
.article__body b {
  font-weight: 700;
}
.post-description big,
.post-content big,
.article__body big {
  font-size: 1.5em;
}
.post-description small,
.post-content small,
.article__body small {
  font-size: 0.5em;
}
.post-description s,
.post-content s,
.article__body s {
  text-decoration: line-through;
}
.post-description sub,
.post-content sub,
.article__body sub {
  vertical-align: sub;
  font-size: smaller;
}
.post-description .marker,
.post-content .marker,
.article__body .marker {
  background-color: var(--primary-color);
  padding-left: 8px;
  padding-right: 8px;
  width: fit-content;
}
.post-description blockquote,
.post-content blockquote,
.article__body blockquote {
  position: relative;
  background-color: #F3F3F3;
  padding: 24px 18px 24px 40px;
  font-size: 14px;
  font-weight: 500;
  color: var(--black-color);
  line-height: 1.8;
  margin-bottom: 1em;
}
.post-description blockquote:last-child,
.post-content blockquote:last-child,
.article__body blockquote:last-child {
  margin-bottom: 0;
}
.post-description blockquote::before,
.post-content blockquote::before,
.article__body blockquote::before {
  position: absolute;
  content: "";
  margin: auto;
  top: 18px;
  right: auto;
  bottom: auto;
  left: 16px;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyLjI2NjUgMTMuOTE5MUMxNC4zMjg1IDEzLjkxOTEgMTYgMTIuMjQ3MSAxNiAxMC4xODQ0QzE2IDguMTIyNDEgMTQuMzI4NSA2LjQ1MDQxIDEyLjI2NjUgNi40NTA0MUMxMi4yNjY1IDYuNDUwNDEgMTIuMjg0NiA1LjA2MzE2IDEzLjQxMTYgMy4wNjY1NEMxMy41MzY4IDIuNjY2NDcgMTMuMzEzNiAyLjI0MDQ0IDEyLjkxMzMgMi4xMTU5N0MxMi42MjkzIDIuMDI2NjMgMTIuMzMwNCAyLjExMzQ3IDEyLjEzNzQgMi4zMTU2M0M5LjU0NTk3IDUuMTUgOC41MzE1OSA4LjQ4NTg4IDguNTMxNTkgMTAuMTg0NEM4LjUzMTU5IDEyLjI0NzEgMTAuMjAzMSAxMy45MTkxIDEyLjI2NjUgMTMuOTE5MVoiIGZpbGw9IiNENUQ1RDUiLz4KPHBhdGggZD0iTTMuNzM1MjUgMTMuOTE5MUM1Ljc5NzIyIDEzLjkxOTEgNy40Njg3NSAxMi4yNDcgNy40Njg3NSAxMC4xODQ0QzcuNDY4NzUgOC4xMjI0MSA1Ljc5NzIyIDYuNDUwNDEgMy43MzUyNSA2LjQ1MDQxQzMuNzM1MjUgNi40NTA0MSAzLjc1MzMxIDUuMDYzMTYgNC44ODAzMSAzLjA2NjU0QzUuMDA1NSAyLjY2NjQ3IDQuNzgyMzEgMi4yNDA0NCA0LjM4MjAzIDIuMTE1OTdDNC4wOTggMi4wMjY2MyAzLjc5OTEzIDIuMTEzNDcgMy42MDYxNiAyLjMxNTYzQzEuMDE0NzIgNS4xNSAwLjAwMDMxMzI4IDguNDg1ODggMC4wMDAzMTMxMzIgMTAuMTg0NEMwLjAwMDMxMjk1MSAxMi4yNDcxIDEuNjcxODQgMTMuOTE5MSAzLjczNTI1IDEzLjkxOTFaIiBmaWxsPSIjRDVENUQ1Ii8+Cjwvc3ZnPgo=);
  width: 16px;
  height: 16px;
  background-size: contain;
}
.post-description blockquote::after,
.post-content blockquote::after,
.article__body blockquote::after {
  content: none;
}
.post-description li,
.post-content li,
.article__body li {
  margin-bottom: 8px;
  word-break: break-all;
  line-height: 1.5;
}
@media (max-width: 768px) {
  .post-description li,
  .post-content li,
  .article__body li {
    margin-bottom: 12px;
  }
}
.post-description li:last-child,
.post-content li:last-child,
.article__body li:last-child {
  margin-bottom: 0;
}
.post-description ol,
.post-content ol,
.article__body ol {
  list-style-type: none;
  counter-reset: num 0;
}
.post-description ol > li,
.post-content ol > li,
.article__body ol > li {
  position: relative;
  counter-increment: num 1;
  padding-left: 1.25em;
}
.post-description ol > li::before,
.post-content ol > li::before,
.article__body ol > li::before {
  position: absolute;
  content: counter(num) ". ";
  color: var(--black-color);
  font-weight: 700;
  margin: auto;
  top: 0;
  right: auto;
  bottom: auto;
  left: 0;
}
.post-description ul,
.post-content ul,
.article__body ul {
  list-style: none;
}
.post-description ul > li,
.post-content ul > li,
.article__body ul > li {
  position: relative;
  padding-left: 12px;
}
.post-description ul > li::before,
.post-content ul > li::before,
.article__body ul > li::before {
  position: absolute;
  content: "";
  width: 6px;
  height: 6px;
  background-color: var(--black-color);
  border-radius: 50%;
  margin: auto;
  top: 0.5em;
  right: auto;
  bottom: auto;
  left: 0;
}
.post-description ul,
.post-description ol,
.post-content ul,
.post-content ol,
.article__body ul,
.article__body ol {
  margin-bottom: 16px;
}
@media (max-width: 768px) {
  .post-description ul,
  .post-description ol,
  .post-content ul,
  .post-content ol,
  .article__body ul,
  .article__body ol {
    margin-bottom: 10px;
  }
}

.table-wrapper {
  width: fit-content;
  max-width: 100%;
}
@media (max-width: 768px) {
  .table-wrapper {
    overflow-x: scroll;
    overflow-y: auto;
  }
}

table {
  width: fit-content !important;
  border-collapse: separate !important;
  border-spacing: 0;
  border: 1px solid #DFDFDF;
}
table caption {
  margin-bottom: 12px;
}
@media (max-width: 768px) {
  table caption {
    margin-bottom: 10px;
  }
}
table th,
table td {
  padding: 18px 15px !important;
  vertical-align: middle;
  font-size: 14px;
  text-align: center;
  overflow: hidden;
  background: #fff;
  min-width: 360px;
}
@media (max-width: 768px) {
  table th,
  table td {
    font-size: 14px;
    min-width: 216px;
  }
}
table thead [scope],
table tbody [scope] {
  background-color: var(--black-color);
  color: #ffffff;
}
table tbody th,
table tbody td {
  border-bottom: 1px solid #DFDFDF;
}
table tbody th:not(first-child),
table tbody td:not(first-child) {
  border-left: 1px solid #DFDFDF;
}
table tr:last-child th,
table tr:last-child td {
  border-bottom: none;
}
