/*+ポイント単価・ポイント有効期限CSS*/

/*//設定リセット*/
h4{
    font-weight: normal;
    color: black;
}

/*+ポイント単価 point_value*/
.point_value > p:first-of-type{
    width: 100%;
    margin-bottom: 1.5em;
}
/*h4左丸*/
.point_value h4::before{
    content: "●";
    display: inline-block;
    font-size: 20px;
}

/*リンク文字色*/
.point_value a{
    color: #000080;
    text-decoration: underline;
}

.point_value a:hover{
    color: #72dbfa;
}

/**反映する場所1 point_value div_1*/
.point_value .div_1{
    width: 95%;
    display: flex;
    margin: 0 auto;
}

.point_value .div_1 div{
    width: 45%;
}

.point_value .div_1 div p{
    width: 90%;
}

.point_value .div_1 img{
    width: 25%;
    height: fit-content;
    margin-left: 0;
}

/**反映する場所2 point_value div_2*/
.point_value .div_2{
    width: 95%;
    display: flex;
    margin: 0 auto;
}

.point_value .div_2 div:first-of-type{
    width: 45%;
}

.point_value .div_2 div:first-of-type h4{
    margin-bottom: 1.5em;
}

.point_value .div_2 div:first-of-type p{
}

.point_value .div_2 .spa_1{
    display: block;
    margin-left: 1.5em;
}

.point_value .div_2 .spa_2{
    display: block;
}

.point_value .div_2 div:last-of-type{
    width: 55%;
    position: relative;/*arrowの親*/
}

.point_value .div_2 div:first-of-type p:last-of-type{
    width: 90%;
    margin-top: 1em;
}

.point_value .div_2 div:last-of-type img{
    width: 100%;
    height: fit-content;
}

/*下向き矢印 .point_value .div_2 div .arrow*/
.point_value .div_2 div:last-of-type .arrow::before{
    content: "↓";
    font-size: 40px;
    font-weight: bold;
    color: #4F4F4F;
    position: absolute;
    top: 38%;
    left: 50%;
    transform: translate(-50%);
}

/*画像：明細管理－ポイント別で「使用ポイント」を選択した場合に反映*/
img[data-original="../../8-settings/8-1-001/bs_1_img/point_value_2.png"]{
    margin-bottom: 4em;
}

/**反映する場所3 point_value div_3 */
.point_value .div_3{
    width: 95%;
    display: flex;
    margin: 0 auto;
}

.point_value .div_3 div{
    width: 45%;
}

.point_value .div_3 img{
    margin-left: 0;
}

/**反映する場所4 point_value div_4*/
.point_value .div_4{
    width: 95%;
    display: flex;
    margin: 0 auto;
}

.point_value .div_4 div:first-of-type{
    width: 45%;
}
.point_value .div_4 div:first-of-type h4,
.point_value .div_4 div:first-of-type p{
    width: 100%;
}

.point_value .div_4 div:last-of-type {
    width: 55%;
    position: relative;
}

.point_value .div_4 div:last-of-type img{
    width: 100%;
    height: fit-content;
    margin-left: 0;
}

/*下向き矢印 .point_value .div_4 div:last-of-type .arrow*/
.point_value .div_4 div:last-of-type .arrow::before{
    content: "↓";
    font-size: 40px;
    font-weight: bold;
    color: #4F4F4F;
    position: absolute;
    top: 32%;
    left: 50%;
    transform: translate(-50%);
}

/*画僧：「明細管理－処理種別」で伝票Noを選択し、詳細を表示します。*/
img[data-original="../../8-settings/8-1-001/bs_1_img/point_value_4.png"]{
    margin-bottom: 3.5em;
}

/*+ポイント有効期限 point_expiration*/
.point_expiration > p:first-of-type{
    width: 100%;
    padding-left: 1em;
    margin-bottom: 1.5em;
}

/*h4左丸*/
.point_expiration h4::before{
    content: "●";
    display: inline-block;
    font-size: 20px;
}

/*リンク文字色*/
.point_expiration a{
    color: #000080;
    text-decoration: underline;
}

.point_expiration a:hover{
    color: #72dbfa;
}

/**反映する場所1 point_expiration div_1*/
.point_expiration .div_1{
    width: 95%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}

.point_expiration .div_1 .d_1{
    width: 43%;
}

.point_expiration .div_1 .d_1 h4,
.point_expiration .div_1 .d_1 p{
    width: 100%;
}

.point_expiration .div_1 .d_1 p:last-of-type{
    margin-top: 1.5em;
}

.point_expiration .div_1 .d_2{
    width: 50%;
    position: relative;
}

/*画像：「顧客管理－顧客リスト」の顧客コードを選択*/
img[data-original="../../8-settings/8-1-001/bs_1_img/point_expiration_1.png"]{
    width: 85%;
    height: fit-content;
    margin-bottom: 3.5em;
}

/*画像：顧客情報を表示した画面で反映されます。*/
img[data-original="../../8-settings/8-1-001/bs_1_img/point_expiration_2.png"]{
    width: 100%;
    height: fit-content;
}

/*下向き矢印*/
.point_expiration .div_1 .d_2 .arrow::before{
    content: "↓";
    font-size: 40px;
    font-weight: bold;
    color: #4F4F4F;
    position: absolute;
    top: 66%;
    left: 50%;
    transform: translateX(-50%);
}

/**反映する場所2 point_expiration div_2*/
.point_expiration .div_2{
    width: 95%;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}

.point_expiration .div_2 .d_1{
    width: 45%;
}

.point_expiration .div_2 .d_1 div{
    margin-top: 1.5em;
}

.point_expiration .div_2 .d_1 div img{
    width: 95%;
}

/*画像：*/
img[data-original="../../8-settings/8-1-001/bs_1_img/point_expiration_仮１.png"]{
    width: 52%;
    height: fit-content;
}
