/*--------------------------------------
 全体
--------------------------------------*/
 * {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
html {
	scrollbar-base-color: #000;
	scrollbar-arrow-color: #FFF;
}

body {
	font-size: 95%;
	color: #CCC;
	width: 99%;
	background-color: #000000;
}
h1 {
	padding: 0 1em;
	color: #F00;
	font-size: 28px;
	font-style: Italic;
	font-family: "Times New Roman", Times;
	border-top : 8px solid #06C;
	border-bottom : 3px solid #06C;
	background-color: #336;
	background: url(back1.gif);
}

a:not(#entry):hover   { background-color: #FCC; }
a:link    { color:#69F; }
a:visited { color:#F0F; }
a:active  { color:#F00; }
ul,li     { text-align: left; }
li        { margin: 0.3em; }
hr        { border: 1px solid #666; }
a img     { border: 0; }
.text_small { font-size: 12px; }

#my_body{
	width:990px;
	margin:0 auto 0 auto;
	position : relative ;
}
#my_header{width : 100% ; height : 50px ; }

#my_contents{float:left;width:800px; }
#my_contents_1{	font-size: 15px;border: 2px solid #CCCCCC;float:left;width:380px;} 
#my_contents_2{	font-size: 20px;margin-left:380px;} 
#my_contents_3{	font-size: 20px;width:95%;clear : both ;} 

#my_navi{float:right;width:180px;}

#my_footer { font-size: 20px;width : 100% ;}
#my_footer_1 { font-size: 13px;width : 700px; froat : left ; }
#my_footer_2 { font-size: 13px;margin-left:700px;}
#my_footer_3 { font-size: 13px;width :100%;clear : both ;}


.clear{clear:both;}
/*--------------------------------------
 OoB追加
--------------------------------------*/
.header, .section, .section2 {
	margin-left:auto;
	margin-right:auto; 
	width:980px;
}
.section {
	clear:both; 
	text-align:left;
	background-color: #000000;
}
.section2 {
	height:600px;
	clear:both; 
	background-color:#111133;
}
.topbutton{
	width: 166px;
	height: 32px;
	color: #ffffff;
	font-size: 15px;
	font-weight: bold;
	border-top: 4px ridge #ffff66;
	border-bottom: 4px ridge #ffff66;
	border-left: 0px;
	border-right: 0px;
	background-color: #cc3300;
	margin-left:3px;
	margin-top:18px;
	margin-bottom:18px;
	float:left;
	cursor: pointer;
}
.button3_a {
	width: 110px;
	height: 30px;
	color: #000066;
	font-size: 14px;
	font-weight: bold;
	border: 4px groove #3399ff;
	background-color: #6699ff;
	margin-bottom: 12px;
	cursor: pointer;
}
.popup {
	position:absolute; 
	z-index:10; 
	visibility:hidden; 
	background-color:#660033; 
	border: 4px ridge #CCC; 
	font-size: 14px;
}
.login_list2 {
	height: 280px;
	width: 390px;
	margin: 1em 0;
	padding: 5px;
	text-align: left;
	font-size: 85%;
	border: 3px solid #CCC;
	background-color: #333;
	opacity:0.8;	/*Firefox, Opera, Chrome, Safari*/
	filter: alpha(opacity=80);	/*IE8以下*/
	overflow: auto;
	overflow-y: auto;
}
.login_box2 {
	height: 130px;
	width: 200px;
	border: 3px double #039;
	background: url('back1.gif');
}
.login_box3 {
	height: 130px;
	width: 130px;
	border: 3px double #039;
	background: url('back1.gif');
}
/*--------------------------------------
 Indexﾍﾟｰｼﾞ
--------------------------------------*/
.login_list {
	height: 270px;
	width: 540px;
	margin: 1em 0;
	padding: 5px;
	text-align: left;
	font-size: 95%;
	border: 3px solid #CCC;
	background-color: #333;
	overflow: auto;
	overflow-y: auto;
}

.login_box {
	margin: 1em;
	padding: 1em;
	border: 3px double #039;
	background: url(back1.gif);
}

.button_login {
	width: 140px;
	height: 30px;
	color: #003;
	font-size: 14px;
	font-weight: bold;
	border: 3px ridge #9CF;
	background-color: #69C;
	cursor: pointer;
}

.link1 {
	padding: 0.3em 0.5em;
	color: #FFF;
	font-size: 14px;
	font-weight: bold;
	background-color: #333;
	border: 2px solid #CCC;
	text-decoration: none;
	cursor: pointer;
}

.footer {
	padding: 0.5em;
	text-align: center;
	border: 1px solid #CCC;
	background: url(back1.gif);
}

.table2 {
	width: 540px;
	border: 2px solid #999;
	border-collapse: collapse;
	border-spacing: 0;
	empty-cells: show;
}
.table2 td, .table2 th {
	color: #CCC;
	font-size: 80%;
	border: 1px solid #999;
	background: #333;
}
.table2sm {
	width: 90%;
	border: 2px solid #999;
	border-collapse: collapse;
	border-spacing: 0;
	empty-cells: show;
}
.table2sm td, .table2sm th {
	color: #CCC;
	font-size: 80%;
	border: 1px solid #999;
	background: #333;
}




/*--------------------------------------
 ﾃｰﾌﾞﾙ
--------------------------------------*/
.mainbg {
	background: #000000;
}
.mainbg1 {
	background: #221122;
}
.mainbg2 {
	background: #220055;
}
.mainbg3 {
	background: #111133;
}
.mainbg4 {
	background: #221122;
}

.table1 {
	border: 2px solid #999;
	border-collapse: collapse;
	border-spacing: 0;
	empty-cells: show;
}
.table1 th {
	border: 2px solid #999;
	background: #336;
	white-space: nowrap;
}
.table1 td {
	border: 1px solid #999;
	background: #333;
	white-space: nowrap;
}
td,th {
	color: #CCC;
	font-size: 95%;
}
tr.stripe1 td { background-color: #222; }
tr.stripe2 td { background-color: #C00; }

td.backpic{
	background-repeat: no-repeat;  
	background-position: left top;
}
/*--------------------------------------
 ﾎﾞﾀﾝ
--------------------------------------*/
.button1 {
	width: 120px;
	height: 24px;
	color: #FFF;
	font-size: 14px;
	font-weight: bold;
	border: 2px solid #CCC;
	background-color: #336;
	margin-bottom: 20px;
	cursor: pointer;
}
.button2 {
	width: 160px;
	height: 30px;
	color: #006a6a;
	font-size: 14px;
	font-weight: bold;
	border: 4px solid #006a6a;
	background-color: #00ffff;
	margin-bottom: 20px;
	cursor: pointer;
}
.button3 {
	width: 170px;
	height: 30px;
	color: #00356a;
	font-size: 14px;
	font-weight: bold;
	border: 2px solid #CCC;
	background-color: #80bfff;
	margin-bottom: 12px;
	cursor: pointer;
}
.button4 {
	width: 170px;
	height: 30px;
	color: #00356a;
	font-size: 14px;
	font-weight: bold;
	border: 2px solid #000000;
	background-color: #000000;
	cursor: pointer;
}
.button5 {
	width: 110px;
	height: 24px;
	color: #97FF97;
	font-size: 14px;
	font-weight: bold;
	border: 2px solid #A8FFA8;
	background-color: #007C00;
	cursor: pointer;
}
.button6 {
	width: 106px;
	height: 36px;
	color: #97FF97;
	font-size: 15px;
	font-weight: bold;
	border: 2px solid #A8FFA8;
	background-color: #007C00;
	cursor: pointer;
}
.buttonsm {
	width: 94px;
	height: 42px;
	color: #00356a;
	font-size: 14px;
	font-weight: bold;
	border: 2px solid #CCC;
	background-color: #80bfff;
	margin-bottom: 10px;
	cursor: pointer;
}
.buttonsm2 {
	width: 75px;
	height: 30px;
	color: #00356a;
	font-size: 10px;
	font-weight: bold;
	border: 2px solid #CCC;
	background-color: #80bfff;
	cursor: hand;
}
.button_s {
	color: #FFF;
	font-size: 14px;
	border: 2px ridge #CCC;
	background-color: #336;
	cursor: hand;
}
.menu1 {
	width: 120px;
	color: #CCC;
	font-size: 14px;
	background-color: #003;
}
.menu2 {
	width: 100px;
	color: #CCC;
	font-size: 16px;
	background-color: #003;
}
.select1 {
	color: #FFF;
	background-color: #003;
}

/*--------------------------------------
 ﾃｷｽﾄﾎﾞｯｸｽ,ﾃｷｽﾄｴﾘｱ,
--------------------------------------*/
.text_box1,
.text_box_s,
.text_box_b {
	width: 120px;
	height: 20px;
	color: #FFC;
	border: 1px solid #FFF;
	background-color: #003;
}
.text_box_s {
	width: 80px;
}
.text_box_b {
	width: 400px;
}

.textarea1 {
	color: #FFF;
	font-size: 90%;
	border: 1px solid #FFF;
	background-color: #003;
}


/*--------------------------------------
 ﾒｯｾｰｼﾞ
--------------------------------------*/
.mes {
	width: 600px;
	padding: 0.5em;
	color: #CCC;
	border: 3px solid #CCC;
}

/*--------------------------------------
 Exp 疲労度などのﾊﾞｰ
--------------------------------------*/
.bar1,.bar2,.bar3,.bar4,.bar5 {
	width: 150px;
	height: 12px;
	border: 1px inset #CCC;
}
.bar1 img,.bar2 img,.bar3 img,.bar4 img,.bar5 img {
	height: 3px;
}

.bar1 { /* 赤 */
	background-color: #633;
}
.bar1 img {
	background-color: #C00;
	border-top: 3px solid #F00;
	border-bottom: 4px solid #900;
}

.bar2 { /* 紫 */
	background-color: #636;
}
.bar2 img {
	background-color: #C0C;
	border-top: 3px solid #F0F;
	border-bottom: 4px solid #909;
}

.bar3 { /* 黄 */
	background-color: #663;
}
.bar3 img {
	background-color: #CC0;
	border-top: 3px solid #FF0;
	border-bottom: 4px solid #990;
}

.bar4 { /* 水 */
	background-color: #366;
}
.bar4 img {
	background-color: #09C;
	border-top: 3px solid #0CF;
	border-bottom: 4px solid #069;
}

.bar5 { /* 緑 */
	background-color: #363;
}
.bar5 img {
	background-color: #0C0;
	border-top: 3px solid #0F0;
	border-bottom: 4px solid #090;
}
.float_left {
	float:left;
}
.float_right {
	float:right;
}
.clear_fixed:after {
	content: "";
	display: block;
	clear:both;
}
.chatbox {
	width: 100%;
	margin-bottom: 5px;
}
.chatbox1 {
	width: 10%;
}
.chatbox2 {
	width: 85%;
	color: #222222;
	background-color: #F4F4F4;
	padding: 5px;
	border: 2px solid #F4F4F4;
	word-wrap:break-word;
	border-radius: 5px;
}
.chatbox2_1 {
	color: #222222;
	background-color: #F4F4F4;
	padding: 5px;
	border: 2px solid #F4F4F4;
	word-wrap:break-word;
	border-radius: 5px;
}
.chatbox img:not([class="stamp"]) {
	width: 48px;
	border-radius: 24px;
}
.chatbox .fukidashi_left {
	border: 5px solid transparent;
	border-right: 10px solid #F4F4F4;
	margin: 0px;
	margin-top: 5px;
}
.chatbox .fukidashi_right {
	border: 5px solid transparent;
	border-left: 10px solid #F4F4F4;
	margin: 0px;
	margin-top: 5px;
}
.chatbox .fukidashi_bottom {
	width: 0px;
	height: 0px;
	border: 5px solid transparent;
	border-top: 10px solid #F4F4F4;
	margin: 0px;
	margin-left: 35px;
}
