OSDN Git Service

ダウンロードページを整理。 / Rearrange download page.
[hengband/web.git] / src / hengband.css
1 \r
2 a:link          { color: #E09990;}\r
3 a:visited       { color: #C09990;}\r
4 a:active        { color: #F0DDDD;}\r
5 a:hover         { color: #F0DDDD;}\r
6 \r
7 body {\r
8         min-height: 100vh;\r
9 \r
10         color: #D0D0D0;\r
11         background-color: #300900;\r
12         display: flex;\r
13         flex-direction: column;\r
14         justify-content: space-between;\r
15         align-content: center;\r
16         align-items: center;\r
17 \r
18         padding: 0px;\r
19         border: 0px;\r
20         margin: 0px;\r
21         font-family:"メイリオ","Meiryo",Osaka, "ヒラギノ角ゴ Pro W3", Arial, Helvetica, sans-serif;\r
22         font-size: 1.0rem;\r
23         line-height: 1.2rem;\r
24 }\r
25 \r
26 #wrapper{\r
27         background-color: #000000;\r
28         min-width: 400px;\r
29         max-width: 800px;\r
30         text-align: left;\r
31         position: relative;\r
32         padding: 0px 0px 0px 0px;\r
33         border: 0px;\r
34         margin: 0 auto;\r
35 }\r
36 \r
37 /* ヘッダ/フッタ ////////////////////////////////////////////////// */\r
38 \r
39 header{\r
40         width: 100%;\r
41         background-color : #000000;\r
42         display: flex;\r
43         flex-direction: column;\r
44 }\r
45 \r
46 footer\r
47 {\r
48         width: 100%;\r
49         background-color: #000000;\r
50         padding: 10px 10px;\r
51 \r
52         display: flex;\r
53         flex-direction: row;\r
54         justify-content: space-around;\r
55 }\r
56 \r
57 footer > section\r
58 {\r
59         font-size: 70%;\r
60         line-height: 100%;\r
61 }\r
62 \r
63 \r
64 /* タイトル系統 ////////////////////////////////////////////////// */\r
65 \r
66 section#title\r
67 {\r
68         width: 80vw;\r
69         margin-right : auto;\r
70         margin-left  : auto;\r
71 \r
72         display: flex;\r
73         justify-content: space-between;\r
74         align-content: center;\r
75         align-items: flex-end;\r
76 }\r
77 \r
78 img#hengTitle\r
79 {\r
80         width: 25vw;\r
81         height: auto;\r
82 }\r
83 \r
84 img.tama4\r
85 {\r
86         width: 8vw;\r
87 }\r
88 \r
89 img.tama3\r
90 {\r
91         width: 5vw;\r
92 }\r
93 \r
94 img.tama2\r
95 {\r
96         width: 2vw;\r
97 }\r
98 \r
99 img.tama1\r
100 {\r
101         width: 1vw;\r
102 }\r
103 \r
104 \r
105 \r
106 /* メインメニュー系統 ////////////////////////////////////////////////// */\r
107 \r
108 section#mainMenu\r
109 {\r
110         width: 100vw;\r
111         margin-right : auto;\r
112         margin-left  : auto;\r
113         background-color: #000000;\r
114 \r
115         justify-content: center;\r
116         align-content: center;\r
117         display: flex;\r
118 }\r
119 \r
120 section#mainMenu > a {\r
121         position: relative;\r
122         display: inline-block;\r
123         padding: 0.25em 0.5em;\r
124         text-decoration: none;\r
125         background: #302010;\r
126         color: #FFFFFF;\r
127         border-radius: 0.3vw;\r
128         box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);\r
129         font-weight: bold;\r
130         border: solid 2px #d27d00;/*線色*/\r
131 }\r
132 \r
133 section#mainMenu > span {\r
134         position: relative;\r
135         display: inline-block;\r
136         padding: 0.25em 0.5em;\r
137         text-decoration: none;\r
138         color: #908080;\r
139         background: #442200;\r
140         border-radius: 0.3vw;\r
141         box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);\r
142         font-weight: bold;\r
143         border: solid 2px #d27d00;/*線色*/\r
144 }\r
145 \r
146 section#mainMenu > a:hover\r
147 {\r
148         background: #A06535;\r
149         box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);\r
150 }\r
151 \r
152 \r
153 /* 本文系統 ////////////////////////////////////////////////// */\r
154 \r
155 div#main\r
156 {\r
157         font-size: 0.8rem;\r
158         line-height: 1.3rem;\r
159         width: 70%;\r
160 \r
161         display: flex;\r
162         flex-direction: column;\r
163 }\r
164 \r
165 .paragraph > p, .ulist\r
166 {\r
167         margin: 1rem 0.5rem;\r
168         padding: 0.2rem 0.2rem;\r
169 }\r
170 \r
171 .content\r
172 {\r
173         padding: 0.5rem;\r
174         margin: 1rem;\r
175         display: flex;\r
176         flex-direction: row;\r
177         justify-content: center;\r
178         justify-items: center;\r
179         align-content: space-around;\r
180         align-items: center;\r
181 }\r
182 \r
183 .update{\r
184         text-align: center;\r
185         padding: 6px;\r
186         margin:  30px 5px;\r
187 }\r
188 \r
189 \r
190 ul{\r
191         padding: 0px;\r
192         border:  0px;\r
193         margin:  0px 15px 0px 15px;\r
194 }\r
195 \r
196 li{\r
197         padding: 0px;\r
198 }\r
199 \r
200 .image {\r
201         text-align: center;\r
202         padding: 10px;\r
203 }\r
204 \r
205 H2{\r
206         padding: 10px 10px 6px 10px;\r
207         border: 3px #554433 solid;\r
208         background-color: #000000;\r
209 }\r
210 \r
211 H3{\r
212         padding: 5px 5px;\r
213         margin:  0px 5px;\r
214         border: 1px #554433 solid;\r
215         background-color: #000000;\r
216 }\r
217 \r
218 H4{\r
219         padding: 5px 5px;\r
220         margin:  2px 2px;\r
221         background-color: #000000;\r
222 }\r
223 \r
224 .strong\r
225 {\r
226         font-weight: bold;\r
227 }\r
228 \r
229 .line-through\r
230 {\r
231         text-decoration: line-through;\r
232 }\r
233 \r
234 \r
235 /* common footer */\r
236 \r
237 .footer_banner\r
238 {\r
239         float: right;\r
240 }\r
241 \r
242 \r
243 .topimage\r
244 {\r
245         border: 3px #554433 solid;\r
246         text-align: center;\r
247 }\r
248 \r
249 pre {\r
250         width: 100%;\r
251         white-space: pre-wrap;\r
252         word-wrap: break-word;\r
253         background-color: #000000;\r
254         padding: 1rem;\r
255         margin: 0.2rem;\r
256         font-family: MS 明朝, monospace;\r
257 }\r
258 \r
259 \r