style.css
9.54 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
@charset "utf-8";
@import url(https://cdn.rawgit.com/openhiun/hangul/14c0f6faa2941116bb53001d6a7dcd5e82300c3f/nanumbarungothic.css);
@font-face{
font-family:"sandoll";
src:url('./font/SanDoll.ttf') format('truetype');
}
*{ margin : 0; padding : 0;}
li{ list-style : none; }
a{ text-decoration : none;}
/*초기화*/
body{width:100%; height:100%; font-family: 'Nanum Barun Gothic', sans-serif;}/*작업하기전에 확인*/
header{font-family: 'sandoll', sans-serif !important;}
.Wrap{min-height:100%;}
.wrapper{position:relative; width:875px; margin:0 auto; min-width:875px; padding:5px 5px; background:#fff;}/*매번 수정해야함*/
.f14{font-size:14px;}
.f16{font-size:16px;}
.f18{font-size:18px;}
.f20{font-size:20px;}
.f22{font-size:22px;}
.f24{font-size:24px;}
.f28{font-size:28px;}
.f40{font-size:40px;}
.f56{font-size:56px;}
.Cf{color:#fff;}
.Cc{color:#ccc;}
.C0{color:#000;}
.C2{color:#222;}
.C4{color:#444;}
.C7{color:#777;}
.W300{font-weight:300;}
.W400{font-weight:400;}
.W500{font-weight:500;}
.W700{font-weight:700;}
.W900{font-weight:900;}
.roboto{font-family:'Roboto', sans-serif;}
.italic{font-style:italic;}
.active{color:#fff; background:#4a4a4a;}
.under{text-decoration:underline;}
.orange{background:url('/web/inc/images/btn_orange_bg.png') no-repeat center; background-size:100%;}
.long_orange{background:url('/web/inc/images/long_orange_bg.png') no-repeat center; background-size:100%;}
.green{background:url('/web/inc/images/btn_green_bg.png') no-repeat center; background-size:100%;}
.red{background:url('/web/inc/images/red_bg.png') no-repeat center; background-size:100%;}
.navy{background:url('/web/inc/images/navy_bg.png') no-repeat center; background-size:100%;}
.yellow{background:url('/web/inc/images/yellow_bg.png') no-repeat center; background-size:100%;}
.brown{background:url('/web/inc/images/btn_brown_bg.png') no-repeat center; background-size:100%;}
/*공통*/
/*헤더*/
header{width:100%; background:#353535; height:57px;}
header ul{width:100%;}
header ul li{float:left; line-height:57px; width:33.33%; text-align:center;}
header ul li:first-child{text-align:left;}
header ul li:nth-child(2){color:#fff; font-size:2.2em;}
header ul li:last-child{float:right; text-align:right;}
header ul li img{vertical-align:middle; padding:0px 12px;}
/*네비게이션*/
nav{width:100%; background:#e6e7e8; height:43px; font-size:1em; color:#707070;}
nav ul{width:100%;}
nav ul li{width:33.33%; float:left; text-align:center; line-height:43px;}
/*건물명/년도*/
.year{width:100%; height:20px; background:#939393; font-size:0.8em; color:#fff;}
.year ul{width:100%;}
.year ul li{width:50%; float:left; line-height:20px;}
.year ul li:last-child{text-align:right;}
.year ul li a{padding:0px 25px;}
.year ul li:last-child a{padding:0px 45px;}
/*리스트*/
section{width:100%; height:75px; font-size:0.8em;}
section ul{width:100%; border-bottom:1px solid #939393;}
section ul li{width:25%; float:left; overflow:hidden; position:relative;}
section ul li:first-child{text-align:left; font-size:0.95; color:#4a4a4a; line-height:75px;}
section ul li:nth-child(2){width:50%; text-align:center; color:#707070; font-size:0.9em;}
section ul li .date{width:50px; margin-left:25px; text-align:center; background:url('/web/inc/images/btn_data_bg.png') no-repeat center; background-size:100%;}
section ul li .status{width:50px; text-align:center; line-height:75px; color:#fff; margin-left:20%;}
section ul li .price{font-weight:bold; color:#ff0000;}
section .room_info li{width:33.33%; float:left; overflow:hidden; position:relative;}
section .room_info li:nth-child(2){width:33.33%; text-align:center; color:#707070;}
section ul li .room_num{width:80px; margin-left:10%; text-align:center; background:url('/web/inc/images/btn_room_bg.png') no-repeat center; background-size:100%;}
section ul .room_user p{text-align:left; padding:0px 20px;}
section ul .room_user .price{font-weight:normal; color:#707070;}
section .room_info li .status{width:50px; text-align:center; line-height:75px; color:#fff; float:right; margin-right:20%;}
section .room_info li .logn_status{width:75px;}
section .room_info li .rent_list{line-height:32px;}
section .room_info li .rent_list:first-child{margin-top:5px;}
/*납부기한/금액*/
.contant{width:86%; border-bottom:1px solid #707070; margin:0 auto;}
.con1{height:63px;}
.con1 dl{padding:14px 0px; font-size:0.8em; color:#707070;}
.con1 dl dt{margin-bottom:3px;}
.buil_name dl{padding:25px 0px; font-size:0.9em; color:#707070;}
.buil_name dl dt{margin-bottom:0px;}
.bill{height:90px;}
.bill dl{padding:14px 0px; font-size:0.8em; color:#707070;}
.bill dl dd:nth-child(2){margin:7px 0px;}
.con2{padding:10px 0px;}
.con2 ul{padding:0px 15px; font-size:0.85em; color:#707070;}
.con2 ul li{height:22px; width:100%; line-height:22px; margin-bottom:3px;}
.buil_list{padding:15px 0px 10px 0px;}
.buil_list ul li{height:23px; width:100%; line-height:23px; margin-bottom:5px;}
.con2 ul li:last-child{margin-bottom:0px;}
.con2 ul li a:first-child{display:inline-block; width:10px; margin-right:3px;}
.con2 ul li a:last-child{float:right;}
.con2 ul .used{margin-top:14px;}
.con2 ul .used a:first-child{display:inline-block; width:50px; margin-right:3px; text-align:center; background:url('/web/inc/images/btn_usage_bg.png') no-repeat center; background-size:100%; color:#fff; font-size:0.8em;}
.con2 ul .used a:nth-child(2) span{margin-left:29px;}
.con2 ul .rent a:first-child{display:inline-block; width:50px; margin-right:3px; text-align:center; color:#fff; font-size:0.8em;}
.bill2{padding:15px 0px;}
.bill2 ul{padding:0px 15px; font-size:0.82em; color:#707070;}
.bill2 ul li{height:22px; width:100%; line-height:22px; margin-bottom:3px;}
.bill2 ul li span{font-size:0.95em;}
.bill2 ul li:last-child{margin-bottom:0;}
.bill2 ul li a{display:inline-block; width:22%}
.bill2 ul li a:first-child{width:10px; margin-right:3px;}
.bill2 ul li a:nth-child(n+3){text-align:center;}
.bill2 ul li a:last-child{float:right; text-align:right;}
/*계좌*/
.bank{width:86%; margin:0 auto; margin-top:40px; color:#707070; font-size:0.85em;}
.bank div{height:94px; width:90%; margin:0 auto; background:url('/web/inc/images/account_bg.png') no-repeat center; background-size:100%;}
.bank div ul{float:left;}
.bank div .text1{width:25%; height:86px; text-align:center;}
.bank div .text1 li:first-child{margin:23px 0px 17px 0px;}
.bank div .text2{width:74%; height:86px;}
.bank div .text2 li:first-child{margin:23px 0px 17px 14px;}
.bank div .text2 li{margin-left:14px;}
/*비고/특약*/
.note{width:86%; margin:0 auto; margin-top:20px; color:#707070; font-size:0.85em;}
.note div{height:94px; width:90%; margin:0 auto;}
.note div .text1 li:last-child{margin:20px 0px 35px 0px; width:92%; height:85px; border:1px solid #707070; padding:4%;}
.claim_con div{width:100%;}
.claim_con div .text1 li a:first-child{display:inline-block; width:10px; margin-right:3px;}
.claim_con div .text1 li a:last-child{font-weight:bold;}
/*팝업*/
.pop{width:70%; height:175px; color:#707070; background:#fff; margin:0 auto; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;}/*background:url('/web/inc/images/bg_pop1.png') no-repeat center top; background-size:100%;*/
.pop .head{width:100%; height:42px; border-bottom:1px solid #707070;}
.pop .head li{line-height:42px; width:33%; text-align:center; float:left;}
.pop .head li:first-child{color:#fff;}
.pop .head .title{font-size:0.98em;}
.pop .con{width:100%; height:115px; overflow-y:scroll;}
.pop .con li{width:85%; margin:0 auto; border-bottom:1px solid #707070; height:40px; line-height:40px; text-align:center;}
.pop2{width:64%; height:260px; background:url('/web/inc/images/bg_pop2.png') no-repeat center top; background-size:100%;}
.pop .con2{width:100%; height:180px; overflow-y:scroll; font-size:0.85em;}
.pop .con2 li{width:85%; margin:0 auto; height:40px;}
.pop3_1{width:70%; height:265px; background:#fff; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;}
.pop3{border:none; width:85%;}
.pop3 ul{font-size:0.9em; color:#707070; border-bottom:1px solid #707070; padding:10px 0;}
.pop3 ul:last-child{border:none;}
.pop3 ul li{height:22px; width:100%; line-height:22px;}
.pop3 ul li:last-child{margin-bottom:0;}
.pop3 ul li a{display:inline-block; width:22%}
.pop3 ul li a:first-child{width:10px; margin-right:3px;}
.pop3 ul li a:nth-child(n+3){text-align:center;}
.pop3 ul li a:last-child{float:right; text-align:right;}
.pop4_1{width:70%; height:345px; background:#fff; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;}/*background:url('/web/inc/images/bg_pop4.png') no-repeat center top; background-size:100%;*/
.pop4{padding:8px 0px;}
.pop4 ul{padding:0px 15px; font-size:0.9em; color:#707070;}
.pop4 ul li{height:22px; width:100%; line-height:22px; margin-bottom:3px;}
.pop4 ul li:last-child{margin-bottom:0;}
.pop4 ul li a:first-child{display:inline-block; width:10px; margin-right:3px;}
.pop4 ul li a:last-child{float:right;}
.total{width:85%; margin:0 auto; font-size:0.95em; height:35px; line-height:35px;}
.total div{float:right;}
.room_none_pop_box{width:70%; height:165px; background:#fff; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;}
.room_none_pop{border:none; width:85%;}
.room_none_pop ul{font-size:0.9em; color:#707070; border-bottom:1px solid #707070; padding:10px 0;}
.room_none_pop ul:last-child{border:none;}
.room_none_pop ul li{height:35px; width:100%; line-height:35px;}
.room_none_pop ul li:last-child{margin-bottom:0;}
.room_none_pop ul li a{display:inline-block; width:22%}
.room_none_pop ul li a:first-child{width:10px; margin-right:3px;}
.room_none_pop ul li a:nth-child(n+3){text-align:center;}
.room_none_pop ul li a:last-child{float:right; text-align:right;}