
.div_flex {
    gap: 30px;
}
/*+伝票・明細情報：売上明細CSS*/
/**設定リセット*/
button,
button:hover{
    all: unset;
    color: black;
}


/*+表示条件*/
/**商品区分大・中・小 item_category*/
.item_category > p:first-of-type{
    width: 100%;
    padding-left: 1em;
    margin-bottom: 1em;
}

/*＋*/
.item_category > p:first-of-type span{
    display: inline-flex;
    width: 7%;
    height: 35px;
    line-height: 35px;
    justify-content: space-between;
    vertical-align: middle;
    margin-left: 0.3em;
}

.item_category > p:first-of-type span::before{
    content: "";
    display: inline-block;
    width: 3em;
    height: 27px;
    background-image: url(img/plus.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom;
}

.item_category .div_flex{
    width: 95%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}

.item_category table{
    width: 50%;
    height: fit-content;
}

.item_category table th{
    width: 25%;
    padding: 0.5em 0;
}

.item_category table th img{
    margin: 0 auto;
}

/*ALL*/
.item_category table tr:last-of-type th{
    font-size: 18px;
    font-weight: 900;
    letter-spacing: 0.3em;
}

/*右側の画像*/
.item_category img:last-of-type{
    height: fit-content;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

/**部門(BCPOS) category_bcpos*/
.category_bcpos > p:first-of-type{
    width: 100%;
    padding-left: 1em;
    margin-bottom: 1em;
}

/*＋*/
.category_bcpos > p:first-of-type span{
    display: inline-flex;
    width: 7%;
    height: 35px;
    line-height: 35px;
    justify-content: space-between;
    vertical-align: middle;
    margin-left: 0.3em;
}

.category_bcpos > p:first-of-type span::before{
    content: "";
    display: inline-block;
    width: 3em;
    height: 27px;
    background-image: url(img/plus.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom;
}

.category_bcpos .div_flex{
    width: 95%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}

.category_bcpos table{
    width: 50%;
    height: fit-content;
}

.category_bcpos table th{
    width: 25%;
    padding: 0.5em 0;
}

.category_bcpos table th img{
    margin: 0 auto;
}

/*ALL*/
.category_bcpos table tr:last-of-type th{
    font-size: 18px;
    font-weight: 900;
    letter-spacing: 0.3em;
}

/*右側の画像*/
.category_bcpos img:last-of-type{
    height: fit-content;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

/**処理種別 transaction_type*/
.transaction_type .div_flex{
    width: 95%;
    display: flex;
    margin: 0 auto;
}

.transaction_type .div_1,
.transaction_type .div_2{
    width: 50%;
}

.transaction_type p{
    text-align: center;
}

.transaction_type .div_1 img,
.transaction_type .div_2 img{
    width: 67%;
}

/**消費税 consumption_tax*/
.consumption_tax .div_flex{
    width: 95%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}

.consumption_tax p{
    width: 50%;
}

.consumption_tax img{
    width: 35%;
    height: fit-content;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
/**店舗別情報 select_store*/
.select_store .div_flex{
    width: 95%;
}
.select_store .div_flex_left,
.select_store .div_flex_right{
    width: 50%;
}
.select_store table {
    width: auto;
}
.select_store table th {
    width: 25%;
    padding: 0.5em 0;
}
.select_store .div_flex_right img{
    width: 70%;
    height: fit-content;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
/*＋*/
.select_store p:first-of-type span {
    display: inline-flex;
    width: auto;
    height: 35px;
    align-items: center;
    justify-content: space-between;
    vertical-align: middle;
    margin-left: 0.3em;
}

.select_store p:first-of-type span::before {
    content: "";
    display: inline-block;
    width: 3em;
    height: 27px;
    background-image: url(img/plus.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom;
}
/**商品名・コード item_name_code*/
.item_name_code{
    position: relative;
}

.item_name_code .div_flex{
    width: 95%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}

.item_name_code p{
    width: 50%;
}

.item_name_code img{
    width: 35%;
    height: fit-content;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.item_name_code .table_flex{
    width: 52%;
    justify-content: space-between;
    font-size: 15px;
    position: absolute;
    top: 37%;
    left: 2.5%;
}

/*歯ブラシ*/
.item_name_code .table_1{
    width: 35%;
}

.item_name_code .table_1 .tr_1 th{
    background-color: #ececff;
    padding: 0.3em 0;
}

.item_name_code .table_1 .tr_2 th{
    text-align: left;
    font-weight: bold;
    background-color: white;
    padding-left: 1em;
}

.item_name_code .table_1 .tr_3 th,
.item_name_code .table_1 .tr_4 th{
    width: 17.75%;
    padding: 0;
}

.item_name_code .table_1 img{
    width: 70%;
}

.item_name_code .table_1 ul{
    margin: 0;
}

/*◯*/
.item_name_code .table_1 .maru::before{
    content: "◯";
    font-size: 20px;
    font-weight: 900;
    color: #FF0000;
    margin-right: 0.3em;
}

/*✕*/
.item_name_code .table_1 .batsu::before{
    content: "✕";
    font-size: 20px;
    font-weight: 900;
    color: #0084FF;
    margin-right: 0.4em;
}

/*前方～完全*/
.item_name_code .table_2{
    width: 63%;
    height: fit-content;
}

.item_name_code .table_2 th{
    width: 4em;
}

/*+売上明細 sales_details*/
/*//上部リンク nav_list*/
.nav_list ul{
    width: 100%;
    display: flex;
    justify-content: space-around;
    color: black;
    padding: 0;
    margin: 2em auto;
}

.nav_list ul li{
    width: 8em;
    height: 33px;
    line-height: 33px;
    text-align: center;
    letter-spacing: 0.15em;
    color: white;
    background-color: #585A67;
    border-radius: 5px;
    padding: 0 0.5em;
}

.nav_list p{
    width: 100%;
    padding-left: 1em;
}

/*//パネルに検索条件を表示 on_panel*/
.on_panel{
    width: 100%;
}

.on_panel p:first-of-type{
    width: 100%;
    padding: 0 1em;
    margin-bottom: 1em;
}

.on_panel p:last-of-type{
    width: 100%;
    font-size: 20px;
    font-weight: bold;
    padding-left:2em;
}

/*p左チェックボックス*/
.on_panel p:last-of-type::before{
    content: "";
    display: inline-block;
    width: 19px;
    height: 19px;
    background-image: url(../common_img/check_on.png);
    background-repeat: no-repeat;
    background-size: contain;
    margin-right: 0.5em;
}

/*店舗、グループ表示*/
.on_panel .div_flex{
    width: 100%;
    display: flex;
    margin: 0 auto;
}

.on_panel .div_flex div{
    width: 50%;
}

.on_panel h4{
    all: unset;
    color: black;
    padding-left: 3em;
}

/*h4左丸*/
.on_panel h4::before{
    content: "●";
    display: inline-block;
    font-size: 20px;
}

img[data-original="../../2-sales_details/2-1-002/img/on_panel_1.png"]{
    width: 40%;
    margin-left: 5%;
}

.on_panel .div_flex div img{
    width: 80%;
}


/**画像 sales_details div_1*/
.sales_details .div_1 .div_flex{
    width: 95%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}

.sales_details .div_1 img{
    width: 70%;
    border-bottom: none;
}

/**売上明細一覧 sales_details div_2*/
.sales_details .div_2 p{
    width: 100%;
    padding-left: 1em;
    margin-bottom: 1em;
}

.sales_details .div_2 img{
    border-right: 1px solid #DDE1E3;
    border-left: 1px solid #DDE1E3;    
}
