@charset "UTF-8";
.article_thumb {
  width: 100%;
  height: auto;
  margin-bottom: 30px;
}

.article_header {
  margin-bottom: 30px;
}

.page_title {
  font-size: 2.8rem;
  font-weight: 800;
  line-height: 1.5;
  color: #333;
}

.article_date {
  display: block;
  font-size: 1.3rem;
  margin-top: 1em;
  color: #666;
}

.article_dl {
  font-size: 1.3rem;
  margin-top: 1em;
  color: #333;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}
.article_dl__dt::after {
  content: "：";
  padding: 0 0.2em;
}

.article_type {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 0.5em;
}
.article_type__link {
  display: block;
  color: #fff;
  padding: 0.25em 0.5em;
  text-decoration: none;
  border-radius: 5px;
}
.article_type__link--category {
  background-color: var(--primary-color);
}
.article_type__link--tag {
  background-color: #EB9845;
}

.article_content {
  width: 100%;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.6;
  color: #333;
}
.article_content h2 {
  display: block;
  width: fit-content;
  font-size: 2.2rem;
  font-weight: 800;
  padding: 0.4em 0.8em;
  margin: 1.5em 0 1em;
  color: #fff;
  background-color: var(--primary-color);
}
.article_content h3 {
  font-size: 1.8rem;
  font-weight: 800;
  color: #EB9845;
  margin: 1em 0 0.5em;
  text-decoration: underline;
}
.article_content p {
  margin-bottom: 1em;
}
.article_content ul, .article_content ol {
  margin-bottom: 1em;
}
.article_content ul li, .article_content ol li {
  margin-bottom: 0.25em;
  list-style-type: disc;
  list-style-position: inside;
}
.article_content ul li li, .article_content ol li li {
  list-style-type: circle;
}
.article_content a {
  color: var(--primary-color);
  text-decoration: underline;
}
.article_content a:hover {
  color: #EB9845;
}
.article_content img {
  max-width: 100%;
  height: auto;
}
.article_content figcaption {
  font-size: 1.2rem;
  color: #999;
}
.article_content blockquote {
  position: relative;
  font-style: italic;
  line-height: 1.5;
  padding: 2.5em 1.5em;
  background-color: #f0f0f0;
}
.article_content blockquote cite {
  font-size: 0.8em;
}
.article_content blockquote::before, .article_content blockquote::after {
  position: absolute;
  font-family: "LINE AWESOME SOLID";
}
.article_content blockquote::before {
  top: 0.8em;
  left: 1em;
  content: "\f10d";
}
.article_content blockquote::after {
  bottom: 0.8em;
  right: 1em;
  content: "\f10e";
}
.article_content .wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
  display: block;
  position: static;
  background: unset;
  flex-basis: auto;
  flex-grow: unset;
  font-size: 1.2rem;
  font-weight: 400;
  color: #777;
  text-shadow: none;
  padding: 0.5em;
}
.article_content .wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption):before {
  backdrop-filter: none;
}
.article_content figure.wp-block-gallery.has-nested-images {
  align-items: flex-start;
}

.article_editor_comment {
  width: 100%;
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1.6;
  color: #333;
  padding: 20px 30px;
  margin-top: 40px;
  border-radius: 5px;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
  background-color: #fff;
}
.article_editor_comment__header {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 20px;
}
.article_editor_comment__icon {
  width: 40px;
  margin-right: 12px;
}
.article_editor_comment__title {
  display: block;
  width: fit-content;
  font-size: 2.4rem;
  line-height: 1;
  font-weight: 800;
  color: var(--primary-color);
  margin-top: 7px;
}
.article_editor_comment p {
  margin-bottom: 1em;
}
.article_editor_comment ul, .article_editor_comment ol {
  margin-bottom: 1em;
}
.article_editor_comment ul li, .article_editor_comment ol li {
  margin-bottom: 0.25em;
  list-style-type: disc;
  list-style-position: inside;
}
.article_editor_comment ul li li, .article_editor_comment ol li li {
  list-style-type: circle;
}
.article_editor_comment a {
  color: var(--primary-color);
  text-decoration: underline;
}
.article_editor_comment a:hover {
  color: #EB9845;
}
.article_editor_comment img {
  max-width: 100%;
  height: auto;
}
.article_editor_comment figcaption {
  font-size: 1.2rem;
  color: #999;
}
.article_editor_comment .wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
  display: block;
  position: static;
  background: unset;
  flex-basis: auto;
  flex-grow: unset;
  font-size: 1.2rem;
  font-weight: 400;
  color: #777;
  text-shadow: none;
  padding: 0.5em;
}
.article_editor_comment .wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption):before {
  backdrop-filter: none;
}
.article_editor_comment figure.wp-block-gallery.has-nested-images {
  align-items: flex-start;
}

.article_link {
  width: 80%;
  margin: 50px auto 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;
}
.article_link__dl {
  width: 48%;
}
.article_link__dt {
  font-size: 1.3rem;
  text-align: center;
}
.article_link__dt--next {
  color: var(--primary-color);
}
.article_link__dt--prev {
  color: #EB9845;
}
.article_link__dd {
  margin-top: 10px;
}
.article_link__link {
  display: block;
  text-decoration: none;
  background-color: #fff;
  transition-duration: 0.3s;
}
.article_link__link--next {
  color: var(--primary-color);
}
.article_link__link--prev {
  color: #EB9845;
}
.article_link__link:focus, .article_link__link:hover {
  transform: scale(1.4);
}
.article_link__thumb {
  width: 100%;
  height: auto;
  aspect-ratio: 2/1;
  object-fit: cover;
  border-radius: 4px;
  border: 2px solid;
}
.article_link__thumb--next {
  border-color: var(--primary-color);
}
.article_link__thumb--prev {
  border-color: #EB9845;
}
.article_link__title {
  font-size: 1.3rem;
  line-height: 1.5;
  margin-top: 5px;
  padding: 5px;
}

.article_comment {
  width: 100%;
  margin-top: 60px;
  font-size: 1.5rem;
  line-height: 1.6;
}
.article_comment .logged-in-as,
.article_comment .required {
  display: none;
}
.article_comment h2 {
  font-size: 2.4rem;
  font-weight: 800;
}
.article_comment h3 {
  font-size: 2rem;
  font-weight: 800;
  margin-top: 1em;
}
.article_comment label {
  display: block;
  width: fit-content;
  font-size: 1.5rem;
  margin-top: 0.5em;
  margin-bottom: 0.25em;
}
.article_comment #author {
  width: 100%;
  max-width: 250px;
  font-size: 1.5rem;
  padding: 0.4em 0.8em;
  border: 1px solid #d6d6d6;
  border-radius: 4px;
  transition-duration: 0.3s;
}
.article_comment #author:focus {
  border-color: var(--primary-color);
}
.article_comment textarea {
  width: 100%;
  height: 150px;
  font-size: 1.5rem;
  line-height: 1.5;
  padding: 0.4em 0.8em;
  border: 1px solid #d6d6d6;
  border-radius: 4px;
  resize: vertical;
  transition-duration: 0.3s;
}
.article_comment textarea:focus {
  border-color: var(--primary-color);
}
.article_comment .submit {
  font-size: 1.5rem;
  color: #fff;
  background-color: var(--primary-color);
  padding: 0.5em 1em;
  border-radius: 4px;
  cursor: pointer;
  margin-top: 0.5em;
  transition-duration: 0.3s;
}
.article_comment .submit:hover, .article_comment .submit:focus {
  background-color: #EB9845;
}

.article_comment_list {
  font-size: 1.4rem;
  margin-top: 15px;
}
.article_comment_list .comment {
  padding: 15px;
  border: 1px solid #d6d6d6;
}
.article_comment_list .comment:not(:last-of-type) {
  margin-bottom: 15px;
}
.article_comment_list .comment-meta {
  font-size: 1.2rem;
  color: #666;
}
.article_comment_list a {
  color: var(--primary-color);
}

@media screen and (max-width: 600px) {
  .page_title {
    font-size: 2rem;
  }
  .article_content {
    font-size: 1.4rem;
  }
  .article_content h2 {
    font-size: 1.8rem;
  }
  .article_content h3 {
    font-size: 1.6rem;
  }
  .article_content figure.wp-block-gallery.has-nested-images {
    flex-direction: column;
  }
  .article_content figure.wp-block-gallery.has-nested-images .wp-block-image {
    width: 100% !important;
  }
  .article_editor_comment {
    padding: 20px;
  }
  .article_editor_comment__icon {
    width: 30px;
  }
  .article_editor_comment__title {
    font-size: 2rem;
  }
  .article_link {
    width: 100%;
  }
  .article_comment {
    font-size: 1.4rem;
  }
  .article_comment h2 {
    font-size: 2rem;
  }
  .article_comment h3 {
    font-size: 1.6rem;
  }
  .article_comment label {
    font-size: 1.4rem;
  }
  .article_comment #author {
    font-size: 1.4rem;
  }
  .article_comment textarea {
    font-size: 1.4rem;
  }
  .article_comment .submit {
    width: 100%;
  }
  .article_comment_list {
    font-size: 1.4rem;
    margin-top: 15px;
  }
  .article_comment_list .comment {
    padding: 15px;
    border: 1px solid #d6d6d6;
  }
  .article_comment_list .comment:not(:last-of-type) {
    margin-bottom: 15px;
  }
  .article_comment_list .comment-meta {
    font-size: 1.2rem;
    color: #666;
  }
  .article_comment_list a {
    color: var(--primary-color);
  }
}

/*# sourceMappingURL=article_detail.css.map */
