/* =========================================================
		receipt
========================================================= */
.receipt_att{padding:0 0 35px;border:1px solid #3069ac;width:90%;margin:0 auto 35px;background:rgba(255,255,255,0.7);}
.receipt_att .apply_ttl{font-size:1.3em;letter-spacing:1px;color:#fff;text-align:center;padding:1.5%;margin-bottom:4%;background:#3069ac;}
.receipt_att .flex{padding:0 35px;}
.receipt_att .point_list{float:left;width:58%;font-size:15px;}
.receipt_att .point_list li{padding-bottom:8px;padding-left:1.5em;text-indent:-1.4em;}
.receipt_att .receipt_pic{float:right;width:31%;padding-right:2%;} .receipt{padding:0 35px;}
.receipt_ttl{margin:6% 0 0.1%;text-align:center;position:relative;}
.receipt_ttl span{background:#f8f9f9;display:inline-block;position:relative;z-index:5;padding:0 1%;}
.receipt_ttl::after{content:" ";width:100%;height:0;border-bottom:solid 2px #666;left:0;bottom:0.8em;position:absolute;}
.receipt_list{display:flex;flex-wrap:wrap;align-items:flex-start;width:88%;margin:3% auto -3%;}
.receipt_list li{width:21%;display:inline-block;margin:0 2% 5%;}
.view .item .heading3{width:100%;padding:1.1em 0 0;font-size:18px;text-align:center;}
.view .item .main3{padding:1.6em 0 0.5em;/*width: 805px;*/width:100%;margin:0 auto;}
#form.r_upload .item{display:block;}
/* =========================================================
		receipt upload
========================================================= */
#upload .drop_area {border: 2px dashed #999; padding: 10px 0 15px; text-align:center; margin-bottom: 20px;}
#upload .drop_area.dragenter {  border: 2px solid #999;}
#upload .drop_area.filefull { border: 2px dashed rgba(0, 0, 0, .2);}
#upload .drop_area .exposition { font-size: 14px; padding: 20px 0 20px; color: #333;}
#upload .drop_area.filefull p { opacity: 0.4;}
.canvas_area{width: 805px; margin: 0 auto 25px; display: flex; flex-wrap: wrap; transition: all .3s;}
.canvas_area .canvas_container { background: #ffeac6;  border: solid 2px #ffeac6; position: relative;
    width: 800px; height: 800px; overflow: hidden; margin: 0 auto; margin-bottom: 25px;
	display: block;  box-sizing: border-box; 
}
.canvas_area .canvas_container:nth-child(2n), .canvas_area .canvas_container:nth-child(4n){ margin-left: 25px;}
.canvas_area .canvas_container canvas {position: relative; width: auto; height: auto; transform: translate(-50%, -50%);}
.canvas_area .canvas_container button.rotate {position: absolute; left: 15px; bottom: 15px;}
.canvas_area .canvas_container button.delete {position: absolute; right: 15px; bottom: 15px;}
/* input type=file */
#upload .image_area label {color: white; background-color: red; padding: 10px 55px; cursor: pointer; font-weight: 600; border-radius: 6px;}
#upload .image_area label.disabled { cursor: default; opacity: 0.5;}
/* エラー メッセージ */
#upload p.errmsg { color: #ff0000;}
button {  background-color: transparent; padding: 0; appearance: none; border: none; cursor: pointer;  outline: none;}
.canvas_area .canvas_container button.delete { position: absolute; left: 15px; right: inherit;
    bottom: 15px; padding: 8px 10px; background: #333; font-size: 18px; color: #fff; border-radius: 5px; font-weight: 600; line-height: 1; width: 38px;}
.canvas_area .canvas_container button.rotate { position: absolute; right: 15px;left: inherit; bottom: 15px; padding: 8px 10px;
    background: #0068b7; font-size: 18px; color: #fff; border-radius: 5px; font-weight: 600; line-height: 1; width: 38px;}
.canvas_area .canvas_container:nth-child(2n){ margin-right: 0;}
.view.r_upload #upload.err_bg{background: none !important;}
.view.r_upload #upload.err_bg > .main3 > .drop_area{ background: #f7d2d0;}
@media screen and (min-width:766.1px) and ( max-width:945px) {
    .canvas_area{transform: scale(0.95) translateX(50px); transform-origin: center;  margin-right: 0.2.%; position: relative; left: -6%;} 
    .canvas_area .canvas_container{transform: scale(0.95);}
}

/* =========================================================
            receipt SP
========================================================= */
@media screen and (max-width: 750px) {
.receipt_att{padding:0 0 8%;width:100%;margin:0 auto 8%;background:rgba(255,255,255,0.7);}
.receipt_att .apply_ttl{font-size:18px;letter-spacing:0.5px;color:#fff;text-align:center;padding:1.8%;margin-bottom:4%;}
.receipt_att .flex{padding:0 5%;}
.receipt_att .point_list{float:none;width:100%;font-size:14px;margin-bottom:5%;}
.receipt_att .point_list li{padding-bottom:7px;line-height:1.6;letter-spacing:0.5px;}
.receipt_att .receipt_pic{float:none;width:76%;margin:0 auto 10%;padding-right:0;}
.receipt{padding:0 4%;}
.receipt_ttl{margin:6% 0 0.1%;text-align:center;position:relative;}
.receipt_ttl span{background:#f8f9f9;display:inline-block;position:relative;z-index:5;padding:0 1%;letter-spacing:0;}
.receipt_ttl::after{content:" ";width:100%;height:0;border-bottom:solid 2px #666;left:0;bottom:0.8em;position:absolute;}
.receipt_list{display:flex;flex-wrap:wrap;align-items:flex-start;width:100%;margin:3% auto -3%;}
.receipt_list li{width:29.2%;display:inline-block;margin:0 2% 5%;}
#form.r_upload{width:100%;}
#form.r_upload .item{margin-bottom:0;}
.view .item .main3{width:100%;}  .view .item .main3 .err_show{padding:6px 0 0 10px;}
/* =========================================================
            receipt upload
========================================================= */	
#upload .image_area label { color: white;  background-color: red;
    border-radius: 6px; cursor: pointer;  font-weight: 600; color: white; padding: 12px 0;
    letter-spacing: 1px; font-size: 16px; width: 70%; display: block; text-align: center; margin: 0 auto;
}
.canvas_area { width: 100%; margin: 0 auto;	padding-bottom: 4%;	display: block;}
.canvas_area .canvas_container {  float: none; margin-right: auto; margin-bottom: 5%;}
.canvas_area .canvas_container button.delete {
    position: absolute; left: 2%; bottom: 2%;  padding: 5px 5px; background: #333;
    font-size: 16px; color: #fff; border-radius: 4px; font-weight: 600; right: inherit; width: 34px;
}
.canvas_area .canvas_container button.rotate {
    position: absolute; right: 2%; left: inherit; bottom: 2%; padding: 5px;
    background: #0068b7; font-size: 16px; color: #fff; border-radius: 4px; font-weight: 600; width: 34px;
}	
.canvas_area .canvas_container:nth-child(2n) { margin: inherit; margin-bottom: 5%;}
.canvas_area .canvas_container:nth-child(4n) { margin: inherit; margin-bottom: 5%;}
}