@charset "UTF-8";
/* SASS 請使用 sass 編譯器 */
body {
    font-size: 16px;
    font-family: Microsoft JhengHei;
    background: #F1F4F6;
    position: relative;
}

label {
    font-size: 14px;
}

input {
    font-size: 14px;
}

    input::-webkit-input-placeholder {
        color: #A1A1A1;
        font-size: 14px;
    }

    input::-moz-placeholder {
        color: #A1A1A1;
        font-size: 14px;
    }

    input:-ms-input-placeholder {
        color: #A1A1A1;
        font-size: 14px;
    }

    input::-ms-input-placeholder {
        color: #A1A1A1;
        font-size: 14px;
    }

    input::placeholder {
        color: #A1A1A1;
        font-size: 14px;
    }

    input::read-only {
        background: #e9ecef;
    }

    input[type="text"] {
        border: solid 1px #CED4DA;
        border-radius: 0.25rem;
    }

        input[type="text"]::read-only {
            background: #e9ecef;
        }

    input[type="number"]::read-only {
        background: #e9ecef;
    }

    input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
        -moz-appearance: textfield;
    }

button {
    position: relative;
}

    button::after {
        content: '';
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: 5;
        top: 0;
        left: 0;
    }

.form-control, .form-select {
    font-size: 14px;
}

table tbody tr td input[type="text"] {
    width: 100%;
    height: 40px;
    padding-left: 10px;
}

.hv-100 {
    height: 100vh;
}

.w-906x {
    width: 906px;
}

.w-155x {
    width: 155px;
}

.w-105x {
    width: 105px;
}

.w-100x {
    width: 100px;
}

.w-60x {
    width: 60px;
}

.w-30x {
    width: 30px;
}

.w-22x {
    width: 22px;
}

.container.container-1500 {
    max-width: 1500px;
}

.fs-12 {
    font-size: 12px;
}

.pr-15x {
    padding-right: 15px;
}

.pr-37x {
    padding-right: 37px;
}

.px-15x {
    padding-left: 15px;
    padding-right: 15px;
}

.w-100x {
    width: 100px;
}

.me-44x {
    margin-right: 44px;
}

.btn {
    font-size: 14px;
    text-align: center;
}

    .btn.btn-blue {
        color: #fff;
        background-color: #1A6CB8;
        border-color: #1A6CB8;
    }

    .btn.btn-lightblue {
        color: #fff;
        background-color: #798FA5;
        border-color: #798FA5;
    }

    .btn.btn-Edit {
        color: #fff;
        background-color: #6C757D;
        border-color: #6C757D;
    }

    .btn.btn-darkblue {
        color: #fff;
        background-color: #0c4781;
        border-color: #0c4781;
    }

    .btn.btn-paleblue {
        color: #0c4781;
        background-color: #81bcf5;
        border-color: #81bcf5;
    }

    .btn.btn-paleWhiteblue {
        color: #3174b5;
        background-color: #f9fafb;
        border-color: #f9fafb;
    }

    .btn.btn-clear {
        color: #FFF;
        background-color: #dd6d6d;
        border-color: #dd6d6d;
    }

a.btn.btn-success {
    color: #FFF;
}

.blue-2c3-bg {
    background: #2c3e50;
}

.grey-2c3 {
    color: #7D7D7D;
}

.LoginLogoBox {
    position: absolute;
    left: 15px;
    top: 15px;
    z-index: 10;
}

.LoginContainer {
    height: 100vh;
}

    .LoginContainer .LoginBgImg {
        background: url("../img/Loginbg.jpg") 0 -347px no-repeat #293d51;
        background-size: 100% !important;
    }

    .LoginContainer .LoginBox {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding-left: 12rem;
        padding-right: 12rem;
        background: #2c3e50;
        color: #FFF;
        background: #293d51;
        background: -webkit-gradient(linear, left top, left bottom, from(#293d51), to(#080c10));
        background: -o-linear-gradient(top, #293d51 0%, #080c10 100%);
        background: linear-gradient(to bottom, #293d51 0%, #080c10 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#293d51', endColorstr='#080c10',GradientType=0 );
        position: relative;
    }

        .LoginContainer .LoginBox form {
            width: 350px;
            margin: 0 auto;
        }

            .LoginContainer .LoginBox form h2 {
                font-size: 30px;
                font-weight: bolder;
                margin-bottom: 25px;
            }

        .LoginContainer .LoginBox::after {
            content: '';
            position: absolute;
            width: 200px;
            height: 100vh;
            top: 0;
            right: -167px;
            background: #293d51;
            background: -webkit-gradient(linear, left top, left bottom, from(#293d51), to(#080c10));
            background: -o-linear-gradient(top, #293d51 0%, #080c10 100%);
            background: linear-gradient(to bottom, #293d51 0%, #080c10 100%);
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#293d51', endColorstr='#080c10',GradientType=0 );
            -webkit-transform-origin: bottom;
            -ms-transform-origin: bottom;
            transform-origin: bottom;
            -webkit-transform: skewX(9deg);
            -ms-transform: skewX(9deg);
            transform: skewX(9deg);
        }

        .LoginContainer .LoginBox .ForgetLink {
            font-size: 12px;
            display: block;
            text-align: right;
            color: #077AEE;
            text-decoration: none;
            margin-bottom: 10px;
        }

        .LoginContainer .LoginBox .PasswordGroup button {
            border: 0;
            background: none;
            right: 6px;
            position: absolute;
            height: 37px;
        }

            .LoginContainer .LoginBox .PasswordGroup button:after {
                content: '';
                position: absolute;
                width: 100%;
                height: 100%;
                z-index: 3;
                right: 0;
                top: 0;
            }

        .LoginContainer .LoginBox button[type="submit"] {
            width: 100%;
        }

@media screen and (max-width: 1459px) {
    .LoginContainer .LoginBgImg {
        background: url("../img/Loginbg.jpg") 0 0px no-repeat #293d51;
        background-size: 150% !important;
    }
}

@media screen and (max-width: 1302px) {
    .LoginContainer .LoginBgImg {
        background: url("../img/Loginbg.jpg") 0 0px no-repeat #293d51;
        background-size: 300% !important;
    }
}

@media screen and (max-width: 991px) {
    .LoginContainer .LoginBox {
        padding: 0;
    }

        .LoginContainer .LoginBox::after {
            display: none;
        }

    .LoginContainer .LoginBgImg {
        display: none;
    }
}

.HomeContent {
    min-height: 100vh;
    background: url("../img/LeftHome_left.png") left bottom no-repeat;
}

    .HomeContent::after {
        content: '';
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background: url("../img/LeftHome_left.png") right bottom no-repeat;
        z-index: 1;
    }

.HomeMenu {
    width: 100%;
    padding-top: 4%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    z-index: 5;
}

    .HomeMenu .list-group {
        -webkit-box-orient: inherit;
        -webkit-box-direction: inherit;
        -ms-flex-direction: inherit;
        flex-direction: inherit;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        width: 100%;
    }

        .HomeMenu .list-group li {
            width: calc( 100% / 4 - 4%);            
            border-radius: 10px;
            -webkit-box-shadow: 2px 2px 5px #ccc;
            box-shadow: 2px 2px 5px #ccc;
            margin-right: 4%;
            margin-bottom: 4%;
            position: relative;
        }

            .HomeMenu .list-group li:hover::after {
                -webkit-transition: .3s;
                -o-transition: .3s;
                transition: .3s;
            }

            .HomeMenu .list-group li:hover a svg {
                color: #FFF;
            }

            .HomeMenu .list-group li:hover a:after {
                background: #1A6CB8;
                ransition: .3s;
            }

        .HomeMenu .list-group a {
            text-decoration: none;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-pack: end;
            -ms-flex-pack: end;
            justify-content: flex-end;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            width: 100%;
            height: 312px;
            position: relative;
            font-size: 22px;
            color: #515151;
            padding: 40px;
            z-index: 1;
        }

            .HomeMenu .list-group a p {
                margin-bottom: 0;
            }

            .HomeMenu .list-group a::after {
                content: '';
                position: absolute;
                width: 133px;
                height: 133px;
                background: #c5e1fb7a;
                border-radius: 30px;
                top: 40px;
                -webkit-transition: .2s;
                -o-transition: .2s;
                transition: .2s;
            }

            .HomeMenu .list-group a svg {
                color: #1A6CB8;
                font-size: 3.5rem;
                display: block;
                position: relative;
                z-index: 3;
                position: absolute;
                top: 80px;
                left: 50%;
                -webkit-transform: translateX(-50%);
                -ms-transform: translateX(-50%);
                transform: translateX(-50%);
            }

@media screen and (max-width: 1388px) {
    .HomeMenu .list-group a {
        padding: 12px;
        height: 242px;
    }

        .HomeMenu .list-group a:after {
            width: 105px;
            height: 105px;
        }

        .HomeMenu .list-group a svg {
            top: 70px;
            font-size: 3rem;
        }
}

@media screen and (max-width: 1295px) {
    .HomeMenu .list-group li {
        width: calc( 100% / 3 - 4%);
    }
}

@media screen and (max-width: 996px) {
    .HomeMenu .list-group {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

        .HomeMenu .list-group li {
            width: calc( 100% / 2 - 2%);
        }

            .HomeMenu .list-group li:nth-of-type(2n) {
                margin-right: 0;
            }
}

@media screen and (max-width: 767px) {
    .HomeContent .MinMenu {
        display: none;
    }
}

@media screen and (max-width: 600px) {
    .HomeMenu .list-group li a {
        padding: 0;
        height: 185px;
        font-size: 18px;
    }

        .HomeMenu .list-group li a:after {
            width: 80px;
            height: 80px;
            top: 26px;
        }

        .HomeMenu .list-group li a svg {
            font-size: 2rem;
            top: 50px;
        }

    .HomeMenu .list-group li:hover a svg {
        color: #1A6CB8;
    }

    .HomeMenu .list-group li:hover a:after {
        background: #c5e1fb7a;
    }
}

header {
    position: relative;
    z-index: 2;
}

.LeftLogobar {
    background: #2c3e50;
    -webkit-box-shadow: 0px 3px 5px #cfcfcf;
    box-shadow: 0px 3px 5px #cfcfcf;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

    .LeftLogobar img {
        display: block;
        margin: 0 auto;
        max-width: 100%;
    }

.Signout {
    background: none;
    border: 0;
    font-size: 14px;
    color: #7D7D7D;
}

    .Signout svg {
        font-size: 14px;
        margin-left: 8px;
    }

.Headerbar {
    width: 100%;
    padding: 1rem 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.MinMenubar {
    display: none;
}

@media screen and (max-width: 767px) {
    .LeftLogobar {
        display: none;
    }

    .MinMenubar {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

        .MinMenubar .MinMenu {
            margin-right: 23px;
        }

    header .bg-white {
        background-color: #2c3e50 !important;
    }

    .Signout {
        color: #abc1d7;
    }

    .MinLogo {
        width: 130px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

        .MinLogo img {
            width: 100%;
        }
}

.breadcrumb li {
    font-size: 12px;
}

    .breadcrumb li a {
        font-size: 12px;
        color: #7D7D7D;
        text-decoration: none;
    }

.Min_Breadcrumb {
    display: none;
}

@media screen and (max-width: 767px) {
    .breadcrumb {
        display: none;
    }

    .Min_Breadcrumb {
        display: block;
        margin-bottom: 10px;
    }

        .Min_Breadcrumb .breadcrumb {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: end;
            -ms-flex-pack: end;
            justify-content: flex-end;
        }
}

.LeftNavbar {
    min-height: 100vh;
    background: #2c3e50;
    position: relative;
    overflow: hidden;
    padding: 0;
}

    .LeftNavbar:after {
        content: '';
        position: absolute;
        background: url("../img/LeftNavbar_left.png") 0 100% no-repeat;
        width: 100%;
        height: 100%;
        right: 0;
        bottom: 0;
    }

    .LeftNavbar::before {
        content: '';
        position: absolute;
        background: url("../img/LeftNavbar_right.png") right 100% no-repeat;
        width: 100%;
        height: 100%;
        right: 0;
        bottom: 0;
    }

    .LeftNavbar .list-group {
        position: relative;
        z-index: 5;
    }

        .LeftNavbar .list-group.Navbar {
            width: 130px;
            margin: 0 auto;
        }

            .LeftNavbar .list-group.Navbar .list-group-item {
                border: 0;
                background: none;
                padding-top: 1rem;
                padding-bottom: 1rem;
            }

                .LeftNavbar .list-group.Navbar .list-group-item::after {
                    content: '';
                    position: absolute;
                    top: 2px;
                    left: 300%;
                    background: #5A7FA1;
                    width: 255px;
                    height: 50px;
                    border-top-left-radius: 50px;
                    border-bottom-left-radius: 50px;
                    -webkit-transition: .5s;
                    -o-transition: .5s;
                    transition: .5s;
                }

                .LeftNavbar .list-group.Navbar .list-group-item a {
                    color: #FFF;
                    text-decoration: none;
                    position: relative;
                    z-index: 1;
                    display: -webkit-box;
                    display: -ms-flexbox;
                    display: flex;
                }

                    .LeftNavbar .list-group.Navbar .list-group-item a span {
                        width: 20px;
                        margin-right: 10px;
                        text-align: center;
                    }

                    .LeftNavbar .list-group.Navbar .list-group-item a p {
                        margin-bottom: 0;
                    }

                .LeftNavbar .list-group.Navbar .list-group-item:hover::after {
                    left: -30px;
                    -webkit-transition: .3s;
                    -o-transition: .3s;
                    transition: .3s;
                }

                .LeftNavbar .list-group.Navbar .list-group-item.active {
                    position: relative;
                }

                    .LeftNavbar .list-group.Navbar .list-group-item.active::after {
                        left: -30px;
                        -webkit-transition: .5s;
                        -o-transition: .5s;
                        transition: .5s;
                    }

.logo {
    padding-top: 15px;
    position: relative;
    z-index: 5;
}

    .logo img {
        margin: 0 auto;
        display: block;
        max-width: 100%;
    }

.version {
    color: #99A4AF;
    font-size: 12px;
    width: 100%;
    text-align: center;
    position: absolute;
    bottom: 0;
    left: 0;
    padding-bottom: 10px;
    z-index: 3;
}

.MinMenu {
    width: 26px;
    display: none;
}

    .MinMenu span {
        display: block;
        width: 100%;
        height: 3px;
        margin-bottom: 5px;
        background: #abc1d7;
        border-radius: 5px;
    }

        .MinMenu span:last-of-type {
            margin-bottom: 0;
        }

.Min_CloseNav {
    display: none;
}

@media screen and (max-width: 767px) {
    .MinMenu {
        display: block;
    }

    .LeftNavbar {
        position: absolute;
        left: -150%;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 5;
        -webkit-transition: .5s;
        -o-transition: .5s;
        transition: .5s;
    }

        .LeftNavbar.active {
            left: 0;
            -webkit-transition: .5s;
            -o-transition: .5s;
            transition: .5s;
        }

        .LeftNavbar .Min_CloseNav {
            color: #abc1d7;
            display: block;
            width: 100%;
            text-align: right;
            background: none;
            font-size: 22px;
            border: 0;
            padding: 24px;
            padding-top: 10px;
        }

        .LeftNavbar .logo {
            display: none;
        }

        .LeftNavbar:after {
            display: none;
        }

        .LeftNavbar::before {
            display: none;
        }

        .LeftNavbar .list-group.Navbar {
            margin-top: 50px;
        }

            .LeftNavbar .list-group.Navbar .list-group-item:after {
                display: none;
            }

            .LeftNavbar .list-group.Navbar .list-group-item:hover::after {
                display: none;
            }

            .LeftNavbar .list-group.Navbar .list-group-item.active:after {
                display: none;
            }
}

.TitleName {
    font-size: 26px;
    font-weight: bolder;
    color: #434343;
    margin: 20px 0;
}

@media screen and (max-width: 767px) {
    .TitleName {
        margin-bottom: 0;
    }
}

.Shearchbar {
    background: #FFF;
    padding: 2rem;
    border-radius: 10px;
    -webkit-box-shadow: 3px 3px 6px #c5c5c5;
    box-shadow: 3px 3px 6px #c5c5c5;
}

    .Shearchbar table td input {
        border: solid 1px #CED4DA;
        border-radius: 0.25rem;
        font-size: 14px;
        padding: 0.375rem 0.75rem;
    }

    .Shearchbar form {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

        .Shearchbar form .InputGroup {
            margin-right: 1.5rem;
        }

            .Shearchbar form .InputGroup input {
                border-color: #CED4DA;
            }

        .Shearchbar form button, .Shearchbar form .searchClear {
            min-width: 100px;
            -webkit-box-shadow: 1px 2px 7px #bfbfbf;
            box-shadow: 1px 2px 7px #bfbfbf;
        }

        .Shearchbar form .searchClear {
            display: none;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            height: 35px;
        }

            .Shearchbar form .searchClear.active {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
            }

        .Shearchbar form .ManufactureSearch {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
        }

            .Shearchbar form .ManufactureSearch label {
                width: 56px;
            }

        .Shearchbar form .Dyeing_search {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
        }

            .Shearchbar form .Dyeing_search .Dyeing_searchList2 {
                width: 956px;
            }

            .Shearchbar form .Dyeing_search label {
                /* width: 45px; */
                white-space: nowrap;
            }

    .Shearchbar .InputGroupSymbol {
        width: 100px;
        margin-bottom: 0;
        text-align: center;
    }

    .Shearchbar .InputGroup {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

        .Shearchbar .InputGroup label {
            /* width: 66px; */
            color: #212529;
            margin-right: 1rem;
            font-size: 14px;
        }

        .Shearchbar .InputGroup input[type="text"], .Shearchbar .InputGroup input[type="date"], .Shearchbar .InputGroup input[type="number"] {
            width: 200px;
            border: solid 1px #CED4DA;
            font-size: 14px;
        }

            .Shearchbar .InputGroup input[type="text"]::-webkit-input-placeholder, .Shearchbar .InputGroup input[type="date"]::-webkit-input-placeholder, .Shearchbar .InputGroup input[type="number"]::-webkit-input-placeholder {
                color: #A1A1A1;
                font-size: 14px;
            }

            .Shearchbar .InputGroup input[type="text"]::-moz-placeholder, .Shearchbar .InputGroup input[type="date"]::-moz-placeholder, .Shearchbar .InputGroup input[type="number"]::-moz-placeholder {
                color: #A1A1A1;
                font-size: 14px;
            }

            .Shearchbar .InputGroup input[type="text"]:-ms-input-placeholder, .Shearchbar .InputGroup input[type="date"]:-ms-input-placeholder, .Shearchbar .InputGroup input[type="number"]:-ms-input-placeholder {
                color: #A1A1A1;
                font-size: 14px;
            }

            .Shearchbar .InputGroup input[type="text"]::-ms-input-placeholder, .Shearchbar .InputGroup input[type="date"]::-ms-input-placeholder, .Shearchbar .InputGroup input[type="number"]::-ms-input-placeholder {
                color: #A1A1A1;
                font-size: 14px;
            }

            .Shearchbar .InputGroup input[type="text"]::placeholder, .Shearchbar .InputGroup input[type="date"]::placeholder, .Shearchbar .InputGroup input[type="number"]::placeholder {
                color: #A1A1A1;
                font-size: 14px;
            }

        .Shearchbar .InputGroup select {
            width: 200px;
        }

@media screen and (max-width: 1268px) {
    .Shearchbar form .Dyeing_search .InputGroup {
        margin-right: 0;
    }

        .Shearchbar form .Dyeing_search .InputGroup input[type="text"] {
            width: 69%;
        }

    .Shearchbar form .Dyeing_search .Dyeing_searchList2 {
        width: 820px;
    }
}

@media screen and (max-width: 1209px) {
    .Shearchbar .ManufactureSearch .InputGroup {
        margin-right: 0;
    }

        .Shearchbar .ManufactureSearch .InputGroup input[type="text"] {
            width: 69%;
        }
}

@media screen and (max-width: 1002px) {
    .Shearchbar form .InputGroup {
        margin-right: 0;
        padding: 0 1rem;
        width: 100%;
        margin-bottom: 10px;
    }

    .Shearchbar form .Dyeing_search {
        display: block;
    }

        .Shearchbar form .Dyeing_search .Dyeing_searchList1 {
            display: block;
        }

            .Shearchbar form .Dyeing_search .Dyeing_searchList1 button {
                margin: 1rem;
            }

        .Shearchbar form .Dyeing_search .Dyeing_searchList2 {
            width: 100%;
        }

        .Shearchbar form .Dyeing_search .InputGroup {
            display: block;
            width: 100%;
        }

            .Shearchbar form .Dyeing_search .InputGroup input[type="text"] {
                width: 100%;
            }

        .Shearchbar form .Dyeing_search button.searchButton {
            display: none;
        }
}

@media screen and (max-width: 990px) {
    .Shearchbar form .InputGroup {
        margin-right: 0;
        padding: 0 1rem;
        width: 100%;
        margin-bottom: 10px;
    }

    .Shearchbar form .ManufactureSearch {
        display: block;
    }

        .Shearchbar form .ManufactureSearch .InputGroup {
            display: block;
            width: 100%;
        }

            .Shearchbar form .ManufactureSearch .InputGroup input[type="text"] {
                width: 100%;
            }

        .Shearchbar form .ManufactureSearch button.searchButton {
            display: none;
        }

    .Shearchbar .InputGroup {
        display: block;
        width: 50%;
    }

        .Shearchbar .InputGroup label {
            width: 100%;
        }

        .Shearchbar .InputGroup input[type="text"], .Shearchbar .InputGroup input[type="date"] {
            width: 100%;
        }

        .Shearchbar .InputGroup select {
            width: 100%;
        }

    .Shearchbar button {
        width: calc( 100% - 30px);
    }
}

.InputGroup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 1rem;
}

.Listaddbtn {
    width: 85px;
    margin-bottom: 20px;
}

.AddSaveBar a, .AddSaveBar button, .DetailSavebar a, .DetailSavebar button {
    width: 85px;
}

.AddSaveBar a, .DetailSavebar a {
    margin-right: 10px;
}

.Contentbar {
    background: #FFF;
    padding: 2rem;
    border-radius: 10px;
    -webkit-box-shadow: 3px 3px 6px #c5c5c5;
    box-shadow: 3px 3px 6px #c5c5c5;
    margin-top: 20px;
    margin-bottom: 30px;
}

    .Contentbar .table > :not(:last-child) > :last-child > * {
        border-bottom-color: #efefef;
    }

    .Contentbar table th {
        color: #A1A1A1;
        font-size: 14px;
    }

    .Contentbar table tbody tr td {
        vertical-align: middle;
        font-size: 14px;
    }

        .Contentbar table tbody tr td button {
            width: 100px;
        }

        .Contentbar table tbody tr td .btn {
            width: 85px;
        }

            .Contentbar table tbody tr td .btn:nth-of-type(1) {
                margin-right: 0.2rem;
            }

            .Contentbar table tbody tr td .btn.btn-danger {
                width: 38px;
            }

.InputGroundListbar {
    margin: 30px 0;
    padding-bottom: 30px;
    border-bottom: solid 1px #efefef;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

    .InputGroundListbar.ProofingGroundListbar {
        width: 100%;
        padding-left: 124px;
    }

    .InputGroundListbar .InputGroup {
        margin-right: 2rem;
        margin-bottom: 1rem;
    }

        .InputGroundListbar .InputGroup label {
            width: 83px;
            font-size: 14px;
            margin-right: 1rem;
        }

.Proofing .ProofingSubtotal {
    margin-bottom: 50px;
}

.Proofing .InputGroup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

    .Proofing .InputGroup .ImgLet {
        width: 124px;
    }

    .Proofing .InputGroup .ContentRight {
        width: calc(100% - 124px);
    }

.Proofing .ProofingSubtotal {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

    .Proofing .ProofingSubtotal input {
        width: 167px;
        margin-left: 1rem;
    }

.Proofing .ProofingDetailList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

    .Proofing .ProofingDetailList label {
        color: #597EA2;
    }

    .Proofing .ProofingDetailList .ProofingList {
        margin-bottom: 10px;
    }

        .Proofing .ProofingDetailList .ProofingList input {
            width: 200px;
        }

.Proofing .InputGroup {
    margin-bottom: 30px;
    padding-bottom: 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    border-bottom: solid 1px #efefef;
}

    .Proofing .InputGroup label {
        width: 100%;
    }

.Proofing h3 {
    font-size: 16px;
    color: #2c3e50;
    font-weight: bolder;
}

.Dye .InputGroup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 20px;
    width: 300px;
}

.Dyeing_search {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

    .Dyeing_search .Dyeing_searchList1 {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

        .Dyeing_search .Dyeing_searchList1 .InputGroup {
            margin-bottom: 10px;
        }

        .Dyeing_search .Dyeing_searchList1 button {
            height: 35px;
        }

    .Dyeing_search .Dyeing_searchList2 {
        margin-top: 20px;
    }

.Manufacture_number .InputGroup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 200px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.Manufacture_number label {
    width: 60px;
    margin-bottom: 0;
}

.tableList_Nodata {
    background: #F3F9FE;
    text-align: center;
}

.BomListsNewVersionBody button, .BomListsBody button {
    width: 30px;
    height: 30px;
    padding: 0;
}

.BomListsNewVersionBody .ItemList input[type="text"], .BomListsNewVersionBody .ItemList input[type="number"], .BomListsBody .ItemList input[type="text"], .BomListsBody .ItemList input[type="number"] {
    width: 100%;
    border: 0;
    border: solid 1px #CED4DA;
    border-radius: 5px;
}

.BomListsNewVersionBody .bomNewVersionTable, .BomListsNewVersionBody .manufactureNewVersionTable, .BomListsBody .bomNewVersionTable, .BomListsBody .manufactureNewVersionTable {
    width: 100%;
}

.BomListsNewVersionRight .InputGroup label {
    width: 82px;
}

.BomListsNewVersionRight table {
    width: 100%;
}

.Upload_Img {
    width: 100%;
    margin: 0 auto;
    position: relative;
}

    .Upload_Img .FormatImg {
        color: #c90000;
        font-size: 14px;
    }

    .Upload_Img button {
        border-radius: 5px;
        border: 0;
        background: #507091;
        color: #FFF;
        font-size: 14px;
        padding: 5px 15px;
        margin-right: 10px;
    }

    .Upload_Img a {
        display: block;
        width: 100%;
        border-radius: 10px;
        background: #D8D8D8;
        border: dashed 1px #707070;
        position: relative;
        margin-bottom: 10px;
    }

        .Upload_Img a span {
            color: #3E3E3E;
            display: block;
            width: 14px;
            height: 16px;
            position: absolute;
            right: 10px;
            bottom: 10px;
        }

            .Upload_Img a span::after {
                content: '';
                position: absolute;
                left: 0;
                top: 4px;
                width: 100%;
                height: 100%;
                border: solid 1px #9f9f9f;
            }

    .Upload_Img img {
        width: 100%;
        border-radius: 10px;
    }

.UploadImg {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

    .UploadImg span {
        color: #FFF;
        display: block;
        background: #507091;
        border-radius: 5px;
        font-size: 14px;
        padding: 7px 25px;
        width: 106px;
        height: 35px;
    }

        .UploadImg span:hover {
            cursor: pointer;
        }

    .UploadImg .ImgName {
        width: calc( 100% - 10px - 106px);
        border: solid 1px #CED4DA;
        height: 35px;
        border-radius: 5px;
        margin-right: 10px;
    }

.ManufactureContent.InputGroundListbar .ManufactureSelection {
    margin-bottom: 15px;
}

    .ManufactureContent.InputGroundListbar .ManufactureSelection .ManufactureInputList1 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        width: 100%;
    }

        .ManufactureContent.InputGroundListbar .ManufactureSelection .ManufactureInputList1 .InputGroup {
            margin-right: 12px;
            width: calc( 100% / 3 - 12px);
        }

.ManufactureContent.InputGroundListbar .ManufactureInput {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.ManufactureContent.InputGroundListbar .InputGroup {
    margin-right: 12px;
}

    .ManufactureContent.InputGroundListbar .InputGroup label {
        word-wrap: break-word;
        width: 90px;
    }

.ManufactureContent.InputGroundListbar .Manufacture_Record_List {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 50px;
}

    .ManufactureContent.InputGroundListbar .Manufacture_Record_List .ManufactureInputList1 {
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }

.Manufacture .InputGroup {
    margin-right: 12px;
}

    .Manufacture .InputGroup label {
        word-wrap: break-word;
        width: 90px;
    }

.Manufacture .Manufacture_Record_List {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

    .Manufacture .Manufacture_Record_List .ManufactureInputList1 {
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        width: 100%;
    }

.ManufactureContent.InputGroundListbar .ManufactureInput {
    width: 100%;
    display: block;
}

    .ManufactureContent.InputGroundListbar .ManufactureInput .ManufactureInputList1 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        width: 100%;
    }

    .ManufactureContent.InputGroundListbar .ManufactureInput .InputGroup {
        width: calc( 100% / 3 - 12px);
        margin-right: 12px;
    }

    .ManufactureContent.InputGroundListbar .ManufactureInput .ManufactureTextarea {
        display: block;
    }

.ManufactureContent .Manufacture .btn {
    padding: 2px 7px;
}

.ManufactureContent .Manufacture .BomListsBody input, .ManufactureContent .Manufacture .BomListsNewVersionBody input {
    height: 30px;
}

    .ManufactureContent .Manufacture .BomListsBody input[type="text"], .ManufactureContent .Manufacture .BomListsNewVersionBody input[type="text"] {
        width: 100%;
        border-color: #a4bdd5;
    }

    .ManufactureContent .Manufacture .BomListsBody input[type="number"], .ManufactureContent .Manufacture .BomListsNewVersionBody input[type="number"] {
        width: 100%;
        border-radius: 0.25rem;
        border: 1px solid #2e3d4b;
    }

.ShapeList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin-bottom: 30px;
}

.ManufactureInspection table tr.table-secondary {
    --bs-table-bg: #f3f3f3;
}

.tableList_Layer1 {
    background: #3174B5;
    color: #FFF;
    padding-top: 20px;
}

    .tableList_Layer1 .tableList {
        margin-bottom: 20px;
    }

        .tableList_Layer1 .tableList input {
            width: 100%;
            border: solid 1px #CED4DA;
            border-radius: 5px;
        }

.tableList_Layer3 {
    background: #F3F9FE;
    padding: 20px 0;
}

    .tableList_Layer3 .tableList {
        margin-bottom: 0;
    }

        .tableList_Layer3 .tableList input {
            width: 100%;
            border: solid 1px #CED4DA;
            border-radius: 5px;
        }

    .tableList_Layer3.row {
        margin: 0;
    }

    .tableList_Layer3 .tableList:nth-of-type(1) {
        color: #608AB4;
        padding-left: 100px;
    }

.tableList_Layer2 {
    background: #C8E4FF;
    padding-top: 20px;
}

    .tableList_Layer2 .tableList {
        margin-bottom: 20px;
    }

        .tableList_Layer2 .tableList input {
            width: 100%;
            border: solid 1px #CED4DA;
            border-radius: 5px;
        }

        .tableList_Layer2 .tableList:nth-of-type(1) {
            color: #608AB4;
            padding-left: 50px;
        }

    .tableList_Layer2 .tableList_Layer3 .tableList {
        margin-bottom: 0;
    }

        .tableList_Layer2 .tableList_Layer3 .tableList input {
            width: 100%;
        }

.UserContent .InputGroundListbar {
    display: block;
}

    .UserContent .InputGroundListbar .row {
        width: 100%;
    }

.UserContent .InputGroup {
    margin-right: 0;
    margin-bottom: 0;
}

.UserContent .PasswordGroup {
    position: relative;
}

    .UserContent .PasswordGroup button {
        background: none;
        border: 0;
        position: absolute;
        right: 5px;
        top: 0;
        width: 50px;
        height: 100%;
    }

.UserContent table th {
    text-align: center;
}

.UserContent table tbody tr td {
    text-align: center;
}

    .UserContent table tbody tr td svg {
        color: #3AB47F;
    }

.GroupContent .InputGroundListbar {
    display: block;
}

    .GroupContent .InputGroundListbar .row {
        width: 100%;
    }

.GroupContent .InputGroup {
    margin-right: 0;
    margin-bottom: 0;
}

.GroupContent table th {
    text-align: center;
}

.GroupContent table tbody tr td {
    text-align: center;
}

    .GroupContent table tbody tr td svg {
        color: #3AB47F;
    }

.CompanyContent .InputGroundListbar {
    display: block;
}

    .CompanyContent .InputGroundListbar .row {
        width: 100%;
    }

.CompanyContent .InputGroup {
    margin-right: 0;
    margin-bottom: 0;
}

.CompanyContent .tokenInputGroup label {
    width: 69px;
    margin-right: 1rem;
}

.CompanyContent .tokenInputGroup .InputGroup {
    width: 100%;
}

    .CompanyContent .tokenInputGroup .InputGroup button {
        width: 100px;
    }

.CompanyContent .tokenInputGroupDetail {
    padding-right: 24px;
}

    .CompanyContent .tokenInputGroupDetail label {
        width: 65px;
    }

.Prompt_icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

    .Prompt_icon.btn {
        padding: 0;
    }

    .Prompt_icon svg {
        color: #adadad;
        margin-left: 0.5rem;
    }

@media screen and (max-width: 1573px) {
    .CompanyContent .tokenInputGroupDetail label {
        width: 62px;
    }
}

@media screen and (max-width: 1565px) {
    .Proofing .ProofingDetailList {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: start;
    }

        .Proofing .ProofingDetailList .ProofingList {
            margin-right: 10px;
        }
}

@media screen and (max-width: 1442px) {
    .CompanyContent .tokenInputGroupDetail label {
        width: 59px;
    }
}

@media screen and (max-width: 1396px) {
    .CompanyContent .tokenInputGroup label {
        width: 79px;
    }

    .CompanyContent .tokenInputGroupDetail label {
        width: 72px;
    }
}

@media screen and (max-width: 1359px) {
    .ManufactureContent.InputGroundListbar .ManufactureSelection .ManufactureInputList1 .InputGroup {
        width: calc( 100% / 2 - 12px);
    }

    .ManufactureContent.InputGroundListbar .ManufactureInput .InputGroup {
        width: calc( 100% / 2 - 12px);
    }
}

@media screen and (max-width: 1349px) {
    table.Dye.w-906x {
        width: 100%;
    }
}

@media screen and (max-width: 1199px) {
    .DyeListLeft {
        margin-top: 30px;
    }

    .BomListsNewVersion .BomListsNewVersionRight {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        margin-bottom: 50px;
    }

    .BomListsNewVersion .BomListsNewVersionLeft {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
    }

    .modal-body .ManufactureInputList1 .InputGroup, .modal-body .ManufactureInputList2 .InputGroup, .modal-body .ManufactureInputList3 .InputGroup {
        display: block;
    }

        .modal-body .ManufactureInputList1 .InputGroup label, .modal-body .ManufactureInputList2 .InputGroup label, .modal-body .ManufactureInputList3 .InputGroup label {
            width: 100%;
        }

    .modal-body .ManufactureContentRight {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        margin-bottom: 50px;
    }

    .modal-body .ManufactureContentLeft {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
    }

    .modal-body .Upload_Img {
        width: 200px;
    }
}

@media screen and (max-width: 1195px) {
    .ManufactureContent.InputGroundListbar .ManufactureSelection .ManufactureInputList1 {
        display: block;
    }

        .ManufactureContent.InputGroundListbar .ManufactureSelection .ManufactureInputList1 .InputGroup {
            display: inline-block;
            margin-right: 0;
        }

            .ManufactureContent.InputGroundListbar .ManufactureSelection .ManufactureInputList1 .InputGroup:nth-of-type(2) {
                padding-left: 12px;
            }

            .ManufactureContent.InputGroundListbar .ManufactureSelection .ManufactureInputList1 .InputGroup label {
                width: 70px;
            }

            .ManufactureContent.InputGroundListbar .ManufactureSelection .ManufactureInputList1 .InputGroup select {
                width: calc( 100% - 70px - 1rem - 4px);
            }

            .ManufactureContent.InputGroundListbar .ManufactureSelection .ManufactureInputList1 .InputGroup label, .ManufactureContent.InputGroundListbar .ManufactureSelection .ManufactureInputList1 .InputGroup select {
                display: inline-block;
            }

    .ManufactureContent.InputGroundListbar .ManufactureInput .ManufactureInputList1 {
        display: block;
    }

        .ManufactureContent.InputGroundListbar .ManufactureInput .ManufactureInputList1 .InputGroup {
            width: 100%;
            margin-right: 0;
            display: block;
        }

            .ManufactureContent.InputGroundListbar .ManufactureInput .ManufactureInputList1 .InputGroup label, .ManufactureContent.InputGroundListbar .ManufactureInput .ManufactureInputList1 .InputGroup .form-control {
                display: inline-block;
            }

            .ManufactureContent.InputGroundListbar .ManufactureInput .ManufactureInputList1 .InputGroup label {
                width: 70px;
            }

            .ManufactureContent.InputGroundListbar .ManufactureInput .ManufactureInputList1 .InputGroup .form-control {
                width: calc( 100% - 70px - 1rem - 4px);
            }

    .BomListsNewVersion .BomListsNewVersionRight .ShapeList {
        display: block;
    }

    .BomListsNewVersion .BomListsNewVersionRight .InputGroup {
        width: 100%;
        margin-right: 0;
        display: block;
        margin-bottom: 1rem;
    }

        .BomListsNewVersion .BomListsNewVersionRight .InputGroup label, .BomListsNewVersion .BomListsNewVersionRight .InputGroup .form-control {
            display: inline-block;
        }

        .BomListsNewVersion .BomListsNewVersionRight .InputGroup label {
            width: 70px;
        }

        .BomListsNewVersion .BomListsNewVersionRight .InputGroup .form-control {
            width: calc( 100% - 70px - 1rem - 4px);
        }
}

@media screen and (max-width: 1098px) {
    .InputGroundListbar.ProofingGroundListbar .InputGroup {
        margin-right: 2rem;
        margin-bottom: 1rem;
        width: calc(100% / 2 - 2rem);
        display: block;
    }

        .InputGroundListbar.ProofingGroundListbar .InputGroup:nth-of-type(2n) {
            margin-right: 0;
        }

    .Proofing .InputGroup {
        margin-right: 0;
    }

    .Proofing .ProofingDetailList .ProofingList {
        width: 49%;
    }

        .Proofing .ProofingDetailList .ProofingList:nth-of-type(2n) {
            margin-right: 0;
        }

        .Proofing .ProofingDetailList .ProofingList input {
            width: 100%;
        }
}

@media screen and (max-width: 1082px) {
    .CompanyContent .tokenInputGroupDetail label {
        width: 67px;
    }
}

@media screen and (max-width: 992px) {
    .Proofing .InputGroup {
        width: 100%;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .table_content {
        padding: 5px;
    }

    .Contentbar.ContentbarList {
        background: none;
        padding: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .Contentbar table thead tr {
        display: none;
    }

    .Contentbar table tbody tr {
        margin-bottom: 20px;
        background: #FFF;
        border: solid 1px #EEE;
        display: grid;
        border-radius: 10px;
        -webkit-box-shadow: 3px 3px 6px #c5c5c5;
        box-shadow: 3px 3px 6px #c5c5c5;
        padding: 2rem;
    }

        .Contentbar table tbody tr:hover {
            --bs-table-accent-bg: none;
        }

        .Contentbar table tbody tr td {
            width: 100%;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }

            .Contentbar table tbody tr td:last-of-type {
                border: 0;
            }

            .Contentbar table tbody tr td span {
                background: #EEE;
                padding: 5px;
                border-radius: 5px;
                margin-bottom: 10px;
                display: block;
            }

    .Contentbar .Manufacture table thead tr {
        display: block;
    }

    .Contentbar .Manufacture table tbody tr {
        padding: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .ManufactureInspection table {
        border: 0;
    }

        .ManufactureInspection table thead tr.table-secondary {
            display: none;
        }

        .ManufactureInspection table tbody tr {
            border: 0;
        }

            .ManufactureInspection table tbody tr td {
                padding: 0 !important;
                border: 0;
                margin-bottom: 8px;
            }

                .ManufactureInspection table tbody tr td span {
                    border-radius: 0;
                }

                .ManufactureInspection table tbody tr td .table_content {
                    margin-bottom: 20px;
                }

    .modal-body .ManufactureInspection table {
        border: 0;
    }

        .modal-body .ManufactureInspection table thead tr.table-secondary {
            display: none;
        }

        .modal-body .ManufactureInspection table tbody tr {
            border: 0;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        }

            .modal-body .ManufactureInspection table tbody tr td {
                width: 100%;
                -webkit-box-sizing: border-box;
                box-sizing: border-box;
                background: #EEE;
                padding: 5px !important;
                border-radius: 2px;
            }

    .modal-body .Dye {
        margin-top: 30px;
    }

        .modal-body .Dye thead tr {
            display: none;
        }

        .modal-body .Dye tr {
            background: none;
            -webkit-box-shadow: none;
            box-shadow: none;
        }

    .GroupContent table tbody tr {
        padding: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .UserContent table tbody tr {
        padding: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .UserContent .InputGroup {
        margin-bottom: 10px;
    }

    .UserContent .PasswordGroup button {
        height: 35px;
        top: auto;
        bottom: 0;
    }

    .GroupContent .InputGroup {
        margin-bottom: 10px;
    }

    .CompanyContent .InputGroup {
        margin-bottom: 10px;
    }

    .CompanyContent .tokenInputGroup .InputGroup label {
        width: 100px;
    }

    .CompanyContent .tokenInputGroupDetail label {
        width: 66px;
    }

    .Upload_Img {
        width: 300px;
        max-width: 100%;
    }

    .bomNewVersionTable, .manufactureNewVersionTable {
        width: 100%;
    }

        .bomNewVersionTable thead tr, .manufactureNewVersionTable thead tr {
            display: none;
        }

        .bomNewVersionTable tbody tr, .manufactureNewVersionTable tbody tr {
            display: grid;
        }

            .bomNewVersionTable tbody tr td, .manufactureNewVersionTable tbody tr td {
                background: #EEE;
                padding: 5px;
                border-radius: 5px;
                margin-bottom: 10px;
                display: block;
            }

    .Contentbar .Manufacture table thead tr {
        background: #eee;
        height: 30px;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
    }

        .Contentbar .Manufacture table thead tr th {
            display: none;
        }
}

@media screen and (max-width: 991px) {
    .CompanyContent .tokenInputGroupDetail label {
        width: 82px;
    }

    .ManufactureContent.InputGroundListbar .ManufactureContentRight {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        margin-bottom: 50px;
    }

    .ManufactureContent.InputGroundListbar .ManufactureContentLeft {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
    }

    .BomListsNewVersionBody .ItemList input[type="text"], .BomListsNewVersionBody .ItemList input[type="number"] {
        width: 100%;
        height: 40px;
        border: 0;
    }
}

@media screen and (max-width: 960px) {
    .Proofing .ProofingDetailList .ProofingList {
        width: 45%;
    }

        .Proofing .ProofingDetailList .ProofingList input {
            width: 100%;
        }

    .UserContent .InputGroup {
        display: block;
    }

        .UserContent .InputGroup label {
            width: 100%;
            margin-bottom: 10px;
        }

    .GroupContent .InputGroup {
        display: block;
    }

        .GroupContent .InputGroup label {
            width: 100%;
            margin-bottom: 10px;
        }

    .CompanyContent .InputGroup {
        display: block;
    }

        .CompanyContent .InputGroup label {
            width: 100%;
            margin-bottom: 10px;
        }

    .CompanyContent .tokenInputGroup .InputGroup button {
        margin-top: 10px;
    }
}

@media screen and (max-width: 700px) {
    .Dye .InputGroup {
        width: 100%;
    }

    .InputGroundListbar.ProofingGroundListbar {
        padding-left: 0;
    }

        .InputGroundListbar.ProofingGroundListbar .InputGroup {
            width: 100%;
            margin-right: 0;
        }

    .Proofing .ProofingDetailList .ProofingList {
        width: 100%;
        margin-right: 0;
    }

    .ManufactureContent.InputGroundListbar .ManufactureInputList1 .InputGroup, .ManufactureContent.InputGroundListbar .ManufactureInputList2 .InputGroup, .ManufactureContent.InputGroundListbar .ManufactureInputList3 .InputGroup {
        display: block;
    }

        .ManufactureContent.InputGroundListbar .ManufactureInputList1 .InputGroup label, .ManufactureContent.InputGroundListbar .ManufactureInputList2 .InputGroup label, .ManufactureContent.InputGroundListbar .ManufactureInputList3 .InputGroup label {
            width: 100%;
        }

    .ManufactureContent.InputGroundListbar .ManufactureSelection {
        display: block;
    }

        .ManufactureContent.InputGroundListbar .ManufactureSelection .InputGroup {
            width: 100%;
            display: block;
        }

            .ManufactureContent.InputGroundListbar .ManufactureSelection .InputGroup label {
                width: 100%;
            }

            .ManufactureContent.InputGroundListbar .ManufactureSelection .InputGroup select {
                width: 100%;
            }
}

@media screen and (max-width: 600px) {
    .ManufactureContent.InputGroundListbar .ManufactureSelection .ManufactureInputList1 {
        display: block;
    }

        .ManufactureContent.InputGroundListbar .ManufactureSelection .ManufactureInputList1 .InputGroup {
            display: block;
            width: 100%;
        }

            .ManufactureContent.InputGroundListbar .ManufactureSelection .ManufactureInputList1 .InputGroup:nth-of-type(2) {
                padding-left: 0;
            }

            .ManufactureContent.InputGroundListbar .ManufactureSelection .ManufactureInputList1 .InputGroup label, .ManufactureContent.InputGroundListbar .ManufactureSelection .ManufactureInputList1 .InputGroup select {
                display: block;
                width: 100%;
            }

    .ManufactureContent.InputGroundListbar .ManufactureInput .ManufactureInputList1 {
        display: block;
    }

        .ManufactureContent.InputGroundListbar .ManufactureInput .ManufactureInputList1 .InputGroup {
            width: 100%;
            margin-right: 0;
            display: block;
        }

            .ManufactureContent.InputGroundListbar .ManufactureInput .ManufactureInputList1 .InputGroup label, .ManufactureContent.InputGroundListbar .ManufactureInput .ManufactureInputList1 .InputGroup .form-control {
                display: block;
                width: 100%;
            }
}

.ModalBox label {
    font-size: 14px;
}

.ModalBox .modal-header {
    background: #2c3e50;
    color: #FFF;
}

.ModalBox .modal-footer button {
    width: 100px;
}

.AuthorityLogin {
    color: #FFF;
    background: #293d51;
    background: -webkit-gradient(linear, left top, left bottom, from(#293d51), to(#080c10));
    background: -o-linear-gradient(top, #293d51 0%, #080c10 100%);
    background: linear-gradient(to bottom, #293d51 0%, #080c10 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#293d51', endColorstr='#080c10',GradientType=0 );
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

    .AuthorityLogin .logobar {
        position: absolute;
        top: 20px;
        left: 20px;
        display: block;
    }

    .AuthorityLogin.LoginBox {
        height: 100vh;
    }

        .AuthorityLogin.LoginBox .PasswordGroup {
            position: relative;
        }

            .AuthorityLogin.LoginBox .PasswordGroup button {
                position: absolute;
                right: 0;
                width: 50px;
                height: 35px;
                background: none;
                border: 0;
            }

    .AuthorityLogin form {
        width: 330px;
        text-align: center;
        margin: 0 auto;
        margin-top: -10vw;
    }

        .AuthorityLogin form h2 {
            font-size: 22px;
        }

        .AuthorityLogin form button[type=submit] {
            width: 100%;
        }

.paginationbar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #828282;
}

    .paginationbar ul.pagination {
        margin-bottom: 0;
    }

        .paginationbar ul.pagination .page-item {
            margin-bottom: 0;
        }

            .paginationbar ul.pagination .page-item.disabled .page-link {
                color: #e5e5e5;
            }

            .paginationbar ul.pagination .page-item .page-link {
                color: #828282;
            }

            .paginationbar ul.pagination .page-item.active .page-link {
                color: #FFF;
                background-color: #798FA5;
                border-color: #798FA5;
            }

.BomListsNewVersion input:focus-visible {
    outline: none;
}

.BomListsNewVersion .BomListsTitle {
    border-bottom: solid 1px #CED4DA;
    color: #7D7D7D;
    font-size: 14px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    -webkit-padding-start: 0px;
    padding-inline-start: 0px;
    padding-left: 20px;
    padding-right: 20px;
}

    .BomListsNewVersion .BomListsTitle li {
        list-style: none;
        display: inline-block;
        width: calc((100% - 150px) / 7);
        text-align: center;
    }

        .BomListsNewVersion .BomListsTitle li.operate {
            width: 70px;
            text-align: left;
        }

        .BomListsNewVersion .BomListsTitle li.operate_del {
            width: 42px;
        }

.BomListsNewVersion .item {
    -webkit-padding-start: 0px;
    padding-inline-start: 0px;
}

    .BomListsNewVersion .item li {
        list-style: none;
        display: inline-block;
        vertical-align: middle;
    }

        .BomListsNewVersion .item li ul {
            padding-left: 0;
        }

            .BomListsNewVersion .item li ul li .item_Table {
                background: #C8E4FF;
            }

                .BomListsNewVersion .item li ul li .item_Table .operate .list_Content {
                    color: blue;
                }

                    .BomListsNewVersion .item li ul li .item_Table .operate .list_Content .btn.btn-darkblue {
                        color: #0c4781;
                        background-color: #81bcf5;
                        border-color: #81bcf5;
                    }

                    .BomListsNewVersion .item li ul li .item_Table .operate .list_Content .btn.btn-paleblue {
                        color: #3174b5;
                        background-color: #f9fafb;
                        border-color: #f9fafb;
                    }

            .BomListsNewVersion .item li ul li ul li .item_Table {
                background: #e6f4ff;
            }

                .BomListsNewVersion .item li ul li ul li .item_Table .operate .list_Content {
                    display: none;
                    text-align: right;
                    padding-right: 10px;
                }

                    .BomListsNewVersion .item li ul li ul li .item_Table .operate .list_Content .btn.btn-darkblue {
                        color: #fff;
                        background-color: #0c4781;
                        border-color: #0c4781;
                    }

                    .BomListsNewVersion .item li ul li ul li .item_Table .operate .list_Content .btn.btn-paleblue {
                        color: #0c4781;
                        background-color: #81bcf5;
                        border-color: #81bcf5;
                    }

            .BomListsNewVersion .item li ul li ul li ul {
                padding-left: 2%;
                background: #c6e5fd;
            }

                .BomListsNewVersion .item li ul li ul li ul li .item_Table {
                    background: #c6e5fd;
                }

                    .BomListsNewVersion .item li ul li ul li ul li .item_Table .item_Table_List2, .BomListsNewVersion .item li ul li ul li ul li .item_Table .item_Table_List3, .BomListsNewVersion .item li ul li ul li ul li .item_Table .item_Table_List4, .BomListsNewVersion .item li ul li ul li ul li .item_Table .item_Table_List5, .BomListsNewVersion .item li ul li ul li ul li .item_Table .item_Table_List6 {
                        width: 15%;
                    }

    .BomListsNewVersion .item .item_Table {
        padding: 20px;
        background: #3174B5;
    }

        .BomListsNewVersion .item .item_Table .item_Table_List1, .BomListsNewVersion .item .item_Table .item_Table_List7 {
            display: inline-block;
            vertical-align: middle;
        }

        .BomListsNewVersion .item .item_Table .item_Table_List2, .BomListsNewVersion .item .item_Table .item_Table_List3, .BomListsNewVersion .item .item_Table .item_Table_List4, .BomListsNewVersion .item .item_Table .item_Table_List5, .BomListsNewVersion .item .item_Table .item_Table_List6 {
            width: calc((100% - 150px) / 7);
            display: inline-block;
            vertical-align: middle;
        }

            .BomListsNewVersion .item .item_Table .item_Table_List2 input, .BomListsNewVersion .item .item_Table .item_Table_List3 input, .BomListsNewVersion .item .item_Table .item_Table_List4 input, .BomListsNewVersion .item .item_Table .item_Table_List5 input, .BomListsNewVersion .item .item_Table .item_Table_List6 input {
                width: 100%;
                height: 35px;
                border-radius: 5px;
                border: 0;
                padding: 0 5px;
            }

        .BomListsNewVersion .item .item_Table .operate {
            width: 70px;
        }

        .BomListsNewVersion .item .item_Table .operate_del {
            width: 42px;
        }

            .BomListsNewVersion .item .item_Table .operate_del .list_Content {
                width: 100%;
                text-align: center;
            }

    .BomListsNewVersion .item .list_Title {
        display: none;
    }

.BomListsBody .BomList > ul.item > li > .item_Table .item_Table_List7 .list_Content button {
    display: none;
}

.BomListsBody li {
    width: 100%;
}

.BomListsBody ul.close {
    position: relative;
    -webkit-transition: 1s;
    -o-transition: 1s;
    transition: 1s;
}

    .BomListsBody ul.close li {
        position: absolute;
        top: 0;
        height: 0;
        overflow: hidden;
        -webkit-transition: 1s;
        -o-transition: 1s;
        transition: 1s;
    }

.BomListsNewVersion.Modal .item .item_Table .item_Table_List2 input:-moz-read-only {
    background: #dfdfdf;
}

.BomListsNewVersion.Modal .item .item_Table .item_Table_List2 input:read-only {
    background: #dfdfdf;
}

.BomListsNewVersion.Modal .item .item_Table .item_Table_List3 input:-moz-read-only {
    background: #dfdfdf;
}

.BomListsNewVersion.Modal .item .item_Table .item_Table_List3 input:read-only {
    background: #dfdfdf;
}

.BomListsNewVersion.Modal .item .item_Table .item_Table_List4 input:-moz-read-only {
    background: #dfdfdf;
}

.BomListsNewVersion.Modal .item .item_Table .item_Table_List4 input:read-only {
    background: #dfdfdf;
}

.BomListsNewVersion.Modal .item .item_Table .item_Table_List5 input:-moz-read-only {
    background: #dfdfdf;
}

.BomListsNewVersion.Modal .item .item_Table .item_Table_List5 input:read-only {
    background: #dfdfdf;
}

.BomListsNewVersion.Modal .item .item_Table .item_Table_List6 input:-moz-read-only {
    background: #dfdfdf;
}

.BomListsNewVersion.Modal .item .item_Table .item_Table_List6 input:read-only {
    background: #dfdfdf;
}

@media (min-width: 1410px) {
    .modal-xl {
        max-width: 1354px;
    }
}

@media (max-width: 1409px) {
    .modal-xl {
        max-width: 90%;
    }
}

.BomListsBody button.Fold_icon {
    background: none;
    border: 0;
    color: #333;
    font-size: 22px;
}

    .BomListsBody button.Fold_icon span {
        width: 30px;
        height: 30px;
        display: block;
    }

    .BomListsBody button.Fold_icon[data-action="Folddown"] span {
        margin-top: -11px;
    }

@media (max-width: 1000px) {
    .BomListsNewVersion .BomListsTitle {
        display: none;
    }

    .BomListsNewVersion .item .list_Title {
        display: block;
        margin-bottom: 10px;
    }

    .BomListsNewVersion .item .item_Table .item_Table_List2 {
        width: 100%;
        margin-bottom: 10px;
    }

    .BomListsNewVersion .item .item_Table .item_Table_List3 {
        width: 100%;
        margin-bottom: 10px;
    }

    .BomListsNewVersion .item .item_Table .item_Table_List4 {
        width: 100%;
        margin-bottom: 10px;
    }

    .BomListsNewVersion .item .item_Table .item_Table_List5 {
        width: 100%;
        margin-bottom: 10px;
    }

    .BomListsNewVersion .item .item_Table .item_Table_List6 {
        width: 100%;
        margin-bottom: 10px;
    }
}

@media screen and (min-width: 960px) {
    .w-lg-400x {
        width: 400px !important;
    }

    .w-lg-292 {
        width: 292px !important;
    }

    .w-lg-200x {
        width: 200px !important;
    }

    .w-lg-188x {
        width: 188px !important;
    }

    .w-lg-165x {
        width: 165px !important;
    }

    .w-lg-150x {
        width: 150px !important;
    }

    .w-lg-124x {
        width: 124px !important;
    }

    .w-lg-100x {
        width: 100px !important;
    }

    .w-lg-80x {
        width: 80px !important;
    }

    .w-lg-70x {
        width: 70px !important;
    }

    .w-lg-58x {
        width: 58px !important;
    }
}