@charset "UTF-8";

/* record
-------------------------------------------------------*/
#record #main {
  line-height: 1.7;
}
#record table.record-tbl {
	border-collapse: collapse;
}
#record .record-tbl th {
	background: #eee;
	font-weight: normal;
	font-size: .8rem;
	text-align: center;
}
#record .record-tbl td,
#record .record-tbl th {
    padding: 5px 10px;
    border-bottom: 1px solid #ddd;
	line-height: 1.7;
}
#record .record-tbl td {
	word-break: break-all;
}
#record .record-tbl tr td:nth-child(n+3) {
	font-size: .8rem;
}

#record .record-tbl tr td:nth-child(3) {
	text-align: center;
}
#record section {
	margin-bottom: 5em;
}
#record .scroll table {
	width: 100%;
}
#record .scroll{
	overflow: auto;
	white-space: nowrap;
}
#record .scroll::-webkit-scrollbar{
	height: 5px;
}
#record .scroll::-webkit-scrollbar-track{
	background: #F1F1F1;
}
#record .scroll::-webkit-scrollbar-thumb {
	background: #BCBCBC;
}

#record #main h1 {
    font-size: 1.5rem;
	font-weight: bold;
    line-height: 1.5;
    margin: 2em 1em .5em 1em;
	text-align: center;
}
#record #main h2 {
	font-size: 1.2rem;
    font-weight: bold;
    margin: 2em 0 .5em 0;
    clear: both;
    border-left: #c00 6px solid;
    padding-left: 8px;
}
#record #main > .date {
	font-size: .85rem;
	text-align: center;
	margin-bottom: 1.5em;
}
/* lnav */
#record .lnav ul {
	display: flex;
	flex-wrap: wrap;
	gap: 1px;
}
#record .lnav li {
	font-size: .75rem;
	background: #ccc;
	flex: 1;
}
#record .lnav li a {
	display: block;
	color: #fff;
	position:relative;
	white-space: nowrap;
}
#record .lnav ul li:last-child a {
	border-right: 0;
}
#record .lnav li a:hover {
	background: #b71c1c;
}
@media(max-width:768px){
	#record .lnav li {
		flex-basis: 20%;
	}	
}
@media(min-width: 481px) {
	#record .lnav li a i {
		position:absolute;
		left: 5px;
		bottom: 5px;
		width: 24px;
	}
	#record .lnav li a {
		padding: 7px 7px 7px 32px;
	}
}
@media(max-width: 480px) {
	#record .lnav li a i {
		display: none;
	}
	#record .lnav li a {
		padding: 5px;
		text-align: center;
	}
}
#record .record-tbl a.new:after {
	content: "NEW";
	display: inline-block;
    color: #222;
    background-color: #ff0;
    border-radius: 2px;
    line-height: 1;
    padding: 2px;
    margin-left: 4px;
    font-size: 10px;
}
#record .channel-list li:nth-child(-n+2) {
    border-top: 1px solid #e0e0e0;
}
#record .channel-list li {
  flex-basis: 100%;
  padding: 15px 0;  
}
#record .channel-list li .rank {
  top: 25px;
}
#record .channel-list li .thumbnail {
  vertical-align: top;
}
#record .channel-list li .desc {
  clear: both;
  margin-top: .7em;
  line-height: 1.6;
}
#record .channel-list li aside { 
  display: flex;
  flex-wrap: wrap;
}
#record .channel-list li aside > p {
  float: none;
} 
#record .channel-list li .channel-condition {
	font-size: .7rem;
  display: inline-block;
  margin-left: 0.5em;
  background: #999;
  color: #fff;
  line-height: 1;
  padding: 3px 8px;
  border-radius: 3px;
  position: relative;
  top: -1px;
}
#record .ranking-desc {
  margin-bottom: 1em;
}
@media(max-width: 767px) {
  #record .channel-list li .desc {
    display: block;
    font-size: .8rem;
  }
  #record .ranking-desc {
  	font-size: .75rem;
    margin: 0 .7em .7em .7em;
  }
}