/* ===============================================================================
Article
=============================================================================== */
/* article-section
========================= */
/* article-secs */
.article-secs {
  padding: 56px 0 120px;
}
.article-secs__grp {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.article-secs > .txt {
  text-align: center;
  margin-bottom: 80px;
}
.article-secs > .pager {
  margin-top: 64px;
}
@media screen and (max-width: 768px) {
  .article-secs {
    padding: 48px 0 80px;
  }
  .article-secs__grp {
    display: block;
  }
  .article-secs > .txt {
    text-align: left;
    margin-bottom: 40px;
  }
  .article-secs > .pager {
    margin-top: 64px;
  }
}

/* article-sec-1 */
.article-sec-1 {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.article-sec-1 .blks-1 .heading {
  margin-bottom: 24px;
}
@media screen and (max-width: 768px) {
  .article-sec-1 {
    margin-bottom: 40px;
  }
}

/* article-sec-2 */
.article-sec-2 {
  width: 320px;
  margin-left: 40px;
}
.article-sec-2 .grp + .grp {
  margin-top: 40px;
}
.article-sec-2 .grp__ttl {
  margin-bottom: 24px;
}
.article-sec-2 .bnr {
  display: block;
}
@media screen and (min-width: 769px) {
  .article-sec-2 .bnr:hover {
    opacity: 0.8;
  }
}
.article-sec-2 .bnr img {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .article-sec-2 {
    width: auto;
    margin: 0;
  }
}

/* article-sec-3 */
.article-sec-3 {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.article-sec-3 .blks-1 .article {
  border: solid 1px #ccc;
  padding: 40px 40px 64px;
}
.article-sec-3 .blks-1 .heading {
  font-size: 1.75rem;
  color: #1657A7;
  font-weight: 700;
  margin-bottom: 24px;
}
.article-sec-3 .blks-1 .eyecatch {
  margin-bottom: 40px;
}
.article-sec-3 .blks-1 .grp {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-bottom: 16px;
}
.article-sec-3 .blks-1 .grp__cat a {
  display: block;
  background: #1657A7;
  color: #fff;
  font-size: 0.875rem;
  padding: 4px 16px;
  min-width: 80px;
  text-align: center;
}
@media screen and (min-width: 769px) {
  .article-sec-3 .blks-1 .grp__cat a:hover {
    opacity: 0.8;
  }
}
.article-sec-3 .blks-1 .grp__date {
  color: #999;
  font-size: 0.9375rem;
}
.article-sec-3 .blks-1 .edit {
  margin: 40px 0;
}
.article-sec-3 .blks-1 .btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 768px) {
  .article-sec-3 {
    margin-top: -24px;
  }
  .article-sec-3 .blks-1 {
    margin-bottom: 40px;
  }
  .article-sec-3 .blks-1 .article {
    padding: 24px 16px 44px;
    margin: 0 -16px;
  }
  .article-sec-3 .blks-1 .heading {
    font-size: 1.375rem;
  }
  .article-sec-3 .blks-1 .grp__date {
    font-size: 0.875rem;
  }
  .article-sec-3 .blks-1 .edit {
    margin: 36px 0;
  }
  .article-sec-3 .blks-1 .btn {
    display: block;
  }
}