.hamburger {
  display: block;
  width:40px;
  height:45px;	
  position: fixed;
  top: 10px;	
  right: 5px;
  z-index: 1;
  /*padding: 15px;*/
  padding:5px 0px 50px 0;	
  -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;
  border-radius: 7px;
}
.hamburger__icon {
  position: relative;
  margin-top: 15px;
  margin-bottom: 7px;
}
.hamburger__icon, .hamburger__icon:before, .hamburger__icon:after {
  display: block;
  width: 30px;
  height: 2px;
  background-color: var(--sub-color);
  -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;	
}
/*ハンバーガーアイコンスクロールしたら色変える*/
._on .hamburger__icon, ._on  .hamburger__icon:before, ._on .hamburger__icon:after {
  background-color: var(--sub-color);
}

.hamburger__icon:before, .hamburger__icon:after {
  position: absolute;
  content: "";
	right: 0;
}
.hamburger__icon:before {
  top: -10px;
	width: 40px;
}
.hamburger__icon:after {
  top: 10px;
	width: 20px;
	
}
.hamburger.active .hamburger__icon {
  background-color: transparent;
}
.hamburger.active .hamburger__icon:before, .hamburger.active .hamburger__icon:after {
  background-color: #ffffff;
}
.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(45deg);
	width: 30px;
  top: -7px;
  right: 3px;
}
.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(-45deg);
	width: 30px;
  top: 10px;
  right: 3px;
}
/*ハンバーガメニュー下の文字*/
.sp_hd_cap{
	position: fixed;
	width:72px;
	height: 20px;
	top: 47px;
	right: 0;
	font-size: 1.2rem;
	color: var(--font-color);
	z-index: 10001;
}
.open:after{
	content:"MENU";
	padding-left: 20px;
}
.close:after{
	color: #ffffff;
	content:"CLOSE";
	padding-left: 20px;
}
/*ハンバーガメニュー下の文字スクロールしたら色変える*/
.sp_nav_on .open{
	color: var(--font-color);
}
.fat-nav {
  top: 0px;
  left: 0;
  z-index:9999;
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  background: var(--main-color);
  -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;
  background-image: url("../images/common/png_02.png");
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: min(100%,800px) auto;
}
.fat-nav__wrapper {
  width: 100%;
  height: 90%!important;
  /*table-layout: fixed;*/
  /*display: flex;
  justify-content: center;
  flex-wrap: wrap;*/
  
  padding-bottom: 100px;
  
  
  /*background-color: aqua;*/
}
.fat-nav.active {
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -webkit-transform: scale(1);
  transform: scale(1);	
}
.fat_logo{
  margin: 45px 0 0 20px;
  /*background-color: red;*/
  
  img{
    width: min(70%,215px);
  }
}
.fat-nav__wrapper ul{
  font-size: 2.1rem;
	color: #ffffff;
  padding-top: 20px;
  /*background-color: blue;*/
  width: min(80%,160px);
  margin: 0 auto;
}
.fat-nav__wrapper ul a{
	color: #ffffff;
  display: block;
  font-weight: var(--SemiBold);
  text-shadow: 1px 1px 1px #333;
}
.fat-nav__wrapper ul li{
	padding: 17px 0;
  
}


li.u_text{
	position: relative;
  min-width: 6em;
  
}
li.u_text:before{
	position: absolute;
	width: 100%;
	font-size: 1.2rem;
	left: 0;
	bottom: 3px;
}
.u_01:before{
	content: "Home";
}
.u_02:before{
	content: "Message";
}
.u_03:before{
	content: "Company Profile";
}
.u_04:before{
	content: "Corporate History";
}
.u_05:before{
	content: "Pavement Milling";
}
.u_06:before{
	content: "Parabolic method";
}
.u_07:before{
	content: "Recruitment";
}
.u_08:before{
	content: "Access";
}
@media (min-width:768px){
.hamburger {
  right: 15px;
}
/*ハンバーガメニュー下の文字*/
.open:after{
	padding-left: 10px;
}
.close:after{
	padding-left: 10px;
}

}
  
  
  


@media (min-width:1280px){
.hamburger {
	display: none;	
}

/*ハンバーガメニュー下の文字*/
.sp_hd_cap{
	display: none;
	}
}
