.clear {
	clear: both;
}
h2 span, #pageHeader .lead span, #vision h3 span, #profile dl span {
	display: inline-block;
}
section .contentWidth {
	padding: 50px 100px 80px;
	text-align: left;
	color: #132f57;
}
section h2 {
	font-size: 24px;
	line-height: 1.8;
	letter-spacing: 0.2em;
	font-weight: normal;
}
section h2 span {
	font-size: 12px;
	vertical-align: 0.5em;
	letter-spacing: 0.8em;
}
/* PAGE HEADER ----------------------------------- */
#pageHeader {
	background: url(../img/about/headerImage_bg.png) repeat-x 50% 0%;
	background-color: #dbe9d2;
}
#pageHeader h1 {
	position: absolute;
	width: 100%;
	top: 33px;
}
#pageHeader h1 img {
	margin: 0 auto;
}
#pageHeader .catch {
	position: absolute;
	left: 180px;
	top: 205px;
}
#pageHeader .lead {
	position: absolute;
	color: #FFF;
	top: 332px;
	left: 349px;
	line-height: 2.9;
	width: 320px;
}
#pageHeaderImage {
	display: block;
	width: 100%;
	height: auto;
	max-width: 1000px;
	margin: 0 auto;
}
#pageHeaderImageSp {
	display: none;
}


/* PAGE NAVIGATION ----------------------------------- */
#pageNavi{
	padding:20px 0;
	background:url(../img/BGgray03.jpg) repeat 50% 0%;
}
#pageNavi ul{
}
#pageNavi li{
	display:inline-block;
	width:140px;
	height:140px;
	margin:0 2%;
	color:#132f57;
	text-align:center;
}
#pageNavi li a{
	display:block;
	width:140px;
	height:90px;
	padding:50px 0 0 0;
	background:rgba(255,255,255,0.75);
	border-radius:100px;
	font-size:18px;
	letter-spacing:0.1em;
}
#pageNavi li a:hover{
	background:rgba(255,255,255,1);
}
#pageNavi li a span{
	display:block;
	font-size:14px;
}


/* vision ----------------------------------- */
#vision .contentWidth {
	width: 680px;
	max-width:100%;
	margin: 0 auto;
}
#vision h2 {
	margin-bottom: 60px;
	text-align: center;
}
#vision h3 {
	font-size: 30px;
	font-weight: normal;
	text-align: center;
	border-bottom: solid 2px #132f57;
	padding-bottom: 20px;
	margin-bottom: 65px;
}
#vision h3 em {
	font-size: 32px;
	font-style: normal;
}
#vision li {
	background: url(../img/about/vision_icon.png) no-repeat left 0.5em;
	margin-bottom: 30px;
	font-size: 16px;
	font-weight: bold;
	padding-left: 20px;
}
.aboutImage {
	display: block;
	width: 100%;
	height: auto;
	background-color: #f3f3eb;
}
.aboutImage img {
	display: block;
	max-width: 1200px;
	margin: 0 auto;
}
/* message ----------------------------------- */
#message h2 {
	letter-spacing: 0;
}
section#message h2 span {
	display: inline-block;
	font-size: 24px;
	vertical-align:0;
	letter-spacing: 0.2em;
}
#message h3 {
	font-size: 14px;
	line-height: 2.1;
}
#message .message-inner p {
	margin-top: 40px;
	line-height: 2.1;
}
#message .message-inner span {
	text-align: right;
	display: block;
	margin-top: 40px;
}
/* history ----------------------------------- */
#history {
	background-color: #dee5ea;
}
#history h2 {
	margin-bottom: 40px;
}
/*#history .contentWidth:after {
	content: "";
	display: block;
	width: 100%;
	height: 20px;
}*/
.chronology {
	border-left: solid 1px #132f57;
	margin-left: 15px;
}
.chronology .dots {
	display: block;
	width: 6px;
	height: 6px;
	border-radius: 6px;
	background-color: #132f57;
	margin-left: -3px;
}
.chronology dl {
	margin: -0.9em 0 1.9em 25px;
}
.chronology dl:last-child {
	margin: -0.9em 0 -1.9em 25px;
}
.chronology dt {
	float: left;
}
.chronology dd {
	margin-left: 70px;
}
.chronology dd li {
	position: relative;
	margin-bottom: 8px;
}
.chronology dd li:before {
	content: "";
	display: block;
	width: 5px;
	height: 1px;
	background-color: #132f57;
	position: absolute;
	top: 0.6em;
	left: -98px;
}
.chronology dd li:first-child:before {
	content: none;
}
/* profile ----------------------------------- */
#profile {
	padding: 40px 0 30px 0;
	background-color: #dee5ea;
}
#profile h2 {
	margin-bottom: 40px;
}
#profile li {
	margin-bottom: 15px;
}
#profile dt {
	float: left;
}
#profile dd {
	margin-left: 100px;
}
#profile dd h3{
	font-size:1em;
	font-weight:500;
}
#profile dd p{
	margin:0 0 10px 0;
}

@media screen and (max-width:1200px) {
.aboutImage {
	display: block;
	width: 100%;
	height: auto;
	background-color: #f3f3eb;
	overflow:hidden;
}
.aboutImage img {
	width: 100%;
	height: auto;
}
}

@media screen and (max-width:1000px) {
#pageHeader h1 {
	top: 6%;
}
#pageHeader h1 img {
	width: 13%;
	height: auto;
}
#pageHeader .catch {
	position: absolute;
	width: 65%;
	left: 18%;
	top: 39%;
}
#pageHeader .lead {
	top: 62%;
	left: 34%;
	line-height: 2.4;
	width: 320px;
}
}

@media screen and (max-width:850px) {
section .contentWidth {
	padding: 15% 5.5%;
	text-align: left;
}
section#profile .contentWidth {
	padding: 15% 5.5% 25%;
}
section h2 {
	margin-bottom: 3%;
}
#pageHeader .lead {
	left: 50%;
	line-height: 2.1;
	width: 50%;
	margin: 0 0 0 -25%;
}
#vision .contentWidth {
	width: 80%;
	padding: 10%;
}
}

@media screen and (max-width:760px) {
#pageNavi li{
	width:120px;
	height:120px;
}
#pageNavi li a{
	width:120px;
	height:80px;
	padding:40px 0 0 0;
	font-size:17px;
	letter-spacing:0.05em;
}
#pageNavi li a span{
	font-size:13px;
}
}

@media screen and (max-width:640px) {
section h2 {
	line-height: 1.6;
	margin-bottom: 3%;
}
#pageHeaderImage {
	display: none;
}
#pageHeader h1 {
	display: none;
}
#pageHeader .catch {
	display: none;
}
#pageHeaderImageSp {
	display: block;
}
#pageHeader .lead {
	position: relative;
	left:0;
	color: #132f57;
	background-color: #FFF;
	width: 90%;
	margin:0;
	padding: 10% 5%;
}
.aboutImage img {
	width: 130%;
	margin-left: -15%;
}

#pageNavi{
	padding: 20px 0 5px 0;
}
#pageNavi li{
	width:90%;
	height:auto;
	margin:0 5px 15px 5px;
}
#pageNavi li a{
	width:100%;
	height:auto;
	padding:10px 0 10px 0;
	border-radius:5px;
	font-size:17px;
	letter-spacing:0.1em;
}
#pageNavi li a span{
	font-size:13px;
}
}

@media screen and (max-width:480px) {
#vision .contentWidth {
	width: 89%;
	padding: 5% 5.5% 8%;
}
#vision h2 {
	margin-bottom: 9%;
}
#vision h3 {
	font-size: 24px;
	padding-bottom: 2%;
	margin-bottom: 10%;
}
#vision h3 em {
	font-size: 24px;
	font-style: normal;
}
}

@media screen and (max-width:360px) {
#pageHeader .lead {
	width: 100%;
	padding: 10% 0%;
}
.chronology {
	margin-left: 5px;
}
.chronology dl {
	margin: -0.9em 0 1.9em 10px;
}
.chronology dl:last-child {
	margin: -0.9em 0 -1.9em 10px;
}
.chronology dd {
	margin-left: 50px;
}
.chronology dd li:before {
	left: -63px;
}
#profile dt {
	float: none;
	padding-top: 10px;
	font-weight: 600;
}
#profile dd {
	margin-top: 1px;
	margin-left: 0;
	padding-top: 1px;
	border-top: solid 1px #132f57;
}
}