@charset "UTF-8";

/* --------------------------------------------
TITLE
--------------------------------------------- */
.title01{
	width : 100%;
	margin : 0;
	font-weight : 600;
	color : var( --red );
	text-align : center;
	text-indent : .05em;
	letter-spacing : .05em;
	&::before{
		display : block;
		width : 100%;
		font-size : 0;
		content : "";
		background-repeat : no-repeat;
		background-position : center;
		background-size : auto 100%;
	}
	@media screen and ( width <= 750px ){
		font-size : calc( 12.88 * var( --remBase ) );
		line-height : calc( 19 / 12.88 );
		&::before{
			height : calc( 17.91 * var( --remBase ) );
			margin-bottom : calc( 7.77 * var( --remBase ) );
		}
	}
	@media print , screen and ( width > 750px ){
		font-size : calc( 16 * var( --remBase ) );
		line-height : calc( 24 / 16 );
		&::before{
			height : calc( 28.32 * var( --remBase ) );
			margin-bottom : calc( 9.68 * var( --remBase ) );
		}
	}
}

/* --------------------------------------------
SEE MORE
--------------------------------------------- */
.urllist-see-more{
	a{
		position : relative;
		display : grid;
		grid-template-columns : 1fr auto;
		align-items : start;
		justify-content : space-between;
		font-size : 0;
		color : transparent;
		-webkit-text-decoration : none;
		text-decoration : none;
		background-color : transparent;
		background-image : url( "https://cdn.blog.st-hatena.com/files/26006613675768774/6802888565255141050" );
		background-repeat : no-repeat;
		background-position : 0 0;
		border : 0;
		&::before{
			display : block;
			grid-row : 1;
			grid-column : 2;
			width : auto;
			font-size : 0;
			content : "";
			background-image : url( "https://cdn.blog.st-hatena.com/files/26006613675768774/6802888565255141010" );
			background-repeat : no-repeat;
			background-position : left center;
			background-size : contain;
		}
		&::after{
			position : absolute;
			bottom : 0;
			left : 0;
			width : 100%;
			font-size : 0;
			content : "";
			background-color : black;
		}
	}
	@media screen and ( width <= 750px ){
		a{
			width : calc( 216 * var( --remBase ) );
			height : calc( 27 * var( --remBase ) );
			padding-right : calc( 5.26 * var( --remBase ) );
			background-size : auto calc( 11.31 * var( --remBase ) );
			&::before{
				height : calc( 12.74 * var( --remBase ) );
				aspect-ratio : 7.74 / 12.74;
			}
			&::after{
				height : calc( 2 * var( --remBase ) );
			}
		}
	}
	@media print , screen and ( width > 750px ){
		a{
			width : calc( 228 * var( --remBase ) );
			height : calc( 28 * var( --remBase ) );
			padding-right : calc( 7.22 * var( --remBase ) );
			background-size : auto calc( 11.31 * var( --remBase ) );
			&::before{
				height : calc( 12.77 * var( --remBase ) );
				aspect-ratio : 7.78 / 12.77;
			}
			&::after{
				height : calc( 2 * var( --remBase ) );
			}
		}
	}
}
@media ( hover : hover ){
	.urllist-see-more a:hover{
		color : transparent;
		background : transparent;
		background-color : transparent;
		background-image : url( "https://cdn.blog.st-hatena.com/files/26006613675768774/6802888565255141050" );
		background-repeat : no-repeat;
		background-position : 0 0;
		background-origin : border-box;
		background-size : auto calc( 11.31 * var( --remBase ) );
	}
}
.urllist-see-more a:hover{
	@media screen and ( width <= 750px ){
		color : transparent;
		background : transparent;
		background-color : transparent;
		background-image : url( "https://cdn.blog.st-hatena.com/files/26006613675768774/6802888565255141050" );
		background-repeat : no-repeat;
		background-position : 0 0;
		background-origin : border-box;
		background-size : auto calc( 11.31 * var( --remBase ) );
	}
}
.link01{
	position : relative;
	display : grid;
	grid-template-columns : 1fr auto;
	align-items : start;
	justify-content : space-between;
	font-size : 0;
	color : transparent;
	-webkit-text-decoration : none;
	text-decoration : none;
	border : 0;
	&::before{
		display : block;
		grid-row : 1;
		grid-column : 2;
		width : auto;
		font-size : 0;
		content : "";
		background-image : url( "https://cdn.blog.st-hatena.com/files/26006613675768774/6802888565255141010" );
		background-repeat : no-repeat;
		background-position : left center;
		background-size : contain;
	}
	&::after{
		position : absolute;
		bottom : 0;
		left : 0;
		width : 100%;
		font-size : 0;
		content : "";
		background-color : black;
	}
	@media screen and ( width <= 750px ){
		width : calc( 216 * var( --remBase ) );
		height : calc( 27 * var( --remBase ) );
		padding-right : calc( 5.26 * var( --remBase ) );
		img{
			height : calc( 11.31 * var( --remBase ) );
		}
		&::before{
			height : calc( 12.74 * var( --remBase ) );
			aspect-ratio : 7.74 / 12.74;
		}
		&::after{
			height : calc( 2 * var( --remBase ) );
		}
	}
	@media print , screen and ( width > 750px ){
		width : calc( 228 * var( --remBase ) );
		height : calc( 28 * var( --remBase ) );
		padding-right : calc( 7.22 * var( --remBase ) );
		img{
			height : calc( 11.31 * var( --remBase ) );
		}
		&::before{
			height : calc( 12.77 * var( --remBase ) );
			aspect-ratio : 7.78 / 12.77;
		}
		&::after{
			height : calc( 2 * var( --remBase ) );
		}
	}
}
.link02{
	display : flex;
	align-items : center;
	justify-content : center;
	font-weight : 600;
	color : #fff;
	letter-spacing : .25em;
	background-color : #221714;
	&::after{
		display : block;
		flex-shrink : 0;
		width : auto;
		content : "";
		background : url( "https://cdn.blog.st-hatena.com/files/26006613675768774/26006613683142970" ) 0 center / contain no-repeat;
	}
	@media screen and ( width <= 750px ){
		column-gap : calc( 20 * 100% / 540 );
		width : calc( 540 * var( --oldRemBase ) );
		height : calc( 64 * var( --oldRemBase ) );
		font-size : calc( 25 * var( --oldRemBase ) );
		&::after{
			height : calc( 20 * var( --oldRemBase ) );
			aspect-ratio : 12/20;
		}
	}
	@media print , screen and ( width > 750px ){
		column-gap : calc( 10 * 100% / 245 );
		width : calc( 245 * var( --remBase ) );
		height : calc( 35 * var( --remBase ) );
		margin-inline : auto;
		font-size : calc( 13.125 * var( --remBase ) );
		&::after{
			height : calc( 11 * var( --remBase ) );
			aspect-ratio : 7/11;
		}
	}
}
.link-more01{
	display : grid;
	place-items : center;
	margin-inline : auto;
	font-size : 0;
	background-color : #221714;
	background-image : url( "https://cdn.blog.st-hatena.com/files/26006613675768774/26006613782627543" );
	background-repeat : no-repeat;
	background-position : center;
	@media screen and ( width <= 750px ){
		width : calc( 540 * var( --oldRemBase ) );
		height : calc( 64 * var( --oldRemBase ) );
		background-size : auto calc( 22 * var( --oldRemBase ) );
	}
	@media print , screen and ( width > 750px ){
		width : calc( 245 * var( --remBase ) );
		height : calc( 35 * var( --remBase ) );
		background-size : auto calc( 12 * var( --remBase ) );
	}
}
.link-more02{
	display : grid;
	align-items : center;
	justify-content : center;
	margin-left : auto;
	margin-right : auto;
	color : #fff;
	background-color : #000;
	&::after{
		display : block;
		width : 100%;
		font-size : 0;
		content : "";
		background-image : url( "https://cdn.blog.st-hatena.com/files/26006613675768774/26006613683142970" );
		background-repeat : no-repeat;
		background-position : 0 0;
		background-size : contain;
	}
	@media screen and ( width <= 750px ){
		grid-template-columns : auto calc( 19 * 100% / 540 );
		column-gap : calc( 26 * 100% / 521 );
		width : calc( 540 * 100% / 660 );
		height : calc( 90 * var( --oldRemBase ) );
		font-size : calc( 28 * var( --oldRemBase ) );
		&::after{
			height : calc( 28 * var( --oldRemBase ) );
		}
	}
	@media print , screen and ( width > 750px ){
		grid-template-columns : auto calc( 10 * 100% / 255 );
		column-gap : calc( 11 * 100% / 255 );
		width : calc( 255 * 100% / 722 );
		height : calc( 36 * var( --remBase ) );
		font-size : calc( 13 * var( --remBase ) );
		letter-spacing : .19em;
		&::after{
			height : calc( 14 * var( --remBase ) );
		}
	}
}

/* --------------------------------------------
LISTS
--------------------------------------------- */
.list-tags{
	display : flex;
	flex-wrap : wrap;
	a{
		display : grid;
		grid-auto-flow : column;
		place-items : center;
		font-weight : 300;
		color : white;
		text-align : center;
		text-indent : .1em;
		letter-spacing : .1em;
		background-color : #888988;
		&::before{
			flex-shrink : 0;
			content : "#";
		}
	}
}