@charset "utf-8";

/* INFO
----------------------------------------*/
.info__front{ margin: 40px auto; }
.info__list{ overflow: hidden; letter-spacing: -.4em; margin: 0 0 60px 0; }
.info__list li{ width: 30%; display: inline-block; margin: 0 5% 30px 0; letter-spacing: normal; font-size: 107%; position: relative;}
.info__list li:nth-child(3n){ margin: 0 0 30px 0;}
.info__list__date{ text-align: right; padding: 10px 0;}
.info__list__til{ text-align: left; font-size: 107%; padding: 0; margin: 0;}

.info__catebox__cate01{ font-size: 107%; position: absolute; z-index: 3; top:15px; left: 0; padding: 2px 20px; text-align: center; color: #fff; background: #000;}
.info__catebox__cate02{ font-size: 107%; position: absolute; z-index: 3; top:15px; left: 0; padding: 2px 20px; text-align: center; color: #fff; background: #00a73c;}
.info__catebox__cate03{ font-size: 107%; position: absolute; z-index: 3; top:15px; left: 0; padding: 2px 20px; text-align: center; color: #fff; background: #f39800;}


/* Pagenation
----------------------------------------*/
.pagenation {    margin: 50px 0 1em 0;    position: relative; }
.pagenation:after, .pagenation ul:after {    clear: both;    content: ".";    display: block;    height: 0;    visibility: hidden;}
.pagenation ul {    display: flex;    flex-wrap: wrap; justify-items: center; justify-content: center;   margin: 0;    text-align: center; }
.pagenation li {    display: inline-block;    list-style: none outside none;    margin-left: 3px; }
.pagenation li:first-child {    margin-left: 0; }
.pagenation li.active {
    background-color: #222;
    border-radius: 0px;
    border: 2px solid #222;
    color: #FFFFFF;
    cursor: not-allowed;
    padding: 10px 18px;
}
.pagenation li a {
    background: none repeat scroll 0 0 #fff;
    border-radius: 0px;
    border: 2px solid #222;
    color: #222;
    display: block;
    padding: 10px 18px;
    text-decoration: none;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
}
.pagenation li a:hover {
    background-color: #ccc;
    color: #222;
    opacity: 0.8;
    transition-duration: 500ms;
    transition-property: all;
    transition-timing-function: ease;
}
.prev{ border: none; position: absolute; left: 0; top: 0;}
.pagenation .prev a{ border: none; padding-left: 40px; background: url(../../../images/info/index/prev.png) no-repeat left center;}
.pagenation .prev a:hover{ border: none; background: url(../../../images/info/index/prev.png) no-repeat left center;}
.next{ border: none; position: absolute; right: 0; top: 0; }
.pagenation .next a{ border: none; padding-right: 40px; background: url(../../../images/info/index/next.png) no-repeat right center;}
.pagenation .next a:hover{ border: none; background: url(../../../images/info/index/next.png) no-repeat right center;}

/* スマートフォン（ディスプレイ幅599px以下）より小さい画面 */
@media screen and (max-width: 599px) {
    .info__list li{ width:45.5%; margin: 0 2% 30px 2%;}
    .info__list li:nth-child(3n){ margin: 0 2% 30px 2%;}

    .pagenation li.prev, .pagenation li.next{ display:none;}
}