
/*-------------------- ▼共通CSS▼ ------------------------*/

.hamburgerWrap{
	width: 48px;
	position: fixed;
	height: 0;
	padding-bottom: 48px;
	right: 0;
	top: -5px;
	background: none;
	z-index: 10000;
	box-sizing:border-box;
}
.hamburger {
    display: block;
    width: 24px;
    height: 24px;
    padding: 17px 24px 25px;
    position: fixed;
    top: 9px;
    right: 13px;
    z-index: 10000;
    -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;
	transition: .3s;
	animation: rotateX-anim 0.3s linear;
}
.hamburger.active{
	animation: rotateY-anim 0.3s linear;
}
/*
@keyframes rotateY-anim {
	0% {
		transform: rotateY(0deg);
	}

	100% {
		transform: rotateY(360deg);
	}
}
@keyframes rotateX-anim {
	0% {
		transform: rotateY(360deg);
	}

	100% {
		transform: rotateY(0deg);
	}
}
*/
.message_1::after {
	content: "メニュー";
	font-size: 10px;
	width: 170%;
	display: block;
	position: absolute;
	left: auto;
	top: 153%;
	color: #fff;
	right: -37%;
	font-weight: bold;
	text-align: center;
}

.android .message_1::after {
	content: "メニュー";
	font-size: 10px;
	width: 170%;
	display: block;
	position: absolute;
	left: auto;
	top: 153%;
	color: #fff;
	right: -20%;
	font-weight: bold;
	text-align: center;
}

.message_2::after {
	content: "閉じる";
	font-size: 10px;
	width: 167%;
	display: block;
	position: absolute;
	left: auto;
	top: 153%;
	color: #fff;
	right: -34%;
	font-weight: bold;
	text-align: center;
}

.android .message_2::after {
	content: "閉じる";
	font-size: 10px;
	width: 167%;
	display: block;
	position: absolute;
	left: auto;
	top: 153%;
	color: #fff;
	right: -25%;
	font-weight: bold;
	text-align: center;
}

.android .message_1::after{
	width:4.2em;
}

.android .message_2::after{
	width:4.05em;
}


.hamburger__icon {
  position: relative;
  /*margin-top: 7px;
  margin-bottom: 7px;*/
	margin: auto;
}
.hamburger__icon, .hamburger__icon_before, .hamburger__icon_after {
  /*display: block;*/
  background-color: #ffffff;
  -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: "";
	left: 0;
	right: 0;
	margin: auto;
}
.hamburger__icon_before {
  top:13px;
}
.hamburger__icon_after {
  bottom:20px;
}
.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(7px);
  -ms-transform: translateY(7px);
  -webkit-transform: translateY(7px);
  transform: translateY(7px);
}
.hamburger.active .hamburger__icon_after {
  -moz-transform: translateY(-7px);
  -ms-transform: translateY(-7px);
  -webkit-transform: translateY(-7px);
  transform: translateY(-7px);
}

.fat-nav {
  top: 57px;
  left: 0;
  z-index: 9999;
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  background: rgba(255,255,255,0.98);
  /*-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;
  transform: scale(.8);
  transform-origin: top;
}
.fat-nav__wrapper {
  width: 100%;
  height: 100%;
  /*display: table;
  table-layout: fixed;*/
  display: block;
}
.fat-nav.active {
 /* -moz-transform: scale(1);
  -ms-transform: scale(1);
  -webkit-transform: scale(1);
  transform: scale(1);*/
  transform: scale(1.0);
}
.fat-nav .sp_iphone {
  /*display: table-cell;
  vertical-align: middle;
  margin: 0;
  padding: 0;*/
	height: auto!important;
  transform: translateY(0)!important;
}
.fat-nav li {
  /*list-style-type: none;
  text-align: center;
  padding: 10px;
  font-size: 2em;*/
}
.fat-nav li, .fat-nav li a {
	/*color: #fff;*/
}
.fat-nav li a {
	text-decoration: none;
	padding-top: 4%;
	text-align: left;
	font-weight: 500;
}
.fat-nav li:nth-child(1) a {
	padding-top: 0;
}
.fat-nav li:last-child a {
}
/*-------------------- ▲共通CSS▲ ------------------------*/

/*---------------- ▼PCのみCSS▼ --------------------*/
@media print, screen and (min-width:769px){
	.hamburgerWrap,
	.hamburger{
		display:none;
	}
}
/*---------------- ▲PCのみCSS▲ --------------------*/
/*---------------- ▼タブレット以降CSS▼ --------------------*/
@media screen and (max-width:768px){
	.hamburger__icon,
	.hamburger__icon_before,
	.hamburger__icon_after {
		width:28px;
		background:#082253;
		height:3px;
		/*width: 3px;
		background: #2d2d2d;
		height: 20px;*/
	}
	.hamburger__icon {
		left: 9px;
		top:20px;
	}
	.hamburger.active .hamburger__icon_before {
		top:22px;
		margin-top:-1px;
		-moz-transform:rotate(-45deg);
		-ms-transform:rotate(-45deg);
		-webkit-transform:rotate(-45deg);
		transform:rotate(-45deg);
		background: #082253;
		left: -1px;
	}
	.hamburger.active .hamburger__icon_after {
		bottom:20px;
		margin-bottom:-2px;
		-moz-transform:rotate(45deg);
		-ms-transform:rotate(45deg);
		-webkit-transform:rotate(45deg);
		transform:rotate(45deg);
		background: #082253;
		right: 1px;
	}

#g_nav {
    /*margin-top: 47px;*/
}
.hamburger__icon_after {
    /*bottom: 11px;*/
	bottom: 10px;
	height: 3px;
}
.hamburger__icon {
    top: 3px;
    left: -14px;
	display: block;
}
.hamburger__icon_before {
    /*top: 12px;*/
	top: 11px;
}
}
/*---------------- ▲タブレット以降CSS▲ --------------------*/
/*---------------- ▼タブレットのみ（800～481）CSS▼ --------------------*/
@media screen and (max-width:800px) and (min-width:481px) {
}
/*---------------- ▲タブレットのみ（800～481）CSS▲ --------------------*/
/*---------------- ▼スマホ以降CSS▲ --------------------*/
@media screen and (max-width:480px){
	/*.hamburger__icon,
	.hamburger__icon_before,
	.hamburger__icon_after {
		height:1px;
	}
	.hamburger__icon {
		position: absolute;
		left: 9px;
		top:20px;
	}
	.hamburger.active .hamburger__icon_before {
		margin-top:-1px;
	}
	.hamburger.active .hamburger__icon_after {
		margin-bottom:-1px;
	}
 */ 
}
/*---------------- ▲スマホ以降CSS▲ --------------------*/
/*---------------- ▲スマホ最小CSS▲ --------------------*/
@media screen and (max-width:320px){
}
/*---------------- ▲スマホ最小CSS▲ --------------------*/

