@charset "UTF-8";

/* ========================================
	common
======================================== */
html, body {
	height: 100%;
}
#wrapper {
	position: absolute;
	top:0;
	z-index: 10;
	margin: 0 auto;
	padding-top: 46px;
	width: 100%;
	min-width: 994px;
	min-height: 100%;
	overflow: hidden;
	background: url(../common/bg_btm.png) repeat-x bottom left;
}
#container {
	min-height: 100%;
	background: url(../common/bg_top.png) repeat-x top left;
}

.disnon {
	display: none;
}
.disblock {
	display: block;
}

/* alpha
-----------------------------------*/
a:link .alpha,
a:visited .alpha {
	opacity: 1;
	-moz-opacity: 1; /* Firefox */
	filter: alpha(opacity=100); /* IE6/7 */
	-ms-filter: "alpha(opacity=100)"; /* IE8 */
}
a:hover .alpha,
a:active .alpha {
	opacity: 0.5;
	-moz-opacity: 0.5; /* Firefox */
	filter: alpha(opacity=50); /* IE6/7 */
	-ms-filter: "alpha(opacity=50)"; /* IE8 */
}

/* ========================================
	#header
======================================== */
#header-logo {
	position: relative;
	margin: 0 auto;
	min-width: 960px;
	width: 100%;
	top: 0;
	z-index: 20;
	height: 32px;
}
#header-logo .hard {
	position: absolute;
	top: 13px;
	right: 16px;
}

#header-inner {
	position: relative;
	width: 960px;
	height: 127px;
	margin: 0 auto;
}
#header-inner .logo {
	position: absolute;
	left: -3px;
}
#header-inner .logo .layer {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 284px;
	height: 127px;
	background: url(../common/logo_on.png) no-repeat center top;
	opacity: 0;
	transition: opacity 0.6s;
}
#header-inner .logo:hover .layer {
	opacity: 100;
	transition: opacity 0.6s;
}

#gnavi {
	position: absolute;
	top: 0;
	right: -6px;
	width: 686px;
	background: url(../common/bg_gnavi.png) no-repeat right top;
}
#gnavi ul {
	position: relative;
}
#gnavi ul li {
	position: relative;
	float: left;
	z-index: 20;
}
#gnavi ul .gnavi03,
#gnavi ul .gnavi04 {
	margin-top: 13px;
}
#gnavi ul li a {
	display: block;
}
#gnavi li .layer {
	display: block;
	height: 47px;
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	transition: opacity 0.6s;
}
#gnavi li:hover .layer {
	opacity: 100;
	transition: opacity 0.6s;
}
#gnavi .gnavi01 .layer {
	width: 172px;
	height: 127px;
	background: url(../common/gnavi01_on.png) no-repeat left top;
}
#gnavi .gnavi02 .layer {
	width: 164px;
	height: 127px;
	background: url(../common/gnavi02_on.png) no-repeat left top;
}
#gnavi .gnavi03 .layer {
	width: 228px;
	background: url(../common/gnavi03_on.png) no-repeat left top;
}
#gnavi .gnavi04 .layer {
	width: 111px;
	background: url(../common/gnavi04_on.png) no-repeat left top;
}
#gnavi .gnavi05 .layer {
	width: 190px;
	background: url(../common/gnavi05_on.png) no-repeat left top;
}
#gnavi .gnavi06 .layer {
	width: 149px;
	background: url(../common/gnavi06_on.png) no-repeat left top;
}
#gnavi ul .gnavi07 {
	position: absolute;
	bottom: 23px;
	right: 11px;
	z-index: 10;
}
#gnavi .gnavi07 .layer {
	width: 175px;
	height: 47px;
	background: url(../common/gnavi07_on.png) no-repeat left top;
}

/* ========================================
	#contents
======================================== */
#contents {
	position: relative;
	width: 994px;
	margin: 42px auto 0;
	padding: 110px 0 100px;
	background: url(../common/bg_contents.jpg) repeat-y center top;
}
#contents .deco-top {
	position: absolute;
	top: -25px;
	left: 0;
	width: 994px;
	height: 110px;
	background: url(../common/bg_contents_top.png) no-repeat center top;
}
#contents .deco-btm {
	position: absolute;
	bottom: -25px;
	left: 0;
	width: 994px;
	height: 96px;
	background: url(../common/bg_contents_btm.png) no-repeat center bottom;
}
#contents-inner {
	position: relative;
	width: 830px;
	margin: -25px auto -29px;
	padding: 25px 82px 0;
	background: url(../common/bg_contents_side.png) repeat-y center top;
	z-index: 20;
}
.ttl-area {
	position: relative;
	margin-top: -50px;
}

/* ========================================
	#footer
======================================== */
#footer {
	width: 960px;
	margin: 63px auto 55px;
}
.topicpath li {
	float: left;
}

/* ========================================
	#pagetop
======================================== */
#pagetop {
	width: 976px;
	margin: 0 auto;
}
#pagetop a {
	float: right;
	margin-top: -102px;
}