@charset "UTF-8";

/* @group Initialize */

html, body, h1, h2, h3, h4, h5, h6, address, blockquote, div, p, pre, abbr, cite, code, dfn, em, kbd, q, samp, span, strong, var, dl, dt, dd, ol, ul, li, b, i, small, sub, sup, del, ins, form, fieldset, label, legend, caption, table, td, th, tr, tbody, thead, tfoot, img, object, iframe {
	margin: 0;
	padding: 0;
}

/* @end */

/* @group Common */

html {
	font-size: 100%;
}

body {
	color: rgb(200,200,200);
	background-color: rgb(0,0,0);
	font: 87.5%/1.5 "Lucida Grande", "Lucida Sans Unicode", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}

a {
	overflow: hidden;
}

a:link, a:visited {
	color: rgb(200,200,200);
	text-decoration: none;
	-moz-transition: color 0.5s ease-in;
	-webkit-transition: color 0.5s ease-in;
	transition: color 0.5s ease-in;
}

a:hover, a:active {
	color: rgb(255,255,255);
	text-decoration: underline;
}

::-moz-selection {
	color: rgb(255,255,255);
	background-color: rgb(200,200,200);
}

::selection {
	color: rgb(255,255,255);
	background-color: rgb(200,200,200);
}

ul, li {
	list-style-type: none;
}

img {
	border-width: 0;
}

/* @end */

/* @group Layout */

#wrapper {
	position: absolute;
	width: 502px;
}

#content {
	position: absolute;
	top: 30px;
	left: 50px;
	z-index: 100;
	width: 402px;
	background-image: url(../img/bg_content.png);
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

#copyright {
	position: fixed;
	right: 30px;
	bottom: 20px;
	z-index: 50;
	font-size: 0.857em;
	text-shadow: 0 1px 1px rgb(0,0,0);
}

/* @end */

/* @group Home */

.ttl-pocketbase {
	margin: 21px 0 12px 21px;
}

.homecopy {
	margin: 0 0 31px 21px;
}

.ttl-recentposts {
	margin: 0 0 5px 21px;
}

.recentposts {
	margin: 0 0 16px 25px;
	width: 352px;
	font-size: 0.857em;
}

.recentposts li {
	margin-bottom: 3px;
	padding-left: 16px;
	background: url(../img/ico_rpmarker.png) no-repeat 5px 6px;
}

/* @end */

/* @group About */

.ttl-about {
	margin: 21px 0 15px 21px;
}

.aboutavatar {
	margin: 0 0 16px 123px;
}

.ttl-webmaster {
	margin: 0 0 6px 21px;
}

.aboutcopy {
	margin: 0 0 31px 21px;
}

/* @end */

/* @group Contact */

.ttl-contact {
	margin: 21px 0 12px 21px;
}

.contactcopy {
	margin: 0 0 19px 21px;
}

.mailform {
	margin: 0 0 27px 25px;
	width: 352px;
}

fieldset {
	border-width: 0;
}

label {
	font-size: 0.786em;
}

.mailform dt {
	margin-bottom: 2px;
}

.mailform dd {
	margin-bottom: 8px;
}

#name, #email, #url, #message {
	margin: 0;
	padding: 3px;
	border: 1px solid rgb(255,255,255);
	width: 344px;
	color: rgb(80,80,80);
	font-size: 0.857em;
	font-family: inherit;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	opacity: 0.7;
	-moz-transition: opacity 0.5s ease-in-out;
	-webkit-transition: opacity 0.5s ease-in-out;
	transition: opacity 0.5s ease-in-out;
}

#message {
	height: 105px;
	min-height: 105px;
	overflow: auto;
	resize: vertical;
}

#name:hover, #email:hover, #url:hover, #message:hover, #name:focus, #email:focus, #url:focus, #message:focus {
	color: rgb(100,100,100);
	opacity: 1.0;
}

#submit {
	margin: 0 0 0 -2px;
	padding: 0;
	border-width: 0;
	display: block;
	width: 116px;
	height: 25px;
	background: transparent url(../img/btn_submit.png) no-repeat 0 0;
	text-indent: -9999px;
	cursor: pointer;
}

#submit:hover {
	background-position: 0 -25px;
}

.wtn_copyright {
	display: none;
}

/* @end */

/* @group Navi */

.navi {
	margin: 0 0 15px 25px;
	height: 26px;
}

.navi-bottom {
	margin-bottom: 23px;
}

.navi li {
	margin: 0 8px 0 0;
	float: left;
	width: 112px;
	height: 26px;
}

.navi li a {
	display: block;
	width: 112px;
	height: 26px;
	background: url(../img/btn_navi.png) no-repeat;
	text-indent: -9999px;
}

li.home a {
	background-position: 0 0;
}

li.home a:hover {
	background-position: 0 -26px;
}

li.about a {
	background-position: -112px 0;
}

li.about a:hover {
	background-position: -112px -26px;
}

li.contact a {
	background-position: -224px 0;
}

li.contact a:hover {
	background-position: -224px -26px;
}

li.blog a {
	background-position: -336px 0;
}

li.blog a:hover {
	background-position: -336px -26px;
}

/* @end */

/* @group Activity */

.activity {
	margin: 0 0 23px 25px;
	height: 34px;
}

.activity li {
	margin: 0 8px 0 0;
	float: left;
	width: 32px;
	height: 34px;
}

.activity li a {
	display: block;
	width: 32px;
	height: 34px;
	background: url(../img/ico_activity.png) no-repeat;
	text-indent: -9999px;
}

li.rss1 a {
	background-position: 0 0;
}

li.rss1 a:hover {
	background-position: 0 -34px;
}

li.rss2 a {
	background-position: -32px 0;
}

li.rss2 a:hover {
	background-position: -32px -34px;
}

li.atom a {
	background-position: -64px 0;
}

li.atom a:hover {
	background-position: -64px -34px;
}

li.twitter a {
	background-position: -96px 0;
}

li.twitter a:hover {
	background-position: -96px -34px;
}

li.googleplus a {
	background-position: -128px 0;
}

li.googleplus a:hover {
	background-position: -128px -34px;
}

li.facebook a {
	background-position: -160px 0;
}

li.facebook a:hover {
	background-position: -160px -34px;
}

li.mixi a {
	background-position: -192px 0;
}

li.mixi a:hover {
	background-position: -192px -34px;
}

/* @end */

/* @group maxImage Scaling */

.loader {
	margin: -12px 0 0 -12px;
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 9999;
	width: 24px;
	height: 24px;
}

.slidemaximage {
	display: none;
	position: fixed !important;
}

.bgmaximage {
	position: fixed !important;
}

/* @end */

/* @group tipsy */

.tipsy {
	padding: 5px;
	background: url(../img/ico_tipsy.png) no-repeat;
	font-size: 10px;
	opacity: 0.8;
}

.tipsy-inner {
	padding: 5px 8px 4px 8px;
	max-width: 200px;
	color: rgb(0,0,0);
	background-color: rgb(255,255,255);
	text-align: center;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}

.tipsy-north {
	background-position: top center;
}

.tipsy-south {
	background-position: bottom center;
}

.tipsy-east {
	background-position: right center;
}

.tipsy-west {
	background-position: left center;
}

/* @end */

/* @group IE6 Hack */

.ie6hack_alertbox h2 {
	margin-bottom: 0.5em;
	border-bottom: 1px solid rgb(150,150,150);
}

.ie6hack_alertbox p {
	margin-bottom: 1em;
}

.ie6hack_alertbox li {
	margin-right: 1em;
	float: left;
}

.ie6hack_alertbox li a {
	padding-left: 26px;
	display: block;
	line-height: 25px;
}

.bl-chrome a {
	background: url(../img/ico_browser.png) no-repeat 0 0;
}

.bl-chrome a:hover {
	background-position: 0 -25px;
}

.bl-firefox a {
	background: url(../img/ico_browser.png) no-repeat 0 -50px;
}

.bl-firefox a:hover {
	background-position: 0 -75px;
}

.bl-safari a {
	background: url(../img/ico_browser.png) no-repeat 0 -100px;
}

.bl-safari a:hover {
	background-position: 0 -125px;
}

.bl-opera a {
	background: url(../img/ico_browser.png) no-repeat 0 -150px;
}

.bl-opera a:hover {
	background-position: 0 -175px;
}

.ie6hack_alertbox a:link, .ie6hack_alertbox a:visited {
	color: rgb(150,150,150);
	text-decoration: underline;
}

.ie6hack_alertbox a:hover, .ie6hack_alertbox a:active {
	color: rgb(0,0,0);
	text-decoration: underline;
}

/* @end */

