@charset "utf-8";

.station{
	padding: 15px 0;
	margin:0 0 15px 0;
	background-color:#ffffff;
}

/*****************************************************************************/
/* タイトル                                                                  */
/*****************************************************************************/

.station_title{
	width:auto;
}

.station_title .agency_icon{
	height:28px;
	margin-right:10px;
	vertical-align:middle;
}

/*****************************************************************************/
/* 左パネル                                                                  */
/*****************************************************************************/

.station .left_panel{
	float:left;
	width: 260px;
	overflow: hidden;
	margin:0 0 10px 15px;
	margin:0 0 15px 15px;
}

/* ------------------------------------------------------------------------- */
/* 構内図階層選択                                                            */
/* ------------------------------------------------------------------------- */

.station .map_select{
	width:260px;
	height:auto;
	background-color:#ffffff;
}

.station .map_select_title{
	width:232px;  /* 28px for left border & margin */
}

.station .map_select ul{
	list-style:none;
	padding: 10px 10px 5px 10px;
	margin: 0 1px;
	border-right:1px solid #cccccc;
	border-bottom:1px solid #cccccc;
	border-left:1px solid #cccccc;
}

.station .map_select ul li{
	margin-bottom:5px;
}

.station .map_select ul li a{
	display:block;
	padding:10px 15px;
	background-color:#c1c2ee;
	font-size:14px;
}

.station .map_select ul li a.selected{
	cursor:default;
	background-color:#b19edf;
}

.station .map_select ul li a.mouseover{
	cursor:pointer;
	background-color:#d9dafc;
}

/* ------------------------------------------------------------------------- */
/* 表示位置移動                                                              */
/* ------------------------------------------------------------------------- */

.station .move_point{
	width:260px;
	height:auto;
	background-color:#ffffff;
}

.station .move_point_title{
	width:232px;  /* 28px for left border & margin */
	margin-top:15px;
}

.station .move_point ul{
	list-style:none;
	padding: 5px;
	margin: 0 1px;
	border-right:1px solid #cccccc;
	border-bottom:1px solid #cccccc;
	border-left:1px solid #cccccc;
}

.station .move_point ul li{
	border-bottom:1px dashed #c7c7c7; 
}

.station .move_point ul li:last-child{
	border:none;
}

.station .move_point ul li a{
	display:block;
	padding:8px 15px;
	font-size:14px;
}

.station .move_point ul li a:hover{
	background-color:#E8E5FE;
}

/* ------------------------------------------------------------------------- */
/* 移動/バリアフリーアイコン凡例                                             */
/* ------------------------------------------------------------------------- */

.station .map_icon{
	margin:20px 1px;
	background-color:#ffffff;
	border:1px solid #cccccc;
}

.station .map_icon table{
	width:258px;
	border-collapse:collapse;
}

.station .map_icon table caption{
	font-size:12px;
	line-height:1.2em;
	background-color:#e8b9e7;
	margin-bottom: 4px;
	padding: 5px 15px;
}

.station .map_icon table tr td{
	padding:5px 0;
	font-size:12px;
	vertical-align:middle;
}
.station .map_icon table tr td.s_icon{
	padding:5px 1px 5px 6px;
	width:12%;
}

.station .map_icon table tr td.s_icon img{
	width:24px;
	height:24px;
	margin-right:2px;
}

/*****************************************************************************/
/* 構内図/地図表示                                                           */
/*****************************************************************************/

.station .map_view{
	float:right;
	width: 650px;
	height:600px;
	margin:0 15px 20px 0;
	overflow:hidden;
	background-color:#f8f7fe;
	border: 1px solid #cccccc;
}

.station .floor_map {
	width:100%;
	height:100%;
	position:relative;
	overflow:hidden;
}

.station .mapimage {
	position:relative;
	margin:auto;
}

.station .mapimage img{
	position:relative;
}

.station #ground_map{
	width: 100%;
	height: 100%;
}

.station .map_control{
	position:relative;
	height: 40px;
}

.station .zoom_control{
	position:absolute;
	top:5px;
	left:5px;	
}

.station .zoom_control img{
	width:32px;
	height:32px;
	margin:0 2px 0 0;
}

.station .barrierfree_control{
	position:absolute;
	top:15px;
	right:10px;
	font-size:13px;
}

.station .barrierfree_control input, .station .barrierfree_control label{
	cursor:pointer;
}

/* 現在位置マーク */

.point_mark {
	position:absolute;
	color:#ff0000;
	font-size:1.5em;
	z-index:100;
}

/* ------------------------------------------------------------------------- */
/* バリアフリー情報写真表示スライダ                                          */
/* ------------------------------------------------------------------------- */

#slider_area{
	text-align:center;
	margin-bottom:10px;
}

#slider{
	width:300px;
	height:300px;
	margin:0 auto;
}	

#slider ul, #slider li{
	margin:0;
	padding:0;
	list-style:none;
}

#slider li{ 
	overflow:hidden; 	
}

#slider li div{
	width:300px;
	height:240px;
	display:table-cell;
	text-align:center;
	vertical-align:middle;
	layout-grid-line:240px;
}

#slider li div img{
	width:300px;
	height:240px;
}

#prevBtn, #nextBtn{ 
	display:block;
	width:30px;
	height:77px;
	position:absolute;
	left:0px;
	top:120px;
}	

#nextBtn{ 
	left:370px;
}

#prevBtn a, #nextBtn a{  
	display:block;
	width:30px;
	height:77px;
	background:url(../../img/station/arrow_left.png) no-repeat 0 0;
}	

#nextBtn a{ 
	background:url(../../img/station/arrow_right.png) no-repeat 0 0;
}

#directionimg{
	text-align:center;
}

hr{
	display: block;
}

/*****************************************************************************/
/* アイコン凡例                                                              */
/*****************************************************************************/

.station .station_icon{
	clear:both;
	width:960px;
}

.station .station_icon table{
	width:960px;
	margin:0 auto;
	background-color:#ffffff;
}

.station .station_icon table caption{
	font-size:14px;
	font-weight:bold;
	background-color:#e8e5fe;
	line-height:2em;
	padding:5px 0;
	color:#4E41B3;
}

.station .station_icon table td {
	border: medium none;
	text-align: left;
	vertical-align:middle;
}
.station .station_icon table td.icon{
	width:4%;
	padding:5px 0 5px 12px;
}
.station .station_icon table td.icon img{
	width:24px;
	height:24px;
}

.station .station_icon table td.desc{
	width:16%;
	padding:5px 0 5px 2px;
	font-size:12px;
	vertical-align:middle;
}

.station .station_icon table td.s_small{
	font-size:10px;
}