@charset "utf-8";

#blog {
  overflow: hidden;
  margin-bottom: 30px;
}

.main {
  width: 100%;
  padding: 0 10px;
  margin-bottom: 30px;
}

.side {
  width: 100%;
  padding: 0 10px;
}

.sideNav {
  margin-bottom: 15px;
}

.bnrArea li + li {
  margin-top: 8px;
}

.article_box a {
  text-decoration: underline;
}

.article_box h1 {
  font-size: 22px;
  line-height: 1.4em;
  background: #549654;
  color: #fff;
  padding: 7px 10px;
}

.article_header {
  width: 100%;
  overflow: hidden;
  padding: 10px 0;
  border-bottom: 1px dotted #288c28;
  margin-bottom: 15px;
}

.article_header > li {
  float: left;
  font-size: 13px;
  line-height: 1.6em;
}

.article_header > li + li {
  margin-left: 0.5em;
}

.article_header > li a {
  color: #333;
  text-decoration: none;
}

/* 投稿日時 */

.article_contents * + * {
  margin-top: 1em;
}

.article_contents * + br,
.article_contents * + img {
  margin-top: 0;
}

.article_contents {
  color: #3f332a;
}

.article_contents * {
  font-size: 14px;
  line-height: 1.6em;
  max-width: 100% !important;
}

.article_contents img {
  vertical-align: middle;
  max-width: 600px;
  max-height: 500px;
}

.article_contents h2 {
  font-size: 22px;
  border-bottom: 2px solid #c3c3c3;
  margin: 30px 0 20px 0;
}

.article_contents h3 {
  font-size: 20px;
  border-left: 5px #ababab solid;
  padding-left: 20px;
  margin: 40px 0 30px 0;
  padding-top: 3px;
}

.article_contents p {
  padding-bottom: 16px;
  line-height: 1.8em;
}

.article_contents .table-brown {
  border: 1px solid #7e6b5a;
}

.article_contents .table-brown tr:last-child td {
  border-bottom: none;
}
.article_contents .table-brown tr:last-child th {
  border-bottom: none;
}
.article_contents .table-brown th {
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
  background: #7e6b5a;
  color: #ffffff;
  border-bottom: #fff solid 1px;
  padding: 6px 10px 2px 10px;
}

.article_contents .table-brown td {
  padding: 6px 10px 2px 10px;
  border-bottom: #7e6b5a solid 1px;
}
.article_contents .table-brown td span.color-pink {
  color: #ff5c7f;
}

.article_contents .blog_cta {
  padding-top: 60px;
  padding-bottom: 15px;
  margin: 0 auto;
}

.article_contents .lg-only {
  display: none;
}

.article_contents .mb-only {
  display: block;
}

.article_contents .ctaTtl{
  font-size: 1.1rem;
  line-height: 1.6;
  text-align: center;
}

.article_contents .ctaBtn{
  aspect-ratio: 3 / 1;
  margin: 0 auto;
  height: auto;
  background-repeat: no-repeat;
  background-size: contain;
  border-radius: 4px;
  background-position: center;
  cursor: pointer;
}

.article_contents .ctaBtn:not(:last-child) {
  margin-bottom: 24px;
}

/* article-list */

#hanasougi_blog_list {
  overflow: hidden;
  margin-bottom: 60px;
}

.article-item {
  width: 100%;
}

.article-item > a {
  width: 100%;
  display: table;
  color: #333;
  text-decoration: none;
  padding: 15px 0;
  border-bottom: 1px dashed #ccc;
}

.article-item .article-item-img,
.article-item .article-item-txt {
  display: table-cell;
  vertical-align: top;
}

.article-item .article-item-img {
  width: 120px;
}

.article-item .article-item-img img {
  width: 100%;
}

.article-item .article-item-txt {
  padding-left: 15px;
}

.article-item .article-item-txt .article-date {
  font-size: 12px;
}

.article-item .article-item-txt time {
  display: inline-block;
  margin-bottom: 8px;
}

.article-item .article-item-txt h3 {
  font-size: 16px;
  line-height: 1.4em;
  font-weight: 700;
  margin-bottom: 5px;
}

.article-item .article-item-txt h3 {
  font-weight: 700;
  text-decoration: none;
  color: #333;
}

.article-list-ttl {
  font-size: 20px;
  background: #549654;
  padding: 7px 10px;
  margin-bottom: 15px;
  color: #fff;
  line-height: 1.6em;
}

.article-excerpt * {
  font-size: 14px;
  line-height: 1.4em;
}

/* ページ送り */

.article-item + .page-numbers {
  margin-top: 30px;
}

.page-numbers {
  width: 100%;
  font-size: 0;
}

.page-numbers > li {
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  font-size: 14px;
  color: #333;
  margin-right: 10px;
}

.page-numbers > li > a {
  font-size: 14px;
  display: block;
  text-align: center;
  text-decoration: none;
  width: 30px;
  height: 30px;
  line-height: 30px;
  vertical-align: middle;
  color: #333;
  background: #ddd;
  border: 1px solid #ccc;
}

.page-numbers > li > a.prev,
.page-numbers > li > a.next {
  display: none;
}

.page-numbers > li span.dots {
  font-size: 14px;
  display: block;
  width: auto;
  height: 30px;
  line-height: 30px;
}

.page-numbers > li span.current {
  display: block;
  font-size: 14px;
  background: #eee;
  border: 1px solid #ccc;
  width: 30px;
  height: 30px;
  line-height: 30px;
  font-weight: 700;
}

/* 前後のページへのリンク */

.article-page-nav {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin-top: 30px;
}

.article-page-nav a {
  color: #333;
}

.article-page-nav > li {
  display: table-cell;
  vertical-align: middle;
  font-size: 14px;
}

.article-page-nav > li.prev-link {
  text-align: left;
}

.article-page-nav > li.next-link {
  text-align: right;
}

/* サイドメニュー */

.tax-menu-list {
  width: 100%;
  margin-bottom: 10px;
}

.tax-menu-list a {
  color: #333;
}

.tax-menu-ttl {
  background: #ddd;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.6em;
  padding: 5px 0;
  text-align: center;
}

.tax-menu-list ul {
  border: 2px solid #ddd;
}

.tax-menu-list li {
  font-size: 14px;
}

.tax-menu-list ul li + li {
  border-top: 1px dotted #ddd;
}

.tax-menu-list li a {
  padding: 10px;
  display: block;
  line-height: 1.4em;
  text-decoration: none;
}

/* hanasaidan-link-list */

.hanasaidan-link-list {
  width: 100%;
  border: 1px solid #c5c0b7;
  margin: 30px 0;
  padding: 0 0 15px;
}

.hanasaidan-link-list h2 {
  font-size: 18px;
  margin-bottom: 15px;
  background: #c6daae;
  padding: 15px;
  text-align: center;
}

.hanasaidan-link-list dt {
  margin-bottom: 15px;
  text-align: center;
  padding: 0 10px;
}

.hanasaidan-link-list dd {
  display: block;
}

.hanasaidan-link-list dd a {
  padding: 15px;
  background-color: #dedede;
  font-size: 16px;
  text-align: center;
  text-decoration: none;
  display: block;
  width: 200px;
  color: #333;
  margin: 0 auto;
}

/* relation-article-list */

.relation-article-list {
  width: 100%;
  margin: 30px 0;
}

.relation-article-list h2 {
  font-size: 18px;
  margin-bottom: 15px;
  background: #c6daae;
  padding: 15px;
}