/************************/
/* for Single Post Page */
/************************/

body > main{
	padding             : 0 44px;
}
@media screen and (max-width: 768px){
	body > main{
		padding         : 0;
	}
}

body > main > article{
	position            : relative;
	z-index             : 1;
	margin              : 0 auto;
	padding-top         : 72px;
	max-width           : 750px;
	box-sizing          : content-box;
}
@media screen and (max-width: 768px){
	body > main > article{
		padding-top     : 40px;
	}
}


/* typography */
#main_wrapper{
	position            : relative;
	overflow            : hidden;
}
#main_wrapper::before{
	content             : attr(data-typography);
	position            : absolute;
	top                 : 0;
	left                : 50%;
	z-index             : 0;
	display             : block;
	width               : 100%;
	max-width           : 1080px;
	font-size           : 150px;
	font-family         : 'Josefin Slab', 'Noto Serif JP', serif;
	font-weight         : 700;
	line-height         : 1em;
	color               : #F5F5F5;
	white-space         : nowrap;
	pointer-events      : none;
	transform           : translateX(-50%);
}

@media screen and (max-width: 768px){
	#main_wrapper::before{
		top             : 32px;
		font-size       : 56px;
	}
}


/* Featured Image */
.img-wrapper .images{
	position            : relative;
	padding-top         : 66.67%;
	width               : 100%;
	height              : 0;
	box-sizing          : content-box;
}
.img-wrapper .images img{
	position            : absolute;
	top                 : 50%;
	left                : 50%;
	width               : auto;
	max-width           : 100%;
	height              : auto;
	max-height          : 100%;
	transform           : translate(-50%, -50%);
}


/* Post Header */
.single-post-header{
	text-align          : center;
}
.single-post-header .post-title{
	margin              : 8px 0;
	font-size           : 24px;
	line-height         : 1.5em;
}
@media screen and (max-width: 768px){
	.single-post-header .post-title{
		margin          : 24px 10px;
		font-size       : 20px;
		text-align      : left;
	}
}
.single-post-header .post-title.paged{
	font-size           : 20px;
}

.post-attributes{
	margin-bottom       : 32px;
	font-size           : 12px;
	font-family         : 'Josefin Slab', 'Noto Serif JP', serif;
	overflow            : hidden;
}
@media screen and (max-width: 768px){
	.post-attributes{
		display         : none;
	}
}
.post-attributes > *{
	display             : inline-block;
	padding             : 0.5em;
}
.post-attributes > * + *::before{
	content             : '/';
	position            : relative;
	right               : 0.5em;
}
.post-attributes .post-date li{
	display             : inline-block;
}
.post-attributes .post-date li::before{
	content             : none;
}
.post-attributes .post-category li{
	display             : inline-block;
}
.post-attributes .post-category li + li::before{
	content             : '>';
	padding             : 0 0.2em;
}


/* Contents */
.single-post-content{
	margin              : 32px auto;
	max-width           : 96vw;
	font-size           : 14px;
}
.single-post-content h2{
	margin              : 32px 0 16px;
	padding             : 4px 12px;
	font-size           : 20px;
	line-height         : 1.6em;
	background          : #F5F5F5;
}
.single-post-content h3{
	position            : relative;
	margin              : 24px 0 16px;
	padding             : 0 12px;
	font-size           : 18px;
	line-height         : 1.44em;
}
.single-post-content h3::before{
	content             : '';
	position            : absolute;
	top                 : 0;
	bottom              : 0;
	left                : 0;
	display             : block;
	width               : 4px;
	background          : #DDDDDD;
}
.single-post-content h4{
	margin              : 24px 0 16px;
	font-size           : 16px;
	line-height         : 24px;
}
.single-post-content p{
	margin              : 16px 0;
	line-height         : 2em;
	text-align          : justify;
}
.single-post-content .has-text-align-center{
	text-align          : center;
}
.single-post-content .has-text-align-left{
	text-align          : left;
}
.single-post-content .has-text-align-right{
	text-align          : right;
}
.single-post-content ul{
	list-style-type     : disc;
	padding-left        : 32px;
}
.single-post-content ol{
	list-style-type     : decimal;
	padding-left        : 32px;
}
.single-post-content li{
	margin              : 0.5em 0;
	text-align          : justify;
}
.single-post-content a{
	color               : #A22626;
	text-decoration     : underline;
}
.single-post-content em,
.single-post-content strong{
	font-weight         : bolder;
}
.single-post-content blockquote{
	position            : relative;
	margin              : 16px 0;
	padding             : 8px 24px;
	border              : 1px solid #AAAAAA;  /* XD:#555555 */
}
.single-post-content blockquote::before{
	content             : '\f10d';
	font-size           : 40px;
	font-family         : 'Font Awesome 5 Free';
	font-weight         : 900;
	line-height         : 1em;
	color               : #F5F5F5;
	position            : absolute;
	top                 : 12px;
	left                : 16px;
	z-index             : 0;
}
.single-post-content blockquote > *{
	position            : relative;
	z-index             : 1;
}
.single-post-content blockquote cite{
	display             : block;
	margin              : 16px 0;
	font-style          : normal;
	text-align          : right;
	text-decoration     : underline;
}
.single-post-content table{
	margin              : 16px 0;
	max-width           : 100%;
	border-collapse     : collapse;
}
.wp-block-table table td,
.wp-block-table table th{
	white-space         : nowrap;
}
.single-post-content table td,
.single-post-content table th{
	border              : 1px solid #DDDDDD;
	padding             : 5px 10px;
	font-size           : 14px;
	text-align          : center;
}
.single-post-content table th{
	font-weight         : bolder;
	background-color    : #F5F5F5;
}
.single-post-content .wp-block-buttons{
	display             : flex;
	flex-wrap           : nowrap;
	margin              : 40px 0 8px;
}
.single-post-content .wp-block-buttons + .wp-block-buttons{
	margin-top          : 0;
}
.single-post-content .wp-block-buttons .wp-block-button{
	margin-right        : 32px;
	margin-bottom       : 24px;
}
.single-post-content .wp-block-buttons .wp-block-button:last-child{
	margin-right        : 0;
}
.single-post-content .wp-block-button__link:hover,
.single-post-content .is-style-outline .wp-block-button__link{
	display             : flex;
	justify-content     : center;
	align-items         : center;
	padding             : 12px 24px;
	min-width           : 240px;
	max-width           : 100%;
	height              : 100%;
	color               : #555555;
	text-align          : center;
	background          : transparent;
	border              : 1px solid #555555;
	box-sizing          : border-box;
	text-decoration     : none;
	transition          : 0.6s;
}
.single-post-content .wp-block-button__link,
.single-post-content .is-style-outline .wp-block-button__link:hover{
	padding             : 12px 24px;
	color               : #FFFFFF;
	background          : #555555;
	border              : 1px solid #555555;
	text-decoration     : none;
	transition          : 0.6s;
}
@media screen and (max-width: 768px){
	.single-post-content p,
	.single-post-content li{
		text-align      : start;
	}
	.single-post-content blockquote{
		padding         : 8px;
	}
	.single-post-content blockquote::before{
		top             : 8px;
		left            : 12px;
	}
	.single-post-content .wp-block-buttons{
		flex-wrap       : wrap;
		justify-content : center;
	}
	.single-post-content .wp-block-buttons .wp-block-button,
	.single-post-content .wp-block-buttons .wp-block-button:last-child{
		margin-left     : 8px;
		margin-right    : 8px;
	}
}


/* Pagination */
.pagination .screen-reader-text{
	display             : none;
}


/* Share SNS */
.share-sns-wrapper{
	line-height         : 30px;
	text-align          : right;
}
.share-sns-title{
	display             : inline-block;
	margin              : 8px 16px;
	font-size           : 18px;
	font-family         : 'Josefin Slab', 'Noto Serif JP', serif;
	font-weight         : 600;
}
.share-sns-list{
	list-style-type     : none;
	display             : inline-block;
	margin              : 8px 0;
	padding             : 0;
}
.share-sns-list > li{
	position            : relative;
	display             : inline-block;
	margin              : 0 8px;
	padding             : 0;
	width               : 20px;
	height              : 20px;
	text-align          : center;
}
.share-sns-list > li > a::before{
	font-family         : 'Font Awesome 5 Brands';
	font-weight         : 400;
	font-size           : 20px;
	color               : #555555;
}
/* twitter */
.share-sns-list > li > .share-twitter-button::before{
	content             : '\f099';
}
/* facebook */
.share-sns-list > li > .share-facebook-button::before{
	content             : '\f09a';
}
/* LINE */
.share-sns-list > li > .share-line-button::before{
	content             : '\f3c0';
}


/* Adjacent Post */
.adjacent-post{
	display             : flex;
	margin              : 32px auto;
	max-width           : 96vw;
	font-size           : 0;
	border-top          : 1px solid #AAAAAA;
	border-bottom       : 1px solid #AAAAAA;
}
.adjacent-post .next-post,
.adjacent-post .prev-post{
	position            : relative;
	display             : flex;
	align-items         : center;
	padding             : 16px 64px;
	width               : 50%;
	min-height          : 100px;
	font-size           : 14px;
	line-height         : 1.5em;
	text-align          : left;
	transition          : 1.2s;
}
.adjacent-post .next-post{
	padding-right       : 8px;
}
.adjacent-post .prev-post{
	justify-content     : flex-end;
	padding-left        : 8px;
	text-align          : right;
	border-left         : 1px solid #AAAAAA;
}
.adjacent-post .next-post.have-post::before,
.adjacent-post .prev-post.have-post::before{
	content             : '';
	position            : absolute;
	top                 : 50%;
	display             : block;
	width               : 44px;
	height              : 44px;
	transform           : translate(0, -50%);
	transition          : 1.2s;
}
.adjacent-post .next-post::before{
	left                : 8px;
	background          : no-repeat center / contain url('../icon/arrow-left.svg');
}
.adjacent-post .prev-post::before{
	right               : 8px;
	background          : no-repeat center / contain url('../icon/arrow-right.svg');
}
.adjacent-post .next-post:hover::before{
	opacity             : 0.45;
	transform           : translate(-8px, -50%);
}
.adjacent-post .prev-post:hover::before{
	opacity             : 0.45;
	transform           : translate(+8px, -50%);
}
/* for IE 9 */
.adjacent-post .next-post:not(:target),
.adjacent-post .prev-post:not(:target){
	display             : inline-block\0/;
	vertical-align      : middle\0/;
}
@media all and (-ms-high-contrast: none){
	.adjacent-post .next-post:not(:target),
	.adjacent-post .prev-post:not(:target){
		display         : flex\0/;
		vertical-align  : normal\0/;
	}
}
/* for IE 10 */
.adjacent-post .adjacent-post-title{
	display             : block;
	width               : 100%;
}
@media screen and (max-width: 768px){
	.adjacent-post .next-post{
		padding         : 8px 8px 8px 0;
	}
	.adjacent-post .prev-post{
		padding         : 8px 0 8px 8px;
	}
	.adjacent-post .next-post.have-post::before,
	.adjacent-post .prev-post.have-post::before{
		content         : none;
	}
}


/* Breadcrumb List */
.footer-breadcrumbs{
	margin              : 120px 0 24px;
	padding             : 4px 10px;
	font-size           : 12px;
	line-height         : 1.7em;
}
.stillbe-breadcrumbs{
	display             : block;
	margin              : 0 auto;
	max-width           : 96vw;
}
.stillbe-breadcrumbs > li{
	display             : inline-block;
	max-width           : 100%;
	white-space         : nowrap;
	overflow            : hidden;
	text-overflow       : ellipsis;
}
.stillbe-breadcrumbs > li + li::before{
	content             : '\03e';
	padding             : 0 0.5em;
}
@media screen and (max-width: 768px){
	.footer-breadcrumbs{
		margin          : 64px 0 12px;
		font-size       : 10px;
		line-height     : 1.5em;
		background      : #F5F5F5;
	}
}



/* GDPR */
.delete-cookies-gdpr{
	margin              : 0 -16px;
}
.delete-cookies-gdpr button{
	display             : inline-block;
	margin              : 16px;
}
@media screen and (max-width: 768px){
	.delete-cookies-gdpr{
		margin          : 0;
	}
	.delete-cookies-gdpr button{
		display         : block;
		margin          : 8px auto;
	}
}