@charset "utf-8";
/* CSS Document */
@import url("gallist.css");


/*RANKING*/
#ranking h2{
}
#ranking h2 {
    margin-bottom: 0px;
}
#ranking em.subtitle{
padding:4px;
text-align:left;
font-weight:bold;
font-style:normal;
font-size:16px;
display:block;
margin:10px 0px;
}
#ranking .listTypeJ ul li {
    width: calc(100%/5 - 7px);
}
#ranking ul#ranking li h3 {
    z-index: 1;
    position: relative;
}
.listTypeJ ul li .bottomBox p {
    position: relative;
    z-index: 1;
}
.bottomBox em {
    position: absolute;
    bottom: 6px;
    right: 4px;
    font-size: 45px;
    opacity: .5;
    color: rgba(0,0,0,.2);
    z-index: 0;
}
#ranking .listTypeJ ul li:nth-child(n+4) .bottomBox em {
display:none;
}

#ranking .listTypeJ ul#ranking li.rankbox1 .bottomBox em {
    color: rgba(224,222,181,.9);
}
#ranking .listTypeJ ul#ranking li.rankbox2 .bottomBox em {
    color: rgba(203,203,203,.9);
}
#ranking .listTypeJ ul#ranking li.rankbox3 .bottomBox em {
    color: rgba(187,168,146,.9);
}

#ranking .listTypeJ ul#ranking li .iconBox,
#ranking .listTypeJ ul#ranking li .bottomBox{

border:3px solid #cccccc;
box-sizing:border-box;

}
#ranking .listTypeJ ul#ranking li .bottomBox p,
#ranking .listTypeJ ul#ranking li .bottomBox h3{
color:#111111;
text-shadow:1px 1px 1px rgba(0,0,0,.1);

text-align:left;
}

@media screen and (max-width: 667px) {
#ranking .listTypeJ ul li {
 height: auto;
    width: calc(50% - 5px);
}

#ranking .listTypeJ ul li:nth-child(1){
width:98%;
width:calc(100% - 6px);
height:138vw;
}
#ranking .listTypeJ ul li:nth-child(2),
#ranking .listTypeJ ul li:nth-child(3){
}
#ranking .listTypeJ ul li:nth-child(n+4){
/*
width:30%;
width:calc(100% / 3 - 6px);
height:46vw;
*/
}
#ranking .listTypeJ ul#ranking li.rankbox1,
#ranking .listTypeJ ul#ranking li.rankbox1 span{
	height:auto !important;
}
#ranking .listTypeJ ul li:nth-child(n+4) > a > span {
 /*
    height: calc((100vw/3 - 34px) * 1.33);
	*/
}
span.iconNew, span.iconUp {
     line-height: 3;
}
}