@charset "utf-8";
body {
	font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
	font-size:16px;
}


/*a { color: #44f; transition: background-color .4s, color .4s; }
a:visited {color: #44f;}
a:hover{ background-color: rgba(145, 171, 255, 0.253); }*/

input[type="text"], input[type="number"], textarea {
	font-size:15px;
	width:240px;
	max-width: 92%;
	margin-left:4px;
	border-radius:8px;

	background: #375ea7b3;
	color: #fff;
	border: 1px solid #ffffff96;
	padding: 4px;
	margin: 2px;
}
input[type="text"]::placeholder,
input[type="number"]::placeholder,
textarea::placeholder {
	color: rgba(255, 255, 255, 0.68);
	padding: 2px;
}

input[type="button"] {
	font-size:15px;padding:3px 8px 3px 8px;
	margin:8px;border-radius:5px;
	background: #2139f357;
	border: 1px solid #ffffff96;
	color: #fff;
	box-shadow: 0px 0px 6px rgba(72, 124, 255, .99);
}


a.cS1,
a.cS1:link,
a.cS1:visited {
	outline:none;color:white;text-decoration:none;background-color:transparent;
}
a.cS1:hover {
	text-decoration:underline;
	text-shadow: 0px 0px 8px white;
}
nobr {
	white-space: nowrap;
}

#idTheContainer {
	margin:10px auto;
	max-width: 750px;
	text-align: center;
	line-height: 2.2;
}

#idAuthArea {
	position: relative;
	text-align: left;
	margin-top: 25px;
	padding: 30px 12px 12px 22px;
	border-radius: 8px;
	width: 340px;
	
	background-image: -webkit-gradient(
		linear,
		left top,
		left bottom,
		color-stop(0, #D8D7FA),
		color-stop(1, #F4F0FF)
	);
	background-image: -o-linear-gradient(bottom, #D8D7FA 0%, #F4F0FF 100%);
	background-image: -moz-linear-gradient(bottom, #D8D7FA 0%, #F4F0FF 100%);
	background-image: -webkit-linear-gradient(bottom, #D8D7FA 0%, #F4F0FF 100%);
	background-image: -ms-linear-gradient(bottom, #D8D7FA 0%, #F4F0FF 100%);
	background-image: linear-gradient(to bottom, #D8D7FA 0%, #F4F0FF 100%);
}

#idAuthComment {
	padding-left:20px;padding-right:10px;word-wrap:break-word;
}
#idTextWebsite {
	width:200px;font-size:16px;
}
#idTextareaAuthComment {
	width:400px;height:100px;font-size:16px;
}
.cButtonTextPC {
	font-size: 14px;
	display: inline;
}
.cButtonTextM {
	display: none;
}


#idCopyIndex, #idMyList, #idMod {
	margin-right:10px;
	padding:15px;
	padding-top:9px;
	padding-bottom:9px;
}

/*button*/
.nav, .nav li {
	font: 11pt Verdana, sans-serif;
	font-weight: bold;
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
	float: left;
}
.nav {
	padding: 15px 6px 15px 6px;
}
.nav .button {
	position: relative;
	padding: 5px 10px;
	margin: 0 -1px 0 0;
	border-radius: 0;
}
.nav .button img {
	position: absolute;
	top: -8px;
	left: -150px;
}
.nav .button.cur,
.nav .button.cur:hover {
	color: #777777;
	background: #f8f8f8;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.nav .button.cur:hover {
	border: solid 1px #888888;
}
.nav .button:hover {
	z-index: 10;
}
.nav .button.nav-first {
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}
.nav .button.nav-last {
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}

.button {
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none!important;
	text-shadow: 0 1px 0 rgba(255,255,255,.4);
	border-radius: 5px;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2), inset 0 -1px 2px rgba(255,255,255,1);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2), inset 0 -1px 2px rgba(255,255,255,1);
	box-shadow: 0 1px 2px rgba(0,0,0,.2), inset 0 -1px 2px rgba(255,255,255,1);
	white-space: nowrap;

	/* default colors */
	color: #222222!important;
	border: solid 1px #AAAAAA;
	background: #e3e3e3;
	background: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#e3e3e3));
	background: -moz-linear-gradient(top,  #f6f6f6,  #e3e3e3);
	background: linear-gradient(top,  #f6f6f6,  #e3e3e3);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#e3e3e3');
}
.button:hover {
	background: #cfcfcf;
	background: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), to(#cfcfcf));
	background: -moz-linear-gradient(top,  #f2f2f2,  #cfcfcf);
	background: linear-gradient(top,  #f2f2f2,  #cfcfcf);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2f2f2', endColorstr='#cfcfcf');
	border-color: #606060;
}
.button:active {
	background: -webkit-gradient(linear, left top, left bottom, from(#cfcfcf), to(#f2f2f2));
	background: -moz-linear-gradient(top,  #cfcfcf,  #f2f2f2);
	background: linear-gradient(top,  #cfcfcf,  #f2f2f2);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#cfcfcf', endColorstr='#f2f2f2');
}

.greenbutton {
	background: hsl(100,30%,93%);
	background: -webkit-gradient(linear, left top, left bottom, from(hsl(100,30%,97%)), to(hsl(100,30%,84%)));
	background: -moz-linear-gradient(top,  hsl(100,30%,97%),  hsl(100,30%,84%));
	background: linear-gradient(top,  hsl(100,30%,97%),  hsl(100,30%,84%));
	border-color: hsl(100,30%,70%);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#e3e3e3');
}
.greenbutton:hover {
	background: hsl(100,30%,87%);
	background: -webkit-gradient(linear, left top, left bottom, from(hsl(100,30%,94%)), to(hsl(100,30%,77%)));
	background: -moz-linear-gradient(top,  hsl(100,30%,94%),  hsl(100,30%,77%));
	background: linear-gradient(top,  hsl(100,30%,94%),  hsl(100,30%,77%));
	border-color: hsl(100,30%,41%);
}
.greenbutton:active {
	background: hsl(100,30%,77%);
	background: -webkit-gradient(linear, left top, left bottom, from(hsl(100,30%,77%)), to(hsl(100,30%,83%)));
	background: -moz-linear-gradient(top,  hsl(100,30%,77%),  hsl(100,30%,83%));
	background: linear-gradient(top,  hsl(100,30%,77%),  hsl(100,30%,83%));
	border-color: hsl(100,30%,41%);
}

.mainbutton .button {
	box-sizing: border-box;
	font: 11pt Verdana, sans-serif;
	font-weight: bold;

	display: block;
	width: 200px;
	padding: 15px 0;
}
.button small {
	font-weight: normal;
}

.cSprite0, .cSpriteSelect {
	margin:0px;
	border:2px solid transparent;
	width:20px;
	height:20px;
}



/* tags */
#idTagsArea {
	color: #fff;
	text-align:center;font-size:14px;width:650px;margin-top:35px;margin-bottom:25px;
}
#idTagsArea table {
	color:#fff;margin-top:10px;margin-left:10px;
}
#idTagsEditFrame {
	margin-top:20px;text-align:left; border: dashed 2px #c9e2ff;
	border-radius:8px;padding:6px;padding-left:10px;
	background:#38a7ff8a;
	text-shadow:1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000;
	box-shadow: 0px 2px 4px #a2c1ff;
}
#idButtonTagsEditEnd {
	padding:1px;font-size:15px;padding-left:8px;padding-right:8px;
	margin:8px;border-radius:5px;
}
#idTextTagsAdd {
	width:200px;padding:4px;font-weight:bold;
}
#idButtonTagsAdd {
	padding:1px;font-size:15px;padding-left:8px;padding-right:8px;
	margin:8px;margin-left:4px;border-radius:5px;
}
[id*="idTagDeleteButton"]{
	padding:1px;font-size:14px;padding-left:8px;padding-right:8px;margin:8px;margin-left:4px;
	border-radius:5px;
}

#idAuthArea, #idTagsArea {
	margin: 20px auto;
}

@media all and (max-width: 580px) {
	.cTagSpInfo {display:block;margin:2px 8px 10px;}
	#idTheContainer {
		width: 98%!important;
		font-size: 11px;
		/*transform: scale(0.84);
		transform-origin: center top;*/
	}
	#idAuthArea, #idTagsArea {
		width: 84%;
		margin: 20px auto;
	}
}

@media all and (max-width: 450px) {
	.cButtonTextPC {
		display: none;
	}
	.cButtonTextM {
		display: inline;
	}
	#idMain {
		width: 280px;
	}
	#idTime {
		font-size: 12px;
	}
	#idAuthArea {
		font-size: 12px;
		width: 240px;
	}
	#idCopyIndex, #idMod, #idMyList {
		padding-left: 9px;
		padding-right: 9px;
		font-size:11px!important;
	}
	#idTextWebsite {
		width:140px;
		font-size:10px;
	}
	#idDeleteLink {
		font-size:10px;
	}
	#idTextareaAuthComment {
		width:180px;font-size:11px;
	}
}