html, body {
    font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    color: #393939;
    font-size: 100%;
    overflow: hidden;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    scrollbar-width: thin;
}

@font-face {
    font-family: 'NotoSansJP-Medium';
    font-style: normal;
    font-weight: 500;
    src: url('//fonts.bus-routes.net/NotoSansJP-Medium-Subset20250908.woff2') format('woff2');
    font-display: swap;
}

@font-face {
    font-family: 'NotoSansJP-Regular';
    font-style: normal;
    font-weight: 400;
    src: url('//fonts.bus-routes.net/NotoSansJP-Regular-Subset.woff2') format('woff2');
    font-display: swap;
}

#home {
    margin: 0;
    width: 100%;
    height: 100%;
    min-height: 100%;
}

.ui-content {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    min-height: 100%;
}

/* 地図キャンバス */
#map_canvas {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    min-height: 100%;
    z-index: 0;
}

.gm-tilt {
    display:none;
}

.search_popup {
    font-size: 0.875rem;
}

/* maplibre関連 */

.maplibregl-popup {
    /* max-widthを上書きしないと、240pxになる */
    max-width: 340px !important;
    background-color: transparent !important;
    box-shadow: none;
}

.select_box .maplibregl-popup-content {
    border: none;
    background-color: transparent !important;
    margin: 0px;
    padding: 0px;
    box-shadow: none;
    overflow: visible;
    z-index: 100000;
}

.maplibregl-popup-close-button {
    display: none;
}

.maplibregl-marker {
    cursor: pointer; /* マウスカーソルを指の形に変更 */
}

.marker {
    will-change: transform;
}

.maplibregl-popup-tip {
    display: none;
}

.tooltip .maplibregl-popup-content {
    /*margin: -16px 0px 0px 0px;*/
    font-size: 14px;
    padding: 4px;
    color: #333;
    background-color: #fff;
}

.maplibregl-popup-content {
    min-width: 0px !important;
    overflow: visible;
}

.maplibregl-ctrl-attrib {
    right: -4px !important;
    bottom: -4px !important;
}

.maplibregl-ctrl-scale {
    margin-left: 24px !important;
    margin-bottom: -40px !important;
}

.maplibregl-ctrl-bottom-right {
    right: min(10px, env(safe-area-inset-right));
}

.maplibregl-ctrl-bottom-left {
    left: min(10px, env(safe-area-inset-left));
}

:root {
    --safe-area-inset-bottom: env(safe-area-inset-bottom, 0px);
}

/* ズームボタン */
.zoom {
    width: 48px;
    height: 46px;
    right: 4px;
}

.specify {
    display: none;
    font-family: 'NotoSansJP-Regular';
    font-weight: 400;
    font-size: 0.75rem;
    text-align : center;
    vertical-align: middle;
    position: absolute;
    color: white;
    background-color: #003f88;
    /*width: 50px;*/
    padding: 0px 4px;
    height: 20px;
    line-height: 20px;
    border-radius: 3px;
    z-index: 1;
    cursor: default;
}

.warn_label {
    display: none;
    position: absolute;
    background-color: #003f88;
    color: white;
    font-size: 0.875rem;
    text-align: center;
    padding: 4px 10px;
    line-height: 20px;
    bottom: 16px;
    left: 50%;
    min-width: 196px;
    transform: translateX(-50%);
    border-radius: 5px;
}

#warn_gtfs {
    padding: 4px 4px;
    min-width: 256px;
}

.warn_inframe {
    bottom: 4px !important;
}

.bus_site {
    color: #00e617;
    cursor: pointer; 
}

.fullscreen {
    width: 48px;
    height: 32px;
    font-size: 0.75rem !important;
    z-index: 0;
    cursor: default;
    border-radius: 5px;
}

#bridge1 {
    display: none;
    right: 50px;
}

#bridge2 {
    display: none;
    right: 170px;
}

#bridge3 {
    display: none;
    right: 232px;
}

#bridge4 {
    display: none;
    right: 263px;
}

.bridge {
    position: fixed;
    width: 8px;
    height: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 11;
    cursor: default;
}

.bridge::before,
.bridge::after {
    content: '';
    position: absolute;
    background-color: #003f88;
    height: 2px;
    width: 100%;
}

.bridge::before {
    top: 0;
}

.bridge::after {
    bottom: 0;
}

.bridge .bridge-space {
    background-color: #d8e698;
    height: 4px;
    width: 100%;
}

.bridge-vertical {
    position: fixed;
    width: 8px;
    height: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 11;
    cursor: default;
}

.bridge-vertical::before,
.bridge-vertical::after {
    content: '';
    position: absolute;
    background-color: #003f88;
    width: 2px;
    height: 100%;
}

.bridge-vertical::before {
    left: 0;
}

.bridge-vertical::after {
    right: 0;
}

.bridge-vertical .bridge-space {
    background-color: #d8e698;
    width: 4px;
    height: 100%;
}

#specify {
    top: 4px;
    right: 56px;
}

#fullscreen {
    top: 4px;
    left: 4px;
    cursor: pointer;
}

/* ロゴ */
.logo {
    display: none;
    position: absolute;
    height: 19px;
    width: 74px;
    background-image: url("//bus-routes.net/imgs/logo/yu-logo@2x.png");
    -webkit-background-size: 74px 19px;
    -moz-background-size: 74px 19px;
    -ms-background-size: 74px 19px;
    -o-background-size: 74px 19px;
    background-size: 74px 19px;
    z-index: 0;
    cursor: pointer;
}

.yado-logo {
    background-image: url("//bus-routes.net/imgs/logo/yadococo@2x.png");
}

.bus-logo {
    height: 19px;
    width: 90px;
    background-image: url("//bus-routes.net/imgs/logo/bus-logo@2x.png");
    -webkit-background-size: 90px 19px;
    -moz-background-size: 90px 19px;
    -ms-background-size: 90px 19px;
    -o-background-size: 90px 19px;
    background-size: 90px 19px;
}

a.la {
    text-decoration: none !important;
    font-size: 12px !important;
    font-weight: bold !important;
}
a.la:link { color: #003f88 !important;}
a.la:visited { color: #003f88 !important; }
a.la:hover { color: #003f88 !important; }
a.la:active { color: #003f88 !important; }

.notes {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: absolute;
    left: 4px;
    bottom: 30px;
    width: 300px;
    pointer-events: auto;
    cursor: default;
}

.slogo {
    align-self: flex-start;
    font-weight: bold;
    font-size: 0.8175rem;
    color: #003f88;
    text-decoration: none;
    cursor: pointer;
}

.stime {
    font-size: 0.8175rem;
}

a {
    text-decoration: none;
    font-weight:bold;
    font-size: 0.875rem;
}
a:link {
    color:#003f80;
}
a:visited {color:#003f80;}
a:hover {color:#003f80; }
a:active {color:#003f80;}

.jlogo {
    margin-bottom: -2px;
}

.mlogo {
    color: #c53d43;
}

/* ロゴ */
#logo {
    top: 2px;
    left: 4px;
    display: none;
}

/* 地図 */
#map {
    display: none;
    top: 4px;
}

/* 表示 */
#display {
    display: none;
    top: 56px;
}

/* 交通 */
#transport {
    display: none;
    top: 108px;
}

/* 検索 */
#search {
    display: none;
    top: 160px;
}

/* 機能 */
#action {
    display: none;
    top: 212px;
}

/* 消去ボタン */
#clear {
    display: none;
    top: 264px;
}

/* ONボタン */
#on {
    display: none;
    bottom: 34px;
}

/* 計測終了ボタン */
#finish {
    display: none;
    top: 212px;
}

/* 停止ボタン */
#stop_tracking {
    display: none;
    width: 48px;
    height: 32px;
    bottom: 16px;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 5px;
}

/* +ボタン */
#zoom_in {
    display: none;
    bottom: 80px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom: 1px solid #003f88;
}

#zoom_in::after {
    width: 2px;
    height: 18px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* -ボタン */
#zoom_out {
    display: none;
    bottom: 34px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top: 1px solid #003f88;
}

/* 地図メニュー */

/* 標準 */
#standard {
    top: 4px;
    right: 56px;
}

/* 白黒 */
#mono {
    top: 4px;
    right: 114px;
}

/* 写真 */
#photo {
    top: 4px;
    right: 172px;
}

/* 地理院 */
#gsi {
    top: 52px;
    right: 56px;
}

/* ダーク */
#dark {
    top: 52px;
    right: 114px;
}

/* 衛星（Mapbox） */
#satellite {
    top: 52px;
    right: 172px;
}

/* 淡色ラスタ */
#pale {
    top: 100px;
    right: 56px;
}

/* 標準ラスタ */
#std {
    top: 100px;
    right: 114px;
}

/* 標準Vector */
#vector {
    top: 100px;
    right: 172px;
}

/* OpenStreetMap */
#osm {
    top: 148px;
    right: 56px;
}

/* Geolonia Map */
#geolonia {
    top: 148px;
    right: 114px;
}

/* OFF */
#empty {
    top: 148px;
    right: 172px;
}

/* 陰影図 */
#shade {
    top: 4px;
    right: 234px;
}

/* 標高図 */
#relief {
    top: 52px;
    right: 234px;
}

/* 市町村 */
#city {
    top: 100px;
    right: 234px;
}

#google {
    right: 56px;
    top: 208px;
}

#yahoo {
    right: 114px;
    top: 208px;
}

#locasma {
    right: 172px;
    top: 208px;
}

#apple {
    right: 56px;
    top: 246px;
}

#bing {
    right: 114px;
    top: 246px;
}

#osmand {
    right: 172px;
    top: 246px;
}

/* 表示メニュー */
/* グルメ */
#gourmet {
    top: 56px;
    right: 56px;
}

/* 日帰り温泉 */
#higaeri {
    top: 56px;
    right: 114px;
}

#higaeri::before,
#hotel::before {
    content: '';                            /* 三角形を作成 */
    position: absolute;                     /* 絶対配置 */
    bottom: -0px;                           /* ボタンの垂直方向の中央 */
    left: 1px;                              /* ボタン内の左余白 */
    transform: translateY(-50%);            /* 垂直方向の中央揃え */
    width: 0;
    height: 0;
    border-top: 3px solid transparent;      /* 三角形の上側の透明部分 */
    border-bottom: 3px solid transparent;   /* 三角形の下側の透明部分 */
    border-right: 5px solid #666;         /* 三角形の色とサイズ */
}

#higaeri.bon::before,
#hotel.bon::before {
    content: none;
}

/* 天気 */
#weather {
    top: 104px;
    right: 56px;
}

/* 宿 */
#hotel {
    top: 104px;
    right: 114px;
}

/* 山 */
#mountain {
    top: 152px;
    right: 56px;
}

/* 泉質 */
#senshitsu {
    top: 152px;
    right: 114px;
}

/* 座標 */
#location {
    top: 200px;
    right: 56px;
}

/* 温泉地 */
#onsenchi {
    top: 200px;
    right: 114px;
}

/* コンビニ */
#conveni {
    top: 248px;
    right: 78px;
    width: 72px;
    height: 42px;
    border-top: 0px solid #003f88;
}

/* 交通メニュー */
/* 高速バス */
#express {
    top: 66px;
    right: 78px;
    width: 72px;
    height: 42px;
    border-bottom: 0px solid #003f88;
}

/* GTFS */
#GTFS {
    top: 108px;
    right: 56px;
}

.gtfs_label {
    display: block;
    color: #026947;
    font-size: 12px;
}

/* 旧バス */
#bus {
    top: 108px;
    right: 114px;
}

.bus_label {
    color: #003f88;
    font-size: 12px;
}

/* 鉄道 */
#railway {
    top: 156px;
    right: 56px;
}

/* 渋滞 */
#traffic {
    top: 156px;
    right: 114px;
}

/* 道の駅 */
#michieki {
    top: 204px;
    right: 56px;
}

/* SAPA */
#sapa {
    top: 204px;
    right: 114px;
}

/* シェアサイクル */
#bike {
    top: 252px;
    right: 56px;
}

.gbfs_label {
    color: #d23f3f;
    font-size: 12px;
}

/* フェリー */
#ferry {
    top: 252px;
    right: 114px;
    font-size: 13px;
}

/* 空港 */
#airport {
    top: 300px;
    right: 56px;
}

/* レンタカー */
#car {
    top: 300px;
    right: 114px;
    font-size: 11px;
}

/* 機能メニュー */
#search_position {
    top: 212px;
    right: 56px;
}

/* 記憶 */
#memory {
    top: 212px;
    right: 114px;
}

/* OFF */
#off {
    top: 212px;
    right: 172px;
}

/* 距離計測 */
#distance {
    top: 260px;
    right: 56px;
}

/* URL */
#URL {
    top: 260px;
    right: 114px;
}

/* リスト */
#list {
    top: 260px;
    right: 172px;
}

/* 文字の大きさ */
#label_size {
    top: 308px;
    right: 56px;
    width: 116px;
}

/* 使い方 */
#help {
    top: 308px;
    right: 172px;
}

/* アプリのように使う */
#use_app {
    top: 172px;
    right: 56px;
    width: 174px;
    height: 36px;
}

/* 文字サイズメニュー */
#small_label {
    top: 360px;
    right: 194px;
    font-size: 12px;
}

#middle_label {
    top: 360px;
    right: 148px;
    font-size: 13px;
}

#large_label {
    top: 360px;
    right: 102px;
    font-size: 14px;
}

#huge_label {
    top: 360px;
    right: 56px;
    font-size: 16px;
}

/* 検索メニュー */
#search_gourmet {
    top: 160px;
    right: 56px;
}

#search_onsen {
    top: 160px;
    right: 114px;
    width: 116px;
}

#search_room {
    top: 208px;
    right: 56px;
}

#search_yado {
    top: 208px;
    right: 114px;
}

#search_onsenchi {
    top: 208px;
    right: 172px;
}

#search_station {
    top: 256px;
    right: 56px;
}

#search_michieki {
    top: 256px;
    right: 114px;
}

#search_sapa {
    top: 256px;
    right: 172px;
}

#search_addr {
    top: 304px;
    right: 56px;
}

#search_path {
    top: 304px;
    right: 114px;
}

#search_mount {
    top: 304px;
    right: 172px;
}

/* ラベルメニュー */
#name, #yname {
    right: 114px;
}

#price, #charge {
    right: 154px;
}

#time, #rating {
    right: 194px;
}

#check-in {
    top: 16px;
    right: 238px;
    height: 36px;
}

#check-in::before {
    content: '';                            /* 三角形を作成 */
    position: absolute;                     /* 絶対配置 */
    bottom: 1px;                            /* ボタンの垂直方向の中央 */
    left: auto;                             /* ボタン内の左余白 */
    width: 0;
    height: 0;
    border-left: 3px solid transparent;     /* 三角形の上側の透明部分 */
    border-right: 3px solid transparent;    /* 三角形の下側の透明部分 */
    border-top: 5px solid #666;           /* 三角形の色とサイズ */
}

#check-in.bon::before {
    content: none;
}

/* 日帰りメニュー */
#onsen {
    top: 56px;
    right: 176px;
}

#sento {
    top: 104px;
    right: 176px;
}

#yado {
    top: 152px;
    right: 176px;
}

#ashiyu {
    top: 200px;
    right: 176px;
}

#other {
    top: 248px;
    right: 176px;
}

#tennen {
    top: 56px;
    right: 238px;
}

#kake {
    top: 104px;
    right: 238px;
}

#sroten {
    top: 152px;
    right: 238px;
}

#ssauna {
    top: 200px;
    right: 238px;
}

#sdiscount {
    top: 248px;
    right: 238px;
}

#open_close {
    top: 300px;
    right: 180px;
    width: 112px;
    height: 36px;
}

/* 宿メニュー */
#roten {
    top: 56px;
    right: 176px;
}

#spa {
    top: 104px;
    right: 176px;
}

#big {
    top: 152px;
    right: 176px;
}

#sauna {
    top: 200px;
    right: 176px;
}

#smoking {
    top: 248px;
    right: 176px;
}

#single {
    top: 296px;
    right: 176px;
}

.acc {
    display: none;
    font-size: 13px !important;
    height: 41px !important;
    right: 238px;
    line-height: 1.2rem !important;
}

/* 宿泊日メニュー */
#day0 {
    top: 56px;
}

#day1 {
    top: 97px;
}

#day2 {
    top: 138px;
}

#day3 {
    top: 179px;
}

#day4 {
    top: 220px;
}

#day5 {
    top: 261px;
}

#day6 {
    top: 302px;
    height: 42px !important;
}

#day7 {
    top: 56px;
    right: 296px;
}

#day8 {
    top: 97px;
    right: 296px;
}

#day9 {
    top: 138px;
    right: 296px;
}

#day10 {
    top: 179px;
    right: 296px;
}

#day11 {
    top: 220px;
    right: 296px;
}

#day12 {
    top: 261px;
    right: 296px;
}

#day13 {
    top: 302px;
    right: 296px;
    height: 42px !important;
}

/* 泉質メニュー */
#tanjun {
    top: 56px;
    right: 176px;
}

#ryusan {
    top: 56px;
    right: 234px;
}

#enka {
    top: 104px;
    right: 176px;
}

#sansei {
    top: 104px;
    right: 234px;
}

#tansan {
    top: 152px;
    right: 176px;
}

#tetsu {
    top: 152px;
    right: 234px;
}

#iou {
    top: 200px;
    right: 176px;
}

#nisan {
    top: 200px;
    right: 234px;
}

#housha {
    top: 248px;
    right: 176px;
}

#youso {
    top: 248px;
    right: 234px;
}

#kounou {
    top: 300px;
    right: 205px;
    background-position: 0px -480px;
}

/* ルート検索 */
#walk {
    top: 108px;
    left: 4px;
}

#cycling {
    top: 108px;
    left: 62px;
}

#drive1 {
    top: 108px;
    left: 120px;
}

#drive2 {
    top: 108px;
    left: 178px;
}

#clear_route {
    display: none;
    width: 58px;
    height: 28px;
    top: 4px;
    left: 174px;
    z-index: 2;
    border-radius: 5px;
}

#close_route {
    display: none;
    width: 28px;
    height: 28px;
    top: 4px;
    left: 236px;
    z-index: 2;
    border-radius: 5px;
}

#change_route {
    display: none;
    width: 28px;
    height: 68px;
    top: 36px;
    left: 236px;
    border-radius: 5px;
}

#search_route {
    display: none;
    top: 108px;
    left: 206px;
    width: 58px;
    height: 48px;
    border-radius: 5px;
}

#search_address {
    display: none;
    width: 48px;
    height: 32px;
    top: 4px;
    z-index: 2;
    border-radius: 5px;
}

#result_address {
    position: absolute;
    display: none;
    top: 4px;
    left: 4px;
    font-size: 0.875rem;
    background: rgba(255,255,255,0.0);
}

.item_box {
    margin-top: -1px;
    border: 1px solid #003f88;
    background-color: #fff6e4;
    cursor: pointer;
}

.item_box:hover,
.item_box:focus {
    background-color: #d7f6de;
}

.item_name {
    margin: 0px 2px;
    font-size: 0.875rem;
    font-weight: bold;
}

.item_addr {
    margin: 0px 2px;
    height: 16px;
    font-size: 0.75rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    -webkit-text-overflow: ellipsis; /* Safari */
    -o-text-overflow: ellipsis; /* Opera */
}

.item_address {
    font-weight: bold;
    margin: 2px 2px;
    height: 44px;
    font-size: 0.875rem;
}

.address_box {
    background: rgba(255,255,255,0.0);
}

.mapbox_data {
    height: 30px;
    font-size: 1.0rem;
}

/* オプションボタン */
.option {
    display: flex;
    align-items: center;
    font-family: "NotoSansJP-Regular";
    justify-content: center;
    margin: 0px;
    padding: 0px;
    width: 48px;
    height: 48px;
    line-height: 1.1rem;
    font-size: 0.875rem;
    font-weight: normal;
    text-decoration: none;
    color: #333;
    border-radius: 5px;
    cursor: pointer;
}

.tap_btn {
    display: inline-block;
    padding: 0px 4px;
    height: 40px;
    line-height: 40px;
    font-size: 1.0rem;
    font-weight: normal;
    text-decoration: none;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    text-align: center;
    vertical-align: middle;
    color: #fff;
    opacity: 0.9;
    border-radius: 5px;
    cursor: pointer;
}

.next_sapa_btn {
    height: 24px;
    min-width: 72px;
    text-align: left;
    margin: 2px 2px;
    padding: 0px 0px 0px 4px;
    line-height: 24px;
    opacity: 1.0;
    font-size: 0.875rem;
}

.sapa_edit_btn {
    height: 32px;
    width: 32px;
    margin: 2px 4px;
    line-height: 32px;
    font-size: 0.875rem;
}

.sapa_arrow {
    width: 260px;
    width: 16px;
    height: 16px;
    margin: 2px auto;
    display: block;
}

.sapa_note {
    position: absolute;
    right: 4px;
    bottom: 30px;
}

/* 楽天ボタン */
.rakuten {
    height: 44px;
    line-height: 44px;
    font-size: 0.875rem;
    font-weight: normal;
    text-decoration:none;
    text-shadow: 0 1px 1px rgba(255, 255, 255, .3);
    color: #333;
    text-align: center;
    border-radius: 5px;
    cursor: pointer;
}

.option:hover,
.option:focus,
.woption:hover,
.woption:focus,
.tap_btn:hover,
.tap_btn:focus,
.rakuten:hover,
.rakuten:focus,
.obtn:hover,
.obtn:focus,
.gbtn:hover,
.gbtn:focus {
    background-image: -webkit-linear-gradient(top, rgba(255,255,255,.2), rgba(0,0,0,0));
    background-image:    -moz-linear-gradient(top, rgba(255,255,255,.2), rgba(0,0,0,0));
    background-image:     -ms-linear-gradient(top, rgba(255,255,255,.2), rgba(0,0,0,0));
    background-image:      -o-linear-gradient(top, rgba(255,255,255,.2), rgba(0,0,0,0));
    background-image:         linear-gradient(top, rgba(255,255,255,.2), rgba(0,0,0,0));
}

.btnbox {
    display: flex;
    width: 100%;
    margin: 4px 2px 0px;
}

.onflag {
    position: fixed;
    display: none;
    background: #b6cf45;
    border-radius: 50%;
    height: 8px;
    width: 8px;
    z-index: 100;
}

.wiki {
    margin-right: 4px;
}

#map_on {
    top: 8px;
    right: 8px;
}

#disp_on {
    top: 60px;
    right: 8px;
}

#trans_on {
    top: 112px;
    right: 8px;
}

/* ルート */
.groute, .broute {
    background-color: #d2e9eb;
}

/* FIT */
.bfit {
    background-color:#dee7e9;
}

/* 消去 */
.bclear {
    background-color:#727171;
    color: #fff;
    text-decoration: none;
    text-shadow: initial;
}

.gclear {
    background-color: #d8e698;
}

.ball {
    background-color:#d2e9eb;
}

#bzoom {
    background-color:#dedbc3;
}

#norikae {
    background-color:#f0dce2;
}

#bRail, #bFerry {
    background-color:#ebe6d6;
}

#bBus, #gBus {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    height: 48px;
    width: 48px;
    background-color:#ebe6d6;
}

#site {
    background-color:#f0dce2;
}

#csite {
    position: relative;
    background: linear-gradient(180deg, #f0dce2 0%, #f0dce2 70%, #fda523 30%, #fda523 100%);
}

.coupon {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 48px;
    height: 15px;
}

#rakuten {
    background-color:#dde0c9;
}

.under_raku {
    border-bottom: solid 2px #09b303;
    padding-top: 4px;
    padding-bottom: 2px;
}

.under_hot {
    border-bottom: solid 2px #cc121b;
    padding-top: 4px;
    padding-bottom: 2px;
}

.underbar {
    padding-top: 4px;
    padding-bottom: 2px;
}

.underbar.red {
    border-bottom: solid 2px #cc121b;
}

.underbar.orange {
    border-bottom: solid 2px #fa9332;
}

.underbar.green {
    border-bottom: solid 2px #09b303;
    width: 40px;
}

#gsearch {
    background-color:#f0dad8;
}

#place {
    background-color: #d2e9eb;
}

#traf {
    background-color:#c0e3e5;
}

#outside {
    background-color:#d2d8e3;
}

#yimage {
    background-color:#e5dee9;
}

#skyview {
    background-color:#f5ddb9;
}

#route {
    background-color:#d2e2d8;
}

#access {
    background-color:#7a4171;
}

#ana {
    background-color: #ced8fc;
}

#jal {
    background-color: #fddbd9;
}

#finfo {
    background-color:#e5dee9;
}

#gift {
    width: 98px;
    background-color: #d2e9eb;
}

/* 温泉地メニュー */
#circle {
    background-color:#ede0df;
}

#fit2 {
    background-color:#dee7e9;
}

#choose {
    background-color:#c6cbd6;
}

#fit {
    background-color:#dee7e9;
    margin: 5px 2px 5px 1px;
}

#wnews {
    background-color:#b2dbeb;
}

#jma {
    width: 122px;
    background-color:#dde0c9;
}

#tenki {
    width: 122px;
    background-color:#ebe6d6;
}

#gpv {
    width: 122px;
    background-color:#dee7e9;
}

#windy {
    width: 123px;
    background-color:#ebdcdd;
}

#windy-full {
    background-color:#ebdcdd;
}

#rfix {
    background-color: #d2e2d8;
    flex-grow: 1;
    margin: 0px 4px 0px 0px;
}

#spano {
    background-color: #ebe6d6;
    flex-grow: 1;
    margin: 0px 4px 0px 0px;
}

/* 住所 */
td.ad {
    font-size: 1.125rem;
    line-height: 26px;
    vertical-align: middle;
}

/* 地名かな */
td.ka {
    font-size: 0.75rem;
    line-height: 12px;
    vertical-align: bottom;
    padding-top: 8px;
}

/* 都市名 */
td.ct {
    width: 240px;
    font-size: 1.25rem;
    line-height: 2.5rem;
    color:#fff;
    background: #5b8f8f;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    font-weight: normal;
    vertical-align: middle;
}

td.amedas {
    color: #333;
    font-size: 1.25rem;
    padding: 8px;
}

td.wt {
    width: 56px;
    vertical-align: middle;
}

img.wt {
    padding: 2px;
    /*width: 48px;*/
    height: 48px;
}

td.tm {
    width: 136px;
    padding-top: 4px;
    vertical-align: middle;
}

td.utc {
    padding-bottom: 4px;
}

span.temp {
    font-size: 2.5rem;
    line-height: 42px;
    vertical-align: middle;
}

td.wd {
    width: 56px;
    vertical-align: middle;
}

td.wl {
    padding: 2px;
}

/* 天気予報ボタン */
.woption {
    display: table-cell;
    width: 250px;
    height: 48px;
    line-height: 18px;
    font-size: 0.875rem;
    font-weight: normal;
    text-decoration: none;
    text-align:center;
    vertical-align: middle;
    border-radius:5px;
    cursor: pointer;
}

#request {
    display: none;
    position: absolute;
    width: auto;
    height: 48px;
    top: 4px;
    right: 56px;
    line-height: 48px;
    padding: 0px 8px;
    font-size: 0.875rem;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    color: #fff;
    text-decoration: none;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    background-color: #003f88;
    border-radius: 5px;
    z-index: 3;
}

#room_label {
    display: none;
    position: absolute;
    top: 4px;
    right: 170px;
    width: 32px;
    height: 48px;
    z-index: 1;
    -webkit-background-size: 32px 48px;
    -moz-background-size: 32px 48px;
    -ms-background-size: 32px 48px;
    -o-background-size: 32px 48px;
    background-size: 32px 48px;
}

#room_info {
    display: none;
    position: absolute;
    top: 4px;
    right: 56px;
    width: 98px;
    height: 44px;
    text-align: right;
    line-height: 44px;
    vertical-align: middle;
    z-index: 0;
    background-color: rgba(255,255,255,0.85);
    padding: 0px 8px 0px 0px;
    border: 2px solid #003f88;
    border-radius: 5px;
    font-size: 1.0rem;
    font-weight: bold;
    text-decoration: none;
    /*text-shadow: 0 1px 1px rgba(0, 0, 0, .3);*/
}

#charge_pt {
    position: absolute;
    display: none;
    border-right: 4px solid transparent;
    border-bottom: 10px solid #83CC83;
    border-left: 4px solid transparent;
    top: 6px;
    right: 100px;
    z-index: 2;
}

#rating_pt {
    position: absolute;
    display: none;
    border-top: 10px solid #8099E4;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
    top: 40px;
    right: 78px;
    z-index: 2;
}

.room_bar {
    position: absolute;
    display: none;
    width: 30px;
    height: 4px;
    z-index: 1;
    opacity: 0.5;
}

#charge_bar {
    top: 6px;
}

#rating_bar {
    top: 46px;
}

#next {
    display: none;
    position: absolute;
    top: 316px;
    right: 4px;
}

#prev {
    display: none;
    position: absolute;
    top: 368px;
    right: 4px;
}

.rakuten_info {
    text-align: center;
    width: 258px;
    border: 1px solid #003f88;
    background-color: #fff;
    border-radius: 3px;
    font-size: 1.0rem;
    margin: 2px -1px 0px 0px;
}

.rakuten_header {
    display: inline-block;
    width: 250px;
    font-size: 0.875rem;
    line-height: 16px;
    text-align: center;
    margin: 0px;
    padding: 4px;
    text-align: center;
    background: #003f88;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    color: #fff;
}

.bath, .service {
    display: inline-block;
    padding: 0px 4px;
    margin: 0px 2px 2px;
    height: 24px;
    line-height: 24px;
    font-size: 0.875rem;
    text-decoration:none;
    text-shadow: none;
    text-align: center;
    vertical-align: middle;
    color: #fff;
    border-radius: 3px;
}

.service  {
    padding: 0px 2px;
    margin: 0px 2px 2px;
}

.bath_spa {
    background-color: #CF6268;/*#c53d43;*/
    /*background-color: #C94F55;   */
}

.bath_on, .service_on {
    background-color: #427CDB;/*#003f88;*/
    /*background-color: #0055B7; */
}

.bath_off, .service_off {
    background-color:#ccc;
    font-weight: normal;
    text-shadow: 0 0 0;
}

.tanjun {
    background-color: #C94F55;
}

.enka {
    background-color: #C774A6;
}

.tansan {
    background-color: #7896e7;
}

.iou {
    background-color: #F49A0A;
}

.housha {
    background-color: #829F31;
}

.ryusan {
    background-color: #3DA4A7;
}

.sansei {
    background-color: #E87358;
}

.tetsu {
    background-color: #8F8265;
}

.nisan {
    background-color: #56B3E5;
}

.youso {
    background-color: #f86829;
}

.flag {
    display: inline-block;
    /*padding: 0px 3px;
    margin: 0px 2px 2px;*/
    padding: 0px 0px;
    /*margin: 0px 2px 2px;*/
    min-width: 34px;
    height: 24px;
    line-height: 24px;
    font-size: 0.875rem;
    white-space: nowrap;
    text-decoration:none;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    text-align: center;
    vertical-align: middle;
    color: #fff;
    border-radius: 3px;
    flex-grow: 1;
}

.flag_spa {
    background-color: #CF6268;
}

.flag_on {
    background-color: #427CDB;
}

.flag_off {
    background-color:#ccc;
    font-weight: normal;
    text-shadow: 0 0 0;
}

.price_rank {
    width: 48px;
    height: 16px;
    padding: 0px 4px 4px;
    cursor: default;
}

.photo_box {
    position: relative;
    width: 250px;
    padding: 0px 4px 4px;
}

img.yado_photo {
    width: 100%;
    height: auto;
    object-fit: contain;
    max-width: 246px;
    max-height: 200px;
    min-height: 168px;
    cursor: pointer;
}

.gphoto_box {
    position: relative;
    width: 38px;
    padding: 0px 8px 4px;
}

img.gourmet_photo {
    width: 238px;
    height: auto;
    max-width: 238px;
    max-height: 238px;
    object-fit: contain;
    cursor: default;
}

.photo_box p {
    position: absolute;
    top: 0px;
    padding: 4px;
    margin: 0px;
    left: 50%;
    -ms-transform: translate(-50%, 0%);
    -webkit-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
    color: white;
    background: #003f88;
    text-decoration:none;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    font-size: 0.875rem;
    line-height: 1rem;
    cursor: pointer;
}

.sml {
    display: inline-block;
    font-size: 0.75rem;
}

/* 十字 */
#crosshair {
    position: absolute;
    display: none;
    width: 22px;
    height: 22px;
    top: 50%;
    left: 50%;
    -webkit-background-size:22px 22px;
    -moz-background-size:22px 22px;
    -ms-background-size:22px 22px;
    -o-background-size:22px 22px;
    background-size:22px 22px;
    background-image: url("//bus-routes.net/imgs/other/cross@2x.png");
    z-index: 0;
    pointer-events: none;
}

/* 位置情報 */
#location_info {
    position: absolute;
    display: none;
    top: 4px;
    left: 4px;
    margin: 0px;
    z-index: 0;
    background-color: rgba(255,255,255,0.7);
    padding: 1px 4px;
    border: 2px solid #003f88;
    border-radius: 5px;
    font-size: 0.875rem;
}

/* ツールチップ */
#tooltip {
    border:1px solid #444;
    margin: 0px;
    padding: 2px 4px;
    background: #fff;
    font-size: 0.875rem;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    text-align: center;
}

/* 情報BOX */
.info_box {
    font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif !important;
    width: 254px;
    border: 1px solid #444;
    margin: 0px;
    padding: 1px 2px 2px 2px;
    background-color: #fff6e4;
    font-size: 0.875rem;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    z-index: 200001;
}

/*.yadobox {
    border-bottom-left-radius: 20px !important;
    border-bottom-right-radius: 20px !important;
    padding: 1px 2px 36px 2px;
}
*/

.hotel_box {
    font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif !important;
    width: 258px;
    border: 1px solid #444;
    margin: 0px;
    padding: 0px;
    background-color: #fff6e4;
    font-size: 0.875rem;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    z-index: 200001;
}

.hotel_container {
    margin: 0px;
    padding: 1px 2px 2px 2px;
}

.vacant_box {
    display: flex;
    height: 36px;
}

.vacant_cell {
    flex: 1;
    text-align: center;
    line-height: 1.0rem;
    background-color: #b5b5b5;
    /*border-right: 1px solid #888;*/
    /*border-bottom-color: #444;*/
    margin: 0px;
    padding: 2px 0px;
    font-size: 0.75rem;
    cursor: pointer;
}

.vacant_cell:last-child {
    border-right: none;
}

/*
.room_box {
    display: flex;
    margin: -34px -2px 0px 0px;
    width: 260px;
}

.room_cell {
    width: 36px;
    padding: 2px 0px;
    margin: 0px -1px 0px 0px;
    border: 1px solid #888;
    border-bottom-color: #444;
    font-size: 0.75rem;
    color: #333;
    text-align: center;
    line-height: 0.9rem;
    background-color: #b5b5b5;
}

.room_right {
    border-bottom-right-radius: 8px;
    border-right-color: #444;
}

.room_left {
    border-bottom-left-radius: 8px;
    border-left-color: #444;
}
*/

.room_on {
    background-color: #d8e698;
}

.rlow {
    background-color: #7b7c7d !important;
}

.rhigh {
    background-color: #93ca76;/*#32cd32;*/
}

.gtfs_box {
    font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif !important;
    width: 254px;
    border: 1px solid #444;
    margin: 0px;
    padding: 1px 2px 2px 2px;
    background-color: #fff;
    font-size: 0.875rem;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}

.simple_box {
    margin: 0px;
    padding: 1px 2px 0px 2px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

/* 中央寄せ */
.center_box {
    text-align: center;
}

/* 画像全般 */
img {
    vertical-align: middle;
    margin: 0px;
    cursor: pointer;
}

/* テーブル内の画像を上下中央に配置 */
td img {
    display: inline-block;
    vertical-align: middle;
}

/* バス停イメージ */
img.bs {
    width: 32px;
    height: 32px;
    padding-bottom: 4px;
    cursor: default;
}

/* バスイメージ */
img.bus {
    width: 32px;
    height: 32px;
    padding: 2px;
    vertical-align: -12px;
    cursor: default;
}

img.con1 {
    width: 36px;
    height: 16px;
    margin: 0px 8px 2px 0px;
    cursor: default;
}

img.con2 {
    width: 36px;
    height: 16px;
    margin: 0px 8px 2px 0px;
    cursor: default;
}

img.con3 {
    width: 60px;
    height: 16px;
    margin: 0px 8px 2px 0px;
    cursor: default;
}

/* 駅イメージ */
img.st {
    width: 32px;
    height: 32px;
    padding: 2px 4px 2px 2px;
    vertical-align: -12px;
    cursor: pointer;
}

/* 歩く人 */
img.walking {
    cursor: default;
    width: 28px;
    height: 28px;
    margin: 0px 6px;
}

/* 32×32pxイメージ */
img.i32 {
    cursor: default;
    width: 32px;
    height: 32px;
    padding-right: 5px;
}

img.i28 {
    cursor: default;
    vertical-align: middle;
    width: 28px;
    height: 28px;
    padding: 0px 2px 1px 0px;
}

/* 24×24pxイメージ */
img.i24 {
    cursor: default;
    vertical-align: middle;
    width: 24px;
    height: 24px;
    margin: 0px 4px 1px 0px;
}

img.f24 {
    cursor: default;
    width: 24px;
    height: 24px;
    margin: 0px 2px 1px;
}

img.oi24 {
    cursor: default;
    vertical-align: middle;
    width: 24px;
    height: 24px;
    margin: 0px 4px 4px 0px;
}

img.sp24 {
    cursor: default;
    width: 24px;
    height: 24px;
    margin: 0px 0px;
    padding: 0px;
}

img.sp20 {
    cursor: default;
    vertical-align: middle;
    padding: 1px;
    width: 20px;
    height: 20px;
}

img.sp16 {
    cursor: default;
    vertical-align: middle;
    padding: 8px 32px 0px 0px;
    width: 16px;
    height: 16px;
}

img.i20 {
    cursor: default;
    vertical-align: middle;
    width: 20px;
    height: 20px;
}

img.s24 {
    margin: 0px 1px 0px 0px;
}

img.i14 {
    cursor: default;
    width: 14px;
    height: 14px;
    margin: 0px 2px 2px 0px;
	vertical-align: middle;
}

img.i16 {
    cursor: default;
    width: 16px;
    height: 16px;
    margin-right: 2px;
}

img.g16 {
    cursor: default;
    width: 16px;
    height: 16px;
    margin-bottom: 2px;
}

img.b16 {
    cursor: default;
    width: 20px;
    height: 20px;
    margin: 0px 2px 0px 8px;
}

/* 禁煙 */
img.ns18 {
    cursor: default;
    width: 18px;
    height: 18px;
    margin: 4px 2px 2px;
}

/* テーブル */
table.tb {
    table-layout: fixed;
    border-collapse:collapse;
    border: 0px;
    padding: 0px;
    margin: 2px 0px 0px 1px;
    width: 252px;
}

/* スクロールするテーブル */
.scrollable_table {
    max-height: 256px;
    overflow-y: auto;
    display: block;
}

.scrollable_sapa {
    max-height: 224px;
    overflow-y: auto;
    display: block;
}

table.tbl {
    border-collapse:collapse;
    border: 0px;
    padding: 0px;
    margin: 2px 0px 0px 1px;
    width: 252px;
}
/* PCはスクロールバーをつける */
.pc_bar::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.pc_bar::-webkit-scrollbar-track {
    border-radius: 10px;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, .1);
}

.pc_bar::-webkit-scrollbar-thumb {
    background-color: #bbb;
    border-radius: 10px;
    box-shadow:0 0 0 1px rgba(255, 255, 255, .3);
}

/* テーブル */
table.fx {
    table-layout: fixed;
    border-collapse:collapse;
    border: 0px;
    width: 100%;
    margin: 1px 0px 0px 0px;
}

/* テーブル */
table.wk {
    table-layout: fixed;
    border-collapse:collapse;
    border: 0px;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}

/* 天気 */
table.wt {
    margin: 2px 0px 0px;
}

td.line1 {
    line-height: 1.0rem;
    padding: 0px 0px 0px 0px;
    margin: 0px;
}

td.line2 {
    line-height: 1.0rem;
    padding: 0px 0px 8px 0px;
    margin: 0px;
}

span.hot {
    color: rgb(255, 111, 39);
}

span.hottest {
    color: rgb(218, 0, 0);
}

span.cold {
    color: rgb(0, 128, 255)
}

/* シェアサイクル*/
table.bike {
    border-spacing: 0;
    border-collapse: separate;
    border-radius: 10px;
}

.bike_box {
    width: 252px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    margin: 2px 4px;
}

.bh {
    height: 32px;
    line-height: 32px;
    border-radius: 32vh;
    min-width: 100px;
    color: #fff;
    text-align: center;
    vertical-align: middle;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    margin: 2px 4px 4px;
}

.bok {
    background-color: #09b303;
}

.bng {
    background-color: #cc121b;
}

.bd {
    height: 32px;
    width: 100px;
    color: #fff;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    /*text-shadow: 0 1px 1px rgba(0, 0, 0, .3);*/
    text-decoration: none;
    font-size: 1.75rem;
    margin: 0px 4px;
}

.tok {
    color: #09b303;
}

.tng {
    color: #cc121b;
}

.example {
	font-size: 0.8rem !important;
	vertical-align: top;
}

.bike_container, .michieki_container {
    font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif !important;
    width: 254px;
    border: 1px solid #444;
    margin: 2px 0px 2px 0px;
    padding: 0px 2px 2px 2px;
    background-color:#fff6e4;
    font-size: 0.875rem;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

#bike_chart_box {
    width: 250px;
    height: 126px;
    padding: 0px;
}

#bike_chart {
    cursor: pointer;
}

td.bn {
    display: table-cell;
    width: 252px;
    height: 32px;
    vertical-align: middle;
    text-align: center;
    /*color:#fff;
    background-color: #5b8f8f;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    */
    color: #333;
    padding: 3px 0 1px;
}

td.bn img {
    vertical-align: middle;
}

/* min-width:を付けないとchromeで表示されない */
td.bt1 {
    background-color: #ffff00;
    height: 3px;
    min-width: 10px;
}

td.bt2 {
    background-color: #00ff00;
    height: 3px;
    min-width: 10px;
}

td.bt4 {
    background-color: #00ffff;
    height: 3px;
    min-width: 10px;
}

td.bt8 {
    background-color: #ff00ff;
    height: 3px;
    min-width: 10px;
}

td.ul {
    /*background-color: #5b8f8f;*/
    height:8px;
}

/* 駅名 */
td.sn {
    display: table-cell;
    width: 252px;
    height: 32px;
    vertical-align: middle;
    text-align: center;
    /*color:#fff;
    background: #5b8f8f;*/
    font-size: 1.375rem;
    color: #333;
    /*font-weight: bold;*/
    /*text-shadow: 0 1px 1px rgba(0, 0, 0, .3);*/
    padding: 3px 0 1px;
}

td.st1 {
    background-color: #003f88;
    height: 3px;
    min-width: 10px;
}

td.st2 {
    background-color: #ff8c00;
    height: 3px;
    min-width: 10px;
}

td.st4 {
    background-color: #a52a2a;
    height: 3px;
    min-width: 10px;
}

td.st8 {
    background-color: #008000;
    height: 3px;
    min-width: 10px;
}

td.bb {
    height: 48px;
    color: #313131;
    text-align: center;
    vertical-align: middle;
    margin: 0px;
}

td.rt {
    text-align: center;
    vertical-align: middle;
    font-size: 1.0rem;
    margin: 4px;
}

td.cn {
    height: 48px;
    -webkit-background-size: 24px 24px;
    -moz-background-size: 24px 24px;
    -ms-background-size: 24px 24px;
    -o-background-size: 32px 24px;
    background-size: 24px 24px;
    background-repeat: no-repeat;
    background-position: right 50%;
    background-image: url('//bus-routes.net/imgs/other/arrow@2x.png');
    vertical-align: middle;
    border-top: solid 1px #34495e;
    border-bottom: solid 1px #34495e;
    cursor: pointer;
    color: #005599;
}

/* 事業者名 */
span.cn {
    display: table-cell;
    height: 48px;
    width: 220px;
    font-size: 1.0rem;
    font-weight: bold;
    text-align: left;
    vertical-align: middle;
    cursor: pointer;
}

span.cn1 {
    background-color: #f5deb3;
}

span.cn2 {
    background-color: #90ee90;
}

span.cn4 {
    background-color: #afeeee;
}

span.cn8 {
    background-color: #e6e6fa;
}

/* 路線名 */
td.ln {
    width: 200px;
    font-size: 0.875rem;
    line-height: 20px;
    padding: 1px 2px 1px 4px;
    margin: 0px;
    vertical-align: middle;
}

/* 路線アイコン */
td.gi {
    width: 20px;
    vertical-align: middle;
    cursor: default;
}

td.gb {
    vertical-align: middle;
    border-bottom: solid 1px #003f88;
    padding: 2px 0px;
}

/* 路線名(GTFS) */
td.gl {
    width: 190px;
    font-size: 0.875rem;
    line-height: 22px;
    padding: 1px;
    margin: 0px;
    color: #1A0DAB;
    vertical-align: middle;
    cursor: pointer;
}

td.gd {
    font-size: 0.875rem;
    line-height: 16px;
    text-align: right;
    padding: 1px 2px;
}

/* 時刻表 */
td.tt {
    text-align: left;
    padding: 1px 2px;
    border-bottom: solid 1px #34495e;
}

td.line {
    /*background-color: #ffffff;*/
    background-color:#fff6e4;
}

/* 路線アクティブ */
.lact {
    background-color: #d8e698;
}

/* 全路線 */
td.lall {
    background-color: #cef6fe;
}

/* 路線名(鉄道) */
td.rl {
    width: 200px;
    font-size: 0.875rem;
    line-height: 16px;
    padding: 1px 2px;
    margin: 0px;
    border-bottom: solid 1px #34495e;
}

/* 運行本数 */
td.nn {
    font-size: 0.875rem;
    line-height: 16px;
    text-align: right;
    padding: 1px 4px;
    margin: 0px;
    border-bottom: solid 1px #34495e;
}

div.op {
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    color: #fff;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    padding: 2px 3px;
    margin: 0px 2px 1px 4px;
    border-radius: 3px;
    font-size: 0.875rem;
    font-weight: normal;
}

.gtpop .maplibregl-popup-content {
    background-color: transparent;
    box-shadow: none;
    border: none;
    z-index: 0 !important;
}

.gtime {
    height: 20px;
    background-color: #003f88;
    border-width: 0px;
    border-radius: 3px;
    border: none;
    box-shadow: none;
    padding: 0px 4px;
    color: #fff;
    text-align: center;
    vertical-align: middle;
    text-shadow: 0px 1px 1 rgba(0,0,0,.3);
    font-size: 0.75rem;
    opacity: 1;
    z-index: 0;
}


/* 長距離 */
div.ld {
    background-color: #008b8b;
}

/* フェリー */
div.fd {
    background-color: #008b8b;
    padding: 0px 3px;
    margin-left: 6px;
}

/* 駅接続 */
div.cs {
    background-color: #0000cc;
}

/* ANA */
div.ANA {
    background-color: #13448f;
    font-size: 0.8175rem;
    margin: 0px 0px 0px 2px;
    padding: 0px 2px;
}

/* JAL */
div.JAL {
    background-color: #cc0100;
    font-size: 0.8175rem;
    margin: 0px 0px 0px 2px;
    padding: 0px 2px;
}

/* MCC */
div.MCC {
    background-color: #000000;
    font-size: 0.8175rem;
    margin: 0px 0px 0px 2px;
    padding: 0px 2px;
}

/* LCC */
div.LCC {
    background-color: #9c308c;
    font-size: 0.8175rem;
    margin: 0px 0px 0px 2px;
    padding: 0px 2px;
}

/* 朝食 */
div.bf {
    margin: 4px 2px;
    font-size: 0.75rem;
    background-color: #008b8b;
}

/* 夕食 */
div.dn {
    margin: 4px 2px;
    font-size: 0.75rem;
    background-color: #ee7800;
}

/* ボタンカラム */
td.bc {
    width: 46px;
    line-height: 46px;
    padding: 0px 1px 1px;
    margin: 0px;
    vertical-align: middle;
}

/* ルート*/
.route_head {
    font-size: 1.25rem;
    padding:4px;
}

/* ルート情報 */
td.ri {
    font-size: 1.0rem;
    text-align: left;
    padding: 4px;
    border-top:#739a3d 1px dashed;
    border-bottom:#739a3d 1px dashed;
    /*width: 156px;*/
}

table.tb tbody,
table.tb thead {
    display:block;
    empty-cells: show;
}

/* スクロール用 */
tbody.sb {
    display: block;
    overflow-y: scroll;
    max-height: 240px;
    /*-webkit-overflow-scrolling: auto;*/
}

/* スクロールなし */
tbody.ns {
    display:block;
    overflow-y:hidden;
}

/*スクロール用*/
thead.scrollHead,tbody.scrollBody {
    display:block;
}

tbody.scrollBody {
    overflow-y:scroll;
    height:100px;
}

/* 山名読み仮名 */
td.kn {
    font-size: 0.75rem;
    line-height: 12px;
    vertical-align: bottom;
    padding-top: 8px;
}

/* 山名 */
td.mn {
    font-size: 1.25rem;
    line-height: 26px;
    vertical-align: top;
    border-bottom: solid 1px #34495e;
}

/* 標高 */
td.ev {
    font-size: 1.0rem;
    padding-top: 5px;
    padding-bottom: 1px;
}

/* 都道府県 */
td.ar {
    font-size: 0.875rem;
    padding-bottom: 3px;
}

/* 名山 */
td.mz {
    font-size: 0.875rem;
    padding-top: 3px;
    padding-bottom: 3px;
    border-top: solid 1px #34495e;
}

/* ヘッダテーブル */
table.ob {
    table-layout: fixed;
    border-collapse:collapse;
    border-spacing: 0px;
    padding: 0px;
    margin: 2px 0px 0px 1px;
    border: 0px;
    width: 252px;
}

/* 情報テーブル */
table.ot {
    table-layout: fixed;
    border-collapse:collapse;
    padding: 0px;
    border: 0px;
    margin: 0px 1px;
    width: 250px;
}

table.yt {
    table-layout: fixed;
    border-collapse:collapse;
    padding: 0px;
    border: 0px;
    margin: 0px 1px;
    width: 250px;
}

table.rt {
    table-layout: fixed;
    border-collapse:collapse;
    padding: 0px;
    border: 0px;
    margin: 2px 1px 0px 1px;
    width: 210px;
}

/* 温泉名(サブ) */
div.os {
    font-size: 0.875rem;
    line-height: 1.2rem;
}

/* 温泉名(メイン) */
div.om {
    font-size: 1.25rem;
    line-height: 1.4rem;
    font-weight: normal;
}

.gn {
    flex-grow: 1;
    height: 48px;
    vertical-align: middle;
    text-align: center;
    color: #fff;
    font-size: 0.875rem;
    font-weight: normal;
    background: #5b8f8f;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    cursor: default;
    margin: 2px;
}

.goff {
    display: none !important;
}

.gred {
    color: red !important;
}

.gplus {
    font-size: 0.75rem;
    position: absolute;
    right : 8px;
    top: 34px;
    color: #fff;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
}

.bplus {
    font-size: 0.75rem;
    position: absolute;
    right : 8px;
    top: 23px;
    color: #fff;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
}

.on {
    flex-grow: 1;
    height: 48px;
    vertical-align: middle;
    text-align: center;
    color: #fff;
    border-radius: 5px;
    font-size: 0.875rem;
    font-weight: normal;
    text-decoration: none;
    cursor: pointer;
    margin: 2px;
}

.on:hover,
.on:focus,
.gbox:hover,
.gbox:focus {
    background-image: -webkit-linear-gradient(top, rgba(255,255,255,.1), rgba(0,0,0,0));
    background-image:    -moz-linear-gradient(top, rgba(255,255,255,.1), rgba(0,0,0,0));
    background-image:     -ms-linear-gradient(top, rgba(255,255,255,.1), rgba(0,0,0,0));
    background-image:      -o-linear-gradient(top, rgba(255,255,255,.1), rgba(0,0,0,0));
    background-image:         linear-gradient(top, rgba(255,255,255,.1), rgba(0,0,0,0));
}

.off {
    flex-grow: 1;
    height: 48px;
    vertical-align: middle;
    text-align: center;
    color: #fff;
    font-size: 0.875rem;
    font-weight: normal;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    cursor: normal;
    margin: 2px;
}

.closed {
    text-align: center;
    color: rgb(255, 60, 60);
    font-weight: bold;
    font-size: 1.0rem;
    padding: 2px;
}

.closing {
    text-align: center;
    color: rgb(255, 60, 60);
    font-weight: bold;
    font-size: 1.0rem;
    padding: 2px 0px 0px;
}

.open {
    text-align: center;
    color: rgb(0, 128, 255);
    font-weight: bold;
    font-size: 1.0rem;
    padding: 2px 0px 0px;
}

.aon {
    width: 252px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center; 
    height: 48px;
    text-align: center;
    color: #fff;
    border-radius: 5px;
    font-size: 0.875rem;
    font-weight: normal;
    text-decoration: none;
    cursor: pointer;
    margin: 0px;

}

a.aon:hover,
a.aon:focus {
    background-image: -webkit-linear-gradient(top, rgba(255,255,255,.1), rgba(0,0,0,0));
    background-image:    -moz-linear-gradient(top, rgba(255,255,255,.1), rgba(0,0,0,0));
    background-image:     -ms-linear-gradient(top, rgba(255,255,255,.1), rgba(0,0,0,0));
    background-image:      -o-linear-gradient(top, rgba(255,255,255,.1), rgba(0,0,0,0));
    background-image:         linear-gradient(top, rgba(255,255,255,.1), rgba(0,0,0,0));
}

a.aon,
a.aon:link,
a.aon:visited,
a.aon:hover,
a.aon:active {
  color: #fff !important;          /* 常に白文字 */
  text-decoration: none !important; /* 下線なし */
}

.price, .time1, .time2 {
    font-size: 1.0rem;
    font-weight: bold;
    color: #555;
}

.time2 {
    font-size: 0.875rem;
    font-weight: bold;
    color: #555;
}

.holiday {
    color: red;
    font-weight: bold;
}

.discount_btn {
    position: absolute;
    top: -16px;
    right: -16px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    background: #fff;
    border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, .1);
    color: #158b2b;
    text-align: center;
    font-size: 0.875rem;
    font-weight: bold;
    text-shadow: 0 1px 1px rgba(255, 255, 255, .3);
    z-index: 2;
    cursor: pointer;
}

.discount_btn:hover {
    -webkit-transform: scale(1.2);
    transform: scale(1.1);
    transition: all 0.3s;
    background: #d8e698;
}

.gender_btn {
    position: absolute;
    top: -16px;
    left: -16px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    background: #fff;
    border-radius: 50%;
    border: 0px;
    color: #158b2b;
    text-align: center;
    font-size: 0.875rem;
    font-weight: bold;
    z-index: 2;
    cursor: pointer;
}

.male {
    background: #65B877;/*#88c997;*/
    color: #fff;
}

.female {
    background: #ED7C7C;/*#f5b2b2;*/
    color: #fff;
}

.switch_btn {
    top: -32px;
    right: 0px;
    width: 36px;
    height: 28px;
    line-height:  28px;
    border: 1px solid #003f88 !important;
    border-radius: 5px;
}

.flex_box {
    width: 252px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    margin: 3px 0px 3px 1px;
    padding: 0px;
}

.flex_box2 {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    margin: 4px 0px 2px 0px;
    padding: 0px;
}

.flex_box3 {
    width: 152px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    margin: 4px 0px 2px 50px;
    padding: 0px;
}

.flex_box4 {
    width: 204px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    margin: 4px 0px 4px 25px;
    padding: 0px;
}

.flex_center {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    margin: 4px 0px 0px 0px;
    padding: 0px;
}

.flex_service {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    margin: 2px 0px 0px 0px;
    padding: 0px;
}

.onsenchi_box {
    display: flex;
    flex: 0 0 100%;
    order: 2;
    flex-direction: row;
    flex-wrap: nowrap;
    -webkit-justify-content: center;
    justify-content: center;
    margin: 4px 0px 2px;
}

.facility_box {
    display: flex;
    flex: 0 0 100%;
    flex-direction: row;
    flex-wrap: nowrap;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    margin: 0px 0px 2px 3px;
}

.quality_box {
    display: flex;
    flex: 0 0 100%;
    flex-direction: row;
    flex-wrap: wrap;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    margin: 4px 0px 0px 0px;
}

.flag_box {
    display: flex;
    flex: 0 0 100%;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 3px;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    height: 24px;
    line-height: 24px;
    margin: 1px 2px;
}

.sapa_box {
    margin: 4px 4px 2px;
}

.sp_box {
    text-align: right;
    margin: 4px 4px 2px;
    padding-bottom: 4px;
}

.next_sapa_box {
    /*display: none;*/
    font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif !important;
    width: 258px;
    border: 1px solid #444;
    margin: 2px 0px;
    /*background-color: #fff6e4;*/
    font-size: 0.875rem;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    z-index: 200001;
}

#next_sapa {
    display: flex;
    width: 252px;
    justify-content: center;
    padding: 0px 4px;
}

.sapa_btn {
    height: 32px;
    line-height: 32px;
}

.sapa_list {
    width: 253px;
    margin: 2px 2px;
}

.road_name {
    text-align: left;
    font-weight: bold;
    padding-left: 0px;
    width: 220px;
}

.sp_name {
    width: auto;
}

.sp_dist {
    width: 70px;
    padding: 2px;
    text-align: right;
    vertical-align: middle;
}

.small_font {
    font-size: 0.75rem;
}

.next_separation {
    border-top: solid 1px #888;
}

.route_box {
    width: 250px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 8px 0px;
}

.moyori_box {
    display: flex;
    flex-wrap: wrap;
    justify-content: left;
    align-items: center;
}

.moyori {
    min-width: 100px;
}

.mess1 {
    line-height: 1.25rem;
    padding: 0px;
    margin-top: -8px;
}

.mess2 {
    line-height: 1.25rem;
    padding: 0px;
    margin-bottom: -8px;
}

.oa {
    text-align: center;
    vertical-align: center;
    font-size: 0.875rem;
    margin: 0px;
    padding: 2px 0px 4px;
    width: 252px;
    /*width: 100%;*/
}

.ooa {
    text-align: center;
    vertical-align: center;
    font-size: 0.875rem;
    margin: 0px;
    padding: 0px 0px 0px;
    width: 100%;
}

.bob {
    border-bottom:#003f88 1px solid;
}

.oad {
    text-align: center;
    vertical-align: center;
    font-size: 0.875rem;
    margin: 0px;
    padding: 4px 0px 0px;
    width: 100%;
}

.ya {
    text-align: center;
    vertical-align: center;
    font-size: 0.875rem;
    margin: 0px 0px;
    padding: 0px;
    width: 100%;
}

.room_param {
    font-size: 0.875rem;
    text-align: center;
}

.room_container {
    display: flex;
    background-color: #e7fde7;
    border: 1px solid #444;
    margin: 2px 0px;
    font-size: 0.875rem;
    width: 258px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.disc {
    background-color: #ffe7dd;
}

.plan_box {
    padding: 2px 4px 0px;
    width: 200px;
    cursor: pointer;
}

p.open_p,
p.null_p {
    color: #3388cc;
    font-weight: bold;
    border-bottom: 1px solid #a9a9a9;
    cursor: pointer;
    margin: 0;
}

.open_p:after,
.open_p.active:after {
    margin-left: 10px;
}

.open_p.active::after {
    color: #ee7800;
    content: "▲";
}

.open_p::after {
    color: #ee7800;
    content: "▼";
}

.p_info {
    margin: 4px 0px 0px !important;
    padding: 0px;
    font-size: 0.75rem;
}

.charge_box {
    display: flex;
    justify-content: flex-end;
    align-content: flex-end;
}

.charge_info {
    margin: 3px 0px 0px 2px;
    font-weight: bold;
    vertical-align: bottom;
    font-size: 1.0rem;
}

.chen {
    margin: 8px 0px 0px 2px;
    font-weight: bold;
    font-size: 0.75rem;
    vertical-align: bottom;
}

.reserve {
    font-size: 0.875rem;
    align-self: center;
    background-color: #009999;
    text-decoration:none;
    color: #fff;
    width: 36px;
    height: 36px;
    line-height: 36px;
    margin: 4px;
}

.rank_btn {
    width: 44px;
    height: 44px;
    line-height: 44px;
    margin: 0px;
    padding: 0px;
    font-size: 0.875rem;
    text-decoration:none;
    border: solid 2px #003f88;
    text-shadow: 0 1px 1px rgba(255, 255, 255, .3);
    color: #333;
    text-align: center;
    border-radius: 5px;
    cursor: pointer;
}

.rank_box {
    display: flex;
    flex: 0 0;
    justify-content: space-between;
    margin: 4px 0px 0px 1px;
    width: 252px;
}

.rank_text {
    font-size: 0.875rem;
    line-height: 18px;
    text-align: center;
    padding: 4px 0px 0px;
}

.val {
    font-size: 1.0rem;
    padding: 0px 0px 4px;
}

#raku_plan {
    width: 80px;
    height: 44px;
    line-height: 44px;
    background-color: #E7FEE6;
    text-decoration:none;
    border: solid 2px #09b303;
    color:#333;
}

#charge_rank {
    display: flex;
    flex-flow: column wrap;
    justify-content: center;
    align-content: center;
    width: 76px;
    background-color: #CCEACC;
    border: solid 2px #CCEACC;
    text-decoration:none;
    color:#333;
}

#rating_rank {
    display: flex;
    flex-flow: column wrap;
    justify-content: center;
    align-content: center;
    width: 76px;
    background-color: #D4DDF6;
    border: solid 2px #D4DDF6;
    text-decoration:none;
    color:#333;
}

.active_mode {
    border: solid 2px #003f88 !important;
}

.gray {
    background-color: #cccccc !important;
    cursor: default;
}

/* 温泉ヘッダ */
td.oh {
    width: 46px;
    height: 28px;
    font-size: 0.9375rem;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    color:#888;
    margin-bottom: 2px;
}

/* 温泉情報 */
td.oi {
    text-align: left;
    vertical-align: middle;
    font-size: 0.9375rem;
    padding: 2px;
    width: 206px;
}

td.cancel_out {
	text-decoration: line-through;
}

td.om {
    text-align: left;
    vertical-align: middle;
    font-size: 0.75rem;
    padding: 2px;
    width: 206px;
}

/* SAPAヘッダ */
td.sph {
    width: 58px;
    height: 28px;
    font-size: 0.9375rem;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    margin-bottom: 2px;
}

td.c1 {
	color: #d23f40;
}
td.c2 {
	color: #ea7900;/* #ff8c0a; */
}
td.c3 {
	color: #b2383e;
}
td.c4 {
	color: #3e62ad;
}
td.c5 {
	color: #0073e0;
}
td.c6 {
	color: #455765; /*#E5001A;*/
}
td.c7 {
	color: #953436;
}
td.c8 {
	color: #7a4171;
}
td.c16, td.c17 {
	color: #f96e29;
}
td.c32 {
	color: #B6391A;
}
td.c64, td.c65, td.c65, div.c65 {
	color: #00846C;
}
td.c128 {
	color: #474b42;
}

td.m0 {
    color: #1e50a2;
}
td.m1 {
	color: #ee7800;
}
td.m2, td.m3 {
	color: #c53d43;
}

td.y1 {
	color: #4a488e;
}
td.y2 {
	color: #d0576b;
}
td.y3 {
	color: #f39800;
}
td.y4 {
	color: #769164;
}

td.sp1 {
    color: #006eb0;
}
td.sp2 {
    color: #ee7800; 
}
td.sp3 {
    color: #385a37;
}

td.g1 {
    color: #db2822;
}
td.g2 {
    color: #b33e5c;
}
td.g3 {
    color: #288c66;
}
td.g4 {
    color: #7b8d42;
}
td.g5 {
    color: #f3981d;
}
td.g6 {
    color: #147f3a;
}
td.g7 {
    color: #e70013;
}
td.g8 {
    color: #bb5535;
}
td.g9 {
    color: #ec6800;
}
td.g10 {
    color: #ec6800;
}
td.g11 {
    color: #00ac97;
}
td.g12 {
    color: #00afcc;
}
td.g13 {
    color: #2b2b2b;
}
td.g14 {
    color: #0075c2;
}
td.g15 {
    color: #9fc24d;
}
td.g16 {
    color: #683f36;
}
td.g17 {
    color: #e70013;
}

/* レンタカー */
td.rc0 {
    color: #003f88;
}

td.rc13 {
    color: #fc0000;
}

td.rc14 {
    color: #0f3a61;
}

td.rc16 {
    color: #231e1f;
}

td.rc19 {
    color: #082c6e;
}

td.rc20 {
    color: #ec0000;
}

td.rc26 {
    color: #ec0000;
}

td.rc30 {
    color: #231e1f;
}

td.rc56 {
    color: #fc0000;
}

td.rc422 {
    color: #0073d3;
}

/* シェアサイクル */
td.bk1 {
    color: #000000;
}

td.bk2 {
    color: #cc0133;
}

/* 2行 */
div.l2 {
    font-size: 0.875rem;
    line-height: 1.25rem;
    /*text-align: center;*/
    padding: 0px;
}

div.c2 {
    font-size: 0.875rem;
    line-height: 1.25rem;
    text-align: center;
    padding: 0px;
}

/* 設備 */
td.ot {
    text-align: center;
    padding: 2px 0px 0px;
    width: 100%;
}

td.hh {
    padding: 4px;
    text-decoration: none;
    font-size: 1.0rem;
    text-align: center;
    background-color: #003f88;
    color: #fff;
    font-weight: normal;
    text-shadow: 0 0px 0px rgba(0, 0, 0, .3);
}

/* モバイル用TEL */
.tl {
    color: #06F;
    font-size: 1.0rem;
    font-weight: bold;
}

.wm {
    font-size: 0.875rem;
}

.rate {
    position: relative;
    display: inline-block;
    width: 86px;
    height: 16px;
    font-size: 1.0rem;
    vertical-align: middle;
}

.rate:before, .rate:after {
    position: absolute;
    left: 0;
    content: '★★★★★';
    display: inline-block;
    height: 16px;
    line-height: 16px;
}

.rate:before {
    color: #ccc;
}

.rate:after {
    overflow: hidden;
}

.access {
    border: 1px solid #003f88;
	background-color: rgba(255,255,255,0.5);
    color: #333;
    text-decoration: none;
    text-shadow: initial;
    font-size: 0.875rem;
    padding: 0px 4px;
    margin: 0px 8px;
	vertical-align : middle;
    height: 24px;
    line-height: 24px;
}

.moyori {
    margin: 0px;
}

.st_access {
    border: 1px solid #003f88;
	background-color: rgba(255,255,255,0.5);
    color: #333;
    text-decoration: none;
    text-shadow: initial;
    font-size: 0.875rem;
    padding: 0px 4px;
    margin: 0px;
    height: 24px;
    line-height: 24px;
}

#yado_box {
    position: relative;
}

.raku_review {
    display: inline-block;
    position: absolute;
    top: 4px;
    right: 4px;
    margin: 0px;
    height: 32px;
    min-width: 58px;
    line-height: 32px;
    padding: 0px 4px;
    font-size: 1.0rem;
    font-weight: normal;
    text-decoration: none;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .6);
    text-align: center;
    vertical-align: middle;
    color: #fff;
    /*opacity: 0.9;*/
    border-radius: 5px;
    cursor: pointer;
    background-color: #93ca76;;
}

/* 温泉地ヘッダ */
td.och {
    width: 84px;
    height: 24px;
    font-size: 1.0rem;
    font-weight: normal;
    text-align: left;
    vertical-align: middle;
    border-bottom:#003f88 1px solid;
    padding: 4px 4px 0px;
}

td.oct {
    padding: 4px;
    text-align: center;
}

/* 温泉情報 */
td.oci {
    width: 34px;
    font-size: 1.0rem;
    text-align: center;
    vertical-align: middle;
    padding: 2px;
    border-bottom:#003f88 1px solid;
}

/* 温泉ボタン色 */
.bc0 {
    background-color: #12509b;
}
.bc1 {
    background-color: #d23f40;
}
.bc2 {
    background-color: #ff8c0a;
}
.bc3 {
    background-color: #b2383e;
}
.bc4 {
    background-color: #3e62ad;
}
.bc5 {
    background-color: #0073e0;
}
.bc6 {
    background-color: #455765;/*#E5001A;*/
}
.bc7 {
    background-color: #953436;
}
.bc8 {
    background-color: #7a4171;
}
.bc16 {
    background-color: #f96e29;
}
.bc17 {
    background-color: #f96e29;
}
.bc32 {
    background-color: #B6391A;
}
.bc64, .bc65 {
    background-color: #00846C;
}
.bc128 {
    background-color: #474b42;
}

/* 道の駅ボタン色 */
.mb0 {
    background-color: #1e50a2;
}
.mb1 {
    background-color: #ee7800;
}
.mb2, .mb3 {
    background-color: #c53d43;
}

/* 道の駅背景色 */
.mc0 {
    background-color: #e1eeff;
}
.mc1 {
    background-color: #f5f0e1;
}
.mc2, .mc3 {
    background-color: #fff0f5;
}

/* SAPAボタン色 */
.sapa1 {
    background-color: #006eb0; 
}

.sapa2 {
    background-color: #ee7800; 
}

.sapa3 {
    background-color: #385a37; 
}

/* SAPA背景色 */
.sb1 {
    position: relative;
    background-color: #ebf2fb;
}

.sb2 {
    position: relative;
    background-color: #f5f0e1;
}

.sb3 {
    position: relative;
    background-color: #efffee;
}

/* 空港ボタン色 */
.ab1 {
    background-color: #c53d43;  /* 赤紅 */
}
.ab2, .ab3 {
    background-color: #1e50a2;  /* 瑠璃色 */
}

/* フェリーボタン色 */
.fr1 {
    background-color: #c53d43;  /* 赤紅 */
}
.fr2, .fr3 {
    background-color: #1e50a2;  /* 瑠璃色 */
}

/* 高速バスボタン色 */
.ex1 {
    background-color: #1e50a2;  /* 瑠璃色 */
}
.ex2, .ex3 {
    background-color: #c53d43;  /* 赤紅 */
}

/* 空港・天気・フェリー背景 */
.ar {
    background-color:#fff6e4;
}

/* レンタカーボタン色 */
.cr0 {
    background-color: #003f88;
}

.cr13 {
    background-color: #049f40;
}

.cr14 {
    background-color: #0f3a61;
    color: #fabe01;
    text-shadow: none;
}

.cr16 {
    background-color: #ffcd00;
    color: #000000;
    text-shadow: none;
}

.cr19 {
    background-color: #082c6e;
}

.cr20 {
    background-color: #ec0000;
}

.cr26 {
    background-color: #ec0000;
}

.cr30 {
    background-color: #ec0000;
}

.cr56 {
    background-color: #fc0000;
}

.cr422 {
    background-color: #0073d3;
}

/* レンタカー背景色 */
.cb0 {
    background-color: #E5F1FF;
}

.cb13 {
    background-color: #fbf0f0;
}

.cb14 {
    background-color: #FEF8E5;
}

.cb16 {
    background-color: #FFF9E5;
}

.cb19 {
    background-color: #E7EFFD;
}

.cb20 {
    background-color: #FFE5E5;
}

.cb26 {
    background-color: #FFE5E5;
}

.cb30 {
    background-color: #fdf3f3;
}

.cb56 {
    background-color: #FFFDE5;
}

.cb422 {
    background-color: #FFFFFF;
}

/* シェアサイクル */
td.bs1 {
    background-color: #fabe00;
    color: #000000;
    text-shadow: 0 1px 1px rgba(255, 255, 255, .3);
    height: 44px;
}

td.bs2 {
    background-color: #cc0133;
    color: #FFF;
    height: 44px;
}

td.bs3 {
    background-color: #222;
    color: #FFF;
    height: 44px;
}

td.bs4 {
    background-color: #0e75b7;
    color: #FFF;
    height: 44px;
}

/* シェアサイクル背景色 */
.bb1 {
    background-color: #FFF8E5;
}

.bb2 {
    background-color: #FEE5EB;
}

.bb3 {
    background-color: #e2e2e2;
}

.bb4 {
    background-color: #d7f0ff;
}

/* 温泉背景色 */
.tc0 {
    background-color: #e1eeff;
}
.tc1 {
    background-color: #fff0f5;
}
.tc2 {
    background-color: #fdf5e6;
}
.tc3 {
    background-color: #fdeeee;
}
.tc4 {
    background-color: #e1eeff;
}
.tc5 {
    background-color: #e5f2ff;
}
.tc6 {
    background-color: #dcdcdc; /* #ffe5e8;*/
}
.tc7 {
    background-color: #fdeeee;
}
.tc8 {
    background-color: #e6e6fa;
}
.tc16 {
    background-color: #ffffe0;
}
.tc17 {
    background-color: #ffffe0;
}
.tc32 {
    background-color: #ffdab9;
}
.tc64, .tc65 {
    background-color: #f0fff0;
}
.tc128 {
    background-color: #dcdcdc;
}

/* 宿ボタン色 */
.yb1 {
    background-color: #4a488e; /* ホテル:紺藍 */
}
.yb2 {
    background-color: #d0576b;  /* 旅館:今様色 */
}
.yb3 {
    background-color: #f39800;  /* ペンション: 金茶*/
}
.yb4 {
    background-color: #769164;  /* その他: 老竹色 */
}

/* 宿背景 */
.yc1 {
    background-color: #e1eeff;
}
.yc2 {
    background-color: #fff0f5;
}
.yc3 {
    background-color: #fdf5e6;
}
.yc4 {
    background-color: #f0ffff;
}

/* 温泉地ボタン色 */
.boc1 {
    background-color: #a22041;
}
.boc2 {
    background-color: #ec6800;
}
.boc3 {
    background-color: #824880;
}
.boc4 {
    background-color: #2a83a2;
}
.boc5 {
    background-color: #47885e;
}
.boc6 {
    background-color: #716246;
}

/* グルメボタン色 */
.gb1 {
    background-color: #db2822;
}
.gb2 {
    background-color: #b33e5c;
}
.gb3 {
    background-color: #288c66;
}
.gb4 {
    background-color: #7b8d42;
}
.gb5 {
    background-color: #f3981d;
}
.gb6 {
    background-color: #147f3a;
}
.gb7 {
    background-color: #e70013;
}
.gb8 {
    background-color: #bb5535;
}
.gb9 {
    background-color: #ec6800;
}
.gb10 {
    background-color: #ec6800;
}
.gb11 {
    background-color: #00ac97;
}
.gb12 {
    background-color: #00afcc;
}
.gb13 {
    background-color: #2b2b2b;
}
.gb14 {
    background-color: #0075c2;
}
.gb15 {
    background-color: #9fc24d;
}
.gb16 {
    background-color: #683f36;
}
.gb17 {
    background-color: #e70013;
}

/* グルメ背景色 */
.gr1 {
    background-color: #fff0f5;
}
.gr2 {
    background-color: #ffebf0;
}
.gr3 {
    background-color: #e3fcf2;
}
.gr4 {
    background-color: #f4fcdc;
}
.gr5 {
    background-color: #fdefdc;
}
.gr6 {
    background-color: #fde4e4;
}
.gr7 {
    background-color: #fcf0cf;
}
.gr8 {
    background-color: #fdeae4;
}
.gr9 {
    background-color: #ffeee1;
}
.gr10 {
    background-color: #fdecde;
}
.gr11 {
    background-color: #dcfffb;
}
.gr12 {
    background-color: #e4f9fd;
}
.gr13 {
    background-color: #f1efef;
}
.gr14 {
    background-color: #ddf2ff;
}
.gr15 {
    background-color: #f2fcda;
}
.gr16 {
    background-color: #ffe5df;
}
.gr17 {
    background-color: #ffdfe1;
}

.grcp {
    margin: 0px 0px 0px 4px;
    padding: 1px 3px;
    color: #fff;
    font-size: 0.875rem;
    font-weight: normal;
    text-decoration: none;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    background-color: #003f88;
    border-radius: 3px;
}

/* コンビニボタン色 */
.cvb1 {
    background-color: #007c52;
}
.cvb2 {
    background-color: #0089cb;
}
.cvb3 {
    background-color: #008a41;
}
.cvb4 {
    background-color: #a73d53;
}
.cvb5 {
    background-color: #009fdf;
}
.cvb6 {
    background-color: #004aa6;
}
.cvb7 {
    background-color: #ff9a02;
}
.cvb8 {
    background-color: #ee2214;
}
.cvb9 {
    background-color: #009650;
}
.cvb10 {
    background-color: #249876;
}
.cvb11 {
    background-color: #ed2214;
}
.cvb12 {
    background-color: #2f201b;
}

/* コンビニテキスト色 */
td.cvt1 {
    color: #007c52;
}
td.cvt2 {
    color: #0089cb;
}
td.cvt3 {
    color: #008a41;
}
td.cvt4 {
    color: #a73d53;
}
td.cvt5 {
    color: #009fdf;
}
td.cvt6 {
    color: #004aa6;
}
td.cvt7 {
    color: #ff9a02;
}
td.cvt8 {
    color: #ee2214;
}
td.cvt9 {
    color: #009650;
}
td.cvt10 {
    color: #249876;
}
td.cvt11 {
    color: #ed2214;
}
td.cvt12 {
    color: #2f201b;
}

/* コンビニ背景色 */
.cv1 {
    background-color: #fceeee;
}
.cv2 {
    background-color: #f0faff;
}
.cv3 {
    background-color: #f1fff8;
}
.cv4 {
    background-color: #ffeef2;
}
.cv5 {
    background-color: #ebfff4;
}
.cv6 {
    background-color: #f3f8ff;
}
.cv7 {
    background-color: #fff6e8;
}
.cv8 {
    background-color: #fdefdc;
}
.cv9 {
    background-color: #fcfad9;
}
.cv10 {
    background-color: #ffe7e6;
}
.cv11 {
    background-color: #feebea;
}
.cv12 {
    background-color: #fff2ee;
}

/* 道の駅 */
.bar_box {
	text-align: center;
	width: 252px;
	margin: 0px 0px 2px;
	border: 0px;
	font-size: 0.875rem;
}

.bar_header {
	position: relative;
	display: inline-block;
	padding: 0 45px;
    margin: 2px 0px 2px !important;
	color: #d23f40;
}

.bar_header:before, .bar_header:after {
	content: '';
	position: absolute;
	top: 50%;
	display: inline-block;
	width: 38px;
	height: 2px;
	background-color: #d23f40;
}

.bar_header:before {
	left:0;
}

.bar_header:after {
	right: 0;
}

/* ふるさと納税ボタン色 */
.fu1 {
    background-color: #d23f40;
}

.fu2 {
    background-color: #ec6800;
}

.fu3 {
    background-color: #824880;
}

.fu4 {
    background-color: #3e62ad;
}

.fu6 {
    background-color: #006a6c;
}

.fu7 {
    background-color: #0066b7 !important;
}

.fu1_text {
    color: #d23f40;
}

.fu2_text {
    color: #ec6800;
}

.fu3_text {
    color: #824880;
}

.fu4_text {
    color: #3e62ad;
}

.fu6_text {
    color: #006a6c;
}

.pop_text {
    font-size: 1.0rem;
    font-weight: bold;
}

.pop_up {
    color: green;
}

.pop_down {
    color: red;
}

/* 広告 */
.ad_box {
    display: flex;
    justify-content: center;
    margin: 2px 0px -2px -8px;
}

.ad {
    font-size: 0.875rem;
    font-weight: normal;
}

.ad_travel {
    color: #028200;
    /*color: #03b900;*/
}

.ad_rakuten {
    color: #c53d43;
    /*color: #cc121b;*/
}

.ad_hotpepper {
    color: #d0121b;
}

/* GTFS */
.bsbg {
    background-color: #003f88;
}

.g2 {
    min-height: 32px;
    line-height: 16px;
}

.g3 {
    min-height: 48px;
    line-height: 16px;
}

.g4 {
    min-height: 64px;
    line-height: 16px;
}

.g5 {
    min-height: 80px;
    line-height: 16px;
}

/* 時刻ボタン*/
.gbtn {
    display: inline-block;
    margin: 2px;
    padding: 0px;
    width: 44px;
    height: 44px;
    line-height: 43px;
    font-size: 0.875rem;
    font-weight: bold;
    text-decoration: none;
    text-shadow: 0 1px 1px rgba(250, 250, 250, .3);
    text-align: center;
    vertical-align: middle;
    color: #1A0DAB;
    background-color: #ffe4c4;
    border-radius: 5px;
    cursor: pointer;
}

.gon {
    background-color: #d8e698 !important;
}

.r0 {
    background-color: #cccccc;
}

.r0 {
	background-color: #cccccc;
}

.r1 {
    background-color: #f2f5fd;
}

.r2 {
    background-color: #fdfdea;
}

.r3 {
    background-color: #ffecf2;
}

.r4 {
    background-color: #f0ffee;
}

.r5 {
	background-color: #fcf3e8;
}

.r6 {
    background-color: #effdfd;
}

.r7 {
    background-color: #f8f0ff;
}

.r8 {
	background-color: #fcf3eb;
}

.r9 {
	background-color: #e7eeff;
}

.r10 {
    background-color: #fcfcdd;
}

.r11 {
    background-color: #ffe4ed;
}

.r12 {
    background-color: #e6fde3;
}

.r13 {
	background-color: #fceede;
}

.r14 {
    background-color: #e4fdfd;
}

.r15 {
    background-color: #f4e9ff;
}

.r16 {
	background-color: #fff0e2;
}

/* GTFSルートボタン */
.obtn {
    display: inline-block;
    margin: 2px;
    padding: 0px;
    width: 44px;
    height: 44px;
    line-height: 44px;
    font-size: 0.875rem;
    font-weight: normal;
    text-decoration: none;
    text-align: center;
    vertical-align: middle;
    border-radius: 5px;
    cursor: pointer;
}

/* 2段組*/
.two_row {
    height: 38px;
    padding-top: 6px;
    line-height: 16px;
}

/* 3段組*/
.three_row {
    height: 42px;
    padding-top: 2px;
    line-height: 14px;
}

/* 曜日記載 */
.day_mess {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: normal;
}

.weekday {
    color: #333;
}

.saturday {
    color: #4169e1;
}

.sunday {
    color: #dc143c;
}

#daytable,
#desttable {
    width: 252px;
    border-collapse: collapse;
    margin: 0px 0px 0px 1px;
    padding: 0px;
    border: 0px;
}

.stoptable {
    table-layout: fixed;
    min-width: 252px;
    max-width: 252px;
    max-height: 160px;
    border-collapse: collapse;
    border: 1px solid #003f88;
    margin: 0px 0px 0px 1px;
    padding: 0px;
    border: 0px;
    display: block;
    overflow-y: scroll;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: scrollbar;    /* IE, Edge 対応 */
    /*scrollbar-width: none; */      /* Firefox 対応 */
}

.stoptable td {
    border-bottom: 1px solid #003f88;
    min-height: 48px;
}

.routetable {
    table-layout: fixed;
    border-collapse: collapse;
    min-width: 252px;
    max-width: 252px;
    max-height: 120px;
    border: 1px solid #003f88;
    margin: 0px 0px;
    padding: 0px;
    border: 0px;
    margin: 2px 0px 0px 1px;
    width: 252px;
    display: block;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: scrollbar;   /* IE, Edge 対応 */
    /*scrollbar-width: none;*/       /* Firefox 対応 */
}

.routetable tr.btm {
    border-bottom: 1px solid #003f88;
}

td.dhead {
    min-width: 40px;
    max-width: 40px;
    line-height: 48px;
    background-color: #eee;
    font-size: 0.9375rem;
    font-weight: bold;
    color: #003f88;
    text-decoration: none;
    text-shadow: initial;
    text-align: center;
    vertical-align: middle;
}

td.ghead {
    min-width: 40px;
    max-width: 40px;
    line-height: 48px;
    background-color: #eee;
    font-size: 0.9375rem;
    font-weight: bold;
    color: #003f88;
    text-decoration: none;
    text-shadow: initial;
    text-align: center;
    vertical-align: middle;
    position: -webkit-sticky;
    position: sticky;
    left: 0;
    z-index: 1;
}

.gdest {
    font-size: 1.0rem;
    width: 100%;
    background-color: #eee;
    padding: 4px;
    text-align: left;
    vertical-align: middle;
}

.gmin {
    width: 100%;
    text-align: left;
    vertical-align: middle;
}

select:focus {
    outline: 0;
    border: 0;
    background-color: #ffffff;
    border-color: inherit;
    box-shadow: none;
}

select.active {
    background-color: #d8e698 !important;
}

select.form-control {
    font-size: 0.875rem;
    width: 204px;
    margin: 0px 0px -2px -2px;
}

.form-group {
    margin: 0px;
    padding: 0px;
}

.warn_date {
    display: none;
    color: red;
    text-align: left;
    font-size: 0.875rem;
    font-weight: bold;
}

.warn_mess {
    padding: 4px;
}

.warn_off {
    display: none;
    padding: 4px 0px 16px;
    color: red;
    text-align: center;
    font-size: 1.25rem;
    font-weight: bold;
}

td.tb {
    text-align: center;
    margin: 0px;
    padding: 0px;
}

/* ボタンイメージ */
img.sb {
    margin: 4px 2px;
    width: 44px;
    height: 44px;
    cursor: pointer;
}

/* 三角点情報 */
td.ti {
    font-size: 1.0rem;
}

.rate_review:after {
    color: #003f88;/*#EA8B47;*/
}

.rakuten_rating {
    text-align: center;
    margin-left: auto;
    margin-left: right;
}

.avg_rating {
    flex: 0 0 250px;
    /*font-size: 1.875rem;*/
    font-size: 1.125rem;
    font-weight: bold;
    text-shadow: 1px 1px 0px rgba(255,255,255,.6);
    display: inline-block;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    color: #003f88;/*#EA8B47;*/
    padding-right: 4px;
}

.not_regist {
    flex: 0 0 250px;
    font-size: 1.0rem;
    vertical-align: middle;
    text-align: center;
    margin: 2px 0px;
    color: #003f88;
}

.rating {
    font-size: 0.875rem;
    height: 14px;
    line-height: 14px;
}

.rating:after {
    /*color: #EA8B47;*/
    color: #003f88;
}

.low {
    color: #8b0000; /*#7b7c7d;*/
}

.low:after {
    color: #8b0000; /*#7b7c7d;*/
}

.high {
    color: #12B438;/*#32cd32;*/
}

.high:after {
    color: #12B438;/*#32cd32;*/
}

.rate:before {
    color: #ccc;
}

.rate:after {
    overflow: hidden;
    white-space: nowrap;
}

.total {
    color: #003f88; /*#EA8B47;*/
    font-size: 0.875rem;
}

#address, #start_place, #end_place {
    position: absolute;
    display: none;
    top: 4px;
    left: 4px;
    margin: 0px;
    padding: 4px;
    height: 32px;
    z-index: 0;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    outline: none;
    border: 2px solid #003f88;
    border-radius: 5px;
    font-size: 0.875rem;
    vertical-align: center;
    background-color: #fff;
    text-overflow: ellipsis;
}

#address:focus {
    border-color: #003f88;
    background-color: #d8e698;
}

#start_place {
    top: 36px;
}

#end_place {
    top: 72px;
}

.mess {
    padding: 4px;
}

tr.fl, tr.fr, tr.ex {
    border-bottom: solid 1px #003f88;
}

.flight_grid {
    display: grid;
    grid-template-columns: 44px minmax(142px, 154px);
    grid-template-rows: 22px 20px 20px;
    padding: 4px;
}

.flight_item {
    grid-column: 1/3;
    grid-row: 1/2;
    align-items: left;
    justify-content: center;
    font-size: 0.875rem;
}

.express_grid {
    display: grid;
    grid-template-columns: 58px minmax(128px, 140px);
    grid-template-rows: 22px 20px 20px;
    padding: 4px;
}

.express_arrival {
    grid-column: 1/3;
    grid-row: 1/2;
    align-items: left;
    justify-content: center;
    font-size: 0.875rem;
}

.express_item {
    grid-column: 2/3;
    grid-row: 2/4;
    align-items: center;
    justify-content: left;
    display: flex;
    font-size: 0.8125rem;
}

.ticket_item {
    grid-column: 1/2;
    grid-row: 2/4;
}

.info_item {
    grid-column: 2/3;
    grid-row: 2/3;
    align-items: center;
    justify-content: flex-end;
    font-size: 0.8175rem;
    display: flex;
}

.com_item {
    grid-column: 2/3;
    grid-row: 3/4;
    align-items: center;
    justify-content: flex-end;
    display: flex;
}

.air_arrow {
    color: #186fba;
}

.ticket_btn {
    font-size: 0.875rem;
    align-self: center;
    background-color: #186fba;
    width: 44px;
    height: 36px;
    line-height: 36px;
    margin: 2px 0px 0px 0px;
}

.rentacar_box {
    display: flex;
    width: 252px;
    justify-content: center;
    padding: 4px 0px 2px;
}

.rentacar_btn {
    font-size: 0.875rem;
    align-self: center;
    background-color: #76ae25;
    text-decoration: none;
    text-shadow: none;
    color: #fff;
    width: 180px;
    height: 36px;
    line-height: 18px;
    padding: 2px 0px 0px 0px;
    margin: 0px;
}

.ic_box {
    display: flex;
    width: 252px;
    justify-content: center;
    padding: 2px 0px 4px;
}

.ic_btn, .sapa_btn {
    font-size: 0.875rem;
    align-self: center;
    background-color: #2a6700;
    text-decoration: none;
    text-shadow: none;
    color: #fff;
    min-width: 140px;
    height: 40px;
    line-height: 19px;
    padding: 2px 10px 0px;
    margin: 0px;
}

.bike_btn {
    font-size: 0.875rem;
    align-self: center;
    background-color: #fabe00;
    text-decoration: none;
    text-shadow: none;
    color: #222222;
    width: 180px;
    height: 40px;
    line-height: 20px;
    padding: 4px 0px;
    margin: -8px 0px 8px;
}

.kotobike {
    background-color: #222;
    color: #fff;
    line-height: 40px;
}

.ferry_line {
    min-width: 180px;
    text-align: left;
    font-size: 0.875rem;
    line-height: 1.25rem;
    padding: 2px;
}

.p36 {
    width: 36px;
    height: 36px;
}

.tracking {
    display: block;
    font-size: 0.875rem;
    align-self: center;
    background-color: #009999;
    text-decoration: none;
    color: #fff;
    height: 36px;
    line-height: 36px;
    margin: 4px;
}

/* Swatches */
/* A
-----------------------------------------------------------------------------------------------------------*/
/* Bar: Toolbars, dividers, slider track */
.ui-bar-a,
.ui-page-theme-a .ui-bar-inherit,
html .ui-bar-a .ui-bar-inherit,
html .ui-body-a .ui-bar-inherit,
html body .ui-group-theme-a .ui-bar-inherit {
    background-color: #e9e9e9 /*{a-bar-background-color}*/;
    border-color: #dddddd /*{a-bar-border}*/;
    color: #333333 /*{a-bar-color}*/;
    text-shadow: 0;
    font-weight: normal;
}
.ui-bar-a {
    border-width: 0px;
    border-style: solid;
}
/* Page and overlay */
.ui-overlay-a,
.ui-page-theme-a,
.ui-page-theme-a .ui-panel-wrapper {
    background-color: #f9f9f9 /*{a-page-background-color}*/;
    border-color: #bbbbbb /*{a-page-border}*/;
    color: #333333 /*{a-page-color}*/;
    text-shadow: 0;
    /*	text-shadow: 0 1px 0 #f3f3f3;
    */
}

.ui-body-a,
.ui-page-theme-a .ui-body-inherit,
html .ui-bar-a .ui-body-inherit,
html .ui-body-a .ui-body-inherit,
html body .ui-group-theme-a .ui-body-inherit,
html .ui-panel-page-container-a {
    background-color: #ffffff /*{a-body-background-color}*/;
    border-color: #dddddd /*{a-body-border}*/;
    color: #333333 /*{a-body-color}*/;
    text-shadow: 0;
    /*text-shadow: 0 1px 0 #f3f3f3;*/
}
.ui-body-a {
    border-width: 0px;
    border-style: solid;
}
/* Links */
.ui-page-theme-a a,
html .ui-bar-a a,
html .ui-body-a a,
html body .ui-group-theme-a a {
    color: #3388cc /*{a-link-color}*/;
    font-weight: normal;
}
.ui-page-theme-a a:visited,
html .ui-bar-a a:visited,
html .ui-body-a a:visited,
html body .ui-group-theme-a a:visited {
    color: #3388cc /*{a-link-visited}*/;
}
.ui-page-theme-a a:hover,
html .ui-bar-a a:hover,
html .ui-body-a a:hover,
html body .ui-group-theme-a a:hover {
    color: #005599 /*{a-link-hover}*/;
}
.ui-page-theme-a a:active,
html .ui-bar-a a:active,
html .ui-body-a a:active,
html body .ui-group-theme-a a:active {
    color: #005599 /*{a-link-active}*/;
}
/* Button up */
.ui-page-theme-a .ui-btn,
html .ui-bar-a .ui-btn,
html .ui-body-a .ui-btn,
html body .ui-group-theme-a .ui-btn,
html head + body .ui-btn.ui-btn-a,
/* Button visited */
.ui-page-theme-a .ui-btn:visited,
html .ui-bar-a .ui-btn:visited,
html .ui-body-a .ui-btn:visited,
html body .ui-group-theme-a .ui-btn:visited,
html head + body .ui-btn.ui-btn-a:visited {
    background-color: #f6f6f6;
    border-color: #dddddd;
}
/* Button hover */
.ui-page-theme-a .ui-btn:hover,
html .ui-bar-a .ui-btn:hover,
html .ui-body-a .ui-btn:hover,
html body .ui-group-theme-a .ui-btn:hover,
html head + body .ui-btn.ui-btn-a:hover {
    background-color: #ededed;
    background-image: -webkit-linear-gradient(top, rgba(0,0,0,.1), rgba(0,0,0,0));
    background-image:    -moz-linear-gradient(top, rgba(0,0,0,.1), rgba(0,0,0,0));
    background-image:     -ms-linear-gradient(top, rgba(0,0,0,.1), rgba(0,0,0,0));
    background-image:      -o-linear-gradient(top, rgba(0,0,0,.1), rgba(0,0,0,0));
    background-image:         linear-gradient(top, rgba(0,0,0,.1), rgba(0,0,0,0));
    border-color: #dddddd /*{a-bhover-border}*/;
    color: #333333 /*{a-bhover-color}*/;
    text-shadow: 0;
    /*text-shadow: 0 1px 0 #f3f3f3;
    */
}
/* Button down */
.ui-page-theme-a .ui-btn:active,
html .ui-bar-a .ui-btn:active,
html .ui-body-a .ui-btn:active,
html body .ui-group-theme-a .ui-btn:active,
html head + body .ui-btn.ui-btn-a:active {
    background-color: #e8e8e8 /*{a-bdown-background-color}*/;
    border-color: #dddddd /*{a-bdown-border}*/;
    color: #333333;
    text-decoration: none;
    text-shadow: 0;
}
/* Active button */
.ui-page-theme-a .ui-btn.ui-btn-active,
html .ui-bar-a .ui-btn.ui-btn-active,
html .ui-body-a .ui-btn.ui-btn-active,
html body .ui-group-theme-a .ui-btn.ui-btn-active,
html head + body .ui-btn.ui-btn-a.ui-btn-active,
/* Active checkbox icon */
.ui-page-theme-a .ui-checkbox-on:after,
html .ui-bar-a .ui-checkbox-on:after,
html .ui-body-a .ui-checkbox-on:after,
html body .ui-group-theme-a .ui-checkbox-on:after,
.ui-btn.ui-checkbox-on.ui-btn-a:after,
/* Active flipswitch background */
.ui-page-theme-a .ui-flipswitch-active,
html .ui-bar-a .ui-flipswitch-active,
html .ui-body-a .ui-flipswitch-active,
html body .ui-group-theme-a .ui-flipswitch-active,
html body .ui-flipswitch.ui-bar-a.ui-flipswitch-active,
/* Active slider track */
.ui-page-theme-a .ui-slider-track .ui-btn-active,
html .ui-bar-a .ui-slider-track .ui-btn-active,
html .ui-body-a .ui-slider-track .ui-btn-active,
html body .ui-group-theme-a .ui-slider-track .ui-btn-active,
html body div.ui-slider-track.ui-body-a .ui-btn-active {
    background-color: #d8e698;
    color: #333333;
    text-decoration: none;
    text-shadow: 1px 1px 0px rgba(255,255,255,.8);
    border-color: #d8e698;/*#dddddd;*/
}

/* Active radio button icon */
.ui-page-theme-a .ui-radio-on:after,
html .ui-bar-a .ui-radio-on:after,
html .ui-body-a .ui-radio-on:after,
html body .ui-group-theme-a .ui-radio-on:after,
.ui-btn.ui-radio-on.ui-btn-a:after {
    background-color: #d8e698;
}
/* Focus */
.ui-page-theme-a .ui-btn:focus,
html .ui-bar-a .ui-btn:focus,
html .ui-body-a .ui-btn:focus,
html body .ui-group-theme-a .ui-btn:focus,
html head + body .ui-btn.ui-btn-a:focus,
/* Focus buttons and text inputs with div wrap */
.ui-page-theme-a .ui-focus,
html .ui-bar-a .ui-focus,
html .ui-body-a .ui-focus,
html body .ui-group-theme-a .ui-focus,
html head + body .ui-btn-a.ui-focus,
html head + body .ui-body-a.ui-focus {
    -webkit-box-shadow: 0 0 0px #d8e698;
    -moz-box-shadow: 0 0 0px #d8e698;
    box-shadow: 0 0 0px #d8e698;
}

.ui-select > .ui-btn {
    background: #f6f6f6 !important;
    padding: 8px !important;
}

#onsenDialog,
#spaDialog,
#michiekiDialog,
#sapaDialog,
#yadoDialog,
#roomDialog,
#gourmetDialog {
    display: none;
    width: 300px;
    border: 2px solid rgba(0,63,136,1);
    border-radius: 5px;
    margin: 0px;
    padding: 4px;
    font-size: 0.875rem;
    background-color: #ebe8de;
}

.popup_head {
    width: 288px;
    font-size: 1.0rem;
    font-weight: normal;
    text-align: center;
}

.ui-header .ui-title {
    margin-left: 0%;
    margin-right: 0%;
}

.ui-controlgroup-controls {
    width: 100% !important;
}

.areaGroup .ui-select,
.areaGroup .ui-checkbox,
.useGroup .ui-select,
.genreGroup .ui-select,
.genreGroup .ui-checkbox {
    width: 100% !important;
}

#meizan .ui-select {
    width: 100% !important;
}

.onsenGrid3 .ui-checkbox {
    width: 33.33%;
}
.onsenGrid4 .ui-checkbox {
    width: 25%;
}

.ui-checkbox label {
    text-align: center;
    white-space: nowrap;
    padding: 8px 0px;
}

.onsenGrid3 .ui-checkbox label,
.onsenGrid4 .ui-checkbox label {
    padding: 6px 0px;
}

#onsenGroup1,
#onsenGroup3 {
    margin: 0px;
    padding: 0px;
}

#onsenGroup2,
#onsenGroup4,
#onsenGroup5,
#onsenGroup6 {
    margin: -8px 0px 4px 0px;
    padding: 0px;
}

.ekiGroupA .ui-checkbox {
    width: 50%;
}

.ekiGroupA .ui-checkbox label {
    text-align: center;
    white-space: nowrap;
}

.ekiGroupC .ui-checkbox {
    width: 25%;
}

.ekiGroupC .ui-checkbox label {
    text-align: center;
    white-space: nowrap;
}

.ekiGroupA, .ekiGroupC {
    margin: -8px 0px 4px 0px;
    padding: 0px;
}

#ekiGroup1 {
    margin: -4px 0px 4px 0px;
    padding: 0px;
}

.sapaGroupA .ui-checkbox,
.sapaGroupB .ui-checkbox,
.sapaGroupC .ui-checkbox {
    width: 33.3%;
}

.sapaGroupD .ui-checkbox {
    width: 50%;
}

.sapaGroupB, .sapaGroupC {
    margin: -8px 0px 4px 0px;
    padding: 0px;
}

.yadoGroupA .ui-checkbox {
    width: 50%;
}
.yadoGroupB .ui-checkbox {
    width: 33.3%;
}
.yadoGroupC .ui-checkbox {
    width: 25%;
}
.yadoGroupD .ui-checkbox {
    width: 20%;
}

.yadoGroupA .ui-checkbox label,
.yadoGroupB .ui-checkbox label,
.yadoGroupC .ui-checkbox label,
.yadoGroupD .ui-checkbox label {
    text-align: center;
    white-space: nowrap;
}


#yadoGroup1 {
    margin: -4px 0px 4px 0px;
    padding: 0px;
}

#yadoGroup2 {
    margin: -8px 0px 4px 0px;
    padding: 0px;
}

#yadoGroup3 {
    margin: -4px 0px 4px 0px;
    padding: 0px;
}

#yadoGroup4 {
    margin: -8px 0px 4px 0px;
    padding: 0px;
}
/*
#yadoGroup1 {
    margin: -4px 0px 4px 0px;
    padding: 0px;
}

#yadoGroup2 {
    margin: -4px 0px 4px 0px;
    padding: 0px;
}

#yadoGroup3 {
    margin: -8px 0px 4px 0px;
    padding: 0px;
}
*/

.gourmetGroupB .ui-checkbox {
    width: 33.3%;
}
.gourmetGroupD .ui-checkbox {
    width: 20%;
}
.gourmetGroupB .ui-checkbox label,
.gourmetGroupD .ui-checkbox label {
    text-align: center;
    white-space: nowrap;
}

#genreGroup2 {
    margin: -8px 0px 4px 0px;
    padding: 0px;
}

#gourmetGroup {
    margin: -4px 0px 4px 0px;
    padding: 0px;
}

#gourmetGroup2 {
    margin: -8px 0px 4px 0px;
    padding: 0px;
}

.minp {
    padding-left: 0px;
    padding-right: 0px;
}

#children {
    width: 32%;
    padding: 8px 0px;
}

#child_option {
    border: 2px solid #00b900;
    border-radius: 5px;
}

#child_option * {
    font-size: 0.75rem;
}

/* 小さいフォント */
span.st {
    font-size: 0.875rem;
}

.ui-checkbox label.ui-btn {
    text-align: center;
}

.measure-tooltip {
    background-color: white;
    border-width: 2px;
    border-color: #003f88;
    padding: 2px 4px;
    font-size: 0.875rem;
}

/* ダイアログ */
.roomGroup .ui-checkbox,
.roomGroup .ui-select
{
    width: 99.9%;
}

.roomGroupA .ui-checkbox,
.roomGroupA .ui-select {
    width: 49.99%;
}

.roomGroupB .ui-checkbox,
.roomGroupB .ui-select {
    width: 33.3%;
}

.roomGroupC .ui-checkbox {
    width: 24.99%;
}

#roomGroup1,
#roomGroup2,
#roomGroup4,
#roomGroup5 {
    margin: -4px 0px 4px 0px;
    padding: 0px;
}

#roomGroup3,
#roomGroup6 {
    margin: -8px 0px 4px 0px;
    padding: 0px;
}

.checkin_box {
    display: flex;
    flex-wrap: nowrap;
}

#checkin {
    display: inline-block;
    width: 230px;
}

#days {
    font-size: 1.0rem;
    width: 60px;
    height: 24px;
}

#child_option {
    display: none;
}

legend {
    font-size: 0.875rem;
}

legend.lt {
    margin: 2px 4px -2px;
    padding: 0px;
}

legend.lp {
    margin: 6px 4px -4px;
    padding: 0px;
}

legend.lg {
    margin: 2px 4px -4px;
    padding: 0px;
}

input#priceMin,
input#priceMax,
input#elevMin,
input#elevMax,
input#parkingMin,
input#parkingMax,
input#ratingMin,
input#ratingMax,
input#registMin,
input#registMax {
    width: 54px;
}

input#budgetMin,
input#budgetMax {
    padding: 4px 0px;
    width: 62px;
}

input#chMin,
input#chMax {
    width: 68px;
}

input#chargeMin,
input#chargeMax,
input#timeMin,
input#timeMax,
input#priceMin,
input#priceMax {
    display: none;
}

#elevSlider .ui-rangeslider-sliders,
#parkingSlider .ui-rangeslider-sliders,
#budgetSlider .ui-rangeslider-sliders,
#ratingSlider .ui-rangeslider-sliders,
#registSlider .ui-rangeslider-sliders {
    margin: 0 80px !important;
}

#chSlider .ui-rangeslider-sliders {
    margin: 0 94px !important;
}

#chargeSlider .ui-rangeslider-sliders ,
#priceSlider .ui-rangeslider-sliders {
    margin: 0 14px !important;
}

.full-width-slider input {
    display: none;
} 

.full-width-slider .ui-slider-track {
    margin: 0px 14px !important;
}

.ok_cancel {
    margin: -11px 0px -8px 0px;
    padding: 0px;
}

.spa_time,
.spa_price,
.donation {
    margin-left: 8px;
    font-weight: bold;
    color: #0000cc;
}

.ui-content {padding: 0px !important;}
.ui-listview-filter {margin: 0px !important;}
.ui-content .ui-listview {margin: 0px !important;}

#searchOnsen,
#searchOnsen:hover,
#searchOnsen:focus,
#searchMount,
#searchMount:hover,
#searchMount:focus,
#searchStation,
#searchStation:hover,
#searchStation:focus,
#searchEki,
#searchEki:hover,
#searchEki:focus,
#searchYado,
#searchYado:hover,
#searchYado:focus,
#searchRoom,
#searchRoom:hover,
#searchRoom:focus,
#searchGourmet,
#searchGourmet:hover,
#searchGourmet:focus,
#searchSpa,
#searchSpa:hover,
#searchSpa:focus,
#searchSAPA,
#searchSAPA:hover,
#searchSAPA:focus {
    background-color: #5CB811;
    border: 0px;
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    text-shadow: 1px 1px 0 rgba(0,0,0,.5);
}

#childClose {
    background-color: #5CB811;
    margin: 0px 80px 4px;
    border: 0px;
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    text-shadow: 1px 1px 0 rgba(0,0,0,.5);
}

#onsenClose,
#onsenClose:hover,
#onsenClose:focus,
#onsenClear,
#onsenClear:hover,
#onsenClear:focus,
#setupClose,
#setupClose:hover,
#setupClose:focus,
#mountClose,
#mountClose:hover,
#mountClose:focus,
#spaClose,
#spaClose:hover,
#spaClose:focus,
#spaClear,
#spaClear:hover,
#spaClear:focus,
#stationClose,
#stationClose:hover,
#stationClose:focus,
#ekiClose,
#ekiClose:hover,
#ekiClose:focus,
#ekiClear,
#ekiClear:hover,
#ekiClear:focus,
#yadoClose,
#yadoClose:hover,
#yadoClose:focus,
#yadoClear,
#yadoClear:hover,
#yadoClear:focus,
#roomClose,
#roomClose:hover,
#roomClose:focus,
#roomClear,
#roomClear:hover,
#roomClear:focus,
#gourmetClose,
#gourmetClose:hover,
#gourmetClose:focus,
#gourmetClear,
#gourmetClear:hover,
#gourmetClear:focus,
#sapaClose,
#sapaClose:hover,
#sapaClose:focus,
#sapaClear,
#sapaClear:hover,
#sapaClear:focus {
    background-color: #A4A4A4;
    border: 0px;
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    text-shadow: 1px 1px 0 rgba(0,0,0,.5);
}

.paperSize .ui-radio label,
.orientation .ui-radio label {
    text-align: center;
    white-space: nowrap;
}

#paperSize .ui-radio {
    width: 24.99%;
}

#orientation .ui-radio {
    width: 49.99%;
}

/* 山検索ダイアログ */
#mountDialog {
    display: none;
    width: 300px;
    border: 2px solid rgba(0,63,136,1);
    border-radius: 8px;
    margin: 0px;
    padding: 4px;
    font-size: 0.875rem;
    background-color: #ebe8de; /*#F6E3CE;*/
}

/* バス停・駅検索ダイアログ */
#stationDialog {
    display: none;
    width: 300px;
    border: 2px solid rgba(0,63,136,1);
    border-radius: 8px;
    margin: 0px;
    padding: 4px;
    font-size: 0.875rem;
    background-color: #ebe8de;
}

.typeGroup .ui-checkbox label,
.spaGroup .ui-checkbox label {
    text-align: center;
    white-space: nowrap;
}

#spaGroup .ui-checkbox {
    width: 49.99%;
}

#typeGroup .ui-checkbox {
    width: 33.3%;
}

.tsub {
    font-size: 0.875rem;
    line-height: 1.0rem;
}

/* bootstrap select */
.form-control {
    display: block;
    width: 100%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 0.25rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #333;
    background-color: #fff;
    background-clip: padding-box;
    border: 0px;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-control::-ms-expand {
    background-color: transparent;
    border: 0;
}

.form-control:-moz-focusring {
    color: transparent;
    text-shadow: 0 0 0 #495057;
}

.form-control::-webkit-input-placeholder {
    color: #6c757d;
    opacity: 1;
}

.form-control::-moz-placeholder {
    color: #6c757d;
    opacity: 1;
}

.form-control::placeholder {
    color: #6c757d;
    opacity: 1;
}

@media only screen and (max-width: 720px) {

    .item_box {
        min-height: 48px;
    }
}

/* 高解像度のデバイス用のスタイル */
/* 高解像度のデバイス用のスタイル */
@media
    (-webkit-min-device-pixel-ratio: 2.5), /* for Webkit browsers */
    (min-resolution: 240dpi), /* for other browsers */
    (min-resolution: 2.5dppx) { /* for all browsers supporting dppx unit */
}

/* 小さい画面サイズでのアトリビューションテキストを隠す */

.maplibregl-ctrl-attrib-inner a:link,
.maplibregl-ctrl-attrib-inner a:visited {
    color: #333;
}

@media (max-width: 640px) {
    .maplibregl-ctrl-attrib-inner a {
        font-size: 12px;
    }
}

.menu {
    display: flex;
    position: absolute;
    padding: 0;
    font-family: 'NotoSansJP-Medium';
    font-weight: 500;    
    font-size: 0.875rem;
    font-display: swap;
    background-color: rgba(255, 255, 255, 0.9);
    color: #222;
    box-sizing: border-box;
    border: 2px solid #003f88;
    justify-content: center;
    align-items: center;
    text-align: center;
    transition: background-color 0.2s ease;
    user-select: none;
    cursor: pointer !important;
    z-index: 10;
}

.main-button {
    width: 48px;
    height: 48px;
    right: 4px;
    border-radius: 5px;
}

.zoom-button {
    width: 48px;
    height: 46px;
    right: 4px;
}

.zoom-button::before,
.zoom-button::after {
    content: '';
    position: absolute;
    background-color: #333;
}

/* 横線 */
.zoom-button::before {
    width: 18px;
    height: 2px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.sub-button {
    display: none;
    width: 58px;
    height: 48px;
}

.map-button {
    display: none;
    width: 58px;
    height: 38px;
    font-size: 13px;
}

.label-button {
    display: none;
    width: 36px;
    height: 36px;
    top: 16px;
    font-size: 12px;
    border-radius: 50%;
}

/* ホバー時のスタイル */
.main-button:hover,
.sub-button:hover,
.map-button:hover {
    background-color: lightgray;
}

/* 左上のボタン */
.sub-button.top-left,
.map-button.top-left {
    border-top-left-radius: 5px;
    border-right: 1px solid #003f88;
    border-bottom: 1px solid #003f88;
}

/* 上中央のボタン */
.sub-button.top-center,
.map-button.top-center {
    border-bottom: 1px solid #003f88;
    border-left: 1px solid #003f88;
    border-right: 1px solid #003f88;
}

/* 右上のボタン */
.sub-button.top-right,
.map-button.top-right {
    border-top-right-radius: 5px;
    border-left: 1px solid #003f88;
    border-bottom: 1px solid #003f88;
}

/* 左中央のボタン */
.sub-button.middle-left {
    border-top: 1px solid #003f88;
    border-right: 1px solid #003f88;
    border-bottom: 1px solid #003f88;
}

/* 右中央のボタン */
.sub-button.middle-right {
    border-top: 1px solid #003f88;
    border-left: 1px solid #003f88;
    border-bottom: 1px solid #003f88;
}

/* 左下のボタン */
.sub-button.bottom-left,
.map-button.bottom-left {
    border-bottom-left-radius: 5px;
    border-right: 1px solid #003f88;
    border-top: 1px solid #003f88;
}

/* 下中央のボタン */
.sub-button.bottom-center,
.map-button.bottom-center {
    border-top: 1px solid #003f88;
    border-left: 1px solid #003f88;
    border-right: 1px solid #003f88;
}

/* 右下のボタン */
.sub-button.bottom-right,
.map-button.bottom-right {
    border-bottom-right-radius: 5px;
    border-left: 1px solid #003f88;
    border-top: 1px solid #003f88;
}

.sub-button.center {
    border: 1px solid #003f88;
}

/* 上の単独ボタン */
.sub-button.top-alone {
    border-bottom: 1px solid #003f88;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

/* 中の単独ボタン */
.sub-button.middle-alone {
    border-top: 1px solid #003f88;
    border-bottom: 1px solid #003f88;
}

/* 下の単独ボタン */
.sub-button.bottom-alone {
    border-top: 1px solid #003f88;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.sub-button.alone {
    border-radius: 5px;
}

.sub-button.left {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    border-right: 1px solid #003f88;
}

.sub-button.middle {
    border-left: 1px solid #003f88;
    border-right: 1px solid #003f88;
}

.sub-button.right {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-left: 1px solid #003f88;
}

.sub-button p {
    margin: 0;
    line-height: 1.4; /* 行間を適度に設定 */
}