/*+発注データ作成CSS*/
/*リセット*/
ul,table,
h4,h5{
    margin: 0;
    color: black;
}

/*+発注情報入力エリア　各項目*/
/*//上部リンク nav_list*/
.nav_list ul{
    width: 60%;
    margin: 0 auto;
    display: flex;
    justify-content: space-around;
}

.nav_list ul li{
    width: fit-content;
    height: 30px;
    line-height: 30px;
    font-family: "ＭＳ Ｐゴシック", sans-serif;
    font-weight: bold;
    letter-spacing: 0.2em;
    color: #564E9E;
    border: 1px solid #564E9E;
    border-radius: 3px;
    padding: 0 0.8em;
    position: relative;
    z-index: 1;
    overflow: hidden;/*はみ出し防止*/
}

.nav_list ul li::before{
    content: "";
    display: inline-block;
    inset: 0;/*親とぴったりのサイズ */
    background-color: #DCDCDC;
    border-radius: inherit; /* 親と同じ角丸*/
    position: absolute;
    z-index: -2;
}

.nav_list ul li::after{
    content: "";
    display: inline-block;
    inset: 0;/*親とぴったりのサイズ*/
    background-color: #F5F5F5;
    border-radius: inherit; /* 親と同じ角丸*/
    position: absolute;
    top: 1px;
    left: 5px;
    z-index: -1;
}

.nav_list p{
    width: 100%;
    padding-left: 1em;
    margin-top: 1em;
}

/*更新ボタン（印刷、コピー、削除も）*/
.save{
    display: inline-block;
    width: 4em;
    height: 37px;
    line-height: 37px;
    text-align: center;
    font-family: "ＭＳ Ｐゴシック", sans-serif;    
    color: white;
    background-color: #564E9E;
    border-radius: 3px;
    margin: 0 0.2em;
}

/**発注番号 発注日*/
/*//発注番号 order_no*/
.order_no img{
    width: 75%;
    margin-bottom: 2em;
}

.order_no div{
    width: 95%;
    margin: 0 auto;
}

/*＝ボタン */
.order_no .d_2 p span::before{
    content: "";
    display: inline-block;
    width: 35px;
    height: 25px;
    background-image: url(cod_img/order_no_2.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom;
    vertical-align: middle;
    margin-right: 0.2em;
}

/*//発注日 order_date*/
.order_date .div_flex{
    justify-content: space-between;
}

.order_date p{
    width: 45%;
}

/**仕入先 納入先*/
/*//仕入先 supplier*/
.supplier > p:first-of-type{
    width: 100%;
    padding-left: 2.5%;
    margin-bottom: 1em;
}

.supplier .div_flex{
    justify-content: space-between;
}

.supplier .div_flex p{
    width: 48%;
}

.supplier img{
    margin: 0;
}

/*//納入先 delivery_to*/
.delivery_to > p:first-of-type{
    width: 100%;
    padding-left: 2.5%;
    margin-bottom: 1em;
}

.delivery_to .div_flex{
    justify-content: space-between;
}

.delivery_to .div_flex p{
    width: 48%;
}

.delivery_to > p:last-of-type{
    width: 95%;
    color: red;
    margin: 0 auto;
    margin-top: 1em;
}

.delivery_to .spa_1{
    color: #3D4449;

}

.delivery_to img{
    margin: 0;
}

/**納期 納期メモ*/
/*//納期 due_date*/
.due_date > p:first-of-type{
    width: 95%;
    margin: 0 auto;
    margin-bottom: 1em;
}

.due_date .div_flex{
    justify-content: space-between;
}

.due_date .div_flex p{
    width: 44%;
}

/*//納期メモ due_memo*/
.due_memo{
    height: fit-content;
}

.due_memo p{
    width: 95%;
    margin: 0 auto;
    margin-bottom: 0.5em;
}

.due_memo img{
    width: 80%;
}

/**摘要 メモ*/
/*//摘要 summary*/
.summary > div:first-of-type{
    width: 95%;
    margin: 0 auto;
}

.summary div:first-of-type > p:first-child{
    width: 97%;
    margin-bottom: 1em;
}

.summary .div_flex{
    align-items: end;/*「など」を下揃えに*/
}

.summary ul{
    width: 50%;
    list-style-type: disc;
}

.summary .div_flex p{
    width: 10%;
}

/*//メモ memo*/
.memo > div:first-of-type{
    width: 95%;
    margin: 0 auto;
}

.memo div:first-of-type > p:first-child{
    width: 97%;
    margin-bottom: 1em;
}

.memo .div_flex{
    align-items: end;/*「など」を下揃えに*/
}

.memo ul{
    width: 45%;
    list-style-type: disc;
}

.memo .div_flex p{
    width: 10%;
}

/**画面右下ボタン bottom_button*/
.bottom_button table th:not(tr:first-of-type th){
    width: 10%;
}

/*コピー*/
.bottom_button table .tr_3 th span{
    display: inline-block;
    letter-spacing: 0.2em;
}

/*更新*/
.bottom_button table .tr_4 th{
    padding: 0.5em 0;
}

/*+商品登録エリア：発注商品一覧 order_items*/
/**各項目 order_items table*/
.order_items table th{
    width: 10%;
}

/*+商品登録エリア：発注商品の呼び出し load_items*/
/**１．商品の検索 load_items div_1*/
.load_items .div_1 > p:first-of-type{
    width: 100%;
    padding-left: 1em;
    margin-bottom: 1em;
}

/*商品絞込ボタン*/
.load_items .div_1 > p span{
    display: inline-block;
    width: 6em;
    height: 35px;
    line-height: 35px;
    text-align: center;
    letter-spacing: 0.2em;
    font-family: "ＭＳ Ｐゴシック", sans-serif;    
    color: white;
    background-color: #564E9E;
    border-radius: 3px;
    margin: 0 0.2em;
}

.load_items .div_1 table{
    width: 95%;
    margin: 0 auto;
}

.load_items .div_1 .table_1 th{
    width: 17%;
    font-family: "ＭＳ Ｐゴシック", "sans-serif";
    font-weight: bold;
}

/*一括発注*/
.load_items .div_1 .table_1 tr:last-of-type th{
    font-weight: normal;
    color: #585A67;
    text-decoration: underline;
}

.load_items .div_1 .table_1 tr:last-of-type td a{
    margin-left: 3em;
}

/*検索項目*/
.load_items .div_1 .table_2 .tr_1 th{
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: left;
    font-size: 20px;
    font-weight: bold;
    color: #3D4449;
    background-color: #ECECFF;
    padding-left: 1em;
}

.load_items .div_1 .table_2 th{
    width: 10%;
}

.load_items .div_1 .table_2 td{
    width: calc(50% -10%);
}

/*検索キーを追加*/
.load_items .div_1 .table_3 th{
    width: 17%;
}

.load_items .div_1 .table_3 td > p:first-of-type{
    width: 100%;
    margin-bottom: 1em;
}

.load_items .div_1 .table_3 img{
    width: 100%;
    margin-bottom: 1em;
}

.load_items .div_1 .table_3 div p{
    margin-bottom: 0.5em;
}

.load_items .div_1 .table_3 td ul li{
    width: 100%;
    display: inline-flex;
    align-items: center;
    line-height: 2.5em;
}

/*and*/
.load_items .div_1 .table_3 td ul li:first-of-type::before{
    content: "";
    display: inline-block;
    width: 18%;
    height: 30px;
    background-image: url(cod_img/load_items_and.png);
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 2%;
}

/*or*/
.load_items .div_1 .table_3 td ul li:last-of-type::before{
    content: "";
    display: inline-block;
    width: 18%;
    height: 30px;
    background-image: url(cod_img/load_items_or.png);
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 2%;
}

/**２．商品の選択と追加 load_items div_2 */
.load_items .div_2 > p:first-of-type{
    width: 100%;
    padding-left: 1em;
    margin-bottom: 0.5em;
}

.load_items .div_2 > img:first-of-type{
    width: 80%;
}

.load_items .div_2 table{
    width: 95%;
    margin: 0 auto;
}

.load_items .div_2 table th{
    width: 10%;
}

/*新規商品登録*/
.load_items .div_2 table .tr_1 th{
    font-family: "ＭＳ Ｐゴシック", "sans-serif";
    color: #585A67;
    text-decoration: underline;
}

/*摘要、メモボタン*/
.load_items .div_2 table .tr_2 th span{
    display: inline-block;
    width: 6em;
    height: 35px;
    line-height: 35px;
    text-align: center;
    letter-spacing: 0.15em;
    font-family: "ＭＳ Ｐゴシック", sans-serif;    
    color: white;
    background-color: #564E9E;
    border-radius: 3px;
}

.load_items .div_2 table .tr_2 th span:first-of-type{
    margin-bottom: 0.5em;
}

.load_items .div_2 table .tr_2 td div p{
    margin-bottom: 0.5em;
}

/*img:クリックすると商品リストに入力欄が追加されます。*/
img[data-original="../../4-inventory/4-3-002/cod_img/load_items_5.png"]{
    width: 90%;
    margin-bottom: 1.5em;
}

.load_items .div_2 table .tr_2 td .div_flex{
    width: 100%;
}

.load_items .div_2 table .tr_2 td .div_flex p{
    width: 30%;
}

/*img:PDFで出力した際、メモは表示されません。*/
img[data-original="../../4-inventory/4-3-002/cod_img/load_items_5_pdf.png"]{
    width: 65%;
    margin: 0;
}

/*//一括発注 bulk_order*/
.bulk_order div{
    width: 95%;
    margin: 0 auto;
}

/*商品絞込ボタン*/
.bulk_order .div_1 span{
    display: inline-block;
    width: 6em;
    height: 35px;
    line-height: 35px;
    text-align: center;
    letter-spacing: 0.2em;
    font-family: "ＭＳ Ｐゴシック", sans-serif;
    color: white;
    background-color: #564E9E;
    border-radius: 3px;
    margin: 0 0.2em;
}

.bulk_order .div_1 img{
    width: 65%;
}

/*発注画面へ反映ボタン*/
.bulk_order .div_2 span{
    display: inline-block;
    width: 10em;
    height: 35px;
    line-height: 35px;
    text-align: center;
    letter-spacing: 0.2em;
    font-family: "ＭＳ Ｐゴシック", sans-serif;
    color: white;
    background-color: #564E9E;
    border-radius: 3px;
    margin: 0 0.2em;
}

/*img:発注商品のリストに追加する商品にチェックを入れます。*/
.bulk_order .div_2 img[data-original="../../4-inventory/4-3-002/cod_img/bulk_order_2.png"]{
    width: 60%;
    margin-bottom: 3em;
}

.bulk_order .div_2 p:last-of-type{
    margin-bottom: 0.5em;
}

/*img:選択した商品がリストに追加されます。*/
img[data-original="../../4-inventory/4-3-002/cod_img/bulk_order_3.png"]{
    width: 75%;
}