@charset "utf-8";

/* 図版ビューアの右サイドにタブボタンを表示 */

/* 図版ビューアブロック */
.block_map {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 800px;
    height: 610px;
    outline: 1px solid #999;
}

/* データ読み込み中……（タブで図版自体を切り替える場合に設置） */
.dataloading_box {
    position: absolute;
    top: 50%;
    left: 40%;
    transform: translate(-50%, -40%);
    -webkit-transform: translate(-50%, -40%);
    -ms-transform: translate(-50%, -40%);
}

/* タブブロック */
.block_tab {
    overflow-y: auto;
    width: 240px;
    height: 670px;
    padding: 10px;
    background-color: rgba(255, 255, 255, 0.7);
    display: flex;
    flex-flow: column;
    gap: 0.5em;
}
/* タブブロックのボタン */
.block_tab input[type='radio'] {
    display: none;
}

.block_tab input[type='radio'] + label {
    white-space: pre-wrap;
    text-align: center;
    flex-shrink: 0;
    padding: 0.5em;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #444;
    background-color: rgba(255, 255, 255, 0.7);
    border: #999 1px solid;
    overflow: hidden;
    height: 48px;
    border-radius: 2px;
    cursor: pointer;
    transition: background-color 0.8s ease;
    font-size: 0.9em;
}
.block_tab input[type='radio'] + label:hover {
    background-color: rgba(230, 230, 230, 0.7);
    border: #666 1px solid;
    transition: background-color 0.2s ease;
}

.block_tab input[type='radio']:checked + label {
    cursor: default;
    color: #fff;
    background-color: #999;
    border: #333 1px solid;
}

.block_tab_debug {
    position: absolute;
    bottom: 20px;
    right: 10px;
    font-size: 1.2rem;
    color: chocolate;
}
.block_tab_debug h3 {
    text-align: center;
    margin-bottom: 0px;
    padding: 2px;
    font-size: 1.2rem;
    font-weight: bold;
    color: #fff;
    background-color: #666;
}

/* タブエリア下の表（画像）ブロック */
.block_table {
    position: absolute;
    top: 370px;
    right: 10px;
    width: 180px;
    height: 230px;
}

/* 拡大率＆座標取得用テキストエリア */
input#map_params {
    width: 180px;
}