@charset "UTF-8";

/* ===================================
	File Name   : about.css
	Discription : About Page Layout CSS
	Create Date : 2011/02/24
	Last Editor : Taz Sakurai

	Update Discription :
	 2011/02/28 : Update 
====================================== */

/*========== Style Contents ==========

	1. Individual Redefinition
	2. Section [HistoryIntro]
	3. Section [AccessIntro]
	4. Access Map Page Setting
	5. Section [OrganizationIntro]

	*. Clear Release
	
====================================== */





/*===== ■1. Individual Redefinition =====*/
#Contents ul#GlobalNavi li a#BtnAbout {background-position: -200px -230px;}
#Footer ul#FooterNavi li a#BtnFootAbout {background-position: -200px -648px;}

#SideBox dl dd ul li a {
	background: url(img/img_btn-about.png) no-repeat;
	width: 99px;
}

#SideBox dl dd ul li a#BtnSideAccessMap {background-position: 0px -18px;width: 103px;}
#SideBox dl dd ul li a#BtnSideOrganization {background-position: 0px -36px;width: 181px;}

body#History #SideBox dl dd ul li a#BtnSideHistory,
#SideBox dl dd ul li a#BtnSideHistory:hover {background-position: -350px 0px;}
body#Access #SideBox dl dd ul li a#BtnSideAccessMap,
#SideBox dl dd ul li a#BtnSideAccessMap:hover {background-position: -350px -18px;}
body#Organization #SideBox dl dd ul li a#BtnSideOrganization,
#SideBox dl dd ul li a#BtnSideOrganization:hover {background-position: -350px -36px;}







/*===== ■2. Section [HistoryIntro]  =====*/
#HistoryIntro h3 {
	margin: 0px 0px 35px 35px;
}

#HistoryIntro h4 {
	background: #D9CBAB;
	padding: 3px 10px 2px;
	width: 360px;
	font-weight: bold;
	font-size: 108%;
	color: #2E230D;
}

#HistoryIntro dl {
	width: 360px;
	margin: 0px 0px 0px 10px;
}

#HistoryIntro dt {
	background: url(../common/img/mark_circle-yellow.jpg) no-repeat 12px 21px;
	padding: 17px 0px 5px 25px;
	font-weight: bold;
	font-size: 93%;
}

#HistoryIntro dt strong {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 116.6%;
}

#HistoryIntro dt em {
	padding: 0px 0px 0px 5px;
}

#HistoryIntro dd {
	background: url(../common/img/line_dotted-brown.gif) repeat-x bottom;
	padding: 0px 0px 17px 25px;
	font-size: 93%;
}

#HistoryIntro dd.last-child {
	background: none;
}

#HistoryIntro span {
	display: block;
	position: absolute;
	right: 50px;
	top: 315px;
	width: 242px;
	text-align: center;
}

#HistoryIntro span img {
	display: inline;
}





/*===== ■3. Section [AccessIntro]  =====*/
#AccessIntro p {
	width: 630px;
	margin: 0px auto 10px;
}

#AccessIntro em {
	display: block;
	background: url(img/mark_caution.jpg) no-repeat 15px 3px;
	float: left;
	width: 400px;
	padding: 3px 0px 3px 50px;
	font-size: 93%;
}

#AccessIntro ul {
	float: right;
	padding: 0px 10px 0px 0px;
	width: 180px;
	height: 30px;
}

#AccessIntro ul li a {
	display: block;
	background: url(img/img_btn-about.png) no-repeat 0px -54px;
	width: 180px;
	height: 30px;
}

#AccessIntro ul li a:hover {background-position: -350px -54px;}






/*===== ■4. Access Map Page Setting  =====*/
body#AccessMap {
	background: url(../common/img/bg_body-pop.jpg) repeat-x;
}

body#AccessMap #Entirety {
	background: url(../common/img/bg_entirety-pop.png) no-repeat center 0px;
}

body#AccessMap #Header {
	position: relative;
	width: 810px;
	height: 119px;
}

body#AccessMap #Header h1 {
	position: absolute;
	padding: 0px;
	left: 370px;
	top: 45px;
	z-index: 99;
}

body#AccessMap #Contents {
	background: url(../common/img/bg_contents-head-pop.png) no-repeat 0px 0px;
	width: 810px;
}

body#AccessMap #Footer {
	background: url(../common/img/bg_footer.jpg) repeat-x bottom;
	height: 40px;
}

body#AccessMap address {
	padding: 10px 0px 0px;
}

body#AccessMap .Section {
	width: 720px;
	margin: 0px auto;
}

body#AccessMap .Section p {
	width: 720px;
	padding: 30px 0px 0px;
	margin: 0px auto 20px;
}

body#AccessMap .Section ul {
	padding: 0px 0px 0px 15px;
}

body#AccessMap .Section ul li {
	float: left;
	padding: 0px 5px;
}

body#AccessMap .Section ul li a {
	display: block;
	background: url(img/img_btn-about.png) no-repeat 0px -84px;
	width: 335px;
	height: 34px;
}

body#AccessMap .Section ul li a#BtnGoogle {background-position: 0px -118px;}

body#AccessMap #MapIntro ul li a#BtnIllust,
body#AccessMap .Section ul li a#BtnIllust:hover {background-position: -350px -84px;}
body#AccessMap #GoogleMapIntro ul li a#BtnGoogle,
body#AccessMap .Section ul li a#BtnGoogle:hover {background-position: -350px -118px;}

body#AccessMap .Section div#MapBox {
	border: 5px solid #D7C9A7;
	width: 710px;
	height: 500px;
	text-align: center;
	font-size: 93%;
	font-family: Arial, Helvetica, sans-serif;
}

body#AccessMap .Section em {
	display: block;
	background: url(img/mark_caution.jpg) no-repeat 0px 15px;
	float: left;
	width: 220px;
	padding: 15px 0px 3px 35px;
	font-size: 93%;
}

body#AccessMap .Section ul.PageNavi {
	float: right;
	padding: 15px 240px 0px 0px;
}

body#AccessMap .Section ul.PageNavi li {
	padding: 0px 0px 0px 10px;
}

body#AccessMap .Section ul li a#BtnPrint {background-position: 0px -152px; width: 100px; height: 30px;}
body#AccessMap .Section ul li a#BtnClose {background-position: 0px -182px; width: 100px; height: 30px;}

body#AccessMap .Section ul li a#BtnPrint:hover {background-position: -350px -152px;}
body#AccessMap .Section ul li a#BtnClose:hover {background-position: -350px -182px;}






/*===== ■5. Section [OrganizationIntro]  =====*/
#OrganizationIntro h3 {
	float: left;
	margin: 0px 0px 60px 35px;
}

#OrganizationIntro span {
	float: right;
}

#OrganizationIntro h4 {
	clear: both;
	background: #D9CBAB;
	padding: 3px 10px 2px;
	width: 630px;
	font-weight: bold;
	font-size: 108%;
	color: #2E230D;
}

#OrganizationIntro ul {
	padding: 0px 5px 20px;
	width: 620px;
}

#OrganizationIntro ul li {
	display: block;
	background: url(../common/img/line_dotted-brown.gif) repeat-x bottom;
	padding: 10px 0px;
}

#OrganizationIntro ul li.last-child {
	background: none;
}

#OrganizationIntro ul li strong {
	display: block;
	background: url(../common/img/mark_circle-yellow.jpg) no-repeat 5px 5px;
	padding: 0px 0px 5px 18px;
}

#OrganizationIntro ul li p {
	padding: 0px 0px 0px 18px;
	margin: 0px;
	font-size: 93%;
}

#OrganizationIntro ul li a {
	font-size: 93%;
	background: url(../common/img/mark_arrow-brown.jpg) no-repeat 20px 4px;
	padding: 0px 0px 0px 30px;
}





/*===== ■*.Clear Release  =====*/
body#AccessMap .Section ul:after {
	content: ".";
	display: block;
	height: 0px;
	clear: both;
	visibility: hidden;
}

body#AccessMap .Section ul {
	display: inline-block;
}

/* Hides from IE-mac ￥*/
*html body#AccessMap .Section ul {
	height: 1%;
}

body#AccessMap .Section ul {
	display: block;
}
/* End hides from IE-mac ￥*/