청구서_퇴실정산서.html 3.08 KB
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<title></title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="Wrap" style="height:100%">

<!-- 헤드 -->
<header>
	<ul>
		<li><img src="img/btn_top_back_over.png" alt="back" width="20%"/></li>
		<li><p>청구서</p></li>
		<li><img src="img/btn_title_privacy.png" alt="privacy" width="22%"/></li>
	</ul>
	<div style="clear:both;"></div>
</header>
<!-- 헤드 -->

<!-- 네비게이션 -->
<nav>
	<ul>
		<li><a>월세</a></li>
		<li><a>공과금</a></li>
		<li class="active"><a>퇴실정산서</a></li><!-- 선택 된 상태일때 addClass 'active'-->
	</ul>
	<div style="clear:both;"></div>
</nav>
<!-- 네비게이션 -->

<!-- 건물명/년도 -->
<div class="year">
	<ul>
		<li><a>파라곤 201</a></li>
		<li><a></a></li>
	</ul>
	<div style="clear:both"></div>
</div>
<!-- 건물명/년도 -->

<!-- 납부기한/금액 -->
<div class="contant con1 bill">
	<dl>
		<dt>힐슽테이 202 최봉수귀하</dt>
		<dd>정산날짜 : <span>2017.01.12</span></dd>
		<dd>총 금액은 <span style="font-size:15px; color:#ff0000; font-weight:bold";>150,000</span> 원 입니다.</dd>
	</dl>
</div>
<!-- 납부기한/금액 -->

<!-- 리스트 -->
<div class="contant con2">
	<ul>
		<li>
			<a><img src="img/circle_bg.png" width="100%"/></a>
			<a>전기료</a><!-- 이름 -->
			<a><span>60,000</span></a><!-- 금액 -->
		</li>
		<div style="clear:both;"></div>
		<li>
			<a><img src="img/circle_bg.png" width="100%"/></a>
			<a>가스료</a><!-- 이름 -->
			<a><span>60,000</span></a><!-- 금액 -->
		</li>
		<li class="used">
			<a>차감액</a>
			<a>소계 <span>60,000</span></a><!-- 금액 -->
		</li>
		<div style="clear:both;"></div>
	</ul>
</div>

<div class="contant con2 bill2">
	<ul>
		<li>
			<a></a>
			<a></a>
			<a>전월지침</a>
			<a>당월지침</a>
			<a>사용량</a>
		</li>
		<div style="clear:both;"></div>
		<li>
			<a><img src="img/circle_bg.png" width="100%"/></a>
			<a>전기요금</a><!-- 이름 -->
			<a><span>60,000</span></a><!-- 금액 -->
			<a><span>60,000</span></a>
			<a><span>60,000</span></a>
		</li>
		<div style="clear:both;"></div>
		<li>
			<a><img src="img/circle_bg.png" width="100%"/></a>
			<a>가스요금</a><!-- 이름 -->
			<a><span>60,000</span></a><!-- 금액 -->
			<a><span>60,000</span></a>
			<a><span>60,000</span></a>
		</li>
		<div style="clear:both;"></div>
		<li>
			<a><img src="img/circle_bg.png" width="100%"/></a>
			<a>수도요금</a><!-- 이름 -->
			<a><span>60,000</span></a><!-- 금액 -->
			<a><span>60,000</span></a>
			<a><span>60,000</span></a>
		</li>
		<div style="clear:both;"></div>
	</ul>
</div>
<!-- 리스트 -->

<!-- 계좌 -->
<div class="bank">
	<div>
		<ul class="text1">
			<li>입금은행</li>
			<li>계좌번호</li>
		</ul>
		<ul class="text2">
			<li>신한</li><!-- 은행 -->
			<li>111-111-111111 (최봉수)</li><!-- 계좌번호 -->
		</ul>
	</div>
</div>
<!-- 계좌 -->


</div>
</body>
</html>