.conditions span{display:block}

.one{}
.two{color: #ff2222;}
.three{color: #ff2222;}

.rank_detail .heading{
margin: 0;
}

.rank_detail {
margin: 0 auto;padding: 15px}
.rank_detail ul{}
.rank_detail li {
list-style: circle;
font-size: 1.3rem;
}
.rank_detail p{}
.rank_detail span{}

.rank_detail a{text-decoration: underline;}


.col {
font-size: 1.1em;
font-weight: 600;
text-align: center;
}

.rank-table {
border-collapse: collapse;
padding: 0;
width: 100%;
table-layout: fixed;
margin: 5% auto;
}

.rank-table tr {
background-color: #ebf1f3b8;
padding: .35em;
border-bottom: 2px solid #fff;
}
.rank-table th,
.rank-table td {
padding: 1em 10px 1em 1em;
border-right: 2px solid #fff;
text-align: center;
line-height: 1.5;
}
.rank-table th {
font-size: 1.1em;
}
.rank-table thead tr{
background-color: #2b2b2b;
color:#fff;
}
.rank-table tbody th {
background: #78bbc7;
color: #fff;
}
.rank-table.conditions{
text-align: left;
font-size: .85em;
}
.rank-table.rate{
text-align: right;
color: #167F92;
font-weight: bold;
}


.regular{ background: #75c178!important;}
.silver{background: #a9a9a9!important;}
.gold{background: #d3bb65!important;}


.regular:before, .silver:before, .gold:before {
content: '';
display: block;
width: 50px;
height: 50px;
background-size: contain;
vertical-align: middle;
text-align: center;
margin: 0 auto;
}

.regular:before {
background-image: url(https://marutaka-iryo.co.jp/client_info/MARUTAKA/landingpage_images/rank/icon_regular.png);
}
.silver:before {
background-image: url(https://marutaka-iryo.co.jp/client_info/MARUTAKA/landingpage_images/rank/icon_silver.png);
}
.gold:before {
background-image: url(https://marutaka-iryo.co.jp/client_info/MARUTAKA/landingpage_images/rank/icon_gold.png);
}


.rate {
text-align: center;
font-size: 3rem;
font-weight: 600!important;
font-family: "Roboto", "Hiragino Kaku Gothic ProN", "?????? ProN W3", "Meiryo", "????", sans-serif;
padding: 10px!important;
}

.reflection {

position: relative;
overflow: hidden;
background-color: #666;
}
.reflection::after {
content: "";
display: block;
width: 30px;
height: 100%;
position: absolute;
top: -180px;
left: 0;
background-color: #FFF;
opacity: 0;
transform: rotate(45deg);
animation: reflect 4s ease-in-out infinite;
-webkit-transform: rotate(45deg);
-webkit-animation: reflect 4s ease-in-out infinite;
}
@keyframes reflect {
0% { transform: scale(0) rotate(45deg); opacity: 0; }
80% { transform: scale(0) rotate(45deg); opacity: 0.5; }
81% { transform: scale(4) rotate(45deg); opacity: 1; }
100% { transform: scale(50) rotate(45deg); opacity: 0; }
}
@-webkit-keyframes reflect {
0% { transform: scale(0) rotate(45deg); opacity: 0; }
80% { transform: scale(0) rotate(45deg); opacity: 0.5; }
81% { transform: scale(4) rotate(45deg); opacity: 1; }
100% { transform: scale(50) rotate(45deg); opacity: 0; }
}

.rank_detail p {}
.silver p::before , .gold p::before  {
content: '';
display: inline-block;
width: 25px;
height: 25px;
background-image: url(https://dbcn1bdvswqbx.cloudfront.net/client_info/MARUTAKA/view/userweb/images/memberrank_icon2.svg);
background-size: contain;
vertical-align: middle;
margin-right: 3px;
}

.img-eq {
    display: block;
    margin-bottom: 5%;
}


@media screen and (max-width:960px) { 


.conditions span{display:inline-block!important}

table {
border: 0;
width:100%
}
table th{
background-color: #167F92;
display: block;
border-right: none;
}
table thead {
border: none;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
table tr {
display: block;
margin-bottom: 1.625em;
}
table td {
border-bottom: 1px solid #bbb;
display: block;
font-size: 1em;
text-align: right;
position: relative;
padding: .625em .625em .625em 4em;
border-right: none;
}

table td::before {
content: attr(data-label);
font-weight: bold;
font-size: 1.3rem;
margin-right: 12px;
display: inline-block;
width: 91px;
text-align: left;
}
table td:last-child {
border-bottom: 0;
}
table tbody th {
color: #fff;
}
.rank-table tr {
padding: 0;
border: none;
}
.rank-table th, .rank-table td {
border-right: 0px;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: left;
align-items: center;

}

.rank_detail li {
font-size: 1.3rem;
line-height: 1.5;
margin: 10px 0;
}
.rank_detail ul {
padding: 3% 7%;
}
.regular{ background: #75c178!important; display: block!important;}
.silver{background: #a9a9a9!important; display: block!important;}
.gold{background: #d3bb65!important; display: block!important;}
.rank_detail span {
display: block;
line-height: 1.5!important;
}
.rank_detail p {
display: inline-block;
line-height: 1.5!important;
padding: 0px;
margin-left: 5px;
vertical-align: middle;
}
.regular:before, .silver:before, .gold:before {
content: '';
display: inline-block;
width: 45px;
height: 45px;
}

.rank-table th, .rank-table td {
padding: 8px;
}
.rank_detail .heading{
margin: 0;
}

}