@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

#content{align-items: flex-start;}

.l-content{
    padding-top:3em ;
}

main#main_content, aside#sidebar{
    box-shadow: 0px 0px 4px 2px #8080808f;
    background: #ffffff8f;
    padding:3% 2%
}
@media (max-width:768px){
    main#main_content{
        padding:5% 2%
    }
}

/* 横並び */
.ranking-container{display: grid;grid-template-columns: repeat(3,1fr);overflow-x:auto;padding:20px 0;gap: 10px;}
.ranking-item{flex:0 0 auto;padding:10px 10px;border:1px solid #ddd;border-radius:8px;background:#fff;display:flex;flex-direction:column;height:auto;font-weight:bold;}
.ranking-item .yoko_cv{
    margin-top: auto;
    font-size: 16px;
}
.ranking-title{margin-bottom:10px;background: #d8fa00;text-align: center}
.ranking-title span{margin-left:4px;font-size:1.2em}
.ranking-name{font-size:1.2em;margin-bottom:10px;text-align:center}
.ranking-item ul {list-style: none;padding: 0;margin: 10px 0;}
.ranking-item li {font-size: 14px;}

/* スマホサイズでの横スクロール */
@media (max-width:768px){
  .ranking-container{padding:10px}
  .ranking-item{width: 220px;}
}
.ranking-container::-webkit-scrollbar{height:8px}
.ranking-container::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}
.ranking-container::-webkit-scrollbar-thumb{background:#888;border-radius:4px}
.ranking-container::-webkit-scrollbar-thumb:hover{background:#555}





/* ヘッダー追従 */
#body_wrap header#header{position:sticky;top: 0;z-index: 100;}