/* ======= busforecast.css ======= */

/* ----- デバッグ用 ----- */
.pax-debug {
	font-size: 10px;
	color: #AAAAAA;
	/*visibility: hidden;*/
	display: none;
}

/* ----- 共通 -------------------------------------------------------------- */
html {
    font-size: 62.5%;
}

/* Google Map で使用されているfontスタイルをUDPGothicフォントで上書きする */
.gm-style {
    font: 400 11px 'BIZ UDPGothic', Roboto, Arial, sans-serif;
    line-height: 1.5;
}
/* Google Map をクリックした時に表示される青い罫線を非表示する */
.gm-style iframe + div {
    border: none !important;
}
/* Google Map のマップタイプを切り替えるボタンの位置を調整 */
.gm-style .gm-style-mtc {
    width: 110px !important;
}
.gm-style .gm-style-mtc button {
    padding: 6px 18px !important;
}
.gm-style .gm-style-mtc ul {
    top: unset !important;
    bottom: 50px !important;
}
.gm-style button.gm-fullscreen-control {
    top: 54px !important;
}

body {
    font-family: 'BIZ UDPGothic', 'Helvetica Neue', Helvetica,Arial, sans-serif;
    font-size: 20px;
    font-size: 2.0rem;
    /* overflow: hidden; */
    overflow-x: hidden;
    background: #52a4db none;
}

body::before {
	display: block;
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	z-index: -1;
}

/* トップページ背景画像 */
body.pane-top {
	background: #52a4db url('../handlers/image.ashx?img=bg_top.png&v=202002170001') repeat-y fixed 0 0;
	background-size: 100% auto;
}

/* コンテンツ領域 */
.view {
    position: absolute;
    top: 60px;
    left: 0;
    padding: 0 12px 0px 12px;
    width: 100%;
    height: calc(100% - 60px);
    display: flex;
    flex-flow: column;
}

/* ロゴ用 */
.logo {
    width: 100%;
    position: relative;
}

.logo p {
    font-weight: bold;
    font-size: 16px;
    color: #fff;
    width: 100%;
    text-align: center;
    position: absolute;
    z-index: 1;
    top: 17%;
    padding: 0 1em;
    left: -1000px;
    transform: translate(-50%, 0%);
    text-shadow: 1px 1px 0 #27a7fc,
                 -1px 1px 0 #27a7fc,
                 1px -1px 0 #27a7fc,
                 -1px -1px 0 #27a7fc;
}

.logo p.fit-circle-type {
    left: 50%;
}

.logo.small {
    width: 120px;
}

.logo.small p {
    padding: 0;
    font-weight: normal;
}

.logo.small p.fit-circle-type {
    transform: translate(-50%, 0%) scale(0.45);
    transform-origin: top;
}

.logo .img {
    z-index: 0;
}

/* リンク */
a,
button {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    color: #203981;
}

a:focus, 
a:hover,
a:active {
    text-decoration: none;
}

/* アニメーション */
@keyframes horizontal {
	0% {
		transform: translateX( -3px);
	}

	100% {
		transform: translateX( 0px);
	}
}


/* ----- ページスライド ----- */
.slideLeft.ng-enter,
.slideLeft.ng-leave,
.slideRight.ng-enter,
.slideRight.ng-leave {
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}

.slideLeft.ng-enter {
	left: 100%;
}

.slideLeft.ng-enter.ng-enter-active {
	left: 0;
}

.slideLeft.ng-leave.ng-leave-active {
	left: -100%;
}

.slideRight.ng-enter {
	left: -100%;
}

.slideRight.ng-enter.ng-enter-active {
	left: 0;
}

.slideRight.ng-leave.ng-leave-active {
	left: 100%;
}

/* ----- アイコン ([directive] icon-content で使用するクラス)----- */
.pax-icon-outer {
    display: inline-block;
    width: 36px;
    height: 36px;
}

.pax-icon-content-image {
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%;
}

.pax-icon-content-svg {
    display: inline-block;
    background-color: #863500;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    mask-position: center center;
    -webkit-mask-size: 46px;
    mask-size: 46px;
    width: 100%;
    height: 100%;
}

.pax-icon-content-font {
    vertical-align: middle;
}

.menu-sidebar-item .pax-icon-content-font {
    font-size: x-large;
    vertical-align: -webkit-baseline-middle;
    vertical-align: -moz-middle-with-baseline;
}

/* ----- キャラクターイメージ切り替え ----- */
img.character-image {
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: bottom;
    background-size: contain;
    background-color: transparent;
}
.character-container {
    position: relative;
    width: 100%;
}
.character-container::before {
    content: "";
    display: block;
    padding-top: 100%;
}
.character-container .character-image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
/* 小さいキャラクターアイコン */
.character-container.character-small::before {
    padding-top: calc(100% * 9 / 13); /* 画像のアスペクト比 */
}
.character-container.character-small .character-image {
    background-image: url('../handlers/image.ashx?img=mascot1_small.png');
}
/* 吹き出しキャラクターアイコン */
.character-container.character-balloon::before {
    padding-top: calc(100% * 56 / 207); /* 画像のアスペクト比 */
}
.character-container.character-balloon .character-image {
    background-image: url('../handlers/image.ashx?img=mascot1_balloon.png');
}
/* 高いキャラクターアイコン */
.character-container.character-tall .character-image {
    background-image: url('../handlers/image.ashx?img=mascot1_tall.png');
}
/* バスキャラクターアイコン */
.character-container.character-bus .character-image {
    background-image: url(../handlers/image.ashx?img=ico_bus.png);
}
/* 検索キャラクターアイコン */
.character-container.character-search::before {
    padding-top: calc(100% * 268/387); /* 画像のアスペクト比 */
}

/* ----- 事業者ヘッダ ----- */
.pax-main-header {
    position: fixed;
    z-index: 1000;
    top: 0;
    width: 100%;
    height: 60px;
    background: #52a4db none;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
}
.pax-main-header-left {
    flex-basis: 40%;
    text-align: left;
    font-size: 0;
    padding-left: 10px;
    white-space: nowrap;
}
.pax-main-header-center {
    flex-basis: auto;
    text-align: center;
    font-size: 0;
    min-width:0;
    white-space: nowrap;
}
.pax-main-header-right {
    flex-basis: 40%;
    text-align: right;
    font-size: 0;
    padding-right: 10px;
    white-space: nowrap;
}

/* トップページ - ヘッダ用背景画像 */
body.pane-top .pax-main-header {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 60px;
    z-index: 999;
    background: #52a4db url('../handlers/image.ashx?img=bg_top.png&v=202002170001') repeat-y scroll 0 0;
    background-size: 100% auto;
}

/* トップページ - ロゴ */
.main-heade-logo {
    position: relative;
    color: transparent;
    height: 100%;
    width: auto;
    text-align: center;
}

.main-heade-logo .logo {
    display: inline-block;
}

.main-heade-logo-img {
    display: block;
    width: 100px;
    height: 52px;
    background: transparent url('../handlers/image.ashx?img=busyohou_logo.svg&v=202002170001') no-repeat scroll center top;
    background-size: contain;
    margin: 0 auto;
}

body.pane-top .main-heade-logo {
    left: -1000px;
}

/* ----- メインヘッダ (ご意見、メニュー) ----- */
.main-header-button {
    width: auto;
    height: 46px;
    padding: 0;
    overflow: hidden;
    border: none;
    border-radius: 4px;
    background: transparent no-repeat scroll 0 0;
    background-size: auto 44px;
    font-size: 11px;
    font-size: 1.1rem;
    font-weight: bold;
}

/* メインヘッダボタンがアクティブ時、フォーカス時*/
.main-header-button:focus,
.main-header-button:hover,
.main-header-button:active,
.main-header-button:active.focus,
.main-header-button:active:focus,
.main-header-button:active:hover {
    background-color: transparent;
    border-color: transparent;
    outline: none;
    box-shadow: none;
}

/* メインヘッダボタンのアイコン */
.main-header-button .pax-main-header-icon {
    display: block;
    height: 33px;
    width: 46px;
    margin: 0 auto;
}

/* ヘッダの画像(png)アイコンのスタイル */
.main-header-button .header-icon-img {
    background: no-repeat scroll center 0px;
    background-size: 48px 48px;
}

/* ヘッダのSVGアイコンの色を指定 */
.main-header-button .header-icon-svg {
    background: #ffffff;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    mask-position: center center;
}

/* ヘルプボタン */
#help_for_header_button .header-icon-img {
    background-image: url('../images/ico_header_help.png');
}
/* ご意見ボタン */
#feedback_for_header_button .header-icon-img {
    background-image: url('../images/ico_header_mail.png');
}
/* 戻るボタン */
#back_for_header_button .header-icon-svg {
    -webkit-mask-image: url('../images/ico_back_arrow.svg');
    mask-image: url('../images/ico_back_arrow.svg');
    -webkit-mask-size: 46px;
    mask-size: 46px;
    -webkit-mask-position-y: -6px;
    mask-position-y: -6px;
}
/* 更新ボタン */
.header-icon-svg-wrapper {
    width: 46px;
    height: 33px;
    position: relative;
}
#load_for_header_button .header-icon-svg {
    -webkit-mask-image: url('../images/arrow_rotate.svg');
    mask-image: url('../images/arrow_rotate.svg');
    -webkit-mask-size: 46px;
    mask-size: 46px;
    -webkit-mask-position-y: -6px;
    mask-position-y: -6px;
    position: relative;
}
.pax-small-loader {
    display: block;
    border-radius: 50%;
    width: 26px;
    height: 26px;
    background-color: transparent;
    border-top: 0.3em solid rgba(255, 255, 255, 0.1);
    border-right: 0.3em solid rgba(255, 255, 255, 0.1);
    border-bottom: 0.3em solid rgba(255, 255, 255);
    border-left: 0.3em solid rgba(255, 255, 255);
    -webkit-animation: load8 1.1s infinite linear;
    animation: rotation 1.1s infinite linear;
    position: absolute;
    top: 10%;
    left: 25%;
}
.header-icon-svg-wrapper .header-icon-svg.ng-hide-remove,
.header-icon-svg-wrapper .pax-small-loader.ng-hide-remove {
    transition: all linear 0.5s;
}
.header-icon-svg-wrapper .header-icon-svg.ng-hide-remove.ng-hide-remove-active,
.header-icon-svg-wrapper .pax-small-loader.ng-hide-remove {
    opacity: 1;
}
.header-icon-svg-wrapper .header-icon-svg.ng-hide-remove,
.header-icon-svg-wrapper .pax-small-loader.ng-hide-remove.ng-hide-remove-active {
    opacity: 0;
}
@-webkit-keyframes rotation {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes rotation {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
/* ホームボタン */
#top_for_header_button .header-icon-svg {
    -webkit-mask-image: url('../images/ico_bus_top.svg');
    mask-image: url('../images/ico_bus_top.svg');
    -webkit-mask-size: 36px;
    mask-size: 36px;
}
/* メニューボタン(言語アイコン有り) */
#menu_for_header_button .header-icon-img {
    background-image: url('../images/ico_header_menu_lang.png');
}
/* メニューボタン(言語アイコン無し) */
.no-language#menu_for_header_button img {
    background-image: url('../images/ico_header_menu.png');
}

/* 言語切り替えセレクトボックス */
.lang-select {
    border-radius: 6px;
    border: none;
    background-color: #3a7fd8;
    padding: 5px;
    color: #fff;
    font-size: 11px;
    margin-bottom: 0;
}

.lang-select .icon-chevron-down:after{
    font-family: 'Font Awesome 5 Free','Font Awesome 5 Brands';
    content: "\f078";
    margin-left: 10px;
    speak: none;
}

.select_box {
    width: fit-content;
    font-weight: bold;
    font-size: 11px;
    border-radius: 9px;
    padding: 0;
    position: fixed;
    background: white;
}

.select_box li {
    color: #5f97df;
    padding: 0 5px;
    margin: 6px 0;
}

.select_box li label{
    margin: 5px 0;
}

.select_box .is-select{
    background-color: #d4eeff;
}

.select_box .is-select:after {
    font-family: 'Font Awesome 5 Free','Font Awesome 5 Brands';
    content: "\f00c";
    margin-left: 6px;
}

/* ----- ハンバーガーメニュー ----- */
.menu-sidebar-close-button {
    position: absolute;
    top: 50%;
    right: 12px;
    cursor: pointer;
    height: 36px;
    width: 36px;
    box-sizing: content-box;
    transform: translateY(-50%);
}

.menu-sidebar-close-button::after, .menu-sidebar-close-button::before {
    content: "";
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 24px;
    height: 3px;
    background-color: #203981;
}

.menu-sidebar-close-button:hover::after , .menu-sidebar-close-button:hover::before{
    background-color: #9ed800;
}

.menu-sidebar-close-button::before {
    transform: translate(-50%,-50%) rotate(45deg);
}

.menu-sidebar-close-button::after {
    transform: translate(-50%,-50%) rotate(-45deg);
}

/* メニューパネル */
.menu-sidebar {
    display: block;
    position: fixed;
    top: 0;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    box-sizing: border-box;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.5);
}

.menu-sidebar.ng-hide-add,
.menu-sidebar.ng-hide-remove {
    -webkit-transition: 0.5s ease all;
    transition: .5s ease all;
    display: block !important;
}

.menu-sidebar.ng-hide {
    left: -100%;
}

.menu-sidebar-header {
    position: relative;
    height: 44px;
}
.menu-sidebar-header-content {
    height: 100%
}

.menu-sidebar-footer {
    position: relative;
    height: 44px;
}
.menu-sidebar-footer-content {
    height: 100%;
}


#menu_title {
    display: none;
    padding: 0 12px;
    line-height: 44px;
}

.menu-sidebar-navi {
    height: calc(100% - 44px - 44px);
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    flex-basis: auto;
    flex-grow: 2;
}
.menu-sidebar-navi-content {
    margin: 0 12px;
}
.menu-sidebar-item input {
    display: none;
}

.menu-sidebar-navi label {
    max-width: inherit;
    margin-bottom: inherit;
    font-weight: inherit;
}

.menu-sidebar-navi ul {
    padding: 0;
    position: relative;
}

.menu-sidebar-navi ul ul {
    margin: 0px 0px 32px 0px;
    display: none;
}

.menu-sidebar-item .menu-sidebar-node:checked ~ ul {
    display: block;
}

.menu-sidebar-item {
	margin: 0;
	padding: 0px;
	font-size: 18px;
	list-style-type: none;
	cursor: pointer;
	position: relative;
}

.menu-sidebar-item a,
.menu-sidebar-item label {
	display: block;
	padding: 12px 0 12px 48px;
    position: relative;
}

.menu-sidebar-item a:hover,
.menu-sidebar-item label:hover {
	color: #9ed800;
}

.menu-sidebar-navi .menu-sidebar-node-label::after {
	position: relative;
	display: inline-block;
	content: "";
	background: transparent url('../images/tri_navy_down.png') no-repeat scroll 0px 0px;
	background-size: 12px auto;
	top: 0px;
	left: 16px;
	width: 12px;
	height: 12px;
	vertical-align: middle;
	transform: rotate(-90deg);
}
.menu-sidebar-item .menu-sidebar-node:checked ~ label::after {
	transform: unset;
}

.menu-sidebar-item .pax-menu-icon {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
.menu-sidebar-item .pax-icon-outer {
    width: 40px;
    height: 40px;
    text-align: center;
}

.language-set.active::after {
    content: "";
    position: absolute;
    display: inline-block;
    top: 16px;
    right: 10px;
    -webkit-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    transform: rotate(50deg);
    width: 6px;
    height: 12px;
    border-right: 2px solid #203981;
    border-bottom: 2px solid #203981;
}

/* 既定のメニューパネル閉じるボタン
.menu-sidebar-overlay {
	background-color: #558;
	width: 100vw;
	height: 100vh;
	opacity: 0;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9998;
	display: none;
}
*/

/* ----- ページヘッダ ----- */
.pax-page-header {
    margin: 0 -12px;
    padding: 4px 0;
    width: 100%;
    background-color: #cce7f9;
    color: #203981;
    font-weight: bold;
    z-index: 999;
    top: 60px;
    width: auto;
}

.nocolor {
	background-color: transparent !important;
}

.pax-page-header p {
	position: relative;
	margin: 0 12px;
}

.pax-page-header a[role="button"] {
	position: absolute;
	display: inline-block;
	top: -2px;
	left: -4px;
}

.pax-page-header .ico-header {
	margin-top: 4px;
	width: 30px;
	color: #ff7f00;
	font-size: 24px;
	font-size: 2.4rem;
}

.pax-page-header a[role="button"] + span {
	display: inline-block;
}

/* ----- ページフッター ----- */
.pax-page-footer {
    z-index: 1000;
}

/* ----- 検索ボックス ----- */
input[type="search"] {
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
    width: 100%;
    padding: 12px 12px 12px 36px !important;
    border: 5px solid #cbcbcb;
    border-radius: 8px;
    box-shadow: 2px 2px 2px 0px rgba(128,128,128,.2) inset;
    outline: none;
}
.no-placeholder-image input[type="search"],
input[type="search"]:focus {
	border: 5px solid #203981;
}
.pax-toppage-search-panel input[type="search"]:focus {
    border: 3px solid #203981;
    border-bottom: 1px solid #203981;
    background: #fff none;
}
.pax-toppage-destination-search-panel input[type="search"]:focus {
    border: 3px solid #203981;
    border-top: 1px solid #203981;
    background: #fff none;
}
.search-character-icon {
    position: absolute;
    top: 0;
    right: 0;
    width: 75px;
}
input[type="search"]::placeholder {
	color: #999;
}

input[type="search"] + a[href="#clear"] {
	right: 12px !important;
}

/* バス停から時刻表を探す画面の調整 */
#searchword_by_ttable_page {
    padding-left: 10px !important;
}

input:-webkit-autofill,
input:-internal-autofill-selected {
	background: #fff none !important;
}

.ui-front {
	z-index: 1002;
}

/* 検索ボックスのローディング */
.pax-suggest-loading, 
.pax-suggest-loading-by-destination {
	position: absolute;
	right: 32px;
	top: 20px;
	display: none;
}

/* 検索ボックスのアイコン */
/*   [トップページ] 出発バス停、行先バス停 */
/*   [近くのバス停] 行先バス停 */
/*   [バス停を探す] 出発バス停、行先バス停 */
/*   [路線一覧]     バス停 */
.pax-toppage-search-label::before,
.pax-nearest-search-label::before,
.pax-busstop-search-label::before,
.pax-busline-search-label::before {
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 12px;
    width: 24px;
    height: 24px;
    z-index: 900;
}

/* 検索ボックスのアイコン */
/*   [トップページ] 出発バス停 */
/*   [バス停を探す] 出発バス停 */
.pax-toppage-search-panel .pax-toppage-search-label::before,
.pax-busstop-search-panel .pax-busstop-search-label::before {
    background: transparent url('../images/ico_search_busstop1.png') no-repeat scroll 0 0;
    background-size: 24px;
}

/* 検索ボックスのアイコン */
/*   [トップページ] 行先バス停 */
/*   [近くのバス停] 行先バス停 */
/*   [バス停を探す] 行先バス停 */
.pax-toppage-destination-search-panel .pax-toppage-search-label::before,
.pax-nearest-destination-search-panel .pax-nearest-search-label::before,
.pax-busstop-destination-search-panel .pax-busstop-search-label::before {
    background: transparent url('../images/ico_search_busstop2.png') no-repeat scroll 0 0;
    background-size: 24px;
}

/* 検索ボックスのアイコン */
/*   [路線一覧]     バス停 */
.pax-busline-search-panel .pax-busline-search-label::before {
	background: transparent url('../images/ico_gray_search.png') no-repeat scroll 0 0;
	background-size: 24px;
	opacity: 0.7;
}

/* 検索ボックス */
/*   [近くのバス停] 行先バス停 */
/*   [バス停を探す] 出発バス停 */
/*   [バス停を探す] 行先バス停 */
/*   [路線一覧]     バス停 */
.pax-nearest-destination-search-panel,
.pax-busstop-search-panel,
.pax-busstop-destination-search-panel,
.pax-busline-search-panel {
    position: relative;
    margin-top: 12px;
    width: 100%;
}

/* [バス停検索] 区間お気に入り */
.pax-busstop-section-favorite {
    text-align: center;
    margin-top: 12px;
}

/* [トップページ]検索パネル */
.pax-toppage-search-base-panel {
    position: relative;
    margin: 16px auto;
    display: block;
    background-color: #65C2FF;
    border: 5px solid #65C2FF;
    border-radius: 12px;
    padding: 5px;
}
.pax-toppage-search-busstop-wrapper,
.pax-busstop-search-busstop-wrapper {
    position: relative;
}
.pax-toppage-search-submit-wrapper {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    white-space: nowrap;
}

/* [トップページ]出発バス停検索ボックス */
/* [トップページ]到着バス停検索ボックス */
.pax-toppage-search-panel,
.pax-toppage-destination-search-panel {
    position: relative;
    width: 100%;
}
/* [トップページ]出発バス停検索ボックス */
.pax-toppage-search-panel.active {
    z-index: 1;
}
/* [トップページ]到着バス停検索ボックス */
.pax-toppage-destination-search-panel {
    top: -1px;
}

/* [トップページ]出発バス停検索ボックス */
.pax-toppage-search-panel input {
    border: none;
    border-radius: 5px;
    background-image: none;
    margin-bottom: 5px;
}
/* [トップページ]到着バス停検索ボックス */
.pax-toppage-destination-search-panel input {
    border: none;
    border-radius: 5px;
    background-image: none;
}
/* [トップページ] 出発・行先切替ボタン */
/* [バス停を探す] 出発・行先切替ボタン */
.pax-toppage-search-swich-panel,
.pax-busstop-search-swich-panel {
    position: absolute;
    z-index: 1;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
}

.pax-toppage-search-swich-label {
    display: block;
    width: 32px;
    height: 32px;
    background: transparent url('../images/ud_arrow.png') no-repeat scroll center center;
    background-size: contain;
}

/* [トップページ] 出発・到着日時ドロップダウンリスト */
.pax-toppage-search-time-panel {
    height: 77px;
    border-radius: 0px 0px 5px 5px;
}

.busstop-search-button,
.busstop-search-button span {
    color: #fff;
}

.busstop-search-button.active {
    background-color: #134bb6;
}

.pax-toppage-search-time-panel > div {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    display: -ms-flexbox; /* for IE10 */
    display: flex;
    -ms-flex-direction: row; /* for IE10 */
    flex-direction: row;
    -ms-flex-wrap: nowrap; /* for IE10 */
    flex-wrap: nowrap;
    -ms-flex-pack: justify; /* for IE10 */
    justify-content: center;
    -ms-flex-align: center; /* for IE10*/
    align-items: center;
}

.pax-toppage-search-submit-wrapper > div {
    border: 3px solid white;
    border-radius: 30px;
    padding: 0px 10px 0px 10px;
    margin-right: 5px;
}

.pax-toppage-search-select {
    position: relative;
    border: 1px solid #bbbbbb;
    background: #ffffff;
    height: 47px;
    display: inline-block;
}
.pax-toppage-search-select::before {
    position: absolute;
    top: 50%;
    right: 5px;
    width: 0;
    height: 0;
    padding: 0;
    content: '';
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #979797;
    pointer-events: none;
    transform: translateY(-50%);
}
.pax-toppage-search-time-panel select {
    width: 100%;
    height: 100%;
    padding: 4px 15px 4px 4px;
    cursor: pointer;
    text-indent: 4px;
    text-overflow: ellipsis;
    border: none;
    outline: none;
    background: transparent;
    background-image: none;
    box-shadow: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-size: 15px;
    font-size: 1.5rem;
}
.pax-toppage-search-time-panel select::-ms-expand {
    display: none;
}

/* [トップページ] 出発・到着・[年月]ドロップダウンリスト */
.pax-toppage-search-date-year-month {
    border-radius: 5px;
    flex-basis: calc(37% - 5px);
    order: 1;
}
/* [トップページ] 出発・到着・[日]ドロップダウンリスト */
.pax-toppage-search-date-year-day {
    border-radius: 5px;
    flex-basis: 21%;
    order: 2;
    left: 1px;
}
/* [トップページ] 出発・到着・日付と時刻ドロップダウンリスト間のギャップ */
.pax-toppage-search-select-gap {
    width: 5px;
    order: 3;
}
/* [トップページ] 出発・到着・[時]ドロップダウンリスト */
.pax-toppage-search-time-hour {
    border-radius: 5px;
    flex-basis: 21%;
    order: 4;
}
/* [トップページ] 出発・到着・[分]ドロップダウンリスト */
.pax-toppage-search-time-minute {
    border-radius: 5px;
    flex-basis: 21%;
    order: 5;
    left: 1px;
}
/* [トップページ] 出発・到着・[日]ドロップダウンリスト(英語) */
.pax-toppage-search-date-year-month:lang(en) {
    border-radius: 5px;
    flex-basis: calc(35% - 5px);
    order: 2;
}
/* [トップページ] 出発・到着・[年月]ドロップダウンリスト(英語) */
.pax-toppage-search-date-year-day:lang(en) {
    border-radius: 5px;
    left: 0px;
    flex-basis: 21%;
    order: 1;
}
/* [トップページ] 出発・到着・[時]ドロップダウンリスト(英語) */
.pax-toppage-search-time-hour:lang(en) {
    flex-basis: 20%;
}
/* [トップページ] 出発・到着・[分]ドロップダウンリスト(英語) */
.pax-toppage-search-time-minute:lang(en) {
    flex-basis: 24%;
}

.busstop-search-item {
    color: white;
}
/* [トップページ] 「しらべる」ボタン */
.pax-toppage-search-button {
    padding: 4px;
    background-color: #ff7f00;
    color: #fff;
    font-weight: bold;
    display: inline-block;
    text-align: center;
    border-radius: 8px;
    width: 100%;
    box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.25);
    font-size: 17px;
    font-size: 1.7rem;
    padding: 13px;
    margin-left: 10px;
    display: flex;
    place-content: center;
    align-items: center;
}
.pax-toppage-search-button:hover,
.pax-toppage-search-button:active {
    background-color: #134bb6;
    color: #fff;
}
.pax-toppage-search-button:active {
    box-shadow: none;
}
.pax-toppage-search-button.disabled {
    background-color: #cacaca;
    box-shadow: none;
}

.search-icon {
    margin-right: 5px;
}

/* iPhone 4/SE/5 対応 */
@media screen and (max-width:320px) {
    /* トップ画面の検索日時プルダウン */
    .pax-toppage-search-time-panel select {
        padding: 4px 15px 4px 0px;
        font-size: 14px;
        font-size: 1.4rem;
    }
    .pax-toppage-search-date-year-month {
        flex-basis: calc(40% - 5px)
    }
    .pax-toppage-search-date-year-day,
    .pax-toppage-search-time-hour,
    .pax-toppage-search-time-minute {
        flex-basis: 20%
    }
    .pax-route-tool .fas,
    .pax-route-tool .far {
        display: none;
    }
}
/* ----- トップページ ------------------------------------------------------ */

.title-logo .logo {
    left: 50%;
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}
img#trademark {
    display: block;
    width: 156px;
    height: 130px;
    background: transparent url('../handlers/image.ashx?img=busyohou_logo.svg&v=202002170001') no-repeat scroll center top;
    background-size: contain;
    margin: 0 auto;
}

/* ----- 事業者からのお知らせパネル ----- */
.pax-info-panel {
    margin: 24px 0 0 0;
    background-color: #FFF;
    border-radius: 8px;
    font-size: 18px;
    font-size: 1.8rem;
}

.pax-info-list {
    padding: 0 8px;
    margin: 0;
}

.pax-info-others-outer {
    padding: 10px;
}

.pax-info-others {
    background-color: #f6f8fc;
    border-radius: 10px;
    padding: 10px 8px;
    box-shadow: 1px 4px 4px 1px rgb(200, 200, 200, .5);
    display: flex;
    justify-content: center;
    align-items: center;
}
.pax-info-others:active {
    transform: translateY(4px);
    box-shadow: none;
}

.pax-info-number {
    font-weight: bold;
}

.pax-info-others::after {
    content: '';
    display: inline-block;
    width: 0.7em;
    height: 0.7em;
    border-top: #203981 3px solid;
    border-right: #203981 3px solid;
    transform: rotate(45deg) skew(6deg, 6deg);
    margin-left: 4px;
}

.pax-info-list li {
    position: relative;
    list-style-type: none;
}

.pax-info-list-item {
    padding: 14px 20px 14px 30px;
    margin: 0px 4px;
    position: relative;
}
.pax-info-list li:nth-child(n + 2) {
    border-top: 1px solid #e1e1e1;
}

.pax-info-icon::before {
    position: absolute;
    display: block;
    content: "";
    width: 20px;
    height: 20px;
    top: 50%;
    left: 0;
    border-radius: 10px;
    background: #203981 url('../images/tri_wh_exclamation.png') no-repeat scroll center center;
    background-size: 12px 12px;
    transform: translateY(-50%);
}
.pax-info-list li::after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    right: 4px;
    width: 0.7em;
    height: 0.7em;
    border-top: #b6b6b6 3px solid;
    border-right: #b6b6b6 3px solid;
    transform: translateY(-50%) rotate(45deg) skew(6deg, 6deg);
}
.pax-info-list li a {
    display: block;
}
.pax-info-content .pax-info-list li a {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.pax-info-list li a:hover,
.pax-info-list li a:active {
    color: #ff5500;
}

/* ----- マスコットキャラクターフッター ----- */
.front-footer {
    position: fixed;
    bottom: 0;
    margin: 0 -12px;
    width: 100%;
}
.front-footer-background{
    z-index: -1;
}
#kokone-balloon-wrapper {
    position: relative;
    max-width: 554px;
    margin: 0 auto;
}
.kokone-balloon {
    width: 100%;
    height: 100%;
}
#kokone-balloon-wrapper .kokone-balloon-inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 71%;
	height: 100%;
}
#kokone-balloon-wrapper .kokone-balloon-text {
	display: block;
	position: absolute;
	top: 7%;
	left: 6%;
	width: 93%;
	height:75%;
	overflow: hidden;
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: bold;
	border-radius: 48%;
	text-align:center;
	cursor: pointer;
}
#kokone-balloon-wrapper .kokone-balloon-text-inner {
	position: relative;
	border-radius: 48%;
	height: 100%;
}
#kokone-balloon-wrapper .kokone-balloon-text span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(.6);
    width: 143%;
    font-size: 31px;
    font-size: 3.1rem;
}

#kokone-small-wrapper {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 32%;
}
#kokone-small-wrapper .kokone-small {
    display: inline-block;
    width: 100%;
    max-width: 148px;
    vertical-align: bottom;
    cursor: pointer;
}

@media all and (max-height: 896px) {
    .front-con {
        padding-bottom: calc(100vh * 0.10);
    }
}
@media all and (max-height: 667px) {
    .front-con {
        padding-bottom: calc(100vh * 0.12);
    }
}
@media all and (max-height: 480px) {
    .front-con {
        padding-bottom: calc(100vh * 0.14);
    }
}

.no-kokone-message .front-con {
	padding-bottom: 0;
}

.no-kokone-message #kokone-balloon-wrapper,
.no-kokone-message #kokone-small-wrapper,
.no-kokone-message #kokone-panel {
	display: none;
}

.img_fade.ng-hide-add {
    -webkit-transition: all linear 0.5s;
    -moz-transition: all linear 0.5s;
    -ms-transition: all linear 0.5s;
    -o-transition: all linear 0.5s;
    transition: all linear 0.5s;
    opacity: 1;
}
.img_fade.ng-hide-add-active {
	opacity: 0;
}
.img_fade.ng-hide-remove {
    -webkit-transition: all linear 0.5s;
    -moz-transition: all linear 0.5s;
    -ms-transition: all linear 0.5s;
    -o-transition: all linear 0.5s;
    transition: all linear 0.5s;
    opacity: 0;
}

.img_fade.ng-hide-remove-active {
	opacity: 1;
}
/* ----- ボタン ------------------------------------------------------------ */
i.fas.fa-star {
	color: #c5003f !important;
	text-shadow: 1px 1px 0px #fff,
							-1px 1px 0px #fff,
							1px -1px 0px #fff,
							-1px -1px 0px #fff,
							0px 0px 2px #fff,
							0px 0px 2px #fff;
}

/* ----- トップメニュー ---------------------------------------------------- */
#buttonPanel {
    margin-top: 16px;
}

.pax-btn-top-con {
    padding-bottom: 16px;
}
.pax-btn-top-con ul {
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    gap: 16px;
}

.pax-btn-top-con.pax-layout-grid5 ul {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
.pax-btn-top-con.pax-layout-grid6 ul {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
.pax-btn-top-con.pax-layout-grid7 ul {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
}
.pax-btn-top-con.pax-layout-grid8 ul {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
}
.pax-btn-top-con.pax-layout-grid9 ul {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
}

.pax-btn-top-con li {
    list-style-type: none;
    text-align: center;
}

.pax-btn-top {
    display: flex;
    padding: 12px 6px;
    height: 100%;
    vertical-align: middle;
    border: 5px solid #FFD600;
    border-radius: 12px;
    background-color: #fff;
    color: #863500;
    font-size: 24px;
    font-size: 2.4rem;
    font-weight: bold;
    text-align: center;
    box-shadow: 1px 1px 4px 0px rgba(40,58,128,.5);
    position: relative;
    justify-content: space-around;
    align-items: center;
}

.pax-btn-top:hover,
.pax-btn-top:active {
	background-color: #FFD600;
	color: #863500;
}

.pax-btn-top .pax-menu-icon {
    position: relative;
    width: 56px;
    height: 56px;
    flex-grow: 0;
}

.pax-btn-top .pax-btn-top-menu {
    flex-grow: 10;
    word-break: break-word;
    overflow-wrap: break-word;
}
.pax-btn-top-con .pax-gird-layout-colspan-1.menu-item {
    grid-column: span 1;
}
.pax-btn-top-con .pax-gird-layout-colspan-2.menu-item {
    grid-column: span 2;
}
.pax-btn-top-con .pax-gird-layout-colspan-3.menu-item {
    grid-column: span 3;
}
.pax-btn-top-con .pax-gird-layout-colspan-4.menu-item {
    grid-column: span 4;
}
.pax-btn-top-con .pax-gird-layout-colspan-5.menu-item {
    grid-column: span 5;
}
.pax-btn-top-con .pax-gird-layout-colspan-6.menu-item {
    grid-column: span 6;
}
.pax-btn-top-con .pax-gird-layout-colspan-7.menu-item {
    grid-column: span 7;
}
.pax-btn-top-con .pax-gird-layout-colspan-8.menu-item {
    grid-column: span 8;
}
.pax-btn-top-con .pax-gird-layout-colspan-9.menu-item {
    grid-column: span 9;
}

.pax-btn-top-con .menu-item-gap.menu-item > * {
    display: none;
}

.pax-btn-top-con .pax-btn-top-menu-small .pax-menu-icon {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
}

/* 横幅が540px以下のスマホ */
@media screen and (max-width:540px) {
    /* メニュー名のspan毎に改行する */
    .pax-btn-top-con span::after {
        content: "\A";
        white-space: pre-line;
    }
    .pax-btn-top-con .pax-btn-top-menu-small .pax-btn-top {
        font-size: 20px;
        font-size: 2.0rem;
    }
    .pax-btn-top-con .pax-btn-top-menu-small .pax-menu-icon {
        width: 36px;
        height: 36px;
    }
}

/* 行先・検索ボタン */
#destinationButton {
	position: relative;
	min-height: 40px;
}

table[class^="pax-buslines"] {
	margin: 0 auto;
}

.destination-button, 
.destination-button.btn-success {
	padding: 5px 12px;
	height: 40px;
	border: solid 5px #cacaca;
	border-radius: 20px;
	background-color: #cacaca;
	color: #203981;
	font-size: 16px;
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1;
}

.destination-button.btn-success.focus, 
.destination-button.btn-success.focus:hover, 
.destination-button.btn-success:focus, 
.destination-button.btn-success:hover, 
.destination-button.btn-success:active, 
.destination-button.btn-success:active.focus, 
.destination-button.btn-success:active:focus {
	border: solid 5px #9ed800;
	background-color: #9ed800;
	color: #203981;
	box-shadow: none;
}

.destination-button.btn-success.active, 
.destination-button.btn-success.active.focus, 
.destination-button.btn-success.active:focus, 
.destination-button.btn-success.active:hover {
	border: solid 5px #9ed800;
	background-color: #fff;
	color: #203981;
}

.destination-button::before {
	position: relative;
	content: "";
	display: inline-block;
	width: 24px;
	height: 16px;
	background: transparent url('../images/ico_menu_flag.png') no-repeat scroll -4px -6px;
	background-size: 32px;
}

.destination-button.btn-success br {
	display: none;
}

/* 周辺情報ボタン */
.btn.btn-to-areainfo, 
.btn.btn-to-areainfo-for-route {
	position: relative;
	padding: 8px 8px 8px 24px;
	width: 68px;
	border: none;
	border-radius: 20px;
	background: #ff7f00 url("../images/ico_wh_info.png") no-repeat scroll 2px center;
	background-size: 24px;
	color: #fff;
	font-size: 16px;
	line-height: 1.1;
	white-space: normal;
	margin-left: auto;
}

/* 周辺情報ボタン - focus, hover active */
.btn.btn-to-areainfo:focus, 
.btn.btn-to-areainfo:hover, 
.btn.btn-to-areainfo:active, 
.btn.btn-to-areainfo-for-route:focus, 
.btn.btn-to-areainfo-for-route:hover, 
.btn.btn-to-areainfo-for-route:active {
	border: none !important;
	background-color: #ff5500 !important;
	color: #fff !important;
	box-shadow: none !important;
}

.pax-areainfo-button-set i {
	display: none;
}

/* 乗り場ボタン */
.pax-platform-button-set {
    display: flex;
    vertical-align: middle;
    position: relative;
    color: #fff;
    padding: 3px 5px;
    text-align: right;
    background-color: #ffa200;
    border-radius: 6px 6px 0 0;
    width: fit-content;
    align-self: center;
    align-items: center;
}

.btn-to-platform {
    flex-grow: 1;
    background-color: #6d240f;
    border-radius: 3px;
    padding: 0 4px;
    display: flex;
    font-weight: bold;
}

.btn-to-platform-code {
    margin-left: 5px;
}
.btn-to-platform-code:lang(ja):after {
    content: '番';
}

.btn-to-platform-code:lang(en):before {
    content: 'No.';
}

.btn-to-platform-note {
    margin: 0 3px;
    font-weight: bold;
}

.pax-platform-inner {
    display: flex;
    align-items: center;
    height: 100%;
    justify-content: center;
}

/* スジの乗り場 */
.pax-suji-platform-button-set {
    display: flex;
    vertical-align: middle;
    position: relative;
    font-size: 16px;
    padding: 5px 0;
}

.btn-to-suji-platform-code {
    padding: 5px 0px 5px 0px;
    background-color: #d4eeff;
    align-self: center;
    flex-grow: 1;
}

.btn-to-suji-platform-code:after {
    content: '番'
}

.btn-to-suji-platform-title {
    padding: 5px 0px 5px 10px;
    background-color: #d4eeff;
    align-self: center;
    width: fit-content;
}

.icon-platform-route span {
    font-size : 10px;
    transform: scale(0.7);
    position :absolute;
    top : 23px;
    left : 5px;
}
.icon-platform-route span:lang(en) {
    transform: scale(0.8);
}
/* 乗り場を表示するときは、周辺情報の幅を広げる */
.pax-platform-button-set + .pax-areainfo-button-set {
    padding-top: 4px;
}
.pax-platform-button-set + .pax-areainfo-button-set .btn.btn-to-areainfo {
    width: 100px;
    line-height: 1.3;
}

/* ----- 各種パネル -------------------------------------------------------- */
/* ----- パネル位置 ----- */
/* バス停・路線検索結果 */
.pax-buslines,
.pax-ttable-tabcontent {
    position: relative;
    z-index: 996;
}

.pax-buslines {
	margin-top: 28px;
}

/* 路線備考 */
.pax-buslines .busline-remarks {
    white-space: pre-wrap;
}

/* 近接 アラート */
.pax-nearest-busstops {
	position: relative;
}

.pax-nearest-busstops .alert-warning {
	padding: 8px 12px;
	font-size: 18px;
	font-size: 1.8rem;
	color: #000;
}

.destination_busstops_noResultFlag,
.destination_bssrch_busstops_noResultFlag,
.destination_busstops_unavailableFlag,
.search_history_noResultFlag,
.noResultFlag {
    padding: 12px;
    border: solid 5px #ffd600;
    border-radius: 12px;
    background-color: #fff;
    box-shadow: 1px 1px 4px 0px rgba(40,58,128,.5);
}

.destination-no-result,
.destination-unavailable,
.no-result {
    width: 100%;
}

/* ルート */
.pax-route-busstops {
	position: relative;
	margin-top: 40px;
	padding-bottom: 60px;
}

/* ページヘッダが position:fixed の為、次要素の縦相対位置を調整 */
.pax-page-header-wrapper {
    height: fit-content;
    margin-bottom: 10px;
}

.pax-route-toheader,
.pax-ttable-busstop,
.pax-ttable-route,
.pax-maps-toheader {
    position: relative;
    top: 0 !important;
    width: 100%;
    margin: 0 0 20px;
    padding: 0;
    border: 5px solid #203981;
    border-collapse: separate;
    border-radius: 12px;
    background-color: #fff;
    color: #203981;
    font-size: 20px;
    font-size: 2.0rem;
    font-weight: bold;
    text-align: center;
}
.max-allbus-maps-con .pax-maps-toheader {
    position: absolute;
    width: calc(100% - 24px);
    margin: 12px;
}
.pax-ttable-busstop {
    text-align: left;
}
/* ----- 共通 ----- */
.panel {
    margin: 0;
    border: none;
    border-radius: unset;
    background-color: transparent;
    box-shadow: none;
}

.panel-group {
    padding-bottom: 20px;
}
.panel-group .panel {
	position: relative;
	border-radius: 12px;
}

.panel-group .panel-group-item:nth-child(n + 2) {
	margin-top: 16px;
}

.panel-warning, 
.alert-warning {
	padding: 0;
	border: solid 5px #ffd600;
	border-radius: 8px;
	background-color: #fff;
	box-shadow: 1px 1px 4px 0px rgba(40,58,128,.5);
}

.panel-heading {
	padding: 0;
	border-top-left-radius: 7px;
	border-top-right-radius: 7px;
}

.panel-heading.pax-favorite-routes {
	border-radius: 12px;
}

.panel-warning > .panel-heading {
    border: none;
    background-color: transparent;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
}

.panel-title {
    line-height: 1.1;
    padding: 12px 0;
}

    .panel-title > a {
        display: block;
        -webkit-tap-highlight-color: rgba(0,0,0,0);
        -webkit-box-shadow: none;
        box-shadow: none;
        outline: none;
    }

.panel-heading table.ng-scope, 
a > table {
	width: 100%;
}

.panel-heading .cell-left {
	padding: 0 12px;
	width: 44px;
	border-top-left-radius: 7px;
	border-bottom-left-radius: 7px;
	background-color: #fff;
	color: #fff;
}
.panel-heading .pax-busstop-origin .cell-left,
.panel-heading .pax-busstop-destination .cell-left {
    padding: 0 8px;
}
.panel-open .panel-heading .cell-left {
	border-bottom-left-radius: 0px;
}

.panel-open .panel-heading .cell-right {
	border-bottom-right-radius: 0px;
}

.pax-fav-con .fav-route-head .panel-heading .cell-left {
	padding: 8px 9px;
	font-size: 22px;
	font-size: 2.2rem;
}
.pax-fav-con .pax-fav-tab a {
    padding: 10px 10px;
}

/* ルートパネル、時刻表 */
/* 事業所名 */
.bs-operator-name {
    font-size: 15px;
    font-size: 1.5rem;
    display: inline-block;
    font-weight: normal;
    position: relative;
    background-color: #3a7fd8;
    border-radius: 16px 16px 0px 0px;
    color: #fff;
    padding: 5px 20px;
}

/* ----- バス停一覧 ----- */
.panel-heading .cell-top {
	color: #863500;
}
.panel-heading .pax-busstop-origin-destination:not(:last-child) .cell-top {
    padding: 0 0 8px 0;
}

.panel-heading .cell-top > div:not(:last-child) {
	padding: 0 0 4px 0;
}
.panel-heading .cell-top .pax-busstop-name,
.panel-heading .cell-top .pax-busline-name,
.panel-heading .cell-top .pax-route-name {
    font-size: 22px;
    font-size: 2.2rem;
    font-weight: bold;
}

.panel-heading .cell-bottom {
    color: #863500;
    width: fit-content;
}
.panel-heading .cell-bottom.cell-hide {
    padding-bottom: 0px;
}

.panel-heading .cell-right {
	padding: 10px 8px;
	border-top-right-radius: 7px;
	border-bottom-right-radius: 7px;
    text-align: right;
}
.panel-heading .pax-busstop-section-swich .cell-right {
    padding: 0px 0px 0 40px;
}

/* 混雑状況-テキスト表示(スジパネル、路線図のバス吹き出し、地図のバス吹き出し) */
.pax-occupancy-status {
    border-radius: 0px 0px 16px 16px;
    justify-content: center;
}
.pax-occupancy-status.passenger-rate-Empty {
    background-color: #effec5;
    color: #203981;
    display: flex;
}
.pax-occupancy-status.passenger-rate-ManySeatsAvailable {
    background-color: #effec5;
    color: #203981;
    display: flex;
}
.pax-occupancy-status.passenger-rate-FewSeatsAvailable {
    background-color: #ddf0fb;
    color: #203981;
    display: flex;
}
.pax-occupancy-status.passenger-rate-StandingRoomOnly {
    background-color: #fff0cb;
    color: #863500;
    display: flex;
}
.pax-occupancy-status.passenger-rate-CrushedStandingRoomOnly {
    background-color: #ffe2e2;
    color: #cf1a1a;
    display: flex;
}
.pax-occupancy-status.passenger-rate-Full {
    background-color: #ffe2e2;
    color: #cf1a1a;
    display: flex;
}
.pax-occupancy-status.passenger-rate-NotAcceptingPassengers {
    background-color: #ffe2e2;
    color: #cf1a1a;
    display: flex;
}
/* 混雑状況-画像(スジパネル) */
.icon-passenger {
    display: inline-block;
    width: 85px;
    height: 22px;
    background-color: #ffffff;
    background-repeat: no-repeat;
    background-position: 0,0;
    background-size: 85px 18px;
    border-radius: 15px;
}
.passenger-rate-Empty .icon-passenger {
    background-image: url("../images/passengers-0.svg");
    background-color: #9ed800;
}
.passenger-rate-ManySeatsAvailable .icon-passenger {
    background-image: url("../images/passengers-0.svg");
    background-color: #9ed800;
}
.passenger-rate-FewSeatsAvailable .icon-passenger {
    background-image: url("../images/passengers-1.svg");
    background-color: #4eade9;
}
.passenger-rate-StandingRoomOnly .icon-passenger {
    background-image: url("../images/passengers-2.svg");
    background-color: #ff7f00;
}
.passenger-rate-CrushedStandingRoomOnly .icon-passenger {
    background-image: url("../images/passengers-3.svg");
    background-color: #cf1a1a;
}
.passenger-rate-Full .icon-passenger {
    background-image: url("../images/passengers-3.svg");
    background-color: #cf1a1a;
}
.passenger-rate-NotAcceptingPassengers .icon-passenger {
    background-image: url("../images/passengers-3.svg");
    background-color: #cf1a1a;
}
/* 混雑状況-画像(路線図のバスアイコン下部) */
.icon-passenger-bus {
    display: inline-block;
    width: 70px;
    height: 28px;
    background-color: #ffffff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px 28px;
    border-radius: 15px;
}

/* 混雑状況インジケーターの表示サイズ調整 (地図からさがす) */
.pax-map-passenger-info-inline .icon-passenger-bus {
    width: 70px;
    background-position: 5px, 0px;
    background-size: 60px 24px;
}
.passenger-rate-Empty .icon-passenger-bus {
    background-image: url("../images/bus-passengers-0.svg");
}
.passenger-rate-ManySeatsAvailable .icon-passenger-bus {
    background-image: url("../images/bus-passengers-0.svg");
}
.passenger-rate-FewSeatsAvailable .icon-passenger-bus {
    background-image: url("../images/bus-passengers-1.svg");
}
.passenger-rate-StandingRoomOnly .icon-passenger-bus {
    background-image: url("../images/bus-passengers-2.svg");
}
.passenger-rate-CrushedStandingRoomOnly .icon-passenger-bus {
    background-image: url("../images/bus-passengers-3.svg");
}
.passenger-rate-Full .icon-passenger-bus {
    background-image: url("../images/bus-passengers-3.svg");
}
.passenger-rate-NotAcceptingPassengers .icon-passenger-bus {
    background-image: url("../images/bus-passengers-3.svg");
}
/* 混雑状況-画像の iPhone 4/SE/5 対応 */
@media screen and (max-width:320px) {
    .icon-passenger {
        width: 73px;
        height: 19px;
        background-size: 73px 19px;
    }
}

/* バス停 - 開閉アイコン */
.icon-busstop,
.icon-busstop-close,
.icon-busstop-open {
    display: inline-block;
    width: 20px;
    height: 36px;
    background: transparent url("../images/ico_brwn_busstop.png") no-repeat scroll -8px 0;
    background-size: 36px;
}

/* 路線 - 開閉アイコン */
.icon-busline,
.icon-busline-close,
.icon-busline-open {
    display: inline-block;
    width: 20px;
    height: 36px;
    background: transparent url("../images/ico_brwn_bus.png") no-repeat scroll -8px 0;
    background-size: 36px;
}

/* 出発バス停 - 開閉アイコン */
.icon-busstop-origin,
.icon-busstop-origin-close,
.icon-busstop-origin-open {
    display: inline-block;
    width: 28px;
    height: 28px;
    background: transparent url("../images/ico_search_busstop1.png") no-repeat scroll 0 0;
    background-size: 28px;
}

/* 出発バス停 - 開閉アイコン */
.icon-busstop-destination,
.icon-busstop-destination-close,
.icon-busstop-destination-open {
    display: inline-block;
    width: 28px;
    height: 28px;
    background: transparent url("../images/ico_search_busstop2.png") no-repeat scroll 0 0;
    background-size: 28px;
}

/* ルート - 開閉アイコン */
.icon-route,
.icon-route-close,
.icon-route-open {
    display: inline-block;
    width: 20px;
    height: 36px;
    background: transparent url("../images/ico_brwn_bus.png") no-repeat scroll -8px 0;
    background-size: 36px;
}

/* ----- ツール ----- */
.tool-panel-table {
    border-collapse: separate;
    border-spacing: 1px;
}

.tool-panel-tr {
    display: flex;
    flex-wrap: wrap;
}

.tool-panel-td {
    text-align: center;
    vertical-align: middle;
    flex-grow: 1;
    margin: 2px;
}

.tool-panel .btn {
    display: block;
    margin: 0 auto;
    padding: 8px 4px 8px 4px;
    width: 100%;
    border: none;
    border-radius: 0px;
    background-color: #ff7f00;
    color: #863500;
    font-size: 16px;
    font-size: 1.6rem;
    font-weight: bold;
}

.tool-panel .tool-panel-td .btn {
    border-radius: 8px;
}

.tool-panel-td .near-for-route-btn {
    background-color: #ff7f00;
    box-shadow: 0px 3px #c46200;
    color: #fff;
}

.pax-busline-name {
    font-weight: bold;
    margin: 5px 0;
}
.bs-busline-name {
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    line-height: 29px;
}

.pax-route-panel-body .pax-route-name {
    background-color: #e7effa;
    margin: 0 -8px;
    font-size: initial;
    padding: 5px 10px;
}

/* 路線図の運行中でないスジパネルのルート名 */
.pax-busline-info .pax-route-name {
    margin: 0 -12px;
}

.tool-panel .btn i {
    display: inline-block;
    font-size: 20px;
    font-size: 2.0rem;
    vertical-align: middle;
}

.tool-panel-td span {
    display: inline-block;
    font-size: 16px;
    font-size: 1.6rem;
    text-align: center;
}

/* ----- 共通・路線図 ----- */
.panel-body {
    padding: 0px 12px;
    border-top: none !important;
    background-color: transparent;
    border-radius: 0 0 7px 7px;
}

.sub-tool-panel::after {
    content: "";
    display: block;
    border-top: solid 1px #ffd600;
}

.sub-panel {
    margin: 0px;
    padding: 0px 0 8px 0;
}

.sub-panel-bottom {
	border-top: solid 1px #cacaca;
}

.sub-panel-table {
	border-collapse: separate;
	border-spacing: 8px;
}

.sub-panel-tr {
    display: flex;
    flex-wrap: wrap;
}

.sub-panel-td {
    text-align: center;
    vertical-align: middle;
    flex-grow: 1;
    margin: 2px;
}

.sub-panel-td span{
	font-size: 16px;
    font-size: 1.6rem;
    margin: 3px;
}

.sub-panel-td .isFavorite span{
	font-size: 14px;
    font-size: 1.4rem
}

.modal-footer .btn,
.sub-panel .btn,
.pax-route-tool .btn,
.pax-tool-button {
    display: block;
    margin: 0 auto;
    padding: 8px 4px 8px 4px;
    width: 100%;
    border: none;
    border-radius: 8px;
    background-color: #ff7f00;
    color: #fff;
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: bold;
}

.pax-tool-button {
    width: auto;
}

.modal-footer .btn i, 
.sub-panel .btn i, 
.pax-route-tool .btn i,
.pax-tool-button i {
	font-size: 15px;
	font-size: 1.5rem;
	vertical-align: text-top;
}

.modal-footer .btn:focus,
.modal-footer .btn:active,
.sub-panel .btn:focus,
.sub-panel .btn:active,
.sub-panel .btn-default[disabled]
.pax-route-tool .btn:focus,
.pax-route-tool .btn:active,
.pax-tool-button:focus,
.pax-tool-button:active {
    background-color: #ff5500;
    color: #fff;
}

.sub-panel .isFavorite,
.pax-route-tool-panel .isFavorite,
.pax-busstop-section-favorite .isFavorite,
.pax-busstop-ttable-favorite .isFavorite,
.pax-ttable-favorite .isFavorite {
    background-color: #fff1a6;
    color: #ff5500;
    border-radius: 8px;
}

.sub-panel .isNotFavorite,
.pax-route-tool-panel .isNotFavorite,
.pax-busstop-section-favorite .isNotFavorite,
.pax-busstop-ttable-favorite .isNotFavorite,
.pax-ttable-favorite .isNotFavorite {
    background-color: #fff;
    color: #ff5500;
}

.sub-panel .isNotFavorite span,
.pax-route-tool-panel .isNotFavorite span {
    text-decoration: underline;
    text-decoration-color: #FF0000;
}

/* id名が「near_for_map_」で始まる要素にアンダーラインをひく */
span[id^="near_for_map_"] {
    text-decoration: underline;
    text-decoration-color: #FF0000;
}

.sub-panel .near-for-map-btn {
    text-decoration: underline;
    text-decoration-color: #FF0000;
    background-color: #fff;
    color: #ff5500;
}

.near-for-ttable-btn {
    text-decoration: underline;
    text-decoration-color: #3a7fd8;
    background-color: #fff;
    color: #3a7fd8;
    margin-left: auto;
    font-size: 17px;
}

.sub-panel .btn i[class*="fa-map"],
.pax-route-tool .btn i[class*="fa-map"],
.pax-tool-button i[class*="fa-map"] {
    font-weight: 400;
}

/* 閉じるボタン・キャンセルボタン */
.modal-footer .btn.btn-act-cancel,
.sub-panel .btn.btn-act-close,
.pax-tool-button.btn-act-close {
	background-color: #a9a9a9;
}

.modal-footer .btn.btn-act-cancel:focus, 
.modal-footer .btn.btn-act-cancel:hover, 
.modal-footer .btn.btn-act-cancel:active, 
.sub-panel .btn.btn-act-close:focus, 
.sub-panel .btn.btn-act-close:hover,
.sub-panel .btn.btn-act-close:active,
pax-tool-button.btn-act-close:focus, 
pax-tool-button.btn-act-close:hover,
pax-tool-button.btn-act-close:active {
	background-color: #ff5500;
	color: #fff;
}

/* 運行終了の吹き出し */
.bs-route-item-no-result {
    display: flex;
    align-items: center;
    padding: 5px 8px;
    flex-wrap: wrap;
}

.bs-route-item-no-result a {
    display: flex;
    align-items: center;
    margin-left: auto;
    gap: 4px;
}

.bs-route-item-no-result a i {
    color: #3a7fd8;
}

.pax-busstop-route-no-result {
    display: flex;
    align-items: center;
    gap: 6px;
    background-color: #999;
    border-radius: 30px;
    padding: 12px;
    color: #fff;
    margin-right: 10px;
    font-size: 17px;
}

.pax-busstop-route-no-result > div{
    padding: 12px;
}

.pax-busstop-route-no-result span {
    display: block;
}

.pax-busstop-route-no-result a {
    color: #ffd600;
}

.pax-busstop-route-no-result a:focus,
.pax-busstop-route-no-result a:hover,
.pax-busstop-route-no-result a:active {
    color: #ff5500;
}

/* 車いすが乗車できるかどうかの表示 */
.wheelchair-accessible {
    display: flex;
    align-items: center; /* 上下中央寄せ */
    padding-top: 8px;
}

.pax-map-detail-panel-status .wheelchair-accessible {
    padding-bottom: 8px;
}

.wheelchair-icon-accessible-wrapper {
    display: inline-block; /* 子要素の大きさに合わせてサイズを変える */
    background-color: #203981;
    padding: 3px; /* 上下左右の余白を指定 */
}

.wheelchair-icon-not-accessible-wrapper {
    display: inline-block; /* 子要素の大きさに合わせてサイズを変える */
    background-color: gray;
    padding: 3px; /* 上下左右の余白を指定 */
}

/* 車いすアイコン */
.wheelchair-accessible-icon-svg {
    height: 15px;
    width: 15px;
    background-image: url('../images/wheelchair_accessible.svg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    filter: invert(100%) sepia(100%) saturate(0%) brightness(100%); /* 白に変換 */
}

.pax-route-bus-wheelchair {
    display: flex;
    align-items: center;
}

.pax-route-bus-wheelchair-massage {
    font-size: 14px;
    font-weight: bold;
    padding-left: 6px;
}
/* ルートパネル */
.bs-route-item {
    margin: 0px 0px 8px 0px;
}

/* ルートパネル(ヘッダ) */
.pax-route-panel-header {
    position: relative;
    background-color: #3a7fd8;
    border-radius: 16px 16px 0px 0px;
    color: #fff;
    padding: 8px;
}

.pax-route-panel-header.operator-name-exist {
    border-radius: 0px 16px 0px 0px;
}

.pax-route-panel-header.header-multiple {
    padding: 2px 8px;
}

.pax-route-panel-header-inner {
    display: -ms-flexbox; /*for IE10*/
    display: flex;
    -ms-flex-direction: row; /*for IE10*/
    flex-direction: row;
    -ms-flex-wrap: nowrap; /*for IE10*/
    flex-wrap: nowrap;
    -ms-flex-pack: justify; /*for IE10*/
    justify-content: space-between;
    -ms-flex-align: center; /*for IE10*/
    align-items: center;
    padding: 0;
    margin: 0;
}

/* ルートパネル(ヘッダ) */
/* バス運行情報 */
.pax-bus-operation-alert {
    order: 1;
    flex-basis: 20px;
}
/* ルートパネル(ヘッダ) */
/* バス到着予定 */
.pax-bus-operation-arrival {
    order: 2;
    padding: 0px 1px;
}
.header-multiple .pax-bus-operation-arrival {
    font-size: 17px;
    font-size: 1.7rem;
}
.pax-bus-operation-arrival-label {
    order: 3;
    font-size: 15px;
    font-size: 1.5rem;
    padding: 0px 1px;
    white-space: nowrap;
}
.header-multiple .pax-bus-operation-arrival-label {
    font-size: 13px;
    font-size: 1.3rem;
}
.pax-bus-operation-arrival-padding {
    order: 4;
    flex-grow: 1;
}
.pax-line-notification {
    order: 6;
    font-size: 15px;
    font-size: 1.5rem;
    border-radius: 20px;
    background-color: #ffffff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2px 4px;
    margin-left: 6px;
}
.pax-line-notification.disable {

}
.line-icon {
    display: inline-block;
    width: 26px;
    height: 26px;
    background: #06C755 url("../images/line.png") no-repeat scroll 0 0;
    border-radius: 50%;
    background-size: contain;
    order: 1;
}
.pax-line-notification.disable .line-icon {
    background-color: #d0d0d0;
    order: 2;
}
.line-icon-text {
    width: 74px;
    text-align: center;
    padding: 0px 4px;
    order: 2;
}
.pax-line-notification.disable .line-icon-text {
    order: 1;
}
.line-icon-text-on {
    color: #06c755;
}
.line-icon-text-off {
    color: #d0d0d0;
    display: none;
}
.pax-line-notification.disable .line-icon-text-on {
    display: none;
}
.pax-line-notification.disable .line-icon-text-off {
    display: initial;
}

/* ルートパネル(ヘッダ) */
/* ノンステップバス */
.pax-bus-operation-bus-type {
    order: 5;
    flex-basis: 100px;
    text-align: center;
}

.pax-route-panel-header .bs-bus-type {
    display: inline-block;
    background-color: #fff;
    border-radius: 16px;
    padding: 2px;
    color: #3a7fd8;
    font-size: 15px;
    font-size: 1.5rem;
    font-weight: bold;
    width: 100%;
    white-space: nowrap;
}

/* ルートパネル(ヘッダ) */
/* バス運行状況 */
.pax-bus-operation-status {
    margin-left: 10px;
    flex-basis: 100px;
    text-align: center;
    white-space: nowrap;
}

.status-ttable {
    display: flex;
    flex-wrap: wrap;
    margin-top: 5px;
}

.pax-route-panel-body .bs-bus-status {
    display: inline-block;
    background-color: #c5fccd;
    border-radius: 20px;
    color: #00804e;
    font-size: 15px;
    font-size: 1.5rem;
    font-weight: bold;
    width: 100%;
    padding: 5px 10px;
}
.pax-route-panel-body .bs-bus-status.small-delay{
    background-color: #fff893;
    color: #6f2a19;
}
.pax-route-panel-body .bs-bus-status.long-delay{
    background-color: #ff2d00;
    color: #fff;
}

/* ルートパネル(ヘッダ) 英語表記調整 */
.pax-route-panel-header:lang(en) .pax-bus-operation-arrival {
    order: 3;
}
.pax-route-panel-header:lang(en) .pax-bus-operation-arrival-label {
    order: 2;
}
.pax-route-panel-header:lang(en) .pax-bus-operation-status {
    flex-basis: 110px;
}
.pax-route-panel-header:lang(en) .pax-bus-operation-bus-type {
    flex-basis: 120px;
}

/* ルートパネル(ボディ) */
.pax-route-panel-body {
    position: relative;
    background-color: #fff;
    border: solid 2px #3a7fd8;
    border-radius: 0px 0px 16px 16px;
    color: #203981;
}
.pax-route-panel-body-inner {
    padding: 8px;
}

/* ルートパネル(ボディ) */
/* 乗車率 */
.pax-passenger-info {
    background-color: #effec5;
    color: #203981;
    margin: 0;
    font-size: 14px;
    font-size: 1.4rem;
    display: table;
    width: 100%;
}
.pax-passenger-info:lang(en) {
    font-size: 13px;
    font-size: 1.3rem;
}
.pax-passenger-info-tr {
    display: flex;
}
.pax-passenger-info-td {
    padding: 4px;
}
.pax-passenger-info-td:last-child {
    text-align: right;
    margin-left: auto;
}
.pax-passenger-info-number {
    font-weight: bold;
}

/*系統・方面・路線名*/
.pax-busline-row,
.prex-route-row {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.route-busline-column {
    display: flex;
    flex-direction: column;
    text-align: center;
}
.busline-short-name,
.route-short-name {
    width: 45px;
    height: 45px;
    background-color: #203981;
    color: #fff;
    border-radius: 5px;
    margin: 5px;
    display: table;
    text-align: center;
    flex-shrink: 0;
}
.busline-short-name {
    width: 35px;
    height: 35px;
    margin: 0;
}
.busline-short-name span,
.route-short-name span{
    display: table-cell;
    vertical-align: middle;
}
.pax-busline-row .pax-busline-name {
    margin: 0 0 0 6px;
}

/* 方面 */
.pax-route-extension {
    line-height: normal;
}
.pax-route-panel-body .bs-route-extension {
    font-size: 15px;
    font-size: 1.5rem;
}

/* ルートパネル(ボディ) */
/* ルート名 */
.pax-route-panel-body .bs-route-name {
    font-weight: bold;
}

/* ルートパネル(ボディ) */
/* ツール */
.pax-route-tool-panel {
    margin: 4px 0px 4px 0px;
}

/* iPhone 4/SE/5 対応 */
@media screen and (max-width:320px) {
    .panel-body {
        padding: 0px 8px;
    }
    .pax-bus-operation-alert {
        flex-basis: 12px;
    }
    .tool-panel-table {
        table-layout: fixed;
    }
    .tool-panel .btn i {
        display: block;
    }
    .pax-passenger-info {
        font-size: 12px;
        font-size: 1.2rem;
    }
}

.platform_ext {
    color: #fff;
    font-size: 14px;
    margin: 0 12px 0 12px;
}

/* ----- 近接バス ----- */

/* 「近くて停留所」の停留所パネルの「方面」 */
/* 「バス停を探す」の停留所パネルの「方面」 */
.pax-ext .pax-icon-remain {
    display: block;
    overflow: hidden;
    padding: 5px 12px;
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 1;
    vertical-align: middle;
    align-self: center;
    flex-grow: 1;
    background-color: #ffa200;
    border-radius: 6px 6px 0 0;
    word-break: break-all;
}

.pax-ext {
    display: flex;
    width: fit-content;
}

/* ----- 路線一覧 ----- */
.pax-busline .busline-route-item {
    position: relative;
    border-bottom: 1px dashed #ffd600;
    padding-bottom: 5px;
    margin-bottom: 10px;
}

.pax-busline .busline-route-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.busline-route-item a {
	display: block;
	padding: 0px;
	color: #863500;
}

.busline-route-item a > table {
	width: 100%;
}

.pax-busline-info {
	width: 100%;
}

.pax-busline-info td {
	position: relative;
}

/* 方面 */
.pax-busline-info-inline {
	display: block;
	min-height: 8px;
}

/* 「路線一覧」の ルートパネルの「方面」 */
.pax-busline-info-inline .pax-icon-remain {
    display: inline-block;
    padding: 5px 8px;
    font-size: 16px !important;
    font-size: 1.6rem !important;
    font-weight: bold;
    color: #fff;
    border-radius: 6px;
    overflow: hidden;
    line-height: 1;
    background-color: #ffa200;
    word-break: break-all;
}


/* 路線名 */
.busline-route-item .bs-route-name {
    display: inline-block;
    padding: 8px 0;
    font-size: 20px;
    font-size: 2rem;
    font-weight: bold;
    text-shadow: 0 0 1px;
    word-break: break-all;
}

.route-custom-style {
    border-radius: 5px;
    padding: 6px 10px;
}

/* スジパネルでスジが運行中のときにつける囲み枠 */
.busline-route-item-on-bus {
    border: 1px #ff8b00 solid;
    padding: 10px 10px 0px 10px;
    margin-bottom: 10px;
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, .3);
    border-radius: 5px;
}

/* 路線図の運行中スジパネルのルート名 */
.busline-route-item-on-bus .pax-route-name{
	margin: 0 -10px;
}

/* 運行中 */
.pax-route-on-bus {
    display: inline-block;
    top: -2px;
    margin-left: 8px;
    padding: 5px 10px;
    border-radius: 20px;
    color: #00804e;
    font-size: 16px;
    font-weight: bold;
    line-height: 1;
    background-color: #c5fccd;
}

/* バスタイプ表示 */
.pax-route-on-bus-type-icon {
    order: 5;
    display: inline-block;
    position: relative;
    padding: 0;
    font-size: 15px;
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 1;
    white-space: nowrap;
    margin-left: 6px;
}

.pax-route-on-bus-type {
    display: inline-block;
    position: relative;
    padding: 4px 10px 4px 10px;
    border-radius: 20px;
    border: solid 1px #203981;
    background-color: #ffffff;
    color: #203981;
    font-size: 15px;
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 1;
    white-space: nowrap;
    margin-right: 10px;
}

.pax-route-on-bus-type .bs-bus-type-icon,
.pax-route-on-bus-type-icon .bs-bus-type-icon,
.pax-maps-bus-marker-speech-bubble .bs-bus-type-icon{
    height: 30px;
    width: 30px;
}

.pax-route-on-bus-type-icon .bs-bus-type-icon-svg {
    height: 30px;
    width: 30px;
    background: #FFF;
}

.pax-route-on-bus-type .bs-bus-type-icon-svg {
    height: 30px;
    width: 30px;
    background: #203981;
}
.pax-maps-bus-marker-speech-bubble .bs-bus-type-icon-svg {
    height: 30px;
    width: 30px;
    background: #203981;
    -webkit-mask: no-repeat center center / contain;
    mask: no-repeat center center / contain;
}
.pax-maps-bus-marker-speech-bubble .bs-bus-type-icon-awesome {
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 20px;
    font-size: 2.0rem;
}


.pax-route-bustype{
    display : flex;
}

.pax-route-bustype .bs-bus-type-icon-svg {
    height: 30px;
    width: 30px;
    background: #203981;
}

.pax-route-on-bus-type span,
.pax-route-on-bus-type-icon span {
    vertical-align: middle;
    line-height: normal;
}

.btn-go-route,
.tool-panel-td .btn-go-route,
.btn-go-bssearch {
    background-color: #ff7f00;
    box-shadow: 0px 3px #c46200;
    color: #fff;
}

/* ----- 路線図・時刻表 ----- */
.busstop_tab {
    display: flex;
}

.alert.pax-route {
    position: relative;
    margin: 0;
    color: #863500;
    flex-grow: 1;
}

/* 路線図：路線名・時刻表：バス停名 */
.pax-ttable-busstop td,
.pax-route-toheader td,
.pax-maps-toheader td {
	padding: 4px 8px;
	vertical-align: middle;
}

.pax-ttable-busstop td:first-child, 
.pax-route-toheader td:first-child,
.pax-maps-toheader td:first-child {
	max-width: 32px;
	border-radius: 7px 0 0 7px;
}

.pax-ttable-busstop td:nth-of-type(2), 
.pax-route-toheader td:nth-of-type(2),
.pax-maps-toheader td:nth-of-type(2){
	width: 100%;
	border-radius: 0 7px 7px 0;
}

/* バス停 */
.pax-route-inner > table {
	width: 100%;
	min-height: 56px;
}

.pax-route-inner > table > tbody > tr > td {
	position: relative;
}

/* 右上ツール */
.pax-route-tool {
    position: absolute;
    top: -31px;
    right: 0;
    height: 26px;
    line-height: 0;
    white-space: nowrap;
}

.pax-route-tool .btn {
	display: inline-block;
	padding: 4px 8px 2px;
	width: auto;
	height: 26px;
	border-radius: 4px 4px 0 0;
}

.route_tool_favorite {
	display: none !important;
}

/* バス停名 */
.pax-busstop-name-break {
    width: 100%;
    word-break: normal;
}

/* どこ・ここ */
.pax-route-inner > table > tbody > tr > td[ng-hide*="isBusPoint"] {
	max-width: 60px;
}

.pax-route-busstop-tap-icon {
	position: relative;
	top: -2px;
	left: 2px;
	width: 60px;
	height: auto;
}

.pax-route-busstop-tap{
    position: relative;
}

.pax-route-busstop-button {
    margin: auto;
    margin-right: 11px;
    border: solid 3px #ffa200;
    border-radius: 10px;
    position: relative;
}

.pax-route-busstop-button.active::after {
  content: "♪";
  position: absolute;
  top: -10px;
  left: -10px;
  color: #FFF;
  line-height: 23px;
  font-weight: bold;
  text-align: center;
  width: 20px;
  background: #F00;
  border-radius: 50%;
  font-size: 17px;
}

.button-inner {
    height: 60px;
    width: 53px;
    display: flex;
    align-items: stretch;
    flex-flow: column;
    justify-content: space-around;
    text-align: center;
    background-color: #ffef00;
    border-radius: 6px;
}

.pinpon {
    height: 15px;
    text-shadow: 0 0 10px red, 0 0 15px red;
    font-size: 14px;
    background: #4b0082;
    margin: 5px 5px 0 5px;
    border-radius: 5px;

}

.pinpon:lang(en) {
    font-size: 10px;
}

.pinpon.active {
    height: 25px;
    box-shadow: inset 0 0 14px 5px #4b0082;
    background: red;
}

.pinpon span{
    margin: 0;
    color: #ffef00;
}

.btn-square {
    background: #ffa200;
    border-bottom: solid 2px #d2691e;
    border-radius: 4px;
    margin: 2px 5px;
}

.btn-square span {
    font-size: 11px;
    display: inline-block;
    padding: 1px 4px;
    color: #203981;
    font-weight: bold;
    text-shadow: 0 0;
}

.btn-square.active span {
    font-size: 17px;
}

.btn-square.active span:lang(en) {
    font-size: 10px;
}

/*ボタンを押したときの動き*/
.btn-square:active {
    -webkit-transform: translateY(4px);
    transform: translateY(4px); 
    border-bottom: none;
}

.pax-route-busstop-tap-icon.icon-off {
    background: transparent url('../images/sw_where.png') no-repeat scroll 4px center;
    background-size: 56px auto;
}
.pax-route-busstop-tap-icon-text {
    position: absolute;
    font-weight: bold;
    color: #203981;
    font-size: 11px;
    font-size: 1.1rem;
    left: 34px;
    top: 50%;
    transform: translateY(-50%);
}
.pax-route-busstop-tap-icon-text:lang(en){
    transform: translate(-4px,-49%) scale(.7);
}
.pax-route-busstop-tap-icon.icon-on {
    background: transparent url('../images/sw_here.png') no-repeat scroll 4px center;
    background-size: 56px auto;
}

/* バス停アイコン */
.pax-route-busstop-icon {
	position: absolute;
	display: block;
	width: 20px;
	height: 100%;
	top: -2px;
	left: 12px;
	background: transparent url("../images/ico_brwn_busstop.png") no-repeat scroll -8px center;
	background-size: 36px;
	color: transparent;
}

/* バス位置を確認するボタン*/
.pax-bus-position-panel {
    background: #134bb6;
    border-radius: 6px;
    margin-top: 5px;
    padding: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.pax-bus-position-panel a {
    color: #fff;
    font-size: 16px;
    font-size: 1.6rem;
}
.pax-bus-position-panel i.fas:before{
    padding-left: 4px;
}
/* バス停名 */
.pax-route-busstop-icon + span {
	display: inline-block;
	padding: 12px 12px 12px 44px;
	font-weight: bold
}

/* バス停チェックポイント */
.check-point-busstop {
	display: inline-block;
	margin: 0 12px 12px 44px;
	padding: 4px 8px;
	border-radius: 4px;
	background-color: #aaa;
	color: #fff;
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 1;
}

/* 周辺情報 */
.pax-route-inner .pax-areainfo-button-set {
	padding: 10px 8px;
}

/* バス停間チェックポイント・運行状況 */
.pax-route-busstops::before {
    position: absolute;
    display: block;
    content: "";
    width: 30px;
    height: calc(100% - 100px);
    top: 40px;
    left: 13px;
    background: #d1d1d1 url('../images/bg_center_lane.png') repeat-y scroll center top;
    background-size: 24px auto;
    z-index: -1;
}

.pax-route-connector span {
	height: 40px;
	line-height: 40px;
	background: transparent none;
	color: transparent;
	font-size: 14px;
	font-size: 1.4rem;
	text-align: center;
}

/* 始発前のチェックポイント */
.BusStopInfo:first-child.pax-route-busstops-check-point {
    margin-top: -36px;
}
.BusStopInfo:first-child.pax-route-busstops-check-point .pax-route-connector-for-checkpoint + div {
    width: 100%;
}
.BusStopInfo:first-child.pax-route-busstops-check-point .pax-route-connector-for-checkpoint + div > div {
    margin-left: 0px;
    position: relative;
}

.BusStopInfo:last-child .SujiInfo::before {
    background: transparent none;
}

/* バス停間チェックポイント */
.pax-route-connector-for-checkpoint, 
.pax-route-connector-for-checkpoint + div {
	width: calc(100% - 8px);
}

.pax-route-connector-for-checkpoint + div > div {
	margin: 0 0 0 66px;
}

.pax-route-checkpoint-table, 
.pax-route-checkpoint-table table {
	width: 100%;
}

.pax-route-checkpoint-name {
	margin: 12px 0 0;
	padding: 8px 12px;
	border: solid 5px #ffd600;
	border-radius: 12px;
	background-color: #fff;
	box-shadow: 1px 1px 4px 0px rgba(40,58,128,.5);
	color: #863500;
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: bold;
}

/*運行状況表示部*/
.SujiInfo{
    margin-left: -12px;
}

/* 運行状況バス画像 - 共通 */
.SujiInfo > div {
    padding: 12px 0;
}

/* 運行状況バス画像 - 時刻表運行 */
.pax-route-bus-image-timetable {
	content: "";
	display: block;
	width: 80px;
	height: 80px;
	background: url('../handlers/image.ashx?img=fig_bus_ttable.png') no-repeat;
	background-size: 80px auto;
}

/* 運行状況バス画像 - 定刻運行 */
.pax-route-bus-image-normal {
	content: "";
	display: block;
	width: 80px;
	height: 80px;
	background: transparent url('../handlers/image.ashx?img=fig_bus_ontime.png') no-repeat scroll 0 0;
	background-size: 80px auto;
}

/* 運行状況バス画像 - 遅れ運行 */
.pax-route-bus-image-delay {
	content: "";
	display: block;
	width: 80px;
	height: 80px;
	background: transparent url('../handlers/image.ashx?img=fig_bus_delay.png') no-repeat scroll 0 0;
	background-size: 80px auto;
}

/* 運行状況バス画像 - 巻き運行 */
.pax-route-bus-image-ahead {
	content: "";
	display: block;
	width: 80px;
	height: 80px;
	background: transparent url('../handlers/image.ashx?img=fig_bus_ahead.png') no-repeat scroll 0 0;
	background-size: 80px auto;
}

/* 運行状況バス画像 - ルート外 */
.pax-route-bus-image-outbound {
    content: "";
    display: block;
    width: 80px;
    height: 80px;
    background: transparent url('../handlers/image.ashx?img=fig_bus_delay.png') no-repeat scroll 0 0;
    background-size: 80px auto;
}

table.pax-route-bus.panel {
	clear: both;
}

/* 運行状況 - フキダシ */
.pax-route-bus-inner {
    position: relative;
}
.BusStatus {
    position: relative;
    padding: 12px;
    background-color: #fff;
    border-radius: 12px;
}

.BusStatus::before {
	position: absolute;
	display: block;
	content: "";
	width: 24px;
	height: 100%;
	top: 0;
	left: -23px;
	background: transparent url('../images/tri_wh_left.png') no-repeat scroll right center;
	background-size: 16px auto;
}

/* 運行状況 - 到着予定 */
.pax-route-bus-required-status,
.pax-map-bus-required-status {
    color: #3a7fd8;
    font-weight: bold;
}

.platform-or-ext {
    color:#863500;
}

.pax-route-bus-required-status-small,
.pax-map-bus-required-status-small {
    font-size: 16px;
    font-size: 1.6rem;
    font-weight: bold;
}

.pax-route-bus-required-status-inline {
	display: block;
}
.pax-maps-bus-status-sequence {
    font-size: 12px;
    font-size: 1.2rem;
    font-weight: bold;
    margin: 4px 0px;
    display:flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content:flex-start;
    align-items: center;
}
.pax-maps-bus-status-sequence img.bus {
    width: 20px;
    height: 20px;
    background-color: #3a7fd8;
    -webkit-mask-image: url('../images/ico_bus_top.svg');
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    -webkit-mask-size: 20px 20px;
    mask-image: url('../images/ico_bus_top.svg');
    mask-repeat: no-repeat;
    mask-position: center center;
    mask-size: 20px 20px;
    margin: 0px 4px;
}
.pax-maps-bus-status-sequence img.busstop {
    width: 16px;
    height: 16px;
    background-color: #3a7fd8;
    -webkit-mask-image: url('../images/ico_busstop.svg');
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    -webkit-mask-size: 16px 16px;
    mask-image: url('../images/ico_busstop.svg');
    mask-repeat: no-repeat;
    mask-position: center center;
    mask-size: 16px 16px;
}
.pax-maps-bus-status-sequence .following-busstop img.busstop {
    background-color: #4f5254;
}
.pax-maps-bus-status-sequence .previous-busstop {
    background-color: #c7e8fa;
    color: #3a7fd8;
    padding: 2px 4px;
    border-radius: 4px;
    display: flex;
    align-items: center;
}
.pax-maps-bus-status-sequence .following-busstop {
    background-color: #e2e1e3;
    color: #4f5254;
    padding: 2px 4px;
    border-radius: 4px;
    display: flex;
    align-items: center;
}
.pax-maps-bus-status-sequence .fas {
    margin: 0px 4px;
}
.pax-maps-bus-status-sequence .fas:first-of-type {
    color: #3a7fd8;
}
.pax-maps-bus-status-tool {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
}
.pax-maps-bus-status-tool .bus-status-tool {
    position: relative;
    background-color: #3a7cc0;
    color: #ffffff;
    border-radius: 16px;
    font-size: 14px;
    font-size: 1.4rem;
    flex-basis: 50%;
    text-align: center;
    padding: 2px 0;
}
.pax-maps-bus-status-tool .bus-status-tool.disabled {
    background-color: #c0c0c0;
}
.pax-maps-bus-status-tool .bus-status-tool-gap {
    flex-basis: 10px;
}
.bus-status-tool .icon-arrow-right {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}

/* 乗車率 */
.pax-route-passenger-info-icon {
    position: absolute;
    left: 5px;
}
.pax-route-passenger-info-inline {
    color: #203981;
    font-size: 15px;
    font-size: 1.5rem;
    margin: 12px -12px -12px -12px;
    padding: 6px;
    border-radius: 0px 0px 12px 12px;
    text-align: center;
}
.pax-map-passenger-info-inline {
    color: #203981;
    font-size: 15px;
    font-size: 1.5rem;
    font-weight: bold;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}

.pax-route-bus-required-status-volume,
.pax-map-bus-required-status-volume {
    color: #863500;
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: bold;
}

/* 運行状況 - 到着時刻,出発時刻 */
.pax-route-bus-arrivaltime,
.pax-route-bus-departuretime {
    display: block;
    margin: 8px 0;
    padding: 12px 0 0;
    border-top: solid 1px #cacaca;
    font-size: 18px;
    font-weight: bold;
}
.pax-map-bus-arrivaltime {
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: bold;
}
.pax-route-bus-scheduledtime {
    display: block;
    margin: 8px 0;
    font-size: 14px;
    text-decoration: line-through;
}

/* 運行状況 - バスの位置が特定できないときのメッセージ */
.pax-route-bus-notfound-comment {
    display: block;
    margin: 8px 0 0;
    padding: 4px 8px;
    background-color: #e5e5e5;
    border-radius: 4px;
    font-size: 14px;
    font-size: 1.4rem;
}

/* 運行状況 - バスの位置が特定できないときの注釈 */
.pax-route-bus-notfound-annotation {
    display: block;
    font-size: 14px;
    font-size: 1.4rem;
}

.pax-route-where-target {
    display: flex;
    flex-wrap: wrap;
    font-size: 14px;
    font-size: 1.4rem;
}

.pax-route-where-target a{
	color:#000;
}

.pax-route-where-target a:first-child{
	color:#ff7f00;
    font-weight: bold;
}

/* 運行状況 - 共通 */
.pax-route-bus-delay-status {
    display: flex;
    margin: 0;
    padding: 4px 8px;
    border-radius: 15px;
    font-size: 14px;
    font-size: 1.4rem;
    align-items: center;
}
.pax-route-bus-delay-status i.fas::after {
    content: '';
    padding-right: 4px;
}

/* 運行状況 - 時刻表運行 */
.pax-route-bus-arrive-timetable.pax-route-bus-delay-status,
.pax-route-bus-depart-timetable.pax-route-bus-delay-status {
    background: #aaa;
    color: #fff;
    font-weight: bold;
}

/* 運行状況 - 定刻運行 */
.pax-route-bus-arrive-normal.pax-route-bus-delay-status,
.pax-route-bus-depart-normal.pax-route-bus-delay-status {
    background-color: #c5fccd;
    color: #00804e;
    font-weight: bold;
}

/* 運行状況 - 遅れ運行 */
.pax-route-bus-arrive-delay.pax-route-bus-delay-status,
.pax-route-bus-depart-delay.pax-route-bus-delay-status {
    background-color: #ffef00;
    color: #6f2a19;
    font-weight: bold;
}

/* 運行状況 - 巻き運行 */
.pax-route-bus-arrive-ahead.pax-route-bus-delay-status,
.pax-route-bus-depart-ahead.pax-route-bus-delay-status {
    background-color: #203981;
    color: #fff;
    font-weight: bold;
}

/* 運行状況 - ルート外 */
.pax-route-bus-arrive-outbound.pax-route-bus-delay-status,
.pax-route-bus-depart-outbound.pax-route-bus-delay-status {
    background-color: #ffef00;
    color: #203981;
    font-weight: bold;
}

/* 最新ルート情報更新 -インジケーター(テキスト部) */
.pax-indicator-text {
    position: fixed;
    padding: 2px 4px;
    width: 100%;
    height: 24px;
    left: 0px;
    bottom: 0px;
    font-size: 1.4rem;
    background: #3a7fd8;
    color: #fff;
    z-index: 1;
}

/* 最新ルート情報更新 -インジケーター(テキスト部-更新時刻) */
.pax-indicator-time {
    float: left;
}
/* 最新ルート情報更新 -インジケーター(テキスト部-メッセージ) */
.pax-indicator-msg {
    float: right;
    display: none;
}

/* 最新ルート情報更新 -インジケーター(インジケーター部) */
.pax-indicator-bar {
    position: fixed;
    width: 100%;
    height: 3px;
    left: 0;
    bottom: 0px;
    background: #0d3fb7;
    z-index: 2;
    opacity: 0.7;
    display: none;
}

.pax-auto-update {
    position: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2px 4px;
    width: 100%;
    height: 44px;
    left: 0px;
    bottom: 0px;
    font-size: 1.4rem;
    background-color: #3a7fd8;
    color: #fff;
    z-index: 1;
}
.pax-auto-update .pax-auto-update-button {
    display: flex;
    justify-content: space-around;
    background-color: #6eadec;
    border-radius: 20px;
    padding: 4px;
    width: 240px;
}
.pax-auto-update .pax-auto-update-button-start,
.pax-auto-update .pax-auto-update-button-end {
    flex: 1;
    text-align: center;
    border-radius:16px;
    padding: 4px;
    font-weight: bold;
    cursor: pointer;
}
.pax-auto-update .pax-auto-update-button-start.active,
.pax-auto-update .pax-auto-update-button-end.active {
    background-color: #fff;
    color: #3a7fd8;
    cursor: default;
}

/* ----- 時刻表・お気に入り - ヘッダ ----- */
.pax-ttable-busstop-name {
    margin: 0;
}

/* 切替ボタン */
.pax-tabs .nav-tabs {
    margin: 0 0 20px;
    border-bottom: none;
}

.pax-tabs .nav-tabs > li > a {
	display: flex;
	margin: 0 8px 8px 0;
	min-width: 80px;
	border: solid 5px #cacaca;
	border-radius: 12px;
	background-color: #cacaca;
	font-size: 20px;
	font-size: 2rem;
	font-weight: bold;
	line-height: 1;
	justify-content: center;
}

.pax-tabs .nav-tabs > li > a:focus, 
.pax-tabs .nav-tabs > li > a:hover, 
.pax-tabs .nav-tabs > li > a:active {
	border: solid 5px #9ed800;
	background-color: #9ed800;
}

.pax-tabs .nav-tabs > li.active > a, 
.pax-tabs .nav-tabs > li.active > a:focus, 
.pax-tabs .nav-tabs > li.active > a:hover, 
.pax-tabs .nav-tabs > li.active > a:active {
	border: solid 5px #9ed800;
	background-color: #fff;
}

/* お気に入り - 区間 */
.pax-tabs .nav-tabs uib-tab-heading .pax-tab-heading {
    display: flex;
}

.pax-busstop-sections {
    position: relative;
}
.pax-busstop-sections table {
    width: 100%;
}
.pax-busstop-section-swich-inner {
    position: relative;
}
.pax-busstop-section-swich-icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 6px;
    display: block;
    width: 32px;
    height: 32px;
    background: transparent url('../images/ud_arrow.png') no-repeat scroll center center;
    background-size: contain;
    cursor: pointer;
    opacity: 0.92;
}
.pax-busstop-section-swich-icon:hover {
    opacity: 1;
}

/* [バス停検索] 区間お気に入り */
.pax-ttable-favorite {
    text-align: center;
    margin-bottom: 12px;
}

.tab-scroll {
    overflow-x: scroll;
}

/* スクロールボタン枠*/
.scroll-arrow {
    background-color: #ffc000;
    display: flex;
    flex-flow: row;
    justify-content: space-between;
    padding: 10px;
}

.scroll-arrow .fas{
    z-index: 2;
}

/* テーブル列固定*/
.sticky {
    position: sticky;
    left: 0;
    border-top: solid 1px #ccc;
}

.sticky-name {
    min-width: 100px;
}

/* 横が 768px までの画面サイズの場合 */
@media screen and (max-width: 768px) {
    .sticky-name {
        max-width: 150px;
    }
}

.sticky:before {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border-left: 1px solid #ccc;
}

.route-select {
    width: inherit;
    border: none;
}

.isSelectTime {
    color: red;
    font-weight: bolder;
}

.tab-scroll table {
    font-size: 20px;
    font-size: 2.0rem;
    width: 100%;
    background-color: #fff;
    color: #203981;
}

/* 横が 768px までの画面サイズの場合 */
@media screen and (max-width: 768px) {
    .tab-scroll table th span {
        font-size: 16px;
        font-size: 1.6rem;
    }
}

.tab-scroll table th {
    padding: 8px;
    border-right: solid 1px #ccc;
    border-bottom: solid 1px #ccc;
    border-top: solid 1px #ccc;
    background-color: #ffc000;
    text-align: center;
    z-index: 2;
}

.tab-scroll table tbody th {
    background-color: #ffebae;
}

.tab-scroll table td {
	padding: 8px;
	min-width: 60px;
	border-top: solid 1px #ccc;
	border-right: solid 1px #ccc;
    text-align: center;
}

.tab-scroll .ttable-table td {
    display: flex;
    flex-flow: row;
    flex-wrap: wrap;
}

.tab-scroll table td .ttable-min span {
    margin: 0 12px;
    text-decoration: underline;
    width: 30px;
    z-index: 1;
}

.tab-scroll table th:last-child,
.tab-scroll table td:last-child {
    border-right: none;
    min-width: 80px;
}

.tab-scroll table .pax-tabs-route-td {
    width: 100%;
    text-align: left;
}

.ttable-wday {
    background-color: #fffae1;
}

.ttable-sat {
	background-color: #dbeeff;
}

.ttable-sun {
	background-color: #ffe0ee;
}

.ttable-school {
	background-color: #dcedc1;
}

.pax-ttable-con .pax-ttable-ext > span,
.pax-ttable-con .bs-timetable-min,
.pax-ttable-con .bs-operator-name,
.pax-ttable-ext .bs-operator-name {
    vertical-align: middle;
    border-radius: 16px;
}

.bs-bus-type-icon-awesome::before {
    font-family: 'Font Awesome 5 Free','Font Awesome 5 Brands';
    font-weight: 900;
    content: attr(data-icon);
    height: 30px;
    width: 30px;
    display: inline-block;
    align-content: center;
    text-align: center;
    color: #203981;
}

.pax-route-bustype .bs-bus-type-icon-awesome::before,
.accordion-body .bs-bus-type-icon-awesome::before,
.map-bustype-delay .bs-bus-type-icon-awesome::before {
    font-size: 20px;
}

.pax-ttable-icon .bs-bus-type-icon-awesome::before {
    font-size: 28px;
}

.pax-route-on-bus-type-icon .bs-bus-type-icon-awesome::before {
    color: #FFF;
}

.bs-bus-type-icon {
    width: 48px;
    height: 48px;
}

.ttable-min {
    display: flex;
    flex-flow: column;
    width: fit-content;
    align-items: center;
}

.minInfo {
    position: relative;
    margin: 15px 5px;
    padding: 7px 10px;
    background: #e0edff;
    box-shadow: 4px 4px;
    animation-name: fadeIn;
    animation-duration: 1s;
    animation-fill-mode: forwards;
    opacity: 0;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.minInfoHide {
    position: relative;
    margin: 15px 5px;
    padding: 7px 10px;
    background: #e0edff;
    box-shadow: 4px 4px;
    animation-name: fadeOut;
    animation-duration: 0.5s;
    animation-fill-mode: forwards;
    opacity: 1;
}

@keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

.panel-minInfos .minInfo:first-child:before {
    content: "";
    position: absolute;
    top: -30px;
    left: 50%;
    margin-left: -15px;
    border: 15px solid transparent;
    border-bottom: 15px solid #e0edff;
    z-index: -1;
}

/* ----- 地図 ----- */
.pax-maps-con {
    margin: 0px 0px 0px -12px;
    position: absolute;
    top: 36px;
    width: 100%;
    height: calc(100% - 36px - 28px); /* 実高さ － 地図のtop位置 － インジケーターの高さ */
}
.pax-maps {
	position: absolute;
	width: 100%;
	height: 100%;
}

.max-allbus-maps-con {
    margin: 0px 0px 0px -12px;
    position: absolute;
    top: 37px;
    width: 100%;
    height: calc(100% - 36px - 29px - env(safe-area-inset-bottom));
}
.max-allbus-maps-con .max-allbus-maps-inner{
    position: relative;
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
}
.pax-allbus-maps {
    width: 100%;
    height: 100%;
}
/* バスアイコン */
.pax-maps-bus-marker,
.pax-maps-bus-marker-icon {
    content: '';
    position: absolute;
    display: block;
    width: 48px;
    height: 48px;
}
.pax-maps-bus-marker-inner {
    position: relative;
}
/* バスアイコン */
.pax-maps-bus-marker-icon {
    background-position: 0px -5px;
    background-repeat: no-repeat;
    background-size: 48px 48px;
    animation: 0.5s move infinite alternate linear;
    cursor: pointer;
}
/* 小さいバスアイコン */
.pax-maps-small-bus.pax-maps-bus-marker {
    width: 28px;
    height: 28px;
}
.pax-maps-small-bus .pax-maps-bus-marker-icon {
    background-size: 28px 28px;
    width: 28px;
    height: 28px;
}
/* バスアイコン(アニメーション) */
@keyframes move {
    to {
		background-position: 0px -5px;
	}
	from {
		background-position: 0px -4px;
	}
}
/* バスアイコン(遅延) - 東方向 */
.pax-maps-bus-horizontal-west.pax-maps-bus-status-delay .pax-maps-bus-marker-icon {
    background-image: url('../handlers/image.ashx?img=bus-delay_left.png&v=202002170001');
}
/* バスアイコン(遅延) - 西方向 */
.pax-maps-bus-horizontal-east.pax-maps-bus-status-delay .pax-maps-bus-marker-icon {
    background-image: url('../handlers/image.ashx?img=bus-delay_right.png&v=202002170001');
}
/* バスアイコン(早発) - 東方向 */
.pax-maps-bus-horizontal-west.pax-maps-bus-status-ahead .pax-maps-bus-marker-icon {
    background-image: url('../handlers/image.ashx?img=bus-normal_left.png&v=202002170001');
}
/* バスアイコン(早発) - 西方向 */
.pax-maps-bus-horizontal-east.pax-maps-bus-status-ahead .pax-maps-bus-marker-icon {
    background-image: url('../handlers/image.ashx?img=bus-normal_right.png&v=202002170001');
}
/* バスアイコン(定刻) - 東方向 */
.pax-maps-bus-horizontal-west.pax-maps-bus-status-normal .pax-maps-bus-marker-icon {
    background-image: url('../handlers/image.ashx?img=bus-normal_left.png&v=202002170001');
}
/* バスアイコン(定刻) - 西方向 */
.pax-maps-bus-horizontal-east.pax-maps-bus-status-normal .pax-maps-bus-marker-icon {
    background-image: url('../handlers/image.ashx?img=bus-normal_right.png&v=202002170001');
}
/* バスアイコン(待機) - 東方向 */
.pax-maps-bus-horizontal-west.pax-maps-bus-status-standby .pax-maps-bus-marker-icon {
    background-image: url('../handlers/image.ashx?img=bus-normal_left.png&v=202002170001');
}
/* バスアイコン(待機) - 西方向 */
.pax-maps-bus-horizontal-east.pax-maps-bus-status-standby .pax-maps-bus-marker-icon {
    background-image: url('../handlers/image.ashx?img=bus-normal_right.png&v=202002170001');
}
/* バスアイコン(ルート外) - 東方向 */
.pax-maps-bus-horizontal-west.pax-maps-bus-status-outbound .pax-maps-bus-marker-icon {
    background-image: url('../handlers/image.ashx?img=bus-delay_left.png&v=202002170001');
}
/* バスアイコン(ルート外) - 西方向 */
.pax-maps-bus-horizontal-east.pax-maps-bus-status-outbound .pax-maps-bus-marker-icon {
    background-image: url('../handlers/image.ashx?img=bus-delay_right.png&v=202002170001');
}

/* バス吹き出し(停留所名,所要時間,遅れ時間) */
.pax-maps-bus-marker-status {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    padding: 4px 6px;
    min-width: 100px;
    max-width: 200px;
    background: #ffffff;
    border: solid 2px #3a7fd8;
    border-radius: 8px;
    box-shadow: 3px 3px 3px rgba(0,0,0,0.4);
    z-index: 1;
    opacity: 0.9;
    word-break: keep-all;
    overflow-wrap: break-word;
    text-align: center;
}
/* バス吹き出しの三角罫線 */
.pax-maps-bus-marker-status::before {
    content: '';
    position: absolute;
    z-index: 1;
    width: 20px;
    height: 20px;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%) rotate(45deg);
    background: #ffffff;
    border: solid 2px #3a7fd8;
    box-shadow: 3px 3px 3px rgba(0,0,0,0.4);
}
/* バス吹き出しの三角背景 */
.pax-maps-bus-marker-status::after {
    content: '';
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    background: #ffffff;
}
/* バス吹き出しの内容 */
.pax-maps-bus-marker-status > * {
    position: relative;
    z-index: 3;
}

/* バスマーカーのバス吹き出し */
/* 停留所マーカーマーカーのバス吹き出し */
.pax-maps-bus-marker-speech-bubble {
    position: absolute;
    bottom: 68px;
    left: 50%;
    transform: translateX(-50%);
    min-width: 100px;
    max-width: 200px;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 1px 1px 2px 2px rgba(112,128,144,0.65);
    z-index: 1;
    word-break: keep-all;
    overflow-wrap: break-word;
    text-align: center;
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: bold;
}
/* バス吹き出しの三角罫線 */
.pax-maps-bus-marker-speech-bubble::before {
    content: '';
    position: absolute;
    z-index: 2;
    width: 16px;
    height: 16px;
    bottom: -6px;
    left: 50%;
    transform: translateX(-50%) rotate(45deg);
    background: #ffffff;
    box-shadow: 1px 1px 2px 2px rgba(112,128,144,0.65);
}
/* バス吹き出しの三角背景 */
.pax-maps-bus-marker-speech-bubble::after {
    content: '';
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    background: #ffffff;
}
/* バス吹き出しの内容 */
.pax-maps-bus-marker-speech-bubble > * {
    position: relative;
    z-index: 4;
}
.pax-maps-bus-marker-status-delay {
    padding: 10px 6px;
}
.pax-maps-bus-marker-status-delay {
    white-space: nowrap;
}
.pax-maps-bus-marker-status-delay:has(+ .pax-maps-bus-marker-status-bustype > *) {
    padding-bottom: 0px;
}
.pax-maps-bus-marker-status-delay .fas {
    margin-right: 4px;
}
.pax-maps-bus-marker-status-occupancy {
    padding: 4px 8px;
    border-radius: 8px 8px 0 0;
}
.passenger-rate-Empty .pax-maps-bus-marker-status-occupancy {
    background-color: #effec5;
    color: #203981;
}
.passenger-rate-ManySeatsAvailable .pax-maps-bus-marker-status-occupancy {
    background-color: #effec5;
    color: #203981;
}
.passenger-rate-FewSeatsAvailable .pax-maps-bus-marker-status-occupancy {
    background-color: #ddf0fb;
    color: #203981;
}
.passenger-rate-StandingRoomOnly .pax-maps-bus-marker-status-occupancy {
    background-color: #fff0cb;
    color: #863500;
}
.passenger-rate-CrushedStandingRoomOnly .pax-maps-bus-marker-status-occupancy {
    background-color: #ffe2e2;
    color: #cf1a1a;
}
.passenger-rate-Full .pax-maps-bus-marker-status-occupancy {
    background-color: #ffe2e2;
    color: #cf1a1a;
}
.passenger-rate-NotAcceptingPassengers .pax-maps-bus-marker-status-occupancy {
    background-color: #ffe2e2;
    color: #cf1a1a;
}
.pax-maps-bus-marker-status-bustype {
    color: #203981;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 8px;
}
.pax-maps-bus-marker-status-bustype:has(> *) {
    padding-bottom: 5px;
}

.pax-maps-speech-bubble {
    position: absolute;
    min-width: 100px;
    max-width: 300px;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 1px 1px 2px 2px rgba(112,128,144,0.65);
    z-index: 1;
    word-break: keep-all;
    overflow-wrap: break-word;
    text-align: center;
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: bold;
    padding: 10px 6px;
    color: #6f2a19 !important;
}
.pax-maps-speech-bubble::before {
    content: '';
    position: absolute;
    z-index: 2;
    width: 16px;
    height: 16px;
    bottom: -6px;
    left: 50%;
    transform: translateX(-50%) rotate(45deg);
    background: #ffffff;
    box-shadow: 1px 1px 2px 2px rgba(112,128,144,0.65);
}
.pax-maps-speech-bubble::after {
    content: '';
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    background: #ffffff;
}
.pax-maps-speech-bubble > * {
    position: relative;
    z-index: 4;
}


/* バス吹き出し(地図からさがす) - 遅延情報(定刻) */
.pax-maps-bus-status-normal .pax-maps-bus-marker-speech-bubble {
    color: #00804e;
}
/* バス吹き出し(地図からさがす) - 遅延情報(遅延) */
.pax-maps-bus-status-delay .pax-maps-bus-marker-speech-bubble {
    color: #6f2a19;
}
/* バス吹き出し - 遅延情報(早発) */
.pax-maps-bus-status-ahead .pax-maps-bus-marker-speech-bubble {
    color: #00804e;
}
/* バス吹き出し(地図からさがす) - 遅延情報(ルート外) */
.pax-maps-bus-status-outbound .pax-maps-bus-marker-speech-bubble {
    color: #6f2a19;
}

/* 停留所マーカーマーカーのバス吹き出し */
.pax-maps-busstop-bubble {
    position: absolute;
    padding: 2px 4px;
    min-width: 90px;
    max-width: 200px;
    background: rgba(255,255,255,0.89);
    border-radius: 4px;
    box-shadow: 1px 1px 1px 1px rgba(112,128,144,0.65);
    z-index: 1;
    word-break: keep-all;
    overflow-wrap: break-word;
    text-align: center;
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: bold;
}
.pax-maps-busstop-bubble-focus {
    font-size: 22px;
    font-size: 2.2rem;
}

/* 乗降客情報 */
.pax-maps-bus-passenger {
    color: #203981;
    font-size: 12px;
    font-size: 1.2rem;
    margin: -4px -6px 4px -6px;
    padding: 4px 4px;
    border-radius: 5px 5px 0px 0px;
}

/* バス吹き出し - 到着予定 */
.pax-maps-bus-required-status {
    color: #3a7fd8;
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: bold;
}

.pax-maps-bus-required-status-small {
	font-size: 12px;
	font-size: 1.2rem;
	font-weight: bold;
}
.pax-maps-bus-required-status-inline {
	display: block;
}
.pax-maps-bus-required-status-volume {
	color: #863500;
	font-size: 12px;
	font-size: 1.2rem;
	font-weight: bold;
}

/* バス吹き出し - 遅延情報 */
.pax-maps-bus-delay-inline {
    display: inline-block;
    margin: 0;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 14px;
    font-size: 1.4rem;
}
/* バス吹き出し - 遅延情報(定刻) */
.pax-maps-bus-status-normal .pax-maps-bus-delay-inline {
    background-color: #4eade9;
    color: #fff;
    font-weight: bold;
}
/* バス吹き出し - 遅延情報(遅延) */
.pax-maps-bus-status-delay .pax-maps-bus-delay-inline {
    background-color: #ffef00;
    color: #203981;
    font-weight: bold;
}
/* バス吹き出し - 遅延情報(早発) */
.pax-maps-bus-status-ahead .pax-maps-bus-delay-inline {
    background-color: #203981;
    color: #fff;
    font-weight: bold;
}
/* バス吹き出し - 遅延情報(待機) */
.pax-maps-bus-status-standby .pax-maps-bus-delay-inline {
    background-color: #4eade9;
    color: #fff;
    font-weight: bold;
}
/* バス吹き出し - 遅延情報(ルート外) */
.pax-maps-bus-status-outbound .pax-maps-bus-delay-inline {
    background-color: #ffef00;
    color: #203981;
    font-weight: bold;
}

/* バス吹き出し(地図からさがす) - 遅延情報 */
.pax-maps-bus-marker-speech-bubble .pax-maps-bus-marker-delay {
    display: inline-block;
    margin: 0;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 14px;
    font-size: 1.4rem;
}

/* 停留所アイコン */
.pax-maps-busstop-marker, .pax-maps-busstop-marker-icon {
    content: '';
    position: absolute;
    cursor: pointer;
    display: block;
    width: 32px;
    height: 32px;
}
.pax-maps-busstop-marker.pax-maps-busstop-image-active {
	z-index: 999;
}
/* 停留所アイコン(既定) */
.pax-maps-busstop-image-normal .pax-maps-busstop-marker-icon {
	background: url('//maps.google.com/mapfiles/ms/micons/red-dot.png') no-repeat;
	background-size: 32px 32px;
}
/* 停留所アイコン(始点) */
.pax-maps-busstop-image-start .pax-maps-busstop-marker-icon {
	background: url('//maps.google.com/mapfiles/ms/micons/blue-dot.png') no-repeat;
	background-size: 32px 32px;
}
/* 停留所アイコン(終点) */
.pax-maps-busstop-image-end .pax-maps-busstop-marker-icon {
	background: url('//maps.google.com/mapfiles/ms/micons/pink-dot.png') no-repeat;
	background-size: 32px 32px;
}
/* 停留所アイコン(最寄り) */
.pax-maps-busstop-image-active .pax-maps-busstop-marker-icon {
	background: url('//maps.google.com/mapfiles/ms/micons/green-dot.png') no-repeat;
	background-size: 32px 32px;
}
/* 停留所アイコン(鼓動) */
.pax-maps-busstop-image-active:after {
	content: "";
	border-radius: 50%;
	height: 40px;
	width: 40px;
	position: absolute;
	top: 12px;
	left: -4px;
	animation: pulsate 1s ease-out;
	animation-iteration-count: infinite;
	opacity: 0.0;
	box-shadow: 0 0 1px 2px #00e64D;
	animation-delay: 1.1s;
	z-index: -100;
}
/* 停留所アイコン(吹き出し) */
.pax-maps-busstop-marker-balloon {
	position: absolute;
	display: inline-block;
	bottom: 48px;
	left: 50%;
	transform: translateX(-50%);
	padding: 2px 10px;
	min-width: 70px;
	color: #000000;
	font-size: 14px;
	background: #fff6c7;
	border-radius: 8px;
	border: solid 1px #e36d4a;
	box-shadow: 3px 3px 5px 1px rgba(0,0,0,0.50);
	text-align: center;
	z-index: 1;
}
.pax-maps-busstop-image-active .pax-maps-busstop-marker-balloon {
	color: #ffffff;
	background: #ff773e;
	border: solid 1px #cc4f02;
	z-index: 999;
}
/* 停留所アイコン(吹き出し：三角部分) */
.pax-maps-busstop-marker-balloon:before {
	content: "";
	position: absolute;
	background: #fff6c7;
	border: 1px solid #e36d4a;
	width: 20px;
	height: 20px;
	transform: translateX(-50%) rotate(45deg) skew(0deg,0deg);
	box-shadow: 3px 3px 5px 1px rgba(0,0,0,0.50);
	bottom: -10px;
	left: 50%;
	z-index: 1;
}

.pax-maps-busstop-image-active .pax-maps-busstop-marker-balloon:before {
	background: #ff773e;
	border: solid 1px #cc4f02;
}
/* 停留所アイコン(吹き出し：三角上部塗りつぶし) */
.pax-maps-busstop-marker-balloon:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: 8px;
	background: #fff6c7;
	z-index: 2;
}

.pax-maps-busstop-image-active .pax-maps-busstop-marker-balloon:after {
	background: #ff773e;
}
.pax-maps-busstop-active {
    height: 0;
    width: 0;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}
.pax-maps-busstop-active:after {
    content: "";
    border-radius: 50%;
    height: 40px;
    width: 40px;
    position: absolute;
    z-index: -100;
    animation: pulseMotion 1.4s linear infinite;
}
@keyframes pulseMotion {
    0% {
        transform: scale(0.1, 0.1);
        background-color: rgba(30, 144, 255, 0);
        box-shadow: 0 0 1px 2px rgba(30, 144, 255, 0);
    }
    50% {
        transform: scale(1.5, 1.5);
        background-color: rgba(30, 144, 255, 0.2);
        box-shadow: 0 0 1px 2px rgba(30, 144, 255, 0.6);
    }
    100% {
        transform: scale(2.5, 2.5);
        background-color: rgba(30, 144, 255, 0);
        box-shadow: 0 0 1px 2px rgba(30, 144, 255, 0);
    }
}

.pax-maps-busstop-marker-balloon-container {
    position: absolute;
    height: 0;
}
/* 停留所アイコン(停留所名) */
.pax-maps-busstop-marker-title {
	position: relative;
	margin: 0;
	padding: 0;
	z-index: 3;
	word-break: keep-all;
	overflow-wrap: break-word;
	display: inline-block;
}
/* 停留所アイコン(鼓動アニメーション) */
@keyframes pulsate {
	0% {
		transform: scale(0.1, 0.1);
		opacity: 0.0;
	}

	50% {
		opacity: 1.0;
	}

	100% {
		transform: scale(1.2, 1.2);
		opacity: 0;
	}
}
/* 行き先ボタン*/
#goRoute {
	margin: 8px 0px;
}
/* 地図画面の行き方ボタン色変更 */
.btn-success {
    background-color: #ff7f00;
    border-color: #cf6a05;
}

/* バス詳細パネル */
.pax-map-detail-panel {
    display: block;
    padding: 10px 10px;
    background-color: #ffffff;
    box-shadow: inset 0px 0px 4px 0px rgba(0, 0, 0, 0.4);
}
.pax-map-detail-panel.pax-map-detail-bus.ng-hide-add,
.pax-map-detail-panel.pax-map-detail-bus.ng-hide-remove {
    -webkit-transition: 0.3s ease all;
    transition: .3s ease all;
    height: 130px;
}
.pax-map-detail-panel.pax-map-detail-bus.ng-hide {
    height: 0px;
}

.pax-map-detail-panel.pax-map-detail-busstop.ng-hide-add,
.pax-map-detail-panel.pax-map-detail-busstop.ng-hide-remove {
    -webkit-transition: 0.3s ease all;
    transition: .3s ease all;
    height: 90px;
}
.pax-map-detail-panel.pax-map-detail-busstop.ng-hide {
    height: 0px;
}

.pax-map-detail-panel-status {
    border-bottom: solid 1px #cacaca;
}


.btn-success:hover,
.btn-success:active,
.btn-success:active:hover,
.btn-act-ok:hover,
.btn-act-ok:active,
.btn-act-ok:active:hover {
    background-color: #c46405;
    border-color: #cf6a05;
}

#map_tool_button_container {
    display: flex;
    flex-direction: column;
}
/* 停留所アイコン表示/非表示ボタン */
.pax-map-tool-button {
    background-color: #fff;
    border-radius: 2px;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
    font-size: 12px;
    margin: 2px 10px;
    padding: 4px;
    width: 40px;
    height: 40px;
    text-align: center;
}
/* 停留所アイコン表示/非表示ボタン(画像) */
#switchBusStops img {
	width: 32px;
	height: 32px;
	background: transparent url('../images/ico_menu_busstop.png') no-repeat scroll 0 0;
	background-size: 32px;
}
/* バスアイコン表示/非表示ボタン(画像) */
#switchBuses img {
    width: 32px;
    height: 32px;
    background: transparent url('../images/directions_bus.png') no-repeat scroll 0 0;
    background-size: 32px;
}
/* バスピン留めボタン (画像) */
#switchBusPin img {
    width: 32px;
    height: 32px;
    background: transparent url('../images/ico_menu_pin.png') no-repeat scroll 0 0;
    background-size: 32px;
}
/* バスピン留めボタン (画像) */
#currentPosition img {
    width: 32px;
    height: 32px;
    background: transparent url('../images/ico_target.png') no-repeat scroll 0 0;
    background-size: 32px;
}
/* バスピン留めボタン (画像) */
#searchBusStop img {
    width: 32px;
    height: 32px;
    background: transparent url('../images/ico_menu_search.png') no-repeat scroll 0 0;
    background-size: 32px;
    position: absolute;
    right: 4px;
}
.pax-search-busstop-button {
    position: relative;
    top: 62px !important;
    display: flex;
}
.pax-search-busstop-button-open {
    width: 260px !important;
}
.pax-search-busstop-textbox {
    height: 100%;
    width: 100%;
    outline: none;
    border: none;
    display: none;
}
.pax-search-busstop-button-open .pax-search-busstop-textbox {
    display: block;
}
.pax-search-busstop-button-open-add,
.pax-search-busstop-button-open-remove {
    -webkit-transition: 0.5s ease all;
    transition: .5s ease all;
}
.fixedHeight.ui-autocomplete {
    max-height: 200px;
    overflow-y: auto;
    overflow-x: auto;
    padding-right: 20px;
}

/* ルートパネル */
.pax-maps-toheader {
    opacity: 0.8;
    z-index: 10;
}
/* 停留所アイコン非表示の時はボタンをグレーにする */
.pax-maps-busstop-button-Inactive img {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    filter: grayscale(100%);
    opacity: 0.7;
}
/* 路線を絞り込みボタン */
.pax-maps-select-busline {
    text-align: center;
    margin: 12px 0 12px 0;
}
#map_select_busline {
    background-color: #ff7f00;
    color: #ffffff;
    border-radius: 20px;
    border: 1px solid #c46200;
    padding: 8px 16px;
    cursor: pointer;
}
/* ----- アンケートボタンブリンク ----- */
.switch-text {
    -webkit-animation: switchtext 1.0s infinite alternate;
    -moz-animation: switchtext 1.0s infinite alternate;
    animation: switchtext 1.0s infinite alternate;
}

@-webkit-keyframes switchtext {
 from { opacity: 1.0;}
 to { opacity: 0;}
}

@-moz-keyframes switchtext {
	from {
		opacity: 1.0;
	}

	to {
		opacity: 0;
	}
}

@keyframes switchtext {
	from {
		opacity: 1.0;
	}

	to {
		opacity: 0;
	}
}

.pax-icon-buslocation {
	white-space: nowrap;
}

/* ----- 時刻表をさがす画面--------------------------------------------------*/
.pax-btn-search-ttable-con {
    padding-bottom: 16px;
    display: flex;
    flex-direction: column;
}

.pax-btn-search-ttable {
    display: flex;
    padding: 12px 6px;
    border: 5px solid #FFD600;
    border-radius: 12px;
    background-color: #fff;
    color: #863500;
    font-size: 24px;
    font-size: 2.4rem;
    font-weight: bold;
    box-shadow: 1px 1px 4px 0px rgba(40,58,128,.5);
    justify-content: space-around;
    margin-bottom: 16px;
}

/* ----- バス停からさがす画面--------------------------------------------------*/
.pax-btn-bus-search-ttable-con {
    padding-bottom: 16px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.panel-item {
    width: calc(100% / 5);
}

.pax-btn-bus-ttable {
    display: flex;
    padding: 5px;
    border: 5px solid #FFD600;
    border-radius: 12px;
    background-color: #fff;
    color: #863500;
    font-size: 24px;
    font-size: 2.4rem;
    font-weight: bold;
    box-shadow: 1px 1px 4px 0px rgba(40,58,128,.5);
    justify-content: space-around;
    margin: 6px;
}

.disabled {
    pointer-events: none;
}

.disabled a {
    background-color: darkgrey;
}

/* ----- アラート情報表示 -------------------------------------------------- */
/* ----- パネル左上 ----- */
/* 共通 */
.pax-alert-info-for-busstop,
.pax-alert-info-for-busline,
.pax-alert-info-for-route,
.pax-alert-info-for-route-on-busstop {
    position: absolute;
    display: block;
    width: 40px;
    height: 40px;
    background: transparent url('../images/balloon_notice.png') no-repeat scroll 0 0;
    background-size: 40px;
    z-index: 997;
}

.pax-alert-info-for-busstop img, 
.pax-alert-info-for-busline img, 
.pax-alert-info-for-route img, 
.pax-alert-info-for-route-on-busstop img {
	width: 40px;
	height: 40px;
}

/* バス停パネル, 路線図 - バス停 */
.pax-alert-info-for-busstop, 
.pax-alert-info-for-route-on-busstop {
	top: -16px;
	left: -16px;
}

/* 路線一覧 - 路線 */
.pax-alert-info-for-busline {
	top: -20px;
	left: -16px;
}

/* 路線一覧 - ルート */
.pax-alert-info-for-route {
	top: -8px;
	left: -12px;
}


/* ----- 行内 ----- */
/* 路線一覧 - ルート */
.pax-alert-info-for-busline-of-route {
	position: absolute;
	display: block;
	width: 24px;
	height: 24px;
	top: -10px;
	left: -24px;
	background: transparent url('../images/balloon_iconotice.png') no-repeat scroll 0 0;
	background-size: 24px;
}

.pax-alert-info-for-busline-of-route img {
	width: 24px;
	height: 24px;
}

/* 路線図・時刻表 - ヘッダー */
.pax-alert-info-for-ttable > img, 
.pax-alert-info-for-route-page > img {
	position: relative;
	display: inline-block;
	margin: 0 8px 0 0;
	top: -2px;
	width: 24px;
	height: 24px;
	background: transparent url('../images/balloon_iconotice.png') no-repeat scroll 0 0;
	background-size: 24px;
}


/* ----- モーダルパネル ---------------------------------------------------- */

/* ----- 共通 ----- */
.modal-dialog {
    margin-top: 64px;
}
.modal-content {
    padding: 16px;
    border-radius: 10px;
}

/* モーダルヘッダ */
.modal-header {
    padding: 6px 0 0 0;
    border: 0;
}

/* モーダルタイトル */
.modal-header h3 {
    margin: 0;
    padding: 0;
    color: #203981;
    font-size: 20px;
    font-size: 2rem;
    font-weight: bold;
    text-align: left;
    position: relative;
}

/* モーダル用閉じるボタン */
.modal-dialog .close {
	margin: -12px 16px 0 0;
    background-color: #fff;
    opacity: initial;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    position: absolute;
    right: -15px;
    top: -36px;
}
.modal-dialog .close::before,
.modal-dialog .close::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 3px;
    height: 16px;
    background: #646464;
    border-radius: 2.5px;
}
.modal-dialog .close::before {
    transform: translate(-50%,-50%) rotate(45deg);
}
.modal-dialog .close::after {
    transform: translate(-50%,-50%) rotate(-45deg);
}
.modal-header #feedback_title {
    text-align: center;
}

/* モーダルボディ */
.modal-body {
    padding: 0;
    margin: 16px 0 16px 0;
    position: relative;
}
.pax-info-dialog .modal-body {
    min-height: 80px;
}
.modal-body .feedback_notification {
    color: red;
    text-align: center;
    font-weight: bold;
}

/* モーダルフッタ */
.modal-footer {
    padding: 0;
    border: none;
}

/* モーダルセンタリング */
.modal {
    text-align: center;
    padding: 0 !important;
    white-space: nowrap;
}
.modal::before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -4px;
}
.modal-dialog {
    display: inline-block;
    text-align: left;
    vertical-align: middle;
    max-width: calc(100% - 30px);
    white-space: normal;
    word-break: break-all;
    width: 600px;
}

/* 閉じるボタン */
button.btn-act-close {
	padding: 4px;
	width: 33%;
	border: none;
	border-radius: 8px;
	background-color: #a9a9a9;
	color: #fff;
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 1.5;
}

/* okボタン */
button.btn-act-ok {
    padding: 4px;
    width: 33%;
    border: none;
    border-radius: 8px;
    background-color: #ff7f00;
    color: #fff;
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 1.5;
}

button.btn-act-cancel:focus,
button.btn-act-cancel:hover,
button.btn-act-cancel:active,
button.btn-act-close:focus,
button.btn-act-close:hover,
button.btn-act-close:active {
	background-color: #ff5500;
	color: #fff;
}

button.btn-act-ok[disabled] {
    border: 1px solid rgb(0,0,0,0.3);
    color: rgb(0,0,0,0.3);
}

/* ----- フィードバック・免責事項 ----- */
.modal-dialog .form-group, 
.modal-dialog label {
	color: #863500;
}

#feedback_caution {
    font-size: 0.8em;
    margin-bottom: 10px;
}

.modal-footer .btn {
	display: inline-block;
	padding: 8px 4px;
	width: 33%;
}

.modal-footer .btn i {
	display: inline-block;
	margin: 0 4px 0 0;
}

h3[id^="disclaimer_notes"],
h3[id^="disclaimer_other"] {
    color: #863500;
    font-weight: bold;
    text-align: left;
    font-size: 20px;
    font-size: 2rem;
}

p[id^="disclaimer_"] {
	color: #863500;
	font-size: 18px;
	font-size: 1.8rem;
}

#privacy_policy_frame,
#cookie_policy_frame,
#external_transmission_policy_frame {
    width: 100%;
    border: 0px;
    margin: 0px;
}

/* ----- アラート情報・周辺情報 ----- */
.alertPanel, 
.areaPanel {
	padding: 0 0 16px;
	border-bottom: solid 1px #cacaca;
}

.btn-areaPanel {
	display: block;
	cursor: pointer;
}

.areaPanel-info {
	width: 100%;
}

.areaPane-td + td {
	position: relative;
	padding: 0 0 0 8px;
	max-width: 240px;
}

.areaPane-td + td img {
	max-width: 100%;
}

/* 周辺情報リンクガイド */
.area-link-it { /* エリア名 指差しアイコン */
	display: none;
}

.areaPane-linkName {
    padding: 0 0 12px;
    font-size: 20px;
    font-size: 2rem;
    font-weight: bold;
    text-decoration: underline;
    color: #ff7f00;
}

.areaPanel-info .bs-operator-name {
    margin-left: 6px;
    border-radius: 16px;
}

.alertPanel-memo,
.areaPanel-memo {
	display: block;
	font-size: 16px;
	font-size: 1.6rem;
	color: #000;
	white-space: pre-wrap;
}

.btn-areaPanel:hover .areaPanel-memo {
	color: #ff7f00;
}

.areaPane-td > br {
	display: none;
}

/* 周辺情報遷移確認ダイアログ */
.confirm-dialog-opened {
	padding: 0;
	border: solid 1px #d3d3d3 !important;
	border-radius: 8px;
	font-size: 20px;
	font-size: 2rem;
	z-index: 1051 !important;
}

.ui-widget-header {
	display: none;
}

.ui-dialog .ui-dialog-content {
	padding: 16px;
}

.ui-dialog .ui-dialog-buttonpane {
	margin: 0;
	padding: 0;
	border: none;
	border-top: solid 1px #ccc;
	background-color: transparent;
}

.confirm-dialog-opened .ui-dialog-buttonset {
	float: none !important;
}

.confirm-dialog-opened .ui-button {
	margin: 0 !important;
	width: 50%;
	border: none;
	border-radius: 0 0 8px 0;
	background: transparent none;
	color: #3a7fd8;
	font-size: 16px;
	font-size: 1.6rem;
	font-weight: bold;
}

.confirm-dialog-opened .ui-button:first-child {
	border-right: solid 1px #ccc;
	border-radius: 0 0 0 8px;
}

.confirm-dialog-opened .ui-button:focus, 
.confirm-dialog-opened .ui-button:hover, 
.confirm-dialog-opened .ui-button:active {
	background-color: #3a7fd8;
	color: #fff;
}

.confirm-dialog-opened .ui-button:active {
	webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
	box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
}


/* ----- アラート情報 ----- */
.pax-alert-info-target-name {
    display: inline-block;
    padding: 0 0 12px;
    color: #203981;
    font-size: 20px;
    font-size: 2rem;
    font-weight: bold;
}

.alertPanel-info {
	width: 100%;
}

.pax-alert-info-icon-for-modal {
	float: left;
	position: relative;
	display: inline-block;
	top: -2px;
	margin: 0 8px 4px 0;
	width: 24px;
	height: 24px;
	background: transparent url('../images/balloon_iconotice.png') no-repeat scroll 0 0;
	background-size: 24px;
}

.pax-alert-info-title {
	display: block;
	padding: 0 0 12px;
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: bold;
}

/* ----- 乗り場案内情報 ----- */
.modal-header.panel-heading {
    width:100%;
}
.modal-body-guide {
    padding: 0px 6px;
}

.modal-body-guide-busline,
.modal-body-guide-ext,
.modal-body-guide-route {
    list-style: none;
    padding: 0px;
}

/* 路線名 */
.modal-body-guide-busline > li {
    margin-top: 4px;
}
.modal-body-guide-busline::before {
    content: "";
    display: block;
    border-top: solid 1px #ffd600
}
.modal-body-guide .pax-guide-buslinename {
    font-weight: bold;
    font-size: 18px;
    font-size: 1.8rem;
}

/* 方面 */
.modal-body-guide-ext {
    margin-left: 1.0em;
    text-indent: -1.0em;
}
.modal-body-guide .pax-guide-ext::before {
    content: '\21D2';
    margin-right: 4px;
}
.modal-body-guide .pax-guide-ext {
    font-weight: bold;
    font-size: 16px;
    font-size: 1.6rem;
}

/* ルート名 */
.modal-body-guide-route {
    margin-left: 26px;
    font-size: 12px;
    font-size: 1.2rem;
}

/* ----- お知らせ情報 ----- */
.modal-header .pax-info-icon {
    padding: 0 0 0 30px;
}
.modal-body .pax-information-body {
    white-space: pre-wrap;
}

/* ----- マスコットキャラクターオーバーレイ ------------------------------------------ */
#kokone-panel {
    top: 0px;
    left: 0px;
    margin: 0;
    position: fixed;
    height: 100%;
    /* オーバーレイ用の指定 */
    background-color: rgba(0,0,0,0.7);
    z-index: 9999;
    max-width: 646px;
    width: 100%;
}
/* マスコットキャラクターオーバーレイ - メインコンテンツ */
#kokone-panel .main-content {
	font-size: 1.0em;
	color: #fff;
	margin: 30% 15% 5% 15%;
}
/* マスコットキャラクターオーバーレイ - メインコンテンツのリンク */
#kokone-panel .main-content > a,
#kokone-panel .main-content > a:link,
#kokone-panel .main-content > a:hover,
#kokone-panel .main-content > a:visited,
#kokone-panel .main-content > a:active {
    color: #f25e49;
    text-decoration: underline;
}

/* マスコットキャラクターオーバーレイ - メインコンテンツのフッター */
#kokone-panel .main-content-footer {
	font-size: 1.0em;
	color: #fff;
	margin: 5% 15%;
	text-align: center;
}

/* マスコットキャラクターオーバーレイ - メインコンテンツのフッターのリンク */
#kokone-panel .main-content-footer > a,
#kokone-panel .main-content-footer > a:link,
#kokone-panel .main-content-footer > a:hover,
#kokone-panel .main-content-footer > a:visited,
#kokone-panel .main-content-footer > a:active {
	color: #fff;
}

/* マスコットキャラクターオーバーレイ - メインコンテンツのフッターのリンクの後ろにつけるアイコン */
#kokone-panel .main-content-footer > a:after {
	content: '';
	display: inline-block;
	width: 1.2em;
	height: 1.2em;
	margin-left: 10px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	vertical-align: text-bottom;
	background-image: url('../images/link.png');
}

/* マスコットキャラクターオーバーレイ - マスコットキャラクター画像 */
.character-container.character-tall::before {
    content:none;
}
.character-container.character-tall {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
    height: calc(100vh * 0.5);
}
.character-container.character-tall .character-image {
    top: unset;
    left: unset;
    right: 0;
    bottom: 0;
    height: 88%;
    width: auto;
    pointer-events: none;
    background-position-x: right;
}

/* マスコットキャラクターオーバーレイ - 閉じるボタン */
#btn-kokone-close {
	position: absolute;
	top: 5px;
	right: 20px;
	color: #fff;
	font-size: 3em;
	font-weight: 500;
}

/* 方面名色指定 */
.color-class01 {font-size: 20px; background-color: #000000; color: #FFF;}
.color-class02 {font-size: 20px; background-color: #000080; color: #FFF;}
.color-class03 {font-size: 20px; background-color: #CCFFFF; color: #000;}
.color-class04 {font-size: 20px; background-color: #008000; color: #FFF;}
.color-class05 {font-size: 20px; background-color: #008080; color: #FFF;}
.color-class06 {font-size: 20px; background-color: #009900; color: #FFF;}
.color-class07 {font-size: 20px; background-color: #D7EEFF; color: #000;}
.color-class08 {font-size: 20px; background-color: #800000; color: #FFF;}
.color-class09 {font-size: 20px; background-color: #800080; color: #FFF;}
.color-class10 {font-size: 20px; background-color: #808000; color: #FFF;}
.color-class11 {font-size: 20px; background-color: #808080; color: #000;}
.color-class12 {font-size: 20px; background-color: #C0C0C0; color: #000;}
.color-class13 {font-size: 20px; background-color: #FA8072; color: #000;}
.color-class14 {font-size: 20px; background-color: #FFBBFF; color: #000;}
.color-class15 {font-size: 20px; background-color: #FFD700; color: #000;}
.color-class16 {font-size: 20px; background-color: #483D8B; color: #FFF;}
.color-class17 {font-size: 20px; background-color: #FF88FF; color: #000;}
.color-class18 {font-size: 20px; background-color: #990000; color: #FFF;}
.color-class19 {font-size: 20px; background-color: #009900; color: #FFF;}
.color-class20 {font-size: 20px; background-color: #000099; color: #FFF;}
.color-class21 {font-size: 20px; background-color: #E4FF8D; color: #000;}
.color-class22 {font-size: 20px; background-color: #B6FF01; color: #000;}
.color-class23 {font-size: 20px; background-color: #00ECFF; color: #000;}
.color-class24 {font-size: 20px; background-color: #005FFF; color: #FFF;}
.color-class25 {font-size: 20px; background-color: #5507FF; color: #FFF;}
.color-class26 {font-size: 20px; background-color: #FF0461; color: #000;}
.color-class27 {font-size: 20px; background-color: #FF4F02; color: #000;}
.color-class28 {font-size: 20px; background-color: #8FBC8F; color: #000;}
.color-class29 {font-size: 20px; background-color: #BDB76B; color: #FFF;}
.color-class30 {font-size: 20px; background-color: #D2B48C; color: #000;}

/* ルート名色指定(時刻表) */
.route-color-class01 {color: #EE5A24;}
.route-color-class02 {color: #009432;}
.route-color-class03 {color: #0652DD;}
.route-color-class04 {color: #9980FA;}
.route-color-class05 {color: #833471;}
.route-color-class06 {color: #009900;}
.route-color-class07 {color: #A3CB38;}
.route-color-class08 {color: #1289A7;}
.route-color-class09 {color: #D980FA;}
.route-color-class10 {color: #B53471;}
.route-color-class11 {color: #FFC312;}
.route-color-class12 {color: #C4E538;}
.route-color-class13 {color: #12CBC4;}
.route-color-class14 {color: #FDA7DF;}
.route-color-class15 {color: #ED4C67;}
.route-color-class16 {color: #483D8B;}
.route-color-class17 {color: #FF88FF;}
.route-color-class18 {color: #990000;}
.route-color-class19 {color: #009900;}
.route-color-class20 {color: #000099;}
.route-color-class21 {color: #E4FF8D;}
.route-color-class22 {color: #B6FF01;}
.route-color-class23 {color: #00ECFF;}
.route-color-class24 {color: #005FFF;}
.route-color-class25 {color: #5507FF;}
.route-color-class26 {color: #FF0461;}
.route-color-class27 {color: #FF4F02;}
.route-color-class28 {color: #8FBC8F;}
.route-color-class29 {color: #BDB76B;}
.route-color-class30 {color: #D2B48C;}

/* 戻るアローを削除*/
.fa-arrow-left {
    display: none;
}

/* バスタイプアコーディオンの位置*/
.bus-type-accordion .panel-group{
    margin-top: 10px;
    margin-bottom: 0;
    padding-bottom: 0;
}

/* バスタイプアコーディオンのヘッダ*/
.bus-type-accordion .panel-heading {
    background: #ebebeb;
    padding: 0 10px 0 10px;
    color: #203981;
    border-radius: 10px 10px 10px 10px;
}

/* バスタイプアコーディオンを開いた時の枠設定*/
.bus-type-accordion .panel-open .panel-heading {
    border-radius: 10px 10px 0 0;
}

/* バスタイプアコーディオンのボディ*/
.bus-type-accordion .panel-collapse {
    background: #f4f4f4;
    color: #203981;
    border-radius: 0 0 10px 10px;
}

/* バスタイプアコーディオンのアイコン*/
.accordion-body .bs-bus-type-icon,
.pax-bus-status-icon .bs-bus-type-icon,
.map-bustype-delay .bs-bus-type-icon {
    width: 30px;
    height: 30px;
}

/* バスタイプアコーディオンボディのテキスト*/
.accordion-body span {
    vertical-align: middle;
    line-height: normal;
}

/* バスタイプアイコンを横並び表示*/
.pax-bus-status-icon,
.map-bustype-delay {
    display: inline-flex;
    flex-wrap: wrap;
}

/* 地図のバスタイプアイコンをセンター合わせ*/
.map-bustype-delay {
    justify-content: center;
}

.pax-route-bus-delay{
    display:none;
}

/*近くのバス停画面での説明メッセージ*/
#nearby_search_note {
    color: #fff;
    font-size: 18px;
}

/*近くのバス停マーク*/
.near_busstop {
    background-color: #ffa200;
    color: #fff;
    border-radius: 15px;
    padding: 4px;
    font-size: 12px;
    font-weight: bold;
}

.bus-wrapper {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}
.bus-wrapper .bus-inner {
    width: 91px;
}
/* 走行するバスを表示 */
.character-container.character-bus .character-image {
    animation: fuwafuwa 4s alternate linear infinite;
    animation-timing-function: ease-in-out;
}

/* バスゆらゆらアニメーション */
@keyframes fuwafuwa {
    100% {
        transform: translate(0,-5px)
    }
}

/* ちかくのバス停、お気に入りのボタンを少し大きめにする */
#nearby_for_top, #favorites_for_top {
    padding-top: 20px;
    padding-bottom: 20px;
}

/* ----- LINE ログイン  ------------------------------------------ */
.line-login-bar {
    display: block;
    position: fixed;
    top: 0;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    box-sizing: border-box;
    background-color: #27a7fc;
    padding: 20px;
}

.line-login-bar.ng-hide-add,
.line-login-bar.ng-hide-remove {
    -webkit-transition: all 0.5s 0s linear;
    transition: all 0.5s 0s linear;
    display: block !important;
}

.line-login-bar.ng-hide {
    opacity: 0;
}

.line-login-bar .line-login-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
}
.line-login-bar .line-ad-wrapper {
    width: 100%;
    height: calc(100vh * 0.6);
    padding: 20px;
}
.line-login-bar .line-ad {
    background-image: url(../images/LINE600h.png);
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    background-size: contain;
    width: 100%;
    height: 100%;
}

.line-login-btn-wrapper {
    background-color: #ffffff;
    display: flex;
    flex-direction: column;
    border-radius: 8px;
    padding: 10px;
    max-width: 300px;
    width: 100%;
}
.line-login-btn-wrapper .description{
    text-align: center;
    margin: 6px;
}
.line-login-btn-wrapper .contents {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 6px;
}

/* LINEログインボタン */
.line-login-btn {
    background-color: #06c755;
    color: #ffffff;
    font-weight: bold;
    border-radius: 8px;
    padding: 0;
    border: none;
}
.line-login-btn-overlay {
    display: flex;
    background-color: transparent;
    align-items: center;
    border-radius: 8px;
    border: 1px solid transparent;
}
.line-login-icon {
    background-image: url(../images/line.png);
    background-repeat: no-repeat;
    border-right: 1px rgb(0, 0, 0, 0.08) solid;
    width: 44px;
    height: 44pX;
}
.line-login-text {
    padding: 2px 15px;
}
.line-login-btn:hover .btn-overlay {
    background-color: rgb(0, 0, 0, 0.1);
}
.line-login-btn:active:not(:disabled) .btn-overlay {
    background-color: rgb(0, 0, 0, 0.3);
    border: 1px solid rgb(0, 0, 0, 0.08);
}
.line-login-btn:active:not(:disabled) .line-icon {
    border-right-color: rgb(0, 0, 0, 0.08);
}
.line-login-btn:disabled {
    background-color: #ffffff;
    color: rgba(30,30,30,0.2);
}
.line-login-btn:disabled .btn-overlay {
    border-color: rgba(229,229,229,0.6);
}
.line-login-btn:disabled .line-icon {
    background-image: url(../images/line_disable.png);
    border-right-color: rgba(229,229,229,0.6);
}

/* LINE通知設定モーダルダイアログ */
h3.modal-header-title {
    text-align: center;
}
.modal-body.line_notification .description {
    background-color: #ebebeb;
    color: #203981;
    text-align: center;
    padding: 8px 0;
    margin: 12px 4px;
    font-weight: bold;
}
.modal-body.line_notification .contents {
    color: #863500;
    font-weight: bold;
}
.line_notification_caption {
    padding: 12px 0;
}
.modal-body.line_notification .dayofweek_wrapper {
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin-left: 6px;
}
.modal-body.line_notification .dayofweek {
    border-radius: 50%;
    background-color: #ffffff;
    color: rgb(0,0,0,0.3);
    border: 1px solid rgb(0,0,0,0.3);
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.modal-body.line_notification .dayofweek.disable {
    background-color: rgb(0,0,0,0.3);
    color: #ffffff;
    border-color: #ffffff;
}
/* iPhone 4/SE/5 対応 */
@media screen and (max-width:320px) {
    .modal-body.line_notification .dayofweek {
        width: 32px;
        height: 32px;
        font-size: 16px;
    }
}
.modal-body.line_notification input[type=checkbox]:checked + .dayofweek {
    background-color: #ff7f00;
    color: #ffffff;
    border: none;
}
.modal-body.line_notification input[type=checkbox] {
    display: none;
}
.chk_line_notification_time {
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block;
    padding: 5px 30px;
    position: relative;
    width: auto;
    margin-left: 20px;
}
.chk_line_notification_time::before {
    background: #fff;
    border: 2px solid rgb(29,27,32,0.3);
    content: '';
    display: block;
    height: 20px;
    width: 20px;
    left: 0px;
    margin-top: -9px;
    position: absolute;
    top: 50%;
}
.chk_line_notification_time::after {
    border-right: 3px solid #ff7f00;
    border-bottom: 3px solid #ff7f00;
    content: '';
    display: block;
    height: 20px;
    left: 10px;
    margin-top: -14px;
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: rotate(45deg);
    width: 8px;
}
.modal-body.line_notification input[type=checkbox]:checked + .chk_line_notification_time::after {
    opacity: 1;
}
.modal-body.line_notification .message_wrapper {
    text-align: center;
}
.modal-body.line_notification .line_notification_message {
    color: #ff0000;
}

/* 地図からさがすの路線絞り込み */
.busLineLabel {
    background-color: #ffd600;
    border-radius: 100vh;
    color: #863500;
    text-align: center;
    width: fit-content;
    padding: 6px;
}

.selectedReleaseButton {
    background-color: transparent;
    opacity: initial;
    border: none;
}

.max-maps-selected-busline-wrapper {
    overflow-x: auto;
}
.max-maps-selected-busline-inner {
    white-space: nowrap;
}
.max-maps-selected-busline-button {
    display: inline-block;
    margin: 1px 5px 8px 5px;
}
.busLineGroupHeader {
    padding: 2px;
    background: gray;
    color: white;
    display: block;
    min-height: 30px;
}

.busLineGroupDetail {
    padding-left: 10px;
    display: flex;
    flex-wrap: nowrap;
    word-break: keep-all;
    gap: 10px;
}

.busLineGroupDetail label {
    margin: unset;
}

.modal-body.select-busline {
    max-height: 50vh;
    overflow-y: scroll;
    margin-right: -15px;
    margin-left: -15px;
    row-gap: 5px;
    display: flex;
    flex-direction: column;
}

/* 言語ごとのフォント設定 */
.lang-en {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.lang-ja {
    font-family: 'BIZ UDPGothic', 'Helvetica Neue', Helvetica,Arial, sans-serif;
}

.lang-zh-CN {
    font-family: "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}

.lang-zh-TW {
    font-family: "Noto Sans TC", "PingFang TC", "Hiragino Sans CNS", "Microsoft JhengHei", sans-serif;
}

.lang-ko {
    font-family: "Noto Sans KR", "Apple SD Gothic Neo", Gulim, "Malgun Gothic", sans-serif;
}

/* 運賃コンポーネントのスタイル */
.pax-route-panel-body .pax-fare {
    margin: 0 -8px;
    font-size: 12px;
    font-size: 1.2rem;
    padding: 5px 10px;
}
.pax-route-panel-body .bs-fare-stop {
    display: inline-block;
    padding: 0px 5px;
    border: 1px solid #ccc;
    border-radius: 15px;
}
.pax-route-panel-body .bs-fare-price {
    font-weight: bold;
}
.pax-route-panel-body hr {
    margin-top: 5px;
}