@charset "UTF-8";

/*==============================================================================
  File Name: layout.css
  Media Type: All
  Title: Layout Style Sheet
  Author: Phize
  Author URI: http://phize.net

  Order Of Cascading:
    1. import.css
    2. element.css
    3. common.css
    4. layout.css

  Table Of Contents:
    Site
    Header
      + Global Navigation
    Page
      + Main Contents
      + Secondary Contents
      + Navigation
    Footer
    Clear Fix

  Order Of Properties:
    Based on CSS 2.1 Specification(http://www.w3.org/TR/CSS21/)
==============================================================================*/



/*==============================================================================
  Site
==============================================================================*/

#Site
{
  margin: auto;
  padding: 1px 0;
  width: 960px;
  background: #2f372d;
  font-size: 100%;
  text-align: left;  /* For Win IE 6 */
}



/*==============================================================================
  Header
    + Global Navigation
==============================================================================*/

#Header
{
  margin: 8px 8px 0 8px;
  padding: 1px 0;
  position: relative;
  height: 196px;  /* For Win IE 6 */
  min-height: 194px;
  background: #fff url(../image/bg_header.png) no-repeat;
}

/* For Modern Browsers */
*>#Header
{
  height: auto;
}

#Header p.title
{
  margin: 40px 0 0 56px;
  padding: 0;
  line-height: 1;
  font-size: 175%;
}

#Header p.description
{
  margin: 0.5em 0 0 60px;
  padding: 0;
}

/*---------------------------------------
    + Global Navigation
---------------------------------------*/
#Header ul.navigation
{
  margin: 4em 8px 2em;
  padding: 0;
  list-style: none;
}

#Header ul.navigation li
{
  margin: 0 4px;
  padding: 0;
  float: left;
}

#Header ul.navigation li a
{
  padding: 0.25em 4px;
  border: 1px solid #ccb299;
  display: block;
}

#Header ul.navigation li a:link,
#Header ul.navigation li a:visited
{
  background: #fff;
  text-decoration: none;
}

#Header ul.navigation li a:hover,
#Header ul.navigation li a:focus,
#Header ul.navigation li a:active
{
  background: #f0eddf;
  text-decoration: none;
}



/*==============================================================================
  Page
    + Main Contents
    + Secondary Contents
    + Navigation
==============================================================================*/

#Page
{
  margin: 0 8px;
  background: #fff;
}

/*---------------------------------------
    + Main Contents
---------------------------------------*/
#Main
{
  padding-bottom: 2em;
  float: left;
  width: 648px;
}

/*--------------------------------------
    + Secondary Contents
--------------------------------------*/
#Secondary
{
  padding-bottom: 2em;
  float: right;
  width: 288px;
  font-size: 90%;
}

#Secondary dl.navigation
{
  margin: 0;
  padding: 0;
}

#Secondary dl.navigation dt
{
  margin: 0;
  padding: 24px 0 8px 8px;
  height: 54px;  /* For Win IE 6 */
  min-height: 22px;
  color: #96896c;
  font-weight: bold;
  font-size: 125%;
  background: url(../image/bg_secondary_head.png) no-repeat;
}

/* For Modern Browsers */
*>#Secondary dl.navigation dt
{
  height: auto;
}

#Secondary dl.navigation dd
{
  margin: 0;
  padding: 0 0 8px;
}

#Secondary dl.navigation dd dt
{
  padding: 0;
  height: auto;
  min-height: none;
  color: #333;
  font-weight: normal;
  font-size: 100%;
  background: none;
}

/*---------------------------------------
    + Navigation
---------------------------------------*/
#Navigation-Bookmark
{
  margin: 0;
  padding: 0 16px;
  clear: both;
  line-height: 77px;
  list-style: none outside;
  background: url(../image/bg_navigation_bookmark.png) no-repeat 0 100%;
  font-size: 90%;
  text-align: right;
}

#Navigation-Bookmark li a
{
  margin: 0;
  padding: 0;
}

#Navigation-Bookmark li a
{
  background: url(../image/icon/arrow_up.png) no-repeat 0 50%;
  padding-left: 16px;
}

#Navigation-Bookmark li a:link,
#Navigation-Bookmark li a:visited
{
  padding-top: 0;
}

#Navigation-Bookmark li a:hover,
#Navigation-Bookmark li a:focus,
#Navigation-Bookmark li a:active
{
  padding-top: 4px;
}



/*==============================================================================
  Footer
==============================================================================*/

#Footer
{
  margin: 0 8px;
  padding: 8em 0 1em;
  color: #fff;
  font-size: 90%;
  text-align: center;
}

#Footer a
{
  color: #fff;
}

#Footer a:link,
#Footer a:visited
{
  text-decoration: none;
}

#Footer a:hover,
#Footer a:focus,
#Footer a:active
{
  text-decoration: underline;
}

#Footer ul.navigation
{
  list-style: none outline;
  font-size: 95%;
}

#Footer ul.navigation li
{
  margin: 0;
  padding: 0 8px;
  display: inline;
}

#Footer ul.navigation li+li
{
  border-left: 1px solid #fff;
}



/*==============================================================================
  Clear Fix
==============================================================================*/

#Header ul.navigation
{
  height: 1px;  /* For Win IE 6 */
}

*>#Header ul.navigation
{
  height: auto;
  min-height: 1px;  /* For Win IE 7 */
}

#Header ul.navigation:after
{
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
  content: ".";
}