@import url("keyframes.css");
@import url("common.css");
@import url("artist.css");

/*	.news-list
============================== */
ul.news-list li a {
	display:flex;
	background-color:hsla(0,0%,100%,0.8);
	box-shadow: 4px 4px 10px hsla(0, 0%, 0%, .1);
	/* color:#2814a5; */
	color:#000;
	text-decoration:none;
}
ul.news-list li a span,
ul.news-list li a img {
	display:block;
}
ul.news-list li a span.thumb {
	width:30%;
	flex: none;
}
ul.news-list li a span.thumb span {
	position:relative;
	height:0;
	padding-top: -webkit-calc(9 / 16 * 100%);
	padding-top: calc(9 / 16 * 100%);
	background-size:contain;
	background-position:center center;
	background-repeat:no-repeat;
}
ul.news-list li a span.thumb img {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
ul.news-list li a div.title {
	flex: 1;
	min-width: 0;
	line-height:1.5;
}
ul.news-list li a div.title time {
	display:block;
	text-align:right;
	color:#ff325a;
	margin-top:0.25em;
}
ul.news-list li a div.title p {
	text-decoration:underline;
}
@media all and (min-width: 992px) {
ul.news-list li a {
	align-items:center;
	border-radius:40px;
	padding:40px;
	gap:30px;
}
ul.news-list li a div.title time {
	font-size:87.5%;
}
ul.news-list li a div.title p {
	font-size:112.5%;
}
}
@media all and (max-width: 991.98px) {
ul.news-list li a {
	border-radius:20px;
	padding:3.125vw;
	gap:3.125vw;
}
ul.news-list li a div.title time {
	font-size:83%;
}
ul.news-list li a div.title p {
	font-size:87.5%;
}
}

/*	.bnr
============================== */
div.bnr > aside {
	text-align:left;
}
div.bnr ul li a {
	display:block;
	background-size:cover;
	background-repeat:no-repeat;
	position:relative;
	height:0;
}

div.bnr aside ul li a {
	padding-top: -webkit-calc(360 / 1200 * 100%);
	padding-top: calc(360 / 1200 * 100%);
}
div.bnr ul li a span {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
div.bnr ul li a.lazy-done {
	-webkit-animation: fadeIn 800ms;
	animation: fadeIn 800ms;
	box-shadow:2px 4px 10px hsla(0,0%,0%,.25);
}
@media all and (min-width: 1200px) {
div.bnr > aside {
	max-width:1200px;
	margin:0 auto;
}
}
@media all and (min-width: 992px) and (max-width: 1199.98px) {
div.bnr > aside {
	margin:0 30px;
}
}
@media all and (min-width: 992px) {
div.bnr ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items:center;
	gap:30px;
}
div.bnr ul li {
	width:calc((100% - 30px)/2);
}
}
@media all and (max-width: 991.98px) {
div.bnr > aside {
	margin:0 6.25vw;
}
div.bnr ul li:not(:last-child) {
	margin-bottom:20px;
}
}


/*	.info
============================== */
div.info {
	display:none;
	text-align:left;
}
div.info.info-on {
	display:block;
}
div.info > section {
	background-color:hsla(0,0%,100%,1);
	box-shadow: 4px 4px 10px hsla(0, 0%, 0%, .1);
}
div.info > section {
	line-height:1.5;
}
div.info > section h2 {
	color:#0064d2;
	margin-bottom:0.5em;
}
div.info > section dl dt {
	color:#0a91dc;
}
div.info > section dl dd:not(:last-child) {
	margin-bottom:1.5em;
}
@media all and (min-width: 1200px) {
div.info {
	max-width:1200px;
	margin:0 auto;
}
}
@media all and (min-width: 992px) and (max-width: 1199.98px) {
div.info {
	margin:0 30px;
}
}
@media all and (min-width: 992px) {
div.info:not(:last-child) {
	margin-bottom:60px;
}
div.info > section {
	border-radius:20px;
	padding:40px;
}
div.info > section h2 {
	font-size:125%;
}
div.info > section dl dt,
div.info > section dl dd {
	font-size:112.5%;
}
}
@media all and (max-width: 991.98px) {
div.info:not(:last-child) {
	margin-bottom:30px;
}
div.info > section {
	border-radius:10px;
	padding:20px;
}
div.info > section h2 {
	font-size:87.5%;
}
div.info > section dl dt,
div.info > section dl dd {
	font-size:83%;
}
}