@charset "utf-8";

/*==============================================================================
  Title       : Basic Layout Style
  Author      : Fumito Arakawa as Phize (http://phize.net/) and Geeklog Japanese
  Description : Basic layout style.
                JavaScript enabled
              * Always set 'js_on' 
              * 3 Column ( Left Block * Center Block * Right Block)...left-center-right
              * 2 Column ( Left Block * Center Block)...left-center
              * 2 Column ( Center Block * Right Block)...center-right
              * 1 Column ( Center Block)...center

            JavaScript Disenabled: HTML body class attribute is always 3 Column
              * Always set 'js_off'

            Block Width:
              *  Container Width = 100%
              *  Site Width[W] = 960px
              *  Left   Block Width[L]         = 180px
              *  Right  Block Width[R]         = 180px
              *  Center Block Width(3 Column ) = [W] - [L] - [R] = 600px = 580px + left padding 10px + right padding 10px
              *  Center Block Width(2 Column ) = [W] - [L] = 780px = 770px + left padding 10px
              *  Center Block Width(2 Column ) = [W] - [R] = 780px = 770px + right padding 10px
              *  Center Block Width(1 Column ) = [W] = 960px

  Apply       : storytext.thtml, storybodytext.thtml
                featuredstorytext.thtml, featuredstorybodytext.thtml

==============================================================================*/


/*--------------------------------------
   Container
    Include All Block Level Element(div#header, div#navigation, div#wrapper, div#footer)
--------------------------------------*/

div#container {
  position: relative;
  width: 100%;  /*  Container Width */
  margin: 0;
  padding: 0;
  text-align: left;
}


/*--------------------------------------
  Header Container
--------------------------------------*/

div#container div#header {
  width: 100%;  /*  Container Width */
  height: 80px;
  background: transparent url(../images/css/bg_header.gif) repeat-x 0 0;
}

div#container div#header div#header-content {
  width: 960px;  /*  Site Width[W] */
  margin: 0 auto;
  padding: 0;
}

/*  Site Name */
div#container div#header h1.site_name {
  display: inline;  /* For Win IE 6(Float Left Right Margin is too wide) */
  margin: 12px 0 0 16px;
  padding: 0;
  float: left;
}

/* Slogan */
div#container div#header p.site_slogan {
  margin: 0;
  padding: 16px 16px 0 16px;
  color: #FFFFFF;
  text-align: right;
}



/*--------------------------------------
  Gloval Navigation Container
--------------------------------------*/

div#container div#navigation {
  width: 100%;  /*  Container Width */
  background: #E7E7E7;
  text-align: left;
}

div#container div#navigation div {
  margin: 0 auto;
  padding: 0;
}

div#container div#navigation div.navigation_content {
  width: 944px;
  padding: 0.5em 8px;
}

/*  Navigation Menu List */
div#container div#navigation ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

div#container div#navigation ul li {
  display: inline;
  margin: 0 2px;
  padding: 0;
}

/*  Navigation Menu(Normal) */
div#container div#navigation ul li.menuitem {
}

div#container div#navigation ul li.menuitem a,
div#container div#navigation ul li.menuitem a:link,
div#container div#navigation ul li.menuitem a:visited {
}

div#container div#navigation ul li.menuitem a:hover,
div#container div#navigation ul li.menuitem a:focus,
div#container div#navigation ul li.menuitem a:active {
}

/*  Navigation Menu(Last) */
div#container div#navigation ul li.last-child {
}

div#container div#navigation ul li.last-child a,
div#container div#navigation ul li.last-child a:link,
div#container div#navigation ul li.last-child a:visited {
}

div#container div#navigation ul li.last-child a:hover,
div#container div#navigation ul li.last-child a:focus,
div#container div#navigation ul li.last-child a:active {
}



/*--------------------------------------
  Wrapper
    Include contents Block level elements(div#leftblocks, div#centerblocks, div#rightblocks)
--------------------------------------*/

div#container div#wrapper {
  overflow: visible;  /* Adjust floating element */
  width: 960px;  /*  Site Width[W] */
  margin: 0 auto;
  padding: 0 0 2em 0;
}

/* Content generated by the float clear */
div#container div#wrapper:after {
  content: "";
  display: block;
  clear: both;
  height: 1px;
  overflow: hidden;
}

/* Win IE 6(Adjust floating element) { \*/
* html div#container div#wrapper {
  height: 1%;
  overflow: visible;
}
/* } Win IE 6(Adjust floating element) */

/* JavaScript Enabled* 3 Column ( Left Block*  Center Block*  Right Block) Wrapper */
body.left-center-right div#container div#wrapper {
}

/* JavaScript Enabled* 2 Column ( Left Block*  Center Block) Wrapper */
body.left-center div#container div#wrapper {
}

/* JavaScript Enabled* 2 Column ( Center Block*  Right Block) Wrapper */
body.center-right div#container div#wrapper {
}

/* JavaScript Enabled* 1 Column ( Center Block) Wrapper */
body.center div#container div#wrapper {
}

/* JavaScript Disenabled Wrapper */
body.js_off div#container div#wrapper {
}



/*--------------------------------------
   Left Block Container
   display if Left Block is appeared.
--------------------------------------*/

div#container div#wrapper div#leftblocks {
  overflow: auto;
  float: left;
  width: 180px;  /*  Left Block Width[L] */
  margin: 0 780px 0 0;  /*  Right Margin =  Site All Width[W] -  Left Block Width[L] */
  padding: 0;
}

/* JavaScript Disenabled  Left Block Container */
body.js_off div#container div#wrapper div#leftblocks {
  float: left;
  margin: 0 -180px 0 0;  /*  Right Margin = -( Left Block Width[L]) */
}



/*--------------------------------------
   Center Block Container
    div#centerblocks is always display.
--------------------------------------*/

div#container div#wrapper div#centerblocks {
  overflow: visible;
}

/* JavaScript Enabled* 3 Column ( Left Block*  Center Block*  Right Block)  Center Block Container */
body.left-center-right div#container div#wrapper div#centerblocks {
  float: left;
  width: 580px;  /*  Center Block Width =  Site All Width[W] -  Left Block Width[L] -  Right Block Width[R] -  Right Padding -  Left Padding */
  margin: 0 0 0 -780px;  /*  Left Margin = -( Site All Width[W] -  Left Block Width[L]) */
  padding: 0 10px;
}

/* JavaScript Enabled* 2 Column ( Left Block*  Center Block)  Center Block Container */
body.left-center div#container div#wrapper div#centerblocks {
  float: left;
  width: 770px;  /*  Center Block Width =  Site All Width[W] -  Left Block Width[L] -  Right Padding -  Left Padding */
  margin: 0 0 0 -780px;  /*  Left Margin = -( Site All Width[W] -  Left Block Width[L]) */
  padding: 0 0 0 10px;
}

/* JavaScript Enabled* 2 Column ( Center Block*  Right Block)  Center Block Container */
body.center-right div#container div#wrapper div#centerblocks {
  float: left;
  width: 770px;  /*  Site All Width[W] -  Right Block Width[R] -  Right Padding -  Left Padding */
  margin: 0 180px 0 0;  /*  Right Margin =  Right Block Width[R] */
  padding: 0 10px 0 0;
}

/* JavaScript Enabled* 1 Column ( Center Block)  Center Block Container */
body.center div#container div#wrapper div#centerblocks {
  width: 960px;  /*  Center Block Width =  Site All Width[W] -  Right Padding -  Left Padding */
  margin: 0;
  padding: 0;
}

/* JavaScript Disenabled  Center Block Container */
body.js_off div#container div#wrapper div#centerblocks {
  display: inline;  /* Win IE 6(Float Left Right Margin is too wide) */
  float: left;
  width: 580px;  /*  Center Block Width =  Site All Width[W] -  Left Block Width[L] -  Right Block Width[R] -  Right Padding -  Left Padding */
  margin: 0 0 0 180px;  /*  Left Margin =  Left Block Width[L] */
  padding: 0 10px;
}



/*--------------------------------------
   Right Block Container
    div#rightblocks display if Right Block is appeared.
--------------------------------------*/

div#container div#wrapper div#rightblocks {
  overflow: auto;
  float: left;
  width: 180px;  /*  Right Block Width[R] */
  margin: 0 0 0 -180px;  /*  Left Margin = -( Right Block Width[R]) */
}

/* JavaScript Disenabled  Right Block Container */
body.js_off div#container div#wrapper div#rightblocks {
  float: right;
  margin: 0;
}



/*--------------------------------------
   Footer Container
--------------------------------------*/

div#container div#footer {
  clear: left;
  padding: 16px;
  border-top: 1px solid #1A3955;
}

div#container div#footer-content {
  width: 960px;  /*  Site Width[W] */
  margin: 0 auto;
}

div#container div#footer-content:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

/*  Footer Link */
div#container div#footer a,
div#container div#footer a:link,
div#container div#footer a:visited {
}

div#container div#footer a:hover,
div#container div#footer a:focus,
div#container div#footer a:active {
}

/*  Footer List */
div#container div#footer ul {
  list-style-type: none;
  list-style-position: outside;
  margin: 0;
  padding: 0;
}

div#container div#footer ul li {
  margin: 0;
  padding: 0;
}

/* Copyright */
div#container div#footer ul.copyright {
  float: left;
}
div#container div#footer ul li.copyright_notice {
}

div#container div#footer ul li.copyright_notice address {
  font-style: normal;
}


/* Powered by & Page Execution Time */
div#container div#footer ul.site_info {
  float: right;
  text-align: right;
}

/* Powered by */
div#container div#footer ul li.powered_by {
}

/* Page Execution Time */
div#container div#footer ul li.execution_textandtime {
}