.blog-ranking-wrapper{display:flex}.blog-ranking-header-wrapper{background-color:#1e73be;color:#FFF;position:sticky;top:64px;z-index:98}.blog-ranking-header-wrapper ul{display:flex;flex-wrap:wrap;list-style:none;padding:0;margin:0;grid-column-gap:20px;justify-content:center;font-size:14px}.blog-ranking-header-wrapper ul li{cursor:pointer;height:100%;padding:5px 0}.blog-ranking-header-wrapper ul li a{text-decoration:none;color:inherit}.blog-ranking-header-wrapper ul li.break{display:none;flex-basis:100%;height:0;padding:0;margin:0}.blog-ranking-content-wrapper{flex:1;width:100%}.blog-ranking-genre-wrapper{background-color:#f6fafd;padding:5px 10px;margin-bottom:10px}.blog-ranking-genre-title{margin:0 0 5px 0;font-size:12px;color:#888}.blog-ranking-genre-div{display:flex;flex-wrap:wrap;list-style:none;padding:0;margin:0;grid-column-gap:10px;grid-row-gap:5px}.blog-ranking-genre-div li{cursor:pointer;height:100%}.blog-ranking-genre-div li a{text-decoration:none;color:#FFF;font-size:16px;padding:5px 10px;background-color:#888}.blog-ranking-genre-div li a.active{background-color:#1e73be}.blog-ranking-genre-div li a:hover{background-color:#1e73be}.blog-ranking-h2{font-size:18px;margin:0;border-bottom:1px solid #333}.blog-ranking-sort-div{display:flex;*/list-style:none;padding:0;margin:0 0 10px 0;grid-column-gap:1px;overflow-x:auto;-webkit-overflow-scrolling:touch}.blog-ranking-sort-div li{display:flex}.blog-ranking-sort-div li a{text-decoration:none;color:#FFF;font-size:12px;padding:3px;background-color:#888;text-align:center;width:120px}.blog-ranking-sort-div li a.active{background-color:#1e73be}.blog-ranking-sort-div li a:hover{background-color:#1e73be}.blog-side-wrapper{width:290px;margin-left:20px}.blog-side-wrapper h2.side-article-h2{font-size:18px;margin:0 0 10px 0;border-bottom:1px solid #333;color:#333;text-align:left;padding:0}.featured-wrapper{width:100%;background-color:#081f33;margin-top:10px}.featured-h2{color:#FFF;margin:0 0 10px 0;font-size:18px;border-bottom:solid 1px #FFF}.featured-content-wrapper{display:flex;flex-wrap:wrap;gap:5px}.featured-content{flex:1;max-width:33%}.featured-content .article-list-wrapper{gap:5px}.featured-content .article-list-detail-wrapper{padding:0 5px}.featured-content .article-list-title{color:#FFF;line-height:normal}.featured-content .article-list:hover{opacity:.8;background:#394b5b}.featured-content.second .article-list-img{max-width:130px}.featured-content.third .btn{width:300px}.btn{border-radius:5px}.btn a{text-decoration:none;color:#FFF;text-align:center;display:block;padding:10px}.btn:hover{opacity:.8}@media(min-width:0) and (max-width:1023px){.blog-side-wrapper{display:none}.blog-ranking-header-wrapper{top:52px}.featured-content-wrapper{flex-direction:column}.featured-content{max-width:100%;width:100%}.featured-content.third .banner{width:100%;max-width:500px;height:auto}.featured-content.third .btn{width:100%;max-width:500px}}@media(min-width:0) and (max-width:511px){.blog-ranking-header-wrapper ul{font-size:12px;grid-column-gap:12px}.blog-ranking-header-wrapper ul li{padding:2px 0}.blog-ranking-header-wrapper ul li.break{display:block}.blog-ranking-genre-wrapper{padding:5px}.blog-ranking-genre-title{font-size:10px;margin:0}.blog-ranking-genre-div{grid-gap:5px}.blog-ranking-genre-div li a{font-size:12px}.blog-ranking-sort-div li a{font-size:10px;width:90px}.featured-content.second .article-list-img{max-width:150px}}@media(min-width:512px) and (max-width:1023px){.featured-content.second .article-list-img{max-width:220px}}@media(min-width:1024px){.blog-ranking-content-wrapper{max-width:866px}}