.scrollable-list {
  max-height: 500px;         /* 高さ固定 */
  overflow-y: auto;          /* スクロール可能に */
  border: 1px solid #ddd;
  border-radius: 6px;
  padding: 8px;
  background: #fff;
}


.recent-results {
  border-bottom: 1px solid #ddd;
  padding: 6px 1% 0 1%;width:98%;margin:0 auto;
}
.recent-results .date {
  font-weight: bold;
  color: #333;
  margin-bottom: 2px;
  font-size: 0.7rem;
}

.recent-results .flex {
  display: flex;
  align-items: center;
}
.img_box img {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  object-fit: cover;
}
.info_box {
  margin-left: 12px;display: flex;width:100%;
}
.info_box .name {
  font-weight: bold;margin-right: 4px;width:30%;
}
.info_box .point {
  font-weight: bold;text-align: right;border:solid 0px #333;width:25%;
}

.info_box .rank {
  color: #555;margin-right: 4px;width:15%;font-weight: bold;
}




@media screen and (min-width: 768px) {
.info_box .name {
 width:20%;
}
.info_box .point {
width:10%;
}

.info_box .rank {
  width:10%;
}

}







.team-records{width:98%;margin:0 auto;}
.team-records table{
font-size: 1.0rem;border-collapse:collapse;margin:0 ;width:100%;
}


.team-records table{
border-collapse: collapse;
  table-layout: fixed;
  width: 98%;
 max-width: 100%;
  text-align: center;
}
.team-records  th,.team-records td {
  border: 1px solid #ccc;
  padding: 4px 2%;
  font-weight: bold;
}
.team-records td {text-align: right;font-size:0.7rem;}
.team-records th {font-size:0.7rem;background-color: #f3f3f3;color:#111;}

.team-records .year{
text-align:center;background-color: #F2F2F2;font-size: 0.8rem;
}
.lhs{line-height: 0.5rem;display: block;}

@media screen and (min-width: 768px) {
 .team-records table { max-width: 100%;font-size:1rem;}
 .team-records th { font-size:1rem;}
 .team-records td { font-size:1.3rem;padding:8px 12px;}
}

.nopad{padding:0;width:10%;}
.st{color:#ff2a2a;font-weight: bold;}





.plus {
  color: #007700;
  font-weight: bold;
}

.minus {
  color: #cc0000;
  font-weight: bold;
}

.list_stats .list_name_a{font-size:0.8rem;}
.list_stats table{
font-size: 1.0rem;border-collapse:collapse;margin:0 ;width:100%;
}
.list_stats td,.list_stats th{  text-align:center;padding:2px 20px ;font-weight: bold;  
  }
.list_stats th{font-size: 0.7rem;background-color: #eee;padding:2px 20px ;}
.list_stats tr{ border-bottom:solid 2px #fff;}

h1{ border-bottom:solid 2px #333;border-top:solid 2px #333;padding-left:2%;font-size: 1.6rem;}

/* ▼ スマホ対応 */
@media screen and (max-width: 600px) {
.list_container{ gap:5px;}
/*.list_stats th , .list_stats td{font-size: 0.5rem;}*/

}
.group_img_div{line-height: 0;width:25%;}
.group_info_area{width:100%;display:flex;}
.group_info_area img{width:100%;margin: 12px auto 0 auto;border:solid 0px #ddd;}
/* ▼ スマホ対応 */
@media screen and (max-width: 600px) {
.group_info_area img{width:100%;border-top:solid 0px #333;border-bottom:solid 0px #333;}

}

.group_title{font-weight: bold;text-align: center;margin-top:12px;font-size: 1.2rem;text-shadow:1px 1px 1px #ccc;}

.group_info{padding-top:12px;padding-bottom:12px;
background-color: #fff;padding:0 2%;width: 100%;

}
.group_info table{width: 95%;}

.group_info_area table{
  font-size: 1.3rem;border-collapse:collapse;width:90%;margin:0 2%;
}
/* ▼ スマホ対応 */
@media screen and (max-width: 600px) {
.group_info_area table{width:100%;font-size: 1.0rem;}
.group_info {background-color: #fff;}
.group_info table{width: 95%;}

}


.group_info_area tr{
  border-bottom:solid 1px #999;
}

.group_info_area th{
  text-align: left;
width: 20%;font-weight: normal;
}


/* ▼ スマホ対応 */
@media screen and (max-width: 600px) {
.ra-more {
 width:50%;
}
.group_info_area th{width: 30%;}
}

.group_info_area td{
  padding:4px 2px;font-weight: bold;
}

.group_info {
  font-size: 0.9em;
  margin-bottom: 6px;

}




.recent-current{
background-color: #fff5f5;}



.breadcrumb{
    margin:4px 12px;
}

/* スマホ用のメディアクエリ */
@media screen and (max-width: 768px) {
  .breadcrumb {
    font-size: 0.8rem;
    margin:6px 2%; 0 0;
    
  }
}




h2{
  padding: 0 2%;
}
@media screen and (min-width: 768px) {
h2{
  padding: 0 4px;
}
}


.list_card {
  
  padding:0 4px;
  margin-top: 8px;
  
  border-radius: 3px;
  background-color: #fff;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
 position: relative;
}
.list_card:first-child{
margin-top: 8px;
}

.list_box_flex{display: flex;flex-wrap: wrap;}
.list_img_div {width: 20%;}
.list_img_div img{width: 100%;}


/* スマホ用のメディアクエリ */
@media screen and (max-width: 768px) {
.list_img_div {width: 20%;line-height: 0;}
.list_img_div img{width: 100%;line-height: 0;}
}


.list_info_div{
    padding:0 0 0 8px;
  
}
.list_name{
    font-size: 1.3rem;
}

.img-vote-cnt {
  position: absolute;
  bottom: 32px;
  right: 0;
  background-color: rgba(0,0,0,0.6);
  border-radius: 3px 0 0 3px;
  padding: 4px 8px 2px 8px;
  color: #FFF;
  font-size: 0.9rem;
  line-height: 1.2;
}
.m-rr {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 55px;
  z-index: 9;
}

.rank-default {
  background-color: #999;   /* グレー */
  color: #fff;
}
.rank-badge {
  position: absolute;
  top: -8px;
  left: -10px;
  padding: 3px 6px;
  font-size: 0.9em;
  font-weight: bold;
  border-radius: 8px;
  color: #fff;
  z-index: 10;
}
