@charset "utf-8";

/*全体の設定（リセット含む）
------------------------------------------------------*/


/*リンク（全般）設定
------------------------------------------------------*/



/*コンテナー（#container:HPを囲むブロック）
------------------------------------------------------*/
#container {
	width: auto;
	margin-right: 40px;
	margin-left: 40px;/*ミドル版専用幅*/
}

/*----------------------------------------------------*/
/*header（サイト名ロゴが入ったブロック）
------------------------------------------------------*/
/*ヘッダーブロック*/
header {
    margin: 0px 0px 5px 0px;/*メニューとの距離*/
    padding: 0px 0px 0px 0px;/*上　右　下　 左*/
	width: 100%;	/*ブロックの幅*/
	height: 140px;	/*ブロックの高さ*/
    border-left: 1px dotted #B11919;
    border-bottom: 1px dotted #B11919;
    border-right: 1px dotted #B11919;
    border-radius: 0px 0px 5px 5px;	/*角丸のサイズ 左上　右上　右下　左下*/
	position: relative;
}
/*h1ロゴの設定*/
header h1 {
	left: 28px;	/*ヘッダーブロックに対して左から28pxの位置に配置*/
	top: 60px;	/*ヘッダーブロックに対して上から80pxの位置に配置*/
}

header h1 img{
    max-width: 150px;/*タイトル画像最大サイズ*/
    width: 90%;/*タイトル画像サイズ*/
    min-width: 135px;
    height: auto;
}
header h2{
    font-size: 1.8em;/*サブタイトルのフォントサイズ*/
    padding: 15px 0px 0px 34px;/*サブタイトルの位置 上 右 下 左*/
}
header .icon{
    position:absolute;
    right: 10px;
    top:90px;/*下合わせに変更*/
}
.icon img{
    width: 44px;
    min-width: 20px;
    height: auto;
    margin-left: 5px;/*ボタン間を広く*/
}

/*上部のメインメニュー(nav)
------------------------------------------------------*/

/*グラデーション。RGBA設定。0.9が透明度で他の数字が色のRGB値。*/
nav#main-nav ul {
	height: auto;
	padding: 0;
	margin: 2px auto 0 auto;/*上　右　下　左*/
	background-image: none;
    border: none !important;
}
/*メニュー１個ごとの設定*/
nav#main-nav ul li {
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(51,51,51,0.9)), to(rgba(85,85,85,0.9)));
/*グラデーション。RGBA設定。0.9が透明度で他の数字が色のRGB値。*/
    
	background-image: -webkit-linear-gradient(rgba(51,51,51,0.9), rgba(85,85,85,0.9));	/*同上*/
    
	background-image: linear-gradient(rgba(51,51,51,0.9), rgba(85,85,85,0.9));			/*同上*/
	margin-bottom: 1px;	/*メニューの上下間の余白*/
	margin-left: 1px;/*メニューの左右間の余白*/
	width: 32.9%;
    height: 47px;/*メニュー高さ*/
    border-right: 0px solid #444444;/*メニューの右側の線の幅、線種、色*/
}
nav#main-nav ul li a {
	padding: 3px 10px 0px 10px;/*文字位置 上　右　下　左*/
}
/*マウスオン時の設定*/
nav#main-nav ul li a:hover {
	background-color: #333;		/*背景色*/
}
/*4番目のメニュー（下段一番目）の設定*/
nav#main-nav ul li:nth-child(4) {
    border-left: none !important;/*メニューの右側の線解除*/
	margin-left: 2px;/*左マージンを変えて下段全体を右移動*/
}
/*最初のメニューの設定*/
nav#main-nav ul li:first-child {
	margin-left: 2px;/*左マージンを変えて上段全体を右移動*/
    border-left: none !important;/*メニューの右側の線解除*/
}

/*最後のメニューの設定*/
nav#main-nav ul li:last-child {
	margin-bottom: 20px;/*mainコンテンツとの距離*/
}

/*日本語表記の設定*/
nav#main-nav ul li a span {
	font-size: 11px;	/*文字サイズ*/
	line-height: 12px;
}

/*ショート版　電光掲示板（スマフォ専用）
------------------------------------------------------*/
#news{
    display: none;/*ミドル版では表示させない*/
}

/*----------------------------------------------------*/
/*main（#a-con,#b-conを囲むmainコンテンツの基本設定）
------------------------------------------------------*/
main{
    width: auto;/*container幅一杯に広がる*/
}
#a-con, #b-con{
	float: none;/*フロートの解除*/
	width: auto;
}

/*#b-con #fit-menu
------------------------------------------------------*/
/*#ワイドサイズのfit-menu領域を消す設定*/
#fit-menu {
    display: none;/*ミドル版・ショート版では表示させない*/
}
/*#wideサイズで消えていたパーツを表示させる設定*/
#fit-menu2 {
    display:inherit;/*ワイドで消えていた部分を表示させる*/
}
/*a-con基本設定（左サイド）
------------------------------------------------------*/
/*ミドル設定では右左はなくなる*/


/*#a-con　本文記事設定
------------------------------------------------------*/
/*本文見出し画像設定*/
.cut{
    width: 30%;/*画像の幅ミドルでは可変　ワイドでは固定*/
    max-width: 160px;/*画像の最大サイズ*/
    min-width: 120px;/*画像の最小サイズ*/
	height: auto;
    margin: 13px 10px 0px 25px; /*上　右　下　 左*/
}
/*a-conコンテンツの段落タグ設定*/
#a-con p{
	padding: 8px 30px;/*P上下　左右の余白*/
}

/*#a-con　ストーリーエリアのページネーション設定
------------------------------------------------------*/



/*#a-con　ストーリーエリアのFaceBookコメント欄
------------------------------------------------------*/



/*#a-con　他にこんな作品も読まれています
------------------------------------------------------*/
/*メインメニュー用のtitle-cヘッドパーツ（右サイドの物を流用）*/
#a-con .title-c{
    width: 100%;/*container幅一杯に広がる*/
}
.box-frame2{
	float: left;
    width: 20%;/*ボックスの大きさ（可変）*/
    margin: 15px 5px 0px 5px;/*ボックスのマージン上　右　下　 左*/
}
#other{
    margin-bottom: 20px;/*下コンテンツとの距離*/
}

/*frexboxの設定*/
.frex-layout{
    height: 100%;
    display: flex;
}
.box1{
    flex: 1;
}
.box2{
    flex: 1;
}
.box3{
    flex: 1;
}
.box4{
    flex: 1;
}
/*#a-con　気分に合ったシーンを読む（左サイドバージョン）
------------------------------------------------------*/



/*----------------------------------------------------*/
/*b-con基本設定（右サイド）
------------------------------------------------------*/
#b-con {
	width: auto;/*container幅一杯に広がる*/
}

/*サイドメニュー用のタイトルヘッドパーツ*/
.title-c {
    width: 100%;/*サブコンテンツ幅*/
    margin-left: auto;
    margin-right: auto;
}
/*気分に合ったシーンの背景パーツ*/
.sub-menu a{
	padding-left: 20px; /*左ラインからの距離*/
}

/*#b-con　検索　facebook　バナー広告の設定
------------------------------------------------------*/
#facebook{
    margin: 10px 10px 10px 20px;/*上　右　下　 左*/
}

#search .bannar01{
    margin: 10px auto 0px 20px;/*上　右　下　 左*/
}
#search .bannar02{
    margin: 10px auto 0px 20px;/*上　右　下　 左*/
}
/*#b-con　LINKSボックス
------------------------------------------------------*/
#links{
    margin-top: 10px;
    margin-bottom: 0px;/*footerとの距離*/
}
.box-frame1{
	float: left;
    width: 41%;
    margin: 10px 10px 10px 20px; /*上　右　下　 左*/
}

/*----------------------------------------------------*/
/*footer (フッター設定)
------------------------------------------------------*/

footer li{
    width:83px;/*ボタン幅*/
    font-size: 11px;/*文字サイズ*/
}
footer h3{
    position: absolute;
    right: 117px;
    bottom: 30px;
}
/*ストーリーページ
------------------------------------------------------*/
.title-b-ss {
    margin: 0px 20px 15px 20px; /*上　右　下　左*/
}
/*a-conコンテンツの段落タグ設定*/
#a-con .Senten p{
	padding: 10px 20px;/*P上下　左右の余白*/
}
#pager-nav{
    margin: 20px 30px 20px 50px;/*上　右　下　左*/
}
.page_next {
    margin-left:30px;
}
.fb-comments{
    margin: 0px auto 30px 10px;/*上　右　下　左*/
}
#story aside h3{
    margin: 0px 0px 0px 30px;/*上　右　下　左*/
}
/*作者紹介ページ
------------------------------------------------------*/



/*作品一覧ページ
------------------------------------------------------*/



/*書籍ページ
------------------------------------------------------*/
.wrapper{
	width: auto;/*wrapper幅*/
	margin-right: 30px;
	margin-left: 30px;/*ミドル版専用幅*/
}
.wrapper p{
    padding: 5px 0px 10px 0px!important;/*上　右　下　左*/
}
.left{
    width: 25%;
    max-width: 150px;
}
.left img{
    width: 80%;
    min-width: 80px;
    height: auto;
}
.right{
    width: 75%;
}

/*お問い合せページ
------------------------------------------------------*/
#formWrap {
	width:90%;
	margin:0 auto;
	color:#8e8e8e;
	line-height:120%;
	font-size:90%;
}
table.formTable{
	width:90%;
	margin:0 auto;/*上下　左右*/
	border-collapse:collapse;
    border-radius: 2%;/*正円を描く*/
}
table.formTable td,table.formTable th{
	border:1px solid #ccc;
	padding:10px;
}
table.formTable th{
	width:30%;
	font-weight:normal;
	background:#efefef;
	text-align:left;
}

/*サイトマップページ
------------------------------------------------------*/





/*comingsoon設定
------------------------------------------------------*/




/*----------------------------------------------------*/
/*テーブル設定
------------------------------------------------------*/



/*その他
-------------------------------------------------------*/