/*
 Theme Name:	 Twenty Fifteen Child
 Description:	Twenty Fifteen Child Theme
 Template:		 twentyfifteen
*/

/* Use Colors 

 Color01:#4F5E6A / MainColumn
 Color04:#C7AF90 / MenuColumn
 Color03:#D7CABF / 
 Color02:#6A7B66 / Accsent
 Color05:#DD7C44 / Accsent
 
 IconColor01:#4492DD / Blue
 IconColor02:#DD446E / Pink
 IconColor03:#DD6E44 / Orange
 IconColor04:#8344DD / Purple
 IconColor04:#44CC6E / Green
*/

:root {
	--red: #DA2C4D;
	--yellow: #F8AB37;
	--green: #2ECC71;
	--white: #FFF;
	--grey-light: #F2F2F2;
	--grey: #EAEAEA;
	--black: #080808;
	--IconColor01:#4492DD; /* Blue */
	--IconColor02:#DD446E; /* Pink */
	--IconColor03:#DD6E44; /* Orange */
	--IconColor04:#8344DD; /* Purple */
	--IconColor05:#44CC6E; /* Green */
}

/* フォント設定 */
@import url('https://fonts.googleapis.com/css?family=Bai+Jamjuree:600&display=swap');
@font-face { font-family: "Yu Gothic M"; src: local("Yu Gothic Medium"); }
@font-face { font-family: "Yu Gothic M"; src: local("Yu Gothic Bold"); font-weight: bold; }

html, body, div, span,
applet, object, iframe,
h1, h2, h3, h4, h5, h6,
p, blockquote, a,
abbr, acronym, address,
big, cite, del,
dfn, em, font, ins, kbd,
q, s, samp, small, strike,
strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label,
legend, table, caption,
tbody, tfoot, thead, tr,
th, td,
.site-description,
.entry-footer	{
	font-family: "游明朝体", YuMincho, "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", Georgia, Times, "Times New Roman", serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
}

/* 見出し */
h1,h2,h3,h4,h5,h6,
.entry-header .entry-title a,
.seriesTitle {
	font-family: -apple-system, BlinkMacSystemFont, "游ゴシック体", YuGothic, "Yu Gothic M", "游ゴシック Medium", "Yu Gothic Medium", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN W3", HiraKakuProN-W3, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "Helvetica Neue", HelveticaNeue, Helvetica, Arial, "Segoe UI", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
}

.seriesTitle {
	color:#AAA;
}

.entry-header .entry-title,
.entry-header .entry-title a {
	color:#555;
}

.entry-header .entry-title::after {
		content: '';
		display: block;
		width: 96px;
		height: 4px;
		margin: 1rem 0 0 0;
		background-color: #555;
}

.entry-content h2 {
	color:#4F604A;
}



/*フォントサイズ*/
.site-description {
	font-size:1.4rem;
}

.entry-content {
	font-size: 1.8rem;
}

/* ヘッダー */
.site-header {
	background-color: #fff;
	padding-top: 3.8461%;
	padding-bottom: 3.8461%;
	border-bottom:none;
}
.site-title a {
	font-family: -apple-system, BlinkMacSystemFont, "游ゴシック体", YuGothic, "Yu Gothic M", "游ゴシック Medium", "Yu Gothic Medium", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN W3", HiraKakuProN-W3, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "Helvetica Neue", HelveticaNeue, Helvetica, Arial, "Segoe UI", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
}

@media screen and (min-width: 77.5em) {
	.site-title {
		font-size: 42px;
		font-size: 4.2rem;
		line-height: 1.1852;
	}
}

@media screen and (min-width: 59.6875em) {
	.site-header {
		margin: 20% 0 10% 0;
	}
}

.social-navigation a[href*="syosetu.com"]::before {
	content: '\f444';
}

/* 投稿情報 */
.byline {
	display: none;} /*「投稿者」を非表示 */
.comments-link {
	display: none;} /*「コメントをどうぞ」「～件のコメント」を非表示 */

/* パンくず */

.breadcrumb {
	padding-left:0;
	margin-left:0;
	margin-bottom:0;
}

.breadcrumb li{
	display:inline;/*横に並ぶように*/
	list-style: none;
	font-weight: bold;/*太字*/
	font-size:16px;
	font-size:1.6rem;
}


.breadcrumb li:after {/* ▶を表示*/
	font-family: "Font Awesome 5 Free";
	content: '\f0da';
	padding: 0 5px;
	color: silver;
}

.breadcrumb li:last-child:after {
	content: '';
}

@media screen and (max-width: 46.25em) {
	.breadcrumb li{
		font-size:14px;
		font-size:1.4rem;
	}
}

/* 小説リスト */
.textList article h3 {
	margin-bottom:2rem;
}

.textList .textList-byline {
	font-size:16px;
	font-size:1.6rem;
	color:rgba(51, 51, 51, 0.7);
	margin-bottom:1.6rem;
}

.textList .textList-byline .posted-on:before {
	top: 6px;
}

.textList ul {
list-style-position: inside;
}

.textList h3.textlist_title_first {
	margin-top:0;
}

/* 小説本文ページ */

.entry-header-byline {
	margin-bottom:0.5rem;
}

.entry-header-byline .seriesTitle {
	font-weight: bold;
}

.endmark {
	margin-top:6em;
	font-weight: bold;
}

.entry-footer-icon {
	margin-bottom:0.5rem;
}

.update_log {
	margin-top:4em;
	font-size:16px;
	font-size:1.6rem;
	color:rgba(51, 51, 51, 0.7);
}

.update_log a {
	color:#888;
	border-bottom:#888 1px solid;
}

/* 投稿 */
.entry-footer {
	font-size: 16px;
	font-size: 1.6rem;
}

.entry-footer .posted-on,
.entry-footer .cat-links,
.entry-footer .tags-links,
.entry-footer .comments-link,
.entry-footer .entry-format,
.entry-footer .edit-link,
.entry-footer .full-size-link {
	display: block;
}

.entry-footer .posted-on:before,
.entry-footer .cat-links:before,
.entry-footer .tags-links:before,
.entry-footer .comments-link:before,
.entry-footer .entry-format:before,
.entry-footer .edit-link:before,
.entry-footer .full-size-link:before {
	top: 4px;
}

.entry-footer .byline {
	display: none;
}


/* BlockEditor */

.wp-block-code {
	background-color:#fcfcfc !important;
	padding:1rem !important;
}


/* Modules */

.modIcon01 {
	margin: 0 1rem 0 0;
	padding:2px 0.5em;
	text-align:center;
	color:#fff;
	background-color:#999999;
	font-size:14px;
	font-size:1.4rem;
}

.modIcon01_blue {
	background-color:var(--IconColor01);
}

.modIcon01_pink {
	background-color:var(--IconColor02);
}

.modIcon01_purple {
	background-color:var(--IconColor04);
}

.modIcon01_orange {
	background-color:var(--IconColor03);
}

.modIcon01_green {
	background-color:var(--IconColor05);
}

.modName01 {
	font-weight: 700;
}

.modName01_blue {
	color:var(--IconColor01);
	font-weight: 700;
}
.modName01_green {
	color:#44CC6E;
	font-weight: 700;
}

ul.modUl01 {
	margin:2rem 0 0 0;
	padding:1rem 2rem;
	width: 100%;
	overflow: hidden;
	font-size:16px;
	font-size:1.6rem;
	background-color:#FAFAFA
}

ul.modUl01 li {
	padding:0.6rem 2rem;
	width: 100%;
	overflow: hidden;
	background-color:#FAFAFA;
	border-top: 1px solid #DDD;
	box-sizing: border-box;
}

ul.modUl01 li a {
	font-weight:700;
	border-bottom:0;
}

ul.modUl01 li:first-child {
	border:0;
}

dl.modDl01 {
	margin:2rem 0 0 0;
	padding:1rem 2rem;
	width: 100%;
	overflow: hidden;
	font-size:16px;
	font-size:1.6rem;
	background-color:#FAFAFA
}

dl.modDl01 a {
	font-weight:700;
	border-bottom:0;
}

.modDl01 dt{
	width: 12rem;
	float: left;
	padding: 0.5rem 0 0.3rem 0;
	border-top: 1px solid #DDD;
	box-sizing: border-box;
	font-weight:400;
	color: rgba(51, 51, 51, 0.7);
}

.modDl01 .posted-on:before {
	top: 7px;
}

.modDl01 dd{
	margin:0 0 0 10rem;
	padding: 0.5rem 0 0.3rem 0;
	border-top: 1px solid #DDD;
}

.modDl01 dd p {
	margin:0;
}

.modDl01 dt:first-child {
	border:0;
}
.modDl01 dt:first-child + dd {
	border:0;
}
.modDl01 dd:after{
	display: block;
	content: "";
	clear: both;
}
.modDl01 dd a {
	border:0;
}

@media screen and (max-width: 46.25em) {
	.modDl01 dt{
		padding:bottom:0;
		width: 100%;
		float: none;
	}
	.modDl01 .posted-on:before {
	top: 6px;
	}
	.modDl01 dd{
		border:0;
		padding:0 0 0.5rem 0;
		margin-left: auto;
		border-left: none;
	}
}








/* #Progress
================================================== */

.progress-wrap {
	position: fixed;
	right: 40px;
	bottom: 40px;
	height: 46px;
	width: 46px;
	cursor: pointer;
	display: block;
	border-radius: 50px;
	box-shadow: inset	0 0 0 2px rgba(255,255,255,0.2);
	z-index: 10000;
	opacity: 0;
	visibility: hidden;
	transform: translateY(15px);
	-webkit-transition: all 200ms linear;
	transition: all 200ms linear;
}

@media screen and (max-width: 46.25em) {
	.progress-wrap {
		right: 20px;
		bottom: 20px;
		height: 46px;
		width: 46px;
	}
}
.progress-wrap.active-progress {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.progress-wrap::after {
	position: absolute;
	font-family: "Genericons" !important;
	content: '\f432';
	text-align: center;
	line-height: 46px;
	font-size: 24px;
	font-qwight:normal;
	color: var(--grey);
	left: 0;
	top: 0;
	height: 46px;
	width: 46px;
	cursor: pointer;
	display: block;
	z-index: 1;
	-webkit-transition: all 200ms linear;
	transition: all 200ms linear;
}
.progress-wrap:hover::after {
	opacity: 0;
}
.progress-wrap::before {
	position: absolute;
	font-family: "Genericons" !important;
	content: '\f432';
	text-align: center;
	line-height: 46px;
	font-size: 24px;
	font-qwight:normal;
	opacity: 0;
	background-image: linear-gradient(298deg, var(--red), var(--yellow));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	left: 0;
	top: 0;
	height: 46px;
	width: 46px;
	cursor: pointer;
	display: block;
	z-index: 2;
	-webkit-transition: all 200ms linear;
	transition: all 200ms linear;
}
.progress-wrap:hover::before {
	opacity: 1;
}
.progress-wrap svg path { 
	fill: none; 
}
.progress-wrap svg.progress-circle path {
	stroke: var(--grey);
	stroke-width: 4;
	box-sizing:border-box;
	-webkit-transition: all 200ms linear;
	transition: all 200ms linear;
}