@media screen and (min-width: 801px), print {

.hamburger {
	position:absolute;
	top:0;
	right:0;
	z-index:10000;
	width: 8vw;
	height: 65px;
	padding: 0px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-tap-highlight-color: transparent;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	background-color: #000;
	display: flex;
	align-items: center;
}
.hamburger__icon {
	position: relative;
	margin: auto;
	margin-top: 11px;
	margin-bottom: 11px;
}
.hamburger__icon, .hamburger__icon:before, .hamburger__icon:after {
	display: block;
	width: 4.6vw;
	max-width: 60px;
	height: 1px;
	background-color: #fff;
	-moz-transition-property: background-color, -moz-transform;
	-o-transition-property: background-color, -o-transform;
	-webkit-transition-property: background-color, -webkit-transform;
	transition-property: background-color, transform;
	-moz-transition-duration: 0.4s;
	-o-transition-duration: 0.4s;
	-webkit-transition-duration: 0.4s;
	transition-duration: 0.4s;
}
.hamburger__icon:before, .hamburger__icon:after {
	position: absolute;
	content: "";
	background-color: #fff;
}
.hamburger__icon:before {
	top: -11px;
}
.hamburger__icon:after {
	top: 11px;
}
.hamburger.active .hamburger__icon {
	background-color: transparent;
}
.hamburger.active .hamburger__icon:before, .hamburger.active .hamburger__icon:after {
	background-color: #fff;
}
.hamburger.active .hamburger__icon:before {
	-moz-transform: translateY(11px) rotate(45deg);
	-ms-transform: translateY(11px) rotate(45deg);
	-webkit-transform: translateY(11px) rotate(45deg);
	transform: translateY(11px) rotate(20deg);
}
.hamburger.active .hamburger__icon:after {
	-moz-transform: translateY(-11px) rotate(-45deg);
	-ms-transform: translateY(-11px) rotate(-45deg);
	-webkit-transform: translateY(-11px) rotate(-45deg);
	transform: translateY(-11px) rotate(-20deg);
}

.fat-nav {
	top: 0;
	left: 0;
	z-index: 9999;
	position: fixed;
	display: none;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.9);
	-moz-transform: scale(1.4);
	-ms-transform: scale(1.4);
	-webkit-transform: scale(1.4);
	transform: scale(1.4);
	-moz-transition-property: -moz-transform;
	-o-transition-property: -o-transform;
	-webkit-transition-property: -webkit-transform;
	transition-property: transform;
	-moz-transition-duration: 0.4s;
	-o-transition-duration: 0.4s;
	-webkit-transition-duration: 0.4s;
	transition-duration: 0.4s;
	overflow-y: auto;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
}
.fat-nav__wrapper {
  width: 100%;
  height: 100%;
  display: table;
  table-layout: fixed;
}
.fat-nav.active {
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -webkit-transform: scale(1);
  transform: scale(1);
}
.fat-nav ul {
  display: table-cell;
  vertical-align: middle;
  margin: 0;
  padding: 0;
}

.fat-nav li {
	
}
.bnr img {
		width: 100%;
		height: auto;
	}	
.fat-nav .fat-nav__wrapper > ul{
	padding: 65px 5%;
	text-align: center;
}
	
.fat-nav .fat-nav__wrapper > ul > li {
	padding: 0 1%;
	width: calc(100% / 3);
	box-sizing: border-box;
	float: left;
}
.fat-nav .fat-nav__wrapper > ul > li:nth-of-type(n + 4){
	margin-top: 40px;
}
.fat-nav li.off {
	display: block;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	font-size: 22px;
	color: #212121;
	letter-spacing: 2px;
	line-height: 2em;
}
.fat-nav li a {
	display: block;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	font-size: 22px;
	color: #212121;
	letter-spacing: 2px;
	line-height: 2em;
}
.fat-nav .fat-nav__wrapper > ul > li > a:hover {
	color: #4f8fcd;
}
.fat-nav li span.cat_name {
	pointer-events: none;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	font-size: 22px;
	color: #fff;
	letter-spacing: 2px;
	line-height: 1.8em;
	height: 1.8em;
	display: block;
	margin-bottom: 15px;
	background-color: #0a9bcd;
}
	.fat-nav li:nth-of-type(2) span.cat_name,
	.fat-nav li:nth-of-type(5) span.cat_name{
		background-color: #6e3cbe;
	}
	.fat-nav li:nth-of-type(3) span.cat_name,
	.fat-nav li:nth-of-type(6) span.cat_name{
		background-color: #f06400;
	}
	
.fat-nav .menu_single {
	position:relative;
	width:60%;
	margin: 0 auto;
}
.fat-nav .menu_single .menu_second-level {	
	display:block !important;
	padding: 0;
}
	.fat-nav .menu_single.bnr .menu_second-level{
		width: 100%;
	}
	.fat-nav .menu_single .menu_second-level li {
		padding: 0;
		}
	.fat-nav .menu_single .menu_second-level li + li {
		margin-top: 5px;
		}
	.fat-nav .menu_single .menu_second-level li a {
		background-color: rgba(255,255,255,.85);
		font-size: min(1vw,14px);
		display:block;
		padding: 5px 0;
		position: relative;
		transition: 500ms;
		line-height: 1.5;
		}
	.fat-nav .menu_single.bnr .menu_second-level li a{
		padding: 0;
	}
	.fat-nav .menu_single .menu_second-level li a:hover {
		background-color: rgba(255,255,255,.0.4);
	}



}






/* スマホ */
@media only screen and (max-width: 800px) {
.hamburger {
	position:absolute;
	top:0;
	right:0;
	z-index:10000;
	max-width: 70px;
	width: 16vw;
	height: 50px;
	padding: 0px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-tap-highlight-color: transparent;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	background-color: #000;
	display: flex;
	align-items: center;
}
.hamburger__icon {
  position: relative;
  margin-top: 5px;
  margin-bottom: 5px;
}
.hamburger__icon, .hamburger__icon:before, .hamburger__icon:after {
	display: block;
	max-width: 40px;
	width: 11vw;
	height: 1px;
	margin: auto;
	background-color: #fff;
	-moz-transition-property: background-color, -moz-transform;
	-o-transition-property: background-color, -o-transform;
	-webkit-transition-property: background-color, -webkit-transform;
	transition-property: background-color, transform;
	-moz-transition-duration: 0.4s;
	-o-transition-duration: 0.4s;
	-webkit-transition-duration: 0.4s;
	transition-duration: 0.4s;
}
.hamburger__icon:before, .hamburger__icon:after {
  position: absolute;
  content: "";
  background-color: #fff;
}
.hamburger__icon:before {
  top: -8px;
}
.hamburger__icon:after {
  top: 8px;
}
.hamburger.active .hamburger__icon {
  background-color: transparent;
}
.hamburger.active .hamburger__icon:before, .hamburger.active .hamburger__icon:after {
}
.hamburger.active .hamburger__icon:before {
  -moz-transform: translateY(8px) rotate(45deg);
  -ms-transform: translateY(8px) rotate(45deg);
  -webkit-transform: translateY(8px) rotate(45deg);
  transform: translateY(8px) rotate(22deg);
}
.hamburger.active .hamburger__icon:after {
  -moz-transform: translateY(-8px) rotate(-45deg);
  -ms-transform: translateY(-8px) rotate(-45deg);
  -webkit-transform: translateY(-8px) rotate(-45deg);
  transform: translateY(-8px) rotate(-22deg);
}

.fat-nav {
  top: 0;
  left: 0;
  z-index: 9999;
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.9);
  -moz-transform: scale(1.4);
  -ms-transform: scale(1.4);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
  -moz-transition-property: -moz-transform;
  -o-transition-property: -o-transform;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -moz-transition-duration: 0.4s;
  -o-transition-duration: 0.4s;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}
.fat-nav__wrapper {
  width: 100%;
  height: 100%;
  display: table;
  table-layout: fixed;
}
.fat-nav.active {
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -webkit-transform: scale(1);
  transform: scale(1);
}
.fat-nav ul {
  display: table-cell;
  vertical-align: middle;
  margin: 0;
  padding: 0;
}

.fat-nav li {
	
}
.bnr img {
		width: 100%;
		height: auto;
	}	
.fat-nav .fat-nav__wrapper > ul{
	padding: calc(20% + 60px) 0 0;
	text-align: center;
}
	
.fat-nav .fat-nav__wrapper > ul > li {
	padding: 0;
}
.fat-nav .fat-nav__wrapper > ul > li + li {
	margin-top: 40px;
}
.fat-nav li.off {
	display: block;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	font-size: 22px;
	color: #212121;
	letter-spacing: 2px;
	line-height: 2em;
}
.fat-nav li a {
	display: block;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	color: #212121;
	letter-spacing: 2px;
	line-height: 2em;
}
.fat-nav .fat-nav__wrapper > ul > li > a:hover {
	color: #4f8fcd;
}
.fat-nav li span.cat_name {
	pointer-events: none;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	font-size: 18px;
	color: #fff;
	letter-spacing: 2px;
	line-height: 1.8em;
	height: 1.8em;
	display: block;
	margin-bottom: 15px;
	background-color: #0a9bcd;
}
	.fat-nav li:nth-of-type(2) span.cat_name,
	.fat-nav li:nth-of-type(5) span.cat_name{
		background-color: #6e3cbe;
	}
	.fat-nav li:nth-of-type(3) span.cat_name,
	.fat-nav li:nth-of-type(6) span.cat_name{
		background-color: #f06400;
	}
	
.fat-nav .menu_single {
	position:relative;
	width:90%;
	margin: 0 auto;
}
.fat-nav .menu_single .menu_second-level {	
	display:block !important;
	padding: 0;
}
	.fat-nav .menu_single.bnr .menu_second-level{
		width: 100%;
	}
	.fat-nav .menu_single .menu_second-level li {
		padding: 0;
		}
	.fat-nav .menu_single .menu_second-level li + li {
		margin-top: 5px;
		}
	.fat-nav .menu_single .menu_second-level li a {
		background-color: rgba(255,255,255,.85);
		font-size: 12px;
		display:block;
		padding: 5px 10px;
		position: relative;
		transition: 500ms;
		line-height: 1.5;
		}
	.fat-nav .menu_single.bnr .menu_second-level li a{
		padding: 0;
	}
	.fat-nav .menu_single .menu_second-level li a:hover {
		background-color: rgba(255,255,255,.0.4);
	}




}