﻿@charset "utf-8";

/*-----------------------------------------------------
	CSS information
	site name : 水島臨海鉄道株式会社
	file name : module.css
-----------------------------------------------------*/

#page {
	width:100%;
	background:url(../img/page_bg.png) repeat-x;
}

#wrapper {
	width:960px;
	margin:0 auto;
}

/*-----------------------------------------------------
	header
-----------------------------------------------------*/

#header {
	width:960px;
	height:145px;
	text-align:left;
}

#header h1 {
	float:left;
	padding-top:48px;
}

#header #header-inner {
	float:right;
	padding-top:30px;
	width:600px;
}

#header #header-inner ul#utilityNav {
	width:320px;
	float:left;
	overflow:hidden;
	margin-bottom:13px;
	padding-top:3px;
}

#header #header-inner ul#utilityNav li {
	float:left;
	margin-right:15px;
}


#header #header-inner ul#globalNav {
	width:600px;
	height:43px;
	background:url(../img/gnav_bg.png) no-repeat;
	clear:both;
	overflow:hidden;
}

#header #header-inner ul#globalNav li {
	display:inline;
	float:left;
	width:120px;
}

#header #header-inner ul#globalNav li a {
	display:block;
	width:100%;
}

#header #header-inner ul#globalNav li ul.sub1 {
	width:165px;
	border:1px solid #007BBD;
	border-top:none;
	background:#EEF8FF;
	position:absolute;
	display:none;
	overflow:hidden;
	z-index:10;
}

#header #header-inner ul#globalNav li ul.sub2 {
	width:118px;
	border:1px solid #007BBD;
	border-top:none;
	background:#EEF8FF;
	position:absolute;
	display:none;
	overflow:hidden;
	z-index:10;
}

#header #header-inner ul#globalNav li ul.sub1 li {
	width:165px;
	border-top:1px solid #BCD8E7;
	margin-top:-1px;
	font-size:12px;
	line-height:1.3em;
}

#header #header-inner ul#globalNav li ul.sub2 li {
	width:118px;
	border-top:1px solid #BCD8E7;
	margin-top:-1px;
	font-size:12px;
	line-height:1.3em;
}

#header #header-inner ul#globalNav li ul.sub1 li a,
#header #header-inner ul#globalNav li ul.sub2 li a {
	color:#333;
	border-top:1px solid #FFF;
	padding:10px 10px 10px 20px;
	background:url(../img/icon_arrow2.png) no-repeat 5px 10px;
	display:block;
}


#header #header-inner #googleSearch {
	width:270px;
	float:right;
	text-align:right;
}

#header #header-inner #googleSearch table {
	width:100%;
}

#header #header-inner #googleSearch table td {
	text-align:right;
}

#header #header-inner #googleSearch table td input[type="text"] {
	width:160px;
	height:21px;
	line-height:21px;
}

/*-----------------------------------------------------
	topicPath
-----------------------------------------------------*/

#topicPath {
	text-align:left;
	width:960px;
	height:20px;
	font-size:11px;
	line-height:1.3em;
	margin-top:-20px;
	display:block;
}

/*-----------------------------------------------------
	contents
-----------------------------------------------------*/

#contents {
	width:960px;
	text-align:left;
}

/*-----------------------------------------------------
	main
-----------------------------------------------------*/

#main {
	float:left;
	width:700px;
}

#main.wide {
	float:none;
	width:960px;
}

#main #main-inner {
	width:650px;
	padding:0 24px 25px 24px;
	background:#FFF;
	border:1px solid #BCD8E7;
}

#main #main-inner.wide {
	width:910px;
}

/*-----------------------------------------------------
	pageName
-----------------------------------------------------*/

#main #main-inner #pageName1 {
	width:698px;
	margin:0 -24px 25px -24px;
}

#main #main-inner #pageName1 h2 {
	width:698px;
	position:relative;
}

#main #main-inner #pageName1 h2 span {
	position:absolute;
	top:38px;
	left:165px;
}

#main #main-inner #pageName2 {
	height:60px;
	margin:0 -24px 25px -24px;
}

#main #main-inner #pageName2.himawari {
	background:url(../img/ttl_h2_02_bg.png) no-repeat 0 0;
}

#main #main-inner #pageName2.normal {
	background:url(../img/ttl_h2_03_bg.png) no-repeat 0 0;
}

#main #main-inner #pageName2 h2 {
	height:42px;
	padding-top:18px;
	font-size:18px;
	line-height:1.3em;
	text-indent:15px;
	text-shadow:0px 1px 1px #FFF; 
}

#main #main-inner #pageName2 h2.tsuun {
	background:url(../img/group/logo_tsuun.png) no-repeat 10px 11px;
	text-indent:60px;
}

#main #main-inner #pageName2 h2.service {
	background:url(../img/group/logo_service.png) no-repeat 13px 10px;
	text-indent:60px;
}

#main #main-inner #pageName3 {
	height:60px;
	margin:0 -24px 25px -24px;
	background:url(../img/ttl_h2_bg.png) repeat-x 0 0;
}

#main #main-inner #pageName3 h2 {
	height:42px;
	padding-top:18px;
	font-size:18px;
	line-height:1.3em;
	text-indent:15px;
	text-shadow:0px 1px 1px #FFF; 
	background:url(../img/ttl_h2_02_bg.png) no-repeat right 0;
}

/*-----------------------------------------------------
	side
-----------------------------------------------------*/

#side {
	float:right;
	width:230px;
}

#side .youtube {
	width:230px;
	margin-bottom:25px;
}

#side .youtube h3 {
	font-size:14px;
	line-height:1.5em;
	padding:10px 0 8px 0;
	text-indent:10px;
	color:#FFF;
	background:url(../img/top/ttl_youtube_bg.png) no-repeat;
}

#side .youtube .inner {
	padding:0 5px 10px 5px;
	background:url(../img/top/youtube_btm.png) no-repeat 0 bottom;
}

#side .youtube .inner p.link {
	margin-top:10px;
	padding-right:5px;
	font-size:12px;
	line-height:1.5em;
	text-align:right;
}

#side .youtube .inner p.link a {
	color:#FFF;
	display:inline;
	white-space:nowrap;
	padding-left:15px;
	background:url(../img/icon_arrow6.png) no-repeat 0 3px;
}

#side .sideMenu1,
#side .sideMenu2 {
	width:230px;
	margin-bottom:25px;
}

#side .sideMenu1 h2,
#side .sideMenu2 h2 {
	padding-bottom:10px;
	background:url(../img/sidemenu_bg.png) no-repeat center bottom;
}

#side .sideMenu1 ul,
#side .sideMenu2 ul {
	background:#FFF;
	border:3px solid #BCD8E7;
	overflow:hidden;
}

#side .sideMenu1 ul li {
	margin-top:-1px;
	padding:14px 0 14px 30px;
	font-size:12px;
	line-height:1.3em;
	border-top:1px solid #BCD8E7;
	background:url(../img/icon_arrow1.png) no-repeat 10px 15px;
}

#side .sideMenu1 ul li.on {
	font-weight:bold;
	background:#EDF9FF url(../img/icon_arrow1.png) no-repeat 10px 15px;
}

#side .sideMenu1 ul li.pdf {
	background:url(../img/icon_pdf.png) no-repeat 8px 14px;
}

#side .sideMenu2 ul li {
	margin-top:-1px;
	padding:14px 0 14px 30px;
	font-size:12px;
	line-height:1.3em;
	border-top:1px solid #BCD8E7;
	background:url(../img/icon_arrow3.png) no-repeat 10px 15px;
}

#side .sideMenu1 ul li a,
#side .sideMenu2 ul li a {
	color:#333;
}


#side .sNav {
	width:230px;
	margin-bottom:25px;
}

#side .sNav h3 {
	font-size:14px;
	line-height:1.5em;
	padding:10px 0 8px 0;
	text-indent:10px;
	color:#FFF;
	background:url(../img/ttl_sub_bg.png) no-repeat;
}

#side .sNav ul {
	border:1px solid #BCD8E7;
	border-top:none;
	background:#FFF;
	overflow:hidden;
}

#side .sNav ul.borderTop {
	border-top:1px solid #BCD8E7;
}

#side .sNav ul li {
	font-size:12px;
	line-height:1.3em;
	border-top:1px dotted #BCD8E7;
	margin-top:-1px;
	padding:12px 12px 12px 20px;
	background:url(../img/icon_arrow2.png) no-repeat 5px center;
}

#side .sNav ul li a {
	color:#333;
}

#side .sNav ul li a.pdf {
	display:inline;
	white-space:nowrap;
	padding:2px 22px 2px 0;
	background:url(../img/icon_pdf.png) no-repeat right center;
}

#side .groupNav {
	width:230px;
}

#side .groupNav h3 {
	font-size:14px;
	line-height:1.5em;
	padding:10px 0 8px 0;
	text-indent:10px;
	color:#FFF;
	background:url(../img/ttl_sub_bg.png) no-repeat;
}

#side .groupNav ul {
	border:1px solid #BCD8E7;
	border-bottom:none;
	border-top:none;
	background:#FFF;
	overflow:hidden;
}

#side .groupNav ul li {
	border-bottom:1px solid #BCD8E7;
}

#side .groupNav ul li a:hover img {
	filter:alpha(opacity=70);
	-moz-opacity:0.7;
	opacity:0.7;
	-ms-filter:"alpha(opacity=70)";
}

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

#footer {
	width:100%;
	height:232px;
	background:url(../img/footer_bg.png) no-repeat center 0;
	overflow:hidden;
}

#footer #footer-inner {
	width:960px;
	height:232px;
	margin:0 auto;
	text-align:left;
	background:url(../img/footer_layer2.png) no-repeat 0 bottom;
}


#footer #footer-inner #footer-inner2 {
	position:relative;
	width:960px;
	height:232px;
}

#footer #footer-inner #footer-inner2 #train {
	position:absolute;
	top:96px;
	left:190px;
	z-index:10;
}

#footer #footer-inner #footer-inner2 #layer3 {
	position:absolute;
	bottom:0;
	left:0;
	z-index:20;
}

#footer #footer-inner #footer-inner2 #footNav {
	position:absolute;
	bottom:38px;
	left:0;
	width:960px;
	height:18px;
	z-index:30;
	overflow:hidden;
}

#footer #footer-inner #footer-inner2 #footNav ul {
	font-size:11px;
	line-height:1.5em;
	float:left;
	margin-left:-11px;
}

#footer #footer-inner #footer-inner2 #footNav ul li {
	display:inline;
	border-left:1px solid #555;
	padding:0 10px;
}

#footer #footer-inner #footer-inner2 #footNav ul li a {
	color:#CCC;
}

#footer #footer-inner #footer-inner2 #footNav p.copyright {
	font-size:11px;
	line-height:1.5em;
	color:#CCC;
	float:right;
}

#footer #footer-inner #footer-inner2 p#pagetop {
	position:absolute;
	top:35px;
	right:0;
	z-index:30;
}



