@media screen and (max-width:767px) {

.drawer-hamburger {
	padding:10px .55rem 20px !important;
	width:2rem !important;
	background:rgba(26,42,94,0.85) !important; /* ネイビーに合わせて更新済み */
}

.drawer-overlay {
 background-color:rgba(235,215,193,.8) !important ;
}

.item {
  height: 2000px;
  padding-top: 4rem;
  padding-bottom: 4rem;
  text-align: center;
  color: #fff;
}

.bg-red {
  background-color: #F44336;
}

.bg-pink {
  background-color: #E91E63;
}

.bg-purple {
  background-color: #9C27B0;
}

.bg-indigo {
  background-color: #3f51b5;
}

.bg-blue {
  background-color: #2196F3;
}

.bg-cyan {
  background-color: #00bcd4;
}

.bg-teal {
  background-color: #009688;
}

.bg-green {
  background-color: #4caf50;
}

.bg-lime {
  background-color: #CDDC39;
}

.bg-amber {
  background-color: #FFC107;
}

.bg-deepOrange {
  background-color: #ff5722;
}

.drawer-menu {
	text-align:left;
}
.titleTx {
	padding:.75rem;
	color:#d59c39;
	font-weight:bold;
}
.readTx {
	margin-bottom:10px;
	padding:0 .75rem;
	font-size:90%;
	color:#fff;
}
.bt1 a {
	display:block;
	padding:15px 10px;
	border-top:1px solid #47628c;
	color:#fff;
	text-decoration: none;
}
.marginBox {
	display:block;
	padding:25px 10px;
}
.drawer-dropdown {
	border-top:1px solid #b84100;
}
.drawer-dropdown-menu li a {
	display:block;
	margin-left:10px;
	padding:10px 10px;
	color:#fff;
	text-decoration: none;
	background:#e65100;
}
.drawer-dropdown-menu li a.bt2 {
	border-top:1px solid #006291;
}
.drawer-dropdown-menu li a.btDummy {
	width:3em;
	background:#cccccc;
	pointer-events: none;
}

}


/* =====================================================
   sr-only 修正
   drawer.min.css では .sr-only が max-width:480px 内に
   閉じ込められており、481px〜767px で「toggle navigation」
   が表示されてしまうため、メディアクエリの外で上書き
   ===================================================== */
.sr-only {
	position: absolute;
	overflow: hidden;
	clip: rect(0,0,0,0);
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
}

/* =====================================================
   drawer.min.css のブレークポイント修正
   drawer.min.css は max-width:480px でしか効かないため、
   481px〜767px でもdrawerが正常動作するよう上書き
   ===================================================== */
@media screen and (min-width: 481px) and (max-width: 767px) {

	/* ドロワーナビ本体 */
	.drawer-open { overflow: hidden !important; }
	.drawer-nav {
		position: fixed;
		z-index: 2;
		top: 0;
		overflow: hidden;
		width: 16.25rem;
		height: 100%;
		color: #fff;
		background-color: #1a2a5e; /* ネイビーに合わせて変更 */
	}

	/* オーバーレイ */
	.drawer-overlay {
		position: fixed;
		z-index: 1;
		top: 0;
		left: 0;
		display: none;
		width: 100%;
		height: 100%;
	}
	.drawer-open .drawer-overlay { display: block; }

	/* ハンバーガーボタン */
	.drawer-hamburger {
		position: fixed;
		z-index: 4;
		top: 0;
		display: block;
		box-sizing: content-box;
		width: 2rem !important;
		padding: 10px .55rem 20px !important;
		transition: all .6s cubic-bezier(.19,1,.22,1);
		transform: translateZ(0);
		border: 0;
		outline: 0;
		background: rgba(26,42,94,0.85) !important;
		cursor: pointer;
	}

	/* ハンバーガーアイコン（三本線） */
	.drawer-hamburger-icon {
		position: relative;
		display: block;
		margin-top: 10px;
	}
	.drawer-hamburger-icon,
	.drawer-hamburger-icon:after,
	.drawer-hamburger-icon:before {
		width: 100%;
		height: 2px;
		transition: all .6s cubic-bezier(.19,1,.22,1);
		background-color: #fff;
	}
	.drawer-hamburger-icon:after,
	.drawer-hamburger-icon:before {
		position: absolute;
		top: -10px;
		left: 0;
		content: " ";
	}
	.drawer-hamburger-icon:after { top: 10px; }

	/* 開いたときのアイコン → × に変形 */
	.drawer-open .drawer-hamburger-icon { background-color: transparent; }
	.drawer-open .drawer-hamburger-icon:after,
	.drawer-open .drawer-hamburger-icon:before { top: 0; }
	.drawer-open .drawer-hamburger-icon:before { transform: rotate(45deg); }
	.drawer-open .drawer-hamburger-icon:after  { transform: rotate(-45deg); }

	/* 右スライドの挙動 */
	.drawer--right .drawer-nav {
		right: -16.25rem;
		transition: right .6s cubic-bezier(.19,1,.22,1);
	}
	.drawer--right .drawer-hamburger,
	.drawer--right.drawer-open .drawer-nav,
	.drawer--right.drawer-open .drawer-navbar .drawer-hamburger { right: 0; }
	.drawer--right.drawer-open .drawer-hamburger { right: 16.25rem; }

}