@charset "UTF-8";
/* === リラックスページ === */
/* 三宅龍太郎 2018 */

@media (min-width: 480px) {

	h2 {
		display: none;
	}
	h3:first-of-type::after {
		content: '';
		display: inline-block;
		width: 2.625rem;
		aspect-ratio: 42/45;
		background: url('../image/icon/neko.gif') no-repeat 50%/contain;
		margin: 0 0 0 .4rem;
		padding: 0;
		top: .3rem;
	}
	h3:first-of-type + p {
		margin: 0 0 0 5%;
		padding: 0;
	}
/*
	h4 + dl {
		display: grid;
		grid-template-columns: auto 1fr;
		gap: 1em;
		margin: 0 0 1em 3%;
	}
	h4 + dl * {
		margin: 0;
		padding: 0;
	}
*/
	h4 + .grid {
		margin: 0 0 .5em 3%;
		width: 97%;
	}
/*
	h4 + .grid dl dd a::after {
		content: 'LIVE';
		display: inline-block;
		color: light-dark(#e33, #ffb6c1);
		font: 700 italic .95em 'arial black';
		transform: rotate(15deg);
		top: -.625em;
		left: -.625rem;
	}
*/
	h4 + .grid ul.flex {
		align-items: center;
	}

	ol {
		margin: 0;
		padding: 0 0 0 10%;
	}
	body > ol:first-of-type {
		color: inherit;
		background: transparent url('../image/icon/coffeecup_w.gif') no-repeat bottom right/5.5rem;
	}

	/* ニュース */
	body > ol:first-of-type > li a.ニュース::after {
		content: attr(class);
		display: inline-block;
		margin: 0 0 0 .2em;
		transform: rotate(-15deg);
		font: 700 normal 14px 'Meiryo UI',arial;
		color: light-dark(#dc143c, #ffb6c1);
		vertical-align: .1em;
	}
	/* おすすめ */
	body > ol:first-of-type > li > a.おすすめ::after {
		content: '\00A0\00A0\00A0\00A0\00A0\00A0\00A0イイネ';
		display: inline-block;
		aspect-ratio: 52/28;
		color: light-dark(#c33, #ffb6c1);
		font-size: .8em;
		font-weight: bold;
		/* background: url('../image/icon/good32.svg') no-repeat 0/contain,
			url('../image/icon/goodx.png') no-repeat 32px/25px; */
		background: url('../image/icon/good32.svg') no-repeat 0/contain;


		vertical-align: bottom;
	}
	/* おまけ動畫 */
	dd > ol {
		margin-top: .5em;
	}
	h5:nth-of-type(1) + ul > li > .flex.text {
		gap: 0 2em;
	}
	h5:nth-of-type(2) + ul li:nth-of-type(-n+5) dt::before {
		content: '\01f3b5';
		margin: 0 .2em 0 0;
	}
	/* ジャケ畫像 */
	[width='100'] {
		width: 6.25rem;
	}

}

@media (min-width: 760px) {

	/* インデックス */
	ol {
		display: flex;
		flex-wrap: wrap;
		gap: 2px 1em;
		margin: 0 0 0 auto;
		padding: 0;
		width: 97%;
		list-style: none;
	}
	ol > li {
		margin: 0;
		padding: 0;
		width: calc(50% - .5em);
	}
	ol > li::before {
		counter-increment: list_counter;
		content: counter(list_counter, decimal-leading-zero) '. ';	/* decimal / decimal-leading-zero */
		font-family: Arial, monospace;
	}

	/* おまけ動畫 */
	h5:nth-of-type(2) + ul, h5:nth-of-type(2) + ul * {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	h5:nth-of-type(2) + ul > li {
		margin: 0 0 1em;
	}
	/* ジャングル大帝 レオのうた */
	h5:nth-of-type(2) + ul > li:nth-of-type(3) dd._tright {
		line-height: 1.1;
	}
	h5:nth-of-type(2) + ul > li:not(:nth-of-type(4)) dl {
		display: grid;
		grid-template-columns: calc(6.25rem + .8em) 1fr;
		gap: 0 .8em;
	}
	h5:nth-of-type(2) + ul > li:nth-of-type(4) > dl > dd:first-of-type a[href] {
		display: inline-block;
	}
	h5:nth-of-type(2) + ul dl > dt {
		grid-column: 1 / 3;
	}
	h5:nth-of-type(2) + ul dl > dd:first-of-type {
		margin-block-end: 1em;
		padding: .2em 0 0 1em;
		grid-row: 2 / 4;
	}
	h5:nth-of-type(2) + ul dl > dd:nth-of-type(4) {
		padding-left: 1em;
		grid-column: 1 / 3;
		grid-row: 4 / 5;
	}
	h5:nth-of-type(2) + ul dl > dd ol {
		width: 100%;
	}
	/* 真宗東本願寺門信徒勤行 */
	h5:nth-of-type(2) + ul dl > dd:nth-of-type(2) ol > li > ul {
		margin-left: 5%;
	}

}

@media (min-width: 480px) and (prefers-color-scheme: dark) {

	body > ol:first-of-type {
		background: transparent none;
	}

}