a .ranking_box,a:hover .ranking_box,a:link .ranking_box,a:visited .ranking_box{color: #333333;}

a:hover .ranking_box{opacity: 0.5;}

ul.ranking_top3 {
    margin-top: 10px;
    display: flex;
    justify-content: space-between;
}

.ranking_top3 li{display: inline-block;}

.ranking_box{margin-bottom: 0;}

.ranking_box{
position: relative;
width: 205px;
height: 268px;
border: 1px solid #d0d0d0;
font-family: 'YuGothic','Yu Gothic','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', 'Meiryo','ＭＳ ゴシック',sans-serif;
}

.ranking_box_main1,.ranking_box_main2,.ranking_box_main3{
height:237px;
border: 1px solid #fff;
position: relative;
overflow:hidden;
}

.ranking_box_main1{background: linear-gradient(to bottom, rgb(254,251,224) 0%,rgb(255,255,255) 100%);}
.ranking_box_main2{background: linear-gradient(to bottom, rgb(231,245,255) 1%,rgb(255,255,255) 100%);}
.ranking_box_main3{background: linear-gradient(to bottom, rgb(253,234,218) 1%,rgb(255,255,255) 100%);}

.rank_ribbon{
position: absolute;
width: 70px;
left:5px;
top:-2px;
}

.product_img,.product_img2,.product_img3,.product_img4{
position: absolute;
width: 95%;
}

.product_img{
right: -93px;
top: -43px;
}

.product_img2{
left: 8px;
top: 71px;
}

.product_img3 {
    left: 16px;
    top: 84px;
}

.product_img4 {
    left: 16px;
    top: 100px;
}

.product_name,.product_copy,.product_name2,.product_copy2{
position: absolute;
text-shadow:3px 3px 3px #ffffff;
left:10px;
line-height: 3px;
}

.product_name,.product_name2{
font-weight: bold;
top: 105px;
font-size: 23px;
line-height: 0.95em;
}

.product_copy,.product_copy2{
top: 150px;
font-size: 17px;
font-weight: bold;
line-height: 1.2em;
}

.product_name2{
top: 10px;
left: 82px;
font-size: 23px;
line-height: 0.95em;
}

.product_copy2{
top: 35px;
left: 80px;
font-size: 14px;
font-weight: bold;
line-height: 1.2em;
letter-spacing: -1px;
}

.price_box1{
width: 203px;
text-align: left;
position: absolute;
bottom: 0;
border: 1px solid #fff;
background: #ededed;
background-size: 26px;
}

.border01,.border02,.border03{
width: 100%;
padding-bottom: 2px;
}

.border01{border-top: 5px solid #d0b03d;}
.border02{border-top: 5px solid #a4afba;}
.border03{border-top: 5px solid #aa9986;}

p.price_margin {
    margin: 0;
    text-align: center;
}
.price_text01,.price_text02,.price_text03,.price_text04,.price_text05{font-weight: bold;}
.price_text02{color:#6e0000;}
.price_text03{color:#6e0000;font-size: 17px;}
.price_text04{
color:#cc0000;
font-size: 35px;
text-shadow:0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff;
}
.price_text05{
color:#cc0000;
line-height: 0.5;
text-shadow:0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff;
}

[data-ruby] {position: relative;}

[data-ruby]::before {
content: attr(data-ruby);
position: absolute;
display: flex;
top: -6px;
left: -52px;
right: 0;
margin: auto;
font-size: 13px;
}

.br::before {
content: "\A" ;
white-space: pre ;
}