.ddl.cp_ipselect.cp_sl01::before {
    top: 9px;
}

.flex, .flexBox {
    display: flex;
}

.b-btn-area {
    justify-content: space-evenly;
    align-items: center;
}

.b-btn {
    user-select: none;
    padding: 7px 25px;
    border-radius: 5px;
}

.b-btn--send {
    background-color: #E6E6E6;
    color: #443322;
    cursor: pointer;
    text-decoration: none;
}

.cp_sl01 {
    position: absolute;
    top: 0.4em;
    right: 0.8em;
    padding: 0;
    content: '';
    width: 8px;
    height: 8px;
    border: 1.5px solid;
    border-color: transparent transparent #565656 #565656;
    transform: rotate(-45deg);
    pointer-events: none;
}

.bukkenOptionItem {
    display: flex;
    align-items: center;
}

    .bukkenOptionItem:hover {
        background-color: #0e64cd;
        color: white;
    }

.bukkenName span {
    display: inline-block;
    width: 10em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin-top: 8px;
}

#selectedName {
    display: inline-block;
    width: 10em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

#mainDiv {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
}

#subDiv1 {
    margin-top: 2%;
}

#subDiv2 {
    width: 550px;
}

.login {
    box-shadow: rgba(10, 10, 10, 0.1) 6px 0em 2em 0.2em, rgba(10, 10, 10, 0.02) 5px 3px 1px 6px;
}

#normal {
    height: 735px;
}

#divRogoSize {
    margin: auto;
    width: 100%;
}

.containerSerch1 {
    padding-top: 8px;
    padding-bottom: 5px;
}

#user {
    width: 80%;
}

.containerSerch2 {
    padding-top: 5px;
    padding-bottom: 5px;
}

.passwordLogininp {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

#pass {
    width: 80%;
}

#view {
    cursor: pointer;
    width: 22px;
    height: 22px;
    color: #000000;
}

#divbtnLogin {
    padding-right: 10px;
    padding-top: 15px;
}

#spanbtnLogin {
    padding-left: 210px;
}

#divPass {
    margin-top: 22px;
}

#passLabel {
    margin-left: 130px;
    margin-top: 22px;
}

#passChange {
    color: -webkit-link;
}

#div推奨環境 {
    margin-top: 22px;
    font-size: 12px;
    color: #999999;
}

#subdiv推奨環境 {
    margin-left: 30px;
}

#details1 {
    margin-left: 30px;
}

#details2 {
    margin-left: 30px;
}

#subdiv推奨環境2 {
    padding-top: 10px;
    margin-left: 30px;
}

#subdiv推奨環境3 {
    margin-left: 30px;
}

#divImg {
    width: 100%;
    margin-top: 15px;
    text-align: center;
}

#android_a {
    margin-left: 95px;
}

.paddingtop10 {
    padding-top: 10px;
}

.paddingbot10 {
    padding-bottom: 10px;
}

.dplNone {
    display: none;
}

#screenBukkenItem {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 15px;
    margin-top: 50px;
}

#subScreenBukkenItem1 {
    display: flex;
    flex-direction: column;
}

#subScreenBukkenItem2 {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

#span物件選択 {
    display: flex;
    justify-content: center;
}

#divSelect {
    display: flex;
    width: 220PX;
    height: 32px !important;
    border: 1.8px solid #e6e6e6;
    border-radius: 3px;
    align-items: center;
    padding: 10px;
    position: relative;
    cursor: pointer;
}

#divCode {
    width: 155px;
}

#selectedCode {
    font-size: 16px;
}

#divName {
    width: 170px;
    height: 27px;
}

#selectedName {
    font-size: 16px;
}

#divSelectedNotice {
    background-color: red;
    color: white;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: system-ui, -apple-system, Roboto;
    font-weight: bold;
    line-height: 20px;
}

    #divSelectedNotice.badge100 {
        border-radius: 20px;
        padding: 0 6px;
        width: auto;
    }

#selectedNotice {
    font-size: 12px;
    margin: auto;
}

#bukkenOption {
    display: none;
    width: 220px;
    max-height: 410px;
    min-height: 30px;
    border: 1.8px solid #e6e6e6;
    border-radius: 5px;
    position: absolute;
    top: 30px;
    left: -1px;
    overflow: auto;
    background-color: white;
}

#maintenance {
    height: 475px;
    display: none;
}

#maintenanceSub1 {
    margin: auto;
    width: 62%;
}

#maintenanceSub2 {
    text-align: center;
    font-size: 40px;
}

#maintenanceSub3 {
    text-align: center;
}

#maintenanceText {
    white-space: pre-wrap;
}

.bukkenCode {
    width: 155px;
    margin-left: 10px;
}

.bukkenName {
    width: 170px;
}

.bukkenNotice {
    background-color: red;
    color: white;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: system-ui, -apple-system, Roboto;
    font-weight: bold;
    line-height: 20px;
}

    .bukkenNotice.badge100 {
        border-radius: 20px;
        padding: 0 6px;
        width: auto;
    }

    .bukkenNotice > span {
        font-size: 12px;
        margin: auto;
    }

.ion--eye {
    display: inline-block;
    width: 22px;
    height: 22px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Ccircle cx='256' cy='256' r='64' fill='%23000000'/%3E%3Cpath fill='%23000000' d='M490.84 238.6c-26.46-40.92-60.79-75.68-99.27-100.53C349 110.55 302 96 255.66 96c-42.52 0-84.33 12.15-124.27 36.11c-40.73 24.43-77.63 60.12-109.68 106.07a31.92 31.92 0 0 0-.64 35.54c26.41 41.33 60.4 76.14 98.28 100.65C162 402 207.9 416 255.66 416c46.71 0 93.81-14.43 136.2-41.72c38.46-24.77 72.72-59.66 99.08-100.92a32.2 32.2 0 0 0-.1-34.76M256 352a96 96 0 1 1 96-96a96.11 96.11 0 0 1-96 96'/%3E%3C/svg%3E");
}

.ion--eye-off {
    display: inline-block;
    width: 22px;
    height: 22px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23000000' d='M432 448a15.92 15.92 0 0 1-11.31-4.69l-352-352a16 16 0 0 1 22.62-22.62l352 352A16 16 0 0 1 432 448M248 315.85l-51.79-51.79a2 2 0 0 0-3.39 1.69a64.11 64.11 0 0 0 53.49 53.49a2 2 0 0 0 1.69-3.39m16-119.7L315.87 248a2 2 0 0 0 3.4-1.69a64.13 64.13 0 0 0-53.55-53.55a2 2 0 0 0-1.72 3.39'/%3E%3Cpath fill='%23000000' d='M491 273.36a32.2 32.2 0 0 0-.1-34.76c-26.46-40.92-60.79-75.68-99.27-100.53C349 110.55 302 96 255.68 96a226.5 226.5 0 0 0-71.82 11.79a4 4 0 0 0-1.56 6.63l47.24 47.24a4 4 0 0 0 3.82 1.05a96 96 0 0 1 116 116a4 4 0 0 0 1.05 3.81l67.95 68a4 4 0 0 0 5.4.24a343.8 343.8 0 0 0 67.24-77.4M256 352a96 96 0 0 1-93.3-118.63a4 4 0 0 0-1.05-3.81l-66.84-66.87a4 4 0 0 0-5.41-.23c-24.39 20.81-47 46.13-67.67 75.72a31.92 31.92 0 0 0-.64 35.54c26.41 41.33 60.39 76.14 98.28 100.65C162.06 402 207.92 416 255.68 416a238.2 238.2 0 0 0 72.64-11.55a4 4 0 0 0 1.61-6.64l-47.47-47.46a4 4 0 0 0-3.81-1.05A96 96 0 0 1 256 352'/%3E%3C/svg%3E");
}

#responsive {
    width: 100%;
    height: 100%;
    justify-content: center;
}

#pResponsive1 {
    font-size: 25px;
    margin-top: 10px;
    margin-left: 15px
}

#pResponsive2 {
    font-size: 25px;
    margin-top: 15px;
    margin-left: 15px
}

#subdivResponsive {
    margin-top: 45px
}

    #subdivResponsive > p {
        font-size: 25px;
    }

    #subdivResponsive > a {
        margin-left: 15px;
    }

.cover-spin {
    position: absolute;
    width: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    /*background-color: rgba(0,0,0,0.7);*/
    z-index: 9999;
}

    .cover-spin::after {
        content: '';
        display: block;
        position: absolute;
        left: 48%;
        top: 40%;
        width: 40px;
        height: 40px;
        border-style: solid;
        /*border-color: #FFFFFF;*/
        border-color: #c0c0c0;
        border-top-color: transparent;
        border-width: 4px;
        border-radius: 50%;
        -webkit-animation: spin .8s linear infinite;
        animation: spin .8s linear infinite;
    }
.btn--login {
    background-color: #0ab04a;
}
#btnSentaku {
    background: #0ab04a;
}
input:-webkit-autofill {
    box-shadow: 0 0 0 1000px #ffffff inset !important;
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
    -webkit-text-fill-color: #000 !important;
}
