1@media (min-width:801px) {
2  .not-pc {
3    visibility: hidden;
4  }
5
6  .nav-for-device {
7    display: none !important;
8  }
9
10  .wrapper {
11    margin-bottom: 4em;
12  }
13
14  .header {
15    margin-bottom: 2em;
16  }
17
18  .main {
19    width: 100% - @ini_sidebar_percentage;
20  }
21
22  .sidebar {
23    width: @ini_sidebar_percentage;
24  }
25
26  .sidebar-aside {
27    width: 95%;
28    float: @ini_sidebar_position;
29  }
30}
31
32@media (max-width:@ini_tablet_width) {
33  .not-pc {
34    visibility: visible;
35  }
36
37  .wrapper-content {
38    display: flex;
39    flex-direction: column;
40  }
41
42  .sidebar-articleNav #dw__toc {
43    border-bottom: none;
44    margin-bottom: 0;
45  }
46
47  .sidebar {
48    padding: 2em 0;
49  }
50
51  .sidebar-breadcrumbs {
52    display: none;
53  }
54
55  h3.sidebar-title {
56    font-size: 100%;
57  }
58
59  .pc-only {
60    display: none;
61  }
62
63  .nav-for-device {
64    width: 100%;
65    display: block;
66    background-color: #eee;
67    overflow: hidden;
68    box-shadow: 0 5px .5px -5px rgba(0, 0, 0, .3) inset,0 -5px 3px -5px rgba(0, 0, 0, .3) inset;
69    display: none;
70  }
71
72  .nav-for-device ul {
73    font-size: 90%;
74    list-style: none;
75    margin: 0;
76    padding: 0;
77  }
78
79  .nav-for-device li {
80    border-top: 1px #ddd solid;
81    text-align: center;
82    margin: 0;
83  }
84
85  .nav-for-device li.user {
86    font-weight: bold;
87  }
88
89  .nav-for-device a {
90    display: block;
91    height: 100%;
92    padding: .5em 0;
93  }
94
95  .nav-for-device .user {
96    background-color: #e6e6e6;
97    padding: .5em 0;
98  }
99
100  .nav-for-device a:hover {
101    border: none;
102  }
103
104  .header-navButton--searchBar {
105    height: auto;
106    width: 90%;
107    display: block;
108    margin: 20px auto;
109    overflow: hidden;
110    border-radius: 3px;
111  }
112
113  .header-navButton {
114    transition: all .5s;
115    background-color: transparent;
116    cursor: pointer;
117  }
118
119  .header-nav.not-pc .icon-cube {
120    font-size: 120%;
121    line-height: 1.5;
122  }
123
124  .header-navButton.is-active {
125    background-color: #eee;
126    box-shadow: 5px 0 5px -5px rgba(0, 0, 0, .3) inset;
127  }
128
129  .header-navButton--searchBar form#dw__search {
130    width: 100%;
131  }
132
133  .header-navButton--searchBar .no {
134    display: flex;
135  }
136
137  .header-navButton--searchBar [class^='icon'] {
138    top: 0px;
139    right: 22px;
140  }
141
142  .header-navButton--searchBar button,
143  .header-navButton--searchBar input.button {
144    width: 80px;
145    height: 35px;
146    border-left: 5px #eee solid;
147    outline: none;
148  }
149
150  .dokuwiki input#qsearch__in {
151    width: calc(100%) !important;
152  }
153
154  .footer {
155    font-size: .8em;
156  }
157
158  .footer-content {
159    height: 5.5em;
160  }
161
162  .detail-img, .detail-meta {
163    width: 100%;
164  }
165}
166
167@media (max-width:@ini_phone_width) {
168  .dokuwiki {
169    min-width: 305px;
170  }
171
172  .header-subTitle {
173    display: none;
174  }
175
176  .dokuwiki ul.admin_tasks {
177    width: 80%;
178  }
179}
180