@charset "UTF-8";


/* 背景全体に画像（右寄せ） */
html { 
	background-color: #f3ffee;
	-webkit-text-size-adjust: 100%;
}

body{
	margin: 0;
	color: #333322;
	font-size: 10.5pt;
	font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	height:100%;
	line-height: 1.5;
}

@font-face {
	font-family: "ffkiniro";
	src: url("./font/GN-Kin-iro_SansSerif.ttf");
	format('ttf');
}
.ffkiniro {
	font-family: "ffkiniro";
	letter-spacing: 2px;
}

/* コンテナ */
div#container {
	position: relative;
	height:100%;
	text-align: center;
	padding-left: 10px;
	padding-right: 10px;
}

/* 半透明白背景 */
div.content{
	/* background-color: #f9e9b0; */
	max-width: 1120px;
	min-width: 1120px;
	height: 100%:
	margin-top: 0px;
	margin-bottom: 0px;
	/* padding: 10px; */
	
	/*
	border-left: #aaaa99 1px solid;
	border-right: #aaaa99 1px solid;
	
	box-shadow: 0px 2px 5px #999999;
	*/
	text-align: left;
	margin-left: auto;
	margin-right: auto;
}

div.battlemain{
	padding: 8px;
	font-size: 10.5pt;
}

.markerA {
	background: linear-gradient(rgba(153,204,255,0) 60%, #99ccff 60%);
}
.markerB {
	background: linear-gradient(rgba(255,204,153,0) 60%, #ffcc99 60%);
}

.subcontenttitle{
	font-size: 26pt;
	color:#117700;
	padding: 5px;
	padding-left: 30px;
	padding-right: 30px;
	background-color: #a6eea6;
	border-radius: 0px 15px 15px 0px;
	margin-left: -3px;
	border-right: 2px dashed #ffffff;
	border-top: 2px dashed #ffffff;
	border-bottom: 2px dashed #ffffff;
	outline: 3px solid #a6eea6;
}

div.sidearea{
	max-width: 150px;
	min-width: 150px;
	width: 100px;
	min-height: 1000px;
	float: left;
	margin: 8px;
	margin-top: 12px;
}

div.mainarea{
	width: 924px;
	float: left;
}

div.navlink{
	width: 135px;
	padding-left: 13px;
	padding-top: 7px;
	padding-bottom: 7px;
	background-color: #339933;
	vertical-align: middle;
	margin: 5px;
	margin-bottom: 8px;
	outline: 3px solid #339933;
	border: 1px dashed #ece9e0;
	color: #ece9e0;
	font-weight: bold;
	font-size: 11pt;
	text-shadow: 0px 2px 2px #00000033;
}
div.sidemenudiv{
	margin-bottom: 10px;
}
div.navlinkd{
	margin: 0px;
	margin-top: 3px;
	width: 100px;
	height: 40px;
	text-align: center;
	padding-top: 16px;
	color: #80c080;
	background-image: url("./img/img_top.png");
	background-repeat: no-repeat;
}
div.navlinknotify{
	margin: 0px;
	margin-top: 3px;
	width: 100px;
	height: 40px;
	text-align: center;
	padding-top: 16px;
	background-image: url("./img/img_top_notify.png");
	background-repeat: no-repeat;
}
div.navlink:hover{
	background-color: #66cc66;
	outline: 3px solid #66cc66;
}


/* 見出し */
div .title{

}

/* 小見出し */
.subtitle{
	/* background: url("white65.png"); */
	font-size: 14pt;
	color: #229922;
	margin-left: 0px;
	margin-right: 0px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 20px;
	
	border-bottom: #66dd66 1.5pt dashed;
}

/* 縁つきテキスト */
p{
	margin: 10px;
}

div.divp{
	margin: 10px;
}

p, td{
	/* text-shadow: 1px 1px 4px #000000; */
}

h1{
	text-shadow: 0px 0px 6px #ff99ff;
}

h2{
	/* text-shadow: 0px 1px 2px #ffffff; */
	margin: 10px;
}

h4{
	display: inline;
	color: #557744;
	font-weight: normal;
	font-size: 10.5pt;
	padding: 3px;
	padding-left: 8px;
	padding-right: 8px;
	margin: 5px;
	background: linear-gradient(rgba(178,203,178,0) 50%, #aaeeaa 90%) ;
	vertical-align: middle;
}

.ctag{
	border: #227700 1px dotted;
	border-radius: 5px;
	padding: 2px;
	margin-right: 6px;
	background-color: #eeffee;
	display: inline-box;
	color: #009955;
}

.btn{
	text-align: center;
	border: #772200 1px solid;
	border-radius: 3px;
	margin-left: 400px;
	margin-right: 400px;
	background-color: #eebb66;
}

.btn:hover{
	background-color: #9999aa;
	cursor: pointer;
}


.sampleview:hover{
	background-color: #ccddee;
}

.header {
	
}

.taglist{
	margin: 4px;
	margin-top: -4px;
	margin-bottom: 12px;
	padding: 5px;
	padding-left: 0px;
}

.taglist span{
	border: 1px dotted #a08060;
	border-radius: 5px;
	padding: 3px;
	padding-left: 6px;
	padding-right: 6px;
	margin-right: 6px;
	background: url("white65.png");
}

.taglist span:hover{
	background-color: #fcf0aa;
}

.twitter{
	float: right;
	margin-right: 7px;
	margin-top: 10px;
}

iframe.twitter-share-button {
	width: 100px!important;
}

a{
	color: #773377;
	text-decoration: none;
}

a.nav{
	color: #554411;
}

h2 a{
	/* color: #ffffff; */
}


a.tag{
	color: #66cc00;
	text-decoration: none;
}


/* 角丸アイコン */
img.icon{
	margin-right: 5px;
	border-radius: 2px;
}

/* 発言欄 */
div.talkarea, div.framearea{
	
	border-radius: 4px;
	background: url("white65.png");
	
	margin: 6px;
	padding: 6px;
	margin-bottom: 10px;
	
	border: 1px solid #bbbbbb;
	box-shadow: 0px 1px 2px #cccccc;
}
div.frameareab{
	
	border-radius: 4px;
	background: url("white65.png");
	margin: 6px;
	padding: 6px;
	margin-bottom: 10px;
}
div.talkarea2{
	border-radius: 6px;
	background: url("white65.png");
	margin: 12px;
	padding: 8px;
	margin-bottom: 8px;
}

span.times{
	font-size: 9pt;
	color: #992222;
	text-align: right;
}

span.label{
	margin: 2px; 
}

td.tleft, td.tright{
	/* border: 1.5px solid #aa6666; */
	padding: 0;
	margin: 0;
	vertical-align: top;
	width: 50%;
}

td.tleft{

}

td.tright{
	border-left: 2px #66cc66 dotted;
}

td.iconcell{
	border: 1px solid #aa8866;
	border-radius: 2px;
	padding: 0;
	margin: 0px;
	vertical-align: top;
	width: 60px;
	height: 60px;
}

td.iconcell:hover{
	border: 1px solid #ff9977;
}

.talklist_main{
	padding: 0;
	margin: 0;
}

span.re{
	border: 1px solid #ff9933;
	border-radius: 3px;
	margin: 0px;
	margin-left: 8px;
	padding: 0px;
	padding-left: 4px;
	padding-right: 4px;
	color: #994411;
	background-color: #ffcc66;
	cursor: pointer;
	font-size: 8pt;
}

span.del{
	border: 1px solid #ff6633;
	border-radius: 3px;
	margin: 0px;
	margin-left: 8px;
	padding: 0px;
	padding-left: 4px;
	padding-right: 4px;
	color: #994411;
	background-color: #ffdddd;
	cursor: pointer;
	font-size: 8pt;
}

.pager{
	border: 1px solid #ffcc66;
	border-radius: 3px;
	margin: 3px;
	margin-left: 8px;
	padding: 0px;
	padding-left: 4px;
	padding-right: 4px;
	font-weight: bold;
	font-size: 90%;
	background-color: #ffddaa;
	cursor: pointer;
}

img{
	margin:0;
	padding:0;
	vertical-align:bottom;
	
	/* あまりにも大きい画像は下側をクリッピング */
	max-height: 1000px;
	object-fit: cover;
	object-position: 0% 0%;
}
.roomname{
	padding: 8px;
	padding-left: 6px;
	padding-right: 18px;
	border-left: 12px solid #ffe977;
	background-color: #fff0bb;
	margin-right: 8px;
	min-width: 70px;
	font-size: 9pt;
	box-shadow: 2px 0px 3px #00000066;
	display: inline-block;
	color: #333333;
}
.roomname a{
	color: #774400;
}
.roomnameplace{
	padding: 8px;
	padding-left: 6px;
	padding-right: 18px;
	border-left: 12px solid #ffbb22;
	background-color: #ffdd44;
	margin-right: 8px;
	min-width: 70px;
	font-size: 9pt;
	box-shadow: 2px 0px 3px #00000066;
	display: inline-block;
	color: #333333;
}
.roomnameplace a{
	color: #774400;
}


input[type="text"], input[type="password"], textarea, select{
	
	border: 1px #669966 solid;
	border-radius: 3px;
	padding: 6px;
	margin: 1px;
	background-color: #ffffff;
}
input[type="text"]:focus, input[type="password"]:focus, textarea:focus{
	background-color: #ffffcc;
}

input[type="submit"]{
	padding: 3px;
	padding-left: 12px;
	padding-right: 12px;
	border: 1px #009900 solid;
	border-radius: 3px;
	background-color: #e0ffe0;
	color: #447700;
	font-weight: bold;
}
input[type="submit"]:hover{
	background-color: #ddeedd;
}
input[type="button"],input[type="submit"] {
	-webkit-appearance: none;
}
input[type="radio"]:checked + label, input[type="checkbox"]:checked + label{
	color: #339900;
}
label:hover{
	background-image: url('white65.png'); 
}
label{
	padding: 3px;
	display: inline-block;
}

/* Switch */

.switchbutton{
	cursor: pointer;
	border: 1px solid #339933;
}
.swbtnleft{
	border-radius: 10px 0px 0px 10px;
	border-right: 0px solid #339933;
}
.swbtncenter{
	border-right: 0px solid #339933;
}
.swbtnright{
	border-radius: 0px 10px 10px 0px;
}
.enablebtn{
	color: #ffffff;
	background-color: #339933;
	padding: 2px;
}
.disablebtn{
	color: #33993366;
	background-color: #ffffff00; 
	padding: 2px;
}

.infomes{
	border: 1px #5588ff solid;
	background-color: #ddeeff;
	color: #113366;
	border-radius: 5px;
	margin: 5px;
	padding: 5px;
	padding-left: 10px;
}
.warnmes{
	border: 1px #cccc55 solid;
	background-color: #ffffdd;
	color: #666611;
	border-radius: 5px;
	margin: 5px;
	padding: 5px;
	padding-left: 10px;
}
.errormes{
	border: 1px #ff5555 solid;
	background-color: #ffdddd;
	color: #661111;
	border-radius: 5px;
	margin: 5px;
	padding: 5px;
	padding-left: 10px;
}
.noticemes{
	border: 1px #55ff55 solid;
	background-color: #ddffdd;
	color: #116611;
	border-radius: 5px;
	margin: 5px;
	padding: 5px;
	padding-left: 10px;
}

/* Chara box */
img.cicon{
	margin-right: 5px;
	border-radius: 2px;
}

div.charaframe, div.charaframe2, div.charaframeself{
	border-radius: 6px;
	margin: 8px;
	padding: 8px;
	margin-bottom: 8px;
	word-break: break-all;
	width: 390px;
	float: left;
	border: 1px solid #cccccc;
	background: url("white40.png"); 
}

div.charaframe2, div.charaframeself{
	border: 1px solid #229900;
	background: url("white65.png"); 
}

div.charaframe:hover{
	border: 1px solid #0099dd;
	
	background-color: #fcf0aa; 
	cursor: pointer;
}

small{
	color: #338800;
}

table.itemlist{
	min-width: 840px;
}

table.kadanlist{
	min-width: 450px;
}

table.worklist{
	min-width: 450px;
}

table.itemlist th, table.kadanlist th, table.worklist th{
	background-color: #44bb77;
	border-radius: 3px;
	color: #ffffff;
	padding: 3px;
	padding-left: 8px;
	padding-right: 8px;
}

table.itemlist td, table.kadanlist td, table.worklist td{
	padding-left: 8px;
	padding-right: 2px;
}

table{
	padding-left: 5px;
}

tr.odd{
	background-color: #f6fff6;
}
tr.even{
	background-color: #e6ffe6;
}

.talklist_main td{
	width: 50%;
}

/* -------------------- SectionStyle -------------------- */
.t0{
	color: #ff3322;
	font-size: 18pt;
	font-weight: bold;
	font-family: Verdana;
}
.t1{
	color: #2266ff;
	font-size: 18pt;
	font-weight: bold;
	font-family: Verdana;
}
.c0{
	color: #f06022;
	font-size: 18pt;
	font-weight: bold;
	font-family: Verdana;
}
.c1{
	color: #2244f0;
	font-size: 18pt;
	font-weight: bold;
	font-family: Verdana;
}
.c2{
	color: #339933;
	font-size: 18pt;
	font-weight: bold;
	font-family: Verdana;
}
.c3{
	color: #6644bb;
	font-size: 18pt;
	font-weight: bold;
	font-family: Verdana;
}
.c4{
	color: #ccaa33;
	font-size: 18pt;
	font-weight: bold;
	font-family: Verdana;
	text-shadow: 0 0 4px #fffcf0,0 0 3px #fffcf0, 0 0 2px #fffcf0;
}
.c5{
	color: #11aa11;
	font-size: 10pt;
	font-family: Verdana;
}
.c6{
	color: #f06060;
	font-size: 10.5pt;
	font-weight: bold;
	font-family: Verdana;
}
.c7{
	color: #f07020;
	font-size: 10pt;
	font-family: Verdana;
}
.heal{
	color: #55aa33;
	font-size: 18pt;
	font-weight: bold;
	font-family: Verdana;
}
.cri{
	color: #ccaa33;
	font-family: Verdana;
	text-shadow: 0 0 4px #fffcf0,0 0 3px #fffcf0, 0 0 2px #fffcf0;
}
.barhp{
	display:inline-block;
	border-bottom: 5px #39dd39 solid;
}
.barpd{
	display:inline-block;
	border-bottom: 5px #ff4444 solid;
}
.barsp{
	display:inline-block;
	border-bottom: 5px #f0a044 solid;
}
.barmp{
	display:inline-block;
	border-bottom: 5px #44a0f0 solid;
}
.barblank{
	display:inline-block;
	border-bottom: 5px #555555 solid;
}
.fl{
	/* 1000以上 */
	font-size: 24pt;
}
.fxl{
	/* 10000以上 */
	font-size: 28pt;
}


.skill{
	font-size: 20pt;
	color: #a08060;
	font-style: italic;
}

.csred{
	font-weight: bold;
	color: #d63939;
}

.csblue{
	color: #15E;
}

.csgold{
	font-weight: bold;
	color: #ddaa44;
}

.cswhite{
	color: #eeffee;
}

.csbold{
	font-weight: bold;
}

.cslilac{
	color:#9966ff;
}

.csgray{
	color: #999988;
}

hr{
	color: #cccccc;
	border-width: 1px;
	size: 1px;
}

strong{
	color: #ffbbbb;

}

.dashline{
	display: block;
	border: 0px #000000 solid;
	border-bottom: 1px #777733 dashed ;
	margin-top: 2px;
	margin-bottom: 2px;
}

.indent{
	margin-left: 40px;
}


.sheet{
	padding: 5px;
	margin: 5px;
	/*
	border: 8px #cc9966 solid;
	background-image: url("colk.jpg");
	*/
}
.cdatal{
	width: 490px;
	background-image: url("white65.png");
	padding: 5px;
	border-radius: 4px;
	border: 1px solid #bbbbbb;
	box-shadow: 0px 1px 2px #cccccc;
}
.cdatar{
	background-image: url("white65.png");
	border-radius: 4px;
	border: 1px solid #bbbbbb;
	box-shadow: 0px 1px 2px #cccccc;
}
.profile,.boardclip{
	color: #117700;
	padding: 4px;
	font-weight: bold;
	font-size: 14pt;
	margin-top: 6px;
	margin-left: -5px;
	margin-bottom: 10px;
}

.profiletext{
	margin: 13px;
}

.inner_boardclip{
	padding:4px; margin-left: 0px; padding-left: 15px;
	border-bottom: 2px #11aa11 dashed;
}

.markserif{
	color: #ffffff;
	width: 140px;
	margin: 1px;
	margin-right: 3px;
	font-weight: bold;
	display: inline-block;
	text-align: center;
	border-radius: 2px;
}
.marks{
	color: #ffffff;
	width: 38px;
	margin: 1px;
	margin-right: 3px;
	font-weight: bold;
	display: inline-block;
	text-align: center;
	border-radius: 2px;
}
.markd{
	color: #ffffff;
	width: 95px;
	margin: 1px;
	margin-right: 3px;
	font-weight: bold;
	display: inline-block;
	text-align: center;
	border-radius: 2px;
}
.markp{
	font-size: 14pt;
	color: #009900;
	width: 120px;
	margin: 1px;
	margin-right: 3px;
	padding-left: 12px;
	font-weight: bold;
	display: inline-block;
}
.markp2{
	color: #ffffff;
	width: 80px;
	margin: 1px;
	margin-right: 3px;
	font-weight: bold;
	display: inline-block;
	text-align: center;
	border-radius: 2px;
}
.marki0{
	background-color: #66bb00;
}
.marki1{
	background-color: #44bb77;
}
.marki2{
	background-color: #55cc55;
}
.marki3{
	background-color: #44dd44;
}
.skillname{
	width: 210px;
	display: inline-block;
}
.skilldesc{
	max-width: 600px;
	display: inline-block;
}
.statusx{
	display: inline-block;
}
.status{
	width: 140px;
	display: inline-block;
}
.status2{
	width: 180px;
	display: inline-block;
}
.status3{
	width: 40px;
	display: inline-block;
}
.status4{
	width: 138px;
	display: inline-block;
}
.type0{
	color: #ff2222;
}
.type1{
	color: #449922;
}
.type2{
	color: #2222cc;
}
.type3{
	color: #cc2222;
}
.type4{
	color: #bbbb00;
}
.type5{
	color: #ee895c;
}
.type6{
	color: #25bf8b;
}
.type7{
	color: #ffbc50;
}
.type8{
	color: #ab5de7;
}
.type9{
	color: #88bbff;
}
.type10{
	color: #30d0ee;
}
.type11{
	color: #55f077;
}
.type12{
	color: #ddbb60;
}
.type13{
	color: #bb6640;
}
.type14{
	color: #664ff5;
}
.type15{
	color: #999999;
}
.type16{
	color: #f96c24;
}
.typen{
	color: #22cc99;
}
.skills{
	color: #aa2222;
}