@charset "utf-8";
/**
 * base.css 
 * (c) FOURDIGIT Inc.
 *
 * 1. import
 * 2. html, body
 * 3. HTMLtag, siteCommonClass
 * 4. Layout
 *
 */
/**
 * 1. import
 */

/* initialize */
  @import "ext/reset.css";

/* baselayout */
  @import "ext/layout/2col-main-aside.css";
  /*@import "ext/layout/2col-aside-main.css";*/
  /*@import "ext/layout/1col.css";*/

  @import "ext/fonts/sans-serif.css";
  @import "ext/fonts/typograph.css";

/* extension */
  @import "ext/util/accessibility.css";
  @import "ext/util/logtag.css";
  @import "ext/util/fnav/center.css";
  @import "ext/util/box.css";
  @import "ext/util/clearfix.css";
  @import "ext/util/float.css";
  @import "ext/util/margin-padding.css";
  @import "ext/util/nav.css";
  @import "ext/util/textalign.css";
  @import "ext/util/wrapper.css";

/**
 * 2. html, body
 */

/* body */
	body {
		background-image: url(../imgs/space.gif);
		background-repeat: repeat-x;
		background-position: center top;
		padding-bottom: 0;
	}
	
/* .page */	
	.page {
    	font-size: 12px;
    	line-height: 1.5;
		color: #666666;
	}


/**
 * 3. HTMLtag, siteCommonClass
 */

/* anchor */
	a {
		background-color: transparent;
		background-image: none;
		background-repeat: no-repeat;
		background-position: top left;
		color: #0077b3;
	}
	a:visited {}
	a:active {}

	strong {
		font-weight: bold;
	}

/* selection */
	::-moz-selection{
		background: #b6d6fb;
		color: #121212;
		text-shadow: none;
	}
	::selection {
		background: #b6d6fb;
		color: #121212;
		text-shadow: none;
	}
	
	 a.arrow {
		 background: url(../imgs/bg-arrow.gif) no-repeat 100% 0 ;
		 padding-right: 20px;
		 padding-bottom: 3px;
		 font-size: 10px;
		 line-height: 15px;
	 }
	 a.arrow:hover {
		 background: url(../imgs/bg-arrow_ov.gif) no-repeat 100% 0 ;
	 }
	 a.arrow02 {
		 background: url(../imgs/bg-arrow02.gif) no-repeat 100% 0 ;
		 padding-right: 20px;
		 padding-bottom: 3px;
		 font-size: 10px;
		 line-height: 15px;
	 }
	 a.arrow02:hover {
		 background: url(../imgs/bg-arrow02_ov.gif) no-repeat 100% 0 ;
	 }


	/* table */
	table.dot{
		border-collapse: collapse;
	}
	table.dot td , table.dot th {
		border: 1px dotted #d8d8d8;
		padding: 10px 20px;
	}


/**
 * 4. Layout
 */
/* BASE WIDTH */
	.wrapper { width: 960px; }
	.innerWrapper { width: 920px; }

/* Container */
	#Container {
		margin-right: auto;
		margin-left: auto;
		margin-bottom: 40px;
		background-color: transparent;
		background-image: ;
		background-repeat: repeat-y;
		background-position: center top;
		text-align: left;
	}

/* Header */
	#Header {
		margin-bottom: 25px;	
	}
	#Header .hgroup{
		height: 51px;
		margin-bottom: 20px;
	}
	
	#Header h1 {
		width: 240px;
		float: left;
		padding-top: 18px;
	}
	#Header .description {
		padding-top: 12px;
		width: 460px;
		float: right;
		border-left: 1px dotted #cccccc;
		padding-left: 10px;
		font-size: 10px;
		line-height: 15px;
		color: #999999;
	}

	#hImageAreaWrapper{
		background: url(../imgs/bg-wrap.jpg) repeat-x 0 0;
		clear: both;
	}
	#hImageArea{
		background: url(../imgs/bg-top.jpg)  no-repeat center top; 
	}
	#pankuzu{
		height: 20px;
		padding-top: 128px;
		font-size: 10px;
	}
	#pankuzu{
		height: 20px;
		padding-top: 128px;
		font-size: 10px;
		margin-left: auto;
		margin-right: auto;
	}
	#pankuzu span{
		font-weight: bold;
	}
	#Nav{
		margin-bottom: 10px;
	}
	#Nav li{
		float: left;
	}
	#Nav li a , #Nav li img{
		vertical-align: top;
	}

/* Footer */
	#Footer {
		clear: both;
		background: url(../imgs/bg-footer.gif) repeat-x 0 15px;
		font-size: 10px;
		line-height: 15px;
		padding-bottom: 20px;
	}
	#Footer #FooterPagetop {
		text-align: right;
		margin-bottom: 25px;
	}
	#Footer #FooterPagetop a{
		vertical-align: top;
	}
	
	#Footer #FooterInfo{
		height: 200px;
		border-bottom: 1px dotted #cccccc;
	}
	#Footer #FooterInfo strong{
		font-weight: bold;
	}
	#Footer #fNav{
		width: 550px;
		float: left;
	}
	#Footer #fNav li{
		width: 80px;
		float: left;
		height: 17px;
		padding-top: 5px;
	}
	#Footer #fNav li ul.top{
		padding-top: 22px;
	}
	
	#Footer #fNav li.arrow{
		background: url(../imgs/bg-navlist-arrow.gif) no-repeat 0 3px;
		padding-left: 10px;
		width: 70px;
		height: 22px;
		padding-top: 0;
	}
	#Footer #fNav li.child{
		background:	url(../imgs/bg-navlist.gif) no-repeat 14px 0;
		padding-left: 25px;
		width: 60px;
	}
	#Footer #fNav li.childTop{
		width: 90px;
	}
	#Footer #fNav li.childTop li.child{
		width: 70px;
	}
	
	#Footer #fNav li.child.top{
		background:	url(../imgs/bg-navlist-top.gif) no-repeat 14px 0;
	}
	#Footer #fNav li.child.bottom{
		background:	url(../imgs/bg-navlist-bottom.gif) no-repeat 14px 0;
	}
	
	/* for Recommend - 11/03/25 */
	#Footer #fNav li.recommend{
		width: 150px;
	}
	#Footer #fNav li.recommend li.child{
		width: 130px;
	}

	#Footer #FooterContact{
		width: 390px;
		float: right;
	}
	
	#Footer #FooterCopyright{
		clear: both;
	}

/* Article */
	#Article {}

/* ArticleMain */
	#ArticleMain {
		float: left;
		width: 665px;
		min-height: 520px;
	}
	
	.section{
		line-height: 22px;
	}
	.sectionInner{
		padding : 0 20px;
	}

/* ArticleAside */
	#ArticleAside {
		float: right;
		width: 210px;
		position: relative;
	}
	#ArticleAside #ArticleAsideInner{
		position: absolute;
		right: 0;
		top: -116px;
	}
	#ArticleAside #contactArea{
		padding: 0 10px;
	}

/* ArticleFooter */
	#ArticleFooter {}

	#ArticleFooterNavArea {
		font-size: 10px;
	}
