@charset "UTF-8";
/**
 * 列車走行位置の共通のスタイルの定義
 */

/* メンテナンスページのタイトル */
.maintenance-title {
	background-repeat: no-repeat;
	background-position: left 0px top 16px;
	background-image: url("../../webunkou/images/home/02.svg");
	padding-left: 40px;
	line-height: 2.1em;
	background-size: 35px auto;
	padding-top: 6px;
}

@media (max-width:575px) {
	/* メンテナンスページのタイトル */
	.maintenance-title {
		background-position: left 0px top 20px;
	}
}

/* お知らせダイアログ（開始） */
section#oshiraseDetail {
	display: none;
	height: 100%;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 20000;
}
	/* オーバーレイ領域内のお知らせダイアログ要素を中央寄せするための外枠領域 */
	section#oshiraseDetail .dialog-outer {
		align-items: center;
		display: flex;
		justify-content: center;
		height: 100%;
		width: 100%;
	}
	/* お知らせダイアログ領域 */
	section#oshiraseDetail .dialog {
		background-color: #fff;
		width: 502px;
	}

		/* お知らせダイアログのヘッダー */
		section#oshiraseDetail .dialog .header {
			background-color: #5b3;
			border-width: 0px;
			color: #fff;
		}
			/* お知らせダイアログのヘッダーの｢×｣ボタン */
			section#oshiraseDetail .dialog .header .close {
				line-height: 10px;
				position: absolute;
				right: 0;
				width: 32px;
				top: 0px;
				padding: 7px 6px;
			}
				/* お知らせダイアログのヘッダーの｢×｣ボタン にマウスカーソルを重ねたとき */
				section#oshiraseDetail .dialog .header .close:hover {
					background-color: #6c4;
					cursor: pointer;
				}

		/* お知らせダイアログのメイン情報 */
		section#oshiraseDetail .dialog #oshiraseDetailMain {
			padding: 10px;
			max-height: 60vh;
		}

			section#oshiraseDetail .dialog #oshiraseDetailMain .text {
				margin: 20px 0;
				text-align: center;
			}
		/* お知らせダイアログの閉じるボタン */
		section#oshiraseDetail .dialog .dialog-btn-contents{
			display: flex;
			justify-content: center;
		}

			section#oshiraseDetail .dialog .dialog-btn-contents .common-button.close{
				background-color: #5b3;
				color: #fff;
				cursor: pointer;
				min-height: 34px;
				width: 160px;
			}

			section#oshiraseDetail .dialog .dialog-btn-contents .common-button.close:hover {
				background-color: #6c4;
			}
/* お知らせダイアログ（終了） */

/* ローディングアニメーション（開始） */
#loaderBg {
	width: 100vw;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	background-color: rgba(0, 0, 0, 0.5);
	display: none;
	justify-content: center;
	align-items: center;
}

.loader {
	color: rgb(255, 255, 255);
	font-size: 20px;
	margin: 100px auto;
	width: 1em;
	height: 1em;
	border-radius: 50%;
	position: relative;
	text-indent: -9999em;
	-webkit-animation: load4 1.3s infinite linear;
	animation: load4 1.3s infinite linear;
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	transform: translateZ(0);
}
@-webkit-keyframes load4 {
	0%,
	100% {
		box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
	}
	12.5% {
		box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
	}
	25% {
		box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
	}
	37.5% {
		box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
	}
	50% {
		box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
	}
	62.5% {
		box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
	}
	75% {
		box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
	}
	87.5% {
		box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
	}
}
@keyframes load4 {
	0%,
	100% {
		box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
	}
	12.5% {
		box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
	}
	25% {
		box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
	}
	37.5% {
		box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
	}
	50% {
		box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
	}
	62.5% {
		box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
	}
	75% {
		box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
	}
	87.5% {
		box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
	}
}
/* ローディングアニメーション（終了） */

