@charset "UTF-8";
@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/NotoSansJP-Regular.woff2") format("woff2");
  font-display: swap;
}
@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 　500;
  src: url("../fonts/NotoSansJP-Medium.woff2") format("woff2");
  font-display: swap;
}
@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/NotoSansJP-Bold.woff2") format("woff2");
  font-display: swap;
}
body {
  background-image: url(../images/gahaha_patern.png);
  background-size: 240;
}
@media (max-width: 750px) {
  body {
    background-size: 32vw;
  }
}

/********************************************
/* common
********************************************/
/********************************************
/* Wrap
********************************************/
.main_content {
  display: none;
  width: 650px;
  margin: 50px auto;
  padding: 15px;
  background-image: url(../images/bg_washi.jpg);
}
@media (max-width: 750px) {
  .main_content {
    width: 86.6666666667vw;
    margin: 3.3333333333vw auto;
    padding: 2vw;
    border-radius: 1.3333333333vw;
  }
}

.nawa_wrap {
  background-size: 10px auto;
  padding: 10px;
  background-image: url(../images/bg_nawa.png);
}
@media (max-width: 750px) {
  .nawa_wrap {
    background-size: 1.3333333333vw auto;
    padding: 1.3333333333vw;
  }
}

.main_content_inner {
  position: relative;
  background-image: url(../images/bg_washi.jpg);
  padding: 30px;
}
@media (max-width: 750px) {
  .main_content_inner {
    padding: 4vw;
  }
}

/********************************************
* header_title_wrap
********************************************/
.header_title_wrap {
  position: relative;
  margin-bottom: 100px;
}
@media (max-width: 750px) {
  .header_title_wrap {
    margin-bottom: 13.3333333333vw;
  }
}
.header_title_wrap .header_title img {
  border-radius: 10px;
}
@media (max-width: 750px) {
  .header_title_wrap .header_title img {
    border-radius: 1.3333333333vw;
  }
}
.header_title_wrap .chara {
  position: absolute;
  top: 160px;
  left: -150px;
  -webkit-animation: chara 4.9s infinite;
          animation: chara 4.9s infinite;
}
@media (max-width: 750px) {
  .header_title_wrap .chara {
    top: 21.3333333333vw;
    left: -20vw;
  }
}
.header_title_wrap .chara img {
  width: 400px;
  height: auto;
}
@media (max-width: 750px) {
  .header_title_wrap .chara img {
    width: 53.3333333333vw;
  }
}
.header_title_wrap .usagi_fukidashi {
  position: absolute;
  top: -5px;
  left: -90px;
  -webkit-transform-origin: bottom right;
          transform-origin: bottom right;
  -webkit-animation: puyon 4.9s linear -0.4s infinite;
          animation: puyon 4.9s linear -0.4s infinite;
}
@media (max-width: 750px) {
  .header_title_wrap .usagi_fukidashi {
    top: -0.6666666667vw;
    left: -12vw;
  }
}
.header_title_wrap .usagi_fukidashi img {
  width: 280px;
  height: auto;
}
@media (max-width: 750px) {
  .header_title_wrap .usagi_fukidashi img {
    width: 37.3333333333vw;
  }
}

@-webkit-keyframes chara {
  0% {
    -webkit-transform: rotate(0) scale(1, 1) translate(0%, 0%);
            transform: rotate(0) scale(1, 1) translate(0%, 0%);
  }
  15% {
    -webkit-transform: rotate(2deg) scale(1, 1) translate(3%, 3%);
            transform: rotate(2deg) scale(1, 1) translate(3%, 3%);
  }
  20% {
    -webkit-transform: rotate(2deg) scale(1, 1) translate(3%, 0%);
            transform: rotate(2deg) scale(1, 1) translate(3%, 0%);
  }
  30% {
    -webkit-transform: rotate(4deg) scale(1, 1) translate(6%, 3%);
            transform: rotate(4deg) scale(1, 1) translate(6%, 3%);
  }
  35% {
    -webkit-transform: rotate(4deg) scale(1, 1) translate(6%, 0%);
            transform: rotate(4deg) scale(1, 1) translate(6%, 0%);
  }
  45% {
    -webkit-transform: rotate(6deg) scale(1, 1) translate(9%, 3%);
            transform: rotate(6deg) scale(1, 1) translate(9%, 3%);
  }
  50% {
    -webkit-transform: rotate(6deg) scale(1, 1) translate(9%, 0%);
            transform: rotate(6deg) scale(1, 1) translate(9%, 0%);
  }
  60% {
    -webkit-transform: rotate(8deg) scale(1, 1) translate(12%, 3%);
            transform: rotate(8deg) scale(1, 1) translate(12%, 3%);
  }
  63.3% {
    -webkit-transform: rotate(8deg) scale(1.1, 0.9) translate(12%, 5%);
            transform: rotate(8deg) scale(1.1, 0.9) translate(12%, 5%);
  }
  69.9% {
    -webkit-transform: rotate(8deg) scale(1, 1) translate(12%, 0%);
            transform: rotate(8deg) scale(1, 1) translate(12%, 0%);
  }
  79.9% {
    -webkit-transform: rotate(8deg) scale(0.95, 1.2) translate(12%, -20%);
            transform: rotate(8deg) scale(0.95, 1.2) translate(12%, -20%);
  }
  83.2% {
    -webkit-transform: rotate(0) scale(1.1, 0.9) translate(0%, 10%);
            transform: rotate(0) scale(1.1, 0.9) translate(0%, 10%);
  }
  86.6% {
    -webkit-transform: scale(0.95, 1.05) translate(0%, -3%);
            transform: scale(0.95, 1.05) translate(0%, -3%);
  }
  89.9% {
    -webkit-transform: scale(1.05, 0.95) translate(0%, 3%);
            transform: scale(1.05, 0.95) translate(0%, 3%);
  }
  93.2% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  100% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
}

@keyframes chara {
  0% {
    -webkit-transform: rotate(0) scale(1, 1) translate(0%, 0%);
            transform: rotate(0) scale(1, 1) translate(0%, 0%);
  }
  15% {
    -webkit-transform: rotate(2deg) scale(1, 1) translate(3%, 3%);
            transform: rotate(2deg) scale(1, 1) translate(3%, 3%);
  }
  20% {
    -webkit-transform: rotate(2deg) scale(1, 1) translate(3%, 0%);
            transform: rotate(2deg) scale(1, 1) translate(3%, 0%);
  }
  30% {
    -webkit-transform: rotate(4deg) scale(1, 1) translate(6%, 3%);
            transform: rotate(4deg) scale(1, 1) translate(6%, 3%);
  }
  35% {
    -webkit-transform: rotate(4deg) scale(1, 1) translate(6%, 0%);
            transform: rotate(4deg) scale(1, 1) translate(6%, 0%);
  }
  45% {
    -webkit-transform: rotate(6deg) scale(1, 1) translate(9%, 3%);
            transform: rotate(6deg) scale(1, 1) translate(9%, 3%);
  }
  50% {
    -webkit-transform: rotate(6deg) scale(1, 1) translate(9%, 0%);
            transform: rotate(6deg) scale(1, 1) translate(9%, 0%);
  }
  60% {
    -webkit-transform: rotate(8deg) scale(1, 1) translate(12%, 3%);
            transform: rotate(8deg) scale(1, 1) translate(12%, 3%);
  }
  63.3% {
    -webkit-transform: rotate(8deg) scale(1.1, 0.9) translate(12%, 5%);
            transform: rotate(8deg) scale(1.1, 0.9) translate(12%, 5%);
  }
  69.9% {
    -webkit-transform: rotate(8deg) scale(1, 1) translate(12%, 0%);
            transform: rotate(8deg) scale(1, 1) translate(12%, 0%);
  }
  79.9% {
    -webkit-transform: rotate(8deg) scale(0.95, 1.2) translate(12%, -20%);
            transform: rotate(8deg) scale(0.95, 1.2) translate(12%, -20%);
  }
  83.2% {
    -webkit-transform: rotate(0) scale(1.1, 0.9) translate(0%, 10%);
            transform: rotate(0) scale(1.1, 0.9) translate(0%, 10%);
  }
  86.6% {
    -webkit-transform: scale(0.95, 1.05) translate(0%, -3%);
            transform: scale(0.95, 1.05) translate(0%, -3%);
  }
  89.9% {
    -webkit-transform: scale(1.05, 0.95) translate(0%, 3%);
            transform: scale(1.05, 0.95) translate(0%, 3%);
  }
  93.2% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  100% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
}
/********************************************
* animation
********************************************/
@-webkit-keyframes fuwa {
  0% {
    -webkit-transform: translateY(0) rotate(5deg);
            transform: translateY(0) rotate(5deg);
  }
  50% {
    -webkit-transform: translateY(20px) rotate(-5deg);
            transform: translateY(20px) rotate(-5deg);
  }
  100% {
    -webkit-transform: translateY(0) rotate(5deg);
            transform: translateY(0) rotate(5deg);
  }
}
@keyframes fuwa {
  0% {
    -webkit-transform: translateY(0) rotate(5deg);
            transform: translateY(0) rotate(5deg);
  }
  50% {
    -webkit-transform: translateY(20px) rotate(-5deg);
            transform: translateY(20px) rotate(-5deg);
  }
  100% {
    -webkit-transform: translateY(0) rotate(5deg);
            transform: translateY(0) rotate(5deg);
  }
}
@-webkit-keyframes swing {
  0% {
    -webkit-transform: rotate(35deg);
            transform: rotate(35deg);
  }
  50% {
    -webkit-transform: rotate(15deg);
            transform: rotate(15deg);
  }
  100% {
    -webkit-transform: rotate(35deg);
            transform: rotate(35deg);
  }
}
@keyframes swing {
  0% {
    -webkit-transform: rotate(35deg);
            transform: rotate(35deg);
  }
  50% {
    -webkit-transform: rotate(15deg);
            transform: rotate(15deg);
  }
  100% {
    -webkit-transform: rotate(35deg);
            transform: rotate(35deg);
  }
}
@-webkit-keyframes puyon {
  0% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  8% {
    -webkit-transform: scale(0.95, 1.2) translate(0%, -10%);
            transform: scale(0.95, 1.2) translate(0%, -10%);
  }
  10% {
    -webkit-transform: scale(1.1, 0.9) translate(0%, 5%);
            transform: scale(1.1, 0.9) translate(0%, 5%);
  }
  12% {
    -webkit-transform: scale(0.95, 1.05) translate(0%, -3%);
            transform: scale(0.95, 1.05) translate(0%, -3%);
  }
  14% {
    -webkit-transform: scale(1.05, 0.95) translate(0%, 3%);
            transform: scale(1.05, 0.95) translate(0%, 3%);
  }
  16% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  20% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
}
@keyframes puyon {
  0% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  8% {
    -webkit-transform: scale(0.95, 1.2) translate(0%, -10%);
            transform: scale(0.95, 1.2) translate(0%, -10%);
  }
  10% {
    -webkit-transform: scale(1.1, 0.9) translate(0%, 5%);
            transform: scale(1.1, 0.9) translate(0%, 5%);
  }
  12% {
    -webkit-transform: scale(0.95, 1.05) translate(0%, -3%);
            transform: scale(0.95, 1.05) translate(0%, -3%);
  }
  14% {
    -webkit-transform: scale(1.05, 0.95) translate(0%, 3%);
            transform: scale(1.05, 0.95) translate(0%, 3%);
  }
  16% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  20% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
}
@-webkit-keyframes btn_puyon {
  0% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  12% {
    -webkit-transform: scale(0.95, 1.2) translate(0%, -10%);
            transform: scale(0.95, 1.2) translate(0%, -10%);
  }
  16% {
    -webkit-transform: scale(1.1, 0.9) translate(0%, 5%);
            transform: scale(1.1, 0.9) translate(0%, 5%);
  }
  20% {
    -webkit-transform: scale(0.95, 1.05) translate(0%, -3%);
            transform: scale(0.95, 1.05) translate(0%, -3%);
  }
  24% {
    -webkit-transform: scale(1.05, 0.95) translate(0%, 3%);
            transform: scale(1.05, 0.95) translate(0%, 3%);
  }
  28% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  36% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
}
@keyframes btn_puyon {
  0% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  12% {
    -webkit-transform: scale(0.95, 1.2) translate(0%, -10%);
            transform: scale(0.95, 1.2) translate(0%, -10%);
  }
  16% {
    -webkit-transform: scale(1.1, 0.9) translate(0%, 5%);
            transform: scale(1.1, 0.9) translate(0%, 5%);
  }
  20% {
    -webkit-transform: scale(0.95, 1.05) translate(0%, -3%);
            transform: scale(0.95, 1.05) translate(0%, -3%);
  }
  24% {
    -webkit-transform: scale(1.05, 0.95) translate(0%, 3%);
            transform: scale(1.05, 0.95) translate(0%, 3%);
  }
  28% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  36% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
}
/********************************************
* omikuji_main
********************************************/
#omikujiLoad,
#omikujiKekka,
#movieKekka,
#omikujiBtnRe {
  display: none;
}

.omikuji_main {
  position: relative;
  width: 540px;
  height: 540px;
  margin-bottom: 20px;
}
@media (max-width: 750px) {
  .omikuji_main {
    width: 72vw;
    height: 72vw;
    margin-bottom: 2.6666666667vw;
  }
}
.omikuji_main .omikuji_img {
  position: absolute;
}
.omikuji_main .omikuji_img img {
  width: 540px;
  height: 540px;
}
@media (max-width: 750px) {
  .omikuji_main .omikuji_img img {
    width: 72vw;
    height: 72vw;
  }
}
.omikuji_main .taiki_fukidashi {
  position: absolute;
  top: 60px;
  right: -50px;
  -webkit-animation: btn_puyon 2.5s linear 10s infinite;
          animation: btn_puyon 2.5s linear 10s infinite;
}
@media (max-width: 750px) {
  .omikuji_main .taiki_fukidashi {
    top: 8vw;
    right: -6.6666666667vw;
  }
}
.omikuji_main .taiki_fukidashi img {
  width: 240px;
  height: auto;
}
@media (max-width: 750px) {
  .omikuji_main .taiki_fukidashi img {
    width: 32vw;
  }
}

/********************************************
* movieKekka
********************************************/
#movieKekka {
  margin-bottom: 20px;
}
@media (max-width: 750px) {
  #movieKekka {
    margin-bottom: 2.6666666667vw;
  }
}
#movieKekka .iframe iframe {
  width: 540px;
  height: 315px;
}
@media (max-width: 750px) {
  #movieKekka .iframe iframe {
    width: 72vw;
    height: 42vw;
  }
}

/********************************************
/* btn
********************************************/
.action_btn {
  position: relative;
  width: 400px;
  height: 200px;
  margin: 0 auto;
  -webkit-animation: btn_puyon 2.5s linear 10s infinite;
          animation: btn_puyon 2.5s linear 10s infinite;
}
@media (max-width: 750px) {
  .action_btn {
    width: 53.3333333333vw;
    height: 26.6666666667vw;
  }
}

.btn {
  position: absolute;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 400px;
  height: 200px;
  padding: 50px;
  border-radius: 100px;
  border: 4px solid #000;
  background-color: #ffff00;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
@media (max-width: 750px) {
  .btn {
    width: 53.3333333333vw;
    height: 26.6666666667vw;
    padding: 6.6666666667vw;
    border: 0.5333333333vw solid #000;
    border-radius: 13.3333333333vw;
  }
}
.btn:hover {
  opacity: 0.7;
}

/********************************************
/* old_main
********************************************/
.old_main {
  width: 540px;
  margin: 0 auto;
  text-align: center;
}
@media (max-width: 750px) {
  .old_main {
    width: 72vw;
  }
}
.old_main .bar {
  margin: 80px 0 100px;
}
@media (max-width: 750px) {
  .old_main .bar {
    margin: 10.6666666667vw 0 13.3333333333vw;
  }
}
.old_main .title_h2 {
  font-size: 45px;
  font-weight: bold;
  line-height: 1;
  text-align: center;
  padding-bottom: 20px;
  border-bottom: 5px solid #b48c50;
  margin-bottom: 30px;
}
@media (max-width: 750px) {
  .old_main .title_h2 {
    font-size: 6vw;
    padding-bottom: 2.6666666667vw;
    border-bottom: 0.6666666667vw solid #b48c50;
    margin-bottom: 4vw;
  }
}

/********************************************
/* old_list
********************************************/
.old_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
@media (max-width: 750px) {
  .old_list {
    display: block;
  }
}
.old_list div {
  width: 265px;
  border: 1px solid #b48c50;
  margin-top: 15px;
}
.old_list div:nth-child(-n+2) {
  margin-top: 0;
}
@media (max-width: 750px) {
  .old_list div:nth-child(-n+2) {
    margin-top: 2.6666666667vw;
  }
}
@media (max-width: 750px) {
  .old_list div {
    width: 72vw;
    margin-top: 2.6666666667vw;
  }
}
@media (max-width: 750px) {
  .old_list div:first-child {
    margin-top: 0;
  }
}