@charset "Shift_JIS";

/* •\Ž† */
body { max-width: 680px;}

.rank_box {width: 100%;box-sizing: border-box;justify-content: unset;}
.rank_box dl {width: 31%;margin: 1%;padding: 0;}
.rank_box._top dl {width: 46%;margin: 2%;padding: 0;}
#Arrange{padding-top:60px;margin-top:-60px;}
#rank .rank_box.pickup_list{padding: 4% 4% 0;}

/* ranking
------------------------------ */
.area_rank{margin: 8% 0 6%;position:relative;}
.rank_box dl dt {font-size: 36px;color: #fff;line-height: 42px;text-align: center;position: absolute;width: 28px;height: 28px;background: #cdcdcd;border-radius: 50%;text-align: center;top: 2px;left: 2px;z-index: 1;}
.rank_box dl dt span{font-family: "Times New Roman";line-height: 1;font-size: 26px;position: absolute;/* line-height: 36px; */top: 50%;left: 50%;transform: translate(-50%, -50%);color: #3c3c3c;}
.rank_box dl dd.item_img {font-size: 13px;color: #333;}
section#ranking {clear:both;overflow:hidden;}
.rank_box {display: block;width: 97%;overflow-x: auto;white-space: nowrap;overflow-scrolling: touch;-webkit-overflow-scrolling: touch;margin: 6% 0 6% 3%;}
.rank_box dl {width: 155px;margin: 0 1% 1em;display: inline-block;vertical-align: top;position:relative;}
.rank_box dl dd.item_name {font-weight: bold;color: #333333;padding-top: 5px;white-space: break-spaces;font-size: min(4vw, 14px);line-height: 1.2;display: -webkit-box!important;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}
.rank_box dl dd.price {color: #333333;margin-top: 4%;white-space: break-spaces;overflow: hidden;}
.rank_box dl dt._gold {background: #b09669;}
.rank_box dl dt._gold span{color:#401f1f;}
.rank_box dl dt._silver {background: #9f9a93;}
.rank_box dl dt._silver span{color:#401f1f;}
.rank_box dl dt._bronze {background: #8d5e0d;}
.rank_box dl dt._bronze span{color:#401f1f;}
.rank_box dl dd div {font-size: 16px;color: #401f1f;line-height: unset;text-align: left;position: static;width: unset;height: unset;background: none;border-radius: unset;z-index: 1;margin-bottom: 0;top:0;left:0;}
.rank_box dl dd div span{font-family: 'Noto Serif JP', serif;display: block;font-size: 16px;}
.rank_box dl dd div._gold {background:none;position:relative;padding-left:1.45em;}
.rank_box dl div._gold::before {content: '';background: url(//img.e87.com/img/icon/icon_rank_no1.gif) no-repeat;width: 20px;height: 18px;background-size: 100%;position: absolute;left: 0;top: 0px;}
.rank_box dl dd div._gold span{color:#401f1f;}
.rank_box dl dd div._silver {background:none;position:relative;padding-left:1.45em;}
.rank_box dl div._silver::before {content: '';background: url(//img.e87.com/img/icon/icon_rank_no2.gif) no-repeat;width: 20px;height: 18px;background-size: 100%;position: absolute;left: 0;top: 0px;}
.rank_box dl dd div._silver span{color:#401f1f;}
.rank_box dl dd div._bronze {background:none;position:relative;padding-left:1.45em;}
.rank_box dl div._bronze::before {content: '';background: url(//img.e87.com/img/icon/icon_rank_no3.gif) no-repeat;width: 20px;height: 18px;background-size: 100%;position: absolute;left: 0;top: 0px;}
.rank_box dl dd div._bronze span{color:#401f1f;}
.rank_box_other dl dd div span {font-family: 'Noto Serif JP', serif;display: block;font-size: 16px;}

/* other  */
.rank_box_other{display:flex;flex-wrap:wrap;padding: 0 3%;margin: 1em 0;}
.rank_box_other dl{width: 32%;margin-right: 2%;position:relative;}
.rank_box_other dl:last-child{margin-right:0;}
.rank_box_other .item_name{font-size:90%;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;margin: 8% 0 4%;}
.rank_box {margin: 6% 0 6% 3%;}
.rank_box_other .price{font-size:12px;}
.styles .rank_box{margin: 0% 0 6% 3%;}
.styles .area_rank{margin: 0% 0 6%;}
.sub_mainttl p.heading_catch {color: #A47864;}
.sub_mainttl div.sub_mainttl_wrap h1 {color: #A47864;}
