@charset "utf-8";

/* ==================================================================
	common.css
	
=================================================================== */

/* =================================
   ■ 共通指定
================================== */

/* --------------------------------
   □ font設定
-------------------------------- */ 
body{
	-webkit-text-size-adjust: 100%;
	font-size:16px;
}
/* WINIE用 \*/
* html body{ font-size:100%; }
*:first-child+html body{ font-size:100%; }
/* */

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

select, input, textarea {
	font:99%;
}

li li,li p,li pre,li dt,li dd,dd li,dd p,dd pre,dd dt,dd dd {
  font-size:100%;
}

/* --------------------------------
   □ body
-------------------------------- */ 
body{
	font-family: "メイリオ", "ＭＳ Ｐゴシック", sans-serif;
	text-align: center; 	/* IE用 */

	color: #333333;
	background:#fff;
}

/* --------------------------------
   □ text
-------------------------------- */
p { 
	margin:0 0 0.8em 0;
	text-align:justify;
	text-justify:inter-ideograph;
}

p,table,ul,dl,ol,address{
	line-height:1.5;
}

/* --------------------------------
   □ form
-------------------------------- */
input, select{
	font-family: Arial, "ＭＳ Ｐゴシック", sans-serif;
}

input.text{
	line-height:1.2;
}

input.text,
textarea {
	border: 1px solid #aaa;
	padding:4px;
}

* html input.text,
* html textarea {
	padding:4px 4px 0px 4px;
}

*:first-child + html input.text,
*:first-child + html textarea {
	padding:4px 4px 0px 4px;
}

input.text:hover,
textarea:hover {
	border: 1px solid #aaa;
}

input.text:focus,
textarea:focus {
	border: 1px solid #333333;
}

input.submit{
	line-height:100%;
	padding-top:2px;
}

/* --------------------------------
   □ link
-------------------------------- */
/* 基本 */
a,
a:link{
	color:#0099CC;
	text-decoration:none;
}

/* 訪問済 */
a:visited {
	color:#0099CC;
}

/* ロールオーバー */
a:hover{
	color:#4CB7DB;
	text-decoration:underline;
}

/* =================================
   ■ レイアウト
================================== */
/* --------------------------------
   □ 大枠 
-------------------------------- */

/* ---------------------------------------------------------------------------------------
    13px(82%)で使用する場合の%表
   ---------------------------------------------------------------------------------------
	10px	77%
	11px	85%
	12px	93%
	13px	100%
	14px	108%
	15px	116%
	16px	124%
	17px	131%
	18px	139%
	19px	147%
	20px	154%
	21px	162%
	22px	170%
	23px	177%
	24px	185%
	25px	193%
	26px	200%
	 
	 引用元
	 http://webtech-walker.com/archive/2008/05/16032443.html
   --------------------------------------------------------------------------------------- */

div.site .area,
div.contents,
div.publication .section{
	width:980px;
	margin: 0 auto 0 auto;
	text-align: left;
}

div.pageInformation,
div.site,
div.contents,
div.primaryContents,
div.publication{
	font-size:82%;
}

/*
body > .site,
body > .contents,
body > .publication{ 
	width:700px;
}
* /

/* --------------------------------
   □ サイト情報 (ヘッダー)
-------------------------------- */
div.site{ 
	position:relative;
	height:198px;
	background:url(../images/common/header/background.gif) 0 100% repeat-x;
	border-bottom:4px solid #0099cb;
	z-index:101;	
}

div.site .area{
	position:relative;
}

div.site .area p.alert{
	position:absolute;
	top:0;
	left:0;
	z-index:105;
	
	width:100%;
	
	color:#fff;
	padding:2px 2px 2px 25px;
	line-height:17px;
	background:#F00 url(../images/common/icon/alert.png) 3px 50% no-repeat;
}

div.site .area p.alert a{
	color:#fff;
	text-decoration:underline;
}

div.site .area h1,
div.site .area .logo{
	position:absolute;
	top:28px;
	left:0;
	margin:0;
}

div.site .area .language{
	position:absolute;
	top:25px;
	left:294px;
	padding-left:5px;
	border-left:1px solid #eeeeee;
	
	font-size:13px;
}
	
	div.site .area .language li{
		display:inline-block;
		vertical-align:top;
		padding:0 2px;
		margin-left:-5px;
		line-height:1;
		border-right:1px solid #eeeeee;
	}

div.site .area .control{
	position:absolute;
	top:25px;
	right:180px;
	width:140px;
}
	
	div.site .area .control dt{
		display:inline;
		float:left;
		width:40px;
	}
	div.site .area .control dt img{
		margin-top:4px;
	}
	div.site .area .control dd{
		display:inline;
		float:left;
		width:30px;
		background:0 0 no-repeat;
	}
	
	div.site .area .control dd.normal{
		background-image:url(../images/common/header/text/normail-over.gif);
	}
	div.site .area .control dd.normal img{
		visibility:hidden;
	}
	
	div.site .area .control dd.large{
		background-image:url(../images/common/header/text/zoom-over.gif);
	}

div.site .area .slogan{
	position:absolute;
	top:18px;
	right:0;
	margin:0;
}

#srchBox{
	position:absolute;
	top:78px;
	right:0;
	width:317px;
}

#srchBox p{
	margin:0;
}

#srchBox input#srchInput{
	border:0;
	width:283px;
	padding:10px 25px 10px 7px;
	border:1px solid #cccccc;
}

#srchBox input#srchBtn{
	position:absolute;
	top:12px;
	right:7px;
}

#srchBox #srchLogo{
	display:none;
}



	/* --------------------------------
	   □ トップサブメニュー
	-------------------------------- */
	
	.site #subNavigation{
		position:absolute;
		top:77px;
		right:352px;
	}
	
	.site #subNavigation li{
		display:inline;
		float:left;
		width:160px;	
		height:44px;
		margin-left:28px;
		background:0 0 no-repeat;
	}
	
	.site #subNavigation li a{
		width:100%;
		height:100%;
		background:0 0 no-repeat;
	}
		
	/* ロールオーバー */
	html .site #subNavigation li a:hover{ visibility:inherit;}
	html .site #subNavigation li a:hover img{ visibility:hidden; display:inline-block;}
	html:not(:target) .site #subNavigation li a:hover img{ display:block;}
	@media all and (-ms-high-contrast:none){
	  *::-ms-backdrop, .site #subNavigation li a:hover{ display:inline-block;} /* IE11 */
	}

	.IE10 .site #subNavigation li a:hover img{ display:inline-block;}	
	.IE10 .site #subNavigation li a{ display:inline-block;} /* IE10 */

	.IE9 .site #subNavigation li a:hover img{ display:inline-block;}	
	.IE9 .site #subNavigation li a{ display:inline-block;} /* IE9 */

	/* 個別指定 */
	.site #subNavigation li.company {	background-image:url(../images/common/header/navigation/company-over.gif)}
	.site #subNavigation li.service {	background-image:url(../images/common/header/navigation/service-over.gif)}
	.site #subNavigation li.faq {	background-image:url(../images/common/header/navigation/faq-over.gif)}
	
	/* オン */
	.company .site #subNavigation li.company img,
	.service .site #subNavigation li.service img,
	.accept .site #subNavigation li.faq img{ visibility:hidden;}

	/* --------------------------------
	   □ トップグローバルメニュー
	-------------------------------- */
	
	.site #globalNavigation{
		position:absolute;
		top:128px;
		left:0px;
	}
	
	.site #globalNavigation li{
		display:inline;
		float:left;
		width:244px;	
		height:70px;
		border-left:1px solid #e6e6e6;
		background:0 0 no-repeat;
		cursor:pointer;
	}
	
	.site #globalNavigation > li{
		width:243px;
	}
	
	.site #globalNavigation li a{
		width:100%;
		height:100%;
		background:0 0 no-repeat;
	}
		
	/* ロールオーバー */
	html .site #globalNavigation li a:hover{ visibility:inherit;}
	html .site #globalNavigation li a:hover img{ visibility:hidden; display:inline-block;}
	html:not(:target) .site #globalNavigation li a:hover img{ display:block;}
	@media all and (-ms-high-contrast:none){
	  *::-ms-backdrop, .site #globalNavigation li a:hover{ display:inline-block;} /* IE11 */
	}

	.IE10 .site #globalNavigation li a:hover img{ display:inline-block;}	
	.IE10 .site #globalNavigation li a{ display:inline-block;} /* IE10 */

	.IE9 .site #globalNavigation li a:hover img{ display:inline-block;}	
	.IE9 .site #globalNavigation li a{ display:inline-block;} /* IE9 */

	/* 個別指定 */
	.site #globalNavigation li.train {	background-image:url(../images/common/header/navigation/global/train-over.jpg)}
	.site #globalNavigation li.event_train {	background-image:url(../images/common/header/navigation/global/event_train-over.jpg)}
	.site #globalNavigation li.ticket {	background-image:url(../images/common/header/navigation/global/ticket-over.jpg)}
	.site #globalNavigation li.reservation {
		width:244px;
		border-right:1px solid #e6e6e6;
		background-image:url(../images/common/header/navigation/global/reservation-over.jpg)
	}
	
	/* オン */
	.train .site #globalNavigation li.train img,
	.event_train .site #globalNavigation li.event_train img,
	.ticket .site #globalNavigation li.ticket img,
	.reservation .site #globalNavigation li.reservation img,
	.site #globalNavigation li a.selected img{ visibility:hidden;}

/* --------------------------------
   □ メガバナー
-------------------------------- */
/*
	#navi-overlay{
		position:fixed;
		top:0;
		left:0;
		background:#000;
		filter: alpha(opacity=50);
		-moz-opacity:0.50;
		opacity:0.50;
		width:100%;
		height:100%;
		min-height:100%;
		min-width:100%;
		z-index:1;
	}
*/
	/* 開け閉め ------------------------ */
	.site .naviArea{
		position:absolute;
		top:198px;
		left:0;
		width:100%;
		z-index:101;
		background:#0099cb;
		font-size:93%;
	}

	.site .naviArea .chapter{
		display:none;
		width:980px;
		margin:0 auto;
		text-align:left;
		padding:14px 0 20px 0px;
	}
	
	.site .naviArea .chapter a{
		color:#edf8fb;
	}	

	.site .naviArea .chapter .close{
		margin-bottom:18px;
	}	
		
	/* □ #train-navi
	-------------------------------- */	
	#train-navi .section{

	}

		#train-navi .section dl{
			display:inline;
			float:left;
		}

		#train-navi .section dl dt{
			position:relative;
			top:0.7em;
			color:#f9fdfe;
			margin-bottom:8px;
			text-align:center;
			border-top:2px solid #66c2e0;
			font-size:124%;
		}

		#train-navi .section dl dt em{
			position:relative;
			top:-0.7em;
			display:inline-block;
			background:#0099cb;
			padding:0 7px;
		}
		
		#train-navi .section dl ul{
			overflow:hidden;
		}

		#train-navi .section p.single,
		#train-navi .section dl ul li{
			text-align:center;
			font-size:118%;
			line-height:1.2;
		}

		#train-navi .section p.single img,		
		#train-navi .section dl ul li img{
			margin-bottom:9px;
		}

		#train-navi .section dl ul li{
			display:inline;
			float:left;
		}

		/* .stationTop ------------------------ */
		#train-navi .section p.stationTop{
			display:inline;
			float:left;
			width:186px;
			margin:0 16px 0 16px;
		}		

		/* .mainMenu ------------------------ */

		#train-navi .mainMenu dl{
			display:inline;
			float:left;
			width:350px;
			margin-left:25px;
		}
		
			#train-navi .mainMenu dl dd ul{
				margin-left:-42px;
			}
	
			#train-navi .mainMenu dl dd ul li{
				width:130px;
				margin:0 0 0 57px;
			}
	
			#train-navi .mainMenu dl dd ul li.warp{

			}

		/* .subMenu ------------------------ */

		#train-navi .subMenu{
			margin-top:19px;
			margin-left:-60px;
		}
		#train-navi .subMenu dl{
			display:inline;
			float:left;
			width:278px;
			margin-left:60px;
		}

			#train-navi .subMenu dl dd ul{
				margin-left:-5px;
			}
	
			#train-navi .subMenu dl dd ul li{
				width:133px;
				margin:0 0 0 6px;
				
			}

			#train-navi .subMenu dl dd ul li.barrierfree{

			}
		

		/* .price_trainset ------------------------ */
		#train-navi .section dl.price_trainset{
			display:inline;
			float:right;
			width:242px;
		}
		
		#train-navi .section dl.price_trainset dd{
			padding-top:14px;
		}

		#train-navi .section dl.price_trainset ul{
			margin-left:-16px;
			font-size:92%;
		}
		#train-navi .section dl.price_trainset ul li{
			width:73px;
			margin-left:13px;
		}


		/* .ticket ------------------------ */
		#train-navi .section dl.ticket ul{
			font-size:92%;
			margin-left:2px;
		}
		#train-navi .section dl.ticket ul li{
			width:127px;
			margin-left:5px;
			padding-bottom:12px;
		}
		#train-navi .section dl.ticket ul li span{
			font-size:92%;
		}
	
	/* □ #event_train-navi
	-------------------------------- */
	#event_train-navi{
		padding-bottom:13px;
	}

	#event_train-navi .section{
		display:inline;
		float:left;
	}
	
	#event_train-navi .column1{
		width:310px;
		margin-left:35px;
	}
	#event_train-navi .column2{
		float:right;
		width:570px;
		margin-right:35px;
	}	

	#event_train-navi .section dl dt{
		position:relative;

		text-align:center;
		border-top:2px solid #66c2e0;
		font-size:124%;
		color:#f9fdfe;
	}

	#event_train-navi .section dl dt em{
		position:relative;
		top:-0.7em;
		display:inline-block;
		background:#0099cb;
		padding:0 7px;
	}

	#event_train-navi .section dl ul{
		overflow:hidden;
	}

	#event_train-navi .section dl ul li{
		display:inline;
		float:left;
		text-align:center;
	}

		/* .event_train ------------------------ */
		#event_train-navi ul.event_train{
			margin-left:-18px;
		}

		#event_train-navi ul.event_train li{
			margin-left:18px;
			display:inline;
			float:left;
		}

		#event_train-navi ul.event_train li.listmenuStyle{
			position:relative;
			width:146px;
			height:70px;
			margin-top:20px;
		}

		#event_train-navi ul.event_train li.listmenuStyle a{
			display: block;
			padding:5px 4px;
			height:60px;
			
			vertical-align: middle;
			color:#333;
			background:#fff url(../images/common/icon/arrow/blue.png) 95% 50% no-repeat;
		}

		#event_train-navi ul.event_train li.listmenuStyle a span{
			display: table-cell;
			vertical-align: middle;
			width:136px;
			height:60px;
			border-left:2px solid #4cb7db;
			padding-left:7px;
		}
		
		#event_train-navi ul.event_train li.listmenuStyle a:hover{
			text-decoration:none;
			background-color:#CCEBF5;
		}


		/* .tourism ------------------------ */
		#event_train-navi .section dl.tourism{
			margin-bottom:20px;
		}
	
		#event_train-navi .section dl.tourism dt{
			margin-top:0;
		}

		#event_train-navi .section dl.tourism ul{
			margin-left:-30px;
		}
		#event_train-navi .section dl.tourism ul li{
			margin-left:30px;
		}

		/* .recommend ------------------------ */
		#event_train-navi .section dl.recommend ul{
			margin-left:-30px;
		}
		#event_train-navi .section dl.recommend ul li{
			width:120px;
			margin-left:30px;
		}
		
		#event_train-navi .section dl.recommend ul li img{
			width:100%;
		}


	/* □ #ticket-navi
	-------------------------------- */
	#ticket-navi{
		padding-bottom:0;
	}

	#ticket-navi ul.items{
		overflow:hidden;
		margin-left:-10px;
	}
	
	#ticket-navi ul.items li{
		display:inline;
		float:left;
		text-align:center;
		margin-left:30px;
		padding-bottom:20px;
	}

/* --------------------------------
   □ ページコンテンツ
-------------------------------- */
div.contents{
	height:auto;	
}

/* --------------------------------
   □ サイト情報(フッター)
-------------------------------- */
div.publication{
	padding-top:40px;
	clear:both;
}

div.publication p.pagetop{
	text-align:center;
	margin:0 0 30px 0;
}

div.publication #relation-box{
	background:#4cb7db;
	padding:38px 0;
}

div.publication #footer-service-box{
	background:#4cb7db;
}

div.publication #footer-service-box dt{
	margin-bottom:20px;
}

	div.publication #footer-service-box ul.list{
		margin-left:-20px;
	}

	div.publication #footer-service-box ul.list li{
		display:inline;
		float:left;
		position:relative;
		width:230px;
		height:74px;
		margin:0 0 0 20px;
		background:#fff;
		box-shadow: 0 0 5px #41afd3;
	}

	div.publication #footer-service-box ul.list li a{
		display: block;
		height:74px;
		
    	vertical-align: middle;
		color:#333;
		background:#fff url(../images/common/icon/arrow/blue.png) 95% 50% no-repeat;
	}
	
	div.publication #footer-service-box ul.list li a span{
		display: table-cell;
    	vertical-align: middle;
		height:74px;
		padding-left:71px;
		
		background:5px 50% no-repeat;
	}
		div.publication #footer-service-box ul.list li a:hover{
		color:#666;
		text-decoration:none;
		background-color:#ccebf5;
	}

	div.publication #footer-service-box ul.list li.tourism a span{
		background-image:url(../images/common/footer/bnr/service/tourism.png);
	}	
	div.publication #footer-service-box ul.list li.routine a span{
		background-image:url(../images/common/footer/bnr/service/routine.png);
	}
	div.publication #footer-service-box ul.list li.fare a span{
		background-image:url(../images/common/footer/bnr/service/fare.png);
	}
	div.publication #footer-service-box ul.list li.icoca a span{
		background-image:url(../images/common/footer/bnr/service/icoca.png);
	}


div.publication #footer-recommend-box{
	margin-top:35px;
}

div.publication #footer-recommend-box dt{
	margin-bottom:20px;
}


	div.publication #footer-recommend-box ul.list{
		margin-left:-20px;
	}

	div.publication #footer-recommend-box ul.list li{
		display:inline;
		float:left;
		position:relative;
		width:230px;
		margin:0 0 0 20px;
		background:#def1fa;
		box-shadow: 2px 2px 8px #55c5e4;
		border-radius:6px;
	}

	div.publication #footer-recommend-box ul.list li dl dt{
		padding:16px 0 0 0;
		text-align:center;
	}

	div.publication #footer-recommend-box ul.list li dl dd{
		margin-bottom:20px;
		text-align:center;
	}	


div.publication #siteInformation-box{
	background:#000;
}
	
	div.publication #siteInformation-box ul.navigation{
		padding:20px 0 14px 0;
	}
	
	
	div.publication #siteInformation-box ul.navigation li{
		display:inline;
		line-height:1;
		padding:0 10px 0 6px;
		border-right:1px solid #257c9a;
	}
	
	div.publication #siteInformation-box ul.navigation li:first-child{
		border-left:1px solid #257c9a;
		padding-left:10px;
	}
	
	div.publication #siteInformation-box ul.navigation li a{
		color:#fff;
	}
	div.publication #siteInformation-box ul.navigation li a:hover{
		color:#ccc;
	}

	div.publication #siteInformation-box p.copyright{
		color:#fff;
		text-align:center;
		margin:0;
		padding:0 0 16px 0;
	}



div.contents .sub ul.listmenuStyle li a span {
	font-size:108%;
}