@charset "utf-8";
/* CSS Document */
.top_mb_pict_menu_flex{
	position: fixed;
	display: flex;
	width: 100%;
	justify-content: flex-start;
	z-index: 100;
	background: #ffffff;
}
.top_mb_pict_menu_flex_a{
	width: 20%;
	background: #294c60;
	padding: 1.5% 3% 10px;
	box-sizing: border-box;
}
.top_mb_pict_menu_flex_a img{
	width: 100%;
	height: auto;
}
.top_mb_pict_menu_flex_a a{
	display: block;
	width: 100%;
}
.top_mb_pict_menu_flex_b{
	width: 20%;
	background: #294c60;
	padding: 1.5% 3% 10px;
	border-left: 1px #ffffff;
	box-sizing: border-box;
}
.top_mb_pict_menu_flex_b img{
	width: 100%;
	height: auto;
}
.top_mb_pict_menu_flex_b a{
	display: block;
	width: 100%;
}
.top_mb_pict_menu_flex_c{
	width: 20%;
	background: #969781;
	padding: 1.5% 3% 10px;
	box-sizing: border-box;
}
.top_mb_pict_menu_flex_c img{
	width: 100%;
	height: auto;
}
.top_mb_pict_menu_flex_c a{
	display: block;
	width: 100%;
}
.top_mb_pict_menu_flex_d{
	width: 20%;
	background: #938970;
	padding: 1.5% 3% 10px;
	box-sizing: border-box;
}
.top_mb_pict_menu_flex_d img{
	width: 100%;
	height: auto;
}
.top_mb_pict_menu_flex_d a{
	display: block;
	width: 100%;
}
.top_mb_pict_menu_flex_e{
	width: 20%;
		background: #323333;
		text-align: center;
		color: #ffffff;
		font-size: 1.7vw;
		line-height: 150%;
		letter-spacing: 0.1rem;
		font-family: "Noto Serif JP", serif;
	padding: 6% 0px 10px;
}
@media print, screen and (min-width: 835px) {
	
}
@media screen and (max-width: 834px) {
	/*header{
		position: fixed;
    background: rgba(255,255,255,1.0) !important;
		height: 80px !important;
		z-index: 999;
}*/
	.pc_menu_sld{
		padding: 75px 0px 0px;
	}
	#drawer-icon {
  cursor: pointer;
  display: inline-block;
  height: 50px;
  /*position: relative;*/
	position: fixed;
  width: 50px;
	left: 86.8%;
	padding-top: 10px;
		/*background: url("../img/mb_top_pict2/hum_unr_menu.png") top center;
		background-size: 100% auto;
	background-repeat: no-repeat;*/
}
	#drawer-icon span {
		top: 54%;
}
	#drawer-icon span {
	background:  #ffffff;
}
#drawer-icon span::before,
#drawer-icon span::after {
	background:  #ffffff;
}
#drawer-close {
	background: #ffffff;
}
}
@media screen and (max-width: 600px) {
	/*header{
		height: 70px;
		background: #ffffff;
}*/
	.pc_menu_sld{
		padding: 65px 0px 0px;
	}
	#drawer-icon {
  cursor: pointer;
  display: inline-block;
  height: 50px;
  /*position: relative;*/
	position: fixed;
  width: 40px;
	left: 86.3%;
	padding-top: 10px;
}
	#drawer-icon span {
		top: 58%;
}
	#drawer-icon span::before {
  margin-top: -30%;
}
#drawer-icon span::after {
  margin-top: 19%;
}
	.top_mb_pict_menu_flex_a{
	width: 20%;
	background: #294c60;
	padding: 2.5% 3% 10px;
	box-sizing: border-box;
}
	.top_mb_pict_menu_flex_b{
	width: 20%;
	background: #294c60;
	padding: 2.5% 3% 10px;
		border-left: solid 1px #ffffff;
	box-sizing: border-box;
}
	.top_mb_pict_menu_flex_c{
	width: 20%;
	background: #969781;
	padding: 2.5% 3% 10px;
	box-sizing: border-box;
}
	.top_mb_pict_menu_flex_d{
	width: 20%;
	background: #938970;
	padding: 2.5% 3% 10px;
	box-sizing: border-box;
}
	.top_mb_pict_menu_flex_e{
	width: 20%;
		background: #323333;
		text-align: center;
		color: #ffffff;
		font-size: 2.8vw;
		line-height: 150%;
		letter-spacing: 0.1rem;
		font-family: "Noto Serif JP", serif;
	padding: 11% 0px 10px;
}
}
@media screen and (max-width: 500px) {
		#drawer-icon {
  cursor: pointer;
  display: inline-block;
  height: 50px;
  /*position: relative;*/
	position: fixed;
  width: 40px;
	left: 85.3%;
	padding-top: 10px;
}
	#drawer-icon span {
		top: 48%;
}
}
@media screen and (max-width: 413px) {
	#drawer-icon {
  cursor: pointer;
  display: inline-block;
  height: 50px;
  /*position: relative;*/
	position: fixed;
  width: 40px;
	left: 84.5%;
	padding-top: 10px;
}
	#drawer-icon span {
		top: 45%;
}
	#drawer-icon span {
  height: 3.5%;
		margin: -3% 0 0 -42%;
}
#drawer-icon span::before,
#drawer-icon span::after {
  height: 95%;
}
#drawer-icon span::before {
  margin-top: -22%;
}
#drawer-icon span::after {
  margin-top: 19%;
}
}