/*+在庫情報：部門集計CSS*/
table,ul li{
    color: black;
    padding: 0;
    margin: 0;
}

ul{
    padding: 0;
    margin: 0;
}

table{
    height: fit-content;
}

table .div_flex{
    width: 100%;
}

/*+部門集計*/
/*+検索条件*/
/*img部門集計検索条件指定画面*/
#img_department_aggregation{
    max-width: 841px;
    width: 100%;
}

/**検索条件　各項目 specify_condition*/
.specify_condition th{
    width: 12%;
}

/*==店舗コード specify_condition shop_code*/
.specify_condition .shop_code p{
    width: 100%;
    margin-bottom: 0.5em;
}

.specify_condition .shop_code .div_flex{
    width: 98%;
    align-items: flex-start;/*並べてる要素の上端を揃える*/
    gap: 0;
    margin-bottom: 1em;
}

.specify_condition .shop_code .div_flex .div_1{
    flex:1;
}

/*shop_code_1の位置*/
.specify_condition .shop_code .div_flex .div_1 .d_1{
    display:flex;
    justify-content:flex-end;
}

/*img「店舗範囲指定」を選択 id:img_shop_code_1*/
#img_shop_code_1{
    width: 100%;
    max-width: 278px; /*pxやremで指定で画面比のズレ防止 */
    height: auto;
    margin: 0;
}

/*店舗コードの範囲を指定 1店舗に限定 */
.specify_condition .shop_code .div_flex .div_1 .d_2{
    width: 95%;
    border: 1px solid #D8DCDE;
    background-color: #F9F9FF;
    padding-bottom: 0.5em;
    margin-top: 2em;
}

.specify_condition .shop_code .div_flex .div_1 .d_2 figure{
    width: 95%;
    margin: 0 auto
}

.specify_condition .shop_code .div_flex .div_1 .d_2 figcaption{
    font-size: unset;
    font-weight: 400;
}

/*figcaption左丸*/
.specify_condition .shop_code .div_flex .div_1 .d_2 figcaption::before{
    content: "●";
    display: inline-block;
    font-size: 20px;
}

.specify_condition .shop_code .div_flex .div_1 .d_2 figure:first-of-type{
    margin-bottom: 0.5em;
}


.specify_condition .shop_code .div_flex .div_1 .d_2 img{
    width: 466px;
    max-width: 100%;
    height: auto;
}

/*プルダウンメニューから店舗を選択 id:img_shop_code_2*/
#img_shop_code_2{
    width: 100%;
    max-width: 482px;/*pxやremで指定で画面比のズレ防止 */
    height: auto;
    margin-left:0;
}

/*==集計分類 aggregation_category*/
.specify_condition .aggregation_category .div_flex{
    margin: 0.5em auto;
}

.specify_condition .aggregation_category .div_flex p{
    flex: 0.94;
}

.specify_condition .aggregation_category .div_flex img{
    max-width: 304px;
    width: 100%;
}

/*==分類指定 category_selection*/
.specify_condition .category_selection p{
    margin-bottom: 0.5em;
}
.specify_condition .category_selection ul{
    width: 90%;
    margin: 0 auto;
}

.specify_condition .category_selection ul li{
    display: flex;
    align-items: center;
    line-height: 2em;
}

.specify_condition .category_selection ul li .spa_1{
    display: inline-block;
    width: 8em;
    font-family: "ＭＳ Ｐゴシック", sans-serif;
    text-align: right;
}

.specify_condition .category_selection ul li .spa_2{
    flex: 1;
}

/*==仕入値選択 purch_price_select*/
.specify_condition .purch_price_select p{
    margin-bottom: 0.5em;
}

.specify_condition .purch_price_select .div_flex{
    margin-bottom: 0.5em;
}

.specify_condition .purch_price_select table{
    flex: 0.8;
    font-size: 14px;
}

.specify_condition .purch_price_select table th{
    width: 9em;
    background-color: #FAFAFA;
}

.specify_condition .purch_price_select img{
    max-width: 305px;
    width: 100%;
}

/*==在庫計算金額 calc_inv_val*/
.specify_condition .calc_inv_val p{
    margin-bottom: 0.5em;
}

.specify_condition .calc_inv_val .div_flex{
    margin-bottom: 0.5em;
}

.specify_condition .calc_inv_val table{
    flex: 0.8;
    font-size: 14px;
}

.specify_condition .calc_inv_val table th{
    width: 9em;
    background-color: #FAFAFA;
}

.specify_condition .calc_inv_val img{
    max-width: 317px;
    width: 100%;
}

/*==売値選択 select_selling_price*/
.specify_condition .select_selling_price p{
    margin-bottom: 0.5em;
}

.specify_condition .select_selling_price .div_flex{
    margin-bottom: 0.5em;
}

.specify_condition .select_selling_price table{
    flex: 0.787;
    font-size: 14px;
}

.specify_condition .select_selling_price table th{
    width: 9em;
    background-color: #FAFAFA;
}

.specify_condition .select_selling_price img{
    max-width: 304px;
    width: 100%;
}

/*==CSVダウンロード download*/
.specify_condition .download .div_flex{
    margin-bottom: 0.5em;
}

.specify_condition .download p{
    flex: 0.9;
}

.specify_condition .download img{
    max-width: 438px;
    width: 100%;
}

/*+集計結果一覧*/
/*画像は集計分類で「部門」を選択した場合の表示例です。*/
.com_h2 .div_flex{
    width: 97%;
    align-items: center;
    gap: 1em;    
    margin: 0;
}

.com_h2 .spa_1{
    flex: 0 0 auto;/*サイズ固定*/
}

.com_h2 .spa_2{
    display: inline-block;
    font-size: 15px;
    font-weight: 400;
    color: black;
    flex: 1 1 auto;/*残りの幅を使用*/
    text-align: right;
    white-space: normal;/*折り返しを可能に */
    overflow-wrap: anywhere;/*長い文字列も折り返す */    
}

.com_h2 .spa_2 a{
    color: #3747c2;
}

.com_h2 .spa_2 a:hover{
    color: #72dbfa;
}

/*//集計結果一覧画像 img_div*/
.img_div h3{
    font-size: 18px;
    color: black;
    margin: 0;
}

.img_div h4{
    font-size: unset;
    font-weight: 400;
    color: black;
    margin: 0;
}

/*h4左丸*/
.img_div h4::before{
    content: "●";
    display: inline-block;
    font-size: 20px;
}

.img_div h4 span{
    display: inline-block;
    font-family: "ＭＳ Ｐゴシック", sans-serif;
}

.img_div .div_flex div{
    width: 49%;
}

.img_div .div_flex div .img_zoom{
    width: 97%;
    margin: 0
}

/*拡大画像（枠線不要）*/
.img_div .img_zoom {
    display: block;
    border: none;
    box-shadow: none;
}

.img_div .img_zoom:hover {
    outline: 2px solid #78D1F3;/*outlineじゃないとhoverした瞬間に2px分カクカクする*/
    box-shadow: none;
}

/**一覧　各項目 details_list_1 details_list_2*/
.details_list_1 th,
.details_list_2 th{
    width: 12%;
}

/*//合計 details_list_1*/
.details_list_1 .th_1{
    font-family: "ＭＳ Ｐゴシック", sans-serif;
    font-weight: 900;
    background-color: #E1EFFB;
}

.details_list_1 .th_2{
    background-color: #FAFAFA;
}

/*//店舗No～在庫金額(税抜) details_list_2*/
/*不要なborder*/
.details_list_2 tr:first-of-type th,
.details_list_2 tr:first-of-type td{
    border-top: none;
}

/*==分類Ｎｏ category_no*/
.details_list_2 .category_no .spa_1{
    font-family: "ＭＳ Ｐゴシック", sans-serif;
}

/*==分類名 category_name*/
.details_list_2 .category_name .spa_1{
    font-family: "ＭＳ Ｐゴシック", sans-serif;
}