#header{
  background-color:rgba(255,255,255,1);
  width:100%;
  display: flex;
  position:fixed;
  -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all  0.7s ease;
	top:0;
	left:0;
	z-index:999999;
}

#header.topscroll{
    background-color:rgba(255,255,255,1) !important;
	 -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all  0.7s ease;
}



 .logo {
   padding:20px 0 20px 40px;
   margin::0;
	
  }

.logo img{
	height:60px;
}

.nav-button {
  display: none;
}
 .nav a {
    color: #fff;
    text-decoration: none;
    font-size: 18px;
	
	-webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all  0.7s ease;
	position: relative;
  }
  
  .nav a:hover {
	  color: #FFFF66;
    text-decoration: none;
  -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all  0.7s ease;
}
  .nav a::after {
  position: absolute;
  bottom: -12px;
  left: 0;
  content: '';
  width: 100%;
  
  visibility: hidden;
  transition: .3s;
  border:solid 2px #FFF;
  border-radius: 5px; 
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px; 
}
.nav a:hover::after {
  bottom: -16px;
  opacity: 1;
  visibility: visible;
}

  a.topscroll_a{
	   color: #222 !important;
	   -webkit-transition: all 0.7s ease;
    	-moz-transition: all 0.7s ease;
    	-o-transition: all 0.7s ease;
    	transition: all  0.7s ease;
  }
  a.topscroll_a:hover {
	  color: #3399CC !important;
    text-decoration: none;
  -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all  0.7s ease;
}
    
  .nav a.topscroll_a::after {
  position: absolute;
  bottom: -12px;
  left: 0;
  content: '';
  width: 100%;
  
  visibility: hidden;
  transition: .3s;
  border:solid 2px #3399CC;
  border-radius: 5px; 
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px; 
}
.nav a.topscroll_a:hover::after {
  bottom: -16px;
  opacity: 1;
  visibility: visible;
}
  
  .nav li {
    display: inline-block;
    margin: 0 10px;
	
  }

.nav-wrap{
	
	position:absolute;
	top:20px;
	right:10px;	
}

 .nav_banner{
	 
	 display: none;
 }

.nav-wrap ul{
	margin:15px 10px 10px 0;
	
}

.nav-wrap.open {
  display: block;
}
.nav-wrap.close {
  display: none;
}


@media screen and (min-width: 1069px) {
  .nav-wrap {
    display: block !important;
  }
  
  
}

.top-image{
	width:100%;
	/*height:100vh;
	background:url(img/bg.jpg);
	background-size: cover;
	background-repeat: no-repeat;*/
}


.main {
		padding-top:0;
}

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

 .logo {
   padding:25px 0 25px 40px;
   margin::0;
	
  }

.logo img{
	height:50px;
}

}

@media screen and (max-width: 1068px) {
	
	.logo {
   padding:15px 0 15px 10px;
	
  }
	
  .logo img{
	height:50px;
}
  .nav-button {
    display: block;
    cursor: pointer;
  }
  .nav-wrap {
    position: fixed;
    left: 0;
    top: 0;
    display: none;
    z-index: 10;
    background-color: rgba(0, 0, 0, 0.7);
    width: 100%;
    height: 100%;
  }
  
  
   .nav_banner{
	 display:block !important;
	 text-align:center;
	 width:100%;
 }
  .nav_banner img{
	  width:100%;
	  max-width:280px;
	  margin:0 auto;
  }
  
	.nav {
      padding-top:70px;
      height: 100%;
      position: relative;
      overflow-x: hidden;
      overflow-y: auto;
	  
    }
	
	.nav ul{
		
	 margin:0;
	 padding:0;	
	}
    .nav li {
      display:inline-block;
      margin: 10px 1%;
	  width:46%;
	  border:1px solid #FFF;
	}
	
	/*.nav li:nth-last-child(2) {
      display:inline-block;
      margin: 2% 2%;
	  width:95%;
	  border:1px solid #FFF;
	}*/
	
	.nav li:first-child {
      display:inline-block;
      margin: 2% 0;
	  width:100%;
	  padding:0;
	  border:none;
	}
	
	.nav li:last-child {
      display:inline-block;
      margin: 2% 0;
	  width:100%;
	  padding:0;
	  border:none;
	}
	
    .nav li  a {
        color: #fff;
        font-size: 14px;
		padding:0 1em;
	height:50px;
	line-height: 50px;
	display:block;
     }
	 
	  .nav li a:hover {
	  color: #006699 !important;
	  background-color:#FFF;
}

.nav li:last-child a {
	  padding:0;
}
.nav li:last-child a:hover {
	  background-color:inherit;
}

  .nav a::after {
  
  border:none !important;
}


	
    a.topscroll_a{
	   color: #FFF !important;
    }
  
   a.topscroll_a:hover{
	   color: #222 !important;
    }
  
   .nav a.topscroll_a::after {
  		border:none !important;
	}
.nav a.topscroll_a:hover::after {
  bottom: -16px;
  opacity: 1;
  visibility: visible;
}
  
  
  .main {
		padding-top:0;
	}
  /*メニューボタンのエフェクト*/
  .nav-button,
  .nav-button span {
    display: inline-block;
    transition: all 0.4s;
    box-sizing: border-box;
  }
  .nav-button {
    z-index: 20;
    position:absolute;
    width: 40px;
    height: 36px;
	top:17px;
	right:10px;
  }
  .nav-button span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 4px;
    background-color: #fff;
    border-radius: 4px;
	 -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all  0.7s ease;
  }
  
  span.topscroll_span {
	background-color: #222 !important;
	 -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all  0.7s ease;
  }
  
  
  
  .nav-button span:nth-of-type(1) {
    top: 0;
  }
  .nav-button span:nth-of-type(2) {
    top: 16px;
  }
  .nav-button span:nth-of-type(3) {
    bottom: 0;
  }
  .nav-button.active span:nth-of-type(1) {
    -webkit-transform: translateY(16px) rotate(-45deg);
    transform: translateY(16px) rotate(-45deg);
	background-color: #fff !important;
  }
  .nav-button.active span:nth-of-type(2) {
    opacity: 0;
  }
  .nav-button.active span:nth-of-type(3) {
    -webkit-transform: translateY(-16px) rotate(45deg);
    transform: translateY(-16px) rotate(45deg);
	background-color: #fff !important;
  }
}

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

	
	.logo {
   padding:20px 0 20px 10px;
	
  }
	
  .logo img{
	height:40px;
}

}

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

    .nav li  a {
        color: #fff;
        font-size: 12px !important;
		padding:0 .5em;
	height:50px;
	line-height: 50px;
	display:block;
     }
	
}

@media only print {
#header{
  background-color:rgba(255,255,255,1);
  width:100%;
  display: flex;
  position:absolute;
  -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all  0.7s ease;
	top:0;
	left:0;
	z-index:999999;
}
}