/*==========================================================
  Reset
==========================================================*/

html, body, h1, h2, h3, h4, h5, h6, p, address, pre, blockquote, code, samp, var, kbd, cite, dfn, em, strong, abbr, q, a, dl, dt, dd, ol, ul, li, del, ins, form, fieldset, legend, label, table, caption, thead, tfoot, tbody, colgroup, col, th, td, img, object {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
}
:focus { outline: 0; }
h1, h2, h3, h4, h5, h6 { font-weight:normal; }
address, code, var, cite, dfn, em, strong, caption, th { font-style: normal; font-weight: normal; }
abbr { font-variant: normal; }
q:before, q:after { content: ""; }
a { color: #000; text-decoration: none; }
ol, ul { list-style: none outside; }
del, ins { text-decoration: none; }
table{ border-collapse: collapse; border-spacing: 0; }
table, th, td { vertical-align: middle; }
caption, th { text-align: left; }
img { vertical-align: bottom; }



/*==========================================================
  Typography
==========================================================*/

body {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Arial, Helvetica, Clean, sans-serif;
  font-size: 13px;
  line-height: 1.66;
}
h1, h2, h3, h4, h5, h6 { font-weight: bold; margin-bottom: 16px; }
p, address, pre, blockquote { margin-bottom: 16px; }
pre, code, samp, kbd { font-family: "Osaka－等幅", Osaka-Mono, "ＭＳ ゴシック", "MS Gothic", monospace; }
pre
{
  white-space: -moz-pre-wrap;  /* Firefox2 */
  white-space: -o-pre-wrap;  /* Opera7 */
  white-space: pre-wrap;  /* CSS3 */
}
address, blockquote, em, dfn, var, cite, q { font-style: italic; }
strong, dfn { font-weight: bold; }
a { text-decoration: underline; }
dl { margin-bottom: 16px; }
dt { font-weight: bold; }
dd { margin-left: 16px; }
ol, ul { margin: 0 16px 16px; }
ol { list-style-type: decimal; }
ul { list-style-type: disc; }
li ol, li ul, li dl, dd ol, dd ul, dd dl { margin-bottom: 0; }
del { text-decoration: line-through; }
fieldset { margin-bottom: 16px; padding: 16px 16px 0 16px; }
legend { font-weight: bold; }
input, select, textarea {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Arial, Helvetica, Clean, sans-serif;  /* Mac */
  font-weight: normal;
  font-size: 99%;  /* Mac Safari */
}
table { margin-bottom: 16px; width: 100%; }
caption, th, td { padding: 4px 5px; }
th { font-weight: bold; }



/*==========================================================
  Figure
==========================================================*/

dl.figure, ol.figure, ul.figure { margin: 0 16px 16px; }
ol.figure, ul.figure { list-style-type: none; }
dl.figure dd { margin-left: 0; }



/*==========================================================
  Form
==========================================================*/

ol.field,
ul.field
{
  margin-left: 0;
}

ol.field,
ul.field
{
  list-style-type: none;
}

dl.field dd,
ol.field li,
ul.field li
{
  margin-bottom: 8px;
}

dl.field dd { margin-left: 0; }

form ul.action
{
  list-style-type: none;
  margin-left: 0;
}

form ul.action li
{
  margin-right: 4px;
  display: inline;
}



/*==========================================================
  Theme
==========================================================*/

body
{
  background: #000;
  color: #fff;
}

a { color: #fa0; text-decoration: none; }
a:hover { color: #fc0; text-decoration: none; }

#site
{
  margin-top: 16px;
  font-size: 90%;
}

#header, #global-nav, #local-nav, #content, #footer
{
  margin: auto;
  width: 944px;
}
#header *, #global-nav *, #local-nav *, #footer *
{
  margin: 0;
  padding: 0;
}

#header
{
  margin-bottom: 16px;
  padding: 76px 0 0;
  position: relative;
}

#header .title
{
  position: absolute;
  width: 196px;
  height: 60px;
  top: 0;
  left: 0;
  overflow: hidden;
  background: url(images/logo_h.png) no-repeat 0 0;
}
#header .title a
{
  width: 196px;
  height: 60px;
  display: block;
  text-indent: -64em;
  background: url(images/logo.png) no-repeat 0 0;
}
#header .title a:hover { background: none; }

#header ul.banner
{
  position: absolute;
  top: 0;
  right: 0;
}

#content #primary
{
  float: left;
  width: 624px;
  margin-right: 8px;
}

#content #secondary
{
  float: right;
  width: 304px;
  margin-left: 8px;
}
#footer { margin: 64px auto 0; padding-bottom: 32px; font-size: 90%; text-align: center; }

#search
{
  position: absolute;
  top: 84px;
  right: 8px;
}



/*==========================================================
  Navigation
==========================================================*/

#global-nav a, #local-nav a { color: #fff; }
#global-nav ul, #local-nav ul { list-style: none; margin: 0; }
#global-nav ul li, #local-nav ul li { margin: 0; float: left; }
#global-nav ul { font-weight: bold; }
#global-nav
{
  background: #666 url(images/global-nav.png) no-repeat 0 0;
  border-bottom: 1px solid #666;
  height: 40px;
  font-size: 120%;
}
#global-nav ul li
{
  width: 118px;
  height: 40px;
  background: url(images/global-nav_item_h.png) no-repeat 0 0;
  text-align: center;
}
#global-nav ul li a, #global-nav ul li span.mark
{
  display: block;
  line-height: 40px;
}
#global-nav ul li a
{
  background: url(images/global-nav_item.png) no-repeat 0 0;
}
#global-nav ul li a:hover,
#global-nav ul li span.mark
{
  background: none;
}
#global-nav ul li.home a
{
  background: url(images/global-nav_first.png) no-repeat 0 0;
}
#global-nav ul li.home a:hover,
#global-nav ul li.home span.mark
{
  background: url(images/global-nav_first_h.png) no-repeat 0 0;
}

#local-nav
{
  height: 28px;
  background: #333 url(images/local-nav.png) repeat-x 0 0;
}
#local-nav ul li
{
  height: 28px;
}
#local-nav ul li a, #local-nav ul li span.mark
{
  margin: 6px 0;
  padding: 0 8px;
  display: block;
  height: 16px;
  line-height: 16px;
  border-right: 1px solid #000;
  border-left: 1px solid #666;
}

#local-nav ul li.newest a, #local-nav ul li.newest span.mark,
#local-nav ul li.today a, #local-nav ul li.today span.mark
{
  border-left: 0 none;
}

#local-nav ul li.most-rated a, #local-nav ul li.most-rated span.mark,
#local-nav ul li.all-time a, #local-nav ul li.all-time span.mark
{
  border-right: 0 none;
}

#global-nav ul li span.mark, #local-nav ul li span.mark { color: #fc0; font-weight: bold; }
#global-nav ul li a:hover, #local-nav ul li a:hover { color: #fc0; }

#local-nav ul.primary { float: left; }
#local-nav ul.secondary { float: right; }



/*==========================================================
  Search
==========================================================*/

#search fieldset { float: right; }
#search legend { display: none; }
#search ul.field, #search ul.action,
#search ul.field li, #search ul.action li
{
  float: left;
}
#search ul.field { padding-right: 68px; }
#search ul.field li input
{
  width: 160px;
  height: 20px;
}
#search ul.field li select
{
  height: 24px;
  margin-left: 4px;
}
#search ul.action li input
{
  width: 64px;
  height: 26px;
  position: absolute;
  top: 0;
  right: 0;
}



/*==========================================================
  Section
==========================================================*/

div.section div.section-header,
div.article div.article-header
{
  margin-bottom: 16px;
  padding: 0 8px;
  height: 28px;
  font-size: 110%;
}

#primary div.section div.section-header,
#primary div.article div.article-header
{
  background: #333 url(images/section-header_1.png) no-repeat 0 0;
}

#secondary div.section div.section-header
{
  background: #333 url(images/section-header_2.png) no-repeat 0 0;
}

div.section div.section-header .title,
div.article div.article-header .title
{
  margin: 0;
  line-height: 28px;
}

div.section div.section-nav { margin-bottom: 16px; }



/*==========================================================
  Banner
==========================================================*/

ul.banner
{
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}



/*==========================================================
  Message
==========================================================*/

div.message
{
  margin-bottom: 16px;
  padding-top: 4px;
  padding-right: 8px;
  padding-left: 8px;
}

div.message * { margin-bottom: 4px; }

div.message-warning
{
  border: 1px solid #ca0;
  background: #ffc;
  color: #640;
}

div.message-error
{
  border: 1px solid #c00;
  background: #fcc;
  color: #600;
}

div.message-notice
{
  border: 1px solid #0ac;
  background: #cff;
  color: #046;
}



/*==========================================================
  Pagination
==========================================================*/

div.pagination
{
  font-size: 90%;
}
div.pagination ul.pages
{
  list-style: none outside;
  margin: 0;
  padding: 0;
  float: right;
}
div.pagination ul.pages li
{
  margin: 0 0 0 4px;
  padding: 0;
  float: left;
}
div.pagination ul.pages li a,
div.pagination ul.pages li span.mark
{
  display: block;
  padding: 0 4px;
}
div.pagination ul.pages li a
{
  color: #fff;
  background: #222;
  border: 1px solid #333;
}
div.pagination ul.pages li a:hover,
div.pagination ul.pages li span.mark
{
  color: #fff;
  background: #c70;
  border: 1px solid #fa0;
}

div.pagination p.status
{
  margin: 0;
  float: left;
  text-align: center;
}



/*==========================================================
  Videos
==========================================================*/

div.videos
{
}
div.videos div.video-article-summary
{
  float: left;
  margin: 0 16px 16px 0;
}
#primary div.videos div.video-article-summary-multiples-4,
#secondary div.videos div.video-article-summary-multiples-2 { margin-right: 0; }



/*==========================================================
  Video (Summary)
==========================================================*/

div.video-article-summary
{
  margin-bottom: 16px;
  padding: 4px;
  width: 134px;
  height: 160px;
  border: 1px solid #333;
  background: #111;
  position: relative;
  font-size: 90%;
}

div.video-article-summary * { margin: 0; padding: 0; }
div.video-article-summary img { vertical-align: middle; }

div.video-article-summary div.video-header .title
{
  position: relative;
  top: 99px;
  height: 16px;
  font-size: 100%;
  line-height: 16px;
  overflow: hidden;
}

div.video-article-summary div.video-body ul.video
{
  position: relative;
  top: -16px;
  margin-bottom: 4px;
  text-align: center;
}

div.video-article-summary div.video-body ul.video img
{
  border: 1px solid #000;
}

div.video-article-summary div.video-footer ul.status
{
  position: absolute;
  bottom: 4px;
  list-style: none;
  width: 134px;
  text-align: right;
}

div.video-article-summary div.video-footer ul.status li
{
  text-align: left;
  background: #222;
  border: 1px solid #333;
}

div.video-article-summary div.video-footer ul.status li span.label
{
  margin-left: 4px;
}
div.video-article-summary div.video-footer ul.status li span.number
{
  margin-right: 4px;
  float: right;
}

div.video-article-summary div.video-footer ul.status li.rating
{
  position: absolute;
  top: -36px;
  left: 66px;
  width: 64px;
  display: inline;
  background: transparent;
  border: 0 none;
}
div.video-article-summary div.video-footer ul.status li.rating img { display: block; }

div.video-article-summary div.video-footer ul.status li.views,
div.video-article-summary div.video-footer ul.status li.ratings
{
  margin-bottom: 2px;
}

div.video-article-summary div.video-footer ul.status li.views
{
}

div.video-article-summary div.video-footer ul.status li.ratings
{
}


/*==========================================================
  Video (Single)
==========================================================*/

div.video-article-single
{
}

div.video-article-single div.article-body p.description
{
  margin: 0 0 16px;
  padding: 4px 8px;
  border: 1px solid #333;
  background: #222;
}
div.video-article-single div.article-body ul.video
{
  margin: 0 0 16px;
  padding: 0;
  text-align: center;
}
div.video-article-single div.article-body ul.video object
{
  display: block;
  margin: auto;
}

div.video-article-single div.article-body ul.detail
{
  margin: 0 0 16px;
  padding: 0;
}

div.video-article-single div.article-body ul.detail li,
div.video-article-single div.article-body ul.detail li a
{
  display: block;
  width: 308px;
  height: 64px;
  overflow: hidden;
  background: no-repeat 0 0;
}
div.video-article-single div.article-body ul.detail li.download { float: left; background-image: url(images/download_h.png); }
div.video-article-single div.article-body ul.detail li.favorite { float: right; background-image: url(images/favorite_h.png); }
div.video-article-single div.article-body ul.detail li.download a
{
  background-image: url(images/download.png);
  text-indent: -24em;
}
div.video-article-single div.article-body ul.detail li.download a:hover { background-image: none; }
div.video-article-single div.article-body ul.detail li.favorite a
{
  background-image: url(images/favorite.png);
  text-indent: -24em;
}
div.video-article-single div.article-body ul.detail li.favorite a:hover { background-image: none; }

div.video-article-single div.article-footer
{
  margin-bottom: 16px;
}
div.video-article-single div.article-footer img
{
  vertical-align: middle;
}

div.video-article-single div.article-footer ul.actions,
div.video-article-single div.article-footer ul.status,
div.video-article-single div.article-footer ul.status ul,
div.video-article-single div.article-footer ul.status li
{
  margin: 0;
  padding: 0;
  list-style: none;
}
div.video-article-single div.article-footer ul.actions
{
  padding: 4px 8px;
  position: relative;
  border: 1px solid #333;
  background: #222;
}
div.video-article-single div.article-footer ul.actions li
{
}
div.video-article-single div.article-footer ul.actions li.rating
{
  position: relative;
  float: left;
}
div.video-article-single div.article-footer ul.actions li.rating div#rate-1,
div.video-article-single div.article-footer ul.actions li.rating div#rate-2,
div.video-article-single div.article-footer ul.actions li.rating div#rate-3,
div.video-article-single div.article-footer ul.actions li.rating div#rate-4,
div.video-article-single div.article-footer ul.actions li.rating div#rate-5
{
  height: 20px;
  width: 18px;
  position: absolute;
  cursor: pointer;
}
div.video-article-single div.article-footer ul.actions li.rating div#rate-1 { width: 19px; left: 0px; }
div.video-article-single div.article-footer ul.actions li.rating div#rate-2 { left: 19px; }
div.video-article-single div.article-footer ul.actions li.rating div#rate-3 { left: 37px; }
div.video-article-single div.article-footer ul.actions li.rating div#rate-4 { left: 55px; }
div.video-article-single div.article-footer ul.actions li.rating div#rate-5 { width: 19px; left: 73px; }

div.video-article-single div.article-footer ul.actions li.bookmark
{
  float: right;
}
div.video-article-single div.article-footer ul.actions li.bookmark ul
{
  margin: 0;
  padding: 0;
  list-style: none;
}
div.video-article-single div.article-footer ul.actions li.bookmark ul li
{
  display: inline;
  margin-left: 8px;
}

div.video-article-single div.article-footer ul.status
{
  margin-bottom: 16px;
  padding: 4px 8px;
  border-right: 1px solid #333;
  border-bottom: 1px solid #333;
  border-left: 1px solid #333;
  background: #222 url(images/status.png) repeat-x 0 0;
  font-size: 90%;
}
div.video-article-single div.article-footer ul.status li
{
  float: left;
}
div.video-article-single div.article-footer ul.status li.tags,
div.video-article-single div.article-footer ul.status li.views
{
  clear: both;
}
div.video-article-single div.article-footer ul.status li.tags ul
{
  display: inline;
}
div.video-article-single div.article-footer ul.status li.tags ul li
{
  float: none;
  display: inline;
  margin-right: 8px;
}

div.video-article-single div.article-footer ul.status li.views,
div.video-article-single div.article-footer ul.status li.ratings
{
  margin-right: 8px;
}



/*==========================================================
  Home Page
==========================================================*/

body.home #primary div.newest-section div.section-nav
{
  font-size: 90%;
}
body.home #primary div.newest-section div.section-nav ul
{
  list-style: none;
  margin: 0;
}
body.home #primary div.newest-section div.section-nav ul li
{
  float: right;
}
body.home #primary div.newest-section div.section-nav ul li a
{
  display: block;
  padding: 0 4px;
  color: #fff;
  background: #222;
  border: 1px solid #333;
}
body.home #primary div.newest-section div.section-nav ul li a:hover
{
  color: #fff;
  background: #c70;
  border: 1px solid #fa0;
}



/*==========================================================
  Categories Page
==========================================================*/

body.categories #primary div.section ul.categories
{
  list-style: none;
  margin: 0;
}
body.categories #primary div.section ul.categories li
{
  width: 150px;
  float: left;
  margin: 0 8px 16px 0;
}
body.categories #primary div.section ul.categories li.multiples-4 { margin-right: 0; }
body.categories #primary div.section ul.categories li span.number
{
  margin-left: 4px;
  font-size: 90%;
}



/*==========================================================
  Side Widget
==========================================================*/

#secondary div.banner-section ul.banner { margin: 0; }
#secondary div.banner-section ul.banner li { margin-bottom: 16px; }
#secondary div.banner-section ul.banner li.primary { float: left; }
#secondary div.banner-section ul.banner li.secondary { float: right; }

#secondary div.categories-section ul.categories,
#secondary div.tags-section ul.tags,
#secondary div.terms-section ul.terms
{
  list-style: none;
  margin: 0 0 16px;
}
#secondary div.categories-section ul.categories li
{
  width: 148px;
  float: left;
  margin-right: 8px;
}
#secondary div.categories-section ul.categories li.multiples-2 { margin-right: 0; }
#secondary div.categories-section ul.categories li span.number
{
  margin-left: 4px;
  font-size: 90%;
}

#secondary div.tags-section ul.tags li,
#secondary div.terms-section ul.terms li
{
  margin-right: 8px;
  display: inline;
}
li.level-100 { font-size: 100%; }
li.level-110 { font-size: 110%; }
li.level-120 { font-size: 120%; }
li.level-130 { font-size: 130%; }
li.level-140 { font-size: 140%; }
li.level-150 { font-size: 150%; }
li.level-160 { font-size: 160%; }
li.level-170 { font-size: 170%; }
li.level-180 { font-size: 180%; }
li.level-190 { font-size: 190%; }
li.level-200 { font-size: 200%; }



/*==========================================================
  Clear Fix
==========================================================*/

#local-nav:after,
#global-nav ul:after,
#local-nav ul:after,
#content:after,
div.videos:after,
div.video-article-single div.article-body ul.detail:after,
div.video-article-single div.article-footer ul.actions:after,
div.video-article-single div.article-footer ul.status:after,
body.categories #primary div.section ul.categories:after,
div.pagination:after,
#secondary div.categories-section ul.categories:after,
#secondary div.banner-section ul:after,
body.home #primary div.newest-section div.section-nav ul:after
{
  content: "\000020";
  display: block;
  clear: both;
  height: 0;
}

