mjon_git/src/main/webapp/publish/transaction_statement.html

311 lines
15 KiB
HTML

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>거래명세서</title>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
<link rel="stylesheet" href="/publish/css/reset.css">
<link rel="stylesheet" href="/publish/css/common.css">
<link rel="stylesheet" href="/publish/css/estimate.css">
<link rel="stylesheet" href="/publish/css/font.css">
<link rel="stylesheet" href="/publish/css/button.css">
</head>
<body>
<!-- 견적서 -->
<div class="estimate_wrap">
<div class="estimate">
<div class="est_head clearfix">
<img src="/publish/images/CI.png" alt="문자온 CI">
<div class="clearfix">
<p>(12248) 경기도 남양주시 다산순환로 20, A동 735호(다산동, 현대프리미어캠퍼스)</p>
<p>TEL 1551-8011</p>
</div>
</div>
<div class="est_body">
<h2>거래명세서<span style="font-size:20px;font-weight:400;">(공급받는자 보관용)</span></h2>
<div class="cont1 tb_ver2" style="display:flex;">
<div style="width:calc((100% - 40px)/2);">
<p>공급받는 자</p>
<table class="est_table">
<caption>등록번호, 상호, 성명, 전화번호, 이메일 정보 제공</caption>
<colgroup>
<col style="width: 60px;">
<col style="width: auto;">
</colgroup>
<tbody>
<tr>
<th>등록번호</th>
<td>사업자등록번호
<!--(개인회원인 경우 하이픈(-) 처리)-->
</td>
</tr>
<tr>
<th style="letter-spacing:-0.69px;">&ensp;&ensp;&ensp;&nbsp;&nbsp;</th>
<td>기업명
<!-- (개인회원인 경우 하이픈(-) 처리-->
</td>
</tr>
<tr>
<th style="letter-spacing:-0.69px;">&ensp;&ensp;&ensp;&nbsp;&nbsp;</th>
<td>가입자명</td>
</tr>
<tr>
<th>전화번호</th>
<td>가입자 연락처</td>
</tr>
<tr>
<th style="letter-spacing:-0.85px;">&ensp;&ensp;</th>
<td>가입자 이메일</td>
</tr>
</tbody>
</table>
</div>
<div style="width:calc((100% - 40px)/2);">
<p>공급자</p>
<img src="/publish/images/content/stamp.png" alt="도장" class="stamp mCS_img_loaded">
<table class="est_table">
<caption>등록번호, 상호, 성명, 전화번호, 이메일 정보 제공</caption>
<colgroup>
<col style="width: 60px;">
<col style="width: auto;">
</colgroup>
<tbody>
<tr>
<th>등록번호</th>
<td>653-87-00858</td>
</tr>
<tr>
<th style="letter-spacing:-0.69px;">&ensp;&ensp;&ensp;&nbsp;&nbsp;</th>
<td>주식회사 아이티앤</td>
</tr>
<tr>
<th style="letter-spacing:-0.69px;">&ensp;&ensp;&ensp;&nbsp;&nbsp;</th>
<td>유인식</td>
</tr>
<tr>
<th>전화번호</th>
<td>1551-8011</td>
</tr>
<tr>
<th style="letter-spacing:-0.85px;">&ensp;&ensp;</th>
<td>help@iten.co.kr</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="cont3">
<div class="est_table2_wrap">
<table class="est_table2">
<caption>작성일자, 공급가액, 세액, 비고 정보를 제공하는 표</caption>
<colgroup>
<col style="width: 25%;">
<col style="width: 25%;">
<col style="width: 25%;">
</colgroup>
<thead>
<tr>
<th scope="col">작성일자</th>
<th scope="col">공급가액</th>
<th scope="col">세액</th>
</tr>
</thead>
<tbody>
<tr>
<td>2024-07-18</td>
<td>500,000</td>
<td>50,000</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>비고</th>
<td style="padding:0 0 0 20px;">사용기간(2024-01-01 ~ 2024-01-31)</td>
</tr>
</tfoot>
</table>
</div>
<div class="est_table2_wrap" style="margin:20px 0 0 0;">
<table class="est_table2">
<caption>월, 일, 품목, 규격, 수량, 단가, 공급가액, 세액, 비고 정보를 제공하는 표</caption>
<colgroup>
<col style="width: 60px;">
<col style="width: 60px;">
<col style="width: auto;">
<col style="width: 60px;">
<col style="width: 60px;">
<col style="width: 60px;">
<col style="width: 100px;">
<col style="width: 60px;">
<col style="width: 70px;">
</colgroup>
<thead>
<tr>
<th scope="col"></th>
<th scope="col"></th>
<th scope="col">품목</th>
<th scope="col">규격</th>
<th scope="col">수량</th>
<th scope="col">단가</th>
<th scope="col">공급가액</th>
<th scope="col">세액</th>
<th scope="col">비고</th>
</tr>
</thead>
<tbody>
<tr>
<td>7</td>
<td>18</td>
<td>문자온 메시징 서비스 이용료</td>
<td></td>
<td></td>
<td></td>
<td>500,000</td>
<td>50,000</td>
<td>-</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
<!-- 후불제 -->
<!-- <tfoot>
<tr>
<th colspan="2">합계금액</th>
<th>전잔액</th>
<th colspan="2">입금액</th>
<th colspan="2">현잔액</th>
<th colspan="2" rowspan="2" style="background:#fff;vertical-align:middle;">이 금액을 [<span>청&ensp;구</span>]함</th>
</tr>
<tr>
<td style="text-align:center;" colspan="2">550,000</td>
<td style="text-align:center;">-</td>
<td style="text-align:center;" colspan="2">-</td>
<td style="text-align:center;" colspan="2">550,000</td>
</tr>
</tfoot> -->
<!-- //후불제 -->
<!-- 일반회원(선불제) -->
<tfoot>
<tr>
<th colspan="2">합계금액</th>
<th>전잔액</th>
<th colspan="2">입금액</th>
<th colspan="2">현잔액</th>
<th colspan="2" rowspan="2" style="background:#fff;vertical-align:middle;">이 금액을 [<span>&ensp;</span>]함</th>
</tr>
<tr>
<td style="text-align:center;" colspan="2">550,000</td>
<td style="text-align:center;">-</td>
<td style="text-align:center;" colspan="2">-</td>
<td style="text-align:center;" colspan="2">550,000</td>
</tr>
</tfoot>
<!-- //일반회원(선불제) -->
</table>
</div>
</div>
<!-- <div class="cont5">
<p><span>2021</span> 년&nbsp;&nbsp;<span>6</span> 월&nbsp;&nbsp;<span>17</span> 일</p>
<div>
<span></span>
<span>주식회사 아이티앤</span>
<span>유&nbsp;&nbsp;인&nbsp;&nbsp;식&nbsp;&nbsp;(인)</span>
</div>
</div> -->
</div>
<div class="est_btn_wrap">
<button type="button" class="btnType" onclick="window.print();"><i class="print_img"></i>인쇄하기</button>
</div>
</div>
</div>
<!--// 견적서 -->
</body>
</html>