@charset "utf-8";
/* CSS Document */

.membersrank ul {
    width: 800px;
    margin:10px 30px 0 30px;
} 

@media (max-width: 767px) {
.membersrank ul {
    width:100%;
    margin:10px 0 0 0;
}
.membersrank ul li .rank {
    width:100%!important;
}
.membersrank ul li p {
    padding:10px 0 0 0!important;
}
}

.membersrank ul li {
margin-bottom: 10px;
text-align: center;
}

li.benefits {
margin-bottom: 10px;
}

.membersrank ul li .rank {
    width: 30%;
    color: #fff;
    padding: 10px 20px;
    line-height: 2;
}

.membersrank ul li.flex {
    display: flex;
    justify-content:flex-start!important;
    align-items: center;
}

@media (max-width: 767px) {
.membersrank ul li.flex {
    display:block;
}
}

.membersrank ul li p {
text-align: left;
padding-left: 20px;
margin: 0!important;
}

div.rank {
text-align: center;
}

.membersrank ul li:nth-of-type(1) .rank {
    background: #812c31;
    color: #fff; 
} 

.membersrank ul li:nth-of-type(2) .rank {
    background: #A7AEB7;
    color: #fff;
}

.membersrank ul li:nth-of-type(3) .rank {
    background: #d1c290;
    color: #fff;
}

.membersrank ul li:nth-of-type(4) .rank {
    background: #525151;
    color: #fff;
}

a.toPage  {
text-decoration: underline;
}