/*+各種マスタ：商品区分「大」マスタCSS*/

/** 新規登録 new*/
.new .div_flex{
    width: 95%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto ;
}

.new .div_flex p{
    width: 45%;
}

/*登録ボタン*/
.new .div_flex p span{
    display: inline-block;
    width: 4em;
    height: 28px;
    line-height: 28px;
    font-family: "ＭＳ Ｐゴシック", sans-serif;
    font-weight: bold;
    text-align: center;
    background-color: #EFEFEF;
    border: 1px solid #767676;
    border-radius: 3px;
    margin: 0 0.3em;
}

.new .div_flex:first-of-type div{
    width: 53%;
    text-align: center;
}

.new .div_flex:first-of-type div img:first-of-type{
    width: 100%;
    margin-right: 0;
    margin-bottom: 1em;
}

/*登録完了メッセージ*/
.new .div_flex:first-of-type div img:last-of-type{
    display: inline-block;
    width: 70%;
    height: fit-content;
    border: 5px solid #F4DED3;
    border-radius: 20px;
}

/*エラーメッセージ*/
img[data-original="../../7-other_master/7-2-006/img/new_3.png"]{
    display: inline-block;
    width: 37%;
    height: fit-content;
    border: 5px solid #F4DED3;
    border-radius: 20px;
    margin-left: 10%;
}

/*+一覧の表示・更新 item_type*/
/**商品区分名の変更 item_type div_1*/
.item_type .div_1 table{
    width: 90%;
    margin: 0 auto;
}

.item_type .div_1 table th{
    width: 17.75%;
    padding: 0.2em 0;
}

.item_type .div_1 .div_flex{
    width: 95%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}

.item_type .div_1 .div_flex div{
    width: 45%;
    margin-left: 1em;
}

.item_type .div_1 .div_flex div:first-of-type p:last-of-type{
    margin-top: 2em;
}

/*登録ボタン*/
.item_type .div_1 .div_flex span{
    display: inline-block;
    width: fit-content;
    height: 35px;
    display: inline-flex;/*普通のflex妥当ロック要素扱いになる**/
    justify-content: space-between;
    align-items: end;
}

.item_type .div_1 .div_flex span::after{
    content: "";
    display: inline-block;
    width: 80px;
    height: 45px;
    background-image: url(img/item_type_button_1.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom;
    margin: 0 0.3em;
}

/*画像*/
.item_type .div_1 .div_flex div:last-of-type{
    width: 49.7%;
    text-align: center;
    margin-right: 3%;
}

img[data-original="../../7-other_master/7-2-006/img/item_type_1.png"]{
    width: 100%;
    margin: 0;
}

/*更新メッセージ*/
img[data-original="../../7-other_master/7-2-006/img/item_type_2.png"]{
    display: inline-block;
    width: 74%;
    height: fit-content;
    border: 5px solid #F4DED3;
    border-radius: 20px;
    margin-top: 1em;
}

/**登録データの削除 item_type div_2*/
.item_type .div_2 .div_flex{
    width: 95%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}

.item_type .div_2 .div_flex p{
    width: 45%;
    height: fit-content;
    margin-left: 1em;
}

/*削除ボタン*/
.item_type .div_2 .div_flex span{
    display: inline-block;
    width: fit-content;
    height: 35px;
    display: inline-flex;/*普通のflexだとブロック要素扱いになる**/
    justify-content: space-between;
    align-items: end;
}

.item_type .div_2 .div_flex span::after{
    content: "";
    display: inline-block;
    width: 80px;
    height: 45px;
    background-image: url(img/item_type_button_2.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom;
    margin: 0 0.3em;
}

/*画像*/
.item_type .div_2 .div_flex div{
    width: 49.7%;
    text-align: center;
    margin-right: 3%;
}

img[data-original="../../7-other_master/7-2-006/img/item_type_3.png"]{
    width: 100%;
    margin: 0 ;
}

/*削除メッセージ*/
img[data-original="../../7-other_master/7-2-006/img/item_type_4.png"]{
    display: inline-block;
    width: 74%;
    height: fit-content;
    border: 5px solid #F4DED3;
    border-radius: 20px;
    margin-top: 1em;
}

/*+リスト登録（表）item_type_list*/
.item_type_list .p_1{
    padding-left: 1em;
    margin-bottom: 2em;
}

/*h4左丸*/
.item_type_list h4{
    width: 100%;
    font-weight: normal;
    color: black;
    padding-left: 1em;
    margin-bottom: 0.5em;
}

.item_type_list h4::before{
    content: "●";
    display: inline-block;
    font-size: 20px;
}

/*//コピーして貼り付け item_type_list div_1*/
.item_type_list .div_1{
    width: 95%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}

.item_type_list .div_1 div:first-of-type{
    width: 40%;
    height: 400px;
    text-align: center;
}

.item_type_list .div_1 div:last-of-type{
    width: 47%;
}

.item_type_list .div_1 .arrow{
    display: inline-block;
    width: 5%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 5%;
}

.item_type_list .div_1 .arrow::before{
    content: "→";
    display: inline-block;
    font-size: 55px;
    font-weight: bold;
    color: black;
}

/*画像*/
img[data-original="../../7-other_master/7-2-006/img/item_type_list_1.png"]{
    width: 70%;
    height: 93%;
    border: 1px solid #DDE1E3;
    border-bottom: none;

}
img[data-original="../../7-other_master/7-2-006/img/item_type_list_2.png"]{
    width: 100%;
}

/*//リストの新規登録 item_type_list div_2*/
.item_type_list .div_2 .p_1{
    width: 100%;
    padding-left: 3em;
}

/*新規登録ボタン*/
.item_type_list .div_2 .p_1 span{
    display: inline-block;
    width: 17.8%;
    height: 35px;
    line-height: 40px;
    display: inline-flex;
}

.item_type_list .div_2 .p_1 span::after{
    content: "";
    display: inline-block;
    width: 120px;
    height: 45px;
    background-image: url(img/item_type_list_button.png);
    background-repeat: no-repeat;
    background-size: contain;
    margin: 0 0.3em;
}

.item_type_list .div_2 .div_flex{
    width: 95%;
    display: flex;
    align-items: center;
    margin: 0 auto;
}

/*画像*/
.item_type_list .div_2 img{
    height: fit-content;
    margin: 0;
}

img[data-original="../../7-other_master/7-2-006/img/item_type_list_3.png"]{
    width: 23%;
}

img[data-original="../../7-other_master/7-2-006/img/item_type_list_4.png"]{
    width: 32%;
    border: 5px solid #F4DED3;
    border-radius: 20px;
}

img[data-original="../../7-other_master/7-2-006/img/item_type_list_5.png"]{
    width: 38%;
}

/*右矢印*/
.item_type_list .div_2 .arrow{
    display: inline-block;
    width: 3em;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.item_type_list .div_2 .arrow::before{
    content: "→";
    display: inline-block;
    font-size: 30px;
    font-weight: bold;
    color: black;
}