@charset "utf-8";

html,
body,
div,
p,
img,
ul,
li {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  font-family: "メイリオ", Meiryo, "Hiragino Kaku Gothic Pro", Osaka,
    "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  vertical-align: bottom;
  background-color: transparent;
  list-style: none;
}

html,
body {
  height: 100%;
}

body {
  line-height: 1.48;
  font-size: 14px;
  text-align: center;
  color: #444;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  text-decoration: underline;
  color: #aa203a;
}
/* header
----------------------------------------------------*/
header {
  background: #2e0400; /*ヘッダー背景色*/
  height: 40px;
  position: relative;
}
header h1 {
  text-align: center;
  color: #fff; /*ヘッダー文字色*/
  margin: 0px;
  font-size: 14px;
  line-height: 40px;
}

/* Fixed position */
#lptop-padding {
  padding-top: 40px;
}

#fixed-top {
  position: fixed;
  top: 0;
  width: 100%;
  height: 50px;
  z-index: 4;
}

/* wrapper
----------------------------------------------------*/
#wrapper {
  width: 100%;
  padding: 0 0;
  padding-bottom: 20px;
  text-align: center;
}

#content img {
  width: 100%;
  height: auto;
}

/* ---------------------- movie ---------------------- */
.movieBody {
  position: relative;
}

.movie {
  position: absolute;
  z-index: 1;
  width: 90%;
  left: 5%;
  bottom: 10%;
}

/* ---------------------- GIF animation ---------------------- */
.gifAnime {
  position: relative;
}

.gifAnime ul {
  width: 74%;
  position: absolute;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 82%;
  top: 12.5%;
  left: 13%;
}
.animeCover {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 101;
}

/* ---------------------- button ---------------------- */

.oneBtn {
  position: relative;
}

.onlybtn {
  position: absolute;
  left: 0;
  bottom: 2%;
  width: 100%;
  animation: fluffyY 1s infinite ease-out; /*ボタン動き*/
}

/*ボタンアニメーションキーフレーム*/
@keyframes fluffyY {
  0% {
    transform: translateY(6%);
  }
  50% {
    transform: translateY(-6%);
  }
  100% {
    transform: translateY(6%);
  }
}

/* ------------------------ offer contents ------------------------ */

.rantruth_cv_sp {
  position: relative;
}

.cvbtn {
  position: absolute;
  right: 8%;
  bottom: 5%;
  width: 48%;
  animation: animScale 2s infinite ease-out; /*ボタン動き*/
}

/*ボタンアニメーションキーフレーム*/
@keyframes animScale {
  0% {
    transform: scale(0.9, 0.9);
  } /*(Xよこ,Yたて)サイズは%で表示*/
  25% {
    transform: scale(1, 1);
  }
  50% {
    transform: scale(0.9, 0.9);
  }
  75% {
    transform: scale(1, 1);
  }
  100% {
    transform: scale(0.9, 0.9);
  }
}