@charset "UTF-8";

/*
CSS Document
Copyright (C) GLOBAL ASSET MOTIONS CO., LTD All Rights Reserved.
URL:www.glam.ne.jp
*/





/* ----------------------------------------------------------
  RESETTING DEFAULT
---------------------------------------------------------- */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{font-size:100%;}

body{
	margin-bottom: 60px;
}




.header {
  background-color: white;
  width: 100%;
  height: 70px;
 position: sticky;
  top: 0;
  left: 0;
  right: 0;
  z-index: 999;
}

.header__inner {
	padding: 3vh 5%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: inherit;
	position: relative;
}

.header__title{
	width: 80px;
	height: auto;
}

.header__title img{
	width: 100%;
	display: block;
}

.header__nav {
  position: absolute;
  transition: ease .4s; 
	height: 50vh;
	width: 200px;
	right: 5%;
	top: 5%;
	background-color: #140B00;
	transform: scale(0);
	border-radius: 8px;
	
}

.header__hamburger {
  width: 48px;
  height: 100%;
}

.hamburger {
  background-color: transparent; 
  border-color: transparent; 
  z-index: 9999;
}

.hamburger span {
  width: 100%;
  height: 2px;
  background-color: #000;
  position: relative;
  transition: ease .4s; 
  display: block;
}

.hamburger span:nth-child(1) {
  top: 10;
	width: 80%;
}

.hamburger span:nth-child(2) {
	top: 10%;
  margin: 8px 0;
	width: 50%;
}

.header__nav.active {
  /*transform: translateX(0);*/
	
	display: block;
	animation-name:PageAnime;
	animation-duration:.4s;
	animation-fill-mode:forwards;
	z-index: 999;
}

@keyframes PageAnime{
	0% {/*丸のスタート位置と形状*/
		transform: scale(0);
	
	}
	100% {/*丸の終了位置と形状*/
		transform: scale(1);
	}
}

.hamburger.active span:nth-child(1) {
  top: 5px;
  transform: rotate(45deg);
	width: 80%;
	background-color: #fff;
}


.hamburger.active span:nth-child(2) {
  top: -5px;
  transform: rotate(-45deg);
	width: 80%;
	background-color: #fff;
}

.nav-items {
  padding: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
	width: 160px;
}

/* ナビのリンク */
li.nav-items__item a {
  width: 100%;
  display: block;
  text-align: center;
  font-size: 20px;
  margin-bottom: 24px;
color: #fff;
}

li.nav-items__item:last-child a{
  margin-bottom: 0;
}

.border{
	width: 100%;
	border-bottom: 1px solid #fff;
	margin-top: 1rem;
}

p.tel{
	border-radius: 8px;
	background-color: #fff;
	padding: 0.5rem 1rem;
	font-size: 0.9rem;
	margin-top: 1rem;
	text-align: center;
	font-weight: bold;
}

p.tel span{
	font-weight: normal;
}



/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    TABLET

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */



@media only screen and (min-width: 599px){
	
body{
	margin-bottom: 20%;
}

.header {
	height: auto;
	position: static;

/*  background-color: white;
  width: 100%;
  height: 70px;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 999;*/
}

.header__inner {
	flex-direction: column;
	justify-content: center;
	padding: 1rem 0 0 0;
/*	padding: 3vh 5%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: inherit;
	position: relative;*/
}
	
.header__title{
	width: 15%;
	max-width: 200px;
	height: auto;
	padding-bottom: 1rem;
}

	
.header__nav {
/*  position: absolute;
  transition: ease .4s; 
	height: 50vh;
	width: 200px;
	right: 5%;
	top: 5%;
	background-color: #140B00;
	transform: scale(0);
	border-radius: 8px;*/
	
	position: static;
    transform: initial;
    height: 70px;
    display: flex;
    justify-content: center;
    width: 100%;
	border-radius:0; 
	

	
}

.nav-items {
	width:100%;
/*  padding: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);*/
	display: flex;
	justify-content: center;
	align-items: center;
	position: inherit;
   top: 0;
   left: 0;
   transform: translate(0, 0);
}

/* ナビのリンク */
li.nav-items__item a {
	font-size: 1.2rem;
	margin-bottom: 0;
/*  width: 100%;
  display: block;
  text-align: center;
  font-size: 20px;
  margin-bottom: 24px;
color: #fff;*/
}
	
	li.nav-items__item a{
		margin: 0 2rem 0 0;
	}


	.hamburger {
		display: none;
	}

}










/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++

   PC

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */




@media only screen and (min-width: 960px){


body{
	margin-bottom: 200px;
}


}



/*** END ***/
