@charset "utf-8";

/*-------------------------------------------------------------- 
レイアウト追加要素
-------------------------------------------------------------- */

/* リンク設定 - 追加
------------------------------------------------------------*/
a:hover img{
	opacity:0.7; /*透明度指定*/
	-moz-opacity:0.7;
	filter:alpha(opacity=70);
	background-color:#fff; /*背景に白地*/
}

/* スムーズスクロール */
html{scroll-behavior:smooth;}


/**************************
　ヘッダー - 追加
**************************/

/* カウンター - 右寄せ */
.count{
	max-width:100%;
	height:auto;
	text-align:right;
	vertical-align:top;
	padding:0;
	margin:0;
}
/* HTML位置
<a name="pagetop"></a>の下、<header id="header">の外 */

/* いいね！・ランキングボタン - 単独常駐ver */
.info-alone{
	position:fixed;
	top:0px;
	right:0px;
	width:100%;
	height:auto;
	text-align:right;
	background-color:;
	padding:10px 10px 5px;
}
/* スマートフォン 横(ランドスケープ) */
@media only screen and (max-width:640px){
.info-alone{background-color:rgba(255,255,255,0.8); margin-bottom:65px;}
span.button {display:block; font-size:medium;}
}


/**************************
　汎用ボタン - 各種
**************************/
span.button {display:inline-block; font-size:small;}

/* 白ボタン */
.button0 {
	border:1px solid #c0c0c0;
	border-radius:2px;
	background:linear-gradient(#fff, #f5f5f5);/*上・下*/
	color:#333;
	text-align:center;
	font-weight:normal;
	text-transform:uppercase;
	text-decoration:none;
	text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
	padding:5px 20px;
}
a.button0:link{/* テキストリンクカラー */
	color:#333;
}
a.button0:hover {/* ホバー */
	color:#888;
	box-shadow:0px 0px 1px 1px rgba(0, 0, 0, .3) inset;/*左・上・右・下*/
}
a.button0:active {/* クリック */
 	background:#d3d3d3;
	box-shadow:1px 1px 0px 0px rgba(0, 0, 0, .3) inset;/*左・上・右・下*/
	text-shadow: 0 1px 1px rgba(255, 255, 255, .5);
}
a.button0:before{/* アイコン */
	content:url("../img/close.gif");
	vertical-align:middle;
	margin:auto 8px auto -5px;/* テキスト左側に余白 */
}

/* 碧ボタン */
.button1 {
	border:1px solid #00ffff;
	border-radius:2px;
	background:linear-gradient(#ccffff, #009999);/*上・下*/
	color:#fff;
	text-align:center;
	font-weight:normal;
	text-transform:uppercase;
	text-decoration:none;
	text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
	padding:5px 20px;
}
a.button1:link{/* テキストリンクカラー */
	color:#fff;
}
a.button1:hover {/* ホバー */
	box-shadow:0px 0px 1px 1px #ccffff inset;/*左・上・右・下*/
	text-shadow: 0 1px 1px rgba(255, 255, 255, .5);
}
a.button1:active {/* クリック */
	background:#009999;
	box-shadow:0px 0px 0px 0px #000 inset;/*左・上・右・下*/
	text-shadow: 0 1px 1px rgba(255, 255, 255, .5);
}
a.button1:before{/* アイコン */
	content:url("../img/point.png");
	vertical-align:middle;
	margin:auto 8px auto -5px;/* テキスト左側に余白 */
}

/* 白枠+碧縁ボタン */
.button2 {
	border:1px solid #009999;
	border-radius:2px;
	background-color:#fff;
	color:#;/* common.css共通カラー */
	text-align:center;
	font-weight:normal;
	text-transform:uppercase;
	text-decoration:none;
	padding:5px 20px;
}
a.button2:link{/* テキストリンクカラー */
	color:#;/* common.css共通カラー */
}
a.button2:hover {/* ホバー */
	border:1px solid #00ffff;
	background-color:#33cccc;
	color:#fff;
}
a.button2:active {/* クリック */
 	background-color:#009999;
	text-shadow: 0 1px 1px rgba(255, 255, 255, .5);
}
a.button2:before{/* アイコン */
	content:url("../img/point.png");
	vertical-align:middle;
	margin:auto 8px auto -5px;/* テキスト左側に余白 */
}


/**************************
　メイン コンテンツ - 追加
**************************/

/* 表題 */
h4.group{
	font-weight:normal;
	line-height:18px;
	color:#333;
}
h4.group:before {content: "■" }

/* リストマーク */
ol, ul.ht{margin-left:1em; padding:auto; list-style:disc;}/*黒丸*/

/* 画像縁取り - 影 */
img.frame,#gallery img{
	border:4px solid #fff;
	box-shadow:0 0 2px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow:0 0 2px rgba(0, 0, 0, 0.5);
}

/* パンくずリスト */
nav.now {font-size:12px; padding:; margin:5px auto;}

/* 日付表記の分だけ内容文をぶら下げ */
ul.date li{
	padding-left:7em;/* ぶら下げ側 */
	text-indent:-7em;/* ぶら下がり側 */
}/* ↑必ず同数値で指定 */

/* ページ上部へ戻るボタン - 常駐 */
.gotop {
	position:fixed;
	bottom:10px;
	right:10px;
}
.gotop img{
	opacity:0.6; /*透明度指定*/
	-moz-opacity:0.6;
	filter:alpha(opacity=60);
}
.gotop a:hover img{/*画像ロールオーバー*/
	opacity:0.9;
	-moz-opacity:0.9;
	filter:alpha(opacity=90);
	background-color:transparent; /*背景は透明*/
}
/* スマートフォン 横(ランドスケープ) */
@media only screen and (max-width:640px){
.gotop img{width:45px; height:45px;}
}

/* インラインフレーム外枠 - ifreamに指定 */
div.book{
	overflow:hiddin;
	-webkit-overflow-scrolling:touch;
}


/**************************
　グリッド - 追加
**************************/

/* 高さ制限付きボックス - スクロール有・枠線有 */
.roll{
	height:15em;
	overflow:auto;
	border:1px solid #ebebeb;
}

/* 高さ制限付きボックス - スクロール有・枠線無 */
.rollz{
	height:15em;
	overflow:auto;
	border:none;
}

/* 高さ制限付きボックス - はみ出し切り捨て */
.rollx{
	height:15.3em;
	overflow:hidden;
}


/**************************
　テーブル - 追加
**************************/

/* リンク表・バナー有 */
table.link{
width:100%;
margin:5px auto 15px auto;
}
table.link th,table.link td{/*区切り罫線*/
border-bottom:1px dashed #ddd;
vertical-align:middle;
}
table.link td{/*表記側*/
padding:5px 10px;
}
table.link th{/*バナー側*/
table-layout:fixed;
width:210px;
height:auto/*50px*/;
text-align:center;
padding:10px;
}
table.link th img{/*バナー画像*/
display:block;
margin:0 auto;
max-width:200px;
max-height:200px;
}
/* リンクバナー サイズ統一 */
img.banner200-40{max-width:200px; max-height:40px;}/*規格サイズ*/
img.banner200{max-width:200px; height:auto;}/*幅のみ限定*/
img.banner40{max-height:40px; width:auto;}/*高さのみ限定*/

/* スマートフォン 横(ランドスケープ) */
@media only screen and (max-width:640px){
table.link th{border-bottom:none;}/*th(バナー側)の罫線を非表示*/
.link th,.link td {display:block; width:100%;}/*縦に分割*/
.link {width:80%;}/*外側に余白*/
}


/**************************
　リスト - 追加
**************************/

/* リンク表・アイコン整列 */
#links .range ul{margin:5px auto 15px auto;}

#links .range li{
vertical-align:baseline;
list-style:none;
display:inline-block;
}

/* SNSシェア・アイコン整列 */
.annex{
background:transparent;/*背景透過*/
margin:10px auto 20px;
}
.annex ul{
margin:auto;
text-align:center;
}
.annex li{
padding:0 5px;
margin-bottom:3px;
list-style:none;
border-bottom:0;
display:inline-block;
}
.bo li{border-right:1px solid #eee;}/*アイコンごと区切り線*/

/* スマートフォン 横(ランドスケープ) */
@media only screen and (max-width:640px){
.annex ul img{max-width:90%; height:auto;}
}


/**************************
　別窓ページ専用
**************************/

/* 更新情報・お知らせ */
#news {
overflow:hidden;
width:95%;
padding:10px;
margin:0 auto;
}

/* 一覧表テーブルの余白 */
#news table{margin:10px 10px 20px;}

/* 日時表記の余白 */
#news table time{margin-right:15px;}

/* テキスト指定 */
#news article p {font-size:; padding:5px; margin-top:10px;}

/* 見出しプレート */
#news h4.plate {
	display:block;
	text-decoration:none;
	text-align:;
	color:#fff;
	font-weight:bold;
	font-size:;
	text-shadow:0 -1px 0 #999;/* テキストの影 */
	padding:5px 10px 3px;/* ボタン内の余白 */
	border-radius:3px;/* ボタンの丸み */
}

#news h4 time{font-weight:normal; margin-left:0.5em;}
#news h4 time:before {content: "｜" }
#news h4 time:after {content: "" }/*日付表記の枠*/

h4.azure {/*青緑*/
	background-color:#058ba9;	/* グラデ無効時のベースカラー */
	background-image:-webkit-linear-gradient(top, #92cddb, #058ba9);/* グラデFF */
	background-image:linear-gradient(to bottom, #92cddb, #058ba9);/* グラデIE */
	box-shadow:1px 1px 0 #9ddded inset;	/* ハイライト */
	border:solid 1px #058ba9;	/* ボタンの影 */
}
h4.blue {/*青*/
	background-color:#87ceeb;	/* グラデ無効時のベースカラー */
	background-image:-webkit-linear-gradient(top, #87ceeb, #409ecc);/* グラデFF */
	background-image:linear-gradient(to bottom, #87ceeb, #409ecc);/* グラデIE */
	box-shadow:1px 1px 0 #9ddded inset;	/* ハイライト */
	border:solid 1px #87ceeb;	/* ボタンの影 */
}
h4.red{/*赤*/
	background-color:#dc143c;	/* グラデ無効時のベースカラー */
	background-image:-webkit-linear-gradient(top, #dc143c, #800000);/* グラデFF */
	background-image:linear-gradient(to bottom, #dc143c, #800000);/* グラデIE */
	box-shadow:1px 1px 0 #ef857d inset;	/* ハイライト */
	border:solid 1px #dc143c;	/* ボタンの影 */
}
h4.gold{/*黄*/
	background-color:#ffd700;	/* グラデ無効時のベースカラー */
	background-image:-webkit-linear-gradient(top, #ffd700, #f39800);/* グラデFF */
	background-image:linear-gradient(to bottom, #ffd700, #f39800);/* グラデIE */
	box-shadow:1px 1px 0 #fff799 inset;	/* ハイライト */
	border:solid 1px #ffd700;	/* ボタンの影 */
}

/* ページトップへ */
#pagetop {
	background-color:rgba(255,255,255,0.8);/* 半透明指定 */
	padding:3px;/* 余白 */
	border-radius:3px;/* 外枠の丸み */
	margin:0px 10px;
	position:fixed;/* 位置固定 */
	bottom:2px;
	right:2px;
}
#pagetop a:link { text-decoration:none; color:#;}
#pagetop a:hover { text-decoration:none; color:#;}

/* ウィンドウを閉じる */
#close {
	background-color:rgba(255,255,255,0.8);	/* 半透明指定 */
	padding:3px;/* 余白 */
	border-radius:3px;/* 外枠の丸み */
	margin:0px 10px;
	position:fixed;/* 位置固定 */
	top:2px;
	right:2px;
}
#close a:link { text-decoration:none; color:#;}
#close a:hover { text-decoration:none; color:#;}

.icon { display:inline-block; vertical-align:middle; margin-right:5px; }

/* スマートフォン 横(ランドスケープ) */
@media only screen and (max-width:640px){
#news table th,td {display:block; width:100%;}/*縦割り*/
#news table {font-size:; border-spacing:0px 10px;}/*行間余白*/
}

/**************************
　テキスト効果 - 追加
**************************/

/* 注釈 - 汎用 */
span.tag{
padding:auto 5px;
font-size:11px;
color:#999;
display:inline-block;
}
.sp{padding-left:1em;}/*左に余白*/

/* 注釈 - index専用 */
p.tag{
padding:10px 5px 5px;
text-align:right;
font-size:11px;
color:#999;
}/

/* 強調 - 太字 */
span.point{display:inline; font-weight:bold;}
span.point:after { content:""; clear:both;}

/* 更新 - 赤 */
span.new{display:inline; padding-left:5px; font-weight:bold; color:#ff0000;}
span.new:after { content:""; clear:both;}

/* 警告文 - 赤 */
span.notice{display:inline; font-weight:bold; color:#ff0000;}
span.notice:after { content:""; clear:both;}


/* ネタバレ折畳 */
span.turn{display:none;}/*コンテンツ非表示指定*/
input[type="checkbox"]:checked~span.turn{display:inline-block;}/*非表示→表示*/

#swich,#swich1,#swich2,#swich3,#swich4,#swich5,#swich6,#swich7,#swich8,#swich9,
#swich10,#swich11,#swich12,#swich13,#swich14,#swich15,#swich16,#swich17,#swich18,#swich19,
#swich20,#swich21,#swich22,#swich23,#swich24,#swich25,#swich26,#swich27,#swich28,#swich29,
#swich30 {display:none;}/*チェックボックス非表示指定・箇所の数だけ必要*/

#non-on {/*間接ver*/
	display:inline-block;
	margin:0;
	padding:0;
}
#non-on1 {/*画像ver*/
	display:inline-block;
	margin:0;
	padding:0;
}
#non-on1:hover{opacity:0.5;}

#non-on2 {/*テキストリンクver*/
	display:inline-block;
	margin:0;
	padding:0;
	text-decoration:underline;
	color:#009999;/*共通色*/
}
#non-on2:hover{color:#00cccc;}/*共通色*/

#non-on3 {/*テキスト同化ver*/
	display:inline-block;
	margin:0;
	padding:0;
}
#non-on3:hover{color:#00cccc;}/*共通色*/
/* HTMLタグ
<input type="checkbox" id="swich"/>　←適用要素の最初 <span class="turn">ネタバレ内容</span> の上に配置
<label for="swich" id="non-on">ネタバレ開放</label>　←クリックでforと同名のラベルの範囲を開閉
*/


/**************************
　リンクページ専用
**************************/

/* サイト名 - 太字 
p.sitename{font-weight:bold; padding:0 5px 0 0px;}*/

/* 管理者名|ジャンル名 - 区切り */
span.separate:after {content: " | " }

/* リンク分類表記の枠 */
p.sitename span#mark:before {content: "【" }
p.sitename span#mark:after {content: "】" }
p.sitename span#mark{padding:0 0 0 5px;}/*左に共通余白*/

/* 相互 - 橙 */
span.mark1{display:inline; font-weight:bold; color:#ff6600;}
span.mark1:after { content:""; clear:both;}

/* 閉鎖 - 鈍 */
span.mark2{display:inline; font-weight:bold; color:#808080;}
span.mark2:after { content:""; clear:both;}

/* 跡地 - 青 */
span.mark3{display:inline; font-weight:bold; color:#0080c0;}
span.mark3:after { content:""; clear:both;}

/* R指定 - */
span.mark4{display:inline; font-weight:bold; color:#;}
span.mark4:after { content:""; clear:both;}


/* レスポンシブ対応
------------------------------------------------------------*/
/* スマートフォン 横(ランドスケープ) */
@media only screen and (max-width:640px){

}