@charset "utf-8";

body{
  /*font-family: 'Oswald', sans-serif;*/
  text-transform: uppercase;
  letter-spacing: 0.1em;
	font-size:1rem;
	line-height:1.85;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-text-size-adjust: 100%;
	word-wrap: break-word;
}
a{text-decoration: none;outline: none;}

/*===========================================================*/
/*タイトルのサイズ・位置・色*/
h2{font-family: 'Oswald', sans-serif;text-align: center;
	line-height: 1.22; letter-spacing: 0.1em;margin: 10px 0 0;
	font-size:30px;/*文字のサイズ*/
  color: #fff;/*文字の色 元#fff*/}
/*タイトルアニメーション_バック*/
#splash {
	position: fixed;
	width: 100%;height: 100%;z-index: 9999;
	background:darkgreen;/*バックの色*/
	text-align:center;/*文字の位置*/}
#splash_logo {
	position: absolute;
	top: 40%;
	left: 50%;
	transform: translate(-50%, -50%);}
#splash_logo svg{width:250px;}/*文字の配置*/
.glowAnime span{opacity: 0;}
.glowAnime.glow span{ animation:glow_anime_on 1s ease-out forwards; }
@keyframes glow_anime_on{
	0% { opacity:0; text-shadow: 0 0 0 #fff,0 0 0 #fff;}
	50% { opacity:1;text-shadow: 0 0 10px #fff,0 0 15px #fff; }
	100% { opacity:1; text-shadow: 0 0 0 #fff,0 0 0 tan;}
}

a{font-size: 15px;}
img{width: 200px;}
section{text-align: center;position: absolute;
    top:50%;left:50%;width: 700px;
    transform: translate(-50%,-50%);}

/*ボタン   "IN"*/
.in{margin-top: 30px;}
a{text-decoration: none;outline: none;}
a{font-family: 'Oswald', sans-serif;font-size: 20px;}
.btnripple2  /*波紋の形状*/
 {position: relative;display:inline-block;
	background:darkred;/*"IN"のバック*/
	width:40px;height:40px;border-radius: 50%;
	color:tan;/*"IN"の色*/
  outline: none;
  transition: all .3s;}
/*hover*/
.btnripple2:hover{background:tan;color:tan;}
/*波形を2つ設定*/
.btnripple2::after,
.btnripple2::before
   {content: '';
    position: absolute;left: -25%;top: -25%;
    /*波形の形状*/
    border: 1px solid tan;/*"波形"の線の色*/
    width: 150%;height: 150%;
    border-radius: 50%;opacity: 1;
    animation:1s circleanime linear infinite;}
.btnripple2::before {animation-delay:.5s;}
/*波形のアニメーション*/
@keyframes circleanime{
	0%{
	  transform: scale(0.68);
	}
	100%{
		transform: scale(1.2);
		opacity: 0;
	}
}
/*===========================================================*/
/*レスポンシブ*/
/*===========================================================*/
@media screen and (max-width:700px)
{
}

@media screen and (max-width:400px)
{
/*タイトルのサイズ・位置・色*/
h2{line-height: 1.22; letter-spacing: 0.1em;margin: 70px 0 0;
font-size:22px;/*文字のサイズ*/}
a{font-size: 15px;}
section{top:70%;left:50%;width: 360px;
        transform: translate(-50%,-50%);}
img{width: 130px;}

/*ボタン*/
.in{margin-top: 30px;margin-bottom: 20px;}
a{font-size: 20px;}
.btnripple2{width:40px;height:40px;}
}

@media screen and (max-width:321px)
{
  /*タイトルのサイズ・位置・色*/
  h2{line-height: 1.22; letter-spacing: 0.1em;margin: 5px 0 0;
  font-size:20px;/*文字のサイズ*/}
  a{font-size: 15px;}
  section{top:50%;left:50%;width: 360px;
          transform: translate(-50%,-50%);}
  img{width: 70px;}
  /*ボタン*/
	.in{margin-top: 15px;margin-bottom: 20px;}
	a{font-size: 20px;}
	.btnripple2{width:40px;height:40px;}
}
