@charset "UTF-8";

/* ===================================
	File Name   : top.css
	Description : Top Page Layout CSS
	Editors     : Taz Sakurai
	Create Date : 2014/05/17

	Update Description :
		2014/05/17 Append - Value Styles [Taz Sakurai]
		2014/05/17 File Create
====================================== */

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

	1. Individual Redefinition
	2. Main Visual
	3. Top About
	4. Top Menu
	5. 
	*. Clear Release
	
====================================== */





/*===== ■1. Individual Redefinition =====*/
body {
	background: url(img/bg_body-top.jpg) repeat-x top;
}
/* Global Navigation */

/* Footer Navigation */

/* Box Setting */

/* Title Setting */
h1 {
	margin: 0px;
	padding: 30px 0px 0px;
	width: 140px;
	height: 40px;
}

h2 {
}





/*===== ■2. Main Visual =====*/
#WideSlider {
	width: 100%;
	height: 550px;
	text-align: left;
	position: relative;
	overflow: hidden;
}

#WideSlider ul,
#WideSlider ul li {
	float: left;
	display: inline;
	overflow: hidden;
}

.wideslider_base {
	top: 0;
	position: absolute;
}
.wideslider_wrap {
	top: 0;
	position: absolute;
	overflow: hidden;
}
.slider_prev,
.slider_next {
	overflow: hidden;
	background: url(img/btn_next.jpg) no-repeat left center;
	position: absolute;
	top: 0;
	z-index: 100;
	cursor: pointer;
}
.slider_prev {background: url(img/btn_prev.jpg) no-repeat right center;}

.pagination {
	bottom: 30px;
	left: 0;
	width: 100%;
	height: 15px;
	text-align: center;
	position: absolute;
	z-index: 200;
}

.pagination a {
	background: url(img/btn_kv-circle-off.png) no-repeat;
	margin: 0 5px;
	width: 15px;
	height: 15px;
	display: inline-block;
	overflow: hidden;
}
.pagination a.active {
	background: url(img/btn_kv-circle-on.png) no-repeat;
	filter:alpha(opacity=100)!important;
	-moz-opacity: 1!important;
	opacity: 1!important;
}




/*===== ■3. Top About  =====*/
#TopAbout {
	background: url(img/img_top01.jpg) no-repeat right bottom;
	padding: 100px 0px 0px;
	margin: 0px 0px 80px;
}

#TopAbout h2 {
	padding: 0px 0px 45px;
}

#TopAbout p {
	padding: 0px 0px 30px;
	line-height: 2.5;
	font-size: 116%;
}

#TopAbout ul li {
	background: url(common/img/arrow_blue.jpg) no-repeat 0px 4px;
	padding: 0px 0px 0px 12px;
}

#TopAbout ul li a:hover {
	opacity: 0.7;
	filter: alpha(opacity=70);
}





/*===== ■. Congestion Status  =====*/
#CongestionStatusBox {
 width: 100%;
}

#CongestionStatusBox iframe {
 height: 450px;
}





/*===== ■4. Top Menu  =====*/
#TopMenu {
	clear: both;
	width: 1005px;
}

#TopMenu dl {
	display: inline;
	float: left;
	margin: 0px 45px 0px 0px;  
	width: 305px;
}

#TopMenu dl.last-child {
	margin: 0px 0px 0px 0px;  
}

#TopMenu dl dd {
	position: relative;
	border: 1px solid #DFDFDF;
	border-top: none;
	width: 298px;
	height: 298px;
}

#TopMenu dl#TopBlogIntro dd ul {
	padding: 20px 15px 0px;
}

#TopMenu dl#TopBlogIntro dd ul li {
	background: url(common/img/arrow_green.jpg) no-repeat 0px 4px;
	padding: 0px 0px 20px 12px;
}

#TopMenu dl#TopBlogIntro dd ul li em {
	display: block;
	float: left;
	margin: 0px 10px 0px 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #5BAA00;
}

#TopMenu dl#TopBlogIntro dd ul li strong {
	display: block;
	float: left;
	background: #3BA0FF;
	padding: 3px;
	line-height: 1;
	font-size: 85%;
	color: #FFF;
}

#TopMenu dl#TopBlogIntro dd ul li p {
	clear: both;
	font-size: 108%;
}

#TopMenu dl#TopBlogIntro dd ul li p a:link,
#TopMenu dl#TopBlogIntro dd ul li p a:visited {
	color: #333;
}

#TopMenu dl#TopBlogIntro dd ul li p a:hover {
	color: #3BA0FF;
}

.Section#TopMenu dl#TopBlogIntro dd p {
 padding: 45px 0 0;
 line-height: 1.8;
 text-align: center;
 font-size: 14px;
}

#TopMenu dl#TopMenuIntro dd dl dt {
	display: inline;
	float: left;
	width: 80px;
	height: 80px;
}

#TopMenu dl#TopMenuIntro dd dl {
	padding: 15px 0px 0px 15px;
}

#TopMenu dl#TopMenuIntro dd dl:nth-child(2) {
	padding: 0 0 0 15px;
}

#TopMenu dl#TopMenuIntro dd dl dd {
	position: relative;
	border: none;
	padding: 15px 0px 0px;
	width: auto;
	height: auto;
}

#TopMenu dl#TopMenuIntro dd dl dd table th {
	background: url(common/img/line_dotted-gray.jpg) repeat-x 0px 7px;
	padding: 0px 0px 10px;
	width: 115px;
	line-height: 1.1;
	font-size: 108%;
}

#TopMenu dl#TopMenuIntro dd dl dd table#PermanentMenu th {
	width: 90px;
}

#TopMenu dl#TopMenuIntro dd dl dd table th span {
	background: #FFF;
	padding: 0px 5px 10px 0px;
}

#TopMenu dl#TopMenuIntro dd dl dd table td {
	padding: 0px 0px 7px 10px;
	line-height: 1;
	letter-spacing: 0.1em;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 123.1%;
}

#TopMenu dl#TopShopIntro dd em {
	border-bottom: 1px solid #E6E6E6;
	display: block;
	margin: 0px auto;
	padding: 15px 0px 10px;
	width: 280px;
	text-align: center;
}

#TopMenu dl#TopShopIntro dd em img {
	display: inline;
}

#TopMenu dl#TopShopIntro dd ol {
	padding: 20px 0px 0px 25px;
}

#TopMenu dl#TopShopIntro dd ol li {
	background: url(img/mark_address.jpg) no-repeat 0px 0px;
	padding: 0px 0px 20px 30px;
}

#TopMenu dl#TopShopIntro dd ol li#IntroStation {background: url(img/mark_train.jpg) no-repeat 0px 0px;}
#TopMenu dl#TopShopIntro dd ol li#IntroBus {background: url(img/mark_bus.jpg) no-repeat 0px 0px;}

#TopMenu dl dd ul.LinkContents {
	position: absolute;
	bottom: 25px;
	padding: 0px 0px 0px 40px;
}

#TopMenu dl#TopBlogIntro dd ul.LinkContents {
	padding: 0px 0px 0px 40px;
}

#TopMenu dl#TopBlogIntro dd ul.LinkContents li {
	background: none;
	padding: 0px;
}

#TopMenu dl dd ul.LinkContents li a:hover {
	opacity: 0.7;
	filter: alpha(opacity=70);
}

#TopMenu article {
 width: 100%;
}


#TopMenu article iframe {
 border-width: 0;
 display: block;
 height: 430px;
}




/*===== ■*.Clear Release  =====*/
#WideSlider ul,
#TopMenu dl#TopMenuIntro dd {
	/zoom: 1;
}

#WideSlider ul:after,
#TopMenu dl#TopMenuIntro dd:after {
	content: '';
	display: block;
	clear: both;
}
