@charset 'utf-8';

.ban_sale {
	background:rgba(0,0,0,0.75);
	border:solid #FFF; border-width:2px 0;
	margin-bottom:16px;
}
.ban_sale:empty { display:none; } /* 何もない時は非表示 */
.ban_sale a {
	position:relative; overflow:hidden;
	display:flex; flex-direction:column; justify-content:center;
	text-decoration:none !important;
}
.ban_sale a + a { border-top:solid 2px #FFF; }
.ban_sale ul {
	position:absolute; left:0; top:0; z-index:0;
	width:100%; height:100%;
	display:flex;
}
.ban_sale a:nth-of-type(even) ul { flex-direction:row-reverse; }
.ban_sale li {
	width:128px; height:100%;
	background:no-repeat center center / cover;
}
.ban_sale li:nth-child(2) { opacity:.8; }
.ban_sale li:nth-child(3) { opacity:.6; }
.ban_sale li:nth-child(4) { opacity:.4; }
.ban_sale li:nth-child(5) { opacity:.2; }
.ban_sale div { position:relative; z-index:1; padding:16px 16px 16px 272px; }
.ban_sale a:nth-of-type(even) div { padding:16px 272px 16px 16px; }
.ban_sale h2 { font-size:24px; }
.ban_sale p { font-size:18px; color:#FF9; margin-top:8px; }
@media screen and ( max-width:568px ){
.ban_sale div,
.ban_sale a:nth-of-type(even) div { padding:16px; }
.ban_sale h2 { font-size:20px; }
.ban_sale p { font-size:14px; }
.ban_sale ul { position:relative; flex:1;}
.ban_sale li { flex:1; height:96px; }
.ban_sale li { opacity:1 !important; } 
}