/*+日別・月別売上詳細画面（日報）CSS*/
table,ul{
    margin: 0;
}

ul li{
    padding-left: 0;
}

table .div_flex{
    width: 100%;
}

.button{
    all: unset;/*main.css打ち消し*/
}

/*+h1:日別・月別売上詳細画面（日報）*/
.spa_h1 span:last-of-type{
    display: inline-block;
    width: 100%;
    font-size: 15px;
    text-align: right;
    margin-top: 0.5em;
}

.specify_condition table th{
    width: 12%;
}

/**条件指定　各項目 specify_condition table_1 table_2*/
.specify_condition .table_1 h3{
    font-size: unset;
    font-weight: normal;
    margin: 0;
}

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

/*==指定期間 specify_condition table_1 period*/
.specify_condition .table_1 .period td p{
    width: 100%;
    margin-bottom: 0.5em;
}

.specify_condition .table_1 .period td .div_flex{
    justify-content: space-between;
}

.specify_condition .table_1 .period td .div_flex div{
    width: 49%;
    margin-bottom: 0.5em;
}

.specify_condition .table_1 .period td .div_flex div img{
    width: 50%;
    margin-left: 3em;
}

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

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

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

/*shop_code_1の位置*/
.specify_condition .table_1 .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: 373px; /*pxやremで指定で画面比のズレ防止 */
    height: auto;
    margin: 0;
}

/*複数店舗選択 1店舗に限定 */
.specify_condition .table_1 .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 .table_1 .shop_code .div_flex .div_1 .d_2 h3{
    width: 95%;
    margin: 0 auto
}

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

/*※店舗コードを1店舗に限定して検索した場合のみ specify_condition table_1 shop_code div_2*/
.specify_condition .table_1 .shop_code .div_2 p{
    width: 54%;
    padding-right: 1em;
}

.specify_condition .table_1 .shop_code .div_2 img{
    flex: 1;
}

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

/*ボタン（共通）*/
.button{
    display: inline-block;
    height: 25px;
    line-height: 29px;
    text-align: center;
    font-size: 15px;
    font-family: "ＭＳ Ｐゴシック", sans-serif;
    background-color: #EFEFEF;
    border: 1px solid #767676;
    border-radius: 3px;
}

.button:hover{
    background-color: #E5E5E5;
}

/*ボタン：実行*/
.b_execute{
    width: 5em;
    height: 30px;
    line-height: 30px;
    margin-right: 0.3em;
}

/*ボタン：在庫一覧*/
.specify_condition .b_stock_list{
    width: 6em;
    margin: 0 0.3em;
}

.specify_condition .table_1 .shop_code .div_2 .img_zoom{
    width: 47%;
    height: fit-content;
    box-shadow: none;
    margin: 0;
}

/*==グループ検索　ｸﾞﾙｰﾌﾟｺｰﾄﾞ specify_condition table_1 group_search*/
.specify_condition .table_1 .group_search p{
    width: 100%;
    margin-bottom: 0.5em;
}

.specify_condition .table_1 .group_search .div_flex{
    width: 95%;
    align-items: flex-start;/*並べてる要素の上端を揃える*/
    gap: 0;
}

.specify_condition .table_1 .group_search .div_flex .div_1{
    flex:1;
}

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

/*imgグループ検索「しない」を選択 id:img_group_search_1*/
#img_group_search_1{
    width: 100%;
    max-width: 373px; /*pxやremで指定で画面比のズレ防止 */
    height: auto;
    margin: 0;
}

/*ｸﾞﾙｰﾌﾟｺｰﾄﾞ group_code */
.specify_condition .table_1 .group_search .div_flex .div_1 .group_code{
    width: 95%;
    padding-bottom: 1em;
    margin-top: 2em;
    margin-bottom: 1em;
}

.specify_condition .table_1 .group_search .group_code h3::before{
    content: none;
}

.specify_condition .table_1 .group_search .group_code .com_h5{
    height: 30px;
    line-height: 30px;
    font-weight: normal;
}

.specify_condition .table_1 .group_search .div_flex .div_1 .group_code p{
    width: 95%;
    margin: 0.5em auto;
}

.specify_condition .table_1 .group_search .div_flex .div_1 .group_code img{
    width: 468px;
    max-width: 100%;
    height: auto;
}

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

/*クリックで画像を表示*/
.specify_condition .table_1 .group_search .group_code p .open_modal{
    display: inline-block;
    color: #3747c2;
    transition: color 0.3s ease, opacity 0.3s ease;    
}

.specify_condition .table_1 .group_search .group_code p .open_modal:hover{
    color: #72dbfa;
    opacity: 0.7;
}


/*==表示方式 specify_condition table_1 display_format*/
.specify_condition .table_1 .display_format p{
    width: 100%;
    margin-bottom: 0.5em;
}

.specify_condition .table_1 .display_format ul{
    width: 95%;
    margin: 0 auto;
    margin-bottom: 0.5em;
}

.specify_condition .table_1 .display_format ul li{
    width: 85%;
    display: flex;
}

.specify_condition .table_1 .display_format ul li:first-of-type{
    height: 35px;
    line-height: 35px;
}

.specify_condition .table_1 .display_format ul li span{
    display: inline-block;
}

.specify_condition .table_1 .display_format ul li .spa_1{
    width: 6em;
    text-align: center;
}

.specify_condition .table_1 .display_format ul li .spa_1::before{
    content: "・";
    font-weight: bold;
}

.specify_condition .table_1 .display_format ul li .spa_2{
    /*width: calc(100% - 6em);*/
    flex: 1;
}

/*・・・*/
.specify_condition .table_1 .display_format ul li .spa_2::before{
    content: "・・・";
    width: 4em;
    display: inline-block;
    text-align: center;
}

.specify_condition .table_1 .display_format ul li .spa_3{
    width: 100%;
    padding-left: 4em;
}


.specify_condition .table_1 .display_format ul li .spa_3 a{
    font-size: inherit;
}

/*==金額方式 specify_condition table_1 amount_method*/

/*==仕入金額 specify_condition table_1 purchase_amount*/
.specify_condition .table_1 .purchase_amount td p{
    width: 100%;
    margin-bottom: 0.5em;
}

.specify_condition .table_1 .purchase_amount td ul{
    width: 85%;
    padding: 0;
    margin-left: 8%;
}

.specify_condition .table_1 .purchase_amount td ul li{
    width: 100%;
    display: flex;
}

.specify_condition .table_1 .purchase_amount td ul li .spa_1{
    width: 3em;
}

.specify_condition .table_1 .purchase_amount td ul li img{
    width: 50%;
    margin: 0;
}

.specify_condition .table_1 .purchase_amount td ul li .spa_2{
    display: inline-block;
    flex: 1;
    margin-bottom: 0.5em;
}

/*・・・*/
.specify_condition .table_1 .purchase_amount td ul li .spa_2::before{
    content: "・・・";
    width: 4em;
    display: inline-block;
    text-align: center;
}

/***表示項目　データダウンロード specify_condition table_2*/
.specify_condition .table_2 tr:first-of-type > th:not(.in_table_2 th),
.specify_condition .table_2 tr:first-of-type > td:not(.in_table_2 td){
    border-top: none;
}

/*//表示項目 specify_condition table_2 display_item */
.specify_condition .table_2 .display_item > td{
    padding: 0;
}

/*不要なborder*/
.specify_condition .table_2 .display_item .in_table_2 tr:first-of-type th,
.specify_condition .table_2 .display_item .in_table_2 tr:first-of-type td{
    border-top: none;
}

.specify_condition .table_2 .display_item .in_table_2 th{
    border-left: none;
}

.specify_condition .table_2 .display_item .in_table_2 td{
    border-right: none;
}

.specify_condition .table_2 .display_item .in_table_2 tr:last-of-type th,
.specify_condition .table_2 .display_item .in_table_2 tr:last-of-type td{
    border-bottom: none;
}

.specify_condition .table_2 .display_item .in_table_2 th{
    background-color: #FAFAFA;
    font-family: "ＭＳ Ｐゴシック", sans-serif;
    font-weight: bold;
}

.specify_condition .table_2 .display_item .in_table_2 th,
.specify_condition .table_2 .display_item .in_table_2 td,
.specify_condition .table_2 .display_item .in_table_2 td p{
    font-size: 15px;
}

/*==日報指定期間日数 specify_condition table_2 in_table_2 daily_report_days*/
.specify_condition .table_2 .in_table_2 .daily_report_days td p{
    width: 48%;
}

.specify_condition .table_2 .in_table_2 .daily_report_days td .img_zoom{
    width: 51%;
    margin-left: 1%;
}

/*__拡大画像*/
.specify_condition .table_2 .in_table_2 .daily_report_days td .img_zoom{
    box-shadow: none;
}

/*==データダウンロード specify_condition table_2 download*/
.specify_condition .table_2 .download td img{
    width: 40%;
    margin: 0 0 0 auto;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

/*+集計結果一覧（日報）*/
/*集計結果一覧（日報）の画像配置*/
.img_details_list img{
    width: 65%;
}

/*集計結果一覧（日報）1 id:img_details_list_1*/
#img_details_list_1{
    margin-left: 0;
}

/*集計結果一覧（日報）2 id:img=details_list_2*/
#img_details_list_2{
    margin: 0 0 0 auto;
}

/**集計結果の表示切替 display_switch*/
/*aの装飾打ち消し*/
.display_switch th a,
.display_switch .button_list a{
    all: unset;
}

.display_switch th a:hover,
.display_switch .button_list a:hover{
    color: inherit;
}

/*==ボタン一覧 display_switch button_list*/
.display_switch .button_list td ul{
    width: 50%;
    display: flex;
    justify-content: space-around;
    padding: 0;
    margin: 0.5em auto;
}

/*ボタン：全体*/
.display_switch .b_daily_report{
    width: 4em;
}

/*ボタン：曜日・時間別*/
.display_switch .b_by_day_time{
    width: 6.5em;
    text-align: right;
    padding-right: 0.1em;
}

/*ボタン：売上一覧*/
.display_switch .b_sales_list{
    width: 6em;
}

/*ボタン：商品ベスト*/
.display_switch .b_best_product{
    width: 5.3em;
    text-align: right;
    padding-right: 0.2em;
}

/*ボタン：在庫一覧*/
.display_switch .b_stock_list{
    width: 6em;
}

.display_switch th{
    width: 10%;
    padding-top: 0.3em;
    padding-bottom: 0.2em;
}

/**一覧　各項目 details_list*/
.details_list .com_h4{
    border: 1px solid #D8DCDE;
    border-bottom: none;
    margin-bottom: 0;
}

.details_list table th{
    width: 10%;
}

.details_list table td{
    width: 40%;/*50% - 10%*/
    font-size: 15px;
}

.details_list table td p{
    font-size: 15px;

}

/*//合計・平均 details_list table_1*/


/*//日別データ details_list table_2*/
.table_2 .com_h5_th{
    border-top: none;
}

/*==日付 details_list table_2 tgt_date*/
.details_list .table_2 .tgt_date td span{
    color: red;
}