/* 
	filter:alpha(opacity=50); 半透明IE向け
	-moz-opacity: 0.5; 半透明Firefox向け
	opacity: 0.5;/* 半透明SafariやOpera向け
 */

/* Mac用フォント、Windows用フォント
	游ゴシック: YuGothic, "Yu Gothic"
	游明朝体: YuMincho, "Yu Mincho"
	メイリオ: Meiryo,
	ＭＳ Ｐゴシック: MS PGothic,
	ゴシック体: sans-serif,
	明朝体: serif,
 */

/* 基本 */
body {
	background-color: rgba(255, 255, 255, 255);/* 背景色 */
	background-image: url();/* 背景画像 */
	background-attachment: fixed;/* 背景画像:固定 */
	background-repeat: no-repeat;/* 表示方法:繰り返さない */
	background-position: right bottom; /* 画像位置:右下 */
	margin: 0 auto;/* 内容を中心に */
	overflow: auto;/* はみ出た部分 */
	font-family: YuGothic, "Yu Gothic", Meiryo, sans-serif;/* 文字の種類 */
	font-size: 16px;/* 文字の大きさ */
	letter-spacing: 0.5px;/* 文字の間隔 */
	line-height: 1.1em;;/* 字の上下間隔 */
	color: #161616;
}

a {text-decoration: none;}/* リンク線:無し */
a:link {color: #191970;} /* 未訪問のリンク */
a:visited {color: #4169e1;} /* 訪問済みのリンク */
a:hover {
	color: #b22222;/* ポイント時のリンク */
	position: relative;/* 動かす */
	top: 4px;/* 上からの距離 */
	left: 0px;/* 左からの距離 */
}
a:active {color: #ffffff;}/* 選択中のリンク */

/* 全体真ん中寄せ */
div.all_center {
	background-color: transparent; /* 背景色(透明) */
	width: 70%;
	height: 100%;
	padding: 10px 0px 10px 0px;
	margin: 0 auto; /* 内容を中心に */
}

/* 全体真ん中寄せスマホ版 */
@media screen and (max-width: 600px) {
    div.all_center {
	background-color: #ffffff;
	width: 100%;
	height: 100%;
	padding: 10px 0px 10px 0px;
}
}


/* 上に固定する */
div.top {
	border: 1px #ededed solid;
	font-size: 14px;
	color: #696969;
	background-color: #ffffff;
	padding: 10px;/* 内側の余白 */
	margin: 0px;/* 外側の余白 */
	top: 0px;/* 上からの距離 */
	position: fixed;/* 決まった位置に固定する */
}

/*
特に配置方法を指定しません。
position: static;
相対位置への配置となります。
position: relative
親ボックスの左上が基準位置となります。
position: absolute
スクロールしても位置が固定されたままとなります。
position: fixed;
top：基準の上からの距離
bottom：下からの距離
left：左からの距離
right：右からの距離
*/

/* 分断のち左側 */
div.L {
	border: 0px #ededed solid;
	background-color: #ffffff;
	font-size: 12px;
	width: 60%;
	min-height:100%;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	overflow: auto;
	float: left;
}

/* 分断のち右側 */
div.R {
	border: 0px #ededed solid;
	background-color: #ffffff;
	font-size: 12px;
	width: 40%;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	overflow: auto;
	float: right;
}

/* 画像回り込み */
img.L {
	border: 0px #000000 solid;
	background-color: #ffffff;
	padding: 0px 0px 0px 0px;
	margin: 0px 10px 0px 0px;/* 右側に隙間を */
	float: left;
}

.footer{
  clear: both;
  
}
/*大きい画像でも、スマホ画面の枠から飛び出ないように */
@media only screen and (max-width: 480px) {
    img { max-width: 100%; }
}


/* 画像を真ん中に配置 */
.img_center {
	text-align: center;
	display: block; /* 画像をブロック要素に */
	margin: auto;
	padding: 50px 0px 30px 0px;
}

/* なんでも真ん中に配置 */
.center {
	text-align: center;
	margin: auto;
	padding: 0px 0px 0px 0px;
}



/* 上下に余白 */
.p100 {
	text-align: center;
	padding: 100px 0px 100px 0px;
}

/* 画像リスト横並び */
ul.flex{
	position: relative;/* 位置調整 */
	text-align: right;
	left: 0px; /* ulを右に移動 */
	margin: 0px 0px 0px 0px;
	display: flex;/* 横並び */
	justify-content: flex-end;/* flex用の右寄せ */
	flex-wrap: wrap;
}


/* リストの項目間に隙間を */
li {
	position: relative;/* 位置調整 */
	left: 0px; /* 左に移動 */
	margin-left: 0px;/* 項目の左に隙間を */
	list-style: none;/* リストマーカーの非表示 */
	float: left;
}

/* ボタン */

.btn{
    width:100px;
    height:40px;
    border-width: 1px 1px 1px 1px;/* 上右下左 */
	border-color: #cfcfcf;
    line-height:40px;
    padding: 3px 0px 3px 0px;
}
.btn a{
    display:block;
    width:100%;
    height:100%;
    text-decoration: none;
    background:#ffffff;
    text-align:center;
    border-width: 1px 1px 1px 1px;/* 上右下左 */
    border-color: #777000;
    border-style: dashed;
    color:#696969;
    font-size:18px;
    font-weight:bold;
    border-radius:4px;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
}

/* 枠 */
div.about {
	background-color: ;/* 背景色 */
	border-width: 1px 1px 1px 1px;/* 上右下左 */
	border-color: #cfcfcf;
	border-style: solid;
	font-size: 16px;
	letter-spacing: 0.00em;/* 字の横間隔 */
	line-height: 1.2em;/* 字の上下間隔 */
	color: #404040;
	font-family: YuMincho, "Yu Mincho", Meiryo, sans-serif;
	width: 500px;
	height: 100%;
	padding: 12px 12px 12px 12px;/* 枠内の余白 */
}

/* 枠スマホ版 */
@media screen and (max-width: 600px) {
	div.about {
	border-width: 1px 1px 1px 1px;
	border-color: #cfcfcf;
	border-style: solid;
	font-size: 16px;
	letter-spacing: 0.00em;
	line-height: 1.2em;
	color: #404040;
	font-family: YuMincho, "Yu Mincho", Meiryo, sans-serif;
	width: 350px;
	height: 100%;
	padding: 12px 12px 12px 12px;/* 枠内の余白 */
}
}

/* 小説枠 */
div.novel_menu {
	border-width: 1px 1px 1px 1px;
	border-color: #696969;/* 枠の色 */
	border-style: dashed;
	background-color: #ffffff;/* 背景色 */
	font-size: 14px;
	font-family: auto;
	letter-spacing: 0.02em;/* 字の横間隔 */
	line-height: 1.4em;/* 字の上下間隔 */
	width: 400px;
	height: 130px;
	padding: 6px 6px 6px 6px;
	margin: 0px 0px 20px 10px;
}

/* 小説枠スマホ版 */
@media screen and (max-width: 600px) {
div.novel_menu {
	border-width: 1px 1px 1px 1px;
	border-color: #696969;/* 枠の色 */
	border-style: dashed;
	background-color: #ffffff;/* 背景色 */
	font-size: 14px;
	font-family: auto;
	letter-spacing: 0.02em;/* 字の横間隔 */
	line-height: 1.4em;/* 字の上下間隔 */
	width: 400px;
	height: 130px;
	padding: 6px 6px 6px 6px;
	margin: 20px 0px 20px 4px;
}
}

/* 小説リンクタイトル */
.novel_l_title {
	font-size: 18px;
	color: #696969;
	font-weight: bold;/* 太字 */
	letter-spacing: 0.5px;/* 文字の間隔 */
	line-height: 1em;/* 字の上下間隔 */
	margin: 6px 0px 10px 0px;/* 枠外の余白 */
}

/* 小説タグリスト＋小説内上部 */
.novel_tag {
	font-size: 12px;
	color: #696969;
	background: #ffffff;
	border: 0px dashed #808080;
	letter-spacing: 0.02em;/* 字の横間隔 */
	line-height: 1.2em;/* 字の上下間隔 */
	padding-left: 2px;
	margin: 0px 0px 0px 0px;
	list-style-type: none;/* リストマーカーの非表示 */
	display: flex;/* 横並び */
	flex-wrap: wrap;
}

/* 小説あらすじ */
.novel_about {
	font-size: 13px;
	color: #232323;
	margin: 8px 0px 0px 0px;/* 枠外の余白 */
}

/* 小説ページ枠 */
div.novel_page {
	/*background-image: url("");*/
	background-color: #ffffff;/* 背景色 */
	border-width: 1px 1px 1px 1px;/* 上右下左 */
	border-color: #cfcfcf;
	border-style: solid;
	font-size: 18px;
	color: #060606;
	/* font-family: YuMincho, "Yu Mincho", Meiryo, sans-serif; */
	letter-spacing: 0.05em;/* 字の横間隔 */
	line-height: 1.8em;/* 字の上下間隔 */
	width: 80%;
	height: 100%;
	padding: 14px 40px 4px 40px;/* 枠内の余白 */
	margin: 0 auto;/* 内容を中心に */
	white-space: pre-wrap;/* 改行そのまま＆折り返し */
	/* word-wrap: break-word; 単語が途切れないように折り返し */
}


/* 小説ページ枠スマホ版 */
@media screen and (max-width: 600px) {
div.novel_page {
	/*background-image: url("");*/
	background-color: #ffffff;/* 背景色 */
	border-width: 1px 1px 1px 1px;/* 上右下左 */
	border-color: #cfcfcf;
	border-style: solid;
	font-size: 16px;
	color: #404040;
	/* font-family: YuMincho, "Yu Mincho", Meiryo, sans-serif; */
	letter-spacing: 0.05em;/* 字の横間隔 */
	line-height: 1.8em;/* 字の上下間隔 */
	width: 80%;
	height: 100%;
	padding: 14px 30px 4px 30px;/* 枠内の余白 */
	margin: 0 auto;/* 内容を中心に */
	white-space: pre-wrap;/* 改行そのまま＆折り返し */
	/* word-wrap: break-word; 単語が途切れないように折り返し */
}
}


/* 大きいタイトル */
.big_title {
	font-size: 32px;
	color: #696969;
	font-family: YuMincho, "Yu Mincho", serif;
	padding: 10px 10px 10px 10px;/* 枠内の余白 */
	margin: 40px 0px 0px 0px;/* 枠外の余白 */
}

/* 中くらいタイトル＋上に空間あり*/
.medium_title {
	font-size: 24px;
	color: #696969;
	font-family: YuMincho, "Yu Mincho", serif;
	letter-spacing: 0.03em;/* 字の横間隔 */
	line-height: 1.2em;/* 字の上下間隔 */
	padding: 10px 10px 10px 10px;/* 枠内の余白 */
	margin: 40px 0px 0px 0px;/* 枠外の余白 */
}

/* 中くらいタイトル */
.medium_title_f {
	font-size: 24px;
	color: #696969;
	font-family: YuMincho, "Yu Mincho", serif;
	padding: 10px 10px 10px 10px;/* 枠内の余白 */
	margin: 4px 0px 0px 0px;/* 枠外の余白 */
}

/* 次ページへ*/
a.novel_next {
	background: #565656; /* 背景色 */
	line-height: 60px; /* 縦幅 */
	font-size: 16px;
	color: #ffffff;
	font-family: "Yu Gothic", "游ゴシック", "MS Gothic";
	font-weight: bold; /* 太文字 */
	text-align: center; /* 文字を中央に */
    display: block; /* ブロック要素にする */
}

a.novel_next:hover {
	color: #ffffff;
	background-color: #a9a9a9; /* 背景色 */
	position: relative;/* 動かす */
	top: 0px;/* 上からの距離 */
	left: 0px;/* 左からの距離 */
}


/* 付箋タイトル */
div.tag_title {
	border-width: 0px 0px 1px 0px;/* 上右下左 */
	border-color: #696969;/* 線の色 */
	border-style: solid;
	background-color: #ffffff;/* 背景色 */
	font-size: 22px;
	color: #333333;
	width: 160px;/* 横幅 */
	height: 100%;/* 縦幅 */
	padding: 10px 0px 6px 10px;/* 枠内の余白 */
	margin: 40px 0px 0px 2px;/* 枠外の余白 */
}

/* 歌用アコーディオン */
.accordion {
    padding: 1rem;
}

.accordion-item {
    margin-bottom: 0.5rem;
}

.accordion-check {
    display: none;
}

.accordion-label {
    position: relative;
    display: block;
    cursor: pointer;
    padding: 0.5rem;
    border-left: 40px solid #333;
    background-color: #efefef;
    color: #333;
    font-size: 1rem;
    line-height: 1.5;
}

.accordion-label::before {
    position: absolute;
    top: 50%;
    left: -40px;
    height: 100%;
    width: 40px;
    transform: translateY(-50%);
    color: #fff;
    text-align: center;
    font-size: 1.5rem;
    content: '+';
}

.accordion-box {
    height: 0;
    overflow: hidden;
    opacity: 0;
    background-color: #fff;
    transition: all .5s;
}

.accordion-check:checked~.accordion-box {
    height: auto;
    opacity: 1;
    padding: 1rem;
}

.accordion-check:checked+.accordion-label:before {
    content: '-';
}

.accordion-box p {
    line-height: 1.5;
}
/* アコーディオン終わり */