@charset "UTF-8";
/* CSS Document */

/* ローディングアニメーション */
#loading {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	z-index: 99999;
	background: #222222;
	text-align: center;
  }

  /* スライダー画像 */
  .slider .image{
	z-index: -1;/*重ね順*/
	top: 0;
	left: 0;
	width: 100%;/* 横幅いっぱい */
	height: 100vh;/* 縦幅いっぱい */
	opacity: 0;
	position: fixed;/* 擬似要素固定 */
  }
  
  /*スライド1枚目*/
  .slider .image:nth-of-type(1){
  }
  /*背景画像サイズ対応*/
  .slider .image:nth-of-type(1)::before {
	background-size: cover;/* cover指定 */
	content: "";/* 画像を表示させる為に必要*/
	display: block;/*ブロックボックスで表示*/
	position: fixed;/* 擬似要素全体を固定 */

	top: 0;/* 上からの配置を0 */
	left: 0;/* 左からの配置を0 */
	z-index: -1;/*背景画像になるように重ね順を-1*/
  }
  
  /*スライド2枚目*/
  .slider .image:nth-of-type(2){
  }
 /*背景画像サイズ対応*/
 .slider .image:nth-of-type(2)::before {
	background-size: cover;/* cover指定 */
	content: "";/* 画像を表示させる為に必要*/
	display: block;/*ブロックボックスで表示*/
	position: fixed;/* 擬似要素全体を固定 */
	width: 100%;/* 横幅を画面全体 */
	height: 100vh;/* 縦幅を画面全体 */
	top: 0;/* 上からの配置を0 */
	left: 0;/* 左からの配置を0 */
	z-index: -1;/*背景画像になるように重ね順を-1*/
  }

    /*スライド3枚目*/
  .slider .image:nth-of-type(3){
  }
   /*背景画像サイズ対応*/
   .slider .image:nth-of-type(3)::before {
	background-size: cover;/* cover指定 */
	content: "";/* 画像を表示させる為に必要*/
	display: block;/*ブロックボックスで表示*/
	position: fixed;/* 擬似要素全体を固定 */
	width: 100%;/* 横幅を画面全体 */
	height: 100vh;/* 縦幅を画面全体 */
	top: 0;/* 上からの配置を0 */
	left: 0;/* 左からの配置を0 */
	z-index: -1;/*背景画像になるように重ね順を-1*/
  }
  
  /*
	�Aアニメーション設定
	animation-durationのみ変更
  */
  .slider .image{
	animation-name: slide1;
	animation-delay: 0;
	animation-iteration-count: infinite;
	animation-duration: 15s;  /* �@で設定したanimation-delayを合計を挿入 */
  }
  .slider .image{
	animation-name: slide2;
	animation-delay: 0;
	animation-iteration-count: infinite;
	animation-duration: 15s;  /* �@で設定したanimation-delayを合計を挿入 */
  }
  .slider .image{
	animation-name: slide3;
	animation-delay: 0;
	animation-iteration-count: infinite;
	animation-duration: 15s;  /* �@で設定したanimation-delayを合計を挿入 */
  }
  /* アニメーション定義 */
/*１枚目*/
@keyframes slide1{
	0% {opacity: 0;}
	10% {opacity: 1;}
	50% {opacity: 1;}
	60% {opacity: 0;}
	100% {opacity: 0;transform: scale(1.15);}
}
@keyframes slide2{
	0% {opacity: 0;}
	10% {opacity: 1;}
	50% {opacity: 1;}
	60% {opacity: 0;}
	100% {opacity: 0;transform: scale(1.15);}
}
@keyframes slide3{
	0% {opacity: 0;}
	10% {opacity: 1;}
	50% {opacity: 1;}
	60% {opacity: 0;}
	100% {opacity: 0;transform: scale(1.15);}
}