/*
サイト案内表示装置用css
*/

.map_name{
	writing-mode: vertical-lr;
	color: white;
	height: 200px;
	padding: 0px 10px 10px 10px;
	font-size: 20px;
}

.staname_big{
	border-radius: 0% 0% 5% 5%;
	padding-top: 5px;
	width: 30px;
	height: 200px;
	font-weight: bold;
	text-decoration: none;
}

.staname_big:link, .staname_big:visited, .staname_small:link, .staname_small:visited{
	color:white;
}

.staname_big:visited{
	color:white;
}

.staname_small{
	border-radius: 0% 0% 5% 5%;
	padding-top: 10px;
	width: 30px;
	height: 200px;
	text-decoration: none;
	font-weight: normal;
}

.staname_nonUse{
	border-radius: 0px 0px 9px 9px;
	padding-top: 5px;
	width: 30px;
	height: 200px;
	background-color: gray;
	color: gray;
}

.goannai{
	#bottom: 80 auto;
	height: 30px;
	width: 100%;
	margin: 10px 10px 10px 10px;
	padding: 50px 0px 0px 30px;
	display: flex;
	align-items: flex-end;
	color: white;
	vertical-align: middle;
	font-size: 50px;
}

.map{
	width: 270px;
	margin: auto;
}

.bg_gray{
	width: 350px;
	background-color: gray;
	margin: auto;
	content-align: center;
}

.map_line{
	bottom: 80 auto;
	height: 30px;
	width: 330px;	/*路線図の幅：30x駅数(11)で設定*/
	border-radius: 10px 10px 10px 10px;
	margin: 10px 10px 0px 10px;
	background-color: royalblue;
	display: flex;
	align-items: flex-end;
	color: white;
	vertical-align: middle;
}

.map_line_NO{
	bottom: 80 auto;
	height: 30px;
	width: 330px;
	border-radius: 10px 10px 10px 10px;
	margin: 10px 10px 0px 10px;
	background-color: royalblue;
	display: flex;
	align-items: flex-end;
	color: white;
	vertical-align: middle;
}

.bigSta{
	border-radius: 50%;
	width: 14px;
	height: 14px;
	border-color: white;
	margin: 3px;
	border-width: 5px;
	border-style: solid;
}

.smallSta{
	border-radius: 50%;
	width: 14px;
	height: 14px;
	border-color: white;
	margin: 8px;
}

.nullSta{
	width: 30px;
	height: 30px;
	background-color: royalblue;
}

.pass{
	background-color: black;
}

.passed{
	background-color: crimson;
}

.stop{
	background-color: lime;
}

.now{
	animation: Stopping 1.1s linear infinite;
	background-color: black;
}

.sta_nonUse{
	border-radius: 9px 9px 0px 0px;
	width: 30px;
	height: 30px;
	background-color: darkslateblue;
}

@keyframes Stopping{
	30%,70%{background: lime}
	0%,20%,80%,100%{background: black}
}


.LEDtext{
	background-color: black;
	color: orange;
	border: solid 10px;
	border-radius: 15px;
	border-color: #303030;
	padding-top: 10px;
	padding-bottom: 5px;
	width: 1000px;
	font-size: 30px;
	text-align: left;
	overflow: hidden;
	margin: auto;
}

.LEDtext p{
	margin: 0;
	display: inline-block;
	padding-left: 100%;
	white-space: nowrap;
	animation: scroll 20s linear infinite;
}

@keyframes scroll{
	0%{transform: translateX(0)}
	100%{transform: translateX(-100%)}
}
