@charset "utf-8";

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

STYLE CSS
 
------------------------------------------------------------------------- */

body {
	font: 14px 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	color: #333;
	line-height: 1.8;
	
}

img {
	border: none;
	vertical-align: bottom;
}

a img {
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}  

a img:hover {
	opacity: 0.5;
    filter: alpha(opacity=50);
	-ms-filter: "alpha(opacity=50)";
}

#top-nav a img:hover {
	opacity: 1;
    filter: alpha(opacity=100);
	-ms-filter: "alpha(opacity=100)";
}

a, a:visited {
	color: #506a97;
	text-decoration: none;
}

a:hover {
	color: #506a97;
}

a:focus {
	outline: none;
}

li {
	list-style: none;
}

/*===============================================
container
===============================================*/

#container {
	width: 100%;
	height: 100%;
	min-width: 1000px;
	min-height: 720px;
	position: absolute;
}

/*===============================================
contents
===============================================*/

#contents {
	width: 100%;
	height: 100%;
	margin-top: -30px;
	position: absolute;
	overflow: hidden;
}

/*===============================================
page nav
===============================================*/

#home {
	position: absolute;
	top: 60px;
	left: 30px;
	z-index: 9999;
}

#title {
	position: absolute;
	top: 60px;
	right: 30px;
	z-index: 9999;
}

#prev {
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -28px;
	z-index: 9999;
}

#next {
	position: absolute;
	top: 50%;
	right: 0;
	margin-top: -28px;
	z-index: 9999;
}

/*===============================================
top page
===============================================*/

#top-container {
	width: 100%;
	height: 100%;
	min-width: 1000px;
	min-height: 720px;
	position: absolute;
}

#top-nav {
	width: 840px;
	height: 540px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -240px 0 0 -420px;
}

#top-nav ul {
	margin: 0 -20px -20px 0;
    overflow: hidden;
    zoom: 1;
}

#top-nav ul li {
	float: left;
	margin: 0 20px 20px 0;
	width: 195px;
	height: 260px;
    display: inline;
}

/*===============================================
text area
===============================================*/

#text-area {
	background: url(../images/bg_textarea_01.png);
	padding: 60px 20px 30px 30px;
	height: 100%;
	-moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

#text-area-last {
	background: url(../images/bg_textarea_01.png);
	padding: 30px;
	height: auto !important;
	-moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

#text-area h1,
#text-area-last h1 {
	font-size: 24px;
	line-height: 1.4;
	font-weight: normal;
	margin: 10px 0 40px;
}

#text-area p,
#text-area-last  p {
	margin-bottom: 30px;
}

#scroll-area {
	height: 100%;
	overflow: auto;
}

.next-page {
	background: url(../images/list_arrow_01.gif) left 3px no-repeat;
	padding: 0 0 0 20px;
	font-weight: bold;
	line-height: 1.4;
	text-align: left;
}

.next-page-top {
	background: url(../images/list_arrow_01.gif) left 3px no-repeat;
	padding: 0 0 0 20px;
	font-weight: bold;
	line-height: 1.4;
	position: absolute;
	bottom: 120px;
	left: 0;
}

.boxL {
	width: 460px;
	height: 100%;
	position: absolute;
	top: 0;
	left: 8%;
}

.boxR {
	width: 460px;
	height: 100%;
	position: absolute;
	top: 0;
	right: 8%;
}

.boxL-last {
	width: 460px;
	height: 100%;
	position: absolute;
	bottom: 60px;
	left: 8%;
}

.boxR-last {
	width: 460px;
	height: 100%;
	position: absolute;
	bottom: 60px;
	right: 8%;
}

#masujima-top {
	width: 416px;
	height: 100%;
	position: absolute;
	top: 0;
	left: 8%;
}

#masujima-lead {
	width: 416px;
	height: 280px;
	margin-top: -200px;
	position: absolute;
	top: 50%;
	left: 0;
}

#taniguchi-top {
	width: 347px;
	height: 100%;
	position: absolute;
	top: 0;
	left: 8%;
}

#taniguchi-lead {
	width: 347px;
	height: 334px;
	margin-top: -200px;
	position: absolute;
	top: 50%;
	left: 0;
}

#kawahara-top {
	width: 417px;
	height: 100%;
	position: absolute;
	top: 0;
	left: 8%;
}

#kawahara-lead {
	width: 417px;
	height: 247px;
	margin-top: -167px;
	position: absolute;
	top: 50%;
	left: 0;
}

#okada-top {
	width: 400px;
	height: 100%;
	position: absolute;
	top: 0;
	left: 8%;
}

#okada-lead {
	width: 400px;
	height: 253px;
	margin-top: -167px;
	position: absolute;
	top: 50%;
	left: 0;
}

#shimizu-top {
	width: 359px;
	height: 100%;
	position: absolute;
	top: 0;
	right: 8%;
}

#shimizu-lead {
	width: 359px;
	height: 301px;
	margin-top: -167px;
	position: absolute;
	top: 50%;
	left: 0;
}

#taiji-top {
	width: 426px;
	height: 100%;
	position: absolute;
	top: 0;
	left: 8%;
}

#taiji-lead {
	width: 426px;
	height: 325px;
	margin-top: -200px;
	position: absolute;
	top: 50%;
	left: 0;
}

#tanaka-top {
	width: 419px;
	height: 100%;
	position: absolute;
	top: 0;
	left: 8%;
}

#tanaka-lead {
	width: 419px;
	height: 301px;
	margin-top: -167px;
	position: absolute;
	top: 50%;
	left: 0;
}

#watanabe-top {
	width: 383px;
	height: 100%;
	position: absolute;
	top: 0;
	left: 8%;
}

#watanabe-lead {
	width: 383px;
	height: 302px;
	margin-top: -167px;
	position: absolute;
	top: 50%;
	left: 0;
}

/*===============================================
notes area
===============================================*/

#notes-area {
	display: none;
}

.notes-text {
	max-width: 600px;
}

.notes-text dt {
	font-size: 16px;
	margin-bottom: 16px;
}

/*===============================================
footer
===============================================*/

#footer {
	width: 100%;
	height: 30px;
	background: #fff;
	line-height: 0;
	position: absolute;
	bottom: 0;
}

#footer nav {
	width: 95px;
	height: 8px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -4px 0 0 -43px;
}

#footer nav ul li {
	float: left;
	width: 19px;
	background: url(../images/bg_footer_01.gif) 11px 3px no-repeat;
}

#footer nav ul li.end {
	width: 8px;
	float: left;
}

#footer-logo {
	overflow: hidden;
	width: 71px;
	height: 20px;
	margin: -10px 0 0 0;
	position: absolute;
	top: 50%;
	left: 30px;
}

#copy {
	color: #777;
	font-size: 9px;
	position: absolute;
	top: 50%;
	left: 121px;
}

#social {
	overflow: hidden;
	height: 20px;
	margin: -10px -10px 0 0;
	position: absolute;
	top: 50%;
	right: 30px;
}

#social li {
	float: left;
	margin: 0 10px 0 0;
	list-style: none;
}