﻿/*共通設定・高さ*/
html, body{ 
	height:100%; margin:0;
	font-family:"メイリオ";
	background-color:#F0F0F0;
}
a.link_color:link { color: #ffffff;color: inherit; }
a.link_color:visited { color: #ffffff;color: inherit; }
a.link_color:hover { color: #ffffff;color: inherit; }
a.link_color:active { color: #ffffff;color: inherit; }	
/*共通設定・幅*/
.top_degine{
	max-width:720px;
	min-width:360px;
}
/*共通設定・高さ*/
.top_degine{
	height:100%;
}	
/*共通設定・背景色*/
.top_degine,.contnts_degine,.footer{
	background-color:#FAFAFA;
}
.top_degine{
	position:relative;
	text-align:center;
	color:#030303;
	size:10px;
	margin:auto;
	letter-spacing: 0.1em
}
.contnts_degine,.contnts_sub{
	position:relative;
	text-align:center;
	color:#030303;
	size:10px;
	margin:auto;
	letter-spacing: 0.1em;
}
.contnts_sub{
	border:#808080 solid 2px;
	border-left:#808080 solid 4px;
	border-right:#808080 solid 4px;
	width:95%;
}

.message_space{
	position:absolute;
	text-align:center;
	color:#030303;
	size:10px;
	left:1%;
	letter-spacing: 0.1em;	
	background-color:#FFFFFF;
	border:#808080 solid 2px;
	border-left:#808080 solid 4px;
	border-right:#808080 solid 4px;
	margin:0 auto;
	height:85%;
	width:97%;
}

.setumei_degine{
	position:absolute;	
	color:#FFFFFF;
	text-align:center;
	background-color:#000000;
	opacity:1;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

.message_degine{
	position:absolute;
	color:#FFFFFF;
	font:14px 'ＭＳ Ｐゴシック';
	background-color:#303030;
	border-radius: 5px; /*角丸*/
	padding:2px;
	opacity:0.6;
}

.message_box{
	margin:auto;
	width:300px;
	height:100px;
	color:#FFFFFF;
	top:330px;
	left:20px;
	background-color:#303030;
	border-radius: 5px; /*角丸*/
	opacity:0.8;
	border:solid 2px #808080;
}

.message_view{
	position:relative;
	margin:auto;
	padding:5px;
	width:90%;
	height:90%;
	color:#FFFFFF;
	background-color:#303030;
	font:14px 'ＭＳ Ｐゴシック';	
}

.menu_label{
	position:absolute;
	top:20px;
	left:190px;
	width:130px;
	height:30px;
	color:#FFFFFF;	
	background-color:#303030;
	border-radius:5px; /*角丸*/
	opacity:0.8;
	border:solid 1px #808080;	
	font:14px 'ＭＳ Ｐゴシック';	
	text-align:center;
}
.menu_box{
	position:absolute;
	top:51px;
	left:190px;
	width:130px;
	height:250px;
	color:#FFFFFF;	
	background-color:#303030;
	border-radius:5px; /*角丸*/
	opacity:0.8;
	border:solid 1px #808080;	
	font:14px 'ＭＳ Ｐゴシック';	
	text-align:left;
}
.menu_string_box{
	position:relative;
	margin:auto;
	padding:5px;
	width:90%;
	height:90%;
	color:#FFFFFF;
	background-color:#303030;
	font:14px 'ＭＳ Ｐゴシック';	
	text-align:left;
	letter-spacing: 0.1em;
}

.select_msg_box{
	position:relative;
	top:200px;
	width:100%;
	text-align:center;
}

.select_yes_box{
	position:absolute;
	top:300px;
	left:100px;
}

.select_no_box{
	position:absolute;
	top:300px;
	left:220px;
}

.command_border{
	border-radius:2px; /*角丸*/
	border:solid 1px #808080;
}

@-webkit-keyframes pulse {
 from {
   opacity: 1.0;/*透明度100%*/
 }
 to {
   opacity: 0.1;/*透明度80%*/
 }
}
@-webkit-keyframes pulse2 {
 from {
   opacity: 0.0;/*透明度0%*/
 }
 to {
   opacity: 1.0;/*透明度80%*/
 }
}
.blinking{
	-webkit-animation-name: pulse;/* 実行する名前 */
	-webkit-animation-duration: 0.8s;/* 0.3秒かけて実行 */
	-webkit-animation-iteration-count:infinite;/* 何回実行するか。infiniteで無限 */
	-webkit-animation-timing-function:ease-in-out;/* イーズインアウト */
	-webkit-animation-direction: alternate;/* alternateにするとアニメーションが反復 */
	-webkit-animation-delay: 0s; /* 実行までの待ち時間 */
}

.background_change{
	-webkit-animation-name: pulse2;/* 実行する名前 */
	-webkit-animation-duration: 0.5s;/* 0.3秒かけて実行 */
	-webkit-animation-iteration-count:2;/* 何回実行するか。infiniteで無限 */
	-webkit-animation-timing-function:ease-in-out;/* イーズインアウト */
	-webkit-animation-direction: alternate;/* alternateにするとアニメーションが反復 */
	-webkit-animation-delay: 0s; /* 実行までの待ち時間 */
}

.background_change2{
	-webkit-animation-name: pulse2;/* 実行する名前 */
	-webkit-animation-duration: 0.2s;/* 0.3秒かけて実行 */
	-webkit-animation-iteration-count:2;/* 何回実行するか。infiniteで無限 */
	-webkit-animation-timing-function:ease-in-out;/* イーズインアウト */
	-webkit-animation-direction: alternate;/* alternateにするとアニメーションが反復 */
	-webkit-animation-delay: 0s; /* 実行までの待ち時間 */
}
.table_degine{
	margin:auto;
	overflow:scroll;
}

.novel_writting_div{
	position:relative;
	text-align:left;	
	margin:auto;
	width:95%;
	left:-3px;
}

.novel_writting{
	text-align:left;	
}

.link_button_div{
	position:relative;
	text-align:center;	
	margin:auto;
	width:95%;
	left:-3px;
}

.link_button{
	display:block;
	position:relative;
	text-align:center;
	color:#030303;
	size:10px;
	padding-top:10px;
	padding-bottom:10px;
	border-left:2px solid;
	border-top:2px solid;
	border-right:2px solid;
	border-bottom:2px solid;
	border-color:#bbbbbb #777777 #777777  #aaaaaa;
	background-color:#AFEEEE;
	color:#303030;	
	width:99%;
	-webkit-border-radius: 5px;/* for Safari and Chrome 対応*/
	-moz-border-radius: 5px;/* for Firefox 対応*/
	border-radius: 5px; /*角丸*/	
}
.button{
	-webkit-border-radius: 5px;/* for Safari and Chrome 対応*/
	-moz-border-radius: 5px;/* for Firefox 対応*/
	border-radius: 5px; /*角丸*/
	width:100px;
	height:40px;	
}

.button_main_menu{
	width:95%;
	height:50px;
	font-size:14pt;
	background-color:#AFEEEE;
	color:#303030;
}

.button_new_contents{
	background-color:#AFEEEE;
	color:#303030;	
	width:96%;
	height:40px;
}

.input_contents{
	width:98%;
}

.textarea_contents{
	height:350px;
}

@media screen and (max-width: 480px) {
	.textarea_contents{
		height:280px;
	}
}


.button_contents,.button_yes_no_contents{
	background-color:#AFEEEE;
	color:#303030;		
	width:98%;
	height:40px;
}

.button_contents_50{
	width:49%;
}

.button_yes_no_contents{
	width:49%;
}

.button_novel_list{
	background-color:#AFEEEE;
	color:#303030;		
	width:98%;
	height:25px;
}

.footer{
	width:100%;
	text-align:center;
	color:#030303;
	font-size:10pt;
	/*position:absolute;bottom:15px;*/
}

