@charset "UTF-8";

.Login {
    height: 100%;
    width: 100%;
    z-index: 1;
}

.Login__logoMark {
    font-size: 3.2rem;
}

.Login__logoText {
    font-size: 2.8rem;
    margin-left: 0.8rem;
}

.Login .icon-gmai:before {
    color: #3f3f3f;
}

.loginText {
    background-color: #eaeaea;
    border: #eaeaea 1px solid;
    border-radius: 0.2rem;
    height: 3.5rem;
    line-height: 3.5rem;
    padding-left: 0.5rem;
    width: 25rem;
}

.loginText:hover {
    border: #e2ac00 1px solid;
}

.loginBtn {
    background-color: #e2ac00;
    border: #e2ac00 1px solid;
    border-radius: 0.2rem;
    color: #fff;
    height: 4rem;
    line-height: 4rem;
    transition: 0.4s;
    width: 25rem;
}

.loginBtn:hover {
    background-color: transparent;
    border: #e2ac00 1px solid;
    color: #e2ac00;
    transition: 0.4s;
}

/*================================================*/

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html,
body {
    height: 100%;
    width: 100%;
}

body {
    color: #efefef;
    cursor: default;
    font-family: Meiryo, 'メイリオ', Verdana, Arial, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック', sans-serif;
    font-size: 0.75rem;
    voice-family: inherit;
}

a {
    text-decoration: none;
}

ul {
    margin: 0;
    padding: 0;
}

li {
    list-style-type: none;
}

p {
    margin: 0;
}

button {
    background-color: transparent;
    border: none;
    padding: 0;
}

input[type="file"] {
    opacity: 0;
    visibility: hidden;
    width: 0;
}

.hidden {
    display: none;
}

.TWrap {
    background-color: #494949;
    border: #3f3f3f 1px solid;
    height: 10rem;
    position: relative;
    white-space: nowrap;
    width: 30rem;
}

.TWrapL {
    background-color: #494949;
    border: #3f3f3f 1px solid;
    height: 10rem;
    position: relative;
    white-space: nowrap;
    width: 35rem;
}

.LgdWrap {
    background-color: #494949;
    border: #3f3f3f 1px solid;
    height: 30rem;
    position: relative;
    white-space: nowrap;
    width: 15.5rem;
}

.Unit {
    border: #3f3f3f 1px solid;
    padding: 0.6rem;
}

.LoaderWrap {
    background-color: rgba(0, 0, 0, 0.8);
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 10000;
}

.LoaderWrap2 {
    background-color: rgba(0, 0, 0, 0.8);
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 10000;
}

.LoaderWrap3 {
    background-color: rgba(0, 0, 0, 0.0);
    height: 10%;
    position: absolute;
    left: 0;
    bottom: 0;
    /* ここを変更 */
    width: 100%;
    z-index: 10000;
}
.LoaderWrap4 {
    background-color: rgba(0, 0, 0, 0.1);
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 10000;
}
.Popup {
    background-color: #3f3f3f;
    border: #ffffff 1px solid;
    border-radius: 0.25rem;
    color: #ffffff;
    margin-bottom: 0.2rem;
    padding: 0.4rem 0.8rem;
}

.Sw {
    border: #3f3f3f 1px solid;
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
}

.SwR {
    border: #3f3f3f 1px solid;
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    position: fixed;
    top: 0;
    right: 0;
    transform: translateX(100%);
    /* 要素の幅を考慮して位置を調整 */
    z-index: 100;
}

.SwPop {
    border: #efefef 1px solid;
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) !important;
    z-index: 100;
}

.Sw__head {
    background-color: #ffffff;
    color: #3f3f3f;
    height: 1.5rem;
    line-height: 1.5rem;
    padding-left: 0.5rem;
    width: 100%;
}

.Sw__close {
    color: black;
    font-size: 1rem;
    height: 100%;
    width: 1.5rem;
}

.Sw__close:hover {
    background-color: #ff0000;
    color: #ffffff;
}

.Sw__body {
    background-color: #565656;
    padding: 0.8rem;
    padding-bottom: 1rem;
    position: relative;
    width: 100%;
}

.Map {
    height: 100%;
    width: 100%;
    z-index: 1;
}

.Header {
    background: rgba(0, 0, 0, 0.88);
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    height: 100%;
    overflow-y: auto;
    position: fixed;
    top: 0;
    left: 0;
    width: 12.5rem;
    z-index: 2;
}

.Header__logo {
    justify-content: center;
    margin-top: 1.3rem;
    margin-left: -0.6rem;
}

.Header__logo span {
    font-size: 2rem;
}

.Header__logo .icon-gmai {
    font-size: 1.5rem;
    margin-left: 0.8rem;
}

.Header__btnWrap {
    margin-top: 4.5rem;
}

.Header a {
    width: 100%;
}

.Header__btn {
    border-left: transparent 3px solid;
    padding: 1.5rem 2rem;
    width: 100%;
}

.Header__btn:hover {
    border-left: #e2ac00 3px solid;
    background-color: #333333;
}

.Header__btn div {
    text-align: center;
}

.Header__btn span {
    font-size: 1.2rem;
}

.Header__btn p {
    color: #efefef;
    font-size: 0.78rem;
    font-weight: bold;
    padding-left: 1.5rem;
    white-space: nowrap;
}

@media screen and (max-width: 767px) {
    .Header {
        width: 5.5rem;
    }

    .Header__logo {
        margin-left: 0;
    }

    .Header__logo .icon-gmai {
        display: none;
    }

    .Header__btn p {
        display: none;
    }
}

.TopBtnWrap {
    display: flex;
    position: absolute;
    right: 0.6rem;
    top: 0.6rem;
}

.TopBtnSwS,
.TopBtnSwM,
.TopBtnSwL,
.TopBtnSwLL {
    background-color: #565656;
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.3);
    padding: 0.6rem;
    position: fixed;
    right: 0.6rem;
    top: calc(2.7rem + 0.6rem * 2);
}

.TopBtnSwS {
    width: 12rem;
}

.TopBtnSwM {
    width: 16rem;
}

.TopBtnSwL {
    width: 20rem;
}

.TopBtnSwLL {
    width: 34rem;
}

.infoBtn {
    position: relative;
}

.infoBtn::before {
    content: "";
    font-family: 'icomoon';
    font-size: 0.9rem;
    color: #fff;
    right: 0;
    top: 50%;
    transform: translate(0%, -50%);
}

.infoBtn:hover::before {
    color: #e2ac00;
}


.EditerTWrap {
    background-color: #494949;
    border: #3f3f3f 1px solid;
    height: 24rem;
    position: relative;
    white-space: nowrap;
    width: 36rem;
}

.EditerTWrap.Editor_con {
    width: 58rem;
}

.EditerTWrap.Editor_coeff {
    width: 36rem;
}

.kCheck label {
    margin-left: 10px
}

.EditerLgd {
    border: #3f3f3f 1px solid;
    height: 24rem;
    overflow-y: scroll;
    padding: 0.6rem;
    width: 10rem;
}

.EditerLgd__y {
    border-top: #333333 1px solid;
    color: #fff;
    height: 100%;
    width: 3.5rem;
}

.EditerLgd__main {
    height: 100%;
    position: relative;
    width: calc(100% - 3.5rem);
}

.EditerLgd__main li {
    width: 100%;
}

.EditerLgd__wl {
    border-bottom: 4px #33ccff dotted;
    position: absolute;
    left: 0;
}

.BoringCatTWrap {
    background-color: #494949;
    border: #3f3f3f 1px solid;
    height: 11rem;
    position: relative;
    white-space: nowrap;
    width: 20rem;
}

.BoringSampleTWrap {
    background-color: #494949;
    border: #3f3f3f 1px solid;
    height: 11rem;
    position: relative;
    white-space: nowrap;
    width: 36rem;
}

.BoringUserTWrap {
    background-color: #494949;
    border: #3f3f3f 1px solid;
    height: 16rem;
    position: relative;
    white-space: nowrap;
    width: 36rem;
}

.GeoInfoMainTWrap {
    background-color: #494949;
    border: #3f3f3f 1px solid;
    height: 29rem;
    position: relative;
    white-space: nowrap;
    width: 32rem;
    overflow-y: scroll;
}

.RsltPlWrap {
    width: 30rem;
}

.RsltPlTWrap {
    background-color: #494949;
    border: #3f3f3f 1px solid;
    height: 25.9rem;
    position: relative;
    white-space: nowrap;
    width: 100%;
}

.RsltPlTWrap--dist {
    background-color: #494949;
    border: #3f3f3f 1px solid;
    height: 22.5rem;
    position: relative;
    white-space: nowrap;
    width: 100%;
}

.CSDsp {
    background-color: #3f3f3f;
    height: 30rem;
    width: 52rem;
}

.CSDsp__corner {
    border-right: #212121 1px solid;
    border-bottom: #212121 1px solid;
    height: 3.5rem;
    width: 3.5rem;
}

.CSDsp__x {
    color: #fff;
    height: 3.5rem;
    overflow: hidden;
    padding-bottom: 0.5rem;
    width: calc(100% - 3.5rem);
}

.CSDsp__wrap {
    height: calc(100% - 3.5rem);
    width: 100%;
}

.CSDsp__y {
    color: #fff;
    height: 100%;
    overflow: hidden;
    padding-right: 0.5rem;
    width: 3.5rem;
}

.CSDsp__main {
    height: 100%;
    position: relative;
    overflow: scroll;
    width: calc(100% - 3.5rem);
}

.CSDsp__main__layer {
    pointer-events: none;
    position: absolute;
    left: 0;
    top: 0;
    white-space: nowrap;
    width: 100%;
}

.CSDsp__main__lineLayer {
    border-bottom: 1px #ff9100 solid;
    pointer-events: none;
    position: absolute;
    left: 0;
    top: 0;
}

.CSDsp__main__wlLayer {
    border-bottom: 3px #33ccff dotted;
    pointer-events: none;
    position: absolute;
    min-width: 4px;
    /* 最小幅を50pxに設定 */
}

.Boring {
    flex: 0 0 auto;
    pointer-events: auto;
    position: relative;
}

.Boring:hover {
    cursor: pointer;
    opacity: 0.7;
}

.Boring li {
    width: 100%;
}

.cellBorder {
    border: 1px #000 solid;
}

.cellHover:hover {
    border: 1px #000000 solid;
}

.cellClick {
    border: 2px #ff0000 solid;
}

.boringBlank {
    flex: 0 0 auto;
}

.sBtn,
.btnCheck+label {
    background-color: #565656;
    border: #9e9e9f 1px solid;
    border-radius: 2px;
    color: #efefef;
    height: 1.5rem;
    padding: 0 1rem;
}

.sBtn:hover,
.btnCheck+label:hover {
    border: #efefef 1px solid;
}

.cBtn {
    background-color: #565656;
    border: #efefef 2px solid;
    border-radius: 0.7rem;
    color: #efefef;
    height: 1.5rem;
    width: 6.6rem;
}

.cBtnL {
    background-color: #565656;
    border: #efefef 2px solid;
    border-radius: 0.7rem;
    color: #efefef;
    height: 1.5rem;
    width: 10rem;
}

.cBtn:hover,
.cBtnL:hover {
    background-color: #efefef;
    color: #565656;
}

.btnWrap {
    height: 1.5rem;
}

.bmapBtn {
    display: none;
}

.bmapBtn+label {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 5px;
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    display: flex;
    height: 2.7rem;
    justify-content: center;
    margin-left: 0.6rem;
    width: 2.7rem;
    z-index: 2;
}

.bmapBtn+label:before {
    content: "";
    font-family: 'icomoon';
    font-size: 1.6rem;
    color: #efefef;
}

.bmapBtn+label:hover {
    opacity: 0.8;
}

.bmapBtn:checked+label {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 5px;
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    display: flex;
    height: 2.7rem;
    justify-content: center;
    margin-left: 0.6rem;
    width: 2.7rem;
    z-index: 2;
}

.bmapBtn:checked+label:before {
    content: "";
    font-family: 'icomoon';
    font-size: 1.6rem;
    color: #efefef;
}

.bmapBtn:checked+label:hover {
    opacity: 0.8;
}

.bmapBtn:checked+label:before {
    color: #e2ac00;
}

.wDataBtn {
    display: none;
}

.wDataBtn+label {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 5px;
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    display: flex;
    height: 2.7rem;
    justify-content: center;
    margin-left: 0.6rem;
    width: 2.7rem;
    z-index: 2;
}

.wDataBtn+label:before {
    content: "";
    font-family: 'icomoon';
    font-size: 1.6rem;
    color: #efefef;
}

.wDataBtn+label:hover {
    opacity: 0.8;
}

.wDataBtn:checked+label {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 5px;
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    display: flex;
    height: 2.7rem;
    justify-content: center;
    margin-left: 0.6rem;
    width: 2.7rem;
    z-index: 2;
}

.wDataBtn:checked+label:before {
    content: "";
    font-family: 'icomoon';
    font-size: 1.6rem;
    color: #efefef;
}

.wDataBtn:checked+label:hover {
    opacity: 0.8;
}

.wDataBtn:checked+label:before {
    color: #e2ac00;
}


.locInfoBtn {
    display: none;
}

.locInfoBtn+label {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 5px;
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    display: flex;
    height: 2.7rem;
    justify-content: center;
    margin-left: 0.6rem;
    width: 2.7rem;
    z-index: 2;
}

.locInfoBtn+label:before {
    content: "";
    font-family: 'icomoon';
    font-size: 1.6rem;
    color: #efefef;
}

.locInfoBtn+label:hover {
    opacity: 0.8;
}

.locInfoBtn:checked+label {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 5px;
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    display: flex;
    height: 2.7rem;
    justify-content: center;
    margin-left: 0.6rem;
    width: 2.7rem;
    z-index: 2;
}

.locInfoBtn:checked+label:before {
    content: "";
    font-family: 'icomoon';
    font-size: 1.6rem;
    color: #efefef;
}

.locInfoBtn:checked+label:hover {
    opacity: 0.8;
}

.locInfoBtn:checked+label:before {
    color: #e2ac00;
}

.distBtn {
    display: none;
}

.distBtn+label {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 5px;
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    display: flex;
    height: 2.7rem;
    justify-content: center;
    margin-left: 0.6rem;
    width: 2.7rem;
    z-index: 2;
}

.distBtn+label:before {
    content: "";
    font-family: 'icomoon';
    font-size: 1.6rem;
    color: #efefef;
}

.distBtn+label:hover {
    opacity: 0.8;
}

.distBtn:checked+label {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 5px;
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    display: flex;
    height: 2.7rem;
    justify-content: center;
    margin-left: 0.6rem;
    width: 2.7rem;
    z-index: 2;
}

.distBtn:checked+label:before {
    content: "";
    font-family: 'icomoon';
    font-size: 1.6rem;
    color: #efefef;
}

.distBtn:checked+label:hover {
    opacity: 0.8;
}

.distBtn:checked+label:before {
    color: #e2ac00;
}

.bColorBtn {
    display: none;
}

.bColorBtn+label {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 5px;
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    display: flex;
    height: 2.7rem;
    justify-content: center;
    margin-left: 0.6rem;
    width: 2.7rem;
    z-index: 2;
}

.bColorBtn+label:before {
    content: "";
    font-family: 'icomoon';
    font-size: 1.6rem;
    color: #efefef;
}

.bColorBtn+label:hover {
    opacity: 0.8;
}

.bColorBtn:checked+label {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 5px;
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    display: flex;
    height: 2.7rem;
    justify-content: center;
    margin-left: 0.6rem;
    width: 2.7rem;
    z-index: 2;
}

.bColorBtn:checked+label:before {
    content: "";
    font-family: 'icomoon';
    font-size: 1.6rem;
    color: #efefef;
}

.bColorBtn:checked+label:hover {
    opacity: 0.8;
}

.bColorBtn:checked+label:before {
    color: #e2ac00;
}

.sourceBtn {
    display: none;
}

.sourceBtn+label {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 5px;
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    display: flex;
    height: 2.7rem;
    justify-content: center;
    margin-left: 0.6rem;
    width: 2.7rem;
    z-index: 2;
}

.sourceBtn+label:before {
    content: "";
    font-family: 'icomoon';
    font-size: 1.6rem;
    color: #efefef;
}

.sourceBtn+label:hover {
    opacity: 0.8;
}

.sourceBtn:checked+label {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 5px;
    box-shadow: 0.3rem 0.3rem 0.9rem rgba(0, 0, 0, 0.4);
    display: flex;
    height: 2.7rem;
    justify-content: center;
    margin-left: 0.6rem;
    width: 2.7rem;
    z-index: 2;
}

.sourceBtn:checked+label:before {
    content: "";
    font-family: 'icomoon';
    font-size: 1.6rem;
    color: #efefef;
}

.sourceBtn:checked+label:hover {
    opacity: 0.8;
}

.sourceBtn:checked+label:before {
    color: #e2ac00;
}

.check {
    display: none;
}

.check:checked+label::before {
    background-color: #efefef;
}

.check:checked+label::after {
    border-bottom: #565656 2px solid;
    border-right: #565656 2px solid;
    content: "";
    display: block;
    height: 0.5rem;
    left: 0.25rem;
    position: absolute;
    top: 0.15rem;
    transform: rotate(40deg);
    width: 0.3rem;
}

.check+label {
    padding-left: 1.3rem;
    position: relative;
}

.check+label::before {
    border: #9e9e9f 1px solid;
    border-radius: 0.2rem;
    content: "";
    display: block;
    height: 0.85rem;
    left: 0;
    position: absolute;
    top: 0.1rem;
    width: 0.85rem;
}

.check+label:hover::before {
    border: #efefef 1px solid;
}

.btnCheck {
    display: none;
}

.btnCheck:checked+label {
    background-color: #ff0000;
}

.disabled {
    opacity: 0.4;
    pointer-events: none;
}

.annot {
    color: #e2ac00;
}

.trans,
.Header,
.Header__btn,
.infoBtn::before,
.Boring,
.table tbody tr,
.autoTable tbody tr {
    transition: all .4s;
}

.brTxt {
    white-space: normal;
}

.txtR {
    text-align: right;
}

.borderTxt {
    color: #000;
    font-size: 1rem;
    text-shadow: 1px 1px 0 #FFF, -1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px -1px 0 #FFF, 0px 1px 0 #FFF, -1px 0 #FFF, -1px 0 0 #FFF, 1px 0 0 #FFF;
}

.color:hover,
.color2:hover,
.colorT:hover {
    cursor: pointer;
}

.color {
    border: #636363 1px solid;
    height: 1.4rem;
    width: 4rem;
}

.color2 {
    border: #636363 1px solid;
    border-radius: 0.3rem;
    height: 1.1rem;
    margin-right: 0.2rem;
    width: 1.1rem;
}

.colorT {
    border: none;
    display: block;
    height: 100%;
    width: 100%;
}

input[type="color"]::-webkit-color-swatch-wrapper {
    padding: 0;
}

input[type="color"]::-webkit-color-swatch {
    border: none;
}

.dividerV {
    border-right: #383838 2px solid;
    height: 100%;
    margin: 0 0.5rem;
}

.l-allHW {
    height: 100%;
    width: 100% !important;
}

.l-p0 {
    padding: 0 !important;
}

.l-mlS {
    margin-left: 0.4rem;
}

.l-mlM {
    margin-left: 0.6rem;
}

.l-mtSSS {
    margin-top: 0.1rem;
}

.l-mtSS {
    margin-top: 0.3rem;
}

.l-mtS {
    margin-top: 0.6rem;
}

.l-mtM {
    margin-top: 1rem;
}

.l-blank {
    padding-left: 1.5rem;
}

.l-blankM {
    margin-left: 1.5rem;
}

.l-table {
    border-collapse: separate;
    border-spacing: 0 0.3rem;
    margin: -0.3rem 0 -0.3rem 0;
}

.l-table th,
.l-table td {
    height: 1.4rem;
}

.l-table td:nth-child(odd) {
    text-align: right;
}

.l-textCenter {
    text-align: center;
}

.l-textR {
    text-align: right;
}

.l-flex,
.EditerLgd,
.CSDsp__x,
.CSDsp__wrap,
.CSDsp__main__layer {
    display: flex;
}

.l-center,
.Sw__close,
.sBtn,
.btnCheck+label,
.cBtn {
    align-items: center;
    display: flex;
    justify-content: center;
}

.l-column {
    align-items: center;
    display: flex;
    flex-direction: column;
}

.l-row,
.Header__logo,
.btnWrap {
    align-items: center;
    display: flex;
}

.l-right {
    display: flex;
    justify-content: flex-end;
}

.l-right .l-left {
    display: flex;
    margin-right: auto;
}

.lgd {
    flex-shrink: 0;
    height: 1rem;
    width: 1.2rem;
}

.loader {
    color: #e2ac00;
    font-size: 90px;
    text-indent: -9999em;
    overflow: hidden;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    margin: 72px auto;
    position: relative;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: load6 1.7s infinite ease, round 1.7s infinite ease;
    animation: load6 1.7s infinite ease, round 1.7s infinite ease;
}

@-webkit-keyframes load6 {
    0% {
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }

    5%,
    95% {
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }

    10%,
    59% {
        box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
    }

    20% {
        box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
    }

    38% {
        box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
    }

    100% {
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }
}

@keyframes load6 {
    0% {
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }

    5%,
    95% {
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }

    10%,
    59% {
        box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
    }

    20% {
        box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
    }

    38% {
        box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
    }

    100% {
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }
}

@-webkit-keyframes round {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes round {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

input[type="radio"] {
    display: none;
}

.radio:checked+label::after {
    background: #efefef;
    border-radius: 50%;
    content: "";
    display: block;
    position: absolute;
    top: 0.31rem;
    left: 0.2rem;
    height: 0.5rem;
    width: 0.5rem;
}

.radio+label {
    padding-left: 1.2rem;
    position: relative;
}

.radio+label::before {
    border: #9e9e9f 1px solid;
    border-radius: 50%;
    content: "";
    display: block;
    position: absolute;
    top: 0.1rem;
    left: 0;
    width: 0.8rem;
    height: 0.8rem;
}

.radio+label:hover::before {
    border: #efefef 1px solid;
}

.scaleX {
    border-right: #fff 1px solid;
    font-size: 10px;
    line-height: 15px;
    text-align: right;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    /*text-orientation: upright;*/
    width: 15px;
}

.scaleX:last-child {
    position: relative;
}

.scaleX:last-child::after {
    content: "";
    display: block;
    position: absolute;
    top: 0px;
    left: 15px;
    width: 20px;
    height: 100%;
}

.scaleY,
.scaleY--editer {
    border-bottom: #fff 1px solid;
    font-size: 10px;
    height: 15px;
    line-height: 15px;
    text-align: right;
}

.scaleY:last-child,
.scaleY--editer:last-child {
    margin-bottom: 30px;
}

.scaleY--editer:last-child {
    margin-bottom: 0;
}

::-webkit-scrollbar {
    background: #2d2d2d;
    border: #4c4c4c 1px solid;
}

::-webkit-scrollbar-button {
    color: #999999;
    background: #333333;
}

::-webkit-scrollbar-button:single-button:horizontal:decrement {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2249.6px%22%20height%3D%2267.1px%22%20viewBox%3D%220%200%2049.6%2067.1%22%20style%3D%22overflow%3Avisible%3Benable-background%3Anew%200%200%2049.6%2067.1%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23CCCCCC%3B%7D%3C%2Fstyle%3E%3Cdefs%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%2239.5%2C0%2049.6%2C10.2%2020.9%2C33.6%2049.6%2C57%2039.5%2C67.1%200%2C33.6%20%22%2F%3E%3C%2Fsvg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 0.4rem;
}

::-webkit-scrollbar-button:single-button:horizontal:increment {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2249.6px%22%20height%3D%2267px%22%20viewBox%3D%220%200%2049.6%2067%22%20style%3D%22overflow%3Avisible%3Benable-background%3Anew%200%200%2049.6%2067%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23CCCCCC%3B%7D%3C%2Fstyle%3E%3Cdefs%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%2210.1%2C67%200%2C56.9%2028.8%2C33.5%200%2C10.1%2010.1%2C0%2049.6%2C33.5%20%22%2F%3E%3C%2Fsvg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 0.4rem;
}

::-webkit-scrollbar-button:single-button:vertical:decrement {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2267px%22%20height%3D%2249.7px%22%20viewBox%3D%220%200%2067%2049.7%22%20style%3D%22overflow%3Avisible%3Benable-background%3Anew%200%200%2067%2049.7%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23CCCCCC%3B%7D%3C%2Fstyle%3E%3Cdefs%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%2267%2C39.5%2056.9%2C49.7%2033.5%2C20.9%2010.1%2C49.7%200%2C39.5%2033.5%2C0%20%22%2F%3E%3C%2Fsvg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 0.5rem;
}

::-webkit-scrollbar-button:single-button:vertical:increment {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2267px%22%20height%3D%2249.6px%22%20viewBox%3D%220%200%2067%2049.6%22%20style%3D%22overflow%3Avisible%3Benable-background%3Anew%200%200%2067%2049.6%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23CCCCCC%3B%7D%3C%2Fstyle%3E%3Cdefs%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%220%2C10.1%2010.1%2C0%2033.5%2C28.8%2056.9%2C0%2067%2C10.1%2033.5%2C49.6%20%22%2F%3E%3C%2Fsvg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 0.5rem;
}

::-webkit-scrollbar-button:horizontal:decrement,
::-webkit-scrollbar-button:horizontal:increment,
::-webkit-scrollbar-button:vertical:decrement,
::-webkit-scrollbar-button:vertical:increment {
    display: none;
}

::-webkit-scrollbar-thumb {
    background: #7a7a7a;
}

::-webkit-scrollbar-corner {
    background: #3f3f3f;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.selectF {
    background: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2281.3px%22%20height%3D%2249.6px%22%20viewBox%3D%220%200%2081.3%2049.6%22%20style%3D%22enable-background%3Anew%200%200%2081.3%2049.6%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23EFEFEF%3B%7D%3C%2Fstyle%3E%3Cdefs%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%220%2C9.4%209.8%2C0%2040.7%2C31.4%2071.4%2C0%2081.3%2C9.4%2040.7%2C49.6%20%22%2F%3E%3C%2Fsvg%3E") right 0.3rem center no-repeat;
    background-size: 0.6rem;
    background-color: #3f3f3f;
    border: #636363 1px solid;
    border-radius: 0.2rem;
    color: #efefef;
    height: 1.4rem;
    line-height: 1.2rem;
    padding-left: 0.2rem;
    width: 100%;
    padding-right: 1rem;
}

.selectSS {
    background: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2281.3px%22%20height%3D%2249.6px%22%20viewBox%3D%220%200%2081.3%2049.6%22%20style%3D%22enable-background%3Anew%200%200%2081.3%2049.6%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23EFEFEF%3B%7D%3C%2Fstyle%3E%3Cdefs%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%220%2C9.4%209.8%2C0%2040.7%2C31.4%2071.4%2C0%2081.3%2C9.4%2040.7%2C49.6%20%22%2F%3E%3C%2Fsvg%3E") right 0.3rem center no-repeat;
    background-size: 0.6rem;
    background-color: #3f3f3f;
    border: #636363 1px solid;
    border-radius: 0.2rem;
    color: #efefef;
    height: 1.4rem;
    line-height: 1.2rem;
    padding-left: 0.2rem;
    width: 4rem;
    padding-right: 1rem;
}

.selectSM {
    background: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2281.3px%22%20height%3D%2249.6px%22%20viewBox%3D%220%200%2081.3%2049.6%22%20style%3D%22enable-background%3Anew%200%200%2081.3%2049.6%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23EFEFEF%3B%7D%3C%2Fstyle%3E%3Cdefs%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%220%2C9.4%209.8%2C0%2040.7%2C31.4%2071.4%2C0%2081.3%2C9.4%2040.7%2C49.6%20%22%2F%3E%3C%2Fsvg%3E") right 0.3rem center no-repeat;
    background-size: 0.6rem;
    background-color: #3f3f3f;
    border: #636363 1px solid;
    border-radius: 0.2rem;
    color: #efefef;
    height: 1.4rem;
    line-height: 1.2rem;
    padding-left: 0.2rem;
    width: 4rem;
    padding-right: 1rem;
}

.selectS {
    background: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2281.3px%22%20height%3D%2249.6px%22%20viewBox%3D%220%200%2081.3%2049.6%22%20style%3D%22enable-background%3Anew%200%200%2081.3%2049.6%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23EFEFEF%3B%7D%3C%2Fstyle%3E%3Cdefs%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%220%2C9.4%209.8%2C0%2040.7%2C31.4%2071.4%2C0%2081.3%2C9.4%2040.7%2C49.6%20%22%2F%3E%3C%2Fsvg%3E") right 0.3rem center no-repeat;
    background-size: 0.6rem;
    background-color: #3f3f3f;
    border: #636363 1px solid;
    border-radius: 0.2rem;
    color: #efefef;
    height: 1.4rem;
    line-height: 1.2rem;
    padding-left: 0.2rem;
    width: 8rem;
    padding-right: 1rem;
}

.selectM {
    background: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2281.3px%22%20height%3D%2249.6px%22%20viewBox%3D%220%200%2081.3%2049.6%22%20style%3D%22enable-background%3Anew%200%200%2081.3%2049.6%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23EFEFEF%3B%7D%3C%2Fstyle%3E%3Cdefs%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%220%2C9.4%209.8%2C0%2040.7%2C31.4%2071.4%2C0%2081.3%2C9.4%2040.7%2C49.6%20%22%2F%3E%3C%2Fsvg%3E") right 0.3rem center no-repeat;
    background-size: 0.6rem;
    background-color: #3f3f3f;
    border: #636363 1px solid;
    border-radius: 0.2rem;
    color: #efefef;
    height: 1.4rem;
    line-height: 1.2rem;
    padding-left: 0.2rem;
    width: 12rem;
    padding-right: 1rem;
}

.selectM:hover {
    border: #9e9e9f 1px solid;
}

.selectL {
    background: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2281.3px%22%20height%3D%2249.6px%22%20viewBox%3D%220%200%2081.3%2049.6%22%20style%3D%22enable-background%3Anew%200%200%2081.3%2049.6%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23EFEFEF%3B%7D%3C%2Fstyle%3E%3Cdefs%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%220%2C9.4%209.8%2C0%2040.7%2C31.4%2071.4%2C0%2081.3%2C9.4%2040.7%2C49.6%20%22%2F%3E%3C%2Fsvg%3E") right 0.3rem center no-repeat;
    background-size: 0.6rem;
    background-color: #3f3f3f;
    border: #636363 1px solid;
    border-radius: 0.2rem;
    color: #efefef;
    height: 1.4rem;
    line-height: 1.2rem;
    padding-left: 0.2rem;
    width: 20rem;
    padding-right: 1rem;
}

.selectL:hover {
    border: #9e9e9f 1px solid;
}

.selectT {
    background: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2281.3px%22%20height%3D%2249.6px%22%20viewBox%3D%220%200%2081.3%2049.6%22%20style%3D%22enable-background%3Anew%200%200%2081.3%2049.6%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23EFEFEF%3B%7D%3C%2Fstyle%3E%3Cdefs%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%220%2C9.4%209.8%2C0%2040.7%2C31.4%2071.4%2C0%2081.3%2C9.4%2040.7%2C49.6%20%22%2F%3E%3C%2Fsvg%3E") right 0.3rem center no-repeat;
    background-size: 0.6rem;
    background-color: #3f3f3f;
    border: #636363 1px solid;
    border-radius: 0.2rem;
    color: #efefef;
    height: 1.4rem;
    line-height: 1.2rem;
    padding-left: 0.2rem;
    width: 100%;
    padding-right: 1rem;
    background-color: transparent;
    border: none;
    height: 100%;
}

.selectT:hover {
    border: #9e9e9f 1px solid;
}

.selectT:checked {
    background-color: transparent;
}

.selectT option {
    background-color: #3f3f3f;
}

@-moz-document url-prefix() {
    .selectM {
        background: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2281.3px%22%20height%3D%2249.6px%22%20viewBox%3D%220%200%2081.3%2049.6%22%20style%3D%22enable-background%3Anew%200%200%2081.3%2049.6%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23EFEFEF%3B%7D%3C%2Fstyle%3E%3Cdefs%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%220%2C9.4%209.8%2C0%2040.7%2C31.4%2071.4%2C0%2081.3%2C9.4%2040.7%2C49.6%20%22%2F%3E%3C%2Fsvg%3E") right 0.3rem center no-repeat;
        background-size: 0.6rem;
        background-color: #3f3f3f;
        border: #636363 1px solid;
        border-radius: 0.2rem;
        color: #efefef;
        height: 1.4rem;
        line-height: 1.2rem;
        padding-left: 0.2rem;
        width: 12rem;
        padding-right: 1rem;
        padding-left: 0;
    }

    .selectM:hover {
        border: #9e9e9f 1px solid;
    }

    .selectT {
        background: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2281.3px%22%20height%3D%2249.6px%22%20viewBox%3D%220%200%2081.3%2049.6%22%20style%3D%22enable-background%3Anew%200%200%2081.3%2049.6%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23EFEFEF%3B%7D%3C%2Fstyle%3E%3Cdefs%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%220%2C9.4%209.8%2C0%2040.7%2C31.4%2071.4%2C0%2081.3%2C9.4%2040.7%2C49.6%20%22%2F%3E%3C%2Fsvg%3E") right 0.3rem center no-repeat;
        background-size: 0.6rem;
        background-color: #3f3f3f;
        border: #636363 1px solid;
        border-radius: 0.2rem;
        color: #efefef;
        height: 1.4rem;
        line-height: 1.2rem;
        padding-left: 0.2rem;
        width: 100%;
        padding-right: 1rem;
        background-color: transparent;
        border: none;
        height: 100%;
        padding-left: 0;
    }

    .selectT:hover {
        border: #9e9e9f 1px solid;
    }

    .selectT:checked {
        background-color: transparent;
    }

    .selectT option {
        background-color: #3f3f3f;
    }
}

.slider {
    padding: 0 0.4rem;
    width: 7rem !important;
}

input[type=range] {
    -webkit-appearance: none;
    background-color: transparent;
    margin: 0;
    width: 100%;
}

input[type=range]:focus {
    outline: none;
}

/* WebKit・Blink 溝*/
input[type=range]::-webkit-slider-runnable-track {
    width: 100%;
    height: 0.3rem;
    cursor: pointer;
    background: #3f3f3f;
    border-radius: 0.2rem;
}

/* WebKit・Blink・Edge つまみ*/
input[type=range]::-webkit-slider-thumb {
    height: 1rem;
    width: 1rem;
    border-radius: 50%;
    background: #e2ac00;
    border: 1px #e2ac00 solid;
    cursor: pointer;
    -webkit-appearance: none;
    /* 以下は つまみの縦位置調整 */
    margin-top: -6px;
    /* (つまみの高さ - トラックの高さ) / 2  つまみの高さは border を含む */
}

/* Firefox 溝*/
input[type=range]::-moz-range-track {
    width: 100%;
    height: 0.3rem;
    cursor: pointer;
    background: #3f3f3f;
    border-radius: 0.2rem;
}

/* Firefox つまみ*/
input[type=range]::-moz-range-thumb {
    height: 0.9rem;
    width: 0.9rem;
    border: 1px #e2ac00 solid;
    border-radius: 50%;
    background: #e2ac00;
    cursor: pointer;
}

/* Edge・IE向け ポップアップを非表示に */
input[type=range]::-ms-tooltip {
    display: none;
}

/* webkitの margin-top 指定が Edge に効いてしまうので、Edge向けに設定をリセット */
@supports (-ms-ime-align: auto) {
    input[type=range]::-webkit-slider-thumb {
        margin-top: 0 !important;
    }
}

.tab+label:hover {
    background-color: #515151;
}

.tab:checked+label {
    background: #494949;
}

.tab+label {
    display: inline-block;
    border: #3f3f3f 1px solid;
    border-left: none;
    background-color: #565656;
    height: 1.5rem;
    line-height: 1.4rem;
    text-align: center;
    width: 7rem;
}

.tab+label:first-of-type {
    border-left: #3f3f3f 1px solid;
    margin-left: 0;
}

td {
    white-space: nowrap;
}

.table,
.autoTable {
    border-collapse: separate;
    border-spacing: 0px;
    table-layout: fixed;
    width: 100%;
}

.table thead tr th,
.autoTable thead tr th {
    position: sticky;
    top: 0;
}

.table th,
.autoTable th {
    background-color: #636363;
    border: #565656 1px solid;
    height: 1.4rem;
    font-weight: normal;
    position: relative;
}

.table tbody tr,
.autoTable tbody tr {
    background-color: #3f3f3f;
}

.table tbody tr:not(.selRow):hover,
.autoTable tbody tr:not(.selRow):hover {
    background-color: rgba(226, 172, 0, 0.3);
}

.table td,
.autoTable td {
    border: #565656 1px solid;
    height: 1.4rem;
    padding: 0 0.2rem;
}

.autoTable tbody tr:hover {
    background-color: #3f3f3f !important;
}

.tsSS {
    width: 2rem;
}

.tsS {
    width: 4rem;
}

.tsSM {
    width: 6rem;
}

.tsM {
    width: 10rem;
}

.tsL {
    width: 15rem;
}

.tsLgd {
    width: 8.5rem;
}

.selRow {
    background-color: rgba(226, 172, 0, 0.7) !important;
}

.textS {
    background-color: #3f3f3f;
    border: #636363 1px solid;
    border-radius: 0.2rem;
    color: #efefef;
    height: 1.4rem;
    line-height: 1.2rem;
    padding-left: 0.2rem;
    width: 8rem;
}

.textS:hover {
    border: #9e9e9f 1px solid;
}

.textM {
    background-color: #3f3f3f;
    border: #636363 1px solid;
    border-radius: 0.2rem;
    color: #efefef;
    height: 1.4rem;
    line-height: 1.2rem;
    padding-left: 0.2rem;
    width: 12rem;
}

.textM:hover {
    border: #9e9e9f 1px solid;
}

.textT {
    background-color: transparent;
    border: none;
    color: #efefef;
    height: 100%;
    padding-left: 0.1rem;
    width: 100%;
}

.textTR {
    background-color: transparent;
    border: none;
    color: #efefef;
    height: 100%;
    padding-left: 0.1rem;
    width: 100%;
    text-align: right;
}

.textT:hover {
    border: #9e9e9f 1px solid;
}

.zoom {
    background: rgba(0, 60, 136, 0.5);
    border-radius: 4px;
    bottom: 8px;
    font-size: 0.7rem;
    line-height: 22px;
    height: 22px;
    right: 8px;
    padding: 0 5px;
    position: absolute;
    width: 121px;
}

.wl_label {
    display: inline-block;
    text-align: right;
    margin-top: 0.2rem;
    width: 120px;
}

.wl_labelM {
    display: inline-block;
    text-align: right;
    margin-top: 0.2rem;
    width: 140px;
}

.kc_label {
    margin-top: 0.2rem;
}

.ido_radioS {
    display: inline-block;
    text-align: right;
    margin-top: 0.2rem;
    width: 5px;
}

.ido_radioM {
    display: inline-block;
    text-align: center;
    margin-top: 0.2rem;
    width: 140px;
}

.idoTable {
    border-collapse: separate;
    border-spacing: 0px;
    table-layout: fixed;
    width: 100%;
}

.idoTable thead tr th {
    position: sticky;
    top: 0;
}

.idoTable th {
    background-color: #636363;
    border: #565656 1px solid;
    height: 1.4rem;
    font-weight: normal;
    position: relative;
}

.idoTable tbody tr {
    background-color: #3f3f3f;
}

.idoTable tbody tr:not(.selRow):hover {
    background-color: rgba(226, 172, 0, 0.3);
}

.idoTable td {
    border: #565656 1px solid;
    height: 1.4rem;
    padding: 0 0.2rem;
}

.idoInput {
    background-color: #494949;
    border: #3f3f3f 1px solid;
    height: 6rem;
    position: relative;
    white-space: nowrap;
    width: 32rem;
}

.IdotsL {
    width: 10rem;
}

/** チェックOFFなら非表示 */
.optCheck {
    display: none;
}

/** チェックOFFなら非表示 */
.optBlock {
    display: block;
}

.textSS {
    background-color: #3f3f3f;
    border: #636363 1px solid;
    border-radius: 0.2rem;
    color: #efefef;
    height: 1.4rem;
    line-height: 1.2rem;
    padding-left: 0.2rem;
    width: 6rem;
}

.textSSR {
    background-color: #3f3f3f;
    border: #636363 1px solid;
    border-radius: 0.2rem;
    color: #efefef;
    height: 1.4rem;
    line-height: 1.2rem;
    padding-right: 0.2rem;
    width: 6rem;
    text-align: right;
}

.textSSA {
    background-color: #565656;
    border: #565656 1px solid;
    border-radius: 0.2rem;
    color: #efefef;
    height: 1.4rem;
    line-height: 1.2rem;
    padding-left: 0.2rem;
    width: 8rem;
}

.textSSAL {
    background-color: #565656;
    border: #565656 1px solid;
    border-radius: 0.2rem;
    color: #efefef;
    height: 1.4rem;
    line-height: 1.2rem;
    padding-left: 0.2rem;
    width: 16rem;
}

.plBtn {
    background-color: #565656;
    border: #efefef 2px solid;
    border-radius: 0.7rem;
    color: #efefef;
    height: 1.5rem;
    width: 6.6rem;
}

.scrCheck {
    text-align: center;
}

.conCheck {
    text-align: center;
}

.selfLearnCheck {
    display: inline-block;
    margin-right: 1rem;
}

.envList {
    max-height: 100px;
    background-color: #3f3f3f;
    list-style: none;
    overflow-y: auto;
    list-style: none;
    padding: 0;
    margin: 0;
}

.wellsTable {
    border-collapse: separate;
    border-spacing: 0px;
    table-layout: fixed;
    width: 100%;
}

.ws_Check {
    display: inline-block;
    text-align: left;
    margin-top: 0.2rem;
    width: 6rem;
}

.ws_CheckL {
    display: inline-block;
    text-align: left;
    margin-top: 0.2rem;
    width: 15rem;
}

/* 秒数表示のスタイル */
.loading-start {
    font-size: 16px;
    margin: 0;
    /* マージンをリセット */
    padding: 0;
    /* パディングをリセット */
    white-space: nowrap;
    /* テキストを折り返さないようにする */
}

/* 秒数表示のスタイル */
.download {
    font-size: 14px;
    margin: 0;
    /* マージンをリセット */
    padding: 0;
    /* パディングをリセット */
    white-space: nowrap;
    /* テキストを折り返さないようにする */
}

/* HTML: <div class="loader"></div> */
/* HTML: <div class="loader"></div> */
.loader2 {
    width: 50px;
    aspect-ratio: 1;
    border-radius: 50%;
    padding: 3px;
    background:
        radial-gradient(farthest-side, #565656 95%, #0000) 50% 0/12px 12px no-repeat,
        radial-gradient(farthest-side, #0000 calc(100% - 5px), #e2ac00 calc(100% - 4px)) content-box;
    animation: l6 2s infinite;
}

.loader3 {
    width: 20px;
    aspect-ratio: 1;
    border-radius: 50%;
    padding: 3px;
    background:
        radial-gradient(farthest-side, #565656 95%, #0000) 50% 0/12px 12px no-repeat,
        radial-gradient(farthest-side, #0000 calc(100% - 5px), #e2ac00 calc(100% - 4px)) content-box;
    animation: l6 2s infinite;
}

@keyframes l6 {
    to {
        transform: rotate(1turn)
    }
}

.highlighted {
    background-color: yellow;
    /* ハイライト時の背景色 */
    color: black;
    /* ハイライト時のテキスト色 */
}


.dataSource {
    font-size: 0.6rem;
}

.legend-marker {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 5px;
}

.legendSw {
    background-color: #565656;
    font-size: 14px;
}

/* メッセージボックスのスタイル */
#message {
    background-color: #565656;
    color: white;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    transition: opacity 0.5s ease-in-out;
    z-index: 10001;
    /* メッセージを前面に表示する */
}


/* 非表示状態 */
.hidden {
    opacity: 0;
}

.MeaInput {
    background-color: #494949;
    border: #3f3f3f 1px solid;
    height: 10rem;
    position: relative;
    white-space: nowrap;
    width: 16rem;
}

.MeaInput2 {
    background-color: #494949;
    border: #3f3f3f 1px solid;
    height: 7rem;
    position: relative;
    white-space: nowrap;
    width: 16rem;
}

.OutTimeInput {
    background-color: #494949;
    border: #3f3f3f 1px solid;
    height: 10rem;
    position: relative;
    white-space: nowrap;
    width: 9rem;
}

.OutTime {
    display: "flex";
    margin-top: 0.3rem;
    margin-bottom: 0.1rem;
}

.otLabel {
    display: inline-block;
    text-align: right;
    margin-top: 0.2rem;
    width: 85px;
}

.no-border {
    border: none;
    /* クラスで枠線を消す */
    background-color: transparent;
    padding: 0;
    margin: 0;
}

.visible-window {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.5s ease-in-out;
}

.hidden-window {
    opacity: 0;
    /* 透明化 */
    visibility: hidden;
    /* クリック無効 */
    position: absolute;
    left: -9999px;
    /* 画面外に移動 */
    transition: opacity 0.5s ease-in-out;
}

.bud_label {
    width: 140px; /* ラベルの幅を統一 */
    text-align: right;
    white-space: nowrap;
}