@charset   "UTF-8";

#breadcrumb{
	display:none;
}

#top_imgs{
	padding:0 0 15px 0;
	}
	#top_imgs #top_banners{
		float:left;
		width:66%;
		}
		#top_imgs #top_banners ul{
			display:grid;
			grid-template-columns: repeat(auto-fill,minmax(min(230px,100%),1fr));
			gap:10px;
			li{
				a{
					display:block;
					&:hover{
						img{
							opacity: .75;
						}
					}
				}
			}
		}
	#top_imgs #InfoBox{
		width:32%;
		height:380px;
		margin:0 0 0 2%;
		float:left;
		}
		#top_imgs > #InfoBox > h3{
		background:black;
		color:white;
		font-size:16px;
		padding:0.4em 0.5em 0.2em 0.5em;
		text-align:left;
	}
	#top_imgs #InfoBox ul{
		border:2px solid black;
		border-top:none;
		padding:10px;
		text-align:left;
		font-size:12px;
		height:310px;
		overflow:scroll;
		}
		#top_imgs #InfoBox ul li{
			padding:20px 0;
			border-top:1px dotted gray;
		}
		#top_imgs #InfoBox ul li:first-child{
			border-top:none;
			padding-top:0;
		}
/*********************/

#piano_kaitei{
	p{
		text-align: left;
	}
	ul{
		display:grid;
		grid-template-columns: repeat(2,1fr);
		gap:20px;
		margin:10px auto 0 auto;
		a{
			&:hover{
				opacity: .75;
			}
		}
	}
}

/*********************/
.conts{
	}
	.conts ul#contents_1{
		display:flex;
		flex-wrap:wrap;
		}
		.conts ul#contents_1 li{
			width:49%;
			margin-top:10px;
			}
			.conts ul#contents_1 li:nth-child(odd){
				margin-right:2%;
			}
			.conts ul#contents_1 li:nth-child(1),
			.conts ul#contents_1 li:nth-child(2){
				margin-top:0;
				}
			.conts ul#contents_1 li a{
				display:block;
				padding:10px;
				text-decoration:none;
				color:#333;
				border:2px solid #09C;
				}
				.conts ul#contents_1 li a:hover img{
					opacity: 0.6; 
					}
				.conts ul#contents_1 li a p{
					text-align:left;
					line-height:1.5em;
				}
				
	.conts ul#contents_2{
		padding:15px 0 0 0;
		margin:25px 0 0 0;
		border-top:1px dotted gray;
		}
		.conts ul#contents_2 li{
			width:32%;
			float:left;
			margin:10px 0 0 0;
			}
			.conts ul#contents_2 li:nth-child(3n+2){
				margin-left:2%;
				margin-right:2%;
			}
			.conts ul#contents_2 li:nth-child(3n+1){
				clear:left;
			}
			.conts ul#contents_2 li a{
					text-decoration:none;
				}
				.conts ul#contents_2 li a img{
				}
				.conts ul#contents_2 li a h3{
					font-size:1.1em;
					text-align:left;
					margin:5px;
					border-bottom:1px solid black;
					}
			.conts ul#contents_2 li p{
				margin:0 5px;
				text-align:left;
			}