@charset "utf-8";
/* base
==================================*/
	h1,h2,h3,h4,h5,h6,p,pre,blockquote,ul,li,ol,dl,dd,tr {
		font-size: 14px;
	}
	.sp {
		display:none !important;
	}

  #AllBox{
    position: relative;
  }
  .logo_identity{
    position: absolute;
    top: 15px;
    left: 0;
    right: 0;
    z-index: 3;
    width: 98%;
    max-width: 1220px;
    margin: auto;
  }
  main{
    display: block;
  }


/* footer
==================================*/
	footer {
    background: #000;
		padding: 35px 0 45px;
	}
	footer .logo{
		width: 88px;
		margin: auto;
	}
	footer .pageTop{
		opacity: 0;
		position: fixed;
		right: 54px;
		bottom: 54px;
		z-index: 999;
    transition: .3s;
	}
	footer .pageTop a{
		display: block;
		background: #fff;
		width: 46px;
		height: 46px;
		transition: .3s;
	}
  footer .pageTop.active{
    opacity: 1;
  }
	footer .pageTop a::after{
		position: absolute;
    top: 20px;
    left: 18px;
    content: "";
    width: 10px;
    height: 10px;
    border-top: 1px solid #000;
    border-left: 1px solid #000;
    transform: rotate(45deg);
	}
	footer .pageTop a:hover{
		opacity: .7;
	}

/* btn
==================================*/
	p.btn{
  	position: relative;
    z-index: 1;
  	box-sizing: border-box;
  	width: 152px;
  	height: 30px;
  	margin: 38px auto 0;
  	padding: 0 10px 0 0;
  	border: 1px solid #ababab;
  	border-radius: 2px;
  	font-size: 11px;
  	line-height: 28px;
  	letter-spacing: 0.15em;
  	text-align: center;
  	transition: .5s ease;
  }
  p.btn:hover{
  	color: #000;
  }
  p.btn::before{
  	position: absolute;
	  top: 0;
	  right: 0;
	  bottom: 0;
	  left: 0;
	  z-index: -1;
	  content: '';
	  background: #fff;
	  transform-origin: left top;
	  transform: scale(0, 1);
	  transition: .3s ease;
  }
  p.btn:hover::before{
	  transform: scale(1, 1);
  }
  p.btn::after{
    position: absolute;
    top: 10px;
    right: 29px;
    content: "";
    width: 7px;
    height: 7px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: rotate(45deg);
    transition: .3s;
  }
  p.btn:hover::after{
  	right: 26px;
  	border-top: 1px solid #000;
    border-right: 1px solid #000;
  }

/* animation
==================================*/
  .c-anim-load{
  	opacity: 0;
  	transition: 3s;
  }
  .c-anim-load02,
  .c-anim-load03,
  .c-anim-load04,
  .c-anim-up-load,
  .c-anim-up,
  .c-anim-up02,
  .c-anim-up03,
  .c-anim-up04{
	  opacity: 0;
	  transform: translate(0, 50px);
	  transition: 1.5s ease;
	}
	.c-anim-show{
		opacity: 0;
		transition: 3s;
	}
	.c-anim-show.move{
		opacity: 1;
	}


	/*----top----*/
	.t-anim01{
		transition: 1s;
	}
  .t-anim01.move{
  	opacity: 0;
  }
  .cover01,.cover03{
  	transform-origin: right;
  	transition: .8s;
  }
  .cover01.move,
  .cover03.move{
  	transform: scale(0,1);
  }
  .cover02{
  	transform-origin: bottom;
  	transition: .3s;
  }
  .cover02.move{
  	transform: scale(1,0);
  }

  .historyList .text h3.move{
/*  	transform: translate(-20px,0);*/
  	transform: translate(0,0);
  }

  #last .ad img.show{
    transform: translate(0, -50px);
    opacity: 0;
    transition: 1s ease;
  }
  #last .ad img.concept{
    transform: translate(-40px, 0);
    opacity: 0;
    transition: 1s ease;
  }
  #last .ad img.models{
    transform: translate(1px,30px);
    opacity: 0;
    transition: 1s ease;
  }
  #last .ad img.show.move,
  #last .ad img.concept.move{
  	transform: translate(0, 0);
  	opacity: 1;
  }
  #last .ad img.models.move{
  	transform: translate(1px,-1px);
  	opacity: 1;
  }

  .t-anim-up01,
  .t-anim-up02,
  .t-anim-up03,
  .t-anim-up04{
  	opacity: 0;
	  transform: translate(0, 50px);
	  transition: 1.5s ease;
  }

  /*----history----*/
  .chronology .box_l .ad img{
    transform: translateX(-200px);
    transition: 1s;
  }
  .chronology .box_l .ad.move img{
    transform: translateX(0);
  }
  .chronology .box_r .ad img{
    transform: translateX(200px);
    transition: 1s;
  }
  .chronology .box_r .ad.move img{
    transform: translateX(0);
  }

  /*----concept----*/
  .concept .intro .ph .upper{
    transform: translate(0, -30px);
    opacity: 0;
    transition: 1.5s ease-out;
  }
  .concept .intro .ph .lower{
    transform: translate(0, 10px);
    opacity: 0;
    transition: 1.3s ease-out;
  }
  .concept .intro .text_wrap{
    transform: translate(0, 30px);
    opacity: 0;
    transition: 1s ease;
  }
  .concept .intro .ph .upper.move,
  .concept .intro .ph .lower.move,
  .concept .intro .text_wrap.move{
    transform: translate(0, 0);
	  opacity: 1;
  }

  .c-anim-prior{
    transform: translate(-50px, 0);
    opacity: 0;
    transition: 1s ease;
  }
  .c-anim-prior2{
    transform: translate(50px, 0);
    opacity: 0;
    transition: 1s ease;
  }
  .c-anim-later{
    transform: translate(30px, 0);
    opacity: 0;
    transition: 1s ease;
  }
  .c-anim-later2{
    transform: translate(-30px, 0);
    opacity: 0;
    transition: 1s ease;
  }



  /*----common move----*/
  .move{
	  transform: translate(0, 0);
	  opacity: 1;
	}