@charset "utf-8";
/*========= LoadingのためのCSS ===============*/

/* Loading背景画面設定　*/

#splash {
    /*fixedで全面に固定*/
    position: fixed;
    z-index: 999;
    width: 100%;
    height: 100%;
    background:#333;
    text-align:center;
    color:#fff;
}

/* Loadingバー中央配置　*/
#splash_text {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 999;
    width: 100%;
    transform: translate(-50%, -50%);
    color: #fff;
}

/* Loadingバー中央配置　*/
#splash_text2 {
    display: flex;
    position: absolute;
    top: 57%;
    left: 50%;
    z-index: 999;
    width: 100%;
    transform: translate(-50%, -50%);
    color: #fff;
}
.fade{
        align-items: center;
        margin-left:auto;
        margin-right:auto;
        width: 100%;
        flex: 1;
        animation: fadeIn 5.2s ease 0.3s 1 normal;
}
    @keyframes fadeIn { /*animation-nameで設定した値を書く*/
        0% {opacity: 0} /*アニメーション開始時は不透明度0%*/
        100% {opacity: 1} /*アニメーション終了時は不透明度100%*/
    }
    
.fade-header1 {
  font-size: 18px;
  font-family: 'MS P明朝', serif;
  margin-top:-20px;
  margin-left:auto;
  margin-right:auto;
  text-align: center;
}
.fade-header2 {
  font-size: 18px;
  font-family: 'MS P明朝', serif;
  margin-top:-20px;
  margin-left:auto;
  margin-right:auto;
  text-align: center;
}
.fade-header3 {
  margin-top:30px;
  font-size: 32px;
  font-family: 'MS P明朝', serif;
  margin-left:auto;
  margin-right:auto;
  text-align: center;
}

/*IE11対策用バーの線の高さ※対応しなければ削除してください*/
#splash_text svg{
    height: 2px;
}

/*========= レイアウトのためのCSS ===============*/


#container{
    width:100%;
    height: 100vh;
    background: #ccc;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}


a{
    color: #333;
}

a:hover{
     text-decoration: none;   
}