/*+ 予算・経費：簡易経費入力CSS*/

/*+簡易経費入力 quick_entry*/
/* 登録必須 */
.kome{
    display: inline-flex;
    justify-content: flex-end;
    width: 7em;
    height: 50px;
    align-items: center;
    font-weight: normal;
    font-size: 16px;
}

.kome::before{
    content: "*";
    display: block;
    font-size: 28px;
    font-weight: bold;
    color: red;
}

.div_flex_h3{
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}

.div_flex_h3 > div:first-of-type,
.div_flex_h3 > div:last-of-type{
    width: 49%;
}

.div_flex{
    width: 95%;
    display: flex;
    margin: 0 auto;
}

/**店舗コード div_1*/
img[data-original="../../1-sales/1-3-002/img/shop_code.png"]{
    width: 30%;
}

/**経費入力年月 div_2*/
/*＜*/
.div_2 .spa_1{
    display: inline-block;
    width: 2.1em;
    height: 40px;
    border: 1px solid black;
    border-radius: 3px;
    background-color: #E5E5E5;
    vertical-align: middle;/*pの中に有ると表示されなくなる対策*/
    margin-right: 0.5em;
    position: relative;
}

.div_2 .spa_1::before{
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    border-top: 1px solid black;
    border-right: 1px solid black;
    transform: rotate(-135deg);
    position: absolute;
    top: 35%;
    left: 50%;
}

/*＞*/
.div_2 .spa_2{
    display: inline-block;
    width: 2.1em;
    height: 40px;
    border: 1px solid black;
    border-radius: 3px;
    background-color: #E5E5E5;
    vertical-align: middle;/*pの中に有ると表示されなくなる対策*/
    margin-right: 0.3em;
    position: relative;
}

.div_2 .spa_2::before{
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    border-top: 1px solid black;
    border-right: 1px solid black;
    transform: rotate(45deg);
    position: absolute;
    top: 35%;
    left: 40%;
}

img[data-original="../../1-sales/1-3-002/img/year_month.png"]{
    width: 30%;
    margin-left: 5%;
}

/**日付 div_3 *科目 div_4*/
/**日付*/
img[data-original="../../1-sales/1-3-002/img/day.png"]{
    width: 29%;
}

/**科目*/
.div_4{
    position: relative;/*科目サブの親*/
}

.div_4 .div_flex{
    justify-content: space-between;
}

.div_4 .div_flex p{
    width: 70%;
    padding-left: 2em;
}

img[data-original="../../1-sales/1-3-002/img/subject.png"]{
    width: 25%;
}

/*//科目サブ div_5*/
.div_4 .div_5{
    width: 65%;
    margin-left: 2.5%;
    position: absolute;
    top: 34%;
}

.div_4 .div_5 p{
    text-align: center;
    margin-bottom: 1em;
}

/**金額 div_6 摘要 div_7*/
/** 金額*/
img[data-original="../../1-sales/1-3-002/img/cost.png"]{
    width: 25%;
    margin-left: 25%;
}

/**摘要*/
.div_7 p{
    width: 100%;
    padding-left: 1em;
    margin-bottom: 1em;
}

img[data-original="../../1-sales/1-3-002/img/description.png"]{
    width: 40%;
}

/**月・他店コピー div_8*/
.div_8 .div_flex{
    justify-content: space-between;
}

.d_1,
.d_2{
    width: 49%;
}

.d_1 p,
.d_2 p{
    padding-left: 1em;
}
/**科目のみ d_1*/
/**科目/金額 d_2*/


/**グラフ表示 div_9*/
.div_9 span{
    display: inline-block;
    width: 8em;
    height: 35px;
    line-height: 35px;
    font-family: "ＭＳ Ｐゴシック", sans-serif;    
    color: black;
    text-align: center;
    font-weight: normal;
    border: 1px solid #CDCDCD;
    border-radius: 3px;
    background-color: #EEEEEE;
}

.div_9 p{
    width: 100%;
    padding-left: 1em;
    margin-bottom: 1em;
}

/**月コピー div_10*/
.div_10 h3{
    height: 60px;
    line-height: 60px;
}

.div_10 span{
    display: inline-block;
    width: 8em;
    height: 55px;
    line-height: 55px;
    font-family: "ＭＳ Ｐゴシック", sans-serif;    
    color: black;
    text-align: center;
    font-weight: normal;
    border: 1px solid #CDCDCD;
    border-radius: 3px;
    background-color: #EEEEEE;
}

.div_10 p{
    width: 100%;
    padding-left: 1em;
}

/**他店コピー div_11*/
.div_11 h3{
    height: 60px;
    line-height: 60px;
}

.div_11 span{
    display: inline-block;
    width: 8em;
    height: 55px;
    line-height: 55px;
    font-family: "ＭＳ Ｐゴシック", sans-serif;    
    color: black;
    text-align: center;
    font-weight: normal;
    border: 1px solid #CACACA;
    border-radius: 3px;
    background-color: #EEEEEE;
}

.div_11 p{
    width: 100%;
    padding-left: 1em;
}