@charset "utf-8";

html {
    font-size: 17px;
}

body {
    font-family: 'Noto Sans TC', 'Microsoft JhengHei', 'sans-serif';
    background-color: #EEF0F1;
    color: #444;
}

a {
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

a:hover {
    text-decoration: none;
    color: inherit;
}

img {
    display: block;
    width: 100%;
}

ul {
    padding-left: 0;
    list-style-type: none;
}

/*清除*/
.form-control:focus,
.form-select:focus,
.btn-check:focus+.btn,
.btn:focus,
.btn-close:focus,
.form-check-input:focus {
    box-shadow: none;
}

.form-control:focus,
.form-select:focus {
    border: 1px solid #979797;
}

::placeholder {
    color: #999 !important;
    font-weight: 300 !important;
}

/***************網頁選取顏色***************/
::selection {
    background-color: #999;
    color: #fff;
}

::-moz-selection {
    background-color: #999;
    color: #fff;
}

/**************捲軸樣式**************/
/* 整個捲軸 */

::-webkit-scrollbar {
    width: 5px;
}

/* 捲軸的軌道 */
::-webkit-scrollbar-track {
    background: #333;
}

/*捲軸尚未滑到的軌道*/
::-webkit-scrollbar-track-piece {
    background: #666;
}

/* 滑動的區塊 */
::-webkit-scrollbar-thumb {
    background: #ccc;
}

/* 滑鼠移到滑動的區塊上 */
::-webkit-scrollbar-thumb:hover {
    background: #ccc;
}

/*-------------------------------------------------------------
共用
--------------------------------------------------------------*/
@media (min-width: 1400px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1600px;
    }
}

.form-check-input {
    cursor: pointer;
    width: 1.2em;
    height: 1.2em;
}

.form-check-input:checked {
    background-color: #4A4A4A;
    border-color: #4A4A4A;
}

.form-control,
.form-select {
    border: 1px solid #979797;
    font-weight: 500;
}

input.form-control {
    height: 40px;
}

.form-check-input {
    margin-top: 0;
}

/****fixed-box 按鈕****/

.fixed-box {
    position: fixed;
    right: 15px;
    bottom: 10px;
    z-index: 999;
}

.fixed-box button {
    display: block;
    width: 80px;
    height: 80px;
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 5px;
}

.fixed-box button.font-s {
    font-size: 12px;
    white-space: nowrap;
}

.fixed-box button img {
    width: 40px;
    margin: auto;
}

/********標題*********/
.page-title {
    font-size: 1.7rem;
    text-align: center;
    margin: 20px 0 15px 0;
    font-weight: 500;
}

.page-title.large {
    font-size: 2rem;
    margin-bottom: 30px;
}

.page-title span {
    color: #4A4A4A;
    padding: 0 20px 5px 20px;
    display: inline-block;
    position: relative;
    z-index: 2;
    width: 250px;
}

.page-title span::after {
    content: '';
    width: 100px;
    height: 100%;
    position: absolute;
    top: 0;
    left: -35px;
    -webkit-transform: skewX(30deg);
    transform: skewX(30deg);
    z-index: -1;
}

.page-title span::before {
    content: '';
    width: 100px;
    height: 100%;
    position: absolute;
    top: 0;
    right: -35px;
    -webkit-transform: skewX(-30deg);
    transform: skewX(-30deg);
    z-index: -1;
}

/*(顏色1)*/
.page-title.color01 {
    border-top: 5px solid #24A453;
    margin: -2px 0 35px 0;
}

.page-title.color01 span {
    background-color: #24A453;
    color: #fff;
}

.page-title.color01 span::after {
    background-color: #24A453;
}

.page-title.color01 span::before {
    background-color: #24A453;
}

/*(顏色2)*/
.page-title.color02 {
    border-top: 5px solid #0EBDC9;
    margin: -2px 0 35px 0;
}

.page-title.color02 span {
    background-color: #0EBDC9;
    color: #fff;
}

.page-title.color02 span::after {
    background-color: #0EBDC9;
}

.page-title.color02 span::before {
    background-color: #0EBDC9;
}

/*(顏色3)*/
.page-title.color03 {
    border-top: 5px solid #E26BD2;
    margin: -2px 0 35px 0;
}

.page-title.color03 span {
    background-color: #E26BD2;
    color: #fff;
}

.page-title.color03 span::after {
    background-color: #E26BD2;
}

.page-title.color03 span::before {
    background-color: #E26BD2;
}

/*(顏色4)*/
.page-title.color04 {
    border-top: 5px solid #9E69EE;
    margin: -2px 0 35px 0;
}

.page-title.color04 span {
    background-color: #9E69EE;
    color: #fff;
}

.page-title.color04 span::after {
    background-color: #9E69EE;
}

.page-title.color04 span::before {
    background-color: #9E69EE;
}

/*(顏色5)*/
.page-title.color05 {
    border-top: 5px solid #1767BC;
    margin: -2px 0 35px 0;
}

.page-title.color05 span {
    background-color: #1767BC;
    color: #fff;
}

.page-title.color05 span::after {
    background-color: #1767BC;
}

.page-title.color05 span::before {
    background-color: #1767BC;
}

/*(顏色6)*/
.page-title.color06 {
    border-top: 5px solid #89C200;
    margin: -2px 0 35px 0;
}

.page-title.color06 span {
    background-color: #89C200;
    color: #fff;
}

.page-title.color06 span::after {
    background-color: #89C200;
}

.page-title.color06 span::before {
    background-color: #89C200;
}

/*(顏色7)*/
.page-title.color07 {
    border-top: 5px solid #00A0E9;
    margin: -2px 0 35px 0;
}

.page-title.color07 span {
    background-color: #00A0E9;
    color: #fff;
}

.page-title.color07 span::after {
    background-color: #00A0E9;
}

.page-title.color07 span::before {
    background-color: #00A0E9;
}

/*(顏色8)*/
.page-title.color08 {
    border-top: 5px solid #E8CC3F;
    margin: -2px 0 35px 0;
}

.page-title.color08 span {
    background-color: #E8CC3F;
    color: #fff;
}

.page-title.color08 span::after {
    background-color: #E8CC3F;
}

.page-title.color08 span::before {
    background-color: #E8CC3F;
}

/*(顏色9)*/
.page-title.color09 {
    border-top: 5px solid #FF5700;
    margin: -2px 0 35px 0;
}

.page-title.color09 span {
    background-color: #FF5700;
    color: #fff;
}

.page-title.color09 span::after {
    background-color: #FF5700;
}

.page-title.color09 span::before {
    background-color: #FF5700;
}

/*(顏色10)*/
.page-title.color10 {
    border-top: 5px solid #A57462;
    margin: -2px 0 35px 0;
}

.page-title.color10 span {
    background-color: #A57462;
    color: #fff;
}

.page-title.color10 span::after {
    background-color: #A57462;
}

.page-title.color10 span::before {
    background-color: #A57462;
}

/*顏色11*/
.page-title.color11 {
    border-top: 5px solid #666;
    margin: -2px 0 35px 0;
}

.page-title.color11 span {
    background-color: #666;
    color: #fff;
}

.page-title.color11 span::after {
    background-color: #666;
}

.page-title.color11 span::before {
    background-color: #666;
}

/*按鈕顏色*/
.btn-small {
    font-size: 14px;
    padding: 3px 10px;
}

.btn-orange-large,
.btn-orange-large:hover,
.btn-orange-large:focus {
    font-size: 1.7rem;
    background-color: #FF9100;
    color: #fff;
    box-shadow: 0 4px 0 #ce6427;
    padding: 0.375rem 2rem;
    font-weight: 500;
}

.btn-blue-large,
.btn-blue-large:hover,
.btn-blue-large:focus {
    font-size: 1.7rem;
    background-color: #1767BC;
    color: #fff;
    box-shadow: 0 4px 0 #1A448E;
    padding: 0.375rem 2rem;
    font-weight: 500;
}

.btn-green-large,
.btn-green-large:hover,
.btn-green-large:focus {
    font-size: 1.5rem;
    background-color: #24A453;
    color: #fff;
    box-shadow: 0 4px 0 #2C6349;
    padding: 0.375rem 2rem;
    font-weight: 500;
}

.btn-red-large,
.btn-red-large:hover,
.btn-red-large:focus {
    font-size: 1.7rem;
    background-color: #FF0000;
    color: #fff;
    box-shadow: 0 4px 0 #A11010;
    padding: 0.375rem 2rem;
    font-weight: 500;
}

.btn-blue,
.btn-blue:hover {
    background-color: #1767BC;
    color: #fff;
}

.btn-black,
.btn-black:hover {
    background-color: #4A4A4A;
    color: #fff;
}

.btn-light-gray,
.btn-light-gray:hover {
    background-color: #ABABAB;
    color: #fff;
}

.btn-gray,
.btn-gray:hover {
    background-color: #636363;
    color: #fff;
}

.btn-green,
.btn-green:hover {
    background-color: #24A453;
    color: #fff;
}

.btn-red,
.btn-red:hover {
    background-color: #FF0000;
    color: #fff;
}

.btn-orange,
.btn-orange:hover {
    background-color: #FF9100;
    color: #fff;
}

.btn-red-orange,
.btn-red-orange:hover {
    background-color: #FF5700;
    color: #fff;
}





.btn-blue-large.ok {
    background-color: rgb(0 100 200 / 30%);
    color: #1a448e;
    box-shadow: none;
}
/*橘色系 生產進度*/
.schedule-seach.color01{
    background-color: #ffcf8f;
}

.schedule-box.color01 .range-bar {
    background-color: #ff8647;
}

.schedule-box.color01 .item-box .item:nth-child(even) .range-bar {
    background-color: #ffcf8f;
}


/*********** 視窗 *************/
.modal-header {
    padding: 0.75rem 1rem;
    background-color: #FF9E1E;
    color: #fff;
}

.modal-title {
    font-size: 1.1rem;
    font-weight: 400;
}

.modal-body {
    padding: 1.5rem 1rem;
}

.modal-footer {
    flex-wrap: nowrap;
}

.print-quantity {
    display: flex;
    align-items: center;
}

.print-quantity span {
    margin-left: 5px;
    font-size: 1.1rem;
}

/*********** 修改密碼視窗 *************/
.modal-password .modal-body,
.modal-password .modal-footer {
    background-color: #EEF0F1;
}

.modal-password .password-box {
    margin-bottom: 10px;
}

.modal-password .password-box label {
    color: #333;
}

.modal-password .password-box .error {
    color: #FF0000;
    font-size: 0.9rem;
}

.modal-password .modal-body .password-box:last-child {
    margin-bottom: 0;
}

/*********** 押管紀錄 *************/
.modal-record li:first-child .title {
    color: #999;
    font-size: 0.9rem;
    width: 70px;
}

.modal-record li:first-child .con {
    width: calc(100% - 70px);
}

.modal-record .con span {
    margin-right: 5px;
}

.modal-record li .title {
    color: #999;
    font-size: 0.9rem;
    width: 70px;
}

.modal-record li .con {
    width: calc(50% - 70px);
}

.modal-record ul li {
    border-bottom: 1px solid #ccc;
    display: flex;
}

.modal-record ul {
    display: flex;
    flex-wrap: wrap;
}

.modal-record ul li {
    width: 50%;
}

.modal-record ul li:first-child {
    width: 100%;
}

.modal-record .title-blue-s {
    font-size: 0.9rem;
}

/*********** 混料-新增視窗 *************/
.modal-mix-add .input-box {
    margin-bottom: 10px;
}

.modal-mix-add .input-box .form-control {
    text-align: center;
}

.modal-mix-add .two-control .form-control{
    width: calc(100% - 210px);
    border: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left: 1px solid #bdbdbd;
    color: #000;
}

.modal-mix-add .input-box .form-select {
    width: 100px;
    text-align: center;
}

/*********** header ***********/
.head {
    background-color: #FF9E1E;
    padding: 6px 0;
    height: 50px;
}

.head .logo {
    width: auto;
    height: 35px;
}

.head .container-xl {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.head .user {
    color: #333;
    cursor: pointer;
}

/**************版面**************/
.page {
    padding-bottom: 30px;
}

.layout-s {
    max-width: 950px;
    margin: auto;
}

/************通用輸入框************/
.input-box {
    display: flex;
    align-items: center;
    background-color: #fff;
    border: 1px solid #979797;
    border-radius: 5px;
}

.input-box label {
    width: 110px;
    text-align: center;
    color: #555;
}

.input-box .form-control,
.input-box .form-select {
    width: calc(100% - 110px);
    border: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left: 1px solid #bdbdbd;
    color: #000;
}

/********通用-鎖定-輸入框********/
.input-box.output,
.input-box.output,
.form-control:disabled,
.form-control[readonly],
.form-select:disabled {
    background-color: #DBE0E5;
}

/*******通用 輸入框*********/

.rande-box {
    display: flex;
    align-items: center;
    background-color: #fff;
    border: 1px solid #979797;
    border-radius: 5px;
}

.rande-box .form-control {
    border: 0;
    text-align: center;
    background-color: inherit;
    padding: 0.375rem 0;
}

.rande-box label {
    width: 110px;
    text-align: center;
}

.rande-box .input-item {
    width: calc(100% - 110px);
    display: flex;
    align-items: center;
    border-left: 1px solid #bdbdbd;
}

.rande-box span {
    margin: 0 3px;
}

.rande-box.output {
    background-color: #DBE0E5;
}

/********通用-掃入-輸入框********/
.input-box.code .form-control {
    width: calc(100% - 150px);
}

.input-box.code .btn-keyin {
    width: 40px;
    height: 40px;
    cursor: pointer;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

/***************表頭**************/

.top-con .user {
    text-align: right;
    margin-bottom: 10px;
}

/***************加入版面*************/
.join-con {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 25px;
}

.join-con .box-left {
    width: calc(70% - 30px);
}

.join-con .box-right {
    width: calc(30% - 30px);
}

.join-con.storage-query .box-left {
    width: calc(50% - 30px);
}

.join-con.storage-query .box-right {
    width: calc(50% - 30px);
}

.join-con .form-control,
.join-con .form-select {
    font-size: 0.9rem;
    padding: 0.1rem 0.75rem;
    border: 1px solid #979797;
}

.join-con span {
    width: 60px;
    display: flex;
    justify-content: center;
    font-size: 18px;
}

.join-con span img {
    width: 13px;
}

.join-con .content {
    background-color: #fff;
    box-shadow: inset 2px 2px 3px rgb(0 0 0 / 10%);
    border: 1px solid #CFCFCF;
    height: 50vh;
    overflow-x: auto;
    padding: 15px;
    border-radius: 7px;
    font-size: 16px;
}

.join-con.storage-query .content {
    height: 20vh;
}

.join-con ul {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.join-con .title {
    padding: 0 15px;
    margin-bottom: 10px;
    color: #131313;
}

.join-con .data {
    margin-bottom: 7px;
    border-bottom: 1px solid #ddd;
    padding-bottom: 7px;
}

.join-con input.form-control {
    height: auto;
}

/*文字+按鈕群組*/
.text-btn-group {
    display: flex;
    align-items: center;
    margin-bottom: 3px;
}

.text-btn-group .btn {
    margin-left: 3px;
}

/*欄位寬度*/
.join-con .title li,
.join-con .data li {
    padding: 0 5px;
}

.join-con .box {
    width: calc(50% - 30px);
}

.join-con.experiment-order .title li:nth-child(1),
.join-con.experiment-order .data li:nth-child(1) {
    width: 23%;
}

.join-con.experiment-order .title li:nth-child(2),
.join-con.experiment-order .data li:nth-child(2) {
    width: 30%;
}

.join-con.experiment-order .title li:nth-child(3),
.join-con.experiment-order .data li:nth-child(3) {
    width: 24%;
}

.join-con.experiment-order .title li:nth-child(4),
.join-con.experiment-order .data li:nth-child(4) {
    width: 13%;
}

.join-con.experiment-order .title li:nth-child(5),
.join-con.experiment-order .data li:nth-child(5) {
    width: 10%;
    white-space: nowrap;
}

/***************加入版面(滿版)*************/
.join-con-full .content,
.join-con-full .form-control,
.join-con-full .form-select {
    font-size: 1rem;
}

.join-con.join-con-full .title li,
.join-con.join-con-full .data li {
    padding: 0 5px;
}

.join-con-full .box {
    width: 100%;
}

.join-con.join-con-full .data {
    margin-bottom: 10px;
    padding-bottom: 10px;
}

/*欄位寬度*/
.join-con.join-con-full .title li:nth-child(1),
.join-con.join-con-full .data li:nth-child(1) {
    width: 210px;
    display: flex;
    align-items: center;
}

.join-con.join-con-full .title li:nth-child(2),
.join-con.join-con-full .data li:nth-child(2) {
    width: calc(40% - 210px);
}

.join-con.join-con-full .title li:nth-child(3),
.join-con.join-con-full .data li:nth-child(3) {
    width: 20%;
}

.join-con.join-con-full .title li:nth-child(4),
.join-con.join-con-full .data li:nth-child(4) {
    width: 8%;
    text-align: center;
}

.join-con.join-con-full .title li:nth-child(5),
.join-con.join-con-full .data li:nth-child(5) {
    width: 8%;
    text-align: center;
}

.join-con.join-con-full .title li:nth-child(6),
.join-con.join-con-full .data li:nth-child(6) {
    width: 7%;
}
    .join-con.join-con-full .title li:nth-child(7),
    .join-con.join-con-full .data li:nth-child(7) {
        width: 5%;
    }

.join-con.join-con-full .title li:nth-child(8),
.join-con.join-con-full .data li:nth-child(8) {
    width: 7%;
    white-space: nowrap;
    text-align: center;
}

.join-con.join-con-full .title li:nth-child(9),
.join-con.join-con-full .data li:nth-child(9) {
    width: 5%;
    white-space: nowrap;
}

.join-con.join-con-full .data li:nth-child(8) .btn {
    width: 100%;
    font-size: 16px;
}

/*生產批號*/
.join-con.join-con-full .data li:nth-child(1) p {
    margin-bottom: 0;
    width: 90px;
}

.join-con.join-con-full .data li:nth-child(1) input {
    width: 45px;
    margin-left: 5px;
    padding: 0.1rem 0;
    text-align: center;
}

/***************工單查詢*************/

.work-search .content,
.work-search .form-control,
.work-search .form-select {
    font-size: 1rem;
}

.work-search .box {
    width: 100%;
}

.join-con.work-search .data {
    margin-bottom: 10px;
    padding-bottom: 10px;
}

/*欄位寬度*/
.join-con.work-search .title li:nth-child(1),
.join-con.work-search .data li:nth-child(1) {
    width: 14%;
}

.join-con.work-search .title li:nth-child(2),
.join-con.work-search .data li:nth-child(2) {
    width: 14%;
}

.join-con.work-search .title li:nth-child(3),
.join-con.work-search .data li:nth-child(3) {
    width: 16%;
}

.join-con.work-search .title li:nth-child(4),
.join-con.work-search .data li:nth-child(4) {
    width: 18%;
}

.join-con.work-search .title li:nth-child(5),
.join-con.work-search .data li:nth-child(5) {
    width: 10%;
}

.join-con.work-search .title li:nth-child(6),
.join-con.work-search .data li:nth-child(6) {
    width: 9%;
}

.join-con.work-search .title li:nth-child(7),
.join-con.work-search .data li:nth-child(7) {
    width: 7%;
}

.join-con.work-search .title li:nth-child(8),
.join-con.work-search .data li:nth-child(8) {
    width: 6%;
}

.join-con.work-search .title li:nth-child(9),
.join-con.work-search .data li:nth-child(9) {
    width: 6%;
}

/*欄位寬度*/
.join-con.work-search02 .title li:nth-child(1),
.join-con.work-search02 .data li:nth-child(1) {
    width: 17%;
}

.join-con.work-search02 .title li:nth-child(2),
.join-con.work-search02 .data li:nth-child(2) {
    width: 17%;
}

.join-con.work-search02 .title li:nth-child(3),
.join-con.work-search02 .data li:nth-child(3) {
    width: 17%;
}

.join-con.work-search02 .title li:nth-child(4),
.join-con.work-search02 .data li:nth-child(4) {
    width: 17%;
}

.join-con.work-search02 .title li:nth-child(5),
.join-con.work-search02 .data li:nth-child(5) {
    width: 13%;
}

.join-con.work-search02 .title li:nth-child(6),
.join-con.work-search02 .data li:nth-child(6) {
    width: 10%;
}

.join-con.work-search02 .title li:nth-child(7),
.join-con.work-search02 .data li:nth-child(7) {
    width: 9%;
}

/*欄位寬度*/
.join-con.work-search03 .title li:nth-child(1),
.join-con.work-search03 .data li:nth-child(1) {
    width: 13%;
}

.join-con.work-search03 .title li:nth-child(2),
.join-con.work-search03 .data li:nth-child(2) {
    width: 15%;
}

.join-con.work-search03 .title li:nth-child(3),
.join-con.work-search03 .data li:nth-child(3) {
    width: 23%
}

.join-con.work-search03 .title li:nth-child(4),
.join-con.work-search03 .data li:nth-child(4) {
    width: 5%;
}

.join-con.work-search03 .title li:nth-child(5),
.join-con.work-search03 .data li:nth-child(5) {
    width: 8%;
}

.join-con.work-search03 .title li:nth-child(6),
.join-con.work-search03 .data li:nth-child(6) {
    width: 8%;
}

.join-con.work-search03 .title li:nth-child(7),
.join-con.work-search03 .data li:nth-child(7) {
    width: 8%;
}

.join-con.work-search03 .title li:nth-child(8),
.join-con.work-search03 .data li:nth-child(8) {
    width: 8%;
}

.join-con.work-search03 .title li:nth-child(9),
.join-con.work-search03 .data li:nth-child(9) {
    width: 6%
}

.join-con.work-search03 .title li:nth-child(10),
.join-con.work-search03 .data li:nth-child(10) {
    width: 6%;
}

/*欄位寬度*/
.join-con.work-search04 .title li:nth-child(1),
.join-con.work-search04 .data li:nth-child(1) {
    width: 13%;
}

.join-con.work-search04 .title li:nth-child(2),
.join-con.work-search04 .data li:nth-child(2) {
    width: 15%;
}

.join-con.work-search04 .title li:nth-child(3),
.join-con.work-search04 .data li:nth-child(3) {
    width: calc(30% - 210px);
}

.join-con.work-search04 .title li:nth-child(4),
.join-con.work-search04 .data li:nth-child(4) {
    width: 15%;
}

.join-con.work-search04 .title li:nth-child(5),
.join-con.work-search04 .data li:nth-child(5) {
    width: 12%;
}

.join-con.work-search04 .title li:nth-child(6),
.join-con.work-search04 .data li:nth-child(6) {
    width: 5%;
}

.join-con.work-search04 .title li:nth-child(7),
.join-con.work-search04 .data li:nth-child(7) {
    width: 10%;
}

.join-con.work-search04 .title li:nth-child(8),
.join-con.work-search04 .data li:nth-child(8) {
    width: 70px;
}

.join-con.work-search04 .title li:nth-child(9),
.join-con.work-search04 .data li:nth-child(9) {
    width: 70px;
}

.join-con.work-search04 .title li:nth-child(10),
.join-con.work-search04 .data li:nth-child(10) {
    width: 70px;
}

/*欄位寬度*/
.join-con.work-search05 .title li:nth-child(1),
.join-con.work-search05 .data li:nth-child(1) {
    width: 15%;
}

.join-con.work-search05 .title li:nth-child(2),
.join-con.work-search05 .data li:nth-child(2) {
    width: 15%;
}

.join-con.work-search05 .title li:nth-child(3),
.join-con.work-search05 .data li:nth-child(3) {
    width: calc(40% - 240px);
}

.join-con.work-search05 .title li:nth-child(4),
.join-con.work-search05 .data li:nth-child(4) {
    width: 15%;
}

.join-con.work-search05 .title li:nth-child(5),
.join-con.work-search05 .data li:nth-child(5) {
    width: 5%;
}

.join-con.work-search05 .title li:nth-child(6),
.join-con.work-search05 .data li:nth-child(6) {
    width: 10%;
}

.join-con.work-search05 .title li:nth-child(7),
.join-con.work-search05 .data li:nth-child(7) {
    width: 100px;
}

.join-con.work-search05 .title li:nth-child(8),
.join-con.work-search05 .data li:nth-child(8) {
    width: 70px;
}

.join-con.work-search05 .title li:nth-child(9),
.join-con.work-search05 .data li:nth-child(9) {
    width: 70px;
}

/*欄位寬度*/
.join-con.work-search06 .title li:nth-child(1),
.join-con.work-search06 .data li:nth-child(1) {
    width: 13%;
}


.join-con.work-search06 .title li:nth-child(2),
.join-con.work-search06 .data li:nth-child(2) {
    width: 15%;
}

.join-con.work-search06 .title li:nth-child(3),
.join-con.work-search06 .data li:nth-child(3) {
    width: 16%;
}

.join-con.work-search06 .title li:nth-child(4),
.join-con.work-search06 .data li:nth-child(4) {
    width: 22%;
}

.join-con.work-search06 .title li:nth-child(5),
.join-con.work-search06 .data li:nth-child(5) {
    width: 7%;
}

.join-con.work-search06 .title li:nth-child(6),
.join-con.work-search06 .data li:nth-child(6) {
    width: 7%;
}

.join-con.work-search06 .title li:nth-child(7),
.join-con.work-search06 .data li:nth-child(7) {
    width: 8%;
}

.join-con.work-search06 .title li:nth-child(8),
.join-con.work-search06 .data li:nth-child(8) {
    width: 8%;
}

.join-con.work-search06 .title li:nth-child(9),
.join-con.work-search06 .data li:nth-child(9) {
    width: 4%;
}
.advanced-search{
    display: none;
}
.advanced-search.show{
    display: flex;
}
/*欄位寬度*/
.join-con.work-search07 .title li:nth-child(1),
.join-con.work-search07 .data li:nth-child(1) {
    width: 12%;
}

.join-con.work-search07 .title li:nth-child(2),
.join-con.work-search07 .data li:nth-child(2) {
    width: 16%;
}

.join-con.work-search07 .title li:nth-child(3),
.join-con.work-search07 .data li:nth-child(3) {
    width: 12%;
}

.join-con.work-search07 .title li:nth-child(4),
.join-con.work-search07 .data li:nth-child(4) {
    width: 6%;
}

.join-con.work-search07 .title li:nth-child(5),
.join-con.work-search07 .data li:nth-child(5) {
    width: 10%;
}

.join-con.work-search07 .title li:nth-child(6),
.join-con.work-search07 .data li:nth-child(6) {
    width: 18%;
}

.join-con.work-search07 .title li:nth-child(7),
.join-con.work-search07 .data li:nth-child(7) {
    width: 18%;
}

.join-con.work-search07 .title li:nth-child(8),
.join-con.work-search07 .data li:nth-child(8) {
    width: 8%;
}

/*欄位寬度*/
.join-con.work-search08 .title li:nth-child(1),
.join-con.work-search08 .data li:nth-child(1) {
    width: 10%;
}

.join-con.work-search08 .title li:nth-child(2),
.join-con.work-search08 .data li:nth-child(2) {
    width: 12%;
}

.join-con.work-search08 .title li:nth-child(3),
.join-con.work-search08 .data li:nth-child(3) {
    width: 22%;
}

.join-con.work-search08 .title li:nth-child(4),
.join-con.work-search08 .data li:nth-child(4) {
    width: 10%;
}

.join-con.work-search08 .title li:nth-child(5),
.join-con.work-search08 .data li:nth-child(5) {
    width: 6%;
}

.join-con.work-search08 .title li:nth-child(6),
.join-con.work-search08 .data li:nth-child(6) {
    width: 10%;
}

.join-con.work-search08 .title li:nth-child(7),
.join-con.work-search08 .data li:nth-child(7) {
    width: 10%;
}

.join-con.work-search08 .title li:nth-child(8),
.join-con.work-search08 .data li:nth-child(8) {
    width: 8%;
}


.join-con.work-search08 .title li:nth-child(9),
.join-con.work-search08 .data li:nth-child(9) {
    width: 8%;
}

.join-con.work-search08 .title li:nth-child(10),
.join-con.work-search08 .data li:nth-child(10) {
    width: 4%;
}

/*欄位寬度*/
.join-con.work-search09 .title li:nth-child(1),
.join-con.work-search09 .data li:nth-child(1) {
    width: 12%;
}

.join-con.work-search09 .title li:nth-child(2),
.join-con.work-search09 .data li:nth-child(2) {
    width: 10%;
}

.join-con.work-search09 .title li:nth-child(3),
.join-con.work-search09 .data li:nth-child(3) {
    width: 22%;
}

.join-con.work-search09 .title li:nth-child(4),
.join-con.work-search09 .data li:nth-child(4) {
    width: 10%;
}

.join-con.work-search09 .title li:nth-child(5),
.join-con.work-search09 .data li:nth-child(5) {
    width: 6%;
}

.join-con.work-search09 .title li:nth-child(6),
.join-con.work-search09 .data li:nth-child(6) {
    width: 7%;
}

.join-con.work-search09 .title li:nth-child(7),
.join-con.work-search09 .data li:nth-child(7) {
    width: 7%;
}

.join-con.work-search09 .title li:nth-child(8),
.join-con.work-search09 .data li:nth-child(8) {
    width: 6%;
}


.join-con.work-search09 .title li:nth-child(9),
.join-con.work-search09 .data li:nth-child(9) {
    width: 10%;
}

.join-con.work-search09 .title li:nth-child(10),
.join-con.work-search09 .data li:nth-child(10) {
    width: 10%;
}

/*欄位寬度*/
.join-con.work-search10 .title li:nth-child(1),
.join-con.work-search10 .data li:nth-child(1) {
    width: 12%;
}

.join-con.work-search10 .title li:nth-child(2),
.join-con.work-search10 .data li:nth-child(2) {
    width: 20%;
}

.join-con.work-search10 .title li:nth-child(3),
.join-con.work-search10 .data li:nth-child(3) {
    width: 8%;
}

.join-con.work-search10 .title li:nth-child(4),
.join-con.work-search10 .data li:nth-child(4) {
    width: 20%;
}

.join-con.work-search10 .title li:nth-child(5),
.join-con.work-search10 .data li:nth-child(5) {
    width: 20%;
}

.join-con.work-search10 .title li:nth-child(6),
.join-con.work-search10 .data li:nth-child(6) {
    width: 20%;
}

/*欄位寬度*/
.join-con.work-search11 .title li:nth-child(1),
.join-con.work-search11 .data li:nth-child(1) {
    width: 10%;
}

.join-con.work-search11 .title li:nth-child(2),
.join-con.work-search11 .data li:nth-child(2) {
    width: 20%;
}

.join-con.work-search11 .title li:nth-child(3),
.join-con.work-search11 .data li:nth-child(3) {
    width: 10%;
}

.join-con.work-search11 .title li:nth-child(4),
.join-con.work-search11 .data li:nth-child(4) {
    width: 10%;
}

.join-con.work-search11 .title li:nth-child(5),
.join-con.work-search11 .data li:nth-child(5) {
    width: 10%;
}

.join-con.work-search11 .title li:nth-child(6),
.join-con.work-search11 .data li:nth-child(6) {
    width: 10%;
}

.join-con.work-search11 .title li:nth-child(7),
.join-con.work-search11 .data li:nth-child(7) {
    width: 10%;
}

.join-con.work-search11 .title li:nth-child(8),
.join-con.work-search11 .data li:nth-child(8) {
    width: 10%;
}



/*********工作註記*********/

.work .data-top {
    margin-bottom: 20px;
}

.work-note {
    margin-bottom: 50px;
}

.work-note .work-text {
    padding: 10px 15px;
    border: 1px solid #A7A7A7;
    border-radius: 5px;
    margin-top: 10px;
}

.work-note li {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 5px;
    align-items: baseline;
}

.work-note li:last-child {
    margin-bottom: 0;
}

.work-note li .btn {
    width: 60px;
    margin-right: 5px;
    padding: 2px 10px;
    display: inline-block;
}

.work-note li .time {
    color: #888;
    width: 135px;
    font-size: 0.9rem;
}

.work-note li .text {
    margin-bottom: 0;
    width: calc(100% - 210px);
    word-wrap: break-word;
    /*依單字換行*/
}

.modal .note-time {
    color: #888;
}

/*******ERP生產批號*********/
.list-box {
    background-color: #DBE0E5;
    flex-direction: column;
    align-items: flex-start;
}

.list-box .title {
    border-bottom: 1px solid #979797;
    padding: 0.375rem 0.75rem;
    width: 100%;
}

.list-box ul {
    padding: 0.375rem 0.75rem 0;
    margin: 0;
    width: 100%;
    height: 102px;
    overflow: auto;
}

.list-box ul li {
    margin-bottom: 5px;
}

/***************建立生產工單*************/
.production-order .content,
.production-order .form-control,
.production-order .form-select {
    font-size: 1rem;
}

.production-order .box {
    width: 100%;
}

.join-con.production-order .data {
    margin-bottom: 10px;
    padding-bottom: 10px;
}

.join-con.production-order .title li:nth-child(1),
.join-con.production-order .data li:nth-child(1) {
    width: 20%;
}

.join-con.production-order .title li:nth-child(2),
.join-con.production-order .data li:nth-child(2) {
    width: 30%;
}

.join-con.production-order .title li:nth-child(3),
.join-con.production-order .data li:nth-child(3) {
    width: 20%;
}

.join-con.production-order .title li:nth-child(4),
.join-con.production-order .data li:nth-child(4) {
    width: 10%;
}

.join-con.production-order .title li:nth-child(5),
.join-con.production-order .data li:nth-child(5) {
    width: 20%;
}

/***************建立包裝工單*************/
.package-work .content,
.package-work .form-control,
.package-work .form-select {
    font-size: 1rem;
}

.package-work .box {
    width: 100%;
}

.join-con.package-work .data {
    margin-bottom: 10px;
    padding-bottom: 10px;
}

.join-con.package-work .title li:nth-child(1),
.join-con.package-work .data li:nth-child(1) {
    width: 25%;
}

.join-con.package-work .title li:nth-child(2),
.join-con.package-work .data li:nth-child(2) {
    width: 25%;
}

.join-con.package-work .title li:nth-child(3),
.join-con.package-work .data li:nth-child(3) {
    width: 35%;
}

.join-con.package-work .title li:nth-child(4),
.join-con.package-work .data li:nth-child(4) {
    width: 15%;
}

/*--------------------------------------------------------------
登入
--------------------------------------------------------------*/
.login {
    margin: 90px auto 0 auto;
    max-width: 600px;
}

.login .box {
    background-color: #fff;
    border-radius: 15px;
    padding: 70px 60px;
}

.login .box .form-input {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
}

.login .box label {
    width: 100px;
    font-size: 1.2rem;
    color: #666;
}

.login .box .form-control {
    width: calc(100% - 100px);
    font-size: 1.2rem;
}

.login .box .btn.btn-login {
    margin-top: 1rem;
}

.login .box .btn {
    width: 100%;
    border-radius: 50px;
    margin-bottom: 10px;
}

.login .input-box.output,
.login .input-box.output,
.login .form-control:disabled,
.login .form-control[readonly],
.login .form-select:disabled {
    background-color: #fff;
}

/************按鈕群組*************/
.button-box {
    margin-top: 10px;
    display: flex;
    align-items: center;
}

.button-box button.btn {
    margin-left: 10px;
    min-width: 190px;
}

.button-box.right {
    text-align: right;
    justify-content: flex-end;
}

.button-box.center {
    text-align: center;
    justify-content: center;
}

.button-box .form-select {
    width: 300px !important;
    font-size: 1.5rem;
}

/*增加輸入框畫面*/
.button-box.add-input {
    flex-wrap: wrap;
}

.button-box.add-input .form-select {
    width: 150px !important;
}

.button-box.add-input .form-control {
    font-size: 1.5rem;
    width: 350px;
    height: 53px;
}

/*--------------------------------------------------------------
入口
--------------------------------------------------------------*/
.entrance {
    margin: 90px auto 0 auto;
}

.entrance .box {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.entrance .item {
    width: 165px;
    padding: 30px 0;
    background-color: #fff;
    text-align: center;
    display: block;
    border-radius: 15px;
    border: 1px solid #BFBFBF;
    box-shadow: 0px 2px 5px rgb(0 0 0 / 10%);
    color: #444;
    font-weight: 400;
    margin: 0 7px 30px;
    font-size: 1.25rem;
}

.entrance .item img {
    height: 60px;
    margin: 10px auto 10px auto
}

/*--------------------------------------------------------------
檢驗判定
--------------------------------------------------------------*/

/*橘色標題*/
.title-blue.orange {
    color: #FF5700;
    border-bottom: 1px solid #FF5700;
}

/*藍色標題*/
.title-blue,
.title-blue-s {
    color: #007BFF;
    border-bottom: 2px solid #007BFF;
    width: 100%;
    margin-bottom: 10px;
    padding: 0 .5%;
    display: flex;
    align-items: center;
}

.title-blue {
    padding-bottom: .25%;
    font-size: 1.05rem;
}

.title-blue button,
.title-blue button:hover {
    background-color: #007BFF;
    margin-left: 5px;
}

.title-blue button.btn-green,
.title-blue button.btn-green:hover {
    background-color: #24A453;
    margin-left: 5px;
}

.title-blue-s {
    border-bottom: 0;
    margin: 0;
}

.title-blue span {
    color: #707377;
    margin-left: 10px;
}

/*版面*/
.conbox {
    margin-top: 30px;
}

.conbox-con {
    margin-bottom: 1%;
}

.conbox .form-control,
.conbox .form-select {
    width: 99%;
    margin: 0 .5%;
}

.conbox .conbox-con .item {
    display: flex;
    align-items: center;
}

.conbox .item .form-control,
.conbox .item .form-select {
    margin: 0 .5% 0 0;
}

/**欄位1/4(4欄一列)**/
.conbox .conbox-field01 {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.conbox .conbox-field01 .item {
    display: flex;
    align-items: center;
    width: 24%;
    margin: 0 .5% .5% .5%;
}

/**欄位1/2(2欄一列)**/
.conbox .conbox-field02 {
    display: flex;
    align-items: center;
}

.conbox .conbox-field02 .item {
    width: 49%;
    margin: 0 .5% .5% .5%;
}

.conbox .conbox-field02 .item span.center {
    margin-right: .5%;
}

.conbox .conbox-field02 .item .form-select-unit {
    width: 80px;
    margin: 0;
}

/**欄位1/1(1欄一列)**/
.conbox .conbox-field03 {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.conbox .conbox-field03 .item {
    width: 99%;
    margin: 0 .5% .5% .5%;
}

/**欄位-含刪除鈕**/
.conbox .conbox-field04 {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.conbox .conbox-field04 .item {
    width: 24%;
    margin: 0 .5% .5% .5%;
}

.conbox .conbox-field04 .item input {
    width: calc(100% - 60px);
    margin-right: 0;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}

.conbox .conbox-field04 .item .btn-delete {
    width: 40px;
    height: 40px;
    border-top-right-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
    cursor: pointer;
}

.conbox .conbox-field04 .item span {
    width: 20px;
    text-align: center;
}

/**欄位1/2(2欄一列) 增加按鈕**/
.conbox-field02.add-btn img {
    width: 40px;
    height: 40px;
    margin-bottom: .5%;
    border-radius: 0.25rem;
    cursor: pointer;
}

.conbox .conbox-field02.add-btn .item:nth-child(2) {
    width: calc(49% - 40px);
}

/**欄位1/2(一欄一列) 增加按鈕**/
.conbox .conbox-field05 {
    display: flex;
    align-items: center;
}

.conbox .conbox-field05 .item {
    width: 99%;
    margin: 0 .5% .5% .5%;
}

.conbox-field05.add-btn img {
    width: 40px;
    height: 40px;
    margin-bottom: .5%;
    border-radius: 0.25rem;
    cursor: pointer;
}

/***欄位1/4 + 3/4*****/
.conbox .conbox-field06 {
    display: flex;
    align-items: center;
}

.conbox-field06 .item:first-child {
    width: 24%;
    margin: 0 .5% .5% .5%;
}

.conbox-field06 .item:last-child {
    width: 75%;
    margin: 0 0 .5% .5%;
}

/***欄位1/2(一欄四列)*****/
.conbox .conbox-field07 {
    display: flex;
    align-items: center;
}


.conbox-field07 .item {
    width: 24%;
    margin: 0 .5% .5% .5%;
}


/**合格章**/
.qualified {
    width: 120px;
    position: fixed;
    right: calc(50% - 560px);
    bottom: 20px;
}

/*--------------------------------------------------------------
包裝作業
--------------------------------------------------------------*/
.package-box {
    margin-top: 30px;
}

.package-box .title {
    font-size: 1.2rem;
    color: #1767BC;
    margin-right: 10px;
}

.package-item {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 5px;
    justify-content: flex-end;
}

.package-item .form-select.weight {
    width: 200px;
}

.package-item .form-control.quantity {
    width: 80px;
    margin-left: 5px;
}

.package-item span {
    width: 40px;
    text-align: center;
    font-size: 1.3rem;
}

.package-item button {
    padding: .25rem 1.5rem;
}

.package-item .btn-print {
    width: 150px;
    margin-left: 30px;
}

.package-con {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.package-con .item {
    display: flex;
    align-items: center;
    border-radius: 5px;
    margin: 0 5px 5px 0;
}

.package-con .text {
    background-color: #BECDDB;
    padding: 5px 33px;
    height: 35px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.package-con .btn-delete {
    width: 35px;
    height: 35px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    cursor: pointer;
}

/*--------------------------------------------------------------
混料
--------------------------------------------------------------*/
.search-box {
    background-color: #E5E5E5;
    padding: 10px 0;
}

/*.search-box-group:first-child {
    margin-bottom: 10px;
}
*/
.search-box-group {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
}

.search-box .input-box {
    margin-left: 10px;
}

.search-box .input-box label {
    width: 85px;
}

.search-box-group .input-box .form-control,
.search-box-group .input-box .form-select {
    width: calc(100% - 85px);
}

.search-box-group .rande-box {
    width: 400px;
    margin-left: 10px;
}

/*輸入值(長)*/
.search-box .input-box.w-long {
    width: 325px;
}

/*輸入值(短)*/
.search-box .input-box.w-short {
    width: 277px;
}

/*範圍*/
.search-box .range-box {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 10px;
}

.search-box .range-box span {
    display: block;
    margin: 0 5px;
    color: #555;
    white-space: nowrap;
}

.search-box .range-box input {
    width: 75px;
}

/*按鈕*/
.search-box button {
    margin-left: 10px;
    white-space: nowrap;
}

.work-mix-top {
    display: flex;
    align-items: center;
}

.work-mix-top .btn {
    white-space: nowrap;
}

/*輸入新批號*/
.keyin-new {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
}

.keyin-new input {
    width: 200px;
    margin-right: 10px;
}

.keyin-new select {
    width: 100px;
    margin-right: 10px;
}

.keyin-new label {
    white-space: nowrap;
    width: auto;
    margin-right: 5px;
    font-size: 1.2rem;
    color: #1767BC;
}

.keyin-new span {
    white-space: nowrap;
    width: auto;
    margin-right: 25px;
    font-size: 1.2rem;
    color: #1767BC;
}

/*混料-欄位寬度*/
.container-work-mix {
    font-size: 16px;
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 10px;
    margin-top: 25px;
}

.join-con.work-order.work-mix .box-left .title li:nth-child(1),
.join-con.work-order.work-mix .box-left .data li:nth-child(1) {
    width: 85px;
}

.join-con.work-order.work-mix .box-left .title li:nth-child(2),
.join-con.work-order.work-mix .box-left .data li:nth-child(2) {
    width: 18%;
}

.join-con.work-order.work-mix .box-left .title li:nth-child(3),
.join-con.work-order.work-mix .box-left .data li:nth-child(3) {
    width: 27%;
}

.join-con.work-order.work-mix .box-left .title li:nth-child(4),
.join-con.work-order.work-mix .box-left .data li:nth-child(4) {
    width: 60px;
}

.join-con.work-order.work-mix .box-left .title li:nth-child(5),
.join-con.work-order.work-mix .box-left .data li:nth-child(5) {
    width: calc(50% - 205px);
}

.join-con.work-order.work-mix .box-left .title li:nth-child(6),
.join-con.work-order.work-mix .box-left .data li:nth-child(6) {
    width: 60px;
    white-space: nowrap;
}

.join-con.work-order.work-mix .box-left .data li:nth-child(4) {
    color: #007BFF;
}

/*右表格*/
.join-con.work-order.work-mix .box-right .title li:nth-child(1),
.join-con.work-order.work-mix .box-right .data li:nth-child(1) {
    width: 85px;
}

.join-con.work-order.work-mix .box-right .title li:nth-child(2),
.join-con.work-order.work-mix .box-right .data li:nth-child(2) {
    width: 45%;
}

.join-con.work-order.work-mix .box-right .title li:nth-child(4),
.join-con.work-order.work-mix .box-right .data li:nth-child(4) {
    width: 13%;
}

.join-con.work-order.work-mix .box-right .title li:nth-child(4),
.join-con.work-order.work-mix .box-right .data li:nth-child(4) {
    width: 45px;
    white-space: nowrap;
}

/*庫存查詢 左表格*/
.join-con.storage-query .box-left .title li:nth-child(1),
.join-con.storage-query .box-left .data li:nth-child(1) {
    width: 80%;
}

.join-con.storage-query .box-left .title li:nth-child(2),
.join-con.storage-query .box-left .data li:nth-child(2) {
    width: 20%;
}

/*庫存查詢 右表格*/
.join-con.storage-query .box-right .title li:nth-child(1),
.join-con.storage-query .box-right .data li:nth-child(1) {
    width: 80%;
}

.join-con.storage-query .box-right .title li:nth-child(2),
.join-con.storage-query .box-right .data li:nth-child(2) {
    width: 20%;
}

/*--------------------------------------------------------------
入庫 + 出庫
--------------------------------------------------------------*/
/*標題*/
.page-title.storehouse-title {
    text-align: left;
    margin-top: 0;
}

.page-title.storehouse-title .title {
    position: relative;
    display: inline-block;
    z-index: 5;
    color: #fff;
    padding: 0 0 5px 0;
}

.page-title.storehouse-title .title:before {
    content: '';
    width: 1000px;
    height: 100%;
    position: absolute;
    top: 0;
    right: -35px;
    -webkit-transform: skewX(-30deg);
    transform: skewX(-30deg);
    z-index: -1;
}

.page-title.storehouse-title.blue {
    border-top: 5px solid #1767BC;
}

.page-title.storehouse-title.blue .title:before {
    background-color: #1767BC;
}

.page-title.storehouse-title.red {
    border-top: 5px solid #FF5700;
}

.page-title.storehouse-title.red .title:before {
    background-color: #FF5700;
}

/*儲位搜尋*/
.storage {
    margin-top: 25px;
}

.storage .title-blue {
    justify-content: flex-end;
}

.storage .storage-keyin {
    display: flex;
    align-items: center;
    margin-left: 10px;
    width: 300px;
}

.storage .storage-keyin input {
    height: 30px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.storage .storage-keyin img {
    width: 30px;
    height: 30px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.storage .storage-keyin .btn {
    margin-left: 5px;
    white-space: nowrap;
}

/*入庫-儲位選擇*/
.storage-location {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 5px;
    margin-bottom: 5px;
    border-bottom: 1px solid #ccc;
    justify-content: space-between;
}

/*20*/
.storage-location .pallet {
    width: 19%;
    margin-right: 1%;
    font-size: 1.3rem;
}

/*40*/
.storage-location .form-select {
    width: 39%;
    margin-right: 1%;
}

/*15*/
.storage-location .quantity {
    width: 10%;
    text-align: center;
    margin: 0 2.5%;
    display: flex;
    align-items: center;
}

.storage-location .quantity span {
    font-size: 1.2rem;
    margin-left: 20px;
}

.storage-location button {
    width: 40px;
    height: 40px;
}

/*出庫-儲位選擇*/
.storage-location-delivery .list {
    display: flex;
    align-items: center;
    font-size: 1.3rem;
    justify-content: center;
    border-bottom: 1px solid #ccc;
    margin-bottom: 5px;
    padding-bottom: 5px;
    justify-content: space-between;
}

.storage-location-delivery .list .location {
    width: 20%;
    margin-right: 15px;
}

.storage-location-delivery .location-text {
    width: 80%;
    display: flex;
    align-items: center;
    justify-content: end;
}

.storage-location-delivery .list .weight {

    margin-right: 30px;
    text-align: right;

}

.storage-location-delivery .list .quantity {
    margin-right: 15px;
}

.storage-location-delivery .list .out-of-stock {
    width: 150px;
    margin-right: 15px;
    display: flex;
    align-items: center;
}

.storage-location-delivery .list .out-of-stock .form-control {
    text-align: center;
}

.storage-location-delivery .list .out-of-stock span {
    margin-left: 15px;
}

/* .storage-location-delivery .list input {
    width: 100px;
    margin-right: 15px;
    margin-left: 5%;
    text-align: center;
} */

/* .storage-location-delivery .list span {
    width: 10%;
    margin-right: 15px;
} */

/*-------------------------------------------------------------
備貨 
--------------------------------------------------------------*/
/*指定客戶-欄位*/
.form-select-two .form-select {
    width: calc(50% - 50px);
    border: 0;
    border-left: 1px solid #bdbdbd;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}

/*備貨-欄位寬度*/
.container-stock-up {
    font-size: 16px;
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 10px;
    margin-top: 25px;
}


/*備貨-右版面*/
.container-stock-up .join-con .box .title li:nth-child(1),
.container-stock-up .join-con .box .data li:nth-child(1) {
    width: 16.667%;
}

.container-stock-up .join-con .box .title li:nth-child(2),
.container-stock-up .join-con .box .data li:nth-child(2) {
    width: 16.667%;
}

.container-stock-up .join-con .box .title li:nth-child(3),
.container-stock-up .join-con .box .data li:nth-child(3) {
    width: 16.667%;
}

.container-stock-up .join-con .box .title li:nth-child(4),
.container-stock-up .join-con .box .data li:nth-child(4) {
    width: 16.667%;
}

.container-stock-up .join-con .box .title li:nth-child(5),
.container-stock-up .join-con .box .data li:nth-child(5) {
    width: 16.667%;
    
}

.container-stock-up .join-con .box .title li:nth-child(6),
.container-stock-up .join-con .box .data li:nth-child(6) {
    width: 16.667%;
}



.container-stock-up .join-con .box .data li:nth-child(4),
.container-stock-up .join-con .box .data li:nth-child(5) {
    color: #007BFF;
}

/*--------------------------------------------------------------
報表管理
--------------------------------------------------------------*/
/*分類*/
.report-link {
    display: flex;
    align-items: center;
    justify-content: center;
}

.report-link li {
    width: 120px;
    margin: 0 5px;
}

.report-link li a {
    background-color: #fff;
    border: 1px solid #8B8B8B;
    width: 100%;
    display: block;
    text-align: center;
    padding: 5px;
    border-radius: 5px;
}

/*報表管理*/
.report-box {
    padding: 15px 15px 30px 15px;
    min-height: calc(100vh - 240px);
    background-color: #fff;
    text-align: center;
}

.schedule-seach .seach-box span {
    margin-right: 5px;
    color: #000;
}

.schedule-seach .seach-box .form-check-input {
    margin-right: 5px;
}

.report-box .table>:not(:last-child)>:last-child>* {
    background-color: #636363;
    color: #fff;
    font-weight: 400 !important;
}

.report-box .table {
    font-size: 14px;
}

/*--------------------------------------------------------------
生產進度
--------------------------------------------------------------*/

/*搜尋欄*/
.schedule-seach {
    background-color: #A3DBF1;
    padding: 10px 15px;
    display: flex;
    justify-content: end;
}

.schedule-seach .seach-box {
    display: flex;
    align-items: center;
    margin-left: 15px;
}

.schedule-seach .seach-box.seach-box01 .form-select {
    width: 200px;
}

.schedule-seach .seach-box .form-select {
    border: 1px solid #fff;
    background-color: inherit;
    width: 100px;
    height: 30px;
    padding: 0 0.75rem;
    margin-right: 5px;
    font-weight: 400;
}

.schedule-seach .seach-box .form-control {
    border: 1px solid #fff;
    background-color: inherit;
    width: 200px;
    height: 30px;
    padding: 0 0.75rem;
    margin-right: 5px;
    color: #0B6CD4;
    font-weight: 400;
}

/*生產進度*/
.schedule-box {
    padding-top: 15px;
    min-height: calc(100vh - 183px);
    background-color: #fff;
    padding-bottom: 30px;
}

.schedule-box .item {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}

.schedule-box .item-box .item:first-child ul li {
    border-top: 1px solid #ccc;
}

.schedule-box .item-box .item:last-child ul li {
    border-bottom: 1px solid #ccc;
}

/*生產進度*隱藏列*/
.schedule-box.top-fixed {
    padding-top: 0;
    min-height: auto;
    padding-bottom: 0;
    display: none;
}

.schedule-box.top-fixed.active {
    display: block;
    position: fixed;
    right: 0;
    left: 0;
    top: 0;
    z-index: 99;
}

.schedule-box.top-fixed .item-title {
    margin-bottom: 0;
}

.schedule-box.top-fixed .page-title{
    margin: -2px 0 15px 0;
}

/*標題top*/
.item-title-top{
    background-color: #e9e9e9;
}
.schedule-box .item-title-top ul {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    color: #333;
    text-align: center;
    font-size: 20px;
    padding-left: calc(100% - 980px);
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.schedule-box .item-title-top ul li:first-child {
    width: 280px;
    background-color: #ddd;
}

.schedule-box .item-title-top ul li:nth-child(2) {
    width: 700px;
    background-color: #bbb;
}

/*標題*/
.schedule-box .item-title {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    color: #666;
    text-align: center;
    font-size: 18px;
    margin-bottom: .7rem;
}

.schedule-box .item-title ul.title01 {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    width: calc(100% - 980px);
}

.schedule-box .item-title ul.title01 li:nth-child(1) {
    width: calc(100% - 200px);
}

.schedule-box .item-title ul.title01 li:nth-child(2) {
    width: 200px;
}

.schedule-box .item-title ul.title02 {
    width: 980px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.schedule-box .item-title ul.title02 li {
    width: 140px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.schedule-box .item-title ul.title02 li::before {
    content: "";
    width: 15px;
    height: 15px;
    background-color: #ddd;
    display: inline-block;
    margin-right: 5px;
}

/*品名*/
.schedule-box .item .name {
    width: calc(100% - 1180px);
    text-align: center;
    cursor: pointer;
    min-height: 70px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    line-height: 1.3;
}

.schedule-box .item .name .title {
    font-weight: 400;
    font-size: 1.1rem;
}

.schedule-box .item .name .text {
    color: #999;
}

/*實收料數量*/
.schedule-box .item .receipt {
    width: 200px;
    text-align: center;
    min-height: 73px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/*range-bar*/

/*底框*/
.schedule-box .item .schedule {
    width: 980px;
    position: relative;
}

.schedule-box .item .schedule ul {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin: 0;
    height: 100%;
}

.schedule-box .item .schedule ul li {
    flex: 1;
    height: 65px;
    position: relative;
    height: 100%;
}

.schedule-box .item .schedule ul li:first-child::after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border-left: 1px solid #ccc;
}

.schedule-box .item .schedule ul li:first-child::before {
    position: absolute;
    content: "";
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border-left: 1px solid #ccc;
}

.schedule-box .item .schedule ul li:last-child::before {
    position: absolute;
    content: "";
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border-right: 1px solid #ccc;
}

.schedule-box .item .schedule ul li::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border-left: 1px dashed #ccc;
}

.schedule-box .item .packageschedule {
    width: 900px;
    position: relative;
}

.schedule-box .item .packageschedule ul {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin: 0;
    height: 100%;
}

.schedule-box .item .packageschedule ul li {
    flex: 1;
    height: 65px;
    position: relative;
    height: 100%;
}

.schedule-box .item .packageschedule ul li:first-child::after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border-left: 1px solid #ccc;
}

.schedule-box .item .packageschedule ul li:first-child::before {
    position: absolute;
    content: "";
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border-left: 1px solid #ccc;
}

.schedule-box .item .packageschedule ul li:last-child::before {
    position: absolute;
    content: "";
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border-right: 1px solid #ccc;
}

.schedule-box .item .packageschedule ul li::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border-left: 1px dashed #ccc;
}

/*線段*/
.range-bar {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    height: 18px;
    background-color: #0f4c81;
}

.schedule-box .item-box .item:nth-child(even) .range-bar {
    background-color: #8fc5d4;
}

.range-bar.w-01 {
    width: 140px;
}

.range-bar.w-02 {
    width: 280px;
}

.range-bar.w-03 {
    width: 420px;
}

.range-bar.w-04 {
    width: 560px;
}

.range-bar.w-05 {
    width: 700px;
}

.range-bar.w-06 {
    width: 840px;
}

.range-bar.w-07 {
    width: 980px;
}

/*生產進度 視窗*/
.modal-schedule ul {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin: 0;
}

.modal-schedule ul li {
    margin-bottom: 7px;
    padding-bottom: 7px;
    border-bottom: 1px solid #ddd;
}

.modal-schedule ul li:nth-child(odd) {
    width: 60px;
}

.modal-schedule ul li:nth-child(even) {
    width: calc(100% - 60px);
}

.modal-schedule ul li span {
    margin-left: 15px;
}

/*進度線-標註*/
.schedule-box .item .schedule ul li {
    position: relative;
}

.schedule-box .item .schedule ul li span {
    font-size: 16px;
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    top: 3px;
    color: #0097CF;
}

.schedule-box .item .schedule ul li span.red {
    color: #d34a4a;
}

.schedule-box .item .packageschedule ul li {
    position: relative;
}

.schedule-box .item .packageschedule ul li span {
    font-size: 16px;
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    top: 3px;
    color: #0097CF;
}

.schedule-box .item .packageschedule ul li span.red {
    color: #d34a4a;
}
/*--------------------------------------------------------------
包裝進度
--------------------------------------------------------------*/
.package-schedule .schedule-box .item-title ul.title02 li {
    width: 112.5px;
}

.package-schedule .schedule-box .item-title-top ul li:first-child {
    width: 562.5px;
    background-color: #ddd;
}

.package-schedule .schedule-box .item-title-top ul li:nth-child(2) {
    width: 112.5px;
    background-color: #bbb;
}

.package-schedule .schedule-box .item-title-top ul li:nth-child(3) {
    width: 225px;
    background-color: #ddd;
}

.package-schedule .range-bar.w-01 {
    width: 112.5px;
}

.package-schedule .range-bar.w-02 {
    width: 225px;
}

.package-schedule .range-bar.w-03 {
    width: 337.5px;
}

.package-schedule .range-bar.w-04 {
    width: 450px;
}

.package-schedule .range-bar.w-05 {
    width: 562.5px;
}

.package-schedule .range-bar.w-06 {
    width: 675px;
}

.package-schedule .range-bar.w-07 {
    width: 787.5px;
}

.package-schedule .range-bar.w-08 {
    width: 900px;
}

/*--------------------------------------------------------------
展示畫面 
--------------------------------------------------------------*/
.department .box {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 50px;
}

.department .box .item {
    width: 33.3%;
    text-align: center;
    border: 1px solid #999;
    margin: 1%;
    padding: 1%;
    font-size: 1.4rem;
    background-color: #fff;
    border-radius: 5px;
}

/*--------------------------------------------------------------
建立批號
--------------------------------------------------------------*/

/*配方比-欄位*/
.form-select-three .form-control {
    width: calc(33.3% - 33.3px);
    border: 0;
    border-left: 1px solid #bdbdbd;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    text-align: center;
}