@charset "UTF-8";

/* --------------------------------------------
HATENA MODULES
--------------------------------------------- */
#header-modules .hatena-module:not( .hatena-module-html ){
	background-color : #fff;
}
@media screen and ( max-width : 750px ){
	#header-modules .hatena-module:not( .hatena-module-html ){
		padding-left : calc( 40 * 100% / var( --breakpoint ) );
		padding-right : calc( 40 * 100% / var( --breakpoint ) );
	}
}
@media print , screen and ( min-width : 751px ){
	#header-modules .hatena-module:not( .hatena-module-html ){
		padding-left : 155px;
		padding-right : 155px;
	}
}
@media print , screen and ( min-width : 1150px ){
	#header-modules .hatena-module:not( .hatena-module-html ){
		width : 1150px;
		margin-inline : auto;
	}
}
.hatena-module-recent-entries .hatena-module-title{
	all : unset;
	box-sizing : border-box;
	display : block;
	width : 100%;
}
.hatena-module-recent-entries .hatena-module-title::before , .hatena-module-recent-entries .hatena-module-title::after{
	content : none;
}
.hatena-module-recent-entries .hatena-module-title a{
	all : unset;
	box-sizing : border-box;
	display : grid;
	grid-template-columns : 1fr auto 1fr;
	align-items : center;
	height : 100%;
	font-family : var( --fontFamily );
	font-weight : 700;
	color : var( --body );
	text-align : center;
	text-indent : .11em;
	letter-spacing : .11em;
	pointer-events : none;
}
.hatena-module-recent-entries .hatena-module-title a::before , .hatena-module-recent-entries .hatena-module-title a::after{
	all : unset;
	box-sizing : border-box;
	display : block;
	margin : 0;
	font-family : var( --fontFamily );
	font-size : 0;
	content : "";
	background-color : currentColor;
}
.hatena-module-recent-entries .hatena-module-title a:hover{
	text-decoration : inherit;
}
@media screen and ( max-width : 750px ){
	.hatena-module-recent-entries .hatena-module-title a{
		column-gap : calc( 32 * 100% / 670 );
		font-size : 4.8rem;
	}
	.hatena-module-recent-entries .hatena-module-title a::before , .hatena-module-recent-entries .hatena-module-title a::after{
		height : calc( 6 var( --remBase ) );
	}
}
@media print , screen and ( min-width : 751px ){
	.hatena-module-recent-entries .hatena-module-title a{
		column-gap : calc( 20 * 100% / 840 );
		font-size : 3.2rem;
	}
	.hatena-module-recent-entries .hatena-module-title a::before , .hatena-module-recent-entries .hatena-module-title a::after{
		height : calc( 3 var( --remBase ) );
	}
}
.hatena-module-category{
	all : unset;
	box-sizing : border-box;
	display : block;
	width : 100%;
}
.hatena-module-category .hatena-module-title , .title01{
	all : unset;
	box-sizing : border-box;
	display : grid;
	grid-template-columns : 1fr auto 1fr;
	align-items : center;
	height : 100%;
	font-family : var( --fontFamily );
	font-weight : 700;
	color : var( --body );
	text-align : center;
	text-indent : .11em;
	letter-spacing : .11em;
	pointer-events : none;
}
.hatena-module-category .hatena-module-title::before , .hatena-module-category .hatena-module-title::after , .title01::before , .title01::after{
	all : unset;
	box-sizing : border-box;
	display : block;
	margin : 0;
	font-family : var( --fontFamily );
	font-size : 0;
	content : "";
	background-color : currentColor;
}
@media screen and ( max-width : 750px ){
	.hatena-module-category .hatena-module-title , .title01{
		column-gap : calc( 32 * 100% / 670 );
		font-size : 4.8rem;
	}
	.hatena-module-category .hatena-module-title::before , .hatena-module-category .hatena-module-title::after , .title01::before , .title01::after{
		height : calc( 6 var( --remBase ) );
	}
}
@media print , screen and ( min-width : 751px ){
	.hatena-module-category .hatena-module-title , .title01{
		column-gap : calc( 20 * 100% / 840 );
		font-size : 3.2rem;
	}
	.hatena-module-category .hatena-module-title::before , .hatena-module-category .hatena-module-title::after , .title01::before , .title01::after{
		height : calc( 3 var( --remBase ) );
	}
}
@media print , screen and ( min-width : 751px ){
	#header-modules .hatena-module-title{
		column-gap : calc( 20 * 100% / 840 );
	}
}

/* --------------------------------------------
SIDEBAR
--------------------------------------------- */
#box2 .hatena-module{
	padding : 0;
	background-color : transparent;
}
#banners a{
	display : block;
	width : 100%;
	transition : opacity .3s ease-in;
}
#banners a:hover{
	opacity : .8;
}
#banners a img{
	width : 100%;
	height : 100%;
	object-fit : cover;
}
@media screen and ( max-width : 750px ){
	#banners{
		padding-inline : calc( 134 * 100% / 750 );
		padding-top : calc( 122 var( --remBase ) );
		padding-bottom : calc( 130 var( --remBase ) );
		background-color : #f4f4f4;
	}
	#banners li + li{
		margin-top : calc( 62 var( --remBase ) );
	}
}
@media print , screen and ( min-width : 751px ){
	#banners li + li{
		margin-top : calc( 20 var( --remBase ) );
	}
}
#box2 .hatena-module-category .hatena-module-title{
	all : unset;
	box-sizing : border-box;
	display : grid;
	grid-template-columns : 1fr auto 1fr;
	align-items : center;
	height : 100%;
	font-family : var( --fontFamily );
	font-weight : 700;
	color : var( --body );
	text-align : center;
	text-indent : .11em;
	letter-spacing : .11em;
	pointer-events : none;
}
#box2 .hatena-module-category .hatena-module-title::before , #box2 .hatena-module-category .hatena-module-title::after{
	all : unset;
	box-sizing : border-box;
	display : block;
	margin : 0;
	font-family : var( --fontFamily );
	font-size : 0;
	content : "";
	background-color : currentColor;
}
@media screen and ( max-width : 750px ){
	#box2 .hatena-module-category{
		padding-inline : calc( 40 * 100% / 670 );
		padding-top : calc( 94 var( --remBase ) );
		padding-bottom : calc( 126 var( --remBase ) );
	}
	#box2 .hatena-module-category .hatena-module-title{
		column-gap : calc( 32 * 100% / 670 );
		font-size : 4.8rem;
	}
	#box2 .hatena-module-category .hatena-module-title::before , #box2 .hatena-module-category .hatena-module-title::after{
		height : calc( 6 var( --remBase ) );
	}
	#box2 .hatena-module-category .hatena-urllist{
		row-gap : calc( 15 var( --remBase ) );
		column-gap : calc( 50 var( --percentBase ) );
		margin-top : calc( 46 var( --remBase ) );
	}
	#box2 .hatena-module-category .hatena-urllist li{
		width : calc( 190 var( --percentBase ) );
		height : calc( 48 var( --remBase ) );
	}
	#box2 .hatena-module-category .hatena-urllist a{
		font-size : calc( 28 var( --remBase ) );
	}
}
@media print , screen and ( min-width : 751px ){
	#box2 .hatena-module-category{
		margin-top : calc( 76 var( --remBase ) );
	}
	#box2 .hatena-module-category .hatena-module-title{
		column-gap : calc( 10 * 100% / 240 );
		font-size : 3.2rem;
	}
	#box2 .hatena-module-category .hatena-module-title::before , #box2 .hatena-module-category .hatena-module-title::after{
		height : calc( 3 var( --remBase ) );
	}
	#box2 .hatena-module-category .hatena-urllist{
		row-gap : calc( 15 var( --remBase ) );
		justify-content : space-between;
		padding-inline : calc( 24 * 100% / 240 );
		margin-top : calc( 30 var( --remBase ) );
	}
	#box2 .hatena-module-category .hatena-urllist li{
		width : calc( 86 * 100% / 192 );
		height : calc( 25 var( --remBase ) );
	}
	#box2 .hatena-module-category .hatena-urllist a{
		font-size : calc( 13 var( --remBase ) );
	}
}

/* --------------------------------------------
FOOTER
--------------------------------------------- */
#footer .copyright{
	display : grid;
	justify-content : center;
	background-color : #f4f4f4;
}
#footer ul{
	display : flex;
	flex-wrap : wrap;
	align-items : start;
}
#footer ul a{
	font-weight : 300;
	color : #808080;
}
#footer > a{
	display : block;
	margin-inline : auto;
	transition : opacity .3s ease-in;
}
#footer > a:hover{
	opacity : .8;
}
@media screen and ( max-width : 750px ){
	#footer{
		padding-top : calc( ( 62 - 8 ) var( --remBase ) );
	}
	#footer ul{
		column-gap : calc( 24 var( --percentBase ) );
		justify-content : center;
	}
	#footer ul li:first-child , #footer ul li:last-child{
		width : 100%;
		text-align : center;
	}
	#footer ul li:first-child{
		margin-bottom : calc( ( 36 - 8 - 8 ) var( --remBase ) );
	}
	#footer ul a{
		font-size : calc( 20 var( --remBase ) );
		line-height : 1.8;
	}
	#footer > a{
		width : calc( 220 var( --percentBase ) );
		margin-top : calc( ( 60 - 8 ) var( --remBase ) );
	}
	#footer .copyright{
		align-items : start;
		padding-top : calc( ( 32 - 7 ) var( --remBase ) );
		padding-bottom : calc( ( 32 - 7 ) var( --remBase ) );
		margin-top : calc( 20 var( --remBase ) );
		font-size : calc( 20 var( --remBase ) );
		line-height : 1.7;
	}
}
@media print , screen and ( min-width : 751px ){
	#footer{
		padding-top : calc( ( 46 - 4.5 ) var( --remBase ) );
	}
	#footer ul{
		column-gap : calc( 34 var( --percentBase ) );
		justify-content : center;
	}
	#footer ul a{
		font-size : calc( 12 var( --remBase ) );
		line-height : 1.75;
	}
	#footer > a{
		width : calc( 118 var( --percentBase ) );
		margin-top : calc( ( 46 - 4.5 ) var( --remBase ) );
	}
	#footer .copyright{
		align-items : center;
		height : calc( 60 var( --remBase ) );
		margin-top : calc( 46 var( --remBase ) );
		font-size : calc( 12 var( --remBase ) );
		line-height : 1.75;
	}
}