@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:none;
}
.mode_sm{
	display:block;
}

/***************************************************
　sm用カスタマイズ
***************************************************/
ul.paging_list{
	margin:0 10px;
}
ul.paging_list li{
	margin:0 10px 20px 0;
}
ul.paging_list li:last-child{
	margin:0 0 20px 0;
}

ul#sns_share{
	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以降 */
}
ul#sns_share li i{
	font-size:1.4rem;
	padding:6px 7px;
}
.fa-hatena:before{
	font-size:1.4rem;
	padding:4px 0;
}

ul.works_link{
	margin:0 0 30px 0;
}
ul.works_link li{
}
ul.works_link li a{
	color:#FFF;
	font-size:0.7rem;
	font-weight:bold;
	text-align:center;
	text-shadow:1px 1px 0 #000;
	text-decoration:none;
	margin:0 0 10px 0;
	padding:6px 10px;
	background:#06F;
    -moz-border-radius:0.3rem;
    -webkit-border-radius:0.3rem;
    border-radius:0.3rem;
	display:inline-block;
}

ul#sm_navi{
	display:flex;
	display:-ms-flexbox; /* IE10 */
	display:-webkit-box; /* Android4.3以下、Safari3.1〜6.0 */
	display:-webkit-flex; /* Safari6.1以降 */
	justify-content:flex-end;
	margin:0 10px;
}
ul#sm_navi li{
	font-size:0.8rem;
	margin:0 0 0 10px;
}
ul#sm_navi li:first-child{
	margin:0 auto 0 0;
}
ul#sm_navi li a#on{
	color:#CCC;
}

#form_btn_1,
#form_btn_2{
	width:90%;
}
#form_btn_2{
	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以降 */
	flex-direction:row-reverse;
}
#form_btn_1 button,
#form_btn_2 #form_btn_l button,
#form_btn_2 #form_btn_r button{
	width:100%;
}
#form_btn_2 #form_btn_l{
	margin:0 20px 0 0;
}

/***************************************************
　series
***************************************************/
ul#series_list{
	display:flex;
	flex-wrap:wrap;
	-ms-flex-wrap:wrap; /*IE10*/
	-webkit-flex-wrap:wrap; /* Safari6.1以降 */
}
ul#series_list li{
	text-align:center;
	width:50%;
	margin:20px 0 0 0;
}
ul#series_list li img{
	width:90%;
}
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 20px 0;
	padding:0 10px;
}
ul#news_pic{
	text-align:center;
}
ul#news_pic li{
	margin:0 0 20px 0;
}
ul#news_pic li img{
	width:80%;
}

#news_comment{
	margin:0 0 20px 0;
	padding:0 10px;
	word-break:break-all;
}
#news_comment a{
	color:#09F;
}

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

/***************************************************
　contact
***************************************************/
#contact_area{
	margin:0 10px 20px 10px;
}
#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;
	border-right:none;
}
table#contact_table th,
table#contact_table td{
	width:100%;
	display:block;
}
.back_btn{
	width:80%;
	margin:0 auto 20px auto;
}
.back_btn a{
	color:#000;
	text-align:center;
	line-height:30px;
	height:30px;
	border:1px solid #000;
	-moz-border-radius:0.4rem;
	-webkit-border-radius:0.4rem;
	border-radius:0.4rem;
	display:block;
}

/***************************************************
　link
***************************************************/
#link_list{
	margin:0 10px;
}
#link_list li{
	border:1px solid #ddd;
	margin:0 0 10px 0;
}
#link_list li.banner_wide{
	width:100%;
}
#link_list li a{
	font-size:0.8rem;
	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 thead{
	display:none;
}
table#works_table th.works_title{
	font-weight:bold;
	background:#FAFAFA;
	border-right:none;
	display:block;
}
table#works_table th.works_title a{
	color:#03F;
}
table#works_table td{
	font-weight:normal;
	display:block;
}
table#works_table tr:last-child th,
table#works_table tr:last-child td{
	border-bottom:1px solid #CCC;
}
table#works_table tbody td::before{
	content:attr(label);
	float:left;
	clear:both;
}
table#works_table tbody td p{
	padding-left:6em;
}

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

/***************************************************
　character & story & scene
***************************************************/
h4.scene_title{
	background:#EEE;
	margin:0 10px 10px 10px;
	padding:5px 20px;
	display:inline-block;
}
#character_list{
}
#story_list{
	display:flex;
	flex-wrap:wrap;
	-ms-flex-wrap:wrap; /*IE10*/
	-webkit-flex-wrap:wrap; /* Safari6.1以降 */
}
.scene_list{
}
#character_list li,
#story_list li,
.scene_list li{
	margin:0 0 20px 0;
	padding:0 10px 10px 10px;
	border-bottom:1px dotted #CCC;
}
.scene_list li{
	text-align:center;
	padding:0 0 20px 0;
	border-bottom:1px dotted #CCC;
}
.scene_list li.img_one{
}
#story_list li{
	text-align:center;
	width:50%;
}
#story_list li img{
	border:1px solid #333;
	margin:0 0 10px 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;
}
#character_list li#hero{
	text-align:center;
}
#story_new{
	text-align:center;
}
#story_new img{
	width:100%;
}
#story_new img#new_img{
	width:auto;
}
dl.character_status{
}
dl.character_status dt{
	font-size:1.2rem;
	font-weight:bold;
	text-align:left;
	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{
	margin:0 5px 0 0;
	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{
	padding:0 10px;
}
dl.scene_status dt{
	font-size:1.0rem;
	font-weight:bold;
	margin:10px 0;
}
dl.scene_status dd{
	text-align:left;
	padding:10px;
	border:1px solid #CCC;
	background:#FFE;
}
dl.scene_status dd p{
	font-size:0.8rem;
}

/***************************************************
　staff
***************************************************/
ul#staff_list{
	margin:0 10px;
}
ul#staff_list li{
	text-align:center;
	margin:0 0 20px 0;
	border-bottom:1px dotted #CCC;
}
ul#staff_list li img{
}
ul#staff_list li:last-child{
	border:none;
}
dl.staff_data{
	padding:10px;
	border:1px solid #CCC;
}
dl.staff_data dt{
	text-align:left;
	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;
}
dl.staff_data dd img{
}
.staff_img{
	width:100%;
	margin:10px 0 0 0;
}

/***************************************************
　gen
***************************************************/
ul#gen_header{
}
ul#gen_header li{
	margin:0 0 10px 0;
}
ul#gen_header li img{
	width:100%;
}
ul#gen_header li:last-child{
}
ul#gen_list{
	padding:10px;
}
ul#gen_list li{
	border:1px solid #333;
	border-bottom:none;
}
ul#gen_list li:first-child{
	border-radius:7px 7px 0 0;
}
ul#gen_list li:last-child{
	border-radius:0 0 7px 7px;
	border-bottom:1px solid #333;
}
ul#gen_list li img{
	vertical-align:middle;
	margin:0 10px 0 0;
}
ul#gen_list li a{
	padding:10px;
	display:block;
}


/***************************************************
　profile
***************************************************/
#profile_photo{
	text-align:center;
	font-size:0.7rem;
	margin:0 0 20px 0;
}
#profile_photo p{
	width:60%;
	margin:0 auto;
}
#profile_photo img{
	margin:0 0 5px 0;
}
ul#profile_career{
	padding:10px;
}
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;
	margin:0 0 20px 0;
	padding:0 10px;
}
#profile_hummer img{
	width:100%;
	margin:0 0 5px 0;
}

/***************************************************
　about
***************************************************/
#about_top{
	text-align:center;
}
#about_top p{
	text-align:left;
	padding:0 10px;
}
.img_frame{
	text-align:center;
	margin:0 0 20px 0;
	display:inline-block;
	position:relative;
}
.img_frame img{
}
.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{
	padding:10px;
}
.pagein_list li{
	border:1px solid #333;
	border-bottom:none;
}
.pagein_list li:first-child{
	border-radius:7px 7px 0 0;
}
.pagein_list li:last-child{
	border-radius:0 0 7px 7px;
	border-bottom:1px solid #333;
}
.pagein_list li img{
	display:none;
}
.pagein_list li a{
	padding:10px;
	display:block;
}

/***************************************************
　works_list
***************************************************/
.works_list{
}
.works_list li{
	font-size:0.8rem;
	border:1px solid #ddd;
	border-right:none;
	border-left:none;
	width:100%;
	margin:0 0 20px 0;
	overflow:hidden;
	position:relative;
}
.works_i,
.works_i2,
.works_i3{
	float:left;
	width:40%;
}
.works_i img,
.works_i2 img,
.works_i3 img{
	width:100%;
}
.works_t{
	text-align:left;
	width:auto;
	overflow:hidden;
	padding:10px;
}
.works_date{
	color:#AAA;
	margin:0 0 10px 0;
}
.works_publisher,
.works_number{
	background:#EEE;
	margin:0 0 5px 0;
	padding:2px 10px;
	display:inline-block;
}
.works_publisher{
	margin:0 5px 5px 0;
}
.works_comment{
	word-break:break-all;
	margin:0 0 5px 0;
}
.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%;
	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);
	overflow-x:auto;
	overflow-y:hidden;
	-webkit-overflow-scrolling:touch;
	z-index:9999;
}
ul#navi_main{
	list-style:none;
	display:flex;
}
ul#navi_main li{
	text-align:center;
	border-left:1px solid #eee;
}
ul#navi_main li:last-child{
	border-right:1px solid #eee;
}
ul#navi_main li a{
	color:#FFF;
	font-size:0.8rem;
	line-height:47px;
	text-shadow:1px 1px 0 #000;
	display:inline-block;
	width:140px;
	height:47px;
	text-decoration:none;
	border-bottom:3px solid #000;
}
ul#navi_main li a.about{
	border-bottom:3px solid #00F;
}
ul#navi_main li a.gen{
	border-bottom:3px solid #FF0;
}
ul#navi_main li a#on{
	color:#FFF;
	font-weight:bold;
	border:none;
	background: rgba(255,255,255,0.3);
}

/***************************************************
　header
***************************************************/
#header{
	padding:10px 0;
}
#header h1{
	font-size:1.1rem;
	font-weight:bold;
}
#header ul{
	display:flex;
	display:-ms-flexbox; /* IE10 */
	display:-webkit-box; /* Android4.3以下、Safari3.1〜6.0 */
	display:-webkit-flex; /* Safari6.1以降 */
}
#header ul li{
	margin:8px 0 0 8px;
}
#header ul li img{
	width:100px;
}

/***************************************************
　slider
***************************************************/
#home_header{
	width:100%;
}
.sp-thumbnails{
	margin:0 0 20px 0;
}
.sp-thumbnails img{
}

/***************************************************
　contents
***************************************************/
#contents{
		animation:fadeIn 1s ease 0s 1 normal;
		-webkit-animation:fadeIn 1s ease 0s 1 normal;
}
#contents h2,
#contents h3{
	border-bottom:2px solid #CCC;
	margin:20px 5px;
	padding:0 0 5px 0;
}
#contents h3{
	font-size:0.9rem;
	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:100%;
}

/***************************************************
　footer
***************************************************/
#footer{
	padding:10px;
}
#page_up{
	position:fixed;
	bottom:0;
	right:0;
	left:0;
}
#page_up a{
	color:#FFF;
	text-align:center;
	line-height:30px;
	width:100%;
	height:30px;
	background:#333;
	z-index:999;
	display:block;
}
#page_up a:hover{
	text-decoration:none;
	opacity:0.7;
}

ul#navi_sub{
	padding:10px;
	background:#AAA;
}
ul#navi_sub li ul{
	display:flex;
	flex-wrap:wrap;
	-ms-flex-wrap:wrap; /*IE10*/
	-webkit-flex-wrap:wrap; /* Safari6.1以降 */
}
ul#navi_sub li{
	margin:0 0 15px 0;
}
ul#navi_sub li ul li{
	margin:15px 0 0 5px;
}
ul#navi_sub li a,
ul#navi_sub li ul li a{
	color:#FFF;
	font-size:0.8rem;
	padding:8px 6px;
	background:#A0A0A0;
    -moz-border-radius:0.5rem;
    -webkit-border-radius:0.5rem;
    border-radius:0.5rem;
	display:block;
}
ul#navi_sub li a#on{
	color:#DDD;
}
ul#navi_sub li#sns_area{
	margin:0;
}
ul#navi_sub li#sns_area a{
	background:none;
	padding:0;
}

#copyright{
	color:#999;
	text-align:center;
	margin:20px 0 30px 0;
}

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

.flex_box,
.flex_reverse{
}
ul.flex_box li{
}
ul.flex_box li:first-child{
}
ul.flex_box li a{
}
ul.flex_box li:first-child a{
}
ul.flex_box li a#on{
}
.flex_sb,
.flex_sb_reverse{
}
.flex_wrap,
.flex_wrap_reverse{
}
.flex_reverse,
.flex_sb_reverse,
.flex_wrap_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;
}