/* title */
div.ranktop_title { width: 100%; height: 42px; margin-top: 30px; background:#FFF url(https://dimj76dz6kqyc.cloudfront.net/ranking_titleback.jpg) 100% 0% no-repeat; background-size: 430px; position: relative; }
div.ranktop_title::after { content: ''; width: 430px; height: 2px; background-color: #755; position: absolute; right: 0; bottom: 0; }
div.ranktop_title h2 { width: 100%; }
div.ranktop_title h2 img { display: inline; vertical-align: top; }
div.ranktop_title h2 img.emblem { width: 96px; position: absolute; left: 0; margin-top: -30px; z-index: 10; }
div.ranktop_title h2 img.title { width:  300px; margin: 6px 0 0 100px; }
div.ranktop_title span { color: #FFE; font-size: 11px; position: absolute; right: 10px; bottom: 6px; }
/* tab_item */
div.ranktop_tab { width: 100%; margin: 3px auto 20px auto; }
div.ranktop_tab input[name="tab_item"] { display: none; }
div.ranktop_tab label.tab_item { width: 200px; height: 42px; padding-top: 6px; font-size: 13px; font-weight: bold; text-shadow: 0 2px 0 #FFF; text-align: center; border-width: 1px 1px 0 1px; border-style: solid; border-radius: 3px 3px 0 0; display: block; float: left; }
div.ranktop_tab label.tab_item span { font-size: 10px; line-height: 11px; letter-spacing: 2px; display: block; }
div.ranktop_tab label.tab_mall { margin: 0 3px 0 40px; color: #A33; background-color: #ffe9b7; border-color: #A88; }
#mall:checked ~ label.tab_mall { height: 43px; margin-bottom: -1px; color: #444; background-color: #fffaef; border-color: #CAA; text-shadow: none; z-index: 10; }
div.ranktop_tab label.tab_girl { color: #af1d6c; background-color: #ffc3da; border-color: #aa6e88; }
#girl:checked ~ label.tab_girl { height: 44px; margin-bottom: -2px; color: #444; background-color: #fdeff3; border-color: #ad8d9b; text-shadow: none; z-index: 10; }
label.tab_item:hover { opacity: 0.7; }
#mall:checked ~ label.tab_mall:hover { opacity: 1; }
#girl:checked ~ label.tab_girl:hover { opacity: 1; }
/* tab_content */
div.tab_content { border-width: 1px;  border-style: solid; border-radius: 4px; display: none; clear: both; }
#mall:checked ~ #mall_content, #girl:checked ~ #girl_content { display: block; }
#mall:checked ~ #mall_content { background-color: #fffaef; border-color: #CAA; }
#girl:checked ~ #girl_content { background-color: #fdeff3;  border-color: #ad8d9b; }
div.tab_content div.check_btn a { width: 300px; margin: 20px auto 10px auto; font-size: 13px; font-weight: bold; line-height: 36px; text-align: center; background: #FFF; border-width: 1px; border-style: solid; display: block; clear: both; }
#mall_content div.check_btn a { color: #e3004b; border-color: #CAA; }
#mall_content div.check_btn a:hover { color: #FFF; background: #e3004b; border-color: #e3004b; }
#girl_content div.check_btn a { color: #E4A; border-color: #ad8d9b; }
#girl_content div.check_btn a:hover { color: #FFF; background: #E4A; border-color: #E4A; }
/* ranktop_list */
dl.ranktop_list { width: 49%; margin: 5px 0; padding-bottom: 5px; float: left; }
dl.ranktop_list:nth-child(2n+1) { margin-right: 2%; }
dl.ranktop_list dt { height: 26px; padding: 0 20px 0 10px; color: #FFF; font-size: 13px; font-weight: bold; line-height: 26px; text-align: center; box-sizing: border-box; display: inline-block; position: relative; }
dl.ranktop_list dt:after { width: 0; height: 0; content: ''; position: absolute; z-index: 1; }
dl.ranktop_list dd { margin: 0 6px 0 9px; }
dl.ranktop_list dd p.more a { width: 98%; margin-top: 5px; font-size: 13px; font-weight: bold; line-height: 28px; text-align: center; display: block; background-size: 8px; background-position: 98% 46%; background-repeat: no-repeat; }
dl.ranktop_list dd p.more a:hover { color: #FFF; background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_arr_white.svg); }
/* lanktop_list_mall */
dl.ranktop_list_mall { border-bottom: #e3004b dotted 1px; }
dl.ranktop_list_mall dt { background-color: #e3004b; }
dl.ranktop_list_mall dt:after { top: 0; right: 0; border-width: 13px 10px 13px 0; border-color: transparent #fffaef transparent transparent; border-style: solid; }
dl.ranktop_list_mall dd p.more a { color: #e3004b; background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_arr_red.svg); }
dl.ranktop_list_mall dd p.more a:hover { background-color: #e3004b; }
/* lanktop_list_girl */
dl.ranktop_list_girl { border-bottom: #E4A dotted 1px; }
dl.ranktop_list_girl dt { background-color: #E4A; }
dl.ranktop_list_girl dt:after { top: 0; right: 0; border-width: 13px 10px 13px 0; border-color: transparent #fdeff3 transparent transparent; border-style: solid; }
dl.ranktop_list_girl dd p.more a { color: #E4A; background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_arr_pink.svg); }
dl.ranktop_list_girl dd p.more a:hover { background-color: #E4A; }
/* ranktop_card */
ul.ranktop_card li a { margin-top: 5px; color: #333; font-size: 11px; display: table; }
ul.ranktop_card li a:hover { color: #e3004b; }
ul.ranktop_card li a img { width: 64px; border-width: 1px; border-style: solid; display: table-cell; vertical-align: middle; }
ul.ranktop_card li a:hover img { opacity: 0.7; }
ul.ranktop_card li a p { padding-left: 5px; display: table-cell; vertical-align: middle; }
ul.ranktop_card li a p span.rank { padding-left: 20px; font-size: 15px; font-weight: bold; font-family: Verdana, sans-serif; display: block; }
ul.ranktop_card li a p span.rank1 { background: url(https://dimj76dz6kqyc.cloudfront.net/ranking_ico_crown.svg) 0 20% no-repeat; background-size: 15px; }
ul.ranktop_card li a p span.rank2 { background: url(https://dimj76dz6kqyc.cloudfront.net/ranking_ico_crown_s.svg) 0 20% no-repeat; background-size: 15px; }
ul.ranktop_card li a p span.rank3 { background: url(https://dimj76dz6kqyc.cloudfront.net/ranking_ico_crown_c.svg) 0 20% no-repeat; background-size: 15px; }
ul.ranktop_card li a p span.rank img.status { width: 12px; border: none; display: inline; vertical-align: middle; }
ul.ranktop_card li a p span.shopname { font-size: 12px; font-weight: bold; display: block; }
