/* tag */

html { margin: 0; padding: 0; }

body { margin: 0 auto; padding: 0; color: #333; width: 980px; }

table { width: 100%; border-collapse: collapse; }

img { border: none; }

h1, h2, h3, h4 { margin: 0; }

a { text-decoration: none; color: #789; cursor: pointer; }

a:hover, a:focus, a:active { color: #c82; }

/* header & footer */

#head { width: 980px; }

#head #logo { width: 430px; }

#head #logo img { width: 430px; height: 110px; }

header { position: fixed; top: 0; background-color: #fff; z-index: 2; height: 145px; }

header #company { position: absolute; top: 45px; margin-left: -35px; }

header nav { text-align: right; }

header nav a { text-align: center; display: inline-block; margin-left: 6px; }

header nav a img { margin-bottom: 5px; }

header #language { text-align: right; }

header .sprite_language { position: absolute; right: 80px; }

#body { margin-top: 145px; }

/* common */

.center { text-align: center; }

.left { text-align: left; }

.right { text-align: right; }

.float_left { float: left; }

.float_right { float: right; }

.placeholder { color: #aaa; }

.small { font-size: 90%; }

.hidden { display: none; }

.clear { clear: both; }

.inner { padding-left: 15px; padding-right: 15px; }

.button { font-size: 90%; display: inline-block; padding: 0 10px; line-height: 24px; font-weight: bold; }

.button_yellow { border-radius: 5px; background-image: url(/en/image/button_yellow.png); color: #333 !important; }

.button_blue { border-radius: 5px; background-image: url(/en/image/button_blue.png); color: #eee !important; }

.button_green { border-radius: 5px; background-color: #b9d0d1; padding: 2px 20px; }

.button_green:hover { color: #666; }

.button_blue:hover, .button_blue:focus, .button_blue:active { color: #fea !important; }
/* about */

#_about #base { table-layout: fixed; }

#_about #base td { vertical-align: top; }

#_about .social a, #_about .name { margin-right: 20px; }

#_about #contact { border-top: 1px #7e5846 solid; text-align: center; margin-top: 40px; padding-top: 40px; }

#_about #form th { width: 150px; text-align: right; padding: 0 10px; vertical-align: top; }

#_about #form td { padding: 0 10px; }

#_about #form .input { border-radius: 5px; border: 1px #ccc solid; font-size: 100%; width: 100%; }

#_about #form input[type="submit"], #_about #form input[type="button"] { border: none; cursor: pointer; font-size: 100%; }

#_about #form textarea { width: 100%; height: 150px; }

#_about #confirm input[type="button"] { float: left; }

#_about #confirm input[type="submit"] { width: 150px; float: right; }

#_about #confirm #confirm_message { white-space: pre; }

#_about .error { text-align: center; border: 1px #333 solid; padding: 5px; background-color: #c76; font-weight: bold; }
/* blog */

#article { padding: 0 10px; vertical-align: top; float: left; width: 710px; }

#article .cover { background-color: #fff; width: 710px; }

#_blog #article .cover { position: fixed; }

#article .header { border-bottom: 1px #aaa solid; }

#article .header h3 a { font-size: 120%; color: #abc; font-weight: normal; }

#article .header h3 a:hover { color: #456; }

#article .header .info { font-size: 90%; text-align: right; }

#article .header .info address { display: inline; }

#article .fake { visibility: hidden; }

#article article { line-height: 200%; font-size: 90%; }

#article article blockquote { border: 1px #ccc solid; padding: 10px; background-color: #f5f5f5; border-radius: 5px; }

#side { float: right; vertical-align: top; width: 220px; background-color: #cdd; padding: 10px; border-radius: 5px; border: 1px #aba solid; }

#side input[type="text"] { height: 26px; line-height: 26px; border: 1px #ccc solid; width: 157px; vertical-align: bottom; }

#side select { width: 100%; }

#side #filter { border: 1px #9a9 solid; padding: 5px; box-sizing: border-box; margin-bottom: 10px; }

#side #filter .action { background-color: #b9d0d1; border: none; vertical-align: bottom; }

#side #filter div { margin-bottom: 10px; }

#side #filter .sprite_search { cursor: pointer; }

#side #archive h2 { background-color: #b9d0d1; padding: 5px; text-align: center; font-weight: normal; font-size: 100%; }

#side .entry { font-size: 90%; margin: 10px 5px 0 5px; border-bottom: 1px #ded solid; padding-bottom: 10px; }

#side .entry .author { text-align: right; }

#side .entry .title { font-weight: bold; }

#side .entry a { color: #333; }

#side .entry a:hover { color: #456; }

#side .summary { font-size: 90%; }
/* index */

#_index #screenshot { margin-left: 330px; position: relative; }

#_index #screenshot #banner { display: block; width: 420px; height: 40px; line-height: 40px; background-color: #000; padding: 10px; color: #fff; font-size: 150%; font-weight: bold; margin-top: -116px; margin-left: 130px; opacity: 0.7; filter: alpha(opacity=70); }

#_index #screenshot img { width: 695px; height: 383px; }

#_index #description { text-align: center; width: 450px; margin-top: -320px; position: relative; }

#_index #recent { margin-top: 240px; position: relative; }

#_index #recent td { vertical-align: top; padding: 5px; }

#_index .section { font-weight: bold; border-bottom: 1px #aaa solid; padding-bottom: 5px; margin-bottom: 15px; }

#_index #twitter .section { margin-bottom: 0; }

#_index .section .title { float: left; }

#_index .section .icon { float: right; }

#_index .more { text-align: right; font-size: 90%; }

#_index .rss { float: right; }

#_index #twitter { width: 360px; }

#_index .tweet { font-size: 85%; margin-bottom: 20px; }

#_index .tweet .link { font-size: 90%; }

#_index .tweet .name { margin-top: 10px; border-bottom: 1px #aaa dotted; margin-bottom: 5px; }

#_index .tweet a { color: #333 !important; margin-bottom: 10px; }

#_index .tweet a:hover { color: #666 !important; }

#_index .tweet .date { float: left; font-size: 90%; }

#_index .tweet .author { float: right; font-size: 90%; }

#_index .clean { border: none !important; }

#_index .border { overflow: hidden; border: 1px #888 solid; border-radius: 10px 0 10px 0; }

#_index .box { height: 300px; overflow: auto; padding: 5px; background-color: #fafafa; }

#_index .blog { font-size: 90%; }

#_index .blog .title { float: left; }

#_index .blog .date { float: right; }
/* news */

#_news #article article { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px #ccc solid; }
/* project */

#_project .project { table-layout: fixed; }

#_project .project td { padding: 10px; font-size: 90%; }

#_project .title { color: #7e5846; padding-bottom: 10px; border-bottom: 1px #ccc solid; text-align: center; }

#_project .frame { position: relative; float: left; }

#_project .screenshot { width: 480px; height: 300px; }

#_project .magnify { position: absolute; left: 220px; top: 130px; opacity: 0.5; }

#_project .button_green { color: #333; }

#_project .button_green:hover { color: #666; }

	.sprite_blog { background : url(/en/image/) 0px 0; width : 16px; height : 16px; }

	.sprite_button { background : url(/en/image/) -16px 0; width : 80px; height : 30px; }

	.sprite_color_feed { background : url(/en/image/) -96px 0; width : 32px; height : 32px; }

	.sprite_color_twitter { background : url(/en/image/) -128px 0; width : 32px; height : 32px; }

	.sprite_external { background : url(/en/image/) -160px 0; width : 12px; height : 11px; }

	.sprite_feed { background : url(/en/image/) -172px 0; width : 32px; height : 32px; }

	.sprite_icon_about { background : url(/en/image/) -204px 0; width : 32px; height : 32px; }

	.sprite_icon_blog { background : url(/en/image/) -236px 0; width : 32px; height : 32px; }

	.sprite_icon_contact { background : url(/en/image/) -268px 0; width : 32px; height : 32px; }

	.sprite_icon_index { background : url(/en/image/) -300px 0; width : 32px; height : 32px; }

	.sprite_icon_news { background : url(/en/image/) -332px 0; width : 32px; height : 32px; }

	.sprite_icon_project { background : url(/en/image/) -364px 0; width : 32px; height : 32px; }

	.sprite_icon_twitter { background : url(/en/image/) -396px 0; width : 32px; height : 32px; }

	.sprite_item { background : url(/en/image/) -428px 0; width : 19px; height : 19px; }

	.sprite_item_active { background : url(/en/image/) -447px 0; width : 19px; height : 19px; }

	.sprite_language { background : url(/en/image/) -466px 0; width : 24px; height : 22px; }

	.sprite_magnify { background : url(/en/image/) -490px 0; width : 52px; height : 52px; }

	.sprite_magnify_on { background : url(/en/image/) -542px 0; width : 52px; height : 52px; }

	.sprite_newsletter { background : url(/en/image/) -594px 0; width : 24px; height : 15px; }

	.sprite_search { background : url(/en/image/) -618px 0; width : 45px; height : 30px; }

	.sprite_shadow_bottom { background : url(/en/image/) -663px 0; width : 939px; height : 24px; }

	.sprite_shadow_top { background : url(/en/image/) -1602px 0; width : 980px; height : 24px; }

	.sprite_social_blog { background : url(/en/image/) -2582px 0; width : 19px; height : 19px; }

	.sprite_social_blog_on { background : url(/en/image/) -2601px 0; width : 19px; height : 19px; }

	.sprite_social_facebook { background : url(/en/image/) -2620px 0; width : 10px; height : 22px; }

	.sprite_social_facebook_on { background : url(/en/image/) -2630px 0; width : 10px; height : 22px; }

	.sprite_social_twitter { background : url(/en/image/) -2640px 0; width : 22px; height : 18px; }

	.sprite_social_twitter_on { background : url(/en/image/) -2662px 0; width : 22px; height : 18px; }

	.sprite_twitter { background : url(/en/image/) -2684px 0; width : 32px; height : 32px; }
