.pager{
    /* For IE */
    -js-display: flex;
    display: flex;
    width: 50%;
    margin: 0px auto;
}
.pager a{
    display: flex;
    list-style-type: none;
    flex: 1;
    padding:10px;
    justify-content: center;
    align-items: center;
}
.pager .next,.pager .prev{
    display:none;
}
@media only screen and ( max-width: 630px ) {

    /* 全てのli要素を消す */
    .pager li {
	position: absolute;
	top: -9999px;
	left: -9999px;
    }

    /* 必要なli要素を消す */
    .pager li.active,
    .pager li:first-of-type,
    .pager li:last-of-type,
    .pager li:nth-of-type(2),
    .pager li:nth-last-of-type(2){
	position: static;
	top: initial;
	left: initial;
    }
}

.pager li {

    /* For IE */
    display: flex;
    justify-content: center;
    background-color: #fff;
    margin: 15px;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;
}

.pager a {
    /* For IE */
    flex: 1;
    height:44px;
    text-decoration:none;
    color: #545659;
}

/* Active 以外のhover */
.pager li:not([class*="active"]) a:hover {
    background-color: rgba(255,255,255,.2);
}

/* Activeのスタイル */
.pager li.active a {
    background-color: rgba(255,255,255,.65);
    color: #0061ff;
    font-weight: bold;
}