@charset "UTF-8";
/*----------------------------------------------------------------------
------------------------------------------------------------------------

layout CSS File

File Name		layout.css
Note			共通レイアウト用スタイルシート


New Creation	
Update			


Created By		Yoshiaki Murakami

------------------------------------------------------------------------
----------------------------------------------------------------------*/

/*----------------------------------------------------------------------
------------------------------------------------------------------------
目次

1.	htmlタグ
2.	container
3.	共通部分
4.	header
5.	content
	5-1.	main
	5-2.	sub
6.	footer

------------------------------------------------------------------------
----------------------------------------------------------------------*/

/*----------------------------------------------------------------------
1.	htmlタグ
----------------------------------------------------------------------*/
html {
    height:100%;
}

body {
    height:100%;
	background:url(../img/body_bg.gif) left top repeat;
}

a {
	color:#014190;
}

a:hover {
	color:#ec4c71 !important;
}

body .wrapper {
	position:relative;
    height:100%;
	background:url(../img/container_bg1.gif) left top repeat-x;
}

* html .wrapper {
    height:100%;
}

body > .wrapper {
	height: auto;
}


/*----------------------------------------------------------------------
2.	container
----------------------------------------------------------------------*/
#container {
    min-height: 100%;
	background:url(../img/container_bg2.png) center top repeat-y;
}

* html #container {
    height:100%;
}

body > #container {
	height: auto;
}

#container .wrapper {
	position:static;
	margin:0px auto;
	padding:0px 3px;
	width:850px;
	background:none;
}

* html #container .wrapper {
	width:856px;
}


/*----------------------------------------------------------------------
3.	共通部分
----------------------------------------------------------------------*/
.nav {
	height:44px;
	background:url(../img/nav_bg.gif) left top no-repeat;
	border:1px solid #d5d5d5;
	text-align:center;
}

.nav li {
	float:left;
	display:inline;
}

.nav li a {
	height:44px;
}

.nav .top a {
	width:87px;
}

.nav .search a {
	width:150px;
}

.nav .parts a {
	width:150px;
}

.nav .about a {
	width:150px;
}

.nav .case a {
	width:150px;
}

.nav .qa a {
	width:149px;
}


/*----------------------------------------------------------------------
4.	header
----------------------------------------------------------------------*/
#container #header {
	position:relative;
	margin:0px 6px;
	padding-top:6px;
	background:#fff;
}

#container #header h1 {
	position:absolute;
	top:15px;
	right:11px;
	color:#efefef;
}

#container #header #logo {
	padding:12px 0px 12px 10px;
	border-top:1px solid #d5d5d5;
	border-right:1px solid #d5d5d5;
	border-left:1px solid #d5d5d5;
	background:url(../img/header_bg.gif) left top no-repeat;
}

#container #header #hnav {
	position:absolute;
	bottom:52px;
	right:11px;
}

#container #header #hnav ul li {
	margin-bottom:3px;
}

#container #header #hnav ul .register {
	background:url(../img/hnav_register_link_bg.gif) center center no-repeat #fff;
}

#container #header #hnav ul .login {
	background:url(../img/hnav_login_link_bg.gif) center center no-repeat #fff;
}

#container #header #hnav ul li a {
	width:204px;
	height:26px;
}

#container #header .sitemap {
	position:absolute;
	top:13px;
	right:16px;
}


/*----------------------------------------------------------------------
5.	content
----------------------------------------------------------------------*/
#content {
	position:relative;
	margin:0px 6px;
	padding-bottom:162px;
}

#topicpath {
	width:654px;
	border-bottom:1px solid #d5d5d5;
}

#topicpath ol {
	margin:0px 1px;
	padding-left:10px;
	border:1px solid #fff;
	background:#e6f3f6;
}

#topicpath ol li {
	float:left;
	display:inline;
	margin-left:2px;
	padding-left:28px;
	background:url(../img/topicpath_bg.gif) left center no-repeat;
	line-height:22px;
	color:#595757;
}

#topicpath ol .first ,
#topicpath ol li:first-child {
	margin:0px;
	padding:0px;
	background:none;
}

#topicpath ol li a {
	text-decoration:underline;
	color:#595757;
}


/*
5-1.	main
----------------------------------------------------------------------*/
#container #content #main {
	float:left;
	margin:0px 1px;
	width:652px;
	min-height:731px;
}

* html #container #content #main {
	height:731px;
}

#container #content #main h2 {
	background:url(../img/content_title_bg.gif) left top repeat-x #5688c3;
}

#container #content #main h2 span {
	display:block;
	padding:25px 0px 25px 26px;
	border:1px solid #fff;
	font-size:1.6em;
	font-weight:bold;
	color:#fff;
}

/*
5-2.	sub
----------------------------------------------------------------------*/
#container .aside #recommend {
	padding:9px 11px 5px 12px;
}

#container .aside #recommend ul li {
	margin-bottom:5px;
}

#container .aside #recommend ul li a img {
	border:1px solid #e0e0e0;
}

#container .aside .contents {
	margin-bottom:12px;
}

#container .aside .contents h3 {
	border-bottom:1px solid #d4d4d4;
}

#container .aside .contents ul li {
	padding:8px;
	background:url(../img/border1.gif) left bottom repeat-x;
}

#container .aside .contents ul li dl {
	position:relative;
}

#container .aside .contents ul li dl dt {
	margin-bottom:9px;
}

#container .aside .contents ul li dl dt a {
	padding-left:18px;
	background:url(../img/aside_contents_title_bg.gif) left center no-repeat;
	font-size:1.2em;
	font-weight:bold;
	color:#66849a;
}

#container .aside .contents ul li dl dd {
	margin-right:56px;
	line-height:1.2em;
	color:#717070;
}

#container .aside .contents ul li dl .pic {
	position:absolute;
	right:0px;
	top:21px;
	margin:0px;
}

#container .aside .contents ul li dl .pic img {
	border:1px solid #e0e0e0;
}

#container .aside .twtr-widget {
	margin-bottom:12px;
}

#container .aside #banner {
	padding:12px 11px 0px 12px;
}

#container .aside #banner ul li {
	margin-bottom:5px;
	text-align:center;
}

#container #sub1 {
	position:absolute;
	top:94px;
	left:0px;
	margin:0px 1px;
	width:163px;
}

#container #sub1 #menu {
	background:url(../img/sub_menu_title_bg1.gif) left top no-repeat;
}

#container #sub1 #menu h3 {
	padding-left:25px;
	background:url(../img/sub_menu_title_bg2.gif) 11px center no-repeat;
	border-top:2px solid #7fc5e5;
	border-bottom:1px solid #d5d5d5;
	line-height:38px;
	font-size:1.2em;
	font-weight:bold;
	color:#727171;
}

#container #sub1 #menu ul li h4 a {
	display:block;
	padding:8px;
	border:1px solid #fff;
	background:#e6f3f6;
	font-weight:bold;
	font-size:1.2em;
	color:#67839b;
}

#container #sub1 #menu ul li h4 a:hover {
	background:#feeaef;
	color:#717070 !important;
}

#container #sub1 #menu ul li a:hover {
	background:url(../img/sub_menu_bg_h.gif) left top repeat-x;
	color:#717070 !important;
}

#container #sub1 #menu ul .active h4 ,
#container #sub1 #menu ul li ul .active span {
	display:block;
	margin:1px;
	padding:8px;
	background:#5688c3;
	color:#fff;
}

#container #sub1 #menu ul li ul .active span {
	padding:9px;
}

#container #sub1 #menu ul .active h4 {
	font-size:1.2em;
	font-weight:bold;
}

#container #sub1 #menu ul li a {
	color:#717070;
}

#container #sub1 #menu ul li ul {
	border-bottom:1px solid #d5d5d5;
}

#container #sub1 #menu ul li ul li {
	border-top:1px solid #d5d5d5;
}

#container #sub1 #menu ul li ul li a {
	display:block;
	margin:1px;
	padding:9px;
}

#container #sub1 #menu ul li ul li dl {
	position:relative;
	margin:1px;
	height:28px;
}
/*
#container #sub1 #menu ul li ul li dl dt ,
#container #sub1 #menu ul li ul li dl dd {
	display:table-cell;
	vertical-align:middle;
}

* html #container #sub1 #menu ul li ul li dl dt ,
* html #container #sub1 #menu ul li ul li dl dd {
	display:inline;
	zoom:1;
}

*+html #container #sub1 #menu ul li ul li dl dt ,
*+html #container #sub1 #menu ul li ul li dl dd {
	display:inline;
	zoom:1;
}
*/
#container #sub1 #menu ul li ul li dl dt {
	position:absolute;
	top:2px;
	left:8px;
}

#container #sub1 #menu ul li ul li dl dt a {
	margin:0px;
	padding:0px;
}

#container #sub1 #menu ul li ul li dl dt img {
	display:block;
	width:22px;
	height:22px;
	border:1px solid #e1e2e2;
}

#container #sub1 #menu ul li ul li dl dd a ,
#container #sub1 #menu ul li ul .active dl dd {
	display:block;
	margin:0px;
	padding:9px 0px 9px 40px;
}

#container #sub1 #menu ul li ul .active dl dd {
	background:#5688c3;
	color:#fff;
}

#container #sub1 #menu ul li ul li dl dd a:hover {
	background:url(../img/sub_menu_bg_h.gif) left top repeat-x;
	color:#717070 !important;
}

#container #content #sub2 {
/*	position:absolute;
	top:0px;
	right:0px;
	left:auto;*/
	float:right;
	margin:-25px 1px 0px 0px;
	width:183px;
}

/*----------------------------------------------------------------------
6.	footer
----------------------------------------------------------------------*/
#footer {
    position:absolute;
    bottom:0px;
    min-height:162px;
    width:100%;
}

#footer .wrapper {
	margin:0px auto;
	padding:0px 0px 6px;
	background:#fff;
	text-align:center;
}

#footer .wrapper #fnavi {
	margin:0px 6px;
}

#footer .wrapper h2 ,
#footer .wrapper .link {
	line-height:1.6em;
	color:#717070;
}

#footer .wrapper .link {
	padding-bottom:13px;
	border-bottom:1px solid #9eb7bc;
}

#footer .wrapper .link a {
	color:#717070;
}

#footer .wrapper .wrapper {
	position:relative;
	margin:0px 6px; 
	padding:10px 0px 0px;
	border-right:1px solid #d5d5d5;
	border-bottom:1px solid #d5d5d5;
	border-left:1px solid #d5d5d5;
	width:auto;
	height:auto;
	background:#c4e4eb;
}

#footer .wrapper .wrapper .subnav {
	position:relative;
	border-top:1px solid #dff1f4;
	z-index:10;
}

#footer .wrapper .wrapper .subnav li {
	float:left;
	display:inline;
	line-height:36px;
}

#footer .wrapper .wrapper .subnav li a {
	margin-left:20px;
	padding-left:10px;
	background:url(../img/footer_link_bg.gif) left center no-repeat;
	color:#717070;
}

#footer .wrapper .wrapper #pagetop {
	position:absolute;
	right:7px;
	bottom:0px;
	z-index:20;
	background:url(../img/button_pagetop_bg_h.gif) left top repeat-x;
}

#footer .wrapper .wrapper #pagetop a {
	padding:0px;
	width:89px;
	height:27px;
	border-bottom:none;
}

#footer .wrapper .wrapper #pagetop img {
	padding:8px 9px 7px;
	background:url(../img/button_pagetop_bg.gif) left top repeat-x;
}

#footer .wrapper .wrapper #pagetop a:hover img {
	padding:0px;
}

#footer .wrapper .wrapper address {
	position:absolute;
	right:116px;
	bottom:12px
}