/*+売上管理 ー 商品券・チケット別CSS*/
table,ul{
    color: black;
    margin: 0;
}

ul li{
    padding: 0;
}

h4{
    font-weight: normal;
    color: black;
    margin-bottom: 0;
}

/*img: 売上管理の商品券・チケット別画面*/
img[data-original="../../1-sales/1-1-001/bv_img/by_voucher_1.png"]{
    width: 65%;
}

/**検索条件 各項目 by_voucher table*/
/*==指定期間 by_voucher table date_range*/
.by_voucher table .date_range th{
    width: 13%;
}

.by_voucher table .date_range td .div_flex{
    width: 100%;
    justify-content: space-between;
    margin: 0.5em auto;
}

.by_voucher table .date_range td .div_flex .d_1{
    width: 58%;
}

.by_voucher table .date_range td .div_flex .d_1 p{
    width: 100%;
    margin-bottom: 1em;
}

/*h3左丸*/
.by_voucher table .date_range td h3{
    all: unset;
}

.by_voucher table .date_range td h3::before{
    content: "●";
    display: inline-block;
    font-size: 20px;
}

.by_voucher table .date_range td .d_2{
    width: 95%;
    margin: 0 auto;
}

.by_voucher table .date_range td .d_2:first-of-type{
    margin-bottom: 1em;
}

.by_voucher table .date_range td .d_2 .img_flex{
    width: 50%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-left: 3%;
    position: relative;/*.by_voucher table .date_range td .d_2 .img_flex::beforeの親*/
}

/*～*/
.by_voucher table .date_range td .d_2 .img_flex::before{
    content: "～";
    display: inline-block;
    font-size: 20px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.by_voucher table .date_range td .d_2 .img_flex img{
    width: 39%;
    margin: 0;
}

/*img: 一覧に表示する日付の範囲を指定します。*/
img[data-original="../../1-sales/1-1-001/bv_img/by_voucher_date_range_1.png"]{
    width: 37%;
}

/*==店舗コード by_voucher table store_code*/
.by_voucher table .store_code th{
    width: 13%;
}

.by_voucher table .store_code td .div_flex{
    width: 100%;
    justify-content: space-between;
    margin: 0.5em auto 1em;
}

.by_voucher table .store_code td .div_flex .d_1{
    width: 58%;
}

.by_voucher table .store_code td .div_flex .d_1 p{
    width: 100%;
    margin-bottom: 1em;
}

/*h3左丸*/
.by_voucher table .store_code td h3{
    all: unset;
}

.by_voucher table .store_code td h3::before{
    content: "●";
    display: inline-block;
    font-size: 20px;
}

.by_voucher table .store_code td .d_2{
    width: 95%;
    margin: 0 auto;
}

.by_voucher table .store_code td .d_2:first-of-type{
    margin-bottom: 1em;
}

.by_voucher table .store_code td .d_2 .img_flex{
    width: 75%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-left: 3%;
    position: relative;/*.by_voucher table .date_range td .d_2 .img_flex::beforeの親*/
}

/*～*/
.by_voucher table .store_code td .d_2 .img_flex::before{
    content: "～";
    display: inline-block;
    font-size: 20px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.by_voucher table .store_code td .d_2 .img_flex img{
    width: 44%;
    margin: 0;
}

/*img: 一覧に表示する日付の範囲を指定します。*/
img[data-original="../../1-sales/1-1-001/bv_img/by_voucher_store_code_1.png"]{
    width: 45%;
}

/*==商品券種別 by_voucher table voucher_type*/
.by_voucher table .voucher_type td > p:first-of-type{
    width: 100%;
    margin-bottom: 0.5em;
}

.by_voucher table .voucher_type td ul{
    width: 95%;
    list-style: disc;
    margin: 0 auto;
}

.by_voucher table .voucher_type td ul li .li_flex{
    width: 97%;
    display: flex;
    justify-content: space-between;
    margin: 0.2em 0;
}

.by_voucher table .voucher_type td ul li .spa_1{
    display: inline-flex;
    justify-content: space-between;
    font-family: "ＭＳ Ｐゴシック", sans-serif;
    font-weight: bold;
    width: 16%;
}

/*・・・*/
.by_voucher table .voucher_type td ul li .spa_1::after{
    content: "・・・";
    display: inline-block;
    font-family: initial;/*親のフォントを引き継がない*/
    font-size: 17px;
}

.by_voucher table .voucher_type td ul li .spa_2{
    display: inline-block;
    width: 83%;
}

/*__チケット金額入力画面、チケット金額入力画面について f6_f7 toggle_1*/
/*設定リセット*/
/*main.css labelのチェックボックスを見えなくす*/
input[type="checkbox"]+label:before{
    display: none;
}

/*main.css labelのpadding消す*/
input[type="checkbox"]+label, input[type="radio"]+label{
    padding: 0;
    display: block;/*inline-blockだと見出しの幅が短くなる*/
}

/*線 幅 位置*/
.f6_f7{
    width: 95%;
    padding-bottom: 0;
    margin: 0 auto;
    margin-bottom: 2em;
}

.f6_f7 .com_h5{
    height: 35px;
    line-height: 35px;
    border-bottom: none;
    margin-bottom: 0;
}

/*不足分border*/
.f6_f7 h4{
    font-size: unset;
    position: relative;
}

.f6_f7 h4::before{
    content: "";
    display: inline-block;
    width: 100.05%;
    height: 0;
    border-top: 1px solid #D8DCDE;
    position: absolute;
    bottom: -1px;
    left: -0.05%;
}

/* チェックが入ったら（クリックしたら）開く*/
.toggle_1:checked ~ .div_toggle {
    max-height: 1300px; /* table全体表示 pxじゃないと滑らかに動かない*/
    padding-bottom: 1em;
}

/*メニュー上下の速さ*/
.div_toggle{
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.7s ease-in-out;
}

/* h4をクリック可能にする*/
.label_h4 {
    cursor: pointer;
    display: block;
    width: auto;
}

/* ▼ ▲ の切り替え */
.toggle_1 + .label_h4 h4::after {
    content: " ▼";
    font-size: 25px;
}

.toggle_1:checked + .label_h4 h4::after {
    content: " ▲";
    font-size: 25px;
}

/*__トグルの中身*/
.f6_f7 .div_1{
    padding-top: 0.5em;
    margin-bottom: 1em;
}
.f6_f7 .div_1 p{
    width: 60%;
}

.f6_f7 .div_1 img{
    width: 25%;
}

/*//商品券設定「する」「しない」共通*/
.f6_f7 h5{
    width: 100%;
    font-size: unset;
    font-weight: normal;
    color: black;
    padding-left: 2.5%;
}

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

.f6_f7 .div_2 > img:first-of-type,
.f6_f7 .div_3 > img:first-of-type{
    width: 80%;
    margin: 0.5em auto 1.5em;
}

/*//商品券設定「する」f6_f7 div_2*/
.f6_f7 .div_2{
    margin-bottom: 1.5em;
}

.f6_f7 .div_2 p{
    width: 54%;
}

.f6_f7 .div_2 img{
    width: 45%;
}

/*//商品券設定「しない」f6_f7 div_3*/
.f6_f7 .div_3 p{
    width: 100%;
    padding-left: 2.5%;
    margin-bottom: 0.5em;
}

.f6_f7 .div_3 .div_flex{
    justify-content: space-between;
}

.f6_f7 .div_3 .div_flex div{
    width: 49%;
}

.f6_f7 .div_3 .div_flex div h6{
    font-size: unset;
    font-weight: normal;
}

.f6_f7 .div_3 .div_flex div img{
    width: 95%;
}

/*==集計条件 by_voucher table summary_filter*/
.by_voucher table .summary_filter td > p:first-of-type{
    width: 100%;
    margin-bottom: 1em;
}

.by_voucher table .summary_filter td .div_flex{
    justify-content: space-between;
    margin-bottom: 1.5em;
}

.by_voucher table .summary_filter td .div_1 div,
.by_voucher table .summary_filter td .div_2 div,
.by_voucher table .summary_filter td .div_3 div{
    width: 58%;
}

.by_voucher table .summary_filter td .div_1 div p,
.by_voucher table .summary_filter td .div_2 div p,
.by_voucher table .summary_filter td .div_3 div p{
    width: 86%;
    margin-left: 1em;
}

/*h3左丸*/
.by_voucher table .summary_filter td h3{
    all: unset;
    font-family: "ＭＳ Ｐゴシック", sans-serif;
    font-weight: 900;
}

.by_voucher table .summary_filter td h3::before{
    content: "●";
    display: inline-block;
    font-size: 17px;
}

/*__拡大画像*/
/* 拡大画像用ホバーのグレーの線不要*/
.img_zoom{
    display: block;
    border: 2px solid transparent;/*2pxの透明な枠*/
    box-shadow: 0 0 0 1px transparent;/*1pxのborderっぽく囲う*/
}

/*//店舗別 div_1*/
.by_voucher table .summary_filter td .div_1{
    margin-top: 0.5em;
}

.by_voucher table .summary_filter td .div_1 img{
    width: 42%;
    margin: 0;
}

/*//日別 div_2*/
.by_voucher table .summary_filter td .div_2 img{
    width: 38%;
    margin-left: 0;
}

/*//月別 div_3*/
.by_voucher table .summary_filter td .div_3{
    margin-bottom: 1em;
}

.by_voucher table .summary_filter td .div_3 img{
    width: 35%;
    margin-left: 0;
}

/*==データダウンロード by_voucher table download*/
.by_voucher table .download td .div_flex{
    margin: 0.5em auto;
}

.by_voucher table .download td .div_flex p{
    width: 53%;
}

.by_voucher table .download td img{
    width: 45%;
}

/*//データ保持期間について by_voucher retention*/
.by_voucher .retention p{
    width: 100%;
    padding-left: 1em;
}

/*+検索結果（一覧）画面　表示項目 result_list*/
/*img: 検索結果（一覧）表示項目*/
img[data-original="../../1-sales/1-1-001/bv_img/result_list_1.png"]{
    width: 65%;
}

/**各項目 result_list table*/
/*==合計 result_list table_1 total*/
.result_list .table_1{
    margin-bottom: 1em;
}

.result_list .table_1 .total > th:first-of-type{
    width: 10%;
    background-color: #E1EFFB;
}

.result_list .table_1 .total > td:first-of-type{
    padding: 0;
}

.result_list .table_1 .total .table_in th:first-of-type,
.result_list .table_1 .total .table_in td:first-of-type{
    border-top: none;
}

.result_list .table_1 .total .table_in th{
    border-left: none;
}

.result_list .table_1 .total .table_in td{
    border-right: none;
}

.result_list .table_1 .total .table_in tr:last-of-type th,
.result_list .table_1 .total .table_in tr:last-of-type td{
    border-bottom: none;
}

.result_list .table_2 th{
    width: 10%;
}

/*==No result_list table_2 no*/
.result_list .table_2 .no .div_flex{
    width: 100%;
}

.result_list .table_2 .no .div_flex img{
    width: 7%;
}

/*==種類 result_list table_2 type*/
.result_list .table_2 .type .div_flex{
    width: 100%;
}

.result_list .table_2 .type .div_flex p{
    width: 76%;
}

.result_list .table_2 .type .div_flex div{
    width: 24%;
}

.result_list .table_2 .type .div_flex div img{
    width: 85%;
}

.result_list .table_2 .type .div_flex div img:first-of-type{
    margin-bottom: 0.5em;
}

/*==名称 result_list table_2 name*/
.result_list .table_2 .name .div_flex{
    width: 80%;
    justify-content: space-between;
}

.result_list .table_2 .name .div_flex h3{
    width: 100%;
    font-size: unset;
    font-weight: normal;
    margin-bottom: 0.3em;
}

/*h3左丸*/
.result_list .table_2 .name .div_flex h3::before{
    content: "●";
    display: inline-block;
    font-size: 20px;
}

.result_list .table_2 .name .div_flex div{
    width: 47%;
}

.result_list .table_2 .name .div_flex div img:first-of-type{
    width:60%;
}

/*下向き矢印 arrow*/
.result_list .table_2 .arrow{
    display: block;
    height: 50px;
    text-align: center;
}

.result_list .table_2 .arrow::before{
    content: "↓";
    display: block;
    font-size: 30px;
    font-weight: 900;
    color: #4F4F4F;
}

.result_list .table_2 .name .div_flex div img:last-of-type{
    width: 100%;
    margin-bottom: 0.5em;
}