@charset "utf-8";

/* ****************************************************
Title: base.css
Created: 2010-10-15
Last Modified: 2010-10-16
Editor(s): Kenta Uota - liberal design
Last Editor: Kenta Uota - liberal design
***************************************************** */


/* Table Of Contents
----------------------------------------

# General Elements
# body
# layout
# header
# nav
# topicPath
# keyvisual
# content
# page nav
# sidebar
# footer
# clearfix
# common classes

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


/* # General Elements
---------------------------------------------------------------------------- */
body{
	font:13px/1.231 Verdana,osaka,'ＭＳ Ｐゴシック','MS PGothic','メイリオ',Meiryo,sans-serif;
/*	font-size:12px;*/
	color:#333;
}

select,input,button,textarea,button{
	font:99% arial,helvetica,clean,sans-serif;
}

table{
	font-size:inherit;
	font:100%;
}

/* IE6 and IE7 Hack */
* html body {font-family: 'ＭＳ Ｐゴシック',sans-serif;}
*:first-child+html body {font-family: 'ＭＳ Ｐゴシック','メイリオ',sans-serif;}

/* 日本語が読みやすいline-height例 */
body * {
/*	line-height:1.38em;*/
}

/* link */
a { color: #ccc; text-decoration: none; }
a:hover	{ color: #eee; text-decoration: underline; }



/* # body
---------------------------------------------------------------------------- */
body {
	background-color: #fff;
	color: #333;
	line-height: 2;
}

.wrap {
	width: 100%;
	position: relative;
}

.innerWrap {
	width: 960px;
	margin: 0 auto;
}

sTop .innerWrap,
s1 .innerWrap,
s1 .innerWrap,
s2 .innerWrap,
s3 .innerWra {
}


h1 {
	width: 178px;
	height: 178px;
	position: fixed;
	z-index: 100001;
}

h1 a {
	display: block;
	background:url(../images/logo.png) 0 0 no-repeat;
	width: 178px;
	height: 178px;
	text-indent: -9999px;
}



.subMenu .innerWrap {
	width: 700px !important;
	margin: 0 auto;
}


/* SECTIONS */

.sTop {
}

.sTop .inner {
	min-height: 728px;
	padding: 0 !important;
}

.sTop .inner .home {
	height: 560px;
	background:url(../images/img_logo.png) center 238px no-repeat #a4cfeb;
	position: relative;
}

.s1 {
	background: url(../images/bg01.gif) 0 0 repeat;
}


.s2 {
	background: #fff;
}


.s3 {
	background: url(../images/bg01.gif) 0 0 repeat;
}

.s4 {
	background: #fff;
}



/* information */

.information {
	background: #fff;
	width: 960px;
	margin: 0 auto;
	padding: 30px 0;
}

.information h2 {
	background:url(../images/h2_info_01.png) 0 0 no-repeat;
	width: 90px;
	height: 51px;
	margin: 0 auto 20px;
	text-indent: -9999px;
}

.information .openInfo {
	background:url(../images/btn_info.png) 0 0 no-repeat;
	width: 26px;
	height: 17px;
	margin: 0 auto 20px;
	text-indent: -9999px;
	cursor: pointer;
}

.information ul li {
	padding: 10px 0;
	border-bottom: 1px dotted #ccc;
}

.information ul li span {
	margin-right: 20px;
	font-weight: bold;
	color: #73a0be;
}


/* s1 */
.s1 h2 {
	background:url(../images/h2_about_01.png) 0 0 no-repeat;
	width: 67px;
	height: 53px;
	margin: 0 auto 20px;
	text-indent: -9999px;
}

.s1 p.lead {
	text-align: center;
	margin-bottom: 60px;
}

.s1 ul.colmun4 {
	width: 832px;
	margin: 0 auto;
}

.s1 ul.colmun4 li {
	width: 208px;
	height: 200px;
	float: left;
	text-align: center;
}

.s1 ul.colmun4 li {
	width: 208px;
	height: 200px;
	padding-top: 150px;
	float: left;
	text-align: center;
}

.s1 ul.colmun4 li.col01 { background:url(../images/img_about01.png) center 0 no-repeat; }
.s1 ul.colmun4 li.col02 { background:url(../images/img_about02.png) center 0 no-repeat; }
.s1 ul.colmun4 li.col03 { background:url(../images/img_about03.png) center 0 no-repeat; }
.s1 ul.colmun4 li.col04 { background:url(../images/img_about04.png) center 0 no-repeat; }

.s1 ul.colmun4 li dl dt {
	font-weight: bold;
}

.s1 ul.colmun4 li dl dd {
	font-size: 85%;
	padding: 0 15px;
}



/* s2 */
.s2 h2 {
	background:url(../images/h2_company_01.png) 0 0 no-repeat;
	width: 67px;
	height: 54px;
	margin: 0 auto 20px;
	text-indent: -9999px;
}

.s2 .tableTop {
	background:url(../images/bg_company_01.png) 0 0 no-repeat;
	width: 642px;
	height: 51px;
	margin: 0 auto;
}

.s2 .tableBottom {
	background:url(../images/bg_company_02.png) 0 0 no-repeat;
	width: 642px;
	height: 51px;
	margin: 0 auto;
}

.s2 .tableMid {
	background-color: #314755;
	width: 520px;
	padding: 0 60px;
	margin: 0 auto;
}

.s2 .tableMid table {
	width: 100%;
	color: #fff;
}

.s2 .tableMid table th,
.s2 .tableMid table td {
	padding: 10px;
	vertical-align: top;
}


/* s3 */
.s3 h2 {
	background:url(../images/h2_program_01.png) 0 0 no-repeat;
	width: 66px;
	height: 52px;
	margin: 0 auto 20px;
	text-indent: -9999px;
}


.s3 h3 {
	background:url(../images/dotted.gif) 0 bottom repeat-x;
	font-size: 120%;
	font-weight: bold;
	border-bottom: 1px solid #fff;
	margin-bottom: 40px;
}

.s3 ul {
	padding-bottom: 40px;
}

.s3 ul li {
	background-color: #fff;
	width: 448px;
	height: 80px;
	margin-bottom: 20px;
	padding: 10px;
	border: 1px solid #ccc;
	line-height: 1.5;
}

.s3 ul li img {
	display: block;
	width: 80px;
	float: left;
	margin-right: 10px;
}

.s3 ul li.fLeft {
	float: left;
}

.s3 ul li.fRight {
	float: right;
}



/* s4 */
.s4 h2 {
	background:url(../images/h2_performance_01.png) 0 0 no-repeat;
	width: 100px;
	height: 52px;
	margin: 0 auto 20px;
	text-indent: -9999px;
}

.s4 h3 {
	font-size: 120%;
	font-weight: bold;
	border-bottom: 2px solid #ccc;
	margin-bottom: 20px;
}

.s4 ul {
	padding-bottom: 40px;
	padding-left: 10px;
}

.s4 .column01 {
	width: 468px;
}

.s4 .fLeft {
	float: left;
}

.s4 .fRight {
	float: right;
}

.s4 h4 {
	background-color: #314755;
	margin-bottom: 10px;
	padding: 5px 10px;
	color: #fff;
}

.s4 .column01 li {
	background:url(../images/arrow02.png) 0 50% no-repeat;
	padding-left: 10px;
}


/* # footer
---------------------------------------------------------------------------- */


p.addbanner {
	width: 960px;
	height: 77px;
	margin: 0 auto 20px;
}

p.addbanner a {
	display: block;
	width: 960px;
	height: 77px;
	background:url(../images/img_address1.png) 0 0 no-repeat;
	text-indent: -9999px;
}

p.addbanner a:hover {
	background-position: 0 100%;
}

/* page top */

.pagetop {
	width:960px;
	margin: 0 auto;
}

.pagetop a {
	display: block;
	background:url(../images/img_page_top.png) 0 bottom no-repeat;
	width: 119px;
	height: 26px;
	margin: 0 0 0 auto;
	text-indent: -9999px;
}


#footer {
	background:#a4cfeb;
	padding: 40px 0;
}


/* Copyright */

#copyright {
	text-align:center;
	font-size: 85%;
}


/* # clearfix
---------------------------------------------------------------------------- */
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
 
.clearfix {
	display: inline-table;
	min-height: 1%;
}
 
/* Hides from IE-mac */
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}
/* End hide from IE-mac */


/* # common classes
---------------------------------------------------------------------------- */
.right {
	float:right;
}

.left {
	float:left;
}

.bold {
	font-weight:bold;
}


/* This class gives the next element "clear:both"
You don't have to put "clear:both; for the next element"*/
.after_clr {
    zoom: 100%;
}
.after_clr:after {
    content: "";
    clear: both;
    height: 0;
    display: block;
    visibility: hidden;
}