.table_title{
	position: sticky;
	z-index: 2;
	top:3rem;
	padding: 0.2rem 1rem;
	background-color: var(--background-color); 	}	
@media (orientation: portrait){
	.table_title{
	top:6rem;
	padding: 0.2rem 1rem; 	}		}
	
.table{ margin:0 1rem; }	
.table_piece{ margin:0.2rem 0; }

	

.channel{
	color:var(--header-color);
	font-size:0.95em;
	text-align:center; line-height:100%;
	position: relative;
	margin:0.8rem 0 0.6rem 0;}
.channel::before { left: 0; }
.channel::after { right: 0; }
.channel::before,.channel::after {
	position: absolute;
	top: 40%;
	content: '';
	display: inline-block;
	width: calc(50% - 6rem);
	height: 1px;
	background: var(--border-color); }
.key{ 
	font-size:1.1em;
	margin:1.4rem 0 0.6rem 0;}
.key::before,.key::after {
	width: calc(50% - 6rem);
	height: 3px; }

.container {
	width:100%;
	height: fit-content;
	display: flex;
	flex-wrap: nowrap; }

.header_item{
	display: flex;
	width: 25%;
	padding:0.4rem 0.1rem 0.4rem 0.4rem ; }
.header_item h6{ margin:0.2rem 0.1rem; }
.header_item div{
	display: flex;
	align-items: center; }
.header_item div span{
	display: flex;
	flex-direction : Column-Reverse; }
.header_item h4{
	font-size:1.05rem;
	color: var(--first-color); }
.header_item span h6{
	display: flex;}

.cast_container {
	width:75%;
	height: fit-content;
	display: flex;
	justify-content: space-around;
	margin:auto 0rem; 
	padding: 0.6rem 0.2rem; }
.table_piece .cast_container {
	;}
	
.item{
	display:flex;
	flex-direction:column;
	width: 16%;}
.table_piece .item{
	opacity: 0.5;}
.item+.uchi{ width: 14%; }
.item p{
	color:var(--para-color);}

.table_piece .hit{
	opacity: 1; }
.bold p,.bold h6{ color:#222; }
.cast{
	border: solid 0.1rem var(--border-color); }
.main{
	border: solid 0.15rem var(--first-color); }
.sub{
	border: dotted 0.15rem var(--first-color); }
.item h6{
	font-size:0.75rem;
	font-weight:normal;
	padding:0.1rem 0 0 0.1rem;}

.item div{
	height:100%;
	text-align:center;	
	display: flex;
	align-items: center;
	margin:auto -0.2rem; 
	padding: 0.2rem 0; }
.item p{	
	font-size:0.9rem; line-height:120%;
	margin:auto auto; }
.item small{
	font-size:0.65rem;
	white-space:nowrap; }

.table_title .container{
	background-color: transparent;}
.table_title .cast_container {
	padding: 0; }
.table_title .item{
	border: 0.2rem solid var(--background-color);
	border-radius: 50%;
	justify-content: end;}
.table_title .item img{
	margin:0.1rem auto -0.1rem auto; }
.table_title h5{ text-align:center; }
.table_title h5 small{ display:block; }

@media all and (orientation: portrait) { 
.container {
	flex-direction : column; }
.cast_container {
	width: 99%;
	margin:0 auto;
	padding: 0.4rem 0; }
.header_item{
	width: 100%;
	padding:0.3rem 0.3rem 0 0.3rem; }
.header_item div span{
	display: flex;	
	flex-wrap: wrap;
	flex-direction : row;
	}
.header_item h4{
	white-space:nowrap;
	margin-right:0.4rem; }
.header_item h6{
	align-self:center;
	white-space:nowrap; }
.item small{
	display:none; }
}