//@main-backcolor: #E6FFE9;
@main-backcolor: #ebf1ff;
@registBack-color: #CEF9DC;
@edit-backcolor: white;
@navi-backcolor: #DCDCDC;
@notice-backcolor: #FFCC33;
@noedit-backcolor: #DCDCDC;

@waterInfoBar-color: #33CCFF;
@actionInfoBar-color: #FF9933;
@comment-color: #eef5f9;
@actionInfoTbl-color: #c4e3f2;

@submit-color    : #0066FF;
@submit-color-h  : #0033FF;

@regist-border: 1px solid #00CCFF;
@input-border: #00CCFF;

@red : #FF0000;

html{
	width: 100%;
	height:100%;
}
body {
	width: 100%;
	height:100%;
	margin: 0px auto;
	padding: 0px;
	top: 0px;
	font-size: 62.5%;
}

body.mac {
	font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","Osaka","ＭＳ Ｐゴシック",sans-serif;
}

body.win {
	font-family: "メイリオ","Meiryo","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック","Osaka",sans-serif;
}
//body.win {
//	font-family: "Helvetica", "Arial", "Liberation Sans", "FreeSans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
//}

.placeholder { color: #777 }

.red{
	color: @red;
	font-size: 0.9em;
}
a{
	text-decoration: none;
	cursor: pointer;
	color: #000000;
}
a:hover { 
	color: #0099FF;
	text-decoration: underline;
 }

input.err { background-color: pink; }

.err_text{
	color: red;
}

.float_r{
	float: right;
}
.float_l{
	float: left;
}

textarea{
	resize: none;
	border-color: #2087c1;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}

input {
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}

.comUserPic(@c-width: 30px, @c-height: 30px) {
	width: @c-width;
	height: @c-height;
	border: 0px;
}

.busy{
	width: 55px;
	height: 55px;
	visibility: hidden;
	margin: 0 auto;
}

.copyright{
	font-size: 0.7em;
}

/*-------------
parts
-------------*/
.upd_done{
	background-color: @notice-backcolor;
	height: 24px;
	line-height: 24px;
	font-size: 1.6em;
	font-weight: bold;
	color:  white;
	padding: 5px 0px 5px 0px;
	text-align: center;
}

/*-------------
editInfo編集
-------------*/
#firstLineInHeader {
	.editInfoBtn{
		position: absolute;
		top: 0px;
		right: 0px;
		width: 20px;
		height: 20px;
		visibility: hidden;
		cursor: pointer;
		z-index: 20;
	}
	.editInfoSlideBox {
		position: absolute;
		border: 1px #787878 solid;
		background-color: white;
		display: none;
		cursor: pointer;
		width : 146px;
		text-align: left;
		z-index: 51;
		color: #000000;
		font-size  : 1.2em;
		font-weight: normal;
		div{
			border-bottom: 1px #DDDDDD solid;
		}
		a{
			margin-left: 10px;
			width: 95%;
		}
	}
}

.comEditInfo{
	.editInfoBtn{
		position: absolute;
		top: 0px;
		right: 0px;
		width: 20px;
		height: 20px;
		visibility: hidden;
		cursor: pointer;
		z-index: 20;
	}
	.editInfoSlideBox {
		position: absolute;
		border: 1px #787878 solid;
		background-color: white;
		display: none;
		cursor: pointer;
		width : 148px;
		text-align: left;
		z-index: 51;
		color: #000000;
		font-size  : 1.2em;
		font-weight: normal;
		a{
			margin-left: 10px;
			width: 95%;
		}
	}
}

/*-------------
button
-------------*/
.submitBtn( @b-width: 15%, @b-height: 40px, @b-padding:9px, @b-font-size: 1.6em){
  width: @b-width;
  height: @b-height;
  top: 1px;
  cursor: pointer;
  color: white;
  font-size: @b-font-size;
  font-weight:bold;
  text-align: center;
  display: block;
  text-decoration: none;
  padding: 6px 0;
  border-radius: 5px;
//  box-shadow: 0 3px 0 #A5BBC6;
  text-decoration: none;
  background: #0081d3; /* Old browsers */
	background: -moz-linear-gradient(top,  #0081d3 0%, #0081d3 77%, #01689f 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0081d3), color-stop(77%,#0081d3), color-stop(100%,#01689f)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #0081d3 0%,#0081d3 77%,#01689f 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #0081d3 0%,#0081d3 77%,#01689f 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #0081d3 0%,#0081d3 77%,#01689f 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #0081d3 0%,#0081d3 77%,#01689f 100%); /* W3C */
	filter: literal("progid:DXImageTransform.Microsoft.gradient(startColorstr='#0081d3', endColorstr='#01689f',GradientType=0)"); /* IE6-9 */
//             &:hover{
//             	  background:#0c95de;
//  					box-shadow: 0 1px 0 #A5BBC6;
//  					margin-top:3px;
//             }
}


/*-------------
commentTable
-------------*/
th, tr {
	border-width: 0px 0px;
}

.comment-table{
	#textContainer{
		border-width: 0px 0px;
		border-collapse: separate;
		border-spacing : 0px 1px;
		position: relative;
		width    : 97%;
		text-align: left;
		margin-left: 5px;
		margin-bottom: 5px;
		a{
			font-weight: bold;
		}
		#mainCommentContainer {
			padding: 50px;
			a{
				color: -webkit-link;
			}
		}
		#optionContainer{
			width: 100%;
			font-size:0.9em;
			a{
				color: white;
			}
			a:hover { 
				color: #0099FF;
				text-decoration: underline;
			 }
			#watchUserEventView {
				padding: 5px 5px 5px 5px;
				color: #ffffff;
				background-color: #175d81;
			}
			#watchUserCountView {
				width: auto;
				padding: 5px 5px 5px 5px;
//				background-color: #f3f3f3;
			.watchUserCount {
				width: 100%;
//				width:auto;
//				width: 800px;
//				background-color: #f3f3f3;
			}
			}
		}
		.sub-comment;

	}
}

.sub-comment{
	.thRight{
		position: relative;
		padding: 5px 5px 5px 10px;
		.infoEditSubComment{
			position: absolute;
			top: 0px;
			right: 0px;
			width: 16px;
			height: 16px;
			filter: alpha(opacity=80);
			-moz-opacity:0.80;
			opacity:0.80;
			cursor: pointer;
		}
		.editInfoAddCommentBtn{
			position: absolute;
			.submitBtn(16%, 18px, 2px, 1em);
			bottom: 4px;
			right: 2px;
		}
		.input_date {
			color: #999999;
		}
	}
	.editSubCommentSlideBox {
		position: absolute;
		border: 1px #787878 solid;
		background-color: white;
		display: none;
		cursor: pointer;
		width : 36px;
		text-align: center;
		z-index:1;
		div{
			border-bottom:1px #DDDDDD solid;
			width: 95%;
		}
	}
	.userPic {
		.comUserPic();
//		width: 30px;
//		height: 30px;
//		border: 0px;
	}
	#infoAddComment{
		position: relative;
		width: 100%;
		#submitInfoAddComment{
			position: relative;
			.submitBtn(16%, 20px, 6px, 1em);
			bottom: 2px;
			right: 2px;
		}
	}
	.infoSubCommentContainer {
		background-color: @comment-color;
		margin-bottom: 1px;
		margin-top: 0;
		textarea{
			width: 80%;
		}
		a{
			color: -webkit-link;
		}
	}
	.infoAddCommentContainer {
		background-color: @comment-color;
		border: 2px solid #2d8fc4;
		margin-bottom: 1px;
		margin-top: 0;
		textarea{
			width: 80%;
		}
	}
}


/*-------------
textext   for groupTag
-------------*/
.text-core {
  position: relative;
}
.text-core .text-wrap {
  background: #fff;
  position: absolute;
}
.text-core .text-wrap textarea, .text-core .text-wrap input {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
  resize: none;
  position: absolute;
  z-index: 1;
  background: none;
  overflow: hidden;
  margin: 0;
  padding: 3px 5px 4px 5px;
  white-space: nowrap;
  line-height: 13px;
  height: auto;
}
.text-core .text-wrap .text-arrow {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  top: 0;
  right: 0;
  height: 22px;
  background: url(/img/remove.png) 50% 50% no-repeat;
  cursor: pointer;
  z-index: 2;
}
.text-core .text-wrap .text-dropdown {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0;
  position: absolute;
  z-index: 3;
  background: #fff;
  width: 100%;
  max-height: 100px;
  padding: 1px;
  display: none;
  overflow-x: hidden;
  overflow-y: auto;
}
.text-core .text-wrap .text-dropdown.text-position-below {
  margin-top: 1px;
}
.text-core .text-wrap .text-dropdown.text-position-above {
  margin-bottom: 1px;
}
.text-core .text-wrap .text-dropdown .text-list .text-suggestion {
  padding: 3px 5px;
  cursor: pointer;
}
.text-core .text-wrap .text-dropdown .text-list .text-suggestion em {
  text-decoration: underline;
}
.text-core .text-wrap .text-dropdown .text-list .text-suggestion.text-selected {
  color: #fff;
  background: #6d84b4;
}
.text-core .text-wrap .text-focus {
  -webkit-box-shadow: 0px 0px 6px #6d84b4;
  -moz-box-shadow: 0px 0px 6px #6d84b4;
  box-shadow: 0px 0px 6px #6d84b4;
  position: absolute;
  width: 100%;
  height: 100%;
  display: none;
}
.text-core .text-wrap .text-focus.text-show-focus {
  display: block;
}
.text-core .text-wrap .text-prompt {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  width: 100%;
  height: 100%;
  margin: 1px 0 0 2px;
  color: #c0c0c0;
  overflow: hidden;
  white-space: pre;
}
.text-core .text-wrap .text-prompt.text-hide-prompt {
  display: none;
}
.text-core .text-wrap .text-tags {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  width: 100%;
  height: 100%;
  padding: 3px 35px 3px 3px;
  cursor: text;
}
.text-core .text-wrap .text-tags.text-tags-on-top {
  z-index: 2;
}
.text-core .text-wrap .text-tags .text-tag {
  float: left;
}
.text-core .text-wrap .text-tags .text-tag .text-button {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  float: left;
  background: #e2e6f0;
  color: #000;
  padding: 0px 17px 0px 3px;
  margin: 0 2px 2px 0;
  cursor: pointer;
  height: 16px;
}
.text-core .text-wrap .text-tags .text-tag .text-button a.text-remove {
  position: absolute;
  right: 3px;
  top: 2px;
  display: block;
  width: 11px;
  height: 11px;
  background: url(/img/remove.png) 0 0 no-repeat;
}
.text-core .text-wrap .text-tags .text-tag .text-button a.text-remove:hover {
  background-position: 0 -11px;
}
.text-core .text-wrap .text-tags .text-tag .text-button a.text-remove:active {
  background-position: 0 -22px;
}




/*
 * slidy の アイコン位置
 */
 #slidyBanner {
	 .movePrev {
	 	position: absolute;
	 	top: 50% - 8px;
	 }
	 .moveNext {
	 	position: absolute;
	 	top: 50% - 8px;
	 }
}