@charset "UTF-8";
/* Scss Document */
/* ------------------------------------------------------------------
/////////////////////////////////////////////////////////////////////
カテゴリ付記事ストック
/////////////////////////////////////////////////////////////////////
------------------------------------------------------------------ */
/* 一覧 */
.cnts {
  width: 100%;
  margin: 100px auto 0;
  padding: 70px calc((100% - 1060px)/2) 100px;
  background-color: #f7f6eb;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }
  .cnts__title {
    margin: 0 0 60px;
    font-size: 2rem;
    font-weight: normal;
    line-height: 1.0;
    letter-spacing: 0.2em; }
  .cnts__list {
    margin: 0;
    padding: 0;
    list-style: none; }
  .cnts__item {
    margin: 0 0 25px;
    padding: 0 0 25px;
    border-bottom: 1px solid #000; }
    .cnts__item:last-of-type {
      margin: 0; }
  .cnts__anchor {
    margin: 0;
    padding: 0;
    color: #000 !important;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
    position: relative;
    transition: 0.1s linear; }
    .cnts__anchor--date {
      width: 180px;
      margin: 0;
      padding: 0; }
    .cnts__anchor--txt {
      width: calc(100% - 180px);
      margin: 0;
      padding: 0; }
      .cnts__anchor--txt img {
        margin: 0 0 0 10px;
        -moz-transform: translateY(-3px);
        -webkit-transform: translateY(-3px);
        transform: translateY(-3px); }
    .cnts__anchor:hover {
      text-decoration: none;
      top: 1px;
      opacity: 0.7;
      filter: alpha(opacity=70);
      -ms-filter: alpha(opacity=70); }

@media (max-width: 1200px) {
  .cnts {
    margin: 100px 0 0;
    padding: 70px 40px 100px; } }
@media (max-width: 760px) {
  .cnts__anchor--date, .cnts__anchor--txt {
    width: 100%; } }
@media (max-width: 700px) {
  .cnts {
    margin: 0; } }
@media (max-width: 600px) {
  .cnts {
    padding: 70px 20px 100px; }
    .cnts__title {
      font-size: 1.5rem; } }
/* 詳細 */
.atcl {
  width: 100%;
  margin: 100px auto 0;
  padding: 70px calc((100% - 1060px)/2) 100px;
  background-color: #f7f6eb;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }
  .atcl__title {
    margin: 0 0 60px;
    font-size: 2rem;
    font-weight: normal; }
    .atcl__title--cate {
      padding: 3px 10px;
      color: #FFF;
      font-size: 14px;
      font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "Meiryo UI", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", Verdana, sans-serif;
      line-height: 1.0;
      background-color: #003c6d; }
    .atcl__title--txt {
      width: 100%;
      margin: 20px 0 0;
      display: block; }
  .atcl__btn {
    margin: 40px 0 0;
    text-align: center;
    font-size: 1rem; }
    .atcl__btn a {
      color: #000 !important;
      display: inline-block;
      position: relative;
      transition: 0.1s linear; }
      .atcl__btn a::after {
        content: '';
        width: 100%;
        height: 1px;
        position: absolute;
        bottom: -5px;
        left: 0;
        background-color: #000;
        transform: scaleX(0);
        transform-origin: center right;
        transition: transform 0.2s ease; }
      .atcl__btn a span {
        padding: 0 15px 0 0;
        background-image: url("../img/common/ar04.svg");
        background-position: right center;
        background-repeat: no-repeat;
        background-size: 10px; }
      .atcl__btn a:hover {
        text-decoration: none;
        top: 1px; }
        .atcl__btn a:hover::after {
          transform-origin: center left;
          -moz-transform: scaleX(1);
          -webkit-transform: scaleX(1);
          transform: scaleX(1); }

@media (max-width: 1160px) {
  .atcl {
    padding: 70px 40px 100px; } }
@media (max-width: 980px) {
  .atcl {
    margin: 100px 0 0; } }
@media (max-width: 700px) {
  .atcl {
    margin: 0; } }
@media (max-width: 600px) {
  .atcl {
    padding: 70px 20px 100px; }
    .atcl__title {
      font-size: 1.5rem; } }