@media only screen and (max-width: 769px) {/* 767px */	


.navbar, .pretty.navbar {
	position: relative;
	background: transparent;
	border: none;
	text-align: center;
  }
  
  
  .navbar a.toggle {
	position: relative;
	float: right;
	display: inline-block;
	right: 10px; /* Move me around */
	top: -40px; /* Move me around */
	background: #2c455b;
	width: 42px;
	height: 36px;
	line-height: 42px;
	border-radius: 4px;
	-webkit-transition-duration: .1s;  /* Saf3.2+, Chrome */
	-moz-transition-duration: .1s;  /* FF4+ */
	-ms-transition-duration: .1s;  /* IE10 */
	-o-transition-duration: .1s;  /* Opera 10.5+ */
	transition-duration: .1s;
  }
  

  
  .navbar a.toggle:hover, .navbar a.toggle.active {
	background: #2c4c6f;
	-webkit-box-shadow: none;
	box-shadow: none;
	-webkit-transition-duration: .1s;  /* Saf3.2+, Chrome */
	-moz-transition-duration: .1s;  /* FF4+ */
	-ms-transition-duration: .1s;  /* IE10 */
	-o-transition-duration: .1s;  /* Opera 10.5+ */
	transition-duration: .1s;
  }
  
  .navbar a.toggle.active {
	background: #2c4c6f;
  }
  
  .navbar ul {
	position: absolute;
	width: 93.75%;
	height: 0;
	max-height: 0;
	top: 0;
	right: 3.125%;
	overflow: hidden;
	display: inline-block;
	
	background: #2c455b;
	border-radius: 4px;

	-webkit-transition-duration: .2s;  /* Saf3.2+, Chrome */
	-moz-transition-duration: .2s;  /* FF4+ */
	-ms-transition-duration: .2s;  /* IE10 */
	-o-transition-duration: .2s;  /* Opera 10.5+ */
	transition-duration: .2s;
	
	-webkit-box-shadow: 0px 3px 4px rgba(0,0,0,.3);
	box-shadow: 0px 3px 4px rgba(0,0,0,.3);
  }
  
  .navbar ul.active {
	width: 93.75%;
	height: auto;
	max-height: 600px;
	z-index: 999;
	-webkit-transition-duration: .5s;  /* Saf3.2+, Chrome */
	-moz-transition-duration: .5s;  /* FF4+ */
	-ms-transition-duration: .5s;  /* IE10 */
	-o-transition-duration: .5s;  /* Opera 10.5+ */
	transition-duration: .5s;
  }
  
  .navbar ul li {
	display: block;
	width: 100%;
	border-right: 0 !important;
	-webkit-box-shadow: none;
	box-shadow: none;
  }
  
  .pretty.navbar ul li {
	-webkit-box-shadow: none;
	box-shadow: none;
  }

  .navbar ul li > a {
		font-size: 14px !important;
		font-size: 1.4rem;
		border: 1px solid #858585;
		background: #fff; /* Old browsers */
		padding-top: 3px;
		padding-bottom: 3px;
  }
  
  .navbar > ul > li .field {
	padding-top: 10px;
	padding-bottom: 10px;
	width: 90%;
  }
  
  .navbar > ul > li .search {
	border: 1px solid #bbb;
	-webkit-box-shadow: inset 0 1px 3px #ccc;
	box-shadow: inset 0 1px 3px #ccc;
	background-color: #fff;
  }
  
  .navbar li a:hover, .navbar > ul > li:first-child, .navbar > ul > li:first-child a:hover, .navbar > ul > li:last-child, .navbar > ul > li:last-child a:hover {	
	-webkit-box-shadow: none;
	box-shadow: none;
  }
  
  .navbar > ul > li:last-child, .navbar > ul > li:last-child a:hover {
	border-right: none;
  }
  
  .navbar li:first-child a {
	border-radius: 4px 4px 0 0 !important;
  }
  
  .navbar li:last-child a {
	border-radius: 0 0 4px 4px !important;
  }
  
  .navbar li:hover .dropdown {
	display: none;
  }
  
  .navbar ul li > a {
	background: transparent;
	border: none;
	color: #fff;
	font-size: 14px;
	font-size: 1.4rem;
	border-bottom: 1px solid #ccc;
	border-radius: none;
	text-shadow: none;
  }
  
  .navbar ul li:hover > a {
	background: #4a6984;
	border-right: none;
	-webkit-box-shadow: none !important;
	box-shadow: none !important;
  }
  
  .pretty.navbar {
	
	border-radius: 0;
  }
  
  .pretty.navbar ul li .btn {
	margin-top: 20px;
  }
  
  #flex_show {
  display: block;
  margin-top: -35px !important;
  }
  
  
  
.field_wide {
	display: none;
}
#search_disp {
	display: block;
	
}
  
  
}

/* タブレットレイアウト : 481 px ～ 768 px。モバイルレイアウトからスタイルを継承。 */

@media only screen and (min-width: 481px) {
#header {
	width: 100%;
	padding-left: 0;
	padding-right: 0;
	margin: auto;
}

.field_wide {
	float: right;
}

	
.sf-menu li a {
	border-top: 1px solid #fff;

}



#footer {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
}

/* デスクトップレイアウト : 769 px ～最大 1232 px。モバイルレイアウトとタブレットレイアウトからスタイルを継承。 */

@media only screen and (min-width: 769px) {
li.top {
width: 12.6%;
}
}