@charset "UTF-8";

/*------------------------------------------
  home.php
  ------------------------------------------*/
  .home-blog01 {
    padding: 10.5rem 0 11.5rem;
  }
  .home-blog01-inner {
    width: 100%;
    max-width: 135.5rem;
    /* padding: 0 8.0rem; */
    margin: 0 auto 12.0rem;
  }
  .home-blog01__tit {
    margin-bottom: 8.0rem;
  }
  .home-blog01-category-inner {
    /* margin: 11.0rem 0;
    display: flex;
    flex-wrap: wrap; */
  }

  .home-blog01-category-tit {
    font-size: 2.0rem;
    line-height: 1.6;
    font-family: "Noto Serif JP", serif;
    margin-right: 7.0rem;
    position: relative;
  }
  .home-blog01-category-tit:before {
    position: absolute;
    top: 11.0rem;
    left: 0;
    margin: auto;
    content: "";
    display: block;
    width: 6.0rem;
    height: .1rem;
    background: #232946;
  }
  .home-blog01-category-tit-en {font-size: 3.2rem;display: block;}

  .home-blog01-categories {
    margin: 6rem 0 6rem;
  }

  .home-blog01-categoriy-list {
    display: inline-block;
    margin: 0 0.5rem;
  }

  .home-blog01-categoriy-list a {
    display: block;
    background-color: #ffdc2e;
    border-radius: 1rem;
    font-size: 2rem;
    font-weight: 700;
    line-height: 2.25;
    padding: 0 1.6rem;
  }

  .home-blog01-archive {
    display: flex;
    flex-wrap: wrap;
  }
  .home-blog01-archive__item a {
    display: block;
  }
  .home-blog01-archive__item-imgBox {
    margin: 0 auto 1.7rem;
    height: 11vw;
    max-height: 18.0rem;
  }
  .home-blog01-archive__item-imgBox img{
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
  }
  .home-blog01-archive__item__tit {
    margin-bottom: 1.2rem;
    line-height: 1.6;
    font-weight: bold;
    font-size: 1.6rem;
  }
  .home-blog01-archive__item-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 1.3rem;
  }
  .home-blog01-archive__item__date {
    margin-right: 1.0rem;
    color: #999;
    font-weight: bold;
    font-size: 1.4rem;
  }
  .home-blog01-archive__item__tag {
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.4;
    padding: .2rem 1.2rem;
    font-size: 1.4rem;
    text-align: center;
    border: .1rem solid #ccc;
  }
  .home-blog01-archive__item__more {
    display: table;
    padding: 0 3.0rem 0 0;
    background: url("../img/common/ico_arrow02.png") no-repeat right .5rem center;
    background-size: 2.0rem;
    font-weight: bold;
    font-size: 1.4rem;
    transition: all 0.3s ease-in-out;
  }
  .home-blog01-btn {
    margin-top: 2.5rem;
  }

  .m-pagenation__body {
    display: flex;
    flex-wrap: wrap;
  }
  
  .m-pagenation {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 10rem;
  }

  .m-pagenation__body li {
    font-size: 1.8rem;
    font-weight: 700;
    color: #1f9f60;
    margin: 0 1.0rem;
    width: 4.0rem;
    height: 4.0rem;
    display: flex;
    align-items: center;
    justify-content: center;
  }
.m-pagenation__body li a{
  border-bottom: .2rem solid;
}
  .m-pagenation__prev,.m-pagenation__nex {
    margin: 0 2.0rem;
  }

  .m-pagenation__body li.-current {
    background: #1f9f60;
    border-radius: 50%;
    font-size: 2.0rem;
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    color: #fff;
  }
  .m-pagenation__next,
  .m-pagenation__prev {
    margin: 0 2.0rem;
    width: 2.5rem;
    height: 2.5rem;
    line-height: 1;
    color: transparent;
    position: relative;
  }
  .m-pagenation__next a,
  .m-pagenation__prev a{
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
  }
  .m-pagenation__next a::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: #1f9f60;
    border-radius: 50%;
    pointer-events: none;
  }

  .m-pagenation__next a::after {
    content: "";
    position: absolute;
    border-top: .2rem solid #fff;
    border-right: .2rem solid #fff;
    width: .5rem;
    height: .5rem;
    transform: rotate(45deg);
    right: .1rem;
    left: 1rem;
    top: 0;
    bottom: 0;
    margin: auto;
    pointer-events: none;
  }

  .m-pagenation__prev a::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: #1f9f60;
    border-radius: 50%;
  }

  .m-pagenation__prev a::after {
    content: "";
    position: absolute;
    border-top: .2rem solid #fff;
    border-left: .2rem solid #fff;
    width: .5rem;
    height: .5rem;
    transform: rotate(-45deg);
    right: -1rem;
    left: .3rem;
    top: 0;
    bottom: 0;
    margin: auto
  }
  @media screen and (min-width: 768px) {
    .home-blog01-archive__item {
      width: 23.5%;
      margin-right: 2%;
      margin-bottom: 5.0rem;
    }
    .home-blog01-archive__item:nth-of-type(4n) {
      margin-right: 0;
    }
    .home-blog01-archive__item a:hover .home-blog01-archive__item__more {
      background-position: right center;
    }
  }
  @media screen and (max-width: 767px) {
    .home-blog01 {
      padding: 7.0rem 0 7.5rem;
    }
    .home-blog01-inner {
      /* padding: 0 3.0rem; */
    }
    .home-blog01__tit {
      margin-bottom: 4.5rem;
    }
    .home-blog01-category-tit{
      margin-bottom: 4.5rem;
    }
    .home-blog01-categoriy-list{
      margin-right: 1.2rem;
    }
    .home-blog01-archive {
      display: block;
      padding: 0 3.0rem;
    }
    .home-blog01-archive__item {
      margin: 0 auto 2.5rem;
    }
    .home-blog01-archive__item:last-of-type {
      margin-bottom: 0;
    }
    .home-blog01-archive__item-imgBox {
      margin-bottom: 1.0rem;
      height: auto;
      max-height: initial;
    }
    .home-blog01-archive__item__tit {
      font-size: 1.4rem;
    }
    .home-blog01-archive__item-meta {
      margin-bottom: .7rem;
    }
    .home-blog01-archive__item__date {
      margin-right: 1.2rem;
      font-size: 1.2rem;
    }
    .home-blog01-archive__item__tag {
      padding: .3rem .8rem;
      font-size: 1.2rem;
    }
    .home-blog01-archive__item__more {
      padding-right: 3.2rem;
      background-size: 1.0rem;
      font-size: 1.2rem;
    }
    .home-blog01-btn {
      margin-top: 4.0rem;
    }
  }