viewportの設定について

viewportの設定について質問です。

現在、webサイト制作してまして、モバイル全体 → タブレット768px以上 → pc用1024pxといった順序で作成しています。
そこで質問なのですが、クローム検証とviewportのブレイクポイントが一致しません。

イメージとして下記の画像のような状態です。

これは自分のstylesheetの記述が原因なのでしょうか？

長文になってしまうのですがコードも載せておきます。

css
1@charset "utf-8";
2html,body,h1,h2,h3,h4,dl,dt,dd,ul,li,p{
3    padding: 0;
4    margin: 0;
5    line-height: 1.5;
6    font-family: 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
7}
8/*font-size*/
9html{font-size:62.5%;} /*10px*/
10body{
11 font-size:16px;
12 font-size:1.6rem;}/*16px*/
13h1 {
14 font-size: 32px;
15 font-size: 3.2rem;
16}
17h2 {
18 font-size: 24px;
19 font-size: 2.4rem;
20  padding:12px 0;
21  background-color: #f6f6f6;
22  box-shadow: 0 2px 6px rgba(0, 0, 0, .35);
23}
24h3 {
25 font-size: 20px;
26 font-size: 2.0rem;
27  border-bottom: 3px dotted gray;
28  padding:12px 0;
29}
30h4 {
31 font-size: 18px;
32 font-size: 1.8rem;
33  padding:12px 0;
34}
35p {
36 font-size: 16px;
37 font-size: 1.6rem;
38}
39
40img{ 
41 width:100%;
42}
43
44html {
45	font-size: 62.5%;
46}/*=10px*/
47body {
48	font-size: 16px;
49	font-size: 1.6rem;
50    position:relative;
51} /*16px*/
52
53header,#navi,#contents,#petHotel,#access,footer
54{width:100%;}
55
56#container{
57 width:90%;
58 margin:0 auto;
59}
60
61/*header*/
62header{
63 text-align:center;
64 padding-top:24px;
65 background:url(../img/bg_color2.jpg);
66 }
67.h1_logo{
68 width:30%;
69 height:30%;
70}
71#header_wrapper2{
72 padding:24px 0;
73}
74p.title{
75 font-size:2em;
76 font-weight:bold;
77 margin-bottom:12px ;
78 font-family:'Hiragino Maru Gothic Pro';
79}
80#info_header{
81 display:none;
82}
83
84/*navi*/
85ul{list-style:none;}
86a{text-decoration:none;}
87#navi{
88 overflow:hidden;
89 margin-bottom:30px;
90 background: -webkit-linear-gradient
91 ( 0%,#64F0F0 50%,#C1EDEF 51%,#32EAEA 100%)
92}
93#navi ul li{
94 width:50%;
95 float:left;
96 border-left:3px solid #fff;
97 border-bottom:3px solid #fff;
98 box-sizing:border-box;
99 background: -webkit-linear-gradient(
100    top,
101    #ebf6f7 0%,
102    #C1EDEF 49%,
103    #C1EDEF 51%,
104    #4FEDED 100%
105  );
106}
107
108#navi ul li a{
109 display:block;
110 padding:12px 0;
111 text-align:center;
112 white-space:nowrap;
113 color:black;
114 text-shadow:0 1px 0 gray;
115}
116#navi li a:hover{opacity:0.5;}
117
118/*#contents*/
119#contents{
120 overflow:hidden;
121 width:90%;
122 margin:0 auto;
123 text-align:center;
124}
125#contents > h3{margin:12px 0;}
126#contents .topimg{
127 float:right;
128 margin-bottom:12px;
129}
130p.contents_main{
131 margin-bottom:12px;
132 text-indent:1em;
133 text-align:left;
134}
135p.contents_indent{
136 text-indent:1em;
137 text-align:left;
138}
139
140/*#content_wrapper*/
141#contents_wrapper{
142 overflow:hidden;
143 margin-bottom:24px;
144}
145
146/*.contents_box1{
147  width:420px;
148  float:left;
149  overflow:hidden;
150}
151.contents_box2{
152 width:420px;
153 float:right;
154 overflow:hidden;
155}*/
156
157/*料金表 #price*/
158#price{
159 width:90%;
160 margin:0 auto;
161 text-align:center;
162}
163#price>h2{margin-bottom:24px;}
164/*#trimming*/
165.trimming_table{
166 width:100%;
167 height:30px;
168 line-height:3.0;
169 margin:0 auto;
170 margin-bottom:30px;
171}
172.trimming_table .status1{
173 background:#b0f6f6;
174} 
175.trimming_table .status2{
176 background:#ecf9fa;
177}
178.option_table .status1{
179 background:#b0f6f6;
180}
181.hotel_table .status1{
182 background:#b0f6f6;
183}
184caption{
185 font-weight:bold;
186 font-size:1.2em;
187}
188
189/*#wrapper*/
190#trimming_wrapper{
191 overflow:hidden;
192 width:100%;
193 margin:0 auto;
194 margin-bottom:30px;
195}
196/*#option*/
197.option_table{
198 width:100%;
199 height:30px;
200 line-height:3.0;
201}
202/*hotel*/
203.hotel_table{
204 width:100%;
205 height:30px;
206 line-height:3.0;
207 float:right;
208}
209
210/*#pethotel*/
211#petHotel{
212 overflow:hidden;
213 text-align:center;
214 width:90%;
215 margin:0 auto;
216 margin-bottom:30px;
217}
218#petHotel>h3{margin-bottom:12px;}
219#petHotel .Hotel_img{
220 margin-bottom:12px;
221}
222#petHotel_wrapper{
223 overflow:hidden;
224}
225#petHotel img{
226 float:right;
227 margin-left:15px;
228}
229#petHotel_wrapper>p{text-align:left;}
230#petHotel>ul li{
231 text-align:left;
232 line-height:2.5;
233 }
234.anchor_price{
235 font-weight:bold;
236 color:black;
237 padding:6px;
238 background:#b0f6f6;
239}
240.anchor_price:hover{
241 color:pink;
242}
243
244/*#access*/
245#access{
246 width:90%;
247 text-align:center;
248 margin:0 auto;
249 margin-bottom:24px;
250}
251#access_wrapper{
252 overflow:hidden;
253 width:100%;
254}
255.access_local{
256 width:100%;
257 float:right;
258}
259.access_local>dl>dt{
260 background:#ffd4e9;
261 font-weight:bold;
262 padding:20px 0;
263 padding-right:20px;
264}
265.access_local>dl>dd{
266 padding:20px 0;
267}
268.gmap{
269 float:left;
270}
271
272/*topへ戻る*/
273#pageTop {
274  position: fixed;
275  bottom: 30px;
276  right: 30px;
277}
278#pageTop a:hover {
279  text-decoration: none;
280  opacity: 0.7;
281}
282
283/*footer*/
284footer{
285 width:100%;
286 overflow:hidden;
287 background:url(../img/bg_color2.jpg);
288}
289#footer_wrapper{
290 width:80%;
291 margin:0 auto;
292 padding:24px 0;
293 overflow:hidden;
294}
295footer ul li{
296 width:25%;
297 float:left;
298 border-right:1px solid gray;
299 box-sizing:border-box;
300}
301footer ul li:last-child{
302 border-right:none;
303}
304footer ul li a{
305 font-size:0.9em;
306 display:block;
307 text-align:center;
308 color:black;
309 text-shadow:0 1px 0 gray;
310}
311footer li a:hover{opacity:0.5;}
312footer>p{
313 text-align:center;
314 }
315
316@media screen and (min-width: 768px){
317 #navi,#contents,#petHotel,#access,footer{
318  text-align:left;
319 }
320 /*font*/
321 h2{padding-left:6px;}
322 /*navi*/
323 #navi ul li{
324  width:25%;
325 }
326 /*header*/
327 .h1_logo{
328 width:20%;
329 height:20%;
330}
331/*#access*/
332.access_local dl{
333 width:100%;
334}
335.access_local>dl>dt{
336 float:left;
337 clear:left;
338 background:none;
339 border-bottom:1px dotted gray;
340 width:20%;
341 padding-right:0;
342}
343.access_local>dl>dd{
344 border-bottom:1px dotted gray;
345 float:right;
346 width:80%;
347}
348.gmap{
349 float:left;
350}
351
352
353/*footer*/
354footer p{
355 text-align:center;
356 }
357}
358
359@media screen and (min-width: 1024px){
360 #container{
361  width:1024px;
362 }
363}