@charset "UTF-8";

html{
	overflow-y:scroll;
	overflow-x:hidden;
}
body{
	color:#4E4E4E;
	font-size:0.9rem;
	line-height:1.3;
	font-family:"メイリオ","Meiryo",verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
	background:#FFF;
}
a{
	color:#4E4E4E;
	outline:none;
	text-decoration:none;
}
a:hover,
button:hover,
label:hover,
input:hover,
button:hover{
	opacity:0.6;
	filter:alpha(opacity=60);
	-ms-filter:"alpha( opacity=60 )";
	cursor:pointer;
}
.mode_pc{
	display:block;
}
.mode_sm{
	display:none;
}

/***************************************************
　series
***************************************************/
ul#series_list{
}
ul#series_list li{
	width:220px;
	margin:0 5px 20px 0;
}
ul#series_list li:last-child{
	margin:0 0 20px 0;
}
ul#series_list li img{
	width:100%;
}
ul#series_list li a{
	display:block;
}
.series_title{
	font-weight:bold;
	text-align:center;
	margin:0 0 5px 0;
}

/***************************************************
　news
***************************************************/
#news_day{
	color:#999;
	margin:0 0 10px 0;
}
ul#news_pic{
	-ms-flex-pack:center;
	justify-content:center;
}
ul#news_pic li{
	margin:0 10px 20px 0;
}
ul#news_pic li:last-child{
	margin:0 0 20px 0;
}
ul#news_pic li img{
	max-height:400px;
}

#news_comment{
	margin:0 0 20px 0;
}
#news_comment a{
	color:#09F;
}


/***************************************************
　paging
***************************************************/
ul.paging_list li{
	margin:0 10px 20px 0;
}
ul.paging_list li:last-child{
	margin:0 0 20px 0;
}

/***************************************************
　read
***************************************************/
ul#read_list{
	text-align:center;
	width:1000px;
}
ul#read_list li{
	margin:0 0 20px 0;
}

/***************************************************
　contact
***************************************************/
#contact_area{
	margin:0 0 20px 0;
}
#contact_rule{
	margin:20px 0;
	padding:20px;
	background:#FFE;
	border:5px solid #FFEACA;
}
table#contact_table{
	width:100%;
	margin:20px 0;
	border:1px solid #FFF;
}
table#contact_table caption{
	text-align:left;
	font-weight:bold;
	margin:0 0 10px 0;
}
table#contact_table th{
	background:#FAFAFA;
}
.back_btn{
	width:250px;
	margin:0 auto 20px auto;
}
.back_btn a{
	color:#000;
	text-align:center;
	line-height:40px;
	height:40px;
	border:2px solid #000;
    -moz-border-radius:0.4rem;
    -webkit-border-radius:0.4rem;
    border-radius:0.4rem;
	display:block;
}

/***************************************************
　link
***************************************************/
#link_list{
	justify-content:space-between;
	align-items:center;
}
#link_list li{
	width:49%;
	border:1px solid #ddd;
	margin:0 0 20px 0;
}
#link_list li.banner_wide{
	width:100%;
}
#link_list li a{
	font-weight:bold;
	text-align:center;
	padding:20px 0;
	display:block;
}
#link_list li i{
	color:#00F;
}

/***************************************************
　works
***************************************************/
table#works_table{
	width:100%;
	margin:0 0 20px 0;
	border:1px solid #FFF;
}
table#works_table th{
	background:#FAFAFA;
	border-right:none;
}
table#works_table th.works_title{
	font-weight:bold;
	background:none;
}
table#works_table th.works_title a{
	color:#03F;
}
table#works_table td{
}
table#works_table tr:last-child th,
table#works_table tr:last-child td{
	border-bottom:1px solid #CCC;
}
table#works_table tr:hover{
	background:#FFFFE8;
}

/***************************************************
　media
***************************************************/
h4.media_title{
	font-size:1.1rem;
	font-weight:bold;
	border-bottom:1px dotted #999;
	margin:0 0 10px 0;
}
ul#media_list{
}
ul#media_list li{
	margin:0 0 20px 0;
	padding:20px;
	border:1px solid #CCC;
}
#media_table{
	width:400px;
	margin:20px 0 0 0;
}
.media_img{
	align-items:flex-start;
}
.media_img img{
	margin:10px 20px 0 0;
}

/***************************************************
　character & story & scene
***************************************************/
h4.scene_title{
	background:#EEE;
	margin:0 0 20px 0;
	padding:10px 20px;
	display:inline-block;
}
#character_list,
#story_list{
	justify-content:space-between;
}
.scene_list{
	justify-content:space-around;
}
#character_list li,
.story_first li,
.story_second li,
.scene_list li{
	display:flex;
	width:33%;
	margin:0 0 20px 0;
	padding:0 10px;
	border-right:1px dotted #CCC;
}
.scene_list li{
	align-items:flex-start;
	width:100%;
	padding:0 0 20px 0;
	border-right:none;
	border-bottom:1px dotted #CCC;
}
.scene_list li.img_one{
	width:480px;
}
#story_list li{
	align-items:flex-start;
}
#character_list::after,
#story_list::after{
	content:"";
	display:block;
	width:33%;
}
#story_list li img{
	border:1px solid #333;
	margin:0 10px 0 0;
}
#story_list li img.old{
	width:100px;
}
.scene_list li img{
	border:1px solid #333;
	margin:0 10px 0 0;
}
.scene_list li:last-child{
	width:100%;
	padding:0;
	border:none;
}
#character_list li#hero,
#story_list li#new{
	width:100%;
	border:none;
}
#story_list li#new{
	padding:0 0 20px 0;
}
#story_new{
	text-align:center;
	margin:0 auto;
}
#character_list li:nth-child(3n+1),
.story_first li:nth-child(3n+1){
	border:none;
}
.story_second li:nth-child(3n){
	border:none;
}
dl.character_status{
}
dl.character_status dt{
	font-size:1.2rem;
	font-weight:bold;
	line-height:30px;
	height:30px;
}
dl.character_status dt .age{
	font-size:0.8rem;
	font-weight:normal;
	margin:0 0 0 10px;
}
dl.character_status dd{
}
dl.character_status dd img{
	margin:10px 0;
}
dl.character_status dd p{
	font-size:0.8rem;
}

dl.story_status{
}
#story_new dl.story_status dt{
	margin:10px 0 0 0;
}
#story_new dl.story_status dt img{
	border:none;
}
dl.story_status dt{
	font-size:1.0rem;
	font-weight:bold;
}
dl.story_status dd{
	font-size:0.8rem;
}
dl.story_status dd .paper{
	font-weight:bold;
	text-align:center;
	margin:5px 0;
	padding:4px 0;
	background:#CCC;
}
dl.story_status dd p{
	font-size:0.8rem;
	text-align:left;
}

dl.scene_status{
}
dl.scene_status dt{
	font-size:1.0rem;
	font-weight:bold;
	margin:0 0 10px 0;
}
dl.scene_status dd{
	padding:10px;
	border:1px solid #CCC;
	background:#FFE;
}
dl.scene_status dd p{
	font-size:0.8rem;
}

/***************************************************
　staff
***************************************************/
ul#staff_list{
}
ul#staff_list li{
	margin:0 0 20px 0;
	padding:0 0 20px 0;
	border-bottom:1px dotted #CCC;
}
ul#staff_list li:last-child{
	padding:0;
	border:none;
}
dl.staff_data{
	margin:0 20px 0 0;
	padding:10px;
	border:1px solid #CCC;
}
dl.staff_data dt{
	font-weight:bold;
	margin:0 0 10px 0;
	padding:0 0 0 5px;
	border-left:6px solid #CCC;
}
dl.staff_data dd{
	text-align:center;
}

/***************************************************
　gen
***************************************************/
ul#gen_header{
}
ul#gen_header li{
	text-align:center;
	margin:0 0 10px 0;
}
ul#gen_header li:last-child{
	margin:0;
}
ul#gen_list{
	margin:20px 0;
}
ul#gen_list li{
	text-align:center;
}
ul#gen_list li img{
	vertical-align:middle;
	margin:0 10px 0 0;
}
ul#gen_list li a{
	font-weight:bold;
	width:240px;
	padding:30px 0;
	border:2px solid #333;
    -moz-border-radius:0.5rem;
    -webkit-border-radius:0.5rem;
    border-radius:0.5rem;
	display:block;
}

/***************************************************
　profile
***************************************************/
#profile_photo{
	font-size:0.7rem;
	width:208px;
	margin:0 20px 20px 0;
}
#profile_photo img{
	margin:0 0 5px 0;
}
ul#profile_career{
}
ul#profile_career li{
	margin:0 0 10px 0;
	padding:0 0 0 5px;
	border-left:6px solid #CCC;
}
#profile_hummer{
	font-size:0.7rem;
	width:366px;
	margin:0 auto 20px auto;
}
#profile_hummer img{
	margin:0 0 5px 0;
}

/***************************************************
　about
***************************************************/
#about_top{
	overflow:hidden;
}
.img_frame{
	float:right;
	margin:0 0 20px 20px;
	display:inline-block;
	position:relative;
}
.img_frame:after{
	position:absolute;
	content:"";
	box-shadow:0 15px 10px rgba(0,0,0, .5); /* シャドウ */
	transform:rotate(3deg); /* 回転させる */
	right:5px;
	left:auto;
	top:auto;
	bottom:15px;
	z-index:-1;
	width:50%;
	height:20%;
}
.pagein_list{
	justify-content:space-between;
	margin:20px 0 0 0;
}
.pagein_list li{
	line-height:200px;
	width:490px;
	height:200px;
	margin:0 0 20px 0;
	overflow:hidden;
}
.pagein_list li a:after{
	content: "";
	clear: both;
	display: block;
}
.pagein_list li img{
	float:left;
	height:196px;
	margin:0 0 0 20px;
}
.pagein_list li a{
	font-weight:bold;
	text-align:center;
	height:200px;
	border:2px solid #333;
    -moz-border-radius:0.5rem;
    -webkit-border-radius:0.5rem;
    border-radius:0.5rem;
	display:block;
}

/***************************************************
　works_list
***************************************************/
.works_list{
	justify-content:space-between;
}
.works_list li{
	display:flex;
	align-items:center;
	border:1px solid #ddd;
	width:49%;
	margin:0 0 20px 0;
	position:relative;
}
.works_i,
.works_i2,
.works_i3,
.works_i img,
.works_i2 img,
.works_i3 img{
	flex-grow:0;
	flex-shrink:0;
	width:200px;
	display:block;
	vertical-align:bottom;
}
.works_i2,
.works_i2 img{
	width:130px;
}
.works_i3,
.works_i3 img{
	width:180px;
}
.works_t{
	flex-grow:1;
	flex-shrink:1;
	text-align:left;
	padding:10px 20px;
}
.works_date{
	color:#AAA;
	margin:0 0 5px 0;
}
.works_publisher,
.works_number{
	font-size:0.8rem;
	background:#EEE;
	margin:0 0 5px 0;
	padding:2px 10px;
	display:inline-block;
}
.works_publisher{
	margin:0 5px 5px 0;
}
.works_comment{
	font-size:0.8rem;
	margin:0 0 5px 0;
	word-break:break-all;
}
.works_comment a{
	color:#06F;
}
.works_page{
	position:absolute;
	right:10px;
	bottom:10px;
}
.works_page a{
	color:#06F;
	padding:2px 8px;
	border:1px solid #06F;
    -moz-border-radius:0.3rem;
    -webkit-border-radius:0.3rem;
    border-radius:0.3rem;
	display:inline-block;
}

/***************************************************
　navi
***************************************************/
#navi_main_area{
	width:100%;
	margin:0 0 20px 0;
	background:repeating-linear-gradient(45deg, rgba(0,0,0,0.7),rgba(0,0,0,0.7) 10px, rgba(0,0,0,0.6) 0, rgba(0,0,0,0.6) 20px);
/*
	background:repeating-linear-gradient(45deg, #444, #444 10px, #333 0, #333 20px);
	background:rgba(0,0,0,0.5);
*/
	z-index:9999;
}
ul#navi_main{
	padding:20px 0;
}
ul#navi_main li{
	position:relative;
}
ul#navi_main li a{
	color:#FFF;
	padding:10px 10px;
	background:#000;
    -moz-border-radius:0.5rem;
    -webkit-border-radius:0.5rem;
    border-radius:0.5rem;
	display:block;
}
ul#navi_main li a:hover,
ul#navi_main li a#on{
	color:#000;
	font-weight:bold;
	opacity:1;
	filter:alpha(opacity=100);
	-ms-filter:"alpha( opacity=100 )";
	background:#FFF;
}
ul#navi_main li ul{
	top:40px;
	left:10px;
	position:absolute;
	z-index:9999;
}
ul#navi_main li ul li{
	overflow:hidden;
	height:0;
	transition:0.2s;
}
ul#navi_main li ul li a{
	width:180px;
	border:1px solid #000;
	margin:5px 0 0 0;
}
ul#navi_main li:hover > ul > li{
  overflow:visible;
  height:40px;
}

/***************************************************
　header
***************************************************/
#header{
	padding:20px 0;
}
#header h1{
	font-size:1.6rem;
	font-weight:bold;
}

/***************************************************
　slider
***************************************************/
#home_header,
#home_slider{
	height:535px;
}
#home_header{
	text-align:center;
}
.sp-thumbnails{
	margin:0 0 20px 0;
}

/***************************************************
　contents
***************************************************/
#contents{
    animation:fadeIn 1s ease 0s 1 normal;
    -webkit-animation:fadeIn 1s ease 0s 1 normal;
}
#contents h2,
#contents h3{
	font-size:1.2rem;
	border-bottom:2px solid #CCC;
	margin:0 0 20px 0;
	padding:0 0 5px 0;
}
#contents h3{
	font-size:1.1rem;
	border-bottom:1px solid #CCC;
	margin:0 0 5px 0;
}
#contents img{
}
#contents p{
	line-height:1.6;
}
@keyframes fadeIn{
    0%{opacity:0}
    100%{opacity:1}
}

@-webkit-keyframes fadeIn{
    0%{opacity:0}
    100%{opacity:1}
}
.default_box{
	width:1000px;
	margin:0 auto;
}

/***************************************************
　footer
***************************************************/
#footer{
}
#page_up{
	position:fixed;
	bottom:20px;
	right:20px;
}
#page_up a{
	color:#FFF;
	text-align:center;
	line-height:50px;
	width:100px;
	height:50px;
	background:#333;
    -moz-border-radius:0.5rem;
    -webkit-border-radius:0.5rem;
    border-radius:0.5rem;
	z-index:999;
	display:block;
}
#page_up a:hover{
	text-decoration:none;
	opacity:0.7;
}

ul#navi_sub{
	padding:15px;
	background:#AAA;
}
ul#navi_sub li ul li{
	margin:5px 0 0 10px;
}
ul#navi_sub li a,
ul#navi_sub li ul li a{
	color:#FFF;
	font-size:0.8rem;
}
ul#navi_sub li a#on{
	color:#DDD;
}
ul#navi_sub li#sns_area{
	width:400px;
}

#copyright{
	color:#999;
	text-align:center;
	margin:20px 0;
}
#twitter_line{
	width:500px;
	margin:10px auto;
}

/***************************************************
　ページ共通
***************************************************/
#alpha{/* 透過 */
	opacity:0.8;
	filter:alpha(opacity=80);
	-ms-filter:"alpha( opacity=80 )";
}

.flex_box,
.flex_reverse{
	display:flex;
	display:-ms-flexbox; /* IE10 */
	display:-webkit-box; /* Android4.3以下、Safari3.1〜6.0 */
	display:-webkit-flex; /* Safari6.1以降 */
}
#header ul.flex_box li{
	margin:20px 0 0 20px;
}
#header ul.flex_box li:first-child{
	margin:0;
	margin-right:auto;
}
#header ul.flex_box li a{
	padding:4px 10px;
	background:#EEE;
    -moz-border-radius:0.5rem;
    -webkit-border-radius:0.5rem;
    border-radius:0.5rem;
}
#header ul.flex_box li:first-child a{
	padding:0;
	background:none;
}
#header ul.flex_box li a#on{
	background:#FFF;
}
.flex_sb,
.flex_sb_reverse{
	display:flex;
	justify-content:space-between;
	-ms-flex-pack:justify; /*IE10*/
	-webkit-box-pack:justify; /* Android4.3以下、Safari3.1〜6.0 */
	-webkit-justify-content:space-between; /* Safari6.1以降 */
	align-items:flex-start;
/*	align-items:center; */
}
.flex_wrap,
.flex_wrap_reverse{
	display:flex;
	flex-wrap:wrap;
	-ms-flex-wrap:wrap; /*IE10*/
	-webkit-flex-wrap:wrap; /* Safari6.1以降 */
}
.flex_reverse,
.flex_sb_reverse,
.flex_wrap_reverse{
	flex-direction:row-reverse;
}

#gradation{/* グラデーション */
	background:linear-gradient(#FFF,#E6E6E6);
}

#shadow{/* テキストシャドウ */
	text-shadow:1px 1px 2px #333;
}

#sample_text-hidden{/* HTML側のテキストを非表示にして、CSS側で画像を表示するコード */
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}
.kadomaru{/* BOXエリアを角丸にするコード */
    -moz-border-radius:0.5rem;
    -webkit-border-radius:0.5rem;
    border-radius:0.5rem;
}
#box-shadow{/* BOXエリアに影をつけるコード */
	/* box-shadow */
	box-shadow:rgba(0, 0, 0, 0.21) 5px 5px 6px -2px;
	-webkit-box-shadow:rgba(0, 0, 0, 0.21) 5px 5px 6px -2px;
	-moz-box-shadow:rgba(0, 0, 0, 0.21) 5px 5px 6px -2px;
}