/* designed by Romeo(http://www43.tok2.com/home/rome0/) */

@import url('https://fonts.googleapis.com/css2?family=Comfortaa&display=swap');
@import url('https://fonts.googleapis.com/css?family=Questrial');

/* --------全体-------- */

html,body {
	margin: 0;
	width: 100%;
	height: auto;
	font-size: 15px;
    color: #4A4340;
font-family: 'メイリオ', 'ヒラギノ角ゴ', sans-serif;
}

h1,h2 {
	font-weight: normal;
}


/* --------コンテンツ-------- */

#wrapper {
	z-index: 1;
	width: 50%;
	padding: 5% 0;
	margin: 0 auto;
}


/* --------ヘッダー-------- */

#header {
	padding: 0;
	margin-bottom: 70px;
	font-family: 'Comfortaa', sans-serif;


}


/* --------ヘッダー/タイトル-------- */

h1 {
	font-size: 25px;
    color: #404040;
    font-family: 'Questrial', sans-serif;
	letter-spacing: 3px;
	display: inline-block;
	margin-bottom: 3px;
}

#url {
	font-size: 16px;
	vertical-align: 8px;
	letter-spacing: 1px;
	display: inline-block;
}


/* --------ヘッダー/メニュー-------- */

#menubr {
	margin: 10px 0 10px 0;
	padding: 0;
	list-style-type: none;
	list-style-position: outside;
	font-size: 23px;
    text-align: right;
    letter-spacing: 3px;
    font-family: 'Questrial', sans-serif;
}

#menubr li {
    display: inline-block;
    margin-right: 15px;
}

#menubr li a {
    text-decoration: none;
    color: #5a5a5a;
    position: relative;
    display: inline-block;
}

#menubr li a:after {
    position: absolute;
    bottom: -4px;
    left: 0;
    content: '';
    width: 100%;
    height: 2px;
    background: #999;
    transform: scale(0, 1);
    transform-origin: center top;
    transition: transform .3s;
}

#menubr li a:hover::after {
    transform: scale(1, 1);
}

#menubr li.here {
    color: #5a5a5a;
}


/* --------本文-------- */

h2 {
	font-family: 'Comfortaa', sans-serif;
	letter-spacing: 3px;
	font-size: 22px;
	margin-bottom: 30px;
}

h3,h4,h5,.contentsNav {
    font-weight: normal;
}

h3 {
    display: flex;
    align-items: center;
    font-family: 'Questrial', sans-serif;
    font-size: 1.4rem;
    font-weight: normal;
    letter-spacing: 3px;
}

h3::before {
    content: '';
    display: inline-block;
    width: 4px;
    height: 1.5em;
    margin-right: 1em;
    background: #bbb;
    border-radius: 3px;
}

h4 {
    display: flex;
    align-items: center;
    font-size: 1.1rem;
    font-weight: normal;
    font-family: 'Questrial', sans-serif;
    letter-spacing: 3px;
    margin: 2em 0;
}

h4 > span {
    margin: 0 2em;
}

h4::before, h4::after {
    content: '';
    display: block;
    height: 1px;
    background-color: #B1B2B5; 
}

h4::before {
    flex-basis: 3em;
}

h4::after {
    flex-grow: 1;
}

h5 {
    display: flex;
    align-items: center;
    font-family: 'メイリオ', 'ヒラギノ角ゴ', sans-serif;
    font-size: 1.3rem;
    font-weight: normal;
    letter-spacing: 0.2em;
    margin-bottom: 50px;
}

h5::before {
    content: '';
    display: inline-block;
    width: 4px;
    height: 1.5em;
    margin-right: 1em;
    background: #bbb;
    border-radius: 3px;
}


p {
	padding: 0 10px;
	letter-spacing: 0.2em;
	line-height: 170%;
	margin-bottom: 10px;
    font-size: 13px;
    font-family: 'メイリオ', 'ヒラギノ角ゴ', sans-serif;
}

a {
	text-decoration: none;
	color: #bbbbbb;
	transition: color 0.2s ease 0s;
}

a:hover {
	text-decoration: none;
	color: #626262;
}


/* --------更新履歴-------- */
.log {
     position: relative;
     width: 750px;
     padding: 5px 10px 5px 5px;
     margin-left: 20px;
     margin-right: 20px;
     margin-bottom: 30px;
     letter-spacing: 3px;
     box-sizing: border-box;
     font-size: 12px;
     line-height: 1.6;
     max-width: 90%;
     font-family: 'メイリオ', 'ヒラギノ角ゴ', sans-serif;
}

.log ul {
     height: 90px;
     padding: 0 1em;
     box-sizing: border-box;
     overflow-y: auto;
     scrollbar-width: thin;
     transition: .8s;
     margin-block-start: 0em;
}

.log ul a {
     text-decoration: none;
	 color: #626262;
	 transition: color 0.2s ease 0s;
}

.log ul a:hover {
     text-decoration: none;
	 color: #cfcfcf;
}

.log ul::-webkit-scrollbar {
     width: 5px;
     background: #f0f0f0;
}

.log ul::-webkit-scrollbar-thumb {
     background: #cdcdcd;
}

.log li {
     display: flex;
     margin: 2px 0;
}

.log li:not([class])::before {
     content: '';
     flex-grow: 1;
     order: 1;
     width: 2em;
     height: .5em;
     padding: 1em 1em 0;
     margin: 0 1em;
     border-bottom: #bbbbbb dashed 1px;    
     box-sizing: border-box;
}

.log li > span {
     order: 2;
}

.more {
     justify-content: flex-end;
     padding: 5px;
}


/* --------注目ボックス-------- */
.box0 {
     font-size: 0.85em;
     font-family: 'メイリオ', 'ヒラギノ角ゴ', sans-serif;
     letter-spacing: 3px;
     line-height: 1.6;
     margin: 1.0em 0em 1.0em 0em;/* 要素の外側の余白 */
     padding: 0.5em 1.0em 0.5em 1.0em;/* 要素の内側の余白 */
     border-radius: 7px;
     border:1px solid #cdcdcd;
     background:url('../img/bg_b01_20.gif');
    
}

ul,ol {
     list-style: none;
}


#noveltitle {
    margin: 0 0 0 0;
	padding: 0 0 0 50px;
	list-style-type: none;/* マーカーを消す */
	letter-spacing: 0.2em;
	line-height: 1.8em;
    font-size: 13px;
	font-family: 'メイリオ', 'ヒラギノ角ゴ', sans-serif;
    text-align: left;
}

#noveltitle li {
    margin-right: 15px;
}

#noveltitle li a {
	text-decoration: none;
	color: #5a5a5a;
	position: relative;
}

#noveltitle li a:after {
    position: absolute;
    bottom: -1px;
    left: 0;
    content: '';
    width: 100%;
    height: 2px;
    background: #999;
    transform: scale(0, 1);
    transform-origin: center top;
    transition: transform .3s;
}

#noveltitle li a:hover::after {
	transform: scale(1, 1);
}

.sizecolor {
    font-size:0.8em;
    color: #50c0c7;
}

.sizecolor1 {
    color: #fc8785;
}

.sizecolor2 {
    font-size:0.9em;
    color: 	#D62845;
}

/* --------小説-------- */

main.text {
    width: 100%;
    }

main.text p {
    padding: 0 30px;
    margin: 0px 0px 1px 0px; 
    font-size: 0.95em;
    line-height: 190%;
    letter-spacing: 0.2em;
    color: #464646;
    font-family: 'メイリオ', 'ヒラギノ角ゴ', sans-serif;
}

.atogaki::before {
    content: '';
    display: block;
    height: 2px;
    margin: 10em 0 2em;
    background: url('../img/6.png') ; 
}

/* 小説内 ダッシュ三点リーダーつなげる */
.ds {
    letter-spacing: -1px;
}


.textNav ul {
    display: flex;
    justify-content: left;
    align-items: center;
    margin: 5vh 0 0 0;
    font-family: 'Questrial', sans-serif;
    letter-spacing: 0.2em;
    font-size: 0.9em;
    padding: 0px 1px 0px 1px;
}

.textNav li {
    margin: 0 1em;
}

.textNav li a {
    display: inline-block;
    padding: 3px .5em;
    color: #5c5650;
}

.textNav li a:hover {
	text-decoration: none;
	color: #999;
}


/* --------トップへ戻るナビゲーション-------- */

.pagetop{
     position: fixed;
     bottom: 10px;
     right: 14px;
}
 
.pagetop a{
     display: block;
     text-decoration: none;
}
 
.pagetop:hover{
     opacity: 0.7 ;
}


/* ---------クレジット/削除の際はリンクページ等からRomeoへのリンクをお願いします--------- */

#foot {
	 font-size: 14px;
	 letter-spacing: 1px;
	 color: #7a7a7a;
	 text-align: right;
	 width: 44%;
	 padding: 0 10px;
	 margin: 0 auto 30px auto;
}

#foot a {
	 text-decoration: none;
	 color: #bbbbbb;
	 transition: color 0.2s ease 0s;
}

#foot a:hover {
	 text-decoration: none;
	 color: #626262;
}









/* -----------------スマホ用----------------- */

@media screen and (max-width:699px) {
	
	#wrapper {
		padding-top: 40px;
		width: 92%;
font-family: 'メイリオ', 'ヒラギノ角ゴ', sans-serif;
	}
	
	#header {
		margin-bottom: 50px;
	}
	
	h1 {
		line-height: 95%;
		margin-bottom: 10px;
	}
	
	#url {
		font-size: 22px;
	}
	
	#menubr {
		font-size: 21px;
	}
	
	#menubr li {
		margin-right: 5px;
	}
	
	h2 {
		font-size: 23px;
	}
	
	p {
		font-size: 13px;
		line-height: 160%;
font-family: 'メイリオ', 'ヒラギノ角ゴ', sans-serif;
	}
	
	#foot {
		width: 92%;
		font-size: 15px;
	}

main.text p {
    font-family: 'メイリオ', 'ヒラギノ角ゴ', sans-serif;
}




}