@charset "utf-8";
/* CSS Document */
.current {
            /*background-color: #f0f0f0;*/ /* Highlight color for the current row */
            display: none!important;
        }
        table tr.current:first-child { display: table-row;}
        
        #reset { display: none;}
        .search #reset { display: inline;}

table { color: #FFF; width: 100%;}
table tr { background-color: rgba(255,255,255,.05);}
table tr:nth-child(2n+1) { background-color: rgba(255,255,255,.1);}
table td,table th { padding: .5em;}
table th { font-weight: bold; border-bottom: 1px solid #FE00EE;}

@media screen and (min-width:701px){
#tableContainer table tr:nth-child(2) { color: #000;
    /* Permalink - use to edit and share this gradient. パーマリンク - このグラデーションの編集や共有に使用します: https://colorzilla.com/gradient-editor/#fcec72+0,ffef75+0,fbef77+1,fff07d+2,feef78+4,fff079+6,fff691+27,fff68f+30,fff795+33,fdf89a+33,fef8a2+38,fff8a7+39,fffcaf+44,fffaa9+45,fefab0+46,fcfcb2+47,fffbaa+48,fffbaa+48,feef92+49,fae78b+49,ffe380+50,ffe682+50,ffe47d+51,ffe380+52,fce07c+52,ffe07b+53,ffd56f+60,ffd66a+60,fed363+63,ffd05a+64,ffd05a+66,ffd054+66,fecc51+67,e3b337+83,deae32+85,dfaf33+86,d9a92d+88,d0a326+94,cfa129+97,cd9f27+99,c59f3a+100,b9932e+100 */
background: linear-gradient(to bottom,  rgba(252,236,114,1) 0%,rgba(255,239,117,1) 0%,rgba(251,239,119,1) 1%,rgba(255,240,125,1) 2%,rgba(254,239,120,1) 4%,rgba(255,240,121,1) 6%,rgba(255,246,145,1) 27%,rgba(255,246,143,1) 30%,rgba(255,247,149,1) 33%,rgba(253,248,154,1) 33%,rgba(254,248,162,1) 38%,rgba(255,248,167,1) 39%,rgba(255,252,175,1) 44%,rgba(255,250,169,1) 45%,rgba(254,250,176,1) 46%,rgba(252,252,178,1) 47%,rgba(255,251,170,1) 48%,rgba(255,251,170,1) 48%,rgba(254,239,146,1) 49%,rgba(250,231,139,1) 49%,rgba(255,227,128,1) 50%,rgba(255,230,130,1) 50%,rgba(255,228,125,1) 51%,rgba(255,227,128,1) 52%,rgba(252,224,124,1) 52%,rgba(255,224,123,1) 53%,rgba(255,213,111,1) 60%,rgba(255,214,106,1) 60%,rgba(254,211,99,1) 63%,rgba(255,208,90,1) 64%,rgba(255,208,90,1) 66%,rgba(255,208,84,1) 66%,rgba(254,204,81,1) 67%,rgba(227,179,55,1) 83%,rgba(222,174,50,1) 85%,rgba(223,175,51,1) 86%,rgba(217,169,45,1) 88%,rgba(208,163,38,1) 94%,rgba(207,161,41,1) 97%,rgba(205,159,39,1) 99%,rgba(197,159,58,1) 100%,rgba(185,147,46,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}

#tableContainer table tr:nth-child(3) {color: #000;
  /* Permalink - use to edit and share this gradient. パーマリンク - このグラデーションの編集や共有に使用します: https://colorzilla.com/gradient-editor/#dfdfdf+0,dcdcdc+0,e1e1e1+1,dddddd+1,e0e0e0+2,dedede+24,dfdfdf+46,dddddd+49,c3c3c3+50,bbbbbb+50,b9b9b9+51,bbbbbb+51,b9b9b9+52,bbbbbb+53,b9b9b9+53,bbbbbb+58,b7b7b7+69,b8b8b8+77,b4b4b4+89,b4b4b4+100 */
background: linear-gradient(to bottom,  rgba(223,223,223,1) 0%,rgba(220,220,220,1) 0%,rgba(225,225,225,1) 1%,rgba(221,221,221,1) 1%,rgba(224,224,224,1) 2%,rgba(222,222,222,1) 24%,rgba(223,223,223,1) 46%,rgba(221,221,221,1) 49%,rgba(195,195,195,1) 50%,rgba(187,187,187,1) 50%,rgba(185,185,185,1) 51%,rgba(187,187,187,1) 51%,rgba(185,185,185,1) 52%,rgba(187,187,187,1) 53%,rgba(185,185,185,1) 53%,rgba(187,187,187,1) 58%,rgba(183,183,183,1) 69%,rgba(184,184,184,1) 77%,rgba(180,180,180,1) 89%,rgba(180,180,180,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}

#tableContainer table tr:nth-child(4) {color: #000;
   /* Permalink - use to edit and share this gradient. パーマリンク - このグラデーションの編集や共有に使用します: https://colorzilla.com/gradient-editor/#f0bf93+0,f1c18e+3,f7c495+6,f8c694+10,f6c491+18,eebd8e+23,eebd8f+25,dbaf87+35,dbaf89+37,cfa681+44,cfa484+47,cfa47f+47,cda47e+49,cca281+49,c9a07f+50,c49a80+50,c39884+51,c49c82+54,d1a387+63,ebb791+77,f6bf96+86,f6bf96+94,eeba93+97,ebb893+100 */
background: linear-gradient(to bottom,  rgba(240,191,147,1) 0%,rgba(241,193,142,1) 3%,rgba(247,196,149,1) 6%,rgba(248,198,148,1) 10%,rgba(246,196,145,1) 18%,rgba(238,189,142,1) 23%,rgba(238,189,143,1) 25%,rgba(219,175,135,1) 35%,rgba(219,175,137,1) 37%,rgba(207,166,129,1) 44%,rgba(207,164,132,1) 47%,rgba(207,164,127,1) 47%,rgba(205,164,126,1) 49%,rgba(204,162,129,1) 49%,rgba(201,160,127,1) 50%,rgba(196,154,128,1) 50%,rgba(195,152,132,1) 51%,rgba(196,156,130,1) 54%,rgba(209,163,135,1) 63%,rgba(235,183,145,1) 77%,rgba(246,191,150,1) 86%,rgba(246,191,150,1) 94%,rgba(238,186,147,1) 97%,rgba(235,184,147,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}
}

#tableContainer table tr:nth-child(4) td,#tableContainer table tr:nth-child(3) td,#tableContainer table tr:nth-child(2) td {font-weight: bold!important;}
#tableContainer table tr td:first-child { text-align: center;}

nav#rank { color: #FFF; padding: 10px; position: relative;
position: sticky;
    top: 76px;
    width: 100%;
    z-index: 2;
    background: #000;
}
#inSearch { position: absolute; right: 10px; top:50%; transform: translateY(-50%);}
nav#rank input,nav#rank select { height: 37px; border: none; background: none; background-color: rgba(255,255,255,.2); border-radius: .3em; padding: 0 1em; color: #FFF; margin: 0 .5em;font-size: 76%;}
nav#rank select option { color: #000;}
nav#rank button { border: none; background: none; background-color: #FE00EE; border-radius: .3em; height: 37px; color:
#FFF; padding: 0 1em; cursor: pointer;}
#key { position: relative; display: inline-block;}
nav#rank button#reset { background-color: transparent; width: 37px; padding: 0; text-indent: -9999px; background-image: url("../img/close.png"); background-repeat: no-repeat; background-position: center; background-size: 12px; position: absolute; right:10px; top:50%; transform: translateY(-50%);}
nav#rank input { padding-right: 50px;}

#tableContainer { padding-top: 10px;}

@media screen and (max-width:700px){
    nav#rank input,nav#rank select { font-size: 100%; }
    #tableContainer table tr:nth-child(1) { display: none;}
    #tableContainer table tr td { width: 100%; display: block; border-bottom: 1px solid #666;}
    #tableContainer table tr { margin-bottom: 10px; border: 2px solid #FFF;display: block; border-radius: .2em; overflow: hidden; box-sizing: border-box;}
    #tableContainer table tr td:first-child { font-size: 160%; border-bottom: 1px solid #FFF; font-weight: bold;}
    
    #tableContainer table tr:nth-child(2) td:first-child { color: #000;
    /* Permalink - use to edit and share this gradient. パーマリンク - このグラデーションの編集や共有に使用します: https://colorzilla.com/gradient-editor/#fcec72+0,ffef75+0,fbef77+1,fff07d+2,feef78+4,fff079+6,fff691+27,fff68f+30,fff795+33,fdf89a+33,fef8a2+38,fff8a7+39,fffcaf+44,fffaa9+45,fefab0+46,fcfcb2+47,fffbaa+48,fffbaa+48,feef92+49,fae78b+49,ffe380+50,ffe682+50,ffe47d+51,ffe380+52,fce07c+52,ffe07b+53,ffd56f+60,ffd66a+60,fed363+63,ffd05a+64,ffd05a+66,ffd054+66,fecc51+67,e3b337+83,deae32+85,dfaf33+86,d9a92d+88,d0a326+94,cfa129+97,cd9f27+99,c59f3a+100,b9932e+100 */
background: linear-gradient(to bottom,  rgba(252,236,114,1) 0%,rgba(255,239,117,1) 0%,rgba(251,239,119,1) 1%,rgba(255,240,125,1) 2%,rgba(254,239,120,1) 4%,rgba(255,240,121,1) 6%,rgba(255,246,145,1) 27%,rgba(255,246,143,1) 30%,rgba(255,247,149,1) 33%,rgba(253,248,154,1) 33%,rgba(254,248,162,1) 38%,rgba(255,248,167,1) 39%,rgba(255,252,175,1) 44%,rgba(255,250,169,1) 45%,rgba(254,250,176,1) 46%,rgba(252,252,178,1) 47%,rgba(255,251,170,1) 48%,rgba(255,251,170,1) 48%,rgba(254,239,146,1) 49%,rgba(250,231,139,1) 49%,rgba(255,227,128,1) 50%,rgba(255,230,130,1) 50%,rgba(255,228,125,1) 51%,rgba(255,227,128,1) 52%,rgba(252,224,124,1) 52%,rgba(255,224,123,1) 53%,rgba(255,213,111,1) 60%,rgba(255,214,106,1) 60%,rgba(254,211,99,1) 63%,rgba(255,208,90,1) 64%,rgba(255,208,90,1) 66%,rgba(255,208,84,1) 66%,rgba(254,204,81,1) 67%,rgba(227,179,55,1) 83%,rgba(222,174,50,1) 85%,rgba(223,175,51,1) 86%,rgba(217,169,45,1) 88%,rgba(208,163,38,1) 94%,rgba(207,161,41,1) 97%,rgba(205,159,39,1) 99%,rgba(197,159,58,1) 100%,rgba(185,147,46,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}

#tableContainer table tr:nth-child(3) td:first-child {color: #000;
  /* Permalink - use to edit and share this gradient. パーマリンク - このグラデーションの編集や共有に使用します: https://colorzilla.com/gradient-editor/#dfdfdf+0,dcdcdc+0,e1e1e1+1,dddddd+1,e0e0e0+2,dedede+24,dfdfdf+46,dddddd+49,c3c3c3+50,bbbbbb+50,b9b9b9+51,bbbbbb+51,b9b9b9+52,bbbbbb+53,b9b9b9+53,bbbbbb+58,b7b7b7+69,b8b8b8+77,b4b4b4+89,b4b4b4+100 */
background: linear-gradient(to bottom,  rgba(223,223,223,1) 0%,rgba(220,220,220,1) 0%,rgba(225,225,225,1) 1%,rgba(221,221,221,1) 1%,rgba(224,224,224,1) 2%,rgba(222,222,222,1) 24%,rgba(223,223,223,1) 46%,rgba(221,221,221,1) 49%,rgba(195,195,195,1) 50%,rgba(187,187,187,1) 50%,rgba(185,185,185,1) 51%,rgba(187,187,187,1) 51%,rgba(185,185,185,1) 52%,rgba(187,187,187,1) 53%,rgba(185,185,185,1) 53%,rgba(187,187,187,1) 58%,rgba(183,183,183,1) 69%,rgba(184,184,184,1) 77%,rgba(180,180,180,1) 89%,rgba(180,180,180,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}

#tableContainer table tr:nth-child(4) td:first-child {color: #000;
   /* Permalink - use to edit and share this gradient. パーマリンク - このグラデーションの編集や共有に使用します: https://colorzilla.com/gradient-editor/#f0bf93+0,f1c18e+3,f7c495+6,f8c694+10,f6c491+18,eebd8e+23,eebd8f+25,dbaf87+35,dbaf89+37,cfa681+44,cfa484+47,cfa47f+47,cda47e+49,cca281+49,c9a07f+50,c49a80+50,c39884+51,c49c82+54,d1a387+63,ebb791+77,f6bf96+86,f6bf96+94,eeba93+97,ebb893+100 */
background: linear-gradient(to bottom,  rgba(240,191,147,1) 0%,rgba(241,193,142,1) 3%,rgba(247,196,149,1) 6%,rgba(248,198,148,1) 10%,rgba(246,196,145,1) 18%,rgba(238,189,142,1) 23%,rgba(238,189,143,1) 25%,rgba(219,175,135,1) 35%,rgba(219,175,137,1) 37%,rgba(207,166,129,1) 44%,rgba(207,164,132,1) 47%,rgba(207,164,127,1) 47%,rgba(205,164,126,1) 49%,rgba(204,162,129,1) 49%,rgba(201,160,127,1) 50%,rgba(196,154,128,1) 50%,rgba(195,152,132,1) 51%,rgba(196,156,130,1) 54%,rgba(209,163,135,1) 63%,rgba(235,183,145,1) 77%,rgba(246,191,150,1) 86%,rgba(246,191,150,1) 94%,rgba(238,186,147,1) 97%,rgba(235,184,147,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}
    #inSearch { padding-top: 1em;
    position:static;
    transform: translateY(0%);
}
    
    
    #rank span { display: block;}
    nav#rank #key,nav#rank select { margin-left: 0; width: calc( 100% - .8em - 60px ); box-sizing: border-box; }
    nav#rank button { width: 60px; box-sizing: border-box; margin: 0;}
    nav#rank #key input { width: 100%; box-sizing: border-box; margin-left: 0;}
    nav#rank #key { margin-right: .5em;}
}